/* Banner variables */
:root {
  --banner-width: 300px;
  --banner-height: 600px;
  --border-color: #000;
}

#banner {
  overflow: hidden;
  background: #000000;
}

#banner,
#default_exit,
.border,
#particles-js {
  position: absolute;
  top: 0px;
  left: 0px;
  width: var(--banner-width);
  height: var(--banner-height);
  cursor: pointer;
}

.black-border {
  width: var(--banner-width) - 2;
  height: var(--banner-height) - 2;
  right: 0;
  bottom: 0;
  margin: auto;
  border: 1px solid var(--border-color);
}

img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: auto;
  opacity: 0;
  /* -webkit-backface-visibility: hidden; */
  /* -ms-transform: translateZ(0); */
  /* IE 9 */
  /* -webkit-transform: translateZ(0); */
  /* Chrome, Safari, Opera */
  /* transform: translateZ(0); */
}

.momentum,
.border,
.intro-bg {
  opacity: 1;
}

.intro-bg {
  filter: brightness(1);
}

.frame1,
.frame2,
.frame3,
.cta {
  transform: scale(.9);
}

.bg {
  transform: scale(1.25);
}

.logo {
  transform: scale(.95);
}