/********************************************************

TABLE OF CONTENTS

1. GENERAL STYLE ELEMENTS
    1.1. Fonts
    1.2. General
    1.3. Body

2. NAVIGATION
    2.1. Logotype
    2.2. Menu
    2.3. Submenu
        2.3.1. Submenu Order
        2.3.2. Submenu Check

3. MAIN PAGE
    3.1. Page Title
    3.2. Back Button

4. ORDER
    4.1. New Order
        4.1.2. New Order > Category
        4.1.3. New Order > Category > Product
    4.2. Order Status
    4.3. Order Review

5. CHECK
    5.1. Check Review
    5.2. Tax Information
    5.3. Pay

********************************************************/

/******************************************************

1. GENERAL STYLE ELEMENTS

*******************************************************/

/* 1.1. Fonts */

@font-face {
    font-family: HeeboBlack;
    src: url(fonts/Heebo-Black.ttf);
}

@font-face {
    font-family: HeeboBold;
    src: url(fonts/Heebo-Bold.ttf);
}

@font-face {
    font-family: HeeboLight;
    src: url(fonts/Heebo-Light.ttf);
}

@font-face {
    font-family: HeeboMedium;
    src: url(fonts/Heebo-Medium.ttf);
}

@font-face {
    font-family: HeeboRegular;
    src: url(fonts/Heebo-Regular.ttf);
}

@font-face {
    font-family: HeeboThin;
    src: url(fonts/Heebo-Thin.ttf);
}

@font-face {
    font-family: HeeboThin;
    src: url(fonts/Heebo-Thin.ttf);
}

@font-face {
    font-family: BitterRegular;
    src: url(fonts/Bitter-Regular.ttf);
}

/* 1.2. General */

a, button, *:active {
   outline: 0 !important;
}

.hide {
    display: none;
}

/* 1.3. Body */

html {
    min-height: 100%;
    position: relative;
}

body {
    background: url("../data/images/background.jpg") no-repeat center center fixed #212F41;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    height: 100%;
	padding: 0px;
	margin: 0px;
}

/******************************************************
 
2. NAVIGATION
 
*******************************************************/

/* 2.1. Logotype */

.logo_wrapper img {
    width: 80%;
    padding-left: 10%;
    padding-right: 10%;
    padding-top: 10%;
}

.logo h1 {
    font-family: HeeboThin,Arial;
    font-size: 15px;
    text-align: center;
    width: 100%;
    letter-spacing: 1px;
    text-transform: uppercase;
    padding-bottom: 0px;
    margin-bottom: 0px;
    margin-top: 3px;
    color: #0093EE;
}

.logo p {
    font-family: HeeboThin, Arial;
    font-size: 11px;
    text-align: center;
    width: 100%;
    text-transform: uppercase;
    color: #eeeeee;
    margin-top: 0px;
    padding-top: 0px;
}

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

.logo a:hover {
    text-decoration: none;
}

/* 2.2. Menu */

#menu {
    background-color: #1C293B;
    width: 5%;
    padding-left: 1%;
    padding-right: 1%;
    float: left;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}

#menu ul {
    list-style: none;
    position: absolute;
    padding-right: 0px;
    padding-left: 0px;
    margin-right: 0px;
    margin-left: 0px;
    bottom: 0;
    left: 0;
    right: 0;
}

#menu ul li {
    width: 56.693px;
    padding-bottom: 25%;
    cursor: pointer;
    margin: 0 auto;
    font-family: HeeboBold, Arial;
    text-transform: uppercase;
    font-size: 14px;
    color: #FFFFFF;
    letter-spacing: 0.4px;
    text-align: center;
    padding-top: 5px;
    text-shadow: 1px 1px 1px rgba(15, 29, 48, 0.4);
}

#menu ul li.icon-order::before,
#menu ul li.icon-check::before,
#menu ul li.icon-waiter::before,
#menu ul li.icon-help::before {
    font-size: 50px !important;
}

#menu ul li.active {
    color: #0093EE;
}

/* 2.3. Submenu */

#submenu {
    background-image: -webkit-linear-gradient(rgba(34,50,71,0.00) 0%, #223247 100%);
    background-image: -moz-linear-gradient(rgba(34,50,71,0.00) 0%, #223247 100%);
    background-image: -o-linear-gradient(rgba(34,50,71,0.00) 0%, #223247 100%);
    background-image: linear-gradient(rgba(34,50,71,0.00) 0%, #223247 100%);
    margin-left: 7%;
    width: 27%;
    float: left;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    display: none;
}

#submenu ul.real_menu {
    list-style: none;
    position: absolute;
    padding-left: 10%;
    width: 90%;
    bottom: 0;
    left: 0;
    right: 0;
}

#submenu ul.real_menu li {
    font-family: HeeboBold, Arial;
    text-transform: uppercase;
    font-size: 16px;
    color: #FFFFFF;
    border-top: 1px solid rgba(244, 237, 255, 0.10);
    cursor: pointer;
    width: 88%;
    height: 8%;
    line-height: 8%;
    padding-bottom: 6%;
    padding-top: 6%;
    float: none;
    letter-spacing: 0.4px;
    text-shadow: 1px 1px 1px rgba(15, 29, 48, 0.4);
}

#submenu ul.real_menu li.icon-menu::before, 
#submenu ul.real_menu li.icon-my-order::before, 
#submenu ul.real_menu li.icon-status::before, 
#submenu ul.real_menu li.icon-add-review::before,
#submenu ul.real_menu li.icon-receipt::before,
#submenu ul.real_menu li.icon-tax-info::before,
#submenu ul.real_menu li.icon-pay::before {
    font-size: 33px !important;
    vertical-align: middle;
    padding-right: 5px;
}

#submenu ul.real_menu li:last-child {
    margin-bottom: 10%;
    padding-bottom: 6%;
    border-bottom: 1px solid rgba(244, 237, 255, 0.10);
}

#submenu ul.real_menu li.active {
    color: #0093EE;
}

#submenu ul.real_menu li.active {
    color: #0093ee;
}

#submenu ul.real_menu li.inactive,
#submenu ul.real_menu li.hover {
    color: rgba(244, 237, 255, 0.15);
    cursor: default;
    text-shadow: none;
}

/******************************************************
 
3. MAIN PAGE
 
*******************************************************/

#screen_order_categories, 
#screen_order_status,
#screen_order_current, 
#screen_order_review,
#screen_order_category,
#screen_product,
#screen_check_review,
#screen_check_tax,
#screen_check_pay {
    background-image: linear-gradient(to top, rgba(34, 50, 71, 0) 0%, #223247 100%);
    display: none;
    float: right;
    width: 66%;
}

/* 3.1. Page Title */

.inner_page_title {
    background: rgba(15, 29, 48, 0.6) none repeat scroll 0 0;
    padding: 2.4%;
    position: fixed;
    width: 61.2%;
}

.page_title h1 {
    color: #ffffff;
    font-family: HeeboRegular,Arial;
    font-size: 26px;
    letter-spacing: 0.4px;
    line-height: 26px;
    text-align: center;
    vertical-align: middle;
    z-index: 1000;
}

