.login-body {
  background-color: #000000;
}

body {
  background-color: #FFFFFF;
  color: #000000;
}

.parallax-section {
  color: #FFFFFF;
}

a, .highlight {
  color: #E61A1A;
}

a:focus, a:hover, a:active {
  color: #000000;
}

.light {
  color: #FFFFFF;
}

label {
  color: #000000;
}
label small {
  color: #999999;
}

.btn-default {
  color: #FFFFFF;
  border-color: #FFFFFF;
}
.btn-default:hover, .btn-default:focus, .btn-default:active, .btn-default:visited {
  color: #FFFFFF !important;
  border-color: #FFFFFF !important;
}

.btn-primary, .btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .btn-primary:active:focus, .btn-primary:active:hover, .btn-primary.active:focus, .btn-primary.active:hover, .open > .btn-primary.dropdown-toggle, .open > .btn-primary.dropdown-toggle:focus, .open > .btn-primary.dropdown-toggle:hover {
  border-color: #E61A1A;
  color: #E61A1A;
}

.btn-primary.btn-fill {
  color: #FFFFFF;
  background-color: #E61A1A;
}

.btn-primary.btn-fill:hover, .btn-primary.btn-fill:focus, .btn-primary.btn-fill:active, .btn-primary.btn-fill.active, .open > .btn-primary.btn-fill.dropdown-toggle {
  color: #FFFFFF;
  background-color: #E61A1A;
}

.btn-primary a {
  color: #E61A1A !important;
}

.btn-primary .caret {
  border-top-color: #E61A1A !important;
}

.btn-light {
  border-color: #FFFFFF !important;
  color: #FFFFFF !important;
}

.btn-light a {
  color: #FFFFFF !important;
}

.btn-light .caret {
  border-top-color: #FFFFFF !important;
}

.radio-main .second-icon {
  color: #E61A1A !important;
}

.radio-white .second-icon {
  color: #FFFFFF !important;
}

.navbar:not(.navbar-transparent).navbar-ct-red {
  background-color: #E61A1A;
  -webkit-box-shadow: 0px 4px 5px 0px rgba(0, 0, 0, 0.45);
  -moz-box-shadow: 0px 4px 5px 0px rgba(0, 0, 0, 0.45);
  box-shadow: 0px 4px 5px 0px rgba(0, 0, 0, 0.45);
}

.tbl-member-history > tbody > tr:hover {
  background-color: rgba(230, 26, 26, 0.7);
}

.pagination > li.active > a {
  background-color: #E61A1A;
}

#tbl-member-history > tbody > tr:hover {
  background-color: rgba(230, 26, 26, 0.7);
}

#stateList li {
  color: #E61A1A;
}

.selected {
  background-color: #E61A1A;
}

.selected a span {
  color: #FFFFFF;
}

#home {
  color: #FFFFFF;
}

#home .overlay-bg {
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.25);
}

#transactionHistory .overlay-bg {
  background-color: rgba(0, 0, 0, 0.25);
}

.card-view:first-child {
  color: #E61A1A;
}

#tbl-store-locator .selected .value {
  color: #FFFFFF;
}

#ordering .overlay-bg {
  background-color: rgba(0, 0, 0, 0.25);
}

#yourProfile .overlay-bg {
  background-color: rgba(0, 0, 0, 0.25);
}

#yourProfileForm label {
  color: #FFFFFF;
}

#protectedProfileContent label {
  color: #FFFFFF;
}

.tfaContainer {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}

.tfaField {
  width: 200px;
  margin-left: 10px;
  margin-right: 10px;
  margin-bottom: 0;
}

footer {
  background-color: #FFFFFF;
}

#login-footer {
  color: #FFFFFF;
}

#login-footer a {
  color: #FFFFFF;
}

#login-footer a:hover {
  color: #E61A1A;
}

.modal-header {
  color: #E61A1A;
}

input:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 50px #FFFFFF inset;
}

