@charset "UTF-8";

/* Couleurs utilitaires */
.rouge { color: #e20613; }
.bleu { color: #5cc6d0; }
.vert { color: #D1CA00; }
.gris { color: #606060; }
.fond { color: #EAE5E5; }

/* Corps de page */
body {
	margin: 0;
	font-family: Helvetica, Arial, sans-serif;
	width: 100%;
	background-color: #EAE5E5;
	background: url(bgimg.jpg) no-repeat center center fixed;
	background-size: cover;
}

/* Conteneur principal */
#conteneur {
	position: relative;
	width: 100%;
	min-height: 100%;
	background-color: white;
}

/* Boîte centrale */
.contenugeneral {
	width: 900px;
	max-width: 95%;
	margin: 30px auto 0 auto;
	border: 1px solid #606060;
	background-color: white;
	padding-bottom: 40px;
}

/* Bannière */
.banner {
	width: 100%;
	height: auto;
}

/* Texte descriptif */
.descriptif {
	font-size: 1.1em;
	font-weight: bold;
	border-bottom: 1px solid #606060;
	padding: 40px;
}

.descriptif a {
	color: #e20613;
	text-decoration: none;
}

/* Message de confirmation */
.final {
	color: #e20613;
	font-size: 28px;
	font-weight: bold;
	padding: 40px;
	text-align: center;
}

/* Formulaire */
.formu {
	padding: 40px;
}

/* Titres de champs */
.titre-form {
	font-size: 22px;
	font-weight: bold;
	color: #e20613;
	margin-top: 20px;
	display: block;
	text-transform: uppercase;
}

/* Champ de saisie */
input.champ,
select.laselectionbureau {
	width: 100%;
	height: 70px;
	padding: 20px;
	margin-top: 8px;
	margin-bottom: 28px;
	font-size: 24px;
	color: #333;
	border: 2px solid #e20613;
	border-radius: 8px;
	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
	background-color: #fffdfd;
	box-sizing: border-box;
	transition: all 0.3s ease;
}

input.champ:focus,
select.laselectionbureau:focus {
	border-color: #a0000c;
	background-color: #fff9f9;
	box-shadow: 0 0 10px #e20613;
	outline: none;
}

/* Bouton */
input.button {
	margin-top: 20px;
	width: 100%;
	background-color: white;
	color: #e20613;
	font-size: 20px;
	font-weight: bold;
	padding: 25px;
	cursor: pointer;
	border: 2px solid #e20613;
	border-radius: 8px;
	text-transform: uppercase;
	transition: all 0.3s ease;
}

input.button:hover {
	background-color: #e20613;
	color: white;
}

/* Checkbox */
.caseacocher {
	font-size: 16px;
	margin-top: 20px;
}

.caseacocher label {
	color: #e20613;
	font-weight: bold;
}

/* Messages */
.error {
	background-color: #f06277;
	color: #fff;
	font-size: 16px;
	padding: 20px;
	margin: 20px;
	border-radius: 6px;
}

.messagesucces {
	color: #fff;
	border: 1px solid #EAE5E5;
	font-size: 16px;
	padding: 20px;
	margin-bottom: 20px;
	background-color: #5cc6d0;
	border-radius: 6px;
}

.messagesucces a {
	color: #fff;
	text-decoration: underline;
}

/* Pied de page */
.small {
	font-size: 10px;
	display: block;
	text-align: center;
	margin-top: 40px;
}

/* Responsive pour mobile */
@media screen and (max-width: 600px) {
	.contenugeneral {
		width: 95%;
		padding: 20px;
	}

	.titre-form {
		font-size: 26px;
	}

	input.champ,
	select.laselectionbureau,
	input.button {
		height: 80px;
		font-size: 26px;
		padding: 22px;
		border-width: 3px;
	}

	.caseacocher {
		font-size: 20px;
	}
}