/* Hero frontpage */
.hero-frontpage {
  background-color: #CCC;
  background-image: url("../../../../../app/uploads/hero-frontpage.webp");
  background-size: cover;
}

.hero-frontpage > .container {
  position: relative;
  z-index: 1;
}

.hero-frontpage svg {
  width: 100%;
}

.hero-frontpage path {
  fill: none;
}

.hero-frontpage tspan {
  text-transform: uppercase;
}

.hero-frontpage text {
  font-family: "Univia Pro", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 8px;
  font-weight: 700;
  text-transform: uppercase;
  fill: #FFF;
}

.hero-frontpage text.small {
  font-size: 7px;
}

.hero-frontpage .hero-inner > g,
.hero-frontpage .hero-outer > g {
  cursor: pointer;
}

.hero-frontpage .hero-inner > g > path,
.hero-frontpage .hero-outer > g > path {
  -webkit-transition: fill 350ms ease;
  transition: fill 350ms ease;
}

.hero-frontpage .hero-inner text {
  fill: #242A37;
}

.hero-frontpage .hero-outer > g:hover .hero-fill {
  fill: #242A37;
}

.hero-frontpage .hero-outer .hero-stroke {
  fill: #1B2A35;
}

.hero-frontpage .hero-outer .hero-fill {
  opacity: 1;
  fill: #3D4A53;
}

.hero-frontpage .hero-inner > g:hover .hero-fill {
  fill: var(--badatron-color-bright-sun);
}

.hero-frontpage .hero-inner .hero-stroke {
  fill: #D1B139;
}

.hero-frontpage .hero-inner .hero-fill {
  opacity: 1;
  fill: #FC0;
}

.hero-frontpage .hero-badamid > rect {
  fill: var(--badatron-badamid-primary);
}

.hero-frontpage .hero-badatech-ht > rect {
  fill: var(--badatron-badatech-primary);
}

.hero-frontpage .hero-badatron > rect {
  fill: var(--badatron-badatron-primary);
}

.hero-frontpage .hero-badaflex > rect {
  fill: var(--badatron-badaflex-primary);
}

.hero-frontpage .hero-badaprene > rect {
  fill: var(--badatron-badaprene-primary);
}

.hero-frontpage .hero-badadur > rect {
  fill: var(--badatron-badadur-primary);
}

.hero-frontpage .hero-badalac > rect {
  fill: var(--badatron-badalac-primary);
}

.hero-frontpage .hero-badaform > rect {
  fill: var(--badatron-badaform-primary);
}

.hero-frontpage .hero-badagreen > rect {
    fill: var(--badatron-badagreen-primary);
}

.hero-frontpage .hero-badalon > rect {
  fill: var(--badatron-badalon-primary);
}

.hero-frontpage .hero-badaprop > rect {
  fill: var(--badatron-badaprop-primary);
}

.hero-frontpage .hero-core-background {
  fill: #FFF3C1;
  fill-opacity: 0.85;
}

.hero-frontpage .hero-core-logo {
  fill: #FC0;
}

.hero-frontpage .hero-core > g > path {
  fill: var(--bs-black);
}

.hero-frontpage .hero-core > g > path.hero-core-inner {
  fill: var(--bs-white);
}

.hero-frontpage .hero-center path {
  fill: var(--bs-black);
}

.hero-frontpage .hero-center .hero-center-border {
  fill: none;
  stroke: #B07F48;
  stroke-miterlimit: 10;
  stroke-opacity: 0.5;
}

.hero-frontpage .hero-center .hero-center-background {
  fill: var(--bs-white);
}

.hero-frontpage .hero-center > g {
  cursor: pointer;
}