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

a {
    text-decoration: none
}

.body,
.container {
    display: flex;
    flex-direction: column;
    height: 100%
}

.body {
    background-color: var(--main-color);
    height: 90%
}

.body-content {
    display: flex;
    flex-direction: column;
    border: 4px solid #fff;
    color: #a6a6a6;
    position: relative;
    height: 80%;
    width: 85%;
    background-color: #fff;
    border-radius: 5vw;
    font-size: 1.5vw;
    top: 4%;
    left: 6.5%;
}

@media screen and (orientation: portrait) {
    .body-content img {
        top: 5%;
        left: 0%;
        width: 100%;
        height: auto;
    }

    .login {
        left: 28%;
        width: 40%;
    }
}

@media screen and (orientation: landscape) {
    .body-content img {
        top: 5%;
        left: 31.5%;
        width: 36%;
        height: auto;
    }

    .login {
        left: 38%;
        width: 20%;
    }
}

.body-content img {
    position: relative;
}

.body-content span {
    display: flex;
    flex: 4;
    color: var(--footer-color);
    font-size: 2.5rem;
    margin-left: 4%;
    margin-right: 5%;
    margin-bottom: 2%;
}

.footer,
.login {
    display: flex;
    flex-direction: row
}

.body-content span,
.login {
    align-items: center;
    justify-content: center;
    font-weight: 700;
    position: relative
}

.login {
    height: 100%;
    background-color: #f7bf05;
    border: 10px solid #f4e3d6;
    color: #fffbf2;
    font-size: 2rem;
    top: -20%;
    border-radius: 15px;
}

.footer {
    background-color: var(--footer-color);
    height: 10%
}

.footer-border {
    flex: .5
}

.footer-logo,
.footer-slogan {
    display: flex;
    align-items: center
}

.footer-logo {
    flex: 1.5;
    height: 70%;
    width: 70%;
    background-color: #fff;
    border-radius: 10px;
    position: relative;
    top: 16.75%;
    left: 1.5%
}

.footer-logo img {
    height: 2.5vw;
    width: 2.5vw;
    padding-left: 5%
}

.footer-logo span {
    padding-left: 4.5%;
    font-size: 1.75vw;
    font-weight: 700;
    color: var(--footer-color)
}

.footer-slogan {
    justify-content: center;
    color: #fff;
    flex: 7;
    font-size: 1.5vw
}

.footer-slogan b {
    font-size: 2vw
}