@media (min-width: 1400px) {
    .container {
        max-width: 1390px;
    }
}

@media (max-width: 992px) {
    p.product_price span.glyphicon-plus-sign,
    p.product_price span.glyphicon-minus-sign {
        font-size: 1.5em;
        margin-top: -6px;
    }

    /*div#clear_shopping_cart_wrapper {
        display: none;
    }*/
}

span#editing_production_order_info_span {
    position: absolute;
    right: 410px;
    top: 6px;
    font-weight: bold;
    font-size: 20px;
    color: #6b6a65;
}

#changing_production_order {
    font-weight: bold;
    font-size: 20px;
    color: #6b6a65;
    text-align: center;
}

/**1px solid #d9d8d1**/

/** Products **/
div#products_wrapper {
    margin-left: -15px;
    margin-right: -15px;
}

div.product_article p.description {
    max-height: 100px;
    overflow-y: auto;
    overflow-x: hidden;
}

div#products_wrapper article img.article-sm-image:hover {
    -webkit-box-shadow: 0px 0px 10px 0px #DDD;
    -moz-box-shadow: 0px 0px 10px 0px #DDD;
    -ms-box-shadow: 0px 0px 10px 0px #DDD;
    o-box-shadow: 0px 0px 10px 0px #DDD;
    box-shadow: 0px 0px 10px 0px #DDD;
}

span.glyphicon-minus-sign {
    color: #CC2935;
    cursor: pointer;
}

div#products_wrapper p.product_price span.glyphicon-plus-sign {
    cursor: pointer;
}

div#products_wrapper div.purchase_product_wrapper {
    display: none;
}

/** Breadcrumbs **/
.breadcrumb-fline .glyphicon {
    margin-right: 5px;
}

.breadcrumb-fline {
    /*centering*/
    display: inline-block;
    margin-top: 0px;
    overflow: hidden;
    margin-bottom: 20px;
}

.breadcrumb-fline a {
    text-decoration: none;
    outline: none;
    display: block;
    float: left;
    font-size: 12px;
    line-height: 36px;
    color: #555555;
    /*need more margin on the left of links to accomodate the numbers*/
    padding: 0 10px 0 34px;
    background: #fff;
    position: relative;
    border: 1px solid #cbc9bd;
}

/*since the first link does not have a triangle before it we can reduce the left padding to make it look consistent with other links*/
.breadcrumb-fline a:first-child {
    padding-left: 26px;
    border-radius: 5px 0 0 5px; /*to match with the parent's radius*/
}

.breadcrumb-fline a:first-child:before {
    left: 14px;
}

.breadcrumb-fline a:last-child {
    border-radius: 0 5px 5px 0; /*this was to prevent glitches on hover*/
    padding-right: 20px;
}

/*hover/active styles*/
.breadcrumb-fline a.active, .breadcrumb-fline a:hover {
    background: #E97114;
    color: #fff;
}

.breadcrumb-fline a.active:after, .breadcrumb-fline a:hover:after {
    background: #E97114;
    color: #fff;
}

/*adding the arrows for the breadcrumbs using rotated pseudo elements*/
.breadcrumb-fline a:after {
    content: '';
    position: absolute;
    top: 0;
    right: -18px; /*half of square's length*/
    /*same dimension as the line-height of .breadcrumb-fline a */
    width: 36px;
    height: 36px;
    /*as you see the rotated square takes a larger height. which makes it tough to position it properly. So we are going to scale it down so that the diagonals become equal to the line-height of the link. We scale it to 70.7% because if square's: 
    length = 1; diagonal = (1^2 + 1^2)^0.5 = 1.414 (pythagoras theorem)
    if diagonal required = 1; length = 1/1.414 = 0.707*/
    transform: scale(0.707) rotate(45deg);
    /*we need to prevent the arrows from getting buried under the next link*/
    z-index: 1;
    /*background same as links but the gradient will be rotated to compensate with the transform applied*/
    background: #fff;
    /*stylish arrow design using box shadow*/
    box-shadow: 2px -2px 0 0px rgba(203, 201, 189, 0.4), 3px -3px 0 2px rgba(255, 255, 255, 0.1);
    /*
            5px - for rounded arrows and 
            50px - to prevent hover glitches on the border created using shadows*/
    border-radius: 0 5px 0 50px;
}

/*we dont need an arrow after the last link*/
.breadcrumb-fline a:last-child:after {
    content: none;
}

