*{
	margin: 0px 0px 0px 0px;
	padding:0px 0px 0px 0px;

}



.Principale {
		margin-top: 20px;
	/*margin-bottom: 15px;*/
	background-color: white;/*#228B22*/;
	
	border: solid;
	border-color:#808000; /*#808000;*/


}


.Tete {
	
	/*background-image: url('../../tonlevel_images/pubGauche.jpg');*/

background-color: white;
	

}

.Navigation {
	background-color: white;
}

.Vide {
	background-color: white; /*Le texte qui défile */
}

.Corps {
	background-color: white;
	
}

.Pied {
	background-color: white;
}

.Logo {
	
	background: url('../../../tonlevel_images/tonlevel.ico')  no-repeat;
	height: 44px;
	margin-top: 0px;

}

.Gauche_Haut, .Droite_Haut, .Gauche_Centre, .Gauche_Bas, .Droite_Centre,.Droite_Bas {
	/*box-shadow: 0 0 50px #00FF00 ;*/
	border: 1px solid #808000;
	 box-shadow: 0 0 2px #00FF00 ;
	 /*background-color: green;*/


}

.Gauche {
	
	background-color: white;


   margin-top: 10px;
  	
}


.Droite {
	
	background-color: white;

     margin-top: 10px;
     margin-bottom: 0px;
     padding-bottom: 0px;

}


.Centre {
	
	margin-top: 35px;
	background-color: white;
	

    border: 1px solid #808000;
   
}

.Gauche_Haut {
	
	
	background-color: white;
	margin-top: 25px;   
	
}

.Gauche_Centre {
	
	background-color: white;
	height: 150px;

	margin-top: 25px;
	margin-bottom: 25px;


}

.Gauche_Bas {
	
	
	
	width: 	100%;
	height: 150px;
	
	
}

.list-group-item
{
	height: 37px;
	text-align: center;
}

.Droite_Haut {
	
    
    background-color: white;
    margin-top: 25px;
	

}

.Droite_Centre {
	
	
	height: 150px;

	background-color: white;

	margin-top: 25px;
	margin-bottom: 25px;

	
}

.Droite_Bas {
	
	

   width: 	100%;
   height: 150px;
	
	
}

.Centre_Haut {
	
    background-color: white;
    margin-top: 25px;


}

.Centre_Centre {
	
	margin-top: 25px;
	margin-bottom: 25px;
    background-color: white;
}

.Centre_Bas {
	
    background-color: white;

    border: 1px solid #808000;
    box-shadow: 0 0 10px #00FF00;
}

.Lecture {
	
	background-color: white;

	    border: 1px solid #808000;
    box-shadow: 0 0 10px #00FF00;
}

.Lecteur {
	
	background-color: white;

	    border: 1px solid #808000;
    box-shadow: 0 0 10px #00FF00;
}

.Phonetique {
	
	background-color: white;
	

}

.Expression {
	
	background-color: white;
}



#Vert {
	
	background-color: #16B84E; 
	border-radius: 0;
    color:#FEFEFE;
	width:98px;
	

}
#Jaune {
	
	background-color: #FCDC12; 
	border-radius: 0;
	 color:#FEFEFE;
	 width:97px;
	 

}

#Bleu {
	
	background-color: #26C4EC; 
	/*padding-right: 10px;*/
	border-radius: 0;
	 color:#FEFEFE;
	 width:100px;
	 margin-right:15px;
	 /*padding-right:0;*/
	  /* border: 1px solid #808000;*/

}

/*C'est cette partie qui positionne les boutons de connexion à droite */
#conn {
	
	text-align: right;
	padding-right: 0px;

}



.btn, .btn-secondary {
	height: 26px;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	/*color: black;*/
	font-family: sans-serif,fangsong, monospace, math, Georgia, serif, cursive;
	font-weight: 14;
	font-size: 1em;  /*12px  x-small   80%   ensemble de format de valeurs disponibles */
	font-weight: bolder; /* valeurs possibles   normal lighter bolder 900 100  bolder bold*/
	/*color: indigo;*/

}




.btn-link {
	
	background-color: #16B84E; 
	border-radius: 0;
    color:white;
	height: 30px;
	padding: 0px 15px 0px 15px;
	width: 67px;
}


/*Gestion du Nav */
.navbar-toggler {
	background-color:black;
	color:white;
}

.collapse , .navbar-collapse{
	/*margin-left:  -15px;*/
	margin-left:  0px;
	padding-left:  0px;
	/*background-color: #425B8A;*/
	background-color:#07DE89;  /* #07DE89 couleur du fond du nav se donne ici  #228B22 */
	margin-right :0px;	

	
	/*font-family :Algerian,sans-serif,Arial;*/
	font-size:16px;
	font-weight: bold;	
	font-color:white;
	color: white;


	
}


.navbar-toggler-icon
{
	background-color:white /*Couleur du bouton navBar*/;
	
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;

	
}



