@charset "utf-8";
@font-face {
font-family: 'quadranta';
src: url('quadranta.eot');
src: url('quadranta.otf') format('truetype'),
     url('quadranta.woff') format('woff'),
     url('quadranta.eot?#iefix') format('embedded-opentype'),
     url('quadranta.svg#QuadrantaBold') format('svg');
font-weight: normal;
font-style: normal;
}

/* erreur IE */
html {font-size: 100%; margin: 0; padding: 0;}	

/* class */

.float_left {float:left;}
.float_right {float:right;}
.anti_float {clear:both;}
.txtcenter {text-align: center;}
.transition { -webkit-transition: all 0.2s linear;
              -moz-transition: all 0.2s linear;
              -o-transition: all 0.2s linear;
               transition: all 0.2s linear; }
.decotxt {font-style: italic; text-decoration: underline;}
.none {display: none;}

/* Base */
h1, h2, h3, h4, h5, h6, p {
	margin-top: 0;	 
	padding-right: 15px;
	padding-left: 15px; 
}
body {
	 margin: 0; padding: 0;
	font-family: 'Ubuntu', sans-serif;
	background-color: #fff;
	color: black;
}
header, section, footer, aside, nav, article, figure {
	display: block;
}
a img { 
	border: none;
}
#content {
	width: 100%;
	max-width:1000px;
	margin:0 auto;
}

/* Header */
header {
	width: 100%;
	background-color: #f00;
	height: 190px;
	margin: 50px 0;
}
p#logo {
background-image : url(../img/logo.png);
position : relative;
background-repeat : no-repeat;
background-position : center top;
text-indent : -900000px;
display : block;
height : 220px;
width : 220px;
margin : 0 auto;
top: -15px;
}

/* Article */
article {width: 100%;}

/* content */
#content p {text-align: center;}
#info {font-weight: bold;
	font-size: larger;}

/* formulaire */
#formulairecontact {float: left;width: 50%;}
form {width: 100%;}
input {width: 90%; border-radius: 5px; border: groove 2px grey; height: 25px; text-align: center;}
textarea {display: block; border: groove 2px grey;
border-radius: 5px; width: 90%; padding: 8px; margin: 15px auto;}
form p {width: 90%; padding: 8px 0;
		margin: 0 auto;}
#errornom {display: none;}
#errormail {display: none;}
#errormessage {display: none;}
#envoyer {width: auto; margin: 0 auto; display: block;}
.error {color: red;}
#confirmation {color: green;height: 40px;display: block;display: none;}
#penvoi {overflow: hidden; height: 25px;}

/* informations */
#informations {float: left;width: 50%;}
a#supportdist {background-image : url(../img/supportdistance.png);
background-repeat : no-repeat;
background-position : center top;
text-indent : -900000px;
display : block;
height : 80px;
width : 233px;
margin : 15px auto;
margin-bottom: 25px}
.coordonnees {font: italic bold 18px Ubuntu, sans-serif;}
#informations iframe {border: dotted grey 2px; display: block; margin: 0 auto;}

/* Footer */
#separation {display: block;padding: 25px;}
footer {width: 100%; height: 90px; background-color: black; color: white; text-align: center;}
#decobas {width: 100%; height: 10px; background-color: red;}
footer a {color: white; font-style: italic; text-decoration: none;}
footer a:hover, footer a:focus {
 text-decoration: underline;
}

footer p {margin: 5px auto;}

/* Responsive */
@media only screen and (max-width:980px) {
	#informations {width: 100%; float: none;}
	#formulairecontact {width: 100%; float: none;}
}