/* Medium screens (640px) */
@media all and (min-width:640px) and (max-width:700px) {
 html { 
  font-size: 120%; 
  }
  /* Info (c'est là qu'on met la flèche down)*/

.info {
	display:block !important;
	position: absolute; 
	top: 3%; left:0%; 	
   	background: rgba(0, 0, 0, 0);
	width: 130px;
	padding:10px;margin:5px 0 65px;border:0;
   	font-family: "PT sans narrow", Helvetica, Arial, sans-serif;
   	color: white;
   	font-size:.9rem;
   	font-weight:normal !important;
	cursor:pointer;
	}  

#footer{
	display:block !important;
	position: fixed;
	display:inline;
	bottom: 0%; right:100%; 
	width: 100% !important; 
	height: 75px;
	background: transparent;
	z-index: 1;
	}
	
/* footer h1 (c'est là qu'on met le médaillon)*/
h1 { 
	display:block !important;
	position:absolute;
	bottom:3%;
	right:-100%;
	}

/*medaillon*/	
h1 a{   display:block !important;
	text-indent: -9999px;	
	background: url(../img/medaillon_100pc.png);
	background-position:50% top ;
	background-repeat:no-repeat;
	height: 75px;
	width: 160px;
	float: left;
	}
	
h1 a:hover{
	display:block !important;
	background-position:50% -75px;
	}
	
	
/* footer ul (c'est là qu'on met la flèche up)*/

#footer ul{
	display:block !important;
	float: left;
	height: 75px;
	}

#footer ul li{
	display:block !important;
	float: left;
	list-style-type: none
	}

#footer ul li.up a{
	display:block !important;
	position:fixed;
	bottom:3%;
	height: 75px;
	width: 120px;
	left:0%;
	background: url(../img/arrows_up_down_75.png) right top no-repeat;
	text-indent: -9999px !important;
	float: left;
	text-decoration:none !important;
	cursor:pointer;
	}

	
 
.first .content-frame iframe,	
.second .content-frame iframe,
.third .content-frame iframe,
.fourth .content-frame iframe,
.fifth.content-frame iframe,
.seventh.content-frame iframe{
	display:block;
	width: 650px !important;
	height:650px !important;
	margin: 0 auto;
	border:0;
	position:relative;
	z-index:0;
	} 

			
}



/* iPads (landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {
/* Styles */
 
 html { 
  font-size: 105%; 
  }
 
.first .content-frame iframe,	
.second .content-frame iframe,
.third .content-frame iframe,
.fourth .content-frame iframe,
.fifth.content-frame iframe,
.seventh.content-frame iframe{
	display:block;
	width: 700px !important;
	height:500px !important;
	max-height:500px;
	margin: 0 auto;
	border:0;
	position:relative;
	z-index:0;
	} 
}

/* iPads (portrait) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) {
/* Styles */
 html { 
  font-size: 105%; 
  }
 
 
.first .content-frame iframe,	
.second .content-frame iframe,
.third .content-frame iframe,
.fourth .content-frame iframe,
.fifth.content-frame iframe,
.seventh.content-frame iframe{
	display:block;
	width: 600px !important;
	height:650px !important;
	max-height:600px;
	margin: 0 auto;
	border:0;
	position:relative;
	z-index:0;
	} 
			
}


 
/* Large screens (1025px) */
@media all and (max-width:1899px) {
html { 
  font-size: 160%; 
  }
  

	/* footer h1 (c'est là qu'on met le médaillon)*/
h1 { 
	display:block !important;
	position:absolute;
	bottom:3%;
	right:-100%;
	}

/*medaillon*/	
h1 a{   display:block !important;
	text-indent: -9999px;	
	background: url(../img/medaillon_100pc.png);
	background-position:50% top ;
	background-repeat:no-repeat;
	height: 75px;
	width: 160px;
	float: left;
	}
	
h1 a:hover{
	display:block !important;
	background-position:50% -75px;
	}
	
	
/* footer ul (c'est là qu'on met la flèche up)*/

#footer ul{
	display:block !important;
	float: left;
	height: 75px;
	}

#footer ul li{
	display:block !important;
	float: left;
	list-style-type: none
	}

#footer ul li.up a{
	display:block !important;
	position:fixed;
	bottom:3%;
	height: 75px;
	width: 120px;
	left:0%;
	background: url(../img/arrows_up_down_75.png) right top no-repeat;
	text-indent: -9999px !important;
	float: left;
	text-decoration:none !important;
	cursor:pointer;
	}

 
.first .content-frame iframe,	
.second .content-frame iframe,
.third .content-frame iframe,
.fourth .content-frame iframe,
.fifth.content-frame iframe,
.seventh.content-frame iframe{
	display:block;
	width: 850px !important;
	height:600px !important;
	margin: 0 auto;
	border:0;
	position:relative;
	z-index:0;
	} 
	
			
}	



/* Large screens (1900px) */
@media all and (min-width:1900px) { 

 html { 
  font-size: 180%; 
  }

/* footer h1 (c'est là qu'on met le médaillon)*/
h1 { 
	display:block !important;
	position:absolute;
	bottom:3%;
	right:-100%;
	}

/*medaillon*/	
h1 a{   display:block !important;
	text-indent: -9999px;	
	background: url(../img/medaillon_100pc.png);
	background-position:50% top ;
	background-repeat:no-repeat;
	height: 75px;
	width: 160px;
	float: left;
	}
	
h1 a:hover{
	display:block !important;
	background-position:50% -75px;
	}
	
	
/* footer ul (c'est là qu'on met la flèche up)*/

#footer ul{
	display:block !important;
	float: left;
	height: 75px;
	}

#footer ul li{
	display:block !important;
	float: left;
	list-style-type: none
	}

#footer ul li.up a{
	display:block !important;
	position:fixed;
	bottom:3%;
	height: 75px;
	width: 120px;
	left:0%;
	background: url(../img/arrows_up_down_75.png) right top no-repeat;
	text-indent: -9999px !important;
	float: left;
	text-decoration:none !important;
	cursor:pointer;
	} 
 
.first .content-frame iframe,	
.second .content-frame iframe,
.third .content-frame iframe,
.fourth .content-frame iframe,
.fifth.content-frame iframe,
.seventh.content-frame iframe{
	display:block;
	width: 1200px !important;
	height:750px !important;
	margin: 0 auto;
	border:0;
	position:relative;
	z-index:0;
	}  
	
}