/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.1
*/
.new-reserv-form .single-room__icon-header {
    background: #fff3e9;
    border-radius: 15px;
    padding: 14px 20px;
    margin-top: 35px;
    width: 100%;
    justify-content: center;
}
.col-white-room:first-child {
    padding-bottom: 2.3rem;
}
.line-separator {
    display: none !important;
}

.year-child{
    font-size: .6rem;
    color: #929292;
    position: absolute;
    top: -5px;
}
.discond-calendar {
    color: #fff;
    font-size: .55rem;
    margin-right: 2px;
    position: absolute;
    background: var(--fs-color-alert);
    line-height: 0;
    padding: 0.8em 1px;
    border-radius: 99px;
    top: -4px;
    left: -3px;
    transform: rotate(-20deg);
}
.mphb-calendar .mphb-date-cell{
   position: relative;    
}
.mphb-calendar .mphb-date-cell .mphb-date-cell__price {
    position: initial;
}
.mphb-price {
    letter-spacing: -0.03em;
}
@font-face {
    font-family: 'e-Ukraine';
    font-display: swap;
    src: url(fonts/e-Ukraine-Thin.woff2);
    font-weight: 200;
    font-style: normal;
}
@font-face {
    font-family: 'e-Ukraine';
    font-display: swap;
    src: url(fonts/e-Ukraine-UltraLight.woff2);
    font-weight: 300;
    font-style: normal;
}
@font-face {
    font-family: 'e-Ukraine';
    font-display: swap;
    src: url(fonts/e-Ukraine-Light.woff2);
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: 'e-Ukraine';
    font-display: swap;
    src: url(fonts/e-Ukraine-Regular.woff2);
    font-weight: 500;
    font-style: normal;
}
@font-face {
    font-family: 'e-Ukraine';
    font-display: swap;
    src: url(fonts/e-Ukraine-Medium.woff2);
    font-weight: 600;
    font-style: normal;
}
@font-face {
    font-family: 'e-Ukraine';
    font-display: swap;
    src: url(fonts/e-Ukraine-Bold.woff2);
    font-weight: 700;
    font-style: normal;
}
body {
    font-family: 'e-Ukraine' !important;
    font-weight: 400 !important;
}
.footer-wrapper {
    z-index: 0;
}
b, strong {
    font-weight: 600;
}
.h3, h3 {
    font-weight: 500;
}
.o-hidden {
    overflow: hidden;
}
.col.margin-right-0 > .col-inner{
    margin-right: 0;
    margin-left: auto;
}
.uppercase, h6, span.widget-title, th {
    letter-spacing: normal;
}
.is-uppercase, .uppercase {
    line-height: 1.3;
}
.text-balance {
    text-wrap: balance;
}
.font-300{
   font-weight: 300; 
}
.font-500 {
    font-weight: 500; 
}
.font-14{
    font-size: 0.875rem;
}
.margin-b-0 p{
    margin-bottom:0;
}
.center {
    left: 50%;
    transform: translateX(-50%);
}
.z-1{
    z-index: -1
}
.m-left > .col-inner{
    margin-left: 0;
    margin-right: auto;
}
.m-right > .col-inner{
    margin-left: auto;
    margin-right: 0;
}
.m-0-auto > .col-inner{
        margin: 0 auto !important;
}
.scaleX15{ 
    transform: scaleX(-1.5);
}
.text-nowrap {
    white-space: nowrap;
}
.section-content-bottom .section-content{
    margin-bottom: 0;
    margin-top: auto;
}
.video-overlay {
    /*background-image: url(/wp-content/uploads/2024/06/grain-pattern.png);*/
    /* background-color: #FFFFFF33; */
    background-position: center center;
    background-repeat: repeat;
    background-size: auto;
    z-index: 1;
}


/******************  BUTTONS ******************/
.header-nav-main {
    padding-left: 5%;
}
.button, button{
    margin-bottom: 0;
}
.button, button, input[type=button], input[type=reset], input[type=submit] {
    font-weight: 400;
    letter-spacing: normal;
}
.button.white {
    font-size: 0.875rem;
    padding: 1.072em 2.034em;
    text-transform: uppercase;
}
.white {
    background-color: #fff !important;
    color: #000 !important;
}
.button > svg {
    width: 1.5em;
    margin-left: 0.3em;
}
.button.white.is-large {
    font-size: 1.1rem;
    padding: 1.072em 3.034em;
}
.button.prymary.is-outline, .button.primary.is-outline, .mphb-button{
    border: 1px solid #00000080;
    color: #000;
    font-size: 0.875rem;
    padding: 1.072em 2.034em;
    height: auto;
    line-height: normal;
    text-transform: uppercase;
     background: transparent;
}
.button.is-outline:hover, .button.primary.is-outline:hover, .button.prymary.is-outline:hover, .mphb-button:hover{
    background-color: var(--fs-color-primary);
    border-color: var(--fs-color-primary);
    color: #fff;
}

.dark .button.prymary.is-outline, .dark .button.primary.is-outline, .dark .mphb-button:hover {
    border: 1px solid #ffffff80;
    color: #fff;
}
.dark .button.is-outline:hover, .dark .button.primary.is-outline:hover, .dark .button.pryimary.is-outline:hover, .dark .mphb-button:hover{
    background-color: #fff;
    border-color: #fff;
    color: #000;
}
.button.mphb-confirm-reservation {
    margin: 0;
    margin-top: 1rem;
    background: #BDA387;
    border-color: #BDA387;
    color: #fff;
    border-color: #fff;
    width: 100%;
    padding: 1.6em 2.034em;
    /* text-transform: uppercase; */
    /* font-weight: 400; */
}


/****************   select   ****************/
.select-resize-ghost, .select2-container .select2-choice, .select2-container .select2-selection, select {
    box-shadow: none;
    padding-right: 1.4em;
    border-radius: 99px;
    font-size: 0.875rem;
    padding: 1.072em 2.034em;
    padding-right: 3em;
    height: auto;
    border-color: #00000080;
    background-position: right 1.2em top 50%;
}
input[type=email]:focus, input[type=number]:focus, input[type=password]:focus, input[type=search]:focus, input[type=tel]:focus, input[type=text]:focus, select:focus, textarea:focus {
    box-shadow: none;
}

/****************   HEADER   ****************/

.header-full-width .container {
    padding: 0;
}
.header.transparent {
    border-bottom: 1px solid #ffffff40;
}
.header {
    border-bottom: 1px solid #00000040;
}
.header.transparent .header-button-1 .header-button {
    border-left: 1px solid #ffffff40;
}
.header-button-1 .header-button {
    border-left: 1px solid #00000040;
}
.header-button-1 .button.primary.is-link {
    font-size: 1rem;
    text-transform: uppercase;
    color: #000;
    display: flex;
    align-items: center;
    height: 113px;
    padding: 0 3rem;
    border-radius: 0 !important;
    
}
.header.transparent .header-button-1 .button.primary.is-link{
    color:#fff;
}
.header-button-1 .button.primary.is-link:hover {
    background-color: #31313152 !important;
}
.burger-icon {
    display: flex;
    flex-direction: column;
    gap: 6px;
    gap: 0.375rem;
    align-items: flex-end;
    margin-right: 12px;
    margin-right: 0.7rem;
}
.burger-icon span {
    height: 2px;
    height: 0.125rem;
    width: 27px;
    width: 1.6875rem;
    display: block;
    background-color: #000;
}
.header.transparent .burger-icon span {
    background-color: #fff;
}
.burger-icon span:nth-child(2) {
    width: 23px;
    width: 1.4375rem;
    transition: .3s all;
}
.menu-burger-new:hover .burger-icon span:nth-child(2) {
    width: 27px;
    width: 1.6875rem;
}
.nav-column>li>a, .nav-dropdown>li>a, .nav-vertical-fly-out>li>a, .nav>li>a {
    color: #000;
}
.nav>li>a {
    font-size: 1rem;
}
.nav>li.html {
    font-size: 1rem;
    color: #393939 !important;
    margin-right: 3rem;
}
.header.transparent .nav>li.html {
    color: #f0f0f0 !important;
}
.dark .nav-vertical li li.menu-item-has-children>a, .dark .nav-vertical-fly-out>li>a, .dark .nav-vertical>li>ul li a, .dark .nav>li.html, .dark .nav>li>a, .nav-dark .is-outline, .nav-dark .nav>li>a, .nav-dark .nav>li>button, .nav-dropdown.dark .nav-column>li>a, .nav-dropdown.dark>li>a {
    color: #fff;
}

/****************   HOME SECTION 1   ****************/
.section-1-logo {
    max-width: 26.8rem;
}
.section-1-title h1 {
    font-size: 6.25rem;
    font-weight: 400;
    margin-bottom: 0;
}
.section-1-title-a h1 {
    font-size: 6.25rem;
    font-weight: 400;
    margin-bottom: 0;
}

/*.section-1-form form {
    display: flex;
    justify-content: center;
    max-width: 1050px;
    margin: 0 auto;
    gap: 3rem;
}*/

.section-1-form form {
    display: flex;
    justify-content: center;
    max-width: 73.125rem;
    margin: 0 auto;
    gap: 3rem;
    background: #1f1f1f24;
    backdrop-filter: blur(13px);
    padding: 2.1875rem 1.5625rem 1.125rem 1.5625rem;
    border-radius: 99px;
    border: 1px solid #00000008;
}
/*.section-1-form form {
    display: flex;
    justify-content: center;
    max-width: max-content;
    margin: 0 auto;
    gap: 2rem;
    background: #bda387;
    backdrop-filter: blur(13px);
    padding: 12px 15px 12px 20px;
    border-radius: 99px;
    border: 1px solid #00000008;
}*/
.section-1-form form {
    display: flex;
    justify-content: center;
    max-width: max-content;
    margin: 0 auto;
    gap: 2rem;
    background: transparent;
    backdrop-filter: blur(1px);
    padding: 12px 15px 12px 20px;
    border-radius: 99px;
    /*border: 1px solid #ffffff;*/
}

@media (max-width: 1450px) and (min-width: 850px) {

}


.section-1-form form .form-search-new {
    display: flex;
    gap: 2.5rem;
}
.section-1-form form .form-search-new > div{
    flex-basis: 25%;
    width: 25%;

}

/*.section-1-form input[type=text], .section-1-form select {
    background-color: transparent;
    border: none;
    border-bottom: 1px solid #ffffff73;
    border-radius: 0;
    box-shadow: none;
    box-sizing: border-box;
    color: #fff;
    font-size: 1rem;
    height: 3em;
    max-width: 100%;
    padding: 0;
   text-shadow: 0px 1px 4px #0000008c;
}*/

.section-1-form input[type=text], .section-1-form select {
    background-color: transparent;
    border: none;
    border-bottom: 1px solid #ffffff73;
    border-radius: 0;
    box-shadow: none;
    box-sizing: border-box;
    color: #fff;
    font-size: 1rem;
    height: 2.5em;
    max-width: 100%;
    padding: 0;
    text-shadow: none;
    font-weight: 300;
}
.section-1-form .mphb_sc_search-check-in-date input[type="text"], .section-1-form .mphb_sc_search-check-out-date input[type="text"] {
    background-position: right 0.2em top 0.7em;
}
.section-1-form select option {
    background: white;
    color: black;
    padding: 10px;
}
.section-1-form input::placeholder {
   color: #fff;
}
.section-1-form select {
     background-image: url("data:image/svg+xml;charset=utf8, %3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-chevron-down'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");

}
/*.section-1-form .mphb_sc_search-submit-button-wrapper {
    flex: 1;
    max-width: 11rem;
}*/

