/*
Theme Name: Hmelar
Text Domain: Hmelar
Version: 1.0
Description: Hotel Hmelar Theme
Tags: responsive, fast, modern
Author: Mykhaiylo Ratskeych
*/



/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
html { line-height: 1.15; -webkit-text-size-adjust: 100%; }
body { margin: 0; }
main { display: block; }
h1 { font-size: 2em; margin: 0.67em 0; }
hr { box-sizing: content-box; height: 0; overflow: visible; }
pre { font-family: monospace, monospace; font-size: 1em; }
a { background-color: transparent; }
abbr[title] { border-bottom: none; text-decoration: underline; text-decoration: underline dotted; }
b, strong { font-weight: bolder; }
code, kbd, samp { font-family: monospace, monospace; font-size: 1em; }
small { font-size: 80%; }
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sub { bottom: -0.25em; }
sup { top: -0.5em; }
img { border-style: none; }
button, input, optgroup, select, textarea { font-family: inherit; font-size: 100%; line-height: 1.15; margin: 0; }
button, input { overflow: visible; }
button, select { text-transform: none; }
button, [type="button"], [type="reset"], [type="submit"] { -webkit-appearance: button; }
button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner { border-style: none; padding: 0; }
button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring { outline: 1px dotted ButtonText; }
fieldset { padding: 0.35em 0.75em 0.625em; }
legend { box-sizing: border-box; color: inherit; display: table; max-width: 100%; padding: 0; white-space: normal; }
progress { vertical-align: baseline; }
textarea { overflow: auto; }
[type="checkbox"], [type="radio"] { box-sizing: border-box; padding: 0; }
[type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button { height: auto; }
[type="search"] { -webkit-appearance: textfield; outline-offset: -2px; }
[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }
::-webkit-file-upload-button { -webkit-appearance: button; font: inherit; }
details { display: block; }
summary { display: list-item; }
template { display: none; }
[hidden] { display: none; }



/* fonts */
@font-face {
    font-family: 'Montserrat-Bold';
    src: url('assets/fonts/Montserrat/static/Montserrat-Bold.ttf') format('truetype');

}

@font-face {
    font-family: 'Montserrat-Regular';
    src: url('assets/fonts/Montserrat/static/Montserrat-Regular.ttf') format('truetype');

}

@font-face {
    font-family: 'Montserrat-Light';
    src: url('assets/fonts/Montserrat/static/Montserrat-Light.ttf') format('truetype');

}

@font-face {
    font-family: 'Roboto-Bold';
    src: url('assets/fonts/Roboto/static/Roboto-Bold.ttf') format('truetype');
}

@font-face {
    font-family: 'Roboto-Light';
    src: url('assets/fonts/Roboto/static/Roboto-Light.ttf') format('truetype');
}

@font-face {
    font-family: 'Lora-Regular';
    src: url('assets/fonts/Lora/static/Lora-Regular.ttf') format('truetype');
}



/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v8.4.14,
* Autoprefixer: v10.4.7
* Browsers: last 4 version
*/

/* basic tag styles */
* { -webkit-box-sizing: border-box; box-sizing: border-box; }

:root {
    --container-width: 1200px;
    --dark-color: #404040;
    --dirty-green: #374523;
    --regular-green: #46641c;
    --light-color: #c7c9c3;
    --fruit-color: #e53b0f;
    --mon-bold: 'Montserrat-Bold';
    --mon-bold-weight: 700;
    --mon-regular: 'Montserrat-Regular';
    --mon-regular-weight: 400;
    --mon-light: 'Montserrat-Light';
    --mon-light-weight: 300;
    --rob-bold: 'Roboto-Bold';
    --rob-bold-weight: 700;
    --rob-light: 'Roboto-Light';
    --rob-light-weight: 300;
    --lora-regular: 'Lora-Regular';
    --lora-regular-weight: 400;
    --regular-border-radius: 15px;
    --bold-border-radius: 50px;
}

::-webkit-scrollbar {
    width: 10px;
}

::-webkit-scrollbar-track {
    background-color: var(--light-color);
}

::-webkit-scrollbar-thumb {
    background-color: var(--dark-color);
}

:hover {
    -webkit-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}

html {
	scroll-behavior: smooth;
}

body {
    margin: 0;
    padding: 0;
    background-color: #f2f2f2;
    background-image: url(../khmeliar/assets/images/pattern.png);
    background-repeat: repeat;
}

main {
    min-height: 45vh;
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--mon-bold);
    font-weight: var(--mon-bold-weight);
}

