/* Accommodation Details */
.element-12 {
    font-family: var(--wpt-primary-font);
    color: var(--wpt-text-colour)
}

.element-12.version-1 .wpt-row {
    display: grid!important;
    grid-template-columns: auto 50%;
    grid-gap: 30px;
}

#sidebar {
}

@media(max-width: 700px) {
    .element-12 .wpt-row {
        display:block!important;
    }
    .element-12 #check-availability .wpt-row {
        display:grid!important;
    }
}

.element-12 .slick-slide img {
    width: 100%;
}

section.element-12.version-2 {
    margin-top: 0!important;
    padding: 0!important;
}
.element-12.version-2 .accommodation-content--images {
   padding-bottom: 32px;
}
.element-12.version-2 .accommodation-content--images:not(.single-slider) {
    display: grid;
    grid-template-columns: 72% auto;
}

.element-12.version-2 .accommodation-content--images .main-slider .slick-slide {
    height: 563px!important;
    position: relative;
}

.element-12.version-2 .accommodation-content {
    max-width: 1200px;
    margin: 0 auto;
    background: white;
    padding: 16px 16px 0;
    /* margin-top:-500px; */
    z-index: 1;
    position: relative ;
    width: calc(100% - 30px);
}

.element-12.version-2.rounded-corners-true .accommodation-content {
    border-radius: 30px
}
.element-12.version-2 .accommodation-content .accommodation-content-row:first-child #check-availability {
    padding-top:0;
}

.element-12.version-2 .accommodation-content .slider-right {
    overflow: hidden;
    margin-left: 8px;
}

.element-12.version-2.rounded-corners-true .accommodation-content .slider-right {
    border-radius: 0 18px 18px 0;
}

.element-12.version-2 .accommodation-content .slider-right > div {
    margin: -8px -8px -8px 0;
    height: calc(100% + 16px);
}

.element-12.version-2 .accommodation-content--images .slick-slide {
    font-size: 0;
    border: unset;
    padding: 0;
}

.element-12.version-2 .accommodation-content--images .main-slider-thumbs .slick-slide {
    padding: 8px;
    height: 193px;
}

.element-12.version-2 .accommodation-content--images .main-slider-thumbs .slick-slide >div {
    height: 100%;
}

.element-12.version-2 .accommodation-content--images .slick-slider {
    /* position: relative; */
    /* max-height: 100%; */
}

.element-12.version-2.rounded-corners-true .accommodation-content .slider-left {
    border-radius: 18px 0 0 18px;
}
.element-12.version-2 .accommodation-content .slider-left {
    
    overflow: hidden;
}
.element-12.version-2.rounded-corners-true .accommodation-content .accommodation-content--images.single-slider .slider-left {
    border-radius:18px;
}

.element-12.version-2 .accommodation-content--images .main-slider .slick-slide>div {
    width: 100%;
    height: 100%;
    position: relative;
    max-width: 100vw;
}

.element-12.version-2 .accommodation-content--images .main-slider .slick-slide img {
    object-fit: contain;
    width: 100%;
    height: 100%;
    z-index: 1;
    position: absolute;
    max-width: 100vw;
}

.element-12.version-2 .accommodation-content--images .main-slider .slick-slide a {
    display: block!important;
    position: relative;
    width: 100%;
    height: 100%;
    max-width:100vw
}

.element-12.version-2 .accommodation-content--images .main-slider .slick-slide a:before {
    position: absolute;
    content: '';
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.2);
    backdrop-filter: blur(10px);
}

.element-12.version-2 .accommodation-content--images .slick-slider .slick-arrows {
    position: absolute;
}

.element-12.version-2 .accommodation-content--images .slick-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.element-12.version-2 .main-slider.slick-vertical {
    width: 100%;
}

.element-12.version-2 .accommodation-banner {
    position: relative;
}

.element-12.version-2 .accommodation-banner:before {
    content: '';
    position: absolute;
    width: 100%;
    height: 490px;
    background: rgba(0,0,0,0.1);
    backdrop-filter: blur(4px);
    box-shadow: 0 0px 150px rgba(0,0,0,0.2);
}

.element-12.version-2 .accommodation-banner img {
    width: 100%;
    height: 490px;
    object-fit: cover;
    margin-bottom: -360px;
}

.element-12.version-2 .slick-arrow {
    position: absolute;
    top: 50%;
    left: 15px;
    transform: translateY(-50%);
    opacity: 1;
    font-weight: 600;
    z-index: 12;
    color: white;
}

.element-12.version-2 .slick-arrow.fa-chevron-right {
    left: unset;
    right: 15px;
}

@media(max-width: 900px) {
    .element-12.version-2 .accommodation-content--images .main-slider-thumbs .slick-slide {
        height: 123px;
    }

    .element-12.version-2 .accommodation-content--images .main-slider .slick-slide {
        height: 476px!important
    }
}

