@charset "UTF-8";

/* v1.0 | 20080212 */

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 {margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; }

body {line-height: 1; padding: 0; margin: 0; }
ol, ul {list-style: none; }
blockquote, q {quotes: none; }
blockquote:before, blockquote:after,
q:before, q:after {content: ''; content: none; }

/* remember to define focus styles! */
:focus {outline: 0; }

/* remember to highlight inserts somehow! */
ins {text-decoration: none; }
del {text-decoration: line-through; }

/* tables still need 'cellspacing="0"' in the markup */
table {border-collapse: collapse; border-spacing: 0; }

/* new clearfix */
.clearfix:after {visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
* html .clearfix {zoom: 1; }

/* IE6 */
*:first-child+html .clearfix {zoom: 1; }

/* IE7 */


/* ***************** FONTS ***************** */
@font-face {
    font-family: 'Titillium';
    src: url('../fonts/titilliummaps26l002-webfont.eot');
    src: url('../fonts/titilliummaps26l002-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/titilliummaps26l002-webfont.woff') format('woff'),
         url('../fonts/titilliummaps26l002-webfont.ttf') format('truetype'),
         url('../fonts/titilliummaps26l002-webfont.svg#TitilliumMaps26L500wt') format('svg');
}

@font-face {
    font-family: 'Rockwell';
    src: url('../fonts/rockwellstd-webfont.eot');
    src: url('../fonts/rockwellstd-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/rockwellstd-webfont.woff') format('woff'),
         url('../fonts/rockwellstd-webfont.ttf') format('truetype'),
         url('../fonts/rockwellstd-webfont.svg#RockwellStdRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'Rockwell';
    src: url('../fonts/rockwellstd-light-webfont.eot');
    src: url('../fonts/rockwellstd-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/rockwellstd-light-webfont.woff') format('woff'),
         url('../fonts/rockwellstd-light-webfont.ttf') format('truetype'),
         url('../fonts/rockwellstd-light-webfont.svg#RockwellStdLight') format('svg');
    font-weight: light;
    font-style: normal;

}

@font-face {
    font-family: 'Rockwell';
    src: url('../fonts/rockwellstd-bold-webfont.eot');
    src: url('../fonts/rockwellstd-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/rockwellstd-bold-webfont.woff') format('woff'),
         url('../fonts/rockwellstd-bold-webfont.ttf') format('truetype'),
         url('../fonts/rockwellstd-bold-webfont.svg#RockwellStdBold') format('svg');
    font-weight: bold;
    font-style: normal;

}

@font-face {
    font-family: 'Rockwell';
    src: url('../fonts/rockwellstd-italic-webfont.eot');
    src: url('../fonts/rockwellstd-italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/rockwellstd-italic-webfont.woff') format('woff'),
         url('../fonts/rockwellstd-italic-webfont.ttf') format('truetype'),
         url('../fonts/rockwellstd-italic-webfont.svg#RockwellStdItalic') format('svg');
    font-weight: normal;
    font-style: italic;

}


/* ***************** GENERAL ***************** */

body {
	margin:0;
	font-family: 'Titillium', "Arial Black";
	font-size: 13px;
	background-color: #000;
	background-image: url(../img/layout/default.jpg);
		background-position: top center;
		background-repeat: no-repeat;
}
body.accueil {background-image: url(../img/layout/bg_home.jpg);}
body.services {background-image: url(../img/layout/services_bg2.jpg); background-position: top right;}
body.entreprise {background-image: url(../img/layout/bg_entreprise.jpg);}
body.agrandissements-transformations {background-image: url(../img/layout/bg_restorations.jpg);}
body.maisons-neuves {background-image: url(../img/layout/bg_neuves.jpg);}
body.renovations-resstaurations-reparations {background-image: url(../img/layout/bg_renovations.jpg);}
body.architectes-designers {background-image: url(../img/layout/bg_architecte.jpg);}
body.constructions-vertes {background-image: url(../img/layout/verte.jpg);}
body.plan-vert {background-image: url(../img/layout/verte.jpg);}
body.soumission {background-image: url(../img/layout/services_bg2.jpg);}
body.contact {background-image: url(../img/layout/bg_architectes_old.jpg);}

#wrapper {
	margin: 0 auto 0 auto;
	width: 1000px;
	height: 620px;
	position: relative;
}

.clear {clear: both;}

.jsPane {width: 100% !important; box-sizing: border-box;}

h1 {padding: 10px 15px 10px 15px; color: #fff; font-family: Rockwell, Helvetica; text-transform: uppercase; font-weight: normal; font-size: 20px;  background-image: url(../img/layout/bg_noir.png); background-repeat: repeat; float: left; margin-bottom: 10px;}
h2 {font-family:Rockwell, Helvetica; letter-spacing: 1px; font-size: 21px; text-transform: uppercase; color: #fff; margin: 0 0 5px 0; font-weight: normal;}
h3 {font-family:Rockwell, Helvetica; line-height: 18px; font-size: 16px; color: #a8852b; font-weight: normal;}
p {color: #fff; margin-bottom: 7px; font-size: 13px; line-height: 18px;}
p.slogan { font-size: 15px; font-family:Rockwell, Helvetica; }
hr {width: 28px; height: 2px; border: 0; background-color: #fff; text-align:left; margin: 10px 0 8px -5px;}
b {font-weight: bold;}

#scrollbox {overflow: hidden;}

/* ***************** NAVIGATION ***************** */

#nav {float: left; width: 500px; font-family: Rockwell, Helvetica; }
#nav li {float: left; width: 125px; height: 56px; display: block;}
#nav li a {position: absolute; color: #fff; text-decoration: none; padding-top: 16px;display:block; height: 40px; width: 125px; text-align: center; background-repeat: no-repeat;}
#nav li a.services {background-image: url(../img/layout/nav_rouge.jpg);}
#nav li a.realisations {background-image: url(../img/layout/nav_jaune.jpg);}
#nav li a.vert {background-image: url(../img/layout/nav_vert.jpg);}
#nav li a.entreprise {background-image: url(../img/layout/nav_bleu.jpg);}
#nav li a:hover {height: 45px; width: 130px; font-size: 14px; z-index:100; margin-left: -2px;}

#nav.gros {margin-left: 40px;
    margin-top: 75px;
    width: 792px;}
#nav.gros li {width: 141; height: 66px;}
#nav.gros li a {width: 141; height: 46px; padding-top: 20px;}
#nav.gros li a:hover {height: 50px; width: 149px; margin-top: -4px;}

#sub_nav {float: left; display: block; width: 230px;margin-left: 8px; font-family: Rockwell, Helvetica; }
body.services #sub_nav {margin-right: 10px; margin-top: 50px;}
body.index #sub_nav {margin-right: 10px; margin-top: 50px;}
body.constructions-vertes #sub_nav {margin-right: 10px; margin-top: 50px;}
body.plan-vert #sub_nav {margin-right: 10px; margin-top: 50px;}
#sub_nav li {display: block;  margin-bottom: 5px; width: 230px; height: 47px; line-height:16px;}
#sub_nav li a {position:absolute; display: block; color: #fff; text-decoration: none; width: 210px; height: 27px; padding: 7px 10px 10px 10px; background-image: url(../img/layout/bg_noir.png); background-repeat: repeat;}
#sub_nav li video {background: url(../img/layout/bg_noir.png) repeat; padding:10px;}
#sub_nav li a .une_ligne {display:block;margin-top: 8px;}
#sub_nav li a:hover {height: 28px; width: 222px; font-size: 14px;}
body.services #sub_nav li a:hover {margin-left: -7px;}
body.index #sub_nav li a:hover {margin-left: -7px;}
body.constructions-vertes #sub_nav li a:hover {margin-left: -7px;}
body.plan-vert #sub_nav li a:hover {margin-left: -7px;}

body.accueil #sub_nav li a {width: 280px;}
body.accueil #sub_nav li a:hover {width: 292px;}

#projets {width:193px; font-family: Rockwell, Helvetica; float: right;  margin: 0 10px 0px 0; clear: left;}
#projets a.consultez {display: block; width: 169px; height: 33px; padding: 7px 20px 0 5px; margin: 0 0 10px 0; background-image: url(../img/layout/bg_drop_projets.jpg); background-repeat: no-repeat; color: #fff; text-decoration: none; font-size: 14px; font-family: Titillium;}
#projets #scroll_projets {background-image: url("../img/layout/bg_noir.png");
    background-repeat: repeat; height: 412px; overflow: hidden; position: relative;}
#projets ul {clear: both; width: 212px; position: relative; }
#projets ul li {color: #fff; display: block; position: relative; width: 204px;}
#projets ul li a {color:#fff; text-decoration: none; display: block; background-image: none; height: auto; width: 155px; line-height: 15px; font-size: 12px; font-family: Titillium,Arial; font-weight: normal; margin: 0; padding: 7px 4px 7px 13px;}
#projets ul.jspScrollable li a {width: 155px;}
#projets ul li a:hover, #projets ul li a.select {background-color: #585650;}

#sub_nav_realisation {height: 20px; display:block; clear: both; margin: 0 0 6px 8px;}
#sub_nav_realisation li {float: left; display:block;}
#sub_nav_realisation li a {display:block; color: #fff; text-decoration: none; text-transform: uppercase; background-color: #000; padding: 5px 10px 5px 10px; margin-right: 6px;}

#seq_nav_realisation {position: absolute; bottom: -17px; right: 264px; display:block; clear: both;}
#seq_nav_realisation.vu {bottom: -17px;}
#seq_nav_realisation li {float: left; display:block;}
#seq_nav_realisation li a { display:block; width: 24px; height: 12px; padding: 6px 0; font-weight: bold; text-align: center; color: #fff; text-decoration: none; text-transform: uppercase; background-color: #000; margin: -10px 5px 0 0;}
#seq_nav_realisation li a.select { color: #777; }

#projets .jspDragTop, #projets .jspDragBottom {
	right: 3px;
	display: block;
	z-index: 99999;
	cursor: pointer;
}

#projets .jspDragTop {
	top: 3px;
}

#projets .jspDragBottom {
	bottom: 3px;
}

/* ***************** TOP ***************** */
#top {height: 56px; background-color: #000; display:block;}
#top img.logo {margin: 13px 56px 0 22px; float: left;}

#mentions {margin-left: 23px; width:154px; height: 44px; font-family: Rockwell, Helvetica;}
#mentions a {display: block; width: 164px; height: 35px; padding: 12px 0 0 26px; background-image: url(../img/layout/bg_mentions.png); background-repeat: no-repeat; color: #fff; text-decoration: none; font-size: 14px;}
#mentions ul {display: none; position: absolute; width: 490px; margin-left: 40px; padding: 10px 0 10px 50px; background-image: url(../img/layout/bg_noir.png); background-repeat: repeat; background-position: 0 0;}
#mentions:hover ul {display:block; z-index: 500;}
#mentions ul li {color: #fff; width: 155px; height: 15px; float: left; display: block; margin: 5px 5px 5px 0; font-size: 12px;}

/* ***************** FOOTER ***************** */
#footer_container {
	width: 960px;
	margin: 0 auto;
}

