@charset "UTF-8";
/*
0 - 600px:      Phone
600 - 900px:    Tablet portrait
900 - 1200px:   Tablet landscape
[1200 - 1800] is where our normal styles apply
1800px + :      Big desktop

$breakpoint arguement choices:
- phone
- tab-port
- tab-land
- big-desktop

ORDER: Base + typography > general layout + grid > page layout > components

1em = 16px
*/
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
/* Document
   ========================================================================== */
/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */
html {
  line-height: 1.15;
  /* 1 */
  -webkit-text-size-adjust: 100%;
  /* 2 */ }

/* Sections
   ========================================================================== */
/**
 * Remove the margin in all browsers.
 */
body {
  margin: 0; }

/**
 * Render the `main` element consistently in IE.
 */
main {
  display: block; }

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */
h1 {
  font-size: 2em;
  margin: 0.67em 0; }

/* Grouping content
   ========================================================================== */
/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
  box-sizing: content-box;
  /* 1 */
  height: 0;
  /* 1 */
  overflow: visible;
  /* 2 */ }

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
pre {
  font-family: monospace, monospace;
  /* 1 */
  font-size: 1em;
  /* 2 */ }

/* Text-level semantics
   ========================================================================== */
/**
 * Remove the gray background on active links in IE 10.
 */
a {
  background-color: transparent; }

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
  border-bottom: none;
  /* 1 */
  text-decoration: underline;
  /* 2 */
  text-decoration: underline dotted;
  /* 2 */ }

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b,
strong {
  font-weight: bolder; }

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code,
kbd,
samp {
  font-family: monospace, monospace;
  /* 1 */
  font-size: 1em;
  /* 2 */ }

/**
 * Add the correct font size in all browsers.
 */
small {
  font-size: 80%; }

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline; }

sub {
  bottom: -0.25em; }

sup {
  top: -0.5em; }

/* Embedded content
   ========================================================================== */
/**
 * Remove the border on images inside links in IE 10.
 */
img {
  border-style: none; }

/* Forms
   ========================================================================== */
/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */
button,
input,
optgroup,
select,
textarea {
  font-family: inherit;
  /* 1 */
  font-size: 100%;
  /* 1 */
  line-height: 1.15;
  /* 1 */
  margin: 0;
  /* 2 */ }

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */
button,
input {
  /* 1 */
  overflow: visible; }

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */
button,
select {
  /* 1 */
  text-transform: none; }

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */
button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button; }

/**
 * Remove the inner border and padding in Firefox.
 */
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0; }

/**
 * Restore the focus styles unset by the previous rule.
 */
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText; }

/**
 * Correct the padding in Firefox.
 */
fieldset {
  padding: 0.35em 0.75em 0.625em; }

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */
legend {
  box-sizing: border-box;
  /* 1 */
  color: inherit;
  /* 2 */
  display: table;
  /* 1 */
  max-width: 100%;
  /* 1 */
  padding: 0;
  /* 3 */
  white-space: normal;
  /* 1 */ }

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
  vertical-align: baseline; }

/**
 * Remove the default vertical scrollbar in IE 10+.
 */
textarea {
  overflow: auto; }

/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */
[type="checkbox"],
[type="radio"] {
  box-sizing: border-box;
  /* 1 */
  padding: 0;
  /* 2 */ }

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto; }

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */
[type="search"] {
  -webkit-appearance: textfield;
  /* 1 */
  outline-offset: -2px;
  /* 2 */ }

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */
[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none; }

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */
::-webkit-file-upload-button {
  -webkit-appearance: button;
  /* 1 */
  font: inherit;
  /* 2 */ }

/* Interactive
   ========================================================================== */
/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */
details {
  display: block; }

/*
 * Add the correct display in all browsers.
 */
summary {
  display: list-item; }

/* Misc
   ========================================================================== */
/**
 * Add the correct display in IE 10+.
 */
template {
  display: none; }

/**
 * Add the correct display in IE 10.
 */
[hidden] {
  display: none; }

/* CSS RESET */
/* ===================================== */
*,
*::after,
*::before {
  margin: 0;
  padding: 0;
  box-sizing: inherit; }

html {
  font-size: 62.5%; }
  @media only screen and (max-width: 75em) {
    html {
      font-size: 56.25%; } }
  @media only screen and (max-width: 56.25em) {
    html {
      font-size: 50%; } }
  @media only screen and (min-width: 112.5em) {
    html {
      font-size: 75%; } }

body {
  font-family: 'Lato', sans-serif;
  color: #333;
  box-sizing: border-box;
  font-size: 1.7rem; }

a {
  cursor: pointer; }

::selection {
  background-color: #d6de23;
  color: white; }

.overlay-buscar {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: 1000;
  background-image: linear-gradient(to right, rgba(35, 100, 170, 0.7), rgba(39, 48, 67, 0.7));
  display: none; }

.buscar-contenedor {
  z-index: 2000;
  position: fixed;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  background-color: white;
  width: 80%;
  box-shadow: 0 5px 5px rgba(0, 0, 0, 0.2);
  display: flex;
  flex-direction: column;
  padding: 8rem 3rem;
  justify-content: space-around; }
  @media only screen and (max-width: 37.5em) {
    .buscar-contenedor {
      width: 95%;
      padding: 8rem 1rem; } }
  .buscar-contenedor .buscar__titulo {
    color: #273043;
    margin-bottom: 1rem; }
  .buscar-contenedor .buscar {
    padding: 0;
    height: auto; }
  .buscar-contenedor .cerrar-buscar {
    position: absolute;
    top: 1rem;
    left: 1rem;
    background-color: #273043;
    color: #f7f7f7;
    width: 3rem;
    height: 3rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    line-height: 0;
    vertical-align: middle;
    transform: scale(1);
    transition: all .2s; }
    .buscar-contenedor .cerrar-buscar:hover {
      background-color: #f02d3a;
      color: #ffffff;
      transform: scale(1.2);
      font-size: 2.5rem; }

