/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/*
    Created on : 20. 4. 2020, 23:20:50
    Author     : metud
*/

@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Open+Sans:ital,wght@0,300;0,400;0,600;0,700;0,800;1,300;1,400;1,600;1,700;1,800&display=swap');

body {
    background: url('../img/bg.jpg');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    background-attachment: fixed;
    font-family: 'Open Sans', Helvetica, Arial sans-serif;
}

.btn:focus {
    outline: 0;
    box-shadow: 0 0 0 0.05rem rgba(0,123,255,.35) !important;
}

.form-header {
    background: #fc0;
    padding: 10px 20px;
}

h1 {
    font-family: 'Montserrat', Helvetica, Arial sans-serif;
    font-size: 24px;
    font-weight: 600;
    margin-bottom: 0px !important;
    color: #494949;
}

h1 img {
    max-height: 170px;
}

.card.cardcontent{
    border-color:#fc0;
}

.heading {
    font-family: 'Montserrat', Helvetica, Arial sans-serif;
    font-size: 14px;
    font-weight: 400;
    margin-bottom: 0 !important;
    text-transform: uppercase;
    text-align:right;
}

.heading img {
    max-height: 26px;
}

#sleviciOrder .form-control {
    display: block;
    width: 100%;
    height: calc(3.5em + .75rem + 2px);
    padding: .375rem .75rem;
    padding-left: 70px;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5;
    color: #000;
    background-color: rgba(204, 204, 204, .3);
    background-clip: padding-box;
    border: 1px solid #d5d5d5;
    border-radius: .15rem;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

#sleviciOrder .form-control:focus {
    outline: 0;
    box-shadow: 0 0 0 2px #0D98FF;
}

.bs-searchbox .form-control {
    margin-bottom: 0;
    width: 100%;
    float: none;
    height: calc(1.8em + .75rem + 2px) !important;
    padding-left: 10px !important;
}

.bs-searchbox .form-control:focus {
    outline: 0;
    box-shadow: 0 0 0 2px #0D98FF;
}

#sleviciOrder .bootstrap-select {
    display: block;
    width: 100%;
}

#sleviciOrder .btn-light {
    color: #000;
    background-color: rgba(204, 204, 204, .3);
    border: 1px solid #d5d5d5;
    height: calc(3.5em + .75rem + 2px);
    padding: .375rem .75rem;
    padding-left: 70px;
}

.bootstrap-select .dropdown-toggle:focus, .bootstrap-select>select.mobile-device:focus+.dropdown-toggle {
    outline: none !important;
    outline-offset: 0;
}

.btn-light:not(:disabled):not(.disabled).active:focus, .btn-light:not(:disabled):not(.disabled):active:focus, .show>.btn-light.dropdown-toggle:focus {
    box-shadow: 0 0 0 2px #0D98FF;
}

.btn-light:focus {
    box-shadow: 0 0 0 2px #0D98FF;
}
.btn:focus {
    outline: 0;
    box-shadow: 0 0 0 2px #0D98FF;
}

.form-control-label {
    font-family: 'Montserrat', Helvetica, Arial sans-serif;
    font-weight: 600;
    margin-bottom: 3px;
}

.datepick {cursor: pointer;}
.datepick::-webkit-input-placeholder {
  color: #000;
}

.datepick:-ms-input-placeholder {
  color: #000;
}

.datepick::placeholder {
  color: #000;
}

.input-group-addon {
    position: absolute;
    right: 13px;
    top: 32px;
    display: inline-block;
    margin-left: .255em;
    vertical-align: .255em;
    content: "";
    border-top: .3em solid;
    border-right: .3em solid transparent;
    border-bottom: 0;
    border-left: .3em solid transparent;
}

#sleviciOrder .inner-addon {
    position: relative;
}
#sleviciOrder .inner-addon i {
  position: absolute;
  padding: 20px;
  pointer-events: none;
  color: #fc0;
  font-size: 30px;
}
#sleviciOrder .left-addon i  {left:  0px;}
#sleviciOrder .right-addon i {right: 0px;}

