body{
    font-family: "avantgarde_bk_btbook";
    font-size: 16px;
   background: #eeeeee;
}
a {
    color: #f16523;
    text-decoration: underline;
    transition: all .4s;
}
a:active, a:hover, a:focus {
    color: #000;
    text-decoration: none;
}
 
.image-right {
    float: right;
    margin: 0 0 10px 15px;
}
.image-left {
    float: left;
    margin: 0 15px 10px 0;
}
 
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: 'oswaldlight';
    /*line-height: 1.5em;*/
	 font-weight: normal;
}
h1, .h1{
    font-size:30px;
}
h2, .h2{
    color: #f16523;
    font-size:24px;
}
h3, .h3{
    font-size:23px;
}
h4, .h4{
    font-size:22px;
}
h5, .h5{
    font-size:20px;
}
h6, .h6{
    font-size:20px;
}
 
#content p,#content1 p {
    margin-bottom: 15px;
}
#content ul {
    padding-left: 50px;
    display: inline-block;
}
#content ul li {
    list-style: url(../images/puce.png) outside;
	 line-height: 21px;
}
#content ul ul li{
    list-style: url(../images/puce.png) outside;
}
 
div.cc-cookies {
    width: 100%;
    z-index: 9999 !important;
}
#fancybox-wrap,
#fancybox-wrap *{
    box-sizing: content-box;
}

#content #contactInfo small{
	color:#5b5b5b;
}
.QapTcha .dropError {
    color: #f16523 !important;
    margin-bottom: 10px;
    margin-top: 10px;
}
.QapTcha .dropSuccess{
    margin-right: 10px;
    color: #f16523 !important;
    margin-top: 10px;
}
.contactForm .required {
    color: #f16523 !important;
}

#content .id_comments {
	float: left;
    width: 99.6%;
}

.contactForm .Medium .two-column .text-input {
	width: 219px !important;
}
.contactForm .Medium .text-input {
}
.contactForm .Medium .text-input.zip, .contactForm .Medium .text-input.cents {
	width: 219px !important;
	margin-right:0 !important;
}
.contactForm textarea.text-input {
    height: 55px !important;
    width: 99% !important;
   
}

.private_policy{
	clear: left;
    float: right;
    margin-top: -90px;
    margin-right: 2px;
}
.contactForm .option {
    float: left;
	width:48%;
}
img{
	border:0;
}
.highslideContainer {
    height: 156px !important;
    margin-left: 5px !important;
    margin-top: 13px !important;
    width: 219px !important;
}
.cc-cookies{
    background: #f7941d !important;
	z-index:99 !important;
}
.cc-cookie-accept{
	background:#f16523 !important;
}
#tabT td{
	padding:5px 0;
	border-bottom:1px solid #ccc;
}

/*------------------header-----------------*/
#container{
    width: 1000px;
	margin:0 auto;
    position: relative;
}

header{
	background: url(../images/bg-head.jpg)  repeat-x top center;
    width: 100%;
	position:relative;
	height:523px;
	z-index:100;
}

#slogan_tel{
	 left: 145px;
    position: absolute;
    top: 194px;
}
#slogan_tel h3{
    color: #fff;
    display: inline-block;
    font-family: "avantgarde_bk_btbook";
    font-size: 21px;
    font-weight: normal;
    margin: 0;
    letter-spacing: 4px;
}
#slogan_tel h3 a{
	text-decoration:none;
    color: #fff;
    transition: all 0.4s ease-in-out 0s;
}

#slogan_tel h3 a:hover{
    color: #119387;
}

#logo{
	float: left;
    margin-top: 120px;
    position: relative;
}

#slide{
    height: 688px;
    overflow: hidden;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 10;
}


.fluid_container {
	height: 100%;
	width:100%;
}
.camera_wrap {
	height: 100%;
}
.camera_overlayer{
    background: url(../images/bg-head.png) no-repeat center center/cover;
     height: 688px;
}
#bg_wrapper{
	background:url(../images/bg-wrapper.png) no-repeat bottom center;
    float: left;
    height: 104px;
    margin-top: -97px;
    position: relative;
    width: 100%;
    z-index: 10;
}
.camera_wrap .camera_pag .camera_pag_ul {
    list-style: outside none none;
    margin: -134px auto 0 !important;
    padding: 0 260px 0 0;
    text-align: right !important;
    width: 1000px;
}
.camera_wrap .camera_pag .camera_pag_ul li {
    border-radius: 50% !important;
    cursor: pointer;
    display: inline-block;
    height: 10px !important;
    margin: 20px 3px;
    position: relative;
    text-indent: -9999px;
    width: 10px !important;
}
.camera_wrap .camera_pag .camera_pag_ul li > span {
    border-radius: 50% !important;
    height: 10px !important;
    left: -2px !important;
    overflow: hidden;
    position: absolute;
    top: -2px !important;
    width: 10px !important;
}
.camera_wrap .camera_pag .camera_pag_ul li:hover > span {
    background: #fff none repeat scroll 0 0 !important;
	border:3px solid #fff !important;
}
.camera_wrap .camera_pag .camera_pag_ul li {
    background: none  !important;
	border:3px solid #fff !important;
}

