/* >–––––––––––––––––––––––––––––––––––––– XXXXX –––––––––< */
/* >–––––– XXXXXX XXXXXXXX ––––––< */


/* >–––––––––––––––––––––––––––––––––––––– FORM –––––––––< */

#iViewport section.form {
	/*min-height: 50vh;*/
}
	#iViewport section.form > p:first-child { margin-bottom: 5rem; text-align: center; }

	#iViewport #errs { text-align: center; }
	#iViewport #errs p { 
		margin-bottom: 2rem;
		font-family: "GaramondURW W01 Bold", sans-serif;
		color:#a00;
		text-align: center;
	}
	#iViewport #errs > p { display: none; }

	#iViewport #errs > .retour { display: none; }
		#iViewport #errs > .retour h3 { 
			margin-bottom: 2rem;
			font-family: "FuturaExtBol W05 Regular", sans-serif;
			font-size: 2.4rem; line-height: 3rem; 
			color: #000; 
		}
		#iViewport #errs > .retour p { 
			margin-left: auto; margin-right: auto; 
			max-width: 80rem; 
			font-family: "URW Garamond W01 Regular", sans-serif;
			color: #000000; 
		}

	#iViewport #errs > .retour,
	#iViewport #errs > p { box-sizing: border-box; padding-right: 4rem; padding-top: 2rem; }


	#iViewport section.form h6 {
		margin-bottom: 2rem;
		font-size: 2rem;
		text-transform: uppercase;
		text-align: center;
	}

	#iViewport section.form hr { margin: 0 auto 2rem auto; width: 80%; }

	#iViewport form section > div {
		box-sizing: border-box;
		padding: 0 2rem;
	}
	section.dual form section > div {
		display: inline-block; vertical-align: top;
		width: 50%;
	}
	#iViewport form section > div.full { width: 100%; }


/* >–––––– FORM ––––––< */

