/* Formulaires - Connexion / Messages */ 
input, select{
	border: 1px solid rgba(121,121,121,1);
	border-radius:5px;
	background-color: rgba(210,180,140,0.2);
	font-size: 1rem;
	margin:0;
	padding:2%;
}

textarea{
	border:1px solid rgba(121,121,121,1);
	border-radius:5px;
	background-color: rgba(210,180,140,0.2);
	width:86%;
	float:left;
	height:8rem;
	font-size:1rem;
	margin:1rem 0 1rem 5%;
	padding:2%;
}

.submit{
	/* background-color: rgba(47, 148, 40, 0.1); vert */
	color:#2F9428;
	padding:0.5rem 1rem;
	text-decoration: underline;
	border:1px solid #2F9428;
	font-size: 1.2rem;
}
.submit:hover{
	color:#B69731;
	border:1px solid #B69731;
}

.checkbox{
	height:1.5rem;
	width:1.5rem;
}
.radio{
	height:1.2rem;
	width:1.2rem;
}

.compte{
	padding: 0;
	float:left;
}


#indicatif{
	display: inline;
}

#indicatifautomatique{
	display: none;
	width: 6rem;
}


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

	/* Iphone 3 4 5 portrait 320px */

	.formtexte{ 
		width: 90%;
		margin: 0 0 0 5%;
		float: left;
	}
	.formtexte h4, .formtexte h3{
		text-align: left;
		margin: 0;
		padding: 0 0 0.5rem 0;
	}
	.forminput{
		width: 90%;
		margin: 0 0 0 5%; 
		float: left;
	}
	.forminput h4, .forminput h3{
		text-align:left;
		margin:0;
		padding:0;
	}

	select{
		width:100%;
		margin:0;
		padding:3%;
	}

	#indicatif{
		width:20%;
		margin:0;
		padding:3%;
	}
	
	.large{
		width:94%;
		margin:0;
		padding:3%;		
	}
	.standard{
		width:94%;
		margin:0;
		padding:3%;		
	}
	.etroit{
		width:60%;
		margin:0;
		padding:3%;	
	}
	.submit{
		font-size: 1.1rem;
	}	

}

@media all and (min-width:368px) and (max-width:467px){

	/* Iphone 6 portrait 375px */

	.formtexte{
		width: 90%;
		margin: 0 0 0 5%;
		float: left;
	}
	.formtexte h4, .formtexte h3{
		text-align: left;
		margin: 0;
		padding: 0 0 0.5rem 0;
	}
	.forminput{
		width: 90%;
		margin: 0 0 0 5%; 
		float: left;
	}
	.forminput h4, .forminput h3{
		text-align:left;
		margin:0;
		padding:0;
	}

	
	select{
		width:100%;
		margin:0;
		padding:3%;
	}

	#indicatif{
		width:20%;
		margin:0;
		padding:3%;
	}
	
	.large{
		width:94%;
		margin:0;
		padding:3%;		
	}
	.standard{
		width:94%;
		margin:0;
		padding:3%;		
	}
	.etroit{
		width:60%;
		margin:0;
		padding:3%;	
	}
	.submit{
		font-size: 1.1rem;
	}
		
}

@media all and (min-width:468px) and (max-width:567px){

	/* iphone 3 4 paysage 480px */

	.formtexte{
		width: 90%;
		margin: 0 0 0 5%;
		float: left;
	}
	.formtexte h4, .formtexte h3{
		text-align: left;
		margin: 0;
		padding: 0 0 0.5rem 0;
	}
	.forminput{
		width: 90%;
		margin: 0 0 0 5%; 
		float: left;
	}
	.forminput h4, .forminput h3{
		text-align:left;
		margin:0;
		padding:0;
	}

	select{
		width:100%;
		margin:0;
		padding:3%;
	}

	#indicatif{
		width:16%;
		margin:0;
		padding:3%;
	}
	
	.large{
		width:94%;
		margin:0;
		padding:3%;		
	}
	.standard{
		width:94%;
		margin:0;
		padding:3%;		
	}
	.etroit{
		width:60%;
		margin:0;
		padding:3%;	
	}
	.submit{
		font-size: 1.1rem;
	}

}

@media all and (min-width:568px) and (max-width:667px) {

	/* iphone 5 paysage 568px */

	.formtexte{
		width: 90%;
		margin: 0 0 0 5%;
		float: left;
	}
	.formtexte h4, .formtexte h3{
		text-align: left;
		margin: 0;
		padding: 0 0 0.5rem 0;
	}
	.forminput{
		width: 90%;
		margin: 0 0 0 5%; 
		float: left;
	}
	.forminput h4, .forminput h3{
		text-align:left;
		margin:0;
		padding:0;
	}

	select{
		width:100%;
		margin:0;
		padding:2%;
	}

	#indicatif{
		width:14%;
		margin:0;
		padding:2%;
	}
	
	.large{
		width:96%;
		margin:0;
		padding:2%;		
	}
	.standard{
		width:96%;
		margin:0;
		padding:2%;		
	}
	.etroit{
		width:60%;
		margin:0;
		padding:2%;	
	}
	.submit{
		font-size: 1.1rem;
	}

}

