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

Version 0.9.6.0
Date 02/01/2015
*/

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


@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,300,400italic,600,700,800);
/*@import url("http://fonts.googleapis.com/css?family=Lato:300,400,900");*/

/*font-family: 'Open Sans', Arial, sans-serif;*/



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

	#page-questionnaire{background:url(zims/frontend/bg_v2.jpg) 0 0 no-repeat;
	font-family:'Open Sans','sans-serif'; 
	background-size:auto;}
	html, body { margin: 0; padding: 0; border: 0; }
	body{
		font-size:15px; background: #f3f6fa;
		color: #7c8081;
		font-family: 'Lato', sans-serif;
		font-weight: 300;
		letter-spacing: 0.025em;
		line-height: 1.75em;
	}

	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-family: 'Lato', sans-serif;
		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: #3fb1a3;
		text-decoration: none;
		border-bottom: dotted 1px;
	}

		a:hover {
			border-bottom-color: transparent;
			text-decoration: none;
			/*color: #666; */
		}

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


	strong, b {
		font-weight: 400;
	}

	p, ul, ol, dl, table, blockquote {
		margin: 0 0 2em 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;
		}

	h2 {
		font-size: 1.5em;
		letter-spacing: 0.1em;
	}

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

	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: 2px solid #00b5cc;
		color: inherit;
		display: block;
		padding: 0.75em;
		text-decoration: none;
		width: 100%;
		outline: 0;
	
		border-right-style: solid;
	}

	input[type="text"],
	input[type="password"],
	input[type="email"] {
		line-height: 1em;
	}

	.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;text-align:center;}

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


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



/* 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: solid 1px;
		color: inherit;
		cursor: pointer;
		display: inline-block;
		font-size: 0.8em;
		font-weight: 900;
		letter-spacing: 2px;
		/*min-width: 18em;*/
		padding: 0.5em 0.75em;
		line-height: 1.75em;
		text-align: center;
		text-decoration: none;
		text-transform: uppercase;
	}

		input[type="button"]:hover,
		input[type="submit"]:hover,
		input[type="reset"]:hover,
		.button:hover {
			background: rgba(188, 202, 206, 0.15);
			border-color: inherit;
		}



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



/* LANGS */


	#LangLinks{ z-index:1000; position:absolute; right:10px; top: 3px; }
	#LangLinks li { width: 24px; height: 18px; float: left; margin-right: 8px;}
	#LangLinks li.last{ margin: 0;}
	#LangLinks li a { display: block; height: 100%; background-image: url(zims/buttons/flags.png); border: none; }

	#LangLinks li a.disabled{ background-image: url(zims/buttons/flags-disabled.png); }
	#LangLinks li a:hover{
		background-image: url(zims/buttons/flags.png);
		box-shadow: 0px 0px 3px #ffffff;
	}
	.hiddenData, #ConceptionCredit span, #LangLinks li a span
	{display: none;}
	#FrLink{ background-position: -24px top; } #EnLink{ background-position: 0 top; }
	#EsLink{ background-position: -48px top; } #CaLink{ background-position: -192px top; }
	#DeLink{ background-position: -72px top; }




/* 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 {
			font-weight: 900;
			margin: 0;
		}
		#Header h1 { margin:0; padding:0; }



/* Footer */

	#Footer {
		background: #e8eef4;
		color: #7c8081;
		padding: 5em 2em;
		text-align: center;
		display:none;
	}

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


