



.vegicon                                                                { display: block; width: 18px; height: 14px; overflow: hidden; position: absolute; top: 50%; left: 0; margin-top: -7px; }
.vegicon img                                                            { display: block; position: absolute; left: 0; }

.vegicon.yes img                                                        { top: 0; }
.vegicon.no img                                                         { top: -14px; }
.vegicon.egg img                                                        { top: -28px; }


/* Back to Menu trigger at the bottom of Item Detail & Item Customizer */

div.backtomenu                                                          { padding: 0 0 12px 0; line-height: normal; text-align: center; font-size: 85%; margin: 0; }




/* CATEGORIES & CHECKOUT */

.catnav                                                                 { padding: 12px 0; display: none; overflow: auto; bottom: 100px; width: 288px; max-height: 70%; left: 50%; transform: translate( -50%, 0 ); color: #ffffff; background: #333333; position: fixed; z-index: 1000; -webkit-border-top-left-radius: 7px; -moz-border-radius-topleft: 7px; border-top-left-radius: 7px; -webkit-border-top-right-radius: 7px; -moz-border-radius-topright: 7px; border-top-right-radius: 7px; box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75); -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75); -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75); }
.catnav ul                                                              { margin: 0; padding: 0 16px; list-style: none; }
.catnav li                                                              { font-size: 100%; padding: 10px 0 6px 0; width: 100%; white-space: nowrap; overflow: hidden; margin: 0; text-overflow: ellipsis; }
.catnav li.heading2                                                     { font-size: 80%; padding: 4px 0 4px 16px; }

.cattrigger                                                             { bottom: -28px; left: 50%; margin-left: -45px; width: 90px; line-height: 28px; height: 28px; border: none; font-size: 75%; color: #ffffff; background: #333333; position: fixed; z-index: 1000; text-transform: uppercase; letter-spacing: .2em; box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75); -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75); -moz-box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.75); }
.cattrigger.active                                                      { -webkit-border-top-left-radius: 0; -moz-border-radius-topleft: 0; border-top-left-radius: 0; -webkit-border-top-right-radius: 0; -moz-border-radius-topright: 0; border-top-right-radius: 0; }

.checkoutbar                                                            { display: none; bottom: 0; font-size: 85%; text-transform: uppercase; color: #ffffff; left: 0; width: 100%; position: fixed; z-index: 1500; }
.checkoutbar .linkbg                                                    { cursor: pointer; padding: 0 16px; height: 48px; display: flex; flex-direction: row; align-items: center; -webkit-border-top-left-radius: 7px; -webkit-border-top-right-radius: 7px; -moz-border-radius-topleft: 7px; -moz-border-radius-topright: 7px; border-top-left-radius: 7px; border-top-right-radius: 7px; box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5); -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5); -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5); }

