/* juste pour colonnes  */
.grid4 .col:nth-of-type(4n+1),
.grid3 .col:nth-of-type(3n+1),
.grid2 .col:nth-of-type(2n+1) {
	margin-left: 0;
	clear: left; 
}


.col {float: left; 	margin-left: 3.2%;}
.grid3 .col p{text-align:left}
.grid4 .col {width: 22.6%;}
.grid3 .col {width: 31.2%;}
.grid2 .col {width: 48.4%;}






/*	Ecrans
-----------------------------------------------    */

@media 
	screen and (min-width: 741px) and (max-width: 1399px)
{

 
	body {-webkit-text-size-adjust: 100%; /* Stops Mobile Safari from auto-adjusting font-sizes */         } 
	
	.onlymobile {display:none; width:0; height:0}
		
	#maincontent {    
		display: -webkit-flex;
	  display: flex;
	  -webkit-flex-direction: row;
	  flex-direction: row;
	  }
	  
		.centercontent {    
			-webkit-flex: 1; /* Safari 6.1+ */
		  -ms-flex: 1; /* IE 10 */
		  flex: 1;
		  }
	  
	.rightside { 
		-webkit-flex: 0 0 auto;
		-ms-flex: 0 0 auto;
		flex: 0 0 auto; 
		max-width:300px
		}
		
	.bloc2 {}

  .apres-owl {margin-top:300px}
  figcaption {width:40%}
}




/*	Ecrans bigs
-----------------------------------------------    */

@media 
	screen and (min-width: 1400px) and (orientation:landscape),
       all and (min-width: 1400px)
{


	body {-webkit-text-size-adjust: 100%; /* Stops Mobile Safari from auto-adjusting font-sizes */} 
	.onlymobile {display:none; width:0; height:0}
	
	#maincontent {    
		display: -webkit-flex;
	  display: flex;
	  -webkit-flex-direction: row;
	  flex-direction: row;
	  }
	.centercontent {    
		-webkit-flex: 1; /* Safari 6.1+ */
	  -ms-flex: 1; /* IE 10 */
	  flex: 1;
	  }
	.rightside { 
		-webkit-flex: 0 0 auto;
		-ms-flex: 0 0 auto;
		flex: 0 0 auto; 
		max-width:300px
		}
	.bloc1 {}	
	.bloc2 {}
	
	.apres-owl {margin-top:330px}
	 figcaption {width:40%}
 }









/*	mobiles et petits écrans jusqua 740
-----------------------------------------------    */

@media screen
and (max-width : 740px)

{

	.grid2 .col {
		width: 100% !important;
		margin-left: 0 !important;
		clear: none !important; text-align:center !important
	}
	.grid2 .col h3, .grid2 .col h4, #allevents {text-align:center}
	.grid4 .col {width: 31.2%;}
	.grid4 .col:nth-of-type(4n+1) {margin-left: 3.2%;clear: none;}
	.grid4 .col:nth-of-type(3n+1) {margin-left: 0;clear: left;}


	.footer  p {text-align:center !important}
		
	/* gestion des mots longs */
	p {
	    word-wrap: break-word; /* passage à la ligne forcé */
	   -webkit-hyphens: auto; /* césure propre */
	   -moz-hyphens: auto;
	    hyphens: auto;
		}
		
	.pagenormale {margin-top:30px}
	
	
	.site-title, h1 {  	 text-align:center !important; width: 100% !important; 
		margin-left:auto !important; margin-right:auto !important}
	
	.onlyscreen {display:none; width:0; height:0}
	
	
	
	.totop { font-size: 40px;bottom:5px; right:25px;}
	
	#section-groupe .marged {  text-align: center !important;}
	#section-groupe .white {
	     width:80%; 
	    margin-left:auto; margin-right:auto; 
	    text-align: center !important;
	}
	#section-single-journee .attachment-post-thumbnail {float:none; display:block; text-align:center; margin-left:auto; margin-right:auto}
	
	
	#maincontent {display: flex;
	            flex-direction: column;
	            flex:1;
	        }
		.centercontent {    
			-webkit-flex: 1; /* Safari 6.1+ */
		  -ms-flex: 1; /* IE 10 */
		  flex: 1;
		  }
	   
	.rightside {
	 	-webkit-flex: 0 0 100%;
		-ms-flex: 0 0 100%;
		flex: 0 0 100%;
	}
	
	.apres-owl {margin-top:250px}
	 .captiona {font-size:26px; margin-bottom:10px}
	 .captionb {height:0; width:0; display:none}

}



/*	mobiles et petits écrans jusqua 600
-----------------------------------------------    */

@media screen and (max-width: 600px) {
	/* change grid4 to 2-column */
	.grid4 .col {width: 48.4%;}
	.grid4 .col:nth-of-type(3n+1) {margin-left: 3.2%;clear: none;}
	.grid4 .col:nth-of-type(2n+1) {margin-left: 0;clear: left;}
	.grid3 .col { text-align:center;
		width: 100%; margin-left:auto; margin-right:auto
	}
	

	.tablespecs tr:nth-of-type(2n) {background-color: inherit;}
	.tablespecs tr td:first-child {background: #f0f0f0; font-weight:bold;}
	.tablespecs tr td {display: block;  text-align:center;}

}






/*	mobiles et petits écrans jusqua 480
-----------------------------------------------    */

@media screen and (max-width: 480px) {
	
@media screen and (max-width: 600px) { table {width:100%;} thead {display:
none;} tr:nth-of-type(2n) {background-color: inherit;} tr td:first-child
{background: #f0f0f0; font-weight:bold;font-size:1.3em;} tbody td {display:
block;  text-align:center;} tbody td:before { content: attr(data-th); display:
block; text-align:center;  } }
	

}






