@media all and (max-width: 1200px) {
    .webapp-blocker {
        display: none;
        pointer-events: none;
    }
    .app {
        display: block;
        height: 100vh;
        overflow-y: auto;
        overflow-x: hidden;
    }
    .background {
        background-image: url(https://tesla.lozzaspa.it/img/gallery/2.jpg);
        background-size: cover;
        background-repeat: no-repeat;
        height: calc(100vh - 50px);
        overflow: hidden;
        position: relative;
    }
    .background:before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 0;
        background: var(--black-opacity-medium);
    }
    .lozza-img, 
    .second-logo-img {
        position: absolute;
        z-index: 10;
        width: 80%;
        left: 10%;
    }
    .lozza-img {
        top: 50px;
    }
    .second-logo-img {
        top: 200px;
    }
    .second-logo-img img {
        padding: 0 40px;
    }
    .lozza-img img, 
    .second-logo-img img {
        max-width: 100%;
    }
    .slogan {
        text-align: center;
        font-size: var(--font-size-lg);
        color: var(--white);
        padding-bottom: 10px;
    }
    .menu-slogan {
        text-align: center;
        font-size: var(--font-size-md);
        color: var(--color-primary-1);
    }
    .bottom-menu {
        height: 50px;
        position: fixed;
        bottom: 0;
        width: 100%;
        left: 0;
        z-index: 10;
        background: var(--color-primary-3);
    }
    .menu-b-voice {
        font-size: var(--font-size-sm);
        line-height: var(--font-size-sm);
        color: var(--color-primary-1);
    }
    .menu-b-voice:not(:first-child) {
        border-left: 1px solid var(--color-primary-2);
    }
    .menu-toggle {
        position: fixed;
        top: 15px;
        right: 10px;
        z-index: 11;
    }
    .opener {
        padding: 2px 5px;
        color: var(--white);
        transition: .5s all ease;
    }
    body:not(.menu-open) .opener.over {
        color: var(--color-primary-3);
    }

    section, .side-menu, .bottom-menu {
        transition: .5s all ease;
    }

    body.menu-open section {
        transform: translateX(-270px);
    }

    .side-menu {
        position: fixed;
        right: -270px;
        background: var(--color-primary-3);
        color: var(--white);
        height: calc(100vh - 40px);
        top: 0;
        width: 270px;
        padding-top: 40px;
        z-index: 10;
	    overflow-y: scroll;
    }

    .side-menu .menu-voice {
        color: var(--color-primary-1);
        font-size: var(--font-size-md);
        padding: 5px 20px;
        border-bottom: 1px solid var(--color-primary-1);
    }

    .menu-b-voice a {
        color: var(--color-primary-1);
    }

    body.menu-open .side-menu {
        transform: translateX(-270px);
    }

    body.menu-open section {
        pointer-events: none;
        box-shadow: 2px 2px 4px var(--black-opacity-soft);
    }

    body.menu-open .bottom-menu {
        box-shadow: 2px -2px 4px var(--black-opacity-soft);
    }

    .top-50 {
        position: relative;
        top: -50px;
    }

    .center-aligned {
        left: 50%;
        transform: translateX(-50%);
    }

    .sbb {
        border-bottom: 2px solid #dee2e6;
    }
}