@charset "utf-8";
/* CSS Document */

#fond-contener{
	width: 100%;
	height: 690px;
	margin-top: 200px;
	margin-left: auto;
	margin-right: auto;
	background-color:rgba(255,255,255,0.7);}


#fond-gal{
	width: 100%;
	height: 540px;
	margin-top: 50px;
	margin-left: auto;
	margin-right: auto;
	background-color:rgba(255,255,255,0.7);}

#fond-photo{
	width: 35%;
	height: 550px;
	margin-top: 20px;
	float: right;
	background-color:#ffffff;
}


#contener{
	width: 1024px;
	height:650px;
	margin-top: 20px;
	left: 50%;
	margin-left: -512px;
	position: absolute;

	
}



#contenu1{
	width: 300px;
	height: 490px;
	background-color:#ffffff;	
	font-family: 'Roboto', sans-serif;
	font-size: 13px;
	padding-top: 30px;
	padding-bottom: 30px;
	padding-left:40px;
	padding-right: 40px;
	position: absolute;
	margin-left:264px;
	text-align: center;
	display: block;
}



#contenu2{
	width: 300px;
	height: 490px;
	background-color:#ffffff;	
	font-family: 'Roboto', sans-serif;
	font-size: 13px;
	padding-top: 30px;
	padding-bottom: 30px;
	padding-left:40px;
	padding-right: 40px;
	position: absolute;
	margin-left:264px;
	text-align: center;
	display: block;
}



#contenu3{
	width: 300px;
	height: 490px;
	background-color:#ffffff;	
	font-family: 'Roboto', sans-serif;
	font-size: 13px;
	padding-top: 30px;
	padding-bottom: 30px;
	padding-left:40px;
	padding-right: 40px;
	position: absolute;
	margin-left:264px;
	text-align: center;
	display: block;
}

#contenu4{
	width: 300px;
	height: 490px;
	background-color:#ffffff;	
	font-family: 'Roboto', sans-serif;
	font-size: 13px;
	padding-top: 30px;
	padding-bottom: 30px;
	padding-left:40px;
	padding-right: 40px;
	position: absolute;
	margin-left:264px;
	text-align: center;
	display: block;
}




#contenu1bis{
display:none;
font-size: 0px;
	color:transparent;
}



#contenu2bis{
display: none;
	font-size: 0px;
	color:transparent;
}



#contenu3bis{
display: none;
	font-size: 0px;
	color:transparent;
}

#contenu4bis{
	display: none;
	font-size: 0px;
	color:transparent;
	
}
#photo{width: 380px;
	height: 550px;
	background-size: cover;
	position: absolute;
	background-position: center;
	background-image: url(../images/menu1.jpg);
	margin-left: 644px;
}

#titre{
	width: 154px;
	height: 60px;

	font-family: 'Roboto', sans-serif;
	font-size: 24px;
	padding-top: 40px;
	padding-left:40px;
	padding-right: 40px;
	position: absolute;

	
}


#info{
	width: 680px;
	height: 70px;
	font-family: 'Roboto', sans-serif;
	font-size: 13px;
	font-style: italic;
	color:white;
	padding-top: 30px;
	padding-left:40px;
	padding-right: 40px;
	position: absolute;
	background-color: #8f0028;
	margin-top: 550px;
	margin-left: 264px;

	
}

#bouton1{
	width: 234px;
	height: 31px;
	font-family: 'Roboto', sans-serif;
	font-size: 13px;
	color: black;
	position: absolute;
	background-color: #ffffff;
	margin-top: 100px;
	text-align: center;
	padding-top: 19px;
		 -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -ms-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
	
}


#bouton1:hover{
	width: 234px;
	height: 31px;
	font-family: 'Roboto', sans-serif;
	font-size: 13px;
	color: #d0003a;
	position: absolute;
	margin-top: 100px;
	text-align: center;
	padding-top: 19px;
	
}



#bouton2{
	width: 234px;
	height: 31px;
	font-family: 'Roboto', sans-serif;
	font-size: 13px;
	color: black;
	position: absolute;
	background-color: #ffffff;
	margin-top: 150px;
	text-align: center;
	padding-top: 19px;
		 -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -ms-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
	
}


