/* Building blocks */

@media only screen and (min-width: 769px) {

    /* General */

    .top-nav-links {
        text-align: right;
    }

    .top-nav-mobile {
        display: none;
    }

    .footer {
        margin-top: 2%;
        margin-bottom: 8%;
    }

    .fot-nav-item {
        text-align: center;
    }

    .fot-nav-links {
        text-align: right;
    }

    .space-xsmall {
        margin-top: 3%;
    }

    .space-medium {
        margin-top: 4%;
    }

    .space-large {
        margin-top: 8%;
    }

    /* Forside */

    .nav-item {
        width: 100%;
        display: flex; align-items: baseline;
        padding: 1.5vw 0vw 1.5vw 0vw;
        box-shadow: 0px -2px 0px 0px inset var(--text-color);
        text-decoration: none;
        transition: 0.5s;
    }

    .nav-item-space {
        margin-right: 1vw;
    }

    .nav-item:hover {
        color: #f2f2f2;
        background-color: var(--text-color);
        padding: 1.5vw 0vw 1.5vw 0vw;
    }

    .nav-item:hover h2 {
        margin-left: 1.5vw;
        animation-name: nav-move;
        animation-duration: 0.5s;
    }

    @keyframes nav-move {
        from {margin-left: 0vw;}
        to {margin-left: 1.5vw;}
    }

    /* Undersider */

    .text-margin {
        margin-top: 6%;
        margin-bottom: 6%;
    }
}
/* ========== MOBILE ========== */
@media only screen and (max-width: 768px) {
    /* General */
    .top-nav-links {
        text-align: right;
    }

    .top-nav-desktop {
        display: none;
    }

    .space-xsmall {
        margin-top: 2%;
    }

    .space-medium {
        margin-top: 8%;
    }

    .space-large {
        margin-top: 16%;
    }

    .space-mobile {
        margin-top: 8%;
    }
    
    .footer {
        margin-top: 2%;
        margin-bottom: 8%;
    }

    .fot-nav-item {
        text-align: left;
        margin: 2% 0% 2% 0%;
    }

    .fot-nav-links {
        text-align: left;
    }

    .fot-link-space {
        margin-bottom: 2%;
    }

    /* Forside */
    .nav-item {
    width: 100%;
    display: flex; align-items: baseline;
    padding: 6vw 0vw 6vw 0vw;
    box-shadow: 0px -2px 0px 0px inset var(--text-color);
    text-decoration: none;
    }

    .nav-item-space {
    margin-right: 3vw;
    }

    .company {
        margin-bottom: 8%;
    }

    /* Undersider */

    .text-margin {
        margin-top: 12%;
        margin-bottom: 12%;
    }
}