.navigation {
  position: fixed;
  top: 0;
  width: 100%;
  display: flex;
  justify-content: space-between;
  z-index: 1000;
  height: 7rem;
  transition: all .5s; }
  .navigation .nav-icon {
    margin: 1rem;
    width: 30px;
    display: none;
    opacity: 0;
    align-self: flex-end;
    margin-right: 2rem;
    margin-top: 1rem; }
    @media only screen and (max-width: 37.5em) {
      .navigation .nav-icon {
        display: block;
        opacity: 1; } }
  .navigation .nav-icon:after,
  .navigation .nav-icon:before,
  .navigation .nav-icon div {
    background-color: #fff;
    content: '';
    display: block;
    height: 3px;
    margin: 7px 0;
    transition: all .2s ease-in-out; }
  .navigation .nav-icon.abierto:before {
    transform: translateY(10px) rotate(135deg); }
  .navigation .nav-icon.abierto:after {
    transform: translateY(-10px) rotate(-135deg); }
  .navigation .nav-icon.abierto div {
    transform: scale(0); }
  .navigation.scrolled {
    background-color: white;
    box-shadow: 0 2px 3px rgba(0, 0, 0, 0.3); }
    .navigation.scrolled .nav-icon:after,
    .navigation.scrolled .nav-icon:before,
    .navigation.scrolled .nav-icon div {
      background-color: #273043; }
    .navigation.scrolled .navlogo {
      visibility: visible;
      opacity: 1; }
    .navigation.scrolled .navigation__item a {
      color: #9197ae;
      text-shadow: none; }
      .navigation.scrolled .navigation__item a svg {
        fill: #9197ae; }
    .navigation.scrolled .navigation__item .cat-menu {
      background-color: #273043; }
      .navigation.scrolled .navigation__item .cat-menu .submenu {
        background-color: #273043; }
      .navigation.scrolled .navigation__item .cat-menu a {
        color: #f7f7f7; }
  .navigation .navlogo {
    transition: all .5s;
    visibility: hidden;
    opacity: 0;
    margin-left: 5rem; }
    .navigation .navlogo img {
      height: 50px;
      margin-top: 5px; }
  .navigation__menu {
    list-style-type: none;
    display: flex;
    margin-right: 8rem; }
  .navigation__item {
    margin-left: 4rem;
    position: relative;
    display: flex;
    align-items: center; }
    .navigation__item a {
      transition: color .2s;
      color: #f7f7f7;
      font-weight: bold;
      text-decoration: none;
      text-shadow: 0 2px 3px rgba(0, 0, 0, 0.2); }
      .navigation__item a svg {
        height: 2rem;
        width: 2rem;
        fill: white; }
      .navigation__item a:hover {
        color: #d6de23; }
        .navigation__item a:hover svg {
          fill: #d6de23; }
    .navigation__item:hover .cat-menu {
      visibility: visible;
      opacity: 1; }
    .navigation__item .cat-menu {
      transition: opacity .3s, visibility .3s;
      visibility: hidden;
      opacity: 0;
      position: absolute;
      top: 100%;
      list-style-type: none;
      width: 35rem;
      background-color: rgba(39, 48, 67, 0.8); }
      .navigation__item .cat-menu__item:hover .contenedor-submenu {
        visibility: visible;
        opacity: 1;
        background-color: transparent;
        transition: background-color .2s; }
      .navigation__item .cat-menu__item a {
        font-weight: 400;
        text-shadow: none;
        padding: 1rem 1.6rem;
        display: block;
        line-height: 1.4;
        background-color: transparent;
        transition: background-color .3s; }
        .navigation__item .cat-menu__item a:hover {
          background-color: rgba(190, 30, 45, 0.5);
          color: #ffffff; }
      .navigation__item .cat-menu__item .contenedor-submenu {
        padding-right: .5rem;
        position: absolute;
        right: 100%;
        top: 0;
        width: 300px;
        visibility: hidden;
        opacity: 0;
        transition: visibility .2s, opacity .2s; }
        .navigation__item .cat-menu__item .contenedor-submenu .submenu {
          list-style-type: none;
          background-color: rgba(39, 48, 67, 0.8); }
  @media only screen and (max-width: 37.5em) {
    .navigation {
      flex-direction: column;
      align-items: flex-start;
      background-color: rgba(255, 255, 255, 0);
      overflow: hidden;
      transition: all .2s;
      height: auto; }
      .navigation.abierto {
        background-color: white; }
        .navigation.abierto .navlogo {
          display: block;
          visibility: visible;
          opacity: 1; }
        .navigation.abierto .nav-icon:after,
        .navigation.abierto .nav-icon:before,
        .navigation.abierto .nav-icon div {
          background-color: #273043; }
        .navigation.abierto .navigation__item.navigation__item--attention a {
          color: white; }
        .navigation.abierto .navigation__item a {
          color: #9197ae;
          text-shadow: none; }
      .navigation .nav-icon {
        margin-top: 2rem;
        margin-bottom: 2rem; }
      .navigation .navlogo {
        position: absolute;
        left: 0;
        top: 0; }
      .navigation__menu {
        flex-direction: column;
        align-items: flex-start;
        width: 100%;
        margin: 0;
        padding: 3rem;
        display: none;
        background-color: white; }
        .navigation__menu .navigation__item {
          flex-direction: column;
          align-items: flex-start;
          margin: 0;
          width: auto;
          width: 100%;
          padding-top: 1.5rem;
          padding-bottom: 1.5rem;
          border-bottom: 1px solid gainsboro; }
          .navigation__menu .navigation__item:last-child {
            border-bottom: none; }
      .navigation .cat-menu {
        visibility: visible;
        position: relative;
        opacity: 1;
        width: 100%;
        background-color: transparent !important;
        display: none; }
        .navigation .cat-menu .cat-menu__item {
          border-bottom: solid 1px gainsboro; }
          .navigation .cat-menu .cat-menu__item:last-child {
            border-bottom: 0; }
          .navigation .cat-menu .cat-menu__item a {
            color: #9197ae !important; }
            .navigation .cat-menu .cat-menu__item a:hover {
              color: white !important; }
        .navigation .cat-menu .contenedor-submenu {
          display: none; } }

.header {
  background-image: linear-gradient(to right, rgba(35, 100, 170, 0.7), rgba(39, 48, 67, 0.7)), url("../img/home-hero.jpg");
  background-position: center;
  background-size: cover;
  height: 85vh;
  position: relative;
  display: flex; }
  @media only screen and (max-width: 56.25em) {
    .header {
      height: 70vh; } }
  @media only screen and (max-width: 37.5em) {
    .header {
      height: 90vh; } }
  .header__logo-box {
    position: absolute;
    left: 10rem;
    top: 8rem;
    width: 10rem; }
    @media only screen and (max-width: 56.25em) {
      .header__logo-box {
        left: 5rem; } }
    @media only screen and (max-width: 37.5em) {
      .header__logo-box {
        left: 3rem;
        width: 9rem;
        top: 2rem; } }
  .header__text-box {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    margin-left: 10rem;
    width: 70rem; }
    @media only screen and (max-width: 56.25em) {
      .header__text-box {
        width: 60%;
        margin-left: 5rem; } }
    @media only screen and (max-width: 37.5em) {
      .header__text-box {
        width: 80%;
        margin-left: 3rem;
        text-align: center; } }
    .header__text-box .titulo {
      color: #d6de23;
      font-weight: 900;
      text-transform: uppercase;
      font-size: 6.3rem;
      border-bottom: solid 1px #f7f7f7;
      display: inline-block;
      margin-bottom: .7rem; }
      @media only screen and (max-width: 37.5em) {
        .header__text-box .titulo {
          font-size: 5.5rem;
          text-align: center;
          border-bottom: 0; } }
    .header__text-box .copy {
      color: #f7f7f7;
      font-size: 2.3rem;
      font-weight: 400;
      line-height: 1.5;
      margin-bottom: 1.7rem; }
      @media only screen and (max-width: 37.5em) {
        .header__text-box .copy {
          line-height: 1.3;
          text-align: center; } }
    .header__text-box .btn-main {
      font-weight: 700;
      text-transform: uppercase;
      color: #f7f7f7;
      border: solid 2px #be1e2d;
      padding: 1.3rem 1.7rem;
      background-color: #be1e2d;
      display: inline-block;
      transition: all .2s;
      margin-right: 2rem; }
      @media only screen and (max-width: 37.5em) {
        .header__text-box .btn-main {
          margin-bottom: 2rem; } }
      .header__text-box .btn-main:hover {
        background-color: #f02d3a;
        border-color: #f02d3a; }
    .header__text-box .btn-secondary {
      font-weight: 700;
      text-transform: uppercase;
      color: #f7f7f7;
      padding: 1.3rem 1.7rem;
      border: solid #f7f7f7 2px;
      display: inline-block;
      transition: all .2s; }
      .header__text-box .btn-secondary:hover {
        background-color: #f02d3a;
        border-color: #f02d3a; }
  .header__redes {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: absolute;
    right: 5rem;
    top: 50%;
    transform: translateY(-50%); }
    @media only screen and (max-width: 37.5em) {
      .header__redes {
        flex-direction: row;
        bottom: 2rem;
        right: unset;
        top: unset;
        left: 50%;
        transform: translateX(-50%); } }
    .header__redes a {
      margin-top: 1rem;
      margin-bottom: 1rem; }
      @media only screen and (max-width: 37.5em) {
        .header__redes a {
          margin: 0 1rem; } }
      .header__redes a svg {
        width: 2.5rem;
        height: 2.5rem;
        fill: #f7f7f7;
        transition: all .2s;
        transform: scale(1); }
        @media only screen and (max-width: 37.5em) {
          .header__redes a svg {
            width: 3.5rem;
            height: 3.5rem; } }
      .header__redes a:hover svg {
        fill: #d6de23;
        transform: scale(1.2); }
    .header__redes .linea {
      border-right: solid 1px #f7f7f7;
      height: 20vh;
      width: 0; }
      @media only screen and (max-width: 37.5em) {
        .header__redes .linea {
          width: 10vw;
          height: 0;
          border-right: none;
          border-top: solid 1px #f7f7f7; } }

.cta {
  height: 8rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 5rem 0 10rem;
  background-color: #f02d3a; }
  @media only screen and (max-width: 56.25em) {
    .cta {
      padding: 0 5rem 0 5rem; } }
  @media only screen and (max-width: 37.5em) {
    .cta {
      flex-direction: column;
      padding: 2rem 3rem;
      height: auto;
      text-align: center; } }
  .cta .texto {
    text-transform: uppercase;
    font-size: 2rem;
    padding-right: 2rem;
    font-weight: 700;
    color: #f7f7f7; }
    @media only screen and (max-width: 56.25em) {
      .cta .texto {
        font-size: 1.7rem; } }
    @media only screen and (max-width: 37.5em) {
      .cta .texto {
        margin-bottom: 1rem; } }
  .cta .btn-cta {
    color: #be1e2d;
    background-color: #f7f7f7;
    padding: 1rem 1.7rem;
    font-weight: 700;
    transition: all .2s; }
    @media only screen and (max-width: 56.25em) {
      .cta .btn-cta {
        width: 15rem; } }
    .cta .btn-cta:hover {
      background-color: #d6de23; }

.nosotros {
  display: flex; }
  @media only screen and (max-width: 37.5em) {
    .nosotros {
      flex-direction: column; } }
  @media only screen and (max-width: 37.5em) {
    .nosotros {
      height: auto; } }
  .nosotros .izquierda {
    flex-basis: 50%;
    background-color: #273043;
    padding: 5rem 10rem 5rem 10rem;
    display: flex;
    align-items: center; }
    @media only screen and (max-width: 56.25em) {
      .nosotros .izquierda {
        padding: 3rem 5rem 3rem 5rem; } }
    @media only screen and (max-width: 37.5em) {
      .nosotros .izquierda {
        padding: 5rem 3rem;
        flex-basis: unset; } }
    .nosotros .izquierda .bloque h2.titulo {
      font-weight: 900;
      font-size: 3.1rem;
      color: #d6de23;
      text-transform: uppercase;
      margin-bottom: 1.5rem; }
    .nosotros .izquierda .bloque .texto {
      color: #f7f7f7;
      margin-bottom: 1rem;
      line-height: 1.5; }
    .nosotros .izquierda .bloque .btn-contacto {
      color: #d6de23;
      position: relative;
      transition: all .2s;
      display: inline-block; }
      .nosotros .izquierda .bloque .btn-contacto:after {
        content: '';
        width: 20%;
        position: absolute;
        top: 130%;
        height: 1px;
        background-color: #d6de23;
        display: block;
        transition: all .2s; }
      .nosotros .izquierda .bloque .btn-contacto:hover {
        color: #f7f7f7; }
        .nosotros .izquierda .bloque .btn-contacto:hover:after {
          background-color: #f7f7f7;
          width: 100%; }
  .nosotros .derecha {
    flex: 1;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 5rem;
    display: flex; }
    @media only screen and (max-width: 37.5em) {
      .nosotros .derecha {
        flex-basis: unset; } }
  @media only screen and (max-width: 37.5em) and (max-width: 37.5em) {
    .nosotros .derecha {
      height: 30rem;
      padding: 3rem; } }
    .nosotros .derecha img {
      height: 100%; }

.servicios-container {
  display: flex;
  height: 50rem; }
  @media only screen and (max-width: 37.5em) {
    .servicios-container {
      flex-direction: column;
      height: auto; } }
  .servicios-container .izquierda {
    background-color: white;
    padding: 5rem 10rem 5rem 10rem;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    width: 40%; }
    @media only screen and (max-width: 56.25em) {
      .servicios-container .izquierda {
        padding: 0 3rem 0 5rem; } }
    @media only screen and (max-width: 37.5em) {
      .servicios-container .izquierda {
        width: 100%;
        align-items: center;
        background-color: #273043; } }
    .servicios-container .izquierda .titulo {
      font-weight: 900;
      font-size: 3.1rem;
      color: #273043;
      text-transform: uppercase;
      margin-bottom: 1rem;
      text-align: left; }
      @media only screen and (max-width: 56.25em) {
        .servicios-container .izquierda .titulo {
          font-size: 2.5rem; } }
      @media only screen and (max-width: 37.5em) {
        .servicios-container .izquierda .titulo {
          text-align: center;
          color: #f7f7f7; } }
    .servicios-container .izquierda .lista-servicios {
      list-style-type: none;
      margin-bottom: 1.5rem;
      display: flex;
      flex-direction: column; }
      @media only screen and (max-width: 37.5em) {
        .servicios-container .izquierda .lista-servicios {
          display: none; } }
      .servicios-container .izquierda .lista-servicios .servicio {
        padding: 1.3rem 0;
        position: relative;
        text-align: left;
        display: inline-block;
        font-weight: 700; }
        .servicios-container .izquierda .lista-servicios .servicio a {
          color: #2364aa;
          position: relative;
          text-align: left;
          display: inline-block; }
          .servicios-container .izquierda .lista-servicios .servicio a:after {
            content: "";
            height: 1px;
            background-color: #f02d3a;
            transition: all .2s;
            width: 0%;
            position: absolute;
            top: 100%;
            margin-top: .5rem;
            left: 0;
            transform: translateX(0); }
          .servicios-container .izquierda .lista-servicios .servicio a:hover {
            color: #f02d3a; }
            .servicios-container .izquierda .lista-servicios .servicio a:hover:after {
              width: 100%;
              height: 2px; }
          .servicios-container .izquierda .lista-servicios .servicio a.btn-servivicio--active {
            color: #f02d3a; }
            .servicios-container .izquierda .lista-servicios .servicio a.btn-servivicio--active:after {
              width: 100%;
              height: 2px; }
        .servicios-container .izquierda .lista-servicios .servicio:hover {
          font-weight: 700; }
    .servicios-container .izquierda .btn-servicios {
      background-color: #f02d3a;
      padding: 1rem 1.7rem;
      color: #f7f7f7;
      font-weight: 700;
      transition: all .2s;
      text-transform: uppercase; }
      @media only screen and (max-width: 56.25em) {
        .servicios-container .izquierda .btn-servicios {
          font-size: 1.5rem; } }
      @media only screen and (max-width: 37.5em) {
        .servicios-container .izquierda .btn-servicios {
          display: none; } }
      .servicios-container .izquierda .btn-servicios:hover {
        background-color: #be1e2d; }
  .servicios-container .derecha {
    background-size: cover;
    background-position: center;
    text-align: center;
    position: relative;
    width: 60%; }
    @media only screen and (max-width: 37.5em) {
      .servicios-container .derecha {
        background-color: #273043; } }
    .servicios-container .derecha .btn-servicios {
      background-color: #f02d3a;
      padding: 1rem 1.7rem;
      color: #f7f7f7;
      font-weight: 700;
      transition: all .2s;
      text-transform: uppercase;
      display: none; }
      @media only screen and (max-width: 37.5em) {
        .servicios-container .derecha .btn-servicios {
          margin-bottom: 1rem;
          display: inline-block;
          margin-top: 2rem;
          margin-bottom: 2rem; } }
      .servicios-container .derecha .btn-servicios:hover {
        background-color: #be1e2d; }
    .servicios-container .derecha .bx-controls {
      display: none; }
      @media only screen and (max-width: 37.5em) {
        .servicios-container .derecha .bx-controls {
          display: block; } }
    .servicios-container .derecha .bx-wrapper {
      box-shadow: none;
      border: none;
      outline: none; }
      @media only screen and (max-width: 37.5em) {
        .servicios-container .derecha .bx-wrapper {
          margin: 0; } }
    .servicios-container .derecha .bx-viewport {
      height: 100%; }
    .servicios-container .derecha .servicio-slide {
      background-image: url("../img/imagen1.jpg");
      background-size: cover;
      height: 50rem; }
    .servicios-container .derecha .sliderderecha {
      height: 100%;
      width: 100%; }
    @media only screen and (max-width: 37.5em) {
      .servicios-container .derecha {
        width: 100%; } }
    .servicios-container .derecha .overlay {
      z-index: 1;
      position: absolute;
      width: 100%;
      height: 100%;
      top: 0;
      left: 0;
      background-image: linear-gradient(to right, rgba(35, 100, 170, 0.7), rgba(39, 48, 67, 0.7)); }
    .servicios-container .derecha .cajatexto {
      z-index: 2;
      position: absolute;
      bottom: 0;
      left: 0;
      padding-left: 5rem;
      padding-bottom: 5rem;
      width: 60%; }
      @media only screen and (max-width: 75em) {
        .servicios-container .derecha .cajatexto {
          width: 80%; } }
      @media only screen and (max-width: 37.5em) {
        .servicios-container .derecha .cajatexto {
          width: 70%;
          padding: 0;
          top: 50%;
          left: 50%;
          bottom: unset;
          right: unset;
          transform: translate(-50%, -50%);
          height: auto; } }
      .servicios-container .derecha .cajatexto h1.servicios {
        font-weight: 900;
        font-size: 3.1rem;
        color: #f7f7f7;
        text-transform: uppercase;
        margin-bottom: 1.5rem;
        text-align: left; }
        @media only screen and (max-width: 56.25em) {
          .servicios-container .derecha .cajatexto h1.servicios {
            font-size: 2.5rem; } }
      .servicios-container .derecha .cajatexto p.descripcion {
        color: #f7f7f7;
        text-align: left;
        line-height: 1.5;
        margin-bottom: 1.5rem; }
      .servicios-container .derecha .cajatexto .botonera {
        display: flex; }
        .servicios-container .derecha .cajatexto .botonera .btn-contacto {
          padding: 1rem 1.7rem;
          background-color: #f02d3a;
          border: solid 1px #f02d3a;
          transition: all .2s;
          text-transform: uppercase;
          color: #f7f7f7;
          margin-right: 1.7rem;
          font-weight: 700; }
          @media only screen and (max-width: 56.25em) {
            .servicios-container .derecha .cajatexto .botonera .btn-contacto {
              font-size: 1.5rem; } }
          .servicios-container .derecha .cajatexto .botonera .btn-contacto:hover {
            background-color: #be1e2d;
            border-color: #be1e2d; }
        .servicios-container .derecha .cajatexto .botonera .btn-leermas {
          padding: 1rem 1.7rem;
          background-color: transparent;
          border: solid 2px #f7f7f7;
          transition: all .2s;
          text-transform: uppercase;
          color: #f7f7f7;
          font-weight: 700; }
          @media only screen and (max-width: 56.25em) {
            .servicios-container .derecha .cajatexto .botonera .btn-leermas {
              font-size: 1.5rem; } }
          .servicios-container .derecha .cajatexto .botonera .btn-leermas:hover {
            background-color: #f02d3a;
            border-color: #f02d3a; }

.buscar {
  width: 100%;
  height: 10rem;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 5rem; }
  @media only screen and (max-width: 37.5em) {
    .buscar {
      padding: 0 3rem; } }
  .buscar .formulariobusqueda {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    position: relative; }
    .buscar .formulariobusqueda .busqueda {
      display: block;
      width: 100%;
      padding: 1rem 1.7rem;
      background-color: rgba(0, 0, 0, 0.1);
      border: 0;
      transition: all .2s;
      font-family: 'Lato', sans-serif;
      color: #273043; }
      .buscar .formulariobusqueda .busqueda:focus {
        outline: none;
        width: 100%; }
    .buscar .formulariobusqueda .searchicon {
      position: absolute;
      right: 2rem;
      height: 2rem;
      width: 2rem;
      fill: #9197ae; }

.recursos-container {
  display: flex;
  height: 45rem; }
  @media only screen and (max-width: 37.5em) {
    .recursos-container {
      flex-direction: column;
      height: auto; } }
  .recursos-container .izquierda {
    width: 40%;
    background-color: #273043;
    padding: 5rem 10rem;
    display: flex;
    flex-direction: column;
    justify-content: center; }
    @media only screen and (max-width: 56.25em) {
      .recursos-container .izquierda {
        padding: 5rem 3rem 5rem 5rem; } }
    @media only screen and (max-width: 37.5em) {
      .recursos-container .izquierda {
        width: 100%;
        align-items: center;
        padding: 0 3rem; } }
    .recursos-container .izquierda .titulo {
      font-weight: 900;
      font-size: 3.1rem;
      color: #f7f7f7;
      text-transform: uppercase;
      margin-bottom: 2rem; }
      @media only screen and (max-width: 56.25em) {
        .recursos-container .izquierda .titulo {
          font-size: 2.5rem; } }
    .recursos-container .izquierda .lista-recursos {
      list-style-type: none; }
      @media only screen and (max-width: 37.5em) {
        .recursos-container .izquierda .lista-recursos {
          display: none; } }
      .recursos-container .izquierda .lista-recursos .recurso {
        padding: 1.3rem 0; }
        .recursos-container .izquierda .lista-recursos .recurso a {
          color: #f7f7f7;
          font-weight: 700;
          transition: all .2s;
          position: relative;
          display: inline-block; }
          .recursos-container .izquierda .lista-recursos .recurso a:after {
            content: "";
            height: 1px;
            background-color: #d6de23;
            transition: all .2s;
            width: 0%;
            position: absolute;
            top: 100%;
            margin-top: .5rem;
            left: 0;
            transform: translateX(0); }
          .recursos-container .izquierda .lista-recursos .recurso a:hover {
            color: #d6de23; }
            .recursos-container .izquierda .lista-recursos .recurso a:hover:after {
              width: 100%;
              height: 2px; }
          .recursos-container .izquierda .lista-recursos .recurso a.btn-recurso--active {
            color: #d6de23; }
            .recursos-container .izquierda .lista-recursos .recurso a.btn-recurso--active:after {
              width: 100%;
              height: 2px; }
  .recursos-container .derecha {
    background-size: cover;
    background-position: center;
    position: relative;
    width: 60%; }
    @media only screen and (max-width: 37.5em) {
      .recursos-container .derecha {
        width: 100%; } }
    .recursos-container .derecha .bx-controls {
      display: none; }
      @media only screen and (max-width: 37.5em) {
        .recursos-container .derecha .bx-controls {
          display: block; } }
    .recursos-container .derecha .bx-wrapper {
      box-shadow: none;
      border: none;
      outline: none; }
      @media only screen and (max-width: 37.5em) {
        .recursos-container .derecha .bx-wrapper {
          margin: 0; } }
    .recursos-container .derecha .bx-viewport {
      height: 100%; }
    .recursos-container .derecha .recurso-slide {
      background-image: url("../img/imagen1.jpg");
      background-size: cover;
      height: 45rem; }
    .recursos-container .derecha .sliderrecursos {
      height: 100%;
      width: 100%; }
    .recursos-container .derecha .overlay {
      z-index: 1;
      position: absolute;
      width: 100%;
      height: 100%;
      top: 0;
      left: 0;
      background-image: linear-gradient(to right, rgba(35, 100, 170, 0.7), rgba(39, 48, 67, 0.7)); }
    .recursos-container .derecha .header-recursos {
      z-index: 2;
      display: flex;
      position: relative; }
      .recursos-container .derecha .header-recursos .tipo {
        background-color: #273043;
        color: #f7f7f7;
        padding: 1rem; }
      .recursos-container .derecha .header-recursos .fecha {
        color: #f7f7f7;
        padding: 1rem; }
    .recursos-container .derecha .contenido-recursos {
      z-index: 2;
      padding: 5rem;
      position: relative; }
      @media only screen and (max-width: 37.5em) {
        .recursos-container .derecha .contenido-recursos {
          padding: 0;
          width: 70%;
          position: absolute;
          left: 50%;
          top: 50%;
          transform: translate(-50%, -50%); } }
      .recursos-container .derecha .contenido-recursos .titulo {
        font-weight: 700;
        font-size: 3.4rem;
        color: #f7f7f7;
        text-transform: uppercase;
        margin-bottom: 0; }
        @media only screen and (max-width: 56.25em) {
          .recursos-container .derecha .contenido-recursos .titulo {
            font-size: 2.5rem; } }
      .recursos-container .derecha .contenido-recursos .subtitulo {
        font-weight: 700;
        font-size: 1.8rem;
        color: #f7f7f7;
        margin-top: .5rem; }
        @media only screen and (max-width: 56.25em) {
          .recursos-container .derecha .contenido-recursos .subtitulo {
            font-size: 1.6rem; } }
      .recursos-container .derecha .contenido-recursos .tags {
        list-style-type: none;
        display: flex;
        margin-top: .5rem; }
        .recursos-container .derecha .contenido-recursos .tags .tag {
          position: relative; }
          .recursos-container .derecha .contenido-recursos .tags .tag:not(:first-child) {
            padding-left: 1.5rem; }
            .recursos-container .derecha .contenido-recursos .tags .tag:not(:first-child):before {
              content: "/";
              position: absolute;
              left: .5rem;
              color: #86ddfc; }
          .recursos-container .derecha .contenido-recursos .tags .tag a {
            color: #86ddfc;
            transition: all .2s; }
            .recursos-container .derecha .contenido-recursos .tags .tag a:hover {
              color: #f7f7f7; }
      .recursos-container .derecha .contenido-recursos .contenido-servicios {
        color: #f7f7f7;
        margin-top: .5rem;
        line-height: 1.5; }
      .recursos-container .derecha .contenido-recursos .btn-leer-servicios {
        background-color: #f02d3a;
        padding: 1rem 1.7rem;
        display: inline-block;
        margin-top: 1.5rem;
        color: #f7f7f7;
        font-weight: 700;
        transition: all .2s; }
        .recursos-container .derecha .contenido-recursos .btn-leer-servicios:hover {
          background-color: #d6de23;
          color: #273043; }

.contacto {
  display: flex; }
  @media only screen and (max-width: 37.5em) {
    .contacto {
      flex-direction: column;
      height: auto;
      align-items: center; } }
  .contacto .izquierda {
    width: 50%;
    padding: 5rem;
    display: flex;
    align-items: center;
    justify-content: center; }
    @media only screen and (max-width: 37.5em) {
      .contacto .izquierda {
        width: 100%; } }
    .contacto .izquierda h1.titulo {
      font-weight: 900;
      font-size: 3.1rem;
      color: #f02d3a;
      text-transform: uppercase;
      margin-bottom: 2rem;
      text-align: left; }
      @media only screen and (max-width: 37.5em) {
        .contacto .izquierda h1.titulo {
          text-align: center; } }
    .contacto .izquierda .sedes {
      display: flex; }
      @media only screen and (max-width: 37.5em) {
        .contacto .izquierda .sedes {
          flex-direction: column;
          align-items: center; } }
      .contacto .izquierda .sedes .sede {
        margin-right: 3rem; }
        @media only screen and (max-width: 37.5em) {
          .contacto .izquierda .sedes .sede {
            margin: 1rem 0;
            text-align: center; } }
        .contacto .izquierda .sedes .sede h2.titulo {
          color: #273043;
          text-transform: uppercase;
          font-weight: 700;
          font-size: 1.8rem; }
        .contacto .izquierda .sedes .sede p {
          color: #273043;
          font-size: 1.6rem; }
    .contacto .izquierda .redes-contacto {
      list-style-type: none;
      display: flex; }
      @media only screen and (max-width: 37.5em) {
        .contacto .izquierda .redes-contacto {
          justify-content: center; } }
      .contacto .izquierda .redes-contacto .red {
        margin-right: 1.5rem; }
        .contacto .izquierda .redes-contacto .red a svg {
          width: 3rem;
          height: 3rem;
          fill: #f02d3a;
          transition: all .2s; }
        .contacto .izquierda .redes-contacto .red a:hover svg {
          fill: #be1e2d; }
  .contacto .derecha {
    width: 50%;
    padding: 5rem; }
    @media only screen and (max-width: 37.5em) {
      .contacto .derecha {
        width: 100%;
        padding: 0 3rem 3rem 3rem; } }
    .contacto .derecha form {
      display: flex;
      flex-direction: column;
      width: 80%; }
      @media only screen and (max-width: 37.5em) {
        .contacto .derecha form {
          width: 100%; } }
      .contacto .derecha form input[type="text"], .contacto .derecha form textarea {
        display: block;
        border: none;
        border-bottom: #9197ae 1px solid;
        padding: 1rem 1.7rem .5rem 1rem;
        margin-bottom: 2rem;
        max-width: 100%;
        min-width: 100%; }
        .contacto .derecha form input[type="text"]:focus, .contacto .derecha form textarea:focus {
          outline-color: #f02d3a; }
      .contacto .derecha form input[type="submit"] {
        background-color: #f02d3a;
        padding: 1rem 1.7rem;
        font-weight: 700;
        color: #f7f7f7;
        border: none;
        display: inline-block;
        cursor: pointer;
        transition: all .2s; }
        .contacto .derecha form input[type="submit"]:hover {
          background-color: #be1e2d; }

.maincontent {
  display: flex; }
  @media only screen and (max-width: 37.5em) {
    .maincontent {
      flex-direction: column; } }
  .maincontent main.contenido {
    flex-basis: 70%;
    background-color: #f7f7f7;
    padding-left: 10rem;
    padding-right: 10rem;
    padding-top: 5rem;
    padding-bottom: 10rem;
    line-height: 1.5; }
    @media only screen and (max-width: 37.5em) {
      .maincontent main.contenido {
        flex-basis: 90%;
        padding: 1rem 3rem 1rem 3rem; } }
    .maincontent main.contenido h1, .maincontent main.contenido h2, .maincontent main.contenido h3, .maincontent main.contenido h4, .maincontent main.contenido h5, .maincontent main.contenido h6 {
      color: #273043;
      margin-bottom: 1rem; }
    .maincontent main.contenido p {
      margin-bottom: 1rem;
      color: #333;
      font-weight: 400;
      text-align: justify; }
    .maincontent main.contenido li {
      margin-bottom: 1rem; }
    .maincontent main.contenido ul {
      margin-left: 2rem; }
    .maincontent main.contenido ol {
      margin-left: 2rem; }
    .maincontent main.contenido blockquote {
      border-left: solid 5px #d6de23;
      padding-left: 2rem;
      color: grey;
      margin-top: 2rem;
      margin-bottom: 2rem; }
    .maincontent main.contenido a:link, .maincontent main.contenido a:visited {
      color: #2364aa;
      transition: all .2s; }
      .maincontent main.contenido a:link:hover, .maincontent main.contenido a:visited:hover {
        color: #f02d3a; }
    .maincontent main.contenido .caracteristicas {
      display: flex;
      text-align: center;
      margin-top: 4rem; }
      .maincontent main.contenido .caracteristicas__header {
        display: flex;
        background-color: #be1e2d;
        color: #f7f7f7;
        padding: 1rem 2rem;
        text-transform: uppercase;
        text-align: center;
        align-items: center;
        justify-content: center; }
      .maincontent main.contenido .caracteristicas__cuerpo {
        background-color: rgba(145, 151, 174, 0.4);
        padding: 1rem 4rem;
        flex: 1; }
        .maincontent main.contenido .caracteristicas__cuerpo ul {
          list-style-type: none;
          margin: 0; }
          .maincontent main.contenido .caracteristicas__cuerpo ul li {
            color: #273043; }
            .maincontent main.contenido .caracteristicas__cuerpo ul li:not(:last-child) {
              border-bottom: solid 1px white;
              padding: 1rem 0; }
    .maincontent main.contenido h3.compartir {
      text-align: center;
      margin-top: 5rem;
      text-transform: uppercase;
      color: #f02d3a;
      font-weight: 700; }
    .maincontent main.contenido .redes {
      display: flex;
      list-style-type: none;
      justify-content: center;
      margin-left: 0;
      position: relative;
      padding-top: 3rem; }
      .maincontent main.contenido .redes:before {
        content: "";
        width: 6rem;
        height: 2px;
        background-color: #f02d3a;
        position: absolute;
        top: 0; }
      .maincontent main.contenido .redes .red {
        margin-right: 1rem; }
        .maincontent main.contenido .redes .red a svg {
          height: 3rem;
          width: 3rem;
          fill: grey;
          transition: all .2s; }
        .maincontent main.contenido .redes .red a:hover svg {
          fill: #f02d3a; }
  .maincontent aside.sidebar {
    flex-basis: 30%;
    background-color: #cccfd9; }
    .maincontent aside.sidebar .destacado2 {
      position: relative;
      padding: 3rem;
      min-height: 20rem;
      background-size: cover;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: space-between;
      transition: all .2s;
      background-size: 100%;
      background-position: center; }
      .maincontent aside.sidebar .destacado2:hover {
        background-size: 110%; }
      .maincontent aside.sidebar .destacado2 .overlay {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-image: linear-gradient(to right, rgba(35, 100, 170, 0.7), rgba(39, 48, 67, 0.7)); }
        .maincontent aside.sidebar .destacado2 .overlay .borde {
          position: absolute;
          border: solid 1px #9197ae;
          top: 3%;
          left: 3%;
          right: 3%;
          bottom: 3%; }
      .maincontent aside.sidebar .destacado2__texto {
        position: relative;
        text-transform: uppercase;
        color: white;
        font-weight: 700;
        text-align: center; }
      .maincontent aside.sidebar .destacado2__btn {
        position: relative;
        background-color: white;
        color: #f02d3a;
        padding: .7rem 1.7rem;
        text-transform: uppercase;
        font-weight: 700;
        transition: all .2s; }
        .maincontent aside.sidebar .destacado2__btn:before {
          content: '•';
          font-size: 2.3rem;
          position: relative;
          top: .15rem;
          line-height: 0;
          margin-right: .3rem; }
        .maincontent aside.sidebar .destacado2__btn:hover {
          background-color: #f02d3a;
          color: white; }
    .maincontent aside.sidebar .destacado1 {
      background-color: #f02d3a;
      display: flex;
      flex-direction: column;
      align-items: center;
      padding: 3rem; }
      .maincontent aside.sidebar .destacado1__texto {
        color: white;
        font-weight: 700;
        text-transform: uppercase;
        margin-bottom: 1rem;
        text-align: center; }
      .maincontent aside.sidebar .destacado1__btn {
        background-color: white;
        color: #f02d3a;
        padding: .7rem 1.7rem;
        text-transform: uppercase;
        font-weight: 700;
        transition: all .2s; }
        .maincontent aside.sidebar .destacado1__btn:before {
          content: '•';
          font-size: 2.3rem;
          position: relative;
          top: .15rem;
          line-height: 0;
          margin-right: .3rem; }
        .maincontent aside.sidebar .destacado1__btn:hover {
          background-color: #d6de23; }
    .maincontent aside.sidebar .contacto {
      background-color: #2364aa;
      color: #f7f7f7;
      height: 12rem;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: space-around;
      padding: 1.7rem 0; }
      .maincontent aside.sidebar .contacto .texto {
        font-weight: 700;
        text-transform: uppercase; }
      .maincontent aside.sidebar .contacto .btn-contacto {
        background-color: #f02d3a;
        color: #f7f7f7;
        padding: 1rem 1.7rem;
        font-weight: 700;
        text-transform: uppercase;
        transition: all .2s; }
        .maincontent aside.sidebar .contacto .btn-contacto:hover {
          color: #f02d3a;
          background-color: #ffffff; }
    .maincontent aside.sidebar .servicios-sidebar {
      background-color: #273043;
      display: flex;
      flex-direction: column;
      padding: 3rem 0;
      align-items: center;
      justify-content: space-around; }
      .maincontent aside.sidebar .servicios-sidebar .titulo {
        text-transform: uppercase;
        font-weight: 900;
        color: #f7f7f7;
        margin-bottom: 1rem;
        font-size: 2rem; }
      .maincontent aside.sidebar .servicios-sidebar ul {
        list-style-type: none; }
        .maincontent aside.sidebar .servicios-sidebar ul li {
          padding: 1rem 1.7rem;
          display: flex; }
          .maincontent aside.sidebar .servicios-sidebar ul li a {
            text-decoration: none;
            position: relative;
            color: #f7f7f7;
            font-weight: 400;
            transition: all .2s; }
            .maincontent aside.sidebar .servicios-sidebar ul li a:after {
              content: "";
              height: 1px;
              width: 2rem;
              background-color: #f7f7f7;
              position: absolute;
              top: 140%;
              left: 50%;
              transform: translateX(-50%);
              transition: all .2s; }
            .maincontent aside.sidebar .servicios-sidebar ul li a:hover {
              color: #f02d3a; }
              .maincontent aside.sidebar .servicios-sidebar ul li a:hover:after {
                width: 100%;
                background-color: red; }
    .maincontent aside.sidebar .recursos-sidebar {
      background-color: #cccfd9;
      display: flex;
      flex-direction: column;
      padding: 3rem 0;
      align-items: center;
      justify-content: space-around; }
      .maincontent aside.sidebar .recursos-sidebar .titulo {
        text-transform: uppercase;
        font-weight: 900;
        color: #273043;
        margin-bottom: 1rem;
        font-size: 2rem; }
      .maincontent aside.sidebar .recursos-sidebar ul {
        list-style-type: none; }
        .maincontent aside.sidebar .recursos-sidebar ul li {
          padding: 1rem 1.7rem;
          display: flex; }
          .maincontent aside.sidebar .recursos-sidebar ul li a {
            text-decoration: none;
            position: relative;
            color: #273043;
            font-weight: 400;
            transition: all .2s; }
            .maincontent aside.sidebar .recursos-sidebar ul li a:after {
              content: "";
              height: 1px;
              width: 2rem;
              background-color: #273043;
              position: absolute;
              top: 140%;
              left: 50%;
              transform: translateX(-50%);
              transition: all .2s; }
            .maincontent aside.sidebar .recursos-sidebar ul li a:hover {
              color: #f02d3a; }
              .maincontent aside.sidebar .recursos-sidebar ul li a:hover:after {
                width: 100%;
                background-color: red; }

.footer {
  background-color: #051116;
  color: #9197ae;
  padding: 5rem 5rem 1rem 5rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between; }
  @media only screen and (max-width: 37.5em) {
    .footer {
      padding: 3rem; } }
  .footer .columnas {
    display: flex;
    margin-bottom: 5rem; }
    @media only screen and (max-width: 37.5em) {
      .footer .columnas {
        flex-direction: column; } }
    .footer .columnas .columna {
      width: 33.33333%; }
      @media only screen and (max-width: 37.5em) {
        .footer .columnas .columna {
          width: 100%; } }
      .footer .columnas .columna .listafooter {
        list-style-type: none; }
        .footer .columnas .columna .listafooter .item {
          margin-bottom: 1.5rem; }
          .footer .columnas .columna .listafooter .item a {
            transition: all .2s; }
            .footer .columnas .columna .listafooter .item a:hover {
              color: #f7f7f7; }
      .footer .columnas .columna .redes-footer {
        list-style-type: none;
        display: flex;
        justify-content: flex-start;
        width: 100%; }
        .footer .columnas .columna .redes-footer .red {
          margin-left: 2rem; }
          @media only screen and (max-width: 37.5em) {
            .footer .columnas .columna .redes-footer .red {
              margin-left: 0;
              margin-right: 2rem; } }
          .footer .columnas .columna .redes-footer .red a svg {
            width: 2.5rem;
            height: 2.5rem;
            fill: #9197ae;
            transition: all .2s; }
          .footer .columnas .columna .redes-footer .red a:hover svg {
            fill: #f7f7f7; }
  .footer .inferior {
    display: flex;
    justify-content: space-between; }
    @media only screen and (max-width: 37.5em) {
      .footer .inferior {
        flex-direction: column; } }

.overlay-contacto {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-image: linear-gradient(to right, rgba(35, 100, 170, 0.7), rgba(39, 48, 67, 0.7));
  z-index: 1000;
  display: none; }

.contacto-contenedor {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  background-color: white;
  box-shadow: 0 10px 5px rgba(0, 0, 0, 0.2);
  z-index: 2000;
  display: none; }
  @media only screen and (max-width: 56.25em) {
    .contacto-contenedor {
      width: 80%; } }
  @media only screen and (max-width: 37.5em) {
    .contacto-contenedor {
      width: 90%;
      flex-direction: column; } }
  .contacto-contenedor .cerrar {
    position: absolute;
    top: 1rem;
    left: 1rem;
    background-color: #273043;
    color: #f7f7f7;
    width: 3rem;
    height: 3rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    line-height: 0;
    vertical-align: middle;
    transform: scale(1);
    transition: all .2s; }
    .contacto-contenedor .cerrar:hover {
      background-color: #f02d3a;
      color: #ffffff;
      transform: scale(1.2);
      font-size: 2.5rem; }
  .contacto-contenedor .izquierda {
    width: 50%;
    padding: 5rem 2rem 5rem 5rem;
    display: flex;
    align-items: center;
    justify-content: center; }
    @media only screen and (max-width: 37.5em) {
      .contacto-contenedor .izquierda {
        width: 100%;
        display: none; } }
    .contacto-contenedor .izquierda h1.titulo {
      font-weight: 900;
      font-size: 3.1rem;
      color: #f02d3a;
      text-transform: uppercase;
      margin-bottom: 2rem;
      text-align: center; }
    .contacto-contenedor .izquierda .sedes {
      display: flex; }
      .contacto-contenedor .izquierda .sedes .sede {
        padding-left: .3rem;
        padding-right: .3rem; }
        .contacto-contenedor .izquierda .sedes .sede h2.titulo {
          color: #273043;
          text-transform: uppercase;
          font-weight: 700;
          font-size: 1.8rem; }
        .contacto-contenedor .izquierda .sedes .sede p {
          color: #273043;
          font-size: 1.6rem; }
    .contacto-contenedor .izquierda .redes-contacto {
      list-style-type: none;
      display: flex;
      justify-content: center; }
      .contacto-contenedor .izquierda .redes-contacto .red {
        margin-right: 1.5rem; }
        .contacto-contenedor .izquierda .redes-contacto .red a svg {
          width: 3rem;
          height: 3rem;
          fill: #f02d3a;
          transition: all .2s; }
        .contacto-contenedor .izquierda .redes-contacto .red a:hover svg {
          fill: #be1e2d; }
  .contacto-contenedor .derecha {
    width: 50%;
    padding: 5rem 5rem 5rem 0; }
    @media only screen and (max-width: 37.5em) {
      .contacto-contenedor .derecha {
        width: 100%;
        padding: 8rem 3rem 3rem 3rem; } }
    .contacto-contenedor .derecha form {
      display: flex;
      flex-direction: column;
      width: 100%; }
      .contacto-contenedor .derecha form input[type="text"], .contacto-contenedor .derecha form textarea {
        display: block;
        border: none;
        border-bottom: #9197ae 1px solid;
        padding: 1rem 1.7rem .5rem 1rem;
        margin-bottom: 2rem;
        max-width: 100%;
        min-width: 100%; }
        .contacto-contenedor .derecha form input[type="text"]:focus, .contacto-contenedor .derecha form textarea:focus {
          outline-color: #f02d3a; }
      .contacto-contenedor .derecha form input[type="submit"] {
        background-color: #f02d3a;
        padding: 1rem 1.7rem;
        font-weight: 700;
        color: #f7f7f7;
        border: none;
        display: inline-block;
        cursor: pointer;
        transition: all .2s; }
        .contacto-contenedor .derecha form input[type="submit"]:hover {
          background-color: #be1e2d; }

.recomendados {
  display: flex;
  height: 26rem;
  overflow: hidden; }
  @media only screen and (max-width: 37.5em) {
    .recomendados {
      flex-direction: column;
      height: auto; } }
  .recomendados .recomendado {
    overflow: hidden;
    position: relative;
    flex: 33%;
    position: relative;
    display: flex; }
    .recomendados .recomendado:hover .overlay {
      background-color: rgba(35, 100, 170, 0.7); }
    .recomendados .recomendado:hover img {
      transform: scale(1.3);
      filter: blur(2px); }
    .recomendados .recomendado:hover .cajatexto {
      bottom: 50%;
      transform: translateY(50%); }
    .recomendados .recomendado .overlay {
      position: absolute;
      width: 100%;
      height: 100%;
      top: 0;
      left: 0;
      background-color: rgba(0, 0, 0, 0.6);
      z-index: 1;
      transition: all .2s; }
    .recomendados .recomendado img {
      height: 100%;
      width: 100%;
      object-fit: cover;
      transform: scale(1);
      transition: all .2s;
      filter: blur(0); }
    .recomendados .recomendado .tiporecurso {
      position: absolute;
      top: 0;
      left: 0;
      background-color: #f02d3a;
      z-index: 1;
      color: white;
      padding: .8rem 1.3rem;
      text-transform: uppercase;
      font-size: 1.3rem;
      font-weight: 700;
      letter-spacing: .12rem; }
    .recomendados .recomendado .cajatexto {
      z-index: 10;
      position: absolute;
      bottom: 3.5rem;
      left: 0;
      padding: 0 3.5rem;
      transform: translateY(0);
      transition: all .2s; }
      .recomendados .recomendado .cajatexto .titulo {
        color: #f7f7f7;
        font-size: 1.8rem;
        margin-bottom: .5rem; }
      .recomendados .recomendado .cajatexto .subtitulo {
        color: #f7f7f7;
        font-weight: 400;
        font-size: 1.5rem; }

.servicios-lista {
  display: flex;
  min-height: 55rem; }
  @media only screen and (max-width: 37.5em) {
    .servicios-lista {
      flex-direction: column; } }
  .servicios-lista .izquierda {
    background-color: white;
    padding: 3rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex-basis: 30%; }
    .servicios-lista .izquierda .titulo {
      font-weight: 900;
      font-size: 2rem;
      color: #273043;
      text-transform: uppercase;
      margin-bottom: 1.5rem;
      text-align: center; }
    .servicios-lista .izquierda .lista-servicios {
      list-style-type: none;
      margin-bottom: 3rem;
      display: flex;
      flex-direction: column; }
      @media only screen and (max-width: 37.5em) {
        .servicios-lista .izquierda .lista-servicios {
          display: none; } }
      .servicios-lista .izquierda .lista-servicios .servicio {
        padding: 1.5rem 0;
        position: relative;
        text-align: center;
        display: inline-block; }
        .servicios-lista .izquierda .lista-servicios .servicio:after {
          content: "";
          height: 1px;
          background-color: #f02d3a;
          transition: all .2s;
          width: 20%;
          position: absolute;
          top: 100%;
          left: 50%;
          transform: translateX(-50%); }
        .servicios-lista .izquierda .lista-servicios .servicio a {
          color: #f02d3a; }
        .servicios-lista .izquierda .lista-servicios .servicio:hover:after {
          width: 100%; }
    .servicios-lista .izquierda .btn-servicios {
      background-color: #f02d3a;
      padding: 1rem 1.7rem;
      color: #f7f7f7;
      font-weight: 700;
      transition: all .2s;
      text-transform: uppercase; }
      .servicios-lista .izquierda .btn-servicios:hover {
        background-color: #be1e2d; }
  .servicios-lista .derecha {
    background-image: url("../img/imagen1.jpg");
    background-size: cover;
    background-position: center;
    padding: 5rem;
    text-align: center;
    position: relative;
    flex: 1; }
    .servicios-lista .derecha .overlay {
      z-index: 1;
      position: absolute;
      width: 100%;
      height: 100%;
      top: 0;
      left: 0;
      background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)); }
    .servicios-lista .derecha .cajatexto {
      z-index: 2;
      position: absolute;
      right: 2rem;
      bottom: 2rem;
      padding: 2rem;
      max-width: 75%;
      background-color: rgba(0, 0, 0, 0.6); }
      .servicios-lista .derecha .cajatexto h1.servicios {
        font-weight: 900;
        font-size: 2rem;
        color: #f7f7f7;
        text-transform: uppercase;
        margin-bottom: 1.2rem;
        text-align: left; }
      .servicios-lista .derecha .cajatexto p.descripcion {
        color: #f7f7f7;
        text-align: left;
        line-height: 1.5;
        margin-bottom: 1.5rem; }
      .servicios-lista .derecha .cajatexto .botonera {
        display: flex; }
        .servicios-lista .derecha .cajatexto .botonera .btn-contacto {
          padding: .6rem 1.2rem;
          display: flex;
          align-items: center;
          background-color: #be1e2d;
          border: solid 1px #be1e2d;
          transition: all .2s;
          text-transform: uppercase;
          color: #f7f7f7;
          margin-right: 1.7rem;
          font-weight: 700;
          font-size: 90%; }
          .servicios-lista .derecha .cajatexto .botonera .btn-contacto:hover {
            background-color: #f02d3a;
            border-color: #f02d3a; }
        .servicios-lista .derecha .cajatexto .botonera .btn-leermas {
          padding: 1rem 1.7rem;
          background-color: transparent;
          border: solid 1px #f7f7f7;
          transition: all .2s;
          text-transform: uppercase;
          color: #f7f7f7;
          font-weight: 700;
          display: flex;
          align-items: center;
          font-size: 90%; }
          .servicios-lista .derecha .cajatexto .botonera .btn-leermas:hover {
            background-color: #f02d3a;
            border-color: #f02d3a; }

.servicios-lista--1 {
  border-bottom: 8px solid white; }

.servicios-lista--2 {
  border-bottom: solid 8px #f7f7f7; }
  .servicios-lista--2 .derecha {
    background-image: url("../img/negocios.jpg");
    order: 1; }
    @media only screen and (max-width: 37.5em) {
      .servicios-lista--2 .derecha {
        order: 2; } }
    .servicios-lista--2 .derecha .cajatexto {
      left: 2rem;
      right: unset; }
  .servicios-lista--2 .izquierda {
    background-color: #d6de23;
    order: 2; }
    @media only screen and (max-width: 37.5em) {
      .servicios-lista--2 .izquierda {
        order: 1; } }

.servicios-lista--3 {
  border-bottom: solid 8px #f7f7f7; }
  .servicios-lista--3 .izquierda {
    background-color: #2364aa; }
    .servicios-lista--3 .izquierda .titulo {
      color: #f7f7f7; }
    .servicios-lista--3 .izquierda .lista-servicios .servicio:after {
      background-color: #f7f7f7; }
    .servicios-lista--3 .izquierda .lista-servicios .servicio a {
      color: #f7f7f7; }
  .servicios-lista--3 .derecha {
    background-image: url("../img/arquitecto.jpg"); }

.servicios-lista--4 {
  border-bottom: solid 8px #f7f7f7; }
  .servicios-lista--4 .derecha {
    order: 1;
    background-image: url("../img/bombillo.jpg"); }
    @media only screen and (max-width: 37.5em) {
      .servicios-lista--4 .derecha {
        order: 2; } }
    .servicios-lista--4 .derecha .cajatexto {
      left: 2rem;
      right: unset; }
  .servicios-lista--4 .izquierda {
    order: 2; }
    @media only screen and (max-width: 37.5em) {
      .servicios-lista--4 .izquierda {
        order: 1; } }

a.contactenos {
  position: fixed;
  height: 60px;
  width: 60px;
  bottom: 2rem;
  right: 2rem;
  overflow: hidden;
  border: 3px solid white;
  box-shadow: 0 5px 5px rgba(0, 0, 0, 0.5);
  border-radius: 3000px;
  z-index: 10; }
  a.contactenos img {
    width: 100%;
    height: 100%; }

.navigation__item--attention a {
  background-color: #f02d3a;
  padding: .7rem 2rem;
  display: flex;
  background-color: #f02d3a;
  text-shadow: none;
  box-shadow: 0 2px 3px rgba(0, 0, 0, 0.2);
  transition: all .2s; }
  .navigation__item--attention a:hover {
    background-color: #be1e2d;
    color: #ffffff; }

.scrolled .navigation__item--attention a {
  color: white !important; }

.navigation__item--has-submenu {
  position: relative; }
  @media only screen and (max-width: 37.5em) {
    .navigation__item--has-submenu.open:after {
      transform: rotate(180deg);
      top: 35%; }
    .navigation__item--has-submenu:after {
      width: 0;
      height: 0;
      border-left: 5px solid transparent;
      border-right: 5px solid transparent;
      border-top: 5px solid #9197ae;
      position: absolute;
      top: 50%;
      transform: translateY(-50%) rotate(0deg);
      left: 108%;
      content: "";
      transition: all .2s; } }

.btn-cta--vivo {
  position: relative; }
  .btn-cta--vivo:before {
    content: '•';
    font-size: 2.3rem;
    position: relative;
    top: .15rem;
    line-height: 0;
    margin-right: .3rem; }

.header--page {
  height: 40rem; }
  @media only screen and (max-width: 37.5em) {
    .header--page {
      height: 60rem; } }
  .header--page .header__logo-box {
    top: 2rem;
    width: 7.8rem; }
    @media only screen and (max-width: 56.25em) {
      .header--page .header__logo-box {
        left: 5rem;
        top: 5rem; } }
    @media only screen and (max-width: 37.5em) {
      .header--page .header__logo-box {
        left: 50%;
        transform: translateX(-50%); } }
  .header--page .header__text-box .titulo {
    border-bottom: none;
    color: #f7f7f7;
    font-size: 4.5rem;
    margin-bottom: 0; }
  .header--page .header__text-box .subtitulo {
    font-size: 3.9rem;
    color: #f7f7f7;
    font-weight: 400; }
  .header--page .header__text-box .fecha {
    color: #f7f7f7;
    margin-top: .5rem; }
  .header--page .header__text-box .tags {
    list-style-type: none;
    display: flex;
    margin-top: .8rem; }
    @media only screen and (max-width: 37.5em) {
      .header--page .header__text-box .tags {
        justify-content: center; } }
    .header--page .header__text-box .tags .tag {
      margin-right: .5rem; }
      .header--page .header__text-box .tags .tag:not(:last-child):after {
        content: "/";
        color: #86ddfc;
        margin-left: .6rem; }
      .header--page .header__text-box .tags .tag a {
        color: #86ddfc;
        display: inline-block;
        position: relative; }
        .header--page .header__text-box .tags .tag a:hover {
          color: #f7f7f7; }
  .header--page .header__redes .linea {
    height: 8rem; }
    @media only screen and (max-width: 37.5em) {
      .header--page .header__redes .linea {
        display: none; } }