@font-face {
    font-family: 'Comfortaa';
    src: url('Comfortaa-Light.woff2') format('woff2'),
        url('Comfortaa-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Comfortaa';
    src: url('Comfortaa-Bold.woff2') format('woff2'),
        url('Comfortaa-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'Comfortaa';
    src: url('Comfortaa.woff2') format('woff2'),
        url('Comfortaa.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

body { margin:0; padding:0;width:100%;}
div, td{font-family: 'Comfortaa';margin:0;padding:0;color:#000; line-height:22px;font-size:14px; font-weight: normal;}
a {font-family: 'Comfortaa';font-weight: normal;text-decoration:none;font-size:14px;color: #3da639;	-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:#000;}
.clear { clear:both;height:0;}	
img { border: none; display: block; margin: 0 auto;}
h1, h2, h3, h4 {margin: 0; padding:0;}
h1 {font-family: 'Comfortaa';font-weight: 300;font-size:30px;line-height: 34px;color: #000;}
h1::first-letter{color: #3da639; font-size: 60px;}
h2 {font-family: 'Comfortaa'; font-weight: bold;font-size:20px;color: #3da639; border-bottom: #3da639 1px solid; margin: 10px 0; padding-bottom: 10px;}
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: 1360px; padding: 0 15px;}

/*TOP*/
#top {}
#cont-top{ padding-top: 35px; padding-bottom: 35px; display: flex; justify-content: space-between;}
.coord-top{ display: flex; align-items: center;}
.adresse{ border-right: 1px #b5b1b1 dashed; padding-right: 50px;}
.adr{ background: url(../images/adresse.png) no-repeat left center; font-size: 14px; line-height: 18px; padding-left: 60px;}
.adr a{display: block; color: #3da639; font-size: 16px; padding-top: 6px;}
.adr a:hover{ color: #000;}
#logo img{ max-width: 100%; height: auto;}
.telephone{padding-left: 50px;}
.bat-clean{ width: 100%; border: 2px #3da639 solid; text-align: center; padding: 10px; border-radius: 20px;}
.bat-clean a{ font-size: 14px; line-height: 16px; color: #3da639;}
.bat-clean a:hover{ color: #000;}
.tel{ background: url(../images/tel.png) no-repeat center left; padding-left: 60px; min-height: 55px; display: flex; align-items: center;}
.tel a{ color: #000; font-size: 30px; line-height: 30px; font-weight: bold;}
.tel a:hover{ color: #3da639;}

.bloc-menu{ background: #000;}
.menu {}
.menu ul { margin: 0; padding: 0; display: flex; justify-content: center;}
.menu ul li{ list-style: none; position: relative; z-index: 0;}
.menu ul li::before { content: ""; position: absolute; background: #fff; width: 100%; height: 100%; z-index: -1; left:0; right:0; top: 0; bottom: 0; transform-origin: 0 50%; transform: scaleY(0); 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;}
.menu ul li:hover::before { transform: scaleY(1); width: 100%;}
.menu ul li a{ display: flex; align-items: center; height: 80px; font-size: 14px; padding: 0 10px; color: #fff;}
.menu ul li a:hover { color: #000;}
.menu ul li a span{text-align: center;}
.menu ul li a span:first-letter{ display: block; text-transform: uppercase;}

#bloc-fla{ position: relative;}
.bloc-slogan{ position: absolute; z-index: 200; top: 0; right: 0; bottom: 0; left: 0;}
.slogan{ position: relative; display: flex; flex-direction: column;align-items: center; justify-content: center;height: 100%; padding-bottom: 50px;}
.contact-top{ padding-bottom: 90px;}
.bloc-slg{ color: #fff; font-size: 18px; background: rgba(61,166,57,0.95); padding: 20px;}

/*JSSOR*/
#flash { width:100%; height:540px; overflow:hidden; position:relative;}
.anim { width:1360px; position:relative; left:50%; margin-left:-680px;}
.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 {}
.ttl{ padding-top: 60px; text-align: center;}
#corps{ padding: 60px 0;}

#section1{ display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; padding-bottom: 60px;}
.txt1{ width: calc(100% - 575px); padding-right: 90px;}
.txt1 ul{ margin: 0; padding: 0;}
.txt1 ul li{ list-style: none; background: url(../images/etoile.png) no-repeat left top; padding-left: 25px;}
.ph1{ width: 575px;}

#section2{ background: #ecebeb; padding-bottom: 60px;}
.bloc-sec2{ display: flex; justify-content: space-between; flex-wrap: wrap; align-items: center;}
.sec2-l{ width: 700px;}
.sec2-ltop{ display: flex; justify-content: space-between; align-items: center;}
.sec2-photo{ width: 350px;}
.sec2-photo img{ opacity: 1;-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;}
.sec2-photo img:hover{ opacity: 0.7;}
.sec2-txt{ width: calc(100% - 350px); color: #3da639;font-size: 30px; text-transform: uppercase; text-align: center;}
.sec2-r{ width: calc(100% - 700px); padding-left: 90px;}
.sec2-r ul{ margin: 0; padding: 0;}
.sec2-r ul li{ list-style: none; background: url(../images/etoile.png) no-repeat left top; padding-left: 25px;}

#section3{ background: url(../images/bg3.jpg) no-repeat center top; background-size: cover; padding: 60px 0;}
.sec3{ display: flex; align-content: center; justify-content: center;}

#section4{ background: #ecebeb; padding: 60px 0;}
.bloc-sec4{ display: flex; justify-content: space-between; flex-wrap: wrap; align-items: center;}
.sec4-l{ width: calc(100% - 700px); padding-right: 90px;}
.sec4-r{ width: 700px;}
.sec4-rtop{ display: flex; justify-content: space-between; align-items: center;}
.sec4-photo{ width: 350px;}
.sec4-photo img{ opacity: 1;-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;}
.sec4-photo img:hover{ opacity: 0.7;}
.sec4-txt{ width: calc(100% - 350px); color: #3da639; font-size: 30px; text-transform: uppercase; text-align: center;}

#section5{ width: 100%; max-width: 1250px; display: flex; justify-content: space-between; flex-wrap: wrap;}
.sec5{ width: 100%; max-width: 33.333%; padding: 30px;}
.sec5-top{ background: #3da639;color: #fff; font-size: 16px; line-height: 18px; text-align: center; padding: 0 10px; min-height: 50px; display: flex; justify-content: center; align-items: center;}
.sec5-bot img{ max-width: 100%; height: auto; opacity: 1;-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;}
.sec5-bot img:hover{ opacity: 0.7;}

#section6{ background: #ecebeb; padding: 60px 0;}
.bloc-sec6{ display: flex; justify-content: space-between; flex-wrap: wrap; align-items: center;}
.txt6{ width: calc(100% - 575px); padding-left: 90px;}
.ph6{ width: 575px;}

#section7{ background: #ecebeb; padding: 60px 0;}
.bloc-sec7{ display: flex; justify-content: space-between; flex-wrap: wrap; align-items: center;}
.txt7{ width: calc(100% - 575px); padding-right: 90px;}
.ph7{ width: 575px;}

#section8{ display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; padding-top: 60px;}
.txt8{ width: calc(100% - 575px); padding-left: 90px;}
.ph8{ width: 575px;}

.part-lien{ padding-bottom: 60px;}
.part-lien ul{ margin: 0; padding: 0; display: flex; justify-content: center; align-content: center;}
.part-lien ul li{ list-style: none; width: 100%; max-width: 33.3333%; padding: 0 20px;}
.part-lien ul li a{ display: flex; height: 100%; align-items: center; justify-content: center; border: 1px solid #3da639; text-align: center; font-size: 35px; line-height: 25px; padding: 0 10px;}
.part-lien ul li a:hover{ background: #3da639; color: #fff;}
.part-lien ul li img{ max-width: 100%; height: auto;}

li.lien-supp { display: flex; align-items: center;}
.cont-page{ max-width: 1024px; margin: 0 auto;}

/*FOOTER*/
#footer { background: #000; padding: 50px 0;}
.cont-foot {}
.entreprise ul{ margin: 0; padding: 0; display: flex; justify-content: space-between; flex-wrap: wrap;}
.entreprise ul li{ list-style: none; width: 100%; max-width: 25%; padding: 0 30px; text-align: center;}
.entreprise ul li p,.entreprise ul li p a{ margin: 0; padding: 30px 0 0 0; font-size: 16px; line-height: 16px; color: #fff;}
.entreprise ul li p a:hover{ color: #3da639;}
.entreprise ul li img{ max-width: 100%; height: auto;}

.coord-foot{ display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; padding: 60px 0; border-bottom: #4e4e4e solid 1px;}
.trait-foot,.trait-foot a,.zone-foot{ color: #fff; font-size: 16px; line-height: 20px;}
.trait-foot p,.zone-foot p{ font-weight: 300;font-size: 18px; color: #3da639; text-transform: uppercase;}
.trait-foot a:hover{ color: #3da639;}
.zone-foot{ max-width: 300px;}

.link{ padding: 60px 0; border-bottom: #4e4e4e solid 1px;}
.link ul { margin: 0; padding: 0; display: flex; justify-content: center; flex-wrap: wrap;}
.link ul li { list-style: none;}
.link ul li a { display: block; color: #fff; font-size: 14px; padding: 10px 20px; text-transform: uppercase; text-align: center;}
.link ul li a:hover{ color: #3da639;}
.com { padding-top: 30px; 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: #3da639; 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;}
/*LIVRE*/
.pj-ratings-input-field {
    overflow: hidden;
    margin-bottom: 1em;
    position: relative;
}
.pj-ratings-input-field .pj-ratings-input-container {
    float: left;
}
.pj-ratings-input-container:not(:checked) > input {
    position: absolute;
    overflow: hidden;
    clip: rect(0 0 0 0);
    height: 1px;
    width: 1px;
    margin: -1px;
    padding: 0;
    border: 0;
}
.pj-reviews-form #respond label {
    margin-bottom: .5em;
}
.pj-ratings-input-container:not(:checked) > label {
    float: right;
    width: 24px;
    height: 24px;
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    cursor: pointer;
    margin-right: 2px;
    position: relative;
}
.pj-ratings-input-container:not(:checked) > label:before {
    content: ' ';
    display: block;
    width: 24px;
    height: 24px;
    background: url(../images/icon-star.png) 0 0;
}
/*PLAN D'ACCES*/
.map-google{ width:100%; margin: 30px auto 0 auto;}
.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:#131313; color:#fff;}
#diapo-container .nav-diapo ul li a:hover{ opacity:0.8;}
.nav-diapo{ display: none;}
#diapo-inner{ width:70%; margin: 0 auto;}
.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:1359px){
	.menu ul li a{ font-size: 14px;}
}
@media only screen and (max-width:1279px){
	.menu ul li a{ text-align: center; line-height: 18px;}
	#corps,#section4,#footer{ padding: 40px 0;}
	#section1,#section2{ padding-bottom: 40px;}
	.txt1{ padding-right: 40px;}
	.bloc-sec2,.bloc-sec4{ justify-content: center;}
	.sec2-l,.sec4-r{ order: 2; padding-top: 40px;}
	.sec2-r,.sec4-l{ width: 100%; order: 1; padding: 0;}
	.sec5{ padding: 15px;}
	.coord-foot{ padding: 60px 0 40px 0;}
	.link{ padding: 20px 0;}
	.link ul li a{ padding: 5px 10px; font-size: 14px;}
	#diapo-inner{ width: 80%;}
}
@media only screen and (max-width:1151px){
	.slg{ font-size: 20px; padding: 20px;}
	.txt1{ width: 100%; padding: 0;}
	.ph1{ width: 100%; padding-top: 30px;}
	.ph1 img{ max-width: 100%; height: auto;}
	.part-lien { padding-bottom: 30px;}
	#section6,#section7{ padding: 30px 0;}
	#section8{ padding-top: 30px;}
	.txt6,.txt8{ padding-left: 30px;}
	.txt7 { padding-right: 30px;}
	#diapo-inner{ width: 90%;}
	}
@media only screen and (max-width:1059px){
	.part-lien ul li a{ font-size: 25px; line-height: 20px;}
	.ph6,.ph7,.ph8{ width: 100%; padding-top: 30px; order: 2;}
	.ph6 img,.ph7 img,.ph8 img{ max-width: 100%; height: auto;}
	.txt6,.txt7,.txt6,.txt8{ padding: 0; order: 1; width: 100%;}
}
@media only screen and (max-width:1023px){
	#smartnav{display: block;}
	.link,.bloc-menu{ display: none;}
	#flash{height: auto;}
	.anim{width: 100%; left: 0;margin-left: 0;}
	#diapo-inner{ width: 100%;}
}
@media only screen and (max-width:979px){
	.contact-top { padding-bottom: 40px;}
}
@media only screen and (max-width:899px){
	#cont-top{ flex-wrap: wrap;justify-content: center;}
	#logo{ width: 100%; padding-bottom: 30px;}
	.bloc-slg {  text-align: center;}
	#corps,#section4, #footer,#section3 { padding: 30px 0;}
	#section2{padding-bottom: 20px;}
	#section3{ background: #3da639; background-size: 100%;}
	.sec3{ width: 100%; max-width: 30%;}
	.sec3 img{ max-width: 100%; height: auto;}
	.logo-foot{ display: none;}
	.part-lien ul li{ padding: 0 10px;}
}
@media only screen and (max-width:799px){
	.sec5 { padding: 8px;}
	.entreprise ul li{ padding: 0 15px;}
	.coord-foot{ padding: 30px 0;}	
}
@media only screen and (max-width:767px){
	.bloc-slogan{ position: inherit;}
	.slogan{padding-bottom: 0;}
	.slg{ position: relative; background: #3da639; padding: 20px 0; font-size: 17px; text-align: center; width: 100%;}
	.slg::before,.slg::after{ content: ''; background: #3da639; position: absolute; z-index: 1; top: 0; height: 100%; width: 100%;}
	.slg::before{ right: 100%;}
	.slg::after{ left: 100%;}
	.sec2-photo,.sec4-photo{ width: 100%; max-width: 50%;}
	.sec2-photo img,.sec4-photo img{ max-width: 100%; height: auto;}
	.sec4-txt,.sec2-txt{ width: 100%;}
	.part-lien ul li a{ font-size: 20px; line-height: 16px;}
}
@media only screen and (max-width:719px){
	#cont-top{ flex-direction: column; align-items: center;}
	.mail{ text-align: center;}
	.telephone{ padding-top: 20px;}
}
@media only screen and (max-width:639px){
	.coord-foot{ flex-direction: column; text-align: center;}
	.zone-foot{ padding-top: 25px; max-width: 320px;}
	.part-lien ul li a { font-size: 18px; line-height: 14px;}
}
@media only screen and (max-width:599px){
	.coord-top{flex-direction: column;}
	.adresse { border-right: none; padding-right: 0;}
	.telephone { padding: 20px 0 0 0;}
	.bloc-slg{font-size: 14px;}
	.ttl{ padding-top: 40px;}
	h1{ font-size: 25px;}
	h1::first-letter { font-size: 50px;}
	.sec5{ max-width: 50%;}
	.part-lien ul{ flex-wrap: wrap;}
	.part-lien ul li{ max-width: 50%; padding: 10px; min-height: 100px;}
}
@media only screen and (max-width:532px){
	.ttl{ text-align: left;}
	.sec3 { max-width: 40%;}
}
@media only screen and (max-width:479px){
	h1 { font-size: 21px; line-height: 24px;}
	h2{ font-size: 16px;}
	.sec4-txt, .sec2-txt{ font-size: 20px;}
	.sec5 { max-width: 100%; padding: 10px 0;}
	.entreprise ul li{ max-width: 50%; padding: 15px;}
}
@media only screen and (max-width:359px){}