* {
    cursor: none;
}

body, .background-image, .background-color, .background-pattern {
    position: absolute;
    text-align: center;
    margin: 0;
    overflow: hidden;
    width: 100vw;
    height: 100vh;
}


.background-animation {
    position: absolute;
    top:  0vw;
    left: 0vw;
    margin-left: -100vw;
    margin-top: -155vw;
    width: 300vw;
    height: 300vw;
    opacity: 0.5;
    animation: rotate 60s infinite linear;
}


/* Animation keyframes */
@keyframes rotate {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}




/* Fading entrances  */
@-webkit-keyframes fadeOutfadeIn {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes fadeOutfadeIn {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

.animate__fadeOutfadeIn {
    -webkit-animation-name: fadeOutfadeIn;
    animation-name: fadeOutfadeIn;
    animation-duration: 4s; /* don't forget to set a duration! */
}


.animate__fadeOut {
    animation-duration: 2s !important;
    animation-fill-mode: forwards !important;
}

.animate__fadeIn {
    animation-duration: 2s !important;
    animation-fill-mode: forwards !important;
}