/*=== DEFAULT ===*/
html {
    height: 100%;
}

ul {
    list-style: none;
}

.left {
    float: left;
    overflow: hidden;
}

.right {
    float: right;
    overflow: hidden;
}

.panel {
    overflow: auto;
}

.btn-group-xs >.btn, .btn-xs {
    padding: 5px 5px;
}

.btns {
    font-size: 16px;
    color: white;
    border: 0 solid transparent;
    padding: 8px 30px;
    border-radius: 4px;
}

.btn-order-home{
	height:50px;
	width:100px;
	padding:10px;
	font-size: large;
}
.monam{
	height: 30px;
    margin-bottom: 5px;
    margin-top: 5px;
    width: 90px;
}

.btn-blue {
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#20b3f6+0,238fc0+100 */
    background: #20b3f6; /* Old browsers */
    background: -moz-linear-gradient(top,  #20b3f6 0%, #238fc0 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  #20b3f6 0%,#238fc0 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  #20b3f6 0%,#238fc0 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#20b3f6', endColorstr='#238fc0',GradientType=0 ); /* IE6-9 */
    color: white;
}

.btn-grey {
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#e9e8e8+0,dadad9+100 */
    background: #e9e8e8 !important;/* Old browsers */
    background: -moz-linear-gradient(top,  #e9e8e8 0%, #dadad9 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  #e9e8e8 0%,#dadad9 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  #e9e8e8 0%,#dadad9 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e9e8e8', endColorstr='#dadad9',GradientType=0 ); /* IE6-9 */
}

.btn-orange {
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f59221+0,e38024+100 */
    background: #f59221; /* Old browsers */
    background: -moz-linear-gradient(top,  #f59221 0%, #e38024 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  #f59221 0%,#e38024 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  #f59221 0%,#e38024 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f59221', endColorstr='#e38024',GradientType=0 ); /* IE6-9 */
    color: white;
}

.btn-red {
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ff3019+0,cf0404+100;Red+3D */
    background: #ff3019; /* Old browsers */
    background: -moz-linear-gradient(top,  #ff3019 0%, #cf0404 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  #ff3019 0%,#cf0404 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  #ff3019 0%,#cf0404 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff3019', endColorstr='#cf0404',GradientType=0 ); /* IE6-9 */
    color: white;
}


.btn-default {
    background-color: #b5b5b5;
}

.bg-gray{
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,e5e5e5+100;White+3D */
    background: #ffffff; /* Old browsers */
    background: -moz-linear-gradient(top,  #ffffff 0%, #e5e5e5 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  #ffffff 0%,#e5e5e5 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  #ffffff 0%,#e5e5e5 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5e5e5',GradientType=0 ); /* IE6-9 */
}

.box {
    border-top: 0;
    border-radius: 5px;
    box-shadow: -1px 3px 12px rgba(187, 195, 197, 0.6);
}

.nav-tabs {
    border-bottom: 0;
}

.txtorange {
    color: #ea8723;
    font-weight: bold;
}

#n_area > li {
    margin-left: 10px;
}

/*=== CONTENT ===*/
.login-page {
    /*background-image: url('../img/gb-bg.jpg');*/
    background-color: #ffe9de;
}

.login-box {
    background-color: #ffffff;
    -webkit-box-shadow: -3px 4px 8px 0px rgba(50, 50, 50, 0.35);
    -moz-box-shadow: -3px 4px 8px 0px rgba(50, 50, 50, 0.35);
    box-shadow: -3px 4px 8px 0px rgba(50, 50, 50, 0.35);
    margin-top: 10%;
}

nav.navbar {
    position: relative;
}

.sw {
    position: absolute;
    right: 15px;
    top: 10px;
    background: #212020;
    color: white;
    padding: 5px;
    border-radius: 4px;
    cursor: pointer;
}

.disc-am {
    width: 23%;
    margin-right: 6px;
    padding: 2px 5px;
}

.disc-no {
    width: 55%;
    margin-right: 6px;
    padding: 2px 5px;
}

.ref {
    border: transparent;
}
.head-form > div {
    margin: 10px 0;
    padding: 10px 0;
}
.os-table .text-right {
    padding-right: 35px;
}
.os-footer {
    padding: 0 20px;
}
.os-footer > table > tbody > tr > td {
    padding: 2px 8px;
}
.os-footer > table > tbody > tr > td {
    font-size: 18px;
}
.os-header > label, .os-header > span {
    font-size: 18px;
}
.ambtn {
    margin: 1px;
}

/*#_details_area, #_order_area {
    margin-top: 45px;
}*/

/*=== LEFT CONTENT ===*/
.sec-all > .box, .prod > .box, .sec-two > .box, .sec-thr > .box {
    border-radius: 0 0 5px 5px;
    padding: 15px 0 5px 0;
}
ul.nav.nav-tabs > li > a, ul.nav.nav-tabs > li > a:hover {
    position: relative; 
    padding: .5em 2.0em;
    width: 100%;
    float: left;
    text-decoration: none;
    color: #fff;
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f59221+0,e38024+100 */
    background: #f59221; /* Old browsers */
    background: -moz-linear-gradient(top,  #f59221 0%, #e38024 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  #f59221 0%,#e38024 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  #f59221 0%,#e38024 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f59221', endColorstr='#e38024',GradientType=0 ); /* IE6-9 */
    border-radius: 5px 15px 0 0;
    border: 1px solid #f49122;
    box-shadow: 2px 2px 2px rgba(0,0,0,.4);
}
ul.nav.nav-tabs > li > a:after {
    content:'';
    position:absolute;
    z-index: 1;
    top: -1px;
    right: -.4em;  
    bottom: 0;
    width: 1em;
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f59221+0,e38024+100 */
    background: #f59221; /* Old browsers */
    background: -moz-linear-gradient(top,  #f59221 0%, #e38024 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  #f59221 0%,#e38024 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  #f59221 0%,#e38024 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f59221', endColorstr='#e38024',GradientType=0 ); /* IE6-9 */
    transform: skew(15deg);
    border-radius: 0 5px 0 0; 
    box-shadow: 2px 0px 0px rgba(0,0,0,.4);
}
ul.nav.nav-tabs > li.active > a {
    background: #fff !important;
    color: #ea8723;
    border: 1px solid #fff !important;
    box-shadow: -1px -1px 13px rgba(187, 195, 197, 0.6);
    -webkit-box-shadow: -1px -1px 13px rgba(187, 195, 197, 0.6);
    -moz-box-shadow: -1px -1px 13px rgba(187, 195, 197, 0.6);
    -o-box-shadow: -1px -1px 13px rgba(187, 195, 197, 0.6);
}
ul.nav.nav-tabs > li.active > a:after {
    background: #fff !important;
    border: 1px solid #fff !important;
}
.box.breadcrum-container {
    margin: 0;
    border-radius: 5px 5px 0 0;
}
.breadcrumb {
    padding: 8px 20px;
    background-color: white;
    border-radius: 5px;
    margin: 0;
}
.breadcrumb>li+li:before {
    padding: 0 5px;
    color: #212020;
    content: "/\00a0";
    font-size: 18px;
}
.breadcrumb > li > a, .breadcrumb > li > span {
    background-color: #212020;
    padding: 3px 8px;
    color: white !important;
    border-radius: 4px;
}
.table-number > ul {
    padding: 0 15px;
}
.table-number > ul > li {
    width: calc(100% / 4 - 13px);
    display: inline-block;
    text-align: center;
    margin: 0 5px 10px;
}
.table-number > ul > li > button {
    padding: 15px 5px;
    border: 0;
    width: 100%;
    display: block;
    font-size: 23px;
}
.active-table, .active-cat, .active-prod, 
.active-opt1, .active-opt2, .active-opt3, .active-opt4, .active-opt5, .active-opt6, .active-opt7, .active-opt8, .active-opt9, .active-opt10,
.active-opt11, .active-opt12, .active-opt13, .active-opt14, .active-opt15, .active-opt16, .active-opt17, .active-opt18, .active-opt19, .active-opt20,
.active-opt21, .active-opt22, .active-opt23, .active-opt24, .active-opt25, .active-opt26, .active-opt27, .active-opt28, .active-opt29, .active-opt30,
.active-opt31, .active-opt32, .active-opt33, .active-opt34, .active-opt35, .active-opt36, .active-opt37, .active-opt38, .active-opt39, .active-opt40,
.active-opt41, .active-opt42, .active-opt43, .active-opt44, .active-opt45, .active-opt46, .active-opt47, .active-opt48, .active-opt49, .active-opt50,
.active-opt51, .active-opt52, .active-opt53, .active-opt54, .active-opt55, .active-opt56, .active-opt57, .active-opt58, .active-opt59, .active-opt60 {
    background: #eb8822 !important;
}
.categories > ul, .main_categories > ul {
    padding: 0;
}
.products > ul {
    padding: 0 5px;
}
.products > ul > li, .categories > ul > li, .main_categories > ul > li {
    display: flex;
    flex-wrap: wrap;
}
.products > ul > li > button, .categories > ul > li > button, .main_categories > ul > li > button {
    width: calc(100% / 4 - 6px);
    display: inline-block;
    margin: 0 3px 8px;
    padding: 20px 10px;
    font-size: 16px;
}
.note-cont {
    font-style: italic;
}
.__pies_options ul legend:first-child {
    margin-top: 0;
}
.__pies_options ul legend {
    margin-top: 35px;
}
.__pies_options ul legend h5 {
    font-weight: bold;
}

/*=== RIGHT CONTENT ===*/
#_order_area .box-body {
    overflow: auto;
}
.orders-content > ul {
    list-style: none;
    padding: 0;
}

.orders-content tr {
    padding: 10px 15px;
    font-size: 15px;
    position: relative;
    background-repeat: no-repeat;
    min-height: 100%;
}

.orders-content td {
    position: relative;
}

.orders-content > ul > li > span {
    margin: 0 5px;
}

.ordr-btn > div:first-child {
    padding-left: 0;
}

.orders-content i.remove {
    padding: 5px 7px;
}

.ordr-btn > div {
    padding-left: 6px;
}

.sc > input {
    vertical-align: text-top;
}
input#_disc, input#disc-note {
    width: 80px;
    height: 25px;
    margin-right: 10px;
    padding: 5px;
    border: 1px solid #f49121;
    border-radius: 4px;
}
input#disc-note {
    width: 120px;
}
#discount input[type=number]::-webkit-inner-spin-button, 
#discount input[type=number]::-webkit-outer-spin-button { 
  -webkit-appearance: none; 
  margin: 0; 
}
.btn-delivery {
    margin-bottom: 10px;
}
.btn-delivery > span {
    border-radius: 4px;
    margin-bottom: 8px;
}

/*==MOZILLA INPUT NUM==*/
#discount input[type='number'] {
    -moz-appearance:textfield;
}

/*=== LOGIN FOR WAITERS ===*/
.form-group._pincode > .keypinput-container > input {
    width: calc(100% / 4 - 14px);
    display: inline-block;
    text-align: center;
    height: 50px;
    margin: 0 5px 15px;
}
.login-box-body .col-md-4 {
    padding: 0 8px;
}
.kyepad-container > input {
    width: calc(100% / 3 - 15px);
    margin: 5px;
}
input.keypinput {
    font-size: 20px;
}
.login-logo > p {
    font-size: 17px;
    font-weight: bold;
    color: #ff0000;
}
input.btns#keydel {
    padding: 8px 5px;
}

