/* VMC Orange is f58322 */

@font-face {
    font-family: 'Houschka';
    src: url('../fonts/houschkapro-medium-webfont.eot');
    src: url('../fonts/houschkapro-medium-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/houschkapro-medium-webfont.woff') format('woff'), url('../fonts/houschkapro-medium-webfont.ttf') format('truetype'), url('../fonts/houschkapro-medium-webfont.svg#houschka_promedium') format('svg');
    font-weight: normal;
    font-style: normal;
}

/* hide scrollbar but allow scrolling */
html {
    overflow: scroll;
}

::-webkit-scrollbar {
    width: 0px;
    background: transparent; /* make scrollbar transparent */
}

h1,
h2,
#navcontainer a,
#tabs .tab p,
#page h3,
#page h4,
#options_column ul,
#page_content .online_funds .info,
#page .back_link,
select_box *,
.label,
input.button,
.quiet_block,
.login_blocks,
.transactions_table th,
.form textarea {
    font-family: Houschka, Arial, Verdana, Sans-Serif !important;
}

.select_box ul {
    overflow-y: scroll !important;
    font-family: Houschka, Arial, Verdana, Sans-Serif !important;
}

h1 {
    margin-top: 10px;
    font-weight: normal;
    font-size: 2.2em;
    line-height: 1.1em;
}

h2 {
    margin-top: 10px;
    font-weight: normal;
    font-size: 1.5em;
    line-height: 1.25em;
    font-family: Houschka, Arial, Verdana, Sans-Serif !important;
}

h2.gptopup {
    margin-top:-10px;
    margin-bottom:-10px;
}			
h7 {
    margin-top: 10px;
    font-weight: normal;
    font-size: 20px;
    line-height: 1.25em;
}

h8 {
    margin-top: 15px;
    margin-bottom: 5px;
    font-weight: normal;
    font-size: 14px;
    line-height: 1.25em;
}

h9 {
    margin-top: 10px;
    font-weight: normal;
    font-size: 20px;
    line-height: 1.25em;
    margin-left: 15px;
}

p {
    margin: 14px 0px;
}

a:link, a:active, a:visited {
    text-decoration: none;
}

.page_topup a:link, .page_topup a:active, .page_topup a:visited {
    color: #E00043;
}

a:hover {
    text-decoration: underline;
}

a img {
    border: 0px;
}

.clearer {
    clear: both;
    height: 0px;
    overflow: hidden;
    font-size: 0px;
    line-height: 0px;
}

input.button, button.button {
    height: 30px;
    line-height: 30px;
    padding: 0 10px;
    color: #fff;
    border: 0;
    font-size: 15px;
    background: #edf00e;
    cursor: pointer;
    -webkit-appearance: none;
    -webkit-border-radius: none;
}

    input.button:hover, input.button:disabled,
    button.button:hover, button.button:disabled {
        color: #561c4e;
    }

/*-----------------------------------------------------------------------------------------------*/
/* Accessibility Shortcuts */
#shortcuts {
    position: absolute;
    top: -9000px;
    left: -9000px;
}

    #shortcuts a:focus, #shortcuts a:active {
        top: 9010px;
        left: 9010px;
        position: absolute;
        display: block;
        padding: 10px;
        text-align: center;
        width: 100px;
        height: 50px;
        border: 2px solid #22326C;
        background-color: #ffffff;
        font-weight: bold;
        font-size: 1.3em;
        z-index: 10000;
        text-decoration: none;
        outline: none !important;
    }
/*-----------------------------------------------------------------------------------------------*/

body {
    margin: 0px;
    color: #fff;
    background: #713165;
    font-size: 12px;
    line-height: 1.6em;
    font-family: Houschka, Arial, Tahoma, Verdana, Helvetica, Sans-Serif;
    -webkit-text-size-adjust: 100%;
    /* overflow: hidden; */
    height: 100%;
}

.wrapper {
    margin: 0px auto;
    width: 940px;
}

#header {
    padding-top: 20px;
    padding-bottom: 10px;
}

.logo {
    float: left;
    background: #713165;
    max-width: 50%;
    display: block;
}

.FlexLogo {
    float: right;
    padding-right: 20px;
}

#content {
    float: left;
}

/*------------------------------------*/

.welcome_title,
.welcome_text {
    float: left;
    margin-right: 20px;
}

.welcome_title {
    margin-bottom: 0;
}

.welcome_text {
    padding-top: 5px;
}

#pages {
    padding: 0 0 15px 0;
}

/*------------------------------------*/