input:-webkit-autofill:focus {
  -webkit-box-shadow: 0 0 0 50px #FFFFFF inset;
}

.bootstrap-datetimepicker-widget.dropdown-menu.bottom:after {
  border-bottom: 11px solid #FFFFFF;
}

.bootstrap-datetimepicker-widget.dropdown-menu.top:after {
  border-top: 11px solid #FFFFFF;
}

.bootstrap-datetimepicker-widget table td.today > div:before {
  border-bottom-color: #E61A1A;
}

.bootstrap-datetimepicker-widget table td.active > div, .bootstrap-datetimepicker-widget table td.active:hover > div {
  background-color: #E61A1A;
  color: #FFFFFF;
}

.bootstrap-datetimepicker-widget table td span.active {
  background-color: #E61A1A;
  color: #FFFFFF;
}

.form-control.error {
  color: #FB404B;
  border-color: #FB404B;
}

.error, .card label.error {
  color: #FB404B;
}

.alert button.close {
  background-color: #FFFFFF;
  color: #000000;
}

#login-page .overlay-bg {
  background-color: rgba(0, 0, 0, 0.25);
}

.login-card {
  background-color: #FFFFFF;
}
.login-card.ct-login-red .choice:hover .icon {
  border-color: #E61A1A;
}
.login-card.ct-login-red .choice.active .icon {
  border-color: #E61A1A;
}
.login-card.ct-login-red .nav-pills > li.active a {
  background-color: #E61A1A;
}
.login-card .description {
  color: #999999;
}
.login-card .nav-pills > li a {
  background-color: #999999;
  color: #FFFFFF !important;
}
.login-card .nav-pills > li > a:hover {
  background-color: #999999;
  cursor: default;
}
.login-card .nav-pills > li > a:focus {
  background-color: #999999;
  cursor: default;
}

/* https://github.com/Eonasdan/bootstrap-datetimepicker/issues/1505 */
.datetimepicker-popup-top-position-fix {
  position: relative;
}

.bootstrap-datetimepicker-widget.dropdown-menu.top.open {
  margin-bottom: 15px !important;
}

.bootstrap-datetimepicker-widget.dropdown-menu.top {
  margin-bottom: 15px !important;
}

@supports (-webkit-overflow-scrolling: touch) {
  #transactionHistory, #ordering, #yourProfile {
    background-position-x: 50%;
    background-position-y: 50%;
    background-attachment: scroll;
  }
}
#pwdstrength-container .progress {
  height: 20px !important;
}

@media (min-width: 768px) {
  .modal-dialog {
    margin: 80px auto;
  }
}
.modal-body p {
  color: initial !important;
}

/*========= Begin: Add Receipt section =========*/
#addReceiptMain .btn.dropdown-toggle, #addReceiptMain .btn.dropdown-toggle:hover {
  color: #000000 !important;
  border-color: #DDDDDD !important;
  border-style: solid !important;
  border-width: 1px !important;
  border-radius: 4px !important;
  margin-bottom: 0px !important;
}

#addReceiptMain .dropdown-menu.inner a {
  color: #000000 !important;
}

input.error, input.error + .input-group-addon {
  border-color: #000000 !important;
  margin-bottom: 0px !important;
}

#addReceiptMain label.error {
  color: red !important;
  margin-top: 3px !important;
  margin-bottom: 10px !important;
}

#addReceiptMain .form-group {
  margin-top: 5px;
  margin-bottom: 5px;
}

#addReceiptMain .form-control {
  margin-bottom: 0px;
}

/*========= End: Add Receipt section =========*/
#nick h2.title {
  color: url(/static/img/thumb_restaurant.png);
}