h1 {
    font-size: 36px;
}

h2, h3 {
    font-size: 30px;
}

@media only screen and (max-width: 540px) {
    h1 {
        font-size: 30px;
    }
    h2, h3 {
        font-size: 26px;
    }
}

h4 {
    font-size: 20px;
    margin: 15px 0;
}

h4 > i {
    margin-right: 7px;
}

h5, h6 {
    font-size: 18px;
    color: white;
    margin: 0;
}

p {
    line-height: 1.3rem;
}

p, span {
    font-family: var(--lora-regular);
    font-weight: var(--lora-regular-weight);
    color: var(--dark-color);
}

a {
    text-decoration: none;
}

li {
    font-family: var(--lora-regular);
    font-weight: var(--lora-regular-weight);
    margin-bottom: 10px;
    line-height: 1.3rem;
}

li > i {
    width: 20px;
    margin-right: 7px;
    text-align: center;
}



/* common styles added in wp admin pages */
.container {
    max-width: var(--container-width);
    margin: auto;
    padding: 0 15px;
}

.less-width {
    max-width: 800px;
    margin: auto;
}

@media only screen and (max-width: 800px) {
    .less-width {
        text-align: left;
    }
}

.more-margin-top {
    margin-top: 50px;
}

@media only screen and (max-width: 800px) {
    .more-margin-top {
        text-align: left;
    }
}

.page-stripe {
    font-family: var(--mon-bold);
    font-weight: var(--mon-bold-weight);
    color: var(--fruit-color);
}

.page-stripe > i:last-of-type {
    margin-right: 10px;
}

.page-ul, .page-ul > ul {
    list-style: none;
    padding: 0;
}

.page-ul > li , .page-ul > ul > li {
    font-family: var(--rob-light);
    font-weight: var(--rob-light-weight);
}

.page-ul > li > i, .page-ul > ul > li > i {
    color: var(--regular-green);
}

.page-ul > li > span, .page-ul > ul > li > span {
    font-family: var(--rob-light);
    font-weight: var(--rob-light-weight);
    font-size: 12px;
    color: white;
    background-color: rgba(70, 100, 28, 0.5);
    margin-left: 7px;
    padding: 5px 10px;
    border-radius: var(--regular-border-radius);
    white-space: nowrap;
}

.page-ul > li > a, .page-ul > ul > li > a {
    font-family: var(--rob-light);
    font-weight: var(--rob-light-weight);
    text-decoration: none;
    color: var(--dark-color);
}

.page-ul > li > a > i, .page-ul > ul > li > a > i {
    margin: 0 5px;
}

.page-link {
    height: 50px;
    font-family: var(--rob-light);
    font-weight: var(--rob-light-weight);
    font-size: 14px;
}

.page-link:hover {
    opacity: 0.5;
}

.page-link > a > i {
    margin-right: 7px;
}



/* header */
.navbar {
    position: absolute;
    top: 0;
    width: 100%;
    background-color: transparent;
    z-index: 10;
}

.navbar-for-pages {
    position: relative;
    width: 100%;
    background-color: var(--dark-color);
}

.top-bar {
    background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.5)), color-stop(rgba(0, 0, 0, 0.3)), to(rgba(0, 0, 0, 0.1)));
    background-image: -o-linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.1));
    background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.1));
    padding: 15px 0;
}

@media only screen and (max-width: 1040px) {
    .top-bar {
        display: none;
    }
}

