/*
 _______  ______   _______  _______  ______   _______    _______  ______   _______  _______  _______  _  _  _  _______  ______   _     _ 
(_______)(_____ \ (_______)(_______)(_____ \ (_______)  (_______)(_____ \ (_______)(_______)(_______)(_)(_)(_)(_______)(_____ \ (_)   | |
 _        _____) ) _____    _______   ____) ) _____      _____    _____) ) _______  _  _  _  _____    _  _  _  _     _  _____) ) _____| |
| |      |  __  / |  ___)  |  ___  | / ____/ |  ___)    |  ___)  |  __  / |  ___  || ||_|| ||  ___)  | || || || |   | ||  __  / |  _   _)
| |_____ | |  \ \ | |_____ | |   | || (_____ | |        | |      | |  \ \ | |   | || |   | || |_____ | || || || |___| || |  \ \ | |  \ \ 
 \______)|_|   |_||_______)|_|   |_||_______)|_|        |_|      |_|   |_||_|   |_||_|   |_||_______) \_____/  \_____/ |_|   |_||_|   \_)

Version 0.9.6.0
Date 02/01/2015                                                                                 
*/

/* ################################################################################################################																		     *                                                                      							
														IMPORTS
 *###############################################################################################################*/



@import url('https://fonts.googleapis.com/css2?family=Forum&family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');




:root {
  --bleu: #91b5d5;
  --bleufonce: #749bbd;
  
}

/* 

    font-family: 'Montserrat', sans-serif;

   font-family: "Forum", serif;


*/

/* ################################################################################################################																		     *                                                                      							
														BASICS
 *###############################################################################################################*/
 
 
	html, body { margin: 0; padding: 0; border: 0; height: 100%;}
	body { 
		font-size:14px; background: #fafafa;
		color: #000;
		font-family: 'Montserrat', sans-serif;
		font-weight: 300;
		letter-spacing: 1px;
		line-height: 1.4em;
		   -webkit-font-smoothing: antialiased;
			-ms-font-smoothing: antialiased;
			-moz-osx-font-smoothing: grayscale;
			font-smoothing: grayscale;
		
	}


	body.is-loading * {
		-moz-animation: none !important;
		-webkit-animation: none !important;
		-o-animation: none !important;
		-ms-animation: none !important;
		animation: none !important;
		-moz-transition: none !important;
		-webkit-transition: none !important;
		-o-transition: none !important;
		-ms-transition: none !important;
		transition: none !important;
	}

	input, select, textarea {
		color: #aaa;
		font-size: 15px;
		font-weight: 300;
		letter-spacing: 0.025em;
		line-height: 1.75em;
	}

	a {
		-moz-transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out, background-color 0.2s ease-in-out;
		-webkit-transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out, background-color 0.2s ease-in-out;
		-o-transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out, background-color 0.2s ease-in-out;
		-ms-transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out, background-color 0.2s ease-in-out;
		transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out, background-color 0.2s ease-in-out;
		color: #000;
		text-decoration: none;
	}

	a span.ml:hover{ text-decoration: underline; }
		/*a:hover {
			border-bottom-color: #fff;
			text-decoration: none; 
			
		}
		
		a:active, a:focus { outline:0; }*/
		a img { border:0; }
		

	strong, b {font-weight: 600;	}
	p strong,p b {font-weight: 600;	}
	/*.chrome strong, b {font-weight: 600;	}*/

	p, ul, ol, dl, table, blockquote {
		margin: 0 0 2em 0;
	}
	p{ font-size: 1em; line-height: 1.6em;}

	h1, h2, h3, h4, h5, h6 {
		 font-family: ''Forum'', sans-serif;
		color: inherit;
		font-weight: 300;
		line-height: 1.3em;
		margin-bottom: 1em;
		letter-spacing: 0.07em; 
	}
	h1.light, h2.light, h3.light, h4.light, h5.light, h6.light{
		font-family: FuturaTitleLight, Arial;
	}

		h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
			color: inherit;
			text-decoration: none;
			border: 0;
		}

	h2 {
		font-size: 2.7em;
		text-transform: uppercase;
	}

	h3 {
		font-size: 2em;
		text-transform: uppercase;
	}
	
	h4 {
		font-size: 1.5em;
		text-transform: uppercase;
	}

	sub {
		font-size: 0.8em;
		position: relative;
		top: 0.5em;
	}

	sup {
		font-size: 0.8em;
		position: relative;
		top: -0.5em;
	}

	hr {
		border-top: solid 1px rgba(124, 128, 129, 0.2);
		border: 0;
		margin-bottom: 1.5em;
	}

	blockquote {
		border-left: solid 0.5em rgba(124, 128, 129, 0.2);
		font-style: italic;
		padding: 1em 0 1em 2em;
	}
	
	pre {
		margin:10px; padding:5px;
		background:#fafafa; border:1px dashed #ebebeb;
		font-family:Arial, Trebuchet MS, Helvetica, sans-serif;
		font-size:12px;
	}
	
	/**
	 * Lists
	 */
	ul { margin:0; padding:0; }
	li { list-style-type:none;}
	
	dl { margin:0; padding:0; }
	dt {}
	dd {}
	
	
	
/* ################################################################################################################																		     *                                                                      							
														ELEMENTS
 *###############################################################################################################*/
	
/* Table */

	table {
		width: 100%;
	}

		table.default {
			width: 100%;
		}

			table.default tbody tr {
				border-bottom: solid 1px rgba(124, 128, 129, 0.2);
			}

			table.default td {
				padding: 0.5em 1em 0.5em 1em;
			}

			table.default th {
				font-weight: 400;
				padding: 0.5em 1em 0.5em 1em;
				text-align: left;
			}

			table.default thead {
				background: #7c8081;
				color: #fff;
			}