/*=======================================================================
[Table of contents]
=========================================================================
0.  Variables [Customisation for each client]
1.  Site structure section
2.	Typography
3.  Buttons
4.	Navigation section
5.	Home section
6.	Your Points sections
7.	Transaction history section
8.	Store locator section
9.	Ordering section
10.	Card transfer section
11.	My Profile section
12.	Footer section
13. Other section
14. Bootstrap Datepicker section
15. jQueryValidate section
16. Notifications section
15. Login Page
==========================================================================*/
/********* Variables section **********/
/*========= Fonts =========*/
/*========= Images =========*/
/*========= Animations =========*/
/********** End variables section **********/
/*======== Site structure section ======*/
html, body {
  height: 100%;
  font-family: Roboto;
}

body {
  line-height: 1.4;
  font-family: Roboto;
  font-size: 14px;
  font-weight: 300;
  background-color: #000000;
}

.overlay-bg {
  position: absolute;
  top: 0;
  left: 0;
  box-shadow: inset 0px 0px 23px -6px rgba(0, 0, 0, 0.3);
}

.paddedBox {
  padding: 50px 0;
  min-height: 400px;
}

.row {
  margin-left: 0px;
  margin-right: 0px;
}

.parallax-section {
  background-position: 50% 0;
  background-repeat: no-repeat;
  background-attachment: fixed;
  width: 100%;
  min-height: 400px;
  position: relative;
  background-size: cover;
}

/*========= Typography section =========*/
heading, h5, h4, h3, h2, h1 {
  font-family: Roboto;
  font-weight: 300;
  margin-top: 0px;
  margin-bottom: 5px;
  text-transform: uppercase;
  color: #333;
}

h1 {
  font-size: 50px;
  font-weight: 100 !important;
}

h2 {
  font-size: 34px;
}

h3 {
  font-size: 20px !important;
}

h4 {
  font-size: 20px;
}

h5 {
  font-size: 16px;
}

p {
  margin: 0;
  font-size: 16px !important;
  font-family: Roboto;
}

a {
  text-decoration: none;
  -webkit-transition: all 300ms ease-in-out;
  -moz-transition: all 300ms ease-in-out;
  -ms-transition: all 300ms ease-in-out;
  -o-transition: all 300ms ease-in-out;
  transition: all 300ms ease-in-out;
}
a:focus, a:hover, a:active {
  text-decoration: none;
  outline: none;
  cursor: pointer;
}

.stylisedFont {
  font-family: Roboto;
}

.bold {
  font-weight: 800;
}

.leftAlign {
  text-align: left;
}

.inline {
  display: inline-block;
}

ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.form-control {
  font-size: 14px;
  margin-bottom: 15px;
}

label {
  line-height: 1;
  padding: 0;
  text-align: left;
  margin-top: 18px;
  font-size: 14px;
  font-weight: 200;
  font-family: Roboto;
}

.form-group {
  margin-top: 10px;
  margin-bottom: 10px;
}

/*========= Button section =========*/
.btn {
  border-radius: 0px !important;
}

.btn-secondary {
  border-color: #666666 !important;
  color: #666666 !important;
}

.btn-secondary a, .btn-secondary .caret {
  color: #666666 !important;
  border-top-color: #666666 !important;
}

.btn-secondary .caret {
  border-top-color: #666666 !important;
}

.radio.checked {
  color: #333333;
}

/*======== Navigation section ========*/
#nav-container {
  width: 90%;
  margin: 0 auto;
}

.navbar .navbar-nav > li > a {
  margin: 10px 0px;
  padding: 21px 50px 0px 0px;
  text-transform: uppercase;
  font-weight: 500;
  color: #FFFFFF;
}

.navbar .navbar-nav > li > a.btn-round {
  margin: 20px 0px;
}

.navbar-transparent .navbar-nav > li > a.btn-default,
[class*=navbar-ct] .navbar-nav > li > a.btn-default {
  border: 2px solid #FFFFFF;
  font-weight: 500 !important;
  color: #FFFFFF;
}

body > .navbar-collapse .navbar-nav {
  background-color: #FFFFFF;
}

.navbar:not(.navbar-transparent).navbar-ct-red {
  background-color: #FFFFFF;
}

