/*** Stop pull-to-refresh hack on Android ***/
.body, .wrapper {
    /* Break the flow */
    position: absolute;
    top: 0px;
    /* Give them all the available space */
    width: 100%;
    height: 100%;
    /* Remove the margins if any */
    margin: 0;
    /* Allow them to scroll down the document */
    overflow-y: hidden;
}

.body {
    /* Sending body at the bottom of the stack */
    z-index: 1;
}

.wrapper {
    /* Making the wrapper stack above the body */
    z-index: 2;
}
/***********************************************/

@media {
    .container {
        background-color: lemonchiffon;
        max-width: 600px;
    }
}

* {
    box-sizing: border-box;
}

html {
    background-color: lavender;
    height: 100%;
}

body {
    position: fixed;
    height: 100%;
    background-color: floralwhite;
}

.cpointer {
    cursor: pointer;
}

hr.hr-6-12 {
    margin-top: 12px;
    margin-bottom: 6px;
}

hr.hr-1-6 {
    margin-top: 0px;
    margin-bottom: 6px;
}

hr.hr-2-6 {
    padding-top: 2px;
    margin-bottom: 6px;
}

hr.hr-2-2 {
    margin-top: 3px;
    margin-bottom: 0px;
}

hr.hr-1-12 {
    margin-top: 0px;
    margin-bottom: 8px;
}

hr.hr-8-8 {
    border-top: 8px;
    border-bottom: 8px;

}

hr.hr-6-1 {
    margin-top: 6px;
    margin-bottom: 1px;
}

hr.hr-1-1 {
    margin-top: 0px;
    margin-bottom: 0px;
}

hr.hr-sep {
    margin-top: 4px;
    margin-bottom: 4px;
    border: 1px solid rosybrown;
    border-radius: 1px;
}

hr.hr-sepend {
    margin-top: 4px;
    margin-bottom: 4px;
    border: 1px solid red;
    border-radius: 1px;
}

.line-0-0 {
    margin-top: 0px;
    margin-bottom: 0px;
    background-color: #e8ecf1;
    font-size: 1.4px;
    border-radius: 1px;
}

.line-8-8 {
    margin-top: 8px;
    margin-bottom: 8px;
    background-color: #e8ecf1;
    font-size: 1.4px;
    border-radius: 1px;
}

.line-6-0 {
    margin-top: 6px;
    margin-bottom: 0px;
    background-color: #e8ecf1;
    font-size: 1.4px;
    border-radius: 1px;
}

.line-8-1 {
    margin-top: 8px;
    margin-bottom: 1px;
    background-color: #e8ecf1;
    font-size: 1.4px;
    border-radius: 1px;
}

.line-1-8 {
    margin-top: 1px;
    margin-bottom: 8px;
    background-color: #e8ecf1;
    font-size: 1.4px;
    border-radius: 1px;
}

.line-16-0 {
    margin-top: 16px;
    margin-bottom: 0px;
    background-color: #e8ecf1;
    font-size: 1.4px;
    border-radius: 1px;
}

.line-0-16 {
    margin-top: 0px;
    margin-bottom: 16px;
    background-color: #e8ecf1;
    font-size: 1.4px;
    border-radius: 1px;
}
.line-16-16 {
    margin-top: 16px;
    margin-bottom: 16px;
    background-color: #e8ecf1;
    font-size: 1.4px;
    border-radius: 1px;
}

img.topmenu {
    width: auto;
    height: 8vh;
    padding-top: 6px;
}

img.homeicon {
    width: auto;
    height: 7vh;
    padding-top: 6px;
}

img.walleticon {
    width: auto;
    height: 8vh;
    padding-top: 4px;
}

img.trolleyicon {
    width: auto;
    height: 7vh;
    padding-top: 8px;
}

img.basketcross {
    width: auto;
    height: 3vh;
}

img.chevronback {
    width: auto;
    height: 6.5vh;
    padding-top: 10px;
}

img.chevronbackmodal {
    width: auto;
    height: 4vh;
}

img.btnicon {
    height: 2vh;
    width: auto;
    position: relative;
    top: -1px;
}

