@import url("https://use.typekit.net/qvz4moj.css");


* {

--colorText: #000000;
--bleu1 : #00A7DA;
--jaune: #fEC800;
--exviolet : var(--bleu1);
--bleu : #59C3DD;
--rose : #deafd2;
--exviolet: var(--bleu1);

#page {
padding-bottom:150px;
}

h1, h2, h3 {
font-family: "bebas-neue-pro", sans-serif;
font-weight: 400;
font-style: normal;
margin-top:1em;
text-transform:uppercase;
}

h1 {
font-weight:600;
font-size:2.8em;
}

h2 {
font-size:2em;
}

h2 strong {
color:var(--bleu1);
font-weight: 600;
font-size:1.4em;
}

h2.quand strong {
color:#FFFFFF;
background:var(--bleu1);
padding-left:0.1em;
padding-right:0.1em;
}

h2.ou strong {
color:#000000;
background:var(--jaune);
padding-left:0.1em;
padding-right:0.1em;}

h2.programme strong {
color:#FFFFFF;
background:var(--bleu);
padding-left:0.1em;
padding-right:0.1em;
}

h2.inscriptions strong {
color:#000000;
background:var(--jaune);
padding-left:0.1em;
padding-right:0.1em;
}

div.intro {
font-size:1.4em;
}

a.btn-back {
padding:0.3em;
background:var(--bleu);
color:#000000;
font-size:1.2em;
font-family: "bebas-neue-pro", sans-serif;
font-weight: 600;
font-style: normal;
text-decoration:none;
transition:all 0.3s;
}
a.btn-back:hover {
background:#000000;
color:#FFFFFF;
}

a {
color: var(--exviolet);
transition:color 0.3s;
font-weight:bold;
}
a:hover {
color: #000000;
}


span.espace1 {
color:var(--bleu);
font-size:1.6em;
font-family: "bebas-neue-pro", sans-serif;
font-weight: 600;
font-style: normal;
text-transform:uppercase;
}
span.espace2 {
color:var(--bleu1);
font-size:1.6em;
font-family: "bebas-neue-pro", sans-serif;
font-weight: 600;
font-style: normal;
text-transform:uppercase;
}
span.espace3 {
color:var(--bleu1);
font-size:1.6em;
font-family: "bebas-neue-pro", sans-serif;
font-weight: 600;
font-style: normal;
text-transform:uppercase;
}
span.espace4 {
color:var(--bleu);
font-size:1.6em;
font-family: "bebas-neue-pro", sans-serif;
font-weight: 600;
font-style: normal;
text-transform:uppercase;
}

form h2:nth-child(odd) {
font-weight:600;
color:var(--jaune);
}
form h2:nth-child(even) {
font-weight:600;
color:var(--rose);
}
form h3:nth-child(odd) {
font-weight:600;
color:var(--jaune);
}
form h3:nth-child(even) {
font-weight:600;
color:var(--rose);
}


ul.boutons {
list-style-type: none;
}

ul.boutons li {
margin-bottom:1em;
}

ul.boutons a {
padding:0.3em;
background:var(--bleu1);
color:#000000;
font-size:1.8em;
font-family: "bebas-neue-pro", sans-serif;
font-weight: 600;
font-style: normal;
text-transform:uppercase;
text-decoration:none;
transition:all 0.3s;
}

ul.boutons a.bouton1 {
background:var(--bleu1);
}
ul.boutons a.bouton2 {
background:var(--bleu);
}

ul.boutons a.bouton3 {
background:var(--jaune);
}

ul.boutons a.disabled {
pointer-events: none;   /* empêche le clic */
background: #DDDDDD;            /* visuel désactivé */
color: #AAAAAA;
cursor: default;
text-decoration: none;
}

ul.boutons a:hover {
background:#000000 !important;
color:#FFFFFF;
}


button#submit {
padding:0.3em 1em;
background:var(--bleu);
color:#000000;
font-size:1.8em;
font-family: "bebas-neue-pro", sans-serif;
font-weight: 600;
font-style: normal;
text-transform:uppercase;
text-decoration:none;
transition:all 0.3s;
border:none;
border-radius:0;
}

button#submit:hover {
background:#000000 !important;
color:#FFFFFF;
}

a[id^="reset"] {
cursor:pointer;
color:#000000;
background:var(--bleu);
padding:0.1em 0.2em;
font-size:0.9em;
transition:all 0.3s;
}

a[id^="reset"]:hover {
background:#000000 !important;
color:#FFFFFF !important;
}


#formulaire-trace-ton-avenir a h2 {
color:var(--couleur2) !important;
transition:color 0.3s;
}

#formulaire-trace-ton-avenir a h2:hover {
color:var(--couleur1) !important;
}

#formulaire-trace-ton-avenir .form-group {
margin-top:10px;
}

#formulaire-trace-ton-avenir hr {
margin: 2rem 0!important;
}

#formulaire-trace-ton-avenir .erreur {
color: #dc3545 !important;
}

#formulaire-trace-ton-avenir h5 {
margin-top:0.5em;
}

#formulaire-trace-ton-avenir .dispo {
color:var(--exviolet);
margin-left:10px;
}

#formulaire-trace-ton-avenir .form-check-input:disabled,
#formulaire-trace-ton-avenir .form-check-input:disabled~.form-check-label,
#formulaire-trace-ton-avenir .form-check-input[disabled]~.form-check-label {
opacity: .3;
}

.help-block.error {
color:#dc3545;
font-size:0.8em;
font-style:italic;
}

.mentionsFormulaire, .encadre {
border:1px solid #000000;
font-size:0.9em;
line-height:1.1em;
}

.mentionsFormulaire *:first-of-type, .encadre *:first-of-type {
margin-top:0;
}

.mentionsFormulaire *:last-of-type, .encadre *:last-of-type {
margin-bottom:0;
}

.mentionsFormulaire a, .encadre a {
font-weight:bold;
color:var(--jaune);
}

.banner_laptop, .banner_mobile {
margin-bottom:2em;
}

@media screen AND (max-width:767px) {
.banner_laptop, .footer_laptop {
display:none;
}
}

@media screen AND (min-width:768px) {
.banner_mobile, .footer_mobile {
display:none;
}
}