/* ----------------------------------------------------------------------------------------------------------------------------------  */
/* Variables */
/* ----------------------------------------------------------------------------------------------------------------------------------  */
:root {
  /* Colores */
  --secondary-main-color: #00b6ca;
  --main-color: #062847;
  --contrast-main-color: #ecc22c;
  --background-color: #ffffff;
  --background-color-dark: #000000;
  --texto-white: #ffffff;
  --texto-parrados: #56545b;
  --texto-black: #000000;
  --footer-background: #61676f;
  --nav-colors: linear-gradient(
    to right,
    #062847 0%,
    #062847 50%,
    #00a95e 80%,
    #00a95e 100%
  );    
  --nav-colors-inverso: linear-gradient(
    to left,
    #062847 0%,
    #062847 20%,
    #062847 40%,
    #006bca 60%,
    #006bca 80%,
    #006bca 100%
  );
  --logo-colors: linear-gradient(
    to right,
    #00a95e 0%,
    #00a95e 20%,
    #00a971 40%,
    #00959c 60%,
    #0072c2 80%,
    #006bca 100%
  );
  /* Textos */
  /* Fuente de texto */
  --fuente-texto: "Noto Sans", sans-serif;
  /* Titulos */
  --tamaño-titulos: 40px;
  --tamaño-titulos-responsive: 24px;
  --word-spacing-titulos: 1px;
  --grosor-titulos: bold;
  /* Párrafos */
  --tamaño-parrafos: 16px;
  --tamaño-parrafos-responsive: 13px;
  --word-spacing-parrafos: 2px;
  --grosor-parrafos: 500;
  /* Transiciones */
  --duración-de-transiciones: 300ms;
  --duración-de-transiciones-lentas: 400ms;
}
/* ----------------------------------------------------------------------------------------------------------------------------------  */
/* <!-- Primera seccion  --> */
/* ----------------------------------------------------------------------------------------------------------------------------------  */
.contenedor-imagen-inico {
  margin-top: 70px;
  position: relative;
  width: 100%;
}

.contenedor-imagen-inico img {
  width: 100%;
  height: auto;
}

@media (max-width: 768px) {
  .contenedor-imagen-inico {
    margin-top: 70px;
  }
}
/* ----------------------------------------------------------------------------------------------------------------------------------  */
/* <!-- Segunda seccion  --> */
/* ----------------------------------------------------------------------------------------------------------------------------------  */
.contenedor-servicios {
  background-color: var(--background-color);
  padding: 50px 30px;
  justify-content: center;
  align-items: center;
  box-shadow: 0px 1px 2px 0px rgba(35, 35, 35, 0.5);
  margin-bottom: 5px;
}
/* ---------------------------------------------------------- */
/* Sección para 4 */
/* ---------------------------------------------------------- */
.section-servicios-efecto-para4 {
  background-color: var(--background-color);
  display: flex;
  width: 70%;
  margin: auto;
  text-align: center;
  justify-content: center;
  align-items: stretch;
}

.section-servicios-efecto-para4 .carta-servicio-main {
  margin-left: 1px;
  width: 0;
  max-height: 100%;
  flex-grow: 1;
  object-fit: cover;
  opacity: 0.9;
  transition: all var(--duración-de-transiciones-lentas) ease;
  border-left: 1px solid var(--background-color-dark);
  border-bottom: 1px solid var(--background-color-dark);
}

.section-servicios-efecto-para4 .carta-servicio-main:hover {
  cursor: default;
  width: 25vmax;
  opacity: 1;
  filter: contrast(120%);
  filter: contrast(120%);
}

.section-servicios-efecto-para4:hover .carta-servicio-main:not(:hover) {
  opacity: 0.4;
  border-bottom: 1px solid transparent;
}

/* Cartas */
.section-servicios-efecto-para4 .carta-servicio-main img {
  width: 100%;
  height: auto;
  border-radius: 2px;
}

.section-servicios-efecto-para4 .carta-servicio-main p {
  font-family: var(--fuente-texto);
  font-size: 14px;
  font-weight: 500;
  text-align: justify;
  padding-left: 5px;
  word-spacing: 2px;
  margin: auto;
}

