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

Version 0.9.6.0
Date 02/01/2015
*/

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

@font-face {
    font-family: 'giaza_stencilregular';
    src: url('fonts/Giaza Stencil/giaza_stencil-webfont.otf') format('otf'),
         url('fonts/Giaza Stencil/giaza_stencil-webfont.woff') format('woff'),
         url('fonts/Giaza Stencil/giaza_stencil-webfont.woff2') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'nexaextra_light';
    src: url('fonts/Nexa/nexa-extralight-webfont.ttf') format('ttf'),
         url('fonts/Nexa/nexa-extralight-webfont.woff') format('woff'),
         url('fonts/Nexa/nexa-extralight-webfont.woff') format('woff2');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'nexaheavy';
    src: url('fonts/Nexa/nexa-heavy-webfont.ttf') format('ttf'),
         url('fonts/Nexa/nexa-heavy-webfont.woff') format('woff'),
         url('fonts/Nexa/nexa-heavy-webfont.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'nexabook';
    src: url('fonts/Nexa/nexa-book-webfont.ttf') format('ttf'),
         url('fonts/Nexa/nexa-book-webfont.woff') format('woff'),
         url('fonts/Nexa/nexa-book-webfont.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'nexabold';
    src: url('fonts/Nexa/nexa_bold-webfont.otf') format('ttf'),
         url('fonts/Nexa/nexa_bold-webfont.woff') format('woff'),
         url('fonts/Nexa/nexa_bold-webfont.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'miniondisplay';
    src: url('fonts/Minion Display/minion_display-webfont.otf') format('ttf'),
         url('fonts/Minion Display/minion_display-webfont.woff') format('woff'),
         url('fonts/Minion Display/minion_display-webfont.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}



/* ################################################################################################################																		     *
														BASICS
 *###############################################################################################################*/


	html, body { margin: 0; padding: 0; border: 0; scroll-behavior: smooth !important;}
	body{
		font-size: 18px; 
		/* background: url('zims/frontend/texture-bg.png') repeat #ece2ce; */
		color: #232323;
		font-family: 'nexabook', sans-serif;
		font-weight: 300;
		/* letter-spacing: 0.025em; */
		line-height: 1.3em;
		overflow-x: hidden;
		/* background: url(zims/frontend/BG.jpg) no-repeat center center fixed; */
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
		background: linear-gradient(#c2d3c3, #ffffff);
	}

	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: #7c8081;
		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: #232323;
		text-decoration: none;
		/* letter-spacing: 1px; */
		/* border-bottom: solid 1px; */
		/* font-family: 'giaza_stencilregular', sans-serif; */
	}

		a:hover {
			border-bottom-color: transparent;
			color: #657d6f;
			text-decoration: underline;
			/* color: #E7B834; */
		}

		a:active, a:focus { outline:0; }
		a img { border:0; }


	strong, b {
		font-weight: 400;
		font-family: 'nexabold';
	}

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

	h1, h2, h3, h4, h5, h6 {
		color: inherit;
		font-weight: 300;
		line-height: 1.75em;
		margin-bottom: 1em;
		/* text-transform: uppercase; */
	}

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

	h1, h2 {
		font-family: 'giaza_stencilregular', sans-serif;
	}

	h2 {
		font-size: 3em;
		/* font-weight: 600; */
		line-height: 1;
		margin-bottom: 30px;
		/* letter-spacing: 2px; */
		margin-top: 40px;
	}

	h3 {
		font-size: 1.15em;
		/* letter-spacing: 0.025em; */
	}

	h4 {
		font-size: 2em;
		margin-bottom: 0;
	}

	h5 {    
		font-weight: 600;
		color: #232323;
		font-family: 'nexabook';
		font-size: 1.5em;
	}

	h6 {
		font-family: 'nexabook';
		text-transform: uppercase;
		font-weight: 600;
	}

	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; }




label, .fieldsListTitle {
  color: #000;
  
  height: 30px;
  display: inline-block;}




/* ################################################################################################################																		     *
														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 */
	form { margin-bottom:1em; }
	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: solid 1px rgba(157, 128, 155, 0.36);
		color: inherit;
		display: block;
		padding: 0.75em;
		text-decoration: none;
		width: 100%;
		outline: 0;
		border-right-width: 20px;
		border-right-style: solid;
		border-top: none;
		border-left: none;
	}

	input[type="text"],
	input[type="password"],
	input[type="email"], textarea {
		line-height: 1em;
		border: 1px solid #232323;
		border-radius: 30px;
		font-family: 'nexabook', sans-serif;
		font-size: 0.9em;
	}

	.missingField label, .invalidField label { color:#ec0001; }
	.missingField input, .missingField textarea, .missingField select, .invalidField input, .invalidField textarea, .invalidField select { border-color:#ec0001; }

	.formErrors { margin:0; padding:10px 0 10px 0; }
	.formErrors li { list-style:none; margin:0px 0 5px 0; line-height:16px; color:#ec0001;}

	input[type="text"]:focus,
	input[type="password"]:focus,
	input[type="email"]:focus,
	textarea:focus {
		border-color: #7a7542;
	}


	#field-security { display: none !important; }

textarea {height: 200px;}

label:not(.uniqueCheckBoxField label) {display: none;}

	#upperNav {display: none;}

/* 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: #657d6f;
		color: #ffffff;
		cursor: pointer;
		display: inline-block;
		font-size: 1.2em;
		/* font-weight: 900; */
		/* letter-spacing: 2px; */
		/* min-width: 18em; */
    	padding: 10px 35px;
		line-height: normal;
		text-align: center;
		text-decoration: none;
		border-radius: 30px;
		-webkit-box-shadow: 2px 2px 8px 0 #8F8F8F;
		box-shadow: 2px 2px 8px 0 #8F8F8F;
		/* text-transform: uppercase; */

	}
	
	input[type="button"],
	input[type="submit"],
	input[type="reset"]{
		font-family: 'nexabook', sans-serif;
	}

	input[type="button"]:hover,
	input[type="submit"]:hover,
	input[type="reset"]:hover,
	.button:hover {
		background: #232323;
		color: #ffffff;
	}



/* Google Map / Vcard */


	#jGMapW { width:700px; height:400px; margin:10px auto; border:1px solid #ccc; background:#fafafa; }
	#jGMapW .geo{ display:none;}
	#jGMap { width:700px; height:400px; }

	#Content .vcard p { margin:0; padding:0; font-size:1.2em;}
	#Content .vcard .adr .street-address { display:block; }
	#Content .vcard .tel .type, .vcard .uri { display:none; }





/* 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
	 */
	.focusW
	{ margin:0 auto; width: 980px; }

	/**
	 * 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;
	}

/* ################################################################################################################																		     *
														PAGES
 *###############################################################################################################*/




 /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * GENERAL * * * * * * * * * * * * * * * * * * * * * * * * * * * * */

/* HEADER */


	#Header {
		z-index: 10000;
		width: 100%;
	}
	
	#Header h1 img  {max-width: 150px; } 



	#Menu {display: flex; justify-content: space-between; align-items: center; margin: auto; padding: 30px 0 0;}
	#MainMenu {display: flex;}
	#MainMenu li {margin: 0 20px;}
	#MainMenu a {border-bottom: none; font-family: 'nexabold'; font-size: 23px; color: #232323;}
	#MainMenu a:hover {color: #657d6f; text-decoration: underline;}

	#Banner {background: url('zims/frontend/banner.jpg') no-repeat; max-height: 800px; height: 80vh;}
	#Banner img {margin-top: 7%;}

	#HeaderLinks {width: 30%; display: flex; align-items: center; justify-content: flex-end;}
	#HeaderLinks .RESALink_hotel {margin: 30px 20px;}
	#HomeLinkW {margin-bottom: 0;}
	/* #HomeLink {cursor: initial;} */

	:focus-visible {outline: none !important;}
	
	.section {padding: 50px 0 100px;}
	.section h2 {margin: 50px auto;}


	.bigger {font-size: 1.1em;}

	/* REDUCTION DE LA NAVBAR AU SCROLL */
	/*#Header #Nav.shrink {height: 80px;}
	#Header, #HomeLink, #HeaderW h1, #Nav{-webkit-transition: all 0.4s ease; transition: all 0.4s ease;}
	#Header {position: fixed;}
	#Header.shrink {top: 0; height: 15vh;}
	#Header.shrink #Menu {padding: 20px 0 0;}
	#Nav {width: 100%; top: 0;}
	#Header.shrink #HomeLinkW {display: none;}*/


/* Footer */

	#PreFooter {
		clear: both;
		text-align: center;
		margin: auto;
		font-style: italic;
		font-size: 0.8em;
		line-height: 1.5;
		padding: 20px 0;
		background: #B2C4B4;
	}

	#Footer {
		/* background: url(zims/frontend/footer.jpg) no-repeat center; */
		background-size: cover;
		background: #657d6f;
		color: #ffffff;
		text-align: center;
		width: 100%;
		line-height: 1;
		padding: 5px 0;
		/* height: 500px; */
		font-size: 0.8em; 
		margin: auto;
		position: relative;
		/* position: fixed; */
		bottom: 0;
	}

	#Footer a {
		color: #ffffff;
	}

	#Footer a:hover {
		color: #B2C4B4;
	}

	#Footer .coordonnees {
		margin: 0 auto; 
		/* font-family: 'nexabook', sans-serif;  */
		line-height: normal;
		padding: 10px 0;
	}

	.copyright {background: url('zims/frontend/texture-bg.png') repeat #ece2ce; position: absolute; width: 100%; bottom: 0; padding: 5px 0 0;}

	#Socials{ display: table; width: 100%; text-align:center;}
	#Socials li{ display: inline-block;  }
	#FacebookLink, #TwitterLink{ border: none; margin-right: 7px;}

	#Footer a {font-family: 'nexabook', sans-serif; letter-spacing: 0;}

	#NavIco{ 
		display: none; position: absolute; z-index: 5001; height: 70px; width: 70px;
		background: url(zims/buttons/minimenu-b.png) no-repeat center; border: none;
	}
	#NavIco span{ position: absolute; left: 80px; line-height: 1em; top: 22px; text-transform: uppercase; text-shadow: 1px 1px 0px rgba(255, 255, 255, 1);color: #000 !important; }
	/* #NavIco.active{ background-image : url(zims/buttons/minimenu-mltr.png);  } */


	.desktop .reveal{
		position: relative;
		transform: translateY(150px);
		opacity: 0;
		transition: 1s all ease;
	 }
	  
	 .desktop .reveal.active{
		transform: translateY(0);
		opacity: 1;
	}