.section-1-form .mphb_sc_search-submit-button-wrapper {
    flex: 1;
    max-width: 16rem;
}

.section-1-form .mphb_sc_search-submit-button-wrapper .button{
    margin: 0;
    font-size: 0.875rem;
    font-weight: 400;
    background: transparent;
    border: 1px solid #ffffff73;
    height: 3rem;
    width: 100%;
}
/*.section-1-form .mphb_sc_search-submit-button-wrapper .button {
    background-image: url('data:image/svg+xml,<svg width="20" height="11" viewBox="0 0 20 11" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M14 0.5L19 5.5M19 5.5L14 10.5M19 5.5H1" stroke="white" stroke-opacity="0.5" stroke-linecap="round" stroke-linejoin="round"/></svg>');
    background-repeat: no-repeat;
    background-position: right 2.2em top 1.19em;
    background-size: 1.3rem;
    padding-right: 2.6em;
    transition: .3s all;
}*/

.section-1-form .mphb_sc_search-submit-button-wrapper .button {
    background-image: url('data:image/svg+xml,<svg width="20" height="11" viewBox="0 0 20 11" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M14 0.5L19 5.5M19 5.5L14 10.5M19 5.5H1" stroke="white" stroke-opacity="0.5" stroke-linecap="round" stroke-linejoin="round"/></svg>');
    background-repeat: no-repeat;
    background-position: right 1.5em top 1.19em;
    background-size: 1.3rem;
    padding-right: 3rem;
    padding-left: 1.25rem;
    transition: .3s all;
}

.section-1-form .mphb_sc_search-submit-button-wrapper .button:hover {
    background-position: right 1.1em top 1.19em;
}


/****************   HOME SECTION 2   ****************/
.section-2-svg {
    position: absolute;
    bottom: 5%;
    max-height: 892px;
}

.rooms-slider-home__swiper-next-slide svg {
    margin-right: 25%;
    margin-left: auto;
    display: block;
    margin-bottom: 60px;
    cursor: pointer;
    transition: .3s;
}
.rooms-slider-home__swiper-next-slide svg:hover {
    transform: scale(1.2);
}
.rooms-slider-home {
    margin-top: -6rem;
}
.rooms-slider-home__gallery img {
    aspect-ratio: 1 / 0.9;
}

.col.col-room-info {
    margin-bottom: 0;
    margin-top: auto;
}
.col.col-room-info > .col-inner {
    padding-left: 3rem;
}
.rooms-slider-home__info h3 {
    /*font-size: 6rem;*/
    font-size: 5.5rem;
    font-weight: 400;
    text-transform: uppercase;
    line-height: 1.3;
}
.rooms-slider-home__info h3 span {
    font-size: 0.65em;
    /*opacity: .6;*/
    margin-top: .3em;
    display: block;
    /*position: absolute;*/
}
.rooms-slider-home__info .info-bottom {
    display: flex;
    /*align-items: flex-end;*/
    justify-content: space-between;
    gap: 5rem;
}
.rooms-slider-home__info .info-bottom > div {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1em;
}
.rooms-slider-home__info .info-bottom > div .excerpt {
    font-size: .875rem;
    max-width: 25rem;
    text-wrap: balance;
    opacity: .8;
    font-weight: 200;
}
.rooms-slider-home__info .info-bottom ul {
    font-size: 0.875rem;
    text-transform: uppercase;
}
.rooms-slider-home__info .info-bottom ul > li {
    margin-bottom: .4em;
}
    
.swiper {
  width: 100%;
}

.swiper-slide {
  display: flex;
  justify-content: center;
  align-items: center;
}
.swiper-slide img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}


.swiper-page-button-next, .swiper-page-button-prev {
    position: absolute;
    display: block;
    top: 40%;
    transform: translateY(-40%);
    z-index: 1;
    cursor: pointer;
}
.swiper-page-button-next {
    right: 5vw;
}
.swiper-page-button-prev {
    left: 5vw;
}

.swiper-page-button-next.arrow-room-next {
    right: 1vw;
}
.swiper-page-button-prev.arrow-room-prev {
    left: 1vw;
}
.swiper-page-button-next.arrow-room-next, .swiper-page-button-prev.arrow-room-prev {
    position: absolute;
    display: block;
    top: 50%;
    transform: translateY(-40%);
    z-index: 1;
    cursor: pointer;
}

.swiper-page-button-next svg, .swiper-page-button-prev svg {
    max-width: 7rem;
}

@media only screen and (max-width: 550px) {
    .swiper-page-button-next svg, .swiper-page-button-prev svg {
        max-width: 4rem;
    }
    .swiper-page-button-next.arrow-room-next, .swiper-page-button-prev.arrow-room-prev {
        top: 30%;
        transform: translateY(-40%);
    }
    
}

.swiper-page-button-next svg path, .swiper-page-button-prev svg path {
    transition: .3s all;
}
.swiper-page-button-next:hover svg path {
    transform: translateX(27px);
}
.swiper-page-button-prev:hover svg path {
    transform: translateX(-27px);
}

/*.page-slider .swiper-slide {
    width: 80%;
    max-width: calc(600px + 200px);
    padding: 0 100px;
}*/
.page-slider .swiper-slide {
    width: 50vw;
    display: flex;
}
/*.page-slider .swiper-slide .swiper-slide__inner{
    max-width: calc(37.5rem + 12.5rem);
    padding: 0 6.25rem;
}*/

.page-slider .swiper-slide .swiper-slide__inner {
    max-width: calc(43.5rem + 6.5rem);
    padding: 0 3.25rem;
}

.page-shotcode__img {
    position: relative;
}
.page-shotcode__img img {    
    aspect-ratio: 1 / 0.9;
}
/*.page-shotcode__img img {    
    aspect-ratio: 1 / 1;
}*/
/*.swiper-slide:not(.swiper-slide-active) .page-shotcode__img img{
    width: 90%;
    margin-top: 5%;
} */
.swiper-slide-active .page-shotcode__img .text {
    display:block;
}
.swiper-slide-active .page-shotcode__img .text {
        opacity: 1;
        transform: translate(-50%, -50%);
}
.page-shotcode__img .text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, 0%);
    font-size: 8rem;
    line-height: normal;
    width: 155%;
    text-transform: uppercase;
    text-align: center;
    opacity: 0;
    transition: transform 1.6s, opacity .7s ease-in;
}
.swiper-slide:not(.swiper-slide-active) .text {
    opacity: 0;
    transform: translate(-50%, 0%);
    transition: none;
}
.page-shotcode__img .white-text {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    overflow: hidden;
}
.page-shotcode__img .white-text .text{
    /*mix-blend-mode: difference;*/
	mix-blend-mode: hard-light;
    color: #fff;    
}





.swiper-slide-active .page-shotcode__info {
    opacity: 1;
}  
.page-shotcode__info p {
    flex: 0 1 auto;
    margin: 0;
    text-wrap: balance;
}
.page-shotcode__info .button{
    margin: 0;
    flex: 1 0 auto;
}
.page-shotcode__info {
     opacity: 0;
    display: flex;
    align-items: flex-end;
    gap: 4rem;
    margin-top: 1.6rem;
}

.pagination-title {
    display: flex;
    margin-bottom: .85em;
    gap: 0.6em;
}   
.pagination-title .next-custom {
    font-weight: 300;
}
    
    
    
/****************   HOME SECTION 3   ****************/
.section-3-svg {
    position: absolute;
    top: 12%;
    max-height: 1000px;
}
.rooms-slider-home__info .discound {
    display: none;
}
.rooms-slider-home__info .old-price{
    margin-right: .5em;
    opacity: .5;
}
.rooms-slider-home__gallery .box-image {
    padding-top: 90% !important;
}
.dark .rooms-slider-home__gallery svg path {
    stroke: white;
}
/****************   HOME SECTION 4   ****************/

.new_tabbed.tabbed-content .nav-vertical {
    padding-top: 0;
    width: 100%;
    gap: 1.3rem;
}

.top-section-tab {
    padding-top: 0;
    width: 40%;
    display: flex;
    flex-direction: column;
    gap: 3rem;
}
.top-section-tab+.tab-panels{
    flex: 1;
}
.tab-panels.buttons_tabbet {
    padding: 0;
    border: none;
    display: flex;
    align-items: flex-end;
    margin-bottom: 2rem;
}
.new_tabbed .nav-vertical>li+li {
    border-top: none;
}
.new_tabbed .nav-vertical>li a {
    font-size: 2.85rem;
    text-transform: uppercase;
    color: #848581;
}
.new_tabbed .nav-vertical>li.active a {
    color: #000;
}
.new_tabbed .nav-vertical>li:hover a {
    color: #000;
}
.new_tabbed .nav-vertical>li.active a span {
    border-bottom: 2px solid #000;   
}
.dark .new_tabbed .nav-vertical>li.active a {
    color: #fff;
}
.dark .new_tabbed .nav-vertical>li:hover a {
    color: #fff;
}
.dark .new_tabbed .nav-vertical>li.active a span {
    border-color: #fff;
}

/****************   FOOTER   ****************/
.text.footer-text {
    margin-bottom: 2rem;
}
.text.footer-text:last-child {
    margin-bottom: 0;
}
.text.footer-text p{
    margin-bottom: .5em;
}

.text.footer-text p:first-child{
    opacity: .4;
    margin-bottom: 0.2rem;
}
.text.footer-text p strong{
    font-size: 1.5em;
}

/*************** MAIN MENU.   ***************/
.main-menus-overlay+.off-canvas-left .mfp-content {
    --drawer-width: 100%;
    background-color: rgb(49, 49, 49);
}
.main-menus-overlay+.off-canvas-left .mfp-content:before {
    content: '';
    height: 100%;
    width: 1px;
    display: block;
    position: absolute;
    background: #565656;
    left: 47%;
    top: 0;
    transform: translateX(-47%);
    z-index: 1;
}
.main-menu-block .ux-menu-link__link {
    color: #8E8E8E;
    font-size: 2rem;
    text-transform: uppercase;
    font-weight: 600;
    min-height: auto;
    padding: 0.2em 0em;
}
.main-menu-block .ux-menu-link--active .ux-menu-link__link, .main-menu-block .ux-menu-link:hover .ux-menu-link__link {
    color: #FFFFFF;
}
.mfp-ready .mfp-close {
    opacity: 1;
    border: 1px solid #fff;
    color: #fff;
    background: transparent;
    height: 5.6rem;
    line-height: 5.6rem;
    width: 5.6rem;
    right: 3%;
    top: 35px !important;
}
.mfp-ready .mfp-close:hover {
    border-color: #111;
    color: #111;
    background: #fff;
}