.page_title h1::before {
    font-size: 45px;
    padding-right: 10px;
    position: inherit;
    vertical-align: middle;
}

/******************************************************
 
4. ORDER
 
*******************************************************/

/******************************************************
 
4.1. NEW ORDER
 
*******************************************************/

.go_back,
.go_back_orders {
    background: rgba(15, 29, 48, 0.8);
    color: #ffffff;
    display: none;
    font-family: HeeboBold,Arial;
    font-size: 16px;
    letter-spacing: 0.4px;
    padding-bottom: 1%;
    padding-top: 1%;
    position: fixed;
    text-transform: uppercase;
    width: 21%;
    padding-left: 2%;
    padding-right: 4%;
    line-height: 16px;
    vertical-align: middle;
    cursor: pointer;
    text-align: center;
}

.go_back:active,
.go_back_orders:active {
    background: #0093EE;
}

.go_back span::before,
.go_back_orders span::before {
    position: unset;
    font-size: 35px;
    vertical-align: middle;
    padding-right: 10px;
}

button.sort {
    background: #192739 none repeat scroll 0 0;
    border: medium none;
    border-radius: 4px;
    color: #ffffff;
    cursor: pointer;
    font-family: HeeboLight;
    font-size: 16px;
    margin-bottom: 1.5%;
    padding: 17px 25px;
    text-transform: uppercase;
    letter-spacing: 1.2px;
}

button.sort::before {
    font-size: 30px;
    padding-right: 10px;
    position: unset;
    vertical-align: middle;
}

button.sort.open {
    background: #0093EE;
}

ul.restaurant_categories {
    float: left;
    list-style: outside none none;
    padding-left: 4%;
    padding-top: 20%;
}

ul.restaurant_categories li {
    background: #26364c none repeat scroll 0 0;
    border-radius: 4px;
    cursor: pointer;
    float: left;
    margin-right: 3.3%;
    width: 30%;
    height: 45%;
}

ul.restaurant_categories li h1 {
    font-size: 18px;
    font-family: HeeboLight,Arial;
    text-align: center;
    text-decoration: none;
    color: #ffffff;
    letter-spacing: 0.6px;
    margin-top: 8px;
}

ul.restaurant_categories li:hover {
    color: #ffffff;
    text-decoration: none;
}

.restaurant_category_image img {
    border-radius: 4px 4px 0 0;
    width: 100%;
    height: 100%;
}

/* 4.1.2. New Order > Category Screen */

.page_inner {
    padding-top: 20%;
    padding-left: 4%;
    overflow-y: hidden;
    float: left;
    width: 96%;
}

ul.restaurant_products {
    list-style: outside none none;
    padding-left: 0;
    width: 100%;
}

ul.restaurant_products li {
    background: #26364c none repeat scroll 0 0;
    border-radius: 4px;
    cursor: pointer;
    float: left;
    height: 45%;
    margin-right: 3.3%;
    margin-bottom: 3.3%;
    width: 30%;
}

ul.restaurant_products li h1 {
    font-size: 18px;
    font-family: HeeboLight,Arial;
    text-align: left;
    padding-left: 20px;
    text-decoration: none;
    color: #ffffff;
    letter-spacing: 0.6px;
    margin-bottom: 0px;
    margin-top: 10px;
}

ul.restaurant_products li p.price {
    font-size: 14px;
    font-family: HeeboLight,Arial;
    text-align: left;
    padding-left: 20px;
    text-decoration: none;
    color: #CCCCCC;
    letter-spacing: 0.6px;
    margin-bottom: 15px;
    margin-top: 0px;
}

ul.restaurant_products li:hover {
    color: #ffffff;
    text-decoration: none;
}

.product_image img {
    border-radius: 4px 4px 0 0;
    width: 100%;
    height: 100%;
}

.success_message, 
.information_message,
.information_message_review,
.confirmation_message {
    border-radius: 4px;
    color: #ffffff;
    display: none;
    font-family: HeeboRegular,Arial;
    letter-spacing: 0.5px;
    margin-bottom: 3.5%;
    margin-right: 3.5%;
    margin-top: 0;
    padding: 0px;
    text-align: center;
}

.success_message, 
.confirmation_message {
    background: rgba(81, 173, 32, 0.7) none repeat scroll 0 0;
    border: 1px solid #6cac4a;
}

.information_message,
.information_message_review {
    background: rgba(28,40,59,0.9);
    border: 3px solid #335078;
}

.page_inner .information_message {
    margin-top: 2%;
}

.consumed_products .information_message,
.order_status_timers .information_message,
.information_message_review {
    margin-left: 3%;
}

.success_message h4, 
.information_message h4,
.information_message_review h4,
.confirmation_message h4 {
    font-size: 16px;
    line-height: 16px;
}

.success_message h4::before, 
.information_message h4::before,
.information_message_review h4::before,
.confirmation_message h4::before {
    position: unset;
    vertical-align: middle;
    font-size: 40px;
    padding-right: 15px;
}

button.place_order {
    background: #52ad20 none repeat scroll 0 0;
    border: medium none;
    border-radius: 5px;
    color: #ffffff;
    cursor: pointer;
    float: right;
    font-size: 16px;
    letter-spacing: 0.6px;
    margin: 2% 3% 2% 2%;
    padding: 15px;
    text-align: center;
    text-transform: uppercase;
    width: 40%;
}

button.place_order:active {
    background: #45921a none repeat scroll 0 0;
    border: medium none;
    box-shadow: none;
}

.place_order_message {
    border-radius: 4px;
    color: #ffffff;
    display: none;
    font-family: HeeboRegular,Arial;
    letter-spacing: 0.5px;
    margin-bottom: 3%;
    margin-top: 0;
    padding-bottom: 1%;
    padding-left: 4%;
    padding-top: 1%;
    text-align: left;
    text-transform: uppercase;
    width: 92.5%;
}

.place_order_message {
    background: rgba(28, 40, 59, 0.9) none repeat scroll 0 0;
    display: inline-block;
}

.place_order_message h4 {
    font-size: 16px;
    line-height: 16px;
    width: 50%;
    float: left;
}

.place_order_message h4::before {
    font-size: 40px;
    padding-right: 10px;
    position: unset;
    vertical-align: middle;
}

/* 4.1.3. New Order > Category > Product */

.picker_share,
.picker_calories,
.picker_review,
.picker_information,
.picker_chef {
    display: none;
}

#picker {
    width: 50%;
    float: right;
    margin-top: 15vh;
    height: 75vh;
}