@media(max-width: 780px) {
    .element-12.version-2 .accommodation-content--images {
        grid-template-columns:1fr!important
    }

    .element-12.version-2 .accommodation-content .slider-right {
        margin-left: 0;
        margin-top: 16px;
    }

    .element-12.version-2.rounded-corners-true .accommodation-content .slider-right {
    }

    .element-12.version-2 .accommodation-content .slider-right > div {
        margin: -8px;
        height: unset;
        width: calc(100% + 16px);
        height: calc(100% + 16px);
    }
    .element-12.version-2.rounded-corners-true .accommodation-content .slider-left {
        border-radius:18px 18px 0 0;
    }
    .element-12.version-2.rounded-corners-true .accommodation-content .slider-right {
        border-radius:0 0 18px 18px;
    }
    .element-12.version-2 .accommodation-content--images .main-slider .slick-slide {
        height:60vw!important
    }
    .element-12.version-2 .accommodation-banner img {
        height:200px;
        margin-bottom:-100px;
    }
    .element-12.version-2 .accommodation-banner:before {
        height:200px;
    }
}

.element-12.version-2 .accommodation-content-row .price-per-night-positioner {
    position:relative;
    grid-column:span 2;
    margin-top: -16px;}
.element-12.version-2 .price-per-night-container {
    position:absolute;
    top:-16px;
    transform:translateY(-50%);
    z-index:1;
    left:35px
}
.element-12.version-2 .price-per-night-container .sub-text{
    font-size: 11px;
    opacity:0.5
;padding: 7px;display: inline-block;transform: translateY(9%);}
.element-12.version-2 .price-per-night {
    background:var(--wpt-primary-colour);
    color:white;
    display:inline-flex;
    align-items:flex-end;
    font-size: 43px;
    font-weight:bold;
    line-height:1;
    padding: 13px 19px 14px 24px;


}
.element-12.version-2.rounded-corners-true .price-per-night {
    border-radius:100px
}
.element-12.version-2 .price-per-night span {
    font-size: 16px;}
.element-12.version-2 .accommodation-content-row {
    max-width: 1200px;
    margin: 0 auto;
    background: white;
    /* padding: 16px; */
    /* margin-top:-500px; */
    z-index: 1;
    /* position: relative ; */
    width: 100%;
    /*margin-bottom: 30px;*/
    display:
        grid;
    grid-template-columns: 25% auto;
    column-gap: 50px;
}
.element-12.version-2 .stars-and-icons {
    display:flex;
    gap:20px;
    align-items:center;
    margin-bottom:1.2em;
    flex-wrap: wrap;}
.element-12.version-2 .star-rating {
    color:#FFC46D;
    display:inline-flex;
    gap:9px;
    font-size:16px;
    font-weight:400;
}

.element-12.version-2 .accommodation-icons {
    position:static;
    color: var(--wpt-primary-colour)
}
.element-12.version-2 .accommodation-icons i {
    font-weight:400!important;
}
.element-12.version-2 .accommodation-icons {
    display:flex;
    gap:20px
;flex-wrap: wrap;}
.element-12.version-2 .accommodation-icons>span {
    display:flex;
    gap:10px;
    align-items:center;
}
.element-12.version-2 .accommodation-details-text {
    padding-top:40px;
}
.element-12.version-2 .wpt-title {
    padding-bottom:0.71em
}
.element-12.version-2 .wpt-title::after {
    content: '';
    display: block;
    position: absolute;
    bottom: 0;
    left: 0%;
    transform: translateX(0%);
    width: 120px;
    height: 4px;
    background: var(--wpt-primary-colour);
}
.bobble{
    animation:bobble 1s;
}
@keyframes bobble {
    0% {transform:scale(1)}
    50% {transform:scale(1)}
    75% {transform:scale(1.1)}
    100% {transform:scale(1)}
}

.element-12.version-2 .long-content, .element-12.version-2 .long-content p, .element-12.version-2 .long-content :is(ul,li,ol) {
    font-size:18px;
}
.element-12.version-2 #features {
    margin-left:-5px;
}
@media(max-width:1090px) {
    .element-12.version-2 .accommodation-content-row {
        grid-template-columns: 253px auto;
    }
}
@media(max-width:780px) {
    .element-12.version-2 .accommodation-content-row {
        grid-template-columns: 1fr!important;
    }
    .element-12.version-2 .accommodation-content-row .price-per-night-positioner {
        grid-column:span 1!important;
    }
    .element-12.version-2 #check-availability {
        order:2

    }
    .element-12.version-2 .price-per-night-container {
        position: static;

        transform: unset;
        display:flex;
        gap:10px;
        align-items:center;

    }
    .element-12.version-2 .price-per-night {
        font-size:26px;
    }
    .element-12.version-2 .price-per-night span {
        font-size:12px
    }
    .element-12.version-2 .price-per-night-container .sub-text {
        padding:0;
        transform:unset;
    }
    .element-12.version-2 .wpt-title {
        font-size:30px
    }
    .accommodation-icons {
        font-size:15px
    }
    .element-12.version-2 .long-content, .element-12.version-2 .long-content p, .element-12.version-2 .long-content :is(ul,li,ol) {
        font-size:15px;
    }
}