/*Styles navigation spécifiques pour les écrans de petite taille type téléphones portables*/

.styleBouton{                                 /*style version téléphone*/
    box-sizing: border-box;
    width: 105px;                             /*largeur bouton*/
    display: flex;                            /*affichage flexible*/
    flex-flow: column wrap;                   /*affichege en colone*/
    justify-content: center;                  /*Aligne le texte dans la hauteur du bouton*/
    text-align: center;                       /*Aligne le texte dans la largeur du bouton*/
    position: relative;

    font-size: 8pt;

    border: 2px inset indigo;               /*Bordure*/
    border-radius: 10px;

    box-shadow: 3px 7px 9px aqua inset;     /*Ombre*/
    background-color: yellow;               /*Couleur Fond*/   
}
 
.styleBouton:hover{                            /*Couleur bouton survolé*/
    box-shadow: 3px 7px 9px yellow inset;    /*Inversion couleurs*/
    background-color: aqua;
} 
     
.hauteurBouton{
    height:25px;  
}

.hide{
    display: none;
}

/*Styles navigation spécifiques pour les écrans de taille moyenne type tablette*/

@media screen and (min-width: 600px) and (max-width: 849px){

    .styleBouton{         
        font-size: 8pt;
    }
}
/*Styles navigation spécifiques pour les grands écrans type écrans d'ordinateur*/

@media screen and (min-width: 850px){

    .styleBouton{
        width: auto;
        padding: 0pt 5pt;
        font-size: 9pt;
        flex-direction:  row;
        align-content: center;
        justify-content: space-around ;
        float: left;
    }
}