.picker_details {
    width: 40%;
    padding-left: 5%;
    padding-right: 5%;
    float: right;
    background-image: -webkit-linear-gradient(rgba(34,50,71,0.00) 0%, #223247 100%);
    background-image: -moz-linear-gradient(rgba(34,50,71,0.00) 0%, #223247 100%);
    background-image: -o-linear-gradient(rgba(34,50,71,0.00) 0%, #223247 100%);
    background-image: linear-gradient(rgba(34,50,71,0.00) 0%, #223247 100%);
    margin-top: 25vh;
    min-height: 75vh;
}

.circle-menu {
    position: fixed;
    width: 400px;
    height: 400px;
    margin: 50px auto;   
}

.circle-menu .center {
    border: 2px solid #FFFFFF;
    border-radius: 50%;
    height: 120px;
    left: 135px;
    position: absolute;
    top: 140px;
    width: 120px;
    z-index: 1000;
}

.circle-menu ul {
    border-radius: 50%;
    height: 300px;
    list-style: outside none none;
    margin: 50px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 300px;
    transform: rotate(30deg);
}

.circle-menu li {
    position: absolute;
    top: -10px;
    left: -10px;
    width: 160px;
    height: 160px;
    transform-origin: 100% 100%;
    overflow: hidden;
}

.circle-menu li:nth-child(1) {
    transform: rotate(0deg) skew(30deg);
}
.circle-menu li:nth-child(2) {
     transform: rotate(60deg) skew(30deg);
}
.circle-menu li:nth-child(3) {
    transform: rotate(120deg) skew(30deg);
}
.circle-menu li:nth-child(4) {
    transform: rotate(180deg) skew(30deg);
}
.circle-menu li:nth-child(5) {
    transform: rotate(240deg) skew(30deg);
}
.circle-menu li:nth-child(6) {
    transform: rotate(300deg) skew(30deg);
}

.circle-menu li a {
    display: block;
    width: 160px;
    height: 160px;
    margin-top: 40px;
    margin-left: 40px;
    background: rgba(15, 29, 48, 0.8) none repeat scroll 0 0;
    transform: skew(-30deg) rotate(-60deg);
    transition: background-color 0.5s;
}

.circle-menu li.inactive a,
.circle-menu li.inactive a:hover  {
    display: block;
    cursor: default !important;
    background: rgba(15, 29, 48, 0.6) none repeat scroll 0 0 !important;
}

.circle-menu li:nth-child(even) a {
    background-color:  rgba(15, 29, 48, 0.8);
}

.circle-menu li a.active,
.circle-menu li.active a {
    background-color:  #0093EE !important;
}

[class^="icon-"]:before {
    position: absolute;
    font-size: 3em;
    bottom: 50%;
    right: 35%;
    color: rgba(240, 240, 240, 1);
}

a.icon_settings {
    width: 50px;
    height: 50px;
}

.picker_details h1 {
    color: #FFFFFF;
    font-family: HeeboRegular,Arial;
    font-size: 26px;
    letter-spacing: 0.6px;
    margin-bottom: 25px;
    margin-top: 0;
    text-align: left;
    text-decoration: none;
    text-shadow: 1px 1px 1px rgba(15, 29, 48, 0.4);
}

.picker_configure ul {
    list-style: outside none none;
    margin-left: 0;
    padding-left: 0;
    width: 100%;
}

.picker_configure ul li {
    color: #ffffff;
    float: none;
    font-family: HeeboRegular,Arial;
    height: 45px;
    margin-top: 10px;
    text-shadow: 1px 1px 1px rgba(15, 29, 48, 0.4);
    width: 100%;
    border-bottom: 1px solid rgba(244, 237, 255, 0.20);
    padding-bottom: 10px;
    padding-top: 10px;
}

.picker_configure ul li.quantity {
    padding-bottom: 20px;
}

.picker_configure ul li button.minus, .picker_configure ul li button.plus {
    background: rgba(15, 29, 48, 0.8);
    border: medium none;
    border-radius: 5px;
    color: #fff;
    cursor: pointer;
    float: left;
    font-family: HeeboRegular,Arial;
    font-size: 14px;
    line-height: 14px;
    padding-bottom: 5%;
    padding-top: 5%;
    text-align: center;
    width: 15%;
}

.picker_configure ul li button.minus:active, .picker_configure ul li button.plus:active {
    background: #1e74aa none repeat scroll 0 0;
    box-shadow: none;
    border: none;
}

.picker_configure ul li button.minus.disable, 
.picker_configure ul li button.plus.disable {
    background: rgba(15, 29, 48, 0.8);
    opacity: 0.5;
    cursor: not-allowed;
}

.picker_configure ul li button.minus.disable:active, 
.picker_configure ul li button.plus.disable:active {
    background: rgba(15, 29, 48, 0.8);
    opacity: 0.5;
    cursor: not-allowed;
}

.picker_configure ul li p {
    float: left;
    font-size: 18px;
    height: 5%;
    letter-spacing: 0.4px;
    line-height: 15px;
    text-align: center;
    width: 70%;
}

.picker_configure button.confirm {
    background: #52ad20 none repeat scroll 0 0;
    border: medium none;
    border-radius: 5px;
    color: #ffffff;
    cursor: pointer;
    font-size: 16px;
    letter-spacing: 0.6px;
    margin-top: 20px;
    padding: 15px 20px;
    text-align: center;
    width: 100%;
    text-transform: uppercase;
}

.picker_configure button.confirm:active {
    background: #45921A none repeat scroll 0 0;
    box-shadow: none;
    border: none;
}

select.picker_options {
    background-color: rgba(15, 29, 48, 0.8);
    border: medium none;
    border-radius: 5px;
    color: #fff;
    font-size: 18px;
    padding-bottom: 15px;
    padding-left: 30px;
    padding-right: 30px;
    padding-top: 15px;
    height: 50px;
    width: 100%;
    margin-bottom: -5px;
    user-select: none;
}

select.picker_options:active,
.picker_configure ul li button.minus:active,
.picker_configure ul li button.plus:active,
.picker_configure button.confirm:active,
select.picker_options:focus,
.picker_configure ul li button.minus:focus,
.picker_configure ul li button.plus:focus,
.picker_configure button.confirm:focus {
    border: none;
    outline: none;
    box-shadow: none;
    background-image: none;
    outline: 0;
    -webkit-box-shadow: none;
            box-shadow: none;
}

.picker_configure ul li.on_off p {
    width: 82%;
    text-align: left;
    line-height: 34px;
    margin-top: 0px;
    height: 34px;
}

.picker_configure ul li.on_off .switch {
    width: 18%;
}

.on_off .switch {
    display: inline-block;
    height: 34px;
    position: relative;
    width: 60px;
}

.on_off .switch input {
    display: none;
}

.on_off .switch {
  position: relative;
  display: inline-block;
  width: 60px;
  height: 34px;
}

.on_off .switch input { 
    display:none; 
}

.on_off .slider_ingri {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(15, 29, 48, 0.8);
    -webkit-transition: .4s;
    transition: .4s;
}

.on_off .slider_ingri:before {
    position: absolute;
    content: "";
    height: 26px;
    width: 26px;
    left: 4px;
    bottom: 4px;
    background-color: #eeeeee;
    -webkit-transition: .4s;
    transition: .4s;
}

.on_off input:checked + .slider_ingri {
    background-color: #2196F3;
}

.on_off input:focus + .slider_ingri {
    box-shadow: 0 0 1px #2196F3;
}

.on_off input:checked + .slider_ingri:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}

.on_off .slider_ingri.round {
  border-radius: 34px;
}

.on_off .slider_ingri.round:before {
  border-radius: 50%;
}

.picker_details p.desc {
    font-family: HeeboRegular,Arial;
    font-size: 16px;
    line-height: 25px;
    margin-bottom: 15px;
    margin-top: 0;
    background: #FFFFFF;
    opacity: 0.8;
    border-radius: 4px;
    color: rgba(15, 29, 48, 0.8);
    padding: 15px;
}

.picker_details table {
    background: #FFFFFF;
    opacity: 0.8;
    border-radius: 4px;
    color: rgba(15, 29, 48, 0.8);
    font-family: HeeboRegular,Arial;
    font-size: 15px;
    padding: 15px;
    text-align: left;
    text-shadow: none;
    width: 100%;
}

.picker_details table thead {
    font-family: HeeboBold,Arial;
    font-size: 18px;
    text-transform: uppercase;
    color: rgba(15, 29, 48, 0.8);
}

.picker_details table th {
    font-family: HeeboBold,Arial;
    font-size: 16px;
}

.picker_details table td {
    padding-bottom: 5px;
    padding-right: 15px;
    padding-top: 5px;
}

ul.order_products {
    float: left;
    list-style: outside none none;
    margin-bottom: 0;
    padding-left: 0;
    width: 100%;
}

ul.order_products li {
    background: #26364c none repeat scroll 0 0;
    border-radius: 4px;
    float: left;
    height: 45%;
    margin-bottom: 3.3%;
    margin-right: 3.3%;
    width: 30%;
}

ul.order_products li h1 {
    color: #ffffff;
    font-family: HeeboLight,Arial;
    font-size: 18px;
    letter-spacing: 0.6px;
    margin-bottom: 0;
    margin-top: 15px;
    padding-left: 20px;
    text-align: left;
    text-decoration: none;
}

ul.order_products li h3::before {
    color: #cccccc;
    font-size: 25px;
    position: unset;
    vertical-align: middle;
    padding-right: 8.5px;
    padding-bottom: 3px;
}

ul.order_products li h3 {
    color: #cccccc;
    font-family: HeeboLight,Arial;
    font-size: 14px;
    letter-spacing: 0.5px;
    line-height: 18px;
    margin-bottom: 0;
    margin-top: 10px;
    padding-left: 20px;
}

ul.order_products li p.price {
    color: #cccccc;
    font-family: HeeboLight,Arial;
    font-size: 14px;
    letter-spacing: 0.6px;
    margin-bottom: 15px;
    margin-top: 0;
    padding-left: 20px;
    text-align: left;
    text-decoration: none;
}

ul.order_products li:hover {
    color: #ffffff;
    text-decoration: none;
}

ul.order_products .product_image img {
    border-radius: 4px 4px 0 0;
    height: 100%;
    width: 100%;
}

ul.order_products li a.remove_request {
    background: #b33a3a none repeat scroll 0 0;
    border: 0 none;
    border-radius: 0 0 4px 4px;
    color: #ffffff;
    cursor: pointer;
    display: block;
    font-family: HeeboLight,Arial;
    font-size: 14px;
    height: 35px;
    letter-spacing: 0.6px;
    line-height: 43px;
    padding-bottom: 6px;
    text-align: center;
    text-transform: uppercase;
    width: 100%;
}


ul.order_products li a.remove_request:active {
    background: #A90D0D none repeat scroll 0 0;
}

.picker_review ul {
    list-style: outside none none;
    padding-bottom: 10px;
    padding-left: 0;
}

.picker_review ul li {
    background: #ffffff none repeat scroll 0 0;
    border-radius: 4px;
    color: rgba(15, 29, 48, 0.8);
    font-family: HeeboBold,Arial;
    font-size: 16px;
    line-height: 25px;
    margin-bottom: 15px;
    margin-top: 0;
    opacity: 0.8;
    padding: 15px 15px;
}

.picker_review ul li p {
    margin-bottom: 3px;
    margin-top: 0;
    padding-bottom: 0;
    padding-top: 0;
}

.picker_review h3 {
    color: #FFFFFF;
    font-family: HeeboRegular,Arial;
    letter-spacing: 0.6px;
    margin-bottom: 15px;
    margin-top: 0;
    text-align: left;
    text-decoration: none;
    text-shadow: 1px 1px 1px rgba(15, 29, 48, 0.4);
}

.overall_rating .stars {
    padding-bottom: 34px;
}

.picker_review .overall_rating .stars i {
    text-shadow: 1px 1px 1px rgba(15, 29, 48, 0.4);
    display: inline;
}

.picker_review .overall_rating .stars i.fa-star {
    color: #fc0;
    font-size: 30px;
}

.picker_review ul li .stars i.fa-star {
    color: #fc0;
    font-size: 16px;
}

.picker_review .stars i.fa-star.inactive {
    color: #ccc;
}

.picker_review .stars input[type="radio"] {
    display: none;
}

/******************************************************
 
4.2. ORDER STATUS
 
*******************************************************/

.order_status_timers {
    padding-top: 22%;
    width: 100%;
}

.order_status_timers ul {
    list-style: outside none none;
    margin-top: 0;
    padding-left: 0;
    padding-top: 0;
    width: 100%;
}

.order_status_timers ul li {
    background: rgba(28, 40, 59, 0.9) none repeat scroll 0 0;
    border-radius: 4px;
    color: #ffffff;
    display: inline-block;
    font-family: HeeboRegular,Arial;
    letter-spacing: 0.5px;
    list-style: outside none none;
    margin-bottom: 3.5%;
    margin-left: 3%;
    margin-right: 3%;
    width: 94%;
}

.order_status_timers ul li .product_photo {
    float: left;
    height: 10%;
    margin-bottom: -1%;
    padding-bottom: 0;
    width: 25%;
    padding-right: 2%;
}

.order_status_timers ul li .product_photo img {
    border-radius: 3px 0 0 3px;
    width: 100%;
}

.order_status_timers ul li .product_timer {
    float: left;
    height: 20%;
    width: 20%;
    padding: 3% 2% 2% 2.5%;
}

.order_status_timers ul li .product_details {
    float: left;
    width: 35%;
    padding-top: 4.5%;
}

.order_status_timers ul li h1 {
    color: #ffffff;
    font-family: HeeboLight,Arial;
    font-size: 30px;
    letter-spacing: 0.6px;
    line-height: 25px;
    margin-bottom: 0;
    text-align: left;
    text-decoration: none;
}

.order_status_timers ul li h3::before {
    color: #0276FD;
    font-size: 25px;
    padding-bottom: 0px;
    padding-right: 5px;
    position: unset;
    vertical-align: middle;
}

.order_status_timers ul li h3 {
    color: #0276FD;
    font-family: HeeboLight,Arial;
    font-size: 15px;
    letter-spacing: 0.5px;
    line-height: 15px;
    margin-top: 2%;
    text-transform: uppercase;
}

.order_status_timers ul li p {
    color: #cccccc;
    font-family: HeeboLight,Arial;
    font-size: 14px;
    line-height: 14px;
    letter-spacing: 0.6px;
    margin-top: 6%;
    text-align: left;
    text-decoration: none;
}

.order_status_timers ul li p::before {
    font-size: 20px;
    line-height: 20px;
    padding-right: 7px;
    position: unset;
    vertical-align: middle;
    padding-bottom: 3px;
}

/******************************************************
 
4.3. ORDER REVIEW
 
*******************************************************/

.consumed_products {
    padding-top: 22%;
    width: 100%;
}

.consumed_products ul {
    list-style: outside none none;
    margin-top: 0;
    padding-left: 0;
    padding-top: 0;
}

.consumed_products ul li {
    background: rgba(28, 40, 59, 0.9) none repeat scroll 0 0;
    border-radius: 4px;
    color: #ffffff;
    display: inline-block;
    font-family: HeeboRegular,Arial;
    letter-spacing: 0.5px;
    list-style: outside none none;
    margin-bottom: 3.5%;
    margin-left: 3%;
    margin-right: 3%;
    width: 94%;
}

.consumed_products ul li .product_photo {
    float: left;
    height: 10%;
    margin-bottom: -1%;
    padding-bottom: 0;
    width: 25%;
}

.consumed_products ul li .product_photo img {
    border-radius: 3px 0 0 3px;
    width: 100%;
}

.consumed_products ul li .product_details {
    float: left;
    width: 45%;
}

.consumed_products .product_review_list_right {
    float: left;
    padding-top: 3%;
    width: 25%;
}

.consumed_products ul li h1 {
    color: #ffffff;
    font-family: HeeboLight,Arial;
    font-size: 30px;
    letter-spacing: 0.6px;
    margin-bottom: 0;
    margin-top: 0;
    padding-left: 10%;
    text-align: left;
    text-decoration: none;
}

.consumed_products ul li h3::before {
    color: #cccccc;
    font-size: 25px;
    padding-bottom: 3px;
    padding-right: 8.5px;
    position: unset;
    vertical-align: middle;
}

.consumed_products ul li h3 {
    color: #cccccc;
    font-family: HeeboLight,Arial;
    font-size: 14px;
    letter-spacing: 0.5px;
    line-height: 18px;
    margin-top: 7%;
    padding-left: 10%;
}

.consumed_products ul li p {
    color: #cccccc;
    font-family: HeeboLight,Arial;
    font-size: 14px;
    letter-spacing: 0.6px;
    line-height: 17px;
    margin-bottom: 5px;
    margin-top: 6px;
    padding-left: 10%;
    text-align: left;
    text-decoration: none;
}

.consumed_products ul li .product_review_button {
    float: left;
    margin-top: 2.6%;
    width: 100%;
}

.consumed_products ul li .product_review_button.alone {
    float: left;
    margin-top: 14.5%;
    width: 100%;
}

.consumed_products ul li .product_review_button button {
    border: medium none;
    border-radius: 5px;
    color: #ffffff;
    cursor: pointer;
    font-size: 16px;
    letter-spacing: 0.6px;
    margin-top: 20px;
    padding: 15px 20px;
    text-align: center;
    text-transform: uppercase;
    width: 100%;
}

.consumed_products ul li .product_review_button button {
    background: #52ad20 none repeat scroll 0 0;
    outline: medium none;
}

.consumed_products ul li .product_review_button button:active {
    background: #45921a none repeat scroll 0 0;
    outline: medium none;
}

/******************************************************
 
4.2. ORDER REVIEW INNER
 
*******************************************************/

#screen_order_review_inner {
    background-image: linear-gradient(to top, rgba(34, 50, 71, 0) 0%, #223247 100%);
    display: none;
    float: right;
    width: 66%;
}

.product_review_left .product_photo img {
    border-radius: 4px 4px 0 0;
    width: 100%;
}

.product_review_right {
    background-image: linear-gradient(rgba(34, 50, 71, 0) 0%, #223247 100%);
    float: left;
    margin-top: 27vh;
    min-height: 75vh;
    padding-left: 5%;
    padding-right: 5%;
    right: 0;
    width: 55%;
}

.product_review_right h3 {
    color: #fff;
    font-family: HeeboRegular,Arial;
    font-size: 25px;
    letter-spacing: 0.6px;
    margin-bottom: 0px;
    margin-top: 0;
    text-align: left;
    text-decoration: none;
    text-shadow: 1px 1px 1px rgba(15, 29, 48, 0.4);
}

.product_review_right h3::before {
    position: unset;
    vertical-align: middle;
}

.product_review_left h3::before {
    color: #cccccc;
    font-size: 25px;
    padding-bottom: 3px;
    padding-right: 8.5px;
    position: unset;
    vertical-align: middle;
}

.product_review_left h3 {
    color: #cccccc;
    font-family: HeeboLight,Arial;
    font-size: 14px;
    letter-spacing: 0.5px;
    line-height: 18px;
    margin-bottom: 0;
    margin-top: 10px;
    padding-left: 20px;
}

.product_review_right ul {
    list-style: outside none none;
    margin-left: 0;
    padding-left: 0;
    padding-top: 0px;
    margin-top: 0px;
}

.product_review_right ul li {
    border-bottom: 1px solid rgba(244, 237, 255, 0.1);
    color: #ffffff;
    float: none;
    font-family: HeeboRegular,Arial;
    margin-bottom: 10px;
    padding-bottom: 20px;
    padding-top: 2px;
    text-shadow: 1px 1px 1px rgba(15, 29, 48, 0.4);
    width: 100%;
}

.my_review_box, .customer_ratings {
    padding-bottom: 7%;
    margin-bottom: 7%;
    border-bottom: 2px solid rgba(244, 237, 255, 0.1);
}

.my_review_box h3, .customer_ratings h3 {
    margin-bottom: 15px;
}

.my_review_box h3 {
    width: 50%;
    float: left;
}

.my_review_box textarea {
    color: #FFFFFF;
    border: none;
    resize: none;
    font-family: HeeboRegular, Arial;
    font-size: 16px;
    padding: 15px;
    border-radius: 4px;
    background: rgba(15, 29, 48, 0.6);
    width: 94%;
}

.my_review_box textarea:focus,
.my_review_box textarea:active {
    color: #FFFFFF;
    outline: 0px;
    border: none;
}

.my_review_box button {
    background: #52ad20 none repeat scroll 0 0;
    border: medium none;
    border-radius: 5px;
    color: #ffffff;
    cursor: pointer;
    font-size: 16px;
    letter-spacing: 0.6px;
    margin-top: 5px;
    padding: 15px 20px;
    text-align: center;
    width: 100%;
    text-transform: uppercase;
}

.my_review_box button:active {
    background: #45921A none repeat scroll 0 0;
    box-shadow: none;
    border: none;
}

.product_review_left {
    background: #26364c none repeat scroll 0 0;
    border-radius: 4px;
    float: left;
    height: 45%;
    margin: 27vh 5% 5%;
    padding-bottom: 20px;
    width: 25%;
}

.product_review_left h1 {
    color: #ffffff;
    font-family: HeeboLight,Arial;
    font-size: 26px;
    letter-spacing: 0.6px;
    margin-bottom: 5px;
    margin-top: 10px;
    padding-left: 20px;
    text-align: left;
    text-decoration: none;
}

.product_review_left h1::before {
    position: unset;
    vertical-align: middle;
}

.product_review_left p {
    color: #cccccc;
    font-family: HeeboLight,Arial;
    font-size: 14px;
    letter-spacing: 0.6px;
    line-height: 25px;
    margin-bottom: 0;
    margin-top: 0;
    padding-left: 20px;
    text-align: left;
    text-decoration: none;
}

/******************************************************
 
5. CHECK
 
*******************************************************/

/******************************************************
 
5.1. CHECK REVIEW
 
*******************************************************/

.check_list_review {
    padding-left: 3%;
    padding-right: 3%;
    padding-top: 21%;
    width: 94%;
}

.check_list_review h1::before {
    color: #fff;
    font-size: 40px;
    padding-bottom: 3px;
    padding-right: 8.5px;
    position: unset;
    text-shadow: 1px 1px 1px rgba(15, 29, 48, 0.6);
    vertical-align: middle;
}

.check_list_review h1 {
    color: #fff;
    font-family: HeeboLight,Arial;
    font-size: 25px;
    letter-spacing: 0.5px;
    line-height: 18px;
    margin-top: 0;
    text-align: center;
    text-shadow: 1px 1px 1px rgba(15, 29, 48, 0.6);
}

.check_list_review ul {
    list-style: outside none none;
    margin-top: 0;
    padding-left: 0;
    padding-top: 0;
}

.check_list_review ul li {
    background: rgba(28, 40, 59, 0.9) none repeat scroll 0 0;
    border-radius: 4px;
    color: #ffffff;
    display: inline-block;
    font-family: HeeboRegular,Arial;
    letter-spacing: 0.5px;
    list-style: outside none none;
    margin-top: 2%;
    width: 100%;
}

.check_list_review ul li .product_photo {
    float: left;
    margin-bottom: -1%;
    padding-bottom: 0;
    width: 25%;
}

.check_list_review ul li .product_photo img {
    border-radius: 3px 0 0 3px;
    width: 100%;
}

.check_list_review ul li .product_details {
    float: left;
    width: 50%;
}

.check_list_review ul li h1 {
    color: #ffffff;
    font-family: HeeboLight,Arial;
    font-size: 30px;
    letter-spacing: 0.6px;
    margin-bottom: 5%;
    margin-top: 5%;
    padding-left: 10%;
    text-align: left;
    text-decoration: none;
}

.check_list_review ul li h3::before {
    color: #cccccc;
    font-size: 25px;
    padding-bottom: 3px;
    padding-right: 8.5px;
    position: unset;
    vertical-align: middle;
}

.check_list_review ul li h3 {
    color: #cccccc;
    font-family: HeeboLight,Arial;
    font-size: 14px;
    letter-spacing: 0.5px;
    line-height: 18px;
    margin-top: 8%;
    padding-left: 10%;
    margin-bottom: 4%;
}

.check_list_review ul li p {
    color: #cccccc;
    font-family: HeeboLight,Arial;
    font-size: 14px;
    letter-spacing: 0.6px;
    line-height: 17px;
    margin-bottom: 5px;
    margin-top: 6px;
    padding-left: 10%;
    text-align: left;
    text-decoration: none;
}

.check_list_review .product_review_given {
    float: right;
    margin-right: 3%;
    padding-top: 9%;
    text-align: center;
    width: 18%;
}

.check_list_review .product_review_given p {
    color: #ffffff;
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 10px;
    margin-left: 0;
    padding-left: 0;
    text-transform: uppercase;
}

button.confirm_check {
    background: #52ad20 none repeat scroll 0 0;
    border: medium none;
    border-radius: 5px;
    color: #ffffff;
    cursor: pointer;
    float: right;
    font-size: 16px;
    letter-spacing: 0.6px;
    margin: 2% 3% 2% 2%;
    padding: 15px;
    text-align: center;
    text-transform: uppercase;
    width: 40%;
    display: none;
}

button.confirm_check:active {
    background: #45921a none repeat scroll 0 0;
    border: medium none;
    box-shadow: none;
}

.total_message {
    border-radius: 4px;
    color: #ffffff;
    font-family: HeeboRegular,Arial;
    text-shadow: none;
    letter-spacing: 0.5px;
    margin-bottom: 3%;
    margin-top: 0;
    padding-bottom: 1%;
    padding-left: 4%;
    padding-top: 1%;
    text-align: left;
    text-transform: uppercase;
    width: 96%;
}

.total_message {
    background: rgba(28, 40, 59, 0.9) none repeat scroll 0 0;
    display: inline-block;
}

.total_message h4 {
    font-size: 16px;
    line-height: 16px;
    width: 50%;
    float: left;
}

.total_message h4::before {
    font-size: 40px;
    padding-right: 10px;
    position: unset;
    vertical-align: middle;
}

/******************************************************
 
5.2. TAX INFORMATION
 
*******************************************************/

.check_tax_inner {
    padding-left: 3.3%;
    padding-right: 3.3%;
    padding-top: 20%;
}

.left_receipt {
    background: rgba(0, 0, 0, 0) url("../graphics/receipt.svg") repeat-y local center top;
    float: left;
    background-size: 100% 100%;
    margin-left: 5%;
    margin-right: 5%;
    padding-top: 5%;
    padding-bottom: 5%;
    width: 40%;
    padding-bottom: 20%;
}

.left_receipt img {
    margin: 0 17% 0 13%;
    width: 70%;
}

.left_receipt h1 {
    color: #444;
    font-family: BitterRegular;
    font-size: 16px;
    letter-spacing: 2.4px;
    padding-top: 0.5%;
    text-align: center;
    text-transform: uppercase;
}

.left_receipt ul {
    color: #444;
    font-family: BitterRegular;
    font-size: 14px;
    letter-spacing: 0.6px;
    line-height: 14px;
    list-style: outside none none;
    margin: 3% 17% 0 13%;
    padding-left: 0;
}

.left_receipt ul li {
    height: 55px;
}

.left_receipt ul li p.product_name {
    float: left;
    text-align: left;
}

.left_receipt ul li p.product_price {
    float: right;
    text-align: right;
}

.left_receipt ul.final {
    color: #444;
    font-family: BitterRegular;
    font-size: 14px;
    font-weight: bold;
    letter-spacing: 0.6px;
    list-style: outside none none;
    margin-bottom: 0;
    margin-top: 2%;
    padding-bottom: 0;
    padding-left: 0;
}

.left_receipt ul.final li {
    height: 45px;
    line-height: 14px;
    margin-top: 0;
}

.flip-container {
    float: right;
    perspective: 1000px;
    width: 50%;
}

.flip-container.flip .flipper {
    transform: rotateY(180deg);
}

.flipper {
    position: relative;
    transform-style: preserve-3d;
    transition: all 0.6s ease 0s;
}

.front, .back {
    backface-visibility: hidden;
    position: absolute;
}

.front {
    transform: rotateY(0deg);
    z-index: 2;
}

.back {
    transform: rotateY(180deg);
}

.front, .back {
    background: rgba(28, 40, 59, 0.9) none repeat scroll 0 0;
    border-radius: 4px;
    padding: 4%;
    width: 92%;
}

.flipper h1 {
    color: #ffffff;
    font-family: HeeboRegular,Arial;
    font-size: 18px;
    letter-spacing: 0.6px;
    margin-bottom: 10%;
    margin-top: 8%;
    text-align: center;
    text-decoration: none;
}

.flipper p {
    color: #ffffff;
    font-family: HeeboRegular,Arial;
    font-size: 16px;
    letter-spacing: 0.6px;
    text-align: left;
    margin-left: 6%;
    text-decoration: none;
}

.flipper p.tax_enterprise {
    margin-bottom: 10%;
}

button.change_tax,
button.save_tax_information,
button.cancel_tax_information,
button.confirm_receipt,
button.check_back {
    border: medium none;
    border-radius: 5px;
    color: #ffffff;
    cursor: pointer;
    font-size: 16px;
    letter-spacing: 0.6px;
    padding: 15px 20px;
    text-align: center;
    text-transform: uppercase;
}

button.change_tax,
button.save_tax_information,
button.cancel_tax_information {
    width: 100%;
}

button.cancel_tax_information {
    margin-top: 2%;
}

button.confirm_receipt {
    float: right;
    margin-bottom: 2%;
    margin-right: 2%;
    margin-top: 2%;
}

button.check_back {
    float: left;
    margin-bottom: 2%;
    margin-right: 2%;
    margin-top: 2%;
}

button.check_back {
    background: rgba(28, 40, 59, 0.9)  none repeat scroll 0 0;
    outline: medium none;
}

button.check_back:active {
    background: rgba(28, 40, 59, 1)  none repeat scroll 0 0;
    outline: medium none;
}

button.cancel_tax_information {
    background: #b33a3a none repeat scroll 0 0;
}

button.cancel_tax_information:active {
    background: #a90d0d none repeat scroll 0 0;
}

button.change_tax,
button.save_tax_information,
button.confirm_receipt {
    background: #52ad20 none repeat scroll 0 0;
    outline: medium none;
}

button.change_tax:active,
button.save_tax_information:active,
button.confirm_receipt:active {
    background: #45921a none repeat scroll 0 0;
    outline: medium none;
}

.total_check {
    border-radius: 4px;
    color: #ffffff;
    font-family: HeeboRegular,Arial;
    letter-spacing: 0.5px;
    margin-bottom: 3%;
    margin-top: 3%;
    padding-bottom: 1%;
    padding-left: 4%;
    padding-top: 1%;
    text-align: left;
    text-shadow: none;
    text-transform: uppercase;
    width: 96%;
}

.total_check {
    background: rgba(28, 40, 59, 0.9) none repeat scroll 0 0;
    display: inline-block;
}

.total_check h4 {
    float: left;
    font-size: 16px;
    line-height: 16px;
    width: 50%;
}

.total_check h4::before {
    font-size: 40px;
    padding-right: 10px;
    position: unset;
    vertical-align: middle;
}

.check_list_review .information_message {
    display: block;
    width: 99%;
    margin-bottom: 0.7%;
}

.back {
    font-family: HeeboRegular,Arial;
    padding-top: 8%;
}

.back input {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border-color: rgba(244, 237, 255, 0.2);
    border-style: none none solid;
    border-width: 2px;
    float: none;
    width: 90%;
    margin-bottom: 10%;
    padding-top: 0%;
    margin-left: 5%;
    height: 45px;
    color: #AAA;
    font-size: 35px;
}

.back input:focus,
.back input:active {
    outline: none;
}

.back label {
    float: none;
    padding: 5%;
    width: 100%;
    text-transform: uppercase;
    color: #FFFFFF;
    letter-spacing: 0.8px;
}

.back label span {
    color: #999;
    font-size: 14px;
    text-transform: none;
    padding-left: 3px;
}

/******************************************************
 
5.3. PAY
 
*******************************************************/

.authorize_payment {
    background: rgba(28, 40, 59, 0.9) none repeat scroll 0 0;
    border-radius: 4px;
    color: #ffffff;
    float: left;
    font-family: HeeboThin,Arial;
    font-size: 45px;
    padding: 10% 5%;
    text-align: center;
    width: 44.3%;
}

.container {
    background: rgba(28, 40, 59, 0.9) none repeat scroll 0 0;
    border-radius: 4px;
    float: right;
    height: 400px;
    padding: 0 0 0 0.2%;
    text-align: center;
    width: 41%;
}

.row {
    clear: both;
    margin: 0 auto;
    text-align: center;
    width: 280px;
}

#output {
    color: #1976d2;
    font-family: HeeboLight,Arial;
    font-size: 27px;
    height: 70px;
    line-height: 65px;
    padding-top: 15px;
}

.authorize_payment h4 {
    color: #ffffff;
    font-size: 25px;
    margin: 0 auto;
    width: 100%;
}

.authorize_payment h4::before {
    color: #ffffff;
    font-size: 95px;
    position: unset;
}

button.digit, button.clear {
    background: rgba(28, 40, 59, 0.7) none repeat scroll 0 0;
    border: 1px solid #2f4869;
    border-radius: 4px;
    color: #ffffff;
    cursor: pointer;
    float: left;
    font-family: HeeboRegular,Arial;
    font-size: 30px;
    line-height: 30px;
    margin: 4px;
    min-width: 30%;
    padding: 8px 30px;
}

button.clear {
    font-size: 18px;
    padding-left: 34px;
    padding-right: 35px;
}

button.digit:active, button.clear:active {
    opacity: 0.6;
}

.inactive button.digit:active, 
.inactive button.clear:active {
    opacity: 1 !important;
}

.botrow {
    font-family: HeeboRegular;
    margin-left: 5%;
    text-align: center;
    width: 100%;
}

button#confirm_pin, button#cancel_pin {
    border: medium none;
    border-radius: 5px;
    color: #ffffff;
    cursor: pointer;
    float: left;
    font-size: 16px;
    letter-spacing: 0.6px;
    margin-left: 3%;
    margin-top: 4%;
    padding: 15px 20px;
    text-align: center;
    text-transform: uppercase;
    width: 40%;
}

button#confirm_pin {
    background: #52ad20 none repeat scroll 0 0 ;
    outline: medium none;
}

button#confirm_pin:active {
    background: #45921a none repeat scroll 0 0;
    outline: medium none;
}

