.section_header{

}
.section_header h1{
	margin: 0 10px 0 0;
}
.section_shadow{
	margin-top: 20px;
	padding: 25px;
	background: #FFFFFF;
	box-shadow: 0px 6px 49px 0px rgba(220, 220, 220, 0.9);
	border-radius: 15px;
}




/*

Ensemble de classes génériques de mise en forme des blocs de type header, body, footer
Ces class gèrent généralement le padding latérale, le padding entre les blocs, les bordures entre les blocs
L'idée est d'avoir des templates utilisables à plusieurs endroits.

Chaque section peut redéfinir le padding horizontal
Chaque section peut redéfinir les différentes tailles de padding vertical

*/
.section,
.section_header,
.section_footer{
	box-sizing: border-box;
}
@media screen and (min--moz-device-pixel-ratio:0) {
	.section::after{
		content: "";
		display: block;
	}
}
:root{
	--section-border: solid 1px #eee;

	/* Padding horizontal */
	--section-padding-left: 24px;

	/* Padding vertical */
	--section-padding-top: 18px;
	--section-padding-top-xxs: 10px;
	--section-padding-top-xs: 12px;
	--section-padding-top-s: 16px;
	--section-padding-top-m: 18px;
	--section-padding-top-l: 22px;
	--section-padding-top-xl: 26px;
	--section-padding-top-xxl: 34px;

	/* Padding vertical du header */
	--section-header-padding-top: 14px;
	--section-header-padding-top-xxs: 8px;
	--section-header-padding-top-xs: 10px;
	--section-header-padding-top-s: 12px;
	--section-header-padding-top-m: 14px;
	--section-header-padding-top-l: 18px;
	--section-header-padding-top-xl: 22px;
	--section-header-padding-top-xxl: 32px;
}

/* NO VARS FALLBACK */
.section,
.section_header,
.section_footer{
	padding: 18px 24px;
}

/* SIZE */
.section,
.section_footer{
	padding: var(--section-padding-top) var(--section-padding-left);
}
.section_header{
	padding: var(--section-header-padding-top) var(--section-padding-left);
}
.section::after{
	height: var(--section-padding-top);
	margin-bottom: calc(-1 * var(--section-padding-top));
}
/* XXS */
.section.xxs,
.section_footer.xxs{
	padding-top: var(--section-padding-top-xxs);
	padding-bottom: var(--section-padding-top-xxs);
}
.section_header.xxs{
	padding-top: var(--section-header-padding-top-xxs);
	padding-bottom: var(--section-header-padding-top-xxs);
}
.section.xxs::after{
	height: var(--section-padding-top-xxs);
	margin-bottom: calc(-1 * var(--section-padding-top-xxs));
}
/* XS */
.section.xs,
.section_footer.xs{
	padding-top: var(--section-padding-top-xs);
	padding-bottom: var(--section-padding-top-xs);
}
.section_header.xs{
	padding-top: var(--section-header-padding-top-xs);
	padding-bottom: var(--section-header-padding-top-xs);
}
.section.xs::after{
	height: var(--section-padding-top-xs);
	margin-bottom: calc(-1 * var(--section-padding-top-xs));
}
/* S */
.section.s,
.section_footer.s{
	padding-top: var(--section-padding-top-s);
	padding-bottom: var(--section-padding-top-s);
}
.section_header.s{
	padding-top: var(--section-header-padding-top-s);
	padding-bottom: var(--section-header-padding-top-s);
}
.section.s::after{
	height: var(--section-padding-top-s);
	margin-bottom: calc(-1 * var(--section-padding-top-s));
}
/* M */
.section.m,
.section_footer.m{
	padding-top: var(--section-padding-top-m);
	padding-bottom: var(--section-padding-top-m);
}
.section_header.m{
	padding-top: var(--section-header-padding-top-m);
	padding-bottom: var(--section-header-padding-top-m);
}
.section.m::after{
	height: var(--section-padding-top-m);
	margin-bottom: calc(-1 * var(--section-padding-top-m));
}
/* L */
.section.l,
.section_footer.l{
	padding-top: var(--section-padding-top-l);
	padding-bottom: var(--section-padding-top-l);
}
.section_header.l{
	padding-top: var(--section-header-padding-top-l);
	padding-bottom: var(--section-header-padding-top-l);
}
.section.l::after{
	height: var(--section-padding-top-l);
	margin-bottom: calc(-1 * var(--section-padding-top-l));
}
/* XL */
.section.xl,
.section_footer.xl{
	padding-top: var(--section-padding-top-xl);
	padding-bottom: var(--section-padding-top-xl);
}
.section_header.xl{
	padding-top: var(--section-header-padding-top-xl);
	padding-bottom: var(--section-header-padding-top-xl);
}
.section.xl::after{
	height: var(--section-padding-top-xl);
	margin-bottom: calc(-1 * var(--section-padding-top-xl));
}
/* XXL */
.section.xxl,
.section_footer.xxl{
	padding-top: var(--section-padding-top-xxl);
	padding-bottom: var(--section-padding-top-xxl);
}
.section_header.xxl{
	padding-top: var(--section-header-padding-top-xxl);
	padding-bottom: var(--section-header-padding-top-xxl);
}
.section.xxl::after{
	height: var(--section-padding-top-xxl);
	margin-bottom: calc(-1 * var(--section-padding-top-xxl));
}

/* NO PADDING */
.section.no_pad{
	padding: 0;
}
.section.no_vertical_pad{
	padding-top: 0;
	padding-bottom: 0;
}
.section.no_horizontal_pad{
	padding-left: 0;
	padding-right: 0;
}
.section.no_top_pad{
	padding-top: 0;
}
.section.no_bottom_pad{
	padding-bottom: 0;
}
.section.no_pad::after,
.section.no_vertical_pad::after,
.section.no_bottom_pad::after{
	display: none;
}

/* HEADER */
.section_header{
	border-bottom: var(--section-border);
}
.section_header_title{
	font-size: 1.7rem;
}
.section_header_icons{
	margin: 0 -8px 0 12px;
}

/* FOOTER */
.section_footer{
	border-top: var(--section-border);
}

/* PART GREY */
.section_grey{
	background: #f7f7f7;
}

/* BORDER */
.section.has_border,
.section_border{
	border-top: var(--section-border);
	border-bottom: var(--section-border);
}
.section.has_top_border,
.section_border_top{
	border-top: var(--section-border);
}
.section.has_bottom_border,
.section_border_bottom{
	border-bottom: var(--section-border);
}
.section.no_border{
	border: none;
}


.section_primary {
	margin-top: 6px;
}

/* COL */
.section_col + .section_col{
	border-left: solid 1px #eee;
}

/* INNER BORDER (TODO) */
/*.section.has_inner_border{
	border-top: none;
	border-bottom: none;
}
.section.has_inner_top_border{
	border-top: none;
}
.section.has_inner_bottom_border{
	border-bottom: none;
}
.section.has_inner_top_border::before,
.section.has_inner_bottom_border::after{
	display: block;
	position: sticky;
	border-top: var(--section-border);
}
.section.has_inner_top_border::before{
	top: 0;
}
.section.has_inner_bottom_border::after{
	bottom: 0;
}*/

