html, body {
  margin: 0;
  font-size: 17px;
  font-family: 'Lato';
  color: #737270;
  font-weight: lighter; }
  html form, body form {
    font-family: 'Roboto'; }
    html form input, body form input {
      border: none;
      border-bottom: 2px solid #737270;
      background: #fff;
      width: 100%;
      text-align: center; }
    html form input::-webkit-input-placeholder, body form input::-webkit-input-placeholder {
      font-family: 'Roboto';
      text-align: center;
      font-weight: lighter;
      font-size: 1.25em; }
    html form input:-ms-input-placeholder, body form input:-ms-input-placeholder {
      font-family: 'Roboto';
      text-align: center;
      font-weight: lighter;
      font-size: 1.25em; }
    html form input::-ms-input-placeholder, body form input::-ms-input-placeholder {
      font-family: 'Roboto';
      text-align: center;
      font-weight: lighter;
      font-size: 1.25em; }
    html form input::placeholder, body form input::placeholder {
      font-family: 'Roboto';
      text-align: center;
      font-weight: lighter;
      font-size: 1.25em; }
    html form textarea, body form textarea {
      width: 99%; }
  html h3, body h3 {
    font-weight: lighter; }

#home .background {
  width: 100%;
  position: relative; }
  #home .background .back {
    width: 100%; }
  #home .background .content {
    width: 50%;
    margin: 0 25%;
    position: absolute;
    top: 30vh;
    text-align: center; }
    #home .background .content .logo {
      width: 100%; }
    #home .background .content p {
      color: #fff;
      width: 100%;
      text-align: center;
      font-size: 1.25em;
      letter-spacing: 2px;
      padding-top: 1.75em; }
    #home .background .content .first {
      text-transform: uppercase; }

#home .contactanos {
  width: 40%;
  margin: 3em auto;
  text-align: center; }
  #home .contactanos a {
    text-decoration: none;
    color: inherit; }
  #home .contactanos form {
    margin: 2em 0; }
    #home .contactanos form input {
      width: 95%;
      margin-top: 1.5em;
      padding: .5em 1vw .5em 1vw; }
    #home .contactanos form label {
      margin-top: 1.5em;
      margin-bottom: .5em;
      display: inline-block; }
    #home .contactanos form textarea {
      height: 7em;
      border: 2px solid #737270;
      font-family: 'Lato'; }
    #home .contactanos form input[type="submit"] {
      width: 100%;
      border: 2px solid #737270;
      color: #737270;
      font-size: 1em;
      padding: .25em 1vw .25em 1vw; }

footer {
  background-color: rgba(115, 114, 112, 0.2);
  width: 80%;
  padding: .5em 10%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  text-transform: uppercase;
  color: #07507c;
  font-weight: bold;
  font-family: 'Roboto'; }
  footer .imagen, footer .braigo {
    width: 20%; }
    footer .imagen img, footer .braigo img {
      max-width: 110px; }
  footer .braigo {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end; }

@media only screen and (min-device-width: 320px) and (max-device-width: 480px) {
  html, body {
    font-size: 12px; }
  #home .background .content {
    width: 70%;
    margin: 0 15%;
    top: 5vh; }
    #home .background .content p {
      padding-top: 0; }
    #home .background .content .arrow {
      width: 3%; }
  #home .contactanos {
    width: 90%;
    min-height: 60vh; }
    #home .contactanos form input::-webkit-input-placeholder {
      font-size: 1em; }
    #home .contactanos form input:-ms-input-placeholder {
      font-size: 1em; }
    #home .contactanos form input::-ms-input-placeholder {
      font-size: 1em; }
    #home .contactanos form input::placeholder {
      font-size: 1em; }
    #home .contactanos form label {
      font-size: 1.1em; }
  #home footer .imagen {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center; }
    #home footer .imagen img {
      width: 100%; }
  #home footer .braigo a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end; }
  #home footer .braigo img {
    width: 40%; } }

@media only screen and (min-width: 1921px) {
  html, body {
    font-size: 25px; } }

@media only screen and (min-width: 1814px) and (max-width: 1920px) {
  html, body {
    font-size: 20px; } }

@media only screen and (min-width: 1708px) and (max-width: 1813px) {
  html, body {
    font-size: 19px; } }

@media only screen and (min-width: 1601px) and (max-width: 1707px) {
  html, body {
    font-size: 18px; } }

@media only screen and (min-width: 1441px) and (max-width: 1600px) {
  html, body {
    font-size: 17px; } }

@media only screen and (min-width: 1367px) and (max-width: 1440px) {
  html, body {
    font-size: 16px; } }

@media only screen and (min-width: 1281px) and (max-width: 1366px) {
  html, body {
    font-size: 15px; } }

@media only screen and (min-width: 1229px) and (max-width: 1280px) {
  html, body {
    font-size: 14px; } }

@media only screen and (min-width: 1177px) and (max-width: 1228px) {
  html, body {
    font-size: 13px; } }

@media only screen and (min-width: 1125px) and (max-width: 1176px) {
  html, body {
    font-size: 12px; } }

@media only screen and (min-width: 1073px) and (max-width: 1124px) {
  html, body {
    font-size: 11px; } }

@media only screen and (min-width: 1025px) and (max-width: 1072px) {
  html, body {
    font-size: 10px; } }

@media only screen and (min-width: 769px) and (max-width: 1024px) {
  html, body {
    font-size: 16px !important; }
  #home .background .content {
    top: 10vh; }
  #home .contactanos {
    width: 60%; } }