/*we will use the :before element to show numbers*/
.breadcrumb-fline a:before {
    /*some styles now*/
    border-radius: 100%;
    width: 20px;
    height: 20px;
    line-height: 20px;
    margin: 8px 0;
    position: absolute;
    top: 0;
    left: 30px;
    background: #fff;
    font-weight: bold;
}

body div#wrap div#main-container {
    padding-top: 25px;
}

body div#wrap div#container-without-header-image {
    padding-top: 135px;
}

/** Section info **/
div.info-box {
    background: #E0DFD0;
    margin-bottom: 25px;
    padding: 12px 22px 22px 22px;
    color: #535251;
}

div.info-box > .info-top {
    border-bottom: 1px solid #c1c0b4;
    margin-bottom: 16px;
    padding-bottom: 10px;
}

div.info-box > .info-top:before,
div.info-box > .info-top:after {
    content: " ";
    display: table;
}

div.info-box > .info-top:after {
    clear: both;
}

div.info-box > .info-top h3 {
    font-weight: normal;
    margin: 10px 0 0 0;
}

div.info-box > .info-top p {
    margin: 0;
}

div.info-box > .info-top img {
    float: right;
    max-height: 60px;
}

div.info-box > .info-bottom p {
    margin: 0;
    font-size: 0.875em;
}

div.info-box > .info-bottom {
    margin-left: -15px;
    margin-right: -15px;
}

/** Menu **/
#menu > ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

#menu > ul > li {
    list-style: none;
    border-bottom: 1px solid #E4E4E4;
}

#menu > ul > li > a {
    text-transform: uppercase;
    color: #6b6a65;
    text-decoration: none;
    display: block;
    padding: 8px 8px 4px 8px; /*12px 10px 8px 10px;*/
    background: #ffffff;
}

#menu > ul > li > a:hover {
    color: #6b6a65;
    background: #f8f7f3 url('../../../htdocs/images/arrow_right.png') no-repeat right center;
    border-right: 10px solid transparent;
}

#menu > ul > li:first-child {
    border-top: 1px solid #E4E4E4;
}

#menu > ul > li > ul {
    display: none;
    list-style: none;
    margin: 0;
    padding: 0;
}

#menu > ul > li > ul > li {
    list-style: none;
    border-top: 1px solid #E4E4E4;
}

#menu > ul > li > ul > li > a {
    text-transform: uppercase;
    color: #6b6a65;
    text-decoration: none;
    display: block;
    padding: 12px 10px 8px 30px;
    background: #ffffff;
}

#menu > ul > li > ul > li > a.active,
#menu > ul > li > ul > li > a:hover {
    background: url('../../../htdocs/images/arrow_right.png') no-repeat 8px center;
    font-weight: bold;
}

#menu > ul > li.active ul {
    display: block;
}

#menu > ul > li.active > a {
    color: #fff;
    background: #E97114 url('../../../htdocs/images/arrow_right_white.png') no-repeat right center;
    border-right: 10px solid transparent;
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (-moz-min-device-pixel-ratio: 1.5), only screen and (-o-min-device-pixel-ratio: 3/2), only screen and (min-device-pixel-ratio: 1.5) {
    #menu > ul > li > a:hover {
        background: #e1e0d1 url('images/sub-menu-active-arrow@2x.png') no-repeat right center;
        -webkit-background-size: 5px 9px;
        background-size: 5px 9px;
    }

    #menu > ul > li > ul > li > a.active,
    #menu > ul > li > ul > li > a:hover {
        background: url('../../../htdocs/images/arrow_right.png') no-repeat 15px center;
        -webkit-background-size: 5px 9px;
        background-size: 5px 9px;
    }

    #menu > ul > li.active > a {
        background: #E97114 url('../../../htdocs/images/arrow_right.png') no-repeat right center;
        -webkit-background-size: 5px 9px;
        background-size: 5px 9px;
    }
}

/** Consuming location **/

div#select_consuming_location_wrapper .alert-info {
    background: #E0DFD0;
    border-color: #E0DFD0;
    color: #535251;
}

/** The Magic **/
.btn-breadcrumb .btn:not(:last-child):after {
    content: " ";
    display: block;
    width: 0;
    height: 0;
    border-top: 17px solid transparent;
    border-bottom: 17px solid transparent;
    border-left: 10px solid white;
    position: absolute;
    top: 50%;
    margin-top: -17px;
    left: 100%;
    z-index: 3;
}

