/* Pour que le footer reste en bas de page 
quelque soit le peu de contenu de la page*/
body {
  display: flex;
  min-height: 100vh;
  flex-direction: column;
}

main {
  flex: 1 0 auto;
}


/* Généralités */

.gras{
  font-weight: bold;
}

.italique {
  font-style: italic;
}

/* header */
header{
  background-color: #1b64a0; /* bleu foncé #163d8c*/
  color: white;
}
nav, .sidenav{
  background-color: #23387a; /* bleu foncé #163d8c*/
  color: white;
}


.retrait{
  padding-left: 10px;
  padding-right: 10px;
}

.item{
  border-radius: 5px;
  background-color: #e0f2f1;
}

.critere{
  font-size: 120%;
  color: green;
  font-weight: bold;
}

.marge{
  border-radius: 5px;
  background-color: #388e3c; /*004d40 */
  padding-top: 20px;
  padding-bottom: 20px;
}

.mesure{
  color: white;
  font-weight: bold;
  font-size: 150%;

}

.resultat{
  border-radius: 5px;
  background-color: #fef6ed; /*fcecdc, fee2c6 */
}




/* Boutons */

[type="submit"], #retour{
  background-color: #ee7c1c; /*#ad1457 */
}

[type="submit"]:hover, #retour:hover{
  background-color: #fabe0e; /*#e91e63 */
}


/* Précautions respiratoires */
.chapeau{
  border-radius: 5px;
  padding-top: 20px;
  padding-bottom: 20px;
  font-size: 150%;
}


/* pied de page - footer */
.page-footer{
  /*background-color: #163d8c; */
  background-color: transparent;
  border-top: 3px solid #163d8c;
}

html > body > footer.page-footer > div.footer-copyright{
  background-color: #1b64a0;/* bleu #163d8c*/
}




/*site responsive pour smartphone*/

@media screen and (max-width: 600px) /*780 ou 600px ?*/
{

  h2
  {
    font-size: 25px;
  }

  h3
  {
    font-size: 22px;
  }

  h4
  {
    font-size: 18px;
  }

  


}
