html {
    padding: 0rem;
    margin: 0rem;
}
body {
    margin: 0px;
    padding: 0px;
}

.container {
    height: 100vh;
	display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
	justify-content: center;
	align-items: center;
	align-content: center;
}

.background-img-v1 {
    position: absolute;
    z-index: -1;
    width: 100dvw;
    height: 100dvh;
    opacity: 0;
    background-size: cover;
    background-image: url("../images/v1-logo-hover-desktop.png");
}

.background-img-v2 {
    position: absolute;
    z-index: -1;
    width: 100dvw;
    height: 100dvh;
    opacity: 0;
    background-size: cover;
    background-image: url("../images/v2-logo-hover-desktop.png");
}

.background-img-v3 {
    position: absolute;
    z-index: -1;
    width: 100dvw;
    height: 100dvh;
    opacity: 0;
    background-size: cover;
    background-image: url("../images/v3-logo-hover-desktop.png");
}

.logo-container {
    margin-left: auto;
    margin-right: auto;
    width: 400px;
    height: 211px;
}

.logo-1 {
    width: 400px;
    height: 211px;
}

.logo-white {
    filter: brightness(0) invert(1);
}

.navigation-container {
    margin-top: 6rem;
    text-align: center;
    font-family: 'Barlow', sans-serif;
    font-weight: 500;
    font-size: 38px;
    letter-spacing: 4px;
}

.navigation-container p {
    color: black;
}

.navigation-container a {
    text-decoration: none;
    color: black;
}

.navigation-link-v1:hover {
    animation: changeToWhite .5s;
    animation-fill-mode: forwards;
}
.navigation-link-v2:hover {
    animation: changeToWhite .5s;
    animation-fill-mode: forwards;
}
.navigation-link-v3:hover {
    animation: changeToWhite .5s;
    animation-fill-mode: forwards;
}

@keyframes fadeInOut {
    0% { opacity: 0; }
    50% { opacity: 100%; }        
    100% { opacity: 0; }
}

@keyframes fadeIn {
    0% { opacity: 0; }
    100% { opacity: 100%; }
}   

@keyframes fadeOut {
    0% { opacity: 100%; }
    100% { opacity: 0%; }
}

@keyframes changeToWhite {
    0% {filter:  brightness(1) invert(0); }
    100% {filter:  brightness(0) invert(1); }
}

@keyframes changeToBlack {
    0% {filter:  brightness(0) invert(1); }
    100% {filter:  brightness(1) invert(0); }
}