#yeah, #nah, #Ram_Ranch, #bgv {
  object-fit: cover;
  flex-shrink: 0;
  position: fixed;
  top: 0; right: 0;
  width: auto;
  height: 100vh;
  overflow: hidden;
  justify-content: flex-end;
  align-items: center;
  opacity: 0;
  transition: 1s;
  display: none;
  animation: none;
  filter: brightness(110%);
}

.scrolled_KK #yeah { animation: wow 1s ease 5s forwards; display: flex; }
.scrolled_UU #nah { animation: wow 0s linear 2.28s forwards; display: flex; }
.scrolled_UU #Ram_Ranch { animation: wowe 0s linear 2.28s forwards; display: flex; opacity: 1; }

@keyframes wow { to {opacity: 1;} }
@keyframes wowe { from {z-index: 0;} to {z-index: -2;} }
@keyframes shiftLeft { to {transform: translateX(calc(-100vw + 100%));} }
@keyframes shiftCen { to {transform: translateX(calc(-50vw + 50%));} }

#yeah.animate-x {opacity: 1; }
#yeah.animut {opacity: 1; display: flex;}
#bgv {animation: wow 1s ease 4s forwards; display: flex;}
 
.blackground {
  position: fixed;
  top: 0; left: 0;
  background: #121212;
  width: 100vw; height: 100vh;
  z-index: -2000;
}

#counter {
  position: fixed;
  bottom: 60px; right: 90px;
  font-size: 2.5em;
  font-family: Arial;
  font-weight: bold;
  color: rgb(255, 255, 255);
  padding: 0.2em 0.3em;
  opacity: 0.7;
  transform: scale(150%);
}

.Ela_1 {
  position: fixed;
  left: -283px; bottom: 75px;
  transform: rotate(-90deg) scale(20%);
  opacity: 0.4;
}

.Ela_2 {
  position: fixed;
  left: 0px; bottom: -40px;
  transform: scale(50%);
  opacity: 0.07;
  clip-path: inset(110px 0 0 0);
}

.Ela_x {
  position: fixed;
  right: -250px; bottom: 130px;
  transform: rotate(-90deg) scale(20%);
  opacity: 0.5;
}

.Ela_y {
  position: fixed;
  left: -270px; bottom: -50px;
  transform: rotate(-90deg) scale(25%);
  opacity: 0.2;
}

.Side_text {
  position: fixed;
  left: -70px;
  color: white;
  font-family: Arial;
  font-size: 0.6rem;
  transform: rotate(90deg);
  opacity: 0.5;
}

.Side_text.top {top: calc(30vh + 20px);}
.Side_text.bottom {bottom: calc(30vh + 120px);}