/*=== Gravybaby Section ===*/
.gb-sec > div > div {
    margin-bottom: 15px;
}

.sec-search {
    height: 34px;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    -webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
}

/*=== RESPONSIVE TABS ===*/
a.accordion-link {
    background: #fff !important;
    box-shadow: -1px 3px 12px rgba(187, 195, 197, 0.6) !important;
    border-radius: 0 !important;
    border-color: transparent !important;
    border-bottom-color: #e2e2e2 !important;
    font-size: 18px;
    font-weight: bold;
    color: #eb8822 !important;
}

a.accordion-link.active {
    background: #eb8822 !important;
    color: white !important;
    margin: 0 !important;
}

/*=== FOOTER ===*/
.fullsc {
    display: none;
}

/*=== RESPONSIVE ===*/
@media screen and (max-width: 1024px) {
    .products > ul > li > button, .categories > ul > li > button {
        width: calc(100% / 3 - 6px);
        display: inline-block;
        margin: 5px 3px;
		min-height: 77px;
        padding: 15px 10px;
    }

    .table-number > ul > li > button {
        font-size: 20px;
    }
}

@media screen and (max-width: 990px){
    .active-cont {
        display: block;
    }

    ._orderhere {
        position: relative;
        padding-left: 0;
        padding-right: 0;
    }

    .navbar-custom-menu {
        float: left !important;
    }

    .navbar-custom-menu > .navbar-nav > li > .dropdown-menu {
        left: 7% !important;
    }

    .responsive-tabs-container > div > .tab-pane {
        margin: 0;
    }

    .responsive-tabs-container > div > .tab-pane .box {
        background: #ffeedd;
    }

    .box.breadcrum-container {
        margin: 0 0 15px;
        border-radius: 0;
    }
}

