.plugin-font{
    font-family: 'Roboto', sans-serif;
}

.alerte { padding: 8px 15px; margin-bottom: 15px; color: #333; box-sizing: border-box;}
.alerte h3 {font-weight: bold; line-height: 1.3em; font-size: 16px; }
.alerte p { font-weight: normal; font-size: 15px; padding: 0; margin: 10px 0 0 0; line-height: 1.5em;}
.alerte0 {width: 100%; border: 1px solid black; font-weight: bold;}

.alerte1 { background: #00AF50; color: #4b4d54; font-weight: bold; width: 100%;}

.alerte2 { background: #92D14F; color: #4b4d54; font-weight: bold; width: 100%;}

.alerte3 { background: #ffea01; color: #4b4d54; font-weight: bold; width: 100%;}

.alerte4 { background: #FE0000; color: #4b4d54; font-weight: bold; width: 100%;}

.alerte5 { background: #1c1d1d; color: #cccccc; font-weight: bold; width: 100%;}


/***** Plugin ****/



/* div.items > div:not(:target) {display: none}
div.items > div:target {display: block} */
.items{
    display: none;
}

.onglet-container {
    margin: auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    background-color: #f1f1f3;
    box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;
}

a{
    text-decoration: none;
}

.barre-onglet{
    background-color: #2F3093;
    margin: auto;
    width: 90%;
    height: 20px;
    margin-top: -20px;
    margin-bottom: 50px;
    position: relative;
    z-index: 999;
}

.onglet {
    /* z-index: -1; */
    color: #727379;
    padding: 5px;
    width: 100px;
    font-size: 0.8em;
    /* border-radius: 20px; */
    font-weight: bold;
    cursor: pointer;
    text-align: center;
    height: 50px;
    /* background-color: #2F3093; */
    /* background-color: #93B1DD; */
    display: flex;
    align-items: center;
    justify-content: center;
}

.submission input{
    background-color: #2F3093;
    border: none;
    color: white;
    padding: 15px;
    border-radius: 25px;
    cursor: pointer;

}
.submission input:hover{
    box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
}

.submission {
    display: flex;
    justify-content: center;
}

.onglet-active {
    background-color: #2F3093;
    color: white;
}

.content-active {
    display: block;

}

.form-container{
    margin-top: 15px;
    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
    padding: 20px;

}
.onglet:hover{
    background-color: #2F3093;
    color: white;
}

.input-container {
    display: flex;
    margin: auto;
    margin-bottom: 10px;
    width: 80%;
    padding: 20px;

}

.input-container input {
    margin-right: 10px;
}

.container {
    width: 90%;
    margin: auto;
}

.info-container{
    width: 100%;
    margin: auto;
    box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;
}

.loader {
    border: 16px solid #f3f3f3; /* Light grey */
    border-top: 16px solid #3498db; /* Blue */
    border-radius: 50%;
    width: 120px;
    height: 120px;
    animation: spin 2s linear infinite;
    margin: auto;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}