* {
	margin:0;
	padding:0;
	box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-font-smoothing:antialiased;
	-moz-font-smoothing:antialiased;
	-o-font-smoothing:antialiased;
	font-smoothing:antialiased;
	text-rendering:optimizeLegibility;
}

/* Page contact */

#contactpage{
    width: auto;
    height: 900px;
    margin: auto;
}

#contactcontainer{
    width: 1200px;
    height: 800px;
    margin: auto;
    background-color: #4674ca;
    border-radius: 20px;
    margin-top: 60px;
    box-shadow: 5px 5px 30px black;
}

#formquestion{
    position: relative;
    display: flex;
    justify-content: space-evenly;
    margin: auto;
    width: auto;
}

/* Section adresse/page web/courriel */

#formcontact{
    max-width:550px;
	width:auto;
	margin:0 auto;
	position:relative;
    margin-top: -800px;
    position: relative;
    margin-left: 200px;
    display: block;
}

#formtitre{
    font-size: 65px;
    color: white;
    margin: auto;
    width: auto;
    position: relative;
    text-align: center;
}

#formadresse{
    display: flex;
    position: relative;
    padding: 10px 0px;
    font-size: 18px;
    color: white;
}

#formadresse img{
    width: 35px;
    height: 50px;
    margin: auto;
    margin-right: 40px;
    margin-left: 8px;
}

#formnumero{
    display: flex;
    position: relative;
    padding: 10px 0px;
    font-size: 18px;
    color: white;
}

#formnumero img{
    width: 50px;
    height: 50px;
    margin: auto;
    margin-right: 30px;
}

#formcourriel{
    display: flex;
    position: relative;
    padding: 10px 0px;
    font-size: 18px;
    color: white;
}

#formcourriel img{
    width: 50px;
    height: 50px;
    margin: auto;
    margin-right: 30px;
}

#formcourriel a{
    color: white;
    font-size: 20px;
}

#formpageweb{
    display: flex;
    position: relative;
    padding: 10px 0px;
    font-size: 18px;
    color: white;
}

#formpageweb img{
    width: 50px;
    height: 50px;
    margin: auto;
    margin-right: 30px;
}

#formpageweb a{
    color: #02aff3;
    font-size: 25px;
}

#formfacebook{
    display: block;
    position: relative;
    padding: 10px 0px;
    font-size: 18px;
    color: white;
}

#formfacebook img{
    width: 70px;
    height: 70px;
    margin: auto;
    margin-left: 220px;
}

#formfacebook a{
    color: #02aff3;
    font-size: 25px;
    margin-left: 25px;
}

#forminstagram{
    display: block;
    position: relative;
    padding: 10px 0px;
    font-size: 18px;
    color: white;
}

#forminstagram img{
    width: 50px;
    height: 50px;
    margin: auto;
     margin-left: 230px;
}

#forminstagram a{
    color: #02aff3;
    font-size: 25px;
    margin-left: 25px;
}

#formhoraire{
    display: flex;
    position: relative;
    font-size: 18px;
    color: white;
}

#horaire{
    color: #ffff01;
    font-size: 27px;
    text-align: center;
    margin: auto;
    margin-top: 35px;
}

#whiteligne{
    position: relative;
    margin: auto;
    width: 3px;
    height: 745px;
    background-color: white;
    margin-top: -773px; 
}

/* Contact form à droite */

.formcontainer {
	max-width:500px;
	width:100%;
	margin:0 auto;
	position:relative;
    margin-top: -800px;
    margin-right: 200px;
}

#formtitle{
    color: white;
    font-size: 65px;
    text-align: center;
}

label{
    font-size: 20px;
    color: white;
}

#contact input[type="text"], #contact input[type="email"], #contact input[type="tel"], #contact input[type="url"], #contact textarea, #contact button[type="submit"] { font:400 12px/16px 'Sriracha'; }

#contact {
	padding:5px 20px;
}

fieldset {
	border: medium none !important;
	margin: 0 0 10px;
	min-width: 100%;
	padding: 5px;
	width: 100%;
}

#contact input[type="text"], #contact input[type="email"], #contact input[type="tel"], #contact input[type="url"], #contact textarea {
	width:100%;
	border:1px solid #CCC;
	background:#FFF;
	margin:0 0 5px;
	padding:10px;
    font-size: 14px;
}

#contact input[type="text"]:hover, #contact input[type="email"]:hover, #contact input[type="tel"]:hover, #contact input[type="url"]:hover, #contact textarea:hover {
	-webkit-transition:border-color 0.3s ease-in-out;
	-moz-transition:border-color 0.3s ease-in-out;
	transition:border-color 0.3s ease-in-out;
	border:1px solid #AAA;
}

#contact textarea {
	height:100px;
	max-width:100%;
  resize:none;
}

#contact button[type="submit"] {
	cursor:pointer;
	width:100%;
	border:none;
	background:#02aff3;
	color:#FFF;
	margin:0 0 5px;
	padding:12px;
	font-size:25px;
    margin-top: 5px;
}

#contact button[type="submit"]:hover {
	background:#09C;
	-webkit-transition:background 0.3s ease-in-out;
	-moz-transition:background 0.3s ease-in-out;
	transition:background-color 0.3s ease-in-out;
}

#contact button[type="submit"]:active { box-shadow:inset 0 1px 3px rgba(0, 0, 0, 0.5); }

#contact input:focus, #contact textarea:focus {
	outline:0;
	border:1px solid #999;
}
::-webkit-input-placeholder {
 color:#888;
}
:-moz-placeholder {
 color:#888;
}
::-moz-placeholder {
 color:#888;
}
:-ms-input-placeholder {
 color:#888;
}


/* Section google map */

#googlemap{
    width: auto;
    height: 900px;
    margin: auto;
    position: relative;
}

#googlemapcontainer{
    position: relative;
    width: 1200px;
    height: 800px;
    margin: auto;
    background-color: #4674ca;
    border-radius: 20px;
    margin-top: 60px;
    box-shadow: 5px 5px 30px black;
    display: flex;
    justify-content: center;
}

#googlemapcontain{
    position: relative;
    width: auto;
    margin: auto;
    display: block;
 
}

#googlemaptitle{
    font-size: 85px;
    color: white;
    margin: auto;
    margin-top: -820px;
    text-align: center;
}

#googlemapitem{
    position: relative;
    width: 1150px;
    height: 650px;
    display: flex;
    margin: auto;
    margin-top: 0px;
    border-radius: 20px;
}