*{ box-sizing: border-box;}
html,body{ 
    display: block; margin: 0; padding: 0;
    width: 100%; height: 100%; background: #000; overflow: hidden; 
    position: fixed; top: 0; bottom: 0; left: 0; right: 0; height: 100%; width: 100%;
}
.loader {
    border-radius: 50%; display: inline-flex; align-items: center;
    border: 7px solid #f3f3f3; border-top: 7px solid #e52c29; border-right: 7px solid #dbb670;
    border-bottom: 7px solid #fffeff; border-left: 7px solid #7bc754;
    width: 42px; height: 42px;
    -webkit-animation: spin 2s linear infinite; animation: spin 2s linear infinite;
}

@-webkit-keyframes spin {
    0% { -webkit-transform: rotate(0deg); }
    100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}
.errtxt{ color: #e52c29; font-size: 18px; font-weight: 600; }
.landing-main-wrapper{
    width: 100%; height: 100%; position: fixed;
    top: 0; bottom: 0; right: 0; left: 0; overflow-y: auto; -webkit-overflow-scrolling: touch; background-repeat: no-repeat !important;
    background-position: center !important; background-size: cover !important; 
    background-color: #000;
}
.landing-main-wrapper .logo-bar{ text-align: center; margin-top: 10vh;}
.landing-main-wrapper .logo-bar img{ max-width: 100%; }
.landing-main-wrapper .heading-text{
    color: #FFF; font-size: 28px; font-weight: bold; text-transform: uppercase; 
    padding: 15px 20px; text-align: center; margin-top: 3vh; margin-bottom: 5vh; 
    text-shadow: 0 0 10px #000;    
    transform: translateY(-10px); opacity: 0; pointer-events: none; transition: all 0.5s ease;
}
.landing-main-wrapper .heading-text.show-x {
    transform: translateY(0); opacity: 1; pointer-events: none; transition: all 0.5s ease;
}
.landing-main-wrapper .heading-text div:nth-child(1) {  color: #dbb670; }
.landing-main-wrapper .heading-text div:nth-child(1) .redtxt { color: #e52c29;}


.landing-main-wrapper .app-method{ 
    padding: 15px 20px;  max-width: 320px; margin: 0 auto; transform: translateY(-15px) scale(0.7); 
    opacity: 0; pointer-events: none; transition: all 0.4s ease;
}
.landing-main-wrapper .app-method.show-x {
    transform: translateY(0) scale(1); opacity: 1; pointer-events: all; transition: all 0.4s ease;
}
.landing-main-wrapper .app-method .errtxt{ 
    background: rgba(255,255,255,0.7); padding: 7px 10px; border-radius: 5px; 
    border:1px solid #ff0000; font-weight: normal;
}
.landing-main-wrapper .app-method a { 
    background: #f2cc56; color: #333; padding: 15px 30px; display:  flex; align-items: center; 
    justify-content: center; border-radius: 30px; margin: 5px 5px 15px 5px; text-align: center; 
    font-size: 16px;  text-transform: uppercase; font-weight: bold; box-shadow: 0 0 7px #999;    
}
.landing-main-wrapper .app-method a i.btn-icon{
    display: inline-flex; align-items: center; width: 28px; height: 28px; margin-right: 10px; 
    position: relative; top: -1px; display: none !important;
}
.landing-main-wrapper .app-method a i.btn-icon.delivery{
    background: url('./../images/delivery.png') center/contain no-repeat;                    
}
.landing-main-wrapper .app-method a i.btn-icon.preorder {
    background: url('./../images/preorder.png') center/contain no-repeat;                    
}
.landing-main-wrapper .app-method a i.btn-icon.takeaway {
    background: url('./../images/takeaway.png') center/contain no-repeat;
    width: 22px; height: 22px;
}
.landing-main-wrapper .app-method a i.btn-icon.dinein{
    background: url('./../images/dinein.png') center/contain no-repeat;                                        
}
.landing-main-wrapper .app-method a i.btn-icon.reservation{
    background: url('./../images/reservation.png') center/contain no-repeat;                                        
}
.landing-main-wrapper .app-method a i.btn-icon.loyalty{
    background: url('./../images/loyalty.svg') center/contain no-repeat;                                         
}

    
@media screen and (min-width:431px){
    .landing-main-wrapper .app-method{
        max-width: unset; display: flex; align-items: center; flex-wrap: wrap; 
        justify-content: center;
    }
    .landing-main-wrapper .app-method a { width: 250px;}
}


.ios-ath-wrapper{ width: 285px; position: fixed; left: 0; right: 0; margin: 0 auto; 
    background: #F9F9F9; box-shadow: 0px 0px 10px #999; border-bottom: 2px solid #CCC;
    z-index: 9999; top: 0; bottom: auto;  transform: translateY(-150%);
}
.ios-ath-wrapper::after {
    content: ' ';
    border-top: 12px solid #999;
    border-left: 15px solid transparent;
    border-right: 16px solid transparent;     
    position:absolute;
    left: calc(100% - 155px); bottom: -13px;
}

.ios-ath-wrapper.show-x{
    top: auto; bottom: 20px; transform: translateY(0);
    transition: all 0.8s ease-in-out;
    
}

.ios-ath-wrapper .closeIcon{color: #FF0000; font-weight: bold; font-family: verdana; position: absolute; right: 0; 
    font-size: 14px; padding: 3px 7px; display: block; background: #EAEAEA;
}
.ios-ath-wrapper .site-icon-wrapper{padding: 7px; 
    background-repeat: no-repeat; background-position: center center; height: 60px;
}

.ios-ath-wrapper .site-ath-help-msg{ padding: 5px 10px 15px 10px; line-height: 21px; }

.ios-ath-wrapper .share-x-icon{
    background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAA0CAYAAAD46nqNAAAACXBIWXMAAAsTAAALEwEAmpwYAAAF8mlUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS42LWMxNDAgNzkuMTYwNDUxLCAyMDE3LzA1LzA2LTAxOjA4OjIxICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyIgeG1sbnM6cGhvdG9zaG9wPSJodHRwOi8vbnMuYWRvYmUuY29tL3Bob3Rvc2hvcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RFdnQ9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZUV2ZW50IyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ0MgMjAxOCAoTWFjaW50b3NoKSIgeG1wOkNyZWF0ZURhdGU9IjIwMTgtMDctMDJUMTQ6Mzc6MjIrMDU6MzAiIHhtcDpNb2RpZnlEYXRlPSIyMDE4LTA3LTAyVDE0OjM4OjQ0KzA1OjMwIiB4bXA6TWV0YWRhdGFEYXRlPSIyMDE4LTA3LTAyVDE0OjM4OjQ0KzA1OjMwIiBkYzpmb3JtYXQ9ImltYWdlL3BuZyIgcGhvdG9zaG9wOkNvbG9yTW9kZT0iMyIgcGhvdG9zaG9wOklDQ1Byb2ZpbGU9InNSR0IgSUVDNjE5NjYtMi4xIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOmExZDEzYjU1LWY0OTktNDBjNy04YjJiLTk0YzcyYmRiZGEwZSIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDoyNmNmNzc0NS04ZmM3LTQ5NDQtODdmNC1mMzYwZjZhN2YzYTkiIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDoyNmNmNzc0NS04ZmM3LTQ5NDQtODdmNC1mMzYwZjZhN2YzYTkiPiA8eG1wTU06SGlzdG9yeT4gPHJkZjpTZXE+IDxyZGY6bGkgc3RFdnQ6YWN0aW9uPSJjcmVhdGVkIiBzdEV2dDppbnN0YW5jZUlEPSJ4bXAuaWlkOjI2Y2Y3NzQ1LThmYzctNDk0NC04N2Y0LWYzNjBmNmE3ZjNhOSIgc3RFdnQ6d2hlbj0iMjAxOC0wNy0wMlQxNDozNzoyMiswNTozMCIgc3RFdnQ6c29mdHdhcmVBZ2VudD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTggKE1hY2ludG9zaCkiLz4gPHJkZjpsaSBzdEV2dDphY3Rpb249InNhdmVkIiBzdEV2dDppbnN0YW5jZUlEPSJ4bXAuaWlkOmExZDEzYjU1LWY0OTktNDBjNy04YjJiLTk0YzcyYmRiZGEwZSIgc3RFdnQ6d2hlbj0iMjAxOC0wNy0wMlQxNDozODo0NCswNTozMCIgc3RFdnQ6c29mdHdhcmVBZ2VudD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTggKE1hY2ludG9zaCkiIHN0RXZ0OmNoYW5nZWQ9Ii8iLz4gPC9yZGY6U2VxPiA8L3htcE1NOkhpc3Rvcnk+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+56s7oQAAAWZJREFUaIHtmTFqhUAQhsfH698h9ghrUgcbbXOEVIEUklphF0EbD5CQVLlASsErLHoFD/GwSjVpskEkIYszDwzMB4IrzO/HrOuCRogIXFhrHQAcqqq64so8cgVZa13Xdddfw4FL8sARspKDrutia+3AkU0WXMt5uCRJgku5NE2f/fUsy14BmCQRcdNhjHFaa9RaY1EUT4gIfoyIUJblix8bY4at92GTWwtySbLJ/STIIckm95sgVTJ4kSilTs657wXRNM1DaG1d1/d+4TjnYqXUKbQ2+EU9TdM5z/MbrfVt0zSPoXVLSUT8mOf5ve/7c2hdxLnVxXGMAADjOEZcmSw7ySXZveDRT8tW/ppOav7+O+hPOB/sJVtzfed330ERpCKCVESQighSEUEqIkhFBKmIIBW2D5gAAEmS3HHmATALtm37xpkH8A+mWASpiCAVEaQiglREkIoIUtm9YKS15vsPcQF238FPFuoVqvzndS4AAAAASUVORK5CYII='); width: 18px; height: 18px;
    display: inline-block; background-position: center center; background-size: auto 100%; background-repeat: no-repeat; position: relative; top: 3px;
}

@media all and (display-mode: standalone) {
    .ios-ath-wrapper{
        display: none !important;
    }
}