/*************** SEARCH RESULT   ***************/
.title-page-top h1 {
    font-size: 5rem;
    margin-bottom: 0;
    font-weight: 600;
}
.title-page-top h1 span {
    color: #000;
    text-transform: lowercase;
}
.mphb_sc_search_results-info-date  {
    opacity: .4;
    margin-bottom: 4rem;
}
.mphb-empty-cart {
    display:none;
}
.result-row-room-new {
    background: #fff;
    border-radius: 30px;
}
.result-row-room-new > .col {
    
}
.result-row-room-new > .col > .col-inner {
    padding: 3.4rem;
    /*padding-bottom: 2rem;*/
}
.result-row-room-new > .col:nth-child(1) > .col-inner {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 2rem;
}
.result-row-room-new > .col:nth-child(2) > .col-inner {
    border: 1px solid #D0D0D0;
    border-top: none;
    border-bottom: none;
}
.result-row-room-new .entry-title{
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: .85em;
}
.result-row-room-new .excerpt{
    font-size: .875rem;
    font-weight: 300;
}
.result-row-room-new .facility_loop {
    display: flex;
    gap: 4rem;
    margin-top: 3rem;
}
.result-row-room-new .facility_loop ul {
    margin-bottom: 0;
    font-size: 0.8rem;
    text-transform: lowercase;
    font-weight: 300;
}
.result-row-room-new .facility_loop ul li{
    margin-bottom: .2em;
}
.single-room__icon-header {
    display: inline-flex;
    gap: 1rem;
}
.rooms-slider-home__gallery .single-room__icon-header {
    background: #313131;
    padding: 0.5rem 1.5rem;
    border-radius: 99px;
    margin: 0 auto;
    position: absolute;
    bottom: 4rem;
    z-index: 1000;
    left: 50%;
    transform: translateX(-50%);
    width: max-content;
}
.icon-header_item {
    display: inline-flex;
    gap: 0.8125rem;
    font-size: .8rem;
    font-weight: 300;
    align-items: center;
}
.icon-header_item > span {
    display: flex;
    flex-direction: column;
}
.icon-header_item > span > span {
    opacity: .6;
    font-size: .8em;
}
.loop-room_gallery-pagination {
    display: flex;
    font-size: .75rem;
    font-weight: 500;
    justify-content: space-between;
    gap: 1rem;
    text-align: center;
    margin-top: 10px;
}
.loop-room_gallery-pagination svg{
  max-width: 1.1875rem;
  cursor: pointer;
}
.sale_discond_text {
    color: var(--fs-color-alert);
    font-size: .875rem;
    margin-bottom: 1.2em;
}
.mphb_sc_search_results-wrapper .mphb-reserve-room-section:not(.mphb-rooms-added) .mphb-remove-from-reservation {
    display: none !important;
}
.mphb-empty-cart {
    display: none !important;;
}
.mphb_sc_search_results-wrapper .mphb-reservation-cart {
    margin-bottom: 0;
    position: fixed;
    background: #fff;
    max-width: 350px;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    z-index: 5;
    border: 1px dashed;
    padding: 1rem 2rem;
    bottom: 6%;
    right: 2%;
    border-radius: 20px;
}

.price_button {
    display: inline-flex;
    align-items: center;
    width: 100%;
    gap: .4rem;
}
.price_button .button {
    margin-right: .3em;
}


.mphb-remove-from-reservation {
    margin-top: 1em;
    color: var(--fs-color-alert);
    font-size: .85rem;
    text-decoration: underline;
    text-align: center;
    display: block;
}
.sale_price {
    opacity: .4;
}
select.mphb-rooms-quantity {
    width: 6rem;
    background-color: #e6e0dc;
    border-color: #e6e0dc;
    margin-bottom: 0;
    background-position: right 1rem top 50% !important;
}
.room_counts {
    color: var(--fs-color-success);
    font-size: 0.875rem;
    margin-top: 1em;
}
.mphb_sc_rooms-wrapper .mphb-room-type:not(:first-of-type), .mphb_sc_search_results-wrapper .mphb-room-type:not(:first-of-type), .mphb_sc_services-wrapper .mphb-service:not(:first-of-type) {
    margin-top: 1rem;
}
.facility-link {
    display: flex;
    align-items: center;
    gap: .5em;
    border-bottom: 1px dashed;
    width: fit-content;
    margin-left: 1.3em;
    margin-top: 5px;
}
.facility-link svg {
    max-width: 1.4em;
}

/*************** SINGLE ROOM  ***************/
.section-single-room {
    padding-top: 3rem;
}
.section-single-room .row-title {
    margin-bottom: 2.5rem;
}

.singleRoomGallery {
    margin-top: .5rem;
}
.singleRoomGallery img{
    opacity: .4;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    cursor:pointer;
}
.singleRoomGallery .swiper-slide-thumb-active img, .singleRoomGallery img:hover{
    opacity: 1;
}
.section-single-room .col-inner.gallery-inner {
    padding-right: 3rem;
}
.col-white-room {
    background: #fff;
    border-radius: 30px;
    padding: 3rem;
    margin-bottom: 2rem;
}
.col-inner > .col-white-room:last-child {
    margin-bottom: 0rem;
}
.new-reserv-form .mphb-reservation-form-title, .mphb-calendar-title {
    display:none;
}
/*.new-reserv-form .mphb-period-price-old, .new-reserv-form .price-container {
    display: flex;
    flex-direction: column;
    line-height: normal;
}*/
/*.new-reserv-form .mphb-period-price-old, .new-reserv-form .price-container {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row-reverse;
    line-height: normal;
    justify-content: flex-end;
    align-items: center;
    gap: .5rem;
}*/
/*.new-reserv-form .mphb-period-price-old del, .new-reserv-form .price-container del {
    color: #B8B8B8;
    font-size: 1.9rem;
}*/
/*.new-reserv-form .mphb-period-price-old del, .new-reserv-form .price-container del {
    color: #B8B8B8;
    font-size: 1.4rem;
    font-weight: 200;
}*/
.new-reserv-form .regular-price {
    flex: 1;
    flex-basis: 100%;
}
/*.new-reserv-form .mphb-period-price-old .discount, .new-reserv-form .price-container .discound{
    color: var(--fs-color-alert);
    font-size: .875rem;
}*/
.new-reserv-form .mphb-period-price-old .discount, .new-reserv-form .price-container .discound {
    color: var(--fs-color-alert);
    font-size: .875rem;
    margin-top: 3px;
}
.new-reserv-form .mphb-period-price {
    line-height: normal;
}
/*.new-reserv-form .mphb-period-price .mphb-price, .new-reserv-form .price-container .mphb-price{
    font-size: 2.5rem;
    font-weight: 500;
}*/
.new-reserv-form p.mphb-regular-price {
    margin-bottom: 0;
}
.new-reserv-form select.mphb-rooms-quantity {
    width: 100%;
    margin-bottom: .5em;
}
.new-reserv-form .rooms-count{
    font-size: .75rem;
    text-align: center;
    color: var(--fs-color-success);
    margin-bottom: .5em;
}
.new-reserv-form .mphb-error {
    color: var(--fs-color-alert);
    text-align: center;
    font-size: .75rem;
    margin-bottom: .5em;
}

.new-reserv-form .single-room__icon-header {
    gap: 2rem;
}
.line-separator {
    display: block;
    height: 1px;
    width: 100%;
    background-color: rgb(0 0 0 / 6%);
    margin: 2.5rem 0 2rem 0;
}
.snidanok {
    display: block;
    position: absolute;
    top: -6%;
    right: 8rem;
}
.snidanok svg {
    max-width: 8.3rem;
}
.content-single-room__border {
    padding: 2rem 3rem;    
}
.content-single-room__border .title-block {
    display: flex;
    justify-content: space-between;
    gap: 2rem;   
    align-items: center;
    cursor:pointer;
}
.content-single-room__border .title-block h5{
    margin-bottom:0;
    font-weight: 600;
}
.content-single-room__border .title-block .button-plus {
    font-size: 2rem;
    font-weight: 200;
    color: #B5B5B5;
    line-height: 1;
    width: 2rem;
    height: 2rem;
    display: flex;
    align-items: center;
    justify-content: center;
    transform: rotate(0deg);  
    transition: .3s all;
}
.content-single-room__border .title-block:hover .button-plus {
    transform: rotate(45deg); 
}
.content-single-room__border .title-block .button-plus.active {
    transform: rotate(45deg); 
}
.content-single-room__border .border-content{
    margin-top:1.3rem;
    display: none;
    font-size: .875rem;
    transition: .3s all;
}
.content-single-room__border .border-content.active{
    display: block;
}
.content-single-room__border .border-content p:last-child {
    margin-bottom:0;
}
.content-single-room__border .border-content ul {
    font-size: .875rem;
}
.content-single-room__border .border-content ul:last-child, .content-single-room__border .border-content ul li:last-child {
    margin-bottom: 0;
}
/*************** FORMS  ***************/
form.mphb-booking-form {
    margin-bottom: 0;
}
form.mphb-booking-form p {
    margin-bottom: 0;
}
.form_buttom_flat input[type=text], .form_buttom_flat select:not(.mphb-rooms-quantity) {
    background-color: transparent;
    border: none;
    border-bottom: 1px solid #0000002e;
    border-radius: 0;
    box-shadow: none;
    box-sizing: border-box;
    color: #000;
    font-size: 1rem;
    height: 3em;
    max-width: 100%;
    padding: 0;
    margin-bottom: 0;
}
/*.form-col-half {
    width: calc(50% - 5%);
    float: left;
    margin-right: 5%;
    margin-bottom: 0;
}*/
.form-reserved-input {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem;
}
.form-col-half {
    flex: 0 0 calc(50% - 0.75rem);
}
.form-reserved-and-button {
    display: flex;
    align-items: flex-end;
    gap: 2rem;
    margin-top: 2rem;
    
}
.form-reserved-and-button input{
    margin: 0;
}
.form-reserved-and-button select {
    background-position: right 0 top 50%;
}
.form-col-half, .form-col-half select {
  position: relative;
}
.form-col-half .placeholder {
    position: absolute;
    z-index: 1;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    background: #fff;
}

/*************** DARK FORM  ***************/
.form-search-dark .mphb_sc_search-form {
    display: flex;
    width: 90%;
    gap: 10rem;
    align-items: flex-end;
    margin-bottom: 0;
}
.form-search-dark .form-search-new{
    flex: 1;
    display: flex;
    gap: 6rem;
    flex-wrap: wrap;
}
.form-search-dark .form-search-new > div{
    width: calc(50% - 3rem);
}
.form-search-dark .form-search-new input, .form-search-dark .form-search-new select{
    margin-bottom:0;
}
.form-search-dark .form-search-new input, .form-search-dark .form-search-new select{
    background-color: transparent;
    border: none;
    border-bottom: 2px solid #ffffff73;
    border-radius: 0;
    box-shadow: none;
    box-sizing: border-box;
    color: #fff;
    font-size: 2rem;
    height: 3em;
    max-width: 100%;
    padding: 0;
}
.form-search-dark .mphb_sc_search-check-in-date input[type="text"], .form-search-dark .mphb_sc_search-check-out-date input[type="text"] {
    background-size: 1.875rem;
}
.form-search-dark select {
     background-image: url("data:image/svg+xml;charset=utf8, %3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-chevron-down'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
     background-size: 1.875rem;
     background-position: right 0 top 50%;

}
.form-search-dark select option {
    background: white;
    color: black;
    font-size: 1rem;
    padding: 1em 2em;
}
.form-search-dark .mphb_sc_search-submit-button-wrapper .button {
    margin: 0;
    font-size: 1.6rem;
    font-weight: 400;
    color: #000;
    background: #fff;
    border: 1px solid #fff;
    height: auto;
    line-height: normal;
    width: 100%;
    padding: 1em 3em;
}
.mfp-container {
    padding: 0;
}
#main-search .row {
    margin: 0 auto;
}
.datepick-popup {
    z-index: 10000;
}


/****************** spa page ******************/
.spa-tab .top-section-tab {
    margin-top: 5rem;
}
.spa-tab .tab-panels.buttons_tabbet {
    display: none;
}

/****************** koreni page ******************/
.koreni-logo .ux-logo-link {
    padding: 0 !important;
}