.top-bar-links {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.top-bar-links > a, .top-bar-links > div > a {
    font-family: var(--rob-light);
    font-weight: var(--rob-light-weight);
    font-size: 14px;
    color: var(--light-color);
}

.top-bar-links > a:hover, .top-bar-links > div > a:hover {
    color: white;
}

.top-bar-links > div > a:first-of-type {
    margin-right: 20px;
}

.nav-links {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 15px 0;
}

.navlogo {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.navlogo:hover {
    opacity: 0.5;
}

.navlogo > img {
    width: 45px;
    height: auto;
    margin-right: 10px;
}

@media only screen and (max-width: 540px) {
    .navlogo > img {
        width: 30px;
        height: auto;
    }
}

.navlogo > span {
    font-family: var(--mon-bold);
    font-weight: var(--mon-bold-weight);
    font-size: 22px;
    color: white;
    margin: 0;
}

@media only screen and (max-width: 540px) {
    .navlogo > span {
        font-size: 20px;
    }
}

@media only screen and (max-width: 1040px) {
    .main-links {
        display: none;
    }
}

.main-links-a {
    font-family: var(--rob-bold);
    font-weight: var(--rob-bold-weight);
    font-size: 17px;
    color: var(--light-color);
    margin-left: 25px;
}

.main-links-a:hover {
    color: white;
}

.main-links-a > i {
    margin-right: 7px;
}

.mainlinks-for-pages {
    color: white;
}

.mainlinks-for-pages:hover {
    opacity: 0.5;
}



/* mobile menu */
.mobile-menu-container {
    display: none;
    color: white;
    font-size: 20px;
}

@media only screen and (max-width: 1040px) {
    .mobile-menu-container {
        display: block;
    }
}

#sandwich {
    color: white;
}

.mobile-links-wrapper {
    position: fixed;
    top: 0;
    right: -100%;
    width: 100%;
    height: 100vh;
    -webkit-transition: right 0.3s ease-in-out;
    -o-transition: right 0.3s ease-in-out;
    transition: right 0.3s ease-in-out;
    background-color: var(--regular-green);
}

.mobile-links-wrapper.is-open {
    right: 0;
}

.mobile-links-header {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 15px 20px;
    background-color: rgba(0, 0, 0, 0.3);
}


#close-mobile-menu {
    display: block;
    font-size: 20px;
    color: white;
}

.mobile-links {
    margin-top: 50px;
    padding: 0 20px;
}

.mobile-links > a {
    display: block;
    font-family: var(--rob-light);
    font-weight: var(--rob-light-weight);
    font-size: 20px;
    color: white;
    margin-bottom: 20px;
}

.mobile-links > a > i {
    width: 30px;
    margin-right: 10px;
    text-align: center;
}

.mobile-menu-phone {
    margin-top: 50px;
}

.mobile-links > p {
    font-family: var(--rob-light);
    font-weight: var(--rob-light-weight);
    font-size: 20px;
    color: white;
    margin-top: 50px;
}



/* footer */
footer {
    width: 100%;
    background-color: var(--dark-color);
    margin-top: 70px;
    padding-top: 30px;
}

.footer-container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    max-width: var(--container-width);
    margin: auto;
    padding: 30px 20px 20px 20px;
}

@media only screen and (max-width: 1080px) {
    .footer-container {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }
}

.footer-logo {
    width: 30%;
}

@media only screen and (max-width: 1080px) {
    .footer-logo {
        width: 100%;
    }
}

.footer-logo-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.footer-logo-header > img {
    width: 60px;
    height: auto;
    margin-right: 10px;
}

.footer-logo-header > h5 {
    font-size: 30px;
}

.footer-logo-p {
    font-family: var(--rob-light);
    font-weight: var(--rob-light-weight);
    color: var(--light-color);
    margin: 30px 0;
}

.footer-booking-link {
    display: block;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    font-family: var(--rob-light);
    font-weight: var(--rob-light-weight);
    font-size: 16px;
    color: white;
    background-color: var(--regular-green);
    padding: 17px 30px;
    border-radius: var(--bold-border-radius);
}

.footer-booking-link:hover {
    opacity: 0.5;
}

.footer-grid {
    width: 65%;
    display: -ms-grid;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    grid-gap: 15px;
}

@media only screen and (max-width: 1080px) {
    .footer-grid {
        width: 100%;
        margin-top: 50px;
    }
}

.footer-grid-column > h6 {
    margin: 10px 0 30px 0;
}

.footer-grid-column > a {
    display: block;
    font-family: var(--rob-light);
    font-weight: var(--rob-light-weight);
    color: var(--light-color);
    margin-bottom: 13px;
}

.footer-grid-column > a:hover {
    color: white;
}

.footer-grid-column > a > i {
    width: 15px;
    margin-right: 10px;
    text-align: center;
}

#year {
    text-align: center;
    margin: 0;
    padding: 50px 20px 20px 20px;
    font-family: var(--rob-light);
    font-weight: var(--rob-light-weight);
    font-size: 14px;
    color: var(--light-color);
}



/* homepage */
.homepage-banner {
    width: 100%;
    height: 100vh;
    margin-bottom: 30px;
}

@media only screen and (max-width: 1200px) {
    .homepage-banner > img {
        -o-object-position: left;
        object-position: left;
    }
}

.banner-img {
    margin-top: 50px;
}

.main-banner-h1 {
    margin: 20px 0 0 0;
}

@media only screen and (max-width: 540px) {
    .main-banner-h1 {
        font-size: 30px;
    }
}

.main-banner-p {
    font-family: var(--mon-light);
    font-weight: var(--mon-light-weight);
    font-size: 20px;
    max-width: 800px;
    margin: 20px auto 30px auto;
}