img.deliverytruck {
    width: auto;
    height: 5vh;
}

.backcolour1 {
    background-color: lightgoldenrodyellow;
}

.divspace0 {
    height: 1vh;
}

.divspace1 {
    height: 5%;
}

.divspace2 {
    height: 3%;
}

.divspace2h {
    height: 2vh;
}

.divspacex {
    height: 2vh;
}

.greetcard1 {
    background-color: lightsalmon;
}
.greetcard2 {
    background-color: lightsalmon;
}
.greetcard3 {
    background-color: lightsalmon;
}
.greetcard4 {
    background-color: lightsalmon;
}

.deliverto {
    font-style: italic;
    color: brown;
    font-size: 0.8em;
}


.tnav {
    height: 60px;
}


.headerrow {
    height: 9vh;    
    background-color: lightsalmon;
    line-height: 120%;
}


.titletext {
    padding-top: 16px;
    font-weight: bold;
    font-size: 1.2em;
}

.titlebasket {
    padding-top: 8px;
    font-weight: bold;
    font-size: 1.0em;
}

.titlerow {
    height: 8vh;
    padding-top: 8px;
}

.titlerowbasket {
    height: 6vh;
    padding-top: 4px;
}

.basketitems {
    position: relative;
    top: +6px;
}

.headcolumn {
    background-color: orangered;
    color: lemonchiffon;
    height: 3.5vh;
}

.headcolumncell {
   
}

.menubody {
    
}

.menurow {
    height: 79.5vh;
    overflow-y: auto;
}

.menucolumn {
    height: 100%;
    overflow-y: auto;
}

.tablebody {
    height: 62vh;
}

.tableend {
    height: 10vh;
}

.paypalrow1 {
    height: 80vh;
    overflow-y: auto;
}

.paypalrow2 {
    height: 75vh;
    overflow-y: auto;
}

.orderrow {
    height: 60vh;
    overflow-y: auto;
}

.gettablerow {
    height: 48vh;
}

.gettablecolumn {
    height: 60%;
    overflow-y: scroll;
}


.gettablerowrow {
    height: 10vh;
}

.greeterrow {
    height: 75vh;
    overflow-y: scroll;
    overflow-x: hidden;
}


.btngreetoptions,
.btngreetoptions:focus,
.btngreetoptions:active {
    /*background-color: #e8ecf1;*/
    background-color: transparent;
    color: darkslategrey;
    box-shadow: none;
    outline: none;
    border: 1px solid #787575;
}

.greetoptions {
    height: 26vh;
    overflow-y: scroll;
    overflow-x: hidden;
}

.footerrow {
    height: 8vh;
    background-color: lightsalmon;
    color: firebrick;
    font-size: 0.8em;
    line-height: 110%;
}

.footerrowpay {
    height: 10vh;
    background-color: lightsalmon;
    color: firebrick;
    font-size: 0.8em;
    line-height: 120%;
}

.footerrowtxt1 {
    display: none;
}

.footerrowtxt2 {
    padding-top: 8px;
}


.m_menurow {
    height: 80vh;
    overflow-y: scroll;
}

.tandc {
    font-size: 0.8em;
    color: darkgreen;
    font-style: italic;
}


.menutxt {
    color: darkgreen;
    font-size: 0.8em;
    font-style: italic;
}

.menuicon {
    font-size: 0.8em;
    color: rgba(0,100,0,0.5);
}

.menuallergy {
    color: darkred;
    font-size: 0.8em;
    font-style: italic;
}

.menumenurow {
    min-height: 12vh;
    font-weight: 400;
    color: darkslategray;
    cursor: pointer;
}

.menuitemplurow {
    min-height: 12vh;
    cursor: pointer;
}

.menuitemaltrow {
    min-height: 8vh;
    cursor: pointer;
}

.pludesc {
    font-weight:  400;
    color: black;
}

.pluprice {
    font-weight: 400;
    color: black;
}

.plualtdesc {
    font-size: 0.9em;
    font-weight: 400;
    color: darkblue;
}

.plualtprice {
    font-size: 0.9em;
    font-weight: 400;
    color: darkblue;
}