.mphb-check-in-date-wrapper input[type="text"], 
.mphb-check-out-date-wrapper input[type="text"], 
.mphb_sc_search-check-in-date input[type="text"], 
.mphb_sc_search-check-out-date input[type="text"], 
.mphb_widget_search-check-in-date input[type="text"], 
.mphb_widget_search-check-out-date input[type="text"] {
    background-repeat: no-repeat;
    background-position: right 0.2em top 1em;
        background-size: .875rem;
    padding-right: 1.6em;
    background-image: url('data:image/svg+xml,<svg width="14" height="16" viewBox="0 0 14 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M12.5 2C12.9166 2 13.2708 2.14583 13.5625 2.4375C13.8541 2.72916 14 3.08334 14 3.5V14.5C14 14.9166 13.8541 15.2708 13.5625 15.5625C13.2708 15.8541 12.9166 16 12.5 16H1.5C1.08334 16 0.729166 15.8541 0.4375 15.5625C0.145834 15.2708 0 14.9166 0 14.5V3.5C0 3.08334 0.145834 2.72916 0.4375 2.4375C0.729166 2.14583 1.08334 2 1.5 2H3V0.375C3 0.270834 3.03646 0.182291 3.10938 0.109375C3.18229 0.036459 3.27082 0 3.37498 0H4.62498C4.72915 0 4.81769 0.036459 4.89061 0.109375C4.96353 0.182291 4.99998 0.270834 4.99998 0.375V2H8.99998V0.375C8.99998 0.270834 9.03644 0.182291 9.10936 0.109375C9.18228 0.036459 9.27082 0 9.37498 0H10.625C10.7291 0 10.8177 0.036459 10.8906 0.109375C10.9635 0.182291 11 0.270834 11 0.375V2H12.5ZM12.3125 14.5C12.3541 14.5 12.3958 14.4791 12.4375 14.4375C12.4791 14.3958 12.5 14.3541 12.5 14.3125V4.99998H1.5V14.3125C1.5 14.3541 1.52083 14.3958 1.5625 14.4375C1.60417 14.4791 1.64583 14.5 1.6875 14.5H12.3125Z" fill="currentColor" fill-opacity="0.8"/></svg>');
}

.dark .mphb-check-in-date-wrapper input[type="text"], 
.dark .mphb-check-out-date-wrapper input[type="text"], 
.dark .mphb_sc_search-check-in-date input[type="text"], 
.dark .mphb_sc_search-check-out-date input[type="text"], 
.dark .mphb_widget_search-check-in-date input[type="text"], 
.dark .mphb_widget_search-check-out-date input[type="text"] {
    background-image: url('data:image/svg+xml,<svg width="14" height="16" viewBox="0 0 14 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M12.5 2C12.9166 2 13.2708 2.14583 13.5625 2.4375C13.8541 2.72916 14 3.08334 14 3.5V14.5C14 14.9166 13.8541 15.2708 13.5625 15.5625C13.2708 15.8541 12.9166 16 12.5 16H1.5C1.08334 16 0.729166 15.8541 0.4375 15.5625C0.145834 15.2708 0 14.9166 0 14.5V3.5C0 3.08334 0.145834 2.72916 0.4375 2.4375C0.729166 2.14583 1.08334 2 1.5 2H3V0.375C3 0.270834 3.03646 0.182291 3.10938 0.109375C3.18229 0.036459 3.27082 0 3.37498 0H4.62498C4.72915 0 4.81769 0.036459 4.89061 0.109375C4.96353 0.182291 4.99998 0.270834 4.99998 0.375V2H8.99998V0.375C8.99998 0.270834 9.03644 0.182291 9.10936 0.109375C9.18228 0.036459 9.27082 0 9.37498 0H10.625C10.7291 0 10.8177 0.036459 10.8906 0.109375C10.9635 0.182291 11 0.270834 11 0.375V2H12.5ZM12.3125 14.5C12.3541 14.5 12.3958 14.4791 12.4375 14.4375C12.4791 14.3958 12.5 14.3541 12.5 14.3125V4.99998H1.5V14.3125C1.5 14.3541 1.52083 14.3958 1.5625 14.4375C1.60417 14.4791 1.64583 14.5 1.6875 14.5H12.3125Z" fill="white" fill-opacity="0.8"/></svg>');
}

/**** SVG ANOMATION ****/
@-webkit-keyframes animate-svg-stroke-1 {
  0% {
    stroke-dashoffset: 3583.6044921875px;
    stroke-dasharray: 3583.6044921875px;
  }

  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 3583.6044921875px;
  }
}

@keyframes animate-svg-stroke-1 {
  0% {
    stroke-dashoffset: 3583.6044921875px;
    stroke-dasharray: 3583.6044921875px;
  }

  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 3583.6044921875px;
  }
}
@media(prefers-reduced-motion:no-preference) {
    .slider [data-animate],[data-animate] {
        animation-fill-mode: forwards;
        -webkit-backface-visibility: hidden;
        opacity: 1!important;
        transition: filter 1.3s,transform 1.6s,opacity .7s ease-in;
        will-change: filter,transform,opacity
    }
}
.animate-svg svg path {
  -webkit-animation: animate-svg-stroke-1 3s cubic-bezier(0.47, 0, 0.745, 0.715) 0s both;
          animation: animate-svg-stroke-1 3s cubic-bezier(0.47, 0, 0.745, 0.715) 0s both;
}

/****BLOG*****/
.new-blog-container {
    background: #fff;
    border-radius: 30px;
    padding: 3rem;
    padding-top: 4rem;
    width: 97%;
}
.portfolio-box-category {
    text-transform: lowercase;
    opacity: .6;
    font-size: .875rem;
    margin-top: .6em !important;
}
.blog-single .entry-image img {
    max-height: 550px;
    object-fit: cover;
}
.blog-single h1.entry-title{
    font-size: 4.3rem;
    max-width: 80%;
    text-align: center;
    text-wrap: balance;
    margin: 0 auto;
}
.blog-single h6.entry-category {
    text-align: center;
    opacity: .6;
    font-size: 0.75rem;
    margin-bottom: 1.2em;
}
.entry-content.single-page {
    max-width: 75%;
    margin: 0 auto;
    margin-top: 2rem;
}


/*нові стилі 22.07*/
.room__pricing {
    display: flex;
    flex-direction: flex-start;
    align-items: center;
    text-align: left;
    margin-top: -0.65rem;
}
.room__price {
    margin-bottom: 4px;
}
.discont-count, .mphb-period-price-old {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: .875rem;
    margin-bottom: -0.5rem;
}
.room__price .old-price {
    font-size: 1.2rem;
    opacity: .5;
}
.room__price .old-price .mphb-price {
    font-size: 1em;
    font-weight: 600;
    line-height: 1;
    letter-spacing: -0.68px;
}
.room__price .old-price .mphb-price-period {
    display: none;
}
.discont-badge {
    color: white;
    background-color: red;
    width: 3rem;
    height: 3rem;
    line-height: 3rem;
    border-radius: 99px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.room__price .mphb-price {
    font-size: 2.1875rem;
    font-weight: 700;
    letter-spacing: -1.3px;
    color: rgb(47, 62, 70);
}
.room__price .mphb-price-period {
    cursor: help;
    font-size: 80%;
    border-bottom: 1px dashed;
}
.mphb-rooms-reservation-message-wrapper {
    display: flex;
    justify-content: center;
}
.gap-price-loop {
    padding-bottom: .8rem;
}
.form-reservation-single > .mphb-regular-price, .form-reservation-single .mphb-regular-price-js  {
    margin-top: -1rem;
    margin-bottom: 2rem;
    text-align: left;
}
.form-reservation-single .old-price {
    font-size: 1.2rem;
    opacity: .5;
}
.form-reservation-single .old-price .mphb-price {
    font-size: 1em;
    font-weight: 600;
    line-height: 1;
    letter-spacing: -0.68px;
}
.form-reservation-single .old-price .mphb-price-period {
    display: none;
}
.form-reservation-single .mphb-price {
    font-size: 2.1875rem;
    font-weight: 700;
    letter-spacing: -1.3px;
}
/*yова*/
.select-dates {
    font-size: 2.1875rem;
    font-weight: 700;
    letter-spacing: -1.3px;
}


@media only screen and (max-width: 849px) { 
    .header-inner .nav {
        padding-left: 15px;
    }    
    .font-14 {
        font-size: 0.8rem;
    }
    .font-300 {
        font-size: 0.65rem !important;
    } 
    .button.white {
        font-size: 0.785rem;
    }
    .button.white.is-large {
        font-size: 0.95rem;
    }    
    .button.prymary.is-outline, .button.primary.is-outline, .mphb-button {
        font-size: 0.785rem;
    }   
    .main-menus-overlay+.off-canvas-left .mfp-content:before {
        left: 57%;
    }
    .mfp-ready .mfp-close {
        height: 4.3rem;
        line-height: 4.3rem;
        width: 4.3rem;
    }
    .title-page-top h1 {
        font-size: 3.5rem;
    }   
    
    /**** section HOME 1 ****/
    .section-1-title h1 {
        font-size: 4.5rem;
    }
	  .section-1-title-a h1 {
        font-size: 4.5rem;
    }
	

    /**** section HOME 2 ****/
    .swiper-page-button-next, .swiper-page-button-prev {
        display: none;
    }    
    #next-slide-title {
        width: 80%;
    }
    .pagination-title {
        margin-bottom: .2em;
    }       
    .page-slider .swiper-slide {
        width: 55%;
        max-width: none;
        padding: 0 1%;
    }
    .page-slider .swiper-slide .swiper-slide__inner {
        max-width: none;
        padding: 0;
    }
    .page-shotcode__img .text {
        font-size: 5.5rem;
        width: 145%;
    }
    .page-shotcode__info {
        gap: 1rem;
        font-size: .75rem;
    }
    
    /**section HOME 3***/
    .rooms-slider-home {
        margin-top: 1rem;
    }
    .rooms-slider-home__info h3 {
        font-size: 2.5rem;
    } 
    .rooms-slider-home__info h3 span {
        margin-top: .3em;
        display: block;
        position: relative;
    }
    .col.col-room-info > .col-inner {
        padding-left: 1rem;
    }
    .rooms-slider-home__info .info-bottom {
        align-items: flex-start;
        gap: .5rem;
        flex-direction: column-reverse;
    }  
    .rooms-slider-home__info .info-bottom > div .excerpt {
        font-size: .75rem;
    }    
    .rooms-slider-home__info .info-bottom ul {
        font-size: 0.65rem;
        display: flex;
        flex-wrap: wrap;
        gap: 0 15px;
    }    
    .rooms-slider-home__info .info-bottom ul > li {
        margin-bottom: 0.4em;
        flex: 1 1 calc(50% - 1.3em - 15px);
        white-space: nowrap;
    }
    .rooms-slider-home__swiper-next-slide svg {
        max-width: 7rem;
    }    
    
    /*section Home 4*/
    .tab-panels {
        padding-top: .5em;
    }
    .tab-panels .entry-content {
        padding-left: 2rem;
    }
    .new_tabbed.tabbed-content .nav-vertical {
        gap: .5rem;
    }
    .new_tabbed .nav-vertical>li a {
        font-size: 1.35rem;
        font-weight: 500;
    }
    
    /****MENU ***/
    .row-tablet-menu-top {
        align-items: flex-start !important;
    }
    .main-menu-block .ux-menu-link__link {
        font-size: 2rem;
    }
    
    /** DARk form **/
    
    .form-search-dark .mphb_sc_search-form {
        width: 100%;
        gap: 4rem;
        align-items: flex-start;
        flex-direction: column;
    }  
    .form-search-dark .form-search-new {
        width: 100%;
        flex: 1;
        display: flex;
        gap: 2rem;
        flex-wrap: wrap;
    }
    .form-search-dark .form-search-new > div {
        width: calc(50% - 1rem);
    }
    .form-search-dark .form-search-new input, .form-search-dark .form-search-new select{
        border-bottom: 1.3px solid #ffffff73;
        font-size: 1.5rem;
    }
    .form-search-dark .mphb_sc_search-check-in-date input[type="text"], .form-search-dark .mphb_sc_search-check-out-date input[type="text"] {
        background-size: 1.2rem;
    }
    .form-search-dark select {
         background-size: 1.3rem;
    }
    .form-search-dark .mphb_sc_search-submit-button-wrapper {
            width: 100%;
    }
    .form-search-dark .mphb_sc_search-submit-button-wrapper .button {
        font-size: 1.5rem;
    }    
    
    
    /***FOOTER***/
    .text.footer-text p:first-child {
        font-size: .875em;
    }
    .text.footer-text p strong {
        font-size: 1.3em;
    }
    
    /** RESULT PAGE ***/    
    .col-loop-room-title {
        order: 1;
        flex: 1 0 50%;
        max-width: 50%;
    }
    .result-row-room-new > .col.col-loop-room-title > .col-inner {
        padding-bottom: 0;
        padding-right: 1rem;
    }
    .col-loop-room-img {
        order: 2;
        flex: 1 0 50%;
        max-width: 50%;
    }
    .result-row-room-new > .col.col-loop-room-img > .col-inner {
        padding-bottom: 0;
        padding-left: 1rem;
    }
    .col-loop-room-text {
        order: 3;
        flex: 1 0 100%;
        max-width: 100%;
    }
    .result-row-room-new > .col:nth-child(2) > .col-inner {
        border: none;
    }    
    .result-row-room-new > .col > .col-inner {
        padding: 2.5rem;
    }   
    
    .result-row-room-new .entry-title {
        font-size: 1.8rem;
    }    
    
    .result-row-room-new .inner-button{
        border-top: 1px solid #00000017;
        padding-top: 1.5rem;
        margin-top: -.5rem;
    }
    .result-row-room-new .price_button {
        display: flex;
        width: 100%;
        gap: .5rem;
        flex-wrap: wrap;
        align-items: center;
    }
    .result-row-room-new .price_button .button {
        margin-right: 0;
    }
    .result-row-room-new .sale_discond_text {
        font-size: .75rem;
        margin-bottom: .2em;
    }
    .result-row-room-new .sale_price {
        order: -1;
        width: 100%;
        margin-bottom: .2em;
    }
    
    /*single page*/
    .section-single-room .row-title {
        margin-bottom: 1.5rem;
    }
    .svg-line-title {
        width: 100%;
        height: auto;
    }
    .section-single-room .col-inner.gallery-inner {
        padding-right: 0;
        margin-bottom: 2.5rem;
    }   
    
    /****BLOG*****/
    .new-blog-container {
        border-radius: 30px;
        padding: 2rem;
        padding-top: 3rem;
    }
    .portfolio-box-category {
        font-size: .75rem;
    }
    .blog-single .entry-image img {
        max-height: 450px;
    }
    .blog-single h1.entry-title{
        font-size: 2.3rem;
        max-width: 100%;
    }
    .blog-single h6.entry-category {
        text-align: center;
        opacity: .6;
        font-size: 0.75rem;
        margin-bottom: 1.2em;
    }
    .entry-content.single-page {
        max-width: 95%;
        margin-top: 2rem;
    }    
    
    .rooms-slider-home__gallery .single-room__icon-header {
        bottom: auto;
        top: -7rem;
    }    
    
    
}

