/*  
Theme Name: Utsuru 2009/2
Theme URI: http://www.florent-porta.fr/
Description: Theme Utsuru 2009/2
Version: 1.0
Author: Florent Porta
Author URI: http://www.florent-porta.fr/
*/


/*ATTENTION CE CSS EST UN VRAI BORDEL !*/


/*Body Movin Body Body Movin !*/
body {
font-family: Arial, sans-serif;
background: url(images/background.png) fixed repeat #171717;
color: #999999;
margin-top:15px;
font-size:12px;
}


/*Fromatage du conteneur*/
#page {text-align: left;width: 955px;margin:auto;}


/*Les liens ils sont beaux !*/
a{ color: #ffffff; text-decoration:none; }
a:hover { color: #ff004e;}
a:focus { outline: none; }
a img {	border: none;}


/*Les Titres ils sont beaux aussi !*/
h1 {margin:0; color:#000000; font-size:18px; font-weight:bold;} 
h2 {font-size:18px; font-weight:bold; margin:15px 0 0 0;}
h3 {font-size:16px; font-weight:100; margin:10px 0 0 0; padding:0; color:#ff004e; }
h4 {font-size:36px; font-weight:100; margin:0 0 10px 0; padding:0; color:#ff004e; }
h5 {font-size:12px; font-weight:100; margin:0; padding:0; color:#ff004e; display: inline;}





/*Tout commence par un Header non ?*/
#header {background: url(images/header.jpg) no-repeat; width:188px; height:46px; margin-left:260px; border-top: 1px solid #353535; border-left: 1px solid #353535; border-right: 1px solid #353535;}
#header ul{ padding: 0; margin: 0;}
#header li{list-style:none;}
#header li a{height: 46px; width: 188px; display:block;}

#pullme {width:92px; height:34px; float:right; margin:8px 415px 0 0;}
#pullme ul{ padding: 0; margin: 0;}
#pullme li{list-style:none;}
#pullme li a{background: url(images/pullme.png) right top no-repeat;  height: 34px; width: 92px; display:block;}
#pullme li a:hover{background-position: -25px 0; width: 115px;}

#postheader { width:435px; margin-left:255px; font-size:10px; color:#ffffff; padding:10px ; display:none; text-align:justify;}
#postheader #present {  margin:0 10px 0 0; width:200px; float:left;}
#postheader #present p{  height: 100px; border-bottom: 1px #888888 dotted;}
#postheader #rss { margin:0 10px 0 0; width:100px; float:left;}
#postheader #twitter {  width:100px; float:left;}
#postheader p{ margin:5px 0 5px 0; padding:0; height: 80px; overflow: hidden;}
#postheader h2 {font-size:12px; margin:0; padding:0; color:#ff004e; border-bottom: 1px #888888 dotted; }


/* Je crois que c'est le contenu de la page ça non ?*/
#content {margin:auto; width:417px; background: #2b2b2b; padding: 8px; border: 1px solid #353535;}


.red {color:#ff004e;}


/* FORMATAGE DE LA HOME */

/* Fromatage des articles de la Home*/
.entry{width:415px; height:100px; overflow:hidden; border: 1px solid #353535; }
.entry p {padding:0; margin:0; }


/*Le Début des articles avec l'image et le titre*/
.date-post {position:absolute; margin-top:6px; margin-left:6px; width:90px; height:12px; background-color: rgba(23,23,23,0.7); padding:1px 4px 4px 4px; font-size:12px; color:#999999; }
.user-post {position:absolute; margin-top:46px; margin-left:6px; height:12px; background-color: rgba(255,0,78,0.7); padding:1px 4px 4px 4px; font-size:12px; color:#171717; font-weight: bold; }
.com-post {position:absolute; margin-top:26px; margin-left:6px; height:12px; background-color: rgba(23,23,23,0.7); padding:1px 4px 4px 4px; font-size:12px; color:#999999; }
.com-post a {color:#999999; }
.titre-conteneur {position:absolute; margin-top:68px; margin-left:6px; width:402px; height:25px; overflow:hidden;}
.categorie-fond {position:absolute; margin-top:68px; margin-left:6px;  width:402px; height:25px; opacity:0.8;}
.titre-post {color:#171717; font-size:18px; font-weight:bold; padding:1px 0 0 5px;}
.plus {position:absolute; margin: 1px 0 0 1px; z-index: 200;}
.plus ul{ padding: 0; margin: 0;}
.plus li{list-style:none;}
.plus li a{height: 100px; width: 415px;display:block;}
.plus li a:hover{background:url(images/plus.png) no-repeat;}

/*Ca permet d'ajouter un petit espace entre les articles*/
.post-content {margin-bottom:20px;}


/* FORMATAGE D'UN SINGLE */

/*Fromatage d'un article sur la single*/
.entry-single {text-align:justify; list-style: none; line-height: 16px;}
.entry-single p {margin:0 0 10px 0;}
.entry-single img {b border: 1px solid #353535;}
.post-social {padding: 5px; background: #171717; margin-bottom: 10px;   border: 1px solid #353535; height: 17px;}
.social-left {float: left; text-align: left; }
.social-right {float: right; text-align: right;}
.guest-bio { font-style: italic;}
.guest-post {margin : 0; border: 1px solid #353535; padding: 10px; background: #171717;}
.guest-post p {margin : 6px 0 6px 0; color: #FFFFFF;}






/*FORMATAGE PREFOOTER*/
/*Prefooter*/
#prefooter {width:435px; margin-left:260px; font-size:9px; color:#888888; padding:10px ;}
#prefooter ul{ padding: 0; margin: 0;}
#prefooter li{list-style:none;}
#prefooter #links { margin-right:25px; width:120px; float:left;}
#prefooter p{ margin:5px 0 5px 0; padding:0;}
#prefooter h2 {font-size:12px; margin:0; padding:0; color:#ff004e; border-bottom: 1px #888888 dotted; }
#prefooter #search { margin-right:25px; width:120px; float:left;}
#prefooter #search input {width: 75px;	background:#2b2b2b;	border: none;	color:#ffffff;	margin-right: 5px;	padding-left: 5px;}	
#prefooter #search .submitbutton {width: 30px;	background:#2b2b2b;	border: none;	color:#fff;	margin: 0;}
#prefooter #archives { margin-right:25px; width:120px; float:left;}





/* FORMATAGE DU FOOTER */

/*Le Fouteur de Gueule*/
#footer {text-align:center; width:435px; margin:20px 0 20px 260px; color:#888888;}
#footer .geek {font-size:20px;}
#footer a {color:#888888;}



/* LES MENUS*/

/*Truc en commun pour les boutons*/
.menu-bouton ul{ padding: 0; margin: 0;}
.menu-bouton li{list-style:none;}
.menu-bouton li a{height: 50px; width: 50px; display:block;}

/*les boutons hypes*/
#bouton-rss {background:url(images/rss-bt.png) left no-repeat #2b2b2b; position:absolute; width:50px; height:50px; margin:63px 0 0 705px; font-size:50px; text-align:center; line-height:50px; border: 1px solid #353535;}
#bouton-rss li a:hover {background:url(images/rss-bt.png) right no-repeat #2b2b2b;}
#bouton-twitter {background:url(images/twitter-bt.png) left no-repeat #2b2b2b; position:absolute; width:50px; height:50px; margin:126px 0 0 705px; font-size:50px; text-align:center; line-height:50px; border: 1px solid #353535;}
#bouton-twitter li a:hover {background:url(images/twitter-bt.png) right no-repeat #2b2b2b;}


/*Menu Droit*/
#menu-droite {position:absolute; width:250px; height:380px; background:#2b2b2b; margin-left:705px; display:none; border: 1px solid #353535;}
#menu-droite-bouton {position:absolute; width:50px; height:50px; background:#2b2b2b; margin-left:705px; font-size:50px; text-align:center; line-height:50px; border: 1px solid #353535;}
#menu-droite-bouton-exit {position:absolute; width:50px; height:50px; background:#2b2b2b;font-size:50px; text-align:center; display:inline; line-height:41px;}
.menu-droite-contenu {padding:10px; text-align:justify;}
.align-droite {text-align:right;}
#menu-droite-categories {margin-left:2px;}
#menu-droite-categories ul{padding: 0; margin: 0;}
#menu-droite-categories li{list-style:none;}
#menu-droite-categories a {font-size:18px; font-weight:bold; padding:4px;}
#menu-droite-categories a:hover {color:#000000;}
.menu-droite-cat1 li a{background:url(images/categories.jpg) 0 0 no-repeat; height: 16px; width: 218px;display:block; margin-top:10px; line-height:16px;}
.menu-droite-cat2 li a{background:url(images/categories.jpg) 0 -25px no-repeat; height: 16px; width: 218px;display:block; margin-top:10px; line-height:16px;}
.menu-droite-cat3 li a{background:url(images/categories.jpg) 0 -50px no-repeat; height: 16px; width: 218px;display:block; margin-top:10px; line-height:16px;}
.menu-droite-cat4 li a{background:url(images/categories.jpg) 0 -75px no-repeat; height: 16px; width: 218px;display:block; margin-top:10px; line-height:16px;}
.menu-droite-cat5 li a{background:url(images/categories.jpg) 0 -100px no-repeat; height: 16px; width: 218px;display:block; margin-top:10px; line-height:16px;}
.menu-droite-cat6 li a{background:url(images/categories.jpg) 0 -125px no-repeat; height: 16px; width: 218px;display:block; margin-top:10px; line-height:16px;}
.menu-droite-cat7 li a{background:url(images/categories.jpg) 0 -150px no-repeat; height: 16px; width: 218px;display:block; margin-top:10px; line-height:16px;}
.menu-droite-cat8 li a{background:url(images/categories.jpg) 0 -175px no-repeat; height: 16px; width: 218px;display:block; margin-top:10px; line-height:16px;}


/*Menu Gauche*/
#menu-gauche {position:absolute; width:250px; height:205px; background:#2b2b2b; display:none; border: 1px solid #353535;}
#menu-gauche-bouton {position:absolute; width:50px; height:50px; background:#2b2b2b; margin-left:200px; font-size:50px; text-align:center; line-height:50px; border: 1px solid #353535;}
#menu-gauche-bouton-exit {float:right; width:50px; height:50px; background:#2b2b2b;font-size:50px;text-align:center; display:inline; line-height:41px;}
.menu-gauche-contenu {padding:10px; text-align:justify;}
#menu-bt {position:absolute;}
#menu-bt ul{ padding: 0; margin: 0;}
#menu-bt li{list-style:none;}
.menu-accueil li a{background:url(images/menu-bt.png) 0 0 no-repeat; height: 40px; width: 210px;display:block; margin-top:10px;}
.menu-accueil li a:hover{background-position:0 -142px;}
.menu-about li a{background:url(images/menu-bt.png) 0 -49px no-repeat; height: 50px; width: 225px;display:block; margin-top:10px;}
.menu-about li a:hover{background-position:0 -191px;}
.menu-contact li a{background:url(images/menu-bt.png) 0 -105px no-repeat; height: 37px; width: 210px;display:block; margin-top:5px;}
.menu-contact li a:hover{background-position:0 -247px;}




/* Fromatage des Commentaires*/
.gravatar {float:left; width:48px; height:48px; margin:0 10px 5px 0; padding:0px; background:url(images/gravatar.jpg) no-repeat;}
.commentlist p{margin:5px 0 0 0; padding:0;}
.commentlist {padding: 0;text-align: justify;}
.commentlist .posteur {color:#ff004e; margin:0px; padding:0px; font-size:14px;}
.author-id-3 {background-color: #252525; }
.author-id-0 { background-color: #171717;}
.commentlist li {	margin: 0 0 20px 0;	padding: 10px;	list-style: none; min-height:48px;	width:395px; border: 1px solid #353535;}
.nocomments {text-align: center;	margin: 0;	padding: 0;	}
.commentmetadata {	margin: 0;	color:#666666;}
.commentmetadata a{color:#666666;}



/* Fromatage des Formulaires pour laisser des commentaires*/
select {width: 130px;}
#commentform input {width: 165px;	background:#171717;	border: none;	color:#ffffff;	margin-right: 5px;	padding-left:5px;  border: 1px solid #353535;}	
#commentform #submit {width: 70px;	background:#171717;	border: none;	color:#fff;	margin: 0;	float: right;	 border: 1px solid #353535;}
#commentform #submit:active {	width: 70px;	background:#2b2b2b;	border: 1px #171717 solid;	color:#fff;	}
#commentform textarea {	width: 405px;	height: 70px;	background:#171717;	border: none;	color:#fff; padding:5px;	 border: 1px solid #353535;}



/*Fromages d'hivers*/
#navigation {height:15px;}
.alignleft {float:left;}
.alignright {float:right;}


/*Des Divers et Des Varies*/
.clearer {clear:both;}	



/* Les Trucs de HACKER meme pas valide CSS2*/
::-moz-selection {background-color:#ff004e;	color:#2b2b2b;}


/*
- Bonjour je m'appele florent porta, j'ai 23 ans et je fait du CSS depuis 4 ans.
- Bonjour Florent !
*/