@import url('https://fonts.googleapis.com/css2?family=Inter&display=swap');


/*************************** MISE EN FORME STRUCTURE ****************************/

/*onglets sous navbar*/

h1 {
    font-weight: bolder!important; padding-top: 2vh; padding-bottom: 2vh; font-size: 3vh!important; text-align: center;
}

h2 {
    font-size: 25px; font-weight: bolder!important; padding: 1vh 0 2vh 0;
}

.onglet{
    border: solid 2px white;
    padding-top: 0.8vw;
    padding-bottom: 0.8vw;
    color: white;
    font-weight: 700;
    font-size: 25px;
}

.onglet-gauche{
    border-top-left-radius: 25px;
    border-bottom-left-radius: 25px;
}

.onglet-droit{
    border-top-right-radius: 25px;
    border-bottom-right-radius: 25px;
}

.onglet-actif{
    color: #005a7a;
    background-color: white;
}

.vertical-center{
    margin-bottom: auto!important;
    margin-top: auto!important;
}

/*bloc formulaire*/

.corps-formulaire{
    margin-top: 2%;
    margin-bottom: 1%;
    background-color: white;
    border-radius: 25px;
    padding: 1em 2em!important;
}

/**************************** ELEMENTS D'INTERACTIONS (BOUTONS, CHECKBOX) ****************************/

.bouton{
    border: 2px solid #1598c8;
    background-color: #1598c8;
    color: white;
    border-radius: 18px;
    padding: 1.5vh 1.5vh;    
    transition: 0.2s;
    margin-top: 1em;
}

.bouton:hover{
    background-color: white;
    border: 2px solid #1598c8;
    color: #1598c8;
}

.bouton-2{
    border: none;
    background-color: #eee;
    color: #005a7a;
    border-radius: 18px;
    padding: 1.5vh 1.5vh;    
    transition: 0.2s;
    margin-top: 1em;
}

.bouton-2:hover{
    background-color: #ddd;
}

.bouton-3{
    border: 2px solid #005a7a;
    background-color: #005a7a;
    color: white;
    border-radius: 18px;
    padding: 1.5vh 1.5vh;    
    transition: 0.2s;
    margin-top: 1em;
}

.bouton-3:hover{
    background-color: white;
    border: 2px solid #005a7a;
    color: #005a7a;
}

.small-bouton{
    border: 2px solid #1598c8;
    background-color: #1598c8;
    color: white;
    font-size: 14px;
    border-radius: 12px;
    padding: 1vh 1.5vw ;       
    transition: 0.2s;
    margin-top: 1em;
}

.small-bouton:hover{
    background-color: white;
    border: 2px solid #1598c8;
    color: #1598c8;
}

.small-bouton-2{
    border: none;
    background-color: #eee;
    color: #005a7a;
    font-size: 14px;
    border-radius: 12px;
    padding: 1vh 1.5vw;    
    transition: 0.2s;
    margin-top: 1em;
}

.small-bouton-2:hover{
    background-color: #ddd;
}

/*choix entre x éléments*/

.choix-radio{
    border: 1px solid #1598c8;
    color: #005a7a;
    font-weight: 600;
    border-radius: 18px;
    padding: 0.5em;
    margin-bottom:1em;        
    transition: 0.2s;
    margin-top: 1em;
    margin-bottom: 1em;
    text-align: center;
}

.choix-radio-actif{
    background-color: #1598c8;
    color: white;
}

/**************************** CHAMPS DE SAISIE (INPUT, SELECT) ****************************/

.titre-champ-saisie {
    font-style: italic;
    font-weight: bold;
    color: grey;
    margin-bottom: 0.3em;
    margin-left: 0.8em;
    margin-top: 1vw;
    font-size: 1.5vh;
    text-align: left;
}

.champ-saisie{
    border: 1px solid #1598c8;
    border-radius: 18px;
    padding: 1.5vh 1.5vh;
    margin-bottom:1em;
    font-size: 15px;
}

.select{
    border: 1px solid #1598c8;
    border-radius: 18px;
    padding: 1.5vh 1.5vh;
    margin-bottom:1em;
    background-color: white;
    color: black;
    -webkit-appearance: none!important;
    -moz-appearance: none!important;
    appearance: none!important;
}

.symbole {
    float: right;
    position: absolute;
    color: #aaa;
    line-height: 3;
    right: 35px;
}









.navbar {
    padding: 0 1vh!important;
}

.nav-item {
    margin: 0 5em 0 0;
}

.nav-link {    
    color: #1598c8 !important;
}

.navbar-nav {
    text-align: center!important;
}

.dropdown-menu.show {
    border: 0;
}

.dropdown-item {
    text-align: center!important;
    line-height: 2.5;
}

@media (max-width: 991px) {
.nav-item {
    margin: auto;
    text-transform: uppercase;
    font-weight: bolder;
    padding-top: 3vh;
    padding-bottom: 2vh;
}

.navbar-nav{
    border-top: solid 2px #1598c8;
    padding-bottom: 2vh;
}
  }

/**************************** ICONES ****************************/

.icone-blanc {
    filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(264deg) brightness(100000%) contrast(100%);
}

.icone-bleu-fonce {
    filter: invert(13%) sepia(92%) saturate(6192%) hue-rotate(185deg) brightness(83%) contrast(107%);
}

.icone-bleu-clair {
    filter: invert(43%) sepia(77%) saturate(3882%) hue-rotate(171deg) brightness(102%) contrast(84%);
}

.icone-verte {
    filter: invert(53%) sepia(76%) saturate(527%) hue-rotate(86deg) brightness(98%) contrast(85%);
}



/**************************** AJOUT THIERRY ****************************/

.overlay{
	opacity:0.8;}.overlay{position:absolute;top:0;left:0;bottom:0;right:0;height:100%;width:100%;opacity:0;transition:0.2s ease;
	}
	
.overlay-text{
	position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%);text-align:center;
	}.sobj{position:relative;}
	
.sobj:hover  

.soverlay{opacity:0.8;}

.soverlay{position:absolute;top:0;left:0;bottom:0;right:0;height:100%;width:100%;opacity:0;transition:0.2s ease;}

.soverlay-text{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%);}

.ovr-top,.sovr-top{-moz-transform:translateY(-100%);-webkit-transform:translateY(-100%);-ms-transform:translateY(-100%);transform:translateY(-100%);transition:all 0.4s ease-in-out 0s;
}
.pobj.obj-after{margin-top:16px;border-color:hsl(239,100%,80%);color:hsl(0,0%,20%);}


/*#1DC250*/