/*Contact FORM 7 */
.wpcf7 label {
    width: fit-content;
    margin-bottom: 0;
}
.wpcf7 label+.wpcf7-form-control-wrap {
    margin-top: -11px;
}
.wpcf7 input[type=submit].button {
    width: 100%;
    text-transform: none;
    min-height: 3.85em;
    letter-spacing: normal;
    font-size: 1em;
}
label[for="mphb_accept_terms"] {
  display: block;
    font-size: .75em;
    font-weight: 500;
    margin-bottom: -11px;
    margin-left: 30px;
    background: #e6e0dc;
    padding: 2px 8px;
    z-index: 4;
    width: max-content;
    position: relative;
}
@media only screen and (max-width: 550px) {
label[for="mphb_accept_terms"] {
    margin-left: -18px;
}
}

/*SLIDER TEASER*/
.teaser-slide .teaser-blur img {
    filter: blur(6px);
    transform: scale(1.05);
}
.teaser-slide .teaser-overlay {
    position:absolute; inset:0;
    display:flex; align-items:center; justify-content:center;
    background:rgba(0,0,0,.35);
    text-align:center; padding:16px;
}
.teaser-slide .teaser-overlay__inner {
    backdrop-filter:saturate(140%) blur(2px);
    padding:14px 18px; border-radius:12px;
}
.teaser-slide .teaser-text {
font-size:14px; line-height:1.4; color:#fff; font-weight:600;
}
.teaser-slide .teaser-link {
color:#fff; text-decoration:underline; text-underline-offset:3px;
font-weight:700;
}
.teaser-slide .box.has-hover:hover .box-image:before { opacity:0; }

@media (min-width: 769px) {
	.teaser-slide {
				display:none; 
				}
        }

@media only screen and (max-width: 550px) {
/*************** ADD MOBILE ONLY CSS HERE  ***************/
    .font-14 {
        font-size: 0.75rem;
    }
    .font-300 {
        font-size: 0.55rem !important;
    }
    .col {
        padding-bottom: 15px;
    }
    .button.white.is-large {
        font-size: .9rem;
        padding: 1.072em 3.034em;
    }

    /**** section HOME 1 ****/
    .section-1-title h1 {
        font-size: 2.5rem;
        font-weight: 600;
        text-wrap: balance;
    }
	.section-1-title-a h1 {
        font-size: 2.5rem;
        font-weight: 600;
        text-wrap: balance;
    }
 
    
    /**** section HOME 2 ****/
    #next-slide-title {
        width: 80%;
    }
    .pagination-title {
        margin-bottom: .2em;
    }       
    .page-slider .swiper-slide {
        width: 70%;
        max-width: none;
        padding: 0 5%;
        
    }
    .page-shotcode__img .text {
        font-size: 2.8rem;
        width: 150%;
    }
    .page-shotcode__info {
        align-items: flex-start;
        gap: 1rem;
        font-size: .55rem;
        margin-top: 1.2em;
        flex-direction: column;
    }

    /**section HOME 3***/
    .rooms-slider-home {
        margin-top: 0rem;
    }
    .rooms-slider-home__info h3 {
        font-size: 2.3rem;
    }  
    .col.col-room-info > .col-inner {
        padding-left: 0;
    }
    .rooms-slider-home__info .info-bottom {
        align-items: flex-start;
        gap: .5rem;
        flex-direction: column-reverse;
    }  
    .rooms-slider-home__info .info-bottom > div .excerpt {
        font-size: .65rem;
    }
    .rooms-slider-home__info .info-bottom ul {
        font-size: 0.55rem;
    }    
    .rooms-slider-home__swiper-next-slide {
        position: absolute;
        right: -7px;
        top: 3rem;
    } 
    .rooms-slider-home__swiper-next-slide svg {
        max-width: 6rem;
    }    
    .rooms-slider-home__swiper-next-slide svg:hover {
        transform: scale(1.1);
    }
    /*section Home 4*/
    .tab-panels {
        padding-top: 1em;
    }
    .tab-panels .entry-content {
        padding-left: 0;
    }
    .top-section-tab {
        width: 100%;
        gap: 1rem;
    }
    .new_tabbed.tabbed-content .nav-vertical {
        gap: 1.3rem;
        overflow: scroll;
        scroll-snap-type: x mandatory;
        flex-flow: row;
    }
    .new_tabbed .nav-vertical>li {
        scroll-snap-align: start;
    }
    .new_tabbed .nav-vertical>li a {
        font-size: 1rem;
        font-weight: 600;
        text-wrap: nowrap;
        white-space: nowrap;
    }
    /*.tab-panels.buttons_tabbet {
        display: none;
    }   */
    
    /** MNEU **/

    .mfp-ready .mfp-close {
        height: 60px;
        line-height: 60px;
        width: 60px;
        top: 25px !important;
    }
    .main-menu-block .ux-menu-link__link {
        font-size: 1.3rem;
        padding: 0.35em 0em;
        margin-left: 5px;
    }
    .ux-logo-link {
        padding: 0 !important;
    }
    .main-menus-overlay+.off-canvas-left .mfp-content:before {
        display:none;
    }
    
    .text.footer-text p:first-child {
        font-size: .85em;
    }
    .text.footer-text p strong {
        font-size: 1.2em;
    }
    .text.footer-text {
        margin-bottom: 1.5rem;
    }

    /** DARk form **/
    
    .form-search-dark .mphb_sc_search-form {
        width: 100%;
        gap: 2rem;
        align-items: flex-estart;
        flex-direction: column;
    }  
    .form-search-dark .form-search-new {
        flex: 1;
        display: flex;
        gap: 2rem;
        flex-wrap: wrap;
    }
    .form-search-dark .form-search-new > div {
        width: calc(50% - 1rem);
    }
    .form-search-dark .form-search-new input, .form-search-dark .form-search-new select{
        border-bottom: 1px solid #ffffff73;
        font-size: .85rem;
    }
    .form-search-dark .mphb_sc_search-check-in-date input[type="text"], .form-search-dark .mphb_sc_search-check-out-date input[type="text"] {
        background-size: 0.75rem;
    }
    .form-search-dark select {
         background-size: 0.875rem;
    }
    .form-search-dark .mphb_sc_search-submit-button-wrapper {
            width: 100%;
    }
    .form-search-dark .mphb_sc_search-submit-button-wrapper .button {
        font-size: 1rem;
    }
    
    /** RESULT PAGE ***/
    .title-page-top h1 {
        font-size: 2rem;
    }
    .mphb_sc_search_results-info-date {
        margin-bottom: 3rem;
        font-size: .85rem;
    }
    
    
    .col-loop-room-title {
        order: 1;
        flex: 1 0 100%;
        max-width: 100%;
    }
    .result-row-room-new > .col.col-loop-room-title > .col-inner {
        padding-bottom: 0;
        padding-right: 2rem;
    }
    .col-loop-room-img {
        order: 2;
        flex: 1 0 100%;
        max-width: 100%;
    }
    .result-row-room-new > .col.col-loop-room-img > .col-inner {
        padding-bottom: 0;
        padding-left: 0;
    }
    .col-loop-room-text {
        order: 3;
        flex: 1 0 100%;
        max-width: 100%;
    }    
    .result-row-room-new > .col > .col-inner {
        padding: 2rem;
    }
    .result-row-room-new > .col:nth-child(2) > .col-inner {
        padding: 0rem 2rem;
        padding-bottom: 2rem;
    }
    .result-row-room-new .entry-title {
        font-size: 1.4rem;
    }
    .single-room__icon-header {
        gap: .5rem;
    }
    .rooms-slider-home__gallery .single-room__icon-header {
        bottom: 3rem;
    }
    .rooms-slider-home__gallery .single-room__icon-header {
        bottom: 3rem;
        top: auto;
    }    
    .icon-header_item {
        gap: 0.3rem;
        font-size: .6rem;
    }
    .icon-header_item svg {
        max-width: 1.2rem;
    }
    .result-row-room-new .excerpt {
        font-size: .75rem;
    }
    .result-row-room-new .facility_loop {
        gap: .5rem;
        margin-top: 2rem;
    }
    .result-row-room-new .facility_loop-title {
        flex: 1;
        font-size: 0.85rem;
    }
    .result-row-room-new .facility_loop ul {
        font-size: 0.7rem;
    }
    .result-row-room-new .inner-button{
        border-top: 1px solid #00000017;
        padding-top: 1.5rem;
        margin-top: -.5rem;
    }
    .result-row-room-new .price_button {
        display: flex;
        width: 100%;
        gap: .4rem;
        flex-wrap: wrap;
        align-items: center;
    }
    .result-row-room-new .price_button .button {
        margin-right: 0;
    }
    .result-row-room-new .mphb-price-period{
        font-size: .75rem;
    }
    .result-row-room-new .sale_discond_text {
        font-size: .75rem;
        margin-bottom: .2em;
    }
    .result-row-room-new select.mphb-rooms-quantity {
        width: 4.2rem;
        padding: 1.072em 1.5em;
        background-position: right .8rem top 50% !important;
    }

    .result-row-room-new .sale_price {
        order: -1;
        width: 100%;
        margin-bottom: .2em;
    }
    .room_counts {
        font-size: 0.6rem;
    }  
    
    /** single room **/
    .section-single-room {
        padding-top: 1.5rem;
    }
    .section-single-room .row-title {
        margin-bottom: .5rem;
    }
    .section-single-room .col-inner.gallery-inner {
        padding-right: 0;
        margin-bottom: 1.5rem;
    }
    .col-white-room {
        border-radius: 20px;
        padding: 2rem;
        margin-bottom: 1rem;
    }
    .new-reserv-form .mphb-period-price-old .discount, .new-reserv-form .price-container .discound {
        font-size: .75rem;
        margin-bottom: 0;
    }
    /*.new-reserv-form .mphb-period-price-old del, .new-reserv-form .price-container del {
        color: #B8B8B8;
        font-size: .875rem;
    }*/
    /*.new-reserv-form .mphb-period-price .mphb-price, .new-reserv-form .price-container .mphb-price {
        font-size: 1.8rem;
    }*/
    .form-reserved-button{
        width: 100%;
    }
    .form-reserved-button .button {
        width: 100%;
    }
    .form-reserved-and-button {
        gap: 2rem;
        margin-top: 2rem;
        flex-direction: column;
    }
    .snidanok {
        top: -0.5rem;
        right: -0.5rem;
    }
    .snidanok svg {
        max-width: 4.5rem;
        height: auto;
    }
    .line-separator {
        margin: 1.4rem 0 1.5rem 0;
    }
    .form-col-half .placeholder {
        font-size: .85rem;
    }
    .new-reserv-form .single-room__icon-header {
        gap: .5rem;
    }
    .content-single-room__border .title-block h5 {
        font-size: .85rem;
    }
    .datepick-month.last {
        display:none;
    }
    .mphb-check-in-date-wrapper input[type="text"], .mphb-check-out-date-wrapper input[type="text"], .mphb_sc_search-check-in-date input[type="text"], .mphb_sc_search-check-out-date input[type="text"], .mphb_widget_search-check-in-date input[type="text"], .mphb_widget_search-check-out-date input[type="text"] {
        background-size: .75rem;
        font-size: .85rem;
    }
    .form_buttom_flat input[type=text], .form_buttom_flat select:not(.mphb-rooms-quantity) {
        font-size: .85rem;
    }
    
    /*SPA*/
    .spa-tab .top-section-tab {
        margin-top: 0rem;
    }
    
    
    /****BLOG*****/
    .new-blog-container {
        border-radius: 15px;
        padding: 1rem;
        padding-top: 2rem;
    }
    .portfolio-box-category {
        font-size: .65rem;
    }
    .blog-single .entry-image img {
        max-height: 450px;
    }
    .blog-single h1.entry-title{
        font-size: 1.3rem;
    }
    .blog-single h6.entry-category {
        font-size: 0.65rem;
    }
    .entry-content.single-page {
        max-width: 100%;
        margin-top: 0rem;
        font-size: .75rem;
        
    }       
    /*yове 22.07*/
    .single .mphb-reserve-room-section, .single .mphb-reserve-btn-wrapper {
		width: 100%;
	}

	.form-reservation-single .mphb-price, .room__price .mphb-price {
		font-size: 1.5rem;
	}	
	.form-reservation-single .old-price .mphb-price, .room__price .old-price .mphb-price {
		font-size: .85em;
	}	
	.discont-badge {
		width: 2.5rem;
		height: 2.5rem;
		line-height: 2.5rem;
		font-size: .75em;
	}
	.mphb-price-period {
		font-size: .65rem;
	}
	.form-reserved-input {
		gap: .8rem;
	}	
	.form-reservation-single > .mphb-regular-price, .form-reservation-single .mphb-regular-price-js {
		margin-top: -0.5rem;
		margin-bottom: 1rem;
	}

    .select-dates {
        font-size: 1.5rem;
    }	
	
}

