#load {
	display: none
}

.H #load {
	display: block;
	width: 50px;
	height: auto;
	/*height:12.5px*/
	position: fixed;
	z-index: 1001;
	top: 50%;
	margin-top: -6px;
	left: 50%;
	margin-left: -25px;
}

html {
	font-size: 100%;
	height: 100%;
	width: 100%;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
	overscroll-behavior: none;
	position: relative;
	font-display: auto;
	font-display: block;
	font-display: swap;
	font-display: fallback;
	font-display: optional;
}

/*
@media screen and (-webkit-min-device-pixel-ratio:0)
and (min-resolution:.001dpcm) {
  img { image-rendering: -webkit-optimize-contrast !important; }
}

 Unset for Safari 11+
@media not all and (min-resolution:.001dpcm)
{ @supports (-webkit-appearance:none) and (stroke-color:transparent) {
  img { image-rendering: unset !important; }
}} */


@font-face {
	font-family: 'EF';
	font-style: normal;
	font-weight: 100;
	src: url('../font/EF-100.eot');
	src: local(''),
		url('../font/EF-100d41d.eot?#iefix') format('embedded-opentype'),
		url('../font/EF-100.html') format('woff2'),
		url('../font/EF-100.woff') format('woff'),
		url('../font/EF-100.ttf') format('truetype'),
		url('../font/EF-100.svg#EuclidFlex-Light') format('svg');
}

@font-face {
	font-family: 'EF';
	font-style: normal;
	font-weight: 300;
	src: url('../font/EF-300.eot');
	src: local(''),
		url('../font/EF-300d41d.eot?#iefix') format('embedded-opentype'),
		url('../font/EF-300.html') format('woff2'),
		url('../font/EF-300.woff') format('woff'),
		url('../font/EF-300.ttf') format('truetype'),
		url('../font/EF-300.svg#EuclidFlex-Light') format('svg');
}

@font-face {
	font-family: 'EF';
	font-style: normal;
	font-weight: 400;
	src: url('../font/EF-400.eot');
	src: local(''),
		url('../font/EF-400d41d.eot?#iefix') format('embedded-opentype'),
		url('../font/EF-400.html') format('woff2'),
		url('../font/EF-400.woff') format('woff'),
		url('../font/EF-400.ttf') format('truetype'),
		url('../font/EF-400.svg#EuclidFlex-Regular') format('svg');
}

@font-face {
	font-family: 'EF';
	font-style: normal;
	font-weight: 500;
	src: url('../font/EF-500.eot');
	src: local(''),
		url('../font/EF-500d41d.eot?#iefix') format('embedded-opentype'),
		url('../font/EF-500.html') format('woff2'),
		url('../font/EF-500.woff') format('woff'),
		url('../font/EF-500.ttf') format('truetype'),
		url('../font/EF-500.svg#EuclidFlex-Medium') format('svg');
}

@font-face {
	font-family: 'EF';
	font-style: normal;
	font-weight: 600;
	src: url('../font/EF-600.eot');
	src: local(''),
		url('../font/EF-600d41d.eot?#iefix') format('embedded-opentype'),
		url('../font/EF-600.html') format('woff2'),
		url('../font/EF-600.woff') format('woff'),
		url('../font/EF-600.ttf') format('truetype'),
		url('../font/EF-600.svg#EuclidFlex-SemiBold') format('svg');
}

@font-face {
	font-family: 'MB';
	font-style: normal;
	src: url('../font/Montserrat-SemiBold.ttf')format('truetype');
}


body {
	font-size: 1em;
	color: #1d1c1b;
	font-family: 'EF', sans-serif;
	margin: 0;
	font-weight: 400;
	height: 100%;
	width: 100%;
	position: relative;
	background-color: #fff;
	/* -webkit-user-select: none;
	-moz-user-select: none;
	-khtml-user-select: none;
	-ms-user-select: none; */
	font-variant-ligatures: no-common-ligatures
}

* {
	outline: none;
}

.ret {
	clear: both;
	width: 0;
	height: 0;
	line-height: 0;
	margin: 0;
	padding: 0;
	float: none
}

.retMob {
	display: none
}

img {
	display: block
}

a img {
	border: none
}

a {
	outline: none;
	border: none;
	text-decoration: none
}

ul,
li {
	margin: 0;
	padding: 0;
	list-style: none
}

h1,
h2,
h3,
h4 {
	padding: 0;
	margin: 0;
	font-size: 1em;
	font-weight: normal;
	line-height: 1.1em
}

sup {
	font-size: 0.55em;
	line-height: 1em
}

/*::-moz-selection, ::selection { background:#00949a}*/
#testeur {
	position: fixed;
	z-index: 9999;
	bottom: 0;
	left: 0;
	padding: 7px;
	font-size: 0.7em;
	letter-spacing: 0.1em;
	display: inline-block;
	font-family: sans-serif;
	color: #FFF;
	opacity: 0.5;
	background-color: #000000;
	display: none
}

#CybotCookiebotDialog,
.H #CybotCookiebotDialog,
#CookiebotWidget,
.H #CookiebotWidget {
	opacity: 0;
	visibility: hidden
}

#MOB {
	display: none
}

#MOB2 {
	display: none
}

#MOB3 {
	display: none
}

.calExt {}

.cal {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%
}

.H .cal {
	width: auto;
	height: auto
}

.calExt2 {}

.cal2 {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%
}

.H .cal2 {
	width: auto;
	height: auto
}

#remonte {
	width: 46px;
	height: 46px;
	background-color: #fff;
	position: fixed;
	bottom: 0px;
	left: 0;
	z-index: 150;
	visibility: hidden;
	overflow: hidden;
	cursor: pointer
}

#remonte img {
	width: 22px;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-left: -11px;
	margin-top: -11px;
	display: block;
	transform-origin: 50% 50%;
}

.H #remonte {
	visibility: hidden
}


#logoHaut {
	width: 55px;
	position: fixed;
	top: 16px;
	left: 16px;
	z-index: 150;
	visibility: hidden;
	cursor: pointer;
	-webkit-mix-blend-mode: darken;
	-moz-mix-blend-mode: darken;
	-o-mix-blend-mode: darken;
	-ms-mix-blend-mode: darken;
	mix-blend-mode: darken
}

#logoHaut img {
	width: 100%;
	display: block;
	transform-origin: 50% 50%;
	position: relative
}



#menu {
	margin: 0;
	padding: 0;
	position: relative;
	width: auto;
	z-index: 800;
	transform-origin: 100% 0;
	background-color: rgba(20, 28, 37, 1)
}

/*.H #menu {position:absolute; right: 0%; top:32px; background-color: rgba(20,28,37,0); border-bottom-left-radius:10px;margin-right:1.5em}*/
.H #menu {
	position: absolute;
	right: 0%;
	top: 0;
	padding-top: 32px;
	background-color: rgba(20, 28, 37, 0);
	border-bottom-left-radius: 10px;
	padding-right: 1.5em
}

#menu li {
	display: inline-block;
	float: left;
	margin: 0;
	padding: 0
}

#menu li .am {
	display: inline-block;
	padding: 1em 1.2em 0.6em 1.2em;
	font-size: 1.1em;
	font-weight: 500;
	color: #fff;
	cursor: pointer;
	line-height: 1.2em;
	margin: 2px 0;
	letter-spacing: 0.05em
}

#menu span {
	display: inline-block;
	position: relative;
	padding-bottom: 0.4em;
	line-height: 1.2em
}

#menu .am span i {
	position: absolute;
	bottom: 0;
	width: 100%;
	left: 0;
	height: 2px;
	background-color: #FFEC00;
	transform-origin: 0
}

#menu .ret {
	display: block;
	width: 0;
	float: none;
	margin: 0;
	padding: 0;
	clear: both;
	height: 0;
	line-height: 0
}

#menu li .cadre {
	border: 2px solid #FFEC00;
	border-radius: 50px;
	margin-left: 1.4em;
	margin-top: 0;
	margin-bottom: 0;
	background-color: rgba(0, 0, 0, 0);
	display: inline-block;
	transform-origin: 0 0
}

#menu .cadre span {}

#menu .cadre span i {
	display: none
}

#menu li .mactif {
	color: #FFEC00
}

/*#menu .mactif span i {width:100%; background-color: #FFEC00}*/

#menu li .menuactifINT {
	color: #FFEC00
}

#menu .menuactifINT span i {
	width: 100%;
	background-color: #FFEC00
}

#btmenu {
	display: none
}

.H #menu li .am,
.H #menu span i {
	visibility: hidden
}



#navigation {
	width: 100%;
	height: auto;
	position: relative;
	left: 0;
}

.H #navigation {
	width: 100%;
	height: 100%;
	position: fixed;
	left: 102%;
	top: 0;
	z-index: 200;
	overflow: hidden
}

#logonav {
	position: absolute;
	top: 32px;
	left: 9%;
	z-index: 201;
	width: 253px;
	height: auto;
	display: block
}

.H #logonav {
	position: fixed
}

#logonav img {
	width: 100%;
	display: block
}

.retour {
	width: 72px;
	height: 72px;
	background-color: #FFEC00;
	border-radius: 50%;
	display: block;
	position: absolute;
	top: 26px;
	left: 38%;
	margin-left: -36px;
	z-index: 600;
	cursor: pointer;
}

.retour img {
	width: 100%;
	display: block;
	transform-origin: 50% 50%
}

#navG {
	float: left;
	width: 38%;
	height: 100%;
	overflow: hidden;
	position: relative;
	transform-origin: 0;
	z-index: 100;
	background-color: #141c25
}

#navG img {
	width: 975px;
	height: 1300px;
	position: absolute;
	top: 50%;
	left: 0;
	margin-left: 0;
	margin-top: -650px;
	z-index: 100
}

#navD {
	float: right;
	width: 62%;
	height: 100%;
	overflow: hidden;
	position: relative
}

#fondnavD {
	width: 100%;
	height: 100%;
	background-color: #141c25;
	position: absolute;
	z-index: 200;
	top: 0;
	left: 0;
	transform-origin: 0 0
}

#navDA,
#navDB,
#navDC,
#navDD {
	position: relative;
	z-index: 201
}

.H #navDA,
.H #navDB,
.H #navDC,
.H #navDD {
	display: none
}

.navD1 {
	float: left;
	width: 40%;
	margin-top: 11.5em;
	padding-left: 9%;
	position: relative;
	z-index: 201
}

.navD1 ul {
	display: block;
	padding-top: 0.5em
}

.navD1 ul li {
	display: block
}

.navD1 a {
	display: inline-block;
	font-size: 1.6em;
	color: #fff;
	line-height: 1.6em;
	padding: 0.15em 0;
	letter-spacing: 0.05em;
	font-weight: 400;
	position: relative;
	overflow: hidden
}

.navD2 {
	float: right;
	width: 48%;
	margin-top: 11.5em;
	padding-left: 3%;
	position: relative;
	z-index: 201
}

.navD2 ul {
	display: block;
	padding-top: 0.5em
}

.navD2 ul li {
	display: block
}

.navD2 a {
	display: inline-block;
	font-size: 1.25em;
	color: #fff;
	line-height: 1.6em;
	padding: 0.3em 0 0.1em 0;
	font-weight: 400;
	position: relative
}

.navD2 .traitnav {
	height: 100%;
	width: 2px;
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	transform-origin: 100% 100%
}

.navD2 .traitnav {
	background-color: #323941
}

.CRNB .traitnav {
	background-color: #dfe2e6
}

.navD1 a i,
.navD2 a i {
	width: 0;
	position: absolute;
	height: 1px;
	bottom: 0.1em;
	left: 0;
	background-color: #fff
}

#navD strong {
	color: #FFEC00;
	position: relative;
	display: inline-block;
	font-weight: 400;
	margin-bottom: 0.8em
}

.titreminiICO {
	position: relative;
	padding-left: 3.2em;
	text-transform: uppercase;
	font-size: 1em;
	letter-spacing: 0.16em;
	display: inline-block;
	line-height: 1.4em;
	padding-top: 0.4em;
	padding-bottom: 0.4em
}

.titreminiICO img {
	width: 2.1em;
	position: absolute;
	top: 50%;
	margin-top: -1.05em;
	left: 0
}


.navD1 .mNAVactif {
	color: #FFEC00
}

.navD1 .mNAVactif i {
	width: 100%;
	background-color: #FFEC00
}

.navD2 .mNAVactif {
	color: #FFEC00
}

.navD2 .mNAVactif i {
	width: 100%;
	background-color: #FFEC00
}


#contactRapideNav {
	display: block;
	background-color: #FFFFFF;
	padding: 1.6em 0 1.6em 0;
	position: relative;
	z-index: 250;
	width: 62%;
}

.H #contactRapideNav {
	position: absolute;
	bottom: 0;
	right: 0;
}

.H #RapideNavA,
.H #RapideNavB,
.H #RapideNavC,
.H #RapideNavD {
	display: none
}

.CRNA {
	float: left;
	width: 40%;
	padding-left: 9%;
	line-height: 1.8em;
	-webkit-user-select: text;
	-moz-user-select: text;
	-khtml-user-select: text;
	-ms-user-select: text
}

.CRNB {
	width: 48%;
	padding-left: 3%;
	float: left;
	display: block;
	position: relative
}

.CRNA strong,
.CRNB strong {
	color: #343d47;
	position: relative;
	display: inline-block;
	font-weight: 400;
	margin-bottom: 0.8em
}

.CRNA span,
.CRNB span {
	color: #343d47;
	font-size: 1.15em;
	letter-spacing: 0.07em;
	padding-top: 0.2em;
	font-weight: 300;
	line-height: 1.8em;
	display: inline-block;
	padding-bottom: 0.1em;
}

.traitnav {
	height: 100%;
	width: 2px;
	position: absolute;
	top: 0;
	left: 0;
	display: block
}



.lienTraitA {
	position: relative;
	display: inline-block;
	color: #343d47;
}

.lienTraitA i {
	position: absolute;
	bottom: 0.1em;
	left: 0;
	width: 100%;
	height: 2px;
	background-color: #FFEC00;
	transform-origin: 0
}

.lienTraitB {
	position: relative;
	display: inline-block;
	color: #fff;
	font-weight: 500
}

.lienTraitB i {
	position: absolute;
	bottom: 0.1em;
	left: 0;
	width: 100%;
	height: 2px;
	background-color: #000;
	transform-origin: 0
}

.lienTraitC {
	position: relative;
	display: inline-block;
	color: #FFEC00;
	font-weight: 500
}

.lienTraitC i {
	position: absolute;
	bottom: 0.1em;
	left: 0;
	width: 100%;
	height: 2px;
	background-color: #000;
	transform-origin: 0
}

.H #navG,
.H #navG img,
.H #logonav,
.H #fondnavD,
.H .retour,
.H #contactRapideNav {
	visibility: hidden
}


/* commun */
.ext1 {
	width: 82%;
	margin-left: auto;
	margin-right: auto
}

.ext2 {
	width: 66%;
	margin-left: auto;
	margin-right: auto
}

.fondgris {
	background-color: #f5f7f7
}

.fondgris2 {
	background-color: #eaebec
}

.coulA {
	color: #FCBC00
}

.coulB {
	color: #000
}

.coulC {
	color: #fff
}

.coulD {
	color: #797f81
}

.brmob {
	display: none
}

.paddH23 {
	padding-top: 23em
}

.paddH18 {
	padding-top: 18em
}

.paddH15 {
	padding-top: 15em
}

.paddH13 {
	padding-top: 13em
}

.paddH12 {
	padding-top: 12em
}

.paddH11 {
	padding-top: 11em
}

.paddH10 {
	padding-top: 10em
}

.paddH9 {
	padding-top: 1em
}

.paddH8 {
	padding-top: 8em
}

.paddH7 {
	padding-top: 7em
}

.paddH65 {
	padding-top: 6.5em
}

.paddH6 {
	padding-top: 6em
}

.paddH4 {
	padding-top: 4em
}

.paddH2 {
	padding-top: 2em
}

.paddB17 {
	padding-bottom: 17em
}

.paddB15 {
	padding-bottom: 15em
}

