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




/* BODY et PAGE
--------------------------------------------------------------------------- */

body { 
	font-family: Helvetica, Arial, sans-serif;
	background-color: #333333;
	width: auto !important;
	margin: auto !important;
	padding: auto !important;
}

* {
	margin: auto;
	padding: auto;
}

html {
	height:100%;
}

/* réduit la taille de police quand en orientation paysage */
@media screen and (max-width:640px) and (orientation: landscape) {
	body {
   -webkit-text-size-adjust: 70%;
  }
}

 /* fixer une largeur maximale  de 100 % aux éléments potentiellement problématiques */
 img, table, td, blockquote, code, pre, textarea, input, iframe, object, embed, video {
   max-width: 100% !important;
 }
 
/* gestion des mots longs */
 textarea, table, td, th, code, pre, samp {
   word-wrap: break-word; /* césure forcée */
 }	


ul {
	list-style-type: none;
	width: 100%;
	height:auto;
	margin: auto;
	padding: 0;
}
	

li {
	display:block;
	width: 100%;
	height: 47px;
	margin: auto;
	padding: auto;
}


/* GENERAL
--------------------------------------------------------------------------- */
/*//////////////////////////////////////////////////////////////////////////*/
/*///////////////////////////////////////////////////////////////////////////*/
/*///////////////////////////////////////////////////////////////////////////*/


.bouton_menu {
	float: none;
	display:block;
	width: 100%;
	height:47px;
	margin: auto;
	padding:auto;
	background-image:url(../images/base/bouton_menu.gif);
	background-position:top;
}

.bouton_menu:hover {
	background-image:url(../images/base/bouton_menu.gif);
	background-position:center;
}

.bouton_menu:active {
	background-image:url(../images/base/bouton_menu.gif);
	background-position:bottom;
}

.bouton_menu a {
	display:block;
	height:13px;
	color: #b0b0b0;
	padding-right:13px;
	padding-left:13px;
	padding-top:16px;
	padding-bottom:15px;
	text-decoration:none;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 1em;
	line-height:1em;
	font-weight: bold;
	text-align: left;
	background-image:url(../images/portofolio/fleche_bouton_menu.png);
	background-repeat:no-repeat;
	background-position: right top;
	text-shadow: 0 -1px 1px #000;
}

.bouton_menu a:hover {
	color: #FFF;
	text-shadow: 0 -1px 1px #000;
	background-position: right bottom;
}


.bouton_menu a:active {
	color: #70fffe;
}


/* ACCUEIL
--------------------------------------------------------------------------- */
/*//////////////////////////////////////////////////////////////////////////*/
/*///////////////////////////////////////////////////////////////////////////*/
/*///////////////////////////////////////////////////////////////////////////*/

#header_accueil {
	float: none;
	width: auto;
	margin: auto;
	padding: auto;
	height: 200px;
	background-image:url(../images/base/logo_notice.jpg);
	background-repeat: no-repeat;
	background-position: center top;
}

#ombre_sup {
	float: none;
	width: auto;
	margin: auto;
	margin-top:-100px;
	padding: auto;
	height: 47px;
	background-image:url(../images/base/ombre_sup.png);
}

#content {
	float: none;
	width: auto;
	margin: auto;
	padding: auto;

}

/* MENU ACCUEIL
--------------------------------------------------------------------------- */

.bouton_menu_accueil {
	float: none;
	display:block;
	width: 100%;
	height:47px;
	margin: auto;
	padding:auto;
	background-image:url(../images/base/bouton_menu.gif);
	background-position:top;
}

.bouton_menu_accueil:hover {
	background-image:url(../images/base/bouton_menu.gif);
	background-position:center;
}

.bouton_menu_accueil:active {
	background-image:url(../images/base/bouton_menu.gif);
	background-position:bottom;
}

.portfolio, .savoir_faire, .pratique, .contact {
	display:block;
	height:15px;
	color: #b0b0b0;
	padding-right:13px;
	padding-left:13px;
	padding-top:16px;
	padding-bottom:15px;
	text-decoration:none;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 1em;
	font-weight: bold;
	line-height:1em;
	text-align: right;
	background-image:url(../images/base/bouton_menu_Accueil_320px.png);
	background-repeat:no-repeat;
	text-shadow: 0 -1px 1px #000;
}

.portfolio:hover, .savoir_faire:hover, .pratique:hover, .contact:hover  {
	color: #FFF;
	text-shadow: 0 -1px 1px #000;
}

.portfolio:active, .savoir_faire:active, .pratique:active, .contact:active {
	color: #70fffe;
}

