/* Text Elements */

h3 {
  color: #db9c64;
  font-family: 'Forum', 'Book Antiqua', Palatino, 'Palatino Linotype', 'Palatino LT STD', Georgia, serif;
}

p.paragraph {
  color: #383838;
  font-weight: 400;
  font-size: 16px;
  font-family: 'Gill Sans', 'Gill Sans MT', Calibri, sans-serif;
}

p.paragraph.left-area-p {
  margin-right: 20px;
  margin-bottom: 10px;
  margin-left: 10px;
  max-width: 200px;
  color: rgba(67, 40, 12, .71);
  font-size: 14px;
}

p.paragraph.paragraph-1 {
  color: #383838;
}

span.text-element.label {
  padding-left: 0;
  text-transform: uppercase;
  font-size: 11px;
}

span.text-element {
  background-color: transparent;
  color: #378836;
  font-size: 15px;
  font-family: 'Gill Sans', 'Gill Sans MT', Calibri, sans-serif;
}

/* Interaction Elements */

form.form-container.form-cont {
  display: -webkit-box;
  display: -webkit-flex;
  display:    -moz-box;
  display: -ms-flexbox;
  display:         flex;
  -ms-flex-pack: center;
  -ms-flex-align: center;
  padding: 30px;
  min-height: 100vh;
  width: 100%;
  background-image: url('../plan-Koolhaas.jpg');
  background-attachment: scroll;
  background-position: center center;
  background-clip: border-box;
  background-origin: padding-box;
  background-size: cover;
  background-repeat: no-repeat;

  background-blend-mode: normal;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
     -moz-box-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
     -moz-box-align: center;
          align-items: center;
}

input[type=text] {
  border-style: none;
  border-radius: 5px;
  background-color: #f2f2f2;
  box-shadow: none;
  color: #383838;
  font-size: 15px;
  font-family: 'Gill Sans', 'Gill Sans MT', Calibri, sans-serif;
}

input[type=text]:focus {
  border-style: none;
}

input[type=email] {
  border-style: none;
  border-radius: 5px;
  background-color: #f2f2f2;
  box-shadow: none;
  color: #383838;
  font-size: 15px;
  font-family: 'Gill Sans', 'Gill Sans MT', Calibri, sans-serif;
}

input[type=email]:focus {
  border-style: none;
}

textarea {
  min-height: 100px;
  border-style: none;
  border-radius: 5px;
  background-color: #f2f2f2;
  box-shadow: none;
  color: #383838;
  font-size: 15px;
  font-family: 'Gill Sans', 'Gill Sans MT', Calibri, sans-serif;
}

textarea:focus {
  border-style: none;
}

/* Layout Elements */

body.body-1 {
  margin-right: 10px;
  margin-left: 10px;
  box-shadow: none;
}

.container.form {
  display: -webkit-box;
  display: -webkit-flex;
  display:    -moz-box;
  display: -ms-flexbox;
  display:         flex;
  -ms-flex-align: start;
  background-color: transparent;
  box-shadow: none;

  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
     -moz-box-align: start;
          align-items: flex-start;
}

.container.form-left-area {
  display: -webkit-box;
  display: -webkit-flex;
  display:    -moz-box;
  display: -ms-flexbox;
  display:         flex;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
  -ms-flex-pack: justify;
  margin-bottom: -10px;
  padding: 20px 10px 150px;
  width: 100%;
  border-radius: 5px;
  background-color: #e0ddb4;
  background-image: url('../santeliastation.JPG');
  background-attachment: scroll;
  background-position: center center;
  background-clip: border-box;
  background-origin: padding-box;
  background-size: cover;
  background-repeat: no-repeat;
  box-shadow: #000 -20px 40px 50px -25px;
  -webkit-transform: translateX(0px);
     -moz-transform: translateX(0px);
       -o-transform: translateX(0px);
          transform: translateX(0px);

  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
     -moz-box-orient: vertical;
     -moz-box-direction: normal;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
     -moz-box-pack: justify;
          justify-content: space-between;
  background-blend-mode: multiply;
}

.container.form-right-area {
  margin-top: -20px;
  padding: 30px;
  width: 100%;
  border-radius: 5px;
  background-color: transparent;
  background-image: url('../white-frame.png');
  background-attachment: scroll;
  background-position: center top;
  background-clip: border-box;
  background-origin: padding-box;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  box-shadow: none;
  -webkit-transform: translateX(0px);
     -moz-transform: translateX(0px);
       -o-transform: translateX(0px);
          transform: translateX(0px);

  -webkit-box-flex: 1;
  -webkit-flex: 1;
     -moz-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  background-blend-mode: normal;
}

button.send-button {
  display: block;
  margin-top: 20px;
  margin-left: auto;
  padding: 15px 30px;
  border-radius: 5px;
  background-color: #efc29a;
  color: #6f4632;
  font-family: 'Gill Sans', 'Gill Sans MT', Calibri, sans-serif;
}

button.button.send-button {
  -webkit-transition-delay: .05s;
     -moz-transition-delay: .05s;
       -o-transition-delay: .05s;
          transition-delay: .05s;
  -webkit-transition-timing-function: ease-out;
     -moz-transition-timing-function: ease-out;
       -o-transition-timing-function: ease-out;
          transition-timing-function: ease-out;
  -webkit-transition-duration: .1s;
     -moz-transition-duration: .1s;
       -o-transition-duration: .1s;
          transition-duration: .1s;
  -webkit-transition-property: background-color;
     -moz-transition-property: background-color;
       -o-transition-property: background-color;
          transition-property: background-color;
}

button.send-button:hover {
  background-color: #efc29a;
  color: #6f4632;
}

button.button.send-button:hover {
  background-color: #e09c5e;
}

@media screen and (min-width: 40rem) {
  /* Text Elements */

  p.paragraph.left-area-p {
    max-width: none;
  }

  /* Interaction Elements */

  form.form-container.form-cont {
    background-image: url('../plan-Koolhaas.jpg');
  }

  /* Layout Elements */

  .container.form-left-area {
    margin-right: 0;
    padding-bottom: 200px;
    width: 200px;
    -webkit-transform: translateX(10px);
       -moz-transform: translateX(10px);
         -o-transform: translateX(10px);
            transform: translateX(10px);
  }

  .container.form-right-area {
    margin-top: 50px;
    margin-left: 0;
    -webkit-transform: translateX(-10px);
       -moz-transform: translateX(-10px);
         -o-transform: translateX(-10px);
            transform: translateX(-10px);
  }
}

@media screen and (min-width: 64rem) {
  /* Interaction Elements */

  form.form-container.form-cont {
    background-image: url('../plan-Koolhaas.jpg');
  }

  /* Layout Elements */

  .container.form-left-area {
    background-image: url('../santeliastation.JPG');
  }

  input[type=url].url-field-1 {
    background-color: #73fffd;
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, sans-serif;
  }
}