.image-container {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 10;
    pointer-events: none;
}

.image-container img {
    width: 200px;
    height: auto;
    animation: moveAndResize 1s ease-in-out forwards;
}

@keyframes moveAndResize {
    0% {
        transform: translate(0, 0) scale(1);
    }
    100% {
        transform: translate(calc(-50vw + 130px), calc(-50vh + 104px)) scale(0.5);
    }
}

.login-header,
.login-content {
    opacity: 0;
    animation: fadeInContent 1s ease-in-out forwards;
    animation-delay: 1s;
}

@keyframes fadeInContent {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

/* //////////////////////////////////Mobile-Screen/////////////////////////////////////////////////// */

@media (max-width: 680px) {

    @keyframes moveAndResize {
        0% {
            transform: translate(0, 0) scale(1);
        }
        100% {
            transform: translate(calc(-50vw + 77px), calc(-50vh + 104px)) scale(0.5);
        }
    }

}

@media (max-width: 400px) {

    @keyframes moveAndResize {
        0% {
            transform: translate(0, 0) scale(1);
        }
        100% {
            transform: translate(calc(-55vw + 77px), calc(-57vh + 104px)) scale(0.5);
        }
    }

}