.outfit-<uniquifier> {
  font-family: "Outfit", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
} 

/*-- @font-face {
  font-family: 'Outfit';
  src: url(../fonts/static/Outfit-Bold.ttf);
  font-weight: bold;
  font-size: bold;
}

@font-face {
  font-family: 'Outfit';
  src: url(../fonts/static/Outfit-Regular.ttf);
  font-weight: normal;
  font-size: normal;
} --*/

.estilo-none {
  text-decoration: none;
  color: gray;
}

body {
  background: #0f0d0d;
}

.bg-red {
  background: #d32f2f;
}

.bg-gray {
  background: #141111;
}

@keyframes subrayado-jump {
  0% {
    top: 370px;
  }
  50% {
    top: 360px;
  }
  100% {
    top: 370px;
  }
}


/*--- MENU TOP ---*/
/*--- MENU TOP ---*/
/*--- MENU TOP ---*/

.menu-top {
  position: relative;
  height: 60px;
  background: #0f0d0d;
}

.contenedor-logo-menu {
  height: 60px;
  text-align: center;
  justify-content: center;
  align-items: center;
}

.boton-menu-top {
  height: 60px;
  text-align: center;
}

.logo-menu {
  width: 100px;
}

.menu-top p {
  font-family: "Outfit", sans-serif;
    font-size: 17px;
    font-weight: 300;
    line-height: 20px;
    color: white;
    margin: 19px 0 0 0;
}


/*--- HEADER ---*/
/*--- HEADER ---*/
/*--- HEADER ---*/

.sec-header {
  position: relative;
  height: 700px;
  overflow: hidden;
}

.h1-header {
  position: relative;
    text-align: center;
}

.contenedor-h1 {
  position: absolute;
  top: 20%;
  left: 50%;
  width: 600px;
  margin: 220px -300px 0 -300px;
}

.h1-header h1 {
    color: white;
    font-family: "Outfit", sans-serif;
    font-size: 58px;
    font-weight: 720;
    line-height: 68px;
    letter-spacing: 1px;
    z-index: 10;
}

.subrayado-texto {
  position: absolute;
  width: 260px;
  left: 47%;
  /*top: 366px;*/
  z-index: -5;
  animation-name: subrayado-jump;
  animation-duration: 3s;
  animation-iteration-count: infinite;
}

.separadorpico {
  position: absolute;
  width: 100px;
  left: 50%;
  top: 100%;
  margin: 650px 0 0 -50px;
  z-index: -5;
}

.botonabajo {
  position: absolute;
  width: 50px;
  left: 50%;
  top: 100%;
  margin: 550px 0 0 -25px;
  z-index: 5;
}

.bg-header {
  height: 700px;
  display: flex;
  align-items: center;
}

.videoheader {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background-size: cover;
  object-fit: cover;
  z-index: -10;
}


/* --- SECCION 3 COLUMNAS --- */

.sec-tres-columnas {
  position: relative;
}

.columna-de-tres {
  text-align: center;
  color: white;
  font-family: "Outfit", sans-serif;
  padding: 200px 28px 200px 28px;
}

.columna-de-tres h2 {
  font-weight: 600;
  font-size: 24px;
  letter-spacing: 1px;
}

.columna-de-tres p {
  font-weight: 320;
  font-size: 18px;
  letter-spacing: 1px;
}

.contenedor-imagen {
  margin: 54px 0 54px 0;
  height: 116px;
}

.columna-de-tres img {
  height: 100%;
}

