body
{
    font-size: 28;
}

header
{
    background-color: lightblue;
    width: 100%;
    height:80px;
    top: 0;
    left : 0;
    position: fixed;
}
a
{
    text-decoration: none;
}

#headerLogo
{
    background-image: url("Imgs/logo.png");
    background-size: 80px;
    background-position: center;
    background-repeat: no-repeat;
    width:90px;
    height:80px;
    top : 0;
    left : 0;
    position: fixed;
}

#headerTitre
{
    background-image: url("Imgs/titre.png");
    background-size: 220px;
    background-position: center;
    background-repeat: no-repeat;
    width:100%;
    height:100%;
    color: lightblue;
}

#headerBouton
{
    background-image: url("Imgs/menu.png");
    background-size: 70px;
    background-position: center;
    background-repeat: no-repeat;
    width:90px;
    height:80px;
    top : 0;
    right : 0;
    position: fixed;
}

#headerMenu
{
    display:none;
    background-color: lightblue;
    border:2px solid blue;
    padding:7px;
    top : 80px;
    right : 2;
    position: fixed;
}

#messagePopup
{
    top:0;
    left:0;
    position:fixed;
    width:100%;
    height:100%;
    background-color: rgba(125,125,125,0.5);
    z-index: 10;
    display: none;
}
#messagePopupConteneur
{
    display:flex;
    width:100%;
    height:100%;
    align-items: center; 
    justify-content: center;
    flex-direction: column;

}

#messagePopupTitre
{
    background-color: lightcyan;
    padding:10px;
    margin-bottom: 20px;
}

#messagePopupTexte
{
    background-color: white;
    padding: 20px;
}

footer
{
    background-color: lightblue;
    width: 100%;
    bottom: 0;
    left : 0;
    position: fixed;
    font-size: 16px;
}

main
{
    padding-top : 90px;
    padding-bottom: 90px;
    padding-left:10px;
    padding-right: 10px;
}

.PM_Nom
{
    border: solid 2px black;
    border-radius: 10px;
    width:80%;
    margin-top: 0px;
    margin-left: 10%;
    margin-right: 10%;
    margin-bottom: 20px;
    padding : 10px;
    background-color: lightcyan;
    font-weight: bold;
    text-align: center;
    size:15px;
}

.PM_Cadres
{
    width:100%;
}
.PM_Cadre
{
    border: solid 1px black;
    border-radius: 8px;
    width:42%;
    margin-top: 0px;
    margin-left: 3%;
    margin-right: 3%;
    margin-bottom: 20px;
    float:left;
}

.PM_Cadre_Titre
{
    padding:10px;
    background-color: lightcyan;
    text-align: center;
}

.PM_Cadre_Texte
{
    border-top : solid 1px cyan;
    width:99%;
    height: content-box;
    min-height:100px;
    padding:2px;
}

.PM_Ligne
{
    display:flex;
    width:100%;
    height:content-box;
}
.PM_Ligne p
{
    margin: auto;
    width:inherit;
}

.salle
{
    
}

.salle_nom
{
    background-color: lightgray;
    border-bottom : solid 1px black;
}

.salle_details
{
    padding : 10px;
    display:flex;
    width:100%;
    min-height: 100px;
}

.salle_gauche img
{
    width:90%;
    margin-left : 5%
}
.salle_gauche
{
    float:left;
    text-align: center;
    width:200px;
}

.salle_droite
{
    float:left;
    
}
.salle_consigne
{
    width:40px;
    margin-right : 5%
}

.ouverture
{
    border: solid 1px black;
    border-radius: 5px;
    width:100%;
    margin-bottom: 20px;
}

.ouverture_nom_salle
{
    padding:10px;
    background-color: lightcyan;
    border-bottom : solid 1px cyan;
    
}

.ouverture_nom_salle_i
{
    padding:10px;
    background-color: lightgreen;
    border-bottom : solid 1px green;
    
}

.ouverture_capacite_salle
{
    width: 200px;
    text-align: center;
    vertical-align: middle;
    font-style:italic;
}

.ouverture_details
{
    display:flex;
    width:100%;
    height: content-box;
    min-height:100px;
}

.ouverture_details_vendredi
{
    display:flex;
    width:100%;
    height: content-box;
    min-height:100px;
    background-color : #fdf6fd;
}

.ouverture_gauche
{
    display:flex;
    float:left;
    border-right : solid 1px cyan;
    min-width:55%;
    padding-left:10px;
    flex-direction: column;
    
}

