@font-face {
	font-family: "Montserrat";
	src: url(/style/font/Montserrat-Bold.ttf);
	font-display: swap;
	font-weight: 700;
}
@font-face {
	font-family: "Nunito";
	src: url(/style/font/Nunito-Light.ttf);
	font-display: swap;
	font-weight: 300;
}
@font-face {
	font-family: "Nunito";
	src: url(/style/font/Nunito-Regular.ttf);
	font-display: swap;
	font-weight: 400;
}
@font-face {
	font-family: "Nunito";
	src: url(/style/font/Nunito-SemiBold.ttf);
	font-display: swap;
	font-weight: 600;
}
@font-face {
	font-family: "Nunito";
	src: url(/style/font/Nunito-Bold.ttf);
	font-display: swap;
	font-weight: 700;
}

* {
	box-sizing: border-box;
	padding: 0;
	margin: 0
}

select * {
	padding: 0 .5em
}

ul {
	list-style: none
}

a img,
:link img,
:visited img,
object,
fieldset {
	border: none
}

a:focus,
a:hover {
	text-decoration: underline
}

a:active {
	outline: none
}

a {
	outline: none
}

address {
	font-style: normal
}

iframe {
	line-height: 1em;
	display: block
}

:link,
:visited {
	text-decoration: none
}

legend {
	position: relative;
	left: -6px
}

html {
	font-size: 62.5%
}

body {
	background-color: #fff;
	color: #000;
	font-family: "Nunito", helvetica, arial, sans-serif;
	font-size: 1.6em;
	line-height: 1.5em
}

input,
select,
textarea {
	font-size: 100%
}

.relative { position: relative; }

.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	font-size: 0;
	clear: both;
	visibility: hidden
}

.clearfix {
	display: inline-block
}

* html .clearfix {
	height: 1%
}

.clearfix {
	display: block
}

.mir {
	letter-spacing: -1000em
}

* html .mir {
	text-indent: -999em;
	overflow: hidden
}

html>body .mir {
	letter-spacing: normal;
	text-indent: -999em;
	overflow: hidden
}

.clear {
	clear: both
}

div.clear {
	height: 0
}

.no-wrap {
	white-space: nowrap
}

.errorOutput {
	font-weight: 700;
	padding: .5em 20px;
	border-top: 2px solid #eee;
	border-bottom: 2px solid #eee;
	background: #fff0 url(/style/alert.gif) no-repeat left center
}

a:link,
a:visited {
	color: #008cd9
}

body {
	font-family: 'Nunito', sans-serif;
	font-weight: 400;
	overflow-x: hidden
}

#header,
#menu,
#main,
#footer {
	width: 100%
}

.page,
.page_min {
	width: 100%;
	max-width: 1350px;
	margin: 0 auto
}

.page1-2 {
	max-width: 675px;
	width: 100%
}

.page_min {
	max-width: 1000px
}

#slider .page {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 30
}

.col1-2,
.col1-3,
.col2-3,
.col3-4,
.col1-5,
.col1-4,
.col2-5 {
	float: left
}

.col {
	width: 100%
}

.col3-4 {
	width: 75%
}

.col1-2 {
	width: 50%
}

.col1-3 {
	width: 33.33%
}

.col2-3 {
	width: 66.66%
}

.col1-4 {
	width: 25%
}

.col1-5 {
	width: 20%
}

.col2-5 {
	width: 40%
}

.flexParent {
	display: flex;
	flex-wrap: wrap
}

.flex,
.flex1-1,
.flex1-2,
.flex1-3,
.flex2-3,
.flex3-4,
.flex1-4 {
	display: flex
}

.flex1-1 {
	width: 100%
}

.flex3-4 {
	width: 75%
}

.flex1-2 {
	width: 50%
}

.flex1-3 {
	width: 33.33%
}

.flex2-3 {
	width: 66.66%
}

.flex1-4 {
	width: 25%
}

.flexColumn {
	flex-direction: column;
	display: flex
}

.flex_right_top {
	justify-content: flex-end;
	display: flex
}

.flex_right_center {
	justify-content: flex-end;
	align-items: center
}

.flex_left_center {
	justify-content: center;
	align-items: flex-start
}

.flex_right_bottom {
	justify-content: flex-end;
	align-items: flex-end
}

.flex_center_center {
	justify-content: center;
	align-items: center
}

.flex_space_between {
	justify-content: space-between;
	align-items: center
}

.flex_space_between_left {
	justify-content: space-between;
	align-items: flex-start
}

.flex_between_center {
	justify-content: space-between;
	align-items: center
}

.flex_around_center {
	justify-content: space-around;
	align-items: center
}

.flex_center_bottom {
	justify-content: flex-end;
	align-items: center
}

.flex_center_top {
	justify-content: flex-start;
	align-items: center
}

.flex-bottom {
	justify-content: end;
	align-items: center
}

.align_items_center {
	align-items: center;
}

.column2 {
	-moz-column-gap: 40px;
	-moz-columns: 2 auto;
	columns: 2;
	-webkit-column-gap: 40px;
	column-gap: 40px;
	-webkit-columns: 2 auto
}

.column3 {
	-moz-column-gap: 20px;
	-moz-columns: 3 auto;
	columns: 3;
	-webkit-column-gap: 20px;
	column-gap: 20px;
	-webkit-columns: 3 auto
}

.position_relative {
	position: relative
}

.overflow_hidden {
	overflow: hidden
}

.padding_min {
	padding: 10px
}

.padding {
	padding: 25px
}

.padding_big {
	padding: 40px
}

.paddingLR {
	padding: 0 25px
}

.paddingTB {
	padding: 25px 0
}

.paddingBottom30 {
	padding-bottom: 30px
}

.padding_minTB {
	padding: 10px 0
}

.paddingNoBottom {
	padding-bottom: 0
}

.paddingHeader {
	padding: 0 25px
}

.bg_gris_fonce {
	background-color: #484848;
	color: #fff
}

.bg_gris_clair {
	background-color: #CECDCD;
	color: #000
}

.bg_blanc {
	background-color: #fff;
	color: #000
}

.bg_bleu {
	background-color: #1f598b;
	color: #fff
}

.bg_vert_fonce {
	background-color: #007c49;
	color: #fff
}

