html, body {margin:0;padding:0;position:fixed;top:-40px;overflow:hidden;}

    .circle {
position: fixed;top:0;height:100vh;width:20vw;display: block; /* fixed besser als absolute */
animation: circleAround 4s infinite alternate, leftAndRight 5s alternate infinite;
opacity: 0.2;filter: blur(0px);
background-blend-mode: screen;

}

@keyframes circleAround { 0%{ transform: rotateY(0deg);}100%{ transform: rotateY(360deg); }}
@keyframes leftAndRight {to {margin-left: 0;}}
@keyframes toSquare {from {border-radius: 50%;} to{border-radius: 0%;}}

    #rotatesaway {font-size:100px;font-family:arial;color:red;
position:fixed;z-index:999; 
margin-left:20vw;top:20vh; cursor:pointer;transition: filter 0.5s;filter: blur(6px);}
 @media screen and (max-width:1216px) {
 	#rotatesaway {font-size:50px;}}

    #rotatesaway:hover {color: rgba(255,0,0,0.5);transition: all 0.5s;filter: blur(0px);}

    #rotatesaway::after {
  white-space: pre; /* or pre-wrap */
  content: 'WICHTIGE \A FOTOS';}



/* https://stackoverflow.com/questions/62482024/3d-image-rotation-css */