
/* Overlay style */
.overlay {
	z-index: 99;
	position: fixed;
	width: 100%;
	top: 0px;
	bottom: 70px;
	left: 0;
	background: #000000;
}

@media (min-width: 768px) {
	.overlay {
		z-index: 99;
		height: 100%;
		bottom: initial;
	}
}


/* Overlay open / closing */

/* Bouton d'ouverture et de fermeture du menu */
#trigger-overlay,
.overlay .overlay-close {
	height: 70px;
	position: absolute;
	right: 0;
	top: 0;
	border: none;
	background: transparent;
	outline: none;
	z-index: 99;
	display: inline-flex;
}

/* Bouton d'ouverture de menu */
#trigger-overlay {
	position: relative;
	top: -43px;
}

@media (min-width:768px) {
	#trigger-overlay {
		width: auto;
		top: 0;
	}
}

/* Bouton de fermeture de menu */
.overlay .overlay-close {
	display: none;
	right: 2rem;
	top: 0;
}

@media (min-width:768px) {
	.overlay .overlay-close{
		display: initial;
	}
}

/* Texte : "Au menu" et "Fermer" */
#trigger-overlay .text-menu,
.overlay .overlay-close .text-close {
	font-size: 14px;
	font-weight: 700;
}

@media (min-width:768px) {
	#trigger-overlay .text-menu,
	.overlay .overlay-close .text-close{
		position: relative;
		color: #ffffff;
		font-size: 16px;
		font-weight: 700;
		right: 15px;
	}

	.overlay .overlay-close .text-close {
		right: 5px;
	}
}

/* Texte : "Au menu" */
#trigger-overlay .text-menu {
	color: #ffffff;
}

/* Passage de la souris sur le menu d'ouverture ou de fermeture du Menu*/
#trigger-overlay:hover,
.overlay .overlay-close:hover {
	cursor: pointer;
}

/* Passage de la souris sur le texte "Au Menu" */
#trigger-overlay:hover .text-menu {
	color: #00E1FF;
}

/* Passage de la souris sur le texte "Fermer" */
.overlay .overlay-close:hover .text-close {
	color: #00E1FF;
}

/* Bouton d'ouverture du Menu */
#trigger-overlay .fa-2x,
.overlay .fa-2x {
	font-size: 14px;
}

@media (min-width:769px) {
	#trigger-overlay .fa-2x,
	.overlay .fa-2x {
		font-size: 25px;
	}
}

#trigger-overlay span{
	margin : auto;
}

/** LES DIV DU MENU **
----------------------------------------------------------------------
----------------------------------------------------------------------*/

/* Petits mobiles */
/* Partie 1 */
.overlay nav {
	text-align: center;
	position: relative;
	margin-top: 20px;
}
/* Partie 2 */
.overlay nav.agence {
	margin-top: 20px;
}

/* Grands mobiles */
@media (max-width: 768px) and (min-height: 550px) {
	/* Partie 1 */
	.overlay nav {
		text-align: center;
		position: relative;
		margin-top: 50px;
	}
	/* Partie 2 */
	.overlay nav.agence {
		margin-top: 30px;
	}
}

/* Desktop */
@media (min-width: 768px) {
	/* Colonne 1 */
	.overlay nav {
		text-align: center;
		position: relative;
		margin-top: 280px;
		top: 100px;
		-webkit-transform: translateY(-50%);
		transform: translateY(-50%);
	}
	/* Colonne 2 */
	.overlay nav.agence {
		margin-top: 280px;
	}
}

/** LES LIGNES DU MENU **
----------------------------------------------------------------------
----------------------------------------------------------------------*/
.overlay ul {
	list-style: none;
	padding: 0;
	margin: 0 auto;
	display: inline-block;
	height: 100%;
	position: relative;
}

/** CHAQUE LIGNES DU MENU **
----------------------------------------------------------------------
----------------------------------------------------------------------*/
/* Petits mobiles */
.overlay ul li {
	display: block;
	height: calc(100% / 5);
	min-height: 40px;
}

@media (min-width: 375px) {
	.overlay ul li {
		min-height: 48px;
	}
}
/* Desktop */
@media (min-width: 768px) {
	.overlay ul li {
		display: block;
		height: calc(100% / 5);
		min-height: 50px;
		margin-bottom: 20px;
	}
}

