html { margin: 0px; overflow-x: hidden; }
body { margin: 0px; overflow: hidden; padding-bottom: 100px;}

/* MOBIL */
.mobilSupr { display: none !important; }
.justMobil { display: block !important; }
.mobilSuprTable { display: none !important; }
.justMobilTable { display: table !important; }

/* WIDTH */

.contenu {
	position: relative;
	display: inline-block;
	background-size: cover;
	background-position: center;
	vertical-align: middle;
  word-spacing: 0em;
	overflow: visible;
}

/* PAGE CONTENU */

.width-full {
	display: table;
	position: relative;
	width: 90vw;
	table-layout: fixed;
	word-spacing: -4em;
	overflow: visible;
	vertical-align: middle;
}

.width-max {
	display: table;
	position: relative;
	width: 90vw;
	height: auto;
	table-layout: fixed;
	word-spacing: -4em;
	overflow: visible;
	vertical-align: middle;
}

.width-grand, .width-petit {
	display: inline-table;
	position: relative;
	width: 100vw;
	margin: 0;
	table-layout: fixed;
	word-spacing: -4em;
	overflow: visible;
	padding: 0;
	vertical-align: middle;
}

/* MARGES */
.padding-top { padding-top: 40px; }
.padding-bottom { padding-bottom: 40px; }

/* BOX // WIDTH */
.entier, .demi, .tier, .tier-max, .deuxtier, .quart, .troisquart, .cinquieme, .deuxcinquieme, .deuxcinquieme-left, .troiscinquieme, .troiscinquieme, .cinqsixieme-full
{ width: calc((100% / 1) - 80px); margin: 0px 40px; }

.entier-full, .demi-full, .tier-full, .deuxtier-full, .quart-full, .troisquart-full, .cinquieme-full, .deuxcinquieme-full, .troiscinquieme-full, .troiscinquieme-full
{ width: calc((100% / 1) - 0px); margin: 0px 0px; }

.tier-max { padding: 0 0 50px 0; }

.centerMobil { text-align: center; }


.bande-60 { height: 40vh; min-height: 0px; }
.bande-image-img { height: 40vh; }

/* P */

p, a {
	font-size: 3.2vw;
	line-height: 6vw;
}

p.carte-visite {
	font-size: 4vw;
	line-height: 6.8vw;
}

p.credits {
	font-size: 2.2vw;
	line-height: 2.7vw;
	letter-spacing: 0.2vw;
}

a.en-savoir-plus, a.en-savoir-moins, a.simple {
	padding: 6px 12px;
	font-size: 2.4vw;
	line-height: 3vw;
	letter-spacing: 0.8vw;
}

a.bouton {
	font-size: 2.8vw;
	line-height: 3.2vw;
	letter-spacing: 0.7vw;
}

/* H */

h1 {
	font-size: 4.6vw;
	line-height: 6.2vw;
}

h2 {
	font-size: 7vw;
	line-height: 8vw;
	padding: 15px 0 30px 0;
}

h3 {
	font-size: 4.2vw;
	line-height: 6.8vw;
}

h4 {
	font-size: 2.6vw;
	letter-spacing: 2vw;
}

/* LISTES */

ul.point p {
	font-size: 3.6vw;
	line-height: 5.8vw;
}

ul.point li:nth-child(1) p span {
	width: 40px;
	height: 40px;
	margin: 0 20px 0 10px;
}

ul.point li:nth-child(1) p span.select {
	width: 60px;
	height: 60px;
	margin: 0 10px 0 0;
}

/* MENU PRINCIPAL */

#barre-menu {
	position: relative;
	display: table;
	table-layout: fixed;
	vertical-align: middle;
	top: 0px;
	width: 100vw;
	left: 0px;
	height: auto;
	z-index: 100;
	transition-duration: 0.2s;
}

#barre-menu.fullscreen {
	transform: translate(0, 0%);
}


#menu-cardis {
	display: none;
}

#barre-accueil {
	display: table;
	word-spacing: 0em;
	position: absolute;
	width: 100vw;
	bottom: 0%;
	left: 0%;
	height: auto;
	margin: 0 auto;
	transform: translate(0%, 100%);
	background-color: var(--color-gris-light);
} #barre-accueil.on { transform: translate(0%, 0); }

#close-galerie-accueil {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 40px;
	height: 40px;
	background-color: white;
	background-image: url('../svg/pictogramme-croix.svg');
	background-size: 40%;
	background-position: center;
	cursor: pointer;
	transition-duration: 0.2s;
}