#sleviciPersonal .inner-addon {
    position: relative;
}
#sleviciPersonal .inner-addon i {
  position: absolute;
  padding: 12px;
  pointer-events: none;
  color: #ccc;
  font-size: 22px;
}
#sleviciPersonal .left-addon i  {left:  5px;}
#sleviciPersonal .right-addon i {right: 0px;}

.foodtable {}
.foodtable td .foodtable-price{
    padding:10px 0px;
}

.foodtable-price-vyberte{

}

.foodtable .food-order {
    color: #aaa;
}
.food-order::after {
    margin-left: 5px;
    margin-right: 3px;
}

.foodtable-soup td {
    color: #666;
    border-bottom: 1px solid #eaeaea;
}
.foodtable td, .foodtable th {
    padding: .5rem;
    vertical-align: top;
    border-top: 0;
    font-size: 15px;
}

/* jidlo pridavani */
.foodtable-price {
    color: #666;
    text-align: right;
}
.food-times {
    color: #aaa;
}
.food-times::after {
    margin-left: 5px;
    margin-right: 3px;
    content: "\00d7";
}
.food-del, .food-add, .food-accessories {
    padding: 4px 8px;
    font-size: 12px;
    box-shadow: 0 0 5px 0 rgba(0, 0, 0, .25);
}
.food-del:hover, .food-add:hover, .food-accessories:hover {
    box-shadow: 0 0 5px 0 rgba(0, 0, 0, .4);
}
.foodtable-price .food-del {
    margin-right: 7px;
    color: red;
}
.foodtable-price .food-accessories {
    margin-right: 7px;
    color: red;
}
.foodtable-price .food-add {
    margin-left: 7px;
    color: green;
}

/* /jidlo pridavani */

.foodtable-add {
    text-align: right;
}
.foodtable-add a {
    color: #555;
    transition: .75s all;
}
.foodtable-add a:hover i {
    color: #e7b900;
    transform: rotate(90deg);
    transition: .75s all;
}

.summarytable {}
.summarytable td, .summarytable th {
    padding: .5rem;
    vertical-align: top;
    border-top: 0;
    font-size: 15px;
}
.foodtable-summary-price, .foodtable-summary-totalprice {
    text-align: right;
    font-size: 18px !important;
}

.foodtable-summary-balne{
    text-align: right;
}

.foodtable-summary-pieces {
    text-align: center;
}
.summary-total {
    font-weight: 800;
    /*border-top:1px solid #eee;*/
    background-color:#fff !important;
}

#sleviciSummary {
}

#sleviciSummary td {
    color: #666;
}

.btn-order {
    font-family: 'Montserrat', Helvetica, Arial sans-serif;
    background: rgb(255,204,0);
    background: linear-gradient(45deg, rgba(255,204,0,1) 0%, rgba(255,208,20,1) 100%);
    padding: 20px;
    border: 0;
    border-radius: 4px;
    text-transform: uppercase;
    color: #232323;
    font-weight: 800;
    font-size: 17px;
}
.btn-order:hover {
    background: linear-gradient(-45deg, rgba(255,204,0,1) 0%, rgba(255,208,20,1) 100%);
}
.btn-order:focus {
    outline: none;
    box-shadow: 0 0 0 1px rgba(13, 152, 255, .25);
}
.btn-order i {
    margin-left: 5px;
    font-size: 14px;
    transition: .75s all;
}
.btn-order:hover i {
    transform: rotate(360deg);
    transition: .75s all;
}

.order-spacer {
    background: #0D98FF;
}

#sleviciPersonal {
    margin: 0 0 15px;
    border-radius: 4px;
    padding: 20px;
    background: rgba(255, 204, 0, 0.25);
}

#sleviciPersonal .form-control {
    display: block;
    width: 100%;
    height: calc(2em + .75rem + 2px);
    padding: .375rem .75rem;
    padding-left: 55px;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5;
    color: #000;
    background-color: rgba(255, 255, 255, .823);
    background-clip: padding-box;
    border: 1px solid #d5d5d5;
    border-radius: .15rem;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

#sleviciPersonal .form-control:focus {
    color: #495057;
    background-color: #fff;
    border-color: #FFD119;
    outline: 0;
    box-shadow: 0 0 0 0.05rem rgba(0,123,255,.35);
}