.section-servicios-efecto-para4 .carta-servicio-main a {
  font-family: var(--fuente-texto);
  font-size: 14px;
  font-weight: 600;
  text-align: center;
  word-spacing: 2px;
  text-decoration: none;
  color: var(--main-color);
  display: flex;
  align-items: center;
  margin: auto;
}

.section-servicios-efecto-para4 .carta-servicio-main a:hover {
  color: var(--secondary-main-color);
}

.section-servicios-efecto-para4 .carta-servicio-main .palabra-main {
  text-decoration: none;
  padding-right: 1px;
  transition: all 400ms ease;
}

.section-servicios-efecto-para4 .carta-servicio-main .palabra-main:hover {
  padding-right: 6px;
  transition: all 400ms ease;
}

.efecto-flecha-main {
  display: flex;
  align-items: flex-end;
  margin: auto;
}

.efecto-flecha-main .flecha-main:hover {
  padding-left: 6px;
  transition: all 400ms ease;
}

/* Titulos, subtitulos y texto */
.contenedor-servicios .titulo-servicio-principal {
  text-align: center;
  font-family: var(--fuente-texto);
  font-size: var(--tamaño-titulos);
  font-weight: bold;
  letter-spacing: 1px;
}

.contenedor-servicios .texto-descripcion-servicios,
.contenedor-servicios .titulo-subarea-servicio,
.contenedor-servicios .subtitulo-subarea-servicio {
  text-align: center;
  font-family: var(--fuente-texto);
  font-weight: bold;
  letter-spacing: 1px;
}

@media (max-width: 768px) {
  .section-servicios-efecto-para4 {
    width: 90%;
  }
  .section-servicios-efecto-para4 .carta-servicio-main h3 {
    font-size: 14px;
  }
  .section-servicios-efecto-para4 .carta-servicio-main p {
    font-size: 12px;
  }

  .section-servicios-efecto-para4 .carta-servicio-main a {
    font-size: 12px;
  }
}

/* ---------------------------------------------------------- */
/* Sección para 3 */
/* ---------------------------------------------------------- */
.section-servicios-efecto-para3 {
  background-color: var(--background-color);
  display: flex;
  width: 60%;
  margin: auto;
  text-align: center;
  justify-content: center;
  align-items: stretch;
}

.section-servicios-efecto-para3 .carta-servicio-main {
  margin-left: 1px;
  width: 0;
  max-height: 100%;
  flex-grow: 1;
  object-fit: cover;
  opacity: 0.9;
  transition: all 400ms ease;
  border-left: 1px solid var(--background-color-dark);
  border-bottom: 1px solid var(--background-color-dark);
}

.section-servicios-efecto-para3 .carta-servicio-main:hover {
  cursor: default;
  width: 25vmax;
  opacity: 1;
  filter: contrast(120%);
  filter: contrast(120%);
}

.section-servicios-efecto-para3:hover .carta-servicio-main:not(:hover) {
  opacity: 0.4;
  border-bottom: 1px solid transparent;
}

/* Cartas */

.section-servicios-efecto-para3 .carta-servicio-main img {
  width: 100%;
  height: auto;
  border-radius: 2px;
}

.section-servicios-efecto-para3 .carta-servicio-main p {
  font-family: var(--fuente-texto);
  font-size: 14px;
  font-weight: 500;
  text-align: justify;
  padding-left: 5px;
  word-spacing: 2px;
  margin: auto;
}

.section-servicios-efecto-para3 .carta-servicio-main a {
  font-family: var(--fuente-texto);
  font-size: 14px;
  font-weight: 600;
  text-align: center;
  word-spacing: 2px;
  text-decoration: none;
  color: var(--main-color);
  display: flex;
  align-items: center;
  margin: auto;
}

.section-servicios-efecto-para3 .carta-servicio-main a:hover {
  color: var(--secondary-main-color);
}

