body {
    max-width: 100%;
    padding: 1rem;
    font-size : 1rem;
    color: midnightblue; 
}

header {
    margin: 1rem;
}


/*-------------------------------------------------------------*/


/*----------------------------------------------------------*/

nav {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(8rem, 1fr));
    gap: 1rem;
}

a {
    padding: 0.5rem;
    text-decoration: none;
    background-color: #F5A623;
    color: #FDFEFE;
}



/* Style général du tableau */
table {
    width: 100%;
    border-collapse: collapse;
    font-family: 'Arial', sans-serif;
    font-size: 0.7rem;
    margin-bottom: 2rem;
}


/* Style pour les cellules du tableau */
td, th {
    border: 0.01rem solid black;
    height: 4rem;
    

}

.tableau td {
    padding : 1rem;
}

fieldset {
    display: grid;    
    grid-template-columns: 1fr 2fr;
    gap: 2rem;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 1rem;
    margin-top: 1rem;
}

.div_cinq_colonnes {
    display: grid;
    grid-template-columns: 0.5fr 1fr 1fr 1fr 1fr;
    gap : 2rem;
    
    margin: 1rem;
}



.input_radio_checkbox {
    width: 1rem;
}

.grid_columns {
   
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr));
    gap : 1rem;
    padding: 1rem;
}


.button_action {
    padding: 0.5rem;
    width: 8rem;       
    background-color: brown ;
    color: #FDFEFE;
    text-decoration: none;
}

.button_rouge {
   
    width: 8rem;       
    background-color: #F1C40F;
    color: #FDFEFE;
    text-decoration: none;
}

.button_bleu {
   
    width: 8rem;   
    background-color: #48C9B0;
    color: #FDFEFE;
    text-decoration: none;

}

.text_align_center {
    text-align: left;
}

label {
    text-align: right;
    margin-top: 1rem;
    font-size: 1rem;
}

input, select {
    padding: 1rem;
    border: none;
    border-bottom: 0.1rem solid #48C9B0;
    background-color: #D1F2EB;
}

.mini-input {
    width: 2rem;
}

.checkbox {
    width: 3rem;
}

form {
    margin-top: 2rem;
}

/*DEBUT: Mise en forme du calendrier*/

.form_calendrier {
   
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(21rem , 1fr));    
}

.form_calendrier .mois {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    grid-template-rows: repeat(6, 3rem);
    border: none;
    margin-bottom: 10rem;
}

.form_calendrier .mois table thead {
    grid-column: span 7;
    background-color:#6adaa0;
    color: #FDFEFE;
}

.form_calendrier .mois legend {
    color: #6adaa0;
    font-size: 2rem;
    font-weight: bolder;
}

.form_calendrier .mois button, .form_calendrier .mois th, .form_calendrier .mois td {
    border : none;
    
}

.button_calendrier {
    background-color: none;
    font-size: 1.2rem;
}

.mois th {
    font-size: 1.2rem;
}


.form_calendrier .mois .button_calendrier:hover {
    background-color: #6adaa0;
}
.rouge {
    background-color: brown;
    color :white; 
}


.tableau_sans_bordure, .tableau_sans_bordure th, .tableau_sans_bordure td {
    border: none;
}

.tableau_sans_bordure, .tableau_sans_bordure th, .tableau_sans_bordure td {
    border-bottom: 0.01rem solid midnightblue;
    text-align: left;
    font-size: 0.7rem;
}