/*==for ipad==*/
@media only screen and (device-width: 768px) {
    .navbar-custom-menu {
        float: left !important;
    }

    .fullsc {
        display: block;
    }

    .login-box {
        margin-top: 25%;
    }
    .os-table th.text-center {
        width: 100px;
    }
    .os-table .text-right {
        padding-right: 25px;
    }
}

@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:portrait) {
    .navbar-custom-menu {
        float: left !important;
    }

    aside.main-sidebar {
       // display: none;
    }

    .fullsc {
        display: block;
    }

    .login-box {
        margin-top: 35%;
    }
}

@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:landscape) {
    .navbar-custom-menu {
        float: left !important;
    }

    .fullsc {
        display: block;
    }

    .login-box {
        margin-top: 20%;
    }

    .login-box.wac {
        margin-top: 15%;
    }
}


@media screen and (max-width: 1024px){
    .main-header .logo {
        display: none;
    }

    .transformer-tabs ul {
    border-bottom: 0;
    overflow: hidden;
    position: relative;
    background: #666;
    /* fallback */
    background: linear-gradient(#666, #222);
  }
  .transformer-tabs ul::after {
    content: "☰";
    position: absolute;
    top: 8px;
    right: 15px;
    z-index: 2;
    pointer-events: none;
  }
  .transformer-tabs ul.open a {
    position: relative;
    display: block;
  }
  .transformer-tabs li {
    display: block;
  }
  .transformer-tabs a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }
  .transformer-tabs a.active {
    border: 0;
    z-index: 1;
    background: #666;
    /* fallback */
    background: linear-gradient(#666, #222);
  }
  .fullsc {
    display: block;
  }
  .login-box {
    margin-top: 20%;
  }
  .os-table th.text-center {
    width: 100px;
  }
  .os-table .text-right {
    padding-right: 25px;
  }
}

@media screen and (max-width: 540px) {
    .table-number > ul > li {
        width: calc(100% / 3 - 13px);
        display: inline-block;
        text-align: center;
        margin: 0 5px 10px;
        font-size: 18px;
    }
}

@media screen and (max-width: 550px) {
    .products > ul > li > button, .categories > ul > li > button {
        width: calc(100% / 2 - 6px);
        display: inline-block;
        margin: 5px 3px;
        padding: 15px 10px;
    }
}

@media screen and (max-width: 435px) {
    ul.nav.nav-tabs > li > a, ul.nav.nav-tabs > li > a:hover {
        padding: .4em 1.2em;
    }

    #n_area > li {
        margin-left: 5px;
    }
}