/* =========================================================
   TAVEL SPA SHOWCASE
   ========================================================= */

.tavel-spa-showcase {
    --spa-height: var(--tavel-spa-height, 720px);
    --spa-mobile-height: var(--tavel-spa-mobile-height, 440px);
    --spa-center-gap: var(--tavel-spa-overlap, 60px);
    --spa-half-gap: calc(var(--spa-center-gap) / 2);
    --spa-media-ratio: 436 / 593;
    --spa-media-width: var(--tavel-spa-media-width, 529px);
    --spa-active-width: calc(50vw - var(--spa-half-gap));
    --spa-logo-width: clamp(116px, 10vw, 184px);
    --spa-logo-top: clamp(0px, 2.8vw, 44px);
    --spa-pattern-opacity: 1;
    --spa-pattern-inset: clamp(24px, 3.6vw, 72px);
    --spa-radius: 28px;
    --spa-duration: 1.08s;
    --spa-ease: cubic-bezier(.16, 1, .3, 1);

    --spa-title-size: 35px;
    --spa-title-active-size: 66px;
    --spa-title-inactive-size: 30px;
    --spa-label-size: 11px;
    --spa-label-inactive-size: 9px;
    --spa-button-size: 12px;

    --spa-hit-shape: polygon(
        0.2% 8.1%,
        0.2% 94.8%,
        1.1% 96.9%,
        3.4% 98.8%,
        7.1% 99.8%,
        92.3% 99.8%,
        96.1% 99.1%,
        99.1% 96.5%,
        99.2% 94.9%,
        99.7% 76%,
        100% 55%,
        99% 25.3%,
        97.3% 18%,
        92.9% 11.1%,
        77% 7.9%,
        61.2% 4.6%,
        38% 0.2%,
        25.6% -1.4%,
        11.1% 0.6%,
        3.2% 2.2%,
        0.2% 7.4%
    );

    position: relative;
    display: flex;
    align-items: stretch;
    justify-content: center;

    width: 100vw;
    max-width: 100vw;
    height: var(--spa-height);
    min-height: min(620px, var(--spa-height));

    margin-left: calc(-50vw + 50%);
    padding: 0;
    gap: 0;

    overflow: hidden;
    background: #e6e0dc;
}

.tavel-spa-showcase::after {
    content: "";
    position: absolute;
    top: 0;
    right: var(--spa-pattern-inset);
    bottom: 0;
    left: var(--spa-pattern-inset);
    z-index: 0;

    display: block;

    background-image: url("data:image/svg+xml,%3Csvg width='1920' height='895' viewBox='-36 -36 1992 967' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 26.9999C7.99973 26.9999 51 -10.4054 185.429 4.99994C373.187 26.517 488.146 116.575 527.29 152.829C566.292 188.95 587.952 236.263 602.02 288.905C621.992 363.639 617.666 429.421 572.484 491.941C497.765 595.332 350.211 646.321 231.809 625.607C190.823 618.436 117.759 599.715 110.817 544.697C104.623 495.605 151.245 453.617 185.429 431.575C237.125 398.242 297.879 382.059 356.834 371.463C456.726 353.511 558.66 355.919 657.89 377.804C810.854 411.54 975.376 488.61 1066.65 630.553C1095.32 675.137 1116.07 725 1148.03 767.263C1197.67 832.918 1269.11 874.136 1346.83 887.867C1457.22 907.37 1565.69 876.637 1671.85 847.792C1754.26 825.399 1836.87 804.51 1920 785.398' stroke='%23D3CDC9' stroke-linecap='round'/%3E%3C/svg%3E");
    background-position: center top;
    background-repeat: no-repeat;
    background-size: 100% auto;

    opacity: var(--spa-pattern-opacity);
    pointer-events: none;
}

.tavel-spa-showcase__logo {
    position: absolute;
    top: var(--spa-logo-top);
    left: 50%;
    z-index: 6;

    display: block;
    width: var(--spa-logo-width);
    max-width: none;
    height: auto;
    aspect-ratio: 367 / 248;
    object-fit: contain;

    opacity: 0.72;
    pointer-events: none;
    transform: translateX(-50%);
}

.tavel-spa-showcase__card {
    position: relative;
    z-index: 1;

    display: flex;
    align-items: flex-end;

    flex: 0 0 50%;
    width: 50%;
    min-width: 0;
    height: 100%;

    overflow: visible;
    isolation: isolate;

    color: #fff;
    text-decoration: none;
    pointer-events: none;

    transition:
        flex-basis var(--spa-duration) var(--spa-ease),
        width var(--spa-duration) var(--spa-ease);
}

a.tavel-spa-showcase__card,
a.tavel-spa-showcase__card:hover,
a.tavel-spa-showcase__card:focus {
    color: #fff;
    text-decoration: none;
}

.tavel-spa-showcase__card--1,
.tavel-spa-showcase__card--2 {
    margin: 0;
}

.tavel-spa-showcase__hit {
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: 10;

    display: block;
    width: var(--spa-media-width);
    height: 100%;
    aspect-ratio: auto;

    background: transparent;
    pointer-events: auto;
    touch-action: manipulation;

    -webkit-clip-path: var(--spa-hit-shape);
    clip-path: var(--spa-hit-shape);

    transition:
        left var(--spa-duration) var(--spa-ease),
        right var(--spa-duration) var(--spa-ease),
        width var(--spa-duration) var(--spa-ease),
        -webkit-clip-path var(--spa-duration) var(--spa-ease),
        clip-path var(--spa-duration) var(--spa-ease);

    will-change: width, left, right, clip-path;
}

a.tavel-spa-showcase__card .tavel-spa-showcase__hit {
    cursor: pointer;
}

.tavel-spa-showcase__card--1 .tavel-spa-showcase__hit {
    right: var(--spa-half-gap);
    transform: scaleX(-1);
    transform-origin: center;
}

.tavel-spa-showcase__card--2 .tavel-spa-showcase__hit {
    left: var(--spa-half-gap);
}

.tavel-spa-showcase__background,
.tavel-spa-showcase__overlay {
    position: absolute;
    top: 0;
    bottom: 0;

    display: block;
    width: var(--spa-media-width);
    height: 100%;
    aspect-ratio: auto;

    pointer-events: none;
    transform-origin: center;

    -webkit-mask-image: url("https://tavelhotel.com/wp-content/uploads/2024/10/mask.svg");
    mask-image: url("https://tavelhotel.com/wp-content/uploads/2024/10/mask.svg");

    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;

    -webkit-mask-position: center;
    mask-position: center;

    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;

    transition:
        transform 0.95s var(--spa-ease),
        filter 0.55s ease,
        background 0.55s ease,
        border-radius 0.55s ease,
        left var(--spa-duration) var(--spa-ease),
        right var(--spa-duration) var(--spa-ease),
        width var(--spa-duration) var(--spa-ease),
        -webkit-mask-position var(--spa-duration) var(--spa-ease),
        mask-position var(--spa-duration) var(--spa-ease),
        -webkit-mask-size var(--spa-duration) var(--spa-ease),
        mask-size var(--spa-duration) var(--spa-ease);

    will-change: width, left, right, transform;
}