#tabs {
    width: 210px;
    float: left;
    display: inline !important;
}

    #tabs .tab {
        height: 125px; /* 71px; 91px; 125px; */
        margin-bottom: 10px;
        margin-right: 10px;
        position: relative;
    }

        #tabs .tab:last-child {
            height: 126px; /*72px;  93px; */
        }

    #tabs .tab_selected {
        margin-right: 0;
    }

    #tabs .tab a {
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: url('../images/blank.gif') repeat;
    }

        #tabs .tab a span {
            display: none;
        }

    #tabs .tab h2 {
        margin: 0;
        margin-bottom: 3px;
        font-size: 1.8em;
        padding-top: 6px;
        padding-left: 7px;
    }

    #tabs .tab p {
        margin: 0;
        font-size: 1.2em;
        line-height: 1.1em;
        padding-left: 7px;
    }

    #tabs .tab_my_account {
        background: #561c4e url('../images/icons/my_account.png') 125px 5px no-repeat;
    }

    #tabs .tab_quick {
        background: #67C2C8 url('../images/icons/quick.png') 135px -3px no-repeat;
    }

    #tabs .tab_topup {
        background: #81BD26 url('../images/icons/topup.png') 135px -3px no-repeat;
    }

    #tabs .tab_settings {
        background: #E00043 url('../images/icons/settings.png') 135px -3px no-repeat;
    }

    #tabs .tab_shop {
        background: #5F98C3 url('../images/icons/shop.png') 135px -3px no-repeat;
    }

    #tabs .tab_shop_fos {
        background: #5F98C3 url('../images/icons/shop.png') 135px -3px no-repeat;
    }

    #tabs .tab_transactions {
        background: #8789C4 url('../images/icons/transactions.png') 135px 8px no-repeat;
        /*margin-bottom: 0;*/
    }

    #tabs .tab_inbox {
        background: #B58B00 url('../images/icons/envelope.png') 135px 8px no-repeat;
        margin-bottom: 0;
    }

/*------------------------------------*/

#page {
    /*width: 100%;*/
    padding-right: 14px;
    float: left;
    min-height: 314px;
    position: relative;
}

.page_my_account {
    background: #561c4e url('../images/icons/my_account_large.png') right 50px no-repeat;
    background-position: right top;
}

.page_quick {
    background: #67C2C8 url('../images/icons/quick_large.png') right 20px no-repeat;
    background-position: right top;
}

.page_topup {
    background: #81BD26 url('../images/icons/topup_large.png') right 20px no-repeat;
    background-position: right top;
}

.page_transactions {
    background: #8789C4 url('../images/icons/transactions_large.png') right 10px no-repeat;
    background-position: right top;
}

.page_settings {
    background: #E00043 url('../images/icons/settings_large.png') right 10px no-repeat;
    background-position: right top;
}

.page_shop {
    background: #5F98C3 url('../images/icons/shop_large.png') right 10px no-repeat;
    background-position: right top;
}

.page_inbox {
    background: #B58B00 url('../images/icons/envelope_large.png') right 10px no-repeat;
    background-position: right top;
}

#page h3 {
    font-size: 2.4em;
    margin: 20px 20px 30px 20px;
}

#page h4 {
    color: #edf00e;
    font-size: 1.15em;
    font-weight: bold;
    margin: 0;
}

/*------------------------------------*/

#options_column {
    width: 205px;
    height: 395px; /* height: 314px; */
    float: left;
}

    #options_column ul {
        list-style-type: none !important;
        margin: 20px;
        margin-right: 0;
        padding: 0;
        font-size: 1.6em;
    }

        #options_column ul li {
            margin: 0 0 10px 0;
        }

            #options_column ul li a {
                color: #fff;
            }

                #options_column ul li a.selected {
                    color: #edf00e;
                }

/*------------------------------------*/

.page_content {
    border-left: 1px solid #4f545e;
    float: left;
    width: 469px;
    right: 0;
    padding: 20px;
    padding-bottom: 35px;
    padding-top: 0;
    min-height: 664px;
}

#page_content h3 {
    margin-left: 0;
}

#page_content .info {
    margin-top: 0;
    font-size: 1.5em;
}
#page_content ul {
   list-style:inherit;
}
#page_content .online_funds {
    float: left;
    padding-left: 30px;
}

    #page_content .online_funds .info {
        font-size: 1.7em;
        margin-top: 0px;
        line-height: 1.3em;
    }

div.trans_drop {
    padding: 2%;
}


.transactions_table {
    width: 100%;
    border-collapse: collapse;
}

    .transactions_table th,
    .transactions_table td {
        padding: 3px 3px 3px 5px;
        text-align: left;
        font-weight: normal;
        white-space: nowrap;
        text-overflow: ellipsis;
    }

    .transactions_table tbody td {
        background: #455761;
    }

    .transactions_table td a {
        font-size: 10px;
        max-width: 40px;
    }

.tfoot a {
    color: #fff;
    margin-left: 6px;
}

/* Alternate Row Background */

.transactions_table tbody .alternate td {
    background: #a9bbc5;
}
/*------------------------------------*/

#page .back_link {
    color: #fff;
    position: absolute;
    bottom: 5px;
    right: 10px;
}
/*------------------------------------*/

#blocks {
    border-top: 1px solid #561c4e;
    padding: 15px 0;
}

    #blocks a {
        text-decoration: none;
    }

    /* SLIDESHOW */
    #blocks .bx-wrapper .bx-viewport {
        background: none;
        border: 0;
        box-shadow: 0 0;
        margin: -6px 0px 0px 0px;
        height: auto !important;
    }

.quiet_block {
    background-color: #561c4e;
    width: 230px;
    height: 59px;
    float: left;
    background-repeat: no-repeat;
    background-position: right;
    color: #fff;
    font-size: 1.3em;
    display: block;
    padding: 16px 5px 5px 15px;
}

.center_block {
    width: 42%;
    float: left;
    display: block;
    padding: 0;
    margin: 0 1% 0 1%;
}

.quiet_block .head {
    margin: 0;
    margin-bottom: 3px;
    font-size: 1.8em;
    text-decoration: none;
    color: #fff;
}

.quiet_block .body {
    color: #fff;
}

.quiet_block.block_deli {
    margin-left: 15px;
    background-image: url('../images/blocks/sandwich.png');
}

.quiet_block.block_left {
    background-image: url('../images/icons/stop.png');
}

