/// /// Eventually by HTML5 UP /// html5up.net | @ajlkn /// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license) ///

/* BG */

bg {

@include vendor('transition', 'opacity #{_duration(bg-fadein)} ease-in-out');
height: 100%;
left: 0;
opacity: 0.25;
position: fixed;
top: 0;
width: 100%;
z-index: 1;

div {
  @include vendor('transition', ('opacity #{_duration(bg-transition)} ease', 'visibility #{_duration(bg-transition)}'));
  background-size: cover;
  height: 100%;
  left: 0;
  opacity: 0;
  position: absolute;
  top: 0;
  visibility: hidden;
  width: 150%;

  &.visible {
    @include vendor('animation', 'bg #{_duration(bg-slide)} linear infinite');
    opacity: 1;
    visibility: visible;
    z-index: 1;

    &.top {
      z-index: 2;
    }

    @include breakpoint('<=large') {
      @include vendor('animation', 'bg #{_duration(bg-slide) * 0.65} linear infinite');
    }

    @include breakpoint('<=small') {
      @include vendor('animation', 'bg #{_duration(bg-slide) * 0.4} linear infinite');
    }
  }

  &:only-child {
    @include vendor('animation-direction', 'alternate !important');
  }
}

body.is-preload & {
  opacity: 0;
}

}

@include keyframes(bg) {

0% {
  @include vendor('transform', 'translateX(0)');
}

100% {
  @include vendor('transform', 'translateX(-25%)');
}

}