.btn-breadcrumb .btn:not(:last-child):before {
    content: " ";
    display: block;
    width: 0;
    height: 0;
    border-top: 17px solid transparent;
    border-bottom: 17px solid transparent;
    border-left: 10px solid rgb(173, 173, 173);
    position: absolute;
    top: 50%;
    margin-top: -17px;
    margin-left: 1px;
    left: 100%;
    z-index: 3;
}

/** The Spacing **/
.btn-breadcrumb .btn {
    padding: 6px 12px 6px 24px;
}

.btn-breadcrumb .btn:first-child {
    padding: 6px 6px 6px 10px;
}

.btn-breadcrumb .btn:last-child {
    padding: 6px 18px 6px 24px;
}

/** Default button **/
.btn-breadcrumb .btn.btn-default:not(:last-child):after {
    border-left: 10px solid #fff;
}

.btn-breadcrumb .btn.btn-default:not(:last-child):before {
    border-left: 10px solid #ccc;
}

.btn-breadcrumb .btn.btn-default:hover:not(:last-child):after {
    border-left: 10px solid #ebebeb;
}

.btn-breadcrumb .btn.btn-default:hover:not(:last-child):before {
    border-left: 10px solid #adadad;
}

/** Primary button **/
.btn-breadcrumb .btn.btn-primary:not(:last-child):after {
    border-left: 10px solid #428bca;
}

.btn-breadcrumb .btn.btn-primary:not(:last-child):before {
    border-left: 10px solid #357ebd;
}

.btn-breadcrumb .btn.btn-primary:hover:not(:last-child):after {
    border-left: 10px solid #3276b1;
}

.btn-breadcrumb .btn.btn-primary:hover:not(:last-child):before {
    border-left: 10px solid #285e8e;
}

/** Success button **/
.btn-breadcrumb .btn.btn-success:not(:last-child):after {
    border-left: 10px solid #5cb85c;
}

.btn-breadcrumb .btn.btn-success:not(:last-child):before {
    border-left: 10px solid #4cae4c;
}

.btn-breadcrumb .btn.btn-success:hover:not(:last-child):after {
    border-left: 10px solid #47a447;
}

.btn-breadcrumb .btn.btn-success:hover:not(:last-child):before {
    border-left: 10px solid #398439;
}

/** Danger button **/
.btn-breadcrumb .btn.btn-danger:not(:last-child):after {
    border-left: 10px solid #d9534f;
}

.btn-breadcrumb .btn.btn-danger:not(:last-child):before {
    border-left: 10px solid #d43f3a;
}

.btn-breadcrumb .btn.btn-danger:hover:not(:last-child):after {
    border-left: 10px solid #d2322d;
}

.btn-breadcrumb .btn.btn-danger:hover:not(:last-child):before {
    border-left: 10px solid #ac2925;
}

/** Warning button **/
.btn-breadcrumb .btn.btn-warning:not(:last-child):after {
    border-left: 10px solid #f0ad4e;
}

.btn-breadcrumb .btn.btn-warning:not(:last-child):before {
    border-left: 10px solid #eea236;
}

.btn-breadcrumb .btn.btn-warning:hover:not(:last-child):after {
    border-left: 10px solid #ed9c28;
}

.btn-breadcrumb .btn.btn-warning:hover:not(:last-child):before {
    border-left: 10px solid #d58512;
}

/** Info button **/
.btn-breadcrumb .btn.btn-info:not(:last-child):after {
    border-left: 10px solid #5bc0de;
}

.btn-breadcrumb .btn.btn-info:not(:last-child):before {
    border-left: 10px solid #46b8da;
}

.btn-breadcrumb .btn.btn-info:hover:not(:last-child):after {
    border-left: 10px solid #39b3d7;
}

.btn-breadcrumb .btn.btn-info:hover:not(:last-child):before {
    border-left: 10px solid #269abc;
}

div.shop-checkout-form-wrapper .btn-group button {
    color: #555;
}

div.shop-checkout-form-wrapper .btn-group button.active {
    color: #fff;
}

div.shop-checkout-form-wrapper button.active {
    background-color: rgb(233, 113, 20);
    box-shadow: none;
}


div.shop-checkout-form-wrapper .btn-group a {
    color: #555;
}

div.shop-checkout-form-wrapper .btn-group a.active {
    color: #fff;
}

div.shop-checkout-form-wrapper a.active {
    background-color: rgb(233, 113, 20);
    box-shadow: none;
}


div.tab-content {
    padding-top: 10px;
}