.form-check {
    position: relative;
    display: block;
    padding-left: 5px;
}
.form-check label {
    display: inline-block;
    margin-bottom: 0;
}
.form-check label a {
    border-bottom: 1px solid #ccc;
    transition: .5s all;
}
.form-check label a:hover {
    text-decoration: none;
    color: #666;
    border-bottom: 1px solid #fff;
    transition: .5s all;
}

/* Base for label styling */
[type="checkbox"]:not(:checked),
[type="checkbox"]:checked {
  position: absolute;
  left: -9999px;
}
[type="checkbox"]:not(:checked) + label,
[type="checkbox"]:checked + label {
  position: relative;
  padding-left: 1.95em;
  cursor: pointer;
}

/* checkbox aspect */
[type="checkbox"]:not(:checked) + label:before,
[type="checkbox"]:checked + label:before {
  content: '';
  position: absolute;
  left: 0;
  top: 2px;
  width: 1.25em; height: 1.25em;
  border: 2px solid #ccc;
  background: #fff;
  border-radius: 4px;
  box-shadow: inset 0 1px 3px rgba(0,0,0,.1);
}
/* checked mark aspect */
[type="checkbox"]:not(:checked) + label:after,
[type="checkbox"]:checked + label:after {
  content: '\2713\0020';
  position: absolute;
  top: .15em; left: .22em;
  font-size: 1.3em;
  line-height: 0.8;
  font-weight: 600;
  color: #43cc00;
  transition: all .2s;
  font-family: 'Open Sans', 'Helvetica', Arial;
}
/* checked mark aspect changes */
[type="checkbox"]:not(:checked) + label:after {
  opacity: 0;
  transform: scale(0);
}
[type="checkbox"]:checked + label:after {
  opacity: 1;
  transform: scale(1);
}
/* disabled checkbox */
[type="checkbox"]:disabled:not(:checked) + label:before,
[type="checkbox"]:disabled:checked + label:before {
  box-shadow: none;
  border-color: #e2e2e2;
  background-color: #ddd;
}
[type="checkbox"]:disabled:checked + label:after {
  color: #999;
}
[type="checkbox"]:disabled + label {
  color: #aaa;
}
/* accessibility */
[type="checkbox"]:checked:focus + label:before,
[type="checkbox"]:not(:checked):focus + label:before {
  border: 2px solid #e2e2e2;
}

/* hover style just for information */
label:hover:before {
  border: 2px solid #fc0!important;
}

/* ------ SLEVICI CAS ------ */
.deliverytime-button {
    color: #000;
    background-color: rgba(204, 204, 204, .3);
    border: 1px solid #d5d5d5;
    height: calc(3.5em + .75rem + 2px);
    cursor: pointer;
    width: 100%;
    padding: .375rem 0;
    text-align: left;
    border-radius: .15rem;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}
.deliverytime-button:focus {
    box-shadow: 0 0 0 2px #0D98FF;
}
.btn-time-addon {
    position: absolute;
    right: 13px;
    top: 8px;
    display: inline-block;
    margin-left: .255em;
    vertical-align: .255em;
    content: "";
    border-top: .3em solid;
    border-right: .3em solid transparent;
    border-bottom: 0;
    border-left: .3em solid transparent;
}
.deliverytime-button i {
    top: -23px;
    left: -15px;
}
.delivery-btn-time {
    width: 100%;
    padding-left: 70px;
}

.delivery-time-dropdown {
    padding: 15px 0;
}
.delivery-time-label {
    font-family: 'Montserrat', Helvetica, Arial sans-serif;
    display: inline-block;
    padding: .75em 1.5em;
    /*height: 50px;*/
    width: 85px;
    text-align: center;
    margin: 0.2em;
    cursor: pointer;
    color: #000;
    border-radius: 0.25em;
    background: #ccc;
    box-shadow: 0 3px 10px rgba(0,0,0,0.2), inset 0 -3px 0 rgba(0,0,0,0.22);
    transition: 0.3s;
    user-select: none;
    font-size: 14px;
    font-weight: 600;
}
.delivery-time-label:checked + .delivery-time-label {
    background: #fc0;
    color: #000;
}
.delivery-time-hidden {
    display: none;
}
.delivery-time-label-disabled {
    color: #aaa;
    background: #ebebeb;
    box-shadow: 0 3px 10px rgba(0,0,0,0.07), inset 0 -3px 0 rgba(0,0,0,0.07);
    pointer-events: none;
}


