@import url(https://fonts.googleapis.com/css?family=Montserrat:300,400,500,600,700);
/* CSS RESET. standardizes cross-browser rendering on common elements, neutralizing browsers' built-in stylesheets. */
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td, iframe {
  margin: 0;
  padding: 0; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

fieldset, img {
  border: 0; }

address, caption, cite, code, dfn, em, strong, th, var {
  font-style: normal; }

ol, ul {
  list-style: none; }

caption, th {
  text-align: left; }

h1, h2, h3, h4, h5, h6 {
  font-size: 100%;
  font-weight: normal; }

q:before, q:after {
  content: ""; }

abbr, acronym {
  border: 0; }

a, img a {
  border: 0 none;
  margin: 0;
  padding: 0; }

/* End RESET. */
body {
  -webkit-text-appearance: 100%;
  color: #38575e;
  font-family: "Montserrat", sans-serif;
  font-size: 14px;
  line-height: 1.25;
  text-align: center; }
  body a {
    text-decoration: none; }
    body a[href^=tel] {
      color: inherit; }
  body.es #lang-chooser .en {
    display: none !important; }
  body.en #lang-chooser .es {
    display: none !important; }
  body.en .es {
    display: none; }
  body header {
    transition: all 0.25s ease;
    -moz-transition: all 0.25s ease;
    -webkit-transition: all 0.25s ease;
    -o-transition: all 0.25s ease;
    font-size: 12px;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1; }
    body header.darken {
      background: rgba(56, 87, 94, 0.8); }
    body header a {
      transition: all 0.2s;
      -moz-transition: all 0.2s;
      -webkit-transition: all 0.2s;
      -o-transition: all 0.2s;
      color: white;
      display: inline-block; }
    body header nav a {
      margin: 20px 30px;
      text-transform: uppercase; }
      body header nav a:hover {
        opacity: 0.75; }
      body header nav a.home {
        background: url(../images/home.svg) no-repeat center center;
        background-size: 16px 16px;
        height: 16px;
        text-indent: -30000px;
        width: 20px; }
      @media (max-width: 600px) {
        body header nav a {
          margin: 20px 15px; } }
      @media (max-width: 710px) {
        body header nav a:not(.home) {
          display: none; } }
  body ul#lang-chooser {
    background: rgba(56, 87, 94, 0.8);
    border-radius: 15px;
    border: 2px solid rgba(255, 255, 255, 0.5);
    overflow: hidden;
    position: absolute;
    right: 20px;
    top: 14px; }
    body ul#lang-chooser li {
      cursor: pointer;
      text-align: left; }
      body ul#lang-chooser li.active a:after {
        content: url("../images/angle-down.svg");
        display: inline-block;
        height: 6px;
        margin-left: 5px;
        margin-top: -1px;
        vertical-align: top;
        width: 9px; }
      body ul#lang-chooser li a {
        display: block;
        padding: 5px 10px; }
      body ul#lang-chooser li:hover a {
        background: rgba(255, 255, 255, 0.25); }
    body ul#lang-chooser.closed {
      background: transparent; }
      body ul#lang-chooser.closed li a {
        pointer-events: none; }
      body ul#lang-chooser.closed li:not(.active) {
        display: none; }
  body .wrapper {
    margin: 0 auto;
    max-width: 1200px;
    position: relative; }
  body #hero {
    background: #42555C url(../images/hero.jpg) no-repeat center center;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -moz-box-sizing: border-box;
    background-size: cover;
    color: white;
    height: 600px;
    padding: 0;
    position: relative; }
    body #hero .text {
      top: 50%;
      -webkit-transform: translateY(-50%);
      transform: translateY(-50%);
      position: absolute;
      width: 100%; }
    body #hero h1 {
      font-size: 30px;
      font-weight: 300;
      margin: 0 auto;
      max-width: 875px;
      padding: 0 20px; }
      body #hero h1 strong {
        -moz-osx-font-smoothing: grayscale;
        -webkit-font-smoothing: antialiased; }
    @media (max-width: 900px) {
      body #hero {
        height: 500px; }
        body #hero h1 {
          font-size: 26px; } }
    @media (max-width: 767px) {
      body #hero {
        height: 400px; }
        body #hero h1 {
          font-size: 22px; } }
  body section {
    padding: 80px 0; }
    body section h2 {
      font-size: 24px;
      font-weight: 600;
      margin-bottom: 70px;
      letter-spacing: 0.5px;
      text-transform: uppercase; }
    @media (max-width: 767px) {
      body section {
        padding: 50px 20px; }
        body section h2 {
          font-size: 20px;
          margin-bottom: 35px; } }

#why {
  background: #f1f2f2; }
  #why ul li {
    color: #6c888e;
    font-weight: 300;
    font-size: 20px;
    margin-bottom: 30px; }
    #why ul li:before {
      content: url("../images/checkmark_blue.svg");
      width: 30px;
      display: inline-block;
      vertical-align: middle;
      height: 34px;
      margin: -5px 20px 5px 0; }
    #why ul li:nth-child(2) {
      color: #86b2a4; }
      #why ul li:nth-child(2):before {
        content: url("../images/checkmark_green.svg"); }
    #why ul li:last-child {
      color: #8b83a5;
      margin-bottom: 0; }
      #why ul li:last-child:before {
        content: url("../images/checkmark_violet.svg"); }
    @media (max-width: 600px) {
      #why ul li:before {
        display: block;
        margin: 0 auto 15px; } }

#contact ul li {
  color: #808285;
  display: inline-block;
  font-weight: 300;
  padding: 0 60px; }
  #contact ul li:first-child {
    padding-left: 0; }
  #contact ul li:last-child {
    padding-right: 0; }
  @media (max-width: 920px) {
    #contact ul li {
      padding: 0 40px; } }
  @media (max-width: 830px) {
    #contact ul li {
      padding: 0 25px; } }
  @media (max-width: 767px) {
    #contact ul li {
      display: block;
      margin: 0 auto;
      max-width: 240px;
      padding: 20px !important;
      text-align: left; } }
#contact .icon, #contact span {
  display: inline-block;
  vertical-align: middle; }
#contact .icon {
  background: rgba(139, 131, 165, 0.5) url("../images/icon-location.svg") no-repeat center center;
  background-size: 64px 64px;
  border-radius: 50%;
  margin-right: 12px;
  height: 64px;
  width: 64px; }
  #contact .icon.phone {
    background-color: rgba(108, 136, 142, 0.5);
    background-image: url("../images/icon-phone.svg"); }
  #contact .icon.mail {
    background-color: rgba(134, 178, 164, 0.5);
    background-image: url("../images/icon-mail.svg"); }
#contact span {
  text-align: left; }
#contact a {
  color: #808285; }
  #contact a:hover {
    text-decoration: underline; }

#encuesta {
  border-bottom: 1px solid #f1f2f2; }

footer {
  font-size: 12px;
  font-weight: 300;
  padding: 20px; }