.quiet_image {
    background-image: url('../images/blocks/quiet.png');
}

/*------------------------------------*/

#footer {
    width: 100%;
    font-size: 0.8em;
}

    #footer .wrapper {
        border-top: 1px solid #561c4e;
    }

    #footer span {
        padding-right: 20px;
        margin-right: 20px;
    }

    #footer .footer_links {
        padding-top: 5px;
    }

/*-----------------------------------------------------------------------------------------------*/

/* Text colours */
h1 {
    color: #fff;
}

a:link,
a:active,
a:visited,
a:hover {
    color: #edf00e;
}

#footer,
#footer a {
    color: #000;
}


    /* Footer borders */
    #footer span {
        border-right: 1px solid #561c4e;
    }

        #footer span:last-child {
            border-right: none;
        }


#modal_overlay, #my_modal_overlay, #transaction_modal {
    position: fixed;
    z-index: 1000;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: url('../images/black-74.png') repeat;
    background: rgba(0,0,0,0.74);
    display: none;
}

.modal_variant {
    display: none;
}

#modal_content, .modal_content {
    margin: 10% 33%;
    text-align: center;
    padding: 10px 20px;
    border: 6px solid #edf00e;
    z-index: 1001;
    /*position: absolute;*/
    top: 10%;
}

    .modal_content.transactions {
        margin: 10% 10%;
    }

    #modal_content.modal_blue {
        background: #71cbd3;
    }

    #modal_content.modal_shop {
        background: #5F98C3;
    }

    #modal_content.modal_black {
        background: #000;
    }

    #modal_content.modal_white {
        background: #fff;
    }

    #modal_content.modal_purple, .modal_content.modal_purple {
        background: #8789C4;
    }

    #modal_content.modal_trans {
        height: 150px;
    }

    #modal_content.modal_wp {
        background: #d5d7e3;
        border: 6px solid #f01e14;
        width: 450px;
    }

#anim {
    padding-top: 15px;
}

#modal_content h2 {
    font-size: 2.7em;
    font-weight: normal;
    line-height: 1.1em;
    margin-top: 0;
    margin-bottom: 10px;
}

#login_content {
    background: #000 url('../images/login.png') no-repeat;
    width: 614px;
    height: 226px;
    float: left;
    padding: 160px 30px 10px 30px;
    margin-bottom: 10px;
}

.form h1 {
    font-size: 2.9em;
    font-weight: bold;
    margin-bottom: 15px;
}

ul {
    list-style: none;
}

    ul li::before {
        content: "\200B";
    }

*,
*::before,
*::after {
    box-sizing: unset !important;
}

#reg_content {
    background: #000 url('../images/login.png') no-repeat;
    width: 65.4%;
    height: 266px;
    float: left;
    padding: 120px 30px 10px 10px;
    margin-bottom: 10px;
}

    #reg_content h1 {
        font-size: 2.9em;
        font-weight: bold;
        margin-bottom: 15px;
    }

    #reg_content.ff {
        height: 286px;
        padding: 100px 30px 10px 24px;
    }
#reg_content_reset {
    background: #000 url('../images/login.png') no-repeat;
    width: 65.4%;
    height: 366px;
    float: left;
    padding: 20px 30px 10px 10px;
    margin-bottom: 10px;
}

    #reg_content_reset h1 {
        font-size: 2.9em;
        font-weight: bold;
        margin-bottom: 15px;
    }

    #reg_content_reset.ff {
        height: 286px;
        padding: 100px 30px 10px 30px;
    }
    #reg_content_reset ul {
       list-style:inside;
    }
.login_form {
    /*padding-left: 15%;*/
}

.textbox {
    width: 100%;
    height: 24px;
    padding: 3px;
    line-height: 24px;
    font-size: 1.2em;
    border: 0;
    color: #000;
}

table.fifty {
    width: 50%;
}

.form textarea {
    width: 90%;
    color: black;
}

.form td {
    padding: 4px;
}

.form .table_row div {
    float: left;
    margin: 4px;
}

.form .table_row .table_cel1 {
    width: 30%;
    text-align: right;
}

.form .table_row .table_cel2 {
    width: 30%;
}

.form .table_row .table_cel3 {
    width: 15%;
    margin-left: 11%;
}
/* Settings form*/
.form.settings_form .table_row .table_cel1 {
    width: 25%;
}

.form.settings_form .textbox {
    width: auto;
}
/* contact Form */
.form .table_row .table_cel2.text_area {
    width: 60%;
}
/* login form */
.form.login_form .table_row .table_cel3 {
    width: 15%;
    margin-left: 1%;
}
/* btat settings form */
.btat_settings div.setting {
    width: 50%;
    float: left;
    margin: 5px 0px;
    font-size: 13px;
}

div.login_links {
	 visibility: hidden;				   
    padding: 1% 30%;
}

.login_links a {
    color: #fff;
    font-family: Houschka, Arial, Verdana, Sans-Serif;
    font-size: 1.2em;
}

.login_blocks {
    float: right;
    width: 250px;
    margin-left: 15px;
}

    .login_blocks img {
        margin-bottom: 12px;
        display: block;
    }

    .login_blocks a {
        text-decoration: none;
    }

.block {
    background-color: #561c4e;
    width: 236px;
    height: 105px;
    float: left;
    background-repeat: no-repeat;
    background-position: right;
    color: #fff;
    font-size: 1.7em;
    display: block;
    padding-top: 86px;
    padding-left: 15px;
    text-decoration: none;
}