body > .navbar-collapse .navbar-nav > li > a {
  color: #000000;
  font-weight: 500;
}

body > .navbar-collapse .navbar-nav > li {
  border: none;
}

#transactionHistory, #ordering {
  display: table;
}

#transactionHistory .bootstrap-table {
  max-width: 80vw;
}

#transactionHistory .paddedBox, #ordering .paddedBox {
  display: table-cell;
  height: 100vh;
  vertical-align: middle;
  position: relative;
}

/*=========== Home section ===========*/
#logoIcon {
  background-image: url(/static/img/thumb_restaurant.png);
  height: 260px;
  width: 90vw;
  background-position: 50%;
  margin: 0 auto;
  background-repeat: no-repeat;
  background-size: contain;
}

#logoIconNav {
  background-image: url(/static/img/thumb_restaurant.png);
  height: 45px;
  width: 18vw;
  margin: 0 auto;
  margin-top: -10px;
  background-repeat: no-repeat;
  background-size: contain;
}

#home {
  background-image: url(/static/img/loyalty2.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
  height: 850px;
}

.home-content {
  position: absolute;
  left: 0;
  top: 35%;
  width: 100%;
}
.home-content .slider-logo {
  display: inline-block;
}

/*========== Your Points section ==========*/
/*==== Transaction history section =====*/
#transactionHistory {
  background-image: url(/static/img/loyalty3.jpg);
}

#transactionHistory .paddedBox, #ordering .paddedBox, #home .overlay-bg {
  background: rgba(0, 0, 0, 0.4);
}

#yourProfile .paddedBox {
  background: rgba(0, 0, 0, 0.4);
}

.table tr {
  text-align: left;
}

/*======= Store locator section ========*/
#stateList {
  height: 70px;
}

#stateList li {
  display: inline-block;
  list-style-type: none;
  width: 10%;
}

#storeLocator .bootstrap-table {
  margin-top: -10px;
  margin-bottom: 15px;
}

#storeLocator .fixed-table-container {
  height: 450px;
  overflow: scroll;
}

#storeLocator .search {
  float: none !important;
}

#tbl-store-locator td .value {
  font-family: Roboto;
  font-size: 14px;
}

.card-view:first-child {
  font-weight: bold;
  font-family: Roboto !important;
}

#map {
  height: 500px;
}

#modalOrder {
  margin-top: 20px;
}

/*========= Ordering section ===========*/
#ordering {
  background-image: url(/static/img/loyalty4.jpg);
  font-size: 18px;
}

#ordering-content {
  margin-top: 100px;
}
#ordering-content i {
  margin-right: 10px;
}
#ordering-content .btn-primary {
  padding: 13px 33px;
  margin-top: 35px;
}

#ordering-image {
  background-image: url(/static/img/orderingLogoIcon.png);
  height: 135px;
  width: 100px;
  background-size: cover;
  background-repeat: no-repeat;
}

/*======= Card transfer section ========*/
#cardTransferText {
  margin-top: 30px;
}

#cardTransferForm {
  margin-top: 30px;
}

/*========= My profile section =========*/
#yourProfile {
  background-image: url(/static/img/loyalty5.jpg);
}

.label-help {
  margin-top: 18px;
  float: left;
}

/*============ Footer section ============*/
footer {
  border-top: 1px solid #ededed;
  padding: 24px 0;
}

#login-footer {
  background-color: rgba(0, 0, 0, 0);
  border: none;
}

footer a {
  color: #333;
  font-weight: bold;
}

footer a:hover {
  color: #E61A1A;
}

footer ul {
  margin: 0;
  padding: 0;
  list-style: none;
  display: inline-table;
}

footer ul li {
  float: left;
}

footer ul li a {
  display: block;
  text-align: center;
  padding: 10px 20px 0px 20px;
  font-size: 12px;
  font-weight: 300;
  color: #333;
  font-family: Roboto;
}

footer ul li a:hover {
  color: #333;
}

