body{
    margin:0;
    background:#f3eadc;
    font-family:Arial,sans-serif;
    color:#fff;
}

.container{
    max-width:500px;
    margin:auto;
}

.hero{
    width:100%;
    display:block;
}

.menu-wrapper{
    position:relative;
}

.hotspot{
    position:absolute;
    left:50% !important;
    transform:translateX(-50%) !important;
    width:60% !important;
    height:6.4% !important;
    display:block;
    z-index:999;
    pointer-events:auto;
    cursor:pointer;

    -webkit-tap-highlight-color: transparent;
    outline: none;
    user-select: none;

    transition: transform 0.15s ease, opacity 0.15s ease;
}

.hotspot:active{
    transform:translateX(-50%) scale(0.96) !important;
    opacity:0.85;
}

.hotspot::after{
    content:"";
    position:absolute;
    inset:0;
    border-radius:30px;
    background:rgba(200,163,92,0);
    transition:background 0.15s ease;
}

.hotspot:active::after{
    background:rgba(200,163,92,0.25);
}

.coffee{ top:37.4% !important; }
.coffe{ top:37.4% !important; }
.summer{ top:44.9% !important; }
.snack{ top:52.4% !important; }
.icecream{ top:59.8% !important; }
.cocktails{ top:67.3% !important; }
.combo{ top:74.8% !important; }
.beer{ top:82.3% !important; }
.alcohol{ top:89.7% !important; }

.back{
    display:block;
    margin:15px;
    background:#181818;
    border:1px solid #c8a35c;
    border-radius:22px;
    padding:18px;
    text-align:center;
    text-decoration:none;
    font-weight:700;
    font-size:20px;
    color:#d9b36b;
}

#gallery{
    max-width:700px;
    margin:auto;
    padding:10px;
}

.menuimg{
    width:100%;
    display:block;
    margin-bottom:16px;
    border-radius:16px;
}
#loader{
    position:fixed;
    inset:0;
    background:#f3eadc url("LOADING-SCREEN.jpg") center center / cover no-repeat;
    z-index:99999;
    opacity:1;
    visibility:visible;
    animation:loaderFadeIn .5s ease forwards;
    transition:opacity .8s ease, visibility .8s ease;
}

#loader.hide{
    opacity:0;
    visibility:hidden;
}

.page-content{
    opacity:0;
    transform:translateY(10px);
    transition:opacity .8s ease, transform .8s ease;
}

.page-content.show{
    opacity:1;
    transform:translateY(0);
}

@keyframes loaderFadeIn{
    from{
        opacity:0;
    }
    to{
        opacity:1;
    }
}
body{
    opacity:1;
    transition:opacity .45s ease;
}

body.fade-out{
    opacity:0;
}

.page-content{
    opacity:0;
    transform:translateY(10px);
    transition:opacity .8s ease, transform .8s ease;
}

.page-content.show{
    opacity:1;
    transform:translateY(0);
}

#loader{
    position:fixed;
    inset:0;
    background:#f3eadc url("LOADING-SCREEN.jpg") center center / cover no-repeat;
    z-index:99999;
    opacity:1;
    visibility:visible;
    transition:opacity .8s ease, visibility .8s ease;
}

#loader.hide{
    opacity:0;
    visibility:hidden;
}