/*DI*/


/* CAVIAR AND DREAMS */

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

}



body{margin:0; padding:0;text-align:left; font-family:Helvetica, Sans-serif; overflow-x:hidden;}
#page #top, #central_home, #footer, header nav, header nav #nav-metiers {max-width:1200px; width:100%; margin:0 auto;}

/*********************************** Font styles : titres en Raleway, txt en Arial ************************************************/

h1 {font-family:Raleway, Helvetica,Sans-Serif; font-size:30px; margin-top:0; }

h2 {font-family:Raleway, Helvetica,Sans-Serif; font-size:30px; margin-top:0; border-bottom:1px solid #dadada; color:#9e0f35;}
h3 {font-family:Raleway, Helvetica,Sans-Serif; font-size:20px; margin-top:10px; border-bottom:1px solid #dadada; margin-bottom:8px; color:#474747;}
a  h3:hover {color:#9e0f35; text-decoration:none !important;}
#right_home a:hover {color:#9e0f35; text-decoration:none !important;}
/*h3 span{color:#555555;}*/

a{color:#474747; text-decoration:none; }
#page a:hover{color:#555555; text-decoration:underline;}

a img{border:0;}

/*************************      HEADER           ****************************/


header{height:160px; background-image:url('../img/bg_header.png'); position:fixed; top:0px; margin:auto; z-index:1000; width:100%;text-align:left; }

/** NAV SITES**/
header #nav-sites li  #img-di{ width:165px;}
header #nav-sites { height:93px; border:1px solid transparent; max-width:1200px; background-image:url('../img/header.png'); background-repeat: no-repeat; }
header #nav-sites ul { padding-left:25px;}
header #nav-sites li{float:left;  list-style-type:none; margin-top:30px; margin-right:12%;}
header #nav-sites  #di {margin-top:5px;}
header #nav-sites  #dg {margin-top:15px;}
header #nav-sites  #at{margin-right:0;}
header #nav-sites a span{ font-family:Arial, Helvetica,Sans-Serif; font-size:13px; color:#fff; text-transform:uppercase; text-decoration:none; list-style-type:none; opacity:0.6; 
/* transition couleur*/
-webkit-transition-property: color;	
-webkit-transition-duration: .5s;
-webkit-transition-timing-function: ease-out;
-moz-transition-property:color;
-moz-transition-duration: .5s;
-moz-transition-timing-function: ease-out;
transition-property: color;
transition-duration: .5s;
transition-timing-function: ease-out;}
header #nav-sites a:hover {opacity:1; } 
header #nav-sites  #di a{ opacity:1; }


header #nav-sites  #ddg, header #nav-sites  #dcr, header #nav-sites #dad, header #nav-sites #dat { z-index:10; position:fixed; top:-350px; text-align:center;
z-index:10; border-radius: 50%;	width: 300px; height: 300px; border: 6px solid; 
background: rgb(255,255,255); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(255,255,255,1) 49%, rgba(201,201,201,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(49%,rgba(255,255,255,1)), color-stop(100%,rgba(201,201,201,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 49%,rgba(201,201,201,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(255,255,255,1) 49%,rgba(201,201,201,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(255,255,255,1) 49%,rgba(201,201,201,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(255,255,255,1) 49%,rgba(201,201,201,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#c9c9c9',GradientType=0 ); /* IE6-9 */

	}

header #nav-sites ul li p {font-size:15px; font-family: Helvetica, Arial, sans-serif; margin-top:0px;}
#ddg img, #dcr img, #dad img, #dat img{margin-top:45px;}
	
	header #nav-sites  #ddg{border-color: #e2001a; margin-left:-80px;}
	header #nav-sites  #dcr{border-color: #ed7703; left:45%;}
	header #nav-sites  #dad{border-color: #0081c6; margin-left:-90px;}
	header #nav-sites  #dat{border-color: #32a42c; margin-left:-130px;}
/* animation : descente des blocs lors du hover*/
header #nav-sites  #ad:hover #dad, #dg:hover #ddg, #at:hover #dat, #cr:hover #dcr{
top:10px !important; 
-webkit-transition-property: top;
-webkit-transition-duration: .5s;
-webkit-transition-timing-function: ease-out;
-moz-transition-property:top;
-moz-transition-duration: .5s;
-moz-transition-timing-function: ease-out;
transition-property: top;
transition-duration: .5s;
transition-timing-function: ease-out;

}



/** NAV METIERS**/

header #nav-metiers {height:60px; width:100%; max-width:1200px;}

header #nav-metiers #nav-metiers-table{
height: 60px;
float: left;
position: fixed;
width: 990px;
padding-left:1%}
header #nav-metiers #nav-metiers-table div{ font-weight:bold; padding-top:12px; text-align:left; float:left;height:35px;cursor:pointer; margin-right:7%;font-size:18px; font-family:Raleway, sans-serif; color:#7e7f83; text-transform:uppercase;}
header #nav-metiers #nav-metiers-table div:last-child{margin-right: 0%;}











header #nav-metiers #nav-metiers-table  div.active { color:#9e0f35; }
header #nav-metiers #nav-metiers-table  div:hover { color: #9e0f35;}
header #nav-metiers #nav-metiers-table  a:hover{text-decoration:none; color:#000;}
header #nav-metiers #nav-metiers-resp {display:none;}
/*PARTIE CONTACT*/
header #nav-metiers a #nav-contact,header #nav-metiers a #nav-tel2 { height:54px; float:right; color:#fff; font-size:12px; text-transform:uppercase; padding-top:5px; text-align:center;

-webkit-transition-property: background-color;
-webkit-transition-duration: .5s;
-webkit-transition-timing-function: ease-out;
-moz-transition-property:background-color;
-moz-transition-duration: .5s;
-moz-transition-timing-function: ease-out;
transition-property: background-color;
transition-duration: .5s;
transition-timing-function: ease-out;


}

header #nav-metiers a:hover #nav-contact { background-color:#f2668b; }
header #nav-metiers a:hover #nav-tel2{ cursor:default; }
header #nav-metiers a #nav-contact {background:#9e0f35; width:80px; }
header #nav-metiers #nav-tel2 {display:block; background:#ababab; float:right; height:100%; width:130px;}
header #nav-metiers #nav-tel2 img{padding:0 7px;}
header #nav-metiers #nav-tel {display:none;}


 


/*************************      PAGE           ****************************/
#page {background-image:url('../img/bg_top.jpg'); background-repeat:repeat-x; text-align:center; margin-top:155px; color:#474747}

.page_in {background-image:none !important; padding-top:20px;}

/********      TOP-PAGE           *******/

#page #top{height: 430px; border:2px solid transparent; background-image: url('../img/top.png'); background-repeat:no-repeat; background-position: top center;}

#page #top #top_deco{float:right; margin-right:10px;padding-right:5px; width:45%; height:400px; }
#page #top #top_deco  #tv {height:95px; padding-top:30px; text-align: right; margin-right: 50px;}
#page #top #top_deco  #tv img {height:80px; width:auto;}
#page #top #top_deco  #mobilier {margin-top:-120px;}



#page #top #top_txt{vertical-align:middle; width:47%; min-width: 300px;padding:0; height:170px; margin:45px 40px 20px 2%; text-align:left; color:#fff;}
#page #top #top_txt h1{text-shadow: 1px 1px #166012; font-weight:normal;}
#page #top #top_txt p {font-size:14px; opacity:0.8; text-align:justify;}
#page #top #top_txt p b {}
#page #top #top_txt a {font-family:Raleway, Arial, Sans-serif; color:#fff; font-size: 15px;}


/* make keyframes that tell the start state and the end state of our object */
@-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }

#page #top #top_txt h1, #page #top #top_txt p, #page #top #top_numbers{
	opacity:0;  /* make things invisible upon start */
	-webkit-animation:fadeIn ease-in 1;  /* call our keyframe named fadeIn, use animattion ease-in and repeat it only 1 time */
	-moz-animation:fadeIn ease-in 1;
	animation:fadeIn ease-in 1;

	-webkit-animation-fill-mode:forwards;  /* this makes sure that after animation is done we remain at the last keyframe value (opacity: 1)*/
	-moz-animation-fill-mode:forwards;
	animation-fill-mode:forwards;

	-webkit-animation-duration:1s;
	-moz-animation-duration:1s;
	animation-duration:1s;
		
}

#page #top #top_txt h1{-webkit-animation-delay: 0.2s;
-moz-animation-delay: 0.2s;
animation-delay: 0.2s;}

#page #top #top_txt p{-webkit-animation-delay: 0.8s;
-moz-animation-delay:0.8s;
animation-delay: 0.8s;}

#page #top #top_numbers{-webkit-animation-delay: 1.2s;
-moz-animation-delay:1.2s;
animation-delay: 1.2s;}


#page #top #top_numbers { width:47%; min-width: 300px;padding:0; height:150px; margin:0px 40px 0; text-align:center; color:#fff; }
#page #top #top_numbers .number { float:left; 	border-radius: 50%;  height:85px; width:100px; border:6px white solid; text-align:center; background: #c7c8ca;background: rgba(255,255,255,0.5); padding-top:15px; margin-top:4%; margin-right:5%;} 
#page #top #top_numbers  #n3{margin-right:0;}


#page #top #top_numbers .number {font-family:Raleway, Helvetica,Sans-Serif; font-size:30px; color:#fff;  }
#page #top #top_numbers .number span{color:#9e0f35;}
#page #top #top_numbers .number hr{margin:0 2px;}
#page #top #top_numbers .number p {font-size:15px; color:#535353; margin-top:5px; text-shadow:none;}


/********      CENTAL-PAGE           *******/

#page #central_home {position:relative; }

.in h1 { border-bottom:1px solid #dadada; color:#9e0f35; text-transform:uppercase;}


.in h2 {text-transform: uppercase; font-size: 20px; margin-right: 100px; color:#474747; border-bottom:none;}
/** CONTENT **/
#page #central_home #content_home{width:67%; text-align:left; padding:0 4% 0 2%;  font-size:14px; min-height:700px;}
#page #central_home #content_home img { height:auto; max-width:100%;}
#page  #central_home.in #content_home h2{text-transform:uppercase; font-size:20px;margin-right:100px;}
#page #central_home #content_home p a {font-weight:bold; text-decoration:underline;}
#page #in {margin-top:200px;}

#page #central_home #content_home ul li span{color: #9e0f35; font-weight:bold; font-family: Raleway; text-transform:uppercase; font-size:17px;}
#page #central_home #content_home ul li {margin-bottom: 20px; }




#page #central_home #content_home.glossaire {margin-left:30px; width:60%;}
.partenaire {float:left; width: 33%; text-align:center; height:35px; }
.partenaire img{display:block; margin: auto; max-width:90% }


/** RIGHT COLUMN */
#page #central_home #right_home {position:absolute; top:0; right: 20px;
width:22%; max-width: 300px; border-left:1px solid #dadada;  text-align:left; padding:0 0 0 4%; 
}

#page #central_home #right_home.right_in{background-color:#fff; padding-left:40px;}


#page #central_home #right_home section{margin-top:25px;  font-size:11px; }
#page #central_home #right_home #avis_home img{width:100%; height:auto; max-width:193px;}

#page #central_home #right_home  #actus_home {margin-top:35px;}
#page #central_home #right_home  #actus_home article {background-color:#fbfbfb; padding:5px; line-height:11px; margin-bottom:2px; height:100%;}
#page #central_home #right_home  #actus_home article img {float:left; margin: auto 10px auto auto; height:70px; background:#fff;}
#page #central_home #right_home  #actus_home article a {font-weight:bold; }
#page #central_home #right_home  #actus_home article b {color:#000; }
#page #central_home #right_home  #actus_home article a:hover {color:#9e0f35; text-decoration:underline;}
#page #central_home #right_home  #actus_home article  .plus{color:#000; text-decoration:underline; font-size:8px;}
#page #central_home #right_home  #actus_home article  .date{color:#9e0f35; text-transform:uppercase; font-weight:bold; letter-spacing:1px; }
#page #central_home #right_home  #actus_home .voir_tout {margin-top:5px;  }
#page #central_home #right_home  #actus_home .voir_tout img{vertical-align:-30%; margin-right:5px;}



#page #central_home #right_home  #dg_home {margin-top:10px; text-align:center; min-height:100px;}
#page #central_home #right_home  #dg_home a:hover{text-decoration:none; color:inherit;}
#page #central_home #right_home  #dg_home h3{margin-top:0; text-align:justify;}
#page #central_home #right_home  #dg_home ul li{text-align:left; list-style: url(../img/bullet-at.png); margin-top:0px; font-weight:bold;}
#page #central_home #right_home  #dg_home ul{ float:left; margin-top: 0; padding-left: 25px;  line-height:15px;}
#page #central_home #right_home  #dg_home p{margin-top:0; text-align:justify;}
#page #central_home #right_home  #dg_home img{float:left;}

#page #central_home #right_home #contact {text-transform:uppercase; text-align:center;}
#page #central_home #right_home #contact h3 {text-transform:none; text-align:left;}

#page #central_home #right_home #contact img{vertical-align:-10%; height:20px; margin-right:5px;}
#page #central_home #right_home #contact a {color: #ffffff; font-size:18px; text-decoration:none; }

#page #central_home #right_home #contact .contact-button {
	-moz-box-shadow:inset 0px 1px 0px 0px #fce2c1;
	-webkit-box-shadow:inset 0px 1px 0px 0px #fce2c1;
	box-shadow:inset 0px 1px 0px 0px #fce2c1;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #f49417), color-stop(1, #f1820b) );
	background:-moz-linear-gradient( center top, #f49417 5%, #f1820b 100% );
	background-color:#faa331;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:1px solid #eeb44f;
	display:inline-block;
	color:#ffffff;
	font-family:arial;
	font-size:15px;
	font-weight:bold;
	padding:6px 24px;
	text-decoration:none;
	text-shadow:1px 1px 0px #cc9f52;
	font-family:Raleway, Arial, Sans-serif;
}
#page #central_home #right_home #contact .contact-button:hover {
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #f1820b), color-stop(1, #faa331) );
	background:-moz-linear-gradient( center top, #f1820b 5%, #faa331 100% );
	background-color:#f1820b;
}
#page #central_home #right_home #contact .contact-button:active {
	position:relative;
	top:1px;
}

#page #central_home #right_home #contact .contact-number{color:#474747; font-size:14px; }

#page #central_home #right_home #reseaux img{margin-right:15px;}

#page #central_home #right_home #reseaux a:hover img{opacity:0.7;}






#nav-bottom-content {text-transform:uppercase; font-family:Raleway, arial, sans-serif; margin-top:20px; float:left;}
#nav-bottom-content td:first-letter {color:#9e0f35;} 
#nav-bottom-content  img {vertical-align:-15%;}
#mobilier_boite img{width:100%; height:auto; max-width:1400px; text-align:center; margin:auto; margin-bottom:-24px; overflow:hidden;}


#adresse {margin-bottom:50px;}
#adresse p {font-size:18px; }
#adresse a:hover img {opacity:0.8;}
#adresse table  {padding-top:20px; float:left}
#adresse table img{opacity:0.5}

#adresse-responsive {display:none;}


form #formulaire input {width:40%;}
form #formulairetextarea{width:100%;}

/** contact **/

#page #content_home.contact table {margin:0 auto; width:50%}
#page #content_home.contact  #contact-adresse, #page #content_home.contact  #contact-tel {width:90%; font-size:20px; padding:20px; background:#f3f3f3; -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px; margin: 30px 0;}

  h1#f {margin-top: 50px;}

#page #central_home #right_home #gmaps a:hover img{opacity:0.7;}
#page #central_home #right_home #gmaps a img{width:100%; max-width:270px;}
#page #central_home #right_home #ad { margin-top:10px;}
#page #central_home #right_home #ad p{ font-size: 17px; line-height: 20px;}
#page #central_home #right_home #tel-fax{ font-size: 17px;}
#page #central_home #right_home #tel-fax img{vertical-align:-30%;}

			/** formulaire de contact**/
#page #content_home.contact #formulaire{ padding: 15px 2.5%; margin:0 auto; margin-top:50px; width:95%; border: 6px solid #f3f3f3; -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px; 
background: #f5f5f5; /* Old browsers */
background: -moz-linear-gradient(top, #f5f5f5 0%, #c3c3c3 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f5f5f5), color-stop(100%,#c3c3c3)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #f5f5f5 0%,#c3c3c3 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #f5f5f5 0%,#c3c3c3 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #f5f5f5 0%,#c3c3c3 100%); /* IE10+ */
background: linear-gradient(to bottom, #f5f5f5 0%,#c3c3c3 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5f5f5', endColorstr='#c3c3c3',GradientType=0 ); /* IE6-9 */}		
			
#page #content_home.contact #formulaire fieldset {width:55%;}
#page #content_home.contact #formulaire .label {width:20%; float:left; font-family:Raleway, Helvetica, sans-serif; font-size: 16px; color:#000000; text-transform:uppercase; text-align:right; margin-right:2.5%}
#page #content_home.contact #formulaire .label #last {margin-left:5%;}
#page #content_home.contact #formulaire .label span {color:red;}
#page #content_home.contact #formulaire input[type="text"], #page #content_home.contact #formulaire select, #page #content_home.contact #formulaire textarea {font-size:13px; padding-left:5px; height:20px; float:left; width:70%; margin-bottom:20px;  -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; border:1px solid #c3c3c3;} 
#page #content_home.contact #formulaire select {float:none;}
#page #content_home.contact #formulaire textarea {width:70%; height:auto; padding: 10px 5px; font-size:13px; font-family: Arial;}
#page #content_home.contact #formulaire input[type="submit"] {font-family: Raleway, Helvetica, sans-serif; text-transform:uppercase; font-size:18px;}
#mentions {text-align: justify; font-size: 13px; }
#mentions h3 {margin-bottom:10px;}

/** CAS CLIENTS **/
.cas-clients {margin-top:70px; position:relative;}
.cas-clients h2.cc {}

.imgcc:after {content:"after";}
.imgcc{border: 3px solid #bebebe; }

.cas-clients .cc-visu {background-color: #ebebea; border: 1px solid #e0e0e0; height: 90px; padding: 2.5% 0; padding-left: 5%; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;
background: rgb(251,250,250); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(251,250,250,1) 0%, rgba(235,235,234,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(251,250,250,1)), color-stop(100%,rgba(235,235,234,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(251,250,250,1) 0%,rgba(235,235,234,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(251,250,250,1) 0%,rgba(235,235,234,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(251,250,250,1) 0%,rgba(235,235,234,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(251,250,250,1) 0%,rgba(235,235,234,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fbfafa', endColorstr='#ebebea',GradientType=0 ); /* IE6-9 */
}
.visu { position: relative; height: 100%; width:20%; float:left; min-width:80px; margin: 0 5.5%;}
.zoom { position: absolute; top: 25%; left: 35%;  width:30%;}

.visu a img.imgcc { width:100%; }


.schema { max-width:700px; width: 100%; margin-left:5%; display:block; margin: 0 auto;}
/*************************      FOOTER           ****************************/

footer{margin-top:20px;text-align:left; background:#24731f; color:#fff; padding-left:5%}
footer a:hover{text-decoration:underline;}
footer{margin-top:20px;text-align:left; background:#772138; color:#fff; padding-left:5%}
footer #footer h2{font-size:20px; font-family:Raleway, helvetica, sans-serif; color:#ffffff; text-transform:uppercase; border-bottom:none; margin-bottom:10px;}
footer #footer div {width:20%; max-width:400px; float:left; padding-top:10px;  text-align:left; margin-right:20%;}
footer #footer div:last-child {margin-right:0; }
footer #footer li a{padding-left: 5px; font-size:12px; color:#fff; opacity:0.8; list-style:none; }
footer #footer ul {padding-left:10px; line-height:20px; margin-top:0px; text-align:left; list-style: url(../img/bullet-cr.png);}
footer #footer li {list-style: url(../img/bullet-at.png);}
footer #footer ul hr {opacity: 0.2;}
/* Basic jQuery Slider essential styles */

ul.bjqs{position:relative; list-style:none;padding:0;margin:0;overflow:hidden; display:none;}
li.bjqs-slide{position:absolute; display:none;}
.bjqs img{width:100%;}
ul.bjqs-controls{ display:none; list-style:none;margin:0;padding:0;z-index:9999;}
ul.bjqs-controls.v-centered li a{position:absolute;}
ul.bjqs-controls.v-centered li.bjqs-next a{right:0;}
ul.bjqs-controls.v-centered li.bjqs-prev a{left:0;}
ol.bjqs-markers{display:none; list-style: none; padding: 0; margin: 0; width:100%;}
ol.bjqs-markers.h-centered{text-align: center;}
ol.bjqs-markers li{display:inline;}
ol.bjqs-markers li a{display:inline-block;}
p.bjqs-caption{display:block;width:96%;margin:0;padding:2%;position:absolute;bottom:0;}