/*============ Other section ============*/
@keyframes fadein {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.fa-2x {
  width: 40px;
}

/* ========= Bootstrap DatePicker section =======*/
.bootstrap-datetimepicker-widget table td > div, .bootstrap-datetimepicker-widget table th > div, .bootstrap-datetimepicker-widget table th, .bootstrap-datetimepicker-widget table td span {
  -webkit-transition: all 150ms linear;
  -moz-transition: all 150ms linear;
  -o-transition: all 150ms linear;
  -ms-transition: all 150ms linear;
  transition: all 150ms linear;
}

.sr-only, .bootstrap-datetimepicker-widget .btn[data-action=incrementHours]::after, .bootstrap-datetimepicker-widget .btn[data-action=incrementMinutes]::after, .bootstrap-datetimepicker-widget .btn[data-action=decrementHours]::after, .bootstrap-datetimepicker-widget .btn[data-action=decrementMinutes]::after, .bootstrap-datetimepicker-widget .btn[data-action=showHours]::after, .bootstrap-datetimepicker-widget .btn[data-action=showMinutes]::after, .bootstrap-datetimepicker-widget .btn[data-action=togglePeriod]::after, .bootstrap-datetimepicker-widget .btn[data-action=clear]::after, .bootstrap-datetimepicker-widget .btn[data-action=today]::after, .bootstrap-datetimepicker-widget .picker-switch::after, .bootstrap-datetimepicker-widget table th.prev::after, .bootstrap-datetimepicker-widget table th.next::after {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

.bootstrap-datetimepicker-widget {
  list-style: none;
}

.bootstrap-datetimepicker-widget.dropdown-menu {
  padding: 4px;
  width: 19em;
}

@media (min-width: 768px) {
  .bootstrap-datetimepicker-widget.dropdown-menu.timepicker-sbs {
    width: 38em;
  }
}
@media (min-width: 992px) {
  .bootstrap-datetimepicker-widget.dropdown-menu.timepicker-sbs {
    width: 38em;
  }
}
@media (min-width: 1200px) {
  .bootstrap-datetimepicker-widget.dropdown-menu.timepicker-sbs {
    width: 38em;
  }
}
.bootstrap-datetimepicker-widget.dropdown-menu.bottom:before {
  border-bottom: 11px solid rgba(0, 0, 0, 0.2);
  border-left: 11px solid transparent;
  border-right: 11px solid transparent;
  content: "";
  display: inline-block;
  position: absolute;
  left: 12px;
  top: -11px;
}

.bootstrap-datetimepicker-widget.dropdown-menu.bottom:after {
  border-left: 11px solid transparent;
  border-right: 11px solid transparent;
  content: "";
  display: inline-block;
  position: absolute;
  left: 12px;
  top: -10px;
}

.bootstrap-datetimepicker-widget.dropdown-menu.top {
  margin-top: auto;
  margin-bottom: -20px;
}

.bootstrap-datetimepicker-widget.dropdown-menu.top.open {
  margin-top: auto;
  margin-bottom: 5px;
}

.bootstrap-datetimepicker-widget.dropdown-menu.top:before {
  border-top: 11px solid rgba(0, 0, 0, 0.2);
  border-left: 11px solid transparent;
  border-right: 11px solid transparent;
  border-bottom: none;
  content: "";
  display: inline-block;
  position: absolute;
  left: 12px;
  bottom: -11px;
  top: auto;
}

.bootstrap-datetimepicker-widget.dropdown-menu.top:after {
  border-left: 11px solid transparent;
  border-right: 11px solid transparent;
  border-bottom: none;
  content: "";
  display: inline-block;
  position: absolute;
  left: 12px;
  bottom: -10px;
  top: auto;
}

.bootstrap-datetimepicker-widget.dropdown-menu.pull-right:before {
  left: auto;
  right: 6px;
}

.bootstrap-datetimepicker-widget.dropdown-menu.pull-right:after {
  left: auto;
  right: 7px;
}

.bootstrap-datetimepicker-widget .list-unstyled {
  margin: 0;
}

.bootstrap-datetimepicker-widget a[data-action] {
  padding: 6px 0;
  border-width: 0;
}

.bootstrap-datetimepicker-widget a[data-action]:active {
  box-shadow: none;
}

.bootstrap-datetimepicker-widget .timepicker-hour, .bootstrap-datetimepicker-widget .timepicker-minute, .bootstrap-datetimepicker-widget .timepicker-second {
  width: 56px;
  height: 56px;
  font-weight: 300;
  font-size: 22px;
  margin: 3px;
  border-radius: 50%;
}

.bootstrap-datetimepicker-widget button[data-action] {
  padding: 6px;
}

.bootstrap-datetimepicker-widget .btn[data-action=incrementHours]::after {
  content: "Increment Hours";
}

.bootstrap-datetimepicker-widget .btn[data-action=incrementMinutes]::after {
  content: "Increment Minutes";
}

.bootstrap-datetimepicker-widget .btn[data-action=decrementHours]::after {
  content: "Decrement Hours";
}

.bootstrap-datetimepicker-widget .btn[data-action=decrementMinutes]::after {
  content: "Decrement Minutes";
}

.bootstrap-datetimepicker-widget .btn[data-action=showHours]::after {
  content: "Show Hours";
}

.bootstrap-datetimepicker-widget .btn[data-action=showMinutes]::after {
  content: "Show Minutes";
}

.bootstrap-datetimepicker-widget .btn[data-action=togglePeriod]::after {
  content: "Toggle AM/PM";
}

.bootstrap-datetimepicker-widget .btn[data-action=clear]::after {
  content: "Clear the picker";
}

.bootstrap-datetimepicker-widget .btn[data-action=today]::after {
  content: "Set the date to today";
}

.bootstrap-datetimepicker-widget .picker-switch {
  text-align: center;
  border-radius: 4px;
}

.bootstrap-datetimepicker-widget .picker-switch::after {
  content: "Toggle Date and Time Screens";
}

.bootstrap-datetimepicker-widget .picker-switch td {
  padding: 0;
  margin: 0;
  height: auto;
  width: auto;
  line-height: inherit;
}

.bootstrap-datetimepicker-widget .picker-switch td span {
  line-height: 2.5;
  height: 2.5em;
  width: 100%;
  border-radius: 4px;
  margin: 2px 0px !important;
}

.bootstrap-datetimepicker-widget table {
  width: 100%;
  margin: 0;
}

.bootstrap-datetimepicker-widget table td > div, .bootstrap-datetimepicker-widget table th > div {
  text-align: center;
}

.bootstrap-datetimepicker-widget table th {
  height: 20px;
  line-height: 20px;
  width: 20px;
}

.bootstrap-datetimepicker-widget table th.picker-switch {
  width: 145px;
}

.bootstrap-datetimepicker-widget table th.disabled, .bootstrap-datetimepicker-widget table th.disabled:hover {
  background: none;
  color: #DDDDDD;
  cursor: not-allowed;
}

.bootstrap-datetimepicker-widget table th.prev span, .bootstrap-datetimepicker-widget table th.next span {
  border-radius: 4px;
  height: 27px;
  width: 27px;
  line-height: 28px;
  font-size: 12px;
  border-radius: 50%;
  text-align: center;
}

.bootstrap-datetimepicker-widget table th.prev::after {
  content: "Previous Month";
}

.bootstrap-datetimepicker-widget table th.next::after {
  content: "Next Month";
}

.bootstrap-datetimepicker-widget table th.dow {
  text-align: center;
  border-bottom: 1px solid #E3E3E3;
  font-size: 12px;
  text-transform: uppercase;
  color: #9A9A9A;
  font-weight: 400;
  padding-bottom: 5px;
  padding-top: 10px;
}

.bootstrap-datetimepicker-widget table thead tr:first-child th {
  cursor: pointer;
}

.bootstrap-datetimepicker-widget table thead tr:first-child th:hover span, .bootstrap-datetimepicker-widget table thead tr:first-child th.picker-switch:hover {
  background: #E3E3E3;
}

.bootstrap-datetimepicker-widget table td > div {
  border-radius: 4px;
  height: 54px;
  line-height: 54px;
  width: 54px;
  text-align: center;
}

.bootstrap-datetimepicker-widget table td.cw > div {
  font-size: 0.8em;
  height: 20px;
  line-height: 20px;
  color: #DDDDDD;
}

.bootstrap-datetimepicker-widget table td.day > div {
  height: 30px;
  line-height: 30px;
  width: 30px;
  text-align: center;
  padding: 0px;
  border-radius: 50%;
}

.bootstrap-datetimepicker-widget table td.minute > div, .bootstrap-datetimepicker-widget table td.hour > div {
  border-radius: 50%;
}

.bootstrap-datetimepicker-widget table td.day:hover > div, .bootstrap-datetimepicker-widget table td.hour:hover > div, .bootstrap-datetimepicker-widget table td.minute:hover > div, .bootstrap-datetimepicker-widget table td.second:hover > div {
  background: #E3E3E3;
  cursor: pointer;
}

.bootstrap-datetimepicker-widget table td.old > div, .bootstrap-datetimepicker-widget table td.new > div {
  color: #DDDDDD;
}

.bootstrap-datetimepicker-widget table td.today > div {
  position: relative;
}

.bootstrap-datetimepicker-widget table td.today > div:before {
  content: "";
  display: inline-block;
  border: none;
  border-top-color: rgba(0, 0, 0, 0.2);
  position: absolute;
  bottom: 4px;
  right: 4px;
}

.bootstrap-datetimepicker-widget table td.active.today:before > div {
  border-bottom-color: #fff;
}

.bootstrap-datetimepicker-widget table td.disabled > div, .bootstrap-datetimepicker-widget table td.disabled:hover > div {
  background: none;
  color: #DDDDDD;
  cursor: not-allowed;
}

.bootstrap-datetimepicker-widget table td span {
  display: inline-block;
  width: 56px;
  height: 56px;
  line-height: 56px;
  margin: 3px 3px;
  cursor: pointer;
  border-radius: 50%;
  text-align: center;
}

.bootstrap-datetimepicker-widget table td span:hover {
  background: #E3E3E3;
}

.bootstrap-datetimepicker-widget table td span.old {
  color: #DDDDDD;
}

.bootstrap-datetimepicker-widget table td span.disabled, .bootstrap-datetimepicker-widget table td span.disabled:hover {
  background: none;
  color: #DDDDDD;
  cursor: not-allowed;
}

.bootstrap-datetimepicker-widget .timepicker-picker span,
.bootstrap-datetimepicker-widget .timepicker-hours span,
.bootstrap-datetimepicker-widget .timepicker-minutes span {
  border-radius: 50% !important;
}

.bootstrap-datetimepicker-widget.usetwentyfour td.hour {
  height: 27px;
  line-height: 27px;
}

.bootstrap-datetimepicker-widget table td {
  border-top: 0px !important;
}

.bootstrap-datetimepicker-widget .decade {
  width: 100px;
}

.bootstrap-select, .dropdown-toggle {
  width: 100% !important;
}

/*============ jQueryValidate  section ============*/
.alert span[data-notify=icon] {
  font-size: 30px;
  display: block;
  left: 15px;
  position: absolute;
  top: 50%;
  margin-top: -15px;
}
.alert button.close {
  position: absolute;
  right: 10px;
  top: 50%;
  margin-top: -14px;
  z-index: 1033;
  display: block;
  border-radius: 50%;
  opacity: 0.4;
  width: 28px;
  height: 28px;
  outline: 0 !important;
  text-align: center;
  padding: 0 3px 3px 3px !important;
  font-size: 21px !important;
  line-height: 21px !important;
  font-weight: 300;
}
.alert button.close:hover {
  opacity: 0.55;
}

/*========== Notifications  section ==========*/
.alert[data-notify=container] {
  padding: 10px 10px 10px 20px;
  border-radius: 4px;
}

.alert:not([data-notify]) {
  position: fixed;
  width: 100%;
  text-align: center;
  left: 0;
  right: 0;
  z-index: 100;
}

/*============ Login Page ============*/
#loginLogo {
  background-image: url(/static/img/thumb_restaurant.png);
  height: 100px;
  width: 15vw;
  background-position: 50%;
  margin: 0 auto;
  background-repeat: no-repeat;
  background-size: contain;
}

#login-body {
  position: absolute;
  height: 100%;
  background-color: #000000;
  width: 100%;
  background-image: linear-gradient(rgba(0, 0, 0, 0) 85%, rgb(0, 0, 0)), url(/static/img/loyalty1.jpg);
  background-repeat: no-repeat;
  background-size: cover;
}