.booking-btn {
    width: 220px;
    height: 60px;
    font-family: var(--rob-light);
    font-weight: var(--rob-light-weight);
    font-size: 14px;
}

.booking-btn:hover {
    opacity: 0.5;
}

.booking-btn > a > i {
    margin-right: 10px;
}

.services-cards {
    margin: 30px auto;
}

.reletive-position {
    position: relative;
    background-color: rgba(0, 0, 0, 0.1);
    border-radius: var(--regular-border-radius);
}

.card-img > img {
    border-radius: var(--regular-border-radius) var(--regular-border-radius) 0 0;
    width: 100%;
    height: auto;
    margin-bottom: 20px;
}

.card-stripe {
    position: absolute;
    left: 10%;
    top: -14px;
    right: 10%;
    font-family: var(--rob-bold);
    font-weight: var(--rob-bold-weight);
    background-color: rgba(0, 0, 0, 0.5);
    color: white;
    border-radius: 0 0 15px 15px;
    padding: 10px;
    z-index: 10;
}

.card-stripe > i {
    margin-right: 7px;
}

.card-text-padding {
    padding: 0 15px;
}



/* google reviews plugin */
.ti-name {
    font-family: var(--mon-bold) !important;
    font-weight: var(--mon-bold-weight) !important;
}

.ti-with-tooltip {
    font-family: var(--mon-light) !important;
    font-weight: var(--mon-light-weight) !important;
    font-size: 14px !important;
}

.ti-review-content {
    font-family: var(--rob-light) !important;
    font-weight: var(--rob-light-weight) !important;
    font-size: 15px !important;
}



/* nomery page */
.wp-block-media-text {
    position: relative;
    border-radius: var(--regular-border-radius);
    padding: 15px;
    background-color: rgba(0, 0, 0, 0.1);
}

.wp-block-media-text__media > img {
    border-radius: var(--regular-border-radius);
}

.nomer-card-stripe {
    position: absolute;
    left: 15px;
    top: 0;
    width: calc(50% - 15px);
    font-family: var(--rob-bold);
    font-weight: var(--rob-bold-weight);
    font-size: 14px;
    padding: 10px;
    text-align: center;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: var(--regular-border-radius);
    z-index: 10;
}

.nomer-add-prices-heading {
    margin: 0;
    font-family: var(--rob-bold);
    font-weight: var(--rob-bold-weight);
    font-size: 14px;
}

.nomer-add-prices-heading > i {
    margin-right: 7px;
}

.price-desr {
    margin: 5px 0 0 0;
    font-family: var(--rob-light);
    font-weight: var(--rob-light-weight);
    font-size: 14px;
}

.add-room-info {
    font-size: 14px;
    margin: 5px 0 0 0;
}

@media (max-width: 1200px) {
    .wp-block-media-text.is-stacked-on-mobile {
        display: block !important;
        -ms-grid-columns: none !important;
        grid-template-columns: none !important;
        -ms-grid-rows: none !important;
        grid-template-rows: none !important;
    }
    .wp-block-media-text.is-stacked-on-mobile > *:nth-child(1) { -ms-grid-row: 1; -ms-grid-column: 1;
    }
    .wp-block-media-text.is-stacked-on-mobile .wp-block-media-text__media,
    .wp-block-media-text.is-stacked-on-mobile .wp-block-media-text__content {
        display: block !important;
        width: 100% !important;
        grid-column: auto !important;
        grid-row: auto !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding: 0 !important;
    }
    .wp-block-media-text.is-stacked-on-mobile .wp-block-media-text__media {
        margin-bottom: 30px !important; 
    }
    .nomer-card-stripe {
        top: 15px;
        width: calc(50% - 15px);
        border: none;
        border-radius: 0 var(--regular-border-radius) var(--regular-border-radius) 0;
        background-color: rgba(0, 0, 0, 0.5);
        color: white;
    }
}



/* nomer */
.nomer-price {
    font-family: var(--mon-bold);
    font-weight: var(--mon-bold-weight);
    font-size: 26px;
    color: var(--regular-green);
}

.nomer-price > i {
    margin-right: 10px;
}



/* posluhy page */
.posluhy-list-heading {
    background-color: rgba(0, 0, 0, 0.1);
    font-size: 16px;
    padding: 10px 20px;
    border-radius: var(--regular-border-radius);
}

/* restoran page */
.restoran-popular-card {
    position: relative;
    background-color: rgba(0, 0, 0, 0.1);
    border-radius: var(--regular-border-radius);
    min-height: 350px;
}