.paddB12 {
	padding-bottom: 12em
}

.paddB11 {
	padding-bottom: 11em
}

.paddB10 {
	padding-bottom: 10em
}

.paddB7 {
	padding-bottom: 7em
}

.paddB4 {
	padding-bottom: 4em
}

.paddB3 {
	padding-bottom: 3em
}

.margH18 {
	margin-top: 18em
}

.margH17 {
	margin-top: 5em
}

.margH15 {
	margin-top: 15em
}

.margH13 {
	margin-top: 13em
}

.margH11 {
	margin-top: 5em
}

.margH9 {
	margin-top: 9em
}

.margH8 {
	margin-top: 8em
}

.margH7 {
	margin-top: 7em
}

.margH6 {
	margin-top: 6em
}

.margH4 {
	margin-top: 4em
}

.margH3 {
	margin-top: 3em
}

.margH2 {
	margin-top: 2em
}

.margB108 {
	margin-bottom: 1.8em
}

.margB1 {
	margin-bottom: 1em
}


.paddL3 {
	padding-left: 3em
}

.Texteselect {
	-webkit-user-select: text;
	-moz-user-select: text;
	-khtml-user-select: text;
	-ms-user-select: text
}

.H .ano0 {
	visibility: hidden
}

.H .anSX0 {
	visibility: hidden;
	transform-origin: 0 0
}

.H .anSX1 {
	transform-origin: 0 0
}

.H .ans1 {
	visibility: hidden;
	transform-origin: 50% 50%
}

.contextimg {
	overflow: hidden
}

.H .any1,
.H .any2,
.H .any3 {
	visibility: hidden;
	transform-origin: 50% 50%
}

.H .anys1 {
	visibility: hidden;
	transform-origin: 50% 50%
}

.H .anScale {
	transform-origin: 50% 50%
}

.animeTitre {
	line-height: 0.9em;
	display: inline-block
}

.animeTitre span {
	position: relative;
	display: inline-block;
	overflow: hidden;
	line-height: 1em;
	padding-bottom: 0.01em
}

.animeTitre b {
	display: inline-block
}

.H .animeTitre b {
	visibility: hidden
}


/* ******** ACCUEIL 1 */
.animeTitreAC1 {
	line-height: 0.9em;
	display: inline-block
}

.animeTitreAC1 span {
	position: relative;
	display: inline-block;
	overflow: hidden;
	line-height: 1em;
	padding-bottom: 0.01em
}

.animeTitreAC1 b {
	display: inline-block
}

.H .animeTitreAC1 b {
	visibility: hidden
}

.infoAC1 .AC1b2 {
	position: absolute;
	top: 0;
	left: 0
}

.infoAC1 .AC1b2init {
	position: relative
}

/* ******** fin ACCUEIL 1 */


/* ******** ACCUEIL 2 */
.animeTitreAC2 {
	line-height: 0.9em;
	display: inline-block
}

.animeTitreAC2 span {
	position: relative;
	display: inline-block;
	overflow: hidden;
	line-height: 1em;
	padding-bottom: 0.01em
}

.animeTitreAC2 b {
	display: inline-block
}

.H .animeTitreAC2 b {
	visibility: hidden
}

/* ******** fin ACCUEIL 2 */





/* suite accueil */


#intro {
	width: 100%;
	height: auto;
	min-height: 600px;
	overflow: hidden;
	position: relative
}

.H #intro {
	width: 100%;
	height: 100%;
	min-height: 100%;
	position: relative;
	overflow: hidden
}

#logo {
	width: 253px;
	height: auto;
	display: block;
	position: absolute;
	top: 32px;
	left: 9%;
	z-index: 31
}

#logo img {
	width: 100%;
	display: block
}

#video {
	z-index: 8;
	width: 100%;
	height: 116%;
	object-fit: cover;
	position: absolute;
	top: 0;
}

#videoframe {
	width: 100vw;
	height: 56.25vw;
	min-height: 100vh;
	min-width: 177.77vh;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -45%);
	-ms-transform: translate(-50%, -45%);
	transform: translate(-50%, -45%);
}

#videoframe2 {
	width: 100vw;
	height: 56.25vw;
	min-height: 115vh;
	min-width: 177.77vh;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}

.d-none {
	display: none !important;
}

.d-block {
	display: block !important;
}



@media screen and (min-width:767px) {
	.d-md-block {
		display: block !important;
	}

	.d-md-grid {
		display: grid !important;
	}

	.d-md-none {
		display: none !important;
	}
}

.gal01 {
	z-index: 8
}

.H .gal01 {
	visibility: hidden
}


/* ******** ACCUEIL 1 */
#introintAC1 {
	padding-top: 14em;
	margin-left: 9%;
	position: relative;
	z-index: 15
}

#introintAC1 h2 {
	font-size: 3.6em;
	color: #fff;
	position: relative;
	font-weight: 500;
	padding: 0em 0 0em 1em;
	float: left;
	display: inline-block
}

#introintAC1 h2 b {
	font-weight: 500;
	line-height: 1.2em
}

#introintAC1 h2 i {
	width: 1px;
	background-color: #fff;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	transform-origin: 100% 100%
}

#introintAC1 h2 #dokAC1 {
	width: 1.6em;
	display: block;
	margin-top: 0.7em
}

#introintAC1 h2 .infoAC1 {
	color: #FFEC00;
	font-size: 0.6em;
	margin-top: 0.2em
}

/* ******** fin ACCUEIL 1 */

/* ******** ACCUEIL 2 */
#introintAC2 {
	position: absolute;
	bottom: 10%;
	left: 5%;
	position: absolute;
	z-index: 15
}

#introintAC2 h2 {
	font-size: 2.2em;
	color: #fff;
	position: relative;
	font-weight: 300;
	padding: 0em 0 0em 1em;
	float: left;
	display: inline-block
}

#introintAC2 h2 b {
	font-weight: 300;
	line-height: 1.2em
}

#introintAC2 h2 i {
	width: 1px;
	background-color: #fff;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	transform-origin: 100% 100%
}

#animAC2 {
	width: 220px;
	position: relative;
	margin-top: 2em;
	margin-left: 1%;
	margin-right: auto;
	z-index: 16
}

#dok00 {
	width: 360px;
	height: auto;
	position: relative;
	margin: 0 auto;
	margin-bottom: 0em
}

#dok01,
#dok02 {
	width: 100%;
	height: auto;
	display: block;
	position: absolute;
	top: 0;
	left: 0
}

#dok01 {
	width: 220px;
}

#dok03 {
	width: 100%;
	position: relative;
	text-align: center;
	line-height: 0.9em;
	display: block;
	font-size: 2.6em;
	color: #fff;
	text-transform: uppercase;
	letter-spacing: 0.17em
}

#dok03 span {
	position: relative;
	display: block;
	width: 100%;
	overflow: hidden;
	line-height: 1em;
	padding-bottom: 0.01em
}

#dok03 span b {
	display: inline-block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	text-align: center
}

#dok03 span b.dok03binit {
	position: relative
}

#dok03 span b,
.H #dok03 span b {
	visibility: hidden
}

.H #dok01,
.H #dok02 {
	visibility: hidden
}


#degrade3 {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 11;
	background: -moz-radial-gradient(center, ellipse cover, rgba(22, 28, 40, 0.4) 0%, rgba(22, 28, 40, 0) 50%);
	background: -webkit-gradient(radial, center center, 0px, center center, 50%, color-stop(0%, rgba(22, 28, 40, 0.4)), color-stop(100%, rgba(22, 28, 40, 0)));
	background: -webkit-radial-gradient(center, ellipse cover, rgba(22, 28, 40, 0.4) 0%, rgba(22, 28, 40, 0) 50%);
	background: -o-radial-gradient(center, ellipse cover, rgba(22, 28, 40, 0.4) 0%, rgba(22, 28, 40, 0) 50%);
	background: -ms-radial-gradient(center, ellipse cover, rgba(22, 28, 40, 0.4) 0%, rgba(22, 28, 40, 0) 50%);
	background: radial-gradient(ellipse at center, rgba(22, 28, 40, 0.4) 0%, rgba(22, 28, 40, 0) 50%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#161c28', endColorstr='#161c28', GradientType=1);
}


/* ******** fin ACCUEIL 2 */


#introint {
	padding-top: 14em;
	margin-left: 9%;
	position: relative;
	z-index: 15
}

#introint h2 {
	font-size: 3.6em;
	color: #fff;
	position: relative;
	font-weight: 100;
	padding: 0.6em 0 0.6em 1em
}

#introint h2 b {
	font-weight: 100;
	line-height: 1.2em
}

#introint h2 i {
	width: 1px;
	background-color: #fff;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	transform-origin: 100% 100%
}

#introint h2 .mini {
	color: #FFEC00;
	font-size: 0.65em
}

#introint h2 .mini b {
	padding-bottom: 0.3em;
	padding-top: 0.5em
}

#introdefile {
	position: relative;
	z-index: 16;
	background-color: #f5f7f7;
}

.H #introdefile {
	position: absolute;
	bottom: 0;
	right: 0;
	width: 50%;
	background-color: #f5f7f7;
	z-index: 16;
	transform-origin: 0 0
}

#introdefileInt {
	position: relative;
	overflow: hidden;
	min-height: 224px
}

#introdefilecontenu {
	display: block;
	padding: 1.7em 0 1em 2.5em;
	margin-right: 120px;
	position: relative;
	z-index: 3
}

.H .infosDefile {
	display: none
}

.H #infosDefile01 {
	display: block
}

.w-100 {
	width: 100% !important;
}

#introdefile h2 {
	color: #FCBC00;
	font-weight: 500;
	line-height: 1.6em;
	font-size: 1.35em;
	display: block
}

#introdefile p {
	color: #161313;
	font-weight: 300;
	line-height: 1.5em;
	font-size: 1.5em;
	padding-top: 0.2em;
	padding-bottom: 0.3em;
	display: block;
	margin: 0;
	min-height: 3.5em
}

.bt1 {
	position: relative;
	color: #161313;
	padding-top: 1.3em;
	padding-bottom: 1.3em;
	border-radius: 7px;
	line-height: 0.85em;
	font-size: 0.8em;
	overflow: hidden;
	display: inline-block
}

.bt1 strong {
	position: relative;
	padding-right: 6em;
	font-weight: 400;
	text-transform: uppercase;
	letter-spacing: 0.14em;
	z-index: 2
}

.bt1 strong span {
	display: inline-block
}

.bt1 strong img {
	display: block;
	width: 1.4em;
	position: absolute;
	right: 3em;
	top: 50%;
	margin-top: -0.7em
}

.bt1 i {
	display: block;
	border-radius: 50%;
	background-color: #161c28;
	width: 500px;
	height: 500px;
	position: absolute;
	bottom: 0;
	right: 50%;
	transform-origin: 50% 50%;
	margin-bottom: -250px;
	margin-right: -250px;
	z-index: 1;
	visibility: hidden
}

#defileFleches {
	position: absolute;
	top: 0;
	width: 112px;
	height: 100%;
	background-color: #eaecec;
	right: 0;
	z-index: 3
}

#defileSuivant {
	width: 112px;
	height: 112px;
	background-color: #dee1e2;
	position: relative;
	display: block;
	overflow: hidden;
	cursor: pointer
}

#defilePrecedent {
	width: 112px;
	height: 112px;
	background-color: #eaecec;
	position: relative;
	display: block;
	overflow: hidden;
	cursor: pointer
}

#defileSuivant img,
#defilePrecedent img {
	width: 1.2em;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -0.6em;
	margin-left: -0.6em;
	z-index: 5
}

#defileSuivant i,
#defilePrecedent i {
	display: block;
	border-radius: 50%;
	background-color: #fff;
	width: 500px;
	height: 500px;
	position: absolute;
	bottom: 0;
	right: 50%;
	transform-origin: 50% 50%;
	margin-bottom: -250px;
	margin-right: -250px;
	z-index: 1;
	visibility: hidden
}

#ronddefile {
	background-color: #FFEC00;
	width: 100%;
	height: 5px;
	position: absolute;
	top: 0;
	left: 0;
	transform-origin: 0 0;
	z-index: 1;
	visibility: hidden
}



#degrade1 {
	width: 100%;
	height: 500px;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 10;
	background: -moz-linear-gradient(top, rgba(22, 28, 40, 0.5) 0%, rgba(22, 28, 40, 0) 100%);
	/* FF3.6-15 */
	background: -webkit-linear-gradient(top, rgba(22, 28, 40, 0.5) 0%, rgba(22, 28, 40, 0) 100%);
	/* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, rgba(22, 28, 40, 0.5) 0%, rgba(22, 28, 40, 0) 100%);
	/* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#161c28', endColorstr='#161c28', GradientType=0);
	/* IE6-9 */
}

#degrade2 {
	width: 70%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 10;
	background: -moz-linear-gradient(left, rgba(22, 28, 40, 0.75) 0%, rgba(22, 28, 40, 0) 100%);
	background: -webkit-linear-gradient(left, rgba(22, 28, 40, 0.75) 0%, rgba(22, 28, 40, 0) 100%);
	background: linear-gradient(to right, rgba(22, 28, 40, 0.75) 0%, rgba(22, 28, 40, 0) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#161c28', endColorstr='#161c28', GradientType=1);
}



.H #logo,
.H #intro,
.H #video,
.H #degrade1,
.H #degrade2 {
	visibility: hidden
}



.H #page {
	visibility: hidden
}

.titre01 {
	color: #FCBC00;
	font-size: 2.6em;
	line-height: 1.3em;
	font-weight: 300;
	position: relative;
	display: inline-block;
	padding-left: 1.4em
}

.titre01 i {
	position: absolute;
	top: 0.65em;
	width: 1em;
	height: 2px;
	left: 0;
	background-color: #000;
	display: block
}

.titre02 {
	color: #161313;
	font-size: 1.6em;
	letter-spacing: 0.01em;
	line-height: 1.65em;
	font-weight: 300;
	padding-top: 0.6em
}

.titre03 {
	color: #fff;
	font-size: 2.6em;
	letter-spacing: 0.025em;
	line-height: 1.3em;
	font-weight: 300;
	position: relative;
	display: inline-block;
	padding-left: 1.4em
}

.titre03 i {
	position: absolute;
	top: 0.65em;
	width: 1em;
	height: 2px;
	left: 0;
	background-color: #000;
	display: block
}

.titre04 {
	color: #fff;
	font-size: 1.6em;
	letter-spacing: 0.01em;
	line-height: 1.65em;
	font-weight: 300;
	padding-top: 0.3em
}

.titre05 {
	color: #fff;
	font-size: 3em;
	line-height: 1.4em;
	font-weight: 300;
	position: relative;
	display: inline-block
}

.reduittexte {
	font-size: 0.85em;
	line-height: 1.8em
}

.listedomaine {
	display: block;
	margin-top: 4.5em
}

.listedomaine li {
	float: left;
	position: relative;
	overflow: hidden
}

.listedomaine .listeP1 {
	width: 59%;
	margin-right: 1%;
	height: 300px;
	background-color: #000000;
	margin-bottom: 10px
}

.listedomaine .listeP2 {
	width: 39%;
	margin-right: 1%;
	height: 300px;
	background-color: #000000;
	margin-bottom: 10px
}

.listedomaine .listeP3 {
	width: 19%;
	margin-right: 1%;
	height: 300px;
	background-color: #000000;
	margin-bottom: 10px
}

.listedomaine .listeP4 {
	width: 25%;
	margin-right: 1%;
	height: 296px;
	background-color: #000000;
	margin-bottom: 10px;
}

.listedomaine .listePSEUL,
.listedomaine .listePSEUL2 {
	width: 19%;
	margin-right: 1%;
	height: 300px;
	background-color: #FCBC00;
	margin-bottom: 10px;
	margin-top: 0 !important;
	display: grid;
	justify-content: center;
	align-items: center;
}

.listedomaine .ret {
	clear: both;
	width: 0;
	height: 0;
	line-height: 0;
	margin: 0;
	padding: 0;
	float: none;
	display: block
}