#footer {clear: both; display: block; margin: 25px 40px;}
#footer #nav_footer { float:left;}
#footer #nav_footer li {margin-bottom: 3px;}
#footer #nav_footer li a {color: #a58333; text-decoration: none;}
#footer #nav_footer li a:hover {color: #a58333; text-decoration: underline;}

#footer #nav_footer li ul {}
#footer #nav_footer li ul li { margin-bottom: 1px;}
#footer #nav_footer li ul li a {font-size: 11px; color: #6d6d6d;}

#footer_1stcolumn {float: left; border-left: 1px solid #363636; padding-left: 38px; height:100px; margin-bottom:30px; color: #6d6d6d; line-height: 18px; width:370px;}
#footer_2ndcolumn {float: left; border-left: 1px solid #363636; padding-left: 38px; color: #6d6d6d; line-height: 18px;}
#footer #coord {float: left; padding:0px 0px 25px 0px; color: #6d6d6d; line-height: 18px; width:290px;}
#footer #coord hr {width: 4px; border: 0; height: 1px; background-color: #a58333; text-align:left; margin-left: 0;}
#footer #coord h3 {color: #a58333;}
#footer #coord span {}
div#coord div.street-address, div#coord span.locality, div#coord span.region, div#coord span.postal-code, div#coord span.country-name, div#coord span.tel  { color: #6d6d6d;}
span.street-address, span.region, span.postal-code, span.locality, span.country-name, span.tel { color: #fff;}

span.gold, span.type  {color:#a58333; }
div.org {font-size: 16px;}

#sub_footer {
	background: #efeeee;
	width: 100%;
	height: 63px;
	clear: both;
	padding-top: 7px; 
}
#sub_footer div {
	margin: 0 auto 0 auto;
	width: 410px;
	position: relative;
}

