body,
html {
    font-family: 'Montserrat', sans-serif;
    background-color: #FFF;
    min-height: 100vh;
    font-size: 17px;
    color: #333;
}

body.location {
    background-image: url(../img/location-full.jpg);
    background-size: cover;
    background-position: center bottom;
}

.container {
    max-width: 1400px;
}

.mt-6 {
    margin-top: 2rem !important;
}

@media screen and (max-width: 991px) {
    .mobile-mt-3 {
        margin-top: 1rem !important;
    }
}

a {
    color: #b91e04;
    transition: all 0.2s;
}

a:hover {
    color: #333;
    transition: all 0.2s;
    text-decoration: none;
}

b, strong {
    font-weight: 500 !important;
}

.alert {
    font-size: .95rem;
}

.h1,
h1 {
    font-size: 1.9rem
}

.h2,
h2 {
    font-size: 1.6rem
}

.h3,
h3 {
    font-size: 1.4rem
}

.h4,
h4 {
    font-size: 1.2rem
}

.h5,
h5 {
    font-size: 1.1rem
}

.h6,
h6 {
    font-size: 1rem
}

label {
    font-size: 0.95rem;
    margin-bottom: .05rem;
}

.form-control:focus,
.custom-select:focus {
    color: #333;
    background-color: #fff;
    border-color: #ced4da;
    outline: 0;
    box-shadow: 0 0 0 .2rem rgba(0, 0, 0, .05);
}

.btn-primary {
    color: #fff;
    background-color: #b91e04;
    border-color: #b91e04;
    font-weight: 500;
}

.btn-primary:hover {
    color: #fff;
    background-color: rgba(185, 30, 4, .85);
    border-color: rgba(185, 30, 4, .85);
}

.btn-primary.focus,
.btn-primary:focus {
    color: #fff;
    background-color: rgba(185, 30, 4, .85);
    border-color: rgba(185, 30, 4, .85);
    box-shadow: 0 0 0 .2rem rgba(185, 30, 4, .25);
}

.btn-primary:not(:disabled):not(.disabled).active,
.btn-primary:not(:disabled):not(.disabled):active,
.show>.btn-primary.dropdown-toggle {
    color: #fff;
    background-color: rgba(185, 30, 4, .85);
    border-color: rgba(185, 30, 4, .85);
}

.btn-primary:not(:disabled):not(.disabled).active:focus,
.btn-primary:not(:disabled):not(.disabled):active:focus,
.show>.btn-primary.dropdown-toggle:focus {
    box-shadow: 0 0 0 .2rem rgba(185, 30, 4, .25);
}

.btn-pay {
    color: #FFF;
    background-color: #589215;
    border-color: #589215;
    font-weight: 500;
}

.btn-pay:hover {
    color: #fff;
    background-color: rgba(88, 146, 21, .85);
    border-color: rgba(88, 146, 21, .85);
}

.btn-pay.focus,
.btn-pay:focus {
    color: #fff;
    background-color: rgba(88, 146, 21, .85);
    border-color: rgba(88, 146, 21, .85);
    box-shadow: 0 0 0 .2rem rgba(88, 146, 21, .25);
}

.btn-pay:not(:disabled):not(.disabled).active,
.btn-pay:not(:disabled):not(.disabled):active,
.show>.btn-pay.dropdown-toggle {
    color: #fff;
    background-color: rgba(88, 146, 21, .85);
    border-color: rgba(88, 146, 21, .85);
}

.btn-pay:not(:disabled):not(.disabled).active:focus,
.btn-pay:not(:disabled):not(.disabled):active:focus,
.show>.btn-pay.dropdown-toggle:focus {
    box-shadow: 0 0 0 .2rem rgba(88, 146, 21, .25);
}

.btn-fb {
    color: #fff !important;
    background-color: #1877f2;
    border-color: #1877f2;
    font-weight: 400 !important;
}

.btn-fb:hover {
    color: #fff !important;
    background-color: rgba(24, 119, 242, .85);
    border-color: rgba(24, 119, 242, .85);
}

.btn-fb.focus,
.btn-fb:focus {
    color: #fff;
    background-color: rgba(24, 119, 242, .85);
    border-color: rgba(24, 119, 242, .85);
    box-shadow: 0 0 0 .2rem rgba(24, 119, 242, .25);
}

