﻿/** ELEMENTS STRUCTURANTS DES PAGES **/

#mSec{
	position : absolute;
	width : auto;
	height : auto;
	top : 0px;
	right :0px;
	left : 0px;
	bottom : 185px;
	text-align : center;
	display : block;
	overflow-x:hidden;
	padding : 0px; margin : 0px;
	/**background-color : rgba(0,0,255,0.5);**/
	overflow-y:hidden;


}
#pgContent{
	vertical-align : top;
	position : absolute;
	display : block;
	width : 500%;
	text-align : left;
	padding : 0px; margin : 0px;
	/**background-color : rgba(255,0,0,0.5);**/
	height : 100%;

}
.pg{
	position : relative;
	display : inline-block;
	width : 20%;
	height : 100%;
	margin : 0px;
	overflow-x : hidden;
	overflow-y : hidden;
	text-align : center;
	/**background-color : rgba(0,255,0,0.5);**/
	vertical-align : top;

}
.pg .subPg{ 					/** pour masquer la scrool bar **/
	width : 102%;
	/**background-color : rgba(120,120,0);**/
	overflow-y:scroll;
	height : 100%;
}


.pg article{
	display : inline-block;
	line-height : normal;
	vertical-align : middle;
	margin-top : -3px;
}
#title{
	position : fixed;
	top : 0px;
	bottom : 187px;
	left : 0x;
	width : 100px;
	text-align : center;
	background-color : rgba(0,0,0,0.5);
	border-right : 1px solid rgb(210,210,210);
	z-index : 10;
}
#title img{
	max-width :60px;
	max-height : 90%;
	vertical-align : middle;
}




/** FOOTER **/

#ftr{
	position : fixed;
	left : 0px;
	right : 0px;
	bottom : 0px;
	height : 35px;
	color : rgb(200,200,200);
	text-align : center;
	font-size : 14px;
	z-index : 2;
	background-color : rgba(10,10,10,1);
}
#ftr div{
	margin-top : 10px;
}
@media only screen and (max-width : 1600px){
	#ftr{
		font-size : 12px;
	}
	#title{
		bottom : 133px;
	}
	#mSec{
		bottom : 133px;
	}
}
@media only screen and (max-width : 1200px){
	#ftr{
		font-size : 8px;
		height : 25px;
	}
	#ftr div{
		margin-top : 2px;
	}
	#title{
		display : none;
		bottom : 66px;
	}
	#mSec{
		bottom : 66px;
	}
	.pg .subPg{ 	
		line-height: normal;
	}
	.pg article{
		padding-top : 10px;
	}
}