.inactive button#confirm_pin:active {
    background: #52ad20 none repeat scroll 0 0 ;
    outline: medium none;
}

button#cancel_pin {
    background: #b33a3a none repeat scroll 0 0;
}

button#cancel_pin:active {
    background: #a90d0d none repeat scroll 0 0;
    outline: medium none;
}

.inactive button#cancel_pin:active {
    background: #b33a3a none repeat scroll 0 0;
}

.inactive button, .inactive .digit {
    cursor: default !important;
}

/******************************************************
 
7. SIDE SCREENS
 
*******************************************************/

/******************************************************
 
7.1. CALL WAITER
 
*******************************************************/

#side_waiter {
    padding-top: 0;
}

.waiter_comming {
    display: none;
    width: 100%;
}

.waiter_inner {
    bottom: 0;
    padding-bottom: 30%;
    position: absolute;
    width: 100%;
}

.close_side {
    background: rgba(15, 29, 48, 0.8) none repeat scroll 0 0;
    color: #ffffff;
    cursor: pointer;
    font-family: HeeboBold,Arial;
    font-size: 16px;
    letter-spacing: 0.4px;
    line-height: 16px;
    padding: 1% 4% 1% 2%;
    position: fixed;
    text-align: center;
    text-transform: uppercase;
    vertical-align: middle;
    width: 21%;
}

