@charset "utf-8";
/* *** Widgets */

/* *** Widget : C'était dupliqué dans commun.css et widget.css) *** */

.wEx .wTit {
	margin-top: 15px;
	background-color: #fff;
	font-weight: bold;
	line-height: 1.2;
	color: #444;
	font-family: var(--titre-font);
}

.wEx ul {
	text-align: left;
	padding: 0;
	list-style: none;
	margin: 10px 0 0;
	line-height: 1.65;
	column-width: 160px;
	column-gap: 20px;
	column-rule: 1px solid #7b9398;
	orphans: 3;
	font-size: 1.1em;
}

.wEx.avecVilleDepart ul {
	column-width: 210px;
}

.wEx ul li {
	line-height: 1.1;
	clear: both;
	display: inline-block;
	width: 100%;
	padding: 0;
}

.wEx ul li div {
	padding: 7px;
	position: relative;
	color: #444;
}

.wEx ul li a {
	text-decoration: none;
}

.wEx ul li.plus div {
	text-align: center;
	font-size: .8em;
	opacity: .8;
	display: flex;
	flex-direction: column;
	gap: 5px;
}

.wEx ul li:not(.plus) div {
	display: flex;
	justify-content: space-between;
}

.wEx ul li.plus div::before {
	content: '';
	background-image: url(/images/i/svg/circle-plus.svg);
	background-repeat: no-repeat;
	background-position: center;
	width: 20px;
	height: 20px;
	opacity: .6;
	margin: 0 auto;
	display: inline-block;
	transition: all .3s;
	vertical-align: middle;
	display: block;
}

.wEx ul li:hover div {
	background-color: var(--color1a);
}

.wEx ul li.plus:hover div {opacity: 1;}

.wEx ul li div > span {
	line-break: loose;
	color: var(--color1f);
}

.wEx ul li div > span:nth-child(1) > span:nth-child(1) { /* cas affichage pays */
	font-size: .6em;
	opacity: .7;
	position: relative;
	top: -6px;
	white-space: nowrap;
}

.wEx ul li div > span:nth-child(2) {
	font-family: sans-serif, arial, verdana;
	color: var(--color2);
	margin-left: 9px;
	font-size: 1.1em;
	white-space: nowrap;
}



.galerie1 .lesTuiles a {
	color: var(--color1f);
	text-decoration: none;
}

.wTestImg {position:absolute;visibility:hidden;width:0;height:0;}

.wExGrImg {
	height: 190px;
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
	transition: all .2s;
}

.wEx .galerie1 .lesTuiles .plus .wExGrImg {
	background-color: #f9f9f9;
	padding: 10%;
	text-align: center;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #4f4f4f;
	line-height: 1.2;
	height: 100%;
}