/* Content */
	#ContentA{padding-top: 20px;
		padding-bottom: 20px;
		width: 740px;
		position: relative;
		margin: 0 auto;
	}

	div#ContentW {padding: 190px 0px;}
		

	#Content { padding: 2em 0;width: 70%;margin: 0 auto;background:rgba(255,255,255,0.5);	}
				
		
	div#Choix {  display: flex; justify-content: space-around;}

	#Content h1{text-align:center;color: #69737c;font-weight:bold;font-size: 2em;}
	div#Choix a { padding: 7%;background: rgba(255,255,255,0.4); width: 35%;font-size: 3em;}
   
	.flex-1 {
	  flex: 1;
	  min-width: 250px;
	  margin: 0 auto 50px;
	}

	.button {
	  padding: 2rem 7rem;
	  
	  text-align: center;
	  display: inline-block;
	  font-size: 1.7rem;
	  text-transform: uppercase;
	  font-weight: 700;
	  position: relative;
	  will-change: transform;
	}

	.button-mat {
	  color: #5533ff;
	  border: 0px transparent;
	  border-radius: 0.3rem;
	  transition: 0.3s ease-in-out;
	  transition-delay: 0.35s;
	  overflow: hidden;
	}
	.button-mat:before {
	  content: "";
	  display: block;
	  background: #401aff;
	  position: absolute;
	  width: 200%;
	  height: 500%;
	  border-radius: 100%;
	  transition: 0.36s cubic-bezier(0.4, 0, 1, 1);
	}
	.button-mat:hover .psuedo-text {
	  color: white;
	}
	.button-mat:hover {
	  color: transparent;
	}


	.btn-3 {
	  letter-spacing: 10px;
	  position: relative;
		border: 3px solid;
	  color:#00b5cc;
	  overflow: hidden;
	  transition: 0.3s ease-in-out;
	  border-radius: 0.3rem;
	  z-index: 1;
	  box-shadow: 0 19px 38px rgba(0, 0, 0, 0.3), 0 15px 12px rgba(0, 0, 0, 0.22);
	}
	.btn-3:hover {
	  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
	  transform: scale(0.95);
	}
	#VoteFormSubmit:hover{ box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
	  transform: scale(0.95);}

	#VoteFormMainFieldset p{width:60%;margin:0 auto;}
	#VoteFormMainFieldset #field-mail label,#field-reason label{display:none;}

	div#VoteFormButtons {text-align: center;margin-top: 20px;}
	
	#VoteFormSubmit{ background-color: #00b5cc;color:#ffffff;width: 12%;}
		
	p#field-reason {margin-top: 20px;}
		
	p#field-reason label {font-weight:bold;}
		
	p#field-mail{background: rgba(255,255,255,0.4);}

	p#CompleteMSG {
    text-align: center;
    font-weight: bold;
    font-size: 3em;
    color: #69737c;
    padding: 150px 0;
    margin: 0 auto;
	line-height:80px;
	}
	#LogoPiscinea {
		width: 21%;
		position: absolute;
		top: 0;
		left: 70px;
	}

	#Content h2 {
		font-size: 1em;
		letter-spacing: 0.1em;
		text-align: center;
		font-weight:600;
		color:#69737c;
	}
	textarea#reason {background: rgba(255,255,255,0.4);}
		
	#Mail fieldset h2{background:#00b5cc;}



 /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * HOME * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
 
 	#page-home{}

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

	#page-contact{}

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





@media(max-width:1024px) {
	
	#page-questionnaire {
    background: url(zims/frontend/bg_v2.jpg) 0 0 no-repeat;
    font-family: 'Open Sans','sans-serif';
    background-size: auto;
    background-position: center;
	}
	
	div#Choix {
    display: flex;
    justify-content: space-around;
	flex-direction:column;
	align-items: center;
	}

	div#Choix a {
		padding: 7%;
		background: rgba(255,255,255,0.4);
		width: 60%;
		margin-top: 20px;
	}
	#LogoPiscinea {
		width: 51%;
		position: absolute;
		top: 0;
		left: 22%;
	}
	#VoteFormMainFieldset p {
		width: auto;
		margin: 0 auto;
	}
	#VoteFormSubmit {
		background-color: #00b5cc;
		color: #ffffff;
		width: auto;
	}
	#Content {
		padding: 2em 0;
		width: 80%;
		margin: 0 auto;
		background: rgba(255,255,255,0.7);
	}
	fieldset#VoteFormMainFieldset {
		padding: 20px;
	}
	#Content h2 {
		font-size: 1em;
		letter-spacing: 0.1em;
		text-align: center;
		font-weight: 600;
		color: #69737c;
		padding: 6px;
	}
	p#field-mail {
		margin-bottom: 25px;
	}
	p#CompleteMSG {
		text-align: center;
		font-weight: bold;
		font-size: 2em;
		color: #69737c;
		padding: 75px 0;
		margin: 0 auto;
		line-height: 62px;
	}
		
		
		
		
		
		
}


@media(max-width:767px) { 
	
	.button {
    padding: 1rem 0;
	}
}