.btn-fb:not(:disabled):not(.disabled).active,
.btn-fb:not(:disabled):not(.disabled):active,
.show>.btn-fb.dropdown-toggle {
    color: #fff;
    background-color: rgba(24, 119, 242, .85);
    border-color: rgba(24, 119, 242, .85);
}

.btn-fb:not(:disabled):not(.disabled).active:focus,
.btn-fb:not(:disabled):not(.disabled):active:focus,
.show>.btn-fb.dropdown-toggle:focus {
    box-shadow: 0 0 0 .2rem rgba(24, 119, 242, .25);
}

.alert-light {
    border-color: #ced4da;
}

#header {
    background: #FFF;
    box-shadow: 0 5px 30px rgba(0, 0, 0, 0.1);
    position: fixed;
    width: 100%;
    z-index: 99;
}

.dropdown-item:focus,
.dropdown-item:hover {
    color: #333;
    text-decoration: none;
    background-color: #f8f9fa;
}

.navbar-expand-xl .navbar-nav .nav-link {
    padding-top: .35rem;
    padding-bottom: .35rem;
}

.navbar-expand-xl .navbar-nav .nav-link {
    text-align: center;
}

.navbar-expand-xl .navbar-nav .nav-link {
    margin-right: .25rem;
    margin-left: .25rem;
}

.navbar-light .navbar-nav .nav-link {
    color: #333;
    transition: all 0.2s;
}

.navbar-light .navbar-nav .nav-btn a {
    font-weight: 500;
    color: #b91e04;
    transition: all 0.2s;
}

.navbar-light .navbar-nav .nav-btn.nav-btn-primary {
    border: 1px solid #b91e04;
    background-color: #b91e04;
    border-radius: 2rem;
    transition: all 0.2s;
}

.navbar-light .navbar-nav .nav-btn.nav-btn-primary>a {
    color: #FFF;
    transition: all 0.2s;
}

.navbar-light .navbar-nav .nav-btn.nav-btn-primary>a i {
    font-size: .95rem;
}

.navbar-light .navbar-nav .nav-btn.nav-btn-primary:hover,
.navbar-light .navbar-nav .nav-btn.nav-btn-primary:focus {
    border: 1px solid #b91e04;
    background-color: #FFF;
    border-radius: 2rem;
    transition: all 0.2s;
}

.navbar-light .navbar-nav .nav-btn.nav-btn-primary:hover a,
.navbar-light .navbar-nav .nav-btn.nav-btn-primary:focus a {
    color: #b91e04;
    transition: all 0.2s;
}

@media screen and (max-width: 1199px) {
    .navbar-light .navbar-nav li {
        margin: 0.3rem 0;
    }
    .navbar-light .navbar-toggler {
        color: #333;
        border-color: transparent;
        font-size: 1.5rem;
        cursor: pointer;
    }
}

#location-select {
    background-image: url(../img/location-overlay.png);
    background-position: left top;
    background-repeat: repeat;
    background-size: auto;
}

#location-select .location-select-box {
    display: -webkit-flex;
    display: flex;
    align-items: center;
    min-height: 70vh;
    max-width: 800px;
    text-align: left;
    margin: 0 auto;
}

#location-select .location-select-box h1 {
    font-weight: 600;
}

@media screen and (max-width: 1199px) {
    #dynamicText {
        display: block;
        width: 100%;
    }
}

.location-select-box>.row {
    background-color: #FFF;
    border-radius: 0.25rem;
    box-shadow: 0 5px 30px rgba(0, 0, 0, 0.1);
    margin-top: calc(3rem + 66px) !important;
}

#location-image {
    min-height: 30vh;
    background-image: url(../img/wave.png);
    background-position: top center;
    background-repeat: repeat-x;
    background-size: auto;
    position: relative;
}

#location-image .copyright {
    position: absolute;
    text-align: center;
    width: 100%;
    padding: 15px;
    bottom: 0;
    color: #FFF;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0) 90%);
    font-size: 0.95rem;
}

@media screen and (max-width: 1199px) {
    #location-select .location-select-box {
        min-height: 70vh;
    }
    #location-image {
        min-height: 30vh;
    }
}

.dropdown-item {
    min-width: 288px;
    padding: .25rem 15px;
}