.portfolio {
	background-position:13px 0px;
}

.portfolio:hover {	
	background-position:13px -47px;
}

.savoir_faire {
	background-position:13px -94px;
}

.savoir_faire:hover {	
	background-position:13px -141px;
}

.pratique {
	background-position:13px -188px;
}

.pratique:hover {	
	background-position:13px -235px;
}

.contact {
	background-position:13px -282px;
}

.contact:hover {	
	background-position:13px -329px;
}


/* FIN MENU ACCUEIL
--------------------------------------------------------------------------- */

#ombre_inf {
	float: none;
	width: auto;
	margin: auto;
	padding: auto;
	margin-top:-127px;
	height: 47px;
	background-image:url(../images/base/ombre_inf.png);
}

#hachures {
	float: none;
	width: auto;
	margin: auto;
	padding: auto;
	height: 127px;
	background-image:url(../images/base/hachures_footer.png);
}

#footer {
	position:relative;
	display:block;
	float: none;
	margin: auto;
	padding: auto;
	margin-top: -50px;
	width: 100%;
	height: 127px;
	bottom:0;
}

#signature_txt {
	position:absolute;
	left:0px;
	width: auto;
	margin: auto;
	padding: auto;
	height: 127px;
	width: 153px;
	background-image:url(../images/base/signature_txt.png);
	background-position:left bottom;
	background-repeat:no-repeat;
}

#signature_macaron {
	position:absolute;
	right:0px;
	margin: auto;
	padding: auto;
	height: 127px;
	width: 79px;
	background-image:url(../images/base/signature_macaron.png);
	background-position:right bottom;
	background-repeat:no-repeat;
}

/* PORTFOLIO : MENU
--------------------------------------------------------------------------- */
/*//////////////////////////////////////////////////////////////////////////*/
/*///////////////////////////////////////////////////////////////////////////*/
/*///////////////////////////////////////////////////////////////////////////*/


#header {
	position:relative;
	width: auto;
	margin: auto;
	padding: auto;
	height: 47px;
	background-image:url(../images/portofolio/barre_titrage.jpg);
}

.bouton_precedent {
	position:absolute;
	width: 52px;
	height: 32px;
	left: 13px;
	top:8px;
	background-image:url(../images/portofolio/Boutons_barre_titrage.png);
	background-position: left top;
}

.bouton_precedent:hover {
	background-position: left center;
}

.bouton_precedent:active {
	background-position: left bottom;
}

.bouton_home {
	position:absolute;
	width: 52px;
	height: 32px;
	right: 13px;
	top:8px;
	background-image:url(../images/portofolio/Boutons_barre_titrage.png);
	background-position: right top;
}

.bouton_home:hover {
	background-position: right center;
}

.bouton_home:active {
	background-position: right bottom;
}

.titre {
	width: 100%;
	margin: auto;
	padding-top:18px;
	padding: auto;
	color:#dddddd;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 0.9em;
	line-height:0.9em;
	font-weight: bold;
	text-align: center;
}

.sous_titre_menu {
	width: auto;
	height: 27px;
	margin: auto;
	padding-top:17px;
	padding-left:13px;
	color:#ffffff;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 0.9em;
	line-height:0.9em;
	font-weight: bold;
	text-align: left;
	background-image:url(../images/portofolio/barre_sous_titre.gif);
	text-shadow: 0 -1px 1px #164d4d;
}

/* PORTFOLIO : SLIDER
--------------------------------------------------------------------------- */
/*//////////////////////////////////////////////////////////////////////////*/
/*///////////////////////////////////////////////////////////////////////////*/
/*///////////////////////////////////////////////////////////////////////////*/

/* Browser Resets */

.container_slider {max-width: 638px;}
.flex-container a:active,
.flexslider a:active {outline: none;}
.slides,
.flex-control-nav,
.flex-direction-nav {margin: 0; padding: 0; list-style: none;} 

/* FlexSlider Necessary Styles
*********************************/ 
.flexslider {width: 100%; margin: 0; padding: 0;}
.flexslider .slides > li {display: none; height:auto;} /* Hide the slides before the JS is loaded. Avoids image jumping */
.flexslider .slides img {max-width: 100%; display: block;  }
.flex-pauseplay span {text-transform: capitalize;}

/* Clearfix for the .slides element */
.slides:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;} 
html[xmlns] .slides {display: block;} 
* html .slides {height: 1%;}

/* No JavaScript Fallback */
/* If you are not using another script, such as Modernizr, make sure you
 * include js that eliminates this class on page load */
.no-js .slides > li:first-child {display: block;}


