#sp-contact {
	padding: 230px 0 0 0;
	position: relative;
	z-index: 0
}
#sp-contact > .centrage {
	position: static;
	z-index: 10;
	margin: 0 auto 30px auto;
	padding: 0 0 65px 0;
	position: relative;
	z-index: 10
}
#interieur {
	padding: 30px;
	max-width: 1200px
}
#entete {
	position: relative;
	height: 470px;
	padding: 145px 0 0 0;
	background: url(images/entete.jpg) center center no-repeat;
	background-size: cover;
	z-index: -1
}
#sp_stages {
	padding: 0 0 35px 0;
	min-height: 650px
}
#entete:before, #entete:after {
	position: absolute;
	content: '';
	display: block;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: rgb(5 2 39 / 58%)
}
#entete:after {
	background-size: 102% auto;
	z-index: 2;
	bottom: -1px
}
.cartouche {
	position: relative;
	z-index: 12;
	color: #fff;
	text-align: center
}
#entete h1 {
	position: relative;
	margin: 12px auto;
	padding: 0 0 14px 0;
	text-align: center;
	font-size: 21px;
	text-transform: uppercase;
	text-align: center
}
#entete h1:after {
	content: '';
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	width: 80px;
	height: 1px;
	margin: auto;
	background: orange
}
.cartouche .nouvelle a {
	color: #fff
}
#intro {
	font-weight: 600;
	margin: 81px 0 18px 0;
	color: var(--main)
}
#message-retour {
	padding: 12px 12px 12px 16px;
	background: #0cb900;
	color: #fff;
	border-radius: 30px;
}
#message-retour.erreur {
	background: red
}
.champ {
	margin: 15px 0
}
label {
	display: inline-block;
	font-weight: 600;
	font-size: 11px;
	color: #01011b
}
label span {
	color: red
}
.champ input, .champ textarea {
	display: block;
	width: 100%;
	padding: 9px 0 11px 16px;
	border: 1px solid #d6d1ec;
	border-radius: 21px;
	font-size: 16px
}
.champ input:focus, .champ textarea:focus {
	outline: 0;
	box-shadow: 0 0 0 0.5px #b2b2ff
}
#envoyer {
	width: 100%;
	background: #489bcf;
	border: 0;
	color: #fff;
	padding: 15px;
	font-size: 15px;
	font-family: 'Poppins', sans-serif;
	border-radius: 41px
}
#envoyer:hover {
	background: var(--main);
	color: #fff;
	transition: all 0.5s ease-out
}
.validation p {
	font-size: 12px;
	margin: 12px 0
}
.custom-select {
	position: relative;
	font-family: Arial
}
.custom-select select {
	display: none
}
.select-selected {
	background-color: #489bcf;
	border-radius: 20px
}
.select-selected:after {
	position: absolute;
	content: "";
	top: 14px;
	right: 10px;
	width: 0;
	height: 0;
	border: 6px solid transparent;
	border-color: #fff transparent transparent transparent
}
.select-selected.select-arrow-active:after {
	border-color: transparent transparent #fff transparent;
	top: 7px
}
.select-items div,.select-selected {
	color: #1e90ff;
	padding: 8px 16px;
	border: 1px solid transparent;
	border-color: transparent transparent rgba(0, 0, 0, 0.1) transparent;
	cursor: pointer
}
.select-selected {
	color: #fff
}
.select-items {
	color: #fff;
	position: absolute;
	background-color: white;
	top: 100%;
	left: 0;
	right: 0;
	z-index: 99;
	border-left: 1px solid #dfe6ec;
	border-right: 1px solid #d6d9dc
}
.select-hide {
	display: none
}
.select-items div:hover, .same-as-selected {
	background-color: rgba(0, 0, 0, 0.1)
}

@media (max-width: 1500px) {
	#sp-contact {
		padding: 205px 0 0 0
	}
}

@media (max-width: 1200px) {
	#sp-contact {
		padding: 146px 0 0 0
	}
}

@media (max-width: 992px) {
	#sp-contact {
		padding: 165px 0 0 0
	}
}

@media (max-width: 576px) {
	#sp-contact {
		padding: 106px 0 0 0
	}
}
