@charset "utf-8";
/* CSS Document */
/*****************************************************************************
Cyril Codogno - portfolio version 3.0
Copyright 2010 Cyril Codogno, <http://cyril.codogno.free.fr/>

See also <http://cyril.codogno.free.fr/blog>
*****************************************************************************/

/*GENERIC GLOBAL STYLES*/
body{margin: 0;padding: 0; background:#ffffff;font-family:Trebuchet MS,Trebuchet,Verdana,Arial,San-serif; font-size:13px; line-height:22px; color:#5F5957;}
.clearfix:after {content: ".";display: block;height: 0;clear: both;visibility: hidden;}
p{line-height:1.5;margin:0px;padding:0px;}
img{margin:0px;padding:0px}
a img {border:0px;}
.clear{clear:both;}
a {color:#DE3D81; font-weight:bold; font-size:14px; text-decoration:none; font-family:'Droid Sans', Trebuchet MS,Trebuchet,Verdana,Arial,San-serif;}
a:hover {color:#6F012F}

/*NIVEAU DE TITRE*/
h1, h1 *{font-size:42px;color:#fefefe;line-height:50px; font-weight:100;font-family:'Droid Sans', Trebuchet MS,Trebuchet,Verdana,Arial,San-serif;}
h2, h2 *{font-size:29px;color:#fefefe;font-weight:100;font-family:'Droid Sans', Trebuchet MS,Trebuchet,Verdana,Arial,San-serif;}
h3, h3 *{font-size:27px;color:#000000;font-weight:100;font-family:'Droid Sans', Trebuchet MS,Trebuchet,Verdana,Arial,San-serif;}
h4, h4 *{font-size:13px;color:#fefefe;font-family:Trebuchet MS,Trebuchet,Verdana,Arial,San-serif; font-weight:bold;}
h5, h5 *{font-size:12px;font-family: calibri, Arial;font-weight:100;line-height:12px;}

/*HEADER*/
#headerContainer{background-color:#DF3D82; height:400px; width:100%; min-width:940px;}
#headerContainer #headerContent{width:940px; margin:0 auto; padding:0px 20px 0px 20px;}
#headerContainer #headerContent #headerLN{margin:10px 0px 0px 0px; padding:0px 0px 10px 0px;float:left; width:940px; border-bottom:1px solid #FFFFFF;}

/*HEADER NAVIGATION*/
#headerContainer #headerContent #headerLN #navigation{font-size:18px; padding:0px;float:right;}
#headerContainer #headerContent #headerLN #navigation ul{list-style:none; margin-top:14px; display:block;font-family:'Droid Sans', Trebuchet MS,Trebuchet,Verdana,Arial,San-serif;} 
#headerContainer #headerContent #headerLN #navigation ul li {margin:0px 0px 0px 5px; color:white; padding:1px 0px 0px 0px;float:right;}
#headerContainer #headerContent #headerLN #navigation ul li a {color:#6F012F;text-decoration:none; font-size:16px; font-weight:bold;}
#headerContainer #headerContent #headerLN #navigation ul li a:hover{color:#fff;}
#headerContainer #headerContent #headerLN #navigation ul li a.active {color:white;font-weight:100;}
#headerContainer #headerContent h1 {clear:both;margin:0px;padding:15px 0px 0px 0px;}
#headerContainer #headerContent h2 {margin:0px;padding:10px 0px 80px 0px;}
#headerContainer #headerContent a {color:#6F012F; font-size:30px; font-weight:100;}
#headerContainer #headerContent a:hover{color:#fff;}

#subHeader{width:940px;border:1px solid #302c28;background-color:white;margin:0 auto;margin-top:-190px;position:relative;overflow:hidden;height: 400px;}
#subHeader #sizzle img{float:left;}
#subHeader #sizzle{position:absolute;}
#subHeader #sizzles{width:940px;float:left;}
#subHeader #sizzles img{width:940px;height:400px;position:absolute;}

/*CONTENU*/
#content{width:940px; margin:0 auto; padding:0px;}

/*SEPARATEUR*/
.separateur{clear:left; width:940px; background-image:url(../images/separateur.gif); background-repeat:repeat-x;height:1px;}

/*MYWORK*/
#content #mywork{width:940px;margin:20px 0px 20px 0px; padding:0px; float:left;}
.resume{width:220px; margin:0 auto; padding:0px; float:left;}
.resume h3 {margin:0px; padding:0px;}
.resume p{width:220px; margin:10px 0px 0px 0px; padding:0px; float:left;}
.resume ul{margin:0px; padding:0px; float:left;list-style:none;}
.resume li{margin:10px 0px 0px 0px; font-weight:100;}
.resume li img{margin:0px 5px 0px 0px;}
.resume li a{font-weight:100; font-size:12px;font-family:'Droid Sans', Trebuchet MS,Trebuchet,Verdana,Arial,San-serif;}
.resume .texte2 {margin:20px 0px 0px 0px; padding:10px 0px 0px 0px;float:left; }
.resume .texte2 h4 {color:#7F7774;font-size:20px;font-weight:100;margin:0px; padding:0px;}
.resume .texte2 p{line-height:1.5;}

#content #mywork #slider{position:relative; overflow:auto; width:720px; height:300px; background:#fff; float:left;}
#content #mywork #slider ul{position:absolute; list-style:none; top:0; left:0; margin:0; padding:0; float:left;}
#content #mywork #slider li{margin:0px; padding:0px; width:720px; height:300px; float:left;}
#content #mywork #slider .projet{width:220px; margin:0px; padding:0px 0px 0px 20px; float:left;}
#content #mywork #slider .projet a img{margin:0px; padding:0px; float:left;}
#content #mywork #slider .projet .desc{width:220px; margin:0px 0px 5px 0px; padding:0px; background-color:#DF3D82; height:60px; float:left;}
#content #mywork #slider .projet .desc h4{margin:5px 0px 0px 0px; padding:0px 0px 0px 10px; float:left; width:200px;}
#content #mywork #slider .projet .desc p{color:#FFFFFF; padding:0px 0px 0px 10px; font-size:12px; float:left;font-family:'Droid Sans', Trebuchet MS,Trebuchet,Verdana,Arial,San-serif; }
#content #mywork #slider .projet p{font-size:12px; float:left; margin:0px; padding:0px 0px 0px 0px; }

.pagination {float:left; list-style:none;}
.pagination li {float:left; cursor:pointer; padding:2px 8px 0px 0px; color:#DE3D81; font-weight:bold; font-size:14px;}
.pagination li:hover {color:#6F012F}
li.current {color:#AFAEAE}
#content #mywork .resume ul {margin:0px; padding:0px;}

/*BLOG*/
#content #blog{width:940px; margin:20px 0px 20px 0px; padding:0px; float:left;}
#content #blog #allbillet{background:#fff; float:left; margin:0px 0px 0px 19px; }
#content #blog #allbillet .billet{width:220px; margin:0px; padding:0px 19px 0px 0px;border-left:1px solid #BDBDBD;float:left;}
#content #blog #allbillet .billet .billetcontent, .lastbillet .billetcontent {width:195px; margin:0px 0px 0px 15px; height:165px;}
#content #blog #allbillet .billet .billetcontent h4, .lastbillet .billetcontent h4  {margin:0px 0px 10px 0px; padding:0px;float:left; width:195px; height:65px;}
#content #blog #allbillet .billet .billetcontent h4 a, .lastbillet .billetcontent h4 a{font-size:16px;color:#DE3D81;float:left;font-family:'Droid Sans', Trebuchet MS,Trebuchet,Verdana,Arial,San-serif;}
#content #blog #allbillet .billet .billetcontent h4 a:hover, .lastbillet .billetcontent h4 a:hover{color:#6F012F;float:left;}
#content #blog #allbillet .billet .lirearticle, .lastbillet .lirearticle {background:#BDBDBD;width:220px;margin:10px 0px 0px 0px;float:left;}
#content #blog #allbillet .billet .lirearticle a, .lastbillet .lirearticle a{color:#fff; padding:0px 0px 0px 20px;float:left;font-weight:100;}
#content #blog #allbillet .billet .lirearticle a:hover, .lastbillet .lirearticle a:hover{color:#6F012F;float:left;}

#content #blog #allbillet .lastbillet{width:220px; margin:0px; padding:0px;border-left:1px solid #BDBDBD;float:left;}

/*APROPOS*/
#content #apropos{width:940px; margin:20px 0px 0px 0px; padding:0px 0px 80px 0px; float:left;}
#content #apropos #profil{width:720px; margin:0px; padding:0px; float:right;}
#content #apropos #profil #quijesuis{margin:0px; padding:0px 0px 40px 20px; float:left;}
#content #apropos #profil #quijesuis p span{font-size:18px;color:#000;font-family:'Droid Sans', Trebuchet MS,Trebuchet,Verdana,Arial,San-serif;}
#content #apropos #profil #recommandation{width:720px;margin:0px; padding:0px; float:right;}
#content #apropos #profil #recommandation .temoignage{width:220px; margin:0px; padding:0px 20px 0px 0px; border-left:1px solid #BDBDBD; float:right;}
#content #apropos #profil #recommandation .temoignage .temoignagecontent, .lasttemoignage .temoignagecontent{width:190px; padding:0px 0px 0px 20px; height:160px; float:left;}
#content #apropos #profil #recommandation .temoignage .temoignagecontent h5, .lasttemoignage .temoignagecontent h5 {margin:0px; padding:0px;}
#content #apropos #profil #recommandation .temoignage .auteur, .lasttemoignage .auteur {background:#BDBDBD; width:220px; margin:10px 0px 0px 0px; float:right;}
#content #apropos #profil #recommandation .temoignage .auteur p, .lasttemoignage .auteur p {font-size:11px;padding:2px 0px 4px 20px; float:left;}
#content #apropos #profil #recommandation .lasttemoignage{width:220px; margin:0px; padding:0px; border-left:1px solid #BDBDBD; float:right;}

#content #apropos #profil #bulle {padding:0px 0px 0px 35px;margin-top:0px; float:left;}
#content #apropos #profil #bulle img{float:left;}

#content #apropos #profil #plusdetemoignage {padding:10px 0px 0px 15px;margin-top:0px; float:left;width:700px;}

/*FOOTER*/
#footer {clear:both; background-color:#F2F2F2; height:200px; width:100%; min-width:940px; margin:30px 0px 0px 0px;}