.listedomaine li .cal {
	z-index: 10
}

.listedomaine li a {
	display: block;
	width: 100%;
	height: 100%;
	position: relative;
	overflow: hidden
}

.listedomaine li .nomv2 {
	font-family: 'MB', sans-serif !important;
	position: absolute;
	bottom: 1.4em;
	left: .6em;
	font-size: 1.8em;
	color: #fff;
	font-weight: 400;
	letter-spacing: 0.03em;
	z-index: 20;
	display: inline-block;
}

.listedomaine li .nom {
	font-family: 'MB', sans-serif !important;
	position: absolute;
	bottom: 2em;
	left: 1.1em;
	font-size: 1.3em;
	color: #fff;
	font-weight: 400;
	letter-spacing: 0.03em;
	z-index: 20;
	display: inline-block;
}

.listedomaine .listeP3 .nom {
	letter-spacing: normal;

}

.monts-f {
	font-family: 'MB', sans-serif !important;
}

.listedomaine .listeP4 .nom {
	letter-spacing: normal
}

.listedomaine .listePSEUL span,
.listedomaine .listePSEUL2 span {
	color: #fff;
	text-align: center;
	font-size: 1.15em;
	font-weight: 300;
	display: block;
	line-height: 1;
	letter-spacing: 0.02em;
	padding-top: 0 !important;
	padding: 10px;
}

.listedomaine .listePSEUL span strong,
.listedomaine .listePSEUL2 span strong {
	font-size: 1.8em;
	font-weight: 300;
	display: block;
	margin-bottom: 5px;
}

@media screen and (max-width:500px) {

	.listedomaine .listePSEUL span strong,
	.listedomaine .listePSEUL2 span strong {
		font-size: 2.2em;

	}

}

.listedomaine li b {
	position: absolute;
	bottom: 1.5em;
	right: 1.4em;
	font-size: 1.45em;
	z-index: 20;
	width: 40px;
	height: 40px;
	overflow: hidden
}

.listedomaine li b img {
	width: 80px
}

.listedomaine li i {
	width: 100%;
	height: 100%;
	position: absolute;
	display: block;
	bottom: 0;
	left: 0;
	z-index: 11;
	background: -moz-linear-gradient(bottom, rgba(22, 28, 40, 0.8) 0%, rgba(22, 28, 40, 0) 100%);
	/* FF3.6-15 */
	background: -webkit-linear-gradient(bottom, rgba(22, 28, 40, 0.8) 0%, rgba(22, 28, 40, 0) 100%);
	/* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to top, rgba(22, 28, 40, 0.8) 0%, rgba(22, 28, 40, 0) 100%);
	/* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#161c28', endColorstr='#161c28', GradientType=0);
	/* IE6-9 */
}


.servicesPlus {
	float: left;
	width: 48%;
	padding-left: 11%;
	margin-top: 3em
}

.depliA {
	font-weight: 300;
	color: #161313;
	font-size: 1.3em;
	padding: 1.3em 0;
	border-top: 1px solid #FCBC00;
	position: relative;
	display: block;
	width: 100%;
	line-height: 1.4em;
	cursor: pointer;
	z-index: 30
}

.depliAder {
	border-bottom: 1px solid #FCBC00
}

.depliA span {
	display: block;
	margin-right: 3em;
	margin-left: 2.4em;
	letter-spacing: 0.025em
}

.depliA .v {
	width: 0.9em;
	position: absolute;
	display: block;
	top: 1.4em;
	left: 0;
	transform-origin: 50% 50%
}

.depliA .cerclePlus2 {
	width: 0.9em;
	position: absolute;
	display: block;
	top: 1.4em;
	right: 0;
	border: 1px solid #fff;
	border-radius: 50%;
	transform-origin: 50% 50%
}

.depliA .cerclePlus2 img {
	display: block;
	width: 100%;
	transform-origin: 50% 50%
}

.depliB {
	padding-top: 1em;
	padding-bottom: 3em;
	position: relative;
	z-index: 20;
	width: 100%;
	font-size: 1.2em;
	line-height: 1.8em;
	color: #393939
}

.H .depliB {
	display: none
}

.depliB p {
	margin: 0;
	padding: 0;
	display: block
}

.depliB p strong,
.depliB li strong {
	color: #000;
	font-weight: 500
}

.depliB ul {
	margin: 0;
	padding: 0;
	display: block;
	margin-bottom: 1.5em
}

.depliB li {
	padding-left: 1.1em;
	background-image: url("../images/fl22.png");
	background-repeat: no-repeat;
	background-size: 0.45em;
	background-position: 0 0.7em
}

.depliB li a {
	color: #FFEC00;
	font-weight: 500
}

.bt2 {
	position: relative;
	color: #fff;
	padding-top: 1.4em;
	padding-left: 1.8em;
	padding-bottom: 1.4em;
	border-radius: 7px;
	line-height: 0.85em;
	font-size: 0.65em;
	overflow: hidden;
	display: inline-block;
	background-color: #161c28
}

.bt2 strong {
	position: relative;
	padding-right: 6em;
	font-weight: 400;
	text-transform: uppercase;
	letter-spacing: 0.14em;
	z-index: 2
}

.bt2 strong span {
	display: inline-block
}

.bt2 strong img {
	display: block;
	width: 1.4em;
	position: absolute;
	right: 2.8em;
	top: 50%;
	margin-top: -0.7em
}

.bt2 i {
	display: block;
	border-radius: 50%;
	background-color: #fff;
	width: 500px;
	height: 500px;
	position: absolute;
	bottom: 0;
	right: 50%;
	transform-origin: 50% 50%;
	margin-bottom: -250px;
	margin-right: -250px;
	z-index: 1;
	visibility: hidden
}

.bt3 {
	position: relative;
	color: #fff;
	padding-top: 1.5em;
	padding-left: 1.8em;
	padding-bottom: 1.5em;
	border-radius: 7px;
	line-height: 0.85em;
	font-size: 0.8em;
	overflow: hidden;
	display: inline-block;
	background-color: #FFEC00
}

.bt3 strong {
	position: relative;
	padding-right: 6em;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: 0.21em;
	z-index: 2
}

.bt3 strong span {
	display: inline-block
}

.bt3 strong img {
	display: block;
	width: 1.4em;
	position: absolute;
	right: 2.8em;
	top: 50%;
	margin-top: -0.7em
}

.bt3 i {
	display: block;
	border-radius: 50%;
	background-color: #161c28;
	width: 500px;
	height: 500px;
	position: absolute;
	bottom: 0;
	right: 50%;
	transform-origin: 50% 50%;
	margin-bottom: -250px;
	margin-right: -250px;
	z-index: 1;
	visibility: hidden
}

.bt4 {
	position: relative;
	color: #161313;
	padding-top: 1.5em;
	padding-left: 1.8em;
	padding-bottom: 1.5em;
	border-radius: 7px;
	line-height: 0.85em;
	font-size: 0.8em;
	overflow: hidden;
	display: inline-block;
	background-color: #fff
}

.bt4 strong {
	position: relative;
	padding-right: 6em;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: 0.21em;
	z-index: 2
}

.bt4 strong span {
	display: inline-block
}

.bt4 strong img {
	display: block;
	width: 1.4em;
	position: absolute;
	right: 2.8em;
	top: 50%;
	margin-top: -0.7em
}

.bt4 i {
	display: block;
	border-radius: 50%;
	background-color: #161313;
	width: 500px;
	height: 500px;
	position: absolute;
	bottom: 0;
	right: 50%;
	transform-origin: 50% 50%;
	margin-bottom: -250px;
	margin-right: -250px;
	z-index: 1;
	visibility: hidden
}



.citation {
	float: right;
	width: 33.5%;
	margin-right: 0.5%;
	margin-top: 1.9em
}

.citation p {
	color: #161313;
	font-size: 1.45em;
	font-weight: 300;
	display: block;
	margin: 0;
	padding: 0;
	line-height: 2em
}

.citation .cotes {
	color: #FFEC00;
	font-size: 1.3em;
	display: inline-block;
	line-height: 0.5em
}

.citation .qui {
	color: #FFEC00;
	font-size: 1.1em;
	font-weight: 400;
	display: block;
	padding-top: 1em;
	line-height: 1.6em
}

.citation .qui strong {
	font-weight: 500
}


.bandeau-ext {
	width: 100%;
	position: relative;
	padding-top: 7.5em
}

.bandeauG {
	width: 35%;
	padding-left: 9%;
	padding-right: 6%;
	/* ext1 82% */
	background-color: #FFEC00;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 20;
	padding-top: 3.7em;
	padding-bottom: 3.7em
}

.bandeauG .margeBas01 {
	margin-bottom: 5em
}

.bandeauG .margeBas02 {
	margin-bottom: 2em
}

.bandeau-fond {
	position: relative;
	overflow: hidden;
	z-index: 19;
	background-color: #19242A
}

.bandeauD {
	position: relative;
	margin-left: 58.5%;
	color: #fff;
	z-index: 20;
	padding-bottom: 25em;
	padding-top: 8.5em
}

.bandeauD p {
	font-size: 1.15em;
	line-height: 1.9em;
	color: #fff;
	padding: 1.5em 0 0 0;
	margin: 0
}

.bandeauD ul {
	margin: 0;
	padding: 0;
	display: block;
	font-size: 1.15em
}

.bandeauD li {
	padding-left: 1.1em;
	background-image: url("../images/fl22.png");
	background-repeat: no-repeat;
	background-size: 0.45em;
	background-position: 0 0.7em;
	line-height: 1.9em
}


#references {}

#references h4 {
	display: block;
	text-align: center;
	font-size: 1.75em;
	font-weight: 500;
	padding-bottom: 1.5em;
	letter-spacing: 0.02em
}

#references ul {
	margin-top: 4em
}

#references li {
	width: 18.8%;
	margin-right: 1.5%;
	margin-bottom: 1em;
	float: left
}

#references .der {
	margin-right: 0
}

#references li img {
	width: 100%;
	display: block
}




.animeTitreFlux {
	line-height: 0.8em;
	display: inline-block
}

.animeTitreFlux span {
	position: relative;
	display: inline-block;
	overflow: hidden;
	line-height: 0.8em;
	padding-bottom: 0.01em;
}

.animeTitreFlux b {
	display: inline-block
}

.H .animeTitreFlux b {
	visibility: hidden
}

#mosaique {
	position: relative;
	margin-top: 15em
}

#mosaiqueG {
	width: 50%;
	float: left;
	position: relative;
	z-index: 10
}

.M01 {
	width: 40%;
	float: left;
	position: relative;
	overflow: hidden
}

.M02 {
	width: 20%;
	float: left;
	position: relative;
	overflow: hidden
}

.M03 {
	width: 20%;
	float: left;
	position: relative;
	overflow: hidden
}

#mosaiqueG img {
	width: 100%;
	position: relative;
	transform-origin: 50% 50%
}

#mosaiqueD {
	width: 50%;
	float: right;
	position: relative;
	overflow: hidden;
	z-index: 10
}

.Mnoir {
	width: 20%;
	position: absolute;
	top: 0;
	right: 20%;
	background-color: #000000;
	z-index: 11;
	transform-origin: 0 0
}

.Mbleu {
	width: 20%;
	position: absolute;
	top: 0;
	right: 0%;
	background-color: #FCBC00;
	z-index: 11;
	transform-origin: 100% 100%
}

.Mbleu2 {
	width: 20%;
	position: absolute;
	top: 0;
	right: 20%;
	background-color: #FCBC00;
	z-index: 11;
	transform-origin: 0 0
}

#mosaiqueD .fondMD {
	width: 100%;
	position: relative;
	transform-origin: 50% 50%;
	z-index: 10
}

#mosaiqueD strong {
	font-size: 5em;
	color: #fff;
	position: relative;
	font-weight: 600;
	position: absolute;
	top: 0;
	right: 30%;
	z-index: 12
}

#mosaiqueD strong b {
	font-weight: 600;
	line-height: 0.85em;
	padding-bottom: 0.2em
}

.H #mosaiqueG,
.H #mosaiqueD {
	visibility: hidden
}

#mosaique .bt5 {
	position: absolute;
	top: 0;
	left: 50%;
	margin-left: -50px;
	z-index: 20;
	color: #fff;
	line-height: 0.85em;
	font-size: 1.4em;
	display: inline-block;
	background-color: #FCBC00;
	overflow: hidden;
}

.bt5 strong {
	position: relative;
	padding-right: 3.9em;
	font-weight: 300;
	letter-spacing: 0.025em;
	padding-top: 1.1em;
	padding-left: 1.3em;
	padding-bottom: 1.1em;
	display: inline-block;
	line-height: 1.6em
}

.bt5 strong span {
	display: inline-block;
	position: relative;
	z-index: 10
}

.bt5 strong img {
	display: block;
	width: 1em;
	position: absolute;
	right: 1.8em;
	top: 50%;
	margin-top: -0.5em;
	z-index: 10
}

.bt5 i {
	display: block;
	border-radius: 50%;
	background-color: #161313;
	width: 500px;
	height: 500px;
	position: absolute;
	bottom: 0;
	right: 50%;
	transform-origin: 50% 50%;
	margin-bottom: -250px;
	margin-right: -250px;
	z-index: 1;
	visibility: hidden
}


/* page int */

.titreInt01 {
	color: #FFEC00;
	font-size: 0.9em;
	letter-spacing: 0.03em;
	font-weight: 500;
	line-height: 1.6em;
	text-transform: uppercase;
	padding-bottom: 0.8em
}

.titreInt02 {
	color: #161313;
	font-size: 2.2em;
	font-weight: 300;
	line-height: 2em;
}

.titreInt03 {
	color: #161313;
	font-size: 2.2em;
	font-weight: 300;
	line-height: 1.6em;
	display: block
}

.titreInt05 {
	color: #161313;
	font-size: 2.2em;
	font-weight: 300;
	line-height: 1.6em;
	display: block
}

.titreInt05bis {
	color: #161313;
	font-size: 2.2em;
	font-weight: 300;
	line-height: 1.6em;
	display: block;
	position: relative;
	padding-left: 50px
}

.titreInt05bis i {
	width: 2px;
	height: 100%;
	background-color: #FFEC00;
	display: block;
	position: absolute;
	top: 0;
	left: 0
}

.extInt01 .ppadd50 {
	padding-left: 50px;
	display: block
}

.titreInt04 {
	color: #161313;
	font-size: 2.2em;
	font-weight: 300;
	line-height: 1.6em;
	display: block;
	text-align: center
}

.titreInt06 {
	color: #161313;
	font-size: 1.6em;
	font-weight: 500;
	line-height: 1.6em;
	display: block
}

.surligne {
	position: relative;
	display: inline-block;
	color: #FFEC00;
	font-weight: 300;
}

.surligne i {
	width: 100%;
	height: 2px;
	background-color: #FFEC00;
	position: absolute;
	bottom: 0.2em;
	left: 0;
	transform-origin: 0 0
}

.videointA {
	position: relative;
	cursor: pointer
}

.playvideo {
	width: 6em;
	height: auto;
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -3em;
	margin-left: -3em;
	z-index: 9001;
	transform-origin: 50% 50%
}

.videointA #video {
	width: 100%;
	height: auto;
	position: relative;
	z-index: 9000;
	cursor: pointer;

}

.extInt01 {
	width: 88%;
	margin-left: auto;
	margin-right: auto;
	display: block
}

/* .decale01 {margin-left: 25%} */
.decale02 {
	margin-left: 30%;
	margin-right: 10%
}

.par01 {
	float: left;
	width: 45%;
	margin-left: 0%;
	margin-top: 3.7em
}

.extInt01 p {
	color: #161313;
	font-size: 1.15em;
	line-height: 2.05em;
	font-weight: 300;
	padding-top: 0;
	padding-bottom: 15px;
	margin: 0
}

.extInt01 li {
	color: #161313;
	font-size: 1.15em;
	line-height: 2.05em;
	font-weight: 300;
	padding-top: 0;
	list-style: disc;
	padding-bottom: 0;
	margin: 0
}

.extInt01 p strong {
	font-weight: 500;
	color: #000;
	position: relative;
	display: inline-block
}