.columna-de-tres img:hover {
  filter: drop-shadow(0px 2px 0px #FFF) drop-shadow(2px -2px 0.4px #FFF)
  drop-shadow(2px 0px 0px #FFF) drop-shadow(2px 2px 0.4px #FFF)
  drop-shadow(0px -2px 0px #FFF) drop-shadow(-2px 2px 0.4px #FFF)
  drop-shadow(-2px 0px 0px #FFF) drop-shadow(-2px -2px 0.4px #FFF)
}


/* --- SECCION SERVICIOS --- */

.sec-servicios {
  position: relative;
  font-family: "Outfit", sans-serif;
  text-align: center;
  color: white;
  padding: 86px 0 0 0;
  margin-bottom: -190px;
}

.sec-servicios h2 {
  font-weight: 660;
  font-size: 48px;
  letter-spacing: 1px;
  margin: 0 0 90px 0;
}

.label-servicio {
  position: relative;
  background: #0f0d0d;
  align-items: center;
  align-content: center;
  border-radius: 18px 18px 18px 18px;
  margin: 0 0 72px 0;
}

.icono-servicio {
  position: absolute;
  width: 110px;
  height: 110px;
  top: 0;
  left: 50%;
  margin: -55px 0 0 -55px;
  background: white;
  border-radius: 50%;
}

.icono-servicio img {
  width: 100%;
}

.label-servicio h2 {
  font-weight: 600;
  font-size: 20px;
  letter-spacing: 1px;
  margin: 70px 0 20px 0;
}

.label-descripcion-servicio {
  background: white;
  padding: 20px 22px 12px 22px;
  border-radius: 0 0 18px 18px;
}

.label-descripcion-servicio p {
  color: #0f0d0d;
  font-weight: 280;
  line-height: 20px;
}

.bg-red img {
  width: 100%;
  margin: 0;
  padding: 0;
}


/* --- SECCION TALENTOS --- */

.sec-talentos {
  position: relative;
  text-align: center;
}

.col-talentos {
  position: relative;
  font-family: "Outfit", sans-serif;
  text-align: center;
  color: white;
}

.foto-talento {
  position: relative;
  border-radius: 15px;
  height: 270px;
  width: 160px;
  top: 0;
  left: 50%;
  margin: 0 0 0 -80px;
  padding: 0;
  overflow: hidden;
}

.cuadrado-estilo {
  position: absolute;
  width: 190px;
  height: 26px;
  left: 50%;
  top: 100%;
  margin: -192px 0 0 -95px;
  background: #d32f2f;
}

.p-talento {
  font-size: 22px;
  font-weight: 620;
  letter-spacing: 1px;
  margin: -4px 0 0 0;
}

.p-talento2 {
  font-size: 18px;
  font-weight: 400;
  letter-spacing: 0.5px;
  margin: 16px 0 0 0;
  color: white;
}

.p-seguidores {
  font-size: 42px;
  font-weight: 760;
  letter-spacing: 1px;
  margin: 2px 0 0 0;
}

.p-textoseguidores {
  font-size: 15px;
  font-weight: 240;
  letter-spacing: 1px;
  margin: -8px 0 0 0;
}

.iconos-redes {
  position: relative;
  justify-content: center;
  padding: 11px 0 0 0;
  margin: 0 0 42px 0;
}

.icono-red {
  width: 54px;
}



.h2-talentos h2 {
    font-family: "Outfit", sans-serif;
  text-align: center;
  color: white;
  font-size: 56px;
  font-weight: 720;
  letter-spacing: 1px;
  margin: 112px 0 52px 0;
}

.h2-talentos img {
  position: absolute;
  width: 210px;
  left: 52.5%;
  top: 128px;
  z-index: -5;
}

.botonderecha {
  position: relative;
  width: 70px;
  left: 50%;
  top: 0;
  margin: 8px 0 60px -35px;
  z-index: 5;
}

/*--------------- SECCION CONTACTO -------------------*/

.sec-contacto {
  position: relative;
  font-family: "Outfit", sans-serif;
  text-align: center;
  padding: 120px 0 120px 0;
}

.col-contacto {
  position: relative;
}

.h2-contacto {
  position: absolute;
  top: -38px;
  left: 50%;
  margin: 0 0 0 -168px;
  font-size: 56px;
  font-weight: 680;
  letter-spacing: 1px;
  color: white;
}

.label-contacto {
  background: #0f0d0d;
  border-radius: 15px;
  padding: 60px 140px 60px 140px;
}

.boton-enviar {
  margin-top: 15px;
  width: 100%;
  height: 44px;
  background: #d32f2f;
  border: solid 1px  #d32f2f;
}

.boton-enviar::hover {
  background: #e02846;
  border: solid 1px  #e02846;
}


/*--------------- FOOTER -------------------*/

.sec-footer {
  position: relative;
  font-family: "Outfit", sans-serif;
}

.estilo-footer {
  padding: 120px 0 20px 0;
}

.footer-left {
  text-align: left;
  color: #848484;
  font-size: 14px;
  letter-spacing: 1px;
  line-height: 18px;
}

.footer-right {
  text-align: right;
  color: white;
  font-size: 14px;
  letter-spacing: 1px;
  line-height: 18px;
}









/*--------------- RESPONSIVEEEEEEEEEEE -------------------*/
/*--------------- RESPONSIVEEEEEEEEEEE -------------------*/
/*--------------- RESPONSIVEEEEEEEEEEE -------------------*/
/*--------------- RESPONSIVEEEEEEEEEEE -------------------*/
/*--------------- RESPONSIVEEEEEEEEEEE -------------------*/
/*--------------- RESPONSIVEEEEEEEEEEE -------------------*/


@media (max-width: 1550px) {
  .subrayado-texto {
    left: 46%;
  }

}


@media (max-width: 1200px) {
  .subrayado-texto {
    left: 45%;
  }

  /* SECCION TALENTOS */
  .cuadrado-estilo {
    position: absolute;
    width: 160px;
    height: 26px;
    left: 50%;
    top: 100%;
    margin: -260px 0 0 -80px;
    background: #d32f2f;
  }

  .foto-talento {
    position: relative;
    border-radius: 15px;
    height: 270px;
    width: 150px;
    top: 0;
    left: 50%;
    margin: 0 0 0 -75px;
    padding: 0;
    overflow: hidden;
  }

  .h2-talentos img {
    position: absolute;
    width: 210px;
    left: 53%;
    top: 128px;
    z-index: -5;
  }

  .p-talento {
    font-size: 18px;
    font-weight: 620;
    letter-spacing: 0.5px;
    margin: 0 0 0 0;
  }

  /* SECCION CONTACTO */
  .label-contacto {
    background: #0f0d0d;
    border-radius: 15px;
    padding: 60px 90px 60px 90px;
  }
}


@media (max-width: 1110px) {
  .subrayado-texto {
    left: 44%;
  }

  .h2-talentos img {
    position: absolute;
    width: 210px;
    left: 54%;
    top: 128px;
    z-index: -5;
  }

  .label-contacto {
    background: #0f0d0d;
    border-radius: 15px;
    padding: 60px 90px 60px 90px;
  }
}


/*--------------- MOVIL -------------------*/
/*--------------- MOVIL -------------------*/

@media (max-width: 992px) and (orientation: landscape) {

  .contenedor-h1 {
    position: absolute;
    top: 20%;
    left: 50%;
    width: 100%;
    margin: 220px -100px 0 -50%;
  }

  .h1-header h1 {
      color: white;
      font-family: "Outfit", sans-serif;
      font-size: 38px;
      font-weight: 720;
      line-height: 64px;
      letter-spacing: 1px;
      z-index: 10;
  }

  .subrayado-texto {
    position: absolute;
    width: 176px;
    left: 40%;
    /*top: 366px;*/
    z-index: -5;
    animation-name: subrayado-jump;
    animation-duration: 3s;
    animation-iteration-count: infinite;
  }

  /*----------- SECCION 3 COLUMNAS ----------*/

  .columna-de-tres {
    text-align: center;
    color: white;
    font-family: "Outfit", sans-serif;
    padding: 80px 28px 80px 28px;
  }

  .sec-servicios {
    position: relative;
    font-family: "Outfit", sans-serif;
    text-align: center;
    color: white;
    padding: 86px 20px 120px 20px;
    margin-bottom: -240px;
  }

  .sec-servicios h2 {
    font-weight: 660;
    font-size: 32px;
    letter-spacing: 1px;
    margin: 0 0 90px 0;
  }

  .label-servicio h2 {
    font-weight: 600;
    font-size: 20px;
    letter-spacing: 1px;
    margin: 72px 0 20px 0;
  }

  /* ------------- SECCION TALENTOS ---------- */

  .foto-talento {
    position: relative;
    border-radius: 15px;
    height: 270px;
    width: 160px;
    top: 0;
    left: 50%;
    margin: 0 0 0 -80px;
    padding: 0;
    overflow: hidden;
  }

  .cuadrado-estilo {
    position: absolute;
    width: 190px;
    height: 26px;
    left: 50%;
    top: 100%;
    margin: -200px 0 0 -95px;
    background: #d32f2f;
  }

  .p-talento {
    font-size: 22px;
    font-weight: 620;
    letter-spacing: 1px;
    margin: -4px 0 0 0;
  }

  .h2-talentos img {
    position: absolute;
    width: 210px;
    left: 50%;
    top: 132px;
    margin: 0 0 0 35px;
    z-index: -5;
  }

  /* ------------ SECCION CONTACTO ----------*/

  .label-contacto {
    background: #0f0d0d;
    border-radius: 15px;
    padding: 60px 40px 60px 40px;
  }


  /* ------------ FOOTER ----------*/

  .footer-left {
    text-align: center;
    color: #848484;
    font-size: 14px;
    letter-spacing: 1px;
    line-height: 17px;
  }

  .footer-right {
    text-align: center;
    color: white;
    font-size: 14px;
    letter-spacing: 1px;
    line-height: 17px;
  }

}

@media (max-width: 768px) and (orientation: portrait) {

  .contenedor-h1 {
    position: absolute;
    top: 20%;
    left: 50%;
    width: 100%;
    margin: 220px -100px 0 -50%;
  }

  .h1-header h1 {
      color: white;
      font-family: "Outfit", sans-serif;
      font-size: 38px;
      font-weight: 720;
      line-height: 64px;
      letter-spacing: 1px;
      z-index: 10;
  }

  .subrayado-texto {
    position: absolute;
    width: 176px;
    left: 40%;
    /*top: 366px;*/
    z-index: -5;
    animation-name: subrayado-jump;
    animation-duration: 3s;
    animation-iteration-count: infinite;
  }

  /*----------- SECCION 3 COLUMNAS ----------*/

  .columna-de-tres {
    text-align: center;
    color: white;
    font-family: "Outfit", sans-serif;
    padding: 80px 28px 80px 28px;
  }

  .sec-servicios {
    position: relative;
    font-family: "Outfit", sans-serif;
    text-align: center;
    color: white;
    padding: 86px 20px 120px 20px;
    margin-bottom: -240px;
  }

  .sec-servicios h2 {
    font-weight: 660;
    font-size: 32px;
    letter-spacing: 1px;
    margin: 0 0 90px 0;
  }

  .label-servicio h2 {
    font-weight: 600;
    font-size: 20px;
    letter-spacing: 1px;
    margin: 72px 0 20px 0;
  }

  /* ------------- SECCION TALENTOS ---------- */


  .foto-talento {
    position: relative;
    border-radius: 15px;
    height: 270px;
    width: 160px;
    top: 0;
    left: 50%;
    margin: 0 0 0 -80px;
    padding: 0;
    overflow: hidden;
  }

  .cuadrado-estilo {
    position: absolute;
    width: 190px;
    height: 26px;
    left: 50%;
    top: 100%;
    margin: -200px 0 0 -95px;
    background: #d32f2f;
  }

  .p-talento {
    font-size: 22px;
    font-weight: 620;
    letter-spacing: 1px;
    margin: -4px 0 0 0;
  }

  .h2-talentos h2 {
    font-family: "Outfit", sans-serif;
    text-align: center;
    color: white;
    font-size: 48px;
    font-weight: 720;
    letter-spacing: 1px;
    margin: 112px 0 52px 0;
  }

  .h2-talentos img {
    position: absolute;
    width: 210px;
    left: 50%;
    top: 192px;
    margin: -10px 0 0 -105px;
    z-index: -5;
  }

  /* ------------ SECCION CONTACTO ----------*/

  .label-contacto {
    background: #0f0d0d;
    border-radius: 15px;
    padding: 60px 40px 60px 40px;
  }


  /* ------------ FOOTER ----------*/

  .footer-left {
    text-align: center;
    color: #848484;
    font-size: 14px;
    letter-spacing: 1px;
    line-height: 19px;
  }

  .footer-right {
    text-align: center;
    color: white;
    font-size: 14px;
    letter-spacing: 1px;
    line-height: 19px;
  }

}