body{
  margin: 0;
}

/* Titre */

header{
  /*height: 100px;*/
  background-color: #7b1fa2; /*purple darken-2*/
  color: white;
  display: flex; /*permet de centrer verticalement h3 dans le header*/
}

h1{
  margin: auto; /*permet de centrer verticalement h3 dans le header*/
  text-align: center;
  color: #fb8c00; /*  orange darken-1*/
}

h3{
  margin: auto; /*permet de centrer verticalement h3 dans le header*/
  text-align: center;
}



/* Règle horizontale */

.divider{
  background-color:orange;
  height: 2px;
  margin-bottom: 10px;

}

/* Information */

.info{
  color: #40aa24;
}


/* Chapeau - carte */
.carte{
  background-color: #8e24aa; /*purple darken-1*/
  color: white;
  height: 50px;
}

.titre_carte{
  font-weight: bold;
  font-size: 120%;
} 

/* Labels */

.input-field > label{
  color: black;
}

/* Boutons radio */


[type="radio"]:not(:checked) + span::before{
  border: 2px solid #8e24aa; 
}


[type="radio"]:checked + span::after, [type="radio"].with-gap:checked + span::after{
  color: #ef6c00; /*orange darken-3 */
  background-color: currentColor;
  border: 2px solid currentColor;
}

.rep{
  color: black;
}

/* Bouton niveau 2 */

#niveau_2{
  background-color: #fb8c00; /*orange darken-1 */
}

#niveau_2:hover{
  background-color: #e65100; /*orange darken-4 */
}


/* Partie Niveau 2 */

#masquer{
  display: none;
}


/* Bouton submit */

[type="submit"], .impression{
  background-color: #8e24aa; /*purple darken-1*/
}


[type="submit"]:hover, .impression:hover{
  background-color: #b843d7; 
}


/* Plan d'action */
#actions{
  color: #1b1464; /*bleu marine du logo*/
}

.comment{
  font-weight: normal;
  font-style: italic;
}


/* 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: #163d8c;
}



/* Généralités */

.gras{
  font-weight: bold;
}

.centre{
  text-align: center;
}

.italique{
  font-style: italic;
}

/* Echelle de score */
.echelle{
  border: 1px solid black;
}


/*site responsive pour smartphone*/

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

  h3
  {
    font-size: 27px;
    margin: auto;
    text-align: center;
  }

  h4
  {
    font-size: 20px;
  }


}




