
:root {
  --black: #000000;
  --firefly: #112333;
  --mystic: #dfebf8;
  --piggy-pink: #feddec;
  --primaryblue: #2d7acf;
  --primarypink: #f92b89;
  --geyser: #d9dee5;
  --text--grey: #dadada;
  --textdark-grey: #8f8f8f;
  --textlight-grey: #f5f5f5;
  --textmain-color: #111111;
  --textwhite: #fdfdfd;
 
  --font-size-18px: 18px;
  --font-size-l: 48px;
  --font-size-m: 24px;
  --font-size-s: 16px;
  --font-size-xl: 64px;
  --font-size-xs: 14px;
  --font-size-xxs: 13px;
  --font-size-xxxs: 12px;
 
  --font-family-barlow: "Barlow", Helvetica;
  --font-family-barlow_condensed: "Barlow Condensed", Helvetica;
  --font-family-barlow_condensed-bold: "Barlow Condensed-Bold", Helvetica;
  --font-family-barlow_condensed-medium: "Barlow Condensed-Medium", Helvetica;
  --font-family-epilogue: "Epilogue", Helvetica;
  --font-family-open_sans: "Open Sans", Helvetica;
  --font-family-poppins: "Poppins", Helvetica;
  --font-family-raleway: "Raleway", Helvetica;
}

.back-negro{
  background-color: #000000;
}

.headingsh4 {
  font-family: var(--font-family-poppins);
  font-size: var(--font-size-18px);
  font-style: normal;
  font-weight: 600;
  letter-spacing: 0;
}

.bodyregular-xl {
  font-family: var(--font-family-poppins);
  font-size: var(--font-size-s);
  font-style: normal;
  font-weight: 500;
  letter-spacing: 0;
}

.bodyregular-s {
  font-family: var(--font-family-poppins);
  font-size: var(--font-size-xs);
  font-style: normal;
  font-weight: 500;
  letter-spacing: 0;
}

.bodyregular-l {
  font-family: var(--font-family-poppins);
  font-size: var(--font-size-s);
  font-style: normal;
  font-weight: 400;
  letter-spacing: 0;
}

.bodybold-m {
  font-family: var(--font-family-poppins);
  font-size: var(--font-size-s);
  font-style: normal;
  font-weight: 700;
  letter-spacing: 0;
}

.bodylight-xs {
  font-family: var(--font-family-poppins);
  font-size: var(--font-size-xs);
  font-style: normal;
  font-weight: 400;
  letter-spacing: 0;
}

.buttonm {
  font-family: var(--font-family-poppins);
  font-size: var(--font-size-xs);
  font-style: normal;
  font-weight: 700;
  letter-spacing: 0;
}

.font-barlow-semi-bold-24px {
  color: var(--textmain-color);
  font-family: var(--font-family-barlow_condensed);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 600;
}

.poppins-light-licorice-14px {
  color: var(--textmain-color);
  font-family: var(--font-family-poppins);
  font-size: var(--font-size-xs);
  font-style: normal;
  font-weight: 300;
}

.poppins-light-stack-16px {
  color: var(--textdark-grey);
  font-family: var(--font-family-poppins);
  font-size: var(--font-size-s);
  font-style: normal;
  font-weight: 300;
}

.poppins-semi-bold-licorice-16px {
  color: var(--textmain-color);
  font-family: var(--font-family-poppins);
  font-size: var(--font-size-s);
  font-style: normal;
  font-weight: 600;
}

.poppins-normal-white-13px {
  color: var(--textwhite);
  font-family: var(--font-family-poppins);
  font-size: var(--font-size-xxs);
  font-style: normal;
  font-weight: 400;
}

.barlowcondensed-semi-bold-mariner-16px {
  color: var(--primaryblue);
  font-family: var(--font-family-barlow_condensed);
  font-size: var(--font-size-s);
  font-style: normal;
  font-weight: 600;
}

.barlowcondensed-medium-cultured-pearl-24px {
  color: var(--textlight-grey);
  font-family: var(--font-family-barlow_condensed-medium);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 500;
}

.bodysmall-text {
  font-family: var(--font-family-poppins);
  font-size: var(--font-size-xs);
  font-style: normal;
  font-weight: 400;
  letter-spacing: 0;
}

