@import 'config';
@import 'mixin';



/* ----------------------------------
/* ------------ ENTETE ----------
------------------------------------- */

*, *:after, *:before {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
body{background:$bg-body;@include no-marge;@include full-size;}
div,td{@include general-font($primary-color,$primary-size,$primary-lineheight,$primary-font); @include animation;}
a{
	text-decoration:none;color:$link-color;@include animation;
	&:hover{
		color: $yellow;
		text-decoration: none;
	}
}
img{ border:none;display:block;margin:0 auto;}
p{padding:10px 0;margin:0;}
h1,h2,h3,h4{font-weight:normal;@include no-marge;}

h1{
	
	color:$titre1;
	font-size:40px;
	font-weight: 700;
	line-height: 40px;
	text-align: center;
	padding: 25px 0;
}
h2{color:$titre2;font-size:30px;font-weight: 700;padding: 10px 0;}
h3{
	color:$titre3;font-size:20px;font-weight: 600;padding: 10px 0;
}
ul h3{display:inline;}
address,menu{@include no-marge;font-style:normal;}
input[type="text"],input[type="email"],input[type="tel"],input[type="mobile"],input[type="fax"],input[type="password"],textarea,select{font-family: Trebuchet MS,Tahoma,sans-serif,Verdana;font-size: 13px;color:#3C3F3B;max-width: 100%;width: 100%;border:1px solid #2F2F2F;display: inline-block;background: $white;}
@include menu-nav;
@include photos;

.none{ display:none;}
.center,#center{text-align: center;}
.url{ display:inline-block;}
.num{ font-size:16px; font-weight:500; display:inline-block;}
.clearfix:after{ content:""; display:table; clear:both;}
.container{@include container($container-size,$container-marge);}
#smartnav{ display:none;}

.hiddenNav{display:none;}
.visibleNav{ display:initial;}

#pageweb{
	margin: 0 auto;
	max-width: 1920px;
	overflow: hidden;
	width: 100%;
}

/* ----------------------------------
/* ------------ HEADER ----------
------------------------------------- */
#site{margin: 0 auto; max-width: 1920px; overflow: hidden; width: 100%;}







/* ----------------------------------
/* ------------ CORPS ----------
------------------------------------- */
#central{
	
}
.top-central{
	.bloc-nav{ 
		display: flex;
		align-items: center; 
		flex-direction: row-reverse;
		justify-content: space-between; 
		padding:5px 0;
		.page-nav{
			.breadcrumb{
				background: transparent;
				border: none;
				font-size: 12px;
				margin: 0;
				padding: 0;
			}
		}
	}
}

#corps{
	
	min-height: 400px;
}




/*CONTACT*/
.form-group{ margin:0 0 10px 0;}
.form-group label, .form-group input.form-input, textarea.form-textarea{ width:99%; display:block; margin:0 auto;}
input[type="text"],textarea,select{ padding:8px 5px; margin:8px 0; display:inline-block; border:1px solid #ccc; border-radius:4px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;}
.btn-form{ margin:10px 0 0 0;}
.btn-submit-1, .btn-submit-2{  background: $grey;; border-color: $yellow; -webkit-box-shadow: inset 0 1px 0 rgba(120,200,230,.5),0 1px 0 rgba(0,0,0,.15); box-shadow: inset 0 1px 0 rgba(120,200,230,.5),0 1px 0 rgba(0,0,0,.15); color: #fff; text-decoration: none; width:200px; padding: 10px 16px; font-size: 15px; border:1px; border-radius:2px; -webkit-border-radius:2px; -moz-border-radius:2px; margin:10px 0 0 0; cursor:pointer; text-transform:capitalize;}
.alert-is-requierd{color: $yellow;}
.cont-contact{
	background: $brown;
	div{
		color: $white;
	}
}

/*==============*/
/* Plan d'accès */
/*==============*/

#divGoogleMap { text-align: center;width: 100%; }
#googleMap {border: 0px;width: 100%;height: 500px;}
.map-google iframe{ margin:0; padding:0; border:none; width:100%; height:100%;}

/*REALISATIONS*/
#diapo-container{}
p.titre-diapo{ text-transform:uppercase; font-weight:bold;}
#diapo-container ul, #diapo-container ul li{ margin:0; padding:0; list-style:none;}
#diapo-container .nav-diapo ul li { border-bottom:1px solid $yellow;}
#diapo-container .nav-diapo ul li:first-child{ border-top:1px solid $yellow;}
#diapo-container .nav-diapo ul li a{ display:block; padding:10px 0 10px 5px; text-transform:uppercase;}
#diapo-container .nav-diapo ul li.link-play a, #diapo-container .nav-diapo ul li a:hover{ background:$brown; color:$yellow;}
#diapo-container .nav-diapo ul li a:hover{ opacity:0.8;}
#diapo-container .nav-diapo ul{ padding-left:5px;}
.nav-diapo{ width:28%; float:left;}
#diapo-inner{ width:70%; float:right;}
.nav-diapo .link-disable{ cursor:not-allowed; opacity:0.4;}



/* ----------------------------------
/* ------------ FOOTER ----------
------------------------------------- */

#footer{
	
}



/* ----------------------------------
/* ------------ RESPONSIVE ----------
------------------------------------- */

//@include respond-to(small) {
    //.element {
      //color: $white;
    //}
//}


@include resp(533){
   /* ----------------------------------
	/* ------------ A NE PAS TOUCHER ----------
	------------------------------------- */
	.pp_pic_holder{width:calc(100% - 20px)!important;left:10px!important; right: 10px;}
	.ppt{width: 100%!important;}
	.pp_content{width: 100%!important;height: auto!important;}
	.pp_hoverContainer{width: 100%!important;height: auto!important;}
	div.pp_default .pp_content_container .pp_details{width: 100%!important;}
	#pp_full_res{padding-right: 5px;}
	#pp_full_res img{max-width: 100%; height: auto!important;width: 100%!important;} 
}

@include resp(360){
   .contact-form{padding: 0 5px 20px;}
	.formulaire-contact {
        label{max-width: inherit; width: auto;}
        input{display: block; max-width: 100%; margin: 0 auto;}
    } 
}