/* reset */
*{
	margin: 0;
	padding: 0;
}


/************************************************************************* */
/* gestion interne du menu vertical */

.menuEtatOriginal {
	display: flex;
	flex-direction: column;
	justify-content: flex-center;
}

nav ul {  
	height: 100%;
    width: 100%; 
    margin: 0px auto;
    list-style: none;
    padding: 0px; 
    /*background: #F2F2F2;  */
}

nav ul li, nav ul li a{
    display: block;
    text-align: center;
}
nav ul li a {
	font-size: 1.2em;
    margin: 1px 0; 
    padding: 8px 20px; 
    color: #FFF;  
    background: #444;  
    text-decoration: none; 
 
    transition: all 0.3s ease 0.1s; 
}
nav ul li a:hover{
    background: #999; 
    
	transaction-duration: 0.2s;
	transaction-delay: 0s;  
}
/* fin de la gestion interne du menu vertical
/* ******************************************************************  */

/* Gestion du menu Latéral *****************************************  */

.conteneur{
	
	
	color: RGB(121, 142, 164);   /* Faded denin */
	position: absolute;
	height: 100%;
	width: 100%;
	/*margin: 10px;*/
	
	background-color: RGB(237, 241, 254);  /* brilliant white */
	
}

.menuEtatOriginal p{
	color: RGB(237, 241, 254);  /* brilliant white */
	text-align:center;
}

/* Définition de l'état standard */
.menuEtatOriginal{
	position: absolute;  
	right: 100%;  /* décaler de 100% depuis la doite donc cacher à gauche*/
	background-color: RGB(40, 45, 60);  /* navy blazer */
	/*height: 60%; */   /* hauteur du menu non précisé pour qu'il remplisse que l'espace nécéssaire  */ 
	width: 70%;
	border-top: 15px solid RGB(121, 142, 164);   /* Faded denin */
	border-bottom: 15px solid RGB(121, 142, 164);		/* Faded denin */
	/*margin: 5px;*/
	/*padding: 4px;*/
	/*transform: translateX(0);*/
}



/* définition de l'état du menu normale*/
.menuEtatOriginal.menuInvisible{
	transform: translateX(0);
/*	background-color: 35px solid RGB(40, 45, 60);  /* navy blazer */ 
	transition-duration: 2s; /* durer de transition retour */
	transaction-delay: 0s /* delai avant retour de 0s car cliqué */	
}

/* définition de l'état du menu déplacé */
.menuEtatOriginal.menuVisible{
	transform: translateX(130%);
	background-color: RGB(160, 153, 152);  /* gris ash */
	
	/* déclaration de la transition elle dure 2s sans attente */
	transition: transform 1s ease 0s, background-color 2s ease 0s;
}

/* pour le retour automatique du menu */
.menuEtatOriginal.retourAuto{
	transform: translateX(0);
	/*background-color: 35px solid RGB(40, 45, 60);  /* navy blazer */
	transition-duration: 2s; /* durer de transition retour */
	transaction-delay: 2s /* delai avant retour de 3s car automatique */	
}

/* Fin de la gestion du menu latéral ********************************** */

/* Mise en page de la page ***********************************************  */


.conteneur-flexible{
	
	display:flex;
	
}

.flexible-Horizontal{   /* boutons menu + reload + heure */
	flex-direction: row;
	flex-wrap: nowrap;  
	justify-content: space-between; /* alignement axe principale horizont */
	align-items: center; /* alignement axe secondaire verticale */
}
.flexible-Horizontal2{   /* boutons menu + reload + heure */	
	justify-content: flex-end; /* alignement axe principale horizont */
	align-items: flex-start; /* alignement axe secondaire verticale */
}

.flexible-colonne{
	flex-direction: column;
}


.contMilieu{
	/*background-color: red;*/
	/*min-height: 500px;*/
	height: 80%;
}

#bt, #btR, #btGeo, #heure{        
	color: RGB(121, 142, 164);
	font-size: 2em;
	/*border: 0;*/
	/*background-color: black;*/
	/*position: relative;*/	
	text-align: center;
	
}
#btR {
	/*width: 40px;*/
	font-size: 1.5em;
	/*height: 80px;*/
}

#bt{
	width: 40px;
}

#imgGeo	{	

	/*background:url(images/google2.png) no-repeat center;*/
	/*background-color: blue;*/
	/*width: 50px;*/
	/*margin-left: 5px;*/
	
}
.barreH .stopGeo, .barreH .geolocLC{
	color: RGB(121, 142, 164);
	/*border: 5px solid RGB(237, 241, 254); */  /* vert Fluo */
	
}


.barreH .stopGeo:hover, .barreH .geolocLC:hover{
	
	color: orangered;
	
}

.stopGeo.cliqueG {
	/*background-color: lime;   /* vert fluo */
	color: limegreen;
	/*border: 5px solid RGB(160, 153, 152);  /* gris ash */
	
}

#heure, #date{    /* permet de decaler vers la gauche ces 2 éléments */
	margin-right: 8px;
}
#semaine{
	margin-right: 25px;
}
.dateSemaine{
	font-size: 1em;
}

#btR:before{
	content: "\0021BB";
}

#p a{
	text-align: center;
	font-size: 1.5em;
}