.dropdown-item.login {
    background-color: transparent;
}

.dropdown-item.login .form-group.help a {
    display: block;
    text-align: center;
    font-size: .9rem;
    font-weight: 300;
    text-decoration: none;
}


/* Second page */

#order-sidebar {
    position: fixed;
    /* Provjeriti visinu display-a i ako je lista veće visine onda ukloniti fixed */
    top: 66px;
    right: 0;
}

#order-sidebar.order-size {
    position: relative;
    top: 0;
}

#order-sidebar,
#order-sidebar>.container {
    min-height: 100vh;
    min-height: calc(100vh - 66px);
}

#order-sidebar>.container {
    display: flex;
    justify-content: center;
    align-items: center;
}

#order-sidebar {
    border-left: 1px solid #ced4da;
    background-color: #F7F7F7;
}

.my-row {
    display: flex;
    background-color: #FFF;
    padding-top: 66px;
    background-color: #F7F7F7;
}

.col-content {
    width: calc(-300px + 100vw);
    padding-right: 15px;
}

.col-order {
    width: 300px;
    max-width: 300px;
}

.col-content.single {
    width: 100%;
    margin: 0 auto;
    padding: 0;
}

@media screen and (max-width: 1199px) {
    .my-row {
        display: block;
    }
    #order-sidebar {
        position: fixed;
        left: 0;
        width: 100%;
        background: #FFF;
        z-index: 9;
        max-width: 100%;
        top: unset;
        bottom: 0;
        height: 3rem;
        font-size: 0.9rem;
        border: 0;
        border-top: 1px solid #ced4da;
        line-height: 2rem;
    }
    #order-sidebar .order-empty-img {
        display: none;
    }
    #order-sidebar,
    #order-sidebar>.container {
        min-height: 3rem;
        min-height: 3rem;
    }
    .col-content {
        width: 100%;
        padding-right: 0;
    }
    .col-order {
        width: 100%;
    }
    .col-content .container,
    .col-order .container {
        margin: 0 auto;
    }
}

.navbar .container-fluid {
    justify-content: left;
    position: relative;
}

.menu-button-location {
    color: #333;
    padding: 0.2rem 0.5rem;
    flex: none;
}

.menu-button-location b {
    color: #b91e04;
}

.menu-button-location:hover {
    text-decoration: none;
    color: #333;
}

.menu-button-location:hover b {
    color: rgba(185, 30, 4, .85);
}

@media screen and (max-width: 1199px) {
    .menu-button-location span {
        display: none;
    }
}

.menu-button {
    position: absolute;
    right: 0;
    top: 0.75rem;
}

#header-search {
    position: relative;
    margin-right: 1rem !important;
}

#header-search {
    position: relative;
    margin-right: 1rem !important;
}

#header-search input {
    border-radius: 2rem;
    padding-right: 2rem;
}

@media screen and (max-width: 1199px) {
    #header-search {
        margin-top: 1rem !important;
        margin-right: 0 !important;
    }
    #header-search input {
        max-width: 100%;
        width: 100%;
    }
}

#header-search .custom-search-button {
    position: absolute;
    right: 0;
    border: 0;
    background: transparent;
    padding: 0.2rem 0.5rem;
    color: #333;
    border-radius: 50%;
    margin-right: 0.1rem;
    background-color: #FFF;
}

#header-search .custom-search-button:focus,
#header-search .custom-search-button:hover {
    outline: none !important;
}

#header .dropdown-menu {
    border: 0;
    border-radius: 0;
    -webkit-border-bottom-right-radius: .25rem;
    -webkit-border-bottom-left-radius: .25rem;
    -moz-border-radius-bottomright: .25rem;
    -moz-border-radius-bottomleft: .25rem;
    border-bottom-right-radius: .25rem;
    border-bottom-left-radius: .25rem;
    box-shadow: 0 15px 20px rgba(0, 0, 0, 0.05);
}

