/*
 _______  ______   _______  _______  ______   _______    _______  ______   _______  _______  _______  _  _  _  _______  ______   _     _ 
(_______)(_____ \ (_______)(_______)(_____ \ (_______)  (_______)(_____ \ (_______)(_______)(_______)(_)(_)(_)(_______)(_____ \ (_)   | |
 _        _____) ) _____    _______   ____) ) _____      _____    _____) ) _______  _  _  _  _____    _  _  _  _     _  _____) ) _____| |
| |      |  __  / |  ___)  |  ___  | / ____/ |  ___)    |  ___)  |  __  / |  ___  || ||_|| ||  ___)  | || || || |   | ||  __  / |  _   _)
| |_____ | |  \ \ | |_____ | |   | || (_____ | |        | |      | |  \ \ | |   | || |   | || |_____ | || || || |___| || |  \ \ | |  \ \ 
 \______)|_|   |_||_______)|_|   |_||_______)|_|        |_|      |_|   |_||_|   |_||_|   |_||_______) \_____/  \_____/ |_|   |_||_|   \_)

Version 0.9.6.0
Date 02/01/2015                                                                                 
*/

/* ################################################################################################################																		     *                                                                      							
														IMPORTS
 *###############################################################################################################*/

@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Source+Serif+4:ital,opsz,wght@0,8..60,200..900;1,8..60,200..900&display=swap');



