@font-face {
	font-family: 'OpenSans';
	src: url('OpenSans.eot?#iefix') format('embedded-opentype'),  url('OpenSans.woff') format('woff'), url('OpenSans.ttf')  format('truetype'), url('OpenSans.svg#OpenSans') format('svg');
	font-weight: normal;
	font-style: normal;
  }

  @font-face {
	font-family: 'OpenSans-Bold';
	src: url('OpenSans-Bold.eot?#iefix') format('embedded-opentype'),  url('OpenSans-Bold.woff') format('woff'), url('OpenSans-Bold.ttf')  format('truetype'), url('OpenSans-Bold.svg#OpenSans-Bold') format('svg');
	font-weight: normal;
	font-style: normal;
  }
	
body {
	 margin:0; 
	 padding:0;
	 width:100%;
	 }

div, td {
	font-family: 'OpenSans';
	margin:0;
	padding:0;
	color:#222222;
	line-height:22px;
	font-size:16px;
	}

a {
	text-decoration:none;
	font-size:16px;
	color: #800000;
	-moz-transition: all 0.5s ease-in-out;
    -webkit-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
	}

a:hover {
	color:#222222;
	}

.clear { 
	clear:both;
	height:0;
	}
	
img {
	 border: none;
     display: block;
     margin: 0 auto;
	 }
	 
h1, h2, h3, h4 {
	margin:0;
	padding:0;
	font-weight: normal;
	}

h1 {
	font-size:36px;
	line-height: 34px;
	color: #000;
	font-weight: normal;
	}	

h2 {
	font-size:28px;
	color: #800000;
	}

	h3{
		font-size: 24px;
		color: #131313;
		padding-bottom: 20px;
	}

p{
	padding: 10px 0;
	margin: 0;
}

*,*:before, *:after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
	}

.center{
	text-align:center;
	}

#pageweb { overflow: hidden; width: 100%;}
.container { margin:0 auto; width: 100%; max-width: 1280px; padding: 0 10px;}