#sub_footer #prix {
	left: -239px;
	top: -41px;
	position: absolute;
	display: block;
	background-image: url(../img/layout/bg_mentions.jpg);
	padding: 11px 9px 9px 27px;
	font-family: Rockwell, helvetica; 
	text-transform: uppercase;
	font-size: 14px;
	height: 14px;
	line-height: 14px;
	color: white;
	text-decoration: none;
}

/* ***************** CONTENUS ***************** */

.blackbox {background-color: #000;}
.blackbox a {padding: 20px; display:block; text-align: center; text-decoration: none; color: #fff; font-weight: bold; font-size: 14px;}
.blackbox img {max-width:100%; margin-bottom: 10px;}
.blackbox a:hover {color: #ccc;}
.blackbox a:hover img {opacity: 0.8;}

#content_wrap {display: block; height: 484px; padding: 15px 15px 0 13px;}
body.realisations #content_wrap {margin-top: 30px; height: 499px; position: relative;}
body.index #content_wrap {padding-right: 0;}

.links {
	background-repeat: repeat;
    display: block;
    margin-bottom: 18px;
    float: left;
    width: 422px;
    padding: 19px 20px;
    box-sizing: border-box;
    line-height: 1.4em;
    background-color: rgba(255,255,255,0.9);
    border: 2px solid #000;
    color: #000;
}
.links a {color: #000; text-decoration:none;  font-size: 12px;}
.links a .reference {text-transform: uppercase; font-size: 16px; font-family: Rockwell, Helvetica; font-weight:bold;}

body #content {padding: 150px 105px 0 205px;}
body.accueil #content {padding: 170px 105px 0 205px;}
body.accueil #content #banner {position: absolute; top: 100px; left: 22px; }
body.accueil #content #last-nobilis {margin-right: 10px; float:left;}
body.accueil #content #message {font-family: Helvetica; background-color: #fff; width: 266px; height: 65px; padding: 10px; font-size: 13px; text-transform: uppercase; float:left;}
body.accueil #content #message img {float: left; margin-right: 10px;}
body.accueil #content #message .texte {padding-top: 7px;}
body.entreprise #content {padding: 40px 105px 0 184px;}
body.contact #content {padding: 40px 105px 0 184px;}
body.constructions-vertes #content {padding: 40px 0px 0 2px; margin-top: -15px;}
body.plan-vert #content {padding: 40px 0px 0 2px; margin-top: -15px;}
body.services #content {padding: 40px 0px 0 2px; margin-top: -15px;}
body.index #content {padding: 40px 0px 0 2px; margin-top: -15px;}
body.soumission #content {padding: 40px 0px 0 184px;}
body.realisations #content {padding: 15px 0px 0 0px; margin-top: -15px;}

body #content #article, body #content #article_ss {overflow: hidden; float: left; width: 378px; height: 210px; padding: 15px 22px 0px 22px; background-image: url(../img/layout/bg_noir.png); background-repeat: repeat; display:block; margin-bottom: 18px;}
body.accueil #content #article {width: 378px; height: 245px;}
body.entreprise #content #article {width: 471px; height: 367px;}
body.contact #content #article {width: 471px; height: 197px;}
body.constructions-vertes #content #article {width: 670px; height: 427px;}
body.plan-vert #content #article {width: 670px; height: 427px;}
body.realisations #content #article_ss, body.videos #content #article_ss {width: 700px; height: 425px; margin-left: 8px; position: relative; padding: 39px 0 1px 10px;}
body.realisations #content #article_ss.vu {width: 700px; height: 425px; margin-left: 8px; position: relative; padding: 39px 0 1px 10px;}
body.services #content #article {width: 670px; height: 427px;}
body.index #content #article {width: 670px; height: 427px;}
body.index #content #article.mentions {width: 705px!important;}
body.soumission #content #article {width: 735px; height: 367px;}}
body.services #content #article #scrollbox { padding-bottom: 70px; }
body.index #content #article #scrollbox { padding-bottom: 70px; }
body.realisations #content #article_ss #thumbs a {margin: 0px 10px 18px 0; display: block; float: left;}

body #content #article .jspContainer {box-sizing: border-box; width: inherit!important;}
body #content #article .jspPane {box-sizing: border-box; width: inherit!important;}

body.videos #content {padding-left:0; padding-top: 70px;}
body.videos #content h1 {}
body.videos #content #article {width: 970px; height: 340px}
body.videos #content .video {float:left;     margin: 30px 22px 10px;}

body.realisations #content #article_ss #thumbs.liste a {margin: 0px 9px 45px 0;}

body.realisations #content #article_ss.vu h2 { position: absolute; color: #A8852B; text-transform: none; font-size: 14px; top: 10px; left: 10px; } 

#portfolio_bigpict { height: 445px; position: relative; }
#portfolio_bigpict a {position: absolute; z-index: 300; background-repeat: no-repeat; text-decoration: none; color: #fff; font-size: 11px;}
#portfolio_bigpict a.back, #portfolio_bigpict a.next {width: 13px; height: 18px; position: absolute; top: 183px;}
#portfolio_bigpict a.back {background-image: url(../img/layout/nav_portfolio_back.png); left: 15px;}
#portfolio_bigpict a.next {background-image: url(../img/layout/nav_portfolio_next.png); margin-right: 5px; right: 20px;}
#article_ss #portfolio_bigpict a.close {background-image: url(../img/layout/nav_portfolio_close.png); width: 150px; text-align: right; background-position: right top; top: 5px; margin-right: 5px; right: 10px; padding-top: 28px;}
#article_ss a.close {
	background-image: url(../img/layout/nav_portfolio_close.png);
	background-position: left top;
	height: 25px;
	width: 26px;
	display: block;
	position: absolute;
	right: 7px;
	top:7px;
}

#portfolio_bigpict #bigpict {position: absolute; width: 640px; height: 401px; background: black; margin-left: 28px;}
#portfolio_bigpict #bigpict li {position: absolute;}
#portfolio_bigpict #bigpict li img {}
#portfolio_bigpict #loader {  background: none repeat scroll 0 0 black; padding: 170px 260px 181px; position: absolute; z-index: 999; }
#legend {
    background: none repeat scroll 0 0 black;
    bottom: 19px;
    color: white;
    filter: alpha(opacity=80); /* internet explorer */
	-khtml-opacity: 0.8;      /* khtml, old safari */
	-moz-opacity: 0.8;       /* mozilla, netscape */
	opacity: 0.8;           /* fx, safari, opera */
    padding: 10px;
	margin-left:25px;
    position: absolute;
    width: 623px;
    z-index: 1000;
    line-height: 16px;
}

.services .thumb {
	margin-right: 7px;
}

.services .thumbs {
	margin-top: 10px;
}

.tipsy { padding: 5px; font-size: 10px; position: absolute; z-index: 100000; font-family: Titillium, Arial; }
.tipsy-inner { padding: 5px 8px 4px 8px; background-color: white; color: #000; max-width: 200px; text-align: center; }
.tipsy-inner {  }
.tipsy-arrow { position: absolute; background: url('../img/tipsy.gif') no-repeat top left; width: 9px; height: 5px; }
.tipsy-n .tipsy-arrow { top: 1px; left: 50%; margin-left: -4px; }
.tipsy-nw .tipsy-arrow { top: 0; left: 10px; }
.tipsy-ne .tipsy-arrow { top: 0; right: 10px; }
.tipsy-s .tipsy-arrow { bottom: 0; left: 50%; margin-left: -4px; background-position: bottom left; }
.tipsy-sw .tipsy-arrow { bottom: 0; left: 10px; background-position: bottom left; }
.tipsy-se .tipsy-arrow { bottom: 0; right: 10px; background-position: bottom left; }
.tipsy-e .tipsy-arrow { top: 50%; margin-top: -4px; right: 0; width: 5px; height: 9px; background-position: top right; }
.tipsy-w .tipsy-arrow { top: 50%; margin-top: -4px; left: 0; width: 5px; height: 9px; }

.soumission form {
	position: relative;
	padding-bottom: 25px;
}

.soumission label {
	display: block;
	color: white;
	font-family: 'Titillium';
	font-size: 13px;
	margin-bottom: 2px;
}

.soumission input {
	margin-bottom: 7px;
	width: 250px;
}

.soumission textarea {
	width: 100%;	
}

.soumission select {
	margin-bottom: 7px;
}

.submit input {
	position: absolute;
	bottom: 0;
	right: 0;
	background: #b2852d;
	border: none;
	color: white;
	font-family: 'Titillium';
	font-size: 15px;
	text-transform: uppercase;
	width: auto;
	padding: 2px 10px;
	cursor: pointer;
}

.soumission .col {
	float: left;
	width: 48%;
	padding-bottom: 20px;
}

#flash-message.success {
	background: none repeat scroll 0 0 #DDFDC7;
    border: 1px solid #3C7316;
    color: #3C7316;
    display: block;
    font-weight: bold;
    padding: 10px;
    position: absolute;
    right: 214px;
    top: 14px;
    width: 300px;
}
#article li {
	color:#fff;
	margin-left:25px;
	list-style-type:disc;
	line-height:18px;
	}
	
a {
	color: #A8852B;
}
#meta-nav {
	position: absolute;
	top: 56px;
	left: 22px;
}