.bg_vert {
	background-color: #8abd57;
	color: #fff
}

.bg_jaune {
	background-color: #fdb932;
	color: #fff
}

.bg_bleu_transparent {
	background-color: rgb(23 88 138 / .2);
	color: #fff
}

.bg_jaune_transparent {
	background-color: rgb(253 183 50 / .2);
	color: #fff
}

.bg_vert_transparent {
	background-color: rgb(138 189 87 / .2);
	color: #fff
}

.bg_gris_clair_transparent {
	background-color: rgb(206 205 205 / .2);
	color: #fff
}

.bg_gris_fonce_transparent {
	background-color: rgb(72 72 72 / .2);
	color: #fff
}

.bg_gris_clair a:link,
.bg_gris_clair a:visited,
.bg_blanc a:link,
.bg_blanc a:visited {
	color: #000
}

.bg_gris_fonce a:link,
.bg_gris_fonce a:visited {
	color: #fff
}

.bg_bleu a:link,
.bg_bleu a:visited,
.bg_gris_fonce a.color_blanc:link,
.bg_gris_fonce a.color_blanc:visited {
	color: #fff
}

.bg_demi,
.bg_slider,
.bg_quart,
.bg_caracteristique_demi {
	position: relative;
	z-index: 0
}

.bg_demi::after,
.bg_quart::after,
span.spanDemi,
span.spanQuart {
	z-index: -1;
	content: "";
	position: absolute;
	height: 80%;
	display: block;
	top: 10%;
	width: 100vw;
	border-top-left-radius: 100px;
	border-bottom-left-radius: 100px
}

.bg_demi::after,
span.spanDemi,
.bg_quart::after,
span.spanQuart {
	left: 50px;
	z-index: 0;
}
.spanDemi + img.img_100,
.spanQuart + img.img_100 {z-index: 2;position:relative}


.bg_img_paralax {
	position: relative;
	background: #fff0 none no-repeat center center;
	background-size: 100% auto
}

.bg_caracteristique_demi::after,
.bg_img_paralax::after {
	z-index: -1;
	content: "";
	position: absolute;
	height: 100%;
	display: block;
	top: 0;
	left: 0;
	width: 100vw
}

.bg_img_paralax::after {
	height: 25px;
	left: 50%;
	z-index: 2
}

.bg_caracteristique_demi_gris_fonce::after {
	background-color: #484848;
	color: #CECDCD
}

.bg_caracteristique_demi_gris_clair::after {
	background-color: #CECDCD;
	color: #000
}

.bg_caracteristique_demi_blanc::after {
	background-color: #fff;
	color: #000
}

.bg_caracteristique_demi_bleu::after {
	background-color: #1f598b;
	color: #fff
}

.bg_caracteristique_demi_vert_fonce::after {
	background-color: #007c49;
	color: #fff
}

.bg_caracteristique_demi_vert::after {
	background-color: #8abd57;
	color: #fff
}

.bg_caracteristique_demi_jaune::after {
	background-color: #fdb932;
	color: #fff
}

.bg_paralax_gris_fonce::after {
	background-color: #484848
}

.bg_paralax_gris_clair::after {
	background-color: #CECDCD
}

.bg_paralax_blanc::after {
	background-color: #fff
}

.bg_paralax_bleu::after {
	background-color: #1f598b
}

.bg_paralax_vert_fonce::after {
	background-color: #007c49
}

.bg_paralax_vert::after {
	background-color: #8abd57
}

.bg_paralax_jaune::after {
	background-color: #fdb932
}

.bg_slider.slide_active .fond_gauche {
	border-top-right-radius: 50px;
	border-bottom-right-radius: 50px;
	width: 66vw;
	right: 34vw !important;
	left: auto !important;
	height: 80%;
	content: "";
	position: absolute;
	transition: 0.5s
}

.bg_slider.slide_active .fond_droite {
	border-top-left-radius: 50px;
	border-bottom-left-radius: 50px;
	width: 5vw;
	right: auto !important;
	left: 95vw !important;
	height: 80%;
	content: "";
	position: absolute;
	transition: 0.5s
}

.next_gris_fonce .fond_droite,
.slider_gris_fonce .fond_gauche {
	background-color: rgb(72 72 72 / .2)
}

.next_bleu .fond_droite,
.slider_bleu .fond_gauche {
	background-color: rgb(23 88 138 / .2)
}

.next_vert .fond_droite,
.slider_vert .fond_gauche {
	background-color: rgb(138 189 87 / .2)
}

.next_jaune .fond_droite,
.slider_jaune .fond_gauche {
	background-color: rgb(253 183 50 / .2)
}

.bg_demi_problematiques::after {
	background-image: url(/style/problematiques/problematiques-station-epuration.jpg);
	background-size: cover;
	background-position: right;
	border-top-left-radius: 50px;
	border-bottom-left-radius: 50px;
	width: 50vw;
	top: 0%;
	height: 100%;
	max-height: 600px;
	/*transform: translateY(-50%);*/
	min-height: 600px
}

