.mobile-view {
    display: none;
    position: relative;
}

.mobile-view img {
    height: 100%;
    object-fit: cover;
    -webkit-object-fit: cover;
    -o-object-fit:cover;
    width: 100%;
    min-height: 100%;
}

.mobile-view a img {
    object-fit: contain;
    -webkit-object-fit: contain;
}

.mobile-view nav.menu {
    width: 100%;
    position: absolute;
}

.landing-page .mobile-view nav.menu {
    position: unset;
}

.mobile-view nav.menu .grid {
    display: grid;
    grid-gap: 30px;
    padding: 16px;
}

.mobile-view nav.menu .grid a {
    display: block;
    width: 100%;
    min-height: 20vh;
    height: 130px;
    background: linear-gradient(#d3d3d380, #ffffff30);
    border-radius: 4px;
    backdrop-filter: blur(2px);
}

div#menu {
    display: none;
}


@media (max-width: 1180px) {
    body {
        min-height: unset;
        min-width: unset;
    }
    div#menu {
        display: block;
    }
    div.bkg {
        display: none;
    }
    div#main {
        display: none;
    }
    .mobile-view {
        display: block;
        padding-left: 295px;
    }
    .mobile-view nav.menu .grid a {
        width: calc(100% - 295px);
        min-height: calc(25vh - 31px);
    }
}
@media (max-width: 820px) {
    .mobile-view {
        padding-left: 0;
        padding-top: 70px;
    }
    .mobile-view nav.menu .grid a {
        width: 100%;
        min-height: calc(25vh - 48px);
    }
    .mobile-view nav.menu {
        top: 70px;
    }
}
@media (max-width: 567px) {
    .mobile-view nav.menu .grid a {
        height: calc(25vh - 48px);
    }
}