.close_side:active {
    background: #0093ee none repeat scroll 0 0;
}

.close_side span::before {
    font-size: 35px;
    padding-right: 10px;
    position: unset;
    vertical-align: middle;
}

#side_waiter h1::before {
    color: #fff;
    font-size: 65px;
    padding-bottom: 5px;
    padding-right: 9px;
    position: unset;
    vertical-align: middle;
}

#side_waiter h1 {
    color: #fff;
    font-family: HeeboLight,Arial;
    font-size: 40px;
    letter-spacing: 0.2px;
    margin-top: 0;
    padding-bottom: 5%;
    padding-top: 30%;
    text-align: center;
    text-shadow: 1px 1px 1px rgba(15, 29, 48, 0.6);
}

.waiter_comming h3 {
    color: #fff;
    font-family: HeeboRegular,Arial;
    font-size: 21px;
    letter-spacing: 1.5px;
    line-height: 40px;
    text-align: center;
    text-shadow: 1px 1px 1px rgba(15, 29, 48, 0.6);
    margin-top: 10px;
    padding-left: 10%;
    padding-right: 10%;
}

.confirmation_box {
    color: #fff;
    font-family: HeeboRegular,Arial;
    font-size: 21px;
    letter-spacing: 0.6px;
    line-height: 40px;
    padding-left: 10%;
    padding-right: 10%;
    text-align: center;
    text-shadow: 1px 1px 1px rgba(15, 29, 48, 0.6);
    text-transform: uppercase;
}