.login_blocks .head {
    margin: 0;
    margin-bottom: 3px;
    font-size: 2.1em;
    text-decoration: none;
    color: #fff;
    line-height: 0.8em;
}

.login_blocks .body {
    padding-top: 10px;
    color: #fff;
}

.hide_full {
    display: none;
}

.block.block2 {
    background-image: url('../images/blocks/need_help.png');
    padding-top: 122px;
    height: 70px;
}

.block.topright {
    background-image: url('../images/blocks/topright.png');
}

.trans_sep {
    border-top: 1px solid #fff;
    width: 170px;
}

#msgWait {
    display: none;
    text-align: center;
}

.status {
    font-weight: bold;
    text-align: center;
}

#divStatus {
    height: 400px;
}

.hidden, .hidden-row {
    display: none;
}

#divPolicy {
    height: 188px;
    overflow: auto;
}

.pull_out {
    display: none;
}

/*.selectboxit .selectboxit-arrow-container .selectboxit-arrow {
    left: 1px;
}

.selectboxit.red_drop {
    background-color: #ff0000;
}*/

div.mobile_navbar {
    display: none;
}

/* WorldPay */
.modal_wp .modal_close {
    color: #000000;
    text-align: right;
    font-size: 18px;
    cursor: pointer;
    margin: 1%;
}

a.notorange {
    color: #717171;
}

    a.notorange:hover {
        color: #414141;
        text-decoration: none;
    }

input.txtbox {
    border: 0;
    height: 25px;
    padding: 2px;
    color: black;
}

input.button.friendly {
    line-height: 20px;
}
/* Transactions Pager */
.pager_section.numbers {
    margin-top: 3px;
}

.pager_section a {
    display: block;
    float: left;
    margin-left: 1px;
    background-color: #455761;
    height: 20px;
    width: 20px;
    text-align: center;
    color: #d5d7e3;
}

    .pager_section a:hover, .pager_section.numbers a.current {
        color: #ffffff;
        text-decoration: none;
        background-color: #a9bbc5;
    }

#divSiteSpinner {
    position: relative;
}
/* -- Datepicker -- */

.ui-datepicker {
    font-size: 14px;
    font-family: Houschka, helvetica;
    font-weight: 400;
}

    .ui-datepicker .ui-datepicker-header {
        background-color: #3a4951;
        border: 0px;
    }

        .ui-datepicker .ui-datepicker-header .ui-datepicker-next .ui-icon {
            background: url("../images/data_pager_next.png") no-repeat #3a4951;
        }

        .ui-datepicker .ui-datepicker-header .ui-datepicker-prev .ui-icon {
            background: url("../images/data_pager_previous.png") no-repeat #3a4951;
        }

    .ui-datepicker .ui-datepicker-calendar td a {
        color: #ffffff;
        background-color: #3a4951;
    }

        .ui-datepicker .ui-datepicker-calendar td a.ui-state-hover {
            background-color: #000000;
        }

        .ui-datepicker .ui-datepicker-calendar td a.ui-state-active {
            background-color: #EEEEEE;
            color: #000000;
        }

    .ui-datepicker .ui-datepicker-calendar td.ui-state-disabled {
        background-color: #EEEEEE;
    }

.paypal_button {
    width: 100%;
}
/* BTAT */
div.center {
    text-align: center;
}

div.bold {
    font-weight: bold;
}

.btat_settings input[type="textarea"].terms {
    margin: 15px;
}

.btat_settings input[type="submit"].terms {
    margin-left: 20px;
}

.btat_settings .dropdown.small, .btat_settings #ctl00_ContentMain_dropCardSelectBoxItOptions li {
    font-size: 11px;
}

input.button.small {
    font-size: 11px;
}

.add_card {
    margin-top: 8px;
}

input.textbox.friendly {
    width: 75%;
    font-size: 12px;
}

.setting.button-pair input {
    margin: 3px;
}

.float-left {
    float: left;
    margin-right: 3px;
}

.opt-in {
    margin-left: 20px;
}

input[type=checkbox] {
    width: 25px;
    height: 25px;
    border: none;
    position: relative;
    left: -5px;
    top: -5px;
    cursor: pointer;
}

.checkbox-container {
    position: absolute;
    display: inline-block;
    margin: 2px;
    width: 16px;
    height: 16px;
    overflow: hidden;
}

.message, p {
    font-size: 14px;
}

.label {
    font-size: 17px;
}

.modal_content.posdetails {
    position: fixed;
    z-index: 1001;
    background: #8789C4 url('../images/icons/transactions_large.png') right 10px no-repeat;
    padding: 5px;
    display: none;
}

    .modal_content.posdetails table td, .modal_content.posdetails table th {
        padding: 3px 3px 3px 5px;
        text-align: left;
        font-weight: normal;
        margin: 0;
    }

    .modal_content.posdetails table tr.norm {
        background-color: #455761;
    }

    .modal_content.posdetails table tr.alternate {
        background-color: #a9bbc5;
    }

    .modal_content.posdetails table td.price,
    .modal_content.posdetails table th.price,
    .modal_content.transactions table td.price {
        width: 60px;
    }

    .modal_content.posdetails table td.desc,
    .modal_content.posdetails table th.desc .modal_content.transactions table td.desc {
        width: 300px;
    }

    .modal_content.posdetails table td.qty,
    .modal_content.posdetails table th.qty,
    .modal_content.transactions table td.qty {
        width: 40px;
    }

    .modal_content.posdetails table {
        display: none;
        font-weight: normal;
        padding: 0 3px 3px 3px;
        text-align: left;
        border-collapse: collapse;
    }

