/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

== Info Structure: =========================
* Nom du fichier: 		style.css
* Version: 				1.0.1 (09/04/2008)
* Auteur: 				Cédric BOISSEAU
* Société : 			Créamotion [ http://www.creamotion.com ]


== Info site: ==============================
* Site web: 			http://vos-poemes.com/
* Largeur de la page: 	990 px
* Nombre de colonnes: 	2
* Fluide[ ] | Fixe[x]


== Structure à respecter: ==================
* xxx-top
* xxx-middle
* xxx-bottom

* xxx-left
* xxx-center
* xxx-right

/!\ Sauf structure principale :
* header
* center(menu-gauche | content | menu droit)
* footer

== Outils utiles: ==========================
* http://lab.xms.pl/css-generator/ (générateur de CSS à partir d'un fichier XHTML)

== Parties: ================================
* Règles générales
* Connexion
* Fil d'Ariane
* Formulaires
* Pagination
* Tableaux
* Structure
* Boite type

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */


										  /*********************/
										 /* Règles générales **/
/*************************************************************/
*{
	margin:						0px;
	padding:					0px;
	/*behavior: 					url(iepngfix.htc);*/

}
img{
	border:						0px;
}
body{
	background-color:			#000;
	font-family: "Century Gothic";
	font-size:					12px;
}
.clear{
	clear:						both;
}
/* titres, paragraphes, liens, listes ordonnées & non ordonnées*/

p{
	color:						#fff;
	line-height:				20px;
	padding:					10px;
	text-align:					left;
}
#content .content-middle a, #content .content-middle-after a, #footer a, #breadcrumb a{
	color:						#819cbe;
	text-decoration:			none;
	border-bottom:1px dotted #fff;
}
#content .content-middle a:hover, #content .content-middle-after a:hover, #footer a:hover, #breadcrumb a:hover{
	color:						#fff;
	border-bottom:1px solid #fff;
	text-decoration:			none;
}
#content .liste-poemes ul li{
  width:33%;
  display:block;
  line-height: 36px;
  float:left;
  color:#fff;
  border-bottom:1px dotted #000;
  text-align: center;
}
a:active, a:focus{

	outline:none;

}
ul,ol{
	list-style-position: 		inside;
}
										  /**************/
										 /* Connexion **/
/******************************************************/
#connexion{
	height:						.px;
	left:						.px;
	position:					relative;
	top:						.px;
	width:						.px;
}
										  /*****************/
										 /* Fil d'Ariane **/
/*********************************************************/
.ariane{
	color:						#000;
}
.ariane strong {
	color:						#A90101;
}
.ariane span{
	color:						#999;
}
.ariane a{
	color:						#;
	text-decoration: 			underline;
}
.ariane a:hover{
	color:						#000;
	text-decoration: 			underline;
}
										  /****************/
										 /* Formulaires **/
/********************************************************/
/*input[type=checkbox]{}
input[type=radio]{}
input[type=submit]{
	cursor: 					pointer;
}
input[type=text]{
	width:						100px;
}
input[type=password]{
	width:						100px;
}
textarea{}*/
form{
padding:10px;
}
										  /***************/
										 /* Pagination **/
/*******************************************************/
.pagination{
    height:						30px;
    padding-bottom:				10px;
    float:						left;
    margin-right:				9px;
    padding-top:				5px;
    border-top:					1px dotted #ddd;
    width:						.px;
}
.pagination *{
	display:					block;
    padding:					3px;
    float:						left;
    font-size: 					14px;
    margin-left:				2px;
    text-decoration: 			none;
    font-weight: 				bold;
}
.pagination a{
	background-color: 			#ffffff;
    border:						#4976ad 1px solid;
    color:						#4976ad;
}
.pagination a:hover{
    background-color:			#4976ad;
    border:						#4976ad 1px solid;
	color:						#fff;
}
.pagination  span.selected {
    background-color: 			#4976ad;
	border:						#4976ad 1px solid;
    color:						#fff;
}
.pagination .etc{
    background-color: 			#ffffff;
	border:						#4976ad 1px solid;
    color:						#ccc;
    cursor:						default;
}
										  /*************/
										 /* Tableaux **/
/*****************************************************/
table{}
th{}
tr{}
td{}
										  /**************/
										 /* Structure **/