.section-servicios-efecto-para3 .carta-servicio-main .palabra-main {
  text-decoration: none;
  padding-right: 1px;
  transition: all 400ms ease;
}

.section-servicios-efecto-para3 .carta-servicio-main .palabra-main:hover {
  padding-right: 6px;
  transition: all 400ms ease;
}

.efecto-flecha-main {
  display: flex;
  align-items: flex-end;
  margin: auto;
}

.efecto-flecha-main .flecha-main:hover {
  padding-left: 6px;
  transition: all 400ms ease;
}

/* Titulos, subtitulos y texto */
.contenedor-servicios .titulo-servicio-principal {
  text-align: center;
  font-family: var(--fuente-texto);
  font-size: var(--tamaño-titulos);
  font-weight: bold;
  letter-spacing: 1px;
}

.contenedor-servicios .texto-descripcion-servicios,
.contenedor-servicios .titulo-subarea-servicio,
.contenedor-servicios .subtitulo-subarea-servicio {
  text-align: center;
  font-family: var(--fuente-texto);
  font-weight: bold;
  letter-spacing: 1px;
}

@media (max-width: 768px) {
  .section-servicios-efecto-para3 {
    width: 90%;
  }
  .section-servicios-efecto-para3 .carta-servicio-main h3 {
    font-size: 14px;
  }
  .section-servicios-efecto-para3 .carta-servicio-main p {
    font-size: 12px;
  }

  .section-servicios-efecto-para3 .carta-servicio-main a {
    font-size: 12px;
  }
}

/* ---------------------------------------------------------- */
/* Sección para 2 */
/* ---------------------------------------------------------- */
.section-servicios-efecto-para2 {
  background-color: var(--background-color);
  display: flex;
  width: 50%;
  margin: auto;
  text-align: center;
  justify-content: center;
  align-items: stretch;
  padding-left: 2px;
}

.section-servicios-efecto-para2 .carta-servicio-main {
  margin-left: 1px;
  width: 0;
  max-height: 100%;
  flex-grow: 1;
  object-fit: cover;
  opacity: 0.9;
  transition: all 400ms ease;
  border-left: 1px solid var(--background-color-dark);
  border-bottom: 1px solid var(--background-color-dark);
}

.section-servicios-efecto-para2 .carta-servicio-main:hover {
  width: 25vmax;
  cursor: default;
  opacity: 1;
  filter: contrast(120%);
  filter: contrast(120%);
}

.section-servicios-efecto-para2:hover .carta-servicio-main:not(:hover) {
  opacity: 0.4;
  border-bottom: 1px solid transparent;
}

.section-servicios-efecto-para2 .carta-servicio-main img {
  width: 100%;
  height: auto;
  border-radius: 2px;
}

.section-servicios-efecto-para2 .carta-servicio-main p {
  font-family: var(--fuente-texto);
  font-size: 14px;
  font-weight: 500;
  text-align: justify;
  padding-left: 5px;
  word-spacing: 2px;
  margin: auto;
}

.section-servicios-efecto-para2 .carta-servicio-main a {
  font-family: var(--fuente-texto);
  font-size: 14px;
  font-weight: 600;
  text-align: center;
  word-spacing: 2px;
  text-decoration: none;
  color: var(--main-color);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: auto;
}

.section-servicios-efecto-para2 .carta-servicio-main a:hover {
  color: var(--secondary-main-color);
}

.section-servicios-efecto-para2 .carta-servicio-main .palabra-main {
  text-decoration: none;
  padding-right: 1px;
  transition: all 400ms ease;
}

.section-servicios-efecto-para2 .carta-servicio-main .palabra-main:hover {
  padding-right: 6px;
  transition: all 400ms ease;
}

.efecto-flecha-main {
  position: relative;
  display: flex;
  margin: auto;
  bottom: 0;
}

.efecto-flecha-main .flecha-main:hover {
  padding-left: 6px;
  transition: all 400ms ease;
}