a.close_posdetail {
    background-color: #8789C4;
    cursor: pointer;
    float: right;
    font-weight: 900;
}

a.close_posdetail {
    text-decoration: none;
    color: #d5d7e3;
}

    a.close_posdetail:hover {
        text-decoration: none;
        color: #ffffff;
    }

.modal_content.posdetails table .align-right {
    text-align: right;
}

.modal_content.modal_purple.transactions table {
    width: 100%;
}

div.contact_details {
    position: absolute;
    bottom: 12px;
    left: 40%;
    color: #d5d7e3;
    font-size: 0.8em;
    height: 65px;
    width: 60%;
    margin: 0 auto;
    line-height: 13px;
    -moz-column-count: 2;
    -moz-column-gap: 10px;
    -webkit-column-count: 2;
    -webkit-column-gap: 10px;
    column-count: 2;
    column-gap: 10px;
}

div.walloftext {
    height: 100%;
    background-color: #000000;
    padding: 25px;
}

    div.walloftext.faq p {
        margin-left: 30px;
    }

table.transactions_table td a.showdetail, table.transactions_table td a.showposdetail {
    display: block;
    text-overflow: ellipsis;
    overflow: hidden;
}

.tooltip {
    display: none;
    position: absolute;
    border: 1px solid #455761;
    background-color: #455761;
    border-radius: 5px;
    padding: 5px;
    color: #edf00e;
    font-size: 12px;
    z-index: 60;
}

.payment_status {
    font-size: 14px;
}

/* Image Upload */
#image_upload div.images {
    width: 100%;
    left: 0;
}

    #image_upload div.images div.row div {
        float: left;
        width: 290px;
        padding: 5px;
    }

    #image_upload div.images img {
        width: 270px;
        float: left;
    }

    #image_upload div.images a {
        width: 20px;
        position: relative;
        display: block;
        left: -20px;
        float: left;
        background: #000000;
        text-align: center;
        text-decoration: none;
    }

#image_upload div.uploader {
    padding: 10px 10px 60px 10px;
}

    #image_upload div.uploader input[type="file"] {
        margin-bottom: 8px;
    }

    #image_upload div.uploader input[type="submit"] {
        margin-top: 8px;
    }

/* Admin */
#reg_content.admin h1 {
    color: red;
}

div.set_setting {
    padding: 20px;
}

    div.set_setting input {
        margin-top: 5px;
    }

        div.set_setting input[type="text"] {
            width: 50%;
        }

/* toggle switches */
.TinyTools.ToggleSwitch,
.TinyTools.ToggleSwitch .NubWrapper .Nub {
    border-radius: 0;
    background-color: #9F9F9F;
    border: 0;
}

    .TinyTools.ToggleSwitch .NubWrapper .OffSide {
        background-color: #4f545e;
        color: #ffffff;
    }

/* Shop */
.shop_plu {
    width: 400px;
    height: 90px;
    border-radius: 45px;
    border: 1px white solid;
    margin: 25px 5px 5px 55px;
    padding: 10px;
    cursor: pointer;
}

    .shop_plu.all_year {
        background: #ffffff url('../images/icons/eat-in-year.png') 0px 0px no-repeat;
    }

    .shop_plu.this_term {
        background: #ffffff url('../images/icons/eat-in-term.png') 0px 0px no-repeat;
    }

    .shop_plu.sun {
        background: #ffffff url('../images/icons/sun.png') 0px 0px no-repeat;
    }

    .shop_plu:hover {
        background-color: #d5d7e3;
    }

    .shop_plu .text {
        font-size: 20px;
        color: #4d4d4d;
        text-align: right;
        margin-top: 5px;
        width: 305px;
        float: right;
    }

    .shop_plu .price {
        font-size: 15px;
        color: rgba(77,77,77,0.7);
        text-align: right;
        width: 105px;
        float: right;
    }

.conf_text {
    font-size: 14px;
    margin-bottom: 20px;
}

.shop_pay {
    margin-top: 20px;
}

/* F & F Shop */
.chooseShop {
    float: left;
    width: 40%;
    margin-top: 5%;
}

    .chooseShop input[type=image] {
        width: 30%;
        border-width: 0px;
    }

    .chooseShop a:link, .chooseShop a:hover {
        text-decoration: none;
        color: #ffffff;
    }

.ffshop {
    margin-top: -30px;
}

p.mydata, p.mydata .somedata {
    font-size: 1.2em;
}

/* Datetime Picker */
.fos_body2 {
    background-color: #5F98C3;
    padding: 30px;
    height: 90px;
    /*height:inherit;*/
}

.fos_body {
    background-color: #5F98C3;
    padding: 10px 30px 10px 30px;
    /*height: 600px;*/
    height: auto;
}

.fos_body_menu {
    background-color: #5F98C3;
    padding: 10px 0px 10px 0px;
    /*height: 600px;*/
    height: auto;
}

.fos_body3 {
    background-color: #5F98C3;
    padding: 30px;
    height: 400px;
}

    .fos_body3 .cal {
        width: 400px;
        margin: auto;
    }

