@import url('https://fonts.googleapis.com/css2?family=Noto+Sans&display=swap');
* {
    cursor: url('normal.cur'), auto;
}

html,
body {
    margin: 0;
    height: 100%;
}

body {
    font-family: 'Noto Sans', sans-serif;
    background-color: darkslateblue;
    color: white;
}

@keyframes rotate {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

@keyframes rainbow_animation {
    0%,
    100% {
        background-position: 0 0;
    }
    50% {
        background-position: 100% 0;
    }
}

@keyframes epic-skew {
    0%,
    100% {
        transform: skew(50deg, -30deg) scale(1, 1);
    }
    50% {
        transform: skew(10deg, -30deg) scale(0.75, 1.5);
    }
}

@keyframes jump-anim {
    50% {
        transform: translateY(-50%);
    }
    0%,
    100% {
        transform: translateY(0%);
    }
}

@keyframes jump-left {
    50% {
        transform: skew(50deg, -30deg) translateY(-50%) scale(0.5) rotate(360deg);
    }
    0%,
    100% {
        transform: skew(0deg, 0deg) translateY(0%) scale(1) rotate(0deg);
    }
}

@keyframes jump-right {
    50% {
        transform: skew(-50deg, 30deg) translateY(-50%) scale(0.5) rotate(360deg);
    }
    0%,
    100% {
        transform: skew(0deg, 0deg) translateY(0%) scale(1) rotate(0deg);
    }
}

.jump {
    animation: jump-anim 0.3s forwards ease-in-out;
}

.jumpRight {
    animation: jump-right 0.3s forwards ease-in-out;
}

.jumpLeft {
    animation: jump-left 0.3s forwards ease-in-out;
}

footer {
    position: absolute;
    bottom: 0;
    text-align: right;
    margin-left: -25px;
    width: 100%;
}