article{
	height: auto;
	padding-bottom: 40px;
}

article.empty{
	height: 100%;
}

.hero{
	height: 50%;
	background-image: url(../img/contact_hero.jpg);
	background-size: cover;
	background-position: 50%;

	border-left:30px solid white;
	border-right:30px solid white;
}

hr{
	background-color:gray;
}

.box{
	margin-top: -150px;
	padding-bottom: 2em;
	width:60%;
}

@media screen and (max-width:1024px) {
	.box{
		width:90%;
	}
}



/**/

fieldset{
	display:block;
	border:0;
	padding:0;
	margin:0;
	margin-bottom:1em;
	text-align: left;
	font-size:16px;
}

fieldset:last-child{
	margin: 0;
}

legend{
	display: inline-block;
	margin-bottom: 0.3em;
}

label[for]{
	margin-left: 0.5em;
	margin-right: 0.5em;
	vertical-align: middle;
}

input[type='text'], input[type="email"], textarea{
	border:0;
	margin:0;
	background:#EFEFEF;
	color:black;
	border:0;
	width:100%;
	padding:0.7em;
	font-size:14px;
	font-family: inherit;
	border-radius: 0;
}

select{
	font-size:14px;
	background: #EFEFEF;
	padding: 0.5em;
	-webkit-appearance:none;
	appearance:none;
	border-radius: 0;
}

.contact input::-moz-placeholder{
	color:#7E7E7E;
}

.contact ::-webkit-input-placeholder{
	color:#7E7E7E;
}

.civilite input[type=radio] {
	display: inline-block;
    opacity: 0;
    margin-right: -1.3em;
}

.civilite label[for]{
	position: relative;
	padding-left: 1.6em;
	padding-right: 0.4em;
	display: inline-block;
}

.civilite label[for]::before {
    content: "";
    display: block;
 
    width: 16px;
    height: 16px;

    border-radius: 300px;
 
    position: absolute;
    left: 0;
    top: 0;
    background-color: gainsboro;
}

.civilite input[type=radio]:checked + label::after {
    content: "";
    position: absolute;
    display: block;
    background: black;
    width: 8px;
    height: 8px;
    border-radius: 300px;
    top:4px;
    left:4px;
}

input[type="checkbox"]
{
	margin:0;
	vertical-align: middle;
}

input[type="submit"]
{
	background:white;
  	cursor: pointer;
}

input[type="submit"]:hover
{
	
}

textarea{
	height:10em;
}

select{
	width: 100%;
	display: block;
	margin: 1em 0;
}

#fnom, #fprenom, #fcodepostal, #fville, #ftel, #fnaissance{
	width:49%;
	display:inline-block;
}

#fnom{
	width:50%;
	margin-right:1%;
}
#fprenom{
	width:49%;
	margin:0;
}

#fcodepostal{
	width:25%;
	margin-right:1%;
}

#fville{
	width:74%;
	margin:0;
}

#ftel, #femail, #fnaissance{
	width:36%;
	margin-right:1%;
	display:inline-block;
}

#femail{
	width:49%;
}

#fnaissance{
	width:50%;
	margin:0;
}

.cnil{
	font-size:12px;
	margin: 1em auto;
	line-height: 1.5em;
	color:gray;
}

.cnil a{
	color:black;
}

.cnil a:hover{
	text-decoration: none;
}

fieldset.submit{
	text-align: center;
}

#anomalieHelper{
	display: none;
}

.rgpd p{
	color: gray;
    max-width: 660px;
    width: 100%;
    font-size:0.8em;
    line-height: 1.4em;
	max-width: unset !important;
}

p { 
	width: 100%;
}