/* ------ //SLEVICI CAS ------ */

/* GDPR modal */
.gdpr-modal-lg {}
.gdpr-modal-lg .modal-content {
}
.gdpr-modal-lg .modal-header {
    padding: 20px 20px 10px;
    background: #FEFF0D;
}
.gdpr-modal-lg h3 {
    font-family: 'Montserrat', Helvetica, Arial sans-serif;
    font-weight: 600;
}
.gdpr-modal-lg .modal-body {
    font-size: 15px;
}

/* /GDPR modal */


@media only screen and (max-width: 767px) {
  h1 {
    text-align: center;
  }
}

/* 22.04.2020 2:30 update */

.btn-choice {
    color: #fff;
    border: #126EB3;
    background: #126EB3;
    font-weight: 600;
    text-transform: uppercase;
    transition: .5s all;
}
.btn-choice:hover {
    border: #e8ba00;
    background: #fc0;
    color: #000;
    transition: .5s all;
}

#footer {
    margin-top: -10px;
    padding: 20px;
    background: #dddddd;
    border-bottom-left-radius: .25rem;
    border-bottom-right-radius: .25rem;
}

.copyright {
    font-family: 'Montserrat', Helvetica, Arial sans-serif;
    font-weight: 400;
    font-size: 14px;
}

/* 23.04.2020 0:25 update */

.datepicker-dropdown {
    margin-top: 67px;
    min-width: 240px !important;
    font-family: 'Montserrat', Helvetica, Arial sans-serif;
}
.datepicker td, .datepicker th {
    text-align: center;
    width: 40px;
    height: 40px;
}
.datepicker-switch {
    color: #126EB3;
}

.datepicker table tr td.today, .datepicker table tr td.today.disabled, .datepicker table tr td.today.disabled:hover, .datepicker table tr td.today:hover {
    background-color: #ccc;
    background-image: none;
    color: #000;
}

.datepicker table tr td.active.active, .datepicker table tr td.active.disabled, .datepicker table tr td.active.disabled.active, .datepicker table tr td.active.disabled.disabled, .datepicker table tr td.active.disabled:active, .datepicker table tr td.active.disabled:hover, .datepicker table tr td.active.disabled:hover.active, .datepicker table tr td.active.disabled:hover.disabled, .datepicker table tr td.active.disabled:hover:active, .datepicker table tr td.active.disabled:hover:hover, .datepicker table tr td.active.disabled:hover[disabled], .datepicker table tr td.active.disabled[disabled], .datepicker table tr td.active:active, .datepicker table tr td.active:hover, .datepicker table tr td.active:hover.active, .datepicker table tr td.active:hover.disabled, .datepicker table tr td.active:hover:active, .datepicker table tr td.active:hover:hover, .datepicker table tr td.active:hover[disabled], .datepicker table tr td.active[disabled] {
    background-color: #fc0;
}
.datepicker table tr td.active, .datepicker table tr td.active.disabled, .datepicker table tr td.active.disabled:hover, .datepicker table tr td.active:hover {
    background-color: #fc0;
    background-image: none;
    color: #000;
}

.datepicker table tr td.today.active, .datepicker table tr td.today.disabled, .datepicker table tr td.today.disabled.active, .datepicker table tr td.today.disabled.disabled, .datepicker table tr td.today.disabled:active, .datepicker table tr td.today.disabled:hover, .datepicker table tr td.today.disabled:hover.active, .datepicker table tr td.today.disabled:hover.disabled, .datepicker table tr td.today.disabled:hover:active, .datepicker table tr td.today.disabled:hover:hover, .datepicker table tr td.today.disabled:hover[disabled], .datepicker table tr td.today.disabled[disabled], .datepicker table tr td.today:active, .datepicker table tr td.today:hover, .datepicker table tr td.today:hover.active, .datepicker table tr td.today:hover.disabled, .datepicker table tr td.today:hover:active, .datepicker table tr td.today:hover:hover, .datepicker table tr td.today:hover[disabled], .datepicker table tr td.today[disabled] {
    background-color: #fc0;
}