@media all and (min-width:668px) and (max-width:767px) {

	/* Samsung galaxy paysage 640px iphone 6 paysage 667 */

	.formtexte{
		width: 90%;
		margin: 0 0 0 5%;
		float: left;
	}
	.formtexte h4, .formtexte h3{
		text-align: left;
		margin: 0;
		padding: 0 0 0.5rem 0;
	}
	.forminput{
		width: 90%;
		margin: 0 0 0 5%; 
		float: left;
	}
	.forminput h4, .forminput h3{
		text-align:left;
		margin:0;
		padding:0;
	}

	select{
		width:100%;
		margin:0;
		padding:2%;
	}

	#indicatif{
		width:14%;
		margin:0;
		padding:2%;
	}
	
	.large{
		width:96%;
		margin:0;
		padding:2%;		
	}
	.standard{
		width:96%;
		margin:0;
		padding:2%;		
	}
	.etroit{
		width:60%;
		margin:0;
		padding:2%;	
	}
	.submit{
		font-size: 1.1rem;
	}	

}

/* tablettes */		

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

	/* ipad portrait 768px Samsung Tab 800px */

	.formtexte{
		width: 80%;
		margin: 0 0 0 10%;
		float: left;
	}
	.formtexte h4, .formtexte h3{
		text-align: left;
		margin: 0;
		padding: 0 0 0.5rem 0;
	}
	.forminput{
		width: 80%;
		margin: 0 0 0 10%; 
		float: left;
	}
	.forminput h4, .forminput h3{
		text-align: left;
		margin: 0;
		padding: 0;
	}

	#indicatif{
		width:10%;
		margin:0;		
	}
	.large{
		width:70%;
		margin:0;		
	}
	.standard{
		width:50%;
		margin:0;		
	}
	.etroit{
		width:30%;
		margin:0;
	}
	.submit{
		font-size: 1.2rem;

	}
		
}

@media all and (min-width:900px) and (max-width:999px) {

	/* Asus LG  paysage 960px */

	.formtexte{
		width: 80%;
		margin: 0 0 0 10%;
		float: left;
	}
	.formtexte h4, .formtexte h3{
		text-align: left;
		margin: 0;
		padding: 0 0 0.5rem 0;
	}
	.forminput{
		width: 80%;
		margin: 0 0 0 10%; 
		float: left;
	}
	.forminput h4, .forminput h3{
		text-align: left;
		margin: 0;
		padding: 0;
	}

	#indicatif{
		width:10%;
		margin:0;		
	}
	.large{
		width:65%;
		margin:0;		
	}
	.standard{
		width:45%;
		margin:0;		
	}
	.etroit{
		width:30%;
		margin:0;
	}
	.submit{
		font-size: 1.2rem;

	}
	
}

@media all and (min-width:1000px) and (max-width:1099px) {

	/* ipad paysage 1024 px */

	.formtexte{
		width: 80%;
		margin: 0 0 0 10%;
		float: left;
	}
	.formtexte h4, .formtexte h3{
		text-align: left;
		margin: 0;
		padding: 0 0 0.5rem 0;
	}
	.forminput{
		width: 80%;
		margin: 0 0 0 10%; 
		float: left;
	}
	.forminput h4, .forminput h3{
		text-align: left;
		margin: 0;
		padding: 0;
	}

	#indicatif{
		width:10%;
		margin:0;		
	}
	.large{
		width:60%;
		margin:0;		
	}
	.standard{
		width:40%;
		margin:0;		
	}
	.etroit{
		width:28%;
		margin:0;
	}
	.submit{
		font-size: 1.2rem;

	}

}

/* Ordinateurs */

@media all and (min-width:1100px) and (max-width:1199px) {

	.formtexte{
		width: 40%;
		margin: 0;
		float: left;
	}
	.formtexte h4, .formtexte h3{
		text-align: right;
		padding-top : 0.1rem;
	}
	.forminput{
		width: 60%;
		margin: 0; 
		float: left;
	}
	.forminput h4, .forminput h3{
		text-align: left;
		margin: 0;
		padding: 0;
	}

	#indicatif{
		width:10%;
		margin:0;		
	}
	.large{
		width:65%;
		margin:0;		
	}
	.standard{
		width:45%;
		margin:0;		
	}
	.etroit{
		width:30%;
		margin:0;
	}
	.submit{
		font-size: 1.2rem;
	}

}

