H2{font-family:ailerons;color:#FF931C;text-shadow:-1px -1px black, 1px 1px #333;line-height: 1; margin:0;} /*titre du site*/

H1{font-family:Gabriola; font-size:3vw;  width:20vw; margin:0px;line-height:9vw;  }/*les  titres du sites */

H3{font-family:ailerons; color:darkred ;font-size:30px; margin:0;} 

H4{font-family:Gabriola; color:black;font-size:4vw; margin:0;}/*les sous titres du sites */


/* principales DIV du site SQUELETTE   */

body{
	position: absolute;
	top: 0px;
	left: 0px;
	width:  100%;
	height: 100%;
	margin: 0px;
	display:flex;
	flex-direction: column;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-content: stretch;
    align-items: stretch;
	background-color:#333;
	overflow: hidden;
}

#divHeader{
	display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-around;
    align-content: stretch;
    align-items: flex-start;
 	z-index: 2; 
}

#divBody{
	flex: 1;
	display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-around;
    align-content: stretch;
    align-items: flex-start;
    background-image: url(../images/titreSite.png);
  	background-repeat: no-repeat;
    background-size:contain; 
    background-attachment: inherit;
    background-position: left top;
	background-color: #111;
	z-index: 2; 
}

#divFooter{

	height:4vw;
	border-top: 1px #222 solid;
	background-color: #222;
	z-index: 2; 	
}

/* les  DIV du MENU   */

#blue{
	color: rgb(0,0,255);
	background:  rgb(0,0,255,0.5);
	z-index: 2;
}

#B{

	background: #222;
}

#green{
	color: rgb(0,128,0);
	background: rgb(0,128,0,0.5);
	z-index: 2;
}

#G{
	background: #222;
}

#yellow{
	color: rgb(255,255,0,1);
	background-color: rgb(255,255,0, 0.5);
	z-index: 2;
}

#Y{
	background: #222;
}

#orange{
	color: rgb(255, 165, 0); 
	background: rgb(255, 165, 0, 0.5);
	z-index: 2;
}

#O{
	background: #222;
}

#red{
	color: rgb(255,0,0);
	background:rgb(255,0,0,0.5);
	z-index: 2;
}

#R{
	background: #222;
}

#pink{
	color: rgb(255, 192, 203);
	background: rgb(255, 192, 203,0.5);
	z-index: 2;
}

#P{
	background: #222;
}

#violet{
	color: rgb(238, 130, 238);
	background: rgb(238, 130, 238, 0.5);
	z-index: 2;
}

#V{
	background: #222;
}

#fondLien{  /*image de fond du menu */
	position: absolute;
	width: 100%;
	height: 100%;
	top:10vw;
	left:0px;
	background-image: url(../images/imagesMenu/images1.jpg);
  	background-repeat: no-repeat;
    background-size:100% 100%; 
    background-attachment:fixed;
    background-position: left top;
	z-index: 1;	
}


/* les autres DIV */

#illustration{


}

#carte{

	
}

/* les classes du site   */

.menu{   /*  classe generale des éléménts du MENU   */ 
	width: 9vw;
	height: 9vw;
	margin-top: 0.5vw;
	margin-bottom: 0.5vw;
	display: flex;
	flex-direction: column; 
	align-items: center;
	align-content: stretch;
	justify-content:flex-start;  	
  	border-radius: 50% 50% 50% 50%;
	transition: all 0.4s;		
	overflow: hidden; 
}

.menu:hover{ /*  classe generale des éléménts du MENU AU SURVOL  */	
	width: 20vw;
	height: 60vw;
	margin-top: 0px;
	margin-bottom: 0.5vw;	
 	border-radius: 0% 0% 0% 0%;
	transition: all 0.4s;
}

.title{
	text-align: center;
	
}

.s_menu{
	flex: 1;
	display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: space-around;
    align-content: center;
    align-items: center;
}



.enter{
	font-family:ailerons;
	font-size:1vw;
	color:white;
	border:white solid 1px;
	text-decoration:none;
}