/* Content */

	/* #Content { padding: 1em 0;} */
	.ultraCentered {width: 1000px; margin: auto;}
	.underline {border-bottom: #C25229 3px solid; display: inline-block;}
	.wrapper {width: 80%; margin: auto;}
	.flex {display: flex; flex-wrap: wrap;}

	hr {height: 3px; background: #c25229; width: 500px; margin: 40px auto;}

	h2.hr {font-weight: 600; font-size: 3em; position: relative; text-align: left;}
	h2.hr span {padding-right: 20px; background: #ECE2CE; display: inline-block; position: relative; z-index: 1;}
	h2.hr:before {border-top: 3px solid #C25229; bottom: 0; content: ''; height: 0; left: 0; margin: auto 0; position: absolute; right: 0; top: 15px; z-index: 0;
	}


	/* Bouton Back to top */
	#up-button{display: none; position: fixed; bottom: 50px; right: 50px;}
	#up-button.show{display: block; z-index: 2;}
	#up-button img {width: 50px;}
	

 /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * HOME * * * * * * * * * * * * * * * * * * * * * * * * * * * * */

	#Header {width: auto; display: flex; margin: 20px 5% 10px; justify-content: space-between;}
	#ContentW {width: 100%; margin: 0 auto; /*padding-top: 80vh;*/}
	
	#HomeW p, #HomeW h5 {text-align: center;}
	.midForm p {text-align: center !important;}
	/* #HomeW p:first-child {color: #9D809B;} */
	
	#HomeW { padding: 0; text-align: center; margin: auto;}
	#Home { display: flex; align-items: center; justify-content: center;}
	
	.confirm {margin-top: 15%; margin-bottom: 15%;}

	.rightButtonW {
		margin: 15px auto;
	}

	#Intro {margin-bottom: 50px;}

	

	/* images flottantes */
	#Cabinet, #Soins, #Secteurs, #RDV, #Contact {position: relative;}
	img.mallette {position: absolute; left: 7%;}
	img.medicaments1 {position: absolute; right: -2%; margin-top: -5%;}
	img.liste {position: absolute; left: 30%; bottom: 0;}
	img.seringue {position: absolute; max-width: 180px; top: 10%; right: 15%;}
	img.stethoscope {position: absolute; max-width: 200px; left: 20%;}
	img.eprouvette {max-width: 80px; position: absolute; left: 5%; bottom: 20%;}
	img.bouteille {position: absolute; right: 5%; bottom: 45%; max-width: 100px;}
	img.croix {position: absolute; right: 20%; bottom: 5%; max-width: 110px;}
	img.poche {position: absolute; max-width: 150px; left: 7%; top: 5%;}
	img.medicaments2 {position: absolute; right: 5%; max-width: 90px; bottom: 25%;}



	/* CABINET */
	#Cabinet h2 {margin-bottom: 0;}
	#Cabinet h3 {font-family: 'miniondisplay'; font-size: 1.4em; letter-spacing: 1px; margin-bottom: 70px;}
	#Cabinet {padding: 50px 0 200px;}


	/* SOINS */
	#Soins {padding-top: 0; margin-top: -60px;}
	#Soins p.bigger {margin: 10px 15% 80px;}
	#ListeSoins li {width: 33%; margin: 40px auto; display: flex; flex-wrap: wrap; text-align: center; justify-content: center;}
	#ListeSoins li span {width: 100%;margin-top: 20px; font-family: 'miniondisplay'; font-size: 1.2em; letter-spacing: 1px;}
	#ListeSoins li img {border-radius: 150px;}


	/* SECTEURS */
	#Secteurs {padding:0 0 100px; }
	.imgSecteurs {max-width: 800px; margin-top: 50px;}


	/* RDV */
	#RDV {background: #B2C4B4; padding: 20px 0 70px;}
	#RDV h2 {margin-bottom: 50px;}
	#RDV .button, #Banner .btnBanner {display: flex; width: fit-content; margin: auto; align-items: center; margin-top: 50px; text-transform: uppercase; font-family: 'nexaheavy';}
	#RDV .button img, #Banner .btnBanner img {margin-right: 20px; width: 40px; margin-top: 0;}



	/* CONTACT */

	#Contact {padding: 10px 0;}
	#Contact h2 {margin: 40px auto 100px;}
	/* #Contact {margin-top: 100px;} */
	h2.hr.right {text-align: right;}
	h2.hr.right span {padding-left: 20px;}
	.introContact {margin: 50px 0 70px;}
	.coordonneesWW {justify-content: center;}
	.coordonneesWW iframe {width: 40%; margin: 0 3%;}
	.coordonneesW {width: 20%; margin: 0 3%;}
	.coordonnees {margin: 40px auto;}
	.coordonnees h5 {margin-bottom: 0; font-family: 'nexaheavy';}

	#ContactFormW {margin: 70px auto 100px;}
	#ContactFormW h5 { margin-bottom: 0; font-family: 'giaza_stencilregular'; text-transform: uppercase; /*letter-spacing: 1px;*/ font-size: 1.8em;}
	#ContactForm {max-width: 800px; margin: auto;}
	#ContactFormMainFieldset {margin: 0;}
	#ContactFormSubmit {width: 200px;}
	#ContactForm #field-nom, #ContactForm #field-prenom, #ContactForm #field-email, #ContactForm #field-tel {width: 47.5%; float: left; margin: 0 0 0.7em;}
	#ContactForm #field-nom, #ContactForm #field-email {margin-right: 5%;}
	.confirmContact {display: none;}
	#field-message {clear: both;}

	.moyensTransport {width: 80%; margin: 120px auto; justify-content: center;}
	.moyensTransport .moyenTransport {width: 30%;}
	.iconeW {margin: auto; width: 300px; background: #8D9A93; height: 150px; margin: auto; border-radius: 100px; position: relative;}
	.iconeW img {max-width: 100px; max-height: 100px;  position: absolute; top: 50%; left: 50%;  transform: translate(-50%, -50%); }
	.moyenTransport p {font-size: 0.9em;}
	.moyenTransport h6 {margin-top: 20px;}
	.moyenTransport h5 {font-family: 'nexaheavy'; font-size: 1.2em; margin-top: 10px;}



/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * MENTIONS LEGALES * * * * * * * * * * * * * */
#LegalW {width: 80%; margin: auto auto 50px; text-align: center;}
#LegalW h4 {font-size: 1.7em; line-height: initial; margin-top: 20px; font-family: 'miniondisplay';}
#LegalW > h4 { margin-bottom: 40px;} 
#LegalW .part1, #LegalW .part2, #LegalW .part3 {text-align: left;}


/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * MASONRY * * * * * * * * * * * * * */
.masonry {column-count: 3; column-gap: 0;  margin: 1.5em auto; text-align: center;}
.item {display: inline-block; padding: 0; margin: 0 0 0.5em; position: relative;}
.item img {max-width: 600px; width: 98%; transition: all 0.3s ease-in-out; backface-visibility: hidden; }
.titreItemGal {margin-bottom: 0; text-align: left !important;}
.fancyEventGal span {text-align: justify; display: inline-block;}

#GalTelethon .masonry .item img {max-width: 450px;}

#BigBannerW.thanks2018 .overlayColor{display: flex !important;}
.comPhoto {display: none; margin: auto;}


.masonry .overlayColor{ 
    position: absolute; width: 100%; height: 99.5%; display:block; z-index:5;
    -moz-transition: background-color 0.3s ease-in-out; top: 0; left: 0;
    -webkit-transition: background-color 0.3s ease-in-out;
    -o-transition: background-color 0.3s ease-in-out;
    -ms-transition: background-color 0.3s ease-in-out;
    transition: background-color 0.3s ease-in-out;
}	

@media all and (max-width: 1830px){
    #GalTelethon .masonry .item img {max-width: 420px;}
}


@media all and (max-width: 1821px){
    .item img {max-width: 550px;}
    .masonry {column-count: 3;}
}

@media all and (max-width: 1725px){
    #GalTelethon .masonry .item img {max-width: 380px;}
}

@media all and (max-width: 1700px){
    .item img {max-width: 500px;}
    .masonry {column-count: 3;}
}

@media all and (max-width: 1560px){
    #GalTelethon .masonry .item img {max-width: 350px;}
}

@media all and (max-width: 1520px){
    .item img {max-width: 450px;}
}

@media all and (max-width: 1441px){
    .item img {max-width: 400px;}
    #GalTelethon .masonry .item img {max-width: 320px;}
    .masonry {column-count: 3;}
    .comPhoto {font-size: 2em;}
    
    /* #page-home #MainMenu li > a.HTMLMenuItemLink-Level1, #page-home #MainMenu .HTMLMenuTitle {font-size: 2.5em;} */
	#ListeSoins li img {max-width: 300px !important;}

}

@media all and (max-width: 1320px){
    #GalTelethon .masonry .item img {max-width: 300px;}
}

@media all and (max-width: 1281px){
    .item img {max-width: 550px;}
    #GalTelethon .masonry .item img {max-width: 430px;}
    .masonry {column-count: 2;}
}

@media all and (max-width: 1185px){
    #GalTelethon .masonry .item img {max-width: 400px;}
}

@media all and (max-width: 1130px){
    .item img {max-width: 500px;}
    .masonry {column-count: 2;}
}

@media all and (max-width: 1100px){
    #GalTelethon .masonry .item img {max-width: 370px;}
}

@media all and (max-width: 1025px){
    .item img {max-width: 450px;}
    .masonry {column-count: 2;}
    
    #page-telethon .coord, #page-telethon .partenaires {margin: auto 20px;}
    #page-telethon .partenaires {margin-bottom: 40px;}
    #page-telethon .coord p {margin-left: 30px;}
    
    #page-telethon .partenaires img {width: 100%;}
}

@media all and (max-width: 923px){
    .item {width: 100%;}
    .item img {max-width: 100%; width: 100%;}
    .masonry {column-count: 1;}
    .masonry .overlayColor{height: 99.2%;}
}



 /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * CONTACT * * * * * * * * * * * * * * * * * * * * * * * * * * * * */

	
	
	
	
	p.center { text-align:center; color:#000000;  /*font-family: 'Playfair Display', serif;*/ font-style:italic;  }
	p.center  strong  { font-weight:bold;   }
	p.center  strong.bigText  { font-size:1.2em; font-family: 'Open Sans', sans-serif; font-style:normal; }
	p.center  span   {   font-family: 'Open Sans', sans-serif; font-style:normal;  }

	p#Confirmation{
		font-size: 22px; font-style:italic; font-weight: 300; line-height:40px; margin: 80px 0 0 25px;
	}

	



.hiddenDesktop {display: none;}




@media (min-width: 1024px) and (max-width: 1600px){

	body {font-size: 17px;}
	#ListeSoins li img {max-width: 350px;}
	img.mallette {max-width: 150px;}
	img.medicaments1 {max-width: 250px;}
	img.seringue {top: 12px; max-width: 150px;}

}



@media all and (min-width: 1025px){

	.desktop {display: block;}
	.mobile {display: none;}

}



@media (min-width: 1024px) and (max-height:600px){

	#Header h1 img {width: 60% !important;}
	
	.moyensTransport {margin: 30px auto 60px !important;}

}



@media all and (min-width: 768px) and (max-width: 1024px) {

	
	.coordonneesW {display: flex; justify-content: space-evenly; flex-wrap: wrap;}
	.coordonnees {width: 100%; margin: 10px auto;}


	#Header {display: block; margin: 20px 0 10px;}
	#HomeLink {padding-left: 5%;}
	#Contact h2 {margin-top: 40px !important;}
	.coordonneesWW .moyensTransport {flex-wrap: wrap;}
	.coordonneesWW .moyensTransport .moyenTransport {width: 50%;}
	.imgSecteurs {max-width: 700px;}

	img.medicaments1 {right: -10%;}
	img.liste {left: 10%;}
	img.seringue {top: 15%; right: 5%;}
	img.mallette {left: 4%;}
	img.stethoscope {left: 8%;}
	img.bouteille {z-index: -1; right: 1%;}
	img.eprouvette {z-index: -1; bottom: 4%;}
	img.croix {right: 10%;}

}



@media all and (max-width: 1024px){

	/*#Header h1 img {
		width: 90%;
	}*/

	#Header h1 {
		/* padding: 18vh 0 0; */
		margin-top: 0;
		margin-left: 0;
	}

	h2 {
		line-height: 1;
		font-size: 2.8em;
	}

	
	
	#Nav {
		top: 0;
		width: 100%;
		height: auto !important;
		z-index: 5001;}
	
	#Menu{ background: rgba(101,125,111,0.90); z-index: 5000; width: 100%; flex-wrap: wrap; justify-content: center; padding: 50px 0 50px;}
	#NavIco{ position: fixed; display: block; right: 0; top: 0;}
	/*#NavIco.active{ position: absolute;}*/
	#NavIco span{ display: none;}
	
	#MainMenu{ width: 100%; padding: 0 5% 0; margin-top: 0; margin-left: 0; display: inline; float: left; overflow: auto; height: auto; justify-content: flex-end; margin-right: 10px; align-items: center;}
	#MainMenu li{ width: 100%; margin: 0; font-size: 1.2em; text-align: center; padding: 8px 0; color: #ffffff; float: none; display: block;}
	#MainMenu li:last-child{ border: none; }
	#MainMenu li a{ background: none; padding: 0;}
	#MainMenu li > a.HTMLMenuItemLink-Level1{ font-size: 1.1em;}
	#NavIco span{ opacity: 0; top: -100px;}
	/* #Header, #Nav, #Menu, #MainMenu {height: 100%;} */
	#Nav {height: 100%;}
	#upperNav {display: block;}

	#page-home #MainMenu li > a.HTMLMenuItemLink-Level1, #page-home #MainMenu .HTMLMenuTitle {font-size: 1.5em; color: #ffffff;}

	/* #SelectLang, #HeaderLinks .RESALink_hotel {color: #232323 !important;} */
	#HeaderLinks {width: 100%; justify-content: center;}

	#HomeW h2 {
		/* margin-top: -30px; */
		margin-bottom: 20px;
	}

	#Home {
		flex-wrap: wrap;
	}

	#HomeW .left {
		width: 100%;
		border-right: none;
		/* border-bottom: 2px solid #c25229; */
		padding: 0;
	}

	#HomeW .right {
		width: 100%;
	}

	#Footer {
		position: initial;
		padding-top: 5px;
	}


	input[type="button"], input[type="submit"], input[type="reset"], .button {
		font-size: 1.4em;
	}

	#Footer .coordonnees {
		padding: 0 10px;
		line-height: 1;
	}

	.rightButtonW {
		margin: 15px auto 20px;
	}



	/* GLOBAL */
	.wrapper {width: 90%;}
	h2 {font-size: 2em; margin-top: 40px;}
	h2.hr {font-size: 2em; border-bottom: 3px solid #c25229;}
	h2.hr:before {display: none;}
	.encartLivraison .mobile {display: block;}
	.encartLivraison .desktop {display: none;}
	.ultraCentered {width: 90%;}
	hr {width: 60%;}

	/* HEADER */
	/*#Header {height: 50vh; margin-bottom: 30px;}*/

	/* FOOTER */
	#Footer .coordonnees a {display: block;}
	#PreFooter {height: auto;}
	#FooterNews .wrapper {margin: auto !important;}

	
	/* ACCES ET CONTACT */
	.introContact {margin: 50px 0 30px;}
	.coordonneesWW iframe {width: 100%;}
	.coordonneesW {width: 100%; margin-top: 30px;}
	#ContactFormW {margin: 30px auto 100px;}
	#ContactForm #field-nom, #ContactForm #field-prenom, #ContactForm #field-email, #ContactForm #field-tel {width: 100%;}
	.moyensTransport {width: 100%; margin: 30px auto 100px;}
	.moyensTransport .moyenTransport {width: 50%;}


	/* RESEAUX SOCIAUX */
	.socialW {margin: 50px auto 0;}

	

	/* SUPPL. CABINET INFIRMIER */
	body {overflow-x: hidden;}
	#Banner {background-size: cover; min-height: 300px; max-height: 500px; height: auto;}
	#Banner img {display: none;}
	/* #Banner .btnBanner img {display: inline-block;} */
	#Banner .btnBanner {font-size: 1em; display: inline-block;}
	#Footer {padding: 15px; line-height: 1;}
	#RDV {padding-top: 50px;}
	#ListeSoins li {margin: 20px auto;}
	.moyensTransport {margin: 30px auto;}
	#Soins p.bigger {margin: 10px 10% 80px;}
	#ListeSoins li {width: 45%;}
	#ListeSoins li img {width: 100%;}
	
	

}