/* FlexSlider Default Theme
*********************************/
.flexslider .slides {zoom: 1;}
.flexslider .slides > li {position: relative;}
/* Suggested container for "Slide" animation setups. Can replace this with your own, if you wish */
.flex-container {zoom: 1; position: relative;}

/* Caption style */
/* IE rgba() hack */
.flex-caption {background:none; -ms-filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#4C000000,endColorstr=#4C000000);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#4C000000,endColorstr=#4C000000); zoom: 1;}
.flex-caption {width: 96%; padding: 2%; position: absolute; left: 0; bottom: 0; background: rgba(0,0,0,.3); color: #fff; text-shadow: 0 -1px 0 rgba(0,0,0,.3); font-size: 14px; line-height: 18px;}

/* Direction Nav */
.flex-direction-nav li {margin-top: -23px;}
.flex-direction-nav li a {width: 30px; height: 30px; margin: -40px 0 0; display: block; background:url(../images/portofolio/boutons_slider.png) no-repeat 0 0; position: absolute; top: 50%; cursor: pointer; text-indent: -9999px;}
.flex-direction-nav li a.next {background-position: -30px 0; right: 0px;}
.flex-direction-nav li a.prev {background-position: 0 0; left: 0px;}
.flex-direction-nav li a.next:hover {background-position: -30px -30px;	right: 0px;}
.flex-direction-nav li a.prev:hover {background-position: 0 -30px;	left: 0px;}
.flex-direction-nav li a.disabled {opacity: .3; filter:alpha(opacity=30); cursor: default;}

/* Control Nav */
.flex-control-nav {width: 100%; height:8px; position: absolute; text-align: center; bottom:25px;}
.flex-control-nav li {display: inline-block; zoom: 1; *display: inline; height:8px; width:8px; margin-top: 0; margin-right: 3px; margin-bottom: 0; margin-left: 3px; }
.flex-control-nav li a {width: 8px; height: 8px; display: block; background:url(../images/portofolio/points_slider.png) no-repeat 0 -16px; cursor: pointer; text-indent: -9999px;}
.flex-control-nav li a:hover {background-position: 0 -8px;}
.flex-control-nav li a.active {background-position: 0 0; cursor: default;}

#content h3 {
	width: auto;
	margin: auto;
	margin-top:-60px;
	padding-left: 13px;
	padding-right:13px;
	color:#23a19f;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 0.9em;
	line-height:1.2em;
	font-weight: bold;
	text-align: left;
	text-transform: uppercase;
}

.infosPortofolio {
	width: auto;
	margin: auto;
	margin-top:7px;
	padding-left: 13px;
	padding-right:13px;
	color:#b0b0b0;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 0.85em;
	line-height:1.15em;
	font-weight: normal;
	text-align: left;
}

.infosPortofolio a{
	width: auto;
	margin: auto;
	color:#b0b0b0;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 1em;
	line-height:1.15em;
	font-weight: normal;
	text-align: left;
}

.infosPortofolio a:hover{
	color:#70fffe;
}

.beton_bas_slider{
	background-image:url(../images/portofolio/fond_beton_slider.jpg);
	background-position:center;
	background-repeat:no-repeat;
	height:120px;
	width:auto;
	margin-top:-50px;	
}

.boutons_clients {
	position:relative;
	width:100%;
	height:37px;
	margin-top:45px;
}

.boutons_clients a {
	color:#b0b0b0;
	text-align:center;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 1em;
	line-height:1em;
	font-weight: bold;
	text-decoration: none;
	padding-top:16px;
	padding-bottom:18px;
	display:block;
	width:50%;
	height:13px;
	float:left;
	background-image:url(../images/base/bouton_menu.gif);
	background-repeat:repeat-x;
	background-position:top;
	text-shadow: 0 -1px 1px #000;
}

.boutons_clients a:hover {
	color: #FFF;
	text-shadow: 0 -1px 1px #000;
	background-position: right center;
}

.boutons_clients a:active {
	color: #70fffe;
	background-position: right bottom;
}


#hachures_page_slider {
	float: none;
	width: auto;
	margin: auto;
	padding: auto;
	height: 127px;
	background-image:url(../images/base/hachures_footer.png);
}

/* SAVOIR_FAIRE
--------------------------------------------------------------------------- */
/*//////////////////////////////////////////////////////////////////////////*/
/*///////////////////////////////////////////////////////////////////////////*/
/*///////////////////////////////////////////////////////////////////////////*/