.wExGrOf {position:relative;cursor:pointer;display:flex;flex-direction:column;height:100%;border-radius:10px;overflow:hidden;transition:all .2s;box-shadow:0 0 15px 6px #ebebeb;}
.wExGrOf .descr {padding:7%;flex:1;display:flex;flex-direction:column;text-wrap:balance;}
.wExGrOf .descr > div {margin-bottom:.3em;}
.wExGrOf img.photo {border:0;width:100%;height:62%;object-fit:cover;object-position:center;}
.wExGrOf img.etoiles {position:absolute;top:3px;left:4px;}
.wExGrOf .nom, .wExGrOf .pays, .wExGrOf .comp, .wExGrOf .lien {display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;padding-bottom:1px;}
.wExGrOf .nom {font-size: .9em;}
.wExGrOf .pays, .wExGrOf .ville {color:var(--color1f);font-size:1.1em;font-weight:bold;}
.wExGrOf .descr .prix {color:var(--color2b);font-family:sans-serif,arial,verdana;font-size:1.45em;white-space:nowrap;margin-top: 5px;margin-bottom:0;flex:1;display:flex;flex-direction:column;justify-content:flex-end;}
.wExGrOf .prix.haut {position:absolute;top:0;right:0;padding:2px 5px;min-width:35px;min-height:25px;background-color:#ffffffb3;border-radius:0 0 0 9px;}
.wExGrOf .prix.small {font-size:.8em;}
.wExGrOf .prix small {font-size:11px;}
.wExGrOf .comp {font-size:.7em;opacity:.8;}
.wPart {margin-top:6px;}
.wPart div {display:inline-block;margin-bottom:5px;}
.wPart img {box-shadow:0 0 1px #888;cursor:pointer;vertical-align:middle;}
.wGrpBtn {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	justify-content: center;
	font-size: .9em;
}
a.wBtn {
	display: inline-block;
	text-decoration: none;
	background-color: #fff;
	background-image: linear-gradient(135deg, #ffffff66 0%, transparent 30%, transparent 70%, #00000011 100%);
	border: 1px solid var(--color1d);
	border-radius: 3px;
	padding: 4px 8px;
	line-height: 1.1em;
	color: var(--color1b);
}
a.wBtn:hover {
	background-color: var(--color1d);
	color: #fff;
}
hr {height:2px;background-color:#e0e0e0;border:0;margin-top:22px;}
.masque {display:none !important;}

.galerie1 .lesTuiles > .uneTuile {display:flex;flex-direction:column;justify-content:space-between;gap:8px;}
.galerie1 .lesTuiles a.wBtn {text-decoration:none;margin: 10px 0 0;font-size:.8em;text-align:center;padding:2px 5px 5px;line-height:1.1;-webkit-line-clamp:1;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;overflow:hidden;line-height:1.5;}
.galerie1.avecCarrou .carrouBtn {top: 190px;}

/* propre à hotels */
.wEx.wHotels .wTit {margin-top:15px;}
.wEx.wHotels .wExGrOf .pays {font-size:.95em;margin-top:0;color:#000b;}
.wTitPart {font-size:.9em;margin-top:15px;}
.wCal {margin:15px 15px 0 auto;white-space:nowrap;}
.wCal #zdate {height:0;width:0;opacity:0;}
.wCal #contPeriode {display:inline-block;margin-left:10px;padding-left:5px;border:1px solid #ededed;cursor:pointer;font-size:.9em;}
.wCal #periode {opacity:.8;}
.wCal #contPeriode img {margin:0 0 2px 5px;}
.wCal #nbJours {display:inline-block;font-size:.8em;}

/* propre à sejours */
.wExGrOf .logo {position:absolute;top:3px;left:3px;opacity:0;max-width:80px;transition:all .3s;}
.wExGrOf .logo img {width:100%;max-width:90px;border-radius:7px 0 7px 0;}
.wExGrOf:hover .logo {opacity:.9;}
.wLeg {font-size:.9em;}
.wLeg > div {margin:20px 0;}
.wLeg span {display:inline-block;}

/* widget rech */
.rechWid, .rechWid2 {
	margin-top: .8em;
	color: var(--color1c);
	font-family: var(--titre-font);
}
.accorde .rechWid:first-child, .accorde .rechWid2:first-child {margin-top:0;}
.rechWid {
	width: fit-content;
	font-weight: bold;
	cursor: pointer;
	line-height: 1.2;
	display: flex;
	width: 100%;
}
.rechWid + p:not(.rechWid) {
	margin-top: 1.5em;
}
.rechWid span {
	color: #000;
	display: inline-block;
	text-decoration: none;
	margin-right: .3em;
}
.rechWid:not([onclick])::before {
	content: '\27A5';
}
.rechWid[onclick]::before {
	content: '+';
	font-weight: bold;
}
.rechWid > a {color:inherit;}


/* .marginSpe20 ; à cause de box-shadow ; utilisé dans content-region */
.widgetHotels.marginSpe20, .widgetSejours.marginSpe20 {margin-left:-15px;margin-right:-15px;}
main.marginSpe20 {margin-left:15px;margin-right:15px;}
main.marginSpe20 .wEx .galerie1 .lesTuiles {margin-left:-15px;margin-right:-15px;padding-left:15px;padding-right:15px;}
@media screen and (min-width: 990px) {
	.widgetHotels.marginSpe20, .widgetSejours.marginSpe20 {margin-left:-20px;margin-right:-20px;}
	main.marginSpe20 {margin-left:20px;margin-right:20px;}
	main.marginSpe20 .wEx .galerie1.avecCarrou .lesTuiles {margin-right:0;}
	main.marginSpe20 .wEx .galerie1 .lesTuiles {margin-left:-20px;margin-right:-20px;padding-left:20px;padding-right:20px;}
}




/* MAX */

@media screen and (max-width: 989.9px) {
	.wLeg {text-align:center;}
	.wExGrOf {box-shadow:0 0 5px .4vw #ddd;}
}




/* AFTER MOBILE */

@media screen and (min-width: 550px) {
	.wEx ul {column-width:250px;}
	.wEx.avecVilleDepart ul {column-width:270px;}
}

@media screen and (min-width: 990px) {
	.wEx ul {column-width:250px;}
	.wEx ul li div {padding:4px;}
	.wExGrOf:hover {box-shadow:0 0 0 2px #fff, 0 0 0 4px #89b2e3, 0 0 15px 6px #ebebeb;}
	.wGrpBtn {justify-content:flex-start;}
}

/* Spéciale widget-graph format carré */
.wEx.wCarre .galerie1 .lesTuiles {
	padding: 0;
	grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
	column-gap: 10px;
	/* grid-auto-flow: dense; */ /* à conserver pour memoire : auto placement lorsque l'on fait des span 2 sur certaines tuiles : grid-column-end: span 2 */
}
.wEx.wCarre .wExGrImg {border-radius:10px;}
.wEx.wCarre .galerie1 .lesTuiles .plus .wExGrImg {height:190px;}
.wEx.wCarre .wExGrOf {overflow:initial;}
.wEx.wCarre .wExGrOf .descr {display:block;padding:4px 5px;}
.wEx.wCarre .wExGrOf .pays {font-size:.9em;}
.wEx.wCarre .wExGrOf:hover .wExGrImg {box-shadow:0 0 0 2px #fff,0 0 0 4px #89b2e3;}
.wEx.wCarre .wExGrOf {box-shadow:none;}
/* *** */