/******************************************************/
#main{
	margin:						0 auto;
	width:						990px;
}
	#header a{
	display:block;
	  	background-image:			url(_images/header.jpg);
  	background-repeat:			no-repeat;
  		height:					260px;
		width:					990px;
	}
	#center{
   		width:					990px;
	}
	#menu{
  		float:					left;
  	/*margin-left: 28px;*/
  		width:					185px;
  		
  	}
  #menu .menu-top h3{
  	background-image:			url(_images/menu-top.jpg);
  	background-repeat:			no-repeat;
  	color:						#fff;
  	font-size: 18px;
  	font-style: italic;
  	font-weight: normal;
  	height:						75px;
  	letter-spacing: 1px;
  	line-height:				75px;
  	text-align:					center;
  	width:						185px;
  }
  #menu .menu-middle{
  	text-align:					left;
  	width:						185px;
  }
  #menu .cloudtags{
	text-align:center;
	line-height: 16px;
  }
  #menu .cloudtags a{
	text-decoration: none;
	color:#7FB37A;
	padding:0 2px;
  }
  #menu .cloudtags a:hover{
	color:#fff;
}
  #menu .menu-middle ul {
        list-style-type: none;
        }
    #menu .menu-middle ul li a{    
          background-image:		url(_images/bg-menu-li.gif);
          background-position: left top;
          background-repeat:			no-repeat;
          color:#7fb37a;
          display:block;
  			  height:30px;
  			  line-height: 30px;
          text-decoration:none;
          width:145px;/*185-40*/
          padding-left:40px;
    		}
  	#menu .menu-middle ul li a:hover{
  	      background-position: left bottom;
          color:#fff;
    		}
 		#menu .menu-middle #abo-rss a {
      background-image:url(_images/abo-rss.gif);
      background-position:center top;
      background-repeat:no-repeat;
      display:block;
      height:40px;
      margin-bottom:5px;
      margin-left:auto;
      margin-right:auto;
      width:183px;
    }
    #menu .menu-middle #abo-mail a {
      background-image:url(_images/abo-mail.gif);
      background-position:center top;
      background-repeat:no-repeat;
      display:block;
      height:40px;
      margin-left:auto;
      margin-right:auto;
      width:183px;
    }
    #menu .menu-middle #abo-rss a:hover, #menu .menu-middle #abo-mail a:hover{
      background-position: bottom;
    }
  #menu .menu-bottom{
  	background-image:			url(_images/menu-bottom.jpg);
  	background-repeat:			no-repeat;
  	height:						26px;
  	margin-bottom:20px;
  	margin-top:10px;
  	width:						185px;
  }
  
  	#content{
      float:right;
  		/*margin-left:28px;*/
  			width:					722px;
  	}
      #content .content-top{
      	background-image:			url(_images/content-top.png);
      	background-repeat:			no-repeat;      	
      	width:						722px;
      }
      #content .blog .content-top{
		background-image:			url(_images/content-top-blog.png);
	  }
      #content .content-top-after{
      	background-image:			url(_images/content-top-after.png);
      	background-repeat:			no-repeat;      	
      	width:						722px;
      	height:87px;
      }
      #content .content-top h1, #content .content-top h2 a, .content-top-after h2,.content-top-after h1{
        font-size: 18px;
      	font-style: italic;
      	font-weight: normal;
      	color:						#fff;
      	text-decoration: none;
      	float:left;
      	line-height:				80px;
      	letter-spacing: 1px;
      	padding-left:10px;
      }
      #content .content-top h2 a:hover{
        color:#fff;
      }
      #content .content-top .date{
        color:#fff;
        font-weight: bold;
        text-align: center;
        width:50px;
        height:62px;/*87-25*/
        line-height: 12px;
        float:left;
        padding-top:25px;
        margin-left:10px;
      }
      #content .content-top .date span.jour,#content .content-top .date span.mois{
      font-size:8px;
      }
      #content .content-top .date span.annee{
      font-size:10px;
      }
      #content .content-middle{
      	background-image:			url(_images/content-middle.png);
      	background-repeat:			repeat-y;
      	text-align:					center;
      	width:						722px;
      }
      #content .blog .content-middle{
      	background-image:			url(_images/content-middle-blog.png);
      	}
      	#content .blog .content-middle p{
			color:#333;
			padding:20px;
			text-indent: 25px;
			font-size: 12px;
			line-height: 24px;
		}
		#content .blog .content-middle p img{
			padding:9px;
			background-color: #eee;
			border: 1px solid #ccc;
		}
      #content .content-middle-after{
      	background-image:			url(_images/content-middle-after.png);
      	background-repeat:			repeat-y;
      	width:						722px;
      }
      #content .content-middle-after h3{
        color:#fff;
        padding:0 0 0 20px;
      }
      #content .content-middle .content-middle-left{
        float:left;
        width:65%;
      }
      #content .content-middle .content-middle-right{
        float:left;
        width:35%;
      }
      #content .content-middle .content-middle-left p{
        letter-spacing: 1px;
        color:#c2d4eb;
        font-size: 12px;
        line-height: 24px;
        margin:0 10px;
      }
      #content .content-middle .content-middle-left p:first-letter{
        font-size: 30px;
        background-color: #314257;
        padding:2px;
        margin-right:2px;
        color:#fff;
        line-height: 24px;
        
      }
      #content .content-middle .content-middle-right p{
      color:#7e98b9;
      padding-right:20px;
      font-size:11px;
      padding-top:16px;
      line-height: 24px;
      }
      #content .content-middle .content-middle-right p strong{
       color:#cecece;
       font-weight: bold;
       font-size: 12px;
      }
      #content .content-middle .content-middle-right img{
        float:left;
        padding:2px;
        border: 1px solid #cecece;
        margin:0 10px 70px 0;
      }
      #content .content-bottom{
      	background-image:			url(_images/content-bottom.png);
      	background-repeat:			no-repeat;
      	height:						45px;
      	text-align:					center;
      	width:						722px;
      	margin-bottom:45px;
      }
      #content .content-bottom-blog{
      	background-image:			url(_images/content-bottom-blog.png);
      	background-repeat:			no-repeat;
      	height:						45px;
      	text-align:					center;
      	width:						722px;
      	margin-bottom:45px;
      }
      #content .content-bottom p, #content .content-bottom-blog p{
		position:relative;
		top:30px;
		text-align: right;
	}
	 #content .content-bottom-blog p a{
		color:#7FB37A;
	}
	#content .content-bottom p a{
		color:#819CBE;
		border-bottom: 1px dotted #FFFFFF;
		text-decoration: none;
	}
	#content .content-bottom p a:hover{
		border-bottom: 1px solid #FFFFFF;
		color:#FFFFFF;
	}
  #footer{
  	width:					990px;
  	text-align: 				left;
  	padding:0 0 20px 0;
  }
  #footer h2{
          font-size: 18px;
      	font-style: italic;
      	font-weight: normal;
      	color:						#fff;
      	text-decoration: none;
      	line-height:				80px;
      	letter-spacing: 1px;
      	text-align: center;
      	
  }
  #footer .footer-colonne{
     width:50%;
     float:left;
     text-align: left;
     color:#fff;
     margin-bottom:20px;
  }
  #footer .footer-colonne-top{
        background-image:			url(_images/footer-colonne-top.png);
      	background-repeat:			no-repeat;      	
      	width:						495px;
      	height:87px;
  }
  #footer .footer-colonne ul li{
  list-style-type: none;
  padding:0 20px;
  width:435px;
  }
  #footer .footer-colonne a{
    line-height: 30px;
    border-bottom:none;
    display:block;
    width:495px;
    background: url(_images/bg-footer-li.png) no-repeat top;
  }
  #footer .footer-colonne a:hover{
    background-position: bottom;
  }
  #footer .footer-categories ul{
	text-align: center;
	padding:10px 0 0 0;
}
  #footer .footer-categories ul li{
	display:inline;
}
.adsense-top{
	height:20px;
	position:fixed;
	top:0;
	width:100%;
	background-color: #111;
	color:#fff;
	border-bottom:1px solid #222;
}
.adsense-top-content{
	width:728px;
	margin:0 auto;
	padding-top:2px;
}
.adsense-article{
	width:200px;
	margin:0 auto;
	padding: 10px 0;
}
#breadcrumb{
	color:#999;
	border-bottom:1px solid #111;
	padding:0 5px;
	width:100%;
	text-align:left;
	height:30px;
	line-height:30px;
	overflow: hidden;
}
#breadcrumb span{
	display:block;
	float:right;
	height:30px;
	top:-30px;
	position:relative;
}
.hidden{
display:none;
}

