/* ----------------------------------------------------------------
	Custom CSS

	Add all your Custom Styled CSS here for New Styles or
	Overwriting Default Theme Styles for Better Handling Updates
-----------------------------------------------------------------*/


@font-face {
    font-family: 'Oswald ExtraLight';
    src: url('https://film.fear.io/fonts/oswald.ttf') format('truetype');
}
@font-face {
    font-family: 'Hacked';
    src: url('https://film.fear.io/fonts/hacked.ttf') format('truetype');
}

.bodywornvideopage .featuredgamesheader {font-family:Hacked ! important; color:white ! important;font-size:20pt;}
.bodywornvideopage .featuredgamesheader span {color:white ! important;}


@keyframes twitch {
  0%, 100% {
    transform: translate(0);
  }
  10%, 30%, 50%, 70% {
    transform: translateX(-1px) rotate(-1deg);
  }
  20%, 40%, 60%, 80% {
    transform: translateX(1px) rotate(1deg);
  }
  90% {
    transform: translateX(0.5px) rotate(0.5deg);
  }
}

.featuredgamesheader2 {
  display: inline-block; /* Allows transform to work properly */
  animation: twitch 0.3s infinite; /* Adjust timing to control effect intensity */
  animation-timing-function: steps(2, end); /* Makes movement more erratic */
}


/* Keyframes remain the same */
@keyframes twitch2 {
  0%, 100% { transform: translateX(0); }
  10% { transform: translateX(-2px); }
  20%, 40%, 60% { transform: translateX(3px); }
  30%, 50%, 70% { transform: translateX(-3px); }
  80% { transform: translateX(2px); }
  90% { transform: translateX(-2px); }
}

/* Updated class for animation */
.featuredgamesheader-twitch {
  animation: twitch2 0.3s forwards; /* Use 'forwards' to keep the final state */
}


.videocon video {width:100%;}