.ouverture_gauche_i
{
    display:flex;
    float:left;
    border-right : solid 1px green;
    min-width:55%;
    padding-left:10px;
    flex-direction: column;
    
}

.ouverture_ligne
{
    margin-top:10px;
    display:flex;
    padding-left:10px;
}

.ouverture_codeEL
{
    width: 200px;
    text-align: center;
    vertical-align: middle;
    padding-top: 12px;
    font-family: courier;
    font-size: larger;
}

.ouverture_salle
{
}

.ouverture_note
{
    
}

.ouverture_droite
{
    float:left;
    width:100%;
    padding-left:20px;
    padding-right:20px;
}

.consigne
{
    width:40px;
    margin-left:5px;
}

.MO
{
    width:100%;
    border-bottom: solid 1px lightgray;
    padding:5px;
}

.MO_nom
{
    display: inline-block;
}

.MO_formats
{
    display: inline-block;
    float:right;
    padding-top:8px;
}

.MO_choix
{
    border:solid 2px black;
    font-size: 15;
    font-weight: bold;
    padding-left: 40px;
    padding-right: 40px;
    padding-top: 15px;
    padding-bottom: 15px;
    margin:5px;
    cursor: default;
    height: fit-content;
}

.MO_code_ok
{
    background-color:greenyellow;
}

.MO_code_ko
{
    background-color: red;
}

.MO_booster_ok
{
    background-color:greenyellow;
}

.MO_booster_ko
{
    background-color: red;
}

.Format1
{
    border:solid 1px black;
    border-radius:15px;
    font-size: 15;
    font-weight: bold;
    padding:4px;
    margin:5px;
    cursor: default;
    height: fit-content;
}

.Format2
{
    border:solid 1px black;
    font-size: 15;
    font-weight: bold;
    padding:4px;
    margin:5px;
    cursor: default;
    height: fit-content;
}

.Format3
{
    border:solid 2px blue;
    font-size: 15;
    font-weight: bold;
    padding:4px;
    margin:5px;
    cursor: default;
    height: fit-content;
}

.Connexion
{
    padding:5px;
    padding-top:20px;
    margin: 0px 10px 10px 10px;
    border:solid 1px yellow;
    background-color:lightyellow;
    text-align: center;
    vertical-align: top;
}

.Message_ok
{
    padding:5px;
    margin: 0px 20px 20px 20px;
    border:solid 1px green;
    background-color:lightgreen;
    text-align: center;
    vertical-align: top;
}

.Message_ko
{
    padding:5px;
    margin: 0px 20px 20px 20px;
    border:solid 1px red;
    background-color:lightyellow;
    text-align: center;
    vertical-align: top;
}

.Connexion_Libelle
{
    font-size:25;
    width:170px;
    display:inline-block;
    text-align: left;
}

.Connexion_Input
{
    height:25px;
}

.Connexion_Ligne
{
    display: flex;
    align-items: center;
    justify-content: center;
}

.Formulaire_Ligne
{
    display: flex;
    align-items: center;
}

.comptes_totaux
{
    text-align: center;
    margin: 20px 30% 30px 30%;
    padding:10px;
    border : 2px solid black;
    border-radius: 20px;
}

.mouvement_top
{
    background-color: lightgrey;
    margin-bottom: 20px;
    padding:5px;
}
.mouvement
{
    background-color: #EEEEEE;
    border:1px solid black;
}
.operation
{
    background-color: white;
    border:1px solid darkgrey;
    margin-top: 5px;
    margin-left: 10px;
    font-size: smaller;
}
.mouvement_date
{
    display: inline-block;
    width:220px;
    padding-bottom: 4px;
}
.mouvement_texte
{
    font-weight: bold;
    display: inline-block;
}
.mouvement_comptes
{
    display: inline-block;
    width:570px;
}

.compte
{
    
}
.compte_image
{
    display: inline-block;
    margin-right:7px;
    vertical-align: bottom;
}
.compte_texte
{
    display: inline-block;
    margin-right:7px;
}
.compte_montant
{
    display: inline-block;
    margin-right:7px;
    font-family: Courier, monospace;
}

input[type=submit]
{
    background-color: yellowgreen;
    border: none;
    padding: 8px 16px;
    text-decoration: none;
    margin: 4px 2px;
    cursor: pointer;
}

form
{
    margin-bottom: 6px;
}