@media screen and (max-width: 1199px) {
    #header .dropdown-menu.show {
        border: 0;
        border-radius: 0 !important;
        box-shadow: unset !important;
    }
    .navbar-light .navbar-nav .nav-btn.nav-btn-primary,
    .navbar-light .navbar-nav .nav-btn.nav-btn-primary:hover,
    .navbar-light .navbar-nav .nav-btn.nav-btn-primary:focus {
        border: 0;
        margin: 0;
    }
    .navbar-light.logged .navbar-nav .dropdown-menu {
        display: block !important;
        margin: 0 !important;
        box-shadow: unset !important;
    }
    .navbar-light .navbar-nav .dropdown-menu .dropdown-item {
        padding: 0.5rem;
        text-align: center;
    }
    #navbarDropdown {
        display: none;
    }
}

.order-empty {
    text-align: center;
    font-weight: 400;
}

.order-empty-img {
    height: 100px;
}


/* owl-carousel */

.owl-carousel {
    margin-top: 2rem;
}

.owl-carousel .owl-stage-outer,
.owl-carousel .owl-stage-outer .owl-stage {
    /*max-height: 6.3rem;*/
}

.owl-carousel .img,
.owl-carousel .img img {
    width: 100px;
    height: 100px;
    margin: 0 auto;
}

@media screen and (max-width: 1199px) {
    .owl-carousel .img,
    .owl-carousel .img img {
        width: 100%;
        height: 100%;
        margin: 0 auto;
        max-width: 100px;
    }
}

.owl-carousel .item .img {
    transition: transform 0.25s;
}

.owl-carousel .item:hover {
    color: #b91e04;
}

.owl-carousel .item:hover .img {
    transform: rotate(25deg);
    transition: transform 0.25s;
}

.owl-carousel .item:hover .img {
    transform: rotate(25deg);
    transition: transform 0.25s;
}

.owl-carousel .title {
    margin-top: 0.5rem;
    text-align: center;
    font-size: 0.8rem;
    padding: 0 0.2rem;
}

.owl-carousel .item {
    color: #333;
}

.owl-carousel .item:hover {
    text-decoration: none;
}

.owl-theme .owl-nav {
    margin-top: 0 !important;
    position: absolute;
    width: 100%;
    top: 4.1rem;
    height: 0 !important;
}

.owl-theme .owl-nav [class*="owl-"],
.owl-carousel .owl-nav button.owl-next,
.owl-carousel .owl-nav button.owl-prev {
    color: #b91e04 !important;
    font-size: 1rem !important;
    margin: 0 !important;
    padding: 0 !important;
    background: #FFF !important;
    display: inline-block !important;
    cursor: pointer !important;
    border-radius: 0 !important;
    width: 1.5rem;
    height: 1.5rem;
    line-height: 1.5rem;
    border-radius: 50% !important;
    text-align: center;
    transition: all 0.2s;
    box-shadow: 0 1px 5px rgba(0, 0, 0, .1);
}

.owl-carousel .owl-nav button.owl-prev:focus,
.owl-carousel .owl-nav button.owl-prev:hover,
.owl-carousel .owl-nav button.owl-next:hover {
    outline: none !important;
    background: #333 !important;
    transition: all 0.2s;
    color: #FFF !important;
}

.owl-carousel .owl-item a {
    border-radius: 0.25rem;
    box-shadow: 0 1px 5px rgba(0, 0, 0, .1);
    display: block;
    margin: 0.5rem 5px;
    padding: 0.5rem 0;
    background-color: #FFF;
}

.owl-prev {
    float: left;
}

.owl-next {
    float: right;
}


/* Alert */

.alert-tanjir {
    border: 0;
    background-color: #589215;
    background-image: url(../img/alert-bg.svg), url(../img/alert-bg-2.png);
    background-size: cover, 30% auto;
    background-repeat: repeat, no-repeat;
    background-position: center, center right;
    color: #FFF;
}

@media screen and (max-width: 1199px) {
    .alert-tanjir {
        background-image: url(../img/alert-bg.svg);
        background-size: cover;
    }
}

.alert-tanjir a,
.alert-tanjir a:hover {
    color: #FFF;
    text-decoration: none;
    transition: all 0.2s;
}

.alert-tanjir a:hover i {
    padding-left: 0.5rem;
    transition: all 0.2s;
}

.alert-tanjir h5 {
    font-weight: 300;
}

.alert-tanjir a h4 {
    font-weight: 500;
}

.alert-tanjir a h4 i {
    font-size: 1rem;
}


/* Restorani lista */

