@import url('https://fonts.googleapis.com/css?family=Inter&display=swap');
html {background-color: #000;}

@keyframes backdrop { 0% {rotate: 0deg} 100% {rotate: 360deg}}
@keyframes backdrop2 { 0% {rotate: 45deg} 100% {rotate: 405deg}}
@keyframes backdrop3 { 0% {rotate: 90deg} 100% {rotate: 450deg}}
@keyframes backdrop4 { 0% {rotate: 135deg} 100% {rotate: 495deg}}
@keyframes backdropstart { 0% {opacity: 0} 55% {opacity: 0} 100% {opacity: 0.9}}
@keyframes backdropstart2 { 0% {opacity: 0} 55% {opacity: 0} 100% {opacity: 0.5}}
@keyframes backdropstart3 { 0% {opacity: 0} 55% {opacity: 0} 100% {opacity: 0.8}}
@keyframes backdropstart4 { 0% {opacity: 0} 55% {opacity: 0} 100% {opacity: 0.7}}
.backdrop, .backdrop2, .backdrop3, .backdrop4 {
  overflow: hidden;
  z-index: 1;
  background: url("/extensions/^#identifier#^/backdrop.jpg") no-repeat;
  background-position: center;
  background-size: cover;
  height: 100vh;
  width: 100vw;
  position: fixed;
  filter: blur(200px);
  background-color: #000;
}
.backdrop {animation: backdrop 60s infinite linear, backdropstart 2.1s; opacity: 0.9; left: 10%; scale: 0.96}
.backdrop2 {animation: backdrop2 50s infinite linear, backdropstart2 2.4s; opacity: 0.5; top: 20%; cale: 1.5}
.backdrop3 {animation: backdrop3 70s infinite linear, backdropstart3 2.7s; opacity: 0.8; bottom: 60%; scale: 0.8}
.backdrop4 {animation: backdrop4 40s infinite linear, backdropstart4 2.9s; opacity: 0.7; left: 5%; top: 10%; scale: 0.8}