/* Form */

	input[type="text"],
	input[type="password"],
	input[type="email"],
	textarea{
		-moz-transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out;
		-webkit-transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out;
		-o-transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out;
		-ms-transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out;
		transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out;
		-moz-appearance: none;
		-webkit-appearance: none;
		-o-appearance: none;
		-ms-appearance: none;
		appearance: none;
		background: none;
		border: none;
		border-bottom: 1px solid #000;
		color: #000;
		display: block;
		padding: 10px 15px;
		text-decoration: none;
		width: 96%;
		outline: 0;
		line-height: 1.3em;
	}
	textarea{
		border: 1px solid #000; 
	}
	
	select{ -moz-transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out;
		-webkit-transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out;
		-o-transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out;
		-ms-transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out;
		transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out;
		background: none;
		border: solid 1px rgba(0, 0, 0, 0.85);
		color: #000;
		display: block;
		padding: 0.65em 0.75em;
		border-right-width: 1px;
		border-right-style: solid;
		line-height: 1.3em; }

	
	.missingField label, .invalidField label { color:#EE2E24 !important; font-weight: 600; }
	.missingField input, .missingField textarea, .missingField select, .invalidField input, .invalidField textarea, .invalidField select { border-color:#EE2E24 !important; }
	.formErrors { margin:0; padding:10px 0 10px 0; }
	.formErrors li { list-style:none; margin:0px 0 5px 0; line-height:16px; color:#EE2E24 !important; font-weight: 600;}
	
	.fancybox-inner .missingField label, .fancybox-inner .invalidField label { color:#000; }
	.fancybox-inner .missingField input, .fancybox-inner .missingField textarea, .fancybox-inner .missingField select, .fancybox-inner .invalidField input, .fancybox-inner .invalidField textarea, .fancybox-inner .invalidField select { color:#000; }
	.fancybox-inner .formErrors li {  color:#000;}
	
	input[type="text"]:focus,
	input[type="password"]:focus,
	input[type="email"]:focus,
	textarea:focus, select:focus, 
	input[type="text"]:hover,
	input[type="password"]:hover,
	input[type="email"]:hover,
	textarea:hover, select:hover {
		/*border-color: rgba(0, 161, 222, 0.7);*/
		border-color: #666;
	}
	
	fieldset{ border: none !important; margin: 0; padding: 0;}
	
	
	#field-security { display: none !important; }
	.formButtons { text-align: center;}
	label { color: #666; margin-bottom: 5px; }
	.textField, .textareaField, p.selectField{ margin: 0 0 20px 0;}
	

/* Button */

	input[type="button"],
	input[type="submit"],
	input[type="reset"],
	.button {
		-moz-appearance: none;
		-webkit-appearance: none;
		-o-appearance: none;
		-ms-appearance: none;
		appearance: none;
		-moz-transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out, background-color 0.2s ease-in-out;
		-webkit-transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out, background-color 0.2s ease-in-out;
		-o-transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out, background-color 0.2s ease-in-out;
		-ms-transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out, background-color 0.2s ease-in-out;
		transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out, background-color 0.2s ease-in-out;
		background: none;
		border: 1px solid var(--bleufonce);
		color: var(--bleufonce);
		cursor: pointer;
		display: inline-block;
		font-size: 0.9em;
		font-weight: 300;
		letter-spacing: 0;
		padding: 1em 2.5em;
		line-height: 1.2em;
		text-align: center;
		text-decoration: none;
		width: auto;
		letter-spacing: 2px;
		text-transform: uppercase; 
		font-weight: 500; 
		margin: 0 7px 5px;
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		border-radius: 5px;
		
	}
	
	.button.mini {
		padding: 0.4em 1.3em;
	}
	.button.little {
		    padding: 0.5em 1em; font-size: 0.8em !important;
	}
	
	.button.inverse {
		color: #fff;
		background:var(--bleufonce);
	}
	
	

		input[type="button"]:hover,
		input[type="submit"]:hover,
		input[type="reset"]:hover,
		.button:hover {
			background: var(--bleufonce);
			border-color: var(--bleufonce);
			color: #fff !important;
		}
		.button:hover svg { color: #fff !important; }


		.button.inverse:hover {
			color: var(--bleufonce) !important;
			background:#fff;
		}
		.button.inverse:hover svg { color: var(--bleufonce) !important; }

		.button.under {
			border: none;
			border-bottom : 1px solid #fff;
			border-top : 1px solid rgba(0,0,0,0);
			padding: 1em 2em;
			margin: 0 25px 12px;
		}
		.button.under.mini {
			padding: 0.5em 1em; font-size:0.7em !important; 
			margin: 8px 10px 8px;
		}
		
		.button.under:hover {
			background: none;
			border-top :  1px solid #fff;
			color: #fff !important;
			text-decoration: none;
		}
		.button.under:hover i { color: #fff !important; }
	
		.button.square {
			border : 1px solid #fff;
			margin: 0 25px 12px;
		}
		.button.square:hover {
			/*border: none;
			border-bottom : 1px solid #fff;
			border-top : 1px solid #fff;
			text-decoration: none;*/
		}
		
		
	
	
	
	
/* Specials */


	 /**
	 * Floating elems
	 */
	.float, .floatL
	{display:inline; float:left;}
	.floatR
	{display:inline; float:right;}
	
	img.floatL, img.floatR{ display:block; }
	img.floatL{ margin: 0 20px 20px 0; }
	img.floatR{ margin: 0 0 20px 20px;  }
	
	
	/**
	 * Away elems
	 */

	.awayText
	{text-indent: -9999px; overflow: hidden; }
	.hidden
	{display: none !important;}
	
	.no-mobile .mobileZim{ display: none !important;}
	
	 /**
	 * WRAPPERS 980
	 */
	.focus
	{ margin:0 auto; width: 980px; }
	
	.clear{ clear: both; min-height: 1px;}
	.bigclear{ clear: both; height: 80px;}
	/**
	 * Overlays
	 */
	/* WHITE*/
	.overlay-w { background:rgba(255,255,255,0.7); }
	.lt-ie9 .overlay-w{
		background:none;
		filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#b2ffffff,endColorstr=#b2ffffff);
		-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#b2ffffff,endColorstr=#b2ffffff)";
		zoom: 1;
	}
	/* BLACK*/
	.overlay-b{ background:rgba(0,0,0,0.7); }
	.lt-ie9 .overlay-b{
		background:none;
		filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#b2000000,endColorstr=#b2000000);
		-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#b2000000,endColorstr=#b2000000)";
		zoom: 1;
	}

	
	.shadow{ text-shadow: 1px 1px 0px rgba(0, 0, 0, 1); }
	.shadow-w{ text-shadow: 1px 1px 0px rgba(255, 255, 255, 1); }

	
	.focusW{ width: 980px; margin: 0 auto;}
	
	
	
		
/* ################################################################################################################																		     *                                                                      							
														PAGES
 *###############################################################################################################*/



	.sfont {  font-family: 'Forum', serif; }
	.specfont {  font-family: 'Forum', serif; }
	
	
	.vcard p { margin:0; padding:0; }
	.vcard .tel .type, .vcard .geo, .vcard .uri { display:none; }	
	
	.colzim{ display: block; width: 100%;}
	
	.specialAnnounce { display:none !important;  } 
	
	
	.away{ position: relative; opacity: 0; z-index: 10;}
	.awayleft{ left: -120px;}
	.awayright{ right: -120px;}
	.awaytop{ top: -100px;}



	.littleup{ font-size: 1.2em !important; line-height: 1.2em;}
	.big{ font-size: 1.45em !important; line-height: 1em; }
	.super { font-size: 2em !important; line-height: 1em; }
	.mega { font-size: 3.2em !important; line-height: 1em; }
	.ultra { font-size: 4.2em !important; line-height: 0.9em; }
	
	.little{ font-size: 1.2em !important }
	
	.fontreset{ font-size: 1em !important }
	.mini{ font-size: 0.8em !important; line-height: 1em; display: inline-block; }
	.tiny{ font-size: 0.7em !important; line-height: 1em; display: inline-block; }
	.micro{ font-size: 0.6em !important; line-height: 1em; display: inline-block; }
	
	.maj{ text-transform: uppercase; }

	
	.justified *, .justified { text-align: justify }
	p.justified, .justified p{ line-height: 1.5em; }
	.centered *, .centered, .centeredlist > li p.centered{ text-align: center; }
	.righted *, .righted, .centeredlist > li p.righted{ text-align: right; }
	.lefted *, .lefted, .centeredlist > li p.lefted{ text-align: left; }
	.bigmargin{ margin-top: 50px!important; margin-bottom: 50px !important;}
	.supermargin{ margin-top: 80px!important; margin-bottom: 80px !important;}
	.megamargin{ margin-top: 150px!important; margin-bottom: 150px !important;}
	.notitle{ margin: 50px 0 0 0;}	
	.fontplus{ font-size: 1.15em;}
	
	.titlepadding{ padding-top: 95px;}
	.titlepaddingmini{ padding-top: 50px;}
	.titlepaddingmadium{ padding-top: 150px;}
	.titlepaddingbig{ padding-top: 200px;}
	.bottompadding{ padding-bottom: 30px;}
	
	.nomargintop{ margin-top: 0 !important;}
	.nomarginbottom{ margin-bottom: 0 !important;}
	
	.sidepadding{ padding: 0 25px; width: auto !important;}
	
	
	.centeredlist{  display: table; width: 100%; text-align: center;}
	.centeredlist95{  margin-left: 2.5%!important; margin-right: 2.5%!important; width: 95%}
	.centeredlist90{  margin-left: 5%!important; margin-right: 5%!important; width: 90%}
	.centeredlist85{  margin-left: 7.5%!important; margin-right: 7.5%!important; width: 85%}
	.centeredlist80{  margin-left: 10%!important; margin-right: 10%!important; width: 80%}
	.centeredlist75{ margin-left: 12.5%!important; margin-right: 12.5%!important; width: 75%}
	.centeredlist70{ margin-left: 15%!important; margin-right: 15%!important; width: 70%}
	.centeredlist60{ margin-left: 20%!important; margin-right: 20%!important; width: 60%}
	.centeredlist50{ margin-left: 25%!important; margin-right: 25%!important; width: 50%}
	.centeredlist40{ margin-left: 30%!important; margin-right: 30%!important; width: 40%}

	
	.centeredlist > li, .centeredlist.col3 > li, .centeredlist.col4 > li{ display: inline-block; vertical-align: top; position: relative;}
	.centeredlist > li.over{ z-index: 15}
	.centeredlist > li{ width: 45.5%; }
	.centeredlist > li div.cellW{ height: 100%; }
	.centeredlist > li:nth-child(odd){ }
	.centeredlist > li:nth-child(even){ }
	
	.centeredlist > li.col25{ width: 23.5%; margin: 0 0.75%; }
	.centeredlist > li.col25.colbigspace{ width: 23%; margin: 0 5%; }
	.centeredlist > li.col30{ width: 30%; margin: 0 1.5%; }
	.centeredlist > li.col33{ width: 32%; margin: 0 0.5%; }
	.centeredlist > li.col40{ width: 37%; margin: 0 1.5%; }
	.centeredlist > li.col45{ width: 43%; margin: 0 1.5%;}
	.centeredlist > li.col50{ width: 47%; margin: 0 1.5%; }
	.centeredlist > li.col60{ width: 57%; margin: 0 1.5%;}
	.centeredlist > li.col70{ width: 67%; margin: 0 1.5%;}
	.centeredlist > li.col100{ width: 100%; }
	
	.centeredlist.col3 > li{ width: 30%; margin: 0 1.5%}
	.centeredlist.col4 > li{ width: 22%; margin: 0 1.5%}

	
	.centeredlist > li.decalleft{ margin-left: 19%}
	.centeredlist > li.decalleftmini{ margin-left: 9%}
	.centeredlist > li.decalright{ margin-right: 19%}
	.centeredlist > li.decalrightmini{ margin-right: 9%}
	
	
	
	.paddingbox{ padding: 45px;}
	
	.flexi{ display: flex;}
	.flexilist{ display: flex; flex-wrap: wrap;}
	
	
	/*
	.greyblackBG .button.under { border-bottom : 1px solid #fff;	border-top : 1px solid #1a171b; color: #fff;	}
	.greyblackBG .button.under:hover { border-top : 1px solid #fff;	}*/



	/*.centeredlist p{ font-size: 1.15em; line-height: 1.4em;}*/
	

	
	.screenCarouselZoomW{ width: 100%; height: 100%; position: absolute; top: 0; left: 0; overflow: hidden; }
	.screenCarouselZoom{ width: 100%; height: 100%; }
	.carouselZoomZim, .carouselZoomZimW{ display: block; position: absolute; }
	.carouselZoomZimW{ opacity: 0;}
	.bottomOverlay{ 
		display: block; width: 100%; height: 100%; position: absolute; z-index: 200; bottom: 0; left: 0;
		background: url(zims/frontend/degrad-repeat.png) repeat-x center bottom; }

	
	.carouselZoomZim {
		 /* image à l'échelle 1 au départ */
	   -webkit-transform: scale(1.1);
	   -moz-transform: scale(1.1);
	   -o-transform: scale(1.1);
	   -ms-transform: scale(1.1);
	   
	   transform: scale(1.1);
	}
   
	.carouselZoomZim.scale{
		 /* propriétés de transition */
	   -moz-transition:all 6s ease-out;
	   -webkit-transition:all 6s ease-out;
	   -o-transition:all 6s ease-out;
		transition:all 6s ease-out;
		transform: translate3d(0px, 0px, 0px) scale(1);
	}
	
	
	
	#ZoomHalfBanner{ height: 50vh; position: relative; overflow: hidden; background: #ddd;  }
	#ZoomHalfBanner h2{  z-index: 500; font-size: 3em; right: 0; position:relative;
		margin: 0; color: #fff; text-shadow: 1px 1px 3px rgba(0,0,0,1); text-align: center; width: 100%}
	#ZoomHalfBanner h2 img{ max-width: 300px }
	
	#CarouselArrows{ display: none; }
	#CarouselArrows a{ font-size: 6em; position: absolute; top: 30vh;  z-index: 990;  text-shadow: 2px 2px 1px rgb(0 0 0);}
	#CarouselArrows a svg{ color: #fff;}
	#CarouselPrev{ left: 2%; }
	#CarouselNext{ right: 2%; }
	
	

	.contactBlock{ display: inherit;}
	.contactBlock p{ margin-bottom: 10px;}
	.contactBlock p svg, .contactBlock p i{ display: block; float: left; font-size: 1.5em;}
	.contactBlock p span.line{ display: block; padding: 0 0 10px 40px; text-align: left;}

	.contactBlockLinks{ display: inline-block; float: right;}
	
	
	
	.bottomSwing{ 
		z-index: -1; overflow: hidden; height: 120px; width: 65%; 
		position: absolute; bottom:0; right:0;
	}
	
	.bottomSwing div {
		position: absolute;
		bottom: -90px;
		left: -10%;
		height: 120px;
		width: 120%;
		transform: rotate(-6deg); 
	}
	
	.bottomSwing.orange div {
		background: var(--bleufonce);
	}
	
	
	
	.themecolor{ color: var(--bleufonce)}
	.altcolor{ color: var(--bleufonce); }
	.yellowcolor{ color: #FDC600; }
	
	
	.greybg{ background-color: #F3F2F4 }
	
	
	.formPopup h4{ font-size: 1.8em; padding: 15px 0; }
	
	#TypeTitle{ opacity: 0;}
	.typeLetter{ opacity: 0;}


 /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * GENERAL * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
 
 
	/* 
	
	VERT var(--bleufonce)
	JAUNE #fdc513
	ORANGE #ee7408
	ROUGE #e61345
	
	ROUGE CL #ed686d
	
	*/
	
/* HEADER */

	
	#Header { 
		position: fixed; top: 0; width: 100%; z-index: 1000; height: 100px;
		-moz-transition: all 0.2s ease-in-out;
		-webkit-transition: all 0.2s ease-in-out;
		-o-transition: all 0.2s ease-in-out;
		-ms-transition: all 0.2s ease-in-out;
		transition: all 0.2s ease-in-out;
		background-color: #fff; 
	}
	.scrolled #Header { height: 80px; border-bottom: 1px solid #ddd; }
	.forcedHeader #Header { border-bottom: 1px solid #ddd; }
	/*.scrolled #Header, .forcedHeader #Header{ background-color: rgba(30,30,30,1); border-bottom: 1px solid #fff; }*/

	
	#HomeLinkW { position: relative; text-align: left; z-index: 5002; margin: 0 0 0 3.5%; display: inline-block;}
	#HomeLinkW a{ display: inline-block; }
	#HomeLinkW a img{ width: 160px; padding: 15px 0 8px;
		-moz-transition: width 0.2s ease-in-out, padding 0.2s ease-in-out;
		-webkit-transition: width 0.2s ease-in-out, padding 0.2s ease-in-out;
		-o-transition: width 0.2s ease-in-out, padding 0.2s ease-in-out;
		-ms-transition: width 0.2s ease-in-out, padding 0.2s ease-in-out;
		transition: width 0.2s ease-in-out, padding 0.2s ease-in-out;  }

	.forcedHeader #HomeLinkW a img{ width: 135px; padding-top: 5px; }	
	.scrolled #HomeLinkW a img{ width: 135px; padding-top: 5px; }	
	
	
	
	#UpperBseline{ position: absolute; top: 25px; left: 25%; width: 50%; letter-spacing: 0; font-size: 1.5em; color: var(--bleufonce); margin-bottom: 0;
		margin-top: 10px;
		-moz-transition: all 0.2s ease-in-out;
		-webkit-transition: all 0.2s ease-in-out;
		-o-transition: all 0.2s ease-in-out;
		-ms-transition: all 0.2s ease-in-out;
		transition: all 0.2s ease-in-out;
	}
	.scrolled #UpperBseline{ margin-top: 0;   }

	
	
	

/* MAIN MENU */

	#Nav{ position: fixed; top: 0; width: 100%; height: auto; z-index: 5001;}
	#Nav.open{ height: 100%; }
	
	
	

	#UpperNav{ position: absolute; z-index: 2040;  width: 100%; }
	
	#UpperMenu{ position: absolute; z-index: 2020; right: 6%; }
	#UpperMenu ul{ 
		width: 100%; height: 100px; display: flex; }
	.scrolled #UpperMenu ul{ height: 80px; }
	#UpperMenu ul li{ 
		min-width: 100px;
		height: 100%;
	}
	
	
	#UpperMenu ul li a{ 
		display: flex; align-items: center; justify-content: center; color: #000; text-transform: uppercase; font-size: 1em;
		text-align: center; line-height: 1em;
		padding: 20px 15px; height: 100%; letter-spacing: 0;
		-moz-transition: all 0.2s ease-in-out;
		-webkit-transition: all 0.2s ease-in-out;
		-o-transition: all 0.2s ease-in-out;
		-ms-transition: all 0.2s ease-in-out;
		transition: all 0.2s ease-in-out;
	}
	.scrolled #UpperMenu ul li a{ padding-top: 16px;}
	#UpperMenu ul li a:hover{ 
		 background: var(--bleufonce);
		 color: #fff;
	}
	.open #UpperMenu ul li a.colorlegend{ 
		 color: #fff;
	}

	/*#UpperMenu ul li a span{ 
		display: inline-block; position: relative;  background: var(--bleufonce); padding: 13px 10px;
		color: #fff; margin-bottom: 7px;
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		border-radius: 5px;
		border: 1px solid var(--bleufonce);
		width: 48px; height: 48px;
	}
	.open #UpperMenu ul li a.colorlegend span{ 
		 border-color: #fff;
	}


	#UpperMenu ul li a svg{ font-size: 1.8em; color: #fff;}
	#UpperMenu ul li a img{ height: 18px; }
	
	.open #UpperMenu ul li a.colorlegend svg{ 
		 color: #fff;
	}*/
	
	
	#UpperMenu ul li.rsicons { margin-right: 100px;  }
	#UpperMenu ul li.rsicons a { padding: 32px 10px 20px; }
	.scrolled #UpperMenu ul li.rsicons a { padding: 23px 10px 20px; }
	
	#UpperMenu ul li.rsicons a:hover{ 
		 background: #fff;
		 color: var(--bleufonce);
	}
	

	#UpperMenu ul li.rsicons a svg{ font-size: 2.4em; color: var(--bleufonce); position: relative; top: 6px;}
	
	#UpperMenu ul li.rsicons a:hover svg{ color: var(--bleufonce);}
	
	
	
	
	#UpperSwing{ z-index: 1; overflow: hidden; height: 120px; width: 60%; 
		position: fixed; top:50px; right: 2.5%;
		moz-transition: all 0.2s ease-in-out;
		-webkit-transition: all 0.2s ease-in-out;
		-o-transition: all 0.2s ease-in-out;
		-ms-transition: all 0.2s ease-in-out;
		transition: all 0.2s ease-in-out;
	}
	
	#UpperSwing div {
		position: absolute;
		width: 100%;
		bottom: 45px;
		height: 120px;
		width: 120%;
		background: var(--bleu);  transform: rotate(6deg); 
	}
	.scrolled #UpperSwing{ top:-100px; }
	
	


	 /* ANIMATED MENU ICO */
	 
	#NavIco {
		display: block; position: fixed; z-index: 5001; height: 25px; width: 32px;
		right: 2.5%; top: 36px;
		-webkit-transform: rotate(0deg);
		-moz-transform: rotate(0deg);
		-o-transform: rotate(0deg);
		transform: rotate(0deg);
		-webkit-transition: .3s ease-in-out;
		-moz-transition: .3s ease-in-out;
		-o-transition: .3s ease-in-out;
		transition: .3s ease-in-out;
		cursor: pointer;
	}
	.scrolled #NavIco { top: 28px;}
	#NavIco span {
		display: block;
		position: absolute;
		height: 2px;
		width: 100%;
		background: var(--bleufonce);
		border-radius: 9px;
		opacity: 1;
		left: 0;
		-webkit-transform: rotate(0deg);
		-moz-transform: rotate(0deg);
		-o-transform: rotate(0deg);
		transform: rotate(0deg);
		-webkit-transition: .25s ease-in-out;
		-moz-transition: .25s ease-in-out;
		-o-transition: .25s ease-in-out;
		transition: .25s ease-in-out;
	}
	

	#NavIco span:nth-child(1) { top: 0px; 	}
	#NavIco span:nth-child(2),#NavIco span:nth-child(3) {  top: 9px;	}
	#NavIco span:nth-child(4) { top: 18px; }

	#NavIco.active span:nth-child(1) {
	  top: 18px;
	  width: 0%;
	  left: 50%;
	}

	#NavIco.active span:nth-child(2) {
	  -webkit-transform: rotate(45deg);
	  -moz-transform: rotate(45deg);
	  -o-transform: rotate(45deg);
	  transform: rotate(45deg);
	}

	#NavIco.active span:nth-child(3) {
	  -webkit-transform: rotate(-45deg);
	  -moz-transform: rotate(-45deg);
	  -o-transform: rotate(-45deg);
	  transform: rotate(-45deg);
	}

	#NavIco.active span:nth-child(4) {
	  top: 18px;
	  width: 0%;
	  left: 50%;
	}
	.open #NavIco span { background: #fff!important;}

	#NavIco strong {
		position: absolute;
		left: 55px; font-size: 1.1em;
		line-height: 1em;
		top: 3px; color: #fff;
		text-transform: uppercase;
		font-weight: normal;
		display: none;
	}
	
	/*
	#NavIco{ 
		display: block; position: fixed; z-index: 5001; height: 50px; width: 50px;
		left: 2%; top: 18px; font-family: 'Questrial', sans-serif;
		background: url(zims/buttons/minimenu-w.png) no-repeat center; border: none;	
		transition: none;
	}
	#NavIco.active{ background: url(zims/buttons/minimenu-ico.png) no-repeat center;  }
	#NavIco span {
		position: absolute;
		left: 55px; font-size: 1.1em;
		line-height: 1em;
		top: 18px; color: #fff;
		text-transform: uppercase;
	}*/
	
	
	#MenuW{ overflow: visible; width: 100%; height: 100%; position: absolute; z-index: 2030; top: 0;
	}
	
	#MenuOverlay{ 
		background: rgba(255,255,255,0.5);
		height: 100%; width: 100%; top: 0; left: 0;
		position: absolute; z-index: 900; 
	}
	#Menu{ overflow: visible;
		background: rgba(88,137,180,0.9);
		/*url(zims/frontend/menu-deco.jpg) no-repeat left top;*/
		height: 100%;
		position: absolute; z-index: 1000; opacity: 0; overflow: visible;
		height: 100%; width: 27%;
	}
	

	#MainMenuW{ padding-top: 150px; margin-bottom: 30px; }

	#MainMenu > li{  }

	#MainMenu > li > a, #MainMenu > li > strong{ 
		display: block;
		font-family: 'Forum', sans-serif;
		background: url(zims/frontend/menu-line-w.gif) no-repeat left bottom;
		padding: 18px 0 21px 35px; min-height: 30px; text-transform: uppercase;
		font-weight: 300; color: #fff; font-size: 1.5em; cursor: pointer; text-align: left; 
		-moz-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
		-webkit-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
		-o-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
		-ms-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
		transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;	
		}
	#MainMenu > li:last-child > a, #MainMenu > li:last-child  > strong{ background: none; }
		
	#MainMenu > li > a:hover, #MainMenu > li > strong:hover, #MainMenu > li.actived > a, #MainMenu > li.actived > strong{  color: #000; text-decoration : none; background-color: #fff }
	
	#MainMenu > li > a svg, #MainMenu > li > strong svg{  margin-left: 10px;}
	
	
	#MainMenu li ul { overflow: hidden;
		-moz-transition: all 0.2s ease-in-out;
		-webkit-transition:  all 0.2s ease-in-out;
		-o-transition: all 0.2s ease-in-out;
		-ms-transition:  all 0.2s ease-in-out;
		transition:  all 0.2s ease-in-out;	 }
	#MainMenu li.actived ul { height: auto; }
	
	#MainMenu li ul > li{    }
		

	#MainMenu li ul > li.HTMLMenuW-Level2:hover > a{ background: #000; color: #fff; }
	
	
	
	#MainMenu li ul > li > a{ 
		display: block; 
		font-weight: 300; color: #fff; font-size: 1.1em; cursor: pointer; text-transform: none; text-transform: uppercase;  
		padding: 8px 0 8px 55px
		}
	#MainMenu li ul > li > a img{  }
	#MainMenu li ul > li > a:hover{ text-decoration : none; color: #000; text-decoration : none; background-color: #fff }
	
	
	#MainMenu li ul > li > ul{ opacity: 0; 
		-moz-transition: opacity 0.3s ease-in-out;
		-webkit-transition: opacity 0.3s ease-in-out;
		-o-transition: opacity 0.3s ease-in-out;
		-ms-transition: opacity 0.3s ease-in-out;
		transition: opacity 0.3s ease-in-out; }
	
	#MainMenu li ul > li.HTMLMenuW-Level2:hover > ul{ opacity: 1; }

	#MainMenu li ul > li > ul > li{
		/*background: url(zims/frontend/menu-line-b.gif) no-repeat -30px 11px;*/
		padding-left : 25px; 
	}
	
	
	
	
	
	
	
	
	
	
	#SecondaryMenu{ }
	#SecondaryMenu > li > a, #SecondaryMenu > li > strong{ 
		display: block;
		padding: 2px 0 2px 45px; 
		font-weight: 300; color: #fff; font-size: 1em; cursor: pointer; text-align: left; 
	}
	#SecondaryMenu li > a:hover{ text-decoration : underline; }
	
	#Copyrights{ padding: 0 40px; font-size: 0.8em; line-height: 1.2em; position: absolute; bottom: 0; color: #fff; }
	#Copyrights a.linked{ font-size: 2.5em; margin-right: 20px; color: #fff;  }

		
		
	#LangsW{ position: absolute; left: 13%; top: 31px; width: 50px; z-index: 5010; }
	#LangsW #LangOpen{ display: block; float: left;  color: #fff; font-size: 1.4em; }
	#LangLinks{ float: right;  }
	#LangLinks li{ text-align: right } 
	#LangLinks li a{ color: #fff; text-transform: uppercase;  padding-right: 10px;} 
	#LangLinks li.disabled{ display: none;} 	
		
		
		
		
	/* FOOT */
	
	#FooterW{ min-height: 200px;  border-top: 4px solid var(--bleufonce); position: relative; z-index: 10; }
	#Footer{ color: #111; background: #fafafa; padding: 25px 3% 15px; position: relative; z-index: 1; }
	#Footer a{ color: #111; }
	
	#FooterMenu{ display: inline; float: left; width: 30%}
	#FooterNews{ display: inline; float: left; width: 40%}
	#FooterAddr{ display: inline; float: left; width: 30%; }
	#FooterBottom{ clear: left;}
	
	
	
	#FooterMenu { margin-top: 5px; }
	#FooterMenu li{ text-transform: uppercase; margin-bottom: 8px;}
	#FooterMenu li a{ font-size: 0.9em;}
	#FooterMenu li a:hover{ text-decoration: underline;}
	
	#FooterAddr { text-transform: uppercase; text-align: right; margin-top: 5px; line-height: 1.6em; font-size: 0.9em; }
	#FooterAddr #Gmap{ text-transform: none; padding: 4px 8px; letter-spacing: 0; margin: 5px 0; }
	#FooterAddr .socialLink{ font-size: 1.5em; margin-left: 7px; }
	
	#FooterNews{ position: relative; }
	
	#FooterNews p.title{ text-align: center; font-size: 1.3em; margin-bottom: 15px;}
	#FooterNews .textField { display: inline; float: left; margin: 0; width: 25%;}
	#FooterNews .textField label { display: none; float: left; }
	#FooterNews .textField input { border-right: none; border-top: none; border-left: none; text-align: center; border-color: #666;}
	#FooterNews .formButtons{ width: auto; float: right;}
	#FooterNews .formButtons input{ padding: 8px 10px 5px;}
	
	#FooterNews #field-valid{ position: absolute; bottom: -55px; left: 0;  margin: 0; line-height: 0.9em; }
	#FooterNews #field-valid label{ font-size: 0.9em; color: #666; }
	
	#FooterNews #field-email{ margin: 0 2.5%; width: 42% }
	
	#NewsletterForm { margin: 0;}
	
	
	
	#FootNewsErrors{ color:#EE2E24; margin-bottom: 10px; display: block;}
	#FootNewsCheck{ display: block; position: absolute; bottom: 0; right: 0; font-size: 2.2em; display: none; }
	
	#FooterSocials{ display: block; margin-top: 30px;}
	#FooterSocials a{  color: var(--bleufonce) !important;}
	#FooterSocials svg { font-size: 2.4em; color: var(--bleufonce) !important;}

	#AllLink{ text-align: center; text-transform: uppercase; font-size: 1em; }
	#AllLink img{ display: inline-block; margin-bottom: 8px; width: 120px; }
	#Credits{ float: left; text-align: left; font-size: 0.8em; margin-top: -80px; line-height: 1.2em; }
	
	#FooterW .button,  #FooterW .submitButton { border: 1px solid #666; color: #222; }
		
	#Mentions{ font-size: 0.9em;}
	
	
	#FooterSwing{ z-index: 1; overflow: hidden; height: 100px; width: 50%; 
		position: absolute; top:-100px; left: 0; background: none;}
	
	#FooterSwing div {
		position: absolute;
		width: 100%;
		top: 80px;
		height: 120px;
		width: 120%;
		left: -10%;
		background: var(--bleufonce);  transform: rotate(6deg); 
	}

	
	/* Content */

	#ContentW { width: 100%; margin: 0; min-height: 100vh; }

	
	#Content{ padding: 0 0 50px 0; min-height: 100vh;}
	.forcedHeader #Content{ padding-top: 100px;}
	
	#Content > h2{ text-align: right; padding-right: 3vw;}
	
	
	
	
	#OverlayLoad{ height: 100%; width: 100%; position: fixed; top: 0; left: 0; z-index: 9999; background: #91b5d5 url(zims/loader/loader2.gif) no-repeat center; }
	
	
	/* Global */
	
	.itemBG{ position: relative; display: block; z-index: 5; width: 100% }
	
	
	
	
	
	
	
	

	/* HOME */
	
	
	#page-home #Content *{ }
	
	/*#page-home #ContentW, #page-home #Content { height: 100%; }*/
	#page-home #Content{ padding:0; min-height: auto;}
	
	#VideoW {
		box-sizing: border-box;
		height: 95vh;
		left: 2.5%;
		position: fixed;
		top: 0;
		width: 95%;
		z-index: 0;
		overflow: hidden;
	}
	#VideoHome{ position: absolute; z-index: -1;}
	.vjs-text-track-display {display: none; }
	#VideoW video, #VideoW .video-js{display: block; }
	
	#ScreenVideoHead{ padding-top: 80px;}
	
	
	#VideoOverlay{ overflow: hidden; top: 0; left: 0;position: relative; z-index: 10; background: rgba(0,0,0,0.1); padding: 0 !important;}
	/*#HomeZimW-Mob{ position: fixed;}*/ /* Animated*/
	#HomeZimW-Mob{ position: relative;}

	.videopanelW{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
	.videopanel{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
	
	#VideoPanel2{ position: absolute; z-index: 1;}
	#VideoPanel3{ position: absolute; z-index: 2;}
	#VideoPanel4{ position: absolute; z-index: 4;}
	#VideoPanel5{ position: absolute; z-index: 5;}
	
	
	.videoOverlay, #VideoHomeCache{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 10;}
	.videoOverlay.overB{ background: rgba(0,0,0,0.3); }
	.videoOverlay.overW{ background: rgba(255,255,255,0.3); }
	
	#VideoHomeCache{ background: #000; display: none; z-index: 0}
	
	
	#VideoSwing{ z-index: 0; overflow: hidden; height: 120px; width: 60%;  bottom: 80px;
		position: absolute; left:0;}
	
	#VideoSwing div {
		position: absolute;
		bottom: -90px;
		left: -10%;
		height: 120px;
		width: 120%;
		background: #FDC600;  transform: rotate(6deg); 
	}
	
	.video-js .vjs-tech {
		top: -8vh;
	}
	
	
	
	
	
	#HomeTitleW{
		position: absolute; bottom: 20%;
		width : 100%;
		z-index: 100;
	}
	#HomeTitleW h2 { text-align: left; /*text-shadow: 2px 2px 0px rgba(0, 0, 0, 1);*/ color: #fff; padding-left: 5%;}
	
	#HomeTitleW h2 { font-size: 2.5em; font-weight: 400;  letter-spacing: 3px; }
	#HomeTitleW h2 span{  font-size: 0.7em; font-weight: 400; font-style: normal;}

	#HomeTitleMore { display: block; position: absolute; right: 5%;  bottom:20%;  font-size: 1em; text-align: center; background: var(--bleufonce); border-radius: 5px; padding: 15px; color: #fff; z-index: 600;}
	#HomeTitleMore svg { font-size: 3em; margin-bottom: 5px; transition: color 0.3s ease-in-out;  }
	#HomeTitleMore:hover { color: var(--bleufonce); background: #fff  }
		
		
		
	#HomeSlogan{ font-size: 1.8em;}
	#HomeSloganBL{ opacity: 0; }
		
		
		
		
		
		
		
		
	.screenZimW, .screenCarouselW, .screenCarouselZoomW{ width: 100%; height: 100%; position: absolute; top: 0; left: 0; overflow: hidden; z-index: 0;}
	.screenZim, .carouselZim, .carouselZoomZim, .carouselZoomZimW{ display: block; position: absolute; }
	.screenZim{ display: none;}
	.screenCarouselW{ display: none;}
	.carouselZim, .carouselZoomZimW{ opacity: 0;}
	
	/*.screenCarouselZoomW.half{ height: 50%;}*/
	.screenCarouselZoom{ height: 100%; width: 100%; background: #ddd url(zims/loader/loader3.gif) no-repeat center;}
	

	
	.carouselZoomZim {
		 /* image à l'échelle 1 au départ */
	   -webkit-transform: scale(1.05);
	   -moz-transform: scale(1.05);
	   -o-transform: scale(1.05);
	   -ms-transform: scale(1.05);
	   
	   transform: scale(1.05);
	}
   
	.carouselZoomZim.scale{
		 /* propriétés de transition */
	   -moz-transition:all 5s ease-out;
	   -webkit-transition:all 5s ease-out;
	   -o-transition:all 5s ease-out;
		transition:all 5s ease-out;
		transform: translate3d(0px, 0px, 0px) scale(1);
	}
	
	
	
	
	#ZoomHalfBanner{ height: 300px; position: relative; overflow: hidden;}
	#ZoomHalfBanner.hotel{ height: 70vh; }
	#page-home #ZoomHalfBanner{ height: calc(100vh - 100px); min-height: 500px;  }

	
	#ZoomHalfBanner #MainTitleW{ position: absolute; z-index: 1000; bottom: 150px; left: 5%;}
	#page-home #ZoomHalfBanner #MainTitleW{ bottom: 180px; }
	#ZoomHalfBanner #MainTitleW h2{  font-size: 3.5em; line-height: 1em; margin: 0; color: #fff; text-shadow: 3px 3px 10px rgba(0,0,0,0.8);}
	#page-home #ZoomHalfBanner #MainTitleW h2{ font-size: 4.5em;  }
	#ZoomHalfBanner #MainTitleW p.buttonW{  display: inline-block; float: right; margin-top: 20px;}
	#ZoomHalfBanner #MainTitleW p.buttonW a{  background: #fff; border: none; color: #77406f; text-transform: uppercase; font-size: 1.2em; font-weight: 600; font-style: italic; }

		
		
		
	#CarouselBottom{ position: absolute; bottom: 150px; left: 49%; z-index: 100;}
	 #CarouselBottom a {}
	 #CarouselBottom a span {
	  position: absolute;
	  top: 0;
	  left: 50%;
	  width: 80px;
	  height: 80px;
	  margin-left: -23px;
	  border: 2px solid #fff;
	  border-radius: 100%;
	  box-sizing: border-box;
	}
	#CarouselBottom a:hover span { border-color: #0066a6; }
	 
	#CarouselBottom a span::after {
		position: absolute;
		top: 50%;
		left: 50%;
		content: '';
		width: 16px;
		height: 16px;
		margin: -12px 0 0 -8px;
		border-left: 2px solid #fff;
		border-bottom: 2px solid #fff;
		-webkit-transform: rotate(-45deg);
		transform: rotate(-45deg);
		box-sizing: border-box;
	}
	#CarouselBottom a:hover span::after{ border-color: #0066a6; }
	
	#CarouselBottom a span::before {
		position: absolute;
		top: 0;
		left: 0;
		z-index: -1;
		content: '';
		width: 80px;
		height: 80px;
		box-shadow: 0 0 0 0 rgba(0,0,0,.2);
		border-radius: 100%;
		opacity: 0;
		-webkit-animation: sdb03 3s infinite;
		animation: sdb03 3s infinite;
		box-sizing: border-box;
	}
	
	@-webkit-keyframes sdb03 {
	  0% {
		opacity: 0;
	  }
	  30% {
		opacity: 1;
	  }
	  60% {
		box-shadow: 0 0 0 60px rgba(255,255,255,.1);
		opacity: 0;
	  }
	  100% {
		opacity: 0;
	  }
	}
	@keyframes sdb03 {
	  0% {
		opacity: 0;
	  }
	  30% {
		opacity: 1;
	  }
	  60% {
		box-shadow: 0 0 0 60px rgba(255,255,255,.1);
		opacity: 0;
	  }
	  100% {
		opacity: 0;
	  }
	}
		
		
		
		
	.homeSectionW{ min-height: 500px;  width: 100%; height: 100%;  }
	.homeSection{  padding: 50px 0;  position: relative;}
	
	
	#SoonPopupW{ display: none;}
	#SoonPopup{ margin: 100px 150px;}
	
	
	/* --------TEMP MKT--------- */
	
	.backToHome{ display: block; height: 100%; width: 100%; left: 0; top: 0; z-index: 500; position: absolute; }
	
	
	.mktDiv img{ position: relative; width: 100% }
	
	/*#page-recherche-multi-criteres #Content, #page-recherche-geographique #Content, #page-nos-hotels #Content{ overflow: hidden; }
	#page-recherche-multi-criteres, #page-recherche-geographique, #page-nos-hotels { overflow-y: scroll; }*/
	
	
	 /*VIDEO*/
	/*#page-home #ContentW{ padding-top: 100vh;}*/
	
	#page-home #ContentW{ padding-top: 100px;}
	
	#ContentZone{ position: relative; z-index: 5; padding: 80px 0;}
	
	
	
	
	
	.programmeW {
		height: 35vh;
		color: #fff;
		background-image: url(../media/images/deco/occ.jpg);
		background-position: 50%;
		background-repeat: no-repeat;
		background-size: 100%;
		flex-direction: column;
		justify-content: flex-end;
		padding-bottom: 20px;
		padding-left: 2.5rem;
		padding-right: 2.5rem;
		transition: all .6s;
		display: flex;
		position: relative;
	}
	.programmeW.skin-na{ background-image: url(../media/images/deco/na.jpg);}
	.programmeW.skin-idf{background-image: url(../media/images/deco/idf.jpg);}
	
	.programmeW:hover {
		background-size: 105%;
		padding-bottom: 25px;
	}
	
	.programmeOverlay {
		display: block;
		z-index: 1;
		width: 100%;
		height: 100%;
		background-image: linear-gradient(rgba(255,255,255,0),rgba(18,69,83,.85));
		position: absolute;
		top: 0%;
		bottom: 0%;
		left: 0%;
		right: 0%;
	}
	.programmeText {
		display: block;
		z-index: 2;
		position: relative;
		text-align: left;
	}
	.programmeText h4 {
		display: block;
		color: #fff;
		font-size: 1.5em;
		font-weight: 400;
		line-height: 1.5rem;
	}
	.programmeText span.link {
		display: block;
		color: #fdc513;
		align-items: center;
		margin-top: 1rem;
		font-size: 1.2em;
		font-weight: 500;
		line-height: 1.25rem;
		font-weight: 600;
	}
	
	.skin-na .programmeText span.link{ color: #ee7408;}
	.skin-idf .programmeText span.link{ color: #ed686d;}
	
	
	
	.cleantitle{ }
	.cleantitle svg{ }
	
	
	
	
	
	
	.shadLinkW {
		min-height: 180px;
		flex-direction: column;
		justify-content: center;
		padding-top: 15px;
		padding-bottom: 30px;
		padding-left: 2.5rem;
		padding-right: 2.5rem;
		transition: all .6s;
		display: flex;
		position: relative;
		background: #F3F2F4;
		-webkit-border-radius: 10px;
		-moz-border-radius: 10px;
		border-radius: 10px;
		color: #111;
		-moz-transition: all 0.3s ease-in-out;
		-webkit-transition:all 0.3s ease-in-out;
		-o-transition: all 0.3s ease-in-out;
		-ms-transition:all 0.3s ease-in-out;
		transition: all 0.3s ease-in-out;
	}
	.shadLinkW:hover {
		-webkit-box-shadow: 3px 3px 11px 0px rgba(0,0,0,0.25); 
		box-shadow: 3px 3px 11px 0px rgba(0,0,0,0.25);
	}
	.shadLinkW img {
		max-height: 50px;
	}
	
	.programmeText {
		display: block;
		z-index: 2;
		position: relative;
		text-align: left;
	}
	.shadLinkText svg { 
		color: var(--bleufonce);
		margin-bottom: 12px;
	}
	.shadLinkText svg.yellowcolor {
		color: #FDC600;
	}
	
	.shadLinkText h4 {
		display: block;
		font-size: 1.5em;
		font-weight: 400;
		line-height: 1.5rem;
	}
	.shadLinkText span.link {
		display: block;
		
		align-items: center;
		margin-top: 1rem;
		font-size: 1.2em;
		font-weight: 500;
		line-height: 1.25rem;
		font-weight: 600;
	}
	
	.shadLinkText p.hoverdesc {
		height: 0; overflow: hidden; opacity: 0;
		line-height: 1.2em;
		font-size: 0.9em; margin: 0;
		-moz-transition: all 0.3s ease-in-out;
		-webkit-transition:all 0.3s ease-in-out;
		-o-transition: all 0.3s ease-in-out;
		-ms-transition:all 0.3s ease-in-out;
		transition: all 0.3s ease-in-out;
	}
	.shadLinkW:hover p.hoverdesc{
		opacity: 1;
		height: auto;
	}
	
	
	
	.colorbox{
		background: var(--bleufonce) url(../media/images/forme-w-20p.svg) no-repeat 10px -5px;
		background-size: auto; 
		-webkit-border-radius: 10px;
		-moz-border-radius: 10px;
		border-radius: 10px;
		flex-direction: column;
		justify-content: flex-end;
		padding-bottom: 20px;
		padding-left: 2.5rem;
		padding-right: 2.5rem;
		display: flex;	
		color: #fff;
	}
	
	
	#WhyGarona .shadLinkW { min-height: 270px; padding-top: 30px; align-content: flex-start ; }
	#WhyGarona .shadLinkW img {
		max-height: 70px;
	}
	
	
	
	.formcallW{ padding: 150px 0 0 0; position: relative; margin-bottom: 50px; }
	
	.formcallBG{
		width: 100%; height: 40vh; position: absolute; top: 0; left: 0; z-index: 0;
		background: #F3F2F4 url(../media/images/demo/formcall-bg.jpg) no-repeat center;
		background-size: cover;
		background-attachment: fixed;
		
	}
	

	#page-contact .formcallBG{background-image:url(../media/images/demo/formcall-bg2.jpg);}
	
	.formcallZone{
		margin: 0 10%; position: relative; z-index: 5;
		border-bottom: 10px solid var(--bleufonce);
		padding: 60px 120px;
		background: #fff;
		overflow: hidden;
	}
	.shadLinkW:hover {
		-webkit-box-shadow: 3px 3px 11px 0px rgba(0,0,0,0.25); 
		box-shadow: 3px 3px 11px 0px rgba(0,0,0,0.25);
	}
	

	
	
	
	
	
	
	
	#SearchBarW{ position: absolute; top: 150px; margin: 0 10%; width: 80%; transition: all .6s; opacity: 0; display: none;}
	.scrolled #SearchBarW{ top: 100px !important; }
	
	.searchCloser{ position: absolute; top: 5px; right: 10px; color: var(--bleufonce); font-size: 1.5em; cursor: pointer}
	
	#SearchBar{ 
		background: #fff; 
		padding: 40px 40px 25px 40px;
		-webkit-border-radius: 10px;
		-moz-border-radius: 10px;
		border-radius: 10px;
		-webkit-box-shadow: 3px 3px 11px 0px rgba(0,0,0,0.25); 
		box-shadow: 3px 3px 11px 0px rgba(0,0,0,0.25);
	}
	
	#SearchBarFormZone{
		display: flex; width: 100%;
	}
	
	#SearchIntro{
		width: 35%;
	}
	
	#SearchIntro h4{
		margin: 0;
		margin-top: -12px;
	}
	
	#SearchFormW{ 
		 width: 65%;
	}
	
	#SearchFormW fieldset{ 
		display: flex; 
		gap: 20px;
	}
	
	/*#SearchFormW fieldset > p, #SearchFormW fieldset > div{ 
		flex: 1;
	}*/
	
	#HeadSearchForm label{ display: none;   }
	
	#fieldset-npieces{ display: none !important;}
	
	
	
	.selectbox {
		position: relative;
		display: inline-block;
	  
	}

	.selectbox select {
	  background-color: var(--bleufonce);
	  color: #fff;
	  padding: 10px 15px;
	  min-width: 200px;
	  border: none;
	  font-size: 1.2em;
	  box-shadow: 0 5px 25px rgba(0, 0, 0, 0.2);
	  -webkit-appearance: button;
	  appearance: button;
	  outline: none;
	  -webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		border-radius: 5px;
	  
	}

	.selectbox::before {
	 /* font-family: "Font Awesome Kit";
	  content: "\f32d";*/
	 
      content: "\25BD";
	  position: absolute;
	  top: 0;
	  right: 0;
	  width: 16%;
	  height: 70%;
	  text-align: center;
	  font-size: 25px;
	  line-height: 40px;
	  color: rgba(255, 255, 255, 0.5);
	  background-color: var(--bleufonce);
	  pointer-events: none;
	   -webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		border-radius: 5px;
	}

	.selectbox:hover::before {
	  color: rgba(255, 255, 255, 1);
	  
	}

	.selectbox select option {
	  padding: 30px;
	}
	
	
	
	
	
	
	#ProgsHeadSelector{ padding-top: 80px; position: relative; }
	#ProgsHeadSelector h2{ position: absolute; top: 20vh; width: 100%; z-index: 100; text-align: center; color: #fff; font-size: 4.5em; margin: 0; }
	
	.carteCatW{ display: flex; margin: 0; gap: 0; margin-bottom: 40px; position: relative;  }
	.carteCatW > li{ flex: 1; text-align: center; line-height: 20px; overflow: hidden; }
	.carteCatW > li a.active{  border-bottom: 6px solid #FDC600; }
	
	
	
	
	
	
	#ProgsListW{ padding-bottom: 20px;  }
	#ProgsListW > ul.flexi{  flex-wrap:wrap; }
	#ProgsListW > li{  }
	
	.progVignetteW{
		display: block; 
		background: #e4e8ec url(../media/images/default-list.jpg?c=2) no-repeat center;
	}
		
	.progVignette{
		height: 40vh;
		margin-bottom: 24vh;
		background-position: 50%;
		background-repeat: no-repeat;
		background-size: cover;
		flex-direction: column;
		justify-content: flex-start;
		padding-top: 15vh;
		padding-left: 1.5rem;
		padding-right: 1.5rem;
		transition: all .6s;
		display: flex;
		position: relative;}
		
	/*.progVignette:hover {
		background-size: 105%;
	}*/


	.progVignetteCat{ 
		position: absolute; top: 0; left: 0; padding: 8px 15px; background: #FDC600; color: #fff; font-weight: 600; letter-spacing: 0;
		
	}
	.progVignetteCat.white{ background: #fff; color: #EDB400;  }
	.progVignetteCat.vignetteR{ 
		left: auto; right: 0;
		background: var(--bleufonce); color: #fff;
	}
	
	.progVignetteTextW{ 
		display: block;
		transition: all .6s;
		background: #fff;
		color: #000;  position: relative; top: 150px;  text-align:  left;
		margin: 0;
		background: #fff url(../media/images/forme-10p.svg) no-repeat right 110%; background-size: 200px;
		-webkit-box-shadow: 3px 3px 11px 0px rgba(0,0,0,0.25); 
		box-shadow: 3px 3px 11px 0px rgba(0,0,0,0.25);
	}
	
	
	
	.progVignetteText { display: block; padding: 20px 20px 0; min-height: 120px }
	.progVignetteText > span{ display: inline-block; margin-bottom: 5px; }
	
	.progTitle{margin-bottom: 15px !important;}
	
	.progSubTitle{}
	
	.progDesc{}
	
	.progPrice{}
	
	.progVignetteW .link{
		margin: 0 0 0 0;
		padding: 10px 20px; color: #fff; background: var(--bleufonce); 
		float: right;
		-webkit-border-top-left-radius: 7px;
		-moz-border-radius-topleft: 7px;
		border-top-left-radius: 7px;
		
	}
	.progVignetteW .link svg{
		color: #fff !important;
		
	}
	.progVignetteW:hover .link{
		padding: 10px 25px; 
		-moz-transition: all 0.3s ease-in-out;
		-webkit-transition:all 0.3s ease-in-out;
		-o-transition: all 0.3s ease-in-out;
		-ms-transition:all 0.3s ease-in-out;
		transition: all 0.3s ease-in-out;
		
	}
	

	
	/*
	.carteCatW > li a{ display: block; position: relative; overflow: hidden; border-bottom: 5px solid #ecebe8; }
	.carteCatW > li a.active{  border-bottom: 6px solid #ee7408; }
	.carteCatW > li a img{ 
		width: 100%; position: relative; z-index: 1; vertical-align: top; 
		
		-moz-transition: all 0.3s ease-in-out;
		-webkit-transition: all 0.3s ease-in-out;
		-o-transition: all 0.3s ease-in-out;
		-ms-transition: all 0.3s ease-in-out;
		transition: all 0.3s ease-in-out;	
		}
	.carteCatW > li a span{ 
		display: block; position: absolute; z-index: 10;
		bottom: 20%; width: 100%; left: 0; text-align: center; color: #fff; font-size: 3em;
		-moz-transition: all 0.3s ease-in-out;
		-webkit-transition: all 0.3s ease-in-out;
		-o-transition: all 0.3s ease-in-out;
		-ms-transition: all 0.3s ease-in-out;
		transition: all 0.3s ease-in-out;		}
	
	.carteCatW > li a:hover span{ 
		font-size: 3.1em; bottom: 21%
	}
	.carteCatW > li a:hover img, .carteCatW > li a.active img{ 
		
	}*/
	
	#GeoSearchBox{ background: #FDC600; 
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		border-radius: 5px; 
		transition: all .3s;}
	#GeoSearchBox a, #GeoSearchBox span{ display: block; padding: 25px 30px; color: #fff; font-size: 1.5em; line-height: 1.5em;   }
	#GeoSearchBox a:hover{ display: block; padding: 25px 30px; color: #FDC600; font-size: 1.5em; line-height: 1.5em;   }
	#GeoSearchBox a svg,  #GeoSearchBox span svg{ font-size: 2em; vertical-align: middle; margin-right: 5px; }
	#GeoSearchBox:hover{ color: #FDC600; background: #fff; 
		-webkit-box-shadow: 3px 3px 11px 0px rgba(0,0,0,0.25); 
		box-shadow: 3px 3px 11px 0px rgba(0,0,0,0.25); }
	
	
	#page-recherche-geographique #GeoSearchBox{ position: absolute; top: 160px; left: 0; display: inline-block; z-index: 100; 
	-webkit-box-shadow: 3px 3px 11px 0px rgba(0,0,0,0.25); 
		box-shadow: 3px 3px 11px 0px rgba(0,0,0,0.25);}
	#page-recherche-geographique #GeoSearchBox:hover{ background: #FDC600;  color: #fff; }
	
	
	
	#DemoMapW{ margin-bottom: 60px;}
	#DemoMapW img{ width: 100%; display: block; max-width: 1563px; margin: 0 auto; }
	
	
	
	
	.soonProgs{padding: 50px 0; font-size: 1.1em; }
	
	
	
	.filterBiensW{ display: flex; gap:40px; justify-content: center; }
	.filterBiensW select{}
	.filterBiensW label{ display: none;}
	
	#field-surface{ display: flex; gap:20px;}
	#field-surface input{ width: 122px;}

	
	
	/* * * * * * * * * * * * * * * * * * * * * * * * * HOTELS DETAILS * * * * * * * * * * * * * * * * * * * * * * * */
	
	
	
	
	.push #Content{ padding-top: 80px;}

	#page-nos-programmes #ZoomHalfBanner h2 { position: absolute; bottom: 80px;  }
	#page-nos-programmes #ZoomHalfBanner h2 span{ font-size: 0.8em; }

	
	#EtabTexts{ padding-top: 60px; position: relative;}
	
	#EtabLeftCol, #EtabRightCol{ display: inline; float: left;}
	#EtabLeftCol{ width: 55%; margin-right: 5%; padding-left: 2.5%; }
	#EtabRightCol{ width: 40%; }
	
	
	
	#MarqueLogo{ position: absolute; top: -40px; left: 5%; background: #fff; padding: 20px 25px; z-index: 200;}
	#MarqueLogo img{ max-height: 120px;}
	
	#EtabDesc{ font-size: 1.2em;}
	
	#EtabDetails{ display: flex;}
	
	#EtabDetailsLeftCol, #EtabDetailsRightCol{  background: #F3F2F4; padding: 35px; }
	#EtabDetailsLeftCol svg, #EtabDetailsRightCol svg{ color: var(--bleufonce); }
	
	#EtabDetailsLeftCol{ width: 100%; display: flex; flex-wrap: wrap; gap: 30px;}
	/*#EtabDetailsRightCol{ width: 50%; }	*/
	
	.coord{font-size: 1.1em; margin-bottom: 0; clear: left; width: calc(50% - 15px);}
	.coord svg{ display: block; float: left; margin: 0 15px 25px 0; font-size: 1.5em; color: #2c2c2c}
	.coord a{ color: #000;}
	
	/*
	
	.link{ margin-bottom: 20px; }
	.link .button{ background: var(--bleufonce); color: #fff; min-width: 90%;}*/
	
	#EtabDetailsRightCol p{ line-height: 1.1em; font-size: 1.1em; }	
	#EtabDetailsRightCol p strong{ font-size: 1.2em; }	
	#EtabDetailsRightCol p .dot{ font-size: 1.6em; color: var(--bleufonce); position: relative; top: 2px; }	
	
	
	
	
	
	#EtabFrame{  background: #F3F2F4; }
	
	
	#ChambresBlock{ background: var(--bleufonce); color: #fff; padding:30px 40px 15px; -webkit-border-top-left-radius: 10px;
		-webkit-border-top-right-radius: 10px;
		-moz-border-radius-topleft: 10px;
		-moz-border-radius-topright: 10px;
		border-top-left-radius: 10px;
		border-top-right-radius: 10px;  }
	#ChambresBlock *{ color: #fff }
	#ChambresBlock h4{ font-size: 1.8em; margin-bottom: 20px;}
	
	#ChambresBlock ul { display: table; width: 100%; margin: 0; text-align: left;}
	#ChambresBlock ul li{ display: inline-block; padding: 0; margin: 0 15px 15px 0; font-size: 0.8em; width: 20%; min-width: 100px; vertical-align: top; text-align: center; line-height: 1em; }
	#ChambresBlock ul li strong{ display: block; font-size: 1.7em; margin-bottom: 7px; }
	#ChambresBlock ul li img{ display: inline-block; max-width: 100px; width: 100%; margin-bottom: 5px;}
	
	
	#ProgCat{
		position: absolute; top: -59px; left: 0; padding: 20px 40px; background: #FDC600; color: #fff; 
		font-size: 2em;
		-webkit-border-top-right-radius: 10px;
		-webkit-border-bottom-right-radius: 10px;
		-moz-border-radius-topright: 10px;
		-moz-border-radius-bottomright: 10px;
		border-top-right-radius: 10px;
		border-bottom-right-radius: 10px;
	}
	
	.links { display: flex}
	.links .button{ flex: 1; }
	.links .button svg{ margin-bottom: 15px; }
	.links .button:hover{ background: #FDC600; color: #fff; border-color: #FDC600; }
	.links .button:hover svg{ color: #fff; }
	
	
	#PrestaBlock{ padding: 50px 40px 20px;}
	
	
	.icoPrestaW{display: table; width: 90%; margin: 0; text-align: left; margin-bottom: 15px;}
	.icoPrestaW li{ display: inline-block; margin: 0 2% 15px 0; min-height: 70px; vertical-align: middle; margin-bottom: 8px; text-align: center; width: 30%; font-size: 0.9em;}
	.icoPrestaW li img{ display: inline;}
	
	.prestaListW{ margin-bottom: 5px;}
	.prestaListW li{}
	.prestaListW li strong{}
	
	#CleanLogo{ display: inline; float: right; margin: 0 5% 10px 50px;}
	#CleanLogo img{ width: 80px;}
	
	
	#EtabAutour{ clear: both;  display: inline-block;
		width: 90%; margin: 0 5%;
		border-top: 2px solid #222; 
		padding: 20px 0; margin-top: 40px; }
	#EtabAutour h4{ font-size: 2em; margin-bottom: 30px  }
		
	#EtabAutour ul{ display: table; width: 100%;  text-align: left; }
	
	#EtabAutour ul li { display: inline-block; text-align: center;  margin: 0 2% 15px 0; vertical-align: top; width: 41%; }
	#EtabAutour ul.autourcol-3 li{ width: 29%; }
	#EtabAutour ul.autourcol-4 li{ margin: 0 1.5% 15px 0; width: 22%; }
	
	#EtabAutour ul li svg{ font-size: 2.8em; display: inline-block; padding-bottom: 7px; }
	#EtabAutour ul li span{ display: inline-block;  }
	
	#BonPlansLink{ background: #0066a6; float:right; font-size: 0.45em; position: relative; top: -2px; vertical-align: middle; padding: 6px 20px; }
	#BonPlansLink img{  vertical-align: middle; position: relative; top: -1px; }

	
	#EtabLabels{ clear: both;  display: inline-block;
		width: 90%; margin: 0 5%;
		border-top: 2px solid #222; 
		padding: 20px 0; margin-top: 40px; }
	#EtabLabels h4{ font-size: 2em; }
	
	#EtabLabels  ul{ display: flex; width: 90%;  margin: 0 auto; justify-content: center;  }
	#EtabLabels  ul li { display: block; width: 33%; text-align: center; }
	#EtabLabels  ul li img { display: inline-block; max-height: 150px; }
	
	
	#EtabZimMap{ margin: 0%; overflow: auto; clear: left; padding: 60px 0 30px; display: flex; }
	#EtabFirstZimW, #EtabZimMap #jGMapW{ width: 49%;}
	#EtabZimMap #jGMapW{ height: 550px;}
	
	#EtabFirstZimW{ margin-right: 2%; position: relative; }
	#EtabFirstZimW p{ margin: 0; }
	#EtabFirstZimW p img{ width: 100%; vertical-align: top; }
	#EtabGalCount{ position: absolute; top: 0 ; left: 0; display: block; background: var(--bleufonce); padding: 8px 20px; color: #fff; }
	
	
	#EtabGal{ margin: 0; overflow: auto; clear: left; }
	#EtabGal p{ margin: 0; display: table; text-align: left; width: 100%; }
	#EtabGal p img{ width: 100%;  }
	#EtabGal p a.galZim{ display: inline-block; width: 32%; margin-right: 2% }
	#EtabGal p a.galZim:nth-child(3){ margin-right: 0 }
	
	
	
	
	
	
	/* ---------END-------------- */
	
	
	
	.colZimW{ overflow: hidden; background-repeat: no-repeat; background-size: cover; }
	
	.colZim{ display: block; width: 100%;}
	
	
	
	


	 /* GENERAL BLOCK LISTS */
	
	.zimBlocsList{}
	.zimBlocsList li.col25{ margin: 0 0.5% 20px 0.5% !important; width: 23.5% !important;}
	.zimBlocsList li.col30{ margin: 0 0.5% 20px 0.5% !important; width: 31.5% !important;}
	.zimBlocsList li.col50{ margin: 0 0.5% 20px 0.5% !important; width: 48.5% !important;}
	.zimBlocsList li.col100{ margin: 0 0.5% 20px 0.5% !important; width: 97% !important; }
	
	
	.scaleSelector{}
	.scaleSelector li.col25{ margin: 0 0.5% 20px 0.5%; width: 23.5%;}
	.scaleSelector li.col30{ margin: 0 0.5% 20px 0.5%; width: 31.5%;}
	.scaleSelector li.col50{ margin: 0 0.5% 20px 0.5%; width: 48.5%;}
	.scaleSelector li.col100{ margin: 0 0.5% 20px 0.5%; width: 99%; }
	
	
	
	.zimBlocsList li, .scaleSelector li { background: #333; }
	#page-home .zimBlocsList li { background: #111; }
	

	.zimBlocsList li h3, .scaleSelector li h3{ 
		margin: 0; color: #fff; width: 100%; height: 100%; margin: 0; position: relative; min-height: 200px;
	}
	.zimBlocsList.reduct li h3, .scaleSelector.reduct li h3{ 
		max-height: 320px; overflow: hidden; 
	}
	.zimBlocsList.reduct li.col30 h3 img{ margin-top: -100px;}
		
		
	.zimBlocsList li .itemTitle, .scaleSelector li .itemTitle{
		position: absolute; display: block; top: 32%; text-align: center; 
		z-index: 10; width: 100%; text-transform: uppercase; font-size: 1.3em;
		-moz-transition: top 0.3s ease-in-out;
		-webkit-transition: top 0.3s ease-in-out;
		-o-transition: top 0.3s ease-in-out;
		-ms-transition: top 0.3s ease-in-out;
		transition: top 0.3s ease-in-out;
		}
	.zimBlocsList li .itemTitle.alone, .zimBlocsList li .itemTitle.mini{ top: 40%; }
	.zimBlocsList li .itemTitle.illus{ top: 17%;  }
	.zimBlocsList li .itemTitle.illus.mini{ top: 30%; }
	
	.zimBlocsList li .itemTitle strong, .scaleSelector li .itemTitle strong{
		display: inline-block; padding: 0 15px; line-height: 1.2em; /*border-left: 2px solid #fff; border-right: 2px solid #fff;*/
		-moz-transition: padding 0.3s ease-in-out;
		-webkit-transition: padding 0.3s ease-in-out;
		-o-transition: padding 0.3s ease-in-out;
		-ms-transition: padding 0.3s ease-in-out;
		transition: padding 0.3s ease-in-out;	}
	
	.zimBlocsList li a:hover .itemTitle strong{ padding: 0 25px; }
	.zimBlocsList li .itemTitle.alone strong{ font-size: 1.2em; }
	
	.zimBlocsList li .itemTitle span.popup, .scaleSelector li .itemTitle span.popup{
		display: block; padding: 20px 0; line-height: 1.2em; font-size: 1em; opacity: 0;
		-moz-transition: opacity 0.3s ease-in-out, padding 0.3s ease-in-out;
		-webkit-transition: opacity 0.3s ease-in-out, padding 0.3s ease-in-out;
		-o-transition: opacity 0.3s ease-in-out, padding 0.3s ease-in-out;
		-ms-transition: opacity 0.3s ease-in-out, padding 0.3s ease-in-out;
		transition: opacity 0.3s ease-in-out, padding 0.3s ease-in-out;
	}
	
	.zimBlocsList li a:hover .itemTitle span.popup, .scaleSelector  li:hover .itemTitle span.popup{
		opacity: 1; padding: 12px 0; 
	}
	
	.zimBlocsList li .itemTitle span.popup .button, .secondLink .button {
		margin-top: 8px; padding: 8px 15px; color: #fff; border-color: #fff; font-size: 1em;
	}
	.scaleSelector li .links .button, .secondLink  .button{
		display: block; margin: 8px 30%;		
	}
	
	.zimBlocsList li .itemTitle span.popup .button:hover, .scaleSelector li .button:hover{
		color: #000 !important;
	}
	.zimBlocsList li a:hover .itemTitle span.popup .button, .scaleSelector li a:hover .button{
		background: #fff; color: #000 !important;
	}
	
	
	/* avec logos (abandonné) */
	
	/*.zimBlocsList li .itemTitle.illus img{ 
		display: inline-block; max-width: 58%;
	}
	.zimBlocsList li .itemTitle.illus.mini img{ 
		max-width: 30%;
	}*/
	
	
	.zimBlocsList li a:hover .itemTitle { top: 30%;}
	.zimBlocsList li a:hover .itemTitle.alone, .zimBlocsList li a:hover .itemTitle.mini{ top: 38%; }
	.zimBlocsList li a:hover .itemTitle.illus{ top: 15%;}
	.zimBlocsList li a:hover .itemTitle.illus.mini{ top: 28%;}
	
	.backdeco{ display: none; }
	
	
	
	
	
	
	.scaleSelector li{ overflow: hidden; position: relative;}
	.scaleSelector li h3{ height: 500px;}
	.scaleSelector li .itemTitle strong { font-size: 2.7em;}
	.scaleSelector li .itemTitle strong img{  width: 70%; max-width: 300px;}
	.zimBlocsList li .itemTitle, .scaleSelector li .itemTitle{ font-size: 1em; }
	.scaleSelector li .itemBG{
		width: auto; height: 100%; position: relative; left: -30%;
	}
	/*.scaleSelector li.active .itemBG{
		 left: 0%;
	}*/
	.scaleSelector li .links { display: block; position: absolute; bottom: 5%; width: 100%; z-index: 10;}
	
	.scaleSelector li .links .button {
		margin-top: 8px; padding: 5px 8px; color: #fff; border-color: #fff; font-size: 0.6em;
	}
	.scaleSelector li .links .soon {
		 font-size: 0.6em;
	}
	
	.secondLink { position: absolute; width: 100%; bottom: 65px; z-index: 100; left: 0; font-size: 0.6em; }
	
	.scaleSelector li .videoW{ display: block; position: absolute; left: 0; top: 0; height: 100%; width: 100%;}
	.scaleSelector li .videoW .videoOverlay{ position: absolute; display: block; left: 0; top: 0; height: 100%; width: 100%; background: rgba(0,0,0,0.3); z-index: 2;}
	.scaleSelector li .videoW .video-js{ display: block; height: 100%; position: relative; z-index: 1;}
	
	
	.muteButton{ display: block; position: absolute; right: 20px; top: 20px; z-index: 50; cursor: pointer; display: none;}
	.muteButton i{ font-size: 1em; }
	.muteButton .fa-volume-up{ display: none; } .muteButton .fa-volume-mute{ display: block; }
	.muteButton.playing .fa-volume-up{ display: block; } .muteButton.playing .fa-volume-mute { display: none; }
	
	/* DEV */
	/*.scaleSelector li .itemBG{ display: none !important; }*/
	
	
	
	/* MODIF LEFT SUR LA HOME */ 
	
	.homeSection .zimBlocsList li .itemTitle, 
	.homeSection .zimBlocsList li .itemTitle.alone, 
	.homeSection .zimBlocsList li .itemTitle.mini,
	.homeSection .zimBlocsList li .itemTitle.illus,
	.homeSection .zimBlocsList li .itemTitle.illus.mini{ 
		top: auto; bottom: 4%; text-align: left;
		-moz-transition: bottom 0.3s ease-in-out;
		-webkit-transition: bottom 0.3s ease-in-out;
		-o-transition: bottom 0.3s ease-in-out;
		-ms-transition: bottom 0.3s ease-in-out;
		transition: bottom 0.3s ease-in-out; }
	
	.homeSection .zimBlocsList li a:hover .itemTitle, 
	.homeSection .zimBlocsList li a:hover .itemTitle.alone, 
	.homeSection .zimBlocsList li a:hover .itemTitle.mini,
	.homeSection .zimBlocsList li a:hover .itemTitle.illus,
	.homeSection .zimBlocsList li a:hover .itemTitle.illus.mini{ top: auto; bottom: 6% }
	
	
	.homeSection .zimBlocsList li .itemTitle.test{  
		top: auto; bottom: 4%; text-align: center;
		-moz-transition: bottom 0.3s ease-in-out;
		-webkit-transition: bottom 0.3s ease-in-out;
		-o-transition: bottom 0.3s ease-in-out;
		-ms-transition: bottom 0.3s ease-in-out;
		transition: bottom 0.3s ease-in-out; }
		
	.zimBlocsList li .itemTitle.test strong{ font-size: 1.2em; line-height: 1em; }
	




	
	
	/*.backdeco{ display: block; position: absolute; z-index: 0; background: #fff}
	
	.topleft .backdeco{ left: -10px; top: -10px; width: 70%; height: 70%;}
	.center .backdeco{ left: 15%; top: -10px; width: 70%; height: 108%;}
	.bottomright .backdeco{ right: -10px; bottom: -10px; width: 70%; height: 70%;}
	
	.centerh .backdeco{ left: -10px; top: 25%; width: 104%; height: 50%;}
	.col100.centerh .backdeco{ width: 101.5%; }
	
	.sable .backdeco{ background: #c8ae77 }
	.black .backdeco{ background: #000 }*/
	
	
	/*#page-garona #Content > h2 { display: none;}*/
	
	
	#GaronaNumbers{  margin: 0;}
	
	#GaronaNumbers ul{ display: flex; width: 100%;  }
	#GaronaNumbers ul li{  flex: 1; padding-right: 2%; line-height: 1em; font-size: 1.3em;   }
	#GaronaNumbers ul li .shadLinkW{  min-height: 100%; padding-bottom: 15px;   justify-content:  center; }
	#GaronaNumbers ul li:last-child{  border-right: none; margin-right: 0; padding-right: 0; }

	#GaronaNumbers ul li p { text-align: center; padding-top: 15px; margin-bottom: 15px; font-size: 0.9em;  line-height: 1em; }
	#GaronaNumbers ul li p.high { padding-top: 30px; }
	
	
	
	
	#GaronaDates{}
	#GaronaDates ul{ display: flex; width: 100%;  }
	#GaronaDates ul li{  flex: 1; line-height: 1em; font-size: 1.3em; text-align: center;  }
	#GaronaDates ul li p{  display: flex; flex-direction: column; }
	
	.dateslines{ flex-direction: row !important; justify-content: center; align-items: center; }
	.dateslines span.lineG, .dateslines span.lineD{ display: inline-block; height: 3px; width: 47%; background: var(--bleufonce); vertical-align: middle;}
	.dateslines span.lineG.empty, .dateslines span.lineD.empty{ background: #fff;}
	.dateslines svg{ font-size: 2em; vertical-align: middle;  }
	
	.dateslines span.lineD.empty span{ display: inline-block; float: left; background: var(--bleufonce); width: 10px; margin-right: 10px; height: 3px; vertical-align: middle;}
	
	#GaronaDates ul li p.year{ font-size: 1.6em; margin-bottom: 5px; font-weight: 600; color: var(--bleufonce); }
	#GaronaDates ul li p.dateslines{ margin-bottom:10px; }
	#GaronaDates ul li p.desc{ display: block; font-size: 0.65em; padding: 0 10px; line-height: 1.2em;}
	#GaronaDates ul li p.desc strong{ font-size: 1.1em; text-transform: uppercase; display: inline-block; margin-bottom: 5px;}
	
	
	
	
	#GaronaTeam{ }
	#GaronaTeam ul{ display: flex; width: 100%; }
	#GaronaTeam ul li{  flex: 1; line-height: 1em; text-align: center;
		box-shadow: rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px;
	}
	
	#GaronaTeam ul li img{ display: block; width: 100%; }
	
	#GaronaTeam ul li p{ padding: 20px 30px; margin: 0;
		-webkit-border-bottom-right-radius: 10px;
		-webkit-border-bottom-left-radius: 10px;
		-moz-border-radius-bottomright: 10px;
		-moz-border-radius-bottomleft: 10px;
		border-bottom-right-radius: 10px;
		border-bottom-left-radius: 10px;}
	
	
	
	
	
	.urbalogo { 
		background-image: url(../media/images/urbaone/logo-urbaone-20p.svg); background-repeat: no-repeat; background-position: right 98%;
		background-size: 300px;
	
	}
	
	
	#TeamList{ gap: 30px 20px; padding-bottom: 50px;}
	#TeamList li{ width: calc(33.33% - 15px); text-align: center;}
	
	
	
	
	
	.titleBlurZimW { position: relative; overflow: hidden;}
	.titleBlurZimW h2 { 
	position: absolute; width: 100%; text-align: center; top: 35%; z-index: 100; color: #fff; letter-spacing: 3px; font-size: 4em; margin-bottom: 0;
		text-shadow: 0px 2px 5px rgba(0, 0, 0, 1);
		opacity: 0;
		-moz-transition: all 1s ease-in-out;
		-webkit-transition: all 1s ease-in-out;
		-o-transition: all 1s ease-in-out;
		-ms-transition: all 1s ease-in-out;
		transition: all 1s ease-in-out;}
	.titleBlurZimW.animated h2{ opacity: 1;}
	.titleBlurZimW h2 img { fill: #fff; width: 280px;}
	.titleBlurZim { 
		width: 100%; display: block;
		-moz-transition: all 1.5s ease-in-out;
		-webkit-transition: all 1.5s ease-in-out;
		-o-transition: all 1.5s ease-in-out;
		-ms-transition: all 1.5s ease-in-out;
		transition: all 1.5s ease-in-out;
	}
	.animated .titleBlurZim.blur { filter: blur(5px); }
	
	
	
	
	/* PRESSE */
	

	#PresseW{ display: flex; gap: 60px 40px; margin-bottom: 50px; flex-wrap: wrap;}
	
	#PresseW  li{ display: inline-block; width: calc(33.33% - 35px); vertical-align: top;  line-height: 1.2em;  }
	#PresseW  li a:hover strong{ text-decoration: underline;  }
	#PresseW  li .zimW{ display: table;   height: 250px; width: 100%;  }
	#PresseW  li .zimW span{ display: table-cell; vertical-align: middle;  text-align: center;   }
	#PresseW  li .zimW span img{ max-width: 100%; border-top: 4px solid var(--bleufonce); }
	#PresseW  li strong { display: block;  font-size: 1.2em; color:#444; font-weight: 400; text-transform: uppercase; margin-bottom: 10px; }
	#PresseW  li .desc {  font-size: 0.8em; color: #111 }
	#PresseW  li .date {  font-size: 0.9em; color: #111; display: block; border-bottom: 1px solid #999; padding-bottom: 8px; margin-bottom: 10px; }
	#PresseW  li .button {  margin-left: 0; }
	
	
	
	
	
	#HomeOffers{ margin-bottom: 50px;}
	
	.offersList{}
	.offersList li{ margin-bottom: 30px;}
	.offersList li *{ text-align: left;}
	.offersList li div{ background: #222; position: relative;  padding: 20px 40px 20px 20px; overflow: auto;}
	.offersList li div img{ display: block; float: left; height: 200px; margin: 0 25px 0 0;}
	
	.offersList li h4 { margin: 0 0 20px 0; text-transform: uppercase;}
	.offersList li p{ line-height: 1.2em; }
	.offersList li h5{ margin: 15px 0 0 0; text-transform: uppercase; font-size: 1.5em;}
	
	
	
	
	
	/* OFFERS BOX TRANSLUCIDES
	
	/*#HomeOffers{ margin-bottom: 50px;}
	
	.offersList{}
	.offersList li{ margin-bottom: 30px;}
	.offersList li *{ text-align: left;}
	.offersList li div{ border: 1px solid #000; background: rgba(0,0,0,0.2); position: relative;  padding: 20px;}
	
	.offersList li h4 { margin: 0 0 20px 0; text-transform: uppercase;}
	.offersList li p{ line-height: 1.2em; }
	.offersList li h5{ margin: 15px 0 0 0; text-transform: uppercase; font-size: 1.5em;}
	
	.offersList li .offerLink{ 
		display: block; position: absolute;
		right: 25px; bottom: -25px;
		-moz-transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out, background-color 0.2s ease-in-out;
		-webkit-transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out, background-color 0.2s ease-in-out;
		-o-transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out, background-color 0.2s ease-in-out;
		-ms-transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out, background-color 0.2s ease-in-out;
		transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out, background-color 0.2s ease-in-out;
		background: #000;
		color: #fff;
		cursor: pointer;
		font-size: 1.6em; text-transform: uppercase; 
		font-family: 'Montserrat', sans-serif;
		padding: 15px 20px;
	}
	.offersList li .offerLink:hover{ 
		background: #fff;
		color: #000;
	}*/
	
	
	
	
	/* -- ANIMATED SECTIONS SELECTORS-- */
	
	
	
	.itemSelector { margin: 40px 0; position: relative;}
	.videoSelector{}
	

	
	.itemSelector .itemsW, .itemSelector .clickerW{ display: flex;width: 100%}
	
	.itemsW{ position: relative; z-index: 300;}
	.clickerW{ position: absolute; top: 0; left: 0; z-index: 500;}
	
	.clickerW li a{ display: block; width: 100%; height: 100%; color: #fff; }
	/*.clickerW li a:hover{ background: url(zims/frontend/selector-repeat.jpg) repeat-x center bottom;}*/
	.clickerW li a span.buttonW{ display: block; width: 100%; position: absolute; bottom: 30px; left: 0; text-align: center; }
	.clickerW li a span.buttonW span{ color: #fff; border-color: #fff; background: #000;  }
	.clickerW li a span.buttonW span:hover{ color: #000; background: #fff; border-color: #fff;  }
	
	.clickerW li .itemTitle{
		position: absolute; display: block; top: 45%; text-align: center; /*opacity: 0;*/font-family: 'Montserrat', sans-serif;
		z-index: 10; width: 100%; opacity: 1; font-size: 5em; text-transform: uppercase;}
	.clickerW li a.goback span.buttonW { opacity: 0.5;  }
	.clickerW li a.goback .itemTitle { opacity: 0.7; color: #ccc;  }

	
	
	.itemsW li, .clickerW li{ flex: initial; height: 600px; position: relative; width: 31.5%; overflow: hidden; margin: 0 1% 20px;}

	.itemsW li h3{ margin: 0; color: #fff; position: absolute; top: 0; left: 0; width: 100%; height: 100%; margin: 0; }
	.itemsW li .itemTitle{
		position: absolute; display: block; top: 45%; text-align: center; /*opacity: 0;*/
		z-index: 10; width: 100%; text-transform: uppercase; font-size: 2em;}
	.itemsW li .itemTitle.illus, .clickerW li .itemTitle.illus{ top: 33%;  }

	
	
	.videoSelector .videoWW{ position: absolute; top: 0; left: 0; z-index: 400; width: 100%; height: 100%; overflow: hidden;}
	.videoSelector .videoW{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: none; }
	.videoSelector .videoW video{ position: absolute; z-index: 1; }
	.videoSelector .videoW .video-js{  width: 100% !important; }
	/*.videoSelector .videoW * {display: none; }*/
	.videoSelector .videoW video, .videoSelector .videoW .video-js{display: block; }

	
	
	
	
	/* DETAILS PAGES */
	
/*	.pictoList{}
	
	.pictoList.inline { display: table; width: 90%; margin: 0 auto; text-align: center;}
	.pictoList.inline li{ display: inline-block; padding: 0 20px;}
	.pictoList.inline li i{ font-size: 1.5em;}*/
	
	
	
	
	
	/* */
	
	#EventResaLink{ 
		display: block; position: fixed; top: 88px; right: 3%; z-index: 1000;
		font-family: 'Montserrat', sans-serif; background: #000; color: #fff; letter-spacing: 0; font-size: 1.4em; padding: 8px 20px;
		border: 2px solid; margin: 0;
		border-image-slice: 1;
		border-image-source: linear-gradient(45deg, #743ad5, #1d7eba);		 
	}
	#EventResaLink:hover{ background: #fff; }
	#EventResaLink.white{ background: #fff; color: #000; }
	#EventResaLink.white:hover{ background: #000; color: #fff !important; }
	
	.miniBackto{ display: block; position: absolute; left: 2.5%; }
	.miniBackto:hover{ text-decoration: underline; }
	
	.floatingbgW{ clear: both; margin: 200px 0 100px; position: relative;}
	.floatingbgW.nomargin{ margin: 20px 0;}
	.floatingbgBand{ height: 75%; position: absolute; top: 12.5%; left: 0; z-index: 0; width: 100%; background: #000;}

	.styledSoulign { position: relative; border-bottom: 5px solid #c8ae77; padding-bottom: 15px;}


	.textW{ padding: 25px;}

	.floatingbgW .textW{ padding-bottom: 0;}
	.tempDeco{ display: inline; float: right; margin: -50px 0 0 25px; max-width: 50%; position: relative; z-index: 100; }
	
	
	
	.tab{ display: none; }
	.tabsMenu{ display: table; width: 100%; text-align: center;}
	.tabsMenu li{ display: inline-block;margin: 0 10px; }
	.tabsMenu li.active a.button{ background: #fff; color: #000}
	
	
	
	.separLine{ display: block; width: 75%; height: 1px; background: #fff; margin: 25px 0; position: relative; }
	.separLine.separL{ left: -50%; }
	.separLine.separR{ right: -50%; }
	
	
	.straightLine{ display: block; width: 1px; height: 60px; background: #fff; margin: -30px auto 0; position: relative; z-index: 20;}
	
	
	.randomItemMenu{ display: flex; flex-direction : row; align-items: stretch	}
	.randomItemMenu li{
		flex-grow: 1;
		border: 1px solid #fff; margin: 0 5px; text-align: center;
		font-size: 1.2em; padding: 15px 10px;
	}
	.randomItemMenu.black li{ border: 1px solid #000; }
	.randomItemMenu li.active{ background: #fff; text-transform: uppercase;}
	.randomItemMenu.black li.active{ background: #111;}
	.randomItemMenu li.active a{ color: #111; }
	.randomItemMenu.black li.active a{ color: #fff!important; }
	.randomItemMenu li a:hover{ text-decoration: underline; }
	
	
	

	
	
	/* * * * * * * * * * * * * * * * * * * * * * * * * HOTELS LIST * * * * * * * * * * * * * * * * * * * * * * * */
	
	
	
	#TopFilterSimple {border-top: 1px solid #000;} 
	
	#TopFilterW{
		display: table; width: 100%; text-align: center;
		border-bottom: 1px solid #000;}
			
	#TopFilterW #FilterFormMainFieldset{ margin: 0; }
	
	#TopFilterW .filterCell, #TopFilterW form p { 
		display: inline-block; padding: 17px 30px 0; min-height: 55px; margin-bottom: 0;
		border-right: 1px solid #000;  text-transform: uppercase; font-size: 1.2em;
		vertical-align: top;
		
	}	

	#TopFilterSimple .filterCell.buttonw{ padding: 7px 30px 0; font-size: 1.3em; }	
	#TopFilterSimple .filterCell a{ color: #000;	}	
	#TopFilterSimple .filterCell a:hover{  text-decoration: underline;	}	
	#TopFilterSimple .filterCell:first-child, #TopFilterW form p:nth-child(2) { border-left: 1px solid #000; }
	#TopFilterSimple .filterCell:last-child{ border-left: 1px solid #000; }
	
	#TopFilterSimple form label{  float: left; position: relative; top: -3px; margin-right: 10px; font-size: 0.9em;}
	#TopFilterSimple form select{ 
		float: left; border: none; text-transform: uppercase; font-size: 0.8em; font-weight: lighter; padding: 0;
	}	
	#TopFilterSimple form select option{ font-weight: lighter; text-transform: uppercase; }
	
	#TopFilterSimple .filterCell .button{ 
		background: #0066a6;
		border-color: #0066a6;
		color: #fff !important;	
		font-size: 0.7em;
	}	
	#TopFilterSimple .filterCell .button:hover{ 
		background: #000;
		border-color: #000;	
	}	
	
	#TopFilterSimple .formButtons{ display: none; }
	
	
	.noResults{ margin: 150px 0;}
	
	
	/* Marques */
	
	.marquesList{ margin: 50px 0;}
	
	.marquesList li{ text-align: center; vertical-align: bottom; min-height: 205px; width: 25%; }
	.marquesList li img{display: inline-block; max-width: 65%; max-height: 145px; margin: 30px 0;vertical-align: middle;   }
	.marquesList li .txt{position: absolute; top: 100%; padding-top: 20px; width: 100%; }
	.marquesList li .txt h4{ font-size: 1.6em; }
	
	
	
	
	#HotelsList{ margin: 30px 10%; }
	#HotelsList ul{ display: inline; float: left; width: 47%;}
	#HotelsList ul:first-child{ margin-right: 6%}
	
	#HotelsList ul li{ vertical-align: middle; border-bottom: 1px solid #999; padding-bottom: 15px; margin-bottom: 15px; overflow: auto;}

	#HotelsList ul li a{  display: table; width: 100%; }
	
	#HotelsList ul li span{display: inline-block; float: left; vertical-align: middle;}
	
	#HotelsList ul li span.imgW{width: 16%; text-align: center; float: none; display: table-cell;}
	#HotelsList ul li img{ max-height: 45px; max-width: 70px; vertical-align: middle; }
	
	#HotelsList ul li span.nameW{width: 83%; padding-left: 2%; float: none; display: table-cell; }
	#HotelsList ul li span.nameW .name{ width: 83%; color: #000;}
	#HotelsList ul li a:hover span.nameW .name{ color: #0066a6 !important; text-decoration: underline;}
	#HotelsList ul li span.nameW .stars{ width: 16%; font-size: 0.8em; text-align: right; }
	#HotelsList ul li span.nameW .stars svg{ color: #0066a6 !important; }
	
	
	
	
	
	#BottomGalW{ position: relative; margin: 0; clear: both; padding-top: 50px;}
	#BottomGalW h3{ margin-bottom: 15px !important; }
	
	.maingalleryW{ position: relative; padding-top: 15px; overflow: hidden;}
	.maingallery{ width: 100%; clear: both; }
	.maingallery li{ display: block;  margin-bottom:0}
	.maingallery li img{ display: block; width: 100%; }
	
	/*.maingalleryArrowW{ display: table; width: 100%; text-align: center;}*/
	.maingalleryArrowW{ display: block;}
	.maingalleryArrowW .galleryArrow{ 
		display: block; position: absolute; top: 30%; width: 130px; height: 130px; background: rgba(20,20,20,0.85); 
		margin: 0; font-size: 2.5em; z-index: 10; padding: 20px; cursor: pointer;
		transform: rotate(45deg);}
	.maingalleryArrowW .galleryArrow svg{ transform: rotate(-45deg);}
	
	.maingalleryArrowW #Mainup{ left: -85px; text-align: right;}
	.maingalleryArrowW #Mainup svg{ position: relative; top: -6px }
	.maingalleryArrowW #Maindown{ right: -85px; text-align: right;}
	.maingalleryArrowW #Maindown svg{ position: relative; top: 70%; left: -80%; }
	
	
	
	
	
	
	/* PROJECT */
	
	
		
	#ProjectHeader{width: 100%; height: 45vh; background: #a4abb5 url(zims/frontend/project-couple.jpg) no-repeat left top; background-size: auto 100%; }
	#ProjectHeader h2{ padding: 140px 5% 0; text-align: right; color: #fff; font-size:5em; line-height: 1em; }
	
	#page-votre-projet #Content{ padding-top: 100px;}
	
	
	
	
	
	#StepSelector { width: 100%; border-top: 7px solid #FDC600;}
	#StepSelector > li.col30 {
		width: 30%;
		margin: 0 0;
		flex: 1;
	}
	#StepSelector .programmeW {
		height: 200px;
		background-image: url(../media/images/project/vefa.jpg);
		
	} 
	#StepSelector .programmeW.skin-defisc{ background-image: url(../media/images/project/defisc.jpg);}
	#StepSelector .programmeW.skin-lotis{background-image: url(../media/images/project/lotis.jpg);}
	
	
	
	.contentSlidersW{ overflow: hidden; padding-bottom: 50px;   }
	.contentSliders{ display: flex; position: relative; margin-left: -2.5%; }
	.contentSlider{ flex: 1; padding: 0; }
	.contentSlider > .contentSection {  padding: 50px 3.8% 20px 2.5%; }
	

	.stepTitle{display: flex; align-items: flex-end; justify-content: center; text-align:center; height: 100%;}
	.stepTitle svg{font-size: 2em; color: #FDC600; margin: 15px 0; }
	
	
	.stepsList{ display: flex; width: 100%; }
	.stepsList li{ flex: 1; background: #F3F2F4; text-align: center; padding: 30px 15px 20px;  position: relative;
		 -moz-transition:all .4s ease-out;
	   -webkit-transition:all .4s ease-out;
	   -o-transition:all .4s ease-out;
		transition:all .4s ease-out;
		cursor: pointer;
		}
	.stepsList li:hover{ 
		flex: 1.5;  background: #fff; 
	}
	.stepsList li:first-child{
		-webkit-border-top-left-radius: 10px;
		-webkit-border-bottom-left-radius: 10px;
		-moz-border-radius-topleft: 10px;
		-moz-border-radius-bottomleft: 10px;
		border-top-left-radius: 10px;
		border-bottom-left-radius: 10px;
		
	}
	.stepsList li:last-child{
		-webkit-border-top-right-radius: 10px;
		-webkit-border-bottom-right-radius: 10px;
		-moz-border-radius-topright: 10px;
		-moz-border-radius-bottomright: 10px;
		border-top-right-radius: 10px;
		border-bottom-right-radius: 10px;
		
	}
	
	.stepsList li h4{ font-size: 0.8em; font-weight: 600; margin: 0 auto; width: 105px; max-width: 150px;  }
	
	.icoW{ display: block; text-align: center; margin-bottom: 15px; }
	.icoW svg{ height: 57px; color: #FDC600; }
	.icoW img{ height: 60px; }
	.icoW.mini img{ height: 48px; }


	.arrowW{ display: block; position: absolute; right: -17px; top: 35px; z-index: 100; }
	.arrowW svg{ height: 60px; color: #FDC600; }
	
	
	.stepsLegendW{ padding-top: 15px; min-height: 200px; position: relative;}
	
	.stepsLegend{ 
		width: 500px; padding: 15px 65px 15px 15px; position: absolute; left: 0; display: none;
		background: #FDC600; color: #000; font-size: 0.9em; font-weight: 600;
		-webkit-border-radius: 10px;
		-moz-border-radius: 10px;
		border-radius: 10px; }
	.stepIco svg{ color: #000; position:absolute; z-index: 10; right: 15px; top: 15px; height: 40px;}
		
	.arrowbottom{ display: block; position:absolute; z-index: 0; left: 0; bottom: -40px; width: 100%; text-align: center; opacity: 0;}
	.arrowbottom span{ background: #FDC600; transform: rotate(45deg); width: 50px; height: 50px; display: block; margin: 0 auto; }
	
	
	
	#DefiscPoints .shadLinkW{ justify-content: flex-start; padding-top: 20px; padding-bottom: 15px; }
	#DefiscPoints .shadLinkText svg, #DefiscPoints .shadLinkText img {  height: 70px; max-height: unset;}
	
	
	
	/* * * * * * * * * * * * * * * * * * * * * * * REALS  * * * * * * * * * * * */
	
	
	
	
	#page-nos-realisations #Content{ padding-top: 180px;}
	
	.backReals:hover{ color: #000; }
 
 	#SubMenuW{ margin-bottom: 50px; position: relative; z-index: 100; top: -2px; }
	#SubMenuW.nomargin{margin-bottom: 0; }
	#SubMenuW ul.submenu{  background: none; width: 100%; display: table; text-align: center; /*border-bottom: 1px solid #666;*/ }
	#SubMenuW.colormenu ul.submenu{  background: none; }
	#SubMenuW ul.submenu li{ display: inline-block; padding: 0 14px; }
	#SubMenuW ul.submenu li a { display: block; padding: 10px 0; color: #000; text-transform: uppercase; }
	#SubMenuW ul.submenu li a:hover { color: #777; }
	#SubMenuW ul.submenu li:last-child{ border-right:none }
	#SubMenuW ul.submenu li.current{ background: #FDC600;  
	-webkit-border-radius: 10px; border-right:none;
	-moz-border-radius: 10px; border-radius: 10px; }
	
	#SubMenuW ul.submenu li.cat-2.current{ background: #ee7408;  }
	#SubMenuW ul.submenu li.cat-3.current{ background: #ed686d;  }
	
	#SubMenuW ul.submenu li.current a{  color: #000; }
	
	
	#RealList{ flex-wrap:wrap; justify-content: center; }
	#RealList li .progVignette {
		height: 250px;
		margin-bottom: 18vh;
		padding-top: 7vh;
	}
	#RealList li .progVignetteW .link {
		margin: 0;
	}
	#RealList li .progVignetteW .link svg {
		position: relative; top: 2px;
	}
	
	
	#RealPhotos{ gap: 10px; justify-content: center; flex-wrap:wrap;}
	#RealPhotos li{ width: 24%; background: #F3F2F4 url(zims/loader/zim-tempo.gif) no-repeat center; min-height: 150px; }
	#RealPhotos li img{  
		display:inline-block; width: 100%; vertical-align: top;
		-moz-transition:all .3s ease-out;
	   -webkit-transition:all .3s ease-out;
	   -o-transition:all .3s ease-out;
		transition:all .3s ease-out;
	}
	#RealPhotos li img:hover{  
		opacity: 0.8;
	}
	
	/*
	#RealList { margin-bottom: 100px;}
	#RealList li:nth-child(4n+1){ clear: left; }
	
	.real { margin-bottom: 20px; position: relative;}
	.real .description{ font-size: 1em;  line-height: 1.2em;}

	.real h4{ padding: 10px 20px; background: #111; color: #fff !important; display: inline-block; font-size: 1.2em; margin-top: -25px; position: relative;  z-index:100; margin-bottom: 0; }
	.real a.moreinfo{ color: #000; font-size:1.8em; position: relative; display: block; float: right; top: 7px;}
	.real a.moreinfo:hover{ }
	
	.real .descriptionW{ 
		display: none; position: absolute; top: 40%; left: 0; padding: 20px 5% 5px 5%; z-index: 200;
		min-width: 240px;  width: 90%; background: #fff;
		-moz-box-shadow: 0px 0px 20px 0px #656565;
		-webkit-box-shadow: 0px 0px 20px 0px #656565;
		-o-box-shadow: 0px 0px 20px 0px #656565;
		box-shadow: 0px 0px 20px 0px #656565;
		filter:progid:DXImageTransform.Microsoft.Shadow(color=#656565, Direction=NaN, Strength=20);}
	
	.real .popupClose {
		position: absolute;
		right: 10px;
		top: 10px;
		font-size: 1.4em;
		z-index: 5003;
		color:#000;
	}
	
	
	.overlayMore{ 
		display: block; background: rgba(0, 0, 0, 0.6); opacity: 0;
		width: 114%; height: 114%; position: absolute;; left: -7%; top: -7%;
		text-align: right; 
		moz-transition: opacity 0.3s ease-in-out;
		-webkit-transition: opacity 0.3s ease-in-out;
		-o-transition: opacity 0.3s ease-in-out;
		-ms-transition: opacity 0.3s ease-in-out;
		transition: opacity 0.3s ease-in-out;}
	.realink:hover .overlayMore{ opacity: 1;}	
	.overlayMore i{
		color: #fff; font-size: 5em; padding-top: 20px; padding-right: 35px;
	}*/
	
	
	
	
	
	/* * * * * * * * * * * * * * * * * * * * * * * RECHERCHE MULTI CRITERES * * * * * * * * * * * */
	
	
	/*
	
	#FilterWW{ background: #e9e9e9 url(zims/frontend/filter-bottom.jpg) no-repeat center bottom ; margin-bottom: 20px; padding-bottom: 25px}

	#FilterW{ margin: 0 15%; width: 70%; padding: 40px 0; position: relative; }
	
	
	#field-etoiles, #field-prix_min, #field-prix_max, #fieldsList-chambre, #field-region{ display: none;}
	
	
	.topButtonW{ position: absolute; top: -12px; right: 20px; }
	.topButtonW a{ float: right; margin-left: 15px;}
	
	.filterClose{ padding: 3px 8px; color: #fff; background: #333; }
	.filterInit{padding: 3px 8px; color: #fff; background: #0066a6;}
	.filterCopy{ padding: 3px 8px; color: #fff; background: #0066a6; position: relative}
	.filterCopy span{ display: block; position: absolute; width: 100%; top: 30px; left: 0; font-size: 1.5em; color: #000; text-align: center; display: none; }
	
	.filterOpen{ background: #0066a6; display: none; position: relative; top: -40px; }
	
	.closed .filterClose, .closed .filterInit, .closed .filterCopy{ display: none; }
	.closed .filterOpen{ display: inline-block;}
	
	
	
	
	
	
	#FilterMap{ display: inline-block; float: right; width: 30%; position: relative; z-index: 100;}

	#FilterReplacers{ width: 69%; position: relative; z-index: 90;}
	
	#canvasMap{
     
		position: absolute;
			width : 320px;
			height : 320px;
			z-index: 99;
	}

	#legende {
		font-size: 1.2em;
		color: #000;
		z-index: 101;
		position: absolute;
		padding:0;
		bottom: 10px; width: 100%; text-align: center; 
		  
	}
	
	
	
	
	
	#FilterReplacer1{ display: flex; width: 100%; text-align: center; border-bottom: 1px solid #aaa; min-height: 200px;}
	.replacerCell{ display: inline-block; border-right: 1px solid #aaa; padding: 25px 3%; }
	.replacerCell:last-child{ border-right: 0; }
	.replacerCell h4{ text-align: center; }
	
	
	.replacerStar{
		padding-left: 0;
		min-width: 230px;
	}
	#StarsSelector{  display: table; width: 100%; text-align: center; min-width:145px;}
	#StarsSelector li{  display: inline-block;  }
	#StarsSelector li svg{ color: #0066a6; font-size: 1.8em; }
	
	#StarsSelector li .fullstar{  display: none;}
	#StarsSelector li.full .fullstar{  display: inline;}
	#StarsSelector li.full .emptystar{  display: none;}
	
	
	
	
	.replacerPrice{ padding-right: 4.5% ; flex-grow: 2;}
	.replacerPrice .sliderW{ position: relative;}
	#SliderBudget{ margin-top: 35px; }
	.noUi-handle{
		background: #0066a6;
		border-color: #0066a6;
		box-shadow: none;
	}
	#priceMin{ position: absolute; bottom:-35px; left: 0;}
	#priceMax{ position: absolute; bottom:-35px; right: -15px;}
	
	
	
	
	#FilterReplacer2{ width: 100%; text-align: center; border-bottom: 1px solid #aaa; padding-top: 20px;}
	
	.replacerRooms{ padding-bottom: 0; padding-right: 0; }
	#RoomsSelector{  display: table; width: 100%; text-align: center; min-width: 512px; ;}
	#RoomsSelector li { 
		display: inline-block; width: 100px; color:#0066a6; font-weight: bold; text-transform: uppercase; font-size: 0.7em;
		padding: 65px 7px 10px 7px; vertical-align: top; height: 100px; line-height: 1em; margin-right: 3px;
		-webkit-border-top-left-radius: 70px;
		-webkit-border-top-right-radius: 70px;
		-moz-border-radius-topleft: 70px;
		-moz-border-radius-topright: 70px;
		border-top-left-radius: 70px;
		border-top-right-radius: 70px;
		background: #fff url(zims/frontend/sprites-chambres.png?c=2) no-repeat 14px 20px;
		cursor: pointer;
		
	}
	#RoomsSelector li:last-child { margin-right: 0; }
	#RoomsSelector li span { color:#0066a6;  }
	
	#RoomsSelector li.type-2{ background-position: 14px -104px; }
	#RoomsSelector li.type-3{ background-position: 14px -223px; }
	#RoomsSelector li.type-4{ background-position: 14px -470px;}
	#RoomsSelector li.type-13{ background-position: 14px -346px;}
	
	
	#RoomsSelector li.selected { background-color:#0066a6; color: #fff; background-position: -214px 20px;}
	#RoomsSelector li.selected span { color: #fff;}
	#RoomsSelector li.selected { background-color:#0066a6; color: #fff;}
	#RoomsSelector li.selected.type-2{ background-position: -214px -104px; }
	#RoomsSelector li.selected.type-3{ background-position: -214px -223px; }
	#RoomsSelector li.selected.type-4{ background-position: -214px -470px;}
	#RoomsSelector li.selected.type-13{ background-position: -214px -346px;}
	
	
	
	
	#FilterForm{ clear: both; }
	
	#FilterFormMainFieldset{
		margin-top:40px;
	}
	
	.fieldsListTitle{ 
		text-align: left; font-size: 0.9em; text-transform: uppercase; margin-bottom: 10px; letter-spacing: 2px; font-weight: bold; 
		background: url(zims/frontend/sprites-filter.jpg?c=2) no-repeat left top; padding: 10px 0 10px 45px;
	}
	#fieldsList-restauration .fieldsListTitle{ background-position: left -160px; }
	#fieldsList-loisirs .fieldsListTitle, #fieldsList-hobbies .fieldsListTitle{ background-position: left -330px; }
	#fieldsList-commodites .fieldsListTitle, #fieldsList-amenities .fieldsListTitle{ background-position: left -485px; }
	
	
	#fieldsList-restauration, #fieldsList-parking, #fieldsList-loisirs, #fieldsList-hobbies, #fieldsList-commodites, #fieldsList-amenities{ display: block; float: left; margin-right: 6%; margin-bottom: 40px; }
	#fieldsList-restauration{  }
	#fieldsList-commodites, #fieldsList-amenities{ width: 35%; margin-right: 0; }
	#FilterForm .checkbox-field{ margin-bottom: 7px; }
	#FilterForm .checkbox-field input{ border-color: #0066a6;  }
	
	
	
	#fieldsList-thematique{ clear: left; border-top: 1px solid #aaa; padding-top: 25px; margin-top: 25px; }
	#fieldsList-thematique .fieldsListTitle, #fieldsList-thematique .fields{ display: inline-block; float: left; }
	
	#fieldsList-thematique .fieldsListTitle{ 
		margin-right: 4%; width: 8%; 
		padding: 36px 0 0 0;
		background-position: left -653px; }

	#fieldsList-thematique .fields{  width: 88%; }
	#fieldsList-thematique .checkbox-field{ display: inline; float: left; width: 23%; margin-right: 2%; }
	
	
	
	#fieldsList-labels{ clear: left; border-top: 1px solid #aaa; padding-top: 25px; margin-top: 25px; }
	#fieldsList-labels .fieldsListTitle, #fieldsList-labels .fields{ display: inline-block; float: left; }
	
	#fieldsList-labels .fieldsListTitle{ 
		margin-right: 4%; width: 8%; 
		padding: 36px 0 0 0;
		background-position: left -821px; }

	#fieldsList-labels .fields{  width: 88%; }
	#fieldsList-labels .checkbox-field{ display: inline; float: left; width: 23%; margin-right: 2%; position: relative;}
	#fieldsList-labels .checkbox-field input{ position: absolute; top: 10px; left: 10px;)  }
	#fieldsList-labels .checkbox-field span{ display: block; text-align: center; background: #fff; border-radius: 10px; padding: 5px 10px; }
	#fieldsList-labels .checkbox-field span img{ max-height: 70px;}
	#fieldsList-labels .checkbox-field span span{ padding: 25px 15px;}
	#fieldsList-labels .checkbox-field span span.zimed{ padding: 5px 5px 0 5px;}
	
	
	
	
	#page-recherche-multi-criteres #FilterForm .formButtons{ display: none;}
	
	
	*/
	
	
	
	
	
	
	
	
	/**/
	

	
	#ListingHotels{ }
	
	#ListingHotels .photoListHotel{ display: block; width: 100%; }
	#ListingHotels .logoHotelList{ display: block; max-width: 200px; max-height: 65px; margin: 10px 0; }
	
	
	#ListingHotels li { border-bottom: 1px solid #000; margin-bottom: 50px; }
	
	#ListingHotels li a { display: block; text-align: left; padding-bottom: 20px; color: #000; } }
	#ListingHotels li a:hover { display: block; text-align: left; padding-bottom: 20px;  }
	
	#ListingHotels li .zimW{ height: 250px; position: relative; overflow: hidden; }
	#ListingHotels.col4 li .zimW{ height: 200px;}
	
	#ListingHotels li .zimW img{ position: relative; }
	
	#ListingHotels li .infoHotels{ display: block; text-align: left; min-height: 115px; }
	#ListingHotels.col4 li .infoHotels{min-height: 130px; }
	
	#ListingHotels li .stars{ width: 30%;  text-align: right; float: right; margin: 30px 20px 0 0;   }
	#ListingHotels li .stars svg{ color: #0066a6 !important; font-size: 1em; }
	
	#ListingHotels li strong{ display: inline-block; text-align: left; text-transform: uppercase; font-weight: lighter; font-size: 1.1em; letter-spacing:2px; line-height: 1.1em; padding-right: 50px }
	#ListingHotels li a:hover strong{ text-decoration: underline; }
	
	#ListingHotels li .plusIcon{ position: absolute; bottom: 0; right: 0;}
	#ListingHotels li .plusIcon img{ vertical-align: bottom; image-rendering: -webkit-optimize-contrast;}
	
	
	
	/*fieldset#FilterFormMainFieldset {
		width: 30%;
		display: flex;
		background-color: #F5F5F5;
		margin-top: 7%;
		flex-direction: column;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	fieldset#FilterFormMainFieldset{width:30%;}
	fieldset#FilterFormMainFieldset input{width: 20%;margin: 0;margin-left: 6%;}
	
	input#FilterFormSubmit, input#FilterFormCancel {width: 25px;background: grey;padding: 0.2em 0em;margin-left: 0px;}
	    
	#ListingHotels {
		margin: 0;
		padding: 0;
		display: flex;
		flex-wrap: wrap;
		text-align: center;
		margin-top:20px;
	}	
	
	#ListingHotels li { width: 33%; border: 1px dashed grey;}
   
   
	*/
	
	
	
	
	
	
	
	
	
	
	/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * GAL * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
	
	
	#GalleryW{ overflow: hidden; margin-left: 7.5%!important; margin-right: 7.5%!important; width: 85%}
	#mosaic {
    position: relative;
	}

	#mosaic .mosaic-item {
		opacity: 0;
		max-width:23%; margin: 0 1% 25px;
		-webkit-box-flex : 0;
	}
	#mosaic .mosaic-item  img{
		display: block;
		width: 100%;
	}
	
	
	
	
	/* fullgal */
	
	#page-galerie-photo{ background: #222}
	#page-galerie-photo #Content *{ color: #fff;}
	
	#GalerieW{  }
	#GalerieW ul{ display: table; width: 100%; text-align: center;   }
	#GalerieW ul li{ display: inline-block; width: 22%; margin: 0 0.5% 40px; vertical-align: top; min-height: 200px; }
	#GalerieW ul li a{ color: #000;  }
	#GalerieW ul li .zimW{ display: block; height: 200px; background: url(zims/loader/loader2.gif) no-repeat center; overflow: hidden; position: relative; }
	#GalerieW ul li img{ display: block; width: 100%; position: relative;}
	
	
	
	/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * Press * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
	
	
	#page-press #ContentW{ background: #111;  }
	#page-press #Content {  }
	#page-press #Content *{ color: #fff;  }
	#page-press .button{ border-color: #fff;  }
	
	
	.contactBlock{ display: table; width: 100%; text-align: center; margin-bottom: 50px;}
	
	.contactBlock li{ display: inline-block; margin: 0; border-right: 1px solid #fff; padding: 0 25px;  }
	.contactBlock li.bigf{ font-size: 1.2em; line-height: 1.2em; }
	.contactBlock li .button{ margin-top: 10px; }
	.contactBlock li:last-child{ border: none; }
	
	.socialsLinks i{ font-size: 2em;}
	
	
	.contactBlock.justifiedBlock li{ width: 45%; padding: 0 2.5%; }
	
	
	#page-contact .contactBlock li{ border:none; }
	#page-contact .contactBlock li strong{ font-family: 'Montserrat', sans-serif; display: inline-block; margin-bottom: 20px; font-size: 1.5em; }
	
	
	
	/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * GEO * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
	
		
		
	.vcard .tel .type, .vcard .uri { display:none; }
	#jGMap .vcard .hor{ display:none; }
	
	#jGMap .vcard{  padding: 10px 10px 0 10px;  }
	#jGMap .vcard p{ color: #111; line-height: 1.3em; margin: 5px 0; font-size: 1.1em; font-family: 'Open Sans', sans-serif;  }
	#jGMap .vcard p.fn{ 
		margin: 0; 
		border-bottom: 1px solid #333; padding-bottom: 10px; margin: 0 0 10px 0;}
	
	#jGMap .vcard p.fn img{ width: 200px;  }
	
	#jGMap .vcard .tel .value{  font-size: 1.1em; }
	
	

	
	#page-recherche-geographique #Content {
		   padding: 100px 0 0 0 !important;
			
	}

	#jGMapW {
		/*width: 73%; display: inline; float: right; height:600px; margin:50px 0 0 0; border:none;*/
		height:calc(100vh - 100px); margin:0; border:none; right: 0; position: relative; z-index: 10;
		padding: 0; margin: 0;
		-moz-transition: width 0.25s ease-out;
		-webkit-transition: width 0.25s ease-out;
		-o-transition: width 0.25s ease-out;
		-ms-transition: width 0.25s ease-out;
		transition: width 0.4s ease-in-out;
		/*-webkit-perspective: 1000;*/ }
		
	#jGMapW .geo{ display:none;}
	#jGMap { width:100%; height:100%; }
	
	
	.hotelsGeoList{}
	.hotelsGeoList .gm-style-iw, .hotelsGeoList .gm-style-iw-c, .hotelsGeoList .gm-style-iw-d { padding: 0 !important; overflow: visible !important;}
	
	.hotelsGeoList .gm-ui-hover-effect>span {
		width: 18px !important;
		height: 18px !important;
		margin: 5px !important;
	}
	
	.markerLabel{ margin: 0; padding: 0; width: 210px;}
	.markerLabel a{ color: #000; font-weight: bold; font-size: 0.9em;}
	.markerLabel a img{width: 210px; }
	
	.hetat {
		display: inline-block;
		position: relative;
		top: -20px;
		padding: 4px 8px;
		background: #FDC600;
		color: var(--bleufonce);
		font-weight: 600;
		-webkit-border-bottom-right-radius: 7px;
		-moz-border-radius-bottomright: 7px;
		border-bottom-right-radius: 7px;
		-webkit-border-top-right-radius: 7px;
		-moz-border-radius-topright: 7px;
		border-top-right-radius: 7px;
	}
	
	.htxtW{ padding: 0 10px; 
		display: block;
		position: relative;
		top: -10px
	}
		
	.hnom{ font-size: 1.2em;  color: var(--bleufonce);}
	.markerLabel .progVignetteBottom{ padding: 10px; color: #fff;}
	.hprice span{font-size: 1.3em;}
	.markerLabel .progVignetteBottom > span {
		flex: 1;
		padding: 0 !important;
		color: #fff;
	}
	
	
	
	#SelectFilterW{ padding: 0 25px; }
	#SelectFilterW p{margin: 0 0 15px 0; text-align: left; }
	#SelectFilterW label{ display: inline-block; float: left; color: #fff; font-weight: 600; margin-right: 15px; }
	#SelectFilterW select{ border: none; color: #000; background: #fff; position: relative; top: -3px; text-align: left;
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		border-radius: 5px;
		}
	#SelectFilterW select option{ color: #000; text-align: left !important;}
	
 

	
	
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * NEWS * * * * * * * * * * * * * * * * * * * * * * * * * * * * */		
		
	#page-actualite{ background: #222;    }
	
	#page-actualite #Content{ padding-top: 200px; }
	#page-actualite #Content *{ color: #fff; }
	
	#ActusList{ margin: 60px auto; padding-top: 0 !important;}
	
	#ActusList li:nth-child(3n+1){ clear: left; }
	
	
	.actu{ position: relative; margin-bottom: 50px;}
	.actu h3{ margin: 0; height: 100%;  font-size: 1.4em;  }
	.actu h3 span{font-size: 0.8em;  }
	.actu a { display: block; vertical-align: top; position: relative; padding: 5px; border: 1px solid #0066a6 }
	.actu a img{ width: 100%; vertical-align: top;}
	
	.actu h3 div{  margin-top: 15px;  }
	.actu h3 strong{  text-transform: uppercase;  }
	
	.actu-listItemOverlay {
		position: absolute; top: 0; left: 0;
		display: block;
		height: 100%;
		width: 100%;
		
		background: rgba(0,102,166,0.6);
		opacity: 0;
		-moz-transition: opacity 0.3s ease-in-out;
		-webkit-transition:  opacity 0.3s ease-in-out;
		-o-transition: opacity 0.3s ease-in-out;
		-ms-transition:  opacity 0.3s ease-in-out;
		transition:  opacity 0.3s ease-in-out;
		
	}
	.actu a:hover .actu-listItemOverlay  { opacity: 1}
	
	/*.chrome .actu-listItemOverlay { width: 93%; height: 100%;}

	.actu-listItemTitle{
		
		font-size: 1.3em;
		line-height: 1.4em;
		margin: 0; color: #fff;
		height: 100%;
		width: 100%;
		display: table-cell;
		text-align: center;
		vertical-align: middle;
		text-transform: uppercase;
		padding: 10px;
		border: 1px solid #000;
		
	}
	.actu a:hover .actu-listItemTitle { border: 1px solid #fff;}	
	
	.actu-listItemSubtitle{ 
		font-size: 0.5em;
		display: inline-block; 
		margin-top: 20px; border-top: 1px solid #fff;
		line-height: 1.2em; padding-top: 10px;
	}
	
	
	*/
	
	
	

	
	
	.backLink{ display: block; margin-top: 15px; font-size: 1.1em; text-transform: uppercase; letter-spacing: 0;}
	
	
	.actuSubtitle{ background: #0066a6; text-align: center; color: #fff; padding: 5px 10px; margin-top: 0; font-size: 1.3em;}
	
	.actuText{ font-size: 1.2em;}
	
	.actuFlyerW{}
	.actuFlyerW img, .actuHeaderW img, .actuFooterW img{ display: block; width: 100%;}
	
	.actuHeaderW{ margin-bottom: 40px;} 
	.actuFooterW { margin-top: 20px;}
	

	
	.newsGalPagi{  position: relative; margin-top: 5px;}
	.newsGalArrow{ position:absolute; font-size: 1.8em; color: #fff; top: 0; }
	.newsGalArrow.carousel-prev{  }	
	.newsGalArrow.carousel-next{ right: 0; left: auto;}	
	.newsGalCounter{ width: 100%; display: block; text-align: center; line-height: 1.8em; color: #fff }
	/*.newsGalW.carousel-prev{ left: 10px; }	
	.newsGalW.carousel-next{ right: 10px; background-position: right center;}	*/
	
	
	/*#FilterNews { padding-top:1.5em;  }
	#FilterNews  li  { display:inline-block; margin-bottom:0.5em; margin-right:0.4em;   }
	#FilterNews  li a  { background:#000000; color:#ffffff; text-transform:uppercase; padding:0.5em 1em;  display:block;  }
	#FilterNews  li a.current { background:#cccccc; color:#000000; }*/


	.couvLink{ position: relative; display: block;}
	.couvLink img{ position: relative; z-index: 90;}
	.overlayPink {
		position: absolute; top: 0; left: 0;
		display: block;
		height: 100%;
		width: 100%;
		z-index: 100;
		
		background: rgba(254,36,138,0.6);
		opacity: 0;
		-moz-transition: opacity 0.3s ease-in-out;
		-webkit-transition:  opacity 0.3s ease-in-out;
		-o-transition: opacity 0.3s ease-in-out;
		-ms-transition:  opacity 0.3s ease-in-out;
		transition:  opacity 0.3s ease-in-out;
		
	}
	.couvLink:hover .overlayPink  { opacity: 1 }


	#FilterNews { text-align: center; display: table; width: 90%; margin: 20px 5%;   }
	#FilterNews  li  { display:inline-block; margin: 0;  border-right: 1px solid #fff;   }
	#FilterNews  li:last-child  { border-right: none;   }
	#FilterNews  li a  { font-size: 1.1em; padding: 0 15px; }
	#FilterNews  li a.current { font-size: 1.4em; }




	/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * CONTACT * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
	
	
	
	#page-contact{    }
	
	#page-contact #Content{ padding-top: 155px; padding-bottom: 0;}
	
	#ContactW{ width: 80%; margin: 0 10%; overflow: auto;}
	
	/* CONTACT */
	
	#page-contact #jGMapW {
		margin-top: 50px; position: relative; 
		width: 100%; display: block; float: none; overflow: hidden; height: 70vh; }

	#ContactBlock{ /*background: url(zims/frontend/plane.gif) no-repeat center top;*/  }
	#ContactBlock h2{ color: #fff;  }
	#ContactBlock svg{ font-size: 2em; color: #0066a6;}
	#Coords .fn{ font-size: 1.5em; margin-bottom: 20px;}

	#Content .vcard  .type, .vcard .uri, .vcard .geo{ display:none; }	
	
	
	.coordsPopup{ text-align: center; padding: 15px 10px 0;}
	.coordsPopup span{ margin-bottom: 10px; display: block;}
	.coordsPopup span.title{ font-size: 1.2em; font-weight: 600; }
	.coordsPopup span a{ color: #000; }
	.coordsPopup span svg { color: var(--bleufonce); }
	
	
	
	
	
	

	
	#ContactFormWW{  position: relative; padding-bottom: 15px;  }
	#ContactFormW{  background: #f3f3f3; padding: 15px 25px; position: relative; z-index: 10; }
	#ContactFormW h3{  color: #0b516f; margin: 0 0 15px 0; }
	#ContactForm{ margin: 0;  }
	
	#ContactFormWW .deco2{ position: absolute;  z-index : 1; background: #0066a6; opacity: 0; }
	#ContactDeco1{ bottom: -15px; left: -15px; width: 30%; height: 20%; }
	#ContactDeco2{ top: -15px; right: -15px; width: 30%; height: 20%; }
	
	#ContactForm fieldset p, #ReservForm fieldset  p{  width: 45%; display: inline; float: left;}

	.fieldW{ display: block;}
	/*
	#NewsletterForm fieldset p{ width: 90% }
	
	*/
	
	form legend{ font-weight: 600; font-size: 1.3em; padding: 25px 0;}
	
	
	
	#FormW{ margin: 50px 0 100px;}
	#FormW.formcallW{ padding-top: 100px;}
	#FormW .formcallZone {
		margin: 0 10%;
		position: relative;
		z-index: 5;
		/*border-bottom: 10px solid #FDC600;*/
		padding: 60px 120px;
		background: #F3F2F4;
		overflow: hidden;
	}
	
	
	
	#ContactForm fieldset p.textField  label{ display: none;}
	
	#ContactForm fieldset p#field-nom, #ContactForm fieldset p#field-email, #ContactForm fieldset p#field-date,
	#ReservForm fieldset p#field-nom, #ReservForm fieldset p#field-email, #ContactForm fieldset p#field-loc
	{ margin-right: 9%; }
	
	#ContactForm fieldset p#field-societe{ margin-right: 50%; }
	#ContactForm fieldset p#field-objet, #ContactForm fieldset p#field-message, #ReservForm fieldset p#field-message, #ContactForm fieldset p#field-cgv
	{ width: 100%; }
	#ContactForm fieldset p#field-message textarea, #ContactForm fieldset p#field-objet input
	{ width: 97%; }

	
	#ContactFormButtons{ clear: both;}
	#ContactFormSubmit{ border-color: var(--bleufonce); color: var(--bleufonce);}
	#ContactFormSubmit:hover{ color: #fff;}
	
	#message{  height: 100px; }

	

	.legendform { margin: 15px 0;}
	
	

	p#Confirmation{
		font-size: 1.4em; font-style:italic; font-weight: 300; color: #000; line-height:40px; padding: 0; margin: 50px 0; text-align:center;
	}
	
	
	
	/* SEARCH  / ANNONCES */
	
	/* css filtre listing annonce */
				
	#AnnonceFilter {
		position: relative;
		z-index: 120;
		margin-bottom: 30px;
		margin-top: 30px;
	}


	div#SearchFormWrapper {
		display: flex;
		justify-content: center;
		margin: 0 auto;
		align-items: center;
		gap: 15px
	}

	#page-home div#SearchFormWrapper {
		width: 90%;
	}

	fieldset#SearchFormMainFieldset {
		display: flex;
		background-color: red;
		width: 100%;
		margin: 0 auto;
		color: #ffffff;
		padding: 31px;
		align-items: center;
		justify-content: space-around;
		background: rgba(255, 255, 255, 0.5);
	}

	fieldset#SearchFormMainFieldset p {
		margin: 0px;
	}

	#field-security {
		display: none !important;
	}

	#SearchForm {
		width: calc(100% - 50px);
		padding: 15px 20px 5px;
		display: flex;
		flex-wrap: wrap;
		gap: 10px;
		background: #fff;
		-webkit-border-radius: 10px;
		-moz-border-radius: 10px;
		border-radius: 10px;
		-webkit-box-shadow: 0px 3px 5px 4px rgba(0, 0, 0, 0.15);
		box-shadow: 0px 3px 5px 4px rgba(0, 0, 0, 0.15);
	}

	#SearchForm fieldset {
		flex: 1;
	}
	
	#SearchForm input {
		font-size: 0.9em; 
	}

	#SearchForm select {
		font-size: 0.9em;
		min-width: 230px;
	}

	#SearchForm label {
		margin: 0;
	}

	#SearchForm legend {
		display: none;
	}

	#FilterReset {
		margin: 0 20px;
	}

	#fieldset-type,
	#field-type {
		display: none;
	}
	
	
	
	

	/* page annonce*/

	.PaginationLinks {
		display: flex;
		justify-content: center;
		gap: 10px;
	}

	.PaginationLinks a {
		padding: 5px 12px;
		background: #eee;
		color: #000;
	}

	.PaginationLinks a.CurrentPage {
		background: var(--bleufonce);
		color: #fff;
		font-weight: 700;
	}


	#page-annonce #Content {
		padding-top: 100px;
	}

	#PresentationAnnonceW {
		display: flex;
		flex-wrap: wrap;
		gap: 50px;
		padding-top: 100px;
	}

	.centeredlist90 {
		margin-left: 5% !important;
		margin-right: 5% !important;
		width: 90%;
	}

	#PresentationAnnonce {
		width: 45%;
	}
	.annonceGallery img {
		width: 100%;
	}

	.ville {
		background: var(--bleufonce);
		padding: 15px;
		color: #fcf9f9;
		font-weight: 700;
	}

	.descriptif {
		font-size: 13px;
		text-align: justify;
		line-height: 34px;
	}

	#DescAnnonce {
		width: calc(55% - 50px);
	}

	#PhotoAnnonce {
		background: #f1f1f1 url(zims/loader/thumb-loader.gif) no-repeat center;
		min-height: 300px;
	}

	.prix {
		padding: 15px;
		font-weight: 700;
		color: #fcf9f9;
		background: var(--bleufonce);
		margin: 0;
		font-size: 1.5em;
	}

	.bienSpecs {
		display: flex;
		justify-content: center;
		margin-bottom: 50px;
	}
	.bienSpecs li {
		flex: 1;
		text-align: center;
	}

	#Eco {
		height: 300px;
		width: 100%;
	}

	#Eco div.graphW {
		display: inline;
		float: left;
		width: 280px;
		padding: 0;
		margin: 0;
		border: 2px solid #999999;
		overflow: hidden;
	}

	#Eco div#GraphConsommation {
		margin-right: 80px;
	}

	#Eco h3 {
		font-size: 1em;
		background: #999999;
		color: #ffffff;
		text-transform: uppercase;
		width: 280px;
		display: block;
		font-weight: 400;
		letter-spacing: 0.5px;
		line-height: 20px;
		padding: 5px;
	}

	#Eco div.graph {
		height: 235px;
		position: relative;
		width: 240px;
		margin: 0 auto;
	}

	#Eco div.graph img {
		position: absolute;
		top: 0;
		left: 0;
		z-index: 100;
	}

	#Eco p.graphArrow {
		border-bottom: 2px solid #58585a;
		position: absolute;
		top: 20px;
		z-index: 10;
		width: 100%;
		height: 0;
	}

	#Eco div p span.graphArrowValue {
		display: block;
		height: 21px;
		min-width: 37px;
		float: right;
		position: relative;
		bottom: 10px;
		background: #58585a;
		color: #fff;
		text-align: right;
		padding-right: 10px;
		line-height: 21px;
	}

	#Eco div p span.graphArrowValue span {
		display: block;
		height: 21px;
		width: 11px;
		float: left;
		position: relative;
		left: -11px;
		background: url(zims/frontend/agence-immo/graph-arrow.png);
		line-height: 21px;
	}
			
	div#BandeauPhotos {
		grid-template-columns: repeat(3, 1fr);
		display: grid;
		gap: 22px;
	}

	#DescAnnonce img {
		display: block;
		width: 100%;
	}
	
	.greyW {
	background: #f1f1f1;
	padding: 20px;
	}
	
	
				
	
	
	/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * FANCY * * * * * * * * * * * * * * * * * * * * * * * * * * * * */	
 

	