.bg_demi_qui::after {
	background-image: url(/style/qui-sommes-nous/bureau-hydro-group.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	border-top-left-radius: 50px;
	border-bottom-left-radius: 50px;
	width: 50vw;
	top: 0%;
	height: 100%;
	max-height: 600px;
	/*transform: translateY(-50%);*/
	min-height: 600px
}

.bg_quart_bleu::after,
.bg_demi_bleu::after {
	background-color: rgb(23 88 138 / .2);
	color: #fff
}

.bg_quart_jaune::after,
.bg_demi_jaune::after {
	background-color: rgb(253 183 50 / .2);
	color: #fff
}

.bg_quart_vert::after,
.bg_demi_vert::after {
	background-color: rgb(138 189 87 / .2);
	color: #fff
}

.bg_quart_gris_clair::after,
.bg_demi_gris_clair::after {
	background-color: rgb(206 205 205 / .2);
	color: #fff
}

.bg_quart_gris_fonce::after,
.bg_quart2.bg_quart_gris_fonce::after,
.bg_demi_gris_fonce::after {
	background-color: rgb(72 72 72 / .2);
	color: #fff
}

.bg_qui_philosophie {
	background-image: url(/style/qui-sommes-nous/image-fond-quisommesnous2.jpg);
	background-size: cover;
	background-position: center
}

.color_bleu,
a.color_bleu:link,
a.color_bleu:visited {
	color: #1f598b !important
}

.color_gris_fonce,
a.color_gris_fonce:link,
a.color_gris_fonce:visited {
	color: #484848 !important
}

.color_gris_clair,
a.color_gris_clair:link,
a.color_gris_clair:visited {
	color: #CECDCD !important
}

.color_blanc,
a.color_blanc:link,
a.color_blanc:visited {
	color: #fff !important
}

.color_vert_fonce,
a.color_vert_fonce:link,
a.color_vert_fonce:visited {
	color: #007c49 !important
}

.color_vert,
a.color_vert:link,
a.color_vert:visited {
	color: #8abd57 !important
}

.color_jaune,
a.color_jaune:link,
a.color_jaune:visited {
	color: #fdb932 !important
}

.color_noir {
	color: #000 !important
}

.bg_img_accueil,
.bg_img_paralax {
	background-image: url(/style/fond/fond-vert.gif);
	background-position: center center;
	background-attachment: fixed;
	background-size: cover
}

.bg_img_paralax {
	min-height: 550px
}

.section {
	padding: 40px 0
}

.section_big {
	padding: 80px 0
}

.sectionNoPaddingBottom {
	padding-bottom: 0
}

.margin_auto {
	margin: 0 auto
}

.display_block {
	display: block
}

.float_right {
	float: right
}

.float_left {
	float: left
}

.align_center {
	text-align: center
}

.align_right {
	text-align: right
}

.maj {
	text-transform: uppercase
}

.borderRadius50 {
	border-radius: 25px
}

.borderRadius100 {
	border-radius: 50px
}

header {
	position: fixed;
	width: 100%;
	z-index: 10000;
	transition: 0.5s
}

header.header-fix {
	box-shadow: 0 2px 5px 0 rgb(0 0 0 / .75)
}

a#logo,
a#logo .img_100 {
	display: block;
	max-width: 150px;
	transition: 0.5s
}

header .nav_rs {
	padding-top: 2px
}

header.header-fix a#logo .img_100 {
	max-width: 75px;
	padding: 10px 0
}

nav li {
	display: inline-block;
	padding: 10px
}

nav li a {
	font-size: 90%;
	display: block;
	;
	font-weight: 700;
	text-transform: uppercase;
	border-bottom: 5px solid #fff0
}

nav li a:focus,
nav li a:hover,
#contact nav li#nav-contact a,
#blog nav li#nav-blog a,
#realisations nav li#nav-realisations a,
#solutions nav li#nav-solutions a,
#solution nav li#nav-solutions a,
#produit nav li#nav-solutions a,
#problematiques nav li#nav-problematiques a,
#qui nav li#nav-qui-sommes-nous a,
#accueil nav li#nav-accueil a {
	border-color: #007c49;
	text-decoration: none
}

#breadcrumb {
	margin-bottom: 1em;
	text-transform: uppercase;
	font-size: 70%
}

#breadcrumb ul,
#breadcrumb li {
	display: inline
}

#breadcrumb a:after {
	content: "\0020 \3E";
	font-size: 90%
}

#breadcrumb li:last-child {
	font-weight: 700
}

* html #breadcrumb li {
	margin-right: 5px;
	border-right: 2px solid #e1e1e0
}

#breadcrumb a,
#breadcrumb a:link,
#breadcrumb a:visited {
	text-decoration: none
}

#slider,
.section_first {
	padding-top: 200px
}

.photoSolutions {
	margin-bottom: -50px;
	transition: 0.5s
}

.photoSolutions:hover {
	transform: scale(1.1)
}

.uneSolution {
	padding-bottom: 65px
}

.uneSolution h3,
.uneSolution .like_h3 {
	padding: 45px
}

.unProduit .trait::before {
	content: "";
	border-top: 5px solid;
	height: 3px;
	display: block;
	width: 90px;
	margin-bottom: 5px;
	float: right
}

ul.list,
.blocDesc ul,
.solution_details ul,
.blocDesc ul,
.problematique_text ul,
.article__main ul,
.article__plus ul {
	list-style-type: disc;
	margin-left: 15px;
	margin-bottom: 1em
}

ul.inline li {
	display: inline-block;
	padding: 0 10px
}

ol li {
	margin-left: 20px
}

.majLight {
	font-weight: 300;
	text-transform: uppercase;
	font-size: 90%
}

.section p,
.section_first p {
	margin-bottom: 1em
}

.section .article__paragraphe a:link,
.section .article__paragraphe a:visited,
.blocDesc a:link,
.problematique_text a:link,
.solution_details a:link,
.article__main a:link,
.article__plus a:link,
.blocDesc a:visited,
.problematique_text a:visited,
.solution_details a:visited,
.article__main a:visited,
.article__plus a:visited {
	text-decoration: underline
}

.img_100 {
	max-width: 100%;
	display: block;
	line-height: 1;
	width: auto;
	height: auto
}

.cacheRS.img_100 {
	display: none
}

.img_carte {
	width: 100%;
	object-fit: cover;
	min-height: 500px
}

.big {
	font-size: 120%
}

.small {
	font-size: 80%
}

footer {
	font-size: 90%
}

.nav-mentions li,
.nav_rs li {
	display: inline-block
}

.nav-mentions li a,
.nav_rs li a {
	padding: 0 5px
}

footer .nav_rs li:first-child a {
	padding: 0
}

.nav-mentions li a {
	color: #1f598b !important;
	font-size: 75%;
	border-left: 1px solid
}

.nav-mentions li:first-child a {
	border-left: none
}

.titre_footer {
	display: block;
	text-transform: uppercase;
	font-weight: 700;
	margin-bottom: 5px
}

.logoFooter {
	width: 90px;
	float: left;
	padding: 0 5px
}

.logoFooterP {
	max-width: 150px;
	display: block
}

h1,
.like_h1 {
	font-size: 80%;
	font-weight: 300;
	font-family: 'Nunito', sans-serif;
	text-transform: uppercase;
	line-height: 1em;
	padding: 8px 0 5px 0;
	display: block;
	margin: 0
}

h2,
.like_h2 {
	font-size: 170%;
	font-family: "Montserrat";
	font-weight: 700;
	text-transform: uppercase;
	margin: 10px 0;
	line-height: 1.2em;
	display: block
}