.extInt01 p .coulB {
	color: #000
}

.extInt01 p .gras {
	font-weight: 500
}

.extInt01 p .gras2 {
	font-weight: 600
}

.extInt01 p strong i {
	width: 100%;
	height: 2px;
	background-color: #FFEC00;
	position: absolute;
	bottom: 0.2em;
	left: 0;
	transform-origin: 0 0
}

.extInt01 p .mini {
	font-size: 0.9em
}

.extInt01 p a.lien01 {
	color: #000;
	font-weight: 500;
	text-decoration: underline
}

.extInt01 p a.lien01:hover {
	color: #FFEC00;
	font-weight: 500;
	text-decoration: none
}

.extInt01 p a.lien02 {
	color: #FFEC00;
	font-weight: 500;
	text-decoration: underline
}

.extInt01 p a.lien02:hover {
	color: #000;
	font-weight: 500;
	text-decoration: none
}


.listesecteur {
	margin-top: 3em
}

.listesecteur li {
	position: relative;
	font-size: 1.3em;
	font-weight: 300;
	color: #161313;
	padding: 0.7em 2.5em 0.6em 2.2em;
	display: inline-block;
	margin-bottom: 0.5em
}

.listesecteur li img {
	position: absolute;
	top: 0.6em;
	width: 1.7em;
	left: 0;
	display: block
}

.listeE {}

.listeE li {
	display: block;
	padding-bottom: 1em;
	line-height: 1.8em
}

.listeE li a {
	display: block;
	border-radius: 9px;
	background-color: #fff;
	padding: 1.6em 0;
	position: relative
}

.listeE li a .colE1 {
	display: block;
	float: left;
	width: 30%;
	margin-left: 3%;
	color: #161313;
	font-size: 1.5em;
	font-weight: 300
}

.listeE li a .colE2 {
	display: block;
	float: left;
	width: 22%;
	margin-left: 1%;
	color: #757575;
	font-size: 1em;
	font-weight: 300;
	padding-top: 0.1em
}

.listeE li a .colE3 {
	display: block;
	float: left;
	width: 33%;
	margin-left: 1%;
	color: #757575;
	font-size: 1em;
	font-weight: 300;
	padding-top: 0.1em
}

.listeE li a .colE3 img {
	width: 1.9em;
	display: block;
	margin-right: 0.3em;
	float: left
}

.listeE li a .colE3 b {
	display: inline-block;
	padding-left: 0.3em;
	font-weight: 300
}

.listeE li a .colE3 i.ret {
	clear: both;
	width: 0;
	height: 0;
	line-height: 0;
	margin: 0;
	padding: 0;
	float: none;
	display: block
}

.listeE li a .flecheE {
	position: absolute;
	top: 50%;
	right: 4%;
	width: 1.1em;
	margin-top: -0.55em;
	transform-origin: 50% 50%
}

#visuCarresExt {
	margin-bottom: 20px;
	position: relative;
	width: 100%;
	overflow: visible;
	padding-bottom: 2em
}

.visuCarres {
	position: relative;
	width: 100%;
	height: 500px;
	overflow: hidden
}

.fondVC {
	width: 100%;
	display: block;
	transform-origin: 50% 50%;
	position: relative;
	z-index: 5
}

#visuCarresExt strong {
	font-size: 6em;
	color: #fff;
	position: relative;
	font-weight: 600;
	position: absolute;
	bottom: 0.7em;
	left: 11%;
	z-index: 12
}

#visuCarresExt strong b {
	font-weight: 600;
	line-height: 0.85em;
	padding-bottom: 0.2em
}

.VCnoir {
	width: 12%;
	position: absolute;
	bottom: 0;
	right: -3%;
	background-color: #000000;
	z-index: 11;
	transform-origin: 0 0
}

.VCbleu {
	width: 12%;
	position: absolute;
	bottom: 0;
	right: 9%;
	background-color: #FFEC00;
	z-index: 11;
	transform-origin: 100% 100%
}

.VCbleu2 {
	width: 12%;
	position: absolute;
	bottom: 0;
	right: -3%;
	background-color: #FFEC00;
	z-index: 11;
	transform-origin: 0 0
}

.VCbleu3 {
	width: 12%;
	position: absolute;
	top: 0;
	left: 17%;
	background-color: #FFEC00;
	z-index: 11;
	transform-origin: 0 0
}

.VCbleu4 {
	width: 12%;
	position: absolute;
	bottom: 0;
	left: 5%;
	background-color: #FFEC00;
	z-index: 11;
	transform-origin: 0 0
}

.H .visuCarres {
	visibility: hidden
}

.partG {
	width: 45%;
	float: left
}

.partD {
	width: 45%;
	float: right
}

.partG2 {
	width: 48%;
	float: left
}

.partD2 {
	width: 48%;
	float: right
}

.imagefull {
	width: 100%;
	display: block
}

.galerieG {
	width: 49%;
	float: left
}

.galerieD {
	width: 49%;
	float: right
}

.ga {
	width: 100%
}

.gb {
	width: 60%
}

.servicesPlusInt {
	width: 56%;
	margin-top: 3em
}

.servicesPlusInt .depliB p {
	margin: 0;
	padding: 0;
	display: block;
	font-size: 1em;
	line-height: 1.8em
}

.servicesPlusInt .depliB p strong,
.servicesPlusInt .depliB li strong {
	color: #000;
	font-weight: 500
}

.ressources {}

.ressources .col {
	width: 30%;
	margin-right: 5%;
	float: left;
	padding-top: 7em
}

.ressources .colsansM {
	margin-right: 0
}

.imgcol {
	width: 100%;
	display: block;
}

.ressources h5 {
	color: #fff;
	font-weight: 500;
	line-height: 1.6em;
	padding: 0.6em 0.5em 0.6em 3.4em;
	font-size: 1.3em;
	background-color: #FFEC00;
	position: relative;
	display: block;
	margin: 1.8em 0 1.5em 0
}

.ressources h5 img {
	width: 0.9em;
	position: absolute;
	top: 0.95em;
	left: 1.5em
}

.ressources ul {
	margin: 0;
	padding: 0;
	display: block;
	margin-bottom: 0;
	color: #161313;
	font-size: 1.15em;
	line-height: 2.05em;
	font-weight: 300
}

.ressources li {
	padding-left: 1.1em;
	background-image: url("../images/fl22.png");
	background-repeat: no-repeat;
	background-size: 0.45em;
	background-position: 0 0.8em;
	display: block
}

.services {
	display: block;
	margin-top: 5em;
	width: 100%
}

.services li {
	width: 19%;
	margin-right: 0.5%;
	margin-left: 0.5%;
	display: block;
	float: left;
	margin-bottom: 1em;
	position: relative;
	overflow: hidden
}

.margeBservices {
	margin-bottom: 1em
}

.services li a {
	background-color: #fff;
	display: block;
	font-weight: 400;
	text-align: center;
	position: relative;
	overflow: hidden
}

.services li span {
	color: #FFEC00;
	display: inline-block;
	text-align: center;
	font-size: 1.35em;
	line-height: 1.8em;
	position: relative;
	z-index: 10
}

.services li a i {
	display: block;
	border-radius: 50%;
	background-color: #FFEC00;
	width: 500px;
	height: 500px;
	position: absolute;
	bottom: 0;
	right: 50%;
	transform-origin: 50% 50%;
	margin-bottom: -250px;
	margin-right: -250px;
	z-index: 1;
	visibility: hidden
}

.services li b {
	width: 100%;
	display: block;
	position: relative;
	overflow: hidden
}

.services li img {
	width: 100%;
	display: block;
	transform-origin: 50% 50%
}

.services .ret {
	clear: both;
	width: 0;
	height: 0;
	line-height: 0;
	margin: 0;
	padding: 0;
	float: none;
	display: block
}



/* blanc */

#introBlanc {
	width: 100%;
	height: auto;
	position: relative
}

#introBlancint {
	width: 82%;
	padding-top: 12em;
	padding-bottom: 7em;
	position: relative;
	margin-left: auto;
	margin-right: auto
}

#introBlanc h2 {
	font-size: 3.6em;
	color: #1d1c1b;
	position: relative;
	font-weight: 100;
	padding: 0;
	margin: 0 0 0 1em
}

#introBlanc h2 b {
	font-weight: 100;
	line-height: 1.2em
}

#introBlanc h2.plusfort {
	font-weight: 500;
	font-size: 3.2em;
}

#introBlanc h2.plusfort b {
	font-weight: 500;
	line-height: 1.4em
}


#introBlanc h2 .mini2 {
	color: #FFEC00;
	font-size: 0.25em;
	text-transform: uppercase;
	letter-spacing: 0.07em;
	font-weight: 400
}

#introBlanc h2 .mini2 b {
	padding-bottom: 1em;
	font-weight: 400
}

#introBlanc h2 strong {
	color: #FFEC00;
	font-weight: 100
}

#introBlanc h2.plusfort strong {
	font-weight: 500
}

.traitbleuintro {
	width: 1px;
	background-color: #FFEC00;
	height: 34%;
	position: absolute;
	top: 13em;
	left: 9%;
	transform-origin: 100% 100%;
	z-index: 2
}

.visuintroBlanc {
	width: 100%;
	position: relative;
	z-index: 1
}

.H #introBlanc .traitbleuintro,
.H .visuintroBlanc {
	visibility: hidden
}

#introBlanccontact {
	padding-top: 11em
}

#bas {
	width: 100%;
	background-color: #161d29;
	position: relative;
	z-index: 20;
	-webkit-user-select: text;
	-moz-user-select: text;
	-khtml-user-select: text;
	-ms-user-select: text
}

.logobas {
	width: 253px;
	height: auto;
	display: block;
	position: relative;
	margin-left: 9%;
	float: left
}

.logobas img {
	width: 100%;
	display: block
}

.bascontact {
	display: inline-block;
	float: left;
	margin-left: 1.8%;
	border-left: 2px solid #262d38;
	padding-left: 2.5%
}

.basreseaux {
	display: inline-block
}

.basreseaux li {
	margin-right: 1.3em;
	display: inline-block;
	float: left
}

.basreseaux a {
	width: 2.9em;
	height: auto;
	border-radius: 50%;
	display: block;
	border: 1px solid #4e535c;
	transform-origin: 50% 50%
}

.basreseaux a img {
	width: 100%;
	display: block;
	transform-origin: 50% 50%;
}

.basreseaux .ret {
	clear: both;
	width: 0;
	height: 0;
	line-height: 0;
	margin: 0;
	padding: 0;
	float: none
}

.bascoord {
	display: inline-block;
	padding-top: 2.5em
}

.bascoord li {
	display: block;
	padding-bottom: 0.9em
}

.bascoord li a,
.bascoord li span {
	color: #bfc0c0;
	font-size: 1.2em;
	font-weight: 300;
	line-height: 1.6em;
	letter-spacing: 0.06em;
	display: inline-block
}

.basD {
	width: 46%;
	padding-left: 4%;
	float: right;
	background-color: #080a0e;
	padding-bottom: 5em
}

#basacces {
	display: block
}

#basacces li {
	display: block;
	margin-bottom: 2em
}

#basacces li a {
	display: inline-block;
	font-size: 1.65em;
	letter-spacing: 0.05em;
	color: #fff;
	font-weight: 300;
	position: relative;
	padding-left: 1.35em;
	line-height: 1.4em
}

#basacces li a span {
	position: relative;
	display: inline-block;
	padding: 0.3em 0
}

#basacces li a span i {
	position: absolute;
	display: block;
	left: 0;
	bottom: 0.1em;
	height: 3px;
	background-color: #FFEC00;
	width: 100%;
	transform-origin: 0 0
}

#basacces li a img {
	position: absolute;
	top: 0.8em;
	width: 0.6em;
	left: 0;
	transform-origin: 50% 50%
}

#basliste {
	position: relative;
	margin-top: 15em;
	font-size: 0.95em;
	letter-spacing: 0.025em;
	display: block
}

#basliste li {
	display: inline-block;
	float: left;
	padding-right: 1.3em
}

#basliste li span,
#basliste li a {
	color: #bfbfbf;
	font-weight: 400;
	line-height: 1.8em;
	padding: 0.4em 0 0.4em 0;
	position: relative;
	display: inline-block;
}

#basliste .ret,
#basliste .retMob {
	clear: both;
	width: 0;
	height: 0;
	line-height: 0;
	margin: 0;
	padding: 0;
	float: none;
	display: block
}


#demande {
	background-color: #fff
}

.demandeG {
	width: 50%;
	float: left;
	background-color: #192b2a;
	position: relative
}

.demandeGint {
	width: 100%;
	height: 100%;
	position: relative;
	overflow: hidden;
	z-index: 9
}

.demandeG .cal {
	z-index: 9
}

.demandeG h3 {
	color: #fff;
	font-size: 3.2em;
	font-weight: 500;
	line-height: 1.4em;
	display: inline-block;
	position: absolute;
	top: 2em;
	left: 34%;
	z-index: 12
}

.Dnoir {
	width: 20%;
	position: absolute;
	top: 0;
	left: 24%;
	background-color: #000000;
	z-index: 11;
	transform-origin: 0 0
}

.Dbleu {
	width: 20%;
	position: absolute;
	top: 0;
	left: 4%;
	background-color: #FFEC00;
	z-index: 11;
	transform-origin: 100% 100%
}

.Dbleu2 {
	width: 20%;
	position: absolute;
	top: 0;
	left: 24%;
	background-color: #FFEC00;
	z-index: 11;
	transform-origin: 0 0
}

.demandeD {
	width: 50%;
	float: right;
	background-color: #0a2023;
	position: relative;
	overflow: hidden;
	z-index: 10
}

.demandeDint {
	float: left;
	display: block;
	position: relative;
	z-index: 10;
	width: 516px;
	margin-left: 9%;
	background-color: #ffffff;
	border-radius: 6px;
	margin-top: 8em;
	margin-bottom: 10em;
	padding-top: 1.8em
}

.demandeD .cal {
	z-index: 9
}

.H #demande {
	visibility: hidden
}


#formulaire ::-webkit-input-placeholder {
	color: #000000;
}

#formulaire :-moz-placeholder {
	color: #000000;
	opacity: 1;
}

#formulaire ::-moz-placeholder {
	color: #000000;
	opacity: 1;
}

#formulaire :-ms-input-placeholder {
	color: #000000;
}

#formulaire ::-ms-input-placeholder {
	color: #000000;
}

#formulaire ::placeholder {
	color: #000000;
}

#formulaire .titreformulaire {
	color: #FFEC00;
	font-size: 1.1em;
	font-weight: 300;
	padding: 1.3em 0 0 0;
	display: block;
	letter-spacing: 0.04em
}

#formulaire .titreformulaire strong {
	display: inline-block;
	font-size: 1em;
	letter-spacing: 0.05em;
	font-weight: 500
}

#formulaire {
	display: block;
	text-align: left;
	margin: 0 auto 0 auto;
	padding-bottom: 6em;
	padding-top: 0.5em;
	width: 80%;
	font-size: 1em;
	font-family: 'EF', sans-serif;
	font-weight: 400;
	letter-spacing: 0.04em;
	-webkit-user-select: text;
	-moz-user-select: text;
	-khtml-user-select: text;
	-ms-user-select: text
}

#formulaire .fromlong {
	width: 100%;
	float: none;
	margin: 0.6em 0 0 0;
	padding: 0;
	display: block
}

#formulaire input.text {
	color: #000;
	font-size: 1em;
	border: none;
	padding: 0.4em 0;
	font-family: 'EF', sans-serif;
	font-weight: 300;
	border-bottom: 1px solid #000;
	background: none;
	border-radius: 0;
	letter-spacing: 0.07em
}

#formulaire input.text:hover {
	color: #FFEC00;
	background-color: rgba(255, 255, 255, 1);
	border-bottom: 1px solid #FFEC00;
}

#formulaire .minimargeH {
	margin-top: 0.5em
}