/*
#fos-datetimepicker table {
    border-collapse: separate;
    border-spacing: 5px;
    font-size: 1.4em;
    font-weight: 600;
}

.bootstrap-datetimepicker-widget table td {
    border-radius: 0;
    border-bottom: 5px solid #A5C9EB;
    color: #fff;
}

    .bootstrap-datetimepicker-widget table td.highlight {
        border-bottom: 5px solid #f58322;
    }

    .bootstrap-datetimepicker-widget table td.active {
        background-color: #829DB7;
    }

    .bootstrap-datetimepicker-widget table td.today {
    }

        .bootstrap-datetimepicker-widget table td.today:after {
        }

        .bootstrap-datetimepicker-widget table td.today:before {
            border: 3px solid white;
        }
*/

/* FOS Menu */

@media (min-width: 1200px) {
    .fos_body .menu.container {
        max-width: 850px;
    }
}

#progress {
    position: absolute;
    top: 55%;
    left: 45%;
    display: none;
    z-index: 1001;
    color: #898989;
}

.bg-lightgray {
    background-color: lightgray !important;
}

.fos_body .menu_button {
    height: 80px;
    cursor: pointer;
}

    .fos_body .menu_button .text {
        margin-bottom: 4px;
    }

    .fos_body .menu_button .blue_line {
        border-bottom: 4px solid #A5C9EB;
        float: left;
        width: 55%;
        position: absolute;
        bottom: 14px;
    }

    .fos_body .menu_button .red_line {
        border-bottom: 4px solid #ef1454;
        float: left;
        width: 55%;
        position: absolute;
        bottom: 14px;
    }

    .fos_body .menu_button .green_line {
        border-bottom: 4px solid #81bd27;
        float: left;
        width: 55%;
        position: absolute;
        bottom: 14px;
    }


    .fos_body .menu_button .icon {
        float: right;
        font-size: 1.2em;
        position: absolute;
        bottom: 10px;
        right: 8px;
    }

.fos_body a.chev {
    font-size: 3em;
    /*color: #f58322;*/
    color: white;
    height: 100%;
    width: 100%;
}

    .fos_body a.chev:hover {
        cursor: pointer;
    }

/* fix for bottom blocks after adding bootstrap */
.quiet_block {
    box-sizing: initial;
}

.fos_body .slider_inview {
    overflow: hidden;
    width: 600px;
    height: 500px;
    margin: 0 auto;
}

.fos_body .full_slider {
    width: 1200px;
    -webkit-transition: all 1.0s ease-in-out;
    -moz-transition: all 1.0s ease-in-out;
    -o-transition: all 1.0s ease-in-out;
    transition: all 1.0s ease-in-out;
}

    .fos_body .full_slider .menu {
        float: left;
    }

.fos_body .menu .row {
    margin-left: 0;
    margin-right: 0;
}

    .fos_body .menu .row .menu_button_cont {
        width: 100px !important;
        position: relative;
    }

.fos_body .menu .description {
    line-height: 15px;
}

.fos_body .button_fos {
    width: 130px;
    height: 30px;
    line-height: 30px;
    padding: 0 10px;
    color: #fff;
    border: 0;
    font-size: 15px;
    background: #f58322;
    cursor: pointer;
    -webkit-appearance: none;
    -webkit-border-radius: none;
}

.modal-header {
    background-color: #5F98C3; /*#79868d;*/
    color: #ffffff;
}

.modal-content {
    background-color: #5F98C3; /*#79868d;*/
    color: #ffffff;
    border: 6px solid #f58322;
    width: 420px;
    height: 350px;
}

.modal-dialog {
    padding-top: 10%;
}

.modal-body {
    font-size: 1.2em;
}

.modal-info {
    font-size: 1.2em;
    margin-left: 15px;
    font-size: 16px;
}

.modal-footer {
    padding: 15px;
    text-align: center;
    /*display: flex;
    justify-content: center;*/
    border-top: 1px solid #e5e5e5;
    background-color: #5F98C3; /*#79868d;*/
}

    .modal-footer .button_fos {
        width: 130px;
        height: 30px;
        line-height: 30px;
        padding: 0 10px;
        color: #fff;
        border: 0;
        font-size: 15px;
        background: #f58322;
        cursor: pointer;
        -webkit-appearance: none;
        -webkit-border-radius: none;
    }

    .modal-footer .button_fos2 {
        width: 130px;
        height: 30px;
        line-height: 30px;
        padding: 0 10px;
        color: #fff;
        border: 0;
        font-size: 15px;
        background: #4f545e;
        cursor: pointer;
        -webkit-appearance: none;
        -webkit-border-radius: none;
    }

.modal-footer2 {
    padding: 15px;
    text-align: center;
    /*display: flex;
    justify-content: center;*/
    background-color: #5F98C3; /*#79868d;*/
}

    .modal-footer2 .button_fos {
        width: 130px;
        height: 30px;
        line-height: 30px;
        padding: 0 10px;
        color: #fff;
        border: 0;
        font-size: 15px;
        background: #f58322;
        cursor: pointer;
        -webkit-appearance: none;
        -webkit-border-radius: none;
    }
/* FOS Calendar */
div.calendar-wrapper {
    padding: 25px 0px 10px 0px;
}