.restoran-popular-img > img {
    border-radius: var(--regular-border-radius) var(--regular-border-radius) 0 0;
}

.restoran-popular-heading {
    font-size: 16px;
    margin: 0;
    padding: 0 15px;
}

.restoran-popular-price {
    position: absolute;
    top: -12px;
    left: 20%;
    right: 20%;
    font-family: var(--rob-bold);
    font-weight: var(--rob-bold-weight);
    font-size: 12px;
    color: white;
    background-color: var(--fruit-color);
    padding: 5px 10px;
    border-radius: 0 0 var(--regular-border-radius) var(--regular-border-radius);
    text-align: center;
}

.restoran-popular-desc {
    margin-top: 10px;
    padding: 0 15px;
}



/* contact page */
.phone-email-social-link > i {
    width: 17px;
    margin-right: 7px;
}

.phone-email-social-link > a {
    font-family: var(--mon-regular);
    font-weight: var(--mon-regular-weight);
    font-size: 17px;
    text-decoration: none;
    color: var(--dark-color);
}



/* contact form 7 plugin custom styles */
.wpcf7-form {
    background-color: rgba(0, 0, 0, 0.1);
    padding: 15px;
    border-radius: var(--regular-border-radius);
}

.wpcf7-form label {
    font-family: var(--rob-bold);
    font-weight: var(--rob-bold-weight);
}

.wpcf7-form input, .wpcf7-form textarea {
    width: 100%;
    height: 45px;
    border: none;
    border: 1px solid var(--light-color);
    border-radius: var(--regular-border-radius);
    background-color: rgba(70, 100, 28, 0.5);
    margin-top: 5px;
    padding: 15px;
    font-family: var(--rob-light);
    font-weight: var(--rob-light-weight);
    color: white;
}

.wpcf7-form input::-webkit-input-placeholder, .wpcf7-form textarea::-webkit-input-placeholder {
    font-family: var(--rob-light);
    font-weight: var(--rob-light-weight);
    font-size: 14px;
    color: white;
}

.wpcf7-form input::-moz-placeholder, .wpcf7-form textarea::-moz-placeholder {
    font-family: var(--rob-light);
    font-weight: var(--rob-light-weight);
    font-size: 14px;
    color: white;
}

.wpcf7-form input:-ms-input-placeholder, .wpcf7-form textarea:-ms-input-placeholder {
    font-family: var(--rob-light);
    font-weight: var(--rob-light-weight);
    font-size: 14px;
    color: white;
}

.wpcf7-form input::-ms-input-placeholder, .wpcf7-form textarea::-ms-input-placeholder {
    font-family: var(--rob-light);
    font-weight: var(--rob-light-weight);
    font-size: 14px;
    color: white;
}

.wpcf7-form input::placeholder, .wpcf7-form textarea::placeholder {
    font-family: var(--rob-light);
    font-weight: var(--rob-light-weight);
    font-size: 14px;
    color: white;
}

.wpcf7-form textarea {
    height: 230px;
}

.wpcf7-form input[type="submit"] {
    width: 200px;
    height: 50px;
    font-family: var(--rob-light);
    font-weight: var(--rob-light-weight);
    font-size: 14px;
    color: white;
    background-color: var(--fruit-color);
    border-radius: var(--bold-border-radius);
    padding-left: 30px;
}

.wpcf7-form input[type="submit"]:hover {
    cursor: pointer;
    opacity: 0.5;
}



/* prvyla, umovy, polityka pages */
.container-for-text {
    max-width: 900px;
    margin: auto;
    padding: 0 20px;
}

.container-for-text > h1, .container-for-text > h4, .container-for-text > p {
    margin: 30px 0;
}

.container-for-text > ul > li {
    color: var(--dark-color);
}



/* servio plugin */
#bookingPageContainer {
    max-width: var(--container-width) !important;
    margin: 50px auto !important;
    padding: 0 !important;
    background-color: transparent !important;
}

#bookingPageContainer .booking-header {
    display: none !important;
}

/* hidden */
/* #bookingPageContainer .nav-buttons-container:first-child {}
#bookingPageContainer .nav-buttons-container {}
#bookingPageContainer .change-theme-button,
#bookingPageContainer .user-cabinet-button,
#bookingPageContainer .selected-value {}
#bookingPageContainer .user-cabinet-button > i {}
#bookingPageContainer .language-select-panel {} */