.tavel-spa-showcase__background {
    z-index: 1;

    background-color: #777;
    background-image: var(--tavel-spa-image);
    background-position: var(--tavel-spa-position, center center);
    background-size: cover;
    background-repeat: no-repeat;

    transform: scale(1.002);
}

.tavel-spa-showcase__overlay {
    z-index: 2;

    background:
        linear-gradient(
            180deg,
            rgba(10, 10, 10, 0) 0%,
            rgba(10, 10, 10, 0.02) 42%,
            rgba(10, 10, 10, 0.34) 78%,
            rgba(10, 10, 10, 0.58) 100%
        );
}

.tavel-spa-showcase__card--1 .tavel-spa-showcase__background,
.tavel-spa-showcase__card--1 .tavel-spa-showcase__overlay {
    right: var(--spa-half-gap);
    left: auto;
}

.tavel-spa-showcase__card--2 .tavel-spa-showcase__background,
.tavel-spa-showcase__card--2 .tavel-spa-showcase__overlay {
    right: auto;
    left: var(--spa-half-gap);
}

.tavel-spa-showcase__card--1 .tavel-spa-showcase__background {
    transform: scaleX(-1) scale(1.002);
}

.tavel-spa-showcase__card--1 .tavel-spa-showcase__overlay {
    transform: scaleX(-1);
}

.tavel-spa-showcase__card--no-image .tavel-spa-showcase__background {
    background-image:
        linear-gradient(
            135deg,
            #7a746d 0%,
            #45413e 100%
        );
}

.tavel-spa-showcase__full {
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: 3;

    display: block;
    width: var(--spa-media-width);
    height: 100%;

    background-color: #777;
    background-image: var(--tavel-spa-image);
    background-position: var(--tavel-spa-position, center center);
    background-size: cover;
    background-repeat: no-repeat;

    border-radius: var(--spa-radius);
    opacity: 0;
    overflow: hidden;
    pointer-events: none;
    transform-origin: center;

    transition:
        opacity 0.18s ease,
        left var(--spa-duration) var(--spa-ease),
        right var(--spa-duration) var(--spa-ease),
        width var(--spa-duration) var(--spa-ease),
        transform 0.95s var(--spa-ease);

    will-change: width, left, right, opacity;
}

.tavel-spa-showcase__full::after {
    content: "";
    position: absolute;
    inset: 0;

    display: block;
    border-radius: inherit;

    background:
        linear-gradient(
            180deg,
            rgba(10, 10, 10, 0) 0%,
            rgba(10, 10, 10, 0.02) 42%,
            rgba(10, 10, 10, 0.34) 78%,
            rgba(10, 10, 10, 0.58) 100%
        );

    pointer-events: none;
}

.tavel-spa-showcase__card--1 .tavel-spa-showcase__full {
    right: var(--spa-half-gap);
    left: auto;
    transform: scaleX(-1);
}

.tavel-spa-showcase__card--2 .tavel-spa-showcase__full {
    right: auto;
    left: var(--spa-half-gap);
}

.tavel-spa-showcase__card--no-image .tavel-spa-showcase__full {
    background-image:
        linear-gradient(
            135deg,
            #7a746d 0%,
            #45413e 100%
        );
}

.tavel-spa-showcase__content {
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: 5;

    display: flex;
    flex-direction: column;
    justify-content: flex-end;

    width: var(--spa-media-width);
    max-width: none;
    height: 100%;
    aspect-ratio: auto;

    padding: clamp(24px, 3.5vw, 58px);
    box-sizing: border-box;

    color: #fff;
    pointer-events: none;
    transform: none;

    transition: none;
}

.tavel-spa-showcase__label,
.tavel-spa-showcase__title,
.tavel-spa-showcase__button {
    position: relative;
    z-index: 1;
}

.tavel-spa-showcase__card--1 .tavel-spa-showcase__content {
    right: var(--spa-half-gap);
    left: auto;

    align-items: flex-start;
    text-align: left;
}

.tavel-spa-showcase__card--2 .tavel-spa-showcase__content {
    right: auto;
    left: var(--spa-half-gap);

    align-items: flex-start;
    text-align: left;
}

.tavel-spa-showcase__label {
    display: block;
    margin-bottom: 14px;

    color: rgba(255, 255, 255, 0.9);

    font-size: var(--spa-label-size);
    font-weight: 500;
    line-height: 1.4;
    letter-spacing: 0;
    text-transform: uppercase;

    text-shadow:
        0 1px 2px rgba(0, 0, 0, 0.32),
        0 8px 26px rgba(0, 0, 0, 0.4);

    transition: none;
}

.tavel-spa-showcase__title {
    display: block;
    margin: 0;

    color: #fff;

    font-size: var(--spa-title-size);
    font-weight: 400;
    line-height: 1.02;
    letter-spacing: 0;
    text-transform: uppercase;

    overflow-wrap: normal;
    word-break: normal;

    text-shadow:
        0 1px 2px rgba(0, 0, 0, 0.36),
        0 10px 32px rgba(0, 0, 0, 0.44);

    transition: none;
}


/* =========================================================
   BUTTON
   ========================================================= */

.tavel-spa-showcase .tavel-spa-showcase__button,
.tavel-spa-showcase .tavel-spa-showcase__button.button,
.tavel-spa-showcase .tavel-spa-showcase__button.button.prymary,
.tavel-spa-showcase .tavel-spa-showcase__button.button.prymary.is-outline {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 11px !important;

    width: auto !important;
    min-width: 0 !important;
    min-height: 0 !important;

    margin-top: 25px !important;
    margin-bottom: 0 !important;
    padding: 9px 18px !important;

    color: #fff !important;
    -webkit-text-fill-color: #fff !important;

    background: transparent !important;

    border: 1px solid rgba(255, 255, 255, 0.92) !important;
    border-radius: 999px !important;

    box-sizing: border-box !important;
    box-shadow: none !important;
    text-shadow: none !important;

    font-family: inherit !important;
    font-size: var(--spa-button-size) !important;
    font-style: normal !important;
    font-weight: 400 !important;
    line-height: 1.4 !important;
    letter-spacing: 0 !important;
    text-transform: uppercase !important;

    opacity: 1 !important;
    transform: none !important;

    cursor: pointer;

    transition:
        color 0.25s ease,
        background 0.25s ease,
        border-color 0.25s ease !important;
}

.tavel-spa-showcase .tavel-spa-showcase__button span,
.tavel-spa-showcase .tavel-spa-showcase__button strong,
.tavel-spa-showcase .tavel-spa-showcase__button b {
    color: inherit !important;
    -webkit-text-fill-color: inherit !important;

    font-family: inherit !important;
    font-size: inherit !important;
    font-style: normal !important;
    font-weight: 400 !important;
    line-height: inherit !important;
    letter-spacing: inherit !important;

    text-shadow: none !important;
}

.tavel-spa-showcase .tavel-spa-showcase__button .tavel-spa-showcase__arrow {
    display: inline-block;

    color: inherit !important;
    -webkit-text-fill-color: inherit !important;

    font-weight: 400 !important;
    text-shadow: none !important;

    transition: none;
}


/* =========================================================
   BUTTON DIRECT HOVER
   ========================================================= */

.tavel-spa-showcase .tavel-spa-showcase__button:hover,
.tavel-spa-showcase .tavel-spa-showcase__button:focus,
.tavel-spa-showcase .tavel-spa-showcase__button.button:hover,
.tavel-spa-showcase .tavel-spa-showcase__button.button:focus,
.tavel-spa-showcase .tavel-spa-showcase__button.button.prymary.is-outline:hover,
.tavel-spa-showcase .tavel-spa-showcase__button.button.prymary.is-outline:focus {
    color: #111 !important;
    -webkit-text-fill-color: #111 !important;

    border-color: #fff !important;
    background: #fff !important;

    box-shadow: none !important;
    text-shadow: none !important;
}

.tavel-spa-showcase .tavel-spa-showcase__button:hover span,
.tavel-spa-showcase .tavel-spa-showcase__button:focus span,
.tavel-spa-showcase .tavel-spa-showcase__button:hover .tavel-spa-showcase__arrow,
.tavel-spa-showcase .tavel-spa-showcase__button:focus .tavel-spa-showcase__arrow {
    color: #111 !important;
    -webkit-text-fill-color: #111 !important;

    font-weight: 400 !important;
    text-shadow: none !important;
}


/* =========================================================
   DESKTOP
   ========================================================= */

@media (max-width: 1366px) {

    .tavel-spa-showcase {
        --spa-media-width: min(var(--tavel-spa-media-width, 529px), 500px);
        --spa-title-size: 48px;
        --spa-title-active-size: 56px;
        --spa-title-inactive-size: 28px;

        height: min(var(--spa-height), 680px);
        min-height: min(560px, var(--spa-height));
    }

}


@media (max-width: 1024px) {

    .tavel-spa-showcase {
        --spa-center-gap: var(--tavel-spa-overlap-tablet, 34px);
        --spa-media-width: min(var(--tavel-spa-media-width, 529px), 382px);
        --spa-title-size: 30px;
        --spa-title-active-size: 38px;
        --spa-title-inactive-size: 22px;
        --spa-label-size: 9px;
        --spa-button-size: 10px;

        height: min(var(--spa-height), 520px);
        min-height: min(440px, var(--spa-height));
    }

    .tavel-spa-showcase__logo {
        display: none;
    }

    .tavel-spa-showcase__label {
        margin-bottom: 8px;
    }

    .tavel-spa-showcase .tavel-spa-showcase__button {
        margin-top: 14px !important;
    }

}


/* =========================================================
   DESKTOP HOVER
   ========================================================= */