.checkoutbar .checkout                                                  { margin-left: auto; }
.checkoutbar .itemcount                                                 { margin-left: 8px; }
.checkoutbar .value                                                     { font-size: 130%; }
.checkoutbar .aed                                                       { font-size: 130%; margin-right: 4px; }
.checkoutbar a                                                          { color: #ffffff; }


@media( min-width: 425px ) {
.checkoutbar .value                                                     { font-size: 175%; }
.checkoutbar .aed                                                       { font-size: 175%; }
}




/* ITEM CUSTOMIZER */

.itemcustomizer                                                         { display: none; }
.itemcustomizer header                                                  { color: #ffffff; z-index: 5500; height: 48px; font-size: 100%; position: fixed; width: 100%; top: 0; left: 0; }
.itemcustomizer footer                                                  { z-index: 5500; height: 96px; text-align: center; line-height: 64px; position: fixed; width: 100%; bottom: 0; left: 0; background: #ffffff; box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.2); -webkit-box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.2); -moz-box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.2); }

.itemcustomizer header .container                                       { position: relative; height: 100%; }
.itemcustomizer header .fas                                             { position: absolute; top: 50%; left: 0; transform: translate(0,-50%); }

.itemcustomizer header .text                                            { position: absolute; top: 50%; left: 0; transform: translate(0,-50%); font-size: 90%; font-weight: bold; width: 100%; padding-left: 24px; overflow: hidden; text-overflow: ellipsis; }
.itemcustomizer header .text .itemname                                  { display: none; }
.itemcustomizer header .text .boxtype                                   { font-weight: bold; }

.itemcustomizer header.scrolled                                         { box-shadow: 0px 0px 8px 0px rgba(0,0,0,0.75); -webkit-box-shadow: 0px 0px 8px 0px rgba(0,0,0,0.75); -moz-box-shadow: 0px 0px 8px 0px rgba(0,0,0,0.75); }
.itemcustomizer header.scrolled .text .itemname                         { display: inline; }
.itemcustomizer header.scrolled .text .boxtype                          { display: block; font-size: 80%; font-weight: normal; }

.itemcustomizer form                                                    { top: 48px; z-index: 5000; position: fixed; left: 0; width: 100%; background: #E5E5E5; }
.itemcustomizer form .content                                           { overflow: auto; height: 100%; }

.itemcustomizer form h6                                                 { color: #000000; overflow: auto; margin: 12px 0 0 0; padding: 0; font-size: 130%; font-weight: bold; }
.itemcustomizer form h6 .text                                           { float: left; width: 80%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.itemcustomizer form h6 .text.fullrow                                   { width: 100%; }
.itemcustomizer form h6 .price                                          { float: right; width: 20%; text-align: right; font-weight: normal; }

.itemcustomizer form .titleblock                                        { margin: 0; padding: 6px 0 0 0; color: #666666; }
.itemcustomizer form .titleblock .thetitle                              { display: block; padding-bottom: 1px; line-height: 10px; font-weight: bold; color: #000000; }
.itemcustomizer form .titleblock .required                              { font-size: 75%; }
.itemcustomizer form .titleblock .number                                { font-size: 75%; }

.itemcustomizer form .custom                                            { margin: 12px 0 0 0; padding: 8px 12px; background: #ffffff; list-style: none; }
.itemcustomizer form .custom.notesblock                                 { margin-bottom: 12px; padding-bottom: 12px; }
.itemcustomizer form .custom.notesblock textarea                        { background: #ffffff; display: block; margin: 12px 0 0 0; padding: 4px 8px; width: 100%; border: 1px solid #cccccc; }


/* ITEM CUSTOMIZER: Summary */

.itemcustomizer form .custom li                                         { margin: 4px 0; padding: 0; font-size: 90%; }
.itemcustomizer form .custom li strong                                  { display: block; font-size: 90%; color: #666666; }

.itemcustomizer form .custom li .notescontent                           { white-space: pre-line; }

.itemcustomizer form .summary                                           { padding-bottom: 16px; }
.itemcustomizer form .summary .actionrow                                { color: #000000; line-height: 32px; font-size: 110%; overflow: auto; border-top: 1px dashed #999999; margin: 8px 0 0 0; padding: 6px 0 0 0; }
.itemcustomizer form .summary .summaryprice                             { line-height: 28px; float: left; }
.itemcustomizer form .summary .buttonwrap                               { line-height: 28px; float: right; }

.itemcustomizer form .summary .buttonwrap .edit                         { border-width: 1px; border-style: solid; font-size: 80%; padding: 2px 8px; margin-right: 16px; }
.itemcustomizer form .summary .buttonwrap .edit .fas                    { font-size: 85%; }
.itemcustomizer form .summary .buttonwrap .edit.disabled                { border-color: #cccccc; color: #bbbbbb; }

.itemcustomizer form .summary .buttonwrap .qtymodifier                  { font-size: 105%; }
.itemcustomizer form .summary .buttonwrap .qty                          { font-size: 90%; display: inline-block; text-align: center; width: 32px; font-weight: bold; }

.itemcustomizer form .summary .another                                  { margin: 0; padding: 20px 0 8px 0; text-align: center; }
.itemcustomizer form .summary .another button                           { margin: 0;  padding: 4px 12px; font-size: 85%; background: #ffffff; border-width: 1px; border-style: solid; }
.itemcustomizer form .summary .another button:disabled                  { border-color: #cccccc; color: #bbbbbb; }

/**/


.itemcustomizer form .options                                           { margin: 6px 0 0 0; padding: 0; list-style: none; }
.itemcustomizer form .options li                                        { margin: 0; padding: 0; display: flex; flex-direction: row; }

.itemcustomizer form .options li .name                                  { width: 72%; line-height: 28px; color: #000000; }
.itemcustomizer form .options li.selected .name                         { color: #ff6434; }

.itemcustomizer form .options li .price                                 { width: 21%; line-height: 28px; text-align: right; color: #333333; }
.itemcustomizer form .options li .input                                 { width: 8%; line-height: 28px; text-align: right; }
.itemcustomizer form .options li .input input                           { margin: 0; padding: 0; vertical-align: middle; }




/* ITEM DETAIL POPUP */

.itemdetailpopbg                                                        { display: none; z-index: 4500; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: #000000; opacity: .85; }
.itemdetailpopbg .far                                                   { font-size: 200%; position: absolute; top: 12px; left: 50%; transform: translate(-50%,0); }

.itemdetailpop                                                          { display: none; z-index: 5000; position: fixed; top: 100%; left: 0; width: 100%; background: #ffffff; -webkit-border-top-left-radius: 7px; -webkit-border-top-right-radius: 7px; -moz-border-radius-topleft: 7px; -moz-border-radius-topright: 7px; border-top-left-radius: 7px; border-top-right-radius: 7px; box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75); -webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75); -moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75); }
.itemdetailpop .contentcontainer                                        { padding-top: 16px; }
.itemdetailpop .content                                                 { overflow: auto; }

.itemdetailpop figure                                                   { margin: 0; padding: 0; }
.itemdetailpop figure .picture                                          { width: 100%; aspect-ratio: 1/1; background: #f0f0f0; }
.itemdetailpop figure .picture img                                      { width: 100%; height: 100%; display: block; object-fit: cover; }

.itemdetailpop figcaption                                               { margin-top: 12px; }
.itemdetailpop figcaption h6                                            { font-size: 150%; margin: 10px 0 0 0; }
.itemdetailpop figcaption p                                             { white-space: pre-line; margin: 10px 0 0 0; font-size: 100%; padding: 0; }

.itemdetailpop .bottominfo                                              { position: relative; font-size: 110%; margin: 0; padding: 0; height: 32px; line-height: 32px; padding: 12px 0; text-align: center; }
.itemdetailpop .bottominfo .vegicon                                     { margin-right: 8px; }

.itemdetailpop .addtocart                                               { text-align: center; line-height: 64px; position: absolute; bottom: 64px; left: 0; width: 100%; background: #ffffff; box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5); -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5); -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5); }




.notespopup                                                             { z-index: 7000; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.85); }
.notespopup .panel                                                      { padding: 0 12px 12px 12px; position: absolute; top: 50%; left: 50%; width: 288px; transform: translate(-50%,-50%); background-color: #ffffff; }
.notespopup p                                                           { margin: 12px 0 0 0; padding: 0; }
.notespopup textarea                                                    { display: block; width: 100%; border: 1px solid #cccccc; background: #f0f0f0; padding: 8px 12px; }
.notespopup button                                                      { width: 100%; display: block }




/*** .resto in sitewide ***/

.middleblock .resto footer                                              { padding-bottom: 100px; }


.restoclosed .signouter                                                 { margin: 32px auto 0 auto; padding: 3px; -webkit-border-radius: 9px; -moz-border-radius: 9px; border-radius: 9px; background: #E63E3E; max-width: 180px; }
.restoclosed .sign                                                      { border: 2px solid #ffffff; font-size: 125%; text-align: center; margin: 0; padding: 8px 24px; color: #ffffff; -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; }
.restoclosed big                                                        { font-size: 150%; }

.restoclosed .timer                                                     { color: #666666; text-align: center; font-size: 85%; margin: 24px 0 0 0; }
.restoclosed .timer code                                                { }


.searchtrigger                                                          { color: #000000; padding: 12px 0 4px 0; margin: 4px 0 0 0; background: #ffffff; position: sticky; top: -2px; z-index: 999; font-size: 89%; text-align: center; }
.searchtrigger input                                                    { text-align: center; background: #333333; color: #ffffff; border: 1px solid #333333; font-size: 100%; margin: 0; padding: 4px; width: 180px; }
.searchtrigger input::placeholder                                       { color: #ffffff; opacity: 1; }

.searchtrigger input::-moz-selection                                    { color: #ffffff; background: #6085BB; }
.searchtrigger input::selection                                         { color: #ffffff; background: #6085BB; }

.searchtrigger[stuck]                                                   { padding: 12px 32px 4px 0; }
.searchtrigger[stuck] input                                             { width: 100%; padding: 8px 4px; border-color: #333333; background: #333333; color: #ffffff; }
.searchtrigger[stuck] input.yellowish                                   {}

.searchtrigger[stuck] input::placeholder                                { color: #ffffff; opacity: 1; }

@media( min-width: 600px ) {

.searchtrigger, .searchtrigger[stuck]                                   { padding-right: 0; }

}


.restomenu .menuitems                                                   { border-bottom: 1px solid #DEDEDE; margin: 18px 0 0 0; padding: 0; list-style: none; }
.restomenu .menuitems li                                                { padding: 15px 0 10px 0; border-top: 1px solid #DEDEDE; margin: 0; }

.restomenu .menuitems li.headingrow                                     { padding: 0; border: none; }
.restomenu h4                                                           { text-align: center; margin: 32px 0 24px 0; padding: 0; font-size: 150%; }
.restomenu h5                                                           { text-align: center; margin: 24px 0 24px 0; padding: 0; text-transform: uppercase; font-size: 110%; font-weight: normal; letter-spacing: .2em; color: #666666; }

.restomenu .menuitems .detail                                           { margin: 0; padding: 0; overflow: auto; }

.restomenu .menuitems .detail .picture                                  { width: 72px; height: 72px; margin-left: 8px; float: right; position: relative; }
.restomenu .menuitems .detail .picture img                              { width: 100%; height: 100%; display: block; object-fit: cover; }
.restomenu .menuitems .detail .picture .fas                             { font-size: 300%; color: #dddddd; position: absolute; top: 50%; left: 50%; transform: translate( -50%, -50% ); }

.restomenu .menuitems .detail .text                                     { height: 72px; position: relative; }
/*
.restomenu .menuitems .detail .text h6                                  { margin: 0; padding: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 120%; font-weight: bold; }
*/
.restomenu .menuitems .detail .text h6                                  { margin: 0; padding: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 110%; font-weight: normal; }
.restomenu .menuitems .detail .text .description                        { color: #666666; margin: 5px 0 0 0; padding: 0; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }

.restomenu .menuitems .detail .text .priceblock                         { margin-right: 80px; position: absolute; bottom: 0; left: 0; align-items: baseline; display: flex; flex-flow: row nowrap; }

.restomenu .menuitems .detail .text .pricewrap                          { font-size: 140%; white-space: nowrap; }
.restomenu .menuitems .detail .text .pricewrap strong                   { font-weight: normal; }

/*
.restomenu .menuitems .detail .text .pricewrap del                      { text-decoration: none; position: relative; margin-right: 8px; }
.restomenu .menuitems .detail .text .pricewrap del:before               { content: " "; display: block; width: 100%; border-top: 2px solid rgba( 255, 0, 0, .6 ); height: 4px; position: absolute; bottom: 6px; left: 0; transform: rotate(-11deg); }
.restomenu .menuitems .detail .text .pricewrap del:after                { content: " "; display: block; width: 100%; border-top: 2px solid rgba( 255, 0, 0, .6 ); height: 4px; position: absolute; bottom: 6px; left: 0; transform: rotate(11deg); }
*/
.restomenu .menuitems .detail .text .pricewrap del                      { color: #999999; margin-left: 8px; }

.restomenu .menuitems .action                                           { overflow: hidden; line-height: 24px; height: 24px; margin: 5px 0; position: relative; }

.restomenu .menuitems .action .disabletrigger                           { margin-left: 48px; cursor: pointer; position: relative; z-index: 900; }

.restomenu .menuitem                                                    { position: relative; }
.restomenu .menuitem.notavailable .blocker                              { z-index: 500; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #ffffff; opacity: .6; }


/* SIMPLE ROW */

.restomenu .menuitems .simplerow                                        { padding: 6px 0 0 0; }
.restomenu .menuitems .simplerow .detail .picture                       { display: none; }
.restomenu .menuitems .simplerow .detail .text .description             { display: none; }

.restomenu .menuitems .simplerow .detail .text                          { height: auto; }
.restomenu .menuitems .simplerow .detail .text h6                       { font-weight: normal; font-size: 110%; }

.restomenu .menuitems .simplerow .action                                { margin-top: 1px; }

.restomenu .menuitems .simplerow .priceblock                            { display: inline-block; margin-left: 32px; }
.restomenu .menuitems .simplerow .priceblock .pricewrap                 { white-space: nowrap; }
.restomenu .menuitems .simplerow .priceblock .pricewrap strong          { font-weight: normal; }

.restomenu .menuitems .simplerow .disabletrigger                        { margin-left: 8px; }



/*
.restomenu .menuitems li.thesimplerow                                   { padding: 8px 0 3px 0; }
.restomenu .menuitems .thesimplerow .action                             { margin-top: 3px; }

.restomenu .menuitems .detail .text.simplerow                           { height: auto; }
.restomenu .menuitems .detail .text.simplerow h6                        { font-weight: normal; font-size: 130%; }

.simplerowpadder                                                        { display: inline-block; width: 18px; }

.priceblock.simplerow                                                   { display: inline-block; margin-left: 8px; }
.priceblock.simplerow .pricewrap                                        { white-space: nowrap; }
.priceblock.simplerow .pricewrap strong                                 { font-weight: normal; }

.restomenu .menuitems .action .simplerow .disabletrigger                { margin-left: 8px; }
*/




.restomenu .button                                                      { line-height: 24px; height: 24px; font-size: 85%; float: right; color: #999999; display: block; }
.restomenu .button .fas                                                 { }

.restomenu .button .notes                                               { cursor: pointer; }
.restomenu .button .qtymodifier                                         { color: #000000; font-size: 125%; margin-left: 12px; display: inline-block; }
.restomenu .button .qtymodifier .qty                                    { font-weight: bold; display: inline-block; text-align: center; width: 33px; }

.restomenu .button .add                                                 { cursor: pointer; height: 24px; display: inline-block; width: 72px; text-align: center; border-width: 1px; border-style: solid; margin-left: 12px; font-size: 115%; }
.restomenu .button .add .thetext                                        {}
.restomenu .button .add .theloading                                     { display: none; }