table#frontline_customer_production_orders ul {
    list-style: none;
    margin-bottom: 0px;
}

a#unset_customer_id,
a#unset_customer_id:hover,
a#unset_customer_id:focus {
    color: #E97114;
}

div#customer_journal_entries_wrapper {
    max-height: 600px;
    overflow: auto;
    margin-bottom: 15px;
}

div#customer_journal_entries_wrapper ul {
    list-style: none;
    padding-left: 0px;
}

div#customer_journal_entries_wrapper ul li {
    padding: 10px;
}

div#customer_journal_entries_wrapper ul li:nth-child(even) {
    background: #f9f9f9;
}

p.customer_journal_entry_info {
    color: #cccccc;
}

div#pick_up_time_options_today {
    display: none;
}

div#pick_up_time_options_other_days {
    display: none;
}

div#delivery_time_options_today {
    display: none;
}

div#delivery_time_options_other_days {
    display: none;
}

div.purchase_product_wrapper input {
    width: 40px;
}

div.purchase_product_wrapper span.glyphicon {
    margin-top: 5px;
    color: #808080;
    cursor: pointer;
}

span.delivery-glyphicon-time {
    font-size: 30px;
    margin-left: 20px;
    color: #808080;
    margin-top: 4px;
}

span.pick-up-production-time-glyphicon {
    font-size: 30px;
    margin-left: 20px;
    color: #E97114;
    margin-top: 4px;
}

span.pick-up-production-time-text {
    margin-top: 15px;
    margin-left: 10px;
    color: #E97114;
    font-size: 18px;
}

div.pick-up-production-time-wrapper {
    width: 200px;
    border: 1px solid;
    padding-bottom: 6px;
    color: #E97114;
}

span.delivery-time-text {
    margin-top: 15px;
    margin-left: 10px;
}

div.product_article_mobile h3 {
    max-width: 240px;
}

/* Small devices (tablets, mobiles) */
@media (max-width: 768px) {
    div.product_article {
        display: none;
    }

    div.product_article_mobile {
        display: block;
        cursor: pointer;
    }

    div#products_wrapper div.product_article_mobile article {
        padding: 1px;
        background: #f8f7f3;
        max-width: 340px;
        margin-bottom: 10px;
    }

    div.product_article_mobile img {
        display: none;
    }

    div.product_article_mobile h3 {
        float: left;
    }

    div.product_article_mobile .product_price {
        margin-right: 10px;
    }

    div.product_article_mobile p.description {
        display: none;
    }

    div#products_wrapper span.glyphicon-chevron-right {
        cursor: pointer;
    }

    div#products_wrapper div.product_article_mobile h3 {
        padding: 0px;
        border: none;
    }
}

/* Devices not smallest */
@media (min-width: 769px) {
    div.product_article {
        display: block;
    }

    body div#products_wrapper {
        padding-top: 30px;
    }

    div.product_article_mobile {
        display: none;
    }
}

div .picker__select--month, div .picker__select--year {
    padding: 0.4em;
}

input.datepicker-input.form-control[readonly] {
    cursor: pointer;
    background: inherit;
}

.table.table-customer-orders tbody > tr > td {
    vertical-align: middle;
}

.table-customer-orders tr td ul {
    padding-left: 0;
}

.table-customer-orders tr td ul li ul {
    padding-left: 35px;
}

.table-customer-orders th#copy-order-th {
    width: 104px;
}

.table-customer-orders th#customer-orders-sum-th {
    width: 40%;
}

.table-customer-orders .order-show-products-btn {
    padding: 0;
    outline: none;
}

.table-customer-orders .order_products ul.order-products-ul {
    margin-top: 5px;
}

table.table-customer-orders tr th {
    padding: 0;
}

table.table-customer-orders tr th a {
    text-decoration: none;
    color: #333;
    font-size: 12px;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    text-align: left;
    padding: 5px;
}