#bouton2:hover{
	width: 234px;
	height: 31px;
	font-family: 'Roboto', sans-serif;
	font-size: 13px;
	color: #d0003a;
	position: absolute;
	background-color: #ffffff;
	margin-top: 150px;
	text-align: center;
	padding-top: 19px;
	
}



#bouton3{
	width: 234px;
	height: 31px;
	font-family: 'Roboto', sans-serif;
	font-size: 13px;
	color: black;
	position: absolute;
	background-color: #ffffff;
	margin-top: 200px;
	text-align: center;
	padding-top: 19px;
		 -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -ms-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
	
}


#bouton3:hover{
	width: 234px;
	height: 31px;
	font-family: 'Roboto', sans-serif;
	font-size: 13px;
	color: #d0003a;
	position: absolute;
	background-color: #ffffff;
	margin-top: 200px;
	text-align: center;
	padding-top: 19px;
	
}


#bouton4{
	width: 234px;
	height: 31px;
	font-family: 'Roboto', sans-serif;
	font-size: 13px;
	color: black;
	position: absolute;
	background-color: #ffffff;
	margin-top: 250px;
	text-align: center;
	padding-top: 19px;
		 -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -ms-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
	
}


#bouton4:hover{
	width: 234px;
	height: 31px;
	font-family: 'Roboto', sans-serif;
	font-size: 13px;
	color: #d0003a;
	position: absolute;
	background-color: #ffffff;
	margin-top: 250px;
	text-align: center;
	padding-top: 19px;
	
}



#bouton1bis{
	width: 234px;
	height: 31px;
	font-family: 'Roboto', sans-serif;
	font-size: 13px;
	color: black;
	position: absolute;
	background-color: #ffffff;
	margin-top: 100px;
	text-align: center;
	padding-top: 19px;
		 -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -ms-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
	display: none;
	
}


#bouton1bis:hover{
	width: 234px;
	height: 31px;
	font-family: 'Roboto', sans-serif;
	font-size: 13px;
	color: #d0003a;
	position: absolute;
	margin-top: 100px;
	text-align: center;
	padding-top: 19px;
	display: none;
	
}



#bouton2bis{
	width: 234px;
	height: 31px;
	font-family: 'Roboto', sans-serif;
	font-size: 13px;
	color: black;
	position: absolute;
	background-color: #ffffff;
	margin-top: 150px;
	text-align: center;
	padding-top: 19px;
		 -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -ms-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
	display: none;
	
}


#bouton2bis:hover{
	width: 234px;
	height: 31px;
	font-family: 'Roboto', sans-serif;
	font-size: 13px;
	color: #d0003a;
	position: absolute;
	background-color: #ffffff;
	margin-top: 150px;
	text-align: center;
	padding-top: 19px;
	display: none;
	
}



#bouton3bis{
	width: 234px;
	height: 31px;
	font-family: 'Roboto', sans-serif;
	font-size: 13px;
	color: black;
	position: absolute;
	background-color: #ffffff;
	margin-top: 200px;
	text-align: center;
	padding-top: 19px;
		 -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -ms-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
	display: none;
	
}


#bouton3bis:hover{
	width: 234px;
	height: 31px;
	font-family: 'Roboto', sans-serif;
	font-size: 13px;
	color: #d0003a;
	position: absolute;
	background-color: #ffffff;
	margin-top: 200px;
	text-align: center;
	padding-top: 19px;
	display: none;
	
}


#bouton4bis{
	width: 234px;
	height: 31px;
	font-family: 'Roboto', sans-serif;
	font-size: 13px;
	color: black;
	position: absolute;
	background-color: #ffffff;
	margin-top: 250px;
	text-align: center;
	padding-top: 19px;
		 -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -ms-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
	display: none;
	
}


#bouton4bis:hover{
	width: 234px;
	height: 31px;
	font-family: 'Roboto', sans-serif;
	font-size: 13px;
	color: #d0003a;
	position: absolute;
	background-color: #ffffff;
	margin-top: 250px;
	text-align: center;
	padding-top: 19px;
	display: none;
	
}


#photogal1{
	width: 20%;
	height: 130px;
	padding-top: 120px;
	font-family: 'Roboto', sans-serif;
	font-size: 24px;
	font-weight:bold;
	color:white;
	background-size: cover;
	background-image: url(../images/galenglish1.jpg);
	margin-top: 20px;
	position: absolute;

	
}




