/* Large Display */
@media only screen
and (min-width: 1200px) {
	
	#global { width:1200px; }
	#header { margin:10px 0 20px 0; }
	#logo { margin:0 10px 0 0; }
	#baseline { margin:20px 0 15px 10px; }
	#menu_top ul { margin:0 40px; }
	
	#navigation .menu { width:960px; margin:-80px 0 0 260px !important; position: absolute !important; }	

	#content { float:left; width:839px;  }
	#col_encarts_accueil { margin-right:30px; width:320px; }
	#col_annexe_accueil { float:right; width:341px; }
	#col_contenu_accueil { float:right; width:490px; }		
	#actu-principale { margin-top:-10px; } 
	#col_encarts_accueil .jesuis { margin-bottom:20px; }
	
	div.breadcrumbs { width:860px; position:absolute; margin:-50px 0 0 -20px;}
	#col_encarts { width:320px; }
	#col_contenu { float:right; width:860px; padding-top:80px !important; } 
	
	
	.cols-2 .column-1 { width:47%; float:left; }
	.cols-2 .column-2 { width:47%; float:right; margin:0 }
	.cols-3 .column-1 { float:left; width:29%; padding:0px 5px; margin-right:4%; }
	.cols-3 .column-2 { float:left; width:29%; margin-left:0; padding:0px 5px; }
	.cols-3 .column-3 { float:right; width:29%; padding:0px 5px; }
	.items-row, .items-leading { overflow:hidden; margin-bottom:10px !important; }
	.column-1, .column-2, .column-3 { padding:10px 5px; }
	.column-2 { width:55%; margin-left:40%; }
	.column-3 { width:30% }	
	
}


/* Desktop */
@media only screen
and (min-width: 960px) and (max-width: 1199px) {

	#global { width:900px; }
	#header { margin-top:10px; }
	#logo { margin:0 30px 0 0; }
	#top_right { width:600px; }	
	#baseline { margin:5px; }
	#baseline br { content:''; width:3px; display:inline-block; }	
	#menu_top { clear:both; margin-bottom:20px; }
	#menu_top ul { margin:0; }	
	#btn_espace_collaboratif { clear:both; }
	
	#navigation .menu { margin-bottom:20px !important; }	
	
	#content { margin:0 30px;  }
	#col_encarts_accueil { margin-right:30px; width:320px; }
	#col_annexe_accueil { margin:40px 30px; }
	#col_contenu_accueil { float:right; width:490px; }	
	#col_encarts_accueil .jesuis { margin-bottom:20px; }
	
	#col_contenu img { width:100%; height:auto; }
	
	.cols-2 .column-1 { width:47%; float:left; }
	.cols-2 .column-2 { width:47%; float:right; margin:0 }
	.cols-3 .column-1 { float:left; width:29%; padding:0px 5px; margin-right:4%; }
	.cols-3 .column-2 { float:left; width:29%; margin-left:0; padding:0px 5px; }
	.cols-3 .column-3 { float:right; width:29%; padding:0px 5px; }
	.items-row, .items-leading { overflow:hidden; margin-bottom:10px !important; }
	.column-1, .column-2, .column-3 { padding:10px 5px; }
	.column-2 { width:55%; margin-left:40%; }
	.column-3 { width:30% }	



}


/* Tablets */
@media only screen
and (min-width: 768px) and (max-width: 959px) {
	
	.hide-mobile
	{
		display:none !important;
	}
    
    #global { width:90%; }
	#logo { margin:0 10px 0 0; }
	#top_right { }	
	#baseline { margin:5px; }
	#baseline br { content:''; width:3px; display:inline-block; }	
	#menu_top { clear:both; margin-bottom:20px; }
	#menu_top ul { margin:0; }	
	#btn_espace_collaboratif { clear:both; }
	
	#navigation .menu { margin-bottom:20px !important; }	
	
	#col_encarts_accueil { margin:20px 0; }		
	
	#col_contenu img { max-width:100%; height:auto; }
	
	
	

}


/* Smartphones to Tablets */
@media only screen
and (min-width: 481px) and (max-width: 767px) {

	.hide-mobile
	{
		display:none !important;
	}
    
    #global { width:90%; }
	#logo { margin:10px auto; }
	#top_left.float_left, #top_left.float_right { float:none !important;}
	#baseline { font-size:120%; text-align:center; width:100%; }
	#baseline br { content:''; width:3px; display:inline-block; }	
	#menu_top { clear:both; margin:20px auto !important; width:100%; }
	#menu_top ul { margin:0; text-align:center; }	
	#btn_espace_collaboratif { clear:both; }
	
	#navigation .menu { margin-bottom:20px !important; }	
	
	#col_encarts_accueil { margin:20px 0; }	
	
	#col_contenu img { max-width:100%; height:auto; }	
	
	
}


/* Smartphones */
@media only screen
and (max-width: 480px) {

	.hide-mobile
	{
		display:none !important;
	}
    
    #global { width:90%; }
	#logo { margin:10px auto; }
	#top_left.float_left, #top_left.float_right { float:none !important;}
	#baseline { font-size:120%; text-align:center; width:100%; }

	#menu_top { clear:both; margin:20px auto !important; width:100%; }
	#menu_top ul { margin:0; text-align:center; }	
	#btn_espace_collaboratif { clear:both; }
	
	#navigation .menu { margin-bottom:20px !important; }	
	
	#col_encarts_accueil { margin:20px 0; }
	
	#col_contenu img { max-width:100%; height:auto; }
	.map { background-size:100% !important;  max-width:100% !important;  }
	canvas {  max-width:100% !important;  }	

	
}