button.confirm_waiter, button.cancel_waiter {
    border: medium none;
    border-radius: 5px;
    color: #ffffff;
    cursor: pointer;
    font-size: 16px;
    letter-spacing: 0.6px;
    margin-bottom: 0;
    margin-top: 10px;
    padding: 15px 20px;
    text-align: center;
    text-transform: uppercase;
    width: 100%;
}

.waiter_photo img {
    border-radius: 80px;
    position: relative;
    width: 140px;
}

.waiter_photo {
    margin: 0 auto;
    width: 140px;
}

button.confirm_waiter {
    background: #52ad20 none repeat scroll 0 0;
    outline: medium none;
}

button.confirm_waiter:active {
    background: #45921a none repeat scroll 0 0;
    outline: medium none;
}

button.cancel_waiter {
    background: #b33a3a none repeat scroll 0 0;
}

button.cancel_waiter:active {
    background: #a90d0d none repeat scroll 0 0;
    outline: medium none;
}

/******************************************************
 
7.2. HELP
 
*******************************************************/

#side_help {
    padding-top: 0;
}

.help_inner {
    bottom: 0;
    padding-bottom: 30%;
    position: absolute;
    width: 80%;
    padding-left: 10%;
    padding-right: 10%;
}

#side_help h1::before {
    color: #fff;
    font-size: 65px;
    padding-bottom: 5px;
    padding-right: 9px;
    position: unset;
    vertical-align: middle;
}