#formulaire .check {
	display: block;
	position: relative;
	width: 100%;
	margin-bottom: 0.2em;
	-webkit-user-select: none;
	-moz-user-select: none;
	-khtml-user-select: none;
	-ms-user-select: none;
}

#formulaire .labcheckbox {
	display: block;
	font-size: 0.95em;
	font-weight: 500;
	color: #000000;
	cursor: pointer;
	float: left;
	padding-left: 35px;
	padding-bottom: 0.4em;
	line-height: 1.4em;
	padding-top: 0.4em
}

#formulaire .labcheckbox2 {
	display: block;
	font-size: 0.9em;
	font-weight: 300;
	color: #000000;
	cursor: pointer;
	float: left;
	padding-left: 30px;
	padding-bottom: 0.4em;
	line-height: 1.4em;
	padding-top: 0.3em
}

.labcheckbox2 a {
	color: #3E3E3E;
	text-decoration: underline
}

.labcheckbox2 a:hover {
	text-decoration: none
}

#formulaire input.box {
	accent-color: #000;
	width: 22px;
	height: 22px;
	display: inline-block;
	position: absolute;
	top: 2px;
	left: 0;
	cursor: pointer
}

#formulaire input.box2 {
	accent-color: #000;
	width: 18px;
	height: 18px;
	display: inline-block;
	position: absolute;
	top: 2px;
	left: 0;
	cursor: pointer
}

#formulaire input.box:checked,
#formulaire input.box2:checked {
	accent-color: #000
}

#formulaire .labcheckbox:hover,
#formulaire .labcheckbox2:hover {
	color: #FFEC00;
}

#envoyer {
	color: #fff;
	text-transform: uppercase;
	background-color: #000000;
	border-radius: 8px;
	display: block;
	border: none;
	padding: 0.9em 0 0.9em 14%;
	width: 100%;
	font-size: 1.1em;
	background-image: url(../images/trait.gif);
	background-repeat: no-repeat;
	background-position: 6% 50%;
	background-size: 5%;
	line-height: 1.2em;
	letter-spacing: 0.2em;
	margin: 2.2em 0 1.3em 0;
	cursor: pointer;
	text-align: left;
	font-weight: 400;
	font-family: 'EF', sans-serif;
}


#message-requete {
	font-family: 'EF', sans-serif;
	margin: 0;
	letter-spacing: 0.02em;
	font-size: 1.3em;
	position: fixed;
	top: 50px;
	left: 50%;
	margin-left: -300px;
	width: 500px;
	z-index: 9999;
	background-color: #fff;
	padding: 50px;
	border-radius: 12px;
	display: none;
	position: fixed;
	color: #0d2243;
	cursor: pointer;
	background-image: url(../images/croix.png);
	background-size: 30px;
	background-position: 96% 20px;
	background-repeat: no-repeat
}

#message-requete h3 {
	color: #000;
	font-weight: 500;
	padding-bottom: 10px;
	font-size: 1.1em;
	line-height: 1.6em
}

#message-requete ul {
	margin: 10px 0 10px 0;
	padding: 0;
	list-style: none
}

#message-requete ul li {
	list-style: none;
	padding: 0.4em 4px 0.4em 2em;
	font-size: 0.8em;
	margin: 1px 0 0 0;
	display: block;
	width: auto
}

#message-requete .message-ok {
	background-image: url(../images/valide.png);
	background-repeat: no-repeat;
	background-position: 5px 50%;
	background-size: 1em;
	font-size: 0.9em;
	font-weight: 600
}

#message-requete .message-erreur {
	background-image: url(../images/erreur.png);
	background-repeat: no-repeat;
	background-position: 5px 50%;
	background-size: 1em
}

#fondmessage {
	background-color: #262727;
	z-index: 9998;
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	display: none
}



#introContact {
	width: 100%;
	position: relative;
	z-index: 10;
	-webkit-user-select: text;
	-moz-user-select: text;
	-khtml-user-select: text;
	-ms-user-select: text
}

#introContactG {
	display: block;
	width: 50%;
	float: left;
	height: auto;
	overflow: hidden;
	position: relative;
	background-color: #162530
}

#introContactG .contactInfos {
	z-index: 11;
	position: relative;
	margin-left: 18%;
	padding-top: 6.5em;
	color: #fff;
	padding-bottom: 6em
}

#introContactG .contactFond {
	z-index: 10
}

.contactInfos h1 {
	color: #fff;
	font-size: 2.65em;
	letter-spacing: 0.04em;
	line-height: 1.4em;
	font-weight: 300;
	display: block
}

.contactInfos .coordonnees {
	margin-bottom: 3em;
	padding-top: 2.7em
}

.coordonnees li {
	margin-bottom: 0.1em
}

.coordonnees li a {
	display: inline-block;
	padding: 0.4em 0 0.5em 1.5em;
	position: relative;
	color: #fff;
	font-size: 1.3em;
	letter-spacing: 0.04em;
	line-height: 1.5em;
	font-weight: 300
}

.coordonnees li a img {
	position: absolute;
	top: 0.8em;
	left: 0;
	width: 0.6em
}

.contactInfos p {
	color: #fff;
	font-size: 1.1em;
	line-height: 1.6em;
	padding-top: 2.7em;
	display: block;
	width: 90%;
	max-width: 500px
}

.contactInfos p a {
	color: #fff;
	text-decoration: underline
}

.contactInfos p a:hover {
	color: #e77310;
	text-decoration: none
}

#introContactD {
	width: 50%;
	float: right;
	position: relative;
	color: #000;
	background-color: #f5f7f7
}

#introContactDint {
	margin-left: 7.5%;
	padding-top: 6.5em;
	position: relative;
	z-index: 9
}

#introContactD h2 {
	color: #000;
	font-size: 2.65em;
	letter-spacing: 0.04em;
	line-height: 1.4em;
	font-weight: 300;
	display: block
}

#introContactD h2 .mini {
	font-size: 0.75em
}

#formulaire2 ::-webkit-input-placeholder {
	color: #000;
}

#formulaire2 :-moz-placeholder {
	color: #000;
	opacity: 1;
}

#formulaire2 ::-moz-placeholder {
	color: #000;
	opacity: 1;
}

#formulaire2 :-ms-input-placeholder {
	color: #000;
}

#formulaire2 ::-ms-input-placeholder {
	color: #000;
}

#formulaire2 ::placeholder {
	color: #000;
}

#formulaire2 .titreformulaire {
	color: #000;
	font-size: 1.1em;
	font-weight: 400;
	padding: 1.8em 0 0 0;
	display: block;
	letter-spacing: 0.04em
}

#formulaire2 .titreformulaire strong {
	display: inline-block;
	font-size: 1em;
	letter-spacing: 0.05em;
	font-weight: 500
}

#formulaire2 {
	display: block;
	text-align: left;
	margin: 0;
	padding-bottom: 6em;
	padding-top: 1.8em;
	width: 630px;
	font-size: 1em;
	font-family: 'EF', sans-serif;
	font-weight: 400;
	letter-spacing: 0.04em;
	-webkit-user-select: text;
	-moz-user-select: text;
	-khtml-user-select: text;
	-ms-user-select: text
}

#formulaire2 .formgauche {
	width: 47%;
	float: left;
	margin: 0.6em 0 0 0;
	display: block
}

#formulaire2 .formdroite {
	width: 47%;
	float: left;
	margin: 0.6em 0 0 6%;
	display: block
}

#formulaire2 .fromlong {
	width: 100%;
	float: none;
	margin: 0.6em 0 0 0;
	padding: 0;
	display: block
}

#formulaire2 input.text {
	color: #000;
	font-size: 1.15em;
	border: none;
	padding: 0.4em 0 0.2em 0;
	font-family: 'EF', sans-serif;
	font-weight: 300;
	border-bottom: 1px solid #5f5e5e;
	background: none;
	border-radius: 0;
	letter-spacing: 0.025em
}

#formulaire2 input.text:hover {
	color: #000;
	background-color: rgba(255, 255, 255, 1);
	border-bottom: 1px solid #000;
}

#formulaire2 textarea {
	margin: 1.2em 0 0 0;
	height: 9em;
	color: #000;
	border: none;
	padding: 1em 4% 0.8em 4%;
	background-color: rgba(255, 255, 255, 1);
	width: 92%;
	border-radius: 20px;
	font-size: 1.15em;
	font-family: 'EF', sans-serif;
	font-weight: 300;
	line-height: 1.6em
}

#formulaire2 textarea:hover {
	color: #000;
	background-color: rgba(255, 255, 255, 0.9);
}

#formulaire2 .check {
	display: block;
	position: relative;
	width: 100%;
	margin-bottom: 0.2em;
	-webkit-user-select: none;
	-moz-user-select: none;
	-khtml-user-select: none;
	-ms-user-select: none;
}

#formulaire2 .labcheckbox2 {
	display: block;
	font-size: 1em;
	font-weight: 300;
	color: #000000;
	cursor: pointer;
	float: left;
	padding-left: 36px;
	padding-bottom: 0.4em;
	line-height: 1.4em;
	padding-top: 0.2em
}

.labcheckbox2 a {
	color: #3E3E3E;
	text-decoration: underline
}

.labcheckbox2 a:hover {
	text-decoration: none
}

#formulaire2 input.box2 {
	accent-color: #000;
	width: 20px;
	height: 20px;
	display: inline-block;
	position: absolute;
	top: 2px;
	left: 0;
	cursor: pointer
}

#formulaire2 .minimargeH {
	margin-top: 0.9em
}

#formulaire2 .labcheckbox {
	display: block;
	font-size: 1.05em;
	font-weight: 400;
	color: #000000;
	cursor: pointer;
	float: left;
	padding-left: 35px;
	padding-bottom: 0.4em;
	line-height: 1.4em;
	padding-top: 0.3em
}

#formulaire2 input.box {
	accent-color: #000;
	width: 22px;
	height: 22px;
	display: inline-block;
	position: absolute;
	top: 2px;
	left: 0;
	cursor: pointer
}

#formulaire2 input.box:checked,
#formulaire2 input.box2:checked {
	accent-color: #000
}

#formulaire2 .labcheckbox:hover,
#formulaire2 .labcheckbox2:hover {
	color: #2b312f;
}

#formulaire2 .envoyerreduit {
	width: 75%
}

.H #introContactG,
.H #introContactD {
	visibility: hidden
}


#equipe {
	padding-top: 5.5em;
	padding-bottom: 5em
}

#equipe li .p {
	display: block;
	width: 100%;
	position: relative
}

#equipe li .p img {
	display: block;
	width: 100%;
	position: relative;
	z-index: 1
}

#equipe li .p div {}

.H #equipe li .p div {
	height: 100%;
	width: 100%;
	position: absolute;
	z-index: 2;
	top: 0;
	left: 0;
	background-color: #FFEC00;
	color: #fff;
	display: none
}

#equipe li .p div span {
	font-size: 1em;
	letter-spacing: 0.05em;
	font-weight: 400;
	display: block;
	line-height: 1.6em;
	padding-top: 20px;
	padding-left: 25px;
	margin-right: 25px;
	cursor: default
}

#equipe li .p div strong {
	font-size: 0.8em;
	letter-spacing: 0.04em;
	font-weight: 300;
	display: inline-block;
	line-height: 1.6em;
	position: relative;
	margin-left: 25px;
	padding-top: 1.2em;
	margin-top: 0.9em;
	margin-right: 25px;
	cursor: default
}

#equipe li .p div strong i {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 1px;
	background-color: #fff;
	z-index: 5;
	transform-origin: 0 0
}

#equipe li.membre {
	width: 18%;
	float: left;
	margin-right: 1%;
	margin-left: 1%
}

#equipe li.ret {
	width: 0;
	float: none;
	margin: 0;
	clear: both
}

#equipe li.ret2 {
	display: none
}

.H #equipe li .p {
	visibility: hidden
}






@media screen and (max-width: 768px) {
	.gallery .gallery-item {
		width: calc(50% - 20px) !important;
	}
}


@media screen and (max-height:730px),
screen and (max-width: 1750px) {
	.H #load {
		width: 40px;
		/*height:10px*/
		margin-top: -5px;
		margin-left: -20px;
	}

	body {
		font-size: 0.8em
	}

	#logo {
		width: 202px;
		top: 25px
	}

	.H #menu {
		padding-top: 25px;
		border-bottom-left-radius: 8px;
	}

	#menu li .am {
		padding: 1em 0.9em 0.6em 0.9em
	}

	#menu li .cadre {
		margin-left: 1.1em
	}

	#animAC2 {
		width: 400px
	}

	#dok00 {
		width: 288px
	}

	#introdefileInt {
		min-height: 180px
	}

	#introdefilecontenu {
		margin-right: 95px
	}

	#defileFleches {
		width: 90px
	}

	#defileSuivant {
		width: 90px;
		height: 90px
	}

	#defilePrecedent {
		width: 90px;
		height: 90px
	}

	#ronddefile {
		height: 4px
	}

	.listedomaine li b {
		right: 1.2em;
		width: 32px;
		height: 32px
	}

	.listedomaine li b img {
		width: 64px
	}

	.logobas {
		width: 202px
	}

	#basacces li a span i {
		height: 2px
	}

	#logonav {
		top: 25px;
		width: 202px
	}

	.retour {
		width: 56px;
		height: 56px;
		top: 20px;
		margin-left: -28px
	}

	.navD1 {
		margin-top: 10em
	}

	.navD2 {
		margin-top: 10em
	}

	/* .decale01 {margin-left: 23%} */
	.par01 {
		float: left;
		width: 45%;
		margin-left: 0%;
		margin-top: 3.2em
	}

	.decale02 {
		margin-left: 27%;
		margin-right: 9%
	}

	.titreInt05bis {
		padding-left: 40px
	}

	.extInt01 .ppadd50 {
		padding-left: 40px
	}

	.demandeDint {
		width: 412px
	}

	#formulaire .labcheckbox {
		padding-left: 28px;
		padding-top: 0.4em
	}

	#formulaire .labcheckbox2 {
		padding-left: 24px;
		padding-top: 0.4em
	}

	#formulaire input.box {
		width: 18px;
		height: 18px
	}

	#formulaire input.box2 {
		width: 16px;
		height: 16px
	}

	#message-requete {
		top: 40px;
		margin-left: -240px;
		width: 400px;
		padding: 40px;
		background-size: 26px;
		background-position: 96% 16px
	}

	#message-requete h3 {
		padding-bottom: 8px
	}

	#message-requete ul {
		margin: 8px 0 8px 0
	}

	#formulaire2 {
		width: 504px
	}

	#formulaire2 .labcheckbox2 {
		padding-left: 29px;
		padding-top: 0.3em;
	}

	#formulaire2 input.box2 {
		width: 16px;
		height: 16px
	}

	#formulaire2 .labcheckbox {
		padding-left: 30px;
		padding-top: 0.3em
	}

	#formulaire2 input.box {
		width: 18px;
		height: 18px
	}


	#remonte {
		width: 37px;
		height: 37px
	}

	#remonte img {
		width: 16px;
		margin-left: -8px;
		margin-top: -8px
	}

	#logoHaut {
		width: 44px;
		top: 13px;
		left: 13px
	}

	#equipe li .p div span {
		padding-top: 20px;
		padding-left: 20px
	}

	#equipe li .p div strong {
		margin-left: 20px
	}

}