.restaurant-box {
    display: block;
    margin-bottom: 30px;
    position: relative;
    box-shadow: 0 1px 8px rgba(0, 0, 0, .1);
    border-radius: 0.30rem;
    background-color: #FFF;
    max-width: 480px;
    margin-left: auto;
    margin-right: auto;
}

.restaurant-box .img {
    position: relative;
    display: block;
    width: 100%;
    height: 270px;
    min-height: 270px;
    margin: 0 auto;
    font-size: 0;
    text-align: center;
    background: #e9edf0;
    transition: all 0.2s;
    -webkit-border-top-left-radius: 0.25rem;
    -webkit-border-top-right-radius: 0.25rem;
    -moz-border-radius-topleft: 0.25rem;
    -moz-border-radius-topright: 0.25rem;
    border-top-left-radius: 0.25rem;
    border-top-right-radius: 0.25rem;
}

.restaurant-box:hover {
    transform: translateY(-5px);
    box-shadow: 0 5px 25px rgba(0, 0, 0, .1);
    transition: all 0.2s;
}

.restaurant-box .img img {
    width: 100%;
    max-width: 100%;
    height: 100%;
    max-height: 100%;
    object-fit: cover;
    -webkit-border-top-left-radius: 0.25rem;
    -webkit-border-top-right-radius: 0.25rem;
    -moz-border-radius-topleft: 0.25rem;
    -moz-border-radius-topright: 0.25rem;
    border-top-left-radius: 0.25rem;
    border-top-right-radius: 0.25rem;
}

.restaurant-box .img .new,
.restaurant-box .img .recommended {
    position: absolute;
    top: -0.8rem;
    left: 50%;
    transform: translate(-50%, 0);
    z-index: 0;
    color: #fff;
    background: #b91e04;
    border: 1px solid #b91e04;
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0.25rem 0.5rem;
    border-radius: 2rem;
    min-width: 10rem;
}

.restaurant-box.new {
    box-shadow: 0 1px 8px rgba(185, 30, 4, .25);
}

.restaurant-box.recommended {
    box-shadow: 0 1px 8px rgba(88, 146, 21, .25);
}

.restaurant-box .img .new::before,
.restaurant-box .img .recommended::before {
    content: " ";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    color: #FFF;
    -webkit-box-shadow: 0 0 0 0 #b91e04;
    box-shadow: 0 0 0 0 #b91e04;
    -webkit-animation: in-eye 2s infinite;
    animation: in-eye 2s infinite;
    animation-delay: 0s;
    opacity: 0.7;
    z-index: 0;
    border-radius: 2rem;
}

.restaurant-box .img .recommended::before {
    -webkit-box-shadow: 0 0 0 0 #589215;
    box-shadow: 0 0 0 0 #589215;
    animation-delay: 3s;
}

@-webkit-keyframes in-eye {
    70% {
        -webkit-box-shadow: 0 0 0 15px #FFF;
        box-shadow: 0 0 0 15px #FFF;
        opacity: 0;
    }
    100% {
        -webkit-box-shadow: 0 0 0 0 #FFF;
        box-shadow: 0 0 0 0 #FFF;
        opacity: 0;
    }
}

@keyframes in-eye {
    70% {
        -webkit-box-shadow: 0 0 0 15px #FFF;
        box-shadow: 0 0 0 15px #FFF;
        opacity: 0;
    }
    100% {
        -webkit-box-shadow: 0 0 0 0 #FFF;
        box-shadow: 0 0 0 0 #FFF;
        opacity: 0;
    }
}

.restaurant-box .img .recommended {
    color: #589215;
    background: #FFF;
    border: 1px solid #589215;
    min-width: 12rem;
}

.restaurant-box .img .no-delivery,
.restaurant-info-box .img .no-delivery {
    position: absolute;
    top: 0;
    height: 100%;
    width: 100%;
    z-index: 0;
    color: #FFF;
    background: rgba(0, 0, 0, 0.7);
    font-size: .85rem;
    font-weight: 600;
    padding: 0.25rem 0.5rem;
    display: flex;
    justify-content: center;
    align-items: center;
}

@media screen and (max-width: 1600px) {
    .restaurant-box .img {
        height: 240px;
        min-height: 240px;
    }
}

