/* --- BACKGROUND ANIMATIONS / VIDEOS --- */
/* --- CI ICON ANIMATION --- */
@keyframes icon-bg-anim {
  0% {
    transform: translate(0, 0);
  }
  100% {
    transform: translate(75px, -75px);
  }
}
.icon-bg {
  position: relative;
  /*overflow: hidden;*/
}
.icon-bg::after {
  content: "";
  display: block;
  position: absolute;
  z-index: -1;
  top: -75px;
  left: -75px;
  width: calc(100vw + 150px);
  height: calc(100vw + 150px);
  opacity: 0.05;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' viewBox='0 0 150 150'%3E%3Cpath class='var(--color-greyscale-0)' d='M20,65.2l2.7-5.2V43.3L20,38.1v-1.2l15.1-3.3l0.8,0.8L35.5,39h0.8c2.1-2.3,5.6-5.5,10.9-5.5 c2.9,0,7,1.1,9.1,5.9c2.1-2.3,5.9-5.9,11.3-5.9c3.9,0,9.7,2,9.7,9.5v16.9l2.7,5.2v1.3H61.4v-1.3l2.4-5.2V43.8 c0-2.3-0.7-3.5-2.7-3.5c-1.6,0-3.4,2-4.3,3.1c0,0.2,0,0.4,0,0.8V60l2.3,5.2v1.3H40.8v-1.3l2.4-5.2V44.1c0-2.3-1.2-3.8-2.7-3.8 c-1.8,0-3.3,2.1-4.2,3.2v16.5l2.4,5.2v1.3H20V65.2z'/%3E%3C/svg%3E");
  background-size: 75px 75px;
  background-repeat: space;
  animation: icon-bg-anim 3s infinite linear;
}

/* --- BACKGROUND VIDEO --- */
.has-video-bg {
  position: relative;
  overflow: hidden;
  background-color: transparent !important;
  background-image: transparent !important;
}
.has-video-bg .video-bg {
  display: block;
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
}
.has-video-bg .video-bg .video-overlay {
  position: relative;
  width: inherit;
  height: inherit;
}
.has-video-bg .video-bg .video-overlay::after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-color: var(--color-greyscale-0);
  opacity: 0.75;
}
.has-video-bg .video-bg .video-overlay.dark::after {
  background-color: var(--color-greyscale-0);
}
.has-video-bg .video-bg .video-overlay.light::after {
  background-color: var(--color-greyscale-10);
}
.has-video-bg .video-bg video {
  display: block;
}
@media (max-aspect-ratio: 16/9) {
  .has-video-bg .video-bg video {
    width: auto;
    height: 100%;
  }
}
@media (min-aspect-ratio: 16/9) {
  .has-video-bg .video-bg video {
    width: 100%;
    height: auto;
  }
}

/*# sourceMappingURL=background-animations.css.map */