/*****************************************/
/* POUR UNE GRILLE AVEC 6PX DE GOUTIERE */
/*****************************************/

	grid{ position:relative; margin-left:-15px; margin-right:-15px; z-index:200;   display: block; 
	
	  -webkit-transition: all 1s ease-in-out;
	  -moz-transition: all 1s ease-in-out;
	  -o-transition: all 1s ease-in-out;
	  transition: all 1s ease-in-out;
	
	} /* Définir les margins la moitier de la goutière */
	
	
	grid .col1de2, grid .col1de3, grid .col2de3, grid .col1de4, grid .col3de4,
	grid .col1de5, grid .col2de5, grid .col3de5, grid .col4de5, 	
	grid .col1de6,	grid .col5de6, grid .colfull, grid .col1de8{ /*float:left;*/ display:inline-block; vertical-align:top; }
	

	
	grid .colfull{ width:100%; }
	
	grid .col1de2{ width:50%; }
	
	grid .col1de3{ width:33.33333333%; }
	grid .col2de3{ width:66.66666666%; }

	grid .col1de4{ width:25%; }
	grid .col3de4{ width:75%; }

	grid .col1de5{ width:20%; }
	grid .col2de5{ width:40%; }
	grid .col3de5{ width:60%; }
	grid .col4de5{ width:80%; }
	
	grid .col1de6{ width:16.66666666%; }
	grid .col5de6{ width:83.33333333%; }

	grid .col1de8{ width:12.5%; }



	
	grid:after{ width:100%; height:0; display:block; clear:both; content:" "; }
	

	grid .object{ position:relative; padding:0px; margin-left:15px; margin-right:15px;  /* margin bottom à changer au besoin */
		
  	}
	
	grid .objectinner{ position:absolute; background-color:#fff; text-align:center; padding:10px; }


	grid .objectinnercontent{ position:absolute; left:8px; right:8px; top:8px; bottom:8px; background-size:cover; background-position:center center; background-repeat:no-repeat; }

	grid .objectpointer{ cursor:pointer; }
	grid .objectpointer grid .objectinner:hover{ opacity:0.5;  }



/* Défini la hauteur d'un object de grille si l'élément n'a pas de hauteur spécifique comme un IMG tag */

/*

@media screen and (max-width: 1300px){ 

	grid .col1de3{ width:50%; }

}

@media screen and (max-width: 660px){ 

	grid .col1de3{ width:100%; }
	grid .col1de2{ width:100%; }

}

*/