.titulo_h1{
  letter-spacing: -0.96px;
  line-height: normal;
  position: relative;
  color: var(--textmain-color);
  font-family: var(--font-family-barlow_condensed);
  font-size: var(--font-size-l);
  font-style: normal;
  font-weight: 600;
  margin: 60px 0px 60px 0px;
}
.titulo_h2{
  letter-spacing: -0.96px;
  line-height: normal;
  position: relative;
  color: var(--textmain-color);
  font-family: var(--font-family-barlow_condensed);
  font-size: var(--font-size-l);
  font-style: normal;
  font-weight: 600;
  margin-bottom: 0px;
}

.barlowcondensed-semi-bold-violet-red-16px {
  color: var(--primarypink);
  font-family: var(--font-family-barlow_condensed);
  font-size: var(--font-size-s);
  font-style: normal;
  font-weight: 600;
}

.barlowcondensed-medium-white-24px {
  font-family: var(--font-family-barlow_condensed-medium);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 500;
}

.barlowcondensed-bold-white-24px {
  color: var(--textwhite);
  font-family: var(--font-family-barlow_condensed-bold);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 700;
}

.raleway-medium-white-14px {
  color: var(--textwhite);
  font-family: var(--font-family-raleway);
  font-size: var(--font-size-xs);
  font-style: normal;
  font-weight: 500;
}

.texto_banner_negrita {
  color: var(--textwhite);
  font-family: var(--font-family-barlow_condensed);
  font-size: var(--font-size-l);
  font-style: normal;
  font-weight: 600;
  letter-spacing: -0.96px;
  line-height: normal;
  margin-top: -1.00px;
  position: relative;
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.4);
}

.barlow-semi-bold-violet-red-16px {
  color: var(--primarypink);
  font-family: var(--font-family-barlow);
  font-size: var(--font-size-s);
  font-style: normal;
  font-weight: 600;
}


.pt-5 {
  padding-top: 5px !important;
}
.pt-10 {
  padding-top: 10px !important;
}
.pt-15 {
  padding-top: 15px !important;
}
.pt-20 {
  padding-top: 20px !important;
}
.pt-25 {
  padding-top: 25px !important;
}
.pt-30 {
  padding-top: 30px !important;
}
.pt-35 {
  padding-top: 35px !important;
}
.pt-40 {
  padding-top: 40px !important;
}

.pb-5 {
  padding-bottom: 5px !important;
}
.pb-10 {
  padding-bottom: 10px !important;
}
.pb-15 {
  padding-bottom: 15px !important;
}
.pb-20 {
  padding-bottom: 20px !important;
}
.pb-25 {
  padding-bottom: 25px !important;
}
.pb-30 {
  padding-bottom: 30px !important;
}
.pb-35 {
  padding-bottom: 35px !important;
}
.pb-40 {
  padding-bottom: 40px !important;
}


@media screen and (max-width: 768px){
  .movil-font-14px {
    font-size: var(--font-size-xs);
  }

  .titulo_h1{
    font-size: 40px;
    margin: 20px 0px 20px 0px;
  }


  .pt-5-xs {
    padding-top: 5px !important;
  }
  .pt-10-xs {
    padding-top: 10px !important;
  }
  .pt-15-xs {
    padding-top: 15px !important;
  }
  .pt-20-xs {
    padding-top: 20px !important;
  }
  .pt-25-xs {
    padding-top: 25px !important;
  }
  .pt-30-xs {
    padding-top: 30px !important;
  }
  .pt-35-xs {
    padding-top: 35px !important;
  }
  .pt-40-xs {
    padding-top: 40px !important;
  }

  .pb-5-xs {
    padding-bottom: 5px !important;
  }
  .pb-10-xs {
    padding-bottom: 10px !important;
  }
  .pb-15-xs {
    padding-bottom: 15px !important;
  }
  .pb-20-xs {
    padding-bottom: 20px !important;
  }
  .pb-25-xs {
    padding-bottom: 25px !important;
  }
  .pb-30-xs {
    padding-bottom: 30px !important;
  }
  .pb-35-xs {
    padding-bottom: 35px !important;
  }
  .pb-40-xs {
    padding-bottom: 40px !important;
  }
}

@media screen and (max-width: 540px){
  .titulo_h1{
    font-size: 32px;
  }
  .texto_banner_negrita {
    font-size: 30px;
  }
}