table.myCalendar {
    font-family: Houschka, Arial, Verdana, Sans-Serif;
    border-collapse: separate;
    border-spacing: 5px;
}

    table.myCalendar th {
        font-size: 1.6em;
        font-weight: 900 !important;
        padding: 10px;
    }

    table.myCalendar td {
        font-size: 1.6em;
        font-weight: 900 !important;
        border-bottom: 5px solid #5F98C3;
        color: #000 !important;
    }

        table.myCalendar td a:link {
            color: #ffffff !important;
        }

        table.myCalendar td a:hover {
            text-decoration: none;
            color: #d5d7e3 !important;
        }

        table.myCalendar td a:past {
            color: black;
        }

    table.myCalendar .myCalendarDay {
        border-bottom: 5px solid #f58322;
        color: #000 !important;
    }

        table.myCalendar .myCalendarDay td a:link {
            border-bottom: 5px solid #f58322;
            color: #000 !important;
        }

    table.myCalendar td.cal_NextPrevStyle a {
        border-style: none;
        color: #ffffff !important;
        font-size: 1.6em;
        font-family: 'Agency FB';
    }

        table.myCalendar td.cal_NextPrevStyle a:hover {
            color: #d5d7e3 !important;
            text-decoration: none;
        }

    table.myCalendar td.cal_SelectedDay {
        background-color: #A5C9EB !important;
    }

    table.myCalendar td.cal_Today {
        /*color: #5F98C3;*/
        font-weight: 900;
        color: red;
    }

    table.myCalendar td.cal_OtherMonth {
        color: #D3DDE8 !important;
    }

    table.myCalendar .cal_TitleStyle {
        background-color: #5F98C3;
        font-size: 0.8em;
        color: #fff !important;
    }

    table.myCalendar .cal_DayHeader {
        color: #000 !important;
    }
/* Allergens */
img.allergen-icon {
    width: 70px;
}

/* Dropdown*/
/*.select {
    background-color: white;
    border: thin solid blue;
    border-radius: 4px;
    display: inline-block;
    font: inherit;
    line-height: 1.5em;
    width: 220px;
    padding: 0.5em 3.5em 0.5em 1em;
}*/





/*FOS button*/
.button_fos {
    width: 130px;
    height: 30px;
    line-height: 30px;
    padding: 0 10px;
    color: #fff;
    border: 0;
    font-size: 15px;
    background: #f58322;
    cursor: pointer;
    -webkit-appearance: none;
    -webkit-border-radius: none;
}

.button_fos2 {
    width: 130px;
    height: 30px;
    line-height: 30px;
    padding: 0 10px;
    color: #fff;
    border: 0;
    font-size: 15px;
    background: #4f545e;
    cursor: pointer;
    -webkit-appearance: none;
    -webkit-border-radius: none;
}

.ddFOS {
    min-width: 400px !important;
    font-size: 1.2em;
    font-weight: normal;
    font-family: Houschka;
}

/*.ddFOS option {
        font-size: 1.2em;
    }*/

.ddFOS2 {
    min-width: 300px !important;
}


.menu_name {
    margin-right: 25px;
    /*height: 100px;*/
    min-height: 2em;
    font-size: large;
}

.menu_info {
    word-wrap: break-word;
    width: 600px;
    /*min-height: 4.5em;*/
    overflow: auto;
    font-size: 1.3em;
    color: white;
}

.menu_date {
    min-height: 2em;
    margin-right: 25px;
    font-size: 1.5em;
    /*height: 100px;*/
}

.menu_timeslot {
    min-height: 2em;
    margin-right: 25px;
    font-size: 1.5em;
    /*height: 100px;*/
}

.circle-color {
    color: #f58322;
}

.circle-color-indent {
    color: #f58322;
    /*margin-left:10%;*/
}

.columnBasketA {
    float: left;
    /*width: 10%;*/
}

.columnBasketB {
    float: left;
    width: 60%;
}

.columnBasketBb {
    float: left;
    width: 70%;
}

.columnBasketC {
    float: right;
    width: 20%;
    padding-right: 0px!important;
}

.column2text {
    float: left;
    width: 60%;
    font-size: 1.5em;
}

.column2text-color {
    float: left;
    width: 60%;
    font-size: 1.5em;
    color: yellow;
}

.column2texta {
    float: left;
    width: 40%;
    font-size: 1.5em;
}

.column2text-colora {
    float: left;
    width: 40%;
    font-size: 1.5em;
    color: yellow;
}

.mealdeal {
    text-align: center !important;
    font-family: Broadway;
    font-weight: normal;
    font-style: normal;
    color: yellow;
    font-size: 1.5em;
}


#ck-button {
    background-color: #f58322;
    width: 130px;
    overflow: hidden;
    float: left;
    height: 30px;
}

    #ck-button label {
        float: left;
        width: 130px;
        font-family: Houschka;
        font-weight: normal;
        height: 30px;
        cursor: pointer;
        font-size:15px;
    }

        #ck-button label span {
            text-align: center;
            padding: 4px 0px;
            display: block;
            width: 130px;
            font-family: Houschka;
            font-weight: normal;
            height: 30px;
        }

        #ck-button label input {
            position: absolute;
            top: -20px;
            display: none;
        }

    #ck-button input:checked + span {
        background-color: #ff0000;
        font-family: Houschka;
        color: #fff;
    }


#ck-button2 {
    background-color: #4f545e;
    width: 130px;
    overflow: hidden;
    float: left;
    height: 30px;
}

    #ck-button2 label {
        float: left;
        width: 130px;
        font-family: Houschka;
        font-weight: normal;
        height: 30px;
        cursor: pointer;
         font-size:15px;
    }

        #ck-button2 label span {
            text-align: center;
            padding: 4px 0px;
            display: block;
            width: 130px;
            font-family: Houschka;
            font-weight: normal;
            height: 30px;
        }

        #ck-button2 label input {
            position: absolute;
            top: -20px;
            display: none;
        }

    #ck-button2 input:checked + span {
        background-color: #ff0000;
        font-family: Houschka;
        color: #fff;
    }