#side_help h1 {
    color: #fff;
    font-family: HeeboLight,Arial;
    font-size: 40px;
    letter-spacing: 0.2px;
    margin-top: 0;
    padding-bottom: 5%;
    padding-top: 30%;
    text-shadow: 1px 1px 1px rgba(15, 29, 48, 0.6);
}

.help_inner p {
    color: #fff;
    font-family: HeeboRegular,Arial;
    font-size: 18px;
    letter-spacing: 1.5px;
    line-height: 25px;
    text-align: left;
    text-shadow: 1px 1px 1px rgba(15, 29, 48, 0.6);
    margin-top: 10px;
}

/******************************************************

8. SIMULATION CONTROLS

*******************************************************/

#simulation_controls {
    background-color: #ffffff;
    border-bottom: 50px solid #eeeeee;
    bottom: 0;
    color: #000000;
    display: none;
    height: 210px;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

.simulation_controls_inner {
    height: 210px;
    padding-left: 2%;
    padding-right: 2%;
    width: 96%;
}

.simulation_controls_inner span.simulation_control {
    cursor: pointer;
    float: left;
    height: 99%;
    padding-left: 2%;
    padding-right: 2%;
    padding-top: 1%;
    width: 15%;
    color: #000000;
}

.simulation_controls_inner span.simulation_control h3::before {
    display: inline-block;
    color: #000000;
    font-size: 70px;
    padding-bottom: 15px;
    position: unset;
    width: 100%;
}

