:root{--vertFonceSCDL:#062d15;--vertClairSCDL:#88cc75;--jauneSCDL:#e9c90f}
@font-face{font-family:altivo;src:url("fonts/altivo-regular.ttf")}
body{margin:0;font-family:altivo,serif;background-color:var(--vertFonceSCDL);font-size:16px;line-height:20px;color:#fff;min-width:320px}
#header{width:100%;height:120px;position:sticky;top:0;color:#fff;z-index:500;background:linear-gradient(var(--vertFonceSCDL),95%,#ffffff00)}
#logo{display:inline-block;margin:5px 50px;transform:scale(0.7);transition:all .5s}
#logo.animate{transform:scale(1)}
#headerMenu{float:right;list-style:none;margin:20px 50px 0 0}
#headerMenu>li{display:inline-flex}
#headerMenu>li>a{color:#fff;text-transform:uppercase;font-weight:700;padding:20px;text-decoration:none;font-size:18px;line-height:40px}
#headerMenu>li>a:hover,#headerMenu>li>a.actif{color:var(--jauneSCDL)}
#headerMenu>li>a:after{content:'';display:block;margin:auto;padding:0 20px;height:2px;width:0;background-color:transparent;transition:width .5s ease,background-color .5s ease}
#headerMenu>li>a:hover:after,#headerMenu>li>a.actif:after{width:25%;background-color:var(--jauneSCDL)}
#contenu{padding:0;text-align:center;margin:auto}
h1{font-size:55px;font-weight:600;line-height:65px;margin:20px auto 20px auto}
h2{font-size:60px;line-height:60px;margin-top:0;text-transform:uppercase}
.chevronH2{width:100px;height:100px;filter:brightness(0) saturate(100%) invert(81%) sepia(24%) saturate(754%) hue-rotate(61deg) brightness(91%) contrast(86%)}
.divClair{padding:32px 16px;background-color:var(--vertClairSCDL)}
#footer{width:calc(100% - 100px);background-color:var(--vertClairSCDL);color:var(--vertFonceSCDL);font-size:13px;line-height:15px;padding:50px 50px 100px 50px;position:sticky;top:0;margin:0;text-align:center}
#footer>ul{padding:0}
#footer>ul>li{display:inline-block;margin:0 10px}
#footer>ul>li>a{background-color:var(--vertFonceSCDL);width:50px;height:50px;display:inline-block;border-radius:26px;cursor:pointer;border:2px solid var(--vertFonceSCDL)}
#footer>ul>li>a>img{width:30px;height:30px;margin-top:10px;filter:brightness(0) saturate(100%) invert(99%) sepia(3%) saturate(2%) hue-rotate(275deg) brightness(114%) contrast(100%)}
#footer>ul>li>a:hover{background-color:#fff}
#footer>ul>li>a:hover>img{filter:brightness(0) saturate(100%) invert(17%) sepia(6%) saturate(4266%) hue-rotate(92deg) brightness(99%) contrast(94%)}
#footer>a{color:#fff}
#footer>a:hover{color:var(--jauneSCDL)}
.smartphoneOnly{display:none}
.desktopOnly{display:inline-block}
#freezer{z-index:1000000;position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,0.2)}
#modal{z-index:1000001;position:fixed;top:0;left:0;width:100%;height:100%;background-color:#f9f9fb;display:none;overflow:auto}
@media screen and (max-width:768px){#header{height:110px}
#logo{margin:10px 20px}
#logo>img{width:120px}
#headerMenu{margin:10px;padding:0}
#headerMenu>li{display:block;padding:0}
#headerMenu>li>a{padding:0 0 5px 0;line-height:20px;display:inline-block}
#headerMenu>li>a:after{margin:0;padding:0}
#headerMenu>li>a:hover:after,#headerMenu>li>a.actif:after{width:100%}
h1{font-size:30px;line-height:35px;padding:0 20px}
h2{font-size:30px;line-height:30px}
.chevronH2{width:30px;height:30px}
#footer{width:calc(100% - 60px);padding:30px}
.desktopOnly{display:none}
}