/* CSS Document */

/* CSS Document */

* { 
margin: 0;
padding: 0;
outline: none;
}

body {
font-family: Helvetica, Arial, sans-serif;
font-size: 16px;
line-height: 21px;
color: #eaeaea;
background-color: #000;
margin: 0;
background:url(img/bg_smileys.gif) repeat;
}

#page {
width: 960px;
margin: 0 auto;
padding: 40px 15px 20px 15px;
text-align: left;
background-color: #000000;
}


#page0 {
width: 960px;
text-align: left;
background-color: #000000;
position: absolute;
top: 50%;
left: 50%;
margin-left: -480px;
margin-top: -250px;
padding: 40px 15px 20px 15px;
}

#recent {
width: 605px;
float: right;
color: #0cf;
line-height: 28px;
font-size: 18px;
margin-top: 15px;
}

#recent a {
color: #666;
margin-right: 6px;
}

#recent a:hover  {
color: #ff0;
}

#header {
position: relative;
}

#search {
width: 605px;
position: absolute;
right: 0;
top: 0;
background-color: #3d3d3d;
padding: 11px 0 10px 15px; 
}

#search img {
width: 223px;
float: left;
padding-top: 1px;
}

#search form {
float: right;
width: 380px;
}
#happy_search, #sad_search {
margin-top: 5px;}

#happy_search img, #sad_search img {
margin: 0px 6px 0px 0;
vertical-align: middle;
}

#search form input.caixa {
width: 250px;
height: 30px;
font-size: 24px;
border: 2px solid #999;
padding: 6px 12px;
margin: 0 5px 0 10px;
}

#search form input.caixa:focus {
border-color: #FFFF00;
}

#search form input.boto {
width: 66px;
height: 46px;
font-size: 18px;
background: url(img/go.gif) no-repeat left top #0cf;
border: none;
cursor: pointer;
text-indent: -9999px;
color: transparent;
text-transform: capitalize;
}

#search form input.boto:hover {
background-position: left -48px;
}

#flash, #moods {
width: 930px;
margin: 20px auto;
padding-bottom: 40px;
}

#happy {
width: 400px;
float: left;
}

#sad {
width: 400px;
float: right;
}


#moods ul {
margin-top: 5px;
border-bottom: 1px dotted #999;
}

#moods li {
border-top: 1px dotted #999;
list-style-type: none;
padding: 8px 0;
}

#moods a, #moods a:visited {
color: #fff;
text-decoration: none;
border-bottom: 1px dotted #999;
}

#moods a:hover {
color: #f06;
text-decoration: none;
border-bottom: 1px dotted #f06;
}

#moods a.nom, #moods a.nom:visited {
color: #0cf;
font-weight: bold;
text-decoration: none;
border-bottom: none;
}

#moods a.nom:hover {
color: #f06;
border-bottom: none;
}

.smiley {
color: #FFFF00;
font-weight: bold;
}

.paraula {
color: #FFFF00;
font-weight: bold;
font-size: 18px;
text-transform: uppercase;
}

#moods span.paraula a {
color: #ff0;
text-decoration: none;
border-bottom: none;
}

#moods span.paraula a:hover {
color: #f06;
border-bottom: none;
}

.percentil {
color: #999;
font-weight: bold;
font-size: 18px;
padding-left: 15px;
}


#pimpampum {
background-color: #191919;
color: #999;
font-family: Helvetica, Arial, sans-serif;
font-size: 9px;
position: fixed;
bottom: 0;
width: 100%;
padding: 2px 0 3px 0;
text-align: right;
border-top: 1px dotted #333;
}

#pimpampum a, #pimpampum a:visited {
color: #f06;
}

#pimpampum a:hover {
color: #ff0;
}

#credits {
float: right;
margin-right: 25px;
}

#share {
float: right;
margin-right: 25px;
padding-top: 2px;
}

	
/*generiques*/

.esq {
float: left;}

.dre {
float: right;
}

.clear {
clear: both;
}

.clearfix:after {
content: "."; 
display: block; 
height: 0; 
clear: both; 
visibility: hidden;
}

.clearfix {
display: inline-block;
}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearboth {display: block;}
/* End hide from IE-mac */

/* links */

a {
color: #CCCCCC;
text-decoration: none;
}

a:visited {
color: #CCCCCC;
}

a:hover {
color: #FFFF00;
}

a:active {
color: #CCCCCC;
}

a:focus {
outline: none;
}