@media screen and (max-height:570px),
screen and (max-width:1320px) {
	body {
		font-size: 0.72em
	}

	#logo {
		width: 182px;
		top: 22px;
		left: 7%
	}

	.H #menu {
		padding-top: 22px
	}

	#menu li .am {
		font-size: 1.05em;
	}

	#menu li .cadre {
		margin-left: 1em;
	}

	.ext1 {
		width: 86%
	}

	.listedomaine,
	.servicesPlus,
	.citation {
		font-size: 0.9em
	}

	.listedomaine li b {
		bottom: 1.6em;
		right: 1.3em;
		width: 28px;
		height: 28px
	}

	.listedomaine li b img {
		width: 54px
	}

	#logonav {
		top: 22px;
		width: 182px;
		left: 7%
	}

	.retour {
		width: 50px;
		height: 50px;
		top: 18px;
		margin-left: -25px
	}

	.navD1 {
		margin-top: 9em
	}

	.navD2 {
		margin-top: 9em
	}

	.navD1 a {
		font-size: 1.45em;
		line-height: 1.5em;
		letter-spacing: 0.04em;
	}

	.navD2 a {
		font-size: 1.1em;
		line-height: 1.5em;
		letter-spacing: 0.02em;
	}

	#animAC2 {
		width: 360px
	}

	#dok00 {
		width: 259px
	}

	#introintAC1 {
		margin-left: 7%;
		font-size: 0.9em
	}

	#introint {
		margin-left: 7%;
		font-size: 0.9em
	}

	#introdefilecontenu {
		display: block;
		padding: 1.5em 0 0.8em 2em
	}

	#introdefile h2 {
		font-size: 1.15em
	}

	#introdefile p {
		font-size: 1.3em
	}

	#introdefileInt {
		min-height: 144px
	}

	#introdefilecontenu {
		margin-right: 78px
	}

	#defileFleches {
		width: 72px
	}

	#defileSuivant {
		width: 72px;
		height: 72px
	}

	#defilePrecedent {
		width: 72px;
		height: 72px
	}

	#ronddefile {
		height: 3px
	}

	.bandeauG {
		width: 36%;
		padding-left: 7%;
		padding-right: 5%;
		/* ext1 86% */
	}

	.bandeauG .margeBas01 {
		margin-bottom: 4em
	}

	.bandeauG .margeBas02 {
		margin-bottom: 1.5em
	}

	.bandeauD {
		padding-bottom: 21em;
		padding-top: 7em
	}

	#mosaique .bt5 {
		font-size: 1.3em
	}

	#introBlancint {
		width: 86%;
		padding-top: 11em;
		padding-bottom: 5em
	}

	.traitbleuintro {
		top: 12em;
		left: 7%
	}

	#introBlanccontact {
		padding-top: 10em
	}

	.titreInt05bis {
		padding-left: 30px
	}

	.extInt01 .ppadd50 {
		padding-left: 30px
	}

	.logobas {
		width: 182px;
		margin-left: 7%
	}

	.demandeDint {
		width: 370px
	}

	#formulaire .labcheckbox {
		padding-left: 26px;
		padding-top: 0.5em
	}

	#formulaire .labcheckbox2 {
		padding-left: 22px;
		padding-top: 0.5em
	}

	#formulaire input.box {
		width: 16px;
		height: 16px
	}

	#formulaire input.box2 {
		width: 14px;
		height: 14px
	}

	#introContactG .contactInfos {
		margin-left: 14%
	}

	#formulaire2 {
		width: 453px
	}

	#formulaire2 .labcheckbox2 {
		padding-top: 0.4em;
	}

	#formulaire2 .labcheckbox {
		padding-left: 26px;
		padding-top: 0.45em
	}

	#formulaire2 input.box {
		width: 16px;
		height: 16px
	}

	#logoHaut {
		width: 39px;
		top: 11px;
		left: 11px
	}

	#equipe li .p div span {
		padding-top: 15px;
		padding-left: 15px;
		font-size: 0.9em;
	}

	#equipe li .p div strong {
		margin-left: 15px;
		font-size: 0.7em;
	}
}



@media screen and (max-height:460px),
screen and (max-width:1140px) {
	#MOB2 {
		display: block
	}

	#logo {
		left: 5%
	}

	#menu li .am {
		font-size: 1em;
	}

	#menu li .cadre {
		margin-left: 1em
	}

	.ext1 {
		width: 90%
	}

	.listedomaine li b {
		bottom: 1.7em;
		right: 1.1em;
		width: 25px;
		height: 25px
	}

	.listedomaine li b img {
		width: 50px
	}

	#logonav {
		left: 5%
	}

	.retour {
		left: 30%
	}

	#navG {
		width: 30%
	}

	#navD {
		width: 70%;
		font-size: 0.9em
	}

	.navD1 {
		margin-top: 9em
	}

	.navD2 {
		margin-top: 9em
	}

	#contactRapideNav {
		width: 70%;
		font-size: 0.8em
	}

	#introintAC1 {
		margin-left: 5%;
		font-size: 0.8em
	}

	#introint {
		margin-left: 5%;
		font-size: 0.9em
	}

	#introdefile {
		font-size: 0.9em
	}

	#introdefile h2 {
		font-size: 1.2em;
		display: block
	}

	#introdefile p {
		font-size: 1.3em;
	}

	#introdefileInt {
		min-height: 132px
	}

	#introdefilecontenu {
		margin-right: 70px
	}

	#defileFleches {
		width: 66px
	}

	#defileSuivant {
		width: 66px;
		height: 66px
	}

	#defilePrecedent {
		width: 66px;
		height: 66px
	}

	.bandeauG {
		width: 40%;
		padding-left: 5%;
		padding-right: 5%;
		/* ext1 90% */
	}

	#mosaique .bt5 {
		font-size: 1.2em
	}

	#mosaiqueD strong {
		font-size: 4.1em
	}

	.decale01 {
		margin-left: 20%
	}

	.par01 {
		float: left;
		width: 45%;
		margin-left: 0%;
	}

	.decale02 {
		margin-left: 25%;
		margin-right: 5%
	}

	.servicesPlusInt {
		width: 62%
	}

	#visuCarresExt strong {
		font-size: 5.3em
	}

	#introBlancint {
		width: 90%;
		padding-top: 11em;
	}

	.traitbleuintro {
		top: 11.5em;
		left: 5%
	}

	#introBlanc h2 {
		font-size: 3.2em
	}

	#introBlanc h2.plusfort {
		font-size: 2.8em
	}

	#introBlanc h2 .mini2 {
		font-size: 0.3em
	}


	#introBlanccontact {
		padding-top: 9em
	}

	.logobas {
		margin-left: 5%
	}

	.bascontact {
		margin-left: 1.8%;
		padding-left: 2%
	}

	.bascoord li a,
	.bascoord li span {
		font-size: 1.15em;
		letter-spacing: 0.04em
	}

	#introContactG {
		width: 40%
	}

	#introContactG .contactInfos {
		margin-left: 10%
	}

	#introContactD {
		width: 60%
	}

	#logoHaut {
		width: 35px;
		top: 8px;
		left: 8px
	}

	#equipe li .p div span {
		padding-top: 15px;
		padding-left: 15px;
	}

	#equipe li .p div strong {
		margin-left: 15px;
	}
}



@media screen and (max-height:400px),
screen and (max-width:980px) {

	/*@media screen and (max-width:980px) {*/
	#MOB2 {
		display: none
	}

	#MOB {
		display: block
	}

	.retMob {
		display: block;
		clear: both;
		width: 0;
		height: 0;
		line-height: 0;
		margin: 0;
		padding: 0;
		float: none
	}

	#logoHaut {
		display: none
	}

	#btmenu {
		display: block;
		position: fixed;
		top: 20px;
		right: 7%;
		width: 50px;
		height: 50px;
		z-index: 950;
		transform-origin: 50% 50%;
		cursor: pointer;
		background-color: rgba(255, 255, 255, 0.9)
	}

	#b1,
	#b2,
	#b3 {
		width: 22px;
		height: 2px;
		background-color: #141c25;
		position: relative;
		margin-left: auto;
		margin-right: auto;
		display: block;
		transform-origin: 0 0
	}

	#b1 {
		margin-top: 17px
	}

	#b2 {
		margin-top: 5px
	}

	#b3 {
		margin-top: 5px
	}

	.H #btmenu,
	.H #btmenu i {
		visibility: hidden
	}

	#logo {
		left: 6.6%
	}

	.H #menu {
		position: relative;
		right: 0;
		top: 0;
		border-bottom-left-radius: 0;
		padding-right: 0;
		padding-top: 100px;
		padding-left: 6.6%
	}

	#menu li {
		display: block;
		float: none;
		margin: 0;
		padding: 0
	}

	#menu li .am {
		padding: 0.2em 0 0.2em 0;
		font-size: 2.4em;
		margin: 0
	}

	#menu span {
		padding-bottom: 0.4em
	}

	#menu .ret {
		display: block;
		width: 0;
		float: none;
		margin: 0;
		padding: 0;
		clear: both;
		height: 0;
		line-height: 0
	}

	#menu li .cadre {
		margin-left: 0;
		margin-top: 0.9em;
		margin-bottom: 0em;
		padding: 1em 1.5em 0.6em 1.5em;
		font-size: 1.6em
	}

	#menu li .mactif {
		color: #FFEC00
	}


	#navigation {
		width: 100%;
		height: auto;
		position: relative;
		left: 0;
		background-color: #141c25
	}

	.H #navigation {
		width: 100%;
		height: 100%;
		position: fixed;
		left: 0;
		top: 0;
		z-index: 900;
		overflow: scroll;
		display: none
	}

	#logonav {
		left: 6.6%;
		display: none;
		z-index: 900
	}

	.H #logonav {
		display: block
	}

	.retour,
	#navG {
		display: none
	}

	#navD {
		float: none;
		width: 100%;
		height: auto;
		overflow: visible;
		position: relative
	}

	.H #navD,
	#fondnavD {
		display: none
	}

	#navDA,
	#navDB,
	#navDC,
	#navDD {
		position: relative;
		z-index: 201
	}

	.H #navDA,
	.H #navDB,
	.H #navDC,
	.H #navDD {
		display: none
	}

	.navD1 {
		float: none;
		width: 95%;
		margin-top: 1.5em;
		margin-bottom: 1.5em;
		padding-left: 5%;
		position: relative;
		z-index: 201
	}

	.navD1 ul {
		display: block;
		padding-top: 0.5em
	}

	.navD1 ul li {
		display: block
	}

	.navD1 a {
		display: inline-block;
		font-size: 1.8em;
		color: #fff;
		line-height: 1.5em;
		padding: 0.2em 0;
		letter-spacing: 0.03em;
		font-weight: 400;
		position: relative;
		overflow: hidden
	}

	.navD2 {
		float: none;
		width: 95%;
		margin-top: 0.5em;
		margin-bottom: 3em;
		padding-left: 5%;
		position: relative;
		z-index: 201
	}

	.navD2 ul {
		display: block;
		padding-top: 0.5em
	}

	.navD2 ul li {
		display: block
	}

	.navD2 a {
		font-size: 1.3em;
		line-height: 1.5em;
		padding: 0.2em 0;
		letter-spacing: 0.03em
	}

	.navD2 .traitnav {
		display: none
	}

	.navD1 strong,
	.navD2 strong {
		color: #87898c;
		position: relative;
		display: inline-block;
		font-weight: 400;
		margin-bottom: 0em
	}

	.titreminiICO {
		position: relative;
		padding-left: 2.8em;
		text-transform: uppercase;
		font-size: 1em;
		letter-spacing: 0.16em;
		display: inline-block;
		line-height: 1.4em;
		padding-top: 0.4em;
		padding-bottom: 0.4em
	}

	.titreminiICO img {
		width: 1.6em;
		position: absolute;
		top: 50%;
		margin-top: -0.8em;
		left: 0
	}

	.navD1 .mNAVactif {
		color: #FFEC00
	}

	.navD1 .mNAVactif i {
		width: 100%;
		background-color: #FFEC00
	}

	.navD2 .mNAVactif {
		color: #FFEC00
	}

	.navD2 .mNAVactif i {
		width: 100%;
		background-color: #FFEC00
	}

	#contactRapideNav {
		width: 100%
	}

	.H #contactRapideNav {
		display: none
	}

	.traitnav {
		display: none
	}

	#navigation #basliste {
		padding-left: 6.6%;
		margin-top: 4em;
		padding-bottom: 5em
	}

	.H #navigation #basliste {
		visibility: hidden
	}

	#intro,
	.H #intro {
		min-height: 500px
	}

	#introdefile {
		min-width: 450px
	}

	.margeH17 {
		margin-top: 9em
	}

	.ext1 {
		width: 86.8%
	}

	.ext2 {
		width: 80%
	}

	.titre02 {
		font-size: 1.4em
	}

	.titre02 br {
		display: none
	}

	.titre04 {
		font-size: 1.4em
	}


	.listedomaine .ret {
		display: none
	}

	.listedomaine .retMob {
		clear: both;
		width: 0;
		height: 0;
		line-height: 0;
		margin: 0;
		padding: 0;
		float: none;
		display: block
	}

	.listedomaine .listeP1,
	.listedomaine .listeP2,
	.listedomaine .listeP3,
	.listedomaine .listeP3 {
		width: 100%;
		margin-right: 0;
		margin-left: 0;
		height: 250px;
		margin-bottom: 15px
	}

	.listedomaine .listePSEUL {
		margin-bottom: 15px;
		width: 100% !important;
		height: 250px;
		margin-right: 0;
		font-size: 1em;
		display: flex;
		align-items: center;
		/*display: none*/
	}


	.listedomaine .listePSEUL span,
	.listedomaine .listePSEUL2 span {
		text-align: left;
		font-size: 1.4em;
		/* position: absolute; */
		bottom: 2.2em;
		padding-left: 2rem;
		padding-right: 2rem;
	}

	.listedomaine .listePSEUL2 {
		margin-bottom: 15px;
		width: 100%;
		height: 250px;
		margin-right: 0;
		font-size: 1em;
		/*display: none*/
	}

	.listedomaine li .nom {
		bottom: 2em;
		font-size: 1.8em
	}

	.listedomaine li .nomv2 {
		bottom: 2em;
		font-size: 1.8em
	}

	.listedomaine li b {
		bottom: 1.8em;
		right: 1.8em;
		font-size: 1.8em;
		width: 32px;
		height: 32px
	}

	.listedomaine li b img {
		width: 64px
	}


	.servicesPlus {
		width: 58%;
		padding-left: 0
	}

	.citation {
		width: 35%;
		margin-right: 0
	}

	.bandeauG {
		width: 39.4%;
		padding-left: 6.6%;
		padding-right: 4%;
		/* ext1 86.8% */
	}

	#mosaique {
		position: relative;
		margin-top: 5em
	}

	#mosaiqueG {
		width: 100%;
		float: none
	}

	#mosaiqueD {
		width: 100%;
		float: none
	}

	#mosaiqueD strong {
		font-size: 5em;
		right: 30%;
	}

	#mosaique .bt5 {
		left: 40%;
		margin-left: 0;
		font-size: 1.2em;
	}


	.titreInt02,
	.titreInt04 {
		font-size: 2em
	}

	.titreInt03,
	.titreInt05 {
		font-size: 1.8em
	}

	.titreInt04 br {
		display: none
	}

	.titreInt05bis {
		font-size: 1.8em;
		padding-left: 20px
	}

	.extInt01 .ppadd50 {
		padding-left: 20px
	}

	.titreInt06 {
		font-size: 1.4em
	}

	.surligne i {
		height: 1px
	}

	.extInt01 {
		width: 100%
	}

	.decale01 {
		margin-left: 8%
	}

	.par01 {
		width: 46%;
		margin-left: 0%
	}

	.decale02 {
		margin-left: 8%;
		margin-right: 5%
	}

	.extInt01 p {
		font-size: 1.15em
	}

	.extInt01 li {
		font-size: 1.15em
	}

	.extInt01 p strong i {
		height: 1px
	}

	.visuCarres {
		height: 420px
	}

	#visuCarresExt strong {
		font-size: 5.2em
	}

	.partG {
		width: 47%;
		float: left
	}

	.partD {
		width: 47%;
		float: right
	}

	.servicesPlusInt {
		width: 70%
	}

	.ressources {
		font-size: 0.9em
	}

	.services {
		display: block;
		margin-top: 5em
	}

	.services li {
		width: 100%;
		margin-right: 0%;
		margin-left: 0%;
		float: none;
		margin-bottom: 0
	}

	.margeBservices {
		margin-bottom: 0em
	}

	.services li a {
		width: 48%;
		margin-left: 1%;
		margin-right: 1%;
		float: left
	}

	.services li span {
		font-size: 1.7em
	}

	.services li b {
		width: 48%;
		margin-left: 1%;
		margin-right: 1%;
		float: left
	}

	.services .ret {
		clear: both;
		width: 0;
		height: 0;
		line-height: 0;
		margin: 0;
		padding: 0;
		float: none;
		display: block
	}

	.listeE li a .colE1 {
		width: 90%;
		margin-left: 3%;
		padding-bottom: 0.7em;
	}

	.listeE li a .colE2 {
		width: 30%;
		margin-left: 3%;
	}

	.listeE li a .colE3 {
		width: 60%;
		margin-left: 1%;
	}


	#introBlancint {
		width: 86.8%;
	}

	.traitbleuintro {
		left: 6.6%
	}

	.logobas {
		margin-left: 6.6%
	}

	.bascontact {
		margin-left: 10%;
		padding-left: 5%
	}

	.bascoord li {
		padding-bottom: 0.7em
	}

	.bascoord li a,
	.bascoord li span {
		font-size: 1.2em;
		letter-spacing: 0.06em
	}

	.basD {
		width: 93.4%;
		padding-left: 6.6%;
		padding-bottom: 4em;
		margin-top: 3em
	}

	#basacces li {
		margin-bottom: 1.5em
	}

	#basliste {
		margin-top: 5em;
		font-size: 1em
	}

	#demande {
		background-color: #fff
	}

	.demandeG {
		width: 100%;
		float: none;
		height: 500px
	}

	.demandeGint {}

	.demandeG h3 {
		color: #fff;
		font-size: 4em;
		font-weight: 500;
		line-height: 1.4em;
		display: inline-block;
		position: absolute;
		top: 2em;
		left: 21%;
		z-index: 12
	}

	.Dnoir {
		width: 12%;
		position: absolute;
		bottom: 0;
		left: 15%;
		background-color: #000000;
		z-index: 11;
		transform-origin: 0 0
	}

	.Dbleu {
		width: 12%;
		position: absolute;
		bottom: 0;
		left: 3%;
		background-color: #FFEC00;
		z-index: 11;
		transform-origin: 100% 100%
	}

	.Dbleu2 {
		width: 12%;
		position: absolute;
		bottom: 0;
		left: 15%;
		background-color: #FFEC00;
		z-index: 11;
		transform-origin: 0 0
	}

	.demandeD {
		width: 100%;
		float: none;
	}

	.demandeDint {
		float: left;
		width: 420px;
		margin-left: 6.6%;
		margin-top: 6em;
		margin-bottom: 7em;
		padding-top: 1.8em
	}

	.titreformulaire {
		font-size: 1.2em;
		padding: 1.3em 0 0 0;
	}

	#formulaire {
		padding-bottom: 5em;
		padding-top: 0.4em;
	}

	#formulaire .formgauche {
		margin: 1em 0 0 0
	}

	#formulaire .formdroite {
		margin: 1em 0 0 6%
	}

	#formulaire .fromlong {
		margin: 1em 0 0 0
	}

	#formulaire #envoyer {
		margin: 1.8em 0 1em 0
	}

	#introContactG {
		width: 40%;
		font-size: 0.95em
	}

	#introContactD {
		width: 60%;
		font-size: 0.95em
	}

	#formulaire2 {
		width: 90%
	}

	#formulaire2 .labcheckbox2 {
		padding-top: 0.5em;
	}

	#formulaire2 .labcheckbox {
		padding-top: 0.45em
	}

	.contactInfos h1 {
		font-size: 2.2em
	}

	.contactInfos .coordonnees {
		font-size: 0.9em
	}

	#introContactD h2 {
		font-size: 2.2em
	}



	#equipe li .p {
		margin-bottom: 3em
	}

	#equipe li .p div {}

	.H #equipe li .p div {
		height: auto;
		width: 100%;
		position: relative;
		top: 0;
		left: 0;
		background-color: #fff;
		color: #FFEC00;
		display: block
	}

	#equipe li .p div span {
		font-size: 1.05em;
		padding-top: 10px;
		padding-left: 0;
		letter-spacing: 0.02em;
		margin-right: 0
	}

	#equipe li .p div strong {
		font-size: 0.8em;
		margin-left: 0;
		padding-top: 0.5em;
		margin-top: 0em;
		margin-right: 0
	}

	#equipe li .p div strong i {
		display: none
	}

	#equipe li.membre {
		width: 30%;
		float: left;
		margin-right: 1.5%;
		margin-left: 1.5%
	}

	#equipe li.ret2 {
		width: 0;
		float: none;
		margin: 0;
		clear: both
	}

	#equipe li.ret {
		display: none
	}
}


