@charset "UTF-8";
/* CSS Document */

html, body {height:100%;}
html{font-size: 62.5%;}
body{margin: 0 auto;padding: 0;overflow-x:hidden;position: relative;width:100%;background:#fff;font-family: 'Spartan', sans-serif;;font-weight:500;color:#1F354A;transition: all 0.4s ease-in-out;}

.container, .contDemi, .contSml, .content{position:relative;display:block;margin:0 auto;width:100%}
.container{max-width:1400px;}
.contSml{max-width:1000px;}
.contDemi{max-width:600px;}

.padSml{padding:25px;}
.padMedium{padding:40px;}
.padLarge{padding:80px;}

.padVertiSml{padding-top:25px;padding-bottom: 25px;}
.padVertimedium{padding-top:40px;padding-bottom: 40px;}
.padVertiLarge{padding-top:80px;padding-bottom: 80px;}
.padVertiXLarge{padding-top:160px;padding-bottom: 160px;}

.topSml{margin-top:20px}
.topMedium{margin-top:40px}
.topLarge{margin-top:60px}

.bottomSml{margin-bottom:20px}
.bottomMedium{margin-bottom:40px}
.bottomLarge{margin-bottom:60px}


a[href]:not([class]), a{color:inherit;font-weight: bold; text-decoration:none;transition: all ease-in-out .3s;}
a:focus{outline:0;}
a[href^=tel]{color:inherit;text-decoration:none;} 


img{max-width:100%;}
hr{border:none;border-top:1px solid #E3F3F6;margin:40px 0}

.center{text-align:center;} 
.left{text-align:left;} 
.right{text-align:right;} 
.uppercase{text-transform:uppercase;}

.block{display:block;}
.inline{display:inline-block}
.none{display:none;} 

.flt-lf{float:left}
.flt-rg{float:right}
.clear{clear:both;}

.height100{height: 100%;min-height: 100%}
.width100{width:100%}

.centerContentAll{position: absolute;top:50%; left: 50%;transform: translate(-50%, -50%);}
.centerContentY{position: absolute;top:50%;transform: translateY(-50%);}
.centerContentX{position: absolute;left:50%;transform: translatex(-50%);}

.translateUp50{transform:translateY(-50%);margin-bottom: -100px;z-index: 1;}
.translateUp25{transform:translateY(-25%);z-index: 1;}
.translateDown25{transform:translateY(25%);margin-top: -100px;z-index: 1;}


table{border-collapse:collapse}

/* COULEUR */
.blanc{color:#fff;}
.marine{color:#1F354A;}
.bleu{color:#00CCFF;}
.teal{color:#00E8A0;}

.bckBlanc{background:#fff;}
.bckpale{background:#E3F3F6;}
.bckMarine{background:#1F354A;}
.bckBleu{background:#00CCFF;}
.bckTeal{background:#00E8A0;}


.boxShadow{box-shadow: 0 0 5px rgba(0,0,0,0.1)}

/* TEXTE */
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6{line-height:1.4;letter-spacing: -0.6px;}

h1, .h1{font-size:32px;font-weight:900;}
h2, .h2{font-size:28px;font-weight:500;}
h3, .h3{font-size:26px;font-weight:900;}
h4, .h4{font-size:20px;font-weight:500;}
h5, .h5{font-size:18px;font-weight:900;}
h6, .h6{font-size:16px;font-weight:900;}

.hugeTitle{font-size: 40px;font-weight: 900;line-height: 1.2;}


p, li{font-size:14px;line-height:2;margin:25px 0}
p + p{margin:0 0 25px} 
p:first-child{margin-top:0!important}
p.sml{font-size: 12px;}

ol, ul{margin:20px 0 20px 20px}
ul{list-style-type:none;} .center ul{margin:25px 10px}
ul li, ol li{margin:0 0 10px 0px;}
ul li:before{content:" • ";display: inline-block;font-weight:bold;width: 25px;color:#00E8A0;vertical-align: middle;margin-left: -15px}

.bt a{padding:20px 40px;display:inline-block;text-decoration: none; font-weight: 900;transition: all 0.2s ease-in-out;border-radius: 30px;line-height: 1;}



header{width:100%;margin:0;height:100px;z-index:999;background:rgba(255, 255, 255, 0); position: fixed;top: 0;transition: all 0.4s ease-in-out;}
header.sticky{background:rgba(255, 255, 255, 1);box-shadow: 0 0 20px rgba(31, 53, 74, 0.1);}
header.nav-up {top: -200px;}

header .logo{float:left;margin:35px 0 0 40px;width:auto}
header .logo img{position:absolute}

header .logo img.logoBlanc, header .logo img.logoColor{-moz-transition:all 0.4s ease-in-out;transition: all 0.4s ease-in-out;}
header .logo img.logoColor{opacity:0} header.sticky .logo img.logoColor{opacity:1}
header .logo img.logoBlanc{opacity:1} header.sticky .logo img.logoBlanc{opacity:0}


header.sticky .logo{margin-top:20px}
header.sticky .logo img{width:180px}
header.sticky nav ul.smlNav{margin-top:22px}
header.sticky nav ul.mainNav{margin-top:30px}

#navMenu {position:absolute;top:0;right:20px;}
#navMenu li:before{margin:0}
header nav ul{display: block;margin:0}
header nav ul li{display:inline-block;line-height:1!important;margin:0;background:none;font-size: 14px;padding:0 20px}
header nav ul li:last-child{padding:0}
#navMenu ul li:before{content:"";padding:0;width: 0}

header nav .smlNav{margin:30px 40px 0 0;line-height: 1;text-align: right;}
header nav .smlNav li a{font-weight: 500!important;font-size: 12px;}

header nav .smlNav li.zone a{padding: 0;font-weight: 900!important;}
header.sticky nav .smlNav li.zone a{color:#00CCFF;}
header nav .smlNav li.btrdv a{border-radius: 30px;border:2px solid #1F354A;background:#1F354A;padding:10px 20px;color:#fff;font-weight: 900!important;font-size: 10px;margin-left:5px}
header.sticky nav .smlNav li.btrdv a{color:#fff;background:#00CCFF;border-color:#00CCFF}



header nav ul.mainNav {margin:40px 40px 0 0; text-align: right}
header nav ul.mainNav li{margin-left: 50px;}
header nav ul.mainNav li a{font-weight: 800;font-size: 16px;}
header nav ul.mainNav a:after{content:"";width:0;}
header nav ul.mainNav a:hover:after,
header nav ul.mainNav a.active:after{content:"";width: 100%;height: 4px;background: #00E8A0;display: block;margin-top: 10px; -moz-transition: width 0.2s ease-in-out;transition: width 0.2s ease-in-out;}

.page header{background:#fff}
.page header .logo img.logoColor{opacity:1}
.page header .logo img.logoBlanc{display:none}
.page header nav .smlNav li.zone a{color:#00CCFF;border-color: #00CCFF;}


span#menuMob, .closebtn {display:none}

#headhome{position:relative;background:url("../img/slider/fond-slide1.jpg") no-repeat center center / cover ;height:100%;margin:0}
#headhome .centerContentY{max-width: 50%;}
#headhome h1{font-size:55px;font-weight: 900;color:#1F354A}
#headhome h3{font-weight:500;font-size:30px;text-transform: none;}


.home01 {background:url(../img/fond/home-01.jpg) no-repeat left center / cover fixed;padding:200px 0;}
.home02{position:absolute;right: 0;top: 50%; transform:translateY(-50%);}

.serviceHome{background:url(../img/fond/home-services.jpg) no-repeat left center / cover fixed;}
.serviceHome > .content, .fondPropos > .content{position: -webkit-sticky;position: sticky;top: 100px;}
.fondPropos{background:url(../img/fond/apropos-01.jpg) no-repeat left center / cover fixed;}


.diagnostique{margin-top: 200px;}
.diagnostique .col_6.diag{transform:translateY(-25%);margin-bottom: -25%;}


/* PAGE */
.head{height:500px;position: relative;}
.blog .head{height:300px}
.head .content{height:100%;}
.head h1, .head h2{font-size: 55px;margin-top: 100px;}


.firstContentPageRight{background-repeat:no-repeat;background-position:center center;background-size: cover ; background-attachment:fixed;padding:200px 0;margin-left:25%}
.firstContentPageLeft {position:absolute;left: 0;top: 50%; transform:translateY(-50%);}

.fondParallax{background-repeat:no-repeat;background-position:center center;background-size: cover ; background-attachment:fixed;}

.coord a{font-weight: 500!important;}
.coord h6 + p{margin-top:0}


.chroniqueThumb {margin-bottom: 0px;}
.chroniqueList .imgChroniqueList{height:300px;padding:20px;background-repeat:no-repeat;background-size:cover;background-position:center center;background-image:url(../img/fond/head-home.jpg);background-color:#1F354A ;}
.chroniqueList .blocPad{padding:40px;background:#fff;width:90%;float:left;margin-top:-90px;}
.chroniqueList a p{font-weight: 400;}
p.date{margin-bottom:0;font-weight: 900;color:#00E8A0}


.sousNav li a{color:#16222d}
.sousNav ul li a.active{color:#00E8A0;font-weight: 800;}
 p.btretour{line-height:1;text-align:right;font-weight:700; font-size:13px;color:#16222d ;z-index:99;margin-top:10px}
.btretour:before{content:"\276c";padding-right:5px;font-size:14px;margin-top:3px;vertical-align:inherit;display:inline-block;color:#00E8A0}

#shareBtn{border:none;background:#fff  url(../img/picto/facebook.svg) no-repeat center left 10px / 25px auto;padding:20px 0 20px 50px;font-weight: 900;color:#16222d;font-size:14px;font-family: 'Spartan', sans-serif;}

.blogueFiche{transform:translateY(-25%);margin-bottom:-100px}
.blogue .head h1{margin-top:0}

table{width:100%;}
table tr:nth-child(even){background:#E3F3F6}
table tr td{padding:5px}
table tr td:first-child{width:30%;}
table tr td:last-child{width:70%}
table p{margin:0}

iframe#rdv *{background:#fff;font-family: 'Spartan', sans-serif;}

/* FOOTER */
footer{width:100%;background: #1F354A;}
footer h6{color:#00CCFF}
footer img:first-child{margin-right: 20px;}
footer .sml{color:#fff;margin:0;}

.credits  *{margin:0;}
.credits p, .credits a{margin:0;font-size:10px;color:#4C738E!important;}
.credits a{font-size:10px;text-decoration:none;font-weight: normal;padding:2px 5px 0 0;display:block}
.credits a img{margin:-2px 0 0 5px!important;display:inline-block;vertical-align:middle;}


@media only screen and (max-width: 1024px) {

h1, .h1{font-size: 28px;}
h2, .h2{font-size: 26px;}

.hugeTitle{font-size: 36px;}

.diagnostique {margin-top: 0;}
.diagnostique .col_6.diag{transform:translateY(0%);margin-bottom: 0%;}

header .logo{margin:30px 0 0 30px;}
header .logo img{width:180px}
header.sticky{height:80px}
header.sticky .logo{margin-top:15px}
header.sticky .logo img{width:140px}
header.sticky span#menuMob {top:20px}


span#menuMob {position:absolute;right:30px;top:30px;width:40px;height:40px;display:block;background: url("../img/menu-mobile.svg") no-repeat center center / 35px;cursor:pointer}
.open .overlay{width:100%} 
.overlay{height:100%;width:0;position:fixed;z-index:1;top:0;left:0;background: rgba(31, 53, 74, 0.95);overflow-x: hidden;transition: 0.3s;}
.overlay-content {position: relative;top: 15%;width: 100%;text-align: center;}
.overlay .closebtn {display:block;position:absolute;top:10px;right: 30px;font-size: 60px;color:#fff;font-weight: 400;} 

#navMenu nav{position:relative;width:100%;height:100%;}
#navMenu ul {margin:0}
#navMenu ul li{display:block;text-align:right;padding:10px 40px 10px 0;transition: 0.3s;}
#navMenu ul li a{color:#fff;margin:0;font-size: 22px;}
#navMenu li.zone {margin:20px auto}
#navMenu li.zone a {font-size:13px;}

footer h4{font-size: 14px;}

}


@media only screen and (max-width: 768px) {	

 .padSml{padding:20px;}
 .padMedium{padding:30px;}
 .padLarge{padding:60px;}
 
 .topSml{margin-top:15px}
 .topMedium{margin-top:30px}
 .topLarge{margin-top:40px}
     
 .bottomSml{margin-bottom:15px}
 .bottomMedium{margin-bottom:30px}
 .bottomLarge{margin-bottom:40px}
 
    
h1, .h1{font-size:26px;}
h2, .h2{font-size:22px;}
h3, .h3{font-size:20px;}
h4, .h4{font-size:16px;}
h5, .h5{font-size:15px;}
h6, .h6{font-size:13px;}
.hugeTitle{font-size: 32px;}
p, li{font-size:12px;}
p.sml{font-size:10px}


.translateUp50, .translateUp25{max-width: 85%;}
.translateUp50{margin-bottom: -125px;}
.translateUp25{margin-bottom: 0;transform:translateY(-15%);float:right}
.translateDown25{transform:none;margin:0}

#headhome h1{font-size:36px;}
#headhome h3{font-size:22px;}

.head{height:400px}
.head h1, .head h2{font-size: 36px;margin-top: 80px;}


.home02{position:relative;right: 0;top: 0; transform:translateY(-15%);max-width: 85%;margin-bottom: -100px;}
.serviceHome{padding:100px 0}
.diagnostique{text-align:center}

.firstContentPageLeft {position:relative;left: 0;transform:translateY(-15%);max-width: 85%;margin-bottom: -100px;}
.firstContentPageRight{margin-left: 15%;}

footer .col_4.right{text-align:left}
.credits .flt-lf, .credits .flt-rg{float:none;text-align:left;margin:10px 0}

.blogueFiche{transform:translateY(-120px);margin-bottom:-100px}


}


@media only screen and (max-width: 480px) {

.padSml{padding:10px;}
.padMedium{padding:20px;}
.padLarge{padding:60px 40px;}

.topSml{margin-top:10px}
.topMedium{margin-top:20px}
.topLarge{margin-top:30px}
    
.bottomSml{margin-bottom:10px}
.bottomMedium{margin-bottom:20px}
.bottomLarge{margin-bottom:30px}
    
h1, .h1{font-size:20px;}
h2, .h2{font-size:16px;}
h3, .h3{font-size:14px;}
h4, .h4{font-size:12px;}
h5, .h5{font-size:13px;}
h6, .h6{font-size:10px;}
.hugeTitle{font-size: 24px;}
p, li{font-size:11px;}

.bt a{padding:20px 25px;line-height: 1.4;}

header .logo {margin: 20px 0 0 30px;}
header .logo img {width: 130px;}
header.sticky {height: 60px;}
header.sticky .logo img {width: 100px;}
span#menuMob {right: 20px;top: 20px;background-size: 100% 25px;}
header.sticky span#menuMob {right: 20px;top: 15px;width: 30px;height: 30px;background-size: 25px;}

#headhome h1{font-size:26px;}
#headhome h3{font-size:16px;}
#headhome .centerContentY {max-width: 60%;}

.head{height:300px}
.head h1, .head h2{font-size: 26px;margin-top: 60px;}



	

}