.simulation_controls_inner span.simulation_control:active,
.simulation_controls_inner span.simulation_control:active h3::before,
.simulation_controls_inner span.simulation_control.open,
.simulation_controls_inner span.simulation_control.open h3::before {
    color: #0093EE;
    background: #eeeeee none repeat scroll 0 0;
}

.simulation_controls_inner span.simulation_control h3 {
    float: none;
    text-align: center;
    width: 100%;
}

.simulation_controls_inner span.simulation_control:hover {
    background: #eeeeee none repeat scroll 0 0;
}

.simulation_controls_inner span.simulation_control h3 {
    font-family: HeeboMedium,Arial;
    text-align: center;
}

#toggle_simulation_controls_wrapper {
    bottom: 0;
    display: block;
    height: 50px;
    position: fixed;
    right: 0;
    z-index: 1200;
    width: 15%;
}

.toggle_simulation_controls {
    background: #999 none repeat scroll 0 0;
    cursor: pointer;
    height: 50px;
}

.toggle_simulation_controls.open {
    background: #0093EE;
}

.toggle_simulation_controls p:before {
    font-size: 38px;
    position: unset;
    display: inline-block;
    vertical-align: middle;
    padding-right: 10px;
}

.toggle_simulation_controls p {
    color: #fff;
    font-family: HeeboMedium,Arial;
    height: 50px;
    line-height: 50px;
    margin-top: 0;
    text-align: center;
}

.info {
    float: right;
    font-family: HeeboRegular;
    height: 70%;
    line-height: 25px;
    padding-top: 1%;
    text-align: justify;
    width: 40%;
}

.info h3.icon-info {
    font-family: HeeboRegular,Arial;
    margin-bottom: 10px;
    text-transform: uppercase;
}

.info h3.icon-info::before {
    color: #000000;
    font-size: 35px;
    padding-right: 9px;
    position: unset;
    vertical-align: middle;
}

.info p {
    font-size: 14px;
    margin-top: 0;
}

.go_back_plate {
    position: fixed;
    visibility: hidden;
}