.menuitemrowseperator {
    max-height: 3vh;
}


.menuitemendrow {
    height: 0.5vh;
    background-color: orangered;
    color: lemonchiffon;
}

.basketitemrow {
    min-height: 12vh;
    color: black;
}


.modal-header {
    background-color: salmon;
}


.fontsize06 {
    font-size: 0.6em;
}

.fontsize06i {
    font-size: 0.6em;
    font-style: italic;
}

.fontsize08 {
    font-size: 0.8em;
}

.fontsize08i {
    font-size: 0.8em;
    font-style: italic;
}

.italic {
    font-style: italic;
}

.nodisplay {
    display: none;
}

.todisplay {

}

.tablenumber {
    font-size: 1.4em;
    font-weight: bold;
}


.qtyqty {
    font-weight: bold;
    min-width: 20px;
}


    /*
.basketvalue {
    font-weight: bolder;
}
*/


.timeslot-row {
    height: 10vh;
}


.modalz1 {
    z-index: 1051 !important;
}

.modalz2 {
    z-index: 1052 !important;
}

.modalz3 {
    z-index: 1053 !important;
}

.modalz4 {
    z-index: 1054 !important;
}

.touched {
    background-color: white;
    font-style: italic;
    color: maroon;
}

.touched2 {
    background-color: peachpuff;
    font-style: italic;
    color: maroon;
}


.width-1 {
    width: 86px;
}

.width-2 {
    width: 68px;
}

.lh-12 {
    line-height: 120%;
}

.fs-08 {
    font-size: 0.8em;
}

.nopadding {
    padding: 0 !important;
    margin: 0 !important;
}

.padding-0 {
    padding: 0 !important;
}

.padding-2 {
    padding: 2px !important;
}

.padding-5 {
    padding: 5px !important;
}

.nofocus:focus {
    outline: 0 !important;

}

.textdarkred {
    color: darkred;
}

.textdarkgreen {
    color: darkgreen;
}


/****************************/
/*  Message modal           */
/****************************/
.modal.modalmessage {
    max-height: 100vh;
}

    .modal.modalmessage .modal-dialog {
        max-width: 460px;
    }

    .modal.modalmessage .modal-header {
        background-color: salmon;
    }

    .modal.modalmessage .modal-body {
        min-height: 30vh;
    }

    .modal.modalmessage .modal-footer {
        background-color: bisque;
    }

/****************************/
/*  Message modal NF        */
/****************************/
.modal.modalmessagenf {
    max-height: 100vh;
}

    .modal.modalmessagenf .modal-dialog {
        max-width: 460px;
    }

    .modal.modalmessagenf .modal-body {
        min-height: 30vh;
    }



/****************************/
/*  Modifier modal          */
/****************************/
.modal.modifier {
    max-height: 100vh;
}

    .modal.modifier .modal-dialog {
        max-width: 460px;    
    }

    .modal.modifier .modal-content {       
        max-height: 100vh;
        background-color: lightblue;
    }

    .modal.modifier .modal-header {
        font-weight: bold;
        font-size: 1.1em;
        background-color: lightblue;
        padding: 2px 0px 6px 0px;
        margin: 2px 0px 6px 0px;
    }

    .modal.modifier .modal-body {
        padding: 0px;
        margin: 0px;
    }

    .modal.modifier .modal-footer {
        max-height: 50vh;
        background-color: lightblue;
        padding: 0px;
        margin: 6px 0px 6px 0px;
    }

.mod-mod-title {  
    font-weight: bold;
    font-size: 1.1em;
}

.mod-mod-row-head {
    font-weight: bold;
    font-style: italic;
    height: 6vh;
    background-color: lightsalmon;
}

.mod-mod-row {
    min-height: 6vh;
    background-color: white;
    color: darkblue;
}

.allergy {
    color: darkred;
    font-size: 0.7em;
}

.specialrequest {
    overflow-y: auto;
    max-height: 20vh;
}