strong.titreLightTrait {
	font-size: 90%;
	text-transform: uppercase;
	font-family: 'Nunito', sans-serif;
	font-weight: 300;
	display: block
}

strong.titreLightTrait::before,
.titre_trait::before {
	content: "";
	border-top: 5px solid;
	height: 3px;
	display: block;
	width: 90px;
	margin-bottom: 5px
}

.align_center strong.titreLightTrait::before {
	margin: 0 auto 5px
}

h3,
.like_h3 {
	text-transform: none;
	font-size: 130%;
	line-height: 1.2em;
	font-family: "Montserrat";
	font-weight: 700;
	margin: 0 0 10px 0;
	display: block
}

.titre_absolute {
	position: absolute;
	bottom: 0;
	left: 0;
	padding: 0 25px 10px 25px;
	background: linear-gradient(rgb(0 0 0 / 0), #000);
	width: 100%;
	margin: 0;
	border-bottom-left-radius: 25px;
	border-bottom-right-radius: 25px;
	min-height: 50px;
	z-index: 1
}

h4,
.like_h4 {
	text-transform: none;
	font-size: 120%;
	line-height: 1.2em;
	font-family: "Montserrat";
	font-weight: 700;
	margin: 0 0 10px 0;
	display: block
}

.like_h5 {
	text-transform: none;
	font-size: 100%;
	line-height: 1.2em;
	font-family: "Montserrat";
	font-weight: 700;
	margin: 0 0 10px 0;
	display: block
}

strong.titre_trait_right {
	position: relative;
	font-weight: 700;
	display: block;
	font-size: 120%;
	font-family: "Montserrat";
	margin-bottom: 30px
}

.before_trait_noir::before {
	content: '';
	height: 5px;
	display: block;
	width: 50px;
	position: absolute;
	right: 50%;
	top: -20px;
	background-color: #000;
	transform: translateX(50%)
}

.titre_qui {
	font-weight: 700;
	font-size: 120%;
	font-family: "Montserrat";
	transform: translateY(50%)
}

.after_bleu_top::before {
	content: '';
	width: 100%;
	background-color: #1f598b;
	height: 30px;
	top: -30px;
	position: absolute
}

.qui_citation {
	font-weight: 700;
	font-style: italic;
	font-size: 160%;
	line-height: 1.1
}

strong.titre_trait_right span {
	position: relative
}

strong.titre_trait_right span::before {
	content: "";
	border-top: 5px solid;
	height: 5px;
	display: block;
	width: 90px;
	position: absolute;
	right: 0;
	bottom: -20px;
	margin-top: 10px
}

h5 {
	font-size: 100%;
	font-weight: 700;
	font-family: "Montserrat";
	margin-bottom: 1em
}

.ico-solution {
	background: #fff0 none no-repeat center 25px;
	background-size: 150px auto
}

.ico-4 {
	background-image: url(/style/solutions/picto/ico-gamme-pompes-excentriques.png)
}

.ico-3 {
	background-image: url(/style/solutions/picto/ico-gamme-pompes-volumetriques.png)
}

.ico-1 {
	background-image: url(/style/solutions/picto/ico-gamme-broyeurs.png)
}

.ico-20 {
	background-image: url(/style/solutions/picto/ico-gamme-stations.png)
}

.ico-2 {
	background-image: url(/style/solutions/picto/ico-gamme-location.png)
}

.ico-19 {
	background-image: url(/style/solutions/picto/ico-gamme-separation.png)
}

div.ico-solution {
	padding-left: 160px;
	background-position: center left;
	min-height: 150px;
	margin-bottom: 10px
}

h3 a.ico-solution,
h4 a.ico-solution,
.like_h3 a.ico-solution,
.like_h4 a.ico-solution {
	padding-top: 180px;
	display: block
}

.video-responsive {
	overflow: hidden;
	padding-block-end: 56.25%;
	position: relative;
	height: 0
}

.video-responsive iframe {
	left: 0;
	top: 0;
	height: 100%;
	width: 100%;
	position: absolute
}

a.btn_suite,
span.btn_suite {
	display: inline-block;
	text-transform: uppercase;
	padding: 10px;
	color: #fff;
	border-radius: 10px;
	font-size: 90%;
	font-weight: 700;
	transition: 0.5s all;
	border: 1px solid;
	text-align: center
}

a.btn_suite:hover,
a.btn_suite:focus {
	background: #fff0;
	text-decoration: none
}

a.btn_blanc {
	background: #fff;
	color: #007c49
}

a.btn_blanc:hover,
a.btn_blanc:focus,
span.btn_blanc:hover,
span.btn_blanc:focus {
	background: #fff0;
	color: #fff
}

a.btn_transparent,
span.btn_transparent {
	background: #fff0;
	color: #fff !important;
	border-color: #fff
}

a.btn_transparent:hover,
span.btn_transparent:hover,
a.btn_transparent:focus,
span.btn_transparent:focus {
	background: #fff;
	color: #000 !important
}

a.btn_bleu,
span.btn_bleu {
	background: #1f598b;
	color: #fff !important
}

.bg_gris_clair a.btn_bleu,
.bg_gris_clair span.btn_bleu {
	border-color: #fff0
}

a.btn_bleu:hover,
a.btn_bleu:focus,
span.btn_bleu:hover,
span.btn_bleu:focus {
	background: #fff0;
	color: #1f598b !important
}

a.btn_noir,
span.btn_noir {
	background: #000;
	color: #fff !important
}

a.btn_noir:hover,
a.btn_noir:focus,
span.btn_noir:hover,
span.btn_noir:focus {
	background: #fff0;
	color: #000 !important
}

a.btn_gris_fonce,
span.btn_gris_fonce {
	background-color: #484848;
	color: #fff !important
}

a.btn_gris_fonce:focus,
a.btn_gris_fonce:hover,
span.btn_gris_fonce:focus,
span.btn_gris_fonce:hover {
	color: #484848 !important;
	background-color: #fff0
}

a.btn_gris_clair,
span.btn_gris_clair {
	background-color: #CECDCD;
	color: #000 !important
}

a.btn_gris_clair:focus,
a.btn_gris_clair:hover,
span.btn_gris_clair:focus,
span.btn_gris_clair:hover {
	color: #CECDCD !important;
	background-color: #fff0
}

a.btn_blanc,
span.btn_blanc {
	background-color: #fff;
	color: #000 !important
}

a.btn_blanc:focus,
a.btn_blanc:hover,
span.btn_blanc:focus,
span.btn_blanc:hover {
	color: #fff !important;
	background-color: #fff0
}

a.btn_bleu,
span.btn_bleu {
	background-color: #1f598b;
	color: #fff !important
}

a.btn_bleu:focus,
a.btn_bleu:hover,
span.btn_bleu:focus,
span.btn_bleu:hover {
	color: #1f598b !important;
	background-color: #fff0
}

a.btn_vert_fonce,
span.btn_vert_fonce {
	background-color: #007c49;
	color: #fff !important
}

a.btn_vert_fonce:focus,
a.btn_vert_fonce:hover,
span.btn_vert_fonce:focus,
span.btn_vert_fonce:hover {
	color: #007c49 !important;
	background-color: #fff0
}

a.btn_vert,
span.btn_vert {
	background-color: #8abd57;
	color: #fff !important
}

a.btn_vert:focus,
a.btn_vert:hover,
span.btn_vert:focus,
span.btn_vert:hover {
	color: #8abd57 !important;
	background-color: #fff0
}

a.btn_jaune,
span.btn_jaune {
	background-color: #fdb932;
	color: #fff !important
}

a.btn_jaune:focus,
a.btn_jaune:hover,
span.btn_jaune:focus,
span.btn_jaune:hover {
	color: #fdb932 !important;
	background-color: #fff0
}

a.pdf::before {
	font-family: "Font Awesome 5 Free";
	content: "\f1c1";
	font-weight: 700;
	padding-right: 5px
}


.imgPortrait {
	margin-right: 10px;
	max-width: 100px;
}

.imgActu {
	display: block;
	height: 150px;
	overflow: hidden;
	position: relative
}

.imgActu img {
	max-height: 100%;
	margin: 0 auto;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%)
}

