/*
Theme Name: HTML5Revolution
Theme URI: http://andre.3615toronto.ca/
Description: My own html5 theme.
Author: Andre Collin
Version: 1.0
*/

/*---------- COMMON STYLE -------------*/

body {
font-size: 12px; 
font-family: 'CustomBodyFont','Trebuchet MS', Helvetica, sans-serif;
background: #bfbfbf url(inc/img/background.jpg) center top no-repeat  ;
color: #444;
overflow-y:scroll;
line-height:1.5em;
}
.clear{ clear:both}
#wrapper1 {
width:900px;
margin:0 auto;
background: url(inc/img/andre_collin.png) left top no-repeat ;
min-height:700px;
}
#wrapper2 {
width:900px;
margin:0 auto;
background: url(inc/img/andre_collin2.png) left top no-repeat ;
min-height:700px;
}

#contenu h1 ,#contenu h2 ,#contenu h3 ,#contenu h4 , #navigation .title {
font-family:'MyCustomFont', 'Trebuchet MS', Helvetica, sans-serif ;
line-height: 100%;
text-rendering: optimizeLegibility;
}
p{ margin-bottom:20px;}




/* --------- HEADER ------- */
#header {position: relative; height:200px;
z-index:100}
#header #deco{ position:absolute; height:199px; width:653px; top:0; right:0;
background: url(inc/img/header_items.png) no-repeat
}
#header #logo{position:absolute; height:88px; width:285px; left:250px; top:20px}
#header #lang {position:absolute ;top:50px; right:15px;}


/* --------- COLONNES ------- */
#navigation {
float:left;
width:174px;
min-height:460px;
background:#bfbfbf;
border:3px solid #f3f1f1;
padding:0 10px;
margin:50px 5px 0 80px;
color:#000;
-moz-border-radius-topleft: 20px;
-moz-border-radius-bottomleft: 20px;
-webkit-border-top-left-radius: 20px;
-webkit-border-bottom-left-radius: 20px;
}
#contenu {
float:left;
width:525px;
min-height:500px;
background:#f3f1f1;
border:2px solid #bfbfbf;
padding:40px 35px;
margin-top:-39px;
-moz-border-radius-topright: 40px;
-moz-border-radius-bottomright: 40px;
-webkit-border-top-right-radius: 40px;
-webkit-border-bottom-right-radius: 40px;
}
/* -----  NAVIGATION -------- */
#navigation .title {
padding:20px 0 5px 0;
line-height: 100%;
text-rendering: optimizeLegibility;
font-size:20px;
text-shadow: 1px 1px  #fff;
color:#000;
}
#navigation a{ color: #444; font-size:14px; line-height:1.2em; text-decoration:none}
#navigation a:hover{ color:#000; } 
#navigation ul{padding-left:10px;}
#navigation li{padding-top:5px;;}


/* -----  CONTENU -------- */
#contenu h1 {font-size:37px; 
text-shadow: 3px 3px #bfbfbf;padding-bottom:17px;color:#000000}
#contenu h2 {font-size:32px;
text-shadow: 2px 2px  #bfbfbf;padding-bottom:12px;color:#000000}
#contenu h3 {font-size:27px;
text-shadow: 2px 2px  #bfbfbf;padding-bottom:10px;color:#000000}
#contenu h4 {font-size:25px;
text-shadow: 2px 2px  #bfbfbf;padding:15px 0 10px 0;color:#000000}
#contenu h1 a, #contenu h2 a, #contenu h3 a, #contenu h4 a {
	color:#000000; text-decoration:none;}
#contenu h1 a, #contenu h2 a, #contenu h3 a, #contenu h4 a {
	color:#000000; text-decoration:none;}

#contenu h2.titrecolonne {}

.article_contenu {line-height:2em}

#contenu ul {display:block;}
#contenu li {padding:0 0 10px 30px; background:url(inc/img/puce.png) top left no-repeat; }

#contenu a{ color:#000000; font-weight:bold; text-decoration:none}
#contenu a:hover { text-decoration:underline} 

.liste_articles {}
	.liste_articles h2, .liste_articles h4 { padding-top:10px;}
	.liste_articles .bloc {float:left; width:360px; padding: 0 0 20px 10px;}
	.liste_articles .image {
		float:left; margin-left:-120px;
		background:url(inc/img/date_sprite.png) ;
		background-repeat: no-repeat;
		background-position: 0 -500px;
		padding-left:20px;}
	/*.liste_articles .image {float:left; margin-right:10px; }*/
	.liste_articles img {
		border:2px solid #bfbfbf;}
.postmetadata {font-size:11px;}
a.comments-link{
	display:block;
	float:right;
	width:55px; height:40px; 
	background:url(inc/img/date_sprite.png);
	background-repeat: no-repeat;
	background-position: -100px -700px;
	color:#444; text-align:center; line-height:38px; font-size:8px;}
#contenu  .lien_image {
		background:url(inc/img/date_sprite.png) ;
		background-repeat: no-repeat;
		background-position: 0 -500px;
		padding-left:30px;}
#contenu  .lien_image img {
	margin: 0;
	max-width: 640px;
	border:2px solid #bfbfbf;
}
#contenu .alignleft,
#contenu img.alignleft {
	display: inline;
	float: left;
	margin-right: 15px;
	margin-bottom: 5px;
}
#contenu .alignright,
#contenu img.alignright {
	display: inline;
	float: right;
	margin-left: 15px;
	margin-top: 5px;
}
#contenu .aligncenter,
#contenu img.aligncenter {
	clear: both;
	display: block;
	margin : 0 auto;
}