#content_page_standard {
	position:relative;
	float: none;
	width: auto;
	margin: auto;
	padding: auto;
	background-image:url(../images/savoir_faire/fond_beton.jpg);
	background-position: center -57px;
	background-repeat:no-repeat;
}

.carton {
	width: auto;
	height:285px;
	margin-top:30px;
	padding: auto;
	background-image:url(../images/savoir_faire/carton.png);
	background-repeat:no-repeat;
	background-position:center;
}

#content_page_standard h3 {
	width: auto;
	margin: auto;
	margin-top:15px;
	padding-left: 13px;
	padding-right:13px;
	color:#23a19f;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 0.9em;
	line-height:1.2em;
	font-weight: bold;
	text-align: left;
	text-transform: uppercase;
}

#content_page_standard p {
	width: auto;
	margin: auto;
	margin-top:7px;
	padding-left: 13px;
	padding-right:13px;
	color:#b0b0b0;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 0.85em;
	line-height:1.15em;
	font-weight: normal;
	text-align: left;
}

#content_page_standard ul {
	float: none;
	height:auto;
	width: auto;
	padding-left: 13px;
	padding-right:13px;
	list-style-type: disc;
	list-style-position: outside;
}

#content_page_standard li {
	display:list-item;
	width: auto;
	height:auto;
	margin: auto;
	margin-top:7px;
	margin-left:15px;
	color:#b0b0b0;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 0.85em;
	line-height:1.15em;
	font-weight: normal;
	text-align: left;
	list-style-type: disc;
}


#hachures_page_standard {
	float: none;
	width: auto;
	margin: auto;
	margin-top:45px;
	padding: auto;
	height: 127px;
	background-image:url(../images/base/hachures_footer.png);
}


/* PRATIQUE
--------------------------------------------------------------------------- */
/*//////////////////////////////////////////////////////////////////////////*/
/*///////////////////////////////////////////////////////////////////////////*/
/*///////////////////////////////////////////////////////////////////////////*/

.caisse_outils {
	width: auto;
	height:117px;
	margin-top:30px;
	padding: auto;
	background-image:url(../images/pratique/caisse_outils.png);
	background-repeat:no-repeat;
	background-position:center;
}

.telechargement {
	display:block;
	width: 100px;
	height:auto;
	padding-top:50px;
	margin-left:-9px;
	margin-top:7px;
	color:#b0b0b0;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 0.7em;
	line-height:1.1em;
	font-weight: normal;
	text-align: center;
	text-decoration: none;
	background-image:url(../images/pratique/IconePDF.png);
	background-repeat:no-repeat;
	background-position:center top;
	vertical-align: bottom;
}

.telechargement:hover {
	color:#fff;
}

.telechargement :active {
	color:#75fffe;
}

/* Contact
--------------------------------------------------------------------------- */
/*//////////////////////////////////////////////////////////////////////////*/
/*///////////////////////////////////////////////////////////////////////////*/
/*///////////////////////////////////////////////////////////////////////////*/

.avion {
	width: auto;
	height:74px;
	margin-top:30px;
	padding: auto;
	background-image:url(../images/contact/avion.png);
	background-repeat:no-repeat;
	background-position:-130px;
}

.logo_contact {
	width: auto;
	height:49px;
	margin-top:10px;
	padding: auto;
	background-image:url(../images/contact/logo_notice.png);
	background-repeat:no-repeat;
	background-position:6px;
	margin-bottom:13px;
}

.boutons_contact {
	position:relative;
	width:100%;
	height:37px;
	margin-top:25px;
}

.boutons_contact a {
	color:#b0b0b0;
	text-align:center;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 1em;
	line-height:1em;
	font-weight: bold;
	text-decoration: none;
	padding-top:16px;
	padding-bottom:18px;
	display:block;
	width:50%;
	height:13px;
	float:left;
	background-image:url(../images/base/bouton_menu.gif);
	background-repeat:repeat-x;
	background-position:top;
	text-shadow: 0 -1px 1px #000;
}

.boutons_contact a:hover {
	color: #FFF;
	text-shadow: 0 -1px 1px #000;
	background-position: right center;
}

.boutons_contact a:active {
	color: #70fffe;
	background-position: right bottom;
}

#hachures_page_contact {
	float: none;
	width: auto;
	margin: auto;
	margin-top:0px;
	padding: auto;
	height: 127px;
	background-image:url(../images/base/hachures_footer.png);
}

.champ_boutons_contact {
	position:absolute;
	width:1px;
	margin-left:50%;
	margin-top:0px;
	height:47px;
	background-color:#333333;
	background-image:url(../images/contact/champ_boutons_contact_long.png)
}