.login-container {
  padding-top: 100px;
}

.login-header {
  text-align: center;
  margin-top: 0px;
}

.login-card {
  min-height: 460px;
  padding: 40px;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  animation: fadein 1.5s;
  width: 100%;
  border-radius: 0;
}
.login-card .tab-content {
  min-height: 340px;
  padding: 20px 10px;
}
.login-card .disabled {
  display: none;
}
.login-card .info-text {
  text-align: center;
  font-weight: 300;
  margin: 10px 0 30px;
}
.login-card .description {
  font-size: 14px;
}
.login-card .nav-pills > li {
  text-align: center;
}
.login-card .nav-pills > li a {
  border: 0 !important;
  text-transform: uppercase;
  font-size: 12px;
}
.login-card .nav-pills > li > a:hover {
  cursor: default;
}
.login-card .nav-pills > li > a:focus {
  cursor: default;
}
.login-card .nav-pills > li:first-child > a {
  border-radius: 0;
  margin: 0;
}
.login-card .nav-pills > li:last-child > a {
  border-radius: 0;
}

#email-username-label::before {
  content: "Email Address";
}

.btn-group .btn + .btn, .btn-group .btn + .btn-group, .btn-group .btn-group + .btn, .btn-group .btn-group + .btn-group {
  margin-left: -2px;
}