/*@media screen and (max-height:330px) , screen and (max-width:710px) {*/
@media screen and (max-width:710px) {
	.gallery .gallery-item {
		width: calc(100% - 0px) !important;


	}

	.gallery .gallery-item img {
		width: 95% !important;

	}

	#MOB3 {
		display: block
	}

	.H #load {
		width: 32px;
		/*height:8px*/
		margin-top: -4px;
		margin-left: -16px
	}

	.H #intro,
	#intro {
		min-height: 500px
	}


	#animAC2 {
		width: 310px
	}

	#dok00 {
		width: 233px
	}

	#dok03 {
		font-size: 2em
	}

	#introintAC2 {
		left: 6.6%;
		font-size: 0.8em
	}

	#introintAC1 {
		margin-left: 6.6%;
		font-size: 0.7em
	}

	#introintAC1 h2 #dokAC1 {
		width: 1.7em
	}

	#introintAC1 h2 .infoAC1 {
		font-size: 0.65em
	}

	#introint {
		margin-left: 6.6%;
		font-size: 0.7em
	}

	.H #introdefile {
		min-width: 86.8%;
		right: 6.6%
	}

	#introint br {
		display: none
	}

	#introint br.constant {
		display: block
	}

	#introint h2 .mini {
		display: block
	}

	.bt1 {
		font-size: 0.7em
	}

	#introdefile h2 {
		font-size: 1.15em
	}

	#introdefile p {
		font-size: 1.2em;
		min-height: 4.5em
	}

	#introdefile p br {
		display: none
	}

	#introdefileInt {
		min-height: 140px
	}

	#introdefilecontenu {
		margin-right: 70px
	}

	#defileFleches {
		width: 60px
	}

	#defileSuivant {
		width: 60px;
		height: 60px
	}

	#defilePrecedent {
		width: 60px;
		height: 60px
	}

	.ext2 {
		width: 86.8%
	}



	.margH17 {
		margin-top: 8em
	}

	.paddH9 {
		padding-top: 7em
	}

	.titre01 {
		font-size: 2.3em
	}

	.titre02 {
		font-size: 1.4em
	}

	.titre02 br {
		display: none
	}

	.titre03 {
		font-size: 2.3em
	}

	.titre04 {
		font-size: 1.4em
	}

	.titre05 {
		font-size: 2.3em
	}

	.listedomaine .listeP1,
	.listedomaine .listeP2,
	.listedomaine .listeP3,
	.listedomaine .listeP4 {
		width: 100%;
		margin-right: 0;
		margin-left: 0;
		height: 180px
	}

	.listedomaine .listePSEUL,
	.listedomaine .listePSEUL2 {
		height: 180px
	}

	.listedomaine .listePSEUL span,
	.listedomaine .listePSEUL2 span {
		font-size: 1.2em;
		bottom: 2.8em;
		left: 2.2em
	}

	.listedomaine li .nom {
		bottom: 1.2em;
		left: 1em;
		font-size: 2.2em;
		padding-right: 3em;
	}

	.listedomaine li .nomv2 {
		bottom: 1.2em;
		left: 1em;
		font-size: 2.2em;
		padding-right: 3em;
	}

	.listedomaine .listeP3 .nom {
		letter-spacing: normal
	}

	.listedomaine .listeP4 .nom {
		letter-spacing: normal
	}

	.listedomaine li b {
		bottom: 2em;
		right: 1.4em;
		font-size: 1.6em;
		width: 25px;
		height: 25px
	}

	.listedomaine li b img {
		width: 50px
	}

	.servicesPlus {
		float: none;
		width: 100%;
		padding-left: 0;
		margin-top: 3em
	}

	.citation {
		float: none;
		width: 100%;
		margin-right: 0;
		margin-top: 2.5em
	}

	.bandeau-ext {
		padding-top: 7.5em
	}

	.bandeauG {
		width: 70%;
		padding-left: 6.6%;
		padding-right: 6%;
		padding-top: 3.7em;
		padding-bottom: 3.7em
	}

	.bandeauD {
		margin-left: 6.6%;
		padding-bottom: 14em;
		padding-top: 30em
			/*JS*/
	}

	.bandeauD p {
		font-size: 1.25em
	}

	.bandeauD ul {
		font-size: 1.25em
	}

	.bandeauG .margeBas01 {
		margin-bottom: 3em
	}

	.bandeauG .margeBas02 {
		margin-bottom: 1em
	}

	.bt3 {
		font-size: 0.7em
	}

	.bt4 {
		font-size: 0.7em
	}

	#references ul {
		margin-top: 4em
	}

	#references li {
		width: 31%;
		margin-right: 3%;
		margin-bottom: 1em;
		float: left
	}

	#references .der {
		margin-right: 3%
	}

	#references .derMob {
		margin-right: 0
	}

	#mosaiqueD strong {
		font-size: 3.5em;
		right: 25%;
	}

	#mosaique .bt5 {
		left: 40%;
		margin-left: 0;
		font-size: 1.1em;
	}

	.titreInt02,
	.titreInt04 {
		font-size: 1.7em
	}

	.titreInt03,
	.titreInt05,
	.titreInt06 {
		font-size: 1.6em
	}

	.titreInt02 br,
	.titreInt03 br,
	.titreInt04 br,
	.titreInt06 br {
		display: none
	}

	.titreInt06 .brmob {
		display: block
	}

	.decale01 {
		margin-left: 8%
	}

	.par01 {
		width: 100%;
		margin-left: 0;
		float: none
	}

	.decale02 {
		margin-left: 8%;
		margin-right: 0%
	}

	.extInt01 p {
		font-size: 1.1em
	}

	.extInt01 li {
		font-size: 1.1em
	}

	#visuCarresExt {
		padding-bottom: 1em
	}

	.visuCarres {
		height: 300px
	}

	#visuCarresExt strong {
		font-size: 2.4em;
	}

	.partG,
	.partD,
	.partG2,
	.partD2 {
		width: 100%;
		float: none
	}

	.margHmob04 {
		margin-top: 4em
	}

	.servicesPlusInt {
		width: 100%
	}

	.gb {
		width: 80%
	}

	.ressources {
		font-size: 1em
	}

	.ressources .col {
		width: 100%;
		margin-right: 0;
		float: none;
		padding-top: 4.5em
	}

	.ressources h5 {
		font-size: 1.3em;
		margin: 1.5em 0 1.2em 0
	}

	.ressources h5 img {
		width: 0.9em;
		position: absolute;
		top: 0.95em;
		left: 1.5em
	}

	.ressources ul {
		margin: 0;
		padding: 0;
		display: block;
		margin-bottom: 0;
		color: #161313;
		font-size: 1.15em;
		line-height: 2.05em;
		font-weight: 300
	}

	.ressources li {
		padding-left: 1.1em;
		background-image: url("../images/fl22.png");
		background-repeat: no-repeat;
		background-size: 0.45em;
		background-position: 0 0.8em;
		display: block
	}

	.services li span {
		font-size: 1.2em
	}

	.listeE li a .colE1 {
		width: 80%;
		margin-left: 8%;
		padding-bottom: 0.7em;
	}

	.listeE li a .colE2 {
		width: 80%;
		margin-left: 8%;
	}

	.listeE li a .colE3 {
		width: 80%;
		margin-left: 8%;
		margin-top: 0.5em
	}

	#introBlancint {
		width: 86.8%;
		padding-top: 10em;
		padding-bottom: 4em
	}

	.traitbleuintro {
		top: 10em;
		left: 6.6%
	}

	#introBlanc h2 {
		font-size: 2.2em
	}

	#introBlanc h2.plusfort {
		font-size: 2.1em
	}

	#introBlanc h2 .mini2 {
		font-size: 0.45em
	}

	#introBlanccontact {
		padding-top: 9em
	}

	.logobas {
		width: 170px
	}

	#bas .margH7 {
		margin-top: 5em
	}

	#bas .paddH65 {
		padding-top: 4em
	}

	.bascontact {
		float: none;
		margin-left: 6.6%;
		padding-left: 6.6%
	}

	.basD {
		padding-bottom: 7em
	}

	#basacces li a {
		font-size: 1.5em
	}

	#basliste {
		margin-top: 5em;
		font-size: 0.95em;
	}

	#basliste li {
		display: inline-block;
		float: left;
		padding-right: 1em
	}

	#basliste .ret {
		display: none
	}

	#basliste .retMob {
		clear: both;
		width: 0;
		height: 0;
		line-height: 0;
		margin: 0;
		padding: 0;
		float: none;
		display: block
	}

	.demandeGint {}

	.demandeDint {
		width: 86%;
		margin-left: 6.6%
	}

	.demandeG h3 {
		font-size: 2.8em
	}

	#formulaire {
		font-size: 1.2em;
		width: 85%
	}

	#formulaire .fromlong {
		margin: 1.3em 0 0 0
	}

	#formulaire .labcheckbox {
		padding-left: 28px;
		padding-top: 0.4em
	}

	#formulaire .labcheckbox2 {
		padding-left: 24px;
		padding-top: 0.4em
	}

	#formulaire input.box {
		width: 18px;
		height: 18px
	}

	#formulaire input.box2 {
		width: 16px;
		height: 16px
	}

	#formulaire #envoyer {
		margin: 2.3em 0 1.3em 0
	}

	#message-requete {
		font-size: 1.2em;
		top: 25px;
		left: 5%;
		margin-left: 0;
		width: 78%;
		padding: 20px 6%;
		background-size: 15px;
		background-position: 96% 15px;
	}

	#introContactG,
	#introContactD,
	.contactInfos .coordonnees {
		font-size: 1em
	}

	#introContactG {
		width: 100%;
		float: none
	}

	#introContactG .contactInfos {
		margin-left: 6.6%;
		padding-top: 4em;
		padding-left: 0px;
		padding-bottom: 5em
	}

	.contactInfos h1 {
		font-size: 2.4em
	}

	#introContactD {
		width: 100%;
		float: none
	}

	#introContactDint {
		margin-left: 0;
		padding-top: 5em;
		padding-left: 6.6%;
		width: 86.8%
	}

	#introContactD h2 {
		font-size: 2.4em
	}

	#formulaire2 .titreformulaire {
		font-size: 1.15em;
		margin: 1.8em 0 0 0
	}

	#formulaire2 {
		width: 100%;
		font-size: 1.1em;
	}

	#formulaire2 .formgauche {
		width: 100%;
		float: none;
		margin: 1.3em 0 0 0
	}

	#formulaire2 .formdroite {
		width: 100%;
		float: none;
		margin: 1.3em 0 0 0
	}

	#formulaire2 .fromlong {
		margin: 1em 0 0 0
	}

	#formulaire2 textarea {
		height: 13em;
		font-size: 1.1em
	}

	#formulaire2 .labcheckbox2 {
		padding-left: 24px;
		padding-top: 0.3em
	}

	#formulaire2 input.box2 {
		width: 16px;
		height: 16px
	}

	#formulaire2 .labcheckbox {
		padding-left: 30px;
		padding-top: 0.35em
	}

	#formulaire2 input.box {
		width: 18px;
		height: 18px
	}

	#formulaire2 #envoyer {
		margin: 2.8em 0 1.3em 0
	}

	#formulaire2 .envoyerreduit {
		width: 100%
	}

	#equipe {
		padding-top: 3em
	}

	#equipe li.membre {
		width: 45%;
		float: left;
		margin-right: 2.5%;
		margin-left: 2.5%
	}

	#equipe li .p div span {
		font-size: 0.9em
	}

	#equipe li .p div strong {
		font-size: 0.8em;
		padding-top: 0.2em
	}

}

/* galeri */
.gallery {
	display: flex;
	flex-wrap: wrap;
	justify-content: start;
	padding: 10px;
	gap: 30px;
}