.imgActu span {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	text-transform: uppercase;
	color: rgb(146 143 143 / .5);
	font-weight: 300;
	text-align: center;
	font-size: 95%
}

.imgActu span::before {
	content: '\f030';
	font-family: "Font Awesome 5 Free";
	font-weight: 700;
	display: block;
	font-size: 200%;
	color: rgb(146 143 143 / .5)
}

.ico::before {
	font-family: 'Font Awesome 5 Free';
	font-size: 120%;
	padding-right: 5px
}

p.ico span {
	overflow: hidden;
	display: inline
}

p.ico::before {
	display: inline
}

.ico-eye::before {
	content: "\f06e";
	font-weight: 700
}

.ico-map::before {
	content: "\f3c5";
	font-weight: 700
}

.ico-map-marker::before {
	content: "\f041";
	font-weight: 700
}

.ico-mobile::before {
	content: "\f3cd";
	font-weight: 700
}

.ico-phone::before {
	content: "\f095";
	font-weight: 700
}

.ico-web::before {
	content: "\f0ac";
	font-weight: 700
}

.ico-mail::before {
	content: "\f0e0";
	font-weight: 700
}

.ico-recherche::before {
	content: "\f002";
	font-weight: 700
}

.ico-compte::before {
	content: "\f2bd";
	font-weight: 700
}

.ico-pdf::before {
	content: "\f1c1";
	font-weight: 700
}

.ico-print::before {
	content: "\f02f";
	font-weight: 700
}

.ico-streetview::before {
	content: "\f21d";
	font-weight: 700
}

.ico-nav::before {
	content: "\f0c9";
	font-weight: 700
}

.ico-clock::before {
	content: "\f017";
	font-weight: 700
}

.ico-star::before {
	content: "\f005";
	font-weight: 700
}

.ico-laptop::before {
	content: "\f109";
	font-weight: 700
}

.ico-store::before {
	content: "\f54e";
	font-weight: 700
}

.ico-exchange::before {
	content: "\f362";
	font-weight: 700
}

.ico-desktop::before {
	content: "\f108";
	font-weight: 700
}

.ico-desktop::before {
	content: "\f108";
	font-weight: 700
}

.ico-phone-square::before {
	content: "\f87b";
	font-weight: 700;
	font-size: 99%
}

.mfp-bg {
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1042;
	overflow: hidden;
	position: fixed;
	background: #0b0b0b;
	opacity: .8;
	filter: alpha(opacity=80)
}