@media all and (min-width:1200px) and (max-width:1299px) {

	.formtexte{
		width: 40%;
		margin: 0;
		float: left;
	}
	.formtexte h4, .formtexte h3{
		text-align: right;
		padding-top : 0.1rem;
	}
	.forminput{
		width: 60%;
		margin: 0; 
		float: left;
	}
	.forminput h4, .forminput h3{
		text-align: left;
		margin: 0;
		padding: 0;
	}

	#indicatif{
		width:10%;
		margin:0;		
	}	
	.large{
		width:65%;
		margin:0;		
	}
	.standard{
		width:45%;
		margin:0;		
	}
	.etroit{
		width:30%;
		margin:0;
	}
	.submit{
		font-size: 1.2rem;
	}
	
}

@media all and (min-width:1300px) and (max-width:1399px) {

	.formtexte{
		width: 40%;
		margin: 0;
		float: left;
	}
	.formtexte h4, .formtexte h3{
		text-align: right;
		padding-top : 0.1rem;
	}
	.forminput{
		width: 60%;
		margin: 0; 
		float: left;
	}
	.forminput h4, .forminput h3{
		text-align: left;
		margin: 0;
		padding: 0;
	}

	#indicatif{
		width:8%;
		margin:0;		
	}
	.large{
		width:60%;
		margin:0;		
	}
	.standard{
		width:40%;
		margin:0;		
	}
	.etroit{
		width:25%;
		margin:0;
	}
	.submit{
		font-size: 1.2rem;
	}

}

@media all and (min-width:1400px) and (max-width:1499px) {


	.formtexte{
		width: 40%;
		margin: 0;
		float: left;
	}
	.formtexte h4, .formtexte h3{
		text-align: right;
		padding-top : 0.1rem;
	}
	.forminput{
		width: 60%;
		margin: 0; 
		float: left;
	}
	.forminput h4, .forminput h3{
		text-align: left;
		margin: 0;
		padding: 0;
	}

	#indicatif{
		width:8%;
		margin:0;		
	}
	.large{
		width:60%;
		margin:0;		
	}
	.standard{
		width:40%;
		margin:0;		
	}
	.etroit{
		width:25%;
		margin:0;
	}
	.submit{
		font-size: 1.2rem;
	}

}

@media all and (min-width:1500px) and (max-width:1599px) {

	.formtexte{
		width: 40%;
		margin: 0;
		float: left;
	}
	.formtexte h4, .formtexte h3{
		text-align: right;
		padding-top : 0.1rem;
	}
	.forminput{
		width: 60%;
		margin: 0; 
		float: left;
	}
	.forminput h4, .forminput h3{
		text-align: left;
		margin: 0;
		padding: 0;
	}

	#indicatif{
		width:8%;
		margin:0;		
	}
	.large{
		width:55%;
		margin:0;		
	}
	.standard{
		width:35%;
		margin:0;		
	}
	.etroit{
		width:25%;
		margin:0;
	}
	.submit{
		font-size: 1.2rem;
	}
	
}

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

	.formtexte{
		width: 40%;
		margin: 0;
		float: left;
	}
	.formtexte h4, .formtexte h3{
		text-align: right;
		padding-top : 0.1rem;
	}
	.forminput{
		width: 60%;
		margin: 0; 
		float: left;
	}
	.forminput h4, .forminput h3{
		text-align: left;
		margin: 0;
		padding: 0;
	}

	#indicatif{
		width:8%;
		margin:0;		
	}
	.large{
		width:55%;
		margin:0;		
	}
	.standard{
		width:35%;
		margin:0;		
	}
	.etroit{
		width:25%;
		margin:0;
	}
	.submit{
		font-size: 1.2rem;
	}
	
	
}

@media all and (min-width:1700px) and (max-width:1799px) {

	.formtexte{
		width: 40%;
		margin: 0;
		float: left;
	}
	.formtexte h4, .formtexte h3{
		text-align: right;
		padding-top : 0.1rem;
	}
	.forminput{
		width: 60%;
		margin: 0; 
		float: left;
	}
	.forminput h4, .forminput h3{
		text-align: left;
		margin: 0;
		padding: 0;
	}

	#indicatif{
		width:8%;
		margin:0;		
	}
	.large{
		width:55%;
		margin:0;		
	}
	.standard{
		width:35%;
		margin:0;		
	}
	.etroit{
		width:25%;
		margin:0;
	}
	.submit{
		font-size: 1.2rem;
	}
	
}

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

	.formtexte{
		width: 40%;
		margin: 0;
		float: left;
	}
	.formtexte h4, .formtexte h3{
		text-align: right;
		padding-top : 0.1rem;
	}
	.forminput{
		width: 60%;
		margin: 0; 
		float: left;
	}
	.forminput h4, .forminput h3{
		text-align: left;
		margin: 0;
		padding: 0;
	}

	#indicatif{
		width:8%;
		margin:0;		
	}
	.large{
		width:55%;
		margin:0;		
	}
	.standard{
		width:35%;
		margin:0;		
	}
	.etroit{
		width:25%;
		margin:0;
	}
	.submit{
		font-size: 1.2rem;
	}
	
}