* {	box-sizing: border-box; /* necessaire pour ne pas ajouter les padding a la largeur */
}

.container-fluid {
	width:100%;
	padding-left: 15px;
	padding-right: 15px;}

.container {
	max-width:1170px;
	margin: auto;
	padding-left: 15px;
	padding-right: 15px; } /* fera 1170px sur gd ecran, 100% sur plus petits ecran*/

.container-fluid>.container {
	padding-left: 0;
	padding-right: 0;}

.row:before,
.row:after {
	display:table;
	content:"";
	clear:both;}

.row {
	margin-left:-15px;
	margin-right:-15px;
}

img {
	/*width:100%; 
	désactivé pour ce site : je veux pouvoir me servir de la hauteur */ 
	
	vertical-align: middle /* on peut mettre aussi bottom, cest pour compenser une fqute des qnciens nqvigqteurs*/
}

h1, h2, h3, h4, h5, h6, p {
	margin-top: 0;
}

/* ==================
	Grille 12 col 
=====================*/

[class*="col-xs"] {
	float: left;
	padding-left: 5px; 	/* a l'origine 15px */
	padding-right: 5px;	/* a l'origine 15px */
}
.col-xs-1 {
	width: calc(100% / 12 * 1);
}

.col-xs-2 {
	width: calc(100% / 12 * 2);
}

.col-xs-3 {
	width: calc(100% / 12 * 3);
}

.col-xs-4 {
	width: calc(100% / 12 * 4);
}

.col-xs-5 {
	width: calc(100% / 12 * 5);
}

.col-xs-6 {
	width: calc(100% / 12 * 6);
}

.col-xs-7 {
	width: calc(100% / 12 * 7);
}

.col-xs-8 {
	width: calc(100% / 12 * 8);
}

.col-xs-9 {
	width: calc(100% / 12 * 9);
}

.col-xs-10 {
	width: calc(100% / 12 * 10);
}

.col-xs-11 {
	width: calc(100% / 12 * 11);
}

.col-xs-12 {
	width: calc(100% / 12 * 12);
}

/* ==================
	TABLET AND MORE
=====================*/

@media all and (min-width:768px) {

	.col-sm-1 {
		width: calc(100% / 12 * 1);
	}

	.col-sm-2 {
		width: calc(100% / 12 * 2);
	}

	.col-sm-3 {
		width: calc(100% / 12 * 3);
	}

	.col-sm-4 {
		width: calc(100% / 12 * 4);
	}

	.col-sm-5 {
		width: calc(100% / 12 * 5);
	}

	.col-sm-6 {
		width: calc(100% / 12 * 6);
	}

	.col-sm-7 {
		width: calc(100% / 12 * 7);
	}

	.col-sm-8 {
		width: calc(100% / 12 * 8);
	}

	.col-sm-9 {
		width: calc(100% / 12 * 9);
	}

	.col-sm-10 {
		width: calc(100% / 12 * 10);
	}

	.col-sm-11 {
		width: calc(100% / 12 * 11);
	}

	.col-sm-12 {
		width: calc(100% / 12 * 12);
	}

} /* end media query table and more*/

/* ==================
	NOTEBOOK AND MORE
=====================*/

@media all and (min-width:992px) {
	
	.col-md-1 {
		width: calc(100% / 12 * 1);
	}

	.col-md-2 {
		width: calc(100% / 12 * 2);
	}

	.col-md-3 {
		width: calc(100% / 12 * 3);
	}

	.col-md-4 {
		width: calc(100% / 12 * 4);
	}

	.col-md-5 {
		width: calc(100% / 12 * 5);
	}

	.col-md-6 {
		width: calc(100% / 12 * 6);
	}

	.col-md-7 {
		width: calc(100% / 12 * 7);
	}

	.col-md-8 {
		width: calc(100% / 12 * 8);
	}

	.col-md-9 {
		width: calc(100% / 12 * 9);
	}

	.col-md-10 {
		width: calc(100% / 12 * 10);
	}

	.col-md-11 {
		width: calc(100% / 12 * 11);
	}

	.col-md-12 {
		width: calc(100% / 12 * 12);
	}

} /* end media query notebook and more*/

/* ==================
	LARGE SCREEN
=====================*/

@media all and (min-width:1200px) {
	
	.col-lg-1 {
		width: calc(100% / 12 * 1);
	}

	.col-lg-2 {
		width: calc(100% / 12 * 2);
	}

	.col-lg-3 {
		width: calc(100% / 12 * 3);
	}

	.col-lg-4 {
		width: calc(100% / 12 * 4);
	}

	.col-lg-5 {
		width: calc(100% / 12 * 5);
	}

	.col-lg-6 {
		width: calc(100% / 12 * 6);
	}

	.col-lg-7 {
		width: calc(100% / 12 * 7);
	}

	.col-lg-8 {
		width: calc(100% / 12 * 8);
	}

	.col-lg-9 {
		width: calc(100% / 12 * 9);
	}

	.col-lg-10 {
		width: calc(100% / 12 * 10);
	}

	.col-lg-11 {
		width: calc(100% / 12 * 11);
	}

	.col-lg-12 {
		width: calc(100% / 12 * 12);
	}

} /* end media query large screen*/