/*
	#ContactForm{ margin: 25px 0; padding: 0 0 0 0%;}
	#ContactForm fieldset p{  width: 45%; display: inline; float: left;}


	#ContactForm fieldset p#field-societe, #ContactForm fieldset p#field-email{ margin-right: 5%; }
	#ContactForm fieldset p#field-objet, #ContactForm fieldset p#field-message{  width: 100%; }

	#message{  height: 100px; }

	#date, #heure, #nbpers{  width: 90px; }


	#ReservLegend{ padding: 0 15px 10px 25px; margin: 10px 180px 10px 0; text-align: left; border-bottom: 1px solid #222; }



	
	.fancybox-inner  p#Confirmation{ padding: 50px 15px; margin: 0;}

	
	#FancyContactBox{ width: 600px; background: #fff;  }
	#FancyContact{ padding: 0 25px 25px; }
	#FancyContact h2{ color: #000; font-size: 2.5em; font-weight: 900; letter-spacing:normal;text-transform: uppercase; margin: 0 0 15px 0; text-align:left; padding-top: 15px;}

	#ContactForm{ margin: 0;}
	

	input{ width: 90%; margin: 0;}

	#ContactForm fieldset p{  width: 43%; display: inline; float: left;}
	#ContactForm fieldset p#field-nom, #ContactForm fieldset p#field-email{ margin-right: 10%; }
	#ContactForm fieldset p#field-objet, #ContactForm fieldset p#field-message{  width: 96%; }
	#message{  height: 100px; }

	.formButtons { display: inline; float: left; width: 100%; text-align: center;}
	
	.fancybox-inner  #ContactForm *{ color: #000;}
	.fancybox-inner  #ContactFormSubmit { border-color: #000;}
	.fancybox-inner  #ContactFormSubmit:hover { color: #fff;}
	.fancybox-inner  #ContactForm input, .fancybox-inner  #ContactForm textarea { border-bottom: solid 1px rgba(0, 0, 0, 0.85); }

	 
 
	 p#Confirmation{
		font-size: 1.2em; font-weight: 300; margin: 100px 5%; text-align:center; line-height: 1.5em;
	}
	
	*/
	
	
	/* SCROLLICON */
	

	
		.icon-scrollW{position: absolute; bottom: 115px; right: 7%;}
		
		.icon-scroll,
		.icon-scroll:before{
		  position: absolute;
		  left: 50%;
		}
		.icon-scroll{
		  width: 30px;
		  height: 50px;
		  margin-left: -20px;
		  top: 50%;
		  margin-top: -35px;
		  box-shadow: inset 0 0 0 1px #fff;
		  border-radius: 25px;
			}
		.icon-scroll:before{
		  content: '';
		  width: 8px;
		  height: 8px;
		  background: #fff;
		  margin-left: -4px;
		  top: 8px;
		  border-radius: 4px;
		  animation-duration: 2.5s;
		  animation-iteration-count: infinite;
		  animation-name: scroll;
			}
			

		@keyframes scroll{
		  0% {
			opacity: 1;
			
		  }
		  100% {
			opacity: 0;
			transform: translateY(46px);
		  }
		}



	/* ----------------- RESPONSIVE ------------------------------*/

