/*
Theme Name: divi-child
Template: Divi
Theme URI: http://www.elegantthemes.com/gallery/divi
Version: 1.0.0
Description: Theme site internent de Carolles
Author: Julien Foison
Author URI: www.julienfoison.com */

@font-face { 
 font-family: 'Hey August';
  src: url('https://carolles.fr/wp-content/uploads/fonts/hey-august.woff2') format('woff2'),
       url('https://carolles.fr/wp-content/uploads/fonts/hey-august.woff') format('woff'),
       url('https://carolles.fr/wp-content/uploads/fonts/hey-august.ttf') format('truetype'),
       url('https://carolles.fr/wp-content/uploads/fonts/hey-august.otf') format('opentype');	
  font-display: swap;
}

.et_pb_text h1 {
 font-family: 'Hey August', cursive !important;	
}

/* Alignement Menu principal avec bouton */

.et_pb_fullwidth_menu .et_pb_menu__menu > nav > ul > li {
	align-items: center;
}

.et_pb_fullwidth_menu--without-logo .et_pb_menu__menu > nav > ul > li > a {
	padding-bottom: 0px;
}

/* Menu principal en capitale */
.nav li.mega-menu > a {
	text-transform: uppercase;
}

/* bordure verte menu principal */
.nav li ul {
	border-top: 2px solid #485b51!important;
}
/* bordure sous menu */
.nav li ul ul {
	border-top: 0px !important;
}

/* Bouton démarches */
.et_pb_fullwidth_menu--without-logo nav ul li.btn-demarches {
	/*background: #485b51 !important;*/
	background: rgb(254, 228, 155) !important;
	/*background: #00a897 !important;*/
	border-radius: 50px;
	border: 0px solid #485b51;
	padding: 24px 30px;
}

.et_pb_fullwidth_menu--without-logo nav ul li.btn-demarches > a {
	color: #000000 !important;
}

/* Style sous menu */ 
.et-menu .menu-item-has-children > ul.sub-menu li.sub-menu-link > a {
	color: #1e1e1e !important;
	font-weight: 600 !important;
	padding-left: 0px;
	margin-bottom: 1rem;
	margin-top: 1rem;
	font-size: 1.3rem;
} 

/* Sous-menu style trait */
.et-menu .menu-item-has-children > ul.sub-menu li.sub-menu-link > a::before {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 1.6rem;
	height: .2rem;
	background: #485b51;
	padding-left: 0px !important;
}

/* Style point liens sous-menu */
.et-menu .menu-item-has-children > ul.sub-menu li.sub-menu-link > ul.sub-menu li > a::before {
	content: "";
	display: inline-block;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: #485b51;
	margin-right: 8px;
	position: relative;
	top: -1px;
}

/* espacement sous-menu */
.et-menu-nav li.mega-menu > ul {
	padding: 30px 0px 30px 100px !important
}

/* style ancre sous-menu */
.et-menu-nav li.mega-menu > ul > li > a:first-child {
	border-bottom: 0px;
}

.et_pb_fullwidth_menu_0_tb_header.et_pb_fullwidth_menu {
	padding-top: 10px;
	padding-bottom: 40px;
}

.et_pb_fullwidth_menu_0_tb_header.et_pb_fullwidth_menu ul li ul li > a {
	font-weight: 400;
	font-size: 17px;
	padding: 0px;
}

@media (max-width: 980px) {
	.et_pb_menu__wrap {
		padding-bottom: 0px;
	}
	.et_pb_menu .et_pb_menu__menu {
		display: flex;
		flex-direction: column;
	}

	.et_pb_menu .et_mobile_nav_menu {
		display: none;
	}

	.et_pb_menu--style-left_aligned .et_pb_menu__wrap {
		justify-content: flex-start;
	}

	.et_pb_menu .et_pb_menu__menu, .et_pb_menu .et_pb_menu__menu > nav, .et_pb_menu .et_pb_menu__menu > nav > ul {
		flex-direction: column;
	}
	
	/* Menu mobile */
	.et_pb_fullwidth_menu .et_mobile_menu {
		max-height: 85vh; /* hauteur max du menu */
		overflow-y: auto; /* permet le scroll vertical */
		-webkit-overflow-scrolling: touch; /* permet le scroll fluide sur Iphone */
		position: fixed; /* évite que le menu dépasse du conteneur */
		top: 60px; /* ajuste la hauteur du menu */
		left: 0;
		right: 0;
		z-index: 99999; /* reste au dessus du contenu */
		background: #485b51 !important;
		border-top: 3px solid #485b51 !important;
	}

	.et_pb_menu__wrap .mobile_menu_bar {
		background: rgba(255,255,255,0.15);
		padding: 5px;
		border-radius: 50px;
	}
}

.et_pb_fullwidth_header .et_pb_fullwidth_header_container.left {
	left: 0;
	margin: 0;
}

.wpfront-close {
	top: 10px !important;
	font-size: 15px !important;
	width: 20px !important;
	height: 20px !important;
	line-height: 6px !important;
}

/* style slide carousel */
.swiper-pagination {
	bottom: var(--swiper-pagination-bottom, -40px) !important	;
}

.swiper {
	position: relative;
}

.swiper-wrapper {
	width: 100%;
	height:100%;
}

.swiper-slide {
  display:flex;
  justify-content: center;
  align-items: center;
}

.swiper-slide img {
	display: block;
	width: auto;
	height: 100%;
	object-fit: cover;
}

/*.swiper-controls {
	position:absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 100000;
	left: 0;
	right: 0;
	display: flex;
	justify-content: space-between;
}*/

.swiper-button-prev, .swiper-button-next {
	pointer-events: all;
	cursor: pointer;
}

.swiper-navigation-icon {
	color: #485b51;
	height: 25px !important;
}

.overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0,0,0,0.8);
  padding: 15px;
  opacity: 0;
  transition: opacity 0.3s ease;
}

.overlay-image {
  position: absolute;
  inset:0;
  background: rgba(0,0,0,0.8);
  display:none;
  justify-content:center;
  align-items:center;
  z-index:999999;
  overflow: hidden;
  width:100%;
  height: 100%;	
}

.overlay-image img {
	max-width: 90%;
	max-height: 90%;
	object-fit:contain;
}

.overlay-image .close {
	position: absolute;
	top: 20px;
	right: 30px;
	font-size: 40px;
	color: white;
	cursor: pointer;
}
.overlay h3 {
	color: #fff !important;
}

/*.image-container:hover .overlay {
 opacity: 1;
}*/

/*style shortcode météo */

.weather, .weather-item-info {
	display: flex;
	display: -webkit-flex;
	-webkit-align-items:center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
}

.weather-item-content {
	display: flex;
	display: -webkit-flex;
	-webkit-align-items:center;
	align-items: center;
	margin-left: 10px;
}

.weather-item-content, .weather-item-info {
	display: flex;
	display: -webkit-flex;
	-webkit-align-items:center;
	align-items: center;
	line-height: 1.2;
	margin-left: 10px;
}

.weather-item-day {
	color: #fff;
	font-size: 1rem;
	font-weight: 500;
	margin: 0;
	text-align: left;
}

.weather-item-temp {
	text-align: right;
}

.weather-item__temp {
	color: #fff;
	font-size: 1rem;
	font-weight: 500;
	margin-right: 10px;
}

.sr-only {
	border: 0;
	clip: rect(0,0,0,0);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
}

.weather-item-wind {
	color: #1e1e1e;
	font-size: 0.9rem;
	font-weight:400;
	margin: 0px 5px;
}