#meta-nav a {
	display: block;
	background: #A8852B;
	padding: 7px 9px 6px 9px;
	width: auto;
	float: left;
	font-family: Rockwell, helvetica; 
	text-transform: uppercase;
	font-size: 12px;
	height: 12px;
	line-height: 12px;
	margin-right: 5px;
	color: white;
	text-decoration: none;
}

#meta-nav a.mentions {
	font-size: 15px;
	font-weight: bold;
	color: #A8852B;
	background-color: white;
	padding:10px;
	width: 164px;
	text-align: center;
	-moz-box-shadow:    0px 3px 10px 1px #666;
  	-webkit-box-shadow: 0px 3px 10px 1px #666;
  	box-shadow:         0px 3px 10px 1px #666;
}

div.box_mention {
	background-color: #fff;
	padding: 5px;
	width: 75px;
	text-align: center;
	float: left;
	margin: 0 5px 7px 0;
	height: 88px;
}
img.mentions {
	max-width:100%;
}


.mention {font-family: Times New Roman; color: #fff; width: 110px; text-align:center; margin: 0 10px 10px 0; float: left;}
.mention .mention_titre {font-size: 11px;}
.mention .mention_annee {font-size: 11px; letter-spacing: 7px; border-top: 1px solid #fff; width: 43px; margin: 0 auto 0 auto;}
.mention .mention_logo {}
.mention .mention_rang {font-size: 10px; letter-spacing:-1px;}
.mention .mention_categorie {font-size: 9px;}
.mention .mention_categorie2 {font-size: 9px;}