@media (hover: hover) and (pointer: fine) {

    .tavel-spa-showcase__card:has(.tavel-spa-showcase__hit:hover) {
        z-index: 4;
    }

    .tavel-spa-showcase__card:has(.tavel-spa-showcase__hit:hover)
    .tavel-spa-showcase__hit {
        width: var(--spa-active-width);
        aspect-ratio: auto;
        transform: none;

        -webkit-clip-path: inset(0 round var(--spa-radius));
        clip-path: inset(0 round var(--spa-radius));
    }

    .tavel-spa-showcase__card--1:has(.tavel-spa-showcase__hit:hover)
    .tavel-spa-showcase__hit {
        right: var(--spa-half-gap);
        left: auto;
    }

    .tavel-spa-showcase__card--2:has(.tavel-spa-showcase__hit:hover)
    .tavel-spa-showcase__hit {
        right: auto;
        left: var(--spa-half-gap);
    }

    .tavel-spa-showcase__card:has(.tavel-spa-showcase__hit:hover)
    .tavel-spa-showcase__full {
        top: 0;
        bottom: 0;

        width: var(--spa-active-width);
        height: 100%;
        aspect-ratio: auto;

        opacity: 1;
    }

    .tavel-spa-showcase__card--1:has(.tavel-spa-showcase__hit:hover)
    .tavel-spa-showcase__full {
        right: var(--spa-half-gap);
        left: auto;

        transform: scaleX(-1);
    }

    .tavel-spa-showcase__card--2:has(.tavel-spa-showcase__hit:hover)
    .tavel-spa-showcase__full {
        right: auto;
        left: var(--spa-half-gap);

        transform: none;
    }

    .tavel-spa-showcase__card:has(.tavel-spa-showcase__hit:hover)
    .tavel-spa-showcase__overlay {
        transform: none;

        background:
            linear-gradient(
                180deg,
                rgba(10, 10, 10, 0) 0%,
                rgba(10, 10, 10, 0.02) 42%,
                rgba(10, 10, 10, 0.34) 78%,
                rgba(10, 10, 10, 0.58) 100%
            );
    }

    .tavel-spa-showcase__card--1:has(.tavel-spa-showcase__hit:hover)
    .tavel-spa-showcase__overlay {
        transform: scaleX(-1);
    }


    /* CARD HOVER -> BUTTON WHITE */

    .tavel-spa-showcase__card:has(.tavel-spa-showcase__hit:hover)
    .tavel-spa-showcase__button,
    .tavel-spa-showcase__card:has(.tavel-spa-showcase__hit:hover)
    .tavel-spa-showcase__button.button,
    .tavel-spa-showcase__card:has(.tavel-spa-showcase__hit:hover)
    .tavel-spa-showcase__button.button.prymary.is-outline {
        color: #111 !important;
        -webkit-text-fill-color: #111 !important;

        border-color: #fff !important;
        background: #fff !important;

        font-weight: 400 !important;

        box-shadow: none !important;
        text-shadow: none !important;
    }

    .tavel-spa-showcase__card:has(.tavel-spa-showcase__hit:hover)
    .tavel-spa-showcase__button span,
    .tavel-spa-showcase__card:has(.tavel-spa-showcase__hit:hover)
    .tavel-spa-showcase__button strong,
    .tavel-spa-showcase__card:has(.tavel-spa-showcase__hit:hover)
    .tavel-spa-showcase__button b,
    .tavel-spa-showcase__card:has(.tavel-spa-showcase__hit:hover)
    .tavel-spa-showcase__button .tavel-spa-showcase__arrow {
        color: #111 !important;
        -webkit-text-fill-color: #111 !important;

        font-weight: 400 !important;

        text-shadow: none !important;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 768px) {

    .tavel-spa-showcase {
        --spa-title-size: 36px;
        --spa-label-size: 10px;
        --spa-button-size: 11px;

        flex-direction: column;

        width: 100%;
        max-width: 100%;
        height: auto;
        min-height: 0;

        margin-left: 0;
        padding: 0 16px;
        gap: 14px;

        overflow: visible;
    }

    .tavel-spa-showcase__card {
        flex: none;

        width: 100%;
        height: var(--spa-mobile-height);
        min-height: 380px;

        border-radius: var(--spa-radius);
        overflow: hidden;
    }

    .tavel-spa-showcase__hit {
        inset: 0;

        width: auto;
        height: auto;
        aspect-ratio: auto;

        transform: none;

        -webkit-clip-path: inset(0 round var(--spa-radius));
        clip-path: inset(0 round var(--spa-radius));
    }

    .tavel-spa-showcase__card--1 .tavel-spa-showcase__hit,
    .tavel-spa-showcase__card--2 .tavel-spa-showcase__hit {
        right: 0;
        left: 0;

        transform: none;
    }

    .tavel-spa-showcase__background,
    .tavel-spa-showcase__full,
    .tavel-spa-showcase__overlay {
        inset: 0;

        width: 100%;
        height: 100%;
        aspect-ratio: auto;

        -webkit-mask: none !important;
        mask: none !important;

        -webkit-mask-image: none;
        mask-image: none;

        -webkit-clip-path: inset(0 round var(--spa-radius));
        clip-path: inset(0 round var(--spa-radius));

        border-radius: var(--spa-radius);
    }

    .tavel-spa-showcase__card--1 .tavel-spa-showcase__background,
    .tavel-spa-showcase__card--1 .tavel-spa-showcase__full,
    .tavel-spa-showcase__card--1 .tavel-spa-showcase__overlay,
    .tavel-spa-showcase__card--2 .tavel-spa-showcase__background,
    .tavel-spa-showcase__card--2 .tavel-spa-showcase__full,
    .tavel-spa-showcase__card--2 .tavel-spa-showcase__overlay {
        inset: 0;

        right: 0;
        left: 0;

        width: 100%;
    }

    .tavel-spa-showcase__card--1 .tavel-spa-showcase__background,
    .tavel-spa-showcase__card--1 .tavel-spa-showcase__full,
    .tavel-spa-showcase__card--1 .tavel-spa-showcase__overlay {
        transform: none;
    }

    .tavel-spa-showcase__content {
        inset: 0;

        width: 100%;
        max-width: none;
        height: 100%;
        aspect-ratio: auto;

        padding: 28px 24px;

        opacity: 1;
        transform: none;
    }

    .tavel-spa-showcase__card--1 .tavel-spa-showcase__content,
    .tavel-spa-showcase__card--2 .tavel-spa-showcase__content {
        right: auto;
        left: auto;

        align-items: flex-start;
        text-align: left;
    }

    .tavel-spa-showcase__label {
        margin-bottom: 10px;
    }

    .tavel-spa-showcase .tavel-spa-showcase__button {
        margin-top: 19px !important;
    }

}


@media (max-width: 549px) {

    .tavel-spa-showcase {
        --spa-title-size: 30px;
        --spa-label-size: 9px;

        padding: 0 12px;
        gap: 12px;
    }

    .tavel-spa-showcase__card {
        min-height: 340px;
    }

    .tavel-spa-showcase__content {
        padding: 22px 20px;
    }

}


/* =========================================================
   TABLET / TOUCH
   ========================================================= */

@media (max-width: 1024px), (hover: none) and (pointer: coarse) {

    .tavel-spa-showcase {
        --spa-title-size: 36px;
        --spa-label-size: 10px;
        --spa-button-size: 11px;

        flex-direction: column;

        width: 100%;
        max-width: 100%;
        height: auto;
        min-height: 0;

        margin-left: 0;
        padding: 0 16px;
        gap: 14px;

        overflow: visible;
    }

    .tavel-spa-showcase__logo {
        display: none;
    }

    .tavel-spa-showcase__card {
        flex: none !important;

        width: 100% !important;
        max-width: 100% !important;

        height: var(--spa-mobile-height) !important;
        min-height: 380px;

        border-radius: var(--spa-radius);
        overflow: hidden;
    }

    .tavel-spa-showcase .tavel-spa-showcase__hit,
    .tavel-spa-showcase .tavel-spa-showcase__background,
    .tavel-spa-showcase .tavel-spa-showcase__full,
    .tavel-spa-showcase .tavel-spa-showcase__overlay,
    .tavel-spa-showcase__card--1 .tavel-spa-showcase__hit,
    .tavel-spa-showcase__card--2 .tavel-spa-showcase__hit,
    .tavel-spa-showcase__card--1 .tavel-spa-showcase__background,
    .tavel-spa-showcase__card--1 .tavel-spa-showcase__full,
    .tavel-spa-showcase__card--1 .tavel-spa-showcase__overlay,
    .tavel-spa-showcase__card--2 .tavel-spa-showcase__background,
    .tavel-spa-showcase__card--2 .tavel-spa-showcase__full,
    .tavel-spa-showcase__card--2 .tavel-spa-showcase__overlay {
        inset: 0 !important;

        top: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        left: 0 !important;

        width: 100% !important;
        height: 100% !important;
        aspect-ratio: auto !important;

        -webkit-mask: none !important;
        mask: none !important;

        -webkit-mask-image: none !important;
        mask-image: none !important;

        -webkit-mask-repeat: initial !important;
        mask-repeat: initial !important;

        -webkit-mask-position: initial !important;
        mask-position: initial !important;

        -webkit-mask-size: auto !important;
        mask-size: auto !important;

        -webkit-clip-path: none !important;
        clip-path: none !important;

        border-radius: var(--spa-radius) !important;

        transform: none !important;
    }

    .tavel-spa-showcase .tavel-spa-showcase__background,
    .tavel-spa-showcase .tavel-spa-showcase__overlay {
        display: block !important;
    }

    .tavel-spa-showcase .tavel-spa-showcase__full {
        display: none !important;
        opacity: 0 !important;
    }

    .tavel-spa-showcase .tavel-spa-showcase__overlay {
        background:
            linear-gradient(
                180deg,
                rgba(10, 10, 10, 0) 0%,
                rgba(10, 10, 10, 0.05) 40%,
                rgba(10, 10, 10, 0.36) 76%,
                rgba(10, 10, 10, 0.62) 100%
            ) !important;
    }

    .tavel-spa-showcase__content,
    .tavel-spa-showcase__card--1 .tavel-spa-showcase__content,
    .tavel-spa-showcase__card--2 .tavel-spa-showcase__content {
        inset: 0 !important;

        right: 0 !important;
        left: 0 !important;

        width: 100% !important;
        max-width: none !important;
        height: 100% !important;
        aspect-ratio: auto !important;

        padding: 28px 24px !important;

        align-items: flex-start !important;
        text-align: left !important;

        transform: none !important;
    }

    .tavel-spa-showcase .tavel-spa-showcase__button,
    .tavel-spa-showcase .tavel-spa-showcase__button.button,
    .tavel-spa-showcase .tavel-spa-showcase__button.button.prymary,
    .tavel-spa-showcase .tavel-spa-showcase__button.button.prymary.is-outline {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;

        gap: 10px !important;

        width: auto !important;
        min-width: 0 !important;
        min-height: 34px !important;

        margin-top: 20px !important;
        padding: 8px 18px !important;

        color: #fff !important;
        -webkit-text-fill-color: #fff !important;

        background: transparent !important;

        border: 1px solid #fff !important;
        border-radius: 999px !important;

        box-sizing: border-box !important;
        box-shadow: none !important;
        text-shadow: none !important;

        font-family: inherit !important;
        font-size: var(--spa-button-size) !important;
        font-style: normal !important;
        font-weight: 400 !important;
        line-height: 1.4 !important;
        letter-spacing: 0 !important;

        opacity: 1 !important;
        transform: none !important;
    }

    .tavel-spa-showcase .tavel-spa-showcase__button span,
    .tavel-spa-showcase .tavel-spa-showcase__button strong,
    .tavel-spa-showcase .tavel-spa-showcase__button b,
    .tavel-spa-showcase .tavel-spa-showcase__button .tavel-spa-showcase__arrow {
        color: inherit !important;
        -webkit-text-fill-color: inherit !important;

        font-family: inherit !important;
        font-weight: 400 !important;

        text-shadow: none !important;
    }

    .tavel-spa-showcase .tavel-spa-showcase__button:hover,
    .tavel-spa-showcase .tavel-spa-showcase__button:focus,
    .tavel-spa-showcase .tavel-spa-showcase__button.button:hover,
    .tavel-spa-showcase .tavel-spa-showcase__button.button:focus,
    .tavel-spa-showcase .tavel-spa-showcase__button.button.prymary.is-outline:hover,
    .tavel-spa-showcase .tavel-spa-showcase__button.button.prymary.is-outline:focus {
        color: #111 !important;
        -webkit-text-fill-color: #111 !important;

        background: #fff !important;
        border-color: #fff !important;
    }

    .tavel-spa-showcase .tavel-spa-showcase__button:hover span,
    .tavel-spa-showcase .tavel-spa-showcase__button:focus span,
    .tavel-spa-showcase .tavel-spa-showcase__button:hover .tavel-spa-showcase__arrow,
    .tavel-spa-showcase .tavel-spa-showcase__button:focus .tavel-spa-showcase__arrow {
        color: #111 !important;
        -webkit-text-fill-color: #111 !important;

        font-weight: 400 !important;
    }

}


/* =========================================================
   REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

    .tavel-spa-showcase__card,
    .tavel-spa-showcase__hit,
    .tavel-spa-showcase__background,
    .tavel-spa-showcase__full,
    .tavel-spa-showcase__overlay,
    .tavel-spa-showcase__content,
    .tavel-spa-showcase__title,
    .tavel-spa-showcase__button,
    .tavel-spa-showcase__arrow {
        transition: none !important;
    }

}