@gutter: 16px;
@number: 4;

@tiny-screen: 480px;
@small-screen: 640px;

// grid styles for container wich has a .grid(n,g) class
// n = number of columns (default = 4)
// g = gutter value (default = 1rem)
// example : .grid-container { .grid(12, 10px); }

[class*="grid-"],
[class*="presta-"] {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	margin-left: -@gutter;
}

[class*="grid-"] > *,
[class*="presta-"] > * {
	flex: 0 0 auto;
	display: block; /* IE fix */
	width: ~'calc(100% * 1 / @{number} - @{gutter})';
	margin-left: @gutter;
}

.grid-6 {
	margin-top: 30px;
}

.grid-6 iconify-icon {
	font-size: 60px;
}

.grid-6 iconify-icon,
.grid-6 > a span:nth-child(3n) {
	color: #E78E14;
}

.grid-6 > a span:nth-child(3n) {
	display: block;
	margin: 10px 0;
	font-size: 70%;
	font-style: italic;
}

.grid-6 > a span:nth-child(2n) {
	display: block;
	margin: 10px 0;
}

.grid-6 a {
	color: #3B68BB;
	text-decoration: none;
	padding: 10px;
	width: 45%;
	font-size: 25px;
	text-align: center;
	margin: 8px auto;
	border: 1px solid;
	border-radius: 10px;
}

@media only screen and (max-width: 680px), only screen and (max-device-width: 680px) {
	.grid-6 a {
		width: 90%;
	}
}

.grid-6 a:hover {
	box-shadow: 2px 2px 15px #CCCCCC;
}

.bouton_opacity {
	opacity: 0.6;
	border: #FF7979 solid 1px !important;
	background-color: #FFF0F0 !important;
}

/****************************************************
*******************LES PRESTATIONS*******************
****************************************************/
	.presta-6 {
		margin-top: 30px;
	}

	.presta-6 iconify-icon {
		font-size: 40px;
		float: left;
	}

	.presta-6 iconify-icon,
	.presta-6 > a span:nth-child(3n) {
		color: #E78E14;
	}

	.presta-6 > a span:nth-child(3n) {
		display: block;
		margin: 10px 0 0 45px;
		font-style: italic;
		
	}

	.presta-6 > a span:nth-child(2n) {
		margin-left: 5px;
	}

	.presta-6 > a span:nth-child(3n),
	.presta-6 > a span:nth-child(2n) {
		font-size: 65%;
	}

	.presta-6 a {
		color: #038b39;
		text-decoration: none;
		padding: 10px;
		width: 45%;
		font-size: 25px;
		margin: 8px auto;
		border: 1px solid;
		border-radius: 10px;
	}

	@media only screen and (max-width: 680px), only screen and (max-device-width: 680px) {
		.presta-6 a {
			width: 90%;
		}
	}

	.presta-6 a:hover {
		box-shadow: 2px 2px 15px #CCCCCC;
	}
/****************************************************
*****************************************************
****************************************************/