/*
Theme Name: ChristopherMatt_FR
Theme URL: http://www.christophermatt.fr/
Description: Thème utilisé pour mon blog/portfolio.
Version: 2.1
Author: Christopher Matt
*/



@font-face{
    font-family : "Lobster 1.4";
    src : url('Lobster 1.4.otf');
}

@font-face{
    font-family : "Comics";
    src : url('comics.ttf');
}

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	background: transparent; border: 0; margin: 0; padding: 0;}
	
body {line-height: 1;}
h1, h2, h3, h4, h5, h6 {clear: both;font-weight: normal;}
ol, ul {list-style: none;}
blockquote {quotes: none;}
blockquote:before, blockquote:after {content: '';content: none;}
del {text-decoration: line-through;}
/* tables still need 'cellspacing="0"' in the markup */
table {border-collapse: collapse;border-spacing: 0;}
a img {border: none;}
a{text-decoration : none;}
.clear{clear:both;}


/* Mise en page globale*/
body{background: #619bd8 url(images/bg2.jpg) center top fixed no-repeat; font-family: Helvetica, Arial;}
#wrap{width:960px; margin : 0 auto;}
#header{height:218px; background: url(images/header.png) top left no-repeat;}
	#header #lien_apropos{width:114px; height:41px; float:right; margin:15px 30px 0 0; background: url(images/lien_apropos.png) left top;}
	#header #lien_apropos:hover{background: url(images/lien_apropos.png) right top;}
	#header #lien_portfolio{width:114px; height:41px; float:right; margin:15px 10px 0 0; background: url(images/lien_portfolio.png) left top;}
	#header #lien_portfolio:hover{background: url(images/lien_portfolio.png) right top;}
	#header #lien_blog{width:114px; height:41px; float:right; margin-top:15px; background: url(images/lien_blog.png) left top;}
	#header #lien_blog:hover{background: url(images/lien_blog.png) right top;}
	#header #lien_rs{width:195px; height:44px; position:absolute; margin:170px 440px;}
		#header #lien_rs #lien_fb{width:65px; height:44px; float:left; background: url(images/lien_fb.png) no-repeat right top;}
		#header #lien_rs #lien_fb:hover{background-position: left top;}
		#header #lien_rs #lien_twitter{width:65px; height:44px; float:left; background: url(images/lien_twitter.png) no-repeat right top;}
		#header #lien_rs #lien_twitter:hover{background-position: left top;}
		#header #lien_rs #lien_rss{width:65px; height:44px; float:left; background: url(images/lien_rss.png) no-repeat right top;}
		#header #lien_rs #lien_rss:hover{background-position: left top;}
#bloc{width:679px; float:left;}
	#bloc_haut{height:104px; background: url(images/bloc_haut.png) no-repeat left top;}
	#bloc_milieu{background: url(images/bloc_milieu.png) left top; padding:40px; text-align:center;}
	#bloc_bas{height:21px; background: url(images/bloc_bas.png) no-repeat left top;}
#footer{height:103px; background: url(images/footer.png) top left no-repeat;}


#navlinks{width: 167px;height:149px; margin:0 249px; background:url(images/panneau.gif) no-repeat  center 5px;  padding-bottom:30px;}
	#navlinks #panneauprec{width:137px; height:54px; background:url(images/panneauprec.png) top left; position:absolute;}
	#navlinks #panneauprec:hover{background-position:top right;}
	#navlinks #panneausuiv{width:127px; height:37px; background:url(images/panneausuiv.png) top left; position:absolute; margin: 45px 20px;}
	#navlinks #panneausuiv:hover{background-position:top right;}

/* Sidebar */
#sidebar{width:263px; float:left;}

	#avatar{margin: 60px 0 0 40px;}
	
	#sidebar #recent-posts-3 ul{width:216px; padding: 50px 5px 0 25px; font-weight:bold;}
	#sidebar #recent-posts-3 li{padding-bottom:8px;}
	#sidebar #recent-posts-3 ul a{color:#fff; font-size:16px;}
	#sidebar #recent-posts-3 ul a:hover{text-decoration: underline;}

	#sidebar p{margin:50px 0 0 20px; color: #fff;}
	
	#sidebar #cats {margin-top:50px;}
	#sidebar #cats h2{margin: 5px 20px; font-size:35px;}
	#sidebar #cats a{color:#fff;}
	#sidebar #cats a h2:hover{text-decoration: underline;}
	
#sidebar #widgetliens{width:180px; text-align:center; margin: 50px 25px;}
	#sidebar #widgetliens img{margin:1px;}
	#sidebar #widgetliens img:hover{border: 1px solid #fff; margin:0;}
	#sidebar #widgetliens #titreliens:hover{margin-bottom:20px; border:none; border: none; opacity:1;}
	#sidebar #widgetliens #titreliens{margin-bottom:20px; border:none; border: none; opacity:1; margin-top:1px;}
	
/* Article */

h1 a{color:#c32f2f; text-transform:lowercase; font-family: "Comics"; font-size:28px;}
h1 a:hover{color:#de7453;}
.post-date{font-size:16px; font-style:italic; color:#aca9a9; margin-bottom:50px; } 

.comments{height: 25px; width:550px; margin: 30px 180px; padding-bottom:180px; line-height:33px; }
		.comments a{color:#fcb95a; font-weight:bold; font-size:19px; font-family:arial; float:left; margin:0 auto 0 auto;}
		.comments a:hover{color:#f58948;}
		.comments a span{color:#fff; float:left; width:30px; height:38px; margin-right:10px; text-align:center;
						background: url(images/bulle_comments.png) #fdb44c; font-size:20px;}	
						
.fbLikeContainer { margin-top:30px; margin-left:400px; opacity:0.5;}
.fbLikeContainer:hover{opacity:1;}
			
#nbcoms{height: 25px; width:550px; margin:30px 0 0 200px; padding:80px 0 30px 0; line-height:33px; }
		#nbcoms a{color:#fcb95a; font-weight:bold; font-size:19px; font-family:arial; float:left; margin:0 auto 0 auto;}
		#nbcoms  span{color:#fff; float:left; width:30px; height:38px; margin-right:10px; text-align:center;background: url(images/bulle_comments.png) #fdb44c; font-size:20px;}
			
	#module_coms{width:530px; margin-left:30px; padding: 30px 10px; text-align:left; text-indent:30px; color:#333;}
		#module_coms label{display:block;}
		#module_coms p{text-indent:15px;}
		#module_coms #commentlist .comment{background:#eee; margin-bottom:20px; padding: 10px 20px 20px 20px; border-radius:10px; border:1px solid #aaa;}
		#module_coms #commentlist .comment .info {margin-bottom:10px; color:#999;}
		#module_coms #commentlist .comment .info .auteur, #module_coms #commentlist .comment .info .auteur a {font-family: "Lobster 1.4" ; font-size:20px; color:#444;}
		#module_coms #commentlist .comment .info .espace{margin-left:15px;}
	
		#module_coms #nouveau_com{background: url(images/machinecoms.png); width:520px; height:344px; margin-bottom:50px; margin-top:100px;}
		#module_coms #nouveau_com #leds{background: url(images/leds.gif); width:57px; height:86px; position:absolute; margin:72px 288px;}
		#module_coms #nouveau_com input{background:#6c6a67; border:none; font-family:monospace; font-weight:bold; color:#15F955;}
		#module_coms #nouveau_com textarea{background:#6c6a67; border:none; font-family:monospace; font-weight:bold; color:#15F955;}
		#module_coms #nouveau_com #author{ margin-top:113px; margin-left:60px; width:110px;}
		#module_coms #nouveau_com #email{ margin-top:19px; margin-left:140px; width:100px;}
		#module_coms #nouveau_com #url{ margin-top:20px; margin-left:150px; width:100px;}
		#module_coms #nouveau_com #comment{ margin-top:43px; margin-left:55px; width:250px; height:70px; overflow:hidden;}
		#module_coms #nouveau_com #submit{background:url(images/envoyer.png) top left; width:75px; height:80px; position:absolute; margin:262px 370px; cursor:pointer;}
		#module_coms #nouveau_com #submit:hover{background-position: top right;}
		
	#liens_articles{ margin:50px;}
	#article_prec{float:left; background:#76CA65; color:#fff; font-weight:bold; padding:3px 8px; border-radius:5px; margin-bottom: 10px;}
		#article_prec a, #article_suiv a{color:#fff;}
		#article_prec a:hover, #article_suiv a:hover{color:#F7C434;}
	#article_suiv{float:right; background:#76CA65; color:#fff; font-weight:bold; padding:3px 8px; border-radius:5px;}
						
/* Pages */

#portfolio{width:700px; margin: 0 auto 100px auto; text-align:center;}
	#portfolio .ptitre{margin: 80px 0 50px 0;}
	#portfolio .min{width:110px; height:110px; background: url(images/portfolio_min.png) no-repeat left top; text-align:left; float:left; margin:10px;}
	#portfolio .min:hover{opacity:0.5;}
	#portfolio .min img{padding:11px; }
	
#apropos{text-align:justify; text-indent:40px; margin:100px 0; color:#333;}
	#apropos h2{color:#fff; font-family:"Lobster 1.4"; font-size:30px; margin-bottom:20px;}
	#apropos #quisuisje{float:left; width:350px; line-height: 1.2; font-size:14px; margin-left:100px;}
	#apropos #quisuisje img{float:right; margin: 10px 0 10px 20px;}
	#apropos #mescompetences{float:right; width:350px; line-height:1.2; font-size:14px; margin-right:100px;}
	#apropos #consultercv{width:250px; background:#ddd; margin:20px auto; padding:5px 0; border: 1px solid #aaa; text-indent:0; text-align:center;}
	#apropos #consultercv a{color: #555;}
	#apropos #consultercv:hover{background:#ccc;}
	#apropos #mecontacter{margin:100px auto 30px; auto; width:450px; border-radius:20px; padding:20px; color:#fff; text-align:center; text-indent:0;}
	#apropos #mecontacter .contact a{color:#c32f2f; font-size:20px; font-weight:bold; margin-left:10px;}
	#apropos #mecontacter .contact a:hover{color:#F7D98D;}
	#apropos #mecontacter .gros{font-size:25px; font-weight:bold; margin: 20px;}
	#apropos #mecontacter .contact{font-weight:bold; padding:10px 20px; border-radius:10px;}
	#apropos #mecontacter .contact p{margin-bottom: 20px;}
	#apropos #mecontacter .contact form label{float:left; margin-top:15px;}
	#apropos #mecontacter .contact form input[type=text]{float:right; width:250px; padding:3px; color:#1c5612; border:none;}
	#apropos #mecontacter .contact form textarea{float:right; margin:10px 0 30px 0; width:250px;  border:none; height:150px; padding:3px; color:#1c5612; font-family:sans-serif;}
	
#pagecv{text-align:left; color:#333;}
	#pagecv table tr td{vertical-align:top; padding: 0 20px 20px 20px;}
	#pagecv h2{ margin: 80px 0 30px 0; color:#fff; font-family:"Lobster 1.4"; font-size:30px;}
	#pagecv h3{color:#c32f2f; font-weight:bold;}
	#pagecv .colore{color:#c32f2f;}
	#pagecv .cv2{width:150px;}
	#pagecv ul{list-style: url(images/puce.png); margin-left:25px; margin:5px 0 20px 8px;}
	#pagecv li{margin-left:20px;}