.comm{
  width:676px;
  margin:0 auto;
}
.commentlist{
  list-style: none;
}
.comm-top{
  width:656px;/*676-20*/
  height:16px;
  line-height: 16px;
  padding:5px 0 5px 20px;
  font-size: 11px;
  color:#ccc;
  border-bottom:1px dotted #314257;
  background:#11171f url(_images/comment.png) no-repeat left center;
}
.comm-middle{
  width:670px;
  
}
.comm-middle p{
  color:#fff;
  font-size: 12px;
  line-height: 18px;
  padding:10px;
}
.comm-bottom{
  width:676px;
  height:14px;
}
/*comm pour l'admin*/
.comm-top-admin{
  width:656px;/*676-20*/
  height:16px;
  line-height: 16px;
  padding:5px 0 5px 20px;
  font-size: 11px;
  color:#ccc;
  border-bottom:1px dotted #314257;
  background:#11171f url(_images/admin-comment.png) no-repeat left center;
}

.comm-middle-admin{
  width:670px;
}
.comm-middle-admin p{
  color:#fff;
  font-size: 12px;
  line-height: 18px;
  padding:10px;
}
.comm-bottom-admin{
  width:676px;
  height:14px;
}
.navigation{
	color:#fff;
	background-color: #11171F;
	padding:5px 10px;
}
.navigation a{
	color:#819CBE;
}
.navigation a:hover{
	color:#fff;
}

.alignleft{
	float:left;
}
.alignright{
	float:right;
}