/** CHAQUE LIENS/TEXTES DU MENU **
----------------------------------------------------------------------
----------------------------------------------------------------------*/
/* Petits mobiles */
.overlay ul li a {
	position: relative;
	display: block;
	color: #ffffff;
	letter-spacing: -1px;
	font-weight: 700;
	-webkit-transition: color 0.2s;
	transition: color 0.2s;
	font-size: 20px;
}


/* Desktop */
@media (min-width: 768px) {
	.overlay ul li a {
		font-size: 30px;
	}
}

/** PASSAGE DE LA SOURIS OU ITEM DU MENU SELECTIONNES **
----------------------------------------------------------------------
----------------------------------------------------------------------*/
.overlay ul li:hover a,
.overlay ul li.current-menu-item a,
.overlay ul li.current-page-item a {
	position: relative;
	font-weight: 700;
	text-decoration: none;
	color: #00E1FF;
}


.overlay ul li.current_page_item a::before{
	color: #00E1FF;
}

.overlay ul li.item_definir:hover a,
.overlay ul li.item_definir.current-menu-item a,
.overlay ul li.item_definir.current-page-item a{
	color: #ffffff;
	cursor: initial;
}


/** LES PUCES DU MENU **
----------------------------------------------------------------------
----------------------------------------------------------------------*/
/* Petits mobiles */
.overlay ul li a::after,
.overlay ul li.current-menu-item a::after,
.overlay ul li.current-page-item a::after {
	position: absolute;
	left: 50%;
	width: 8px;
	height: 8px;
	bottom: -8px;
	background: #00E1FF;
	border-radius: 50%;
	content: '';


	opacity: 0;
	-webkit-transition: -webkit-transform 0.3s, opacity 0.3s;
	-moz-transition: -moz-transform 0.3s, opacity 0.3s;
	transition: transform 0.3s, opacity 0.3s;
	-webkit-transform: translateX(-50%) translateY(-50%) scale(0.2);
	-moz-transform: translateX(-50%) translateY(-50%) scale(0.2);
	transform: translateX(-50%) translateY(-50%) scale(0.2);
}

.overlay ul li.item_definir a::after {
	display: none;

}
/* Grands mobiles */
@media (max-width: 768px) and (min-height: 550px) {
	.overlay ul li a::after,
	.overlay ul li.current-menu-item a::after,
	.overlay ul li.current-page-item a::after {
		width: 14px;
		height: 14px;
		bottom: -20px;
	}
}

/* Desktop */
@media (min-width: 768px) {
	.overlay ul li a::after,
	.overlay ul li.current-menu-item a::after,
	.overlay ul li.current-page-item a::after {
		width: 16px;
		height: 16px;
		bottom: -30px;
	}
}

.overlay ul li a:hover::after,
.overlay ul li a:focus::after,
.overlay ul li.current-menu-item a::after {
	opacity: 1;
	-webkit-transform: translateX(-50%) translateY(-50%) scale(1);
	-moz-transform: translateX(-50%) translateY(-50%) scale(1);
	transform: translateX(-50%) translateY(-50%) scale(1);
}


/** EFFECTS **
----------------------------------------------------------------------
----------------------------------------------------------------------*/
.overlay-hugeinc {
	opacity: 0;
	visibility: hidden;
	-webkit-transition: opacity 0.5s, visibility 0s 0.5s;
	transition: opacity 0.5s, visibility 0s 0.5s;
}

.overlay-hugeinc.open {
	opacity: 1;
	visibility: visible;
	-webkit-transition: opacity 0.5s;
	transition: opacity 0.5s;
}

.overlay-hugeinc nav {
	-webkit-perspective: 1200px;
	perspective: 1200px;
}

.overlay-hugeinc nav ul {
	opacity: 0.4;
	-webkit-transform: translateY(-25%) rotateX(35deg);
	transform: translateY(-25%) rotateX(35deg);
	-webkit-transition: -webkit-transform 0.5s, opacity 0.5s;
	transition: transform 0.5s, opacity 0.5s;
}

.overlay-hugeinc.open nav ul {
	opacity: 1;
	-webkit-transform: rotateX(0deg);
	transform: rotateX(0deg);
}

.overlay-hugeinc.close nav ul {
	-webkit-transform: translateY(25%) rotateX(-35deg);
	transform: translateY(25%) rotateX(-35deg);
}

.fa-position-menu-hidden{
	display: none;
}