@media (max-width: 768px) {
  .section-servicios-efecto-para2 {
    width: 90%;
  }
  .section-servicios-efecto-para2 .carta-servicio-main h3 {
    font-size: 14px;
  }
  .section-servicios-efecto-para2 .carta-servicio-main p {
    font-size: 12px;
  }

  .section-servicios-efecto-para2 .carta-servicio-main a {
    font-size: 12px;
  }
}

/* ---------------------------------------------------------- */
/* Sección para enlacer */
/* ---------------------------------------------------------- */
.section-servicios-efecto-enlaces {
  background-color: var(--background-color);
  display: flex;
  width: 90%;
  margin: auto;
  text-align: center;
  justify-content: center;
  align-items: stretch;
  padding: 0 5px;
  margin: auto;
}

.section-servicios-efecto-enlaces .carta-servicio-main {
  margin-left: 1px;
  width: 0;
  max-height: 100%;
  flex-grow: 1;
  object-fit: cover;
  opacity: 1;
  transition: all 400ms ease;
  border-left: 1px solid var(--background-color-dark);
  border-bottom: 1px solid var(--background-color-dark);
}

.section-servicios-efecto-enlaces .carta-servicio-main:hover {
  cursor: default;
  width: 25vmax;
  opacity: 1;
  filter: contrast(120%);
  filter: contrast(120%);
  border-bottom: 1px solid var(--background-color-dark);
}

.section-servicios-efecto-enlaces:hover .carta-servicio-main:not(:hover) {
  opacity: 0.4;
  border-bottom: 1px solid transparent;
}

.section-servicios-efecto-enlaces .carta-servicio-main img {
  width: 100%;
  height: auto;
  border-radius: 2px;
}

.section-servicios-efecto-enlaces .carta-servicio-main p {
  font-family: var(--fuente-texto);
  font-size: 14px;
  font-weight: 500;
  text-align: justify;
  padding-left: 5px;
  word-spacing: 2px;
  margin: auto;
}

.section-servicios-efecto-enlaces .carta-servicio-main a {
  font-family: var(--fuente-texto);
  font-size: 14px;
  font-weight: 600;
  text-align: center;
  word-spacing: 2px;
  text-decoration: none;
  color: var(--main-color);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: auto;
}

.section-servicios-efecto-enlaces .carta-servicio-main a:hover {
  color: var(--secondary-main-color);
}

.section-servicios-efecto-enlaces .carta-servicio-main .palabra-main {
  text-decoration: none;
  padding-right: 1px;
  transition: all 400ms ease;
}

.section-servicios-efecto-enlaces .carta-servicio-main .palabra-main:hover {
  padding-right: 6px;
  transition: all 400ms ease;
}

.efecto-flecha-main {
  position: relative;
  display: flex;
  margin: auto;
  bottom: 0;
}

.efecto-flecha-main .flecha-main:hover {
  padding-left: 6px;
  transition: all 400ms ease;
}

@media (max-width: 768px) {
  .section-servicios-efecto-enlaces {
    width: 90%;
  }
  .section-servicios-efecto-enlaces .carta-servicio-main h3 {
    font-size: 14px;
    text-align: center;
  }

  .section-servicios-efecto-enlaces .carta-servicio-main a {
    font-size: 12px;
  }
}

.contenedor-servicios .texto-descripcion-servicios {
  align-items: baseline;
  font-size: 14px;
  font-weight: 500;
  color: var(--texto-parrados);
  text-align: center;
  padding-left: 4vh;
  word-spacing: 2px;
}

.contenedor-servicios .titulo-subarea-servicio {
  text-align: center;
  font-family: var(--fuente-texto);
  font-size: 30px;
  font-weight: bold;
  letter-spacing: 1px;
  padding-top: 10px;
}

.contenedor-servicios .subtitulo-subarea-servicio {
  text-align: center;
  font-family: var(--fuente-texto);
  font-size: 30px;
  font-weight: bold;
  letter-spacing: 1px;
  padding-top: 20px;
}

/* Cartas Generales*/
.carta-servicio-main {
  width: 25vw;
  height: auto;
  margin: 5px;
  padding: 0;
  overflow: hidden;
  background-color: var(--background-color);
  border-radius: 2px;
}

