@import url('https://fonts.googleapis.com/css2?family=Quicksand:wght@300..700&display=swap');
.quicksand-regular {  font-family: "Quicksand", sans-serif;  font-optical-sizing: auto; font-weight: 400;  font-style: normal; }
.quicksand-bold {  font-family: "Quicksand", sans-serif;  font-optical-sizing: auto; font-weight: 700;  font-style: normal; }



@import url('https://fonts.googleapis.com/css2?family=Martian+Mono:wdth,wght@112.5,100..800&display=swap');
.martian-regular {  font-family: "Martian Mono", monospace;  font-optical-sizing: auto;  font-weight: 400;  font-style: normal;  font-variation-settings:    "wdth" 100;}
.martian-semiB {  font-family: "Martian Mono", monospace;  font-optical-sizing: auto;  font-weight: 600;  font-style: normal;  font-variation-settings:    "wdth" 100;}
.martian-semiBe {  font-family: "Martian Mono", monospace;  font-optical-sizing: auto;  font-weight: 600;  font-style: normal;    font-variation-settings:    "wdth" 112.5;}


.no-padding {padding:0 !important; margin: 0!important;}
a, ul a {  text-decoration: none !important; transition: all 0.3s ease; color:inherit !important; cursor:pointer; }
a:visited {	color: inherit !important; }
.html {font-size: 2vw}

.menu {color: #d02c22; margin-top: 2vmin; font-size: 2.2vmin; text-align: center;}
.menu a:hover {color:#815ca2 !important}
.logo-margin {margin-top: -15vmin;}
.img-fluid.logo {padding-left: 5%; padding-right: 5%;}

.img-fluid.logo,
.logo {  display: block;  margin: 0 auto; padding: 0; width: 85%;    height: auto;}

p.accueil {font-size: 3vmin; color:#d02c22; text-align: center;}

.accordion-button {text-align: center !important; display: block !important;}

p.titre {font-size: 3vmin; color: #d02c22; line-height: 3.5vmin;}
p.titre.aubergine {color:#89405e !important}
p.titre.violet, p.titre-p.violet {color:#815ca2 !important}
p.titre.rouge, p.titre-p.rouge, .courant.rouge p, .courant.rouge h2, .courant.rouge h1, .courant.rouge h3, .courant.rouge h4    {color:#db6053 !important}
.titre-p p {color:#d02c22; font-size: 2vmin; line-height: 2.3vmin;}
.img-contain {   object-fit: cover;   width: 100%;   height: 40vh;   padding-left: 5vh;    padding-right: 5vh; padding-bottom: 5vmin;}
.img-contain2 {   object-fit: cover;   width: 100%;   height: 40vh;   }
.courant p {font-size: 1.9vmin; line-height: 2.1vmin; color: #89405e;}
.courant.aubergine p, p.titre-p.aubergine, .courant.aubergine h2, .courant.aubergine h1, .courant.aubergine h3, .courant.aubergine h4 {color:#89405e;}
.courant.framboise p, p.titre-p.framboise, p.titre.framboise, .courant.framboise h1, .courant.framboise h3, .courant.framboise h4 {color:#89405e;}
.courant.violet p, .violet p, .courant.violet h2, .courant.violet h1, .courant.violet h3, .courant.violet h4 {color:#815ca2;}

p.formations {margin-top: -12vmin; padding-left: 12vmin;}
.bouton1, .bouton2, .bouton3 { width: 80%; font-family: "quicksand", serif; font-weight: 700; font-size: 2vmin; color:white;  background-position: center center;  background-repeat: no-repeat;  background-size: cover; height: 5vmin;   display: flex; justify-content: center;  align-items: center;}
.bouton2 { background-image: url("../img/bouton2.png"); }
.bouton1 { background-image: url("../img/bouton1.png"); }
.bouton3 { background-image: url("../img/bouton3.png"); }
.bouton1 p, .bouton2 p, .bouton3 p {text-align: center; vertical-align: middle; color:white; margin:0 !important; color: white !important; }

.divider {height: 10vmin;}

.duotone-rouge    { filter: url(#duotone-rouge); }
.duotone-framboise{ filter: url(#duotone-framboise); }
.duotone-violet   { filter: url(#duotone-violet); }

a.lien-actif {color: #815ca2 !important}
.pt0 {padding-top: 0 !important}

.courant p a {text-decoration: underline dotted !important;}
.courant p a:hover {color: brown !important;}
h2 {  font-size: 2.5vmin;line-height: 3vmin; font-weight: 600; }
.titre-p h2, .titre-p h1, .titre-p h3, .titre-p h4  {color: #d02c22}
.titre-p ul li {color: #d02c22; font-size: 2vmin; line-height: 2.3vmin;}
.courant h2 {color: #89405e}
.titre-p.violet h2, .titre-p.violet h1, .titre-p.violet h3, .titre-p.violet h4, .titre-p.violet ul li {color: #815ca2}

.fadein-object {
    -moz-animation: fadein 2s; /* Firefox */
    -webkit-animation: fadein 2s; /* Safari and Chrome */
    -o-animation: fadein 2s; /* Opera */
}
@keyframes fadein {    from {        opacity:0;    }    to {        opacity:1;    }
}
@-moz-keyframes fadein { /* Firefox */    from {        opacity:0;    }    to {        opacity:1;    }}
@-webkit-keyframes fadein { /* Safari and Chrome */    from {        opacity:0;    }    to {        opacity:1;    }}
@-o-keyframes fadein { /* Opera */    from {        opacity:0;    }    to {        opacity: 1;    }}











/*!!!!!!!!!!!!!!!!!!!!!!!!!!! MEDIUM ECRAN !!!!!!!!!!!!!!!!!!!!!!!!!!!*/
@media (min-width: 992px) and (max-width: 1699.98px) { 
.logo-margin {margin-top: -7vmin;}

 }


/*!!!!!!!!!!!!  MOBILE  !!!!!!!!!!!!*/

@media (max-width: 991.98px) { 

.menu {font-size: 4vmin !important;}
.logo-margin {margin-top: 10vmin !important}
p.accueil {font-size: 4vmin; background-color: #815ca2; color:white; padding: 2%;}
.img-fluid.logo {padding-left: 0%; padding-right: 0%}


.menu-sm { width: 100%; font-family: "quicksand", serif; font-weight: 700; font-size: 1em; color:white;  background-image: url("../img/menu_fond2.png");   background-position: center center;  background-repeat: no-repeat;  background-size: contain;}
.menu-mobile-active {  background-color: #db6053; /* ou la couleur que tu veux */  transition: background-color 0.3s ease;}

.img-fluid.gugus {max-width: 60%}

.menu li, .menu ul {font-size: 1em !important; list-style: none;}
.menu li {color: white !important; }
span.accordion-button {background-image: url("lib/img/menu_fond.png");}

p.titre {font-size: 6vmin; line-height: 6.5vmin;}
p.titre-p, .titre-p p {font-size: 3.5vmin; line-height: 4vmin;}
.courant p, .titre-p ul li {font-size: 3vmin; line-height: 3.5vmin;}
.img-contain {padding-left: 0vh;    padding-right: 0vh;}


p.formations {margin-top: -22vmin; padding-left: 22vmin;}
.bouton1, .bouton2, .bouton3 {width: 100%; height: 10vmin; font-size: 4vmin;}



h2 {font-size: 4.5vmin; line-height: 5vmin;}



}