@media screen and (max-width: 1450px) {
    .restaurant-box .img {
        height: 210px;
        min-height: 210px;
    }
}

@media screen and (max-width: 1199px) {
    .restaurant-box .img {
        height: 270px;
        min-height: 270px;
    }
}

@media screen and (max-width: 400px) {
    .restaurant-box .img {
        height: 210px;
        min-height: 210px;
    }
}

.restaurant-content {
    padding: 0.5rem;
    -webkit-border-bottom-right-radius: 0.25rem;
    -webkit-border-bottom-left-radius: 0.25rem;
    -moz-border-radius-bottomright: 0.25rem;
    -moz-border-radius-bottomleft: 0.25rem;
    border-bottom-right-radius: 0.25rem;
    border-bottom-left-radius: 0.25rem;
}

.restaurant-box h2 {
    margin: 0 0 0.1rem 0;
    font-size: 1.2rem;
    font-weight: 600;
    text-decoration: none;
    color: #333;
    display: inline-block;
    max-width: calc(100% - 45px);
}

.restaurant-box #favorit {
    margin-top: -0.25rem;
    color: #333;
    font-size: 0.9rem;
}

.restaurant-box #favorit span,
.restaurant-info-box #favorit span {
    position: relative;
    top: -0.15rem !important;
}

.restaurant-box #heartIcon {
    font-size: 1.2rem
}

.restaurant-box:hover {
    text-decoration: none !important;
}

.restaurant-info li {
    background-color: #DDD;
    padding: 0.2rem 0.5rem;
    border-radius: 1.5rem;
    color: #333;
    font-size: 0.8rem;
    font-weight: 300;
}

.restaurant-info .list-inline-item:not(:last-child) {
    margin-right: 0.15rem;
}

.restaurant-box .food-groups {
    color: #333;
    font-size: 0.8rem;
    font-weight: 300;
    margin: 0;
    margin-top: -0.8rem;
    display: inline-block;
}

.restaurant-box .img .new {
    position: absolute;
}

/* Footer */

#footer.footer {
    border-top: 1px solid #ced4da;
}

.footer h3 {
    font-size: 1.3rem;
    font-weight: 500;
}

.footer .nav a {
    padding: 0.2rem 0;
    color: #333;
}

.footer .nav.teme a,
.footer .nav.recepti a {
    padding: 0.15rem 0;
}

.footer .copyright {
    font-size: 0.95rem;
    font-weight: 300;
}

.footer .copyright .copyright-social {
    font-size: 1.5rem;
    margin-top: -0.7rem;
}

.footer .copyright .copyright-social li:not(:last-child) {
    margin-right: 0.5rem;
}

@media screen and (max-width: 1199px) {
    #footer.footer {
        padding-bottom: 3.2rem;
    }
    .footer .copyright {
        text-align: center;
    }
    .footer .copyright .copyright-social {
        margin-top: 0.25rem;
        justify-content: center !important;
    }
}


/* Single restaurant */

.restaurant-info-box .info {
    font-size: 0.9rem;
}

.restaurant-info-box .cp {
    padding: 0 1rem;
}

@media screen and (max-width: 1199px) {
    .restaurant-info-box h1 {
        font-size: 1.8rem;
    }
}

@media screen and (max-width: 767px) {
    .restaurant-info-box .cmt {
        margin-top: 0.5rem;
    }
    .restaurant-info-box .cp {
        padding: 0;
    }
}

.restaurant-info-box {
    background-color: #FFF;
    box-shadow: 0 1px 8px rgba(0, 0, 0, .1);
    border-radius: 0.25rem;
    overflow: hidden;
}

@media screen and (min-width: 1199px) {
    .restaurant-info-box {
        display: block;
        position: -webkit-sticky;
        position: sticky;
        top: 98px;
        top: calc(66px + 2rem);
    }
}

.restaurant-info-box h1 {
    font-weight: 600;
}

#favorit {
    text-align: right;
}

#heartIcon {
    cursor: pointer;
    font-size: 1.5rem;
    margin-top: 0.2rem;
    color: #b91e04;
    transition: all 0.2s;
}

#heartIcon::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f004";
    font-style: normal;
    font-variant: normal;
    font-weight: 400;
    transition: all 0.2s;
}

#heartIcon:hover::before {
    font-weight: 900;
    transition: all 0.2s;
}