#photogal2{
	width: 20%;
	height: 130px;
	padding-top: 120px;
	font-family: 'Roboto', sans-serif;
	font-size: 24px;
	font-weight:bold;
margin-left: 20%;
	color:white;
	background-size: cover;
	background-image: url(../images/galenglish2.jpg);
	margin-top: 20px;
	position: absolute;

	
}



#photogal3{
	width: 20%;
	height: 130px;
	font-family: 'Roboto', sans-serif;
	font-size: 24px;
	font-weight:bold;
	color:white;
	padding-top: 120px;
margin-left: 40%;
	background-image: url(../images/galenglish3.jpg);
	margin-top: 20px;

	position: absolute;
	background-size: cover;
	
}

#photogal4{
	width: 20%;
	height: 130px;
	font-family: 'Roboto', sans-serif;
	font-size: 24px;
	font-weight:bold;
margin-left: 60%;
	color:white;
	padding-top: 120px;
	background-size: cover;
	background-image: url(../images/galenglish4.jpg);
	margin-top: 20px;
	position: absolute;

	
}



#photogal5{
	width: 20%;
	height: 130px;
	font-family: 'Roboto', sans-serif;
	font-size: 24px;
	font-weight:bold;
	color:white;
	padding-top: 120px;
margin-left: 80%;
	background-image: url(../images/galenglish5.jpg);
	margin-top: 20px;
	position: absolute;
	background-size: cover;
	
}

#photogal6{
	width: 20%;
	height: 130px;
	font-family: 'Roboto', sans-serif;
	font-size: 24px;
	font-weight:bold;
	color:white;
	padding-top: 120px;
	position: absolute;
	background-image: url(../images/galenglish6.jpg);

	margin-top: 270px;
	background-size: cover;
	
}


#photogal7{
	width: 20%;
	height: 130px;
	font-family: 'Roboto', sans-serif;
	font-size: 24px;
	font-weight:bold;
	color:white;
	padding-top: 120px;
	position: absolute;
	margin-top: 270px;
	margin-left: 20%;
	background-image: url(../images/galenglish7.jpg);

	background-size: cover;
	
}

#photogal8{
		width: 20%;
	height: 130px;
	font-family: 'Roboto', sans-serif;
	font-size: 24px;
	font-weight:bold;
margin-left: 40%;
	color:white;
	padding-top: 120px;
	background-size: cover;
	background-image: url(../images/galenglish8.jpg);
	margin-top: 270px;
	position: absolute;
	
}



#photogal9{
	width: 20%;
	height: 130px;
	font-family: 'Roboto', sans-serif;
	font-size: 24px;
	font-weight:bold;
	color:white;
	padding-top: 120px;
	position:absolute;
	margin-top: 270px;
	margin-left: 60%;
	background-image: url(../images/galenglish9.jpg);

	background-size: cover;	 
	
}





#photogal10{
	width: 20%;
	height: 130px;
	font-family: 'Roboto', sans-serif;
	font-size: 24px;
	font-weight:bold;
	color:white;
	padding-top: 120px;
	margin-left: 80%;
	margin-top: 270px;
	position: absolute;
	background-image: url(../images/galenglish10.jpg);
	background-size: cover;
	
}

	#photogal1,#photogal1:hover,
	#photogal2,#photogal2:hover,
	#photogal3,#photogal3:hover,
	#photogal4,#photogal4:hover,
	#photogal5,#photogal5:hover,
	#photogal6,#photogal6:hover,
	#photogal7,#photogal7:hover,
	#photogal8,#photogal8:hover,
	#photogal9,#photogal9:hover,
	#photogal10,#photogal10:hover{
		background-position: center center;
	}

/*/////////////////////////////TABLETTE//////////////////////////////*/



@media only screen and (min-width:650px) and (max-width:1044px) {
	


#fond-photo{
opacity:0;
		width:0px;
		height:0px;}


#contener{
	width: 100%;
	height:650px;
	margin-top: 20px;
	left: inherit;
	margin-left: inherit;
	position: relative;
}

	
	#contenu1,#contenu2,#contenu3,#contenu4{
top:20px;
		width:30%;
		margin-left:30%;
		padding-left:5%;
		padding-right: 5%;
		display: block;
}
	
		#contenu1bis,#contenu2bis,#contenu3bis,#contenu4bis{
