/* REGLES BASIQUES VERSION RESPONSIVE MOBILE*/


/*************************************************************************/

/* GSM & Smartphone                         
/*    
/* Sur tous types d'écran, quand la largeur de la fenêtre est comprise entre 767px et 0px :-p 
pour un petit écran, téléphone portable */

@media all and (min-device-width: 767px) and (max-device-width: 1150px){
    .colonne{
    padding: 30px;}
}

@media all and (max-width: 767px){
    :root{
        font-size: 18px;
        line-height: 22px;
    }
#lettrage{
    width : 100%;
}

.image-lettrage{
    width: 100%;
}
topnav.basic{
    padding-right : none;
    padding : 5px ;
}

topnav ul{
    margin : unset;
    padding : unset;
    display: grid;
    padding-right: none;
    grid-template-columns: 50% 50%;
    width: 100%;
}

topnav li{
    padding : 5px;
}

.nav-accueil ul{
    display: flex;
    flex-direction: column;
}

.grille {
  display: flex;
  flex-direction: column;
}
.colonne{
    padding : 5%;
}

.form{
    width:80%;
    margin :15px;
}

.grille2{
    display:block;
}

.case{
    width: 75%;
  padding: 20px;
  border: var(--mauve) solid 1px;
  margin-left: auto;
  margin-right: auto;
}
}
/*************************************************************************/