.list-inline-item.info-box {
    border: 1px solid #DDD;
    background-color: #FFF;
    padding: 0.2rem 0.5rem;
    border-radius: 0.25rem;
    margin-bottom: 0.2rem;
    min-width: 50%;
    margin-right: 0;
}

.list-inline-item.info-box:first-child {
    min-width: calc(50% - .7rem);
    margin-right: 0.4rem;
}

.list-inline-item.info-box:last-child {
    min-width: 100%;
}

@media screen and (max-width: 1400px) and (min-width: 1199px) {
    .list-inline-item.info-box,
    .list-inline-item.info-box:first-child,
    .list-inline-item.info-box:last-child {
        width: 100%;
    }
}

.info-box .icon {
    float: left;
    font-size: 1.4rem;
    margin-right: 0.3rem;
    color: #8B8B8B;
    margin-top: 0.15rem;
}

.info-box .info-box-content {
    float: left;
}

.info-box .info-title {
    font-size: 0.7rem;
    text-transform: uppercase;
    font-weight: 500;
}

@media screen and (max-width: 1199px) {
    .list-inline-item.info-box {
        text-align: center;
        padding: 0.2rem 0.35rem;
    }
    .info-box .info-title {
        display: none;
    }
    .info-box:last-child .info-title {
        display: block;
        font-weight: 400;
    }
    .info-box:last-child {
        text-align: left;
    }
    .info-box:last-child .icon {
        font-size: 1.35rem;
    }
    .info-box .icon,
    .info-box .info-box-content .info {
        font-size: 0.8rem;
    }
}

.food-category .item {
    background-color: #FFF;
    border: 1px solid #DDD;
    border-radius: 2rem;
    padding: 0.2rem 0.5rem;
    font-size: 1rem;
    display: inline-block;
    margin: 0;
    margin-bottom: 0.5rem;
    text-decoration: none;
}

.food-category .item:hover {
    color: #333;
}

.owl-carousel.category-slide .item {
    box-shadow: unset;
}

#meni img {
    border-radius: 0.25rem;
}

#meni .menu-items {
    border-top: 1px solid #DDD;
}

#meni .meni-title {
    padding: 0.75rem 3rem 0.75rem 1rem;
    background-color: #DDD;
    -webkit-border-top-left-radius: 0.25rem;
    -webkit-border-top-right-radius: 0.25rem;
    -moz-border-radius-topleft: 0.25rem;
    -moz-border-radius-topright: 0.25rem;
    border-top-left-radius: 0.25rem;
    border-top-right-radius: 0.25rem;
    background-position: center center;
    background-size: cover;
}

#meni .meni-title h3 {
    background-color: rgba(0, 0, 0, 0.5);
    padding: 0.25rem 0.5rem;
    display: inline-block;
    border-radius: 0.25rem;
    color: #FFF;
}

#meni .menu-items h4 {
    padding: 0.35rem 0.2rem;
    cursor: pointer;
    font-size: 1rem;
}

#meni .menu-items {
    padding: 0.25rem 0.25rem 0.25rem 0.25rem;
    -webkit-border-bottom-right-radius: 0.25rem;
    -webkit-border-bottom-left-radius: 0.25rem;
    -moz-border-radius-bottomright: 0.25rem;
    -moz-border-radius-bottomleft: 0.25rem;
    border-bottom-right-radius: 0.25rem;
    border-bottom-left-radius: 0.25rem;
}

#meni .item-box {
    border-bottom: 1px solid #DDD;
}

#meni .menu-items .item-box:last-child {
    border: 0;
}

#meni img {
    border-radius: 0.25rem;
}

#meni .price-tag {
    float: right;
}

#meni h4 {
    font-weight: 400;
}

#meni.item-box .collapse {
    font-size: 0.95rem;
}

#meni .menu-items h4:hover,
#meni .menu-items h4[aria-expanded="true"] {
    background-color: #DDD;
    transition: all 0.2s;
}

.meni-title h3:after {
    position: absolute;
    right: 1rem;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f077";
    font-style: normal;
    font-variant: normal;
    color: #FFF;
}

.meni-title.collapsed h3:after {
    content: "\f078";
}

#meni .section {
    background: #FFF;
    box-shadow: 0 1px 8px rgba(0, 0, 0, .1);
    border-radius: 0.25rem;
}