.ddContact {
    min-width: 230px !important;
}


/*select {
    width: 200px;
}*/


/*Nutrition*/
.nutrition-panel-container {
    padding: 0px;
}

.nutrition-panel {
    margin: 0 4px;
    max-width: 89.2px;
}

.nutrition-light {
    display: inline-flex;
    flex-direction: column;
    width: 65px;
    height: 100px;
    background-color: #eee;
    text-align: center;
    overflow: hidden;
    border-radius: 100%/30px;
}

.nutrition_title, .nutrition_quantity {
    height: 51px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    color: #333;
}

.nutrition_bottom {
    height: 54px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.nutrition-panel-quantity--energy {
    font-size: 12px;
    letter-spacing: .1px;
    line-height: 16px;
    font-weight: 400;
    color: #333;
}

.nutrition-light-text-indicator {
    font-size: 16px;
    letter-spacing: .2px;
    line-height: 20px;
    font-weight: 600;
    color: #333;
}

.nutrition-light-percentage {
    font-size: 18px;
    letter-spacing: .2px;
    line-height: 24px;
    font-weight: 600;
    color: #333;
}
/*----------------Dropdown--------------*/
.select_box {
    background: #fff;
    border: 1px solid #adadad;
    -webkit-border-top-right-radius: 4px;
    -webkit-border-bottom-right-radius: 4px;
    -moz-border-radius-topright: 4px;
    -moz-border-radius-bottomright: 4px;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
    color: #222;
    position: relative;
    height: 32px;
    cursor: default;
    zoom: 1;
    font-size: large;
    min-width: 5vw;
}

.open {
    -webkit-border-bottom-right-radius: 0px;
    -webkit-border-bottom-left-radius: 0px;
    -moz-border-radius-bottomright: 0px;
    -moz-border-radius-bottomleft: 0px;
    border-bottom-right-radius: 0px;
    border-bottom-left-radius: 0px;
    z-index: 4;
}

.focused {
    border: 1px solid #71cbd3;
    outline: 0;
}

table.form_table .select_box,
.settings_column .select_box {
    height: 28px;
}

    table.form_table .select_box .arrow,
    .settings_column .select_box .arrow {
        height: 30px;
        width: 30px;
    }

    table.form_table .select_box .selected_value,
    .settings_column .select_box .selected_value {
        font-size: 0.9em;
        line-height: 28px;
    }

    table.form_table .select_box ul,
    .settings_column .select_box ul {
        font-size: 0.9em;
    }

.select_box.disabled {
    border: 1px solid #adadad;
    background: #eee;
    color: #999;
}

.open .arrow {
    -webkit-border-bottom-right-radius: 0px;
    -moz-border-radius-bottomright: 0px;
    border-bottom-right-radius: 0px;
}



.select_box:hover .arrow {
    background-color: #666;
}

.select_box.disabled .arrow {
    background-color: #888 !important;
}

.select_box .selected_value {
    padding: 0 5px;
    font-size: 1.1em;
    line-height: 32px;
    display: block;
    white-space: nowrap;
    overflow: hidden;
}

.select_placeholder .selected_value {
    color: #80868a;
}

.select_box ul {
    display: none;
    position: absolute;
    top: 100%;
    left: -1px;
    width: 100%;
    background: #fff;
    list-style-type: none;
    margin: 0;
    padding: 0;
    border: 1px solid #adadad;
    border-top: 1px solid #dedede;
    -webkit-border-bottom-right-radius: 4px;
    -webkit-border-bottom-left-radius: 4px;
    -moz-border-radius-bottomright: 4px;
    -moz-border-radius-bottomleft: 4px;
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;
    overflow: auto;
    max-height: 210px;
}

.select_box li {
    padding: 5px;
    cursor: pointer;
    color: #222;
}

    .select_box li:hover {
        background: #ededed;
    }

    .select_box li.selected {
        background: #555;
        color: #fff;
    }

    .select_box li.disabled {
        background: #fff;
        color: #ccc;
        cursor: default;
    }

    .select_box li.focusedItem {
        background: #47adba;
        color: #fff;
    }

.open ul {
    display: block;
}

.btnInboxMessage {
    font-size: large;
    height: 10vh;
    margin-left: 0px;
    border-bottom-style: solid;
}

.markUnread {
    font-weight: bold;
}

.markRead {
    font-weight: normal;
}

div.scroller {
    max-height: 40vh;
    overflow-x: hidden;
    overflow-y: scroll;
    background-color: rgba(209, 222, 228, 0.93);
    color: black;
    margin-left: -15px;
}

    div.scroller::-webkit-scrollbar {
        /* width: 0px;*/
        /*background:#5F98C3;*/
    }
/* ===== Scrollbar CSS ===== */
/* Firefox */
* {
    scrollbar-width: none;
    scrollbar-color: #585558 #ffffff;
}

    /* Chrome, Edge, and Safari */
    *::-webkit-scrollbar {
        width: 16px;
    }

    *::-webkit-scrollbar-track {
        background: transparent;
    }

    *::-webkit-scrollbar-thumb {
        background-color: #585558;
        border-radius: 10px;
        border: 3px none #ffffff;
    }
.idbasket,
.idbasket::before,
.idbasket::after {
    box-sizing: border-box !important;
}