@import 'src/styles/variables';

.cover {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: 50% 50% no-repeat;
  background-size: cover;
  opacity: 0;
  transition: opacity 1s;

  &.active {
    opacity: 1;
  }

  &::after {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: $content_bg_backdrop;
  }

  &::before {
    content: '';
    background: url('../../../sprites/stripes.svg');
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    opacity: 0.5;
  }

  img {
    width: 0;
    height: 0;
    opacity: 0;
  }
}