/*TOP*/
#logo-coord{ display: flex; align-items: center; justify-content: space-between; padding-top: 30px; padding-bottom: 30px;}
#logo img{max-width: 100%; height: auto;}
#coord{ display: flex; align-items: center; justify-content: space-between;}
.adr{ background: url(../images/picto_adr.png) left center no-repeat; font-size: 18px; padding-left: 55px; padding-right: 35px; border-right: 1px #dedbdb solid;}
.tel{ background: url(../images/picto_tel.png) left center no-repeat; margin-left: 35px; padding-left: 55px;}
.tel a{ color: #000;}
.tel a:first-child{ font-size: 24px;}
.tel a:last-child{ font-size: 18px;}
.tel a:hover{ color: #800000;}

.mn { background: #800000; position: relative; z-index: 999; margin-bottom: -55px; padding: 0;}
.mn ul { margin: 0; padding: 0; display: flex; justify-content: center;}
.mn ul li { list-style: none; position: relative; z-index: 0;}
.mn ul li::before { content: ""; position: absolute; background: #161616; width: 100%; height: 100%; z-index: -1; left:0; right:0; top: 0; bottom: 0; transform: scaleY(0); transform-origin: 50% 50%; transition-duration: 0.3s;-moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out;-o-transition: all 0.5s ease-in-out;-ms-transition: all 0.5s ease-in-out;transition: all 0.5s ease-in-out;}
.mn ul li:hover::before { transform: scaleY(1); width: 100%;}
.mn ul li a { display: block; font-size: 18px; padding: 50px 25px; color: #fff;}
.mn ul li a::first-letter{ text-transform: uppercase;}

/*JSSOR*/
#bloc-fla{ position: relative;}
#flash{ position: relative; width: 100%;}
.slogan{ position: absolute; z-index: 999; top: 0; left: 0; bottom: 0; right: 0;}
.bloc-slogan{ position: relative; display: flex; align-items: center; flex-wrap: wrap; height: 100%;}
.bloc-slogan-inter{ font-size: 48px; line-height: 72px; text-transform: uppercase; padding-bottom: 20px}
span.inL{ color: #fff; font-size: 22px;}
.jssorl-009-spin img {
	animation-name: jssorl-009-spin;
	animation-duration: 1.6s;
	animation-iteration-count: infinite;
	animation-timing-function: linear;
}

@keyframes jssorl-009-spin {
	from {
		transform: rotate(0deg);}

	to {transform: rotate(360deg);}
}

.jssorb053 .i {position:absolute;cursor:pointer;}
.jssorb053 .i .b {fill:#fff;fill-opacity:0.5;}
.jssorb053 .i:hover .b {fill-opacity:.7;}
.jssorb053 .iav .b {fill-opacity: 1;}
.jssorb053 .i.idn {opacity:.3;}

.jssora093 {display:block;position:absolute;cursor:pointer;}
.jssora093 .c {fill:none;stroke:#fff;stroke-width:400;stroke-miterlimit:10;}
.jssora093 .a {fill:none;stroke:#fff;stroke-width:400;stroke-miterlimit:10;}
.jssora093:hover {opacity:.8;}
.jssora093.jssora093dn {opacity:.6;}
.jssora093.jssora093ds {opacity:.3;pointer-events:none;}
/*JSSOR*/

/*CENTRAL*/
#central {}
.bloc-ttl{ padding-top: 40px; padding-bottom: 40px;}
.ttl{ background: url(../images/picto_ttl.png) left top no-repeat; padding-left: 85px; position: relative;}
.ttl::before,.ttl::after{ content: ''; position: absolute; z-index: 1; border-top: 1px #800000 solid;}
.ttl::before{ top: 35px; left: 40px; width: 85px;}
.ttl::after{ width: 30px; bottom: -30px; right: 50%;}
h1 span{ padding-left: 50px; display: block;}

#corps{ padding-top: 30px; padding-bottom: 50px;}
.txt0{ text-align: center; padding-bottom: 50px;}

#cont1{ display: flex; flex-wrap: wrap; justify-content: flex-end;}
.ph1{ order: 2; width: 100%; max-width: 50%;}
.txt1{ width: 100%; max-width: 640px; padding: 50px 20px; display: flex; align-items: center; background: #131313;}
.bloc-txt1 > div{ color: #fff;}

#cont2{ padding-top: 50px; padding-bottom: 50px;}
.txt2{ text-align: center;}
.txt2 h2{ border-bottom: 1px #800000 solid; padding-bottom: 20px; margin-bottom: 30px;}

#cont3 { background: url(../images/bg_cont2.jpg) top center no-repeat; background-size: cover; padding: 50px 0;}
.cont3-inter{ background: rgba(225,225,225,0.60); padding: 35px 35px 0 35px;display: flex; flex-wrap: wrap; justify-content: center;}
.bloc-cont3{ width: 100%; max-width: 33.33333%; padding-bottom: 50px;}
.bloc-cont3 ul{ padding: 0; margin: 0;}
.bloc-cont3 ul li{ list-style: none; background: url(../images/puce_liste.png) left center no-repeat; padding-left: 30px; width: 100%;}

#cont4{ background: #131313; padding: 50px 0;}
.bloc-cont4 > div{ color: #fff;}
.bloc-cont4 h2{ border-bottom: 1px #4c4c4c solid; color: #fff; padding-bottom: 20px; margin-bottom: 40px; text-align: center;}
.bloc-cont4 ul{padding: 0; margin: 0; display: flex; flex-wrap: wrap; justify-content: center; align-items: center;}
.bloc-cont4 ul li{ list-style: none; width: 100%; max-width: 33.33333%; padding: 0 10px;}
.bloc-cont4 ul li img{ max-width: 100%; height: auto;}

.txt5{ padding-top: 50px;}
.txt5 ul{padding: 0; margin: 0; display: flex; flex-wrap: wrap; justify-content: center;}
.txt5 ul li{ list-style: none; width: 100%; flex-wrap: wrap; max-width: 33.33333%; padding: 0 15px;}
.txt5 ul li img{ max-width: 100%; height: auto;}

/*FOOTER*/
#foot { background: #191919; padding: 40px 0;}
.logo-foot a{ font-family: 'OpenSans-Bold'; color: #fff; font-size: 24px;}
.logo-foot a:hover{ color: #800000;}
.coord-bot{ display: flex; justify-content: space-between; align-items: center; padding: 40px 0;}
.adr-bot{ background: url(../images/picto_adr_bot.png) left center no-repeat; font-size: 18px; color: #fff; padding-left: 60px;}
.tel-bot{ background: url(../images/picto_adr_bot.png) left center no-repeat; padding-left: 60px;}
.tel-bot a{ color: #fff; font-size: 30px;}
.tel-bot a:hover{ color: #800000;}
.mail-bot{ background: url(../images/picto_mail.png) left center no-repeat; padding-left: 60px;}
.mail-bot a{ color: #fff;}
.mail-bot a:hover{ color: #800000;}
.menu{ border-top: #262626 solid 1px; padding-top: 40px;}
.menu ul { margin: 0; padding: 0; display: flex; justify-content: center;}
.menu ul li { list-style: none;}
.menu ul li a { display: block; color: #fff; font-size: 16px; padding: 0 15px;}
.menu ul li a::first-letter{ text-transform: uppercase;}
.menu ul li a:hover{ color: #800000;}
.com {  background: #131313; padding: 30px 0; display: flex; justify-content: center;}

/*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: #131313; border-color: #0073aa; -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;}
/*PLAN D'ACCES*/
.map-google{ width:100%; margin:0 auto; padding-top: 30px;}
.map-google iframe{ margin:0; padding:0; border:none; width:100%; height:500px;}
/*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 #eee;}
#diapo-container .nav-diapo ul li:first-child{ border-top:1px solid #eee;}
#diapo-container .nav-diapo ul li a{ display:block; padding:10px 0 10px 5px; text-transform:uppercase; color: #131313;}
#diapo-container .nav-diapo ul li.link-play a, #diapo-container .nav-diapo ul li a:hover{ background:#800000; color:#fff;}
#diapo-container .nav-diapo ul li a:hover{ opacity:0.8;}
.nav-diapo{ width:30%; float:left;}
#diapo-inner{ width:68%; float:right;}
.nav-diapo .link-disable{ cursor:not-allowed; opacity:0.4;}
@media screen and (max-width: 767px){
	#smartnav{ display:block;}
	#nav{ display:none;}
	}

#smartnav{ display:none;}

/*RESPONSIVE*/
@media only screen and (max-width:1919px){}
@media only screen and (max-width:1679px){}
@media only screen and (max-width:1599px){}
@media only screen and (max-width:1439px){}
@media only screen and (max-width:1365px){}
@media only screen and (max-width:1359px){
	.mn { margin: 0;}
	.txt1{max-width: 50%; padding: 50px 10px;}
}
@media only screen and (max-width:1279px){
	.mn ul li a{ font-size: 16px;}
	.menu ul li a{ font-size: 14px; padding: 0 10px;}
}
@media only screen and (max-width:1151px){
	.mn ul li a{ font-size: 15px; padding: 50px 15px;}
	.bloc-slogan-inter{ padding-bottom: 0;}
}
@media only screen and (max-width:1059px){}
@media only screen and (max-width:1023px){
	#smartnav{display: block;}
	.mn,.menu{ display: none;}
	#logo-coord{ flex-wrap: wrap; justify-content: center;}
	#logo{ width: 100%; max-width: 100%; text-align: center;}
	#coord{padding-top: 20px;}
	.txt5 ul li{ padding: 0 5px;}
	.logo-foot { text-align: center;}
	.coord-bot{padding: 40px 0 0 0;}
}
@media only screen and (max-width:979px){}
@media only screen and (max-width:899px){
	h1{ font-size: 27px;}
	h2{ font-size: 23px;}
	h3{ font-size: 21px;}
	#cont1{ flex-wrap: wrap;}
	.ph1,.txt1{ max-width: 100%;}
	.txt1{ padding: 30px 10px;}
	.ph1 img{max-width: 100%; height: auto;}
	.cont3-inter{ padding: 35px 10px 0 10px;}
	.adr-bot{ font-size: 14px; padding-left: 45px;}
	.tel-bot{ padding-left: 45px;}
	.mail-bot{ padding-left: 45px;}
}
@media only screen and (max-width:799px){
	div{ font-size: 14px;}
	.bloc-slogan-inter{ font-size: 28px; line-height: 42px;}
	.bloc-cont3 h3{ font-size: 19px;}
	.bloc-cont3 ul li{font-size: 14px;}
	.coord-bot{ flex-direction: column;}
	.tel-bot{margin: 5px 0;}
	#diapo-container .nav-diapo ul li a{ font-size: 14px;}
}
@media only screen and (max-width:767px){
	.nav-diapo,#diapo-inner { width: 100%; float: none;}
}
@media only screen and (max-width:719px){
	.ttl{ padding-left: 40px;}
	h1{ font-size: 23px;}
	h2{ font-size: 20px;}
	#corps,.txt0{ padding-bottom: 30px;}
	#cont2 { padding-top: 30px; padding-bottom: 30px;}
	.bloc-cont3{ max-width: 50%;}	
	#cont4,#foot { padding: 30px 0;}
	.txt5{ padding-top: 30px;}
	.coord-bot { padding: 20px 0 0 0;}
}
@media only screen and (max-width:639px){}
@media only screen and (max-width:599px){
	.adr{ border: none; padding-right: 0;}
	.bloc-ttl{ padding-top: 30px; padding-bottom: 30px;}
	.ttl { padding-left: 0; background: none;}
	.ttl::before, .ttl::after{ display: none;}
	h1 span{padding: 0;}
	#corps{ padding-top: 0;}
}
@media only screen and (max-width:532px){
	#coord{ flex-wrap: wrap; justify-content: center;}
	.tel{ margin-top: 10px;}
	.slogan{ position: inherit; background: #800000; padding-bottom: 10px;}
}
@media only screen and (max-width:479px){
	.bloc-cont3 { max-width: 100%;}
	.bloc-cont4 ul li,.txt5 ul li{max-width: 100%; padding: 10px 0;}
}
@media only screen and (max-width:359px){
	.bloc-slogan-inter { font-size: 20px; line-height: 27px;}
	span.inL { font-size: 18px;}
	.form-group{ font-size: 13px;}
}