
/**************/
/*Monitor 1024*/
/**************/
@media screen and (min-width: 1024px) {
	#logo, #mainTitle, #banner, header h1, header h2, .menuFlag, .Flag
	{
		display: inline-block;
	}

	#banner{
		position: relative;
		width: 100%;
		border: 6px black outset;	/* Épaisseur, couleur, effet */
		border-radius: 10px;		/* Arrondissement des bords */
		box-shadow: 6px 6px 6px gray;	/* Ombre */
		background: url('../images/Logo/background_header.png') repeat;
		opacity: 0.9;
		margin-left: auto;		/* Centrage d'un label */
		margin-right: auto;		/* Centrage d'un label */
	}

	#favicon{
		max-width: 35%;
		max-height: 35%;
	}


	header h1{
		position: absolute;
		font-size: 3em;
		font-family: Arial, Impact, serif, sans-serif; 
		font-weight: bold;
		color: blue;
		border: 3px black outset;
		vertical-align: top;
		left: 43%;
		margin-top: 3px;
	}
	
	header h2{
		position: relative;
		font-size: 1.5em;
		font-family: Arial, Impact, serif, sans-serif; 
		font-weight: bold;
		color: blue;
		vertical-align: bottom;
		left: 75%;
	}
	
	.en{
		left: 105%;
	}

	.navFlag{
		border: 2px black outset;
		border-radius: 3px;
		max-width: 45px;
		max-height: 35px;
		text-decoration: none;
	}

	.menuFlag{
		position: absolute;
		right: 5%;
		top: 2%;
	}

	.menuFlag a:hover{
		color: #760001;
		border-bottom: 3px solid #760001;
	}
}


/*******************/
/*Samsung Galaxy S3*/
/*******************/

/*Portrait*/
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
	#logo, #mainTitle, #banner, header h1, header h2, .menuFlag, .Flag
	{
		display: inline-block;
	}

	#banner{
		position: relative;
		width: 100%;
		border: 6px black outset;	
		border-radius: 10px;		
		box-shadow: 6px 6px 6px gray;	
		background: url('../images/Logo/background_header.png') repeat;
		opacity: 0.9;
		margin-left: auto;		
		margin-right: auto;		
	}

	#favicon{
		max-width: 35%;
		max-height: 35%;
	}



	header h1{
		position: relative;
		font-size: 2em;
		font-family: Arial, Impact, serif, sans-serif; 
		font-weight: bold;
		color: blue;
		border: 3px black outset;
		vertical-align: top;
		left: 58%;
		margin-top: 1px;
	}

	header h2{
		position: relative;
		font-size: 1em;
		font-family: Arial, Impact, serif, sans-serif; 
		font-weight: bold;
		color: blue;
		vertical-align: bottom;
		left: 18%;
	}

	.navFlag{
		border: 2px black outset;
		border-radius: 3px;
		max-width: 45px;
		max-height: 35px;
		text-decoration: none;
	}

	.menuFlag{
		position: absolute;
		right: 5%;
		top: 2%;
	}

	.menuFlag a:hover{
		color: #760001;
		border-bottom: 3px solid #760001;
	}
}

/*Landscape*/
@media only screen and (max-width : 480px){
	#logo, #mainTitle, #banner, header h1, header h2, .menuFlag, .Flag
	{
		display: inline-block;
	}

	#banner{
		position: relative;
		width: 100%;
		border: 6px black outset;	
		border-radius: 10px;		
		box-shadow: 6px 6px 6px gray;	
		background: url('../images/Logo/background_header.png') repeat;
		opacity: 0.9;
		margin-left: auto;		
		margin-right: auto;		
	}

	#favicon{
		max-width: 35%;
		max-height: 35%;
	}



	header h1{
		position: relative;
		font-size: 2em;
		font-family: Arial, Impact, serif, sans-serif; 
		font-weight: bold;
		color: blue;
		border: 3px black outset;
		vertical-align: top;
		left: 58%;
		margin-top: 3px;
	}

	header h2{
		position: relative;
		font-size: 1em;
		font-family: Arial, Impact, serif, sans-serif; 
		font-weight: bold;
		color: blue;
		vertical-align: bottom;
		left: 18%;
	}

	.navFlag{
		border: 2px black outset;
		border-radius: 3px;
		max-width: 45px;
		max-height: 35px;
		text-decoration: none;
	}

	.menuFlag{
		position: absolute;
		right: 5%;
		top: 2%;
	}

	.menuFlag a:hover{
		color: #760001;
		border-bottom: 3px solid #760001;
	}
}