#bookingPageContainer .hotel-select-container,
#bookingPageContainer .datepicker-container,
#bookingPageContainer .people-amount-container {
    background-color: var(--regular-green) !important;
    border: 1px solid var(--dirty-green) !important;
    border-radius: var(--bold-border-radius) !important;
}

#bookingPageContainer .hotel-select-container > input,
#bookingPageContainer .date-inputs > input {
    font-family: var(--rob-light) !important;
    font-weight: var(--rob-light-weight) !important;
    background-color: transparent !important;
    color: white !important;
}

#bookingPageContainer #roomCount,
#bookingPageContainer #adultCount,
#bookingPageContainer #childCount {
    font-family: var(--rob-light) !important;
    font-weight: var(--rob-light-weight) !important;
    background-color: transparent !important;
    color: white !important;
}

#bookingPageContainer .hotel-select-container > i,
#bookingPageContainer .datepicker-container > i,
#bookingPageContainer .room-count > i,
#bookingPageContainer .adult-count > i,
#bookingPageContainer .child-count > i {
    color: white !important;
}

#bookingPageContainer .search-button {
    font-family: var(--rob-light) !important;
    font-weight: var(--rob-light-weight) !important;
    background-color: var(--fruit-color) !important;
    color: white !important;
    border-radius: var(--bold-border-radius) !important;
}

#bookingPageContainer .search-button:hover {
    opacity: 0.5 !important;
}

#bookingPageContainer .search-button > i {
    color: white !important;
    margin-right: -5px !important;
}

#bookingPageContainer .steps-progress-bar {
    background-color: var(--regular-green) !important;
}

#bookingPageContainer .bullet {
    background-color: white !important;
    outline: 3px solid var(--regular-green) !important;
}

#bookingPageContainer .complete {
    background-color: white !important;
    outline: 7px solid var(--fruit-color) !important;
    border-radius: var(--regular-border-radius) !important;
}

#bookingPageContainer .title {
    font-family: var(--rob-light) !important;
    font-weight: var(--rob-light-weight) !important;
}

#bookingPageContainer .title:hover {
    padding: 0 !important;
    background-color: transparent !important;
    opacity: 0.5 !important;
    cursor: pointer !important;
}

#bookingPageContainer .hotel-list-panel {
    border-radius: var(--regular-border-radius) !important;
    -webkit-box-shadow: 0px 5px 7px 0px rgba(0, 0, 0, 0.2) !important;
    box-shadow: 0px 5px 7px 0px rgba(0, 0, 0, 0.2) !important;
}

#bookingPageContainer .hotel-list-panel > p {
    font-family: var(--rob-light) !important;
    font-weight: var(--rob-light-weight) !important;
}

#bookingPageContainer .calendar {
    border-radius: var(--regular-border-radius) !important;
    -webkit-box-shadow: 0px 5px 7px 0px rgba(0, 0, 0, 0.2) !important;
    box-shadow: 0px 5px 7px 0px rgba(0, 0, 0, 0.2) !important;
}

#bookingPageContainer .calendar-header > h3,
#bookingPageContainer th,
#bookingPageContainer td {
    font-family: var(--rob-light) !important;
    font-weight: var(--rob-light-weight) !important;
}

#bookingPageContainer .people-amount-edit-container {
    border-radius: var(--regular-border-radius) !important;
    -webkit-box-shadow: 0px 5px 7px 0px rgba(0, 0, 0, 0.2) !important;
    box-shadow: 0px 5px 7px 0px rgba(0, 0, 0, 0.2) !important;
}

#bookingPageContainer .room-number,
#bookingPageContainer .adult-count-select-container > p,
#bookingPageContainer .child-count-select-container > p {
    font-family: var(--rob-light) !important;
    font-weight: var(--rob-light-weight) !important;
}

#addRoomButton {
    font-family: var(--rob-light) !important;
    font-weight: var(--rob-light-weight) !important;
    border-radius: var(--regular-border-radius);
}

#bookingPageContainer .rooms-select-button {
    font-family: var(--rob-light) !important;
    font-weight: var(--rob-light-weight) !important;
    padding: 5px 10px !important;
}



/* room card window */
#bookingPageContainer .room-type,
#bookingPageContainer .carousel.slide {
    border-radius: var(--regular-border-radius) !important;
}

@media only screen and (max-width: 956px) {
    #bookingPageContainer .carousel.slide {
        border-radius: 0 !important;
    }
}

