@media screen and (max-width: 750px) {

    .page {
        width: 100%;
        min-width: 300px;
    }

    .text-align-right-mobile-center {
        text-align: center !important;
    }

    .text-align-left-mobile-center {
        text-align: center !important;
    }

    .content {
        padding-left: 20px;
        padding-right: 20px;
        min-width: unset;
        width: 100%;
    }

    .desktop-only {
        display: none !important;
    }

    .mobile-only {
        display: block !important;
    }

    .menu a.logo img {
        margin-right: 0;
    }

    .menu .menu-list {
        position: absolute;
        top: 0px;
        left: 0px;
        background-color: #ffffff;
        z-index: 1000;
        width: 100vw;
        height: 100vh;
        padding: 40px;
        display: none;
    }

    .menu .menu-close {
        display: block;
        font-size: 20px;
        text-align: right;
        margin-bottom: 15px;
    }

    .menu .menu-link {
        display: block;
        border-bottom: 1px dashed rgb(220,220,220);
        padding: 1px;
    }

    .menu .menu-button {
        display: block;
        margin: 0;
        margin-top: 20px;
        border-radius: 0;
        text-align: center;
    }

    .menu .menu-right {
        float: none;
    }

    .menu .seperator {
        display: none;
    }

    .menu .menu-mobile {
        display: block;
    }

    .booking .booking-menu {
        text-align: center;
    }

    .hero.hero-padding {
        padding-top: 30px;
        padding-bottom: 30px;
    }

    .hero .hero-text {
        font-size: 12px;
    }

    .booking .booking-menu a {
        font-size: 13px;
        padding: 6px;
        margin-left: 2px;
        margin-right: 2px;
    }

    .ui-autocomplete {
        position: absolute;
        cursor: default;
        z-index: 7100 !important;
    }

    h1 {
        font-size: 22px;
    }

    h2 {
        font-size: 18px;
    }


    .col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12 {
        width: 100%;
    }


    .key-value {
        border-right: none;
        padding-right: 5px;
        padding-left: 5px;
        margin-top: 8px;
        margin-bottom: 8px;
        padding-bottom: 8px;
        border-bottom: 1px solid rgb(220,220,220);
    }



    .button {
        width: 75%;
        display: block;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 10px;
    }

    .full-width {
        width: 100% !important;
    }

    .alert a.alert-action {
        float: none;
        margin-left: 10px;
    }

    .dialog-box, .dialog-box-small, .dialog-box-big {
        width: 90vw;
        top: 5vw;
        left: 5vw;
    }

    .dialog-body {
        max-height: 85vh;
    }

    .popup {
        width: 90vw;
        bottom: 5vw;
        left: 5vw;
        text-align: center;
    }

    footer {
        padding-top: 30px;
        padding-bottom: 30px;
    }

    .footer-links-container {
        overflow-x: auto;
        white-space: nowrap;
        text-align: left;
        margin-top: 20px;
    }

    .footer-links {
        margin-left: 0;
        margin-right: 20px;
    }

        .footer-links p {
            border-bottom: none;
            font-size: 12px;
            margin-bottom: 10px;
        }

        .footer-links a {
            margin-bottom: 10px;
            font-size: 11px;
        }

    .wa-button {
        display: none;
    }

    .table-wrap::-webkit-scrollbar {
        width: unset;
        height: unset;
        background-color: unset;
    }

    .table-wrap::-webkit-scrollbar-thumb {
        background-color: unset;
    }
}



@media screen and (min-width: 750px) {
    .workspace::-webkit-scrollbar {
        width: 10px;
        height: 10px;
        background-color: #ffffff;
    }

    .workspace::-webkit-scrollbar-thumb {
        background-color: rgb(210,210,210);
    }
}