.camera_wrap .camera_pag .camera_pag_ul li.cameracurrent > span {
    background: #fff none repeat scroll 0 0 !important;
	border:3px solid #fff !important;
}


/*------------------End header----------------------*/
#wrapper{
    background: #fff;
    width: 100%;
    overflow: hidden;
	position:relative;
}


/*------------------Content-----------------*/
#content{
    color: #5b5b5b;
    float: left;
    padding:30px 12px 50px 12px;
    min-height: 130px;
    position: relative;
    width:976px;
    z-index: 1000;
}
#content h1 {
   color: #515151;
    font-family: "oswaldlight";
    font-size: 33px;
    font-weight: normal;
    line-height: 31px;
    margin-bottom: 55px;
    position: relative;
    text-align: center;
}
#content h1 .font {
     background: url(../images/bg-h1.png) no-repeat bottom center;
   color: #173a98;
    padding-bottom: 23px;
    font-family: "fontin_sans_rgregular";
    font-size: 44px;
    font-weight: normal;
    position: relative;
}
#content h2{
    margin: 30px 0 10px 0;
}
#content p{
	line-height: 20px;
	padding:5px 0;
}
#content #liste{
	width:100%;
	float:left;
	clear:left;
}
#content #liste li{
    float: left;
	margin-bottom: 11px;
    margin-right: 31px;
    width: 30%;
}

/*------------------End Content----------------------*/


/*------------------box_bas----------------------*/

#box_bas1{
    background: #eeeeee none repeat scroll 0 0;
    color: #fff;
    min-height: 570px;
    overflow: hidden;
    padding: 25px 0;
    position: relative;
    z-index: 10;
}
#construction,#facades,#carrelages{
    background: url(../images/bg-box.png) no-repeat bottom center;
    float: left;
    height: 440px;
    margin-right: 83px;
    padding-bottom: 50px;
    padding-top: 15px;
    position: relative;
    text-align: center;
    width: 268px;
    z-index: 100;
}
#carrelages{
    margin-right: 0;
}
#box_bas1 #img{
    border-radius: 50%;
    border: 8px solid #fff;
}
#box_bas1 h2{
    color: #eeeeee;
    font-family: "oswaldlight";
    font-size: 33px;
    font-weight: normal;
    line-height: 31px;
    text-align: center;
    margin: 35px 0;
    transition: all 0.4s ease-in-out 0s;
}

#construction h2{
    margin: 20px 0;
}
#box_bas1 #voir_plus{
    border: 1px solid #fff;
    color: #fff;
    display: inline-block;
    font-size: 17px;
    margin-top: 20px;
    padding: 6px 15px;
    text-decoration: none;
}
#box_bas1 p{
	padding:0;
    line-height: 18px;
}
#construction:hover ,#facades:hover,#carrelages:hover{
    background: url(../images/bg-box-h.png) no-repeat bottom center;
}
#construction:hover  #voir_plus,#facades:hover #voir_plus,#carrelages:hover #voir_plus{
    color: #222222;
    background: #fff;
}
#construction:hover #img,#facades:hover #img,#carrelages:hover #img{
     border: 8px solid #f16523;
}
#construction .hover img,#facades .hover img,#carrelages .hover img{
	-webkit-transition: all 0.4s ease-in-out;
	-moz-transition: all 0.4s ease-in-out;
	-o-transition: all 0.4s ease-in-out;
	-ms-transition: all 0.4s ease-in-out;
	transition: all 0.4s ease-in-out;
	-webkit-transform: scale(0);
	-moz-transform: scale(0);
	-o-transform: scale(0);
	-ms-transform: scale(0);
	transform: scale(0);
	-webkit-backface-visibility: hidden;
    opacity: 0;
    top: 23px;
    position: absolute;
	left: 17px;
}