/* ----------------- RESPONSIVE ------------------------------*/

	@media(max-width:1720px) {
			

	
	}
	@media(max-width:1560px) {
		
		.video-js .vjs-tech {
			top: -5vh;
		}
		
		#Menu { width: 30%;	}
		
		
	
	}
	
	
	@media(max-width:1440px) {
	
		#MainResaLink{ right: 15px; padding: 7px 20px; }
		.carteCategTitle{ font-size: 3em;}
		.carteCategTitle.longtitle{ font-size: 2.6em; }
		
		#LangLinks li { margin-right: 8px; }
		.homeSectionW {  padding-bottom: 140px; }
		
		.video-js .vjs-tech {
				top: 0;
			}
		
		#Menu { width: 33%;	}
		
		#SearchBarW {
			margin: 0 2.5%;
			width: 95%;
		}
		#SearchBar {
			padding: 40px 30px 25px 30px;
			
		}
		
	}
		

	
	
	
	@media(max-width:1280px) {
	

		/*
		#MainMenu li {
			font-size: 0.9em;
			margin-right: 6px;
			padding-right: 9px;
		}
		
		#HomeTitleW{ bottom: 30%;}
		.button.under {  padding: 1em 1em;  margin: 0 10px 12px; }
		
		.homeSectionW {  padding-bottom: 125px; }
	
		
		#FaqW { width: 90% !important; margin: 0 5% !important; }*/
		
		#Menu { width: 37%;	}
		
		.centeredlist > li.col25 {
			width: 31.3%;
			margin: 0 0.75%;
		}
		
	}
	
	
	
	
	
	
	
	@media(max-width:1024px) {
			
		body { font-size:17px; }
		input, select, textarea { font-size: 17px; }
		
		.nomob{display: none; }
		.mobonly{ display: block;}
		
		#HomeLinkW{ text-align: right }

			
			
		#Header {  background-position: center -20px; }
	
		#UpperMenu{ display: none; padding-right: 6%;     margin-top: 40px;}
		
		#UpperMenu ul {
			width: 85%;
		}
		#UpperMenu ul li a {
			font-size: 0.7em;

		}
		
		

		
		#HomeLinkW {   margin: 0 2.5% 0 0; }
		#HomeLinkW a img {  width: 120px; padding: 10px 0 0 10%; }
		.scrolled #HomeLinkW a img, .forcedHeader #HomeLinkW a img {  width: 100px; padding-top: 5px; }
		
	
		#LangsW {
			left: 150px;
			top: 27px;
			width: 62px;
			display: none;
		}
		.open #LangsW { display: block;}
		
		#NavIco {   top: 27px; }
		.subactivated #NavIco span { background: #000; }
		.scrolled #NavIco {top: 12px;		}
	
		
		#UpperBseline {
			position: absolute;
			top: 45px;
			left: auto;
			right: 2.5%;
			width: 80%;
			font-size: 0.7em;
			margin-bottom: 0;
			margin-top:22px;
			text-align: right;
		}

	
		#Menu{ width: 100%; }
		
		#MainMenuW {
			padding-top: 150px;
			margin-bottom: 15px;
		}
		#MainMenu > li > a, #MainMenu > li > strong {   
			padding: 10px 0 11px 15px; font-size: 1.3em; 
			-moz-transition: background-color 0s ease-in-out, color 0s ease-in-out;
			-webkit-transition: background-color 0s ease-in-out, color 0s ease-in-out;
			-o-transition: background-color 0s ease-in-out, color 0s ease-in-out;
			-ms-transition: background-color 0s ease-in-out, color 0s ease-in-out;
			transition: background-color 0s ease-in-out, color 0s ease-in-out;
		}
		
		#MainMenu li{ font-size: 1.1em; padding: 7px 0; }
		
		/*#MainMenu li ul > li {}
		#MainMenu li ul > li a {  padding: 11px 10px 10px 15px; font-size: 1em;  }
		#MainMenu li ul > li > ul{ opacity: 1;}
		#MainMenu li ul > li > ul li a {  font-size: 0.9em; padding: 3px 0 3px 15px;  }
		#MainMenu li ul > li:first-child{ padding-top: 0;}
		
		#MainMenu li .submenu {width: 100%; }*/


		
		#MainMenu-room-presentation-Item, #MainMenu-event-presentation-Item{ display: block;}
		
		#SecondaryMenu > li > a, #SecondaryMenu > li > strong {  padding: 2px 0 2px 15px; }
	
		#Copyrights {  font-size: 0.6em; margin: 0 0 10px 0; padding: 0 10px; }
		
		
		#FooterMenu, #FooterNews, #FooterAddr{  display: block; float: none; width: 100%; margin-bottom: 80px; }
		
		
		#FooterMenu li{  text-align: center; font-size: 1.4em;}
		#FooterAddr{  text-align: center;}
		
		#FooterNews #field-valid label{ font-size: 0.65em;}
		#FooterNews .textField{   isplay: block; float: none;  width: 100% !important; }
		
		#FooterNews .formButtons {
			width: auto;
			float: none !important;
			display: block;
		}
		#FootNewsCheck {   bottom: 83%;  left: -1%; }
		#Credits {float: none;  text-align: center; margin-top: 0; }

		
		h2{ width: 95%; margin: 0 2.5%; font-size: 2em; line-height: 1em; margin-bottom:20px;}
		h3{ margin-top: 30px;}
		#ZoomHalfBanner h2{ font-size: 1.7em; line-height: 1em }
		
		p {   font-size: 1em; }
		
		input[type="button"], input[type="submit"], input[type="reset"], .button {
			padding: 0.7em 1.5em;
			line-height: 1.1em;
			transition: color 0s ease-in-out, border-color 0s ease-in-out, background-color 0s ease-in-out;
		}
		
		
		.forcedHeader #Content {   padding-top: 130px; }
		
		
		.scroll-section {  top: 60%; bottom: auto; display: none; }
		
		/***/
		
		
		
		.littleup{ font-size: 1em !important; line-height: 1.3em;}
		.fat{ font-size: 1.1em !important; line-height: 1.5em;}
		.big{ font-size: 1.2em !important; line-height: 1.2em; }
		.super { font-size: 1.5em !important; line-height: 1em; }
		.mega { font-size: 2em !important; line-height: 1em; }
		.ultra { font-size: 2em !important; }
		
		.minimob{ font-size: 0.7em;}
		
	
		.little{ font-size: 1.1em !important }
		
		.fontreset{ font-size: 1em !important }
		.mini{ font-size: 0.8em !important; line-height: 1em; display: inline-block; }
		.tiny{ font-size: 0.7em !important; line-height: 1em; display: inline-block; }
		.micro{ font-size: 0.6em !important; line-height: 1em; display: inline-block; }
		
		.maj{ text-transform: uppercase; }

		
		p.justified, .justified p{ line-height: 1.5em; }
		.bigmargin{ margin-top: 40px!important; margin-bottom: 40px !important;}
		.supermargin{ margin-top: 60px!important; margin-bottom: 60px !important;}
		.megamargin{ margin-top: 120px!important; margin-bottom: 120px !important;}
		.notitle{ margin: 40px 0 0 0;}	
		
		
		
		.titlepadding{ padding-top: 25px;}
		.titlepaddingmini{ padding-top: 10px;}
		.titlepaddingmadium{ padding-top: 50px;}
		.titlepaddingbig{ padding-top: 75px;}
		
		.mainPageTitle { padding-top: 60px;}
		
		.paddingbox {
			padding: 25px 2.5%;
		}
		
		
		
		
	
		.centeredlist{ display: block; }
		.centeredlist90, .centeredlist85, .centeredlist80, .centeredlist75, .centeredlist70, .centeredlist60, .centeredlist50,
		.centeredlist40, #GalleryW 
		{ margin-left: 2.5%!important; margin-right: 2.5%!important; width: 95% !important}

		.centeredlist > li{ width: 100%; }

		
		.centeredlist > li.col25,	.centeredlist > li.col25.colbigspace, .centeredlist > li.col30, .centeredlist > li.col33, .centeredlist > li.col40, .centeredlist > li.col45, .centeredlist > li.col50,	.centeredlist > li.col60, .centeredlist > li.col70,	.centeredlist > li.col80, .centeredlist > li.col100,
		.centeredlist.col3 > li, .centeredlist.col4 > li
		{ width: 100% !important; margin: 0 0 20px 0 !important; }
		
		.centeredlist > li.decalleft{ margin-left: 19%}
		.centeredlist > li.decalleftmini{ margin-left: 9%}
		.centeredlist > li.decalright{ margin-right: 19%}
		.centeredlist > li.decalrightmini{ margin-right: 9%}
		
		
		.itemBG { width: 100%; }
		.zimBlocsList .itemBG { width: 115%; }
		.tabsContent li .itemBG{ width: 100%; }
		
		.scaleSelector { display: block; }
		.scaleSelector li{ width: 100%; overflow: hidden; margin-bottom: 20px !important; }
		.scaleSelector li.col25{ width: 100%; margin: 0 0 20px 0;}
		.scaleSelector li .videoW{ display: none;}
		.scaleSelector li .itemBG{ left: -20% }
		
		
		.scaleSelector li h3 {  height: 300px; }
			
			
		.zimBlocsList li .itemTitle {  font-size: 0.8em; }
		.zimBlocsList li a .itemTitle, .zimBlocsList li a:hover .itemTitle {  top: 15%; }
		.scaleSelector li .itemTitle {  top: 10%; }
		.zimBlocsList li .itemTitle.alone, .zimBlocsList li .itemTitle.mini, .scaleSelector li .itemTitle.alone {  top: 15%; }
		.zimBlocsList li a .itemTitle span.popup, .scaleSelector li .itemTitle span.popup { opacity: 1;    padding: 12px 15px; font-size: 0.5em; }
		.zimBlocsList li h3, .scaleSelector li h3 {   min-height: 240px; overflow: hidden; }
		.zimBlocsList li a:hover .itemTitle.alone, .zimBlocsList li a:hover .itemTitle.mini {   top: 30%;  }
		
		.scaleSelector li .itemTitle strong {  font-size: 1.2em; }
		.zimBlocsList li .itemTitle strong{ font-size: 0.8em; }
		.zimBlocsList.reduct li .itemTitle strong {  font-size: 1.4em; }
		
		.zimBlocsList li .itemTitle .titleintro, .scaleSelector li .itemTitle .titleintro { font-size: 0.65em;}

		
		.scaleSelector li .links {   bottom: 2%; }

		
		.zimBlocsList li.col25, .zimBlocsList li.col30, .zimBlocsList li.col50, .zimBlocsList li.col100 
		{ margin: 0 0 20px 0 !important; width: 100% !important; }
		
		.zimBlocsList li.col100 { overflow: hidden;}
		.zimBlocsList li.col100 .itemBG { width: 250%; }
		.zimBlocsList li.col50 .itemBG { width: 150%; }
		
		
		.zimBlocsList li .itemTitle span.popup, .scaleSelector li .itemTitle span.popup {  font-size: 0.6em; }
		
		.zimBlocsList li .links .button, .scaleSelector li .links .button, .secondLink .button { margin: 2px 30%; padding: 4px 15px !important}
		.secondLink {bottom: 50px;}
		.zimBlocsList li .itemTitle span.popup .button, .secondLink .button {  font-size: 1em;  margin-top: 10px;}
		
		

		.scaleSelector li .itemTitle strong img {
			width: 55%;
			max-width: 250px;
		}
		
		.tabsContent li .itemBg{ width: 100%; }	
		
		.colZimW{ min-height: 40vh;}


		
		
		/* HOME */
		
		#HomeZimW-Mob img{ position: absolute; }
		#HomeTitleW{     }
		#HomeTitleW h2 strong {   font-size: 1.3em; line-height:1em;}
		#Hometitlestar{  bottom: 40px;}
		
		.homeSectionW {   padding-bottom: 0px; }
		#page-home .zimBlocsList li .itemTitle strong { font-size: 0.9em; }
		#page-home .scroll-section {  top: 80%; }
		
		#HomeTitleW h2 em {   font-size: 1.2em; }
		
		#HomeTitleMore {
			bottom: 50%;
			font-size: 0.9em;
		}
		#HomeTitleMore svg {
			font-size: 2em;
			margin-bottom: 5px;
			transition: color 0.3s ease-in-out;
		}
		
		
		
		
		#UpperSwing div {
			bottom: 60px;
		}
		.bottomSwing div {
			bottom: -110px;
		}
		#FooterSwing div {
			top: 90px;
		}
		
		#FooterNews p.title {
			font-size: 1em;
		}
		
		
		
		
		/* PAGES */
		
		#ContentZone {
			 padding: 0;
		}
		#page-home #ContentZone {
			 padding: 50px 0 0 0;
		}
		
		
		#WhyGarona .shadLinkW {
			min-height: unset;
		}
		
		.formcallZone, #FormW .formcallZone {
			margin: 0 5%;
			padding: 10px 20px;
		}
		
		.progVignette {
			padding-left: 1rem;
			padding-right: 1rem;
		}
		
		.progVignetteCat {
			font-size: 0.9em;
		}
		
		#ProgsListW li{ margin-bottom: 5px !important;}
		
		.carteCatW{ flex-direction: column;}
		
		#ProgsHeadSelector h2 {
			top: 15vh;
			font-size: 2.5em;
		}
		.programmeText h4 {
			text-align: center;
		}
		
		


		
		#page-contact #jGMapW{ overflow: visible;}
		#page-contact #jGMapW > img {
			display: block;
			width: 100%;
			position: static;

		}
		#page-contact #jGMap {
			width: 100%;
		}
		
		#GalerieW ul{ display: block; }
		#GalerieW ul li{ width: 100%; margin: 0 0 50px 0; min-height: unset;}
		#GalerieW ul li .zimW{ height: 240px;}
				
		.actu{ margin-bottom: 50px !important;}
		
		
		
		
		#HotelsList{ margin: 30px 2.5%;}
		#HotelsList ul {
			display: block;
			float: none;
			width: 100%;
			margin: 0 !important;
		}
		
		#HotelsList ul li span.nameW .name {
			width: 70%;
			font-size: 0.85em;
			line-height: 1.2em;
		}
		#HotelsList ul li span.nameW .stars {
			width: 30%;		
		}
		#HotelsList ul li span.imgW {
			width: 13%;
		}
		#HotelsList ul li img {max-width: 50px;	}
				
				
				
		
		
		/* FICHE */
		
		#CarouselArrows a {
			font-size: 3em;
		}
		#EtabTexts{ width: 95%; padding: 50px 0 0 0; margin: 0 2.5%; }
		#EtabLeftCol, #EtabDetailsLeftCol, #EtabDetailsRightCol, #EtabRightCol{ width: 100%; margin: 0; padding: 0;}
		
		#EtabDetailsRightColl{ margin-top: 15px;}
		
		#MarqueLogo img { max-height: 95px;}

		#EtabDesc { font-size: 0.9em;}
		
		
		.coord {
			font-size: 0.9em;
			margin-bottom: 15px;
		}		
		.link {    margin-bottom: 10px; }
		.link .button {  width: 95%; }
		
		#EtabDetailsRightCol p {    font-size: 0.9em; }
		
		#EtabLabels  ul{ flex-direction: column;  }
		#EtabLabels  ul li { width: 100%;  }
		
		
		#ChambresBlock h4 {
			font-size: 1.5em; text-align: center;
			margin-bottom: 15px;
		}
		
		#ChambresBlock { padding: 20px 15px 10px; }
		#ChambresBlock ul{ text-align: center;}
		#ChambresBlock ul li {
			width: 26%;
			min-width: unset;
		}
		
		#PrestaBlock{ padding: 20px 2.5%; }
		.icoPrestaW {
			width: 100%;
			text-align: center;
		}
		.icoPrestaW li {
			vertical-align: top; 
			margin: 0 2% 15px 0;
			min-height: 70px;
			margin-bottom: 15px;
			width: 46%;
			line-height: 1.2em;
		}
		#CleanLogo {  margin: 0 0 10px 20px;}
		
		.prestaListW { font-size: 0.9em;}
		
		
		#EtabAutour {
			width: 100%;
			margin: 0;
		}
		#BonPlansLink{ float: none; margin: 10px 0;}
		#EtabAutour h4 {
			font-size: 1.5em;
			text-align: center;
		}
		#EtabAutour ul li {
			margin: 0  0 30px 0;
			width: 100% !important;
			font-size: 0.9em;
		}
		#EtabAutour ul li svg {	font-size: 2.2em;}
		
		#EtabZimMap, #EtabGal {
			margin: 0 2.5%;
		}
		#EtabFirstZimW, #EtabZimMap #jGMapW {
			display: block;
			float: none;
			width: 100%;
			margin: 0 0 10px 0;
		}
		#EtabGal p a.galZim {
			width: 100%;
			margin-right: 0;
			
		}
		
		
		
	
		
		/* FORMS */
		
		
		
		#TopFilterW .filterCell, #TopFilterW form p{ padding: 20px 10px 0;}
		#TopFilterSimple form label {   font-size: 0.8em; }
		#TopFilterSimple form select {width:100%; text-align: center;		}
		#TopFilterSimple form select option {  text-align: center;}
		
		#TopFilterW .filterCell, #TopFilterW form p{ border: none; display: block; margin-bottom: 15px; }
		#TopFilterSimple form label {  width: 100%; line-height: 1em; display: block; text-align: center;}
		
		#TopFilterSimple .filterCell.buttonw{ 
			display: block; border-left: none !important; border-right: none !important; border-top: 1px solid #000; margin-top: 25px; margin-bottom: 0; }
		
		
		/* MULTI CRITERES */
		
		


		/* CONTACT */
		
		#FancyContactBox{ width: auto; }
		
		#page-contact #Content{ padding-top: 150px; }
		#ContactW{ width: 90%; margin: 0 5%;}
		#FormW, #CoordsW{ display: block; float: none;}
		#FormW{ width: 100%; margin-right: 0; }
		#CoordsW{ width: 100%; }
		
		
		
		#ContactForm fieldset p{ width: 100%; display: block; float: none;}
		#ContactForm fieldset p#field-objet, #ContactForm fieldset p#field-message{ width: 96%;}
		
		
		
		
		
		
		#ContactForm fieldset p#field-message textarea, #ContactForm fieldset p#field-objet input{ width: 100%;}


		#jGMapW {	width:100%; height:600px;  }
		
		.fancybox-nav span{ visibility: visible !important;}
		
		#RealPhotos li {
			width: 50%;
		}
		
		#PresseW  li .zimW { height: auto; }
		#PresseW {			gap: 40px 25px;		}
		#PresseW  li {			width: calc(50% - 15px);		}
		
	}
	
	

	
	
	@media(max-width:768px) { 
	
		.flexi{ display: flex !important; flex-direction: column; }
			
		#HomeTitleW h2 {    font-size: 1.3em; }
		
		#FooterAddr, #Mentions{ font-size: 0.7em;}
		
	
		
		#FooterMenu li a { font-size: 0.7em; }
		#FooterSocials span{ display: inline-block; margin-bottom: 10px }
		#FooterAddr .socialLink {
			font-size: 2.5em;
			margin: 0 15px;
		}
		
		#page-home #ZoomHalfBanner {
			height: 50vh;
		}
		
		.formcallBG {
			background-size: 250% auto;
			background-attachment: unset;
		}
		
		
		#GaronaNumbers ul {
			flex-direction: column; gap: 20px 0;
		}
		
		
		#GaronaDates ul{  flex-direction: column; margin-top: 50px;}
		
		#GaronaDates p.dateslines{ margin-bottom: 5px; display: none; }
		#GaronaDates p.desc{ margin-bottom: 7px; }
		#GaronaDates li::after{ 
			content:"";
			height: 40px; width: 2px; background: var(--bleufonce); display: block; margin: 0 auto;
		}
		#GaronaDates li:last-child::after{ 
			display: none;
		}
		
		.contentSliders {
			margin-left: 0; gap: 10px
		}
		.contentSlider > .contentSection {
			padding: 50px 0 20px 0;
		}
		.contentSliders .centeredlist > li.col70, .contentSliders .centeredlist > li.col30{ width: 95% !important;}
		
		.contentSliders h2 {
			margin: 0 0 20px 0 !important;
		}

		.stepsList {
			flex-direction: column; 
			width: 95%
		}
		.stepsList .arrowW {
			right: 45%;
			top: auto;
			bottom: -35px; 
			transform: rotate(90deg);
		}
		.stepsList li h4 {
			width: auto; 
			max-width: unset; 
		}
		.stepsList .arrowbottom {
			display: none !important
		}
						
		.stepsLegend {
			width: auto;
			position: static; 
			left: 0;
			
		}
		
		#DefiscPoints li:first-child .shadLinkText svg {
			transform: rotate(90deg);}
		
		
		.backReals { margin-bottom: 30px; display: block;}
		
		#RealPhotos li {
			width: 100%;
		}
		
		#PresseW  li {			width: calc(100%);		}
		
		#GeoSearchBox a, #GeoSearchBox span {
			padding: 25px 20px;
			text-align: left;
			font-size: 1em;
		}
		#page-recherche-geographique #GeoSearchBox {
			position: static;
		}
		
		
		#ProgCat {
			padding: 15px 20px;
			font-size: 1.3em;
		}
		#EtabLeftCol, #EtabDetailsLeftCol {
			padding: 15px;
			flex-direction: column;
		}
		.coord {
			clear: left;
			width: calc(100%);
			margin: 0;
		}
		#EtabZimMap {
			padding: 20px 0 20px;
			flex-direction: column;
		}
		
		.gm-style img {
			max-width: 100%;
		}
		
		#ZoomHalfBanner.hotel {
			height: 50vh;
		}
		
		.filterBiensW{ flex-direction: column; gap : 0;}
		
		#SoonPopup {
			margin: 50px 20px;
		}
		
		
		.titleBlurZimW {
			min-height: 200px;
		}
		.titleBlurZimW h2 {
			top: 30%;
			font-size: 2.5em;
		}
		.titleBlurZim {
			width: 235%;
		}	

		
		#PresentationAnnonceW {
			flex-direction: column;
			padding-top: 50px;
		}
		#PresentationAnnonce{ width: 100%; }
		#DescAnnonce{ width: 100%; }
		
		div#BandeauPhotos {
			grid-template-columns: repeat(2, 1fr);
			gap: 15px;
		}
		
		#Eco { height: auto; }
		
		
		#SearchForm {
			width: calc(100%);
			flex-wrap: wrap;
		}
		#SearchForm fieldset {
			flex: unset;
			width: 100%;
		}
		div#SearchFormWrapper {
			flex-direction: column;
			align-items: center;
			gap: 0;
		}

	}
	
	
	
	@media(max-width:480px) {



	}
	
	
	@media(max-width:375px) {
		


		input, select, textarea { font-size: 15px; }
	

		
		
		
	}
	


			
				