.gallery .gallery-item {
	width: calc(33% - 18px);
	display: grid;
	height: 380px !important;
	align-items: center;
	border: 1px solid #e2e2e2;
}

.gallery .gallery-item a {

	max-height: 320px !important;
}

.gallery .gallery-item h5 {
	font-size: 18px;
	margin: 15px 0;
	text-align: center;
}

.gallery .gallery-item img {
	width: 95.6%;
	height: auto;
	display: block;
	height: 280px;
	padding: 0 9px;
	object-fit: cover;
}

.chemicals h4 {
	color: black;
	font-size: 24px;
	margin-top: 15px;
	margin-bottom: 8px;

}

.img-fluid {
	width: 100%;
	height: auto;
}

.mw-350 {
	max-width: 350px;
	margin: 20px 0px;
}

.mt-5 {
	margin-top: 20px;
}

.mt-40 {
	margin-top: 40px !important;
}

.our-ref {
	padding: 10px 0;
	justify-content: center;
	align-items: center;
	background-color: white;
	display: flex;
	flex-wrap: wrap;


}

.our-ref a {
	width: calc(20% - 20px);
	display: flex;
	justify-content: center;
}

.our-ref a img {
	max-width: 180px;
	margin: auto;
}

@media screen and (max-width: 1200px) {

	.our-ref a img {
		max-width: 140px;
	}
}

@media screen and (max-width: 991px) {

	.our-ref a {
		width: calc(33% - 20px);
		padding: 20px 0px;

	}
}

@media screen and (max-width: 500px) {
	.our-ref {
		padding: 10px 0;
		margin: 10px;
		justify-content: unset;
		align-items: center;
		background-color: white;
		display: flex;
		flex-wrap: wrap;


	}

	.our-ref a {
		width: calc(50% - 20px);
		padding: 10px 0px;
		border: 1px solid #ededed;
		min-height: 75px;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 17px;

	}
}

.tra-pro li {
	list-style: auto !important;
	line-height: 1.5;
}

.tra-pro li a {
	color: black;
	font-size: 20px;
}

@media screen and (max-width:500px) {

	.listedomaine .listePSEUL span,
	.listedomaine .listePSEUL2 span {
		font-size: 1.5em;
		bottom: 2.1em;
		left: 2.2em;
	}

	.paddH9 {
		padding-top: 0em
	}

	.tra-pro li a {
		font-size: 16px;
	}

	#dok01 {
		transform: translate(0px, 0) !important;
	}
}

/* Style the dropdown container */
.dropdown {
	position: relative;
	display: inline-block;
}

/* Style the dropdown content (hidden by default) */
.dropdown-content {
	display: none;
	position: absolute;
	background-color: #f9f9f9;
	min-width: 54px;
	box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
	z-index: 1;
}

/* Style the dropdown links */
.dropdown-content a {
	color: black;
	padding: 12px 16px;
	text-decoration: none;
	display: block;
}

/* Change color on hover */
.dropdown-content a:hover {
	background-color: #ddd;
}

/* Show the dropdown content when hovering over the dropdown container */
.dropdown:hover .dropdown-content {
	display: block;
}

.rum a {
	line-height: 1.2em !important;
}

.stock-filter {
	position: relative;
}

.list-aside {
	transition: margin 0.45s;
}



.stock-block {
	display: block;
	position: relative;
	padding: 24px 30px 26px;
	background: #ebebeb;
	color: #000;
	margin-right: 35px;
}

.stock-block .title h2,
.stock-block .title h3 {
	font-size: 1.75rem;
	font-weight: 400;
	margin: 0;
	padding-bottom: 10px;
	padding-top: 10px;
}

.stock-block .stock-hide {
	position: relative;
	padding: 18px 0px 0;
}

.stok-article {
	display: block;
	position: relative;
	line-height: 1.65em;
	z-index: 25;
}

.ul-bullets ul {
	display: block;
	position: relative;
	list-style: none;
	padding: 0;
	margin: 0;
}

.ul-bullets ul>li {
	position: relative;
	padding: 2px 0 2px 36px;
	list-style-type: none !important;
}

ul.ul-bullets>li::before,
.ul-bullets ul>li::before,
ul.ul-bullets>li::after,
.ul-bullets ul>li::after {
	content: ' ';
	display: inline-block;
	overflow: hidden;
	position: absolute;
	top: 50%;
	left: 0;
	width: 20px;
	height: 20px;
	border: 2px solid #000;
	border-radius: 999px;
	-moz-border-radius: 999px;
	-webkit-border-radius: 999px;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}

body.ready ul.ul-bullets>li::after,
body.ready .ul-bullets ul>li::after {
	transition: 0.2s;
}

ul.ul-bullets>li.active::after,
.ul-bullets ul>li.active::after {
	opacity: 1;
}

ul.ul-bullets>li::after,
.ul-bullets ul>li::after {
	width: 10px;
	height: 10px;
	margin-left: 5px;
	background: #000;
	opacity: 0;
}

ul.ul-bullets>li>a,
.ul-bullets ul>li>a {
	display: inline-block;
	text-decoration: none !important;
	font-weight: 400;
	color: #000;
	font-size: 1.2rem;
}

.list-results {
	display: block;
	position: relative;
}

.stocklist-item:not(.zero) {
	margin-bottom: 35px;
}

.stocklist-item {
	display: block;
	position: relative;
	background-color: #ebebeb;
	padding: 25px;
}

.stocklist-item.has-images .stocklist-inner {
	padding-left: 470px;
}

.stocklist-inner {
	display: block;
	position: relative;
	min-height: 330px;
}

.stocklist-item .article-wrap.has-actions {
	padding-bottom: 80px;
}

.stocklist-item .article-wrap {
	padding: 10px 0 0;
}

.stocklist-item .article-wrap h3 {
	font-weight: 600;
	margin-bottom: 20px;
	font-size: 18px;
}

.stocklist-item .article-wrap a {
	transition: 0.25s;
}

.stocklist-item .article-wrap a {
	text-decoration: none !important;
}

.stocklist-item .article-wrap table {
	width: 100%;
	font-weight: 400;
}

.stocklist-item .article-wrap table tr td:not(:last-child) {
	padding-right: 14px;
	width: 130px;
}

.stocklist-item .article-wrap table tr td {
	line-height: 1.35em;
	padding: 5px;
}

.stocklist-item .article-wrap .actions.bottom {
	margin: 10px 0 10px;
	position: absolute;
	bottom: 0;
}

.stocklist-item .article-wrap .actions {
	margin: 30px 0 0;
}

.stocklist-item .article-wrap .actions .button {
	margin: 0;
}

.stocklist-item .article-wrap a {
	transition: 0.25s;
}

.stocklist-item .article-wrap a {
	text-decoration: none !important;
	color: #FCBC00;
}

.button.large.next {
	padding-right: 50px;
}

.button.large.next::after {
	background-size: auto 25px;
	right: 10px;
}

.button.next::after {
	background-image: url(/images/arrow-right-white.png);
	right: 7px;
}

.button.next::after,
.button.prev::after {
	content: ' ';
	display: inline-block;
	width: 32px;
	height: 32px;
	background-position: center;
	background-repeat: no-repeat;
	background-image: url(/images/arrow-left-white.png);
	background-size: auto 20px;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
}

.stocklist-item.has-images .images-wrap {
	position: absolute;
	top: 0;
	left: 0;
	width: 400px;
}

.stocklist-item .images-wrap {
	position: relative;
	font-size: 0;
	line-height: 1em;
	margin-right: 15px;
	max-width: 100%;
}


.stocklist-item .images-wrap>.img>.spread {
	display: block;
	width: 100%;
	height: 100%;
}

.image.spread {
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}

.stocklist-item .images-wrap>.img.none {
	opacity: 0.3;
}

.stocklist-item .images-wrap>.img02,
.stocklist-item .images-wrap>.img03 {
	width: 35%;
	height: 158px;
}

.stocklist-item .images-wrap>.img02,
.stocklist-item .images-wrap>.img03 {
	position: absolute;
	top: 0;
	right: 0;
}




.stocklist-item .images-wrap>.img03 {
	top: auto;
	bottom: 0;
}

.stocklist-item .images-wrap>.img02,
.stocklist-item .images-wrap>.img03 {
	width: 35%;
	height: 158px;
}

.stocklist-item .images-wrap>.img02,
.stocklist-item .images-wrap>.img03 {
	position: absolute;
	top: 0;
	right: 0;
}

.stocklist-item .images-wrap>.img03 {
	width: 35%;
	height: 158px;
}



.stocklist-item .images-wrap>.img {
	display: inline-block;
	padding-right: 15px;
	width: 100%;
	height: 330px;
}

.button.orange {
	color: #fff !important;
	background-color: #FCBC00;
}

.button.large {
	font-size: 1.065rem;
	padding: 15px 22px;
}

.button.large.next::after {
	background-size: auto 25px;
	right: 10px;
}

.button.next::after {
	background-image: url(../images/arrow-left-white.png);
	right: 7px;
}

.button.next::after,
.button.prev::after {
	content: ' ';
	display: inline-block;
	width: 32px;
	height: 32px;
	background-position: center;
	background-repeat: no-repeat;
	background-image: url(../images/arrow-left-white.png);
	background-size: auto 20px;
	position: absolute;
	top: 50%;
	transform: translateY(-50%) rotateY(180deg);
	-webkit-transform: translateY(-50%) rotateY(180deg);
}


.stock-container {
	display: flex;
	flex-wrap: wrap;
}

.stock-filter {
	width: 30%;
}

.stock-results {
	width: 70%;
}

.stock-container {
	margin-top: 50px;
}

.stock-image {
	width: 30%;
}

.stock-detail {
	width: 70%;
}

.stocklist-item.has-content {
	display: flex;
	flex-wrap: wrap;
}

.article-wrap {
	width: calc(50%);
}

.form-container {
	display: flex;
	flex-wrap: wrap;
}

.contact-form {
	width: 65%;
	background: #ededed;
	padding: 25px 30px;
	border-radius: 5px;
}

.contact-form .title {
	font-size: 25px;
	font-weight: 500;
	position: relative;
}

.contact-form .title::before {
	content: "";
	position: absolute;
	height: 3.5px;
	width: 30px;
	background: linear-gradient(135deg, var(--main-blue), var(--main-purple));
	left: 0;
	bottom: 0;
}

.contact-form form .user__details {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin: 20px 0 12px 0;
}

/* inside the form user details */
form .user__details .input__box {
	width: calc(100% / 2 - 20px);
	margin-bottom: 15px;
}

.user__details .input__box .details {
	font-weight: 500;
	margin-bottom: 5px;
	display: block;
}

.user__details .input__box input {
	height: 45px;
	width: 100%;
	outline: none;
	border-radius: 5px;
	border: 1px solid var(--main-grey);
	padding-left: 15px;
	font-size: 16px;
	border-bottom-width: 2px;
	transition: all 0.3s ease;
}

.user__details .input__box input:focus,
.user__details .input__box input:valid {
	border-color: var(--main-purple);
}

/* inside the form gender details */

form .gender__details .gender__title {
	font-size: 20px;
	font-weight: 500;
}

form .gender__details .category {
	display: flex;
	width: 80%;
	margin: 15px 0;
	justify-content: space-between;
}

.gender__details .category label {
	display: flex;
	align-items: center;
}

.gender__details .category .dot {
	height: 18px;
	width: 18px;
	background: var(--sub-grey);
	border-radius: 50%;
	margin: 10px;
	border: 5px solid transparent;
	transition: all 0.3s ease;
}

#dot-1:checked~.category .one,
#dot-2:checked~.category .two,
#dot-3:checked~.category .three {
	border-color: var(--sub-grey);
	background: var(--main-purple);
}

form input[type="radio"] {
	display: none;
}

/* submit button */
form .button {
	height: 45px;
	margin: 45px 0;
}

form .button input {
	height: 100%;
	width: 100%;
	outline: none;
	color: #fff;
	border: none;
	font-size: 18px;
	font-weight: 500;
	border-radius: 5px;
	background: linear-gradient(135deg, var(--main-blue), var(--main-purple));
	transition: all 0.3s ease;
}

form .button input:hover {
	background: linear-gradient(-135deg, var(--main-blue), var(--main-purple));
}

@media only screen and (max-width: 584px) {
	.contact-form {
		max-width: 100%;
	}

	form .user__details .input__box {
		margin-bottom: 15px;
		width: 100%;
	}

	form .gender__details .category {
		width: 100%;
	}

	.contact-form form .user__details {
		max-height: 300px;
		overflow-y: scroll;
	}

	.compact-form form .user__details {
		max-height: unset !important;
		overflow-y: unset !important;
	}

	.user__details::-webkit-scrollbar {
		width: 0;
	}
}

.stock-image.price-cont {
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: -1;
	background-color: #FCBC00;
	position: relative;
}

.stock-image.price-cont h3 {

	transform: rotate(270deg);
	font-size: 35px;
}


.stock-image.price-cont h2 {
	position: absolute;
	left: 0;
	top: 0;
	padding: 10px 35px;
	background: black;
	color: white;
	font-size: 20px;
	border-radius: 0px 0px 22px 0px;
}

.table-wrap table tbody tr td.nowrap {
	font-weight: bold;
}

.table-wrap table tbody tr {
	border: 1px solid black;
}


@media screen and (max-width:991px) {
	.stock-detail {
		width: 100%;
		order: 2;
	}

	.stock-image {
		width: 100%;
	}

	.stock-image img {
		max-height: 250px;
		object-fit: cover;
	}

	.stock-image.price-cont {
		display: flex;
		align-items: center;
		justify-content: center;
		z-index: -1;
		background-color: #FCBC00;
		position: relative;
		height: 115px;
	}

	.stock-image.price-cont h3 {
		transform: rotate(0deg);
		font-size: 35px;
	}

	.contact-form {
		width: 100%;
		background: #ededed;
		padding: 25px 30px;
		border-radius: 5px;
	}

	.article-wrap {
		width: calc(100%);
	}
}

.siparis-ver {
	background: #FCBC00 !important;
	width: 250px !important;
}

.title span {
	display: none;
	font-size: 31px;
}

/* Büyük ekranlarda normal görünüm */
@media (min-width: 1200px) {
	.dropdown-toggle {
		display: none;
	}
}


/* Küçük ekranlarda dropdown menü */
@media (max-width: 1200px) {
	.stock-hide {
		display: none;
	}

	.dropdown-toggle {
		display: block;
	}

	.stock-filter {
		width: 100%;
		padding: 10px;
	}

	.stock-results {
		width: 100%;
	}

	.stock-block {

		padding: 0;

	}

	.stock-block.active .title {
		padding: 10px 0 0 10px;
	}

	.stock-block.active .stock-hide {
		padding: 10px 0 0 10px;
	}

	.stocklist-item {
		display: block;

		flex-wrap: wrap;
	}







	.stock-block {
		width: 100%;

	}


	.title {
		cursor: pointer;
	}

	.title {
		width: 92%;
		display: flex;
		align-items: center;
		justify-content: space-between;
		margin-top: 0;
		padding-top: 0 !important;
	}

	.title span {
		display: block;
		font-size: 31px;
		margin-top: -5px;
	}

	.stok-article {

		padding-bottom: 10px;
	}

	.stock-block .title h2,
	.stock-block .title h3 {
		font-size: 28px;
	}
}

@media screen and (max-width:1700px) {
	.stocklist-item.has-images .stocklist-inner {
		padding-left: 0px;
		display: flex;
		flex-wrap: wrap;
	}

	.stocklist-item .article-wrap h3 {
		font-weight: 600;
		margin-bottom: 20px;
		font-size: 18px;
		margin-top: 12px;
	}

	.stocklist-item .images-wrap {
		position: relative !important;
		font-size: 0;
		line-height: 1em;
		margin-right: 15px;
		max-width: 100%;
	}

	.article-wrap.has-actions.has-shadow {
		order: 2;
		width: 100%;
	}

	.stocklist-item.has-images .images-wrap {
		width: 100%
	}
}


.aciklama table tr td {
	display: block;
	width: 100% !important;
}