@charset "utf-8";
/* CSS Document */

/*--------Normalisation------------*/
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, p, blockquote, th, td, * {margin : 0;padding : 0;}
h1, h2, h3, h4, h5, h6 {font-size : 100%; font-weight:normal;}
ol, ul {list-style : none;}
address, caption, cite, code, /*em*/, th, var {font-style : normal;font-weight : normal;}
table {border-collapse : collapse;border-spacing : 0;}
fieldset, img {border : 0;}
caption, th {text-align : left;}
q:before, q:after {content :'';}
a{outline: none;}
:focus{-moz-outline-style: none;}

/*--------Ueful------------*/
.spacer {clear:both;}
.right { float:right}
.left { float:left}


/*--------Newround------------*/
html {/*overflow: hidden;*/}

body{ background:#f7f5f4 url(../img/body-bg.gif) repeat-x; font-family:Verdana, Geneva, sans-serif; font-size:11px; color:#8a8582; }

h1{ font-size:20px; text-transform:uppercase; font-weight:bold; margin-bottom:15px;}

#global{  }

#header{ margin:20px 0 0 130px; width:870px; height:65px;   }

#branding img {float:left; }
#branding h1{ text-indent:-9999px; height:0px; margin-bottom:0px;}
#branding blockquote{ font-size:14px; color:#666; float:left; margin:-10px 0 0 15px; text-transform:uppercase; width:580px; line-height:31px; }

#navigation{ position:absolute; left:130px; top:85px; clear:both;width:96px;z-index:10; }
#navigation ul{ padding:0; font-size:12px; text-transform:uppercase; }
#navigation li{margin:0px 0; float:right; display:block; }
#navigation li a{ padding:1px 5px; color:#fff; text-decoration:none; border:1px #fff solid; float:right; }
#navigation li.home a{background:#8a8582;}
#navigation li.studio a{background:#89b015;}
#navigation li.ref a  {background:#c31f1f;}
#navigation li.cont a{background:#e66f20;}
#navigation li.blog a{background:#c04196;}
#navigation li.selected a{background:#bdb7b3}
#navigation li a:hover{ background:#8a8582;}

/*--------slide----------*/
.sub{ background: url(../img/content-bg.jpg) no-repeat; width:870px; float:left; padding:30px 10px 0px 10px; height:550px; margin-right:800px; }

#sections{ position:relative;  z-index:1; margin-left:130px; }
#screen, #sections {width: 100%;overflow: hidden; height:550px; float:left;} 
#container{ width:10000px;overflow: hidden; }

#screen .next, #screen .prev {position:absolute;top:360px;  z-index:20;cursor:pointer;}
#screen .prev {left:95px;}
#screen .next {left:1020px;}

/*-----------Home-----------*/
#home { background:url(../img/bg-home.jpg) no-repeat left top;}
#home a{ color:#c31f1f; text-decoration:none;  }
#lastreal {padding-left:150px; float:left;}
/*dt#lastreal {position:absolute; z-index:10;}*/
#lastreal .legende{ padding:5px; width:540px; height:30px; background:#000;color:#fff; position:absolute; z-index:20; display:block; margin-top:211px;}
#lastreal  h1{ color:#8a8582; }
#about { margin:20px 0 0 150px; float:left;}
#about img{ float:left;}
#about h1{  color:#89b015; margin: 20px 0 0 0px; }
#about p{   line-height:20px; width:522px; margin-left:0px; color:#444;}

/*-----------Studio-----------*/

#studio {  padding-left:0px;  color:#8a8582;}
#illustration{ width:205px; float:left; margin:0px 0 0 20px;}
#illustration img{ float:left;}
#studio  a{ color:#c31f1f; text-decoration:none; }
#studio .chapeau { width:600px; font-size:11px; margin-left:160px; line-height:18px; color:#444;}
#studio h1 {  color:#89b015; margin:0 0 0 160px;}
#studio ul{ list-style:none; margin-top:15px;}
#studio li{ float:left; width:635px; margin:10px 0;} 
#studio li img {float:left; }
#studio li h2,#studio li p{float:left; margin-left:20px; width:500px; line-height:15px; }
#studio li h2 { color:#89b015; margin-bottom:0px;}
#studio h3  { background:#ebebeb; padding:1px 5px; display:block; float:left; margin:10px 0px 0 20px; color:#444;}

/*-----------reference-----------*/
#reference{ padding-left: 110px;}
#reference h1 { color:#c31f1f; margin-left:20px; }
#reference ul{ list-style:none;  width:2000px; }

ul#filter { float: left; font-size: 12px; list-style: none; margin-left: 20px; width: 100%; }
ul#filter li { float: left;line-height: 16px;margin-right: 10px;padding-right: 10px;}
ul#filter li:last-child { border-right: none; margin-right: 0; padding-right: 0; }
ul#filter a { color: #999; text-decoration: none; text-transform:uppercase; }
ul#filter li.current a, ul#filter a:hover { color:#c31f1f;}
ul#filter li.current a { color:#c31f1f; font-weight: bold; background:#ebebeb; padding:0 5px;}

ul#portfolio { float: left; list-style: none; margin:20px 0; width:1900px;overflow: hidden; height:550px;  }
li.pages{  float: left;  width:600px; height:650px; position:relative; z-index:10;}
#portfolio ol li {  float: left; margin:0 5px ; padding: 10px 5px;width: 180px; height:106px;  }
#portfolio  img{position:relative; top:0px; z-index:12;}
#portfolio ol li.hide { display:none; width:0; height:0; margin:0; padding:0; float:left;}
#portfolio .legende{ padding:5px; width:170px; height:30px; background:#000;color:#fff; position:absolute; z-index:20; display:block;}
/*ol#portfolio a { display: block; width: 100%; }*/
ol#portfolio a:hover { text-decoration: none; }
title#portfolio a {color:#fff;}

#sections-site{ position:relative;  z-index:1;}
#screen-site, #sections-site {width: 650px;overflow: hidden; height:550px; clear:left;}
ul#sections-site { }

#screen-site .next-ref, #screen-site .prev-ref {position:absolute; top:270px;  z-index:20;cursor:pointer;}
#screen-site .prev-ref { }
#screen-site .next-ref { margin-left:670px;}

/*-----------contact-----------*/
#contact{ padding-left:140px; }
#contact h1{ color:#e66f20; }

#formulaire{ display:block; clear:left; padding-top:20px;}
#formulaire p{ margin:10px 0}
#formulaire input, #formulaire textarea{ border:1px solid #ccc; font-size:11px; font-family:Verdana, Geneva, sans-serif; background:#ebebeb; color:#e66f20; font-size:30px; width:400px;}
#formulaire .submit { font-weight:bold; font-size:11px; cursor: pointer; color:#888; }
#formulaire .submit:hover { background:#e66f20;  color:#FFF}

p#success{padding: 3px 10px;background: #ccc; color: #89b015; margin-bottom: 10px; width:400px; color:#fff;}
p#bademail, p#badserver{padding: 3px 10px;background:#c31f1f; color:#fff; margin-bottom: 10px; width:400px;}

/*-----------Blog tumblr-----------*/
#blog{ padding-left:140px; width:600px;}
#blog h1{ color:#c04196;}
#blog h2{ color:#c04196;margin-bottom:20px; }
#blog  a{ font-size:14px;  text-decoration:none; color:#c04196; }
ol.tumblr_posts{ margin-top:20px;}
li.tumblr_post { margin:10px 0; border-bottom:1px solid #ccc; padding:10px 0;}
a.tumblr_link { font-size:11px ; font-weight:bold; text-decoration:none; color:#c04196; text-transform:uppercase;}
.tumblr_description{}

/*-----------footer-----------*/
#footer{  text-transform:uppercase; padding-top:5px; margin:10px 0 0 140px; width:870px; float:left; }

.vcard{ margin-left:0px;  font-size:10px; float:left; width:290px; text-transform:uppercase;}	
.vcard dt a{ color:#89b015; font-weight:bold;text-decoration:none  }	
dl .adr { color:#8a8582}
.type, .locality, .country-name, .postal-code, .tel{ display:none;}
dl dd.adr  {float:left;}
.email a, .email{ color:#e66f20; font-weight:bold; text-decoration:none }

#lastnews{ width:530px; height:85px; padding:0px 0 0 40px; background:url(../img/fleche.png) no-repeat ; float:left; font-size:10px;}
#lastnews h1{  font-weight:bold; color:#c31f1f; font-size:12px; margin-bottom:5px;}
#lastnews .chapeau{ font-weight:bold; float:left;}
#lastnews .news{float:left;}