body {
    background-image: url('assets/background-4bit.png');
    background-repeat: no-repeat;
    background-size: cover;
    overflow-x: hidden;
    position:relative;
    margin: 0;
}

.background-container {
    position:absolute; 
    left:0; 
    top:0; 
    width:100%;
    height:100%; 
    overflow:hidden;
}

.background-grass {
    position: fixed;
    bottom: -200px;
    right: -50px;
    transform: scaleX(-1) rotate(15deg);
}

.background-horse {
    position: fixed;
    bottom: 70px;
    right: 280px;
    transform:scale(0.8);
}

.invisible {
    opacity: 0.0;
}

.background-horse.appearing {
    animation-name: fadein;
    animation-duration: 5s;
    animation-fill-mode: forwards;
}

@keyframes fadein {
    from {
        opacity: 0.0;
    }

    to {
        opacity: 1.0;
    }
}

@media (max-width: 965px) {
    .background-grass {
        position: fixed;
        bottom: -17%;
        left:-55%;
        width: 159%;
        transform: scaleX(-1) rotate(15deg);
    }

    .background-horse {
        position: fixed;
        bottom: 70px;
        right: 280px;
        transform:scale(0.8);
    }
}