#bookingPageContainer .top {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -webkit-box-pack: justify !important;
    -ms-flex-pack: justify !important;
    justify-content: space-between !important;
    -webkit-box-align: center !important;
    -ms-flex-align: center !important;
    align-items: center !important;
    padding: 7px 15px !important;
    background-color: var(--regular-green) !important;
    border-radius: var(--regular-border-radius) var(--regular-border-radius) 0 0 !important;
}

#bookingPageContainer .name {
    font-family: var(--mon-bold) !important;
    font-weight: var(--mon-bold-weight) !important;
    font-size: 20px !important;
    color: white !important;
    text-align: left !important;
}

#bookingPageContainer .more-info-button {
    border: 1px solid white !important;
    border-radius: var(--regular-border-radius) !important;
    padding: 5px 10px !important;
}

#bookingPageContainer .more-info-button > span {
    font-family: var(--rob-light) !important;
    font-weight: var(--rob-light-weight) !important;
    color: white !important;
}

#bookingPageContainer .more-info-button > i {
    color: white !important;
}

#bookingPageContainer .more-info-button:hover {
    opacity: 0.5 !important;
}

#bookingPageContainer, .free-rooms-count {
    font-family: var(--rob-light) !important;
    font-weight: var(--rob-light-weight) !important;
}

#bookingPageContainer .room-type-modal-window-container {
    max-width: var(--container-width) !important;
    margin: 30px auto 0 auto !important;
    padding: 20px !important;
}

#bookingPageContainer .room-type-modal-window {
    border: none !important;
    border-radius: var(--regular-border-radius) !important;
}

#bookingPageContainer .room-type-name {
    font-family: var(--mon-bold) !important;
    font-weight: var(--mon-bold-weight) !important;
    font-size: 20px !important;
    color: var(--dark-color) !important;
}

#bookingPageContainer .image {
    border-radius: var(--regular-border-radius) !important;
}

#bookingPageContainer .characteristic-item > span {
    font-family: var(--rob-light) !important;
    font-weight: var(--rob-light-weight) !important;
    font-size: 16px !important;
}

#bookingPageContainer .description > p {
    margin-bottom: 15px !important;
}

#bookingPageContainer .description > p > span {
    font-family: var(--rob-light) !important;
    font-weight: var(--rob-light-weight) !important;
    font-size: 16px !important;
}

#bookingPageContainer .characteristic-item > span {
    font-family: var(--rob-light) !important;
    font-weight: var(--rob-light-weight) !important;
    font-size: 16px !important;
}

#bookingPageContainer .short-description > p {
    margin-bottom: 15px;
}

#bookingPageContainer .short-description > p > span {
    font-family: var(--rob-light) !important;
    font-weight: var(--rob-light-weight) !important;
    font-size: 16px !important;
}

#bookingPageContainer .condition {
    background-color: transparent !important;
}

#bookingPageContainer .condition > div,
#bookingPageContainer .condition-name,
#bookingPageContainer .condition-header > span {
    font-family: var(--rob-light) !important;
    font-weight: var(--rob-light-weight) !important;
    color: var(--dark-color) !important;
}

#bookingPageContainer .price {
    font-family: var(--mon-bold) !important;
    font-weight: var(--mon-bold-weight) !important;
    color: var(--regular-green) !important;
}

#bookingPageContainer .additional-info-panel {
    border-radius: var(--regular-border-radius) !important;
}

#bookingPageContainer .additional-info-panel > h4 {
    font-family: var(--mon-bold) !important;
    font-weight: var(--mon-bold-weight) !important;
}

#bookingPageContainer .service,
#bookingPageContainer .message {
    font-family: var(--rob-light) !important;
    font-weight: var(--rob-light-weight) !important;
}

#bookingPageContainer .select-button {
    font-family: var(--rob-light) !important;
    font-weight: var(--rob-light-weight) !important;
    background-color: var(--fruit-color) !important;
    color: white !important;
    border-radius: var(--bold-border-radius) !important;
    padding: 10px 20px;
}

#bookingPageContainer .select-button:hover {
    opacity: 0.5 !important;
}



/* personal info window */
#bookingPageContainer .personal-info-container > h3 {
    font-family: var(--mon-bold) !important;
    font-weight: var(--mon-bold-weight) !important;
}

#bookingPageContainer .personal-info-container,
#bookingPageContainer .booking-summary {
    border-radius: var(--regular-border-radius) !important;
}

#bookingPageContainer label {
    font-family: var(--rob-light) !important;
    font-weight: var(--rob-light-weight) !important;
}