/*  COMMENTAIRES  */

#comments {
 margin:30px 0 30px 50px;
}
#comments h2{
font-family:'MyCustomFont', 'Trebuchet MS', Helvetica, sans-serif ;
	color:#000;
	font-size:20px;
	font-weight:normal;
	padding-bottom:20px;
}
	li.comment {
		width:420px;
		margin-bottom:10px;
	}
		.odd {
			
		}
		.even {
			
		}
		.author-comment {
			
		}
		.commentMeta {
		float:left;
		padding: 10px;
		width:150px;
		border-right:2px solid #000;	
		background:url(/wp-content/themes/tcff/images/puce_comments.png) top right no-repeat;
		}
			.commentMeta a{display:block;
			}
			.commentMeta .author{
			font-weight:bold;
			font-size:1.2em;
			}
		.commentText {
		float:left;
		padding:10px;
		width: 200px;	
		}
			p.gravatar {
				
			}
	#trackbacks {
		
	}
		li.trackback {
			
		}
	p#no-comments {
		
	}
	#comments-form {
		
	}
	input.commentinput, textarea.textareainput{
		border:1px solid #371a02;
	}
	textarea.textareainput{
	width:420px;
		}
	input.commentsubmit{
		border:1px solid #371a02;
		background:#371a02;
		color:#FFFFFF;
		}
		#respond {
			
		}
		.cancel-comment-reply {
			
		}


/* -----  FOOTER -------- */
#wpml_credit_footer { display:none}



/* ------ AFFICHAGE DE LA DATE EN SPRITE  --------*/
.postdate {
  position: relative;
  width: 100px;
  height: 148px;
  float: left;
  background-image: url(inc/img/date_sprite.png);
}
.month, .day, .year {
  position: absolute;
  text-indent: -1000em;
  background-image: url(inc/img/date_sprite.png);
  background-repeat: no-repeat;
}
.day { top: 13px; left: 10px; width: 50px; height: 32px;}
.month { top: 48px; left: 10px ; width: 50px; height: 25px;}
.year { bottom: 80px; left: 60px; width: 25px; height: 50px;}

.d-01 { background-position: -50px -160px;}
.d-02 { background-position: -50px -200px;}
.d-03 { background-position: -50px -240px;}
.d-04 { background-position: -50px -280px;}
.d-05 { background-position: -50px -320px;}
.d-06 { background-position: -50px -360px;}
.d-07 { background-position: -50px -400px;}
.d-08 { background-position: -50px -440px;}
.d-09 { background-position: -50px -480px;}
.d-10 { background-position: -50px -520px;}
.d-11 { background-position: -50px -560px;}
.d-12 { background-position: -50px -600px;}
.d-13 { background-position: -50px -640px;}
.d-14 { background-position: -50px -680px;}
.d-15 { background-position: -50px -700px;}
.d-16 { background-position: -50px -760px;}
.d-17 { background-position: -100px -100px;}
.d-18 { background-position: -100px -140px;}
.d-19 { background-position: -100px -180px;}
.d-20 { background-position: -100px -220px;}
.d-21 { background-position: -100px -260px;}
.d-22 { background-position: -100px -300px;}
.d-23 { background-position: -100px -340px;}
.d-24 { background-position: -100px -380px;}
.d-25 { background-position: -100px -420px;}
.d-26 { background-position: -100px -460px;}
.d-27 { background-position: -100px -500px;}
.d-28 { background-position: -100px -540px;}
.d-29 { background-position: -100px -580px;}
.d-30 { background-position: -100px -620px;}
.d-31 { background-position: -100px -660px;}
.m-01 { background-position: 0 -160px}
.m-02 { background-position: 0 -185px}
.m-03 { background-position: 0 -210px}
.m-04 { background-position: 0 -235px}
.m-05 { background-position: 0 -260px}
.m-06 { background-position: 0 -285px}
.m-07 { background-position: 0 -310px}
.m-08 { background-position: 0 -335px}
.m-09 { background-position: 0 -350px}
.m-10 { background-position: 0 -385px}
.m-11 { background-position: 0 -410px}
.m-12 { background-position: 0 -435px}
.y-2010 { background-position: -150px 0;}
.y-2011 { background-position: -150px -150px;}
.y-2012 { background-position: -150px -250px;}
.y-2013 { background-position: -150px -350px;}