.datepicker table tr td span.active.active, .datepicker table tr td span.active.disabled, .datepicker table tr td span.active.disabled.active, .datepicker table tr td span.active.disabled.disabled, .datepicker table tr td span.active.disabled:active, .datepicker table tr td span.active.disabled:hover, .datepicker table tr td span.active.disabled:hover.active, .datepicker table tr td span.active.disabled:hover.disabled, .datepicker table tr td span.active.disabled:hover:active, .datepicker table tr td span.active.disabled:hover:hover, .datepicker table tr td span.active.disabled:hover[disabled], .datepicker table tr td span.active.disabled[disabled], .datepicker table tr td span.active:active, .datepicker table tr td span.active:hover, .datepicker table tr td span.active:hover.active, .datepicker table tr td span.active:hover.disabled, .datepicker table tr td span.active:hover:active, .datepicker table tr td span.active:hover:hover, .datepicker table tr td span.active:hover[disabled], .datepicker table tr td span.active[disabled] {
    background-color: #fc0;
}

.datepicker table tr td span.active, .datepicker table tr td span.active.disabled, .datepicker table tr td span.active.disabled:hover, .datepicker table tr td span.active:hover {
    background-color: #fc0;
    background-image: none;
    color: #000;
}

.container {display:none;}
.preload {
    width:100px;
    height: 100px;
    position: fixed;
    top: 30%;
    left: 47%;
}

.loader {
  border: 16px solid #f3f3f3;
  border-radius: 50%;
  border-top: 16px solid #ffcd03;
  width: 120px;
  height: 120px;
  -webkit-animation: spin 2s linear infinite; /* Safari */
  animation: spin 2s linear infinite;
}

.modal-header {border-bottom:1px solid #eee;}
.modal-footer {border-top:none;}

.swap1{
    display:none;
}

.spinner {
  background-image: url("../img/input-spinner.gif") !important;
  background-repeat: no-repeat;
  background-position: center center;
}

.menudnesRestaurantFilter{
    background-color:transparent;
    color:#fff;
}
.menudnesRestaurantFilter option{
    background-color:#343a40;
    color:#fff;
}

.bootstrap-autocomplete.dropdown-menu{
    position:relative !important;
    top:0px !important;
    left:0px !important;
}

:disabled, .disabled {
    opacity:0.5;
}

.accessories-card{
    /*margin:5px 0px 10px 0px;*/
    padding:5px;
    /*border:1px solid #ccc;
    background-color:#eee;*/
    clear:both;
}

.form-control.address{
    padding-left:20px !important;
}

#addressBox,#placeBox,#courierBox {
    display:none;
}

.filter-option-inner-inner{
    padding-top: 13px;
}

/*
 * RESPO IMPORTANTS
 */
#sleviciOrder .dropdown-item{
    white-space: inherit !important;
}

.pwrd{
    margin-top:2px;
}

/* Safari */
@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

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

    .preload {
        top: 30%;
        left: 35%;
    }

    #footer .copyright,#footer .pwrd{
        font-size:12px;
    }

    #footer img {
        max-height:20px;
    }

    .delivery-time-label {
        width: 68px;
        /*height: 44px;*/
        font-size: 12px;
        /*margin: 0.12em;*/
        box-shadow: 0 3px 10px rgba(0,0,0,0.2), inset 0 -1px 0 rgba(0,0,0,0.22);
    }
}
@media screen and (max-width: 375px) {
    .delivery-time-label {
        width: 50px;
        /*height: 40px;*/
        font-size: 12px;
        margin: 0.2em 0.05em;
        padding: .55em 0;
        box-shadow: 0 3px 10px rgba(0,0,0,0.2), inset 0 -1px 0 rgba(0,0,0,0.22);
    }

    .datepicker-dropdown {
        min-width: 210px !important;
    }
    .datepicker td, .datepicker th {
        text-align: center;
        width: 35px;
        height: 35px;
    }

}