#bookingPageContainer #surnameInput,
#bookingPageContainer #nameInput,
#bookingPageContainer #patronymicInput,
#bookingPageContainer #emailInput,
#bookingPageContainer #phoneNumberInput,
#bookingPageContainer #carNumberInput,
#bookingPageContainer #guestFullNameInput {
    height: 40px !important;
    background-color: rgba(70, 100, 28, 0.5) !important;
    border-radius: var(--regular-border-radius) !important;
    color: white !important;
}

#bookingPageContainer #surnameInput::-webkit-input-placeholder, #bookingPageContainer #nameInput::-webkit-input-placeholder, #bookingPageContainer #patronymicInput::-webkit-input-placeholder, #bookingPageContainer #emailInput::-webkit-input-placeholder, #bookingPageContainer #phoneNumberInput::-webkit-input-placeholder, #bookingPageContainer #carNumberInput::-webkit-input-placeholder, #bookingPageContainer #guestFullNameInput::-webkit-input-placeholder {
    color: white !important;
}

#bookingPageContainer #surnameInput::-moz-placeholder, #bookingPageContainer #nameInput::-moz-placeholder, #bookingPageContainer #patronymicInput::-moz-placeholder, #bookingPageContainer #emailInput::-moz-placeholder, #bookingPageContainer #phoneNumberInput::-moz-placeholder, #bookingPageContainer #carNumberInput::-moz-placeholder, #bookingPageContainer #guestFullNameInput::-moz-placeholder {
    color: white !important;
}

#bookingPageContainer #surnameInput:-ms-input-placeholder, #bookingPageContainer #nameInput:-ms-input-placeholder, #bookingPageContainer #patronymicInput:-ms-input-placeholder, #bookingPageContainer #emailInput:-ms-input-placeholder, #bookingPageContainer #phoneNumberInput:-ms-input-placeholder, #bookingPageContainer #carNumberInput:-ms-input-placeholder, #bookingPageContainer #guestFullNameInput:-ms-input-placeholder {
    color: white !important;
}

#bookingPageContainer #surnameInput::-ms-input-placeholder, #bookingPageContainer #nameInput::-ms-input-placeholder, #bookingPageContainer #patronymicInput::-ms-input-placeholder, #bookingPageContainer #emailInput::-ms-input-placeholder, #bookingPageContainer #phoneNumberInput::-ms-input-placeholder, #bookingPageContainer #carNumberInput::-ms-input-placeholder, #bookingPageContainer #guestFullNameInput::-ms-input-placeholder {
    color: white !important;
}

#bookingPageContainer #surnameInput::placeholder,
#bookingPageContainer #nameInput::placeholder,
#bookingPageContainer #patronymicInput::placeholder,
#bookingPageContainer #emailInput::placeholder,
#bookingPageContainer #phoneNumberInput::placeholder,
#bookingPageContainer #carNumberInput::placeholder,
#bookingPageContainer #guestFullNameInput::placeholder {
    color: white !important;
}

#bookingPageContainer .header > h4 {
    font-family: var(--mon-bold) !important;
    font-weight: var(--mon-bold-weight) !important;
}

#bookingPageContainer textarea {
    background-color: rgba(70, 100, 28, 0.5) !important;
    border-radius: var(--regular-border-radius) !important;
    color: white !important;
}

#bookingPageContainer .booking-summary > h3 {
    font-family: var(--mon-bold) !important;
    font-weight: var(--mon-bold-weight) !important;
}

#bookingPageContainer .room-type-name,
#bookingPageContainer .contract-condition-name,
#bookingPageContainer .adult-count,
#bookingPageContainer .date-arrival,
#bookingPageContainer .date-departure,
#bookingPageContainer .service > td {
    font-family: var(--rob-light) !important;
    font-weight: var(--rob-light-weight) !important;
}

#bookingPageContainer .book-now-button {
    background-color: var(--fruit-color);
    border-radius: var(--bold-border-radius) !important;
    font-family: var(--rob-light) !important;
    font-weight: var(--rob-light-weight) !important;
    color: white !important;
    padding: 15px;
}



/* booking result */
#bookingPageContainer .room-type-summary {
    background-color: rgba(0, 0, 0, 0.1) !important;
}

#bookingPageContainer .room-type-summary > div {
    border-radius: var(--regular-border-radius) !important;
}

#bookingPageContainer .room-type-name {
    font-family: var(--mon-bold) !important;
    font-weight: var(--mon-bold-weight) !important;
    color: white !important;
}

#bookingPageContainer .date-range > span,
#bookingPageContainer .guest-name {
    font-family: var(--rob-light) !important;
    font-weight: var(--rob-light-weight) !important;
}