body, html {height:100%; margin: 0px; padding: 0px;
   /* background-image: linear-gradient(to right, #cccc00 0%, #ffcc66 100%); */
  /* background: linear-gradient(to right, #d580ff 0%, #ff9933 100%); } */ 

background-image : url("fond-mus.jpg"); background-size: cover; }

backToTop { /* ne fonctionne pas */
    position: fixed;
    top: 20px;    right: 20px;
    z-index: 10;     height: 32px;    width: 36px;
    background-color: #ccc;
    border-radius: 4px;
    transition: background-color .2s ease-in,opacity .2s linear;
    opacity: 0;    text-align: left;
}

/* sert a placer le footer en bas mais HR ne fonctionne plus */
body {  display: flex;  flex-direction: column; } 

a[href*="http"]
 {color: blue; text-decoration: underline; 
  background: url('/Images/ext-link3.png') no-repeat 100% 0; /* ext-link1 (leger)  ext-link2 (moyen)  ext-link3 (gras) */
  background-size: 10px 10px;
  padding-right: 18px; /* 19px */
 }
 /* Images/YouTube.png */
 a[href*="https://www.you"]
 {color: black; text-decoration: underline;  /* none */
  background: url('/Images/Video.png') no-repeat 100% 0; /* ext-link1 (leger)  ext-link2 (moyen)  ext-link3 (gras) */
  background-size: 15px 20px; /* decalage ,hauteur  */
  padding-right: 18px; /* 
  padding-left: 10px; padding-right: 20px; rien,19px */
 }
 
 a[href*="https://you"]
 {color: black; text-decoration: underline;  /* none */
  background: url('/Images/Video.png') no-repeat 100% 0; /* ext-link1 (leger)  ext-link2 (moyen)  ext-link3 (gras) */
  background-size: 15px 20px; /* 20,30 */
  padding-right: 18px; /*
  padding-left: 10px; padding-right: 20px; 19px */
 }
/* __________________________________ menu ________________________ */
#haut {  position: sticky;  top: 0px; }

nav > div > a:hover { color: solid white; text-decoration: none;	} /* Ajout de nav devant div (pour rectifier le footer) */
nav > div > a:link 	{ color: solid green ; text-decoration: none; } 
nav > div > a:visited { color: solid green }
nav > div > a:active { color: solid green }

nav { width: 100%; background-color: #cc9900 ;} /* fond bandeau #cc9900 b31aff #D2691E */ 
nav > ul { margin: 0px; padding: 0px; solid #fff;}
nav > ul::after {content:"";display: block; clear: both;}
nav > ul > li { float: left; position: relative; }
/* taille menu */
nav > ul > li a {padding: 10px 8px; color: #FFF; } /* couleur menu FFF - 10 10 espace entre les menus  */
 /*  barre sur le menu 7+3=10 pixels couleur (228,77,38,0.15) */
nav > ul > li:hover a {padding:7px 5px 10px 8px;} /* 7 15px espace entre les menus - 10 8px debut sous menus */
.menu:hover   {border-top:3px solid yellow ;  background-color: RBGa(0,255,0,0.15); } /* petite barre  - 255,255,0,0.15 */ 

nav li { list-style-type: none; }
.submenu {display: none } /* cacher les sous menu */
nav  a{ display: inline-block; text-decoration:none;}
nav li:hover .submenu{display: inline-block; position: absolute;
                    top: 100%; left: 0px; padding: 0px; z-index: 1000;}
/* menus */                  
.menu a {color:#DDD;}
.menu a:hover {color:#FFF;}
/* sous menus */
.submenu li { border-bottom: 1px solid #CCC; } /* lignes de separation solid #CCC */
/* texte  hauteur 15px largeur 300 px  couleur #ddd sous menu */
.submenu li a{ padding:50px 50px;font-size:15px;width: 150px;color:#ddd;font-weight:bold;} /* 150 largeur sous menu - couleur :#220000; */
/* fond sous menu */
.submenu { background-color: #cc9900;}  /* fond sous-menu #cc9900#408000 #b36b00*/
.submenu li:hover a{color:#fff;font-weight:bold;} 

/* ------------------------------------------------------------- heure à droite --- */
nav > div {position: absolute; top: 10px;  right: 10px ; text-align: right;  color: white; font-weight: bold;} 

/* ------------------ centrage -------------------------------------- */
/*
.element {
  margin-top: 50vh; /* poussé de la moitié de hauteur de viewport */
/*
  transform: translateY(-50%); /* tiré de la moitié de sa propre hauteur */
}
/* ------------------ footer -------------------------------------- */

#bas {   position: sticky;  bottom:0; top: bottom; }  

#footer { margin-top: auto;
  font-size: small; text-align: center; vertical-align: center; font-weight: small;
  background: #808080 ;  color: #fff;  /* #2599C2; #cc9900 ; */
  padding: 8px 0px; width: 100%;}

#footer a { font-size: small; vertical-align: text-top; color: #fff;}