#barre-accueil.on #close-galerie-accueil { transform: translateY(-60px) rotate(0deg); }
#barre-accueil.on #close-galerie-accueil:hover { transform: translateY(-60px) rotate(90deg); }
#barre-accueil #close-galerie-accueil { transform: translateY(0px) rotate(0deg); }


#barre-accueil table tr:nth-child(1) td:nth-child(2) {
	display: none;
}

#barre-accueil table tr:nth-child(2) p {
	font-size: 2.7vw;
	line-height: 4vw;
	padding: 10px 0 20px 0;
}

#menu-principal-ligne {
	margin: 0;
}

.menu-principal-ligne1 td {
	padding-bottom: 1vh;
	background-color: var(--color-gris-light);
	padding: 2vw 2vw 1vw 2vw;
}

ul#menu-principal-ligne1-liens {
	table-layout: auto;
}

.menu-principal-ligne1 td ul.bouton li span.picto {
	width: 14vw;
	height: 8vw;
	border-radius: 0px;
	margin-bottom: 0px;
	box-shadow: 0 0 0 0px var(--color-gris-clair);
	display: none;
}

.menu-principal-ligne1 td ul.bouton:hover li span.picto, .menu-principal-ligne1 td ul.bouton.active li span.picto { box-shadow: 0 0 0 0px var(--color-projet-corpo); }

.menu-principal-ligne1 td ul.bouton li p {
	font-size: 2.2vw;
	line-height: 3.6vw;
}

.menu-principal-ligne1 td ul.bouton li p i {
	/*display: none;*/
}

.menu-principal-ligne2.on {
	display: none;
}

#menu-principal-mobil {
	width: 100vw;
	table-layout: fixed;
}

#menu-principal-mobil img {
	padding: 10px 0;
}

/* GALERIE */

ul#galerie-control-liste li.vignette {
	display: none;
}

/* TABELAU DISTANCES */

table#distances tr td p {
	padding: 1.6vw 1vw;
	font-size: 3vw;
	line-height: 4vw;
	color: var(--color-projet-corpo);
}

table#distances tr td:nth-child(1) p {
	font-family: 'Medium', sans-serif;
	color: white;
	font-size: 1.8vw;
	letter-spacing: 0.2vw;
	text-transform: uppercase;
}

/* GALERIE ACCUEL */

#galerie-accueil {
	position: relative;
	width: 100vw;
	height: 40vh;
	min-height: 400px;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	overflow: hidden;
}

#galerie-control {
	position: absolute;
	top: 0px;
	right: 0px;
	height: 50vh;
	width: calc(100vw/5);
	z-index: 10000;
	transform: translate(0, 0);
	transition-duration: 0.2s;
}

/* ACTU */

#barre-accueil,
#barre-accueil.on,
#galerie-control {
	display: none;
}

#actuMobil {
	background-color: var(--color-selecteur-dispo);
}

#actuMobil { display: none; }
#actuMobil.on { display: block; }

#actuMobil p {
	color: white;
}

#actuMobil p.actu-principal {
	font-family: 'SemiBold', sans-serif;
	font-size: 5vw;
	line-height: 7vw;
	padding: 3vh 0 1vh 0;
}

#actuMobil p.actu-secondaire {
	font-family: 'Regular', sans-serif;
	font-size: 2.6vw;
	line-height: 4.5vw;
	letter-spacing: 0.2vw;
	padding: 0 0;
	text-transform: uppercase;
}

#actuMobil a {
	display: inline-block;
	font-family: 'medium', sans-serif;
	cursor: pointer;
	padding: 14px 20px;
	margin: 20px 0;
	text-transform: uppercase;
	font-size: 2.7vw;
	line-height: 4.1vw;
	letter-spacing: 0.2vw;
	border-radius: var(--border-radius);
	background-color: white;
	color: var(--color-gris-fonce);
}

#actu-scroll, #actu-scroll.off, #actu-scroll.on {
	transform: translate(100%, -50%) !important;
}

/* MODIF GALERIE */

#galerie-accueil-images span.next {
	position: absolute;
	top: 50%;
	right: 0%;
	width: 10vw;
	height: 10vw;
	background-color: white;
	transform: translate(-50%, -50%);
	box-shadow: inset 0 0 0 4px white;
	transition-duration: 0.4s;
}

#galerie-accueil-images span.next svg {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 50%;
	height: 50%;
	transform: translate(-50%, -50%);
}

#galerie-accueil-images span.next svg .cls-1 {
	fill: var(--color-gris-fonce);
}

#galerie-accueil-images span.next:hover {
	box-shadow: inset 0 0 0 4px var(--color-gris-fonce);
}