/*@font-face { font-family: "Nunito" ; src: url("../fonts/Nunito-Regular.ttf"); font-display:swap;  format("opentype")  }*/
:root {
  --main-green: #6fc56d; --main-orange: #ed8858; --main-red: #ed5858;
  --color-footer: #ed5858;  --color-txt-footer: #000; --color-primary: #62c6c6; --color-secondary: #FFD000;
  --color-txt: #fff;  --color-txt-primary: #fff; --color-txt-secondary: #000; --color-fond-zone: #1A1A1A;  --color-fond-card: #141414;
  --width-fond: 1728;  --height-fond: 8099;
  --font-title: "Bowlby One", cursive, monospace, sans-serif; --font-subtitle: "K2D", cursive, monospace, sans-serif;
  --font-txt: "Nunito", cursive, monospace, sans-serif;
}
/*LIBRARY*/
html { height: 100%; font-size: 100%;  }
body { height: 100%; max-width: 100%; background: black; color: var(--color-txt); overflow-y: scroll; overflow-x: hidden; -webkit-font-smoothing: antialiased; }
* {position: relative;list-style: none; text-decoration: none; border: none; }
*, *::before, *::after {box-sizing: border-box; margin:0; padding:0;}
#containerMain { 
    background: url(../../ged/img/On_soccupe_de_tout.svg) 10% 70%, url(../../ged/img/fondStar.svg) left top; 
    background-size: 25%, cover; background-repeat: no-repeat, no-repeat; background-attachment: scroll, fixed;/* min-height: calc(100vw * var(--height-fond) / var(--width-fond) );*/ }
/*@media screen and (max-width: 1400px){ #containerMain { background-repeat: no-repeat, repeat;  } }*/
#lxfpHardOffer { background:  url(../../ged/img/Tube1.svg) right 25%, url(../../ged/img/Tube2.svg) right 82%, url(../../ged/img/TubeGauche.svg) left 55%; 
           background-size: 40%, 30%, 40%; background-repeat: no-repeat, no-repeat, no-repeat;  }

.formMsgEnd { position: fixed; margin-top: -50px; text-align: center; top: 0; left: 0; width: 100%; padding: 10px; z-index: 999; justify-content: center; animation: messageEphemere 5s linear 1; }
#mailOk, #msgOk{ background: var(--main-green);}#mailErreur, #msgErreur{ background: var(--main-red); }#mailNOk, #msgNOk{ background: var(--main-orange);}
@keyframes messageEphemere { from { margin-top: -50px; } 10% { margin-top: 0; } 90% { margin-top: 0; } to { margin-top: -50px;  }}
@-webkit-keyframes messageEphemere {from { margin-top: -50px; } 10% { margin-top: 0; } 90% { margin-top: 0; } to { margin-top: -50px;  }}
.etiquette { border: solid 1px white; padding: 2px 15px; margin: 0 5px; }
.invisibleHr { width: 100%; color: transparent; background: transparent; border: none; }

body, a, input, h3, h4, h5, h6 { font-family: var(--font-txt); color: white; }
h1 { font-family: var(--font-title); font-weight: 100; }
h2 { font-family: var(--font-subtitle); font-size: 250%; }
h3 { font-family: var(--font-subtitle); font-size: 220%; }
h4 { font-weight: bold; font-size: 120%; }
p, span { font-size: 20px; }
img { max-width: 94%; }
h1 b, h2 b, h3 b {color: var(--color-secondary); } 
h1 i, h2 i, h3 i {color: var(--main-red); font-size: 180%; font-style: normal; font-family: var(--font-title); } 

