.main {
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#1e5799+0,7db9e8+100 */
background: #1e5799; /* Old browsers */
background: -moz-linear-gradient(top, #EEF4FA 40%, #F6FCF9 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #EEF4FA 40%,#F6FCF9 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #EEF4FA 40%,#F6FCF9 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#EEF4FA', endColorstr='#F6FCF9',GradientType=0 ); /* IE6-9 */
padding-bottom:2rem;
}
	.banner {
	
	display: flex;
	flex-wrap: wrap;
	justify-content : space-between;
	align-items: flex-start;
	}
			.banner-img img {
			display: block;
			width: 100%;
			height: auto;
			margin: 0 auto;
			max-height:100%;
			}
		.banner-text {
		flex:1 0 30%;
		padding: 8% 8% 8% 5%;
		color: #e8e8e8;
		box-sizing: border-box;
		font-size:1.8rem;
		line-height:2rem;
		align-self: center;
		}
	.main .standard-width {
	background : #fff;
	box-shadow : 0 0 2px rgba(68, 68, 68, .4);
	}
	
		/* Colonnes */
		.bloc {
		margin : 1.5rem 0; /* marge haut et bas */
		display : flex; /* pour aligner les colonnes */
		justify-content : space-between ; /* harmoniser les marges des colonnes */
		flex-wrap: wrap;
		padding:1.5rem;
		}
		.bloc.standard-width {
		margin:0 auto;	
		}
		.column {
		box-sizing: border-box; /* inclure le padding dans le calcul des largeurs */
		padding:1rem;
		flex-grow:0; flex-shrink:0;
		width:100%;
		}
			.column .column {
			margin:0;
			/*display : flex; 
			justify-content : space-between ; */
			padding:0;
			}
			.column img {
			max-width: 100%;
			height: auto;
			}
		/* Colonnes 1-2 / 1-2 */
		.column1-2 {
		width: 49.5%; 
		}
		/* Colonnes 1-3 / 2-3 */
		.column1-3 {
		width: 33%; 
		}
		.column2-3 {
		width: 66%; 
		}
		/* Colonnes 1-4 */
		.column1-4 {
		width: 24.25%; 
		}
		/* colonnes 1/6  - 1/6 - 2-3 */
		.column1-6 {
		width: 15.83333%; 
		}
	/* Balises contenu */
	/* Liens */
	.main a {
	color: #8cd6ef;
	}
	.main a:hover {
	text-decoration: none;
	}
	
	/* Titres */
	.main h1 {
	font-size:2.2rem;
	line-height:2.4rem;
	padding-bottom: 1rem;
	margin-bottom:1rem;
	text-transform: uppercase;
	color: #8cd6ef;
	}
	h2 {
	font-size:2rem;
	line-height:2.2rem;
	padding-bottom: 1rem;
	margin-bottom:1rem;
	border-bottom:1px solid #e0e0e0;
	text-transform: uppercase;
	color: #6f7d81;
	}
	h3 {
	font-size:1.4rem;
	padding-bottom: 1rem;
	margin-bottom:1rem;
	border-bottom:1px solid #e0e0e0;
	text-transform: uppercase;
	color: #8cd6ef;
	}
	* + h3 {
	margin-top:1rem;
	}
	
	
	/* Paragraphe */
	.main p {
	margin-bottom: 1.5rem;
	}
	
	/* Spécificités du contenu */
	/* ClearFix : classe "clearfix" à utiliser 
	sur le parent d'une image en float, 
	pour retourner dans un flux normal */
	.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
	}
	/*backslash hack hides from IE mac \*/
	* html .clearfix { height: 1%; }
	.clearfix { display: block; }
	/* end backslash hack
	
	/* float clearing for IE6 */
	* html .clearfix{
	height: 1%;
	overflow: visible;
	}
	/* float clearing for IE7 */
	*+html .clearfix{
	min-height: 1%;
	}
	/* Fin clearfix */

	/* Image flottante droite */
	.floatright {
	float : right;
	margin: 0 0 1rem 1rem;
	}
	/* Image flottante gauche */
	.floatleft {
	float : left;
	margin: 0 1rem 1rem 0;
	}
	
	/* Images */
	.main img {
	width: 100%;
	height: auto;
	}
	.main img.small {
	max-width: 200px;	
	}
	.main img.medium {
	max-width: 550px;	
	}
		

	/* Page Produit */
	.bloc-product .column1-3 {
	order:0;
	}
	.bloc-product .column2-3 {
	order:1;
	}
	.product-intro {
	font-size:1.6rem;
	line-height: 1.7rem;
	color: #5094b3;
	}