/* ################################################################################################################																		     *                                                                      							
														BASICS
 *###############################################################################################################*/
 
 
	html, body { margin: 0; padding: 0; border: 0; }
	body { 
		font-size:14px; background: #627a8c;
		color: #fff;
		font-family: "Montserrat", sans-serif;
		font-weight: 300;
		font-weight: 300;
		letter-spacing: 0;
		line-height: 1.5em;
		background: #627a8c url(zims/frontend/bg.jpg) no-repeat center; background-size: cover; background-attachment: fixed;
		/*overflow-y: scroll;*/
	}

	input, select, textarea {
		color: #333;
		font-family: "Montserrat", sans-serif;
		font-size: 14px;
		font-weight: 300;
		line-height: 1.5em;
	}

	a {
		-moz-transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out;
		-webkit-transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out;
		-o-transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out;
		-ms-transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out;
		transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out;
		color: #ccd9e3;
		text-decoration: none;
	}

		a:hover {
			text-decoration: none; 
			color: #29333b; 
		}
		
		a:active, a:focus { outline:0; }
		a img { border:0; }
		

	strong, b {
		font-weight: 700;
	}

	p, ul, ol, dl, table, blockquote {
		margin: 0 0 1.5em 0;
	}

	h1, h2, h3, h4, h5, h6 {
		
		color: inherit;
		font-weight: 300;
		line-height: 1.3em;
		margin-bottom: 0.5em;
		
		
	}

		h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
			color: inherit;
			text-decoration: none;
			border: 0;
		}

	h2 {
		font-family: "Source Serif 4", serif; font-weight: 600;
		font-size: 1.8em;
	}

	h3 {
		font-size: 1.2em;
		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 {}
	
	p, li{ letter-spacing: 1px;}
	
	
	
/* ################################################################################################################																		     *                                                                      							
														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"],
	input[type="tel"],
	input[type="number"],
	input[type="date"],
	input[type="datetime"],
	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: #ededed;
		border: none;
		color: #2F4253; font-weight: 600;
		display: block;
		padding: 15px 20px;
		text-decoration: none;
		width: calc(100% - 40px);
		outline: 0;
		line-height: 1.5em;
		 -webkit-border-radius: 7px;
		-moz-border-radius: 7px;
		border-radius: 7px;
		margin-bottom :20px;
	}
	
	select {
		-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;
		
		/* styling */
		  background: #ededed;
		color: #2F4253; font-weight: 600;
		 -webkit-border-radius: 7px;
		-moz-border-radius: 7px;
		border-radius: 7px;
		  display: block;
		  font-size: 1.2em;;
		  line-height: 1.5em;
		padding: 13px 60px 13px 15px;

		  /* reset */

		  margin: 0;      
		  -webkit-box-sizing: border-box;
		  -moz-box-sizing: border-box;
		  box-sizing: border-box;
		 -moz-appearance: none;
		-webkit-appearance: none;
		-o-appearance: none;
		-ms-appearance: none;
		appearance: none;
		border-color:  none;
		border:  none;



	  background-image:
		linear-gradient(45deg, transparent 50%,  #2F4253 50%),
		linear-gradient(135deg, #2F4253 50%, transparent 50%),
		linear-gradient(to right, #ededed, #ededed);
	  background-position:
		calc(100% - 24px) calc(1em + 2px),
		calc(100% - 15px) calc(1em + 2px),
		100% 0;
	  background-size:
		10px 10px, 10px 10px, 50px 60px;
	  background-repeat: no-repeat;
	}

	select:focus {
	  background-image:
		linear-gradient(45deg, white 50%, transparent 50%),
		linear-gradient(135deg, transparent 50%, white 50%),
		linear-gradient(to right,  #2F4253,  #2F4253);
	  background-position:
		calc(100% - 15px) 1em,
		calc(100% - 24px) 1em,
		100% 0;
	  background-size:
		10px 10px, 10px 10px, 50px 60px;
	  background-repeat: no-repeat;
	  outline: 0;
	}

	select option{ color: #2F4253; font-weight: 600; }
	
	
	
	

	input[type="text"],
	input[type="password"],
	input[type="email"],
	input[type="tel"],
	input[type="number"],
	input[type="date"],
	input[type="datetime"] {
		line-height: 1.2em;
	}
	
	
	label, .fieldsListTitle { color: #fff; font-size: 1.2em; line-height: 1em; text-align: left; display: block; margin-bottom: 8px; font-weight: 600;}
	
	.missingField label, .invalidField label { color:#9f1819; font-weight: 600; }
	.missingField input, .missingField textarea, .missingField select, .invalidField input, .invalidField textarea, .invalidField select { border: 1px solid #ec0001; }
	
	.formErrors { margin:0; padding:10px 0 40px 0; }
	.formErrors li { list-style:none; margin:0px 0 5px 0; line-height:16px; color:#9f1819; font-weight: 600; text-align: center}
	
	
	fieldset{ border: none !important; margin: 0; padding: 0;}
	
	.uniqueCheckBoxField input{ float: left; margin-right: 10px}
	
	
	#field-security { display: none !important; }
	.formButtons { text-align: left;}
	.textField, .emailField, .telField, .numberField, .dateField, .datetimeField, .textareaField  { margin: 0 0 10px 0; text-align: left;}
	

/* Button */

	.buttonW{}
	.buttonW.centered{ text-align:center;}
	
	input[type="button"],
	input[type="submit"],
	input[type="reset"],
	button[type="submit"],
	.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;
		color: #000;
		background: #fff;
		cursor: pointer;
		display: inline-block;
		font-size: 1.3em;
		font-weight: 600;
		padding: 10px 20px;
		line-height: 1em;
		text-align: center;
		font-family: 'Gilroy', sans-serif;
		text-decoration: none;
		width: auto;
		margin-bottom: 5px;
		border: 2px solid #fff;
		
		 -webkit-border-radius: 7px;
		-moz-border-radius: 7px;
		border-radius: 7px;

		
	}
	.button.blackdefault, #FootContactFormSubmit {
		border-color: var(--gblack);
		background: var(--gblack);
	}
	
	.button.whitedefault {
		border-color: #fff;
		background: #fff;
		color: #000;
	}

		input[type="button"]:hover,
		input[type="submit"]:hover,
		input[type="reset"]:hover,
		button[type="submit"]:hover,
		.button:hover, #FootContactFormSubmit:hover {
			background: #000;
			color: #fff !important;
			border-color: #000 !important;
			text-decoration: none;
		}
		
		.button.whitedefault:hover {
			border-color: #000;
			background: #000;
			color: #fff !important;
		}
		
		

		
	::-moz-selection { /* Code for Firefox */
		background: #111; color: #fff;
	}

	::selection {
	  background: #111; color: #fff;
	}
	
	
	::placeholder{
	  color: #999;
	}




/* Specials */


	 /**
	 * Floating elems
	 */
	.float
	{display:inline; float:left;}
	
	/**
	 * Away elems
	 */
	.away
	{position: absolute; top: -99999px;}
	.awayText
	{text-indent: -9999px; overflow: hidden; }
	.hidden
	{display: none;}
	
	 /**
	 * WRAPPERS 980
	 */
	.focus
	{ margin:0 auto; width: 980px; }
	
	/**
	 * Overlays
	 */
	/* WHITE*/
	.overlay-w { background:rgba(255,255,255,0.85); }
	.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.85); }
	.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;
	}
	
	.sfont { font-family: "Source Serif 4", serif; font-weight: 600;}
	
	.shadow{ text-shadow: 1px 1px 0px rgba(0, 0, 0, 1); }
	.shadow-w{ text-shadow: 1px 1px 0px rgba(255, 255, 255, 1); }
	
	.clear{ clear: both;}
	
	.mini{ font-size: 0.75em !important; display: inline-block; line-height: 1.2em; }
	.littleup{ font-size: 1.2em !important }
	.big{ font-size: 1.6em !important }
	.super { font-size: 2.5em !important }
	.superplus { font-size: 3.2em !important }
	.mega { font-size: 4em !important }
	.ultra { font-size: 5.5em !important }
	
	
	.centered *, .centered{ text-align: center; }
	.bigmargin{ margin-top: 50px!important; margin-bottom: 50px !important;}
	.notitle{ margin: 50px 0 0 0;}
	.nomargintop{ margin-top: 0 !important;}	
	
	.sidepadding{ padding: 0 25px; width: auto !important;}
	
	
	.flexi{ display: flex; }
	.flexilist{ display: flex; flex-wrap: wrap;}
	
		
	.centeredlist100{  margin-left: 0%!important; margin-right: 0%!important; width: 100%}
	.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%}
	.centeredlist30{  margin-left: 35%!important; margin-right: 35%!important; width: 30%}
	
	
	.mediummargin{ margin-top: 40px; margin-bottom: 40px;}
	.bigmargin{ margin-top: 80px; margin-bottom: 80px;}
	.nomargintop{ margin-top: 0; padding-top: 0;}
	.marginbottom{ margin-bottom: 50px;}
	
	.titlepadding{ padding-top: 95px;}
	.titlepaddingmini{ padding-top: 30px;}
	.titlepaddingmedium{ padding-top: 150px;}
	.titlepaddingbig{ padding-top: 200px;}
	
	
	.smallpadding{ padding: 30px 0; }
	.mediumpadding{ padding: 60px 0; }
	.mediumpaddingtop{ padding: 60px 0 0 0; }
	.bigpadding{ padding: 100px 0; }
	.bigpadding2{ padding: 200px 0; }
	.nospacetop{ padding-top : 0; margin-top : 0;}
	
/* ################################################################################################################																		     *                                                                      							
														PAGES
 *###############################################################################################################*/
 	
	
	
	/* 
	
	
	
	*/
	
	
	/*html{ overflow-y: scroll;}*/
	html, body{ height: 100%;}
	body{ }
	
	/* Content */

	#ContentW{ height: 100%}
	#Content { width: 100%; height: 100%; margin:0 auto; }

	.screen{ width: 100%; height: 100%; position:relative; overflow: hidden; }
	.screen.scrollable{ overflow: visible; height: auto; }

	
	.screenZimW, .screenCarouselW, .screenCarouselZoomW{ width: 100%; height: 100%; position: absolute; top: 0; left: 0; overflow: hidden; }
	.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: #627a8c url(zims/loader/ajax-loader.gif) no-repeat center;}
	/*.darkPanel .screenCarouselZoom{ background: #111 url(zims/loader/ajax-loader-black.gif) no-repeat center;}*/

	
	.carouselZoomZim {
		
		 /* image à l'échelle 1 au départ */
	   -webkit-transform: scale(1);
	   -moz-transform: scale(1);
	   -o-transform: scale(1);
	   -ms-transform: scale(1);
	   
	   transform: scale(1);
	}
   
	.carouselZoomZim.scale{
		 /* propriétés de transition */
	   -moz-transition:all 9s ease-out;
	   -webkit-transition:all 9s ease-out;
	   -o-transition:all 9s ease-out;
		transition:all 9s ease-out;
		
		transform: translate3d(0px, 0px, 0px) scale(1.15);
	}
	
	
	
	#ZoomHalfBanner{ height: 40%; position: relative; border-bottom: 6px double #fff;}
	#ZoomHalfBanner.darkPanel{ }
	#ZoomHalfBanner h2{ position: absolute; z-index: 1000; font-size: 3em; bottom: 25px; right: 4%; margin: 0; color: #fff;}
	
	
	.darkPanel *{ color: #fff; }
	.paddingupdown { padding: 20px 0; }
	
	.screenPanelW{ width: 100%; height: 100%;  position: absolute;}
	.screenPanel{ position: absolute;}

	
	.halfPanel{ width: 46%; height: 100%; background: #222; padding: 8% 2% 0; background-image: url(zims/frontend/bg-vitrail-w.png); background-repeat: no-repeat; background-position: center; background-size: cover; }
	.halfPanelR{right: 0; }
	.halfPanelL{left: 0}
	

	h2#PageTitle {
		line-height: 1.2em; margin: 0 0 50px 0;
		background: url(zims/frontend/separ-title.png) no-repeat center bottom;
		padding: 25px 0 45px;
	}


	
	
	.mainTextW{
		padding: 30px 0 0 30px; border-left: 1px solid #fff;
	}
	.mainTextW *:first-child{  margin-top: 0;}
	.justified *{ text-align: justify }
	.centered *, .centered{ text-align: center !important; }
	
	.hugetext p{ line-height: 1.4em;}
	
	.bigborder{ border-bottom: 3px solid #406077; padding-bottom: 15px;}
	
	
	
	.next-section  { 
		position: absolute; bottom: 0; z-index: 4000; width:100%; left:0; 
	}
	.arrowNext{ 
		position: relative; bottom: 20px;
		display: block; width: 120px; height: 31px;  background: url(zims/frontend/arrow2.png) no-repeat center bottom; 
		opacity: 0; margin:0 auto;
		text-align: center; font-weight: 500; text-transform: uppercase; line-height: 1em; color: #fff; font-size: 0.75em;
		padding-top: 18px;
	} 
	
	
	
	/* PAGINATION JS */
	
	.paginatedW { /*overflow: hidden;*/ width: 100%;padding-bottom: 10px; }
	.paginatedW .sliderPage { display: none; position: relative;}
	
	.pagination{ height: 35px; width: 50%; position: relative; margin: 15px 0 0 25%;}
	.hlt-700 .pagination{ height: 25px; margin-top: 0;}
	.pagi-prev, .pagi-next{ 
		display: block; width: 11px; height: 20px; background: url(zims/frontend/pagination-arrows.png) no-repeat left center;
		position: absolute; top: 10px; border: none; text-indent: -999px; overflow:hidden;
		bottom: 0; cursor: pointer;}
		
	.pagi-prev{ left: 0;}
	.pagi-next{ right: 0; background-position:right center;}
	/*.pagi-prev, .pagi-next{ display: none;}*/

	.pagi-dots{ position: absolute; bottom: 0; width: 80%; left: 10%; display: table; text-align:center; }
	.pagi-dots li{ display: inline-block; margin: 0 5px; height: 12px; vertical-align: top; overflow:visible !important; margin: 0 10px !important;  }
	.pagi-dots li button{ 
		background: #243647; width: 12px; height: 12px; border: none; vertical-align:top; 
		text-indent: -999px; overflow:hidden;cursor: pointer;
		padding: 0;
		-webkit-border-radius: 12px;
		-moz-border-radius: 12px;
		border-radius: 12px;  }
	.pagi-dots li button.active{ background:#fff; }
	

	
	
	
	.paralaxW{
		background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover;
		min-height: 200px; width: 100%; margin: 30px 0;}
	
	
	.contactBlockW{ margin: 50px 0;}

	.contactBlock{}
	.contactBlock.push{ padding: 70px 0 0 25px; }
	.contactBlock p{ /*background: url(zims/frontend/sprite-icons.png) no-repeat left top; padding-left: 50px;*/}
	.contactBlock p i{ display: block; float: left; font-size: 1.5em;}
	.contactBlock p.acces{}
	.contactBlock p.horaires{ background-position: left -145px;}
	.contactBlock p.coords{ background-position: left -292px;}
	.contactBlock p span.line{ display: block; border-bottom: 1px solid #c0cfdb; padding: 0 0 20px 40px;}
	.contactBlock p a{ color: #fff;}
	
	
	.styledMiniList{ margin-bottom: 20px;}
	
	.styledMiniList li{ list-style-type: square; font-size: 0.7em; margin-bottom: 7px; padding: 0 0 7px 10px; border-bottom: 1px solid #ccc; list-style-position: outside; }
	.styledMiniList li span.text{ font-size: 1.3em; }
	
	
	.zimWDecal{ position: relative;}
	.zimWDecal span.deco{ display: block;  position: absolute; width: 100%; height: 100%; background: #243647; left: -10px; bottom: -10px; z-index: 99;}
	.zimWDecal img{ position: relative; z-index: 100; vertical-align: top;}	
	.zimWDecal a:hover span.zoomIco{  right: 15px; bottom: 15px;}
	
	.nomaj{ text-transform: none}
	
	/*
	
	pastel medium #627a8c
	
	pastel clair #8a9ead
	
 
 /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * GENERAL * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
	
	#Main{ height: 100%; }
	
	
/* HEADER */


	#HeaderW { 	
		z-index: 5000;
		width: 100%; height: 0;
		position: absolute;
	}
	
	#Header {
		position: relative;
		margin: 0 auto;
	}

	#Header h1 {
		margin: 0;
		position: absolute; top: 10px; left: 2%; z-index: 5000;
	}
	#Header h1 a {display: inline-block; margin: 0 auto; position: relative; text-align: center;}
	#Header h1 a:hover {color: #fff;}
	#Header h1 a img{ width: 85px; }
	
	.logolegend{font-size: 11px;     display: inline-block;    line-height: 1.1em; }


	
	#HeadLogoWhite{ display: none;}
	

		
	#Nav{ position: fixed; top: 0; right: 0; width: 420px;  z-index: 5001;}
	
	#UpperNav{ position: absolute; z-index: 5001; width: 100%}
	
	#NavIco{ 
		display: block; position: absolute; z-index: 5001; height: 70px; width: 70px; border: none; right: 30px; top: 20px;
		 background: url(zims/buttons/minimenu-w.png) no-repeat center;}


	
	#ContactLink{  
		position: absolute; right: 110px; top: 30px;
		-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;
		border: 1px solid #fff; padding: 12px 15px 12px 12px; color: #fff; font-family: "Source Serif 4", serif; font-size: 1.5em;
		}
	#ResaLink:hover {
			background-color: rgba(0,0,0,0.9);
			border-color: #000;
			color: #fff;
		}
		
	
	#LangLinks{ z-index:1000; position:absolute; right:106px; top: 45px; }
	#LangLinks li{ height: 20px; float: left; margin-right: 5px;} 
	#LangLinks li a{ display: block; height: 100%; background-position: left center; background-repeat:no-repeat; padding: 0 0 0 30px;  }
	#LangLinks li a span{ display: none;  }
	#LangLinks li.active { display: none;}
	#LangLinks li a:hover{ border: none; }
	#FrLink{ background-image: url(zims/frontend/fr.jpg); } 
	#EnLink{ background-image: url(zims/frontend/en.jpg); }
	#EsLink{ background-image: url(zims/frontend/es.jpg); }
	
	
	#Menu{ 
		position: absolute; z-index: 5000; display: none;
		background: rgba(97,122,141,0.9); width: 100%; height: 100%;
		overflow: hidden;
	}

	
	#MainMenu{ width: 100%; padding-top: 160px; }
	#MainMenu li{ margin-bottom: 20px; letter-spacing: 0;  }
	#MainMenu li a{ font-size: 1.3em; 
		text-transform : uppercase; display: block; color: #fff;
		padding: 0 0 0 100px; 
		background: url(zims/frontend/menu-line.png) no-repeat center left; 
		-moz-transition: color 0.2s ease-in-out;
		-webkit-transition: color 0.2s ease-in-out;
		-o-transition: color 0.2s ease-in-out;
		-ms-transition: color 0.2s ease-in-out;
		transition: color 0.2s ease-in-out;	
		font-family: "Source Serif 4", serif;
	}
	#MainMenu li a:hover{ 
		color: #b6c1c3;
	}
				

				
				
				
	#BottomNav{ width: 100%; position: absolute; padding: 0; bottom: 20px; z-index: -1;}
	

	/*
	#Links{ width: 100%; display: table; text-align: center;  }
	#Links li{ display: inline-block; margin: 0 4%; }*/
	
	

	#Socials { width: 50%; margin: 50px auto 15px;  }
	#Socials a, #SocialsContact a{ margin: 0 25px 0 0;  }
	#Socials a i{  font-size: 1.6em; }
	#Socials a{ color: #fff; }
	
	#NewsletterLink{ display: block; margin-top: 15px !important; }

	
	#HeadCoords{ margin-bottom: 15px; }
	#HeadCoords p{ text-align: center; color: #fff; letter-spacing: 0; font-size: 0.85em; margin: 0; }
	
	
	#FooterLogos{ text-align: center; border-top: 1px solid rgba(255,255,255,0.5); padding-top: 30px; margin: 0 auto 20px; width: 90%;}
	#FooterLogos a{ display: inline-block; height: 100%; }
	#FooterLogos a img{ vertical-align: middle; }
	
	#Credits{ font-size: 0.8em; color: #fff; text-align: center;  letter-spacing: 0; line-height: 1.3em; margin: 0;  }
	#Credits a{ color: #fff; }
	
	
	#SubMenuW{ margin-bottom: 25px; position: relative; z-index: 100; top: -2px; }
	#SubMenuW.nomargin{margin-bottom: 0; }
	#SubMenuW ul.submenu{  background: #fff; width: 100%; display: table; text-align: center; /*border-bottom: 1px solid #666;*/ }
	#SubMenuW.colormenu ul.submenu{  background: #2f395a; }
	#SubMenuW ul.submenu li{ display: inline-block; padding: 0 28px; border-right: 1px solid #666; }
	#SubMenuW ul.submenu li a { display: block; padding: 10px 0; color: #000; text-transform: uppercase;  }
	#SubMenuW ul.submenu li:hover a { text-decoration: underline; }
	#SubMenuW ul.submenu li:last-child{ border-right:none }
	#SubMenuW ul.submenu li.current{ background: #fff;  }
	#SubMenuW ul.submenu li.current a{  color: #000; }
	
	#SubMenuW ul.submenu li.logoutBTN { padding: 0 15px; background:#000000; margin-left:-3px; }
	#SubMenuW ul.submenu li.logoutBTN a {  }
	#SubMenuW ul.submenu li.logoutBTN a i { font-size:1.5em;  }

	#SubMenuW ul.subsubmenu{  background: #fff; width: 100%; display: table; text-align: center; }
	#SubMenuW ul.subsubmenu li{ display: inline-block; margin-right: 30px;  padding: 10px 0; }
	#SubMenuW ul.subsubmenu li:last-child{ margin-right: 0; }
	#SubMenuW ul.subsubmenu li a { display: block;  color: #000; text-transform: uppercase; border-right: 1px solid #666; padding-right: 30px;}
	#SubMenuW ul.subsubmenu li:last-child a{  padding-right: 0; border-right:none }
	#SubMenuW ul.subsubmenu li a:hover, #SubMenuW ul.subsubmenu li a.current{ text-decoration: underline; }


	
	#SpecialAnnounce{ display: none;}
	
	
	.overlaytop{ display: block; position: absolute; top: 0; z-index: 500;}
	#OverlaytopL{ left: 0; ;}
	#OverlaytopR{ right: 0;}
	
	
	
	
	
	


 /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * HOME * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
 
 	#page-home{ }
	#page-home #HeaderW { 	
		height: 200px;
		position: fixed;
		
	}
	
	
	/*#HomePage-1{ background: #333;}*/
	
	#HomeLogo{ width: 100%; bottom: 5%; opacity: 0;}
	#HomeLogo h2{ text-align: center; font-size: 2em; font-weight: 600; color: #fff; letter-spacing: 3px; line-height: 1.1em; }
	#HomeLogo h2 span{font-size: 0.5em; }
	
	#IntroText{
		position: absolute; top: 0; left: 0; width: 44%;
		margin: 0; padding: 30px 28% 0; z-index: 500; min-height: 200px;
		text-align: center; background: url(zims/frontend/header-shadow.png) repeat-x center top;
	}
	#IntroText img{ display: block; margin-top: 10px; }
	#IntroText img#PCIFLogo{ float: left; }
	#IntroText img#TransiLogo{ float: right; height: 70px; }
	
	
	
	#BannerRecrut{ position: absolute; left: 0; top: 40vh; z-index: 1000;}
	


	.mosaicScreenPanel{ height: 100%; width: 100%; }
	

	.mosaicW-lvl1{ overflow: hidden;}
	.mosaicW-lvl1, .mosaicW-lvl2, .mosaicW-lvl3{width: 100%; height: 100%;}
	.mosaicW-lvl1 > li { display: inline; float: left; height: 100%; width: 50%; }
	.mosaicW-lvl1 li {  overflow: hidden;}


	.mosaicW-lvl2 > li, .mosaicW-lvl3 > li{  display: inline; float: left;}
	
	.mosaicTiny-horizontal{ width: 100%; height: 25% !important;}
	.mosaicSmall-horizontal{ width: 100%; height: 33.3% !important;}

	.mosaicBig-horizontal{ width: 100%; height: 66.6%;}
	.mosaicHuge-horizontal{ width: 100%; height: 75%;}
	.mosaicFull-horizontal{ width: 100%; height: 100%;}
	
	.mosaicEqual-horizontal{ width: 100%; height: 50%;}

	
	.mosaicBig-vertical { width: 50%; height: 100%}
	

	.mosaicW-lvl1 > li.simpleHeaderZim{ width: 100%; height: 25%; overflow: hidden;}
	.simpleHeaderZim p{ width: 100%; height: 100%; }

	.mosaicW-lvl1 > li.simpleContent{ height: 75%}
	

	.cellZimW{ position: relative;}
	
	.cellZimW, .cellTextW{ position: relative;  opacity: 0; left: 30px;}
	
	.cellZim{ display: block; position: absolute; }
	
	.cell25{ width: 25% !important;}
	.cell30{ width: 30% !important;}
	.cell33{ width: 33% !important;}
	.cell35{ width: 35% !important;}
	.cell40{ width: 40% !important;}
	.cell60{ width: 60% !important;}
	.cell65{ width: 65% !important;}
	.cell70{ width: 70% !important;}
	.cell100{ width: 100% !important;}
	
	
	
	
	.cellText { padding: 25px;}
	.cellText h2{ text-align: center; }
	.cellText h2:first-child{ margin-top: 0; }
	
	.cellText p{ font-size: 0.85em; text-align: justify; letter-spacing: 0; }
	.cellText ul li{ font-size: 0.85em; letter-spacing: 0; }
	.cellText p strong{ font-weight: 600; }
	
	
	
	.textSwitchWW{ position: relative; }
	.textSwitchW{ position: absolute; left: 100%; width: 90%; opacity: 0; padding: 0 5%}
	.textSwitchW.active{ left: 0; opacity: 1}
	
	a.textSwitcher{ background: url(zims/buttons/ico-link.png) no-repeat 20px center; padding-left: 40px; font-size: 1.2em; margin-bottom:5px; }
	
	.buttonW{ margin-top: 20px;}
	

	
	#OverlayTempo{ height: 100%; width: 100%; position: absolute; top: 0; left: 0; background: #627a8c url(zims/loader/ajax-loader.gif) no-repeat center; z-index: 499;}
	
	
	#ChambreList{ position: relative;}
	#ChambreList, #ChambreListOver, #ChambreListBelow, #ChambreListBelow ul{ height: 100%; width: 100%; }
	#ChambreListOver { position: absolute; top: 0; left: 0; z-index: 1000; }
	
	#ChambreListOver li{ width: 50%; height: 100%; display: inline; float: left; margin:0; }
	#ChambreListOver li:last-child{ margin-right: 0;}

	#ChambreListOver li div{ height: 100%; width: 100%; background: url(../media/images/home/spa.jpg) no-repeat center; background-size: auto 110%;
		-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;
	}
	#ChambreListOver li div.item-Boudoir{   background-image: url(../media/images/home/boudoir.jpg); }
	
	#ChambreListOver li div:hover{background-size: auto 100%;}
	#ChambreListOver li div p { text-align: center; position: relative; height: 100%; }
	#ChambreListOver li div p a{ 
		position: absolute; bottom : 40px; display: block; text-align: center; font-family: "Source Serif 4", serif; font-weight: 600; z-index: 1002;
		width: 100%; font-size: 1.5em; padding-top: 300px;  }
		
	
		
	#ChambreListOver li div p a span{ 
		-moz-transition: color 0.3s ease-in-out, border-color 0.3s ease-in-out;
		-webkit-transition: color 0.3s ease-in-out, border-color 0.3s ease-in-out;
		-o-transition: color 0.3s ease-in-out, border-color 0.3s ease-in-out;
		-ms-transition: color 0.3s ease-in-out, border-color 0.3s ease-in-out;
		transition: color 0.3s ease-in-out, border-color 0.3s ease-in-out;
		display: inline-block; padding: 10px 0; color: #fff;  }
		
		
	#ChambreListOver li div p a span span.legend{ display: block; text-align: center;  font-size: 0.8em; margin-top: 10px; text-shadow: 0px 1px 0px rgba(0, 0, 0, 1); margin-left: 0; }
	#ChambreListOver li div p a span span.legend strong{   font-size: 1.8em; }
	#ChambreListOver li div p a span span.legend em{  display: block; border-top: 1px solid #fff; margin-top: 5px; padding-top: 5px; font-style: normal; }
		
		
	#ChambreListOver li div p a:hover span, #ChambreListOver li div p.active a span{ /*border-color: #000; color: #000;*/	}
		
	#ChambreListOver li div p span.overlayHover { 
		position: absolute; z-index: 1001; height: 100%; width: 100%; bottom: 0; left: 0;
		background: url(zims/frontend/chambrelist-hover.png) repeat-x bottom;
		display: none;
	}	
	

	#ChambreListBelow{  position: relative;}
	#ChambreListBelow ul{ position: relative; z-index: 900; }
	#ChambreListBelow ul li{ width: 50%; height: 100%; display: inline; float: left; overflow: hidden; margin-right: 0.5%; background: #445866; position: relative;}
	#ChambreListBelow ul li:last-child{ margin-right: 0;}
	#ChambreListBelow ul li img{display: none; position: absolute;}
	/*#ChambreListBelow ul li img.mob-only{ display: none; }*/

	
	#SelectedZim1, #SelectedZim2{  height: 100%; margin: 0; position: absolute; top: 0; z-index: 901; width: 0%; left: 0; opacity: 0;}
	#SelectedZim2{ z-index: 902; }
	#SelectedZim1 img, #SelectedZim2 img{ position: absolute; display: block !important; left: 0 !important; opacity: 0;}
	
	
	
	
	

		
	/* FORMS */

	.styledGift{position: relative;   z-index: 600;}
	#BonCadeauForm{ padding-bottom: 40px;}
	fieldset { margin-bottom: 50px; }
	fieldset legend{ display: block; text-align: center;
		font-family: "Source Serif 4", serif; font-weight: 600;
		font-size: 2.5em; border-bottom: 1px solid #fff; padding-bottom: 10px; margin-bottom: 50px; }

	#soin_id{ width: 100%; }
	#invite_nom, #invite_prenom, #offrant_name, #invite_name{ }
	#message, #commentaire{ height: 120px;}
	#montant{ width: 120px; display: inline-block; float: left;}
	
	.alertMsg{clear: both; }
	
	.formsubsection{ display: flex; gap: 40px; width: 100%;}
	.formsubsection p{ flex: 1;}
	
	.formButtons{ text-align: center; }
	
	.carteSoins{ width: 200px; position: absolute; top: 20px; right: 50px; z-index: 100; text-align: center; color: #fff;}
	.carteSoins a{ color: #fff; font-weight: 600;}
	.carteSoins a:hover{ text-decoration: underline;}
	.carteSoins img{ display: block; width: 100%; margin-bottom: 5px; border: 2px solid #fff; vertical-align: top;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;}
	
	
	
	
	
	
		
	
	
	
	@media(max-height:700px) {
		
		body { font-size:12px; }
		
	}
	
	
	@media(max-height:820px) {
		
		/*#MainMenu{  padding-top: 100px; }
		#BottomNav{ margin-top: 0;}
		
		#MainMenu li{ margin-bottom: 8px;}
		#Socials { margin: 0 auto 10px; padding-bottom: 10px; }
		#HeadCoords{ margin-bottom: 10px; }

		#NTHLogo{  padding-top: 20px; margin-bottom: 10px;}
		
		.prestaBox { margin-bottom: 6%}
		
		.cellText{ padding: 15px 25px;}
		.chambreContent p{ margin: 5px 0 0 0;}
		.chambreContent p.separ{  margin: 0 0 5px 0;}
		.chambreContent h3{ margin: 0 0 5px 0;}
		.chambreIntro{ margin-bottom: 10px;}
		
		.offre h2{ font-size: 1.5em; }
		
		#CollectionList li{ height: 120px;*/
			
	}
	
	
	@media(max-width:1440px) {
		
		body { font-size: 13px; }
		#ChefZim{ left: 50px}
		#Chef{ padding: 15% 10% 0 50%}
	}
	
	@media(max-width:1280px) {
		
		#Qui {
			width: 70%;
			padding: 6% 15% 0 15%;
		}
		.fondateurBtn{ bottom: 20px; left: 20px; }
		#SBbtn.fondateurBtn {  right: 20px; }
		
		.centeredlist{ margin-left: 5% !important; margin-right: 5% !important; width: 90%;}
		
		.scrollAppear{ position: relative; }
		.hoverlink {  top: -30px;}
		
		.overlaytop{ top: -50px;}
		
		
		#IntroText{ padding: 30px 25%; width: 50%; }
		
		 #AgendaList > li{ width: calc(50% - 22px); margin: 0 10px 15px; }
		
	}
	
	
	@media(max-width:960px) {
		
		
		#HeaderW {
			height: auto;
			position: static;
		}
		#Header h1 {
			position: relative;
			top: 0;
			left: 0;
		}

		#page-home #ContentW { height: auto; }
		
		#page-home #Content { padding: 0; width: 100%; height: auto; position: static; }
		#Content { position: static; }
		
		.screen{ overflow: visible; height: auto;}
		.screenPanelW{ height: auto; position: static; }
		.screenPanel{ height: auto; position: relative; }
		
		#OverlaytopL{ left: -40%;}
		#OverlaytopR{ display: none;}
		
		.centeredlist50 {
			margin-left: 2.5%!important;
			margin-right: 2.5%!important;
			width: 95%;
		}
		
		
				
		.overlaytop {  top: -60px; }
		
		#MainMenu {  padding-top: 120px; }
		#MainMenu li a { font-size: 1.5em;  }
		
		
		#Header h1{ position; static; width: 100%; text-align: center;}
		#Nav{ width: 100%}
		#NavIco{ right: 0; top: 0; background-color: rgba(97,122,141,0.9); }
		#ResaLink{ right: 80px; left: auto; top: 15px; font-size: 1.3em; padding: 10px 50px 10px 10px; ;}
		#LangLinks { right: 0; top: 80px; }
	
		#FooterLogos{ width: 75%}
		#ContactLink{ display: none;}
		
		/*#page-home #Header h1{ top: 170px; left: 0%; width: 100%; text-align: center;}
		#page-home #ResaLink{ left: 15px; right: auto; }
		#page-home #NavIco{background-color: 0;}*/
		
		#page-home #Main, #page-home #ContentW, #page-home #Content{ height: 100%; }
	
		
		#page-offres #HomeLink{ width: auto;}
		
		
	
		
		
		.scrollAppear{ position: relative; }
		#ChambreList{ padding-top: 170px;}
		#IntroText{ padding: 150px 2.5% 0; width: 95%;}
		
		#SubMenuW ul.submenu li {  padding: 0 20px; }
		
		#ZoomHalfBanner h2 {

			font-size: 2.5em;
			bottom: 10px;
			right: 0;
			margin: 0 2.5%;
			line-height: 1.2em;
		}
				
				
		.mosaicW-lvl1 > li{ width: 100%;}
		.mosaicW-lvl2{}
		.mosaicW-lvl2 > li, .mosaicW-lvl3 > li{ display: block; float: none;}
		.mosaicBig-horizontal.cellZimW, .mosaicEqual-horizontal.cellZimW{ height: 300px;}
		.mosaicSmall-horizontal{}
		.mosaicSmall-horizontal.cellZimW, .mosaicTiny-horizontal.cellZimW{ height: 150px !important; display: block; float: none;}
		.mosaicBig-horizontal.cellTextW{ height: auto;}
		.mosaicW-lvl3 li.cellZimW{ display: none;}
		
		.cell25, .cell30, .cell35, .cell40, .cell60, .cell65, .cell70, .mosaicBig-vertical{ width: 100% !important;}
		
		.cellText{ padding: 15px 5%;}
		
		.textSwitchW{ width: 100%; padding: 0; position: static; opacity: 1; clear: both; }
		.textSwitchW .buttonW{ display: none;}
		
		
		.centeredlist, .centeredlist85, .centeredlist60{ margin-left:2.5% !important; margin-right: 2.5% !important; width: 95% }
		.centeredlist.col2 > li, .centeredlist.col3 > li, .centeredlist.col4 > li{ display: block;	float: none; width: 100%; margin: 0 0 40px 0;}
		.sidepadding {  padding: 0; }
		
		.mega {   font-size: 2.2em; }
		.super {   font-size: 1.4em !important; }

		
		#BoutiqueLink{     
			left: 150px;
			top: 13px;}
		
		
		
		#BannerRecrut{ position: static; }
		
		
		/* PAGES */
		
		
		
		#ChambreListOver { position: static; }
		#ChambreListOver li { width: 100%; height: 270px; margin-bottom: 8px; display: block; float: none; position: relative; overflow: hidden;}
		#ChambreListBelow{ display: none; }

		
		
		#ChambreListOver li div img { position: static; top: 0; left: 0; display: inline-block; height: 80px; vertical-align: bottom; }
		#ChambreListOver li div a{ text-align: center; }
		
		#ChambreListBelow ul li img.mob-only{display: block; }
		
		#ChambreListOver li div p a span{ padding: 0;}
		
		#ChambreListOver li div p a {   bottom: 25px;     padding: 0; }
		
		#ChambreListOver li div p a span span.legend {
			line-height: 2em;
		}
		
		
		fieldset {
			margin-bottom: 20px;
		}
		.formsubsection{ flex-direction: column; gap: 0;}

		.carteSoins {
			width: 100%;
			position: static;
			text-align: center;
			padding-bottom: 50px;
		}
		.carteSoins img{ max-width: 200px; display: block; margin: 0 auto; }
		
		fieldset legend {
			line-height: 1em;
			margin-bottom: 30px;
		}




		
		#ContactForm fieldset p{  width: 100%; }
		#ContactForm{ padding-right: 25px;}
		#FancyContactBox{ width: auto;  background: #627a8c }
		
		#FancyContactBox h2 a {
			float: none;
			font-size: 0.4em;
			margin: 6px 0 20px 0;
		}
		
		#jGMapW { width:100%; height:500px;  }
		
	

	}
	
	
	
	@media(max-height:400px){
		
	
	}