:root{
    --color-marine: #013947; --color-orange: #ee5341; 
    --primary-color: #013947; --secondary-color: #36b28a; --tertiary-color: #ee5341;
    --color-button: #1bb4bf; --color-button-before: white;  --size-moy-field: 215px;
}
*:not(u):not(summary) { position: relative; list-style: none; text-decoration: none; } 
*, *::before, *::after { box-sizing: inherit; margin: 0; padding: 0;}
details::marker {list-style: auto;}
video { height: auto; max-width: 100%; }
.inputImgDash2 { z-index: 5; }
a{ text-decoration: none; }
body > main, .zone {  min-height: 80vh;}
body > .form {  margin: 1vh auto;}
.paddingZone {  padding : 5vh 0;}
/* ACTIVER FLEXBOX */
.flex{ display: flex; margin: auto;}
.flexnoauto{ display: flex;}
.flexremplissage > div, .flexremplissage > a, .flexremplissage > label, .flexremplissage > p,.flexremplissage > section, .flexremplissage > aside{ flex: 1 1 auto;}
.flexremplissageh > div, .flexremplissageh > a, .flexremplissageh > label, .flexremplissageh > p,.flexremplissageh > section, .flexremplissageh > aside {flex: 1 1 0;}
.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;}
.flexaligncontentstart{ align-content: flex-start;}.flexaligncontentend{align-content: flex-end;}.flexaligncontentcenter{align-content: center;}
.flex1 { flex:1; } .flex2 { flex:2; }
/* FIN FLEX */
.bg-dark{ background-color: #0E0101!important; }
.bg-white{ background-color: whitesmoke; }
.is-transparent{ background: transparent; }

.button.is-xl { font-size: 5.5rem; }
.buttonCircle { display: flex; border-radius: 50%; padding: 1px; flex: 1 1 auto; }
.navproentity { background: white; height: 55px; border-radius: 5px; padding: 3px 5px; }
.zone { padding: 5vh 2vw; } 
.containerradio{ margin: 1.5rem;}
.containerradio > label{width: 200px;}
.containerradio100 > label { width: 100px;}
.objcover { object-fit: cover; }
.myphoto, .overflowhidden { overflow: hidden; }
.scrollauto { overflow-y: auto; }
input:not([type="submit"]), .input:not([type="submit"]) { color: #363636; align-items: center;    border: solid 0.5px #d1d1d1;    border-radius: 4px;    box-shadow: none;    display: inline-flex;    font-size: 1rem;    height: 2.5em;    justify-content: flex-start;    line-height: 1.5;    padding-bottom: calc(0.5em - 1px);    padding-left: calc(0.75em - 1px);    padding-right: calc(0.75em - 1px);    padding-top: calc(0.5em - 1px);    position: relative;    vertical-align: top; }
input.radioColorEnr, .input.radioColorEnr { -moz-appearance: none;    -webkit-appearance: none;  border:0; padding:0; margin:0; }
input[type="submit"], .input[type="submit"] { border: none; }
input[type="file"], .input[type="file"] { height: 250px; max-width: 100%; }
.buttonVertical { writing-mode: vertical-rl; text-orientation: mixed; transform: rotate(180deg); height: auto; width: 50px; padding: 15px 5px; }
/*.buttongoTV, .buttongoEL { position: fixed; right: 0px; bottom: 150px; background: #1bb4bf !important; z-index: 9999; }
.buttongoTV { bottom: calc(150px + 215px); }*/
.file-label[type="file"] { height: 50px; background: white; color: #a0dbd8; }

.radioON { padding: 4px 0; }
.radioON > div { align-items: center; }
.radioON .labelBefore { color: black; margin-right: 5px;  }
.radioON input[type=radio] { visibility: hidden; display: none; }
.radioON input[type=radio]:checked + label,
.radioON input[type=radio]:not(:checked) + label{
	padding: 3px 4px;letter-spacing: 1px;margin: 2px;text-align: center;
	border-radius: 4px;	overflow: hidden;	cursor: pointer;	text-transform: uppercase;
	-webkit-transition: all 300ms linear;	transition: all 300ms linear; 
}
.radioON input[type=radio]:not(:checked) + label{
	background-color: #cdd7e1; 	box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
}
.radioON input[type=radio]:checked + label{
	background-color: #3eb9a7; color: white;	box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.2);
}
.radioON input[type=radio]:checked:first-child + label{
	background-color: #ff9393 ; 
}

.radioON input[type=radio]:not(:checked) + label:hover{
	box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.2);
}

.radioCaseV1 input[type=radio], .radioCaseV1 input[type=checkbox] { visibility: hidden; display: none; }

.radioCaseV1 input[type=checkbox]:checked + label, .radioCaseV1 input[type=checkbox]:not(:checked) + label {
    padding: 20px; letter-spacing: 1px; margin: 5px 5px; text-align: left; border-radius: 4px; overflow: hidden; cursor: pointer; -webkit-transition: all 300ms linear; transition: all 300ms linear; }
.radioCaseV1 input[type=checkbox]:not(:checked) + label, .radioCaseV1 input[type=checkbox]:checked + label, .radioCaseV1 input[type=checkbox]:not(:checked) + label:hover  {  }
.radioCaseV1 input[type=checkbox]:not(:checked) + label { background: #e0e0e0; font-weight: bold; }
.radioCaseV1 input[type=checkbox]:not(:checked) + label:hover { background: var(--color-marine); color:#fff; }

.radioCaseV1 input[type=checkbox]:checked + label {
    background: var(--secondary-color); color: white;
    box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.2);
}

.radioCaseV1 input[type=radio]:checked + label, .radioCaseV1 input[type=radio]:not(:checked) + label {
    padding: 20px; letter-spacing: 1px; margin: 5px 5px; text-align: left; border-radius: 4px; overflow: hidden; cursor: pointer; -webkit-transition: all 300ms linear; transition: all 300ms linear; }
.radioCaseV1 input[type=radio]:not(:checked) + label, .radioCaseV1 input[type=radio]:checked + label, .radioCaseV1 input[type=radio]:not(:checked) + label:hover  { width:100%; }
.radioCaseV1 input[type=radio]:not(:checked) + label { background: #e0e0e0; font-weight: bold; }
.radioCaseV1 input[type=radio]:not(:checked) + label:hover { background: var(--color-marine); color:#fff; }

.bubbleCpt { position: absolute; background: red; top: -150%; left: 75%; border-radius: 50%; padding: 4px; min-width: 28px; color:white; }

.etiquetteCard { padding: 1px 15px; }
.tabmodecard .etiquetteCard { box-shadow: 1px 1px 5px grey;  border-radius: 5px; text-shadow: 0px 1px 2px #000000; font-size: 97%; margin: -7px 2px 5px 5px; }
.tabmodecard .dataNonPublie { background: #ed718a; color: white; }
.tabmodecard .dataUpdated { background: #00cc99; color: white; }
.tabmodecard .dataPublie { background: #3eb9a7; color: white; }
.tabmodecard .admin0Card:first-child > h2 span, .tabmodecard .nonefield { display: none; }

.details .admin0Card { width: 80% !important; max-width: 80% !important ; }

.tabmodelist { overflow: auto; width: 100vw; max-width: 100vw; max-height: 80vh; }
.tabmodelist .admin0Card > p, .tabmodelist .admin0Card h2 {width: auto;  margin: 0 10px;align-content: center; overflow: hidden; text-align: left !important; font-size: 16px !important; }
.tabmodelist .admin0Card > p {min-width: 250px;max-width: 250px; }
.tabmodelist .admin0Card h2 { min-width: 150px;max-width: 150px; }  
.tabmodelist .admin0Card .email { min-width: 310px;max-width: 310px; } 
.tabmodelist .admin0Card .smallfield { min-width: 120px;max-width: 120px; } 
.tabmodelist .admin0Card .middlefield { min-width: 160px;max-width: 160px; } 
.tabmodelist .admin0Card > p span, .tabmodelist .admin0Card .link { display: none; }
.tabmodelist .admin0Card { width: auto !important;  flex-flow: row nowrap; box-shadow: none; margin: 0 4px !important; }
.tabmodelist .admin0Card .height0 { display:none; }
.tabmodelist .actions { order: -1; width: 250px; max-width: 250px; margin: 0; }
.tabmodelist .admin0Card:first-child { max-height: 85px; align-items: flex-start; }
.tabmodelist .admin0Card:first-child > p, .tabmodelist .admin0Card:first-child > h2 { flex-direction: column; align-content: flex-start; justify-content: center; align-items: flex-start; }
.tabmodelist .admin0Card:first-child > p span, .tabmodelist .admin0Card:first-child > h2 span { display: flex; height: 25px; width: 100%; text-align: left; margin-bottom: 10px; background: #43716b;    color: white;    padding: 1px 5px; }
.tabmodelist .admin0Card:first-child .actions { margin-top: 27px; }

.listmodeactive { background: #00cc99; }

.tabmodelist.x10 .admin0Card { min-width: calc(10*var(--size-moy-field)); }.tabmodelist.x11 .admin0Card { min-width: calc(11*var(--size-moy-field)); }
.tabmodelist.x12 .admin0Card { min-width: calc(12*var(--size-moy-field)); }.tabmodelist.x13 .admin0Card { min-width: calc(13*var(--size-moy-field)); }
.tabmodelist.x14 .admin0Card { min-width: calc(14*var(--size-moy-field)); }.tabmodelist.x15 .admin0Card { min-width: calc(15*var(--size-moy-field)); }
.tabmodelist.x16 .admin0Card { min-width: calc(16*var(--size-moy-field)); }.tabmodelist.x17 .admin0Card { min-width: calc(17*var(--size-moy-field)); }
.tabmodelist.x18 .admin0Card { min-width: calc(18*var(--size-moy-field)); }

/*  CONSOLE ELEARNING  */
.blocADEtape { border: 2px solid #2d2d2d; border-radius: 4px; padding: 1vh 1vw;  }
.blocADEtape > div:first-child { margin-top: -30px; }
.blocADEtape > div:first-child label { display: none; }
.blocADEtape > div:first-child input { text-align: center; }

.blocADEtapeActive {
    background: white; border-radius: 25px; padding: 15px 30px;
}
.blocADEtapeActionAdd {
    background: #dcfbf1; padding: 10px 15px; border-radius: 15px; border: 1px dashed var(--color-marine); margin-top: 15px; 
}
.blocADEtapeActions .button { margin: 0 2px; border: 2px solid black;  } 
@media (max-device-width : 540px) {
    .blocADEtapeActions { justify-content: center; }
    .blocADEtapeActions p { min-width: 100%; }
}
/* FIN SPECIFIQUES CONSOLES ADMINS */

.labelBefore { font-weight: bold; margin-right: 15px; }
.input[readonly], input[readonly] { border : none; padding-top: 0; margin-top: -5px; }
.btnadd { background-color: #8ce3b2; }
.btnremove { background-color: #ff9494; }
.autocomplete-items {
  position: absolute;  border: 1px solid #d4d4d4;  border-bottom: none;  z-index: 99;  /*position the autocomplete items to be the same width as the container:*/
  top: 100%;  left: 0;  right: 0;
}
.autocomplete-items div {  padding: 10px;  cursor: pointer;  background-color: #fff;  border-bottom: 1px solid #d4d4d4;}
.autocomplete-items div:hover {background-color: #e9e9e9;}
.autocomplete-active {  background-color: DodgerBlue !important;  color: #ffffff;}

.card-input-element { display: none; }
.card-input:hover { cursor: pointer; }
.cardGreen { background-color: #b3e6df; }
.cardOrange { background-color: #f7dcbd; }
.cardRed { background-color: #f7bdbd; }

.imageH img {
    height: 200px;
    width: auto;
}

.infobulle { display:none; position: absolute; top: -15px; left: 50%; font-size: 80%; background: #02a199; color: white; padding: 5px 10px; border-radius: 15px; z-index: 2;   }
.avecInfoBulle:hover .infobulle { display: block; }
.etiquette { border: solid 1px #979797; padding: 2px 15px; margin: 0 5px; border-radius: 5px; }

#onglets a {
    color: #363636; font-weight: bold; font-size: 105%;
    padding: 10px 2em 15px 2em;
}
a { color: #8ce3b2; }
select { padding: 5px; border-radius: 5px; }
#lien_addButtonAdmin{
    float: right;
    margin-right: 10px;
    margin-bottom: 10px;
}

#onglets a.is-active { border-bottom: 4px solid #02a199 !important; }
#onglets a.is-active .etiquette { background: #02a199; color: white; border: none; }
#onglets a:hover { border-bottom: 4px solid #50555C !important; background: #a0dbd8; }

.h250px { height: 250px; } .h450px { height: 450px; } .h100vh { height: 100vh; }.h60vh { height: 60vh; }.h55vh { height: 55vh; }.h50vh { height: 50vh; }
.hmax40px { max-height: 40px; }
.w10, .w15, .w20, .w25, .w30, .w40 { min-width: 280px; max-width: 94vw; }
.w50, .w60, .w65, .w70, .w75, .w80 { min-width: 280px; max-width: 94vw; }
.w10 { width: 10%; } .w15 { width: 15%; }.w20 { width: 20%; }.w25 { width: 25%; }.w30 { width: 30%; }.w40 { width: 40%; }.w50 { width: 46%; } .w48{width:48%;} .w60 { width: 60%; } .w65 { width: 65%; } .w70 { width: 70%; } .w75 { width: 75%; }.w80 { width: 80%; }.w90 { width: 90%; } .w100 { width: 100%; }
.w50px { width:50px; }.w100px { width:100px; }.w150px { width: 150px; max-width: 100%; } .w180px { width:180px; max-width: 100%;} .w250px { width: 250px;}
.w300px { width: 300px; max-width: 98vw; } .w400px { width: 400px; max-width: 98vw; } .w500px { width: 500px; max-width: 98vw; } .w600px { width: 600px; max-width: 98vw; }
.w700px { width: 700px; max-width: 98vw; } .w800px { width: 800px; max-width: 98vw; } .w850px { width:850px;max-width: 98vw;}
.w1000px { width:1000px;max-width: 98vw;}
.w1200px { width:1200px;max-width: 98vw;}
.w1350px { width:1350px;max-width: 98vw;}
.minw90 { min-width: 90%; } .minw100 { min-width: 100%; }
.maxw300px { max-width: 300px; } .maxw400px { max-width: 400px; } @media (max-width: 450px){ .maxw400px { max-width: 90%; } }
.maxw100 { max-width: 100%; }

.maxw50px { max-width:50px;}.maxw100px { max-width:100px;}.maxw150px { max-width:150px;}.maxw180px { max-width:180px;}.maxw250px { max-width:250px;}
.maxw300px { max-width:300px;}.maxw500px { max-width:500px;}.maxw850px { max-width:850px;}.maxw1000px { max-width:1000px;}.maxw1200px { max-width:1200px;}.maxw1350px { max-width:1350px;}

.minw50px { min-width:50px;}.minw100px { min-width:100px;}.minw150px { min-width:150px;}.minw180px { min-width:180px;}.minw250px { min-width:250px;}
.minw300px { min-width:300px;}.minw850px { min-width:850px;}.minw1000px { min-width:1000px;}.minw1200px { min-width:1200px;}.minw1350px { min-width:1350px;}

.margin5px { margin: 5px; } .margin15px { margin: 15px; }
.marginlr5px { margin: 0 5px; } .marginlr15px { margin: 0 15px; }
.margintb15px { margin: 15px 0; } .margintb30px { margin: 30px 0; }
.marginl5vw { margin-left: 5vw; }
.marginl5px { margin-left: 5px; }.marginl10px { margin-left: 10px; }.marginl15px { margin-left: 15px; }
.marginl20 { margin-left: 20%; }.marginl25 { margin-left: 25%; }.marginl30 { margin-left: 30%; }.marginl40 { margin-left: 40%; }.marginl50 { margin-left: 50%; }
.marginr5pxi { margin-right: -5px; } .marginr15pxi { margin-right: -15px; }
.marginr5vw { margin-right: 5vw; }.marginr5px { margin-right: 5px; }.marginr10px { margin-right: 10px; }.marginr15px { margin-right: 15px; }
.margint5px { margin-top: 5px; }.margint10px { margin-top: 10px; }.margint15px { margin-top: 15px; }.margint20px { margin-top: 20px; }.margint30px { margin-top: 30px; }.margint50px { margin-top: 50px; } .margint100px { margin-top: 100px; }
.margint5vh { margin-top: 5vh; } .margint10vh { margin-top: 10vh; } .margint15vh { margin-top: 15vh; } .margint20vh { margin-top: 20vh; }
.marginb5px { margin-bottom: 5px; }.marginb10px { margin-bottom: 10px; }.marginb15px { margin-bottom: 15px; } .marginb30px { margin-bottom: 30px; } 

.padding5px { padding: 5px 1vw; } .padding25px { padding: 25px 2vw; } .padding30px { padding: 30px 2vw; } .padding140px { padding: 140px 2vw; } 
.padding5vh { padding: 5vh 0; } .padding10vh { padding: 10vh 0; } .padding10px { padding: 10px; }
.paddingr30px { padding-right: 30px; }
.paddinglr30px { padding-left: 30px; padding-right: 30px; }
.paddingtb60px { padding-top: 60px; padding-bottom: 60px; }

.gap5 { gap: 5px; }  .gap10 { gap:10px; } .gap15 { gap:15px; } .gap20 { gap:20px; } .gap30 { gap:30px; } .gap1vw { gap:1vw; }

@media (max-width: 768px) {
    .w30, .w40, .w50, .w60, .w65, .w70, .w75, .w80, .w90, .w250px, .w300px, .w400px, .w500px, .w600px, .w700px, .w800px, .w850px, .w1000px, .w1200px, .w1350px {
        width: 100%; min-width: auto; max-width: 98vw;
    }
}

/* TEXTE */
.txt-black {color: #000 !important;}.txt-white {color: #fff !important;}
.txt-center {text-align:center;}.txt-start {text-align:start;}.txt-end {text-align:end;}
.txt-justify {text-align: justify;}
.txtsize80 { font-size: 80%; } .txtsize90 { font-size: 90%; }
.txtoneline { text-overflow: ellipsis; }
.bold { font-weight: bold; } .italic { font-style: italic; } .underline { text-decoration: underline; }
.underlinejumpo { padding-bottom: 5px;
    border-bottom: 3px solid;
    border-image-slice: 1;
    border-width: 4px;
    border-image-source: linear-gradient(90deg, rgba(214,217,46,1) 0%, rgba(0,168,156,1) 50%, rgba(0,95,112,1) 89%, rgba(0,73,101,1) 100%); }

.txtmagical { /* background-image: linear-gradient(120deg, #84fab0 0%, #8fd3f4 100%); */
  background-image: linear-gradient(90deg, rgba(214,217,46,1) 0%, rgba(0,168,156,1) 50%, rgba(0,95,112,1) 89%, rgba(0,73,101,1) 100%);  
  background-image: linear-gradient(90deg, rgba(0,73,101,1) 0%, rgba(0,95,112,1) 25%, rgba(0,168,156,1) 50%, rgba(214,217,46,1) 75%, rgba(241,86,66,1) 100%) ;
  background-repeat: no-repeat;  background-size: 100% 0.2em;  background-position: 0 88%;  transition: background-size 0.25s ease-in; }
.txtmagical:hover { background-size: 100% 88%; }

.pointeur { cursor: pointer; }
.pastille { width:12px; height:12px; border-radius:50%;  }

.textalignr { text-align: right; } .textalignl { text-align: left; } .txtcenter{ text-align: center;}.justify { text-align: justify; text-justify: auto; }
.trumbowyg-editor-box { background: white; }

.listeMoncompte{
    display: flex;  margin-top:0.4em;     align-items: center;
}
.listeMoncompte label { min-width: 200px; margin-right: 5px; }

.form-signin, .form-inscription { max-width: 350px; margin: auto; }
.form-signin button { width: 71%; }
.form-inscription button { width: 100%; }

#slogan{
    width: 1000px;
}
#description{
    width: 900px;
}

/* MISSIVE et TABLEAU DE BORD */
.missiveresumebox, .focusmissive { border: solid 3px #013947; border-radius: 10px; padding: 15px; background: #eefdfd; }
.missivebox.w70 { padding-top: 5vh; }
.missivebox h2, .missiveresumebox h2 { border-radius: 5px; background: #1bb4bf; border: solid 2px; height: 50px; }
.missive { background: linear-gradient(90deg, #aafffb 0%, #e6fffe 100%); padding: 5px 10px; box-shadow: 0 0 3px 1px #9d9d9d; border: none; border-radius: 10px; margin-bottom: 7px; }
.missive.notread { background: linear-gradient(90deg, #8fe1e7 0%, #3fc2cb 100%);  }
.missive a { color: grey; }
.missive.notread a { color:#1c4e73; }

.missive.demande-devis.notread { background: linear-gradient(90deg, #ff6666 0%, #ffa8a8 100%); }
.missive.demande-devis { background: linear-gradient(90deg, rgb(255, 193, 193) 0%, rgb(255,238,238) 100%); }
.missive.demande-devis.notread a { color: white; }
.missive.commentaire.notread { background: linear-gradient(90deg, #6fc065 0%, #abe5a3 100%); }
.missive.commentaire { background: linear-gradient(90deg, #bcffb3 0%, #e3fde0 100%); }

.missiveresumebox > a, .missivebox > a, .btn-return { border-color: #1bb4bf; color: #1bb4bf; background: transparent; }
                  
.missive.notread { border-left: solid 8px #133650 !important; }
.missive a:hover, .missive.demande-devis.notread a:hover, .missive.demande-devis.notread a:hover { color: #0E0101; }

.focusmissive .missive { padding: 15px 10px; }
.focusmissive em { background: white; padding: 2px 15px;  border-radius: 5px; color: black; }
#msgdetails { background: white; border: dashed 1px grey; border-radius: 5px; margin-bottom: 5px; }

@media (max-device-width : 1568px) {
    .missive { width: 50%; max-width: 40vw; }
}
@media (max-device-width : 768px) {
    .missive { width: 100%; max-width: 90vw; }
    #containerJumpro .w50 { width: 90%; }
}

/* SCROLLBAR */

.containerTab::-webkit-scrollbar-track, .yscroll::-webkit-scrollbar-track
{
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    border-radius: 10px;
    background-color: #F5F5F5;
}

.containerTab::-webkit-scrollbar, .yscroll::-webkit-scrollbar
{
    height: 12px;
    background-color: #F5F5F5;
}

.containerTab::-webkit-scrollbar-thumb, .yscroll::-webkit-scrollbar-thumb
{
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
    background-color: #555;
}

.policeTitre {
    font-family: 'Pangolin', BlinkMacSystemFont, -apple-system, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
}

.hero-body { text-align: center; }
.mauto { margin: auto; }

.km {
    background-color: #d6f5ec;
    color: #000000;
    display: block;
    width: 150px;
    text-align: right;
}

.is-256x256 { height: 256px; width: 256px;}
#accueilMain{
    background-image: url('../../images/fond calculette verte.png');
    background-size: 100%;

}
#accueilMain > div{
    display: flex;
    height: 100vh;
    align-content: center;
    justify-content: center;
    align-items: center;
}

#accueilMain > div > h1{
    font-family: 'Pangolin';
    font-size: 5rem;
    color: #20D7BC;
    -webkit-text-stroke: 4px #20D7BC;
}
#sec1Accueil{
    margin: 19% 0% 0% 5%;
}
#sec1Accueil > h2{
    font-family: 'Pangolin';
    font-size: 3rem;
    color: #20D7BC;
    -webkit-text-stroke: 2px #20D7BC;
}
#sec1Accueil div{
    display: flex;
}

#sec1Accueil div p,#sec2Accueil div p{
    max-width: 50%;
    font-size: 2rem;
}
#sec1Div2{
    justify-content: flex-end;
    text-align: right;
    margin-top: 11%;
}
#sec1Div2 p {
    padding: 5%;
    background-color: #20D7BC;
    border-top-left-radius: 7rem;
    border-bottom-left-radius: 7rem;
}
.divButtonInscr{
    justify-content: center;
    margin-top: 5%;
}
.buttonInscr{
    border-color: #20D7BC;
    font-size: 2rem;
    border-radius: 1rem;
    color: #20D7BC;
    padding: 0 7%;
}
#sec2Accueil > h2{
    font-size: 3rem;
    font-family: 'Pangolin';
    color: #20D7BC; 
}
#sec2Accueil{
    margin-top: 28%;
}
#sec2Accueil div{
    margin-top: 10%;
}
#sec2Div1 p{
    padding: 5%;
    background-color: #20D7BC;
    border-top-right-radius: 7rem;
    border-bottom-right-radius: 7rem;
}
#sec2Div2{
    display: flex;
    justify-content: center;
    text-align: center;
}
#sec2Div3{
    display: flex;
    justify-content: flex-end;
}
#sec2Div3 p {
    padding: 5%;
    background-color: #20D7BC;
    border-top-left-radius: 7rem;
    border-bottom-left-radius: 7rem;
}
#div2ButtonInscr{
    padding-top: 5%;
    display: flex;
    justify-content: center;
    padding-bottom: 14%;
}
#sec2Accueil h2{
    margin-left: 5%;
    margin-bottom: -5%;
    -webkit-text-stroke: 2px #20D7BC;
}
@media (max-device-width : 768px) {
    #sec2Accueil h2{
        text-align: center;
        margin-left: 0%;
        -webkit-text-stroke: 0.5px #20D7BC;
    }
    #sec1Accueil > h2{
        text-align: center;
        -webkit-text-stroke: 0.5px #20D7BC;
    }
    #cardmesInfo .card-content{
        padding: 0.4rem 0rem;
    }
    #cardmesInfo {
        font-size: 12px;
    }
    .listeMoncompte input{
        margin-left: 0.3rem;
    }
    .listeMoncompte{
        font-size: 0.75rem;
    }
    #slogan{
        width: 300px;
    }
    #description{
        width: 250px;
    }
    .mt-5 {
        width: 96%;
    }

    #accueilMain > div > h1{
        font-size: 2rem;
        text-align: center;
        margin-left: 0%;
        -webkit-text-stroke: 2px #20D7BC;
    }

    #accueilMain > div{
        height: 33vh;    
    }
    #sec1Accueil div p,#sec2Accueil div p{
        max-width: 100%;
        font-size: 1rem;
    }
    #sec2Div3 p {
        border-top-left-radius: 0rem;
        border-bottom-left-radius: 0rem;
    }
    #sec2Div1 p{
        border-top-right-radius: 0rem;
        border-bottom-right-radius: 0rem;
    }
    #sec1Div2 p {
        border-top-left-radius: 0rem;
        border-bottom-left-radius: 0rem;
    }
    #sec1Accueil{
        margin: 19% 0% 0% 0%;
    }
    #sec1Accueil div p{
        padding: 5%;
        text-align: justify;
    }
    #sec2Accueil div p{
        padding: 8% 5%;
        text-align: justify;
    }
}

.addfile input, .addfilesubmit input {
    opacity: 0.01;
    cursor: pointer;
}

.tabTLigne > div:last-child { background-color: #cacaca; }

/* CARD ABONNEMENT */
.zoneAbo { padding: 3% 15px 5% 15px; }
.abo { 
    width: 450px;
    height: auto;
    min-height: 500px;
    padding: 15px 40px;
    background-color: #f0f8ff;
    box-shadow: 0px 0px 5px #a7a4a4;
    margin-top: 15px;
}
.abo h3 { color: #363636; }
.abo h3, .abo p { text-align: center; }
.abo .tarif { font-size: 130%; }
.abo .tarif strong { font-size: 180%; }
.sansAbo { background-color: #f1f1f1; }
.oneshot { background-color: #133650; color: white; }
.oneshot h3, .oneshot p, .oneshot strong { color: white; }
.oneshot .tarif p, .oneshot .tarif strong { color: #3298dc; }

.myAbo .intCursor label, .oneshot .intCursor label {color: white; }
.myAbo { border: solid 5px white; background-color: #3298dc; color: white; }

/* INPUT RANGE V1 */
.inputRangeV1 {
  height: 26px;  -webkit-appearance: none;  margin: 10px 0;border: none;
}
.inputRangeV1:focus {
  outline: none;
}
.inputRangeV1::-webkit-slider-runnable-track {
  width: 100%;
  height: 14px;
  cursor: pointer;
  animate: 0.2s;
  box-shadow: 1px 1px 1px #50555C;
  background: #50555C;
  border-radius: 14px;
  border: 0px solid #000000;
}
.inputRangeV1::-webkit-slider-thumb {
  box-shadow: 0px 0px 0px #000000;
  border: 0px solid #000000;
  height: 20px;
  width: 40px;
  border-radius: 12px;
  background: #529DE1;
  cursor: pointer;
  -webkit-appearance: none;
  margin-top: -3px;
}
.inputRangeV1:focus::-webkit-slider-runnable-track {
  background: #50555C;
}
.inputRangeV1::-moz-range-track {
  width: 100%;
  height: 14px;
  cursor: pointer;
  animate: 0.2s;
  box-shadow: 1px 1px 1px #50555C;
  background: #50555C;
  border-radius: 14px;
  border: 0px solid #000000;
}
.inputRangeV1::-moz-range-thumb {
  box-shadow: 0px 0px 0px #000000;
  border: 0px solid #000000;
  height: 20px;
  width: 40px;
  border-radius: 12px;
  background: #529DE1;
  cursor: pointer;
}
.inputRangeV1::-ms-track {
  width: 100%;
  height: 14px;
  cursor: pointer;
  animate: 0.2s;
  background: transparent;
  border-color: transparent;
  color: transparent;
}
.inputRangeV1::-ms-fill-lower {
  background: #50555C;
  border: 0px solid #000000;
  border-radius: 28px;
  box-shadow: 1px 1px 1px #50555C;
}
.inputRangeV1::-ms-fill-upper {
  background: #50555C;
  border: 0px solid #000000;
  border-radius: 28px;
  box-shadow: 1px 1px 1px #50555C;
}
.inputRangeV1::-ms-thumb {
  margin-top: 1px;
  box-shadow: 0px 0px 0px #000000;
  border: 0px solid #000000;
  height: 20px;
  width: 40px;
  border-radius: 12px;
  background: #529DE1;
  cursor: pointer;
}
.inputRangeV1:focus::-ms-fill-lower {
  background: #50555C;
}
.inputRangeV1:focus::-ms-fill-upper {
  background: #50555C;
}

/* SLIDER GLIDE */
.glide__arrows { position: static; }
.glide__arrow {  background-color: var(--color-button); border: 2px solid rgba(255, 255, 255, 0.1); }
.glide__arrow svg {  color: var(--color-button-before);}
.glide__bullets { bottom: 10px; align-items: center; }
.glide__bullets button { border: none; background: var(--primary-color); }
button.glide__begin, button.glide__end { cursor: pointer; color: var(--primary-color); border: 1px solid var(--primary-color); background: none; margin: 0 15px; }
.glide__bullets button:hover { border: solid 1px grey; background: var(--secondary-color); }
.glide__bullet { background-color: var(--primary-color); width: 12px; height: 12px; }
.glide__bullet.glide__bullet--active { background: var(--tertiary-color); }
/* FIN SLIDER GLIDE */

/* AUTRES MISE EN FORME SPECIFIQUE */  

.topcardmarine { 
   padding: 10px 10px 10px 15px;
   border-top-left-radius: 15px;   border-top-right-radius: 15px;
   background: var(--color-marine);
}