section.form form {
	margin: 0 auto;
	width: 80%; max-width: 50rem;
}
section.form input, textarea, select { font-family: "URW Garamond W01 Regular", sans-serif; }

	label { 
		display: block;
		margin-bottom: 0.5rem;
		font-size: 2.2rem; line-height: 2.2rem; letter-spacing: 0.1rem; 
		color: #000000;
	}
	label.err { color:#f00; }
	label a:hover { color: #000; }
	label::first-letter { font-family: "GaramondURW W01 Bold", sans-serif; }

	section.form input {
		-webkit-appearance: none;
		box-sizing: border-box;
		display: block;
		margin: 0 auto;
		margin-bottom: 3rem; 
		padding: 1.2rem 2rem;
		width: 100%; 
		/*height: 5rem;*/
		font-size: 2rem; line-height: 2rem; letter-spacing: 0.1rem; 
		color: #000;
		background: none;
		border: none;
		background-color: #E8FAEB;
		border: 1px solid #000;
	}

	section.form input[type=submit] {
		border: none; background  : none; outline: none;

		box-sizing: border-box;
		margin:0 auto;
		padding: 1.5rem 5rem;
		width: auto;
		height: auto;
		font-size: 2.4rem; line-height: 2.4rem; 
		color: #000;
	}
	section.form input[type=submit]:hover { 
		cursor: pointer; 
		color: #007fff; 
	}

	section.form input[type=checkbox] {
		-moz-appearance: none;
		-webkit-appearance: none;
		box-sizing: border-box;
		display: inline-block; vertical-align: middle;
		margin-right: 1rem; padding: 0;
		width: 2.5rem; 
		height: 2.5rem;
		background-color: #E8FAEB;
		border: none;
		border-radius: none;
		border: 1px solid #000;
		cursor: pointer;
	}
	section.form input[type=checkbox]:checked { 
		background: url("../../assets/images/check-mark.jpg") no-repeat center center;
		background-size: contain;
	}
	section.form input[type=checkbox]+label { 
		display: inline-block; vertical-align: top;
		margin-bottom: 0; 
		width: 80%; 
		font-size: 2rem; line-height: 2.2rem;
	}
	section.form input[type=checkbox]+label a { 
		font-family: "FrutigerSerifLTW01-Bold_722230", sans-serif; 
		color: #1ea2e5;
	}
	section.form input[type=checkbox]+label a:hover { color: #6e6e6e; }

	textarea 
	{
		-webkit-appearance: none;
		box-sizing: border-box;
		display: block;
		margin-bottom: 2rem; padding: 1.5rem 2rem;
		width: 100%; height: 34rem;
		font-size: 2rem; line-height: 3rem; letter-spacing: 0.1rem; 
		color: #000;
		background: none;
		border: none;
		border-radius: 0;
		background-color: #E8FAEB;
		border: 1px solid #000;
		overflow: hidden; /* IE */
	}

	select {
		-webkit-appearance: none;
		box-sizing: border-box;
		display: block;
		margin: 0 auto;
		margin-bottom: 3rem; 
		padding: 1.2rem 2rem;
		width: 100%; 
		/*height: 5rem;*/
		font-size: 2rem; line-height: 2rem; letter-spacing: 0.1rem;  
		color: #000;
		background: none;
		border: none;
		border-radius: 0;
		background-color: #E8FAEB;
		border: 1px solid #000;
	}


/* >–––––––––––––––––––––––––––––––––––––– RESET PASS –––––––––< */

#iViewport section.form .reset { 
	/*margin-top: 0rem; */
	text-align: right; 
}
	#iViewport section.form .reset p { 
		display: inline; 
		margin: 0 auto; 
		width: auto;
		font-family: "Helvetica Neue LT W01_75 Bold", sans-serif;
		font-size: 1.4rem; line-height: 1.4rem;
	}
	#iViewport section.form .reset a { color: #000; }
	#iViewport section.form .reset a:hover { color: #6e6e6e; }

#iViewport section.form hr { margin: 4rem auto; }

#iViewport section.form .scrll { 
	text-align: center; 
}
	#iViewport section.form .scrll p { 
		display: inline; 
		margin: 0 auto; 
		width: auto;
		font-size: 2rem; line-height: 2.8rem;
	}
	#iViewport section.form .scrll a { 
		font-family: "Futura Pro Medium W05 Regular", sans-serif; 
		text-transform: uppercase;
	}


/* >–––––––––––––––––––––––––––––––––––––– SIGN UP –––––––––< */

section.form.signup form {
	margin: 0 auto;
	width: 80%; max-width: 100rem;
}
	section.form.signup form section > div#accept { margin-top: 2rem; width: 100%; }







/* >–––––––––––––––––––––––––––––––––––––– REACTIF ––––––––––––––––––––––– REACTIF ––––––––––––––––––––––– REACTIF ––––––––––––––––––––––– REACTIF –––––––––< */


@media all and (max-width: 1000px) {
	section.form.signup form { width: 100%; }
}

@media all and (max-width: 800px) {
	section.form.dual form section > div { display: block; width: 100%; }
	/* > SIGN-UP ––––––< */
	section.form.signup form { width: 100%; }
}


@media all and (max-width: 600px) {
	#iViewport #errs > .retour p { font-size: 1.6rem; line-height: 2.4rem; }
	#iViewport form section > div { padding: 0; }
	/* > FORM ––––––< */
	section.form form { width: 100%; }
	label { font-size: 2rem; line-height: 2rem; }
	/*section.form input,*/
	/*select { height: 4.4rem; }*/
	/*section.form input[type=submit] { padding: 1rem 4rem; font-size: 1.6rem; line-height: 1.6rem; }*/
	section.form input[type=checkbox]+label { width: 80%; font-size: 1.6rem; line-height: 2rem; }
	/*textarea { height: 25rem; }*/
	select { padding: 1rem 2rem; }

	
}

@media all and (max-width: 400px)
{
	/* > FORM ––––––< */
	section.form input { width: 100%; }
}