.mfp-wrap {
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1043;
	position: fixed;
	outline: 0 !important;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

.mfp-container {
	text-align: center;
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	padding: 0 8px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box
}

.mfp-container:before {
	content: '';
	display: inline-block;
	height: 100%;
	vertical-align: middle
}

.mfp-align-top .mfp-container:before {
	display: none
}

.mfp-content {
	position: relative;
	display: inline-block;
	vertical-align: middle;
	margin: 0 auto;
	text-align: left;
	z-index: 1045
}

.mfp-ajax-holder .mfp-content,
.mfp-inline-holder .mfp-content {
	width: 100%;
	cursor: auto
}

.mfp-ajax-cur {
	cursor: progress
}

.mfp-zoom-out-cur,
.mfp-zoom-out-cur .mfp-image-holder .mfp-close {
	cursor: -moz-zoom-out;
	cursor: -webkit-zoom-out;
	cursor: zoom-out
}

.mfp-zoom {
	cursor: pointer;
	cursor: -webkit-zoom-in;
	cursor: -moz-zoom-in;
	cursor: zoom-in
}

.mfp-auto-cursor .mfp-content {
	cursor: auto
}

.mfp-arrow,
.mfp-close,
.mfp-counter,
.mfp-preloader {
	-webkit-user-select: none;
	-moz-user-select: none;
	user-select: none
}

.mfp-loading.mfp-figure {
	display: none
}

.mfp-hide {
	display: none !important
}

.mfp-preloader {
	color: #ccc;
	position: absolute;
	top: 50%;
	width: auto;
	text-align: center;
	margin-top: -.8em;
	left: 8px;
	right: 8px;
	z-index: 1044
}

.mfp-preloader a {
	color: #ccc
}

.mfp-preloader a:hover {
	color: #fff
}

.mfp-s-error .mfp-content,
.mfp-s-ready .mfp-preloader {
	display: none
}

button.mfp-arrow,
button.mfp-close {
	overflow: visible;
	cursor: pointer;
	background: 0 0;
	border: 0;
	-webkit-appearance: none;
	appearance: none;
	display: block;
	outline: 0;
	padding: 0;
	z-index: 1046;
	-webkit-box-shadow: none;
	box-shadow: none
}

button::-moz-focus-inner {
	padding: 0;
	border: 0
}

.mfp-close {
	width: 44px;
	height: 44px;
	line-height: 44px;
	position: absolute;
	right: 0;
	top: 0;
	text-decoration: none;
	text-align: center;
	opacity: .65;
	filter: alpha(opacity=65);
	padding: 0 0 18px 10px;
	color: #fff;
	font-style: normal;
	font-size: 28px;
	font-family: Arial, Baskerville, monospace
}

.mfp-close:focus,
.mfp-close:hover {
	opacity: 1;
	filter: alpha(opacity=100)
}

.mfp-close:active {
	top: 1px
}

.mfp-close-btn-in .mfp-close {
	color: #333
}

.mfp-iframe-holder .mfp-close,
.mfp-image-holder .mfp-close {
	color: #fff;
	right: -6px;
	text-align: right;
	padding-right: 6px;
	width: 100%
}

.mfp-counter {
	position: absolute;
	top: 0;
	right: 0;
	color: #ccc;
	font-size: 12px;
	line-height: 18px
}

.mfp-arrow {
	position: absolute;
	opacity: .65;
	filter: alpha(opacity=65);
	margin: -55px 0 0;
	top: 50%;
	padding: 0;
	width: 90px;
	height: 110px;
	-webkit-tap-highlight-color: #fff0
}

.mfp-arrow:active {
	margin-top: -54px
}

.mfp-arrow:focus,
.mfp-arrow:hover {
	opacity: 1;
	filter: alpha(opacity=100)
}

.mfp-arrow .mfp-a,
.mfp-arrow .mfp-b,
.mfp-arrow:after,
.mfp-arrow:before {
	content: '';
	display: block;
	width: 0;
	height: 0;
	position: absolute;
	left: 0;
	top: 0;
	margin-top: 35px;
	margin-left: 35px;
	border: inset #fff0
}

.mfp-arrow .mfp-a,
.mfp-arrow:after {
	border-top-width: 13px;
	border-bottom-width: 13px;
	top: 8px
}

.mfp-arrow .mfp-b,
.mfp-arrow:before {
	border-top-width: 21px;
	border-bottom-width: 21px;
	opacity: .7
}

.mfp-arrow-left {
	left: 0
}

.mfp-arrow-left .mfp-a,
.mfp-arrow-left:after {
	border-right: 17px solid #fff;
	margin-left: 31px
}

.mfp-arrow-left .mfp-b,
.mfp-arrow-left:before {
	margin-left: 25px;
	border-right: 27px solid #3f3f3f
}

.mfp-arrow-right {
	right: 0
}

.mfp-arrow-right .mfp-a,
.mfp-arrow-right:after {
	border-left: 17px solid #fff;
	margin-left: 39px
}

.mfp-arrow-right .mfp-b,
.mfp-arrow-right:before {
	border-left: 27px solid #3f3f3f
}

.mfp-iframe-holder {
	padding-top: 40px;
	padding-bottom: 40px
}

.mfp-iframe-holder .mfp-content {
	line-height: 0;
	width: 100%;
	max-width: 900px
}

.mfp-iframe-holder .mfp-close {
	top: -40px
}

.mfp-iframe-scaler {
	width: 100%;
	height: 0;
	overflow: hidden;
	padding-top: 56.25%
}

.mfp-iframe-scaler iframe {
	position: absolute;
	display: block;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	box-shadow: 0 0 8px rgb(0 0 0 / .6);
	background: #000
}

img.mfp-img {
	width: auto;
	max-width: 100%;
	height: auto;
	display: block;
	line-height: 0;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	padding: 40px 0;
	margin: 0 auto
}

.mfp-figure {
	line-height: 0
}

.mfp-figure:after {
	content: '';
	position: absolute;
	left: 0;
	top: 40px;
	bottom: 40px;
	display: block;
	right: 0;
	width: auto;
	height: auto;
	z-index: -1;
	box-shadow: 0 0 8px rgb(0 0 0 / .6);
	background: #444
}

.mfp-figure small {
	color: #bdbdbd;
	display: block;
	font-size: 12px;
	line-height: 14px
}

.mfp-figure figure {
	margin: 0
}

.mfp-bottom-bar {
	margin-top: -36px;
	position: absolute;
	top: 100%;
	left: 0;
	width: 100%;
	cursor: auto
}

.mfp-title {
	text-align: left;
	line-height: 18px;
	color: #f3f3f3;
	word-wrap: break-word;
	padding-right: 36px
}

.mfp-image-holder .mfp-content {
	max-width: 100%
}

.mfp-gallery .mfp-image-holder .mfp-figure {
	cursor: pointer
}

@media screen and (max-width:800px) and (orientation:landscape),
screen and (max-height:300px) {
	.mfp-img-mobile .mfp-image-holder {
		padding-left: 0;
		padding-right: 0
	}

	.mfp-img-mobile img.mfp-img {
		padding: 0
	}

	.mfp-img-mobile .mfp-figure:after {
		top: 0;
		bottom: 0
	}

	.mfp-img-mobile .mfp-figure small {
		display: inline;
		margin-left: 5px
	}

	.mfp-img-mobile .mfp-bottom-bar {
		background: rgb(0 0 0 / .6);
		bottom: 0;
		margin: 0;
		top: auto;
		padding: 3px 5px;
		position: fixed;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box
	}

	.mfp-img-mobile .mfp-bottom-bar:empty {
		padding: 0
	}

	.mfp-img-mobile .mfp-counter {
		right: 5px;
		top: 3px
	}

	.mfp-img-mobile .mfp-close {
		top: 0;
		right: 0;
		width: 35px;
		height: 35px;
		line-height: 35px;
		background: rgb(0 0 0 / .6);
		position: fixed;
		text-align: center;
		padding: 0
	}
}

@media all and (max-width:900px) {
	.mfp-arrow {
		-webkit-transform: scale(.75);
		transform: scale(.75)
	}

	.mfp-arrow-left {
		-webkit-transform-origin: 0;
		transform-origin: 0
	}

	.mfp-arrow-right {
		-webkit-transform-origin: 100%;
		transform-origin: 100%
	}

	.mfp-container {
		padding-left: 6px;
		padding-right: 6px
	}
}

.mfp-ie7 .mfp-img {
	padding: 0
}

.mfp-ie7 .mfp-bottom-bar {
	width: 600px;
	left: 50%;
	margin-left: -300px;
	margin-top: 5px;
	padding-bottom: 5px
}

.mfp-ie7 .mfp-container {
	padding: 0
}

.mfp-ie7 .mfp-content {
	padding-top: 44px
}

.mfp-ie7 .mfp-close {
	top: 0;
	right: 0;
	padding-top: 0
}

/*! #######################################################################

	MeanMenu 2.0.7
	--------

	To be used with jquery.meanmenu.js by Chris Wharton (http://www.meanthemes.com/plugins/meanmenu/)

####################################################################### */
a.meanmenu-reveal {
	display: none
}

.mean-container .mean-bar {
	float: left;
	width: 100%;
	position: fixed;
	background: #fff0;
	z-index: 999999
}

.mean-container a.meanmenu-reveal {
	padding: 6px 10px;
	position: absolute;
	right: 0;
	cursor: pointer;
	color: #fff;
	text-decoration: none;
	font-size: 60%;
	text-transform: uppercase;
	display: block;
	font-weight: 300;
	background: #484848;
	z-index: 800;
	text-align: center
}

a.meanmenu-reveal::before {
	content: "\f0c9";
	font-family: "Font Awesome 5 Free";
	font-weight: 700;
	text-align: center;
	padding-right: 5px;
	font-size: 250%;
	position: relative;
	top: 4px
}

.mean-container a.meanclose {
	top: 5px
}

.mean-container a.meanclose::before {
	display: none
}

.mean-container a.meanmenu-reveal span {
	background: #484848;
	position: relative;
	top: -3px
}

.mean-container .mean-nav {
	float: left;
	width: 100%;
	background: #E9E9E9
}

.mean-container .mean-nav ul {
	padding: 0;
	margin: 0;
	width: 100%;
	list-style-type: none
}

.mean-container .mean-nav ul li {
	position: relative;
	float: left;
	width: 100%
}

.mean-container .mean-nav ul li a {
	display: block;
	float: left;
	width: 100%;
	box-sizing: border-box;
	padding: 1em 5%;
	margin: 0;
	text-align: left;
	color: #000;
	text-decoration: none;
	text-transform: uppercase
}

.mean-container .mean-nav ul li li a {
	width: 80%;
	padding: 1em 10%;
	border-top: 1px solid #f1f1f1;
	border-top: 1px solid rgb(255 255 255 / .25);
	opacity: .75;
	filter: alpha(opacity=75);
	text-shadow: none !important;
	visibility: visible
}

.mean-container .mean-nav ul li.mean-last a {
	border-bottom: none;
	margin-bottom: 0
}

.mean-container .mean-nav ul li li li a {
	width: 70%;
	padding: 1em 15%
}

.mean-container .mean-nav ul li li li li a {
	width: 60%;
	padding: 1em 20%
}

.mean-container .mean-nav ul li li li li li a {
	width: 50%;
	padding: 1em 25%
}

.mean-container .mean-nav ul li a:hover {
	background: #252525;
	background: rgb(255 255 255 / .1)
}

.mean-container .mean-nav ul li a.mean-expand {
	margin-top: 1px;
	width: 26px;
	height: 32px;
	padding: 12px !important;
	text-align: center;
	position: absolute;
	right: 0;
	top: 0;
	z-index: 2;
	font-weight: 700;
	background: rgb(255 255 255 / .1);
	border: none !important;
	border-left: 1px solid rgb(255 255 255 / .4) !important;
	border-bottom: 1px solid rgb(255 255 255 / .2) !important
}

.mean-container .mean-nav ul li a.mean-expand:hover {
	background: rgb(0 0 0 / .9)
}

.mean-container .mean-push {
	float: left;
	width: 100%;
	padding: 0;
	margin: 0;
	clear: both
}

.mean-nav .wrapper {
	width: 100%;
	padding: 0;
	margin: 0
}

.mean-container .mean-bar,
.mean-container .mean-bar * {
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	box-sizing: content-box
}

.mean-remove {
	display: none !important
}

.btn-ajax { margin-bottom: 30px; }
.cache { display: none; }

@media all and (max-width:1350px) {
	.width-100-1350 {
		width: 100%
	}

	.bg_demi_problematiques::after {
		height: 70%;
		max-height: 300px;
		width: 100%
	}
}

@media all and (max-width:1250px) {
	.width-100-1250 {
		width: 100%
	}

	.auto-1250 {
		margin: auto
	}

	#slider,
	.cache-1250 {
		display: none
	}

	.flex-center-1250 {
		justify-content: center
	}

	.first-1250 {
		padding-top: 240px
	}

	header {
		position: absolute
	}

	.header_fix {
		position: fixed;
		width: 100%;
		z-index: 1000
	}

	.padding_fix {
		padding-top: 45px
	}

	.overflow_hidden-1250 {
		overflow: hidden
	}

	.bg_quart::after {
		transform: translateX(-40%)
	}

	header .bg_gris_fonce {
		min-height: 45px
	}

	header h1 {
		display: none
	}
}

@media all and (max-width:1200px) {
	.width-100-1200 {
		width: 100%
	}

	.width-50-1200 {
		width: 50%
	}

	.width-33-1200 {
		width: 33%
	}

	.clear-1200 {
		clear: both
	}

	.center-1200 {
		text-align: center
	}

	.unProduit .trait::before {
		float: left
	}

	.bg_demi_qui::after,
	.bg_demi_pompes::after {
		height: 70%;
		max-height: 300px
	}

	.titre_qui {
		width: 100%
	}

	.titre_qui .page1-2 {
		margin: auto;
		text-align: center
	}

	.img_carte {
		padding-top: 20px
	}
}

@media all and (max-width:1000px) {
	.width-100-1000 {
		width: 100%
	}

	.width-50-1000 {
		width: 50%
	}

	.cache-1000 {
		display: none
	}

	.column-reverse-1000 {
		display: flex;
		flex-direction: column-reverse
	}

	.flex-1000 {
		display: flex
	}

	.bg_paralax_bleu::after {
		background-color: #fff0
	}

	.bg_demi_qui::after,
	.bg_demi_problematiques::after,
	.bg_demi_pompes::after {
		width: 100%;
		height: 100%;
		border-radius: 50px;
		left: 50%;
		transform: translate(-50%, -50%);
		display: none
	}

	.bg_demi_qui,
	.bg_demi_problematiques,
	.bg_demi_pompes {
		display: none
	}

	.img_carte {
		display: none
	}

	.titre_qui {
		transform: translateY(0%)
	}

	.cacheRS.img_100 {
		display: block
	}

	.article {
		display: flex;
		flex-direction: column
	}

	.article__photo {
		width: 100% !important
	}

	.article__photo img {
		width: auto !important;
		margin: auto
	}

	.article__photo--gauche,
	.article__photo--droite {
		margin: auto !important;
		display: block;
		float: none !important
	}

	.max-100-1000 {
		max-width: 100%
	}

	.qui_citation {
		text-align: center
	}

	.mean-container a.meanclose {
		top: 0;
		background: #626263
	}

	.cn-cookie a.btnAccept,
	.cn-cookie a.btnDeny {
		position: relative;
		top: inherit;
		display: block;
		right: inherit;
		margin: 10px auto 0 auto;
		max-width: 200px;
		transform: translateY(0)
	}
}

@media all and (max-width:950px) {
	.width-100-950 {
		width: 100%
	}
}

@media all and (max-width:900px) {
	.width-100-900 {
		width: 100%
	}

	.uneSolution h3,
	.uneSolution .like_h3 {
		padding: 20px
	}
}

@media all and (max-width:750px) {
	.column2 {
		-moz-column-gap: 0;
		column-gap: 0;
		-moz-columns: 1 auto;
		columns: 1;
		-webkit-column-gap: 0;
		-webkit-columns: 1 auto
	}

	.header_liens {
		display: flex;
		width: 100%
	}

	.header_liens .nav_rs {
		padding: 0 10px
	}

	.column-750 {
		flex-direction: column;
		align-items: flex-start
	}

	.flex-center-750 {
		justify-content: center
	}

	.width-50-750 {
		width: 50% !important;
		float: left !important
	}

	.col1-2,
	.col1-3,
	.col2-3,
	.col1-4,
	.col3-4,
	.col1-5 {
		float: none;
		width: 100%
	}

	.flex1-2,
	.flex1-3,
	.flex2-3,
	.flex1-4,
	.flex3-4 {
		width: 100%
	}

	.float_right,
	.float_left {
		float: none
	}

	.bg_img_accueil {
		overflow-x: hidden
	}

	.wcircle-menu {
		max-width: 160px
	}

	.logoFooter {
		width: 90px;
		float: none;
		padding: 0
	}

	.bg_demi_qui::after,
	.bg_demi_pompes::after {
		background-size: 100% auto
	}

	.cache750 {
		display: none
	}

	.align750center {
		text-align: center
	}

	.sectionNoTop750 {
		padding-top: 0
	}

	footer .page {
		text-align: center
	}

	footer .img_100 {
		margin: 10px auto 0
	}

	.logoFooterP {
		margin: 0 auto
	}

	.unProduit::before {
		border-bottom: 5px solid #666;
		content: "";
		display: block;
		width: 90px;
		height: 5px
	}

	.after_bleu_top::before {
		display: none
	}

	.img_carte {
		min-height: inherit
	}

	.img_carte {
		padding-top: 34px
	}
}

@media all and (max-width:620px) {
	.width-100-620 {
		width: 100%
	}

	.flex-center-620 {
		justify-content: center
	}

	.bg_img_paralax {
		min-height: 350px
	}

	div.ico-solution {
		background-size: 100px auto;
		padding-top: 100px;
		padding-left: 0;
		background-position: top left;
		min-height: 100px
	}

	.mean-container a.meanclose {
		top: 0;
		background: #626263
	}

	h1 {
		padding: 0
	}

	.col1-2,
	.col1-3,
	.col2-3,
	.col1-4,
	.col3-4,
	.col1-5,
	.col2-5 {
		float: none;
		width: 100%
	}

	.flex1-2,
	.flex1-3,
	.flex2-3,
	.flex1-4,
	.flex3-4 {
		width: 100%
	}

	#slider {
		display: none
	}
}