@media  (max-width : 780px) {

	#ContentW {width: 100%;}
	#Header {width: 100%;}
	#Footer {width: 100%;}
	
	#fieldset-arrivee, #fieldset-depart {width: 100%; float: none;}
	#fieldset-arrivee {margin-right: 0;}
	
	#HomeW {padding: 0 0 2em;}
	
	.moyensTransport hr {background: #232323; height: 1px; width: 100px;}

	.moyensTransport .moyenTransport {width: 100%;}



}



@media  (max-width : 767px) {

	#Header h1 {padding-left: 5%;}
	#Cabinet {overflow-x: hidden;}
	#Cabinet h3 {line-height: 1;}
	#Soins p.bigger {margin: 10px 0 80px;}
	#ListeSoins li {width: 100%;}
	#ListeSoins li img {width: 100%; max-width: 400px;}
	.hiddenDesktop {display: block; text-align: left; font-size: 0.8em; font-style: italic;}
	.imgSecteursW {overflow-x: scroll;}
	#Banner {background-size: contain; min-height: 180px; max-height: initial; height: auto;}
	#Header {margin: 20px 0 10px; padding: 0; display: block;}
	img.mallette {max-width: 100px; top: 0;}
	img.liste {left: 20px; max-width: 100px;}
	img.medicaments1 {position: absolute; right: -15%; margin-top: -15%; max-width: 200px;}
	img.seringue {max-width: 150px; right: 0; top: 11%;}
	img.medicaments2 {z-index: -1;}
	img.poche {max-width: 100px; left: 4%; top: 2%;}
	img.croix {right: 5%; bottom: 28%; max-width: 70px;}
	img.bouteille {bottom: 1%; max-width: 70px;}
	img.eprouvette {bottom: 60%; max-width: 50px; z-index: -1;}

}