.btn-primary.disabled, .btn-primary.disabled:hover, .btn-primary.disabled:focus, .btn-primary.disabled.focus, .btn-primary.disabled:active, .btn-primary.disabled.active, .btn-primary:disabled, .btn-primary:disabled:hover, .btn-primary:disabled:focus, .btn-primary:disabled.focus, .btn-primary:disabled:active, .btn-primary:disabled.active, .btn-primary[disabled], .btn-primary[disabled]:hover, .btn-primary[disabled]:focus, .btn-primary[disabled].focus, .btn-primary[disabled]:active, .btn-primary[disabled].active, fieldset[disabled] .btn-primary, fieldset[disabled] .btn-primary:hover, fieldset[disabled] .btn-primary:focus, fieldset[disabled] .btn-primary.focus, fieldset[disabled] .btn-primary:active, fieldset[disabled] .btn-primary.active {
  background-color: transparent;
  border-color: #E61A1A;
}

.timezone-picker {
  display: block !important;
}

.timezone-picker-selected .timezone-picker-textfield input {
  font-weight: 300 !important;
  font-family: Roboto !important;
}

#marker-colour-hack {
  width: 0;
  height: 0;
  display: none;
}

#preamble-text-div {
  padding-top: 20px;
}

#preamble-gccheck-div {
  display: none;
  padding-top: 50px;
  padding-bottom: 20px;
}

#gccheck-div {
  display: none;
}

#preamble-gccheck-text {
  text-align: center;
}

#gccheck-balance-text {
  padding-top: 40px;
  text-align: center;
}