.article {
	padding-bottom: 20px
}

.article__photo {
	box-sizing: border-box;
	width: 50%;
	padding: 25px;
	display: block
}

.article__photo--gauche {
	float: left
}

.article__photo--droite {
	float: right
}

.article__photo img {
	width: 100%
}

.photo--coins--arrondis {
	border-radius: 50px
}

.article__main {
	overflow: hidden
}

.article__date {
	display: block;
	font-size: 90%;
	padding-bottom: .5em;
	color: silver
}

.article__resume {
	font-size: 120%;
	padding-bottom: 1em
}

.article ul,
.article__texte ul,
.article__bloc ul {
	list-style-type: disc;
	padding-left: 15px
}

.article__paragraphe {
	padding: 25px
}

.article__soustitre {
	font-size: 130%;
	line-height: 1.2em;
	font-family: "Montserrat";
	font-weight: 700;
	margin-bottom: 10px
}

.unArticle {
	padding-top: 0
}

.unArticle img {
	height: 260px;
	width: 100%;
	object-fit: cover;
	transition: 0.5s
}

.unArticle img:hover {
	transform: scale(1.1)
}

.uneProblematique {
	height: 350px
}

.uneProblematique img {
	height: 300px;
	width: 100%;
	object-fit: cover;
	display: block
}

.problematique_fond {
	position: absolute;
	height: 100%;
	width: 100%;
	background-color: rgb(0 0 0 / .3);
	top: 0;
	left: 0;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center
}

.problematique_fond span.btn_transparent {
	max-height: 0;
	opacity: 0;
	margin-top: 0;
	padding: 0 10px
}

.problematique_fond:hover span.btn_transparent {
	max-height: 100px;
	opacity: 1;
	margin-top: 1em;
	padding: 10px
}