.w100 { width: 100%; max-width: 100%; }.w80 { width: 80%; max-width: 92vw; }.w60 { width: 60%; max-width: 92vw; }.w50 { width: 46%; max-width: 92vw; }.w40{ width: 40%; max-width: 92vw; min-width: 300px; }.w30{ width: 30%; max-width: 92vw; }
.w800px { width: 800px; max-width: 92vw; }.w700px { width: 700px; max-width: 92vw; }.w300px { width: 300px; max-width: 92vw; }.w500px { width: 500px; max-width: 92vw; }
.minw100 { min-width: 100%; }
.maxw900 { max-width: 900px; } @media (max-width: 1240px){ .maxw900 { width: 92vw; max-width: 92vw; } }
.maxw1200 { max-width: 1200px; } @media (max-width: 1240px){ .maxw1200 { width: 92vw; max-width: 92vw; } }
.minh700px { min-height: 700px; }
.margintb15px { margin: 15px 0; }
.marginl5px { margin-left: 5px; } .marginl5 { margin-left: 5vw; }
.margint10px { margin-top: 10px; } .margint30px { margin-top: 30px; } .margint5vh { margin-top: 5vh; } .margint50px { margin-top: 50px; } .margint100px { margin-top: 100px; } .margint10vh { margin-top: 10vh; } .margint15vh { margin-top: 15vh; }
.marginb15px { margin-bottom: 15px; } .marginb30px { margin-bottom: 30px; } .marginb5vh { margin-bottom: 5vh; } .marginb10vh { margin-bottom: 10vh; }
.padding10vh { padding: 10vh 0; } .padding20vh { padding: 20vh 0; } .paddingCard { padding: 10px 2%; } .paddingb15vh { padding-bottom: 15vh; } .paddingb20vh { padding-bottom: 20vh; } .paddingb40vh { padding-bottom: 40vh; }
.paddingr30px { padding-right: 30px; }
.textalignr { text-align: right; } .txtcenter{ text-align: center;} .bold { font-weight: bold; }.autosautligne { white-space: pre-line; }
h2.w100, h3.w100, div:not(.notification) > p.w100, #fullp30 ul, #fullp40 ul { max-width: 90vw; margin-left: auto; margin-right: auto; }
.footer { position:relative;text-align:center;margin:auto;background: var(--color-footer);padding: 10vh 0;color: var(--color-txt-footer);}.footer a { color: var(--color-txt-footer); font-weight:bold; }
.arrowReturn { position: fixed; bottom: 15px; right: 15px; padding-top: 4px; font-size: 90%; border-radius: 10px; background: var(--color-txt-footer); z-index: 9999; width: 40px; height: 40px; }.arrowReturn a { margin: 0; padding: 0; color: var(--color-txt); }.iArrowReturn {font-size: 180%; }
.button { background: var(--main-red); color:#fff; border-radius: 4px; padding: 10px 20px; margin-left: 5px;margin-right: 5px; }
.button.is-black { background: #000; color: #fff;}
.button.is-primary { background: var(--color-primary); color:var(--color-txt-primary); }
.button.is-secondary { background: var(--color-secondary); color:var(--color-txt-secondary); }

input[type=text], input[type=number], input[type=date], input[type=tel], input[type=email], .input {
    height: 40px;    padding-left: 15px; border: 2px solid #1992BA; border-radius: 4px; 
}
video { height: auto; max-width: 100%; }
.imgPlay { all: unset;    cursor: pointer;    margin: auto;    margin-top: 16%;    width: 175px;}

/* GESTION SCROLL  */
.scroll::-webkit-scrollbar { height: 17px; background-color: #F5F5F5; border-radius: 10px;}
.scroll::-webkit-scrollbar-thumb { border-radius: 10px; -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3); background-color: #808080; }
.scroll::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3); border-radius: 10px; background-color: #F5F5F5; }

html::-webkit-scrollbar { height: 12px; }
html::-webkit-scrollbar-thumb { border-radius: 10px; -webkit-box-shadow: inset 0 0 10px rgba(255, 255, 255, 0.1); background-color: #808080; }
html::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 15px rgba(252, 243, 243, 0.8); background-color: #c9c2c2; }



/* OPTIONS FLEXBOX */
.flex{ display: flex; margin: auto;}.flexnoauto{ display: flex;}
.flexremplissage > div, .flexremplissage > a, .flexremplissage > label{ flex: 1 1 auto;}
.flexinput > label { width : 30%; min-width: 400px;}.flexinput > .control {width: 70%; min-width: 400px;}
.flexinput > .control > .color { }
.flexligne{flex-flow: row wrap;}.flexwrap{flex-wrap: wrap;}.flexlignenowrap{flex-direction: row;}
.flexcolonne{flex-flow: column wrap;}.flexcolonnenowrap{flex-direction: column;}
.flexauto > div{  margin: auto; }
.flexend{ justify-content: flex-end;}.flexcenter{justify-content: center;}.flexbetween{justify-content: space-between;}.flexaround{justify-content: space-around;}.flexeven{justify-content: space-evenly;}
.flexalignstart{ align-items: flex-start;}.flexalignend{align-items: flex-end;}.flexaligncenter{align-items: center;}
.itemflexalignstart{align-self: flex-start;}.itemflexalignend{align-self: flex-end;}.itemflexaligncenter{align-self: center;}.itemflexremplissage{align-self: stretch;}
/* FIN FLEX */


/* CODE SPECIFIQUE */
#header { position: fixed; top: 0; width: 100%; z-index: 999; }
#logo { height: 75px; }
#navsc_navprimary { display: flex; flex-flow: row wrap; align-items: center; justify-content: space-between; padding: 0 3vw 0 3vw; }
#navsc_navprimary a:last-of-type { padding: 5px 15px; border: solid 2px white; border-radius: 15px; font-family: var(--font-title); }

.notification { height: 60px; padding: 15px; background: #292929; overflow: hidden; overflow-x: auto; }
.notification p { min-width: 1500px !important; overflow-x: auto; }
.notification b { font-family: 'Momo Trust Display', var(--font-title); color: #808080; font-size: 200%; margin-top: -12px; }
.notification i { font-style: normal; color: #fff; margin-top: -6px; }
.notification i > b { color: var(--color-secondary); font-size: 150%; }
#fullp00 { height:100vh; background: url(../../ged/img/courbeHaut.svg) left 87%, url(../../ged/img/TubeGauche.svg) left 0; 
           background-size: 100%, 63%; background-repeat: no-repeat, no-repeat; }
#fullp00 .fp-scrollable { display: flex; flex-flow: row wrap; }
#divh1a0 { width: 500px; max-width: 90%; }
#imgIntro { width: 500px; max-width: 70vw; }
#titleIntro { width: 870px; max-width: 94%; font-size: 330%; }
#divh1b0 { margin-top: 5vh; padding-left: 5vw; }
#divh1b0 u, #divh1b0 i { font-size: 80%; }
#divh1b0 u { font-family: var(--font-subtitle); }

.labelproof { margin-right: 20px; }
.bubble { height: 50px; width: 50px; border-radius: 50%; margin-top: -10px; background: white; object-fit: contain; margin-left: -12px; }

#fullp20 .fp-tableCell, #fullp20 .fp-scrollable { display: flex;flex-flow: row wrap;justify-content: center; align-content: center; }
.card { background: var(--main-red); border-radius: 7px; margin: 15px; padding: 15px 4px; width: 400px; max-width: 90vw; }
.card:first-of-type { background: var(--color-secondary); }
.card:nth-child(3) .button { background: var(--color-secondary); color: #000; font-weight: bold; }
.card h4, .subcard p { color: #000; }
.subcard { background: #fff; border-radius: 15px; margin: 15px 0; padding: 15px 4px; } 
.subcard p span { margin-bottom: 10px; }
.card:first-of-type h3 { color: #000; }
.productprice b { font-weight: bold; font-size: 200%; padding: 0 15px; border-radius: 4px; background: #000; color: #fff; }
.card:nth-child(3) .productprice b { color: var(--color-secondary); }

#fullp30 ul { padding: 0 2vw; }

#fullp30 li, #fullp40 li { margin-bottom: 10px; }

#fp-nav ul li a span, .fp-slidesNav ul li a span { background: white; }

@media (max-width: 830px){ #imgIntro { max-height: 60vh; width: auto; } }

@media (min-width: 1436px){  
    #titleIntro { width: 870px; max-width: 94%; font-size: 270%; }                 
}
@media (max-width: 1385px){
    #socialproof0 { margin-top: 10vh; }
    #fullp20 h2 { padding-top: 20vh; }
    .section:nth-child(n+2) .fp-scrollable > div { padding-top: 30vh; padding-bottom: 30vh; }
    #titleIntro { text-align: center;    font-size: 230%;    width: 94%;    margin: -15px auto 10vh auto; }
}
@media (max-width: 1229px), (orientation:portrait){  
    .w300px { max-width: 100%; }  
    .centerTxt { order: 99; padding-top: 10px; max-width: 90%; }
    #divh1a0 { order: 1; } #divh1b0 { order: 0; margin-top: 5vh; }
    .title h2 {color: rgb(215, 18, 18);}
    #section { background-position-y: 25%, 30%, 72%, 85%, 87%, 20%, 100%, 85%; }
    .padding10vh { padding: 5vh 0;} .padding20vh { padding: 10vh 0;}
}
@media (min-width: 1220px) and (max-width: 1500px){ 
    
}
@media (min-width: 1220px) { 
    
}
@media (min-width: 831px) and (max-width: 1300px){  
   
}
@media (max-width: 870px), (orientation:portrait){ 
    #fullp20 h2 { padding-top: 50vh; }
    #fullp40 h2 { padding-top: 9vh; }
    .section:nth-child(n+2) .fp-scrollable > div { padding-top: 20vh;  padding-bottom: 40vh; }
    #fullp20 .fp-scrollable > div { padding-top: 100vh; }
    #fullp20 .card { max-width: 90vw; margin: 3vh auto;  }
    #fullp30 a { margin-bottom: 20vh; }
    .notification { height: 80px; }
    .w50, .w40 { width: 100%; } 
    .w50, .w80, #titlez3, #titlez4a, #titlez4b { margin: auto; }
    #imgIntro { max-height: 50vh; width: auto; margin-bottom: 10vh; }
}
@media (max-width: 740px){ 
    a { text-align: center !important; }
    p, h2, h3 { text-align: center !important; margin-left: auto !important; margin-right: auto !important; max-width: 90% !important; min-width: 0 !important; }    
}
@media (max-width: 540px){ 
    .section:nth-child(n+2) .fp-scrollable > div  { padding-top: 15vh;  padding-bottom: 40vh; }
    .section:nth-child(n+2) .fp-tableCell > div  { padding-top: 5vh; }
    #fullp20 .fp-scrollable > div { padding-top: 130vh; }
    #fullp30 h3 { display: flex; flex-flow: column wrap; }
    #fullp30 .texte2 { margin-top: 5vh; }
    #fullp30 .button { margin-left: auto; margin-right: auto; }
    #section { background-position-y: 25%, 30%, 10.8%, 85%, 87%, 20%, 100%, 85%; }
    #s2Container::after { background: none; }   
    #navsc_navprimary > a:first-child { max-width: 40px; }
    #lien_p1 { font-size: 70%; }
}

@media (max-width: 440px){ 
    #section { background-position-y: 25%, 30%, 120%, 85%, 87%, 20%, 100%, 85%; }
    #s2Container::after { background: none; }    
}


.pushNavMobile, .pushUpMobile { display: none; }
@media (max-width: 1300px){    
    .pushNavMobile, .pushUpMobile { display: flex; position: fixed; top: 15px; left: 15px; cursor: pointer; z-index: 999999; }
}