@media screen and (max-width: 390px) {
    /*ul.nav.nav-tabs > li > a, ul.nav.nav-tabs > li > a:hover {
        padding: .4em .8em;
        margin-left: 0px;
        font-size: 13px;
    }*/
    .table-number > ul > li > button {
        font-size: 14px;
    }
    /*ul.nav.nav-tabs > li > a:after {
        right: -0.4em;
    }*/
}

@media screen and (max-width: 360px) {
    #t_order > thead > tr > th {
        font-size: 14px;
    }

    .order-li > td > span {
        font-size: 13px;
    }

    .orders-content i.remove {
        padding: 3px 5px;
    }

    .addbeforeme > td, .addbeforeme > td > span, .addbeforeme > td > strong {
        font-size: 13px;
    }

    .sc > input {
        vertical-align: sub;
    }
}

@media screen and (max-width: 340px) {
   /* ul.nav.nav-tabs > li > a, ul.nav.nav-tabs > li > a:hover {
        padding: .4em .7em;
        margin-left: 0px;
        font-size: 12px;
    }*/
    .table-number > ul > li > button, .categories > ul > li > button {
        font-size: 12px;
    }
    .login-box.wac {
        margin-top: 7%;
    }
}

/*notifs upon product clicks*/
#notification-alert-flash{
    padding: 10px 30px;
    margin: auto;
    width: 95%;
    position: absolute;
    z-index: 9999;
}

.numright{
	text-align: right;
}

/* START TILL SYSTEM */
.product_name {
    white-space: nowrap;
    overflow: hidden !important;
    text-overflow: ellipsis;
    display: block;
}

.product_spacing {
    padding-top: 20px;
    padding-bottom: 20px;
}

.product-image {
    height: 150px;
    width: 150px;
}

.product-image-small {
    height: 50px;
    width: 50px;
}

.modal-open-new{
  overflow: hidden;
}

.modal-open-new .modal{
    overflow-x: hidden;
    overflow-y: auto;
}

/* END TILL SYSTEM */