/*Landscape*/
/*@media only screen and (min-width : 321px) {

}*/

/**********/
/*iPhone 4*/
/**********/

/*@media only screen and (-webkit-min-device-pixel-ratio : 1.5), only screen and (min-device-pixel-ratio : 1.5) {

}*/

/**********/
/*iPhone 5*/
/**********/
/*@media screen and (device-aspect-ratio: 40/71) {

}*/
/*or

@media screen and (device-width: 320px) and (device-height: 568px) and (-webkit-device-pixel-ratio: 2){

}*/

/**********/
/*iPad 2/3*/
/**********/
/*Landscape*/

@media (max-device-width: 1024px) and (orientation: landscape) {
	#logo, #mainTitle, #banner, header h1, header h2, .menuFlag, .Flag
	{
		display: inline-block;
	}

	#banner{
		position: relative;
		width: 100%;
		border: 6px black outset;	/* Épaisseur, couleur, effet */
		border-radius: 10px;		/* Arrondissement des bords */
		box-shadow: 6px 6px 6px gray;	/* Ombre */
		background: url('../images/Logo/background_header.png') repeat;
		opacity: 0.9;
		margin-left: auto;		/* Centrage d'un label */
		margin-right: auto;		/* Centrage d'un label */
	}

	#favicon{
		max-width: 35%;
		max-height: 35%;
	}



	header h1{
		position: relative;
		font-size: 3em;
		font-family: Arial, Impact, serif, sans-serif; 
		font-weight: bold;
		color: blue;
		border: 3px black outset;
		vertical-align: top;
		left: 58%;
		margin-top: 3px;
	}

	header h2{
		position: relative;
		font-size: 1.5em;
		font-family: Arial, Impact, serif, sans-serif; 
		font-weight: bold;
		color: blue;
		vertical-align: bottom;
		left: 18%;
	}

	.navFlag{
		border: 2px black outset;
		border-radius: 3px;
		max-width: 45px;
		max-height: 35px;
		text-decoration: none;
	}

	.menuFlag{
		position: absolute;
		right: 5%;
		top: 2%;
	}

	.menuFlag a:hover{
		color: #760001;
		border-bottom: 3px solid #760001;
	}
}

/*Portrait*/

@media (max-device-width: 768px) and (orientation: portrait) {
	#logo, #mainTitle, #banner, header h1, header h2, .menuFlag, .Flag
	{
		display: inline-block;
	}

	#banner{
		position: relative;
		width: 100%;
		border: 6px black outset;	/* Épaisseur, couleur, effet */
		border-radius: 10px;		/* Arrondissement des bords */
		box-shadow: 6px 6px 6px gray;	/* Ombre */
		background: url('../images/Logo/background_header.png') repeat;
		opacity: 0.9;
		margin-left: auto;		/* Centrage d'un label */
		margin-right: auto;		/* Centrage d'un label */
	}

	#favicon{
		max-width: 35%;
		max-height: 35%;
	}



	header h1{
		position: relative;
		font-size: 3em;
		font-family: Arial, Impact, serif, sans-serif; 
		font-weight: bold;
		color: blue;
		border: 3px black outset;
		vertical-align: top;
		left: 58%;
		margin-top: 1px;
	}

	header h2{
		position: relative;
		font-size: 1.5em;
		font-family: Arial, Impact, serif, sans-serif; 
		font-weight: bold;
		color: blue;
		vertical-align: bottom;
		left: 18%;
	}

	.navFlag{
		border: 2px black outset;
		border-radius: 3px;
		max-width: 45px;
		max-height: 35px;
		text-decoration: none;
	}

	.menuFlag{
		position: absolute;
		right: 5%;
		top: 2%;
	}

	.menuFlag a:hover{
		color: #760001;
		border-bottom: 3px solid #760001;
	}
}

/********/
/*iPad 4*/
/********/
/*@media screen and (device-width: 768px) and (device-height: 1024px) and (-webkit-device-pixel-ratio: 2) {

}*/

/*************************/
/*Samsung GALAXY Tab 10.1*/
/*************************/
/*Landscape*/

/*@media (max-device-width: 1280px) and (orientation: landscape) {

}*/
/*Portrait*/

/*@media (max-device-width: 800px) and (orientation: portrait) {

}*/