display: none;
			font-size: 0px;
	color:transparent;
}
	
	
	
	#photo{width:30%;
	position:absolute;
		margin: inherit; 
		margin-left: 70%
	
	
}

#titre{
position:absolute;
		margin: inherit;
	
	
}


#info{
position:absolute;
		margin: inherit; 
	width:90%;
	padding-left:5%;
	padding-right: 5%;
	margin-top:570px;
	right:0px;
	
	

	
}

#bouton1,#bouton1:hover,
	#bouton2,#bouton2:hover,
	#bouton3,#bouton3:hover,
	#bouton4,#bouton4:hover
	{
	position:absolute;
		 width:180px;
		top:20px;
		
}
	
	
	#bouton1bis,#bouton1bis:hover,
	#bouton2bis,#bouton2bis:hover,
	#bouton3bis,#bouton3bis:hover,
	#bouton4bis,#bouton4bis:hover
	{
	position:absolute;
		 width:180px;
		top:20px;
		display: none;
		
}




	
	#photogal1,#photogal1:hover,
	#photogal2,#photogal2:hover,
	#photogal3,#photogal3:hover,
	#photogal4,#photogal4:hover,
	#photogal5,#photogal5:hover,
	#photogal6,#photogal6:hover,
	#photogal7,#photogal7:hover,
	#photogal8,#photogal8:hover,
	#photogal9,#photogal9:hover,
	#photogal10,#photogal10:hover{font-size:20px;
	}
}



/*/////////////////////////////TELEPHONE//////////////////////////////*/

@media only screen and (max-width:650px){
	
	
	#fond-contener{
	width: 100%;
	height: 1090px;
	margin-top: 200px;
	margin-left: auto;
	margin-right: auto;
	background-color:rgba(255,255,255,0.7);}
	
	
	#fond-photo{
opacity:0;
		width:0px;
		height:0px;
	}

#fond-gal{
	width: 100%;
	height: 240px;
	margin-top: 50px;
	margin-left: auto;
	margin-right: auto;
	background-color:rgba(255,255,255,0.7);}

	
	
	
#contener{
	width: 100%;
	height:650px;
	margin-top: 20px;
	left: inherit;
	margin-left: inherit;
	position: relative;
}

	
	#contenu1{
	display: none;
			font-size: 0px;
	color:transparent;
		width:0px;
		height: 0px;
}
	
		#contenu2{
	display: none;
			font-size: 0px;
	color:transparent;
			opacity: 0;
				width:0px;
		height: 0px;
}
	
	
		#contenu3{
	display: none;
			font-size: 0px;
	color:transparent;
			opacity: 0;
				width:0px;
		height: 0px;
}
	
	#contenu4{
	display: none;
			font-size: 0px;
	color:transparent;
		opacity: 0;
			width:0px;
		height: 0px;
}

	
#contenu1bis{
	width:90%;
	height: 490px;
	background-color:#ffffff;	
	font-family: 'Roboto', sans-serif;
	font-size: 13px;
	padding-top: 30px;
	padding-bottom: 30px;
	margin-left:0;
	color: black;
		padding-left:5%;
		padding-right: 5%;
	position: absolute;
	text-align: center;
	top: 120px;
	display: block;
}



#contenu2bis{
	width:90%;
	height: 490px;
	background-color:#ffffff;	
	font-family: 'Roboto', sans-serif;
	font-size: 13px;
	padding-top: 30px;
	padding-bottom: 30px;
	margin-left:0;
	color: black;
		padding-left:5%;
		padding-right: 5%;
	position: absolute;
	text-align: center;
	top: 120px;
	display: block;
}



#contenu3bis{
	width:90%;
	height: 490px;
	background-color:#ffffff;	
	font-family: 'Roboto', sans-serif;
	font-size: 13px;
	padding-top: 30px;
	padding-bottom: 30px;
	margin-left:0;
	color: black;
		padding-left:5%;
		padding-right: 5%;
	position: absolute;
	text-align: center;
	top: 120px;
	display: block;

}

#contenu4bis{
	width:90%;
	height: 490px;
	background-color:#ffffff;	
	font-family: 'Roboto', sans-serif;
	font-size: 13px;
	padding-top: 30px;
	padding-bottom: 30px;
	margin-left:0;
	color: black;
		padding-left:5%;
		padding-right: 5%;
	position: absolute;
	text-align: center;
	top: 120px;
	display: block;
}
	
	
	
	
	
	
	

	
	
	#photo{width:100%;
		top: 650px;
