body {
  margin: 0;
  font-family: 'Questrial', sans-serif;

}
*,*:before,*:after {box-sizing:inherit;margin:0; padding:0; border:0 none; position: relative;transition-property: all;
  transition-duration: .6s;
  transition-timing-function: ease;}
html {
    background: #efefef;
    box-sizing:border-box;
    font-family: 'Questrial', sans-serif;

    color: #000;
}
nav {
		background: #efefef;
    display: flex;
    height: 100%;
    justify-content: center;
    text-align: center;
    width: 100%;
	height:10vh;
}
nav a {
    text-decoration: none;
    letter-spacing: 0px;
	font-size: calc(1vmin + 1.5vmax);
	color: #313A3D;
	margin:auto;
    width: 100%;
}

nav .sel:hover,
nav .sel:active {
  letter-spacing: 5px;
}

nav .sel:after {
  backface-visibility: hidden;
  border-bottom: 2px solid rgba(255, 255, 255, 0);
  bottom: 0px;
  content: " ";
  display: block;
  margin: 0 auto;
  position: relative;
  transition: all 280ms ease-in-out;
  width: 0;
}

nav .sel:hover:after {
  backface-visibility: hidden;
  border-color: #313A3D;
  transition: width 350ms ease-in-out;
  width: 70%;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
body {
  background: #efefef;
  font-size: 62.5%;
  font-family: 'Questrial', sans-serif;
  margin-bottom:120px;
  font-weight: 300;
  color: #B6B6B6;
}
body section {
  background: white;
  margin: 5vh auto 0px;
  border-top: 15px solid #313A3D;
  text-align: center;
  padding: 5vh 0 10vh;
  width: 80%;
  max-width: 1100px;
}
body section h1 {
  margin-bottom: 40px;
  font-size: 4em;
  text-transform: uppercase;
  font-family: 'Questrial', sans-serif;
  font-weight: 100;
}

form {
  width: 58.3333333333%;
  margin: 0 auto;
}
form .field {
  width: 100%;
  position: relative;
  margin-bottom: 15px;
}
form .field label {
  position: absolute;
  top: 0;
  left: 0;
  background: #313A3D;
  width: 100%;
  padding: 18px 0;
  font-size: 1.45em;
  letter-spacing: 0.075em;
  -webkit-transition: all 333ms ease-in-out;
  -moz-transition: all 333ms ease-in-out;
  -o-transition: all 333ms ease-in-out;
  -ms-transition: all 333ms ease-in-out;
  transition: all 333ms ease-in-out;
}
form .field label + span {
	
  opacity: 0;
  color: white;
  display: block;
  position: absolute;
  top: 0;
  padding: 18px 0;
  width:18%;
  left: 0;
  font-size: 1.45em;
  letter-spacing: 0.075em;
  -webkit-transition: all 333ms ease-in-out;
  -moz-transition: all 333ms ease-in-out;
  -o-transition: all 333ms ease-in-out;
  -ms-transition: all 333ms ease-in-out;
  transition: all 333ms ease-in-out;
}
form .field input[type="text"],
form .field textarea {
font-family:"Questrial";
  border: none;
  background: #E8E9EA;
  width: 80.5%;
  margin: 0;
  padding: 18px 0;
  padding-left: 19.5%;
  color: #313A3D;
  font-size: 1.4em;
  letter-spacing: 0.05em;
}
form .field input[type="text"]#msg,
form .field textarea#msg {
  height: 18px;
  resize: none;
  -webkit-transition: all 333ms ease-in-out;
  -moz-transition: all 333ms ease-in-out;
  -o-transition: all 333ms ease-in-out;
  -ms-transition: all 333ms ease-in-out;
  transition: all 333ms ease-in-out;
}
@-moz-document url-prefix() {
    textarea#msg {
        height: 0% !important;

    }
	form .field label {
  padding: 20px 0 !important;
	}
}
form .field input[type="text"]:focus, form .field input[type="text"].focused,
form .field textarea:focus,
form .field textarea.focused {
  outline: none;
}
form .field input[type="text"]:focus#msg, form .field input[type="text"].focused#msg,
form .field textarea:focus#msg,
form .field textarea.focused#msg {
  padding-bottom: 150px;
}
form .field input[type="text"]:focus + label, form .field input[type="text"].focused + label,
form .field textarea:focus + label,
form .field textarea.focused + label {
  width: 18%;
  background: #313A3D;
  color: white;
}
form .field input[type="text"].focused + label,
form .field textarea.focused + label {
  color: #313A3D;
}
form .field:hover label {
  width: 18%;
  background: #313A3D;
  color: white;
}
form input[type="submit"] {
  background: #FD9638;
  color: white;
  -webkit-appearance: none;
  border: none;
  position: relative;
  padding: 13px 50px;
  font-size: 1.4em;
  letter-spacing: 0.1em;
  font-family: 'Questrial', sans-serif;
  font-weight: 300;
  -webkit-transition: all 333ms ease-in-out;
  -moz-transition: all 333ms ease-in-out;
  -o-transition: all 333ms ease-in-out;
  -ms-transition: all 333ms ease-in-out;
  transition: all 333ms ease-in-out;
}
form input[type="submit"]:hover {
  background: #313A3D;
  color: #FD9638;
}
form input[type="submit"]:focus {
  outline: none;
  background: #cd6302;
}

.centrer>img
{
  /*
  Bounce 
  -webkit-animation: loader 2.5s infinite cubic-bezier(0.5, -0.5, 0.75, 1.25);
  */
  margin: 50px 0;
  display: block;
  width: 147px;
  height: 116px;
}

.centrer {
  width: 100%;
  height: 100vh;
  Position:fixed;
  z-index:100;
  display:flex;
  background: #fff;
  justify-content:center;
  align-items:center;
}