/* plate info */

.plate-info {
    padding: 0.5rem;
    background-color: #F3F3F3;
}

.custom-control-input:checked~.custom-control-label::before {
    border-color: #b91e04;
    background-color: #b91e04;
}

.custom-control-input:not(:disabled):active~.custom-control-label::before {
    background-color: #b91e04;
    border-color: #b91e04;
}

.custom-control-input:focus~.custom-control-label::before {
    box-shadow: 0 0 0 .2rem rgba(185, 30, 4, .25);
    border-color: rgba(185, 30, 4, .3) !important;
}

.plate-info i,
.plate-info label {
    font-weight: 500;
    font-style: normal;
    color: #589215;
}

.plate-info .form-check-inline label {
    font-weight: 400 !important;
    color: #333;
}

.plate-info .btn-pay {
    text-transform: uppercase;
    font-size: 0.8rem;
    letter-spacing: 0.05rem;
    float: right;
    margin-top: 0.8rem;
    font-weight: 500;
}

.plate-info .price-tag-info {
    font-size: 1rem;
}

@media screen and (max-width: 767px) {
    .plate-info .btn-pay {
        width: 100%;
    }
}


/* Order list */

#order-sidebar>.container.order-list {
    display: flex;
    justify-content: start;
    align-items: start;
}

#order-sidebar .order-box {
    background: #FFF;
    box-shadow: 0 1px 8px rgba(0, 0, 0, .1);
    border-radius: 0.25rem;
    padding: 1rem;
}

#order-sidebar .cleanorder {
    cursor: pointer;
    transition: all 0.2s;
    color: #8B8B8B;
}

#order-sidebar .cleanorder:hover {
    color: #b91e04;
    transition: all 0.2s;
}

#order-sidebar .restaurant-order>h6 {
    color: #b91e04;
}

#order-sidebar .restaurant-order-list {
    list-style: none;
}

#order-sidebar h5,
#order-sidebar h6 {
    font-weight: 600;
    position: relative;
}

.order-head {
    padding-bottom: 0.25rem;
    border-bottom: 1px solid #ced4da;
}

#order-sidebar .restaurant-order-list h6 {
    font-weight: 400;
}

#order-sidebar .restaurant-order-list {
    border-bottom: 1px dashed #ced4da;
}

#order-sidebar .sum .sum {
    font-weight: 500;
}

#order-sidebar .sum-mobile {
    display: none;
}

@media screen and (max-width: 1199px) {
    #order-sidebar .order-box {
        background: transparent;
        box-shadow: unset;
        border-radius: 0;
        padding: 0;
        margin: 0 !important;
    }
    #order-sidebar .order-box-mobile {
        display: none;
    }
    #order-sidebar .btn-pay {
        margin-top: 0.25rem !important;
    }
    #order-sidebar .sum-mobile {
        display: inline-block;
        font-style: normal;
        background: #488205;
        border-radius: 0.25rem;
        padding: 0 0.25rem;
    }
}


/* Tooltip color */

.tooltip-inner {
    background-color: #488205;
}

.tooltip.bs-tooltip-right .arrow:before {
    border-right-color: #488205 !important;
}

.tooltip.bs-tooltip-left .arrow:before {
    border-left-color: #488205 !important;
}

.tooltip.bs-tooltip-bottom .arrow:before {
    border-bottom-color: #488205 !important;
}

.tooltip.bs-tooltip-top .arrow:before {
    border-top-color: #488205 !important;
}

/* Order page */

.order-page-box,
.order-page-user-form {
    background: #FFF;
    box-shadow: 0 1px 8px rgba(0, 0, 0, .1);
    border-radius: 0.25rem;
    padding: 1rem;
}

.order-page-box .restaurant-order-list {
    list-style: none;
    border-bottom: 1px dashed #ced4da;
}

.order-page-box  .final-price {
    border-top: 1px solid #ced4da;
    padding-top: 0.5rem;
}

.order-page-box .cleanorder {
    cursor: pointer;
}

/* Only form page */

.form-page-box {
    background: #FFF;
    box-shadow: 0 1px 8px rgba(0, 0, 0, .1);
    border-radius: 0.25rem;
    padding: 1rem;
}