position: absolute;
		margin: inherit; 
		margin-left:0;
		height:300px;
	
	
}

#titre{
position: absolute;
		margin: inherit;
	
	
}


#info{
position: absolute;
		margin: inherit; 
	width:90%;
	padding-left:5%;
	padding-right: 5%;
	margin-top:0;
	right:0px;
	top:970px;
	
	

	
}

#bouton1,#bouton1:hover,
	#bouton2,#bouton2:hover,
	#bouton3,#bouton3:hover,
	#bouton4,#bouton4:hover
	{
	display: none;
			font-size: 0px;
		background-color: transparent;
	color:transparent;
		width:0px;
		height: 0px;
		margin: 0;
}
	
	
	#bouton1,
	#bouton2,
	#bouton3,
	#bouton4
	{
	display: none;
			font-size: 0px;
		background-color: transparent;
	color:transparent;
		width:0px;
		height: 0px;
		margin: 0;
}
	
		#bouton1:hover,
	#bouton2:hover,
	#bouton3:hover,
	#bouton4:hover
	{
background-color:	display: none;
			font-size: 0px;
		background-color: transparent;
	color:transparent;
		width:0px;
		height: 0px;
		margin: 0;
}
	
	
	
	#bouton1,#bouton1:hover
	{ 	display: none;
			font-size: 0px;
		background-color: transparent;
	color:transparent;
		width:0px;
		height: 0px;
		margin: 0;

			
}
	#bouton2,#bouton2:hover
	{
		display: none;
			font-size: 0px;
		background-color: transparent;
	color:transparent;
		width:0px;
		height: 0px;
		margin: 0;
		
}
	
	#bouton3,#bouton3:hover
	{
		display: none;
			font-size: 0px;
		background-color: transparent;
	color:transparent;
		width:0px;
		height: 0px;
		margin: 0;
			
}
	
	#bouton4,#bouton4:hover
	{
			display: none;
			font-size: 0px;
		background-color: transparent;
	color:transparent;
		width:0px;
		height: 0px;
		margin: 0;
}

	
	
	
	#bouton1bis,#bouton1bis:hover,
	#bouton2bis,#bouton2bis:hover,
	#bouton3bis,#bouton3bis:hover,
	#bouton4bis,#bouton4bis:hover
	{
position: absolute;
		 width:50%;
		top:20px;
		display: block;
}
	
	
	#bouton1bis,
	#bouton2bis,
	#bouton3bis,
	#bouton4bis
	{
background-color: #8f0028;
		color: white;
		display: block;
}
	
		#bouton1bis:hover,
	#bouton2bis:hover,
	#bouton3bis:hover,
	#bouton4bis:hover
	{
background-color:#d0003a;
		color:white;
		display: block;
}
	
	
	
	#bouton1bis,#bouton1bis:hover
	{ margin-top: 0px;
		display: block;

			
}
	#bouton2bis,#bouton2bis:hover
	{
		margin-left: 50%;
		margin-top: 0px;
		display: block;
		
}
	
	#bouton3bis,#bouton3bis:hover
	{
		margin-top: 0px;
		top: 70px;
		display:block;
			
}
	
	#bouton4bis,#bouton4bis:hover
	{
		margin-top: 0px;
		top:70px;
		margin-left: 50%;
		display: block;
}

	
	
	
	
	
	
#photogal1,#photogal1:hover,
	#photogal2,#photogal2:hover,
	#photogal3,#photogal3:hover,
	#photogal4,#photogal4:hover,
	#photogal5,#photogal5:hover,
	#photogal6,#photogal6:hover,
	#photogal7,#photogal7:hover,
	#photogal8,#photogal8:hover,
	#photogal9,#photogal9:hover,
	#photogal10,#photogal10:hover{font-size:13px;
		font-weight: normal;
		height:60px;
		padding-top:40px;
		top:1460px;
	 
	}	
	
	
		#photogal6,#photogal6:hover,
	#photogal7,#photogal7:hover,
	#photogal8,#photogal8:hover,
	#photogal9,#photogal9:hover,
	#photogal10,#photogal10:hover{margin-top:120px;
	}	
	
}