.nav-link, .navbar-nav, .nav-item
{
  margin-left: 0px;
	padding-left: 0px;
	/*color: white;*/


}


.navbar, .navbar-expand-lg, .navbar-light, .bg-light, .navbar-toggler
{
	margin:0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	text-align: left;
	color: blue;
	background-color: white;   /* couleur du bouton déroulant */
}


footer
 {
 	
 	text-align: center;

	background-color: white;
	font-family :Arial,verdana;
	 font-size :14px;
	
	 color: blue;
	 height: 25px;
	 padding-top: 5px;
	 font-weight: bold;

	 /*border: 2px solid #808000;*/
	 border-bottom:0;

}


h5 {
	color: red;
	text-align: center;
	font-weight: bold;
	text-decoration: underline;
	/*font-family: sans-serif,fangsong, monospace, math, Georgia, serif, cursive;*/




}

h1 {
	
	text-align :center;
	font-family :Helvetica, sans-serif;/*"Wide Latin" ,Algerian;*/
	font-size :22px;
	font-weight :bolder;



}



h2 {
	color: blue;
	font-size :18px;
	text-decoration: underline;
}

h4 {
	color: blue;
	font-size :18px;
}


h3 {
	color: black;
	font-size :14px;
	
}


p{
	color: black;
	font-size :12px;
	font-family : Georgia, serif;

	/*font-family :"Wide Latin",Algerian ;*/
	
}


/* Gestion des très petit écrans  */
@media (max-width: 575px) {


/*
#Bleu {
	

	margin-right: 0px;
}*/


h1 
{
	
	 margin: 0 auto;

	 font-size :11px;
	 

}

p {
	color: black;
	font-size :14px;

}


h5 {
	
	font-size: 16px;
	


}

h6 {
	
	font-size: 16px;
		

}




h2 {
	color: blue;
	font-size :14px;
	text-decoration: underline;
}

h4 {
	color: blue;
	font-size :15px;
}


h3 {
	color: black;
	font-size :10px;
	
}





.DH {
	
	background-image: url('../../tonlevel_images/pubDroite_petit.jpg')  no-repeat;
}
.GH {
	
	background-image: url('../../tonlevel_images/pubGauche_petit.jpg') ;
}

.Haut_Bas_Milieu 
{
	/*height: 325px;*/
   height: 725px;
  /* box-shadow: 0 0 50px #00FF00 ;*/
   box-shadow: 0 0 50px #00FF00 ;
    border: 2px solid #808000;
	
	padding: : 0px 0px 100px 0px;
}




.btn, .btn-secondary {
	height: 26px;


	font-size: 14px;  /*12px  x-small   80%   ensemble de format de valeurs disponibles */
	font-weight: bolder; /* valeurs possibles   normal lighter bolder 900 100  bolder bold*/
	margin-left: 0px;
    padding-right: 0px;
    padding-left: 0px;
   
    
	

}

#Vert, #Jaune {
	
	width:82px;	
}

 #Bleu {
	
	width:92px;	


}

.Logo {
	background: url('../../tonlevel_images/tonlevel_petit.png')  no-repeat;
	
}


footer
 {
 	
	 font-size :12px;
	
	 color: blue;
	 height: 55px;
	 padding-top: 3px;
	 /*font-weight: bold;*/

}
 

}
/*Fin de la gestion des  petits écrans */


/*Gestion des petits écrans */
@media (min-width: 576px) and (max-width: 767px) {

	h6 {
	
	font-size: 14px;
		

}

h4 {
	color: blue;
	font-size :16px;
}



footer
 {
 	
	 font-size :12px;
	
}

h3 {
	color: black;
	font-size :11px;
	
}


.btn, .btn-secondary {
	height: 26px;


	font-size: 16px;  /*12px  x-small   80%   ensemble de format de valeurs disponibles */
	
}

}/* Fin de la Gestion des petits écrans */



/*Gestion des écrans moyens */
@media (min-width: 768px) and (max-width: 991px) {

		h6 {
		
		font-size: 16px;
			

	}


 
}

/* Fin de la Gestion des  écrans moyens */


/*Gestion des écrans larges */
@media (min-width: 992px) and (max-width: 1199px) {

		h6 {
		
		font-size: 15px;
			

	}
}

/*Fin de la gestion  des écrans larges */

/*Gestion des écrans très larges */
@media (min-width: 1200px)  {

h1 
{
	/*padding-top :45px;*/
	/*background-color: white;*/
	text-align :center;
	font-family :Helvetica, sans-serif;/*"Wide Latin" ,Algerian;*/
	font-size :22px;
	font-weight :bolder;

	/* width :100%;*/
	 /*color: #26C4EC;*/
}

p {
	color: black;
	font-size :20px;



}


h5 {

	text-align: center;
	font-weight: bold;
	font-size: 20px;

text-decoration: underline;	

}


h6 {
	
	font-size: 18px;
		

}

}

/*Fin de la gestion des écrans très larges */