.carta-servicio-main figure {
  width: 25vw;
  border-radius: 2px;
}

.contenido-carta-servicio-main {
  width: 25vw;
  object-fit: cover;
  overflow: hidden;
  background-color: var(--background-color);
  padding: 0 8px;
  padding-bottom: 5px;
}

.carta-servicio-main h3 {
  text-align: center;
  font-family: var(--fuente-texto);
  font-size: 20px;
  font-weight: bold;
  letter-spacing: 1px;
  margin: 10px 0;
}

/* Líneas divisores */
.linea-divisor-team-top2 {
  text-align: center;
  margin-top: 10px !important;
  width: 80%;
  height: 0.33px;
  background-color: var(--contrast-main-color);
  text-align: center;
  margin: auto;
}

.linea-divisor-team2 {
  background-color: var(--contrast-main-color);
  padding-bottom: 0.33px;
  margin-bottom: 10px;
  width: 90%;
  text-align: center;
  margin: auto;
  margin-bottom: 5px;
}

@media (max-width: 768px) {
  .linea-divisor-team-top2 {
    text-align: center;
    margin-top: 10px !important;
    width: 80%;
    margin: 0 auto;
    height: 0.33px;
    background-color: var(--contrast-main-color);
  }

  .linea-divisor-team2 {
    background-color: var(--contrast-main-color);
    padding-bottom: 0.33px;
    margin-bottom: 10px;
  }

  .contenedor-servicios .titulo-servicio-principal {
    font-size: var(--tamaño-titulos-responsive);
  }

  .contenedor-servicios .texto-descripcion-servicios {
    font-size: var(--tamaño-parrafos-responsive);
  }

  .contenedor-servicios .titulo-subarea-servicio {
    font-size: 20px;
  }

  .contenedor-servicios .subtitulo-subarea-servicio {
    font-size: 20px;
  }
  .carta-servicio-main {
    width: 55vw;
    height: auto;
    margin: 5px;
    padding: 0;
    overflow: hidden;
    background-color: var(--background-color);
    border-radius: 2px;
  }

  .carta-servicio-main figure {
    width: 55vw;
    border-radius: 2px;
  }

  .contenido-carta-servicio-main {
    width: 55vw;
    height: auto;
    overflow: hidden;
    background-color: var(--background-color);
    padding-bottom: 5px;
  }

  .carta-servicio-main h3 {
    text-align: left;
    font-family: var(--fuente-texto);
    font-size: 20px;
    font-weight: var(--grosor-titulos);
    letter-spacing: 1px;
    margin: 10px 0;
  }
}

/* ----------------------------------------------------------------------------------------------------------------------------------  */
/* Novedades */
/* ----------------------------------------------------------------------------------------------------------------------------------  */

.novedades {
  background-color: var(--background-color);
}

.novedades h1 {
  padding: 5px;
  text-align: center;
  font-family: var(--fuente-texto);
  font-size: var(--tamaño-titulos);
  font-weight: var(--grosor-titulos);
  letter-spacing: 1px;
}

.pdf {
  background-color: transparent;
  display: flex;
  width: 100%;
  padding-left: 2vw;
  padding-right: 2vw;
}

embed {
  height: 70vh;
  width: 50vw;
  margin: auto;
}

.pdf .texto_acompañante_pdf {
  margin: auto;
  padding: 10px;
  width: 50%;
  align-items: baseline;
  font-size: 22px;
  font-weight: 500;
  text-align: center;
  padding-left: 4vh;
  word-spacing: 2px;
  color: var(--texto-parrados);
}

@media (max-width: 768px) {
  .novedades h1 {
    font-size: 20px;
  }

  .pdf .texto_acompañante_pdf {
    margin: auto;
    padding: 10px;
    text-align: center;
    font-family: var(--fuente-texto);
    color: var(--texto-parrados);
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 1px;
    width: 100%;
  }
}

@media (max-width: 974px) {
  .pdf {
    flex-direction: column-reverse;
  }

  embed {
    width: 90vw;
    height: 400px;
  }
}