#construction:hover .hover img,#facades:hover  .hover img,#carrelages:hover  .hover img{

	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-o-transform: scale(1);
	-ms-transform: scale(1);
	transform: scale(1);
	opacity:1;
    z-index: 1;
}
/*------------------contact----------------------*/

#contact{
    background: url(../images/bg-bas.png)  no-repeat scroll center center / cover ;
    color: #fff;
    float: left;
    height: 450px;
    margin-top: -130px;
    position: relative;
    width: 100%;
    z-index: 100;
}

#contact h2 {
    color: #fff;
    font-family: "oswaldlight";
    font-size:33px;
    font-weight: normal;
    line-height: 34px;
    margin-bottom: 55px;
    margin-top: 150px;
    text-align: center;
    position: relative;
    letter-spacing: 2px;
}

#contact h2 span{
    background: url(../images/bg-h2.png) no-repeat bottom center;
      color: #f16523;
    letter-spacing: 4px;
    font-family: "fontin_sans_rgregular";
    font-size: 44px;
    padding-bottom: 26px;
}
#contact td {
    width: 35.5%;
}
#contact p{
    line-height: 20px;
    padding: 0 0 8px;
	letter-spacing:0.03em;
}
#contact a{
    color: #f16523;
	text-decoration:underline;
}
#contact a:hover{
    color: #fff;
}
.tel2{
    margin-left: 44px;
}
#contact #img{
    float: left;
     margin-bottom: 20px;
    margin-right: 15px;
}

#lien{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1000;
	font-size: 0;
	opacity: 0;
	text-indent: 200%;
	white-space: nowrap;
}

/*------------------Footer----------------------*/
footer{
    border-top: 1px solid #434446;
	margin: 0;
	width:100%;
	clear:both;
    padding-top: 10px;
	min-height:40px;
	z-index:100;
}
#ilike{
    float: left;
}
#proxy{
    width: 1000px;
	clear: both;
    margin: auto;
    min-height: 80px;
}
footer img{
    float: right;
}
#topcontrol{
	z-index:1000;
}
/*------------------End Footer----------------------*/
.footerSlideButton2 {
    color: #000 !important;
    text-decoration: none !important;
}
        
        
.camera_caption {
	display: none !important;
}
 
a#footerSlideButton {
	text-decoration: none;
}

/*------------------RESPONSIVE----------------------*/
a.mobile-nav {
   display:none;
   position: absolute;
   top:5px;
   right: 5px;
   padding-right: 22px;
   line-height: 20px;
   height:20px;
   background: url(../images/nav-icon.png) center right no-repeat;
   z-index:99;
}
        

@media only screen and (max-width : 768px) { 
	a.mobile-nav {
  		display:block;
	}
	a.mobile-nav {
    background-color: #fff;
    height: 50px;
    width: 100%;
    margin: 0;
    padding: 0;
}
	#nav, nav {
   		display: none;
	}
	.sf-menu {
		background: none;
	}
	.mobile-nav span {
    	margin-right: 15px;
    	text-transform: uppercase;
    	font-weight: bold;
		position: absolute;
    	right: 20px;
    	top: 15px;
	}
	a.mobile-nav {
		text-decoration:none;
		color: #173a98;
		position: absolute;
    	top: 0;
    	left: 0;
	}
	.sf-menu > li > a:hover, .sf-menu > li.selected > a,
	.sf-menu > li.active > a, .sf-menu > li.focus > a,
	.sf-menu > li.sfHover > a {
		
	}
	.wrapper {
		width: 100%;
	}
	#content h1 .font {
    	background: none;
	}
	#logo {
	    margin-top: 0px;
		margin: 120px 0 0 10%;
	}
	#logo img {
    	width: 100%;
	}
	#slogan_tel h3 {
		font-size: 20px;
		margin-top: 6px;
	}
	#container {
		width: 100%;
	}
	#slogan_tel {
		left: 27%;
		top: 70%;
	}
	article#content {
		width: 90%;
	}
	aside#construction, aside#facades, aside#carrelages {
		float: none;
		margin: 0 auto;
	}
	section#contact {
		padding:15px;
	}
	#contact td {
		width: 100%;
		float: left;
	}
	
}

@media only screen and (max-width : 668px) { 
	#slogan_tel h3 {
		font-size: 20px;
	}
}

@media only screen and (max-width : 480px) { 
	#slogan_tel h3 {
		font-size: 14px;
	}
}

@media only screen and (max-width : 378px) { 
	#slogan_tel h3 {
		font-size: 12px;
		margin-top: 5px;
	}
}
        
@media only screen and (max-width : 325px) { 
	#slogan_tel h3 {
		font-size: 9px;
	}
}