:root {
  --black: #000000;
  --ebony-clay: #1e1e3b;
  --iron: #d4d5d5;
  --shark: #282828;
  --white: #ffffff;
  --white-2: #ffffff1a;
  --lavanda:#AEAECD;
  --red: #FF0000;
  --blue-grey: rgba(122, 122, 137, 1);

  --font-size-35_5px: 35.5px;
  --font-size-l: 26px;
  --font-size-m: 20px;
  --font-size-s: 15px;
  --font-size-xl: 36px;
  --font-size-xxl: 64px;
   --font-size-lvi: 46px;
  --font-size-xs: 11px;

  --font-family-bebas_neue: "Bebas Neue", Helvetica;
}

@media only screen and (max-device-width: 600px){
  :root{
    --font-size-35_5px: 70px;
    --font-size-l: 54px;
    --font-size-m: 40px;
    --font-size-s: 30px;
    --font-size-xl: 72px;
    --font-size-xxl: 128px;
    --font-size-lvi: 92px;
    --font-size-xs: 22px;
  }
}

.bebasneue-normal-black-46px {
  color: var(--black);
  font-family: var(--font-family-bebas_neue);
  font-size: var(--font-size-lvi);
  font-style: normal;
  font-weight: 400;
  letter-spacing: 5%;
  line-height: 100%
  fill: solid var(--black);
  text-shadow: 10% 0px, 10px
  rgba(14, 14, 44, 0.1);
}
.bebasneue-normal-white-46px {
  color: var(--white);
  font-family: var(--font-family-bebas_neue);
  font-size: var(--font-size-lvi);
  font-style: normal;
  font-weight: 400;
  letter-spacing: 5%;
  line-height: 100%
  fill: solid #ffffff;
  text-shadow: 10% 0px, 10px
  rgba(14, 14, 44, 0.1);
}

.bebasneue-normal-white-20px {
  color: var(--white);
  font-family: var(--font-family-bebas_neue);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 400;
}
.bebasneue-normal-white-64px {
  color: var(--white);
  font-family: var(--font-family-bebas_neue);
  font-size: var(--font-size-xxl);
  font-style: normal;
  font-weight: 400;
}

/* h2/name26 */
.bebasneue-normal-white-26px {
  color: var(--white);
  font-family: var(--font-family-bebas_neue);
  font-size: var(--font-size-l);
  font-style: normal;
  font-weight: 400;
  letter-spacing: 0.28em;
  line-height: 31px;
}

/* h2/mini name */
.bebasneue-normal-white-mini-name-20px {

  color: var(--lavanda);
  font-family: var(--font-family-bebas_neue);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 400;

}
/* h2/name26 */
.bebasneue-normal-black-26px {
  color: var(--black);
  font-family: var(--font-family-bebas_neue);
  font-size: var(--font-size-l);
  font-style: normal;
  font-weight: 400;
  letter-spacing: 0.28em;
  line-height: 32px;
}
.bebasneue-normal-white-15px {
  color: var(--white);
  font-family: var(--font-family-bebas_neue);
  font-size: var(--font-size-s);
  font-style: normal;
  line-height: 200%;
  font-weight: 400;
letter-spacing: 0.15em;
  text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.1);
}
.bebasneue-normal-black-20px {
  color: var(--black);
  font-family: var(--font-family-bebas_neue);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 400;
  font-family: Bebas Neue;
font-style: normal;
font-weight: normal;
font-size: 20px;
line-height: 150%;
/* or 150% */

text-align: center;
letter-spacing: 0.15em;

color: #0E0E2C;
}
.bebasneue-normal-black-15px {
  color: var(--black);
  font-family: var(--font-family-bebas_neue);
  font-size: var(--font-size-s);
  font-style: normal;
  font-weight: 400;

}
.bebasneue-letter-spacing-white-15px {
  color: var(--white);
  font-family: var(--font-family-bebas_neue);
  font-size: var(--font-size-s);
  font-style: normal;
  font-weight: 400;
  /* image courtesy */
font-size: 15px;
line-height: 133%;
/* or 20px */

display: flex;
align-items: center;
text-align: center;
letter-spacing: 0.2em;
}
.bebasneue-normal-shark-20px {
  color: var(--shark);
  font-family: var(--font-family-bebas_neue);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 400;
}
.bebasneue-normal-white-11px {
  color: var(--white);
  font-family: var(--font-family-bebas_neue);
  font-size: var(--font-size-xs);
  font-style: normal;
  font-weight: 400;
}

@supports not (-webkit-text-stroke: 1px black) {
  .outline-3px{
      text-shadow:
     -3px -3px 0 #000,  
      3px -3px 0 #000,
      -3px 3px 0 #000,
       3px 3px 0 #000;
  }

  .outline-1px{
      text-shadow:
     -1px -1px 0 #000,  
      1px -1px 0 #000,
      -1px 1px 0 #000,
       1px 1px 0 #000;
  }
}

@supports (-webkit-text-stroke: 1px black) {
  .outline-3px{
      -webkit-text-stroke: 2px black;
      -webkit-text-fill-color: white;
  }
  .outline-1px{
      -webkit-text-stroke: 1px black;
      -webkit-text-fill-color: white;
  }
}

.hcenter{
  margin-left: auto;
  margin-right: auto;
}



.dropshadow{
  text-shadow: 0px 10px rgba(14, 14, 44, 0.1);
}
.dropshadow1
{
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.dropshadow2{
  box-shadow: 0px 10px 4px 0px #0E0E2C1A;

}