/****************************/
/*  Fragment modal          */
/****************************/
.modal.fragmentmodal {
    max-height: 100vh;
}

    .modal.fragmentmodal .modal-dialog {
        max-width: 460px;
    }

    .modal.fragmentmodal .modal-content {
        min-height: 60vh;
        max-height: 100vh;
    }

    .modal.fragmentmodal .modal-header {
        font-weight: bold;
        font-size: 1.2em;
        background-color: salmon;
    }

    .modal.fragmentmodal .modal-body {
    }

    .modal.fragmentmodal .modal-footer {
        background-color: salmon;
    }


/****************************/
/*  Side Panel modal        */
/****************************/
.modal.leftmenu {
    position: fixed;
    left: -320px;
    top: 0;   
    width: 320px;
    height: 100vh;
}

    .modal.leftmenu .modal-dialog {
        margin: 0px;
        padding: 0px;
        width: 320px;
    }

    .modal.leftmenu .modal-content {
    }

    .modal.leftmenu .modal-body {        
        padding: 0px;
    }

    .modal.leftmenu .bodyheader {
        height: 9vh;
        font-size: 1.2em;
        font-weight: bold;
        background-color: salmon;
        padding-top: 10px;
    }

    .modal.leftmenu .bodyheaderclose {
        margin-left: -14px;
    }

    .modal.leftmenu .bodybody {
        height: 90.7vh;
        overflow-y: auto;
        overflow-x: hidden;
    }

.noheadsep {
    border-bottom: 0 none;
}

.nofootsep {
    border-top: 0 none;
}

.moreleft {
    text-align: left !important;
    position: relative;
    margin-left: -16px;
    margin-right: 16px;
}

.moreright {
    text-align: left !important;
    position: relative;
    margin-left: 12px;
    margin-right:-12px;
}


@media screen and (max-height: 620px) {
    .titlerow {
        padding-top: 6px;
    }

    .footerrowtxt2 {
        padding-top: 6px;
    }

    .titletext {
        padding-top: 8px;
    }
}

@media screen and (max-height: 460px) {
    .headerrow {
        height: 12vh;
    }

    .titlerow {
        padding-top: 0px;
    }

    .titletext {
        padding-top: 8px;
    }

    .titlebasket {
        padding-top: 2px;
    }

    .greeterrow {
        height: 68vh;
    }

    .footerrow {
        height: 12vh;
    }

    img.homeicon {
        height: 10vh;
        padding-top: 6px;
    }

    img.chevronback {
        height: 9.5vh;
        padding-top: 6px;
    }

    img.topmenu {
        height: 11vh;
        padding-top: 6px;
    }

    img.basketcross {
        height: 5vh;
    }

    .divspace1 {
        height: 3%;
    }

    .divspace2 {
        height: 1%;
    }

    .footerrowtxt1 {
        display: none;
    }

    .footerrowtxt2 {
        padding-top: 6px;
    }

    .tablebody {
        height: 52vh;
    }

    .tableend {
        height: 12vh;
    }

    img.btnicon {
        height: 3vh;
        width: auto;
        position: relative;
        top: -2px;
    }

    .headcolumn {
        height: 6vh;
    }

    .menurow {
        height: 70vh;
        overflow-y: auto;
    }

    .paydelivery {
        font-size: 1.2em;
    }

    .titlerowbasket {
        height: 9vh;
    }

    .paypalrow1 {
        height: 72vh;
    }

    .paypalrow2 {
        height: 63vh;
    }

    .footerrowpay {
        height: 16vh;
    }

    img.walleticon {
        width: auto;
        height: 12vh;
    }

    img.trolleyicon {
        width: auto;
        height: 11vh;
    }

    img.chevronbackmodal {
        width: auto;
        height: 6vh;
    }

    .modal.leftmenu .bodyheader {
        height: 12vh;
        padding-top: 6px;
    }

    .modal.leftmenu .bodybody {
        height: 87.5vh;
    }

    .mod-mod-row-head {
        height: 8vh;
    }

    .mod-mod-row {
        min-height: 8vh;
    }

    .menumenurow {
        min-height: 16vh;
    }

    .menuitemplurow {
        min-height: 16vh;
    }

    .menuitemaltrow {
        min-height: 12vh;
    }

}