/* ----------------------------------------------------------------------------------------------- */
/* DÉBUT DES CSS POUR LE MENU */
/* NOTE : LE SYTLE DES MENUS ACTIFS SONT DÉFINIS DANS LE FICHIER menu.html */
/* REVISÉ 2019-05-27
/* REVISÉ 2021-11-08 CHANGER LES PADDING POUR DES MARGIN SI POSSIBLE
/* - ENTRE DEUX ÉLÉMENTS LES MARGIN NE S'AJOUTENT PAS - LE PLUS GRAND EST PRIS EN COMPTE */
/* AJOUT 2021-11-14 CLASS POUR REDUIRE LA LARGEUR DES ÉLÉMENT LES PLUS DU MENU */
/* ----------------------------------------------------------------------------------------------- */
@charset "UTF-8";

/* nav_contenant - CONTENANT POUR LE BLOC ACCUEIL ET LE BLOC MENU */
#nav_contenant {
  float: left;
  /* LE MENU RESTE EN HAUT DE LA PAGE LORS DU DÉFILEMENT VERTICAL */
  position: -webkit-sticky; /* Safari */
  position: sticky; top: 2px;
  width: 155px;
  height: auto;
  /* top, right, bottom, left*/
  /* haut, droit, bas, gauche */
  margin: 1px;
  /* margin: 1px 1px 1px 1px; */
  /* padding: 3px 0px 0px 0px; */
  border-style:solid;
  border-width: 0px;  /* pas de bordure */
  /* font-family: "Arial Narrow" , Arial, Sans-Serif; */
}

#case_accueil {  /* CASE CONTENANT LE MOT Accueil */
  height: auto;
  width: auto;
  background-color: var(--VarMonBleuMedium);
  text-align: center;
  border-radius: 6px;
  /* padding: 8px 0px 10px 0px; */
  padding: 6px 2px 7px 2px;
  /* haut, droit, bas, gauche */
  margin: 1px 1px 0px 1px;
  /* overflow: auto; */
}

#case_accueil a {
  /* display: block; PERMET DE CLIQUEZ DANS LA CASE */
  display: block;
  overflow: hidden;
  font-weight: bold;
  font-size: 1.8rem;
  /* font-size: 2.4rem; */
  /* COULEUR DU LIEN ACCUEIL */
  color: var(--VarMonBlanc);
}

#case_accueil a:hover { color: var(--VarMonJaune); }

/* debut bloc id menu à l'intérieur de nav_contenant */
/* juste pour référencer le reste des composantes du menu */
#menu { /* rien ici */ }

#menu .menu_niveau_1 {
  height: auto;
  width: auto;
  /*COULEUR FOND DES MENUS PRINCIPAUX*/
  /*background-color: MediumBlue;*/
  background-color: var(--VarMonBleuMedium);
  text-align: left;
  /* ajouter un espace entre les menus principaux */
  /* border-style: solid;   */
  /* border-color: white; */
  /* border-width: 2px 0px 0px 0px; */
  /* top, right, bottom, left*/
  /* haut, droit, bas, gauche */
  /* padding: 10px 0px 10px 0px; */
  margin:3px 1px 3px 1px;
  border-radius: 6px;
}

#menu .menu_niveau_1 a {
  display: block; /* PERMET DE CLIQUEZ DANS LA CASE */
  /* COULEUR DES LIENS DE NIVEAU_1 */
  color: var(--VarMonBlanc);
  /* haut, droit, bas, gauche */
  padding: 10px 6px 10px 5px;
  /* GROSSEUR DES FONTS DES LIENS DU NIVEAU_1 */
  font-size: 1.14rem;
  /* font-size: 1.3rem; */
  font-weight: bold;
  /* POUR NE PAS REDUIRE LARGEUR DE TOUS LES ÉLÉMENT DU MENU VOIR CLASS .reduit */
}

/* AJOUT 2021-11-14 CLASS POUR REDUIRE LA LARGEUR DES ÉLÉMENT LES PLUS DU MENU */
#menu .reduit {
  letter-spacing: -.04rem;
  word-spacing: -.04rem;
}

/*
#menu .menu_niveau_1 a::first-child {
  margin-bottom: 0px !important;
  padding-bottom: 0px !important;
}
*/

/*
#menu .menu_niveau_1 a:visited { }
*/

#menu .menu_niveau_1 a:hover {
  color:var(--VarMonJaune);
}

/* LA DERNIÈRE CASE DES MENUS PRINCIPAUX */
/*
 #menu .menu_niveau_1:last-child { background-color:red; }
*/

/* LA CASE DES SOUS-MENUS */
#menu .menu_niveau_2 {
  width:auto;
  /* COULEUR DU FOND DE LA LIGNE DE SOUS-MENUS */
  /* background-color: MediumBlue; */
  /* haut, droit, bas, gauche */
  padding: 1px 0px 1px 0px;
  margin: 0px;
  /* haut, droit, bas, gauche */
  border-radius: 0px 0px 6px 6px;
}

/*
  #menu .menu_niveau_2:first-child {
    margin-top: 0px !important;
    padding-top: 0px !important;
  }
*/

#menu .menu_niveau_2 a {
  /* PERMET DE CLIQUEZ DANS LA CASE */
  display: block;
  /* GROSSEUR DES FONTS DES LIENS DES SOUS-MENUS */
  font-size: .94rem;
  font-weight: bold;
  color: var(--VarMonBlanc);
  /* haut, droit, bas, gauche */
  padding: 5px 0px 5px 12px;
}

#menu .menu_niveau_2 a:first-child {
  margin-top: 0px !important;
  padding-top: 0px !important;
}

#menu .menu_niveau_2 a:visited {   /* rien ici */ }

/* ------------------------------------------------------------------------------------------- */
/* ------------------------------------------------------------------------------------------- */
/* 2021-10-02 TRANSFERT DE COMMANDES DU CODE MENU À ICI */
/* LES SOUS-MENUS SONT CACHÉS PAR DÉFAUT */
.montrer_administration {display:none;}
.montrer_notre-club {display:none;}
.montrer_infotech {display:none;}
.montrer_autres-infos {display:none;}
/* ------------------------------------------------------------------------------------------- */

/* CLASS POUR AJOUTER DU TEXTE APRÈS */
.ajout_texte { /* rien ici */ }

/* CLASS POUR AJOUTER DU TEXTE APRÈS - TEXTE A AJOUTER */
.ajout_texte::after { content: "»"; }


/* ------------------------------------------------------------------------------------------- */
/* FIN DES CSS POUR LE MENU */
/* ------------------------------------------------------------------------------------------- */

/* ------------------------------------------------------------------------------------------- */
/* DEBUT DES CSS POUR LES MEDIA QUERY POUR LES MOBILES */
/* CES CSS NE CONCERNENT PAS LES PARAMÈTRES DU MENU */
/* ------------------------------------------------------------------------------------------- */
@media screen and (max-width: 760px) {

  #nav_contenant {
    width:145px;
    margin: 1px 2px 1px 2px;
  }

  #menu { /* rien ici */  }

  /* #case_accueil { } */

  /* haut, droit, bas, gauche */
  #menu .menu_niveau_2 a { padding: 5px 0px 5px 8px; }
}

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

  #nav_contenant {
    width:135px;
    /* haut, droit, bas, gauche */
    margin: 1px 2px 1px 2px;
  }

  /* rien ici */
  /* #menu { } */

  /* rien ici */
  /* #case_accueil { } */

  /* haut, droit, bas, gauche */
  #menu .menu_niveau_2 a { padding: 5px 0px 5px 6px; }

}