.row{margin-left: auto; margin-right: auto; max-width: 75rem;}
.row .row{margin-left: -0.1875rem; margin-right: -0.1875rem;}
.row:after{	content:''; /* on_créer_un_contenu_vide */
			display:block;clear:both;height:0}
			
.column{display:inline; /* bonne compatibilité avec les anciens navigateurs */
		float:left;width:100%;min-height:1px;box-sizing:border-box;
		padding:0 0.1875rem 6px;}

.small-hide,.medium-hide,.desktop-hide{display:block}	
.small-show,.medium-show,.desktop-show{display:none}		

/* en général 12 ou 16 columns ici 12 mais tout est possible */
@media screen and (min-width:0){ /* mobile first */
	.small-1{width:8.33333%}
	.small-2{width:16.66667%}
	.small-3{width:25%}
	.small-4{width:33.33333%}
	.small-5{width:41.66667%}
	.small-6{width:50%}
	.small-7{width:58.33333%}
	.small-8{width:66.66667%}
	.small-9{width:75%}
	.small-10{width:83.33333%}
	.small-11{width:91.66667%}
	.small-12{width:100%}
	
	.small-show{display:block}
	.small-hide{display:none}
}

@media screen and (min-width:400px){
	.medium-1{width:8.33333%}
	.medium-2{width:16.66667%}
	.medium-3{width:25%}
	.medium-4{width:33.33333%}
	.medium-5{width:41.66667%}
	.medium-6{width:50%}
	.medium-7{width:58.33333%}
	.medium-8{width:66.66667%}
	.medium-9{width:75%}
	.medium-10{width:83.33333%}
	.medium-11{width:91.66667%}
	.medium-12{width:100%}
	
	.medium-show{display:block}
	.medium-hide{display:none}
}

@media screen and (min-width:800px){ 
	.desktop-1{width:8.33333%}
	.desktop-2{width:16.66667%}
	.desktop-3{width:25%}
	.desktop-4{width:33.33333%}
	.desktop-5{width:41.66667%}
	.desktop-6{width:50%}
	.desktop-7{width:58.33333%}
	.desktop-8{width:66.66667%}
	.desktop-9{width:75%}
	.desktop-10{width:83.33333%}
	.desktop-11{width:91.66667%}
	.desktop-12{width:100%}
	
	.desktop-show{display:block}
	.desktop-hide{display:none}
}

/* .blue{background:blue} */
/* .red{background:red} */
/* .yellow{background:yellow} */
/* .green{background:green;} */
/* .black{background:black;} */
/* img{max-width:100%;} */