@media only screen and (max-width: 768px) {

    .table-responsive.table-customer-orders-frame {
        border: none;
    }

    table.table-customer-orders,
    table.table-customer-orders thead,
    table.table-customer-orders tbody,
    table.table-customer-orders th,
    table.table-customer-orders td,
    table.table-customer-orders tr {
        display: block;
    }

    table.table-customer-orders {
        border: none;
    }

    table.table-customer-orders thead tr {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }

    table.table-customer-orders tr {
        border: 1px solid #DDD;
        margin-bottom: 10px;
    }

    table.table-customer-orders td {
        border: none;
        position: relative;
        padding-left: 50%;
    }

    table.table-customer-orders tr td:first-child {
        background: #F7F7F7;
    }

    table.table-customer-orders td:before {
        position: absolute;
        top: 6px;
        left: 6px;
        width: 45%;
        padding-right: 10px;
        white-space: nowrap;
    }

    form#checkout_pick_up_form select,
    form#checkout_pick_up_form input.datepicker-input,
    form#checkout_delivery_form select,
    form#checkout_delivery_form input.datepicker-input {
        width: 90%;
        margin: 15px auto auto;
    }

    form#checkout_pick_up_form div.discount-code-panel div#current_active_discount_code,
    form#checkout_delivery_form div.discount-code-panel div#current_active_discount_code,
    form#checkout_pick_up_form div.discount-code-panel input#discount_code,
    form#checkout_delivery_form div.discount-code-panel input#discount_code {
        margin: 15px auto auto 15px;
    }

    form#checkout_pick_up_form div.discount-code-panel button#add_discount_code,
    form#checkout_delivery_form div.discount-code-panel button#add_discount_code {
        margin-top: 15px;
    }

    form#checkout_pick_up_form div.discount-code-panel div.input-container,
    form#checkout_delivery_form div.discount-code-panel div.input-container {
        width: 69%;
        float: left;
    }

    form#checkout_pick_up_form div.discount-code-panel div.button-container,
    form#checkout_delivery_form div.discount-code-panel div.button-container {
        float: left;
    }

    form#checkout_pick_up_form div.panel-heading,
    form#checkout_delivery_form div.panel-heading {
        text-align: center;
    }

    form#checkout_delivery_form div.production-location-panel div.col-sm-6 {
        padding: 0;
    }

    form#checkout_delivery_form div.pickup-food-panel label,
    form#checkout_pick_up_form div.pickup-food-panel label,
    form#checkout_pick_up_form div#restaurant_table_panel label,
    form#checkout_pick_up_form div.discount-code-panel label {
        margin-left: 15px;
    }

    form#checkout_pick_up_form #email_recipient_order_confirmation {
        margin-top: 15px;
    }
}

div.shop-checkout-form-wrapper div.customer-settings-dont-display {
    display: none;
}

div#wrap .btn-success[disabled] {
    background-color: rgb(200, 200, 200) !important;
    border-color: rgb(200, 200, 200) !important;
    color: white;
}

div.shop-checkout-form-wrapper div.payment-panel input[type="radio"]:not(.no-logo) {
    margin-top: 10px;
}

div.shop-checkout-form-wrapper div.payment-panel div.payment-method-container {
    padding: 8px;
}

div.shop-checkout-form-wrapper div.payment-panel div.payment-method-container.selected-payment-method {
    border-style: groove;
    border-color: #EAFFF2;
    border-width: thin;
    background-color: #EAFFF2;
}

div.shop-checkout-form-wrapper div.payment-panel label.radio {
    padding-top: 0;
}

div.shop-checkout-form-wrapper div.payment-panel div.checkbox {
    padding-left: 0;
}

div.shop-checkout-form-wrapper div.payment-panel img {
    max-width: 100%;
}

form#checkout_pick_up_form div#restaurant_table_form_group,
form#checkout_pick_up_form div#discount_code_form_group {
    margin-bottom: 0;
}

form#checkout_pick_up_form label.pre-selected-restaurant-table {
    padding-top: 10px;
}

span.circle-around-text {
    background: #d3d1d1;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    color: #515151;
    display: inline-block;
    font-weight: bold;
    line-height: 40px;
    text-align: center;
    width: 40px;
}

div#restaurant_table_form_group div#square_around_table_name_mobile {
    width: 107px;
    height: 55px;
    max-width: 104px;
    max-height: 55px;
    background: #d3d1d1;
    color: #515151;
    font-size: 2.8vw;
    font-weight: bold;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    overflow: auto;
    margin: 0 auto;
}

div#restaurant_table_form_group div#square_around_table_name {
    width: 132px;
    height: 89px;
    max-width: 132px;
    max-height: 89px;
    background: #d3d1d1;
    color: #515151;
    font-size: 13px;
    font-weight: bold;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
}

div#restaurant_table_form_group div#square_around_table_name span, div#restaurant_table_form_group div#square_around_table_name_mobile span {
    padding: 2px 5px 2px 5px;
}

div#vipps_login_welcome {
    text-align: center;
}

