.elementor-283 .elementor-element.elementor-element-e49462a{--display:flex;--margin-top:-98px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}:root{--page-title-display:none;}/* Start custom CSS for html, class: .elementor-element-e71ff87 *//* =====================================================
   DELUXE ROOM — HERO
===================================================== */

.serenity-deluxe-hero{

    position:relative;

    width:100%;

    height:700px;

    display:flex;

    align-items:center;

    justify-content:center;

    overflow:hidden;

    color:#fff;

}


/* BACKGROUND */

.serenity-deluxe-hero-bg{

    position:absolute;

    inset:0;

    overflow:hidden;

}


.serenity-deluxe-hero-bg img{

    width:100%;

    height:100%;

    display:block;

    object-fit:cover;

    object-position:center;

    transform:scale(1.04);

    animation:
        serenityDeluxeZoom
        15s
        ease-in-out
        infinite
        alternate;

}


@keyframes serenityDeluxeZoom{

    from{
        transform:scale(1.04);
    }

    to{
        transform:scale(1.09);
    }

}


/* OVERLAY */

.serenity-deluxe-hero-overlay{

    position:absolute;

    inset:0;

    background:
        linear-gradient(
            90deg,
            rgba(18,15,12,.88),
            rgba(18,15,12,.52),
            rgba(18,15,12,.25)
        );

}


/* FRAME */

.serenity-deluxe-hero-frame{

    position:absolute;

    inset:30px;

    border:
        1px solid
        rgba(255,255,255,.18);

    pointer-events:none;

}


/* CONTENT */

.serenity-deluxe-hero-content{

    position:relative;

    z-index:5;

    width:min(800px,86%);

    text-align:center;

}


.serenity-deluxe-hero-content h1{

    margin:0;

    font-family:
        "Cormorant Garamond",
        serif;

    font-size:
        clamp(70px,9vw,120px);

    line-height:.78;

    font-weight:400;

}


.serenity-deluxe-hero-content h1 em{

    display:block;

    color:#d2ad88;

    font-style:italic;

}


.serenity-deluxe-hero-content p{

    max-width:520px;

    margin:
        30px auto 0;

    color:
        rgba(255,255,255,.75);

    font-size:10px;

    line-height:2;

}


.serenity-deluxe-hero-line{

    width:50px;

    height:1px;

    margin:
        28px auto 15px;

    background:#d2ad88;

}


.serenity-deluxe-hero-content > span{

    color:
        rgba(255,255,255,.52);

    font-size:7px;

    letter-spacing:2.5px;

}


/* ROOM NUMBER */

.serenity-deluxe-number{

    position:absolute;

    left:35px;

    bottom:35px;

    z-index:5;

    display:flex;

    flex-direction:column;

    gap:5px;

}


.serenity-deluxe-number span{

    color:#d2ad88;

    font-family:
        "Cormorant Garamond",
        serif;

    font-size:34px;

    line-height:1;

}


.serenity-deluxe-number small{

    color:
        rgba(255,255,255,.42);

    font-size:6px;

    letter-spacing:2px;

}


/* SCROLL */

.serenity-deluxe-scroll{

    position:absolute;

    right:35px;

    bottom:30px;

    z-index:5;

    display:flex;

    flex-direction:column;

    align-items:center;

    gap:8px;

}


.serenity-deluxe-scroll span{

    color:
        rgba(255,255,255,.55);

    font-size:6px;

    letter-spacing:2px;

    writing-mode:vertical-rl;

}


.serenity-deluxe-scroll i{

    width:1px;

    height:38px;

    background:
        linear-gradient(
            to bottom,
            #d2ad88,
            transparent
        );

    animation:
        serenityDeluxeScroll
        2s
        ease-in-out
        infinite;

}


@keyframes serenityDeluxeScroll{

    0%{
        transform:scaleY(.4);
        opacity:.3;
        transform-origin:top;
    }

    50%{
        transform:scaleY(1);
        opacity:1;
    }

    100%{
        transform:scaleY(.4);
        opacity:.3;
        transform-origin:bottom;
    }

}


/* MOBILE */

@media(max-width:600px){

    .serenity-deluxe-hero{

        height:590px;

    }


    .serenity-deluxe-hero-frame{

        inset:15px;

    }


    .serenity-deluxe-hero-content{

        width:82%;

    }


    .serenity-deluxe-hero-content h1{

        font-size:62px;

    }


    .serenity-deluxe-number{

        left:22px;

        bottom:22px;

    }


    .serenity-deluxe-scroll{

        right:22px;

        bottom:22px;

    }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-c7a8f3d *//* =====================================================
   DELUXE ROOM — PART 01
   HERO
===================================================== */

.serenity-deluxe-hero{

    position:relative;

    width:100%;

    min-height:760px;

    display:flex;

    align-items:center;

    justify-content:center;

    overflow:visible;

    color:#fff;

}


/* =========================================
   BACKGROUND
========================================= */

.serenity-deluxe-hero-bg{

    position:absolute;

    inset:0;

    overflow:hidden;

}


.serenity-deluxe-hero-bg img{

    width:100%;

    height:100%;

    display:block;

    object-fit:cover;

    object-position:center;

    transform:scale(1.04);

    animation:
        serenityDeluxeZoom
        15s
        ease-in-out
        infinite
        alternate;

}


@keyframes serenityDeluxeZoom{

    from{
        transform:scale(1.04);
    }

    to{
        transform:scale(1.09);
    }

}


/* =========================================
   OVERLAY
========================================= */

.serenity-deluxe-hero-overlay{

    position:absolute;

    inset:0;

    background:
        linear-gradient(
            90deg,
            rgba(18,15,12,.88),
            rgba(18,15,12,.55),
            rgba(18,15,12,.28)
        );

}


/* =========================================
   FRAME
========================================= */

.serenity-deluxe-hero-frame{

    position:absolute;

    inset:30px;

    border:
        1px solid
        rgba(255,255,255,.18);

    pointer-events:none;

}


/* =========================================
   HERO CONTENT
========================================= */

.serenity-deluxe-hero-content{

    position:relative;

    z-index:5;

    width:min(800px,86%);

    margin-top:-75px;

    text-align:center;

}


.serenity-deluxe-hero-content h1{

    margin:0;

    font-family:
        "Cormorant Garamond",
        serif;

    font-size:
        clamp(70px,9vw,120px);

    line-height:.78;

    font-weight:400;

}


.serenity-deluxe-hero-content h1 em{

    display:block;

    color:#d2ad88;

    font-style:italic;

}


.serenity-deluxe-hero-content p{

    max-width:520px;

    margin:
        30px auto 0;

    color:
        rgba(255,255,255,.75);

    font-size:10px;

    line-height:2;

}


.serenity-deluxe-hero-line{

    width:50px;

    height:1px;

    margin:
        28px auto 15px;

    background:#d2ad88;

}


.serenity-deluxe-hero-content > span{

    color:
        rgba(255,255,255,.52);

    font-size:7px;

    letter-spacing:2.5px;

}


/* =========================================
   ROOM NUMBER
========================================= */

.serenity-deluxe-number{

    position:absolute;

    left:35px;

    bottom:35px;

    z-index:5;

    display:flex;

    flex-direction:column;

    gap:5px;

}


.serenity-deluxe-number span{

    color:#d2ad88;

    font-family:
        "Cormorant Garamond",
        serif;

    font-size:34px;

    line-height:1;

}


.serenity-deluxe-number small{

    color:
        rgba(255,255,255,.42);

    font-size:6px;

    letter-spacing:2px;

}


/* =========================================
   SCROLL
========================================= */

.serenity-deluxe-scroll{

    position:absolute;

    right:35px;

    bottom:30px;

    z-index:5;

    display:flex;

    flex-direction:column;

    align-items:center;

    gap:8px;

}


.serenity-deluxe-scroll span{

    color:
        rgba(255,255,255,.55);

    font-size:6px;

    letter-spacing:2px;

    writing-mode:vertical-rl;

}


.serenity-deluxe-scroll i{

    width:1px;

    height:38px;

    background:
        linear-gradient(
            to bottom,
            #d2ad88,
            transparent
        );

}


/* =========================================
   BOOKING FORM
========================================= */

.serenity-rooms-booking{

    position:absolute;

    left:50%;

    bottom:-45px;

    z-index:20;

    transform:translateX(-50%);

    width:min(1080px,86%);

    min-height:90px;

    padding:12px;

    display:grid;

    grid-template-columns:
        1fr
        1px
        1fr
        1px
        1fr
        1.35fr;

    align-items:center;

    background:
        rgba(255,255,255,.97);

    box-shadow:
        0 25px 60px
        rgba(0,0,0,.24);

}


/* =========================================
   FORM FIELD
========================================= */

.serenity-booking-field{

    padding:
        8px 25px;

}


.serenity-booking-field label{

    display:block;

    margin-bottom:7px;

    color:#a88b70;

    font-size:6px;

    letter-spacing:2px;

    line-height:1;

}


.serenity-booking-field input,
.serenity-booking-field select{

    width:100%;

    height:25px;

    padding:0;

    margin:0;

    border:0;

    outline:0;

    background:transparent;

    color:#302a25;

    font-family:inherit;

    font-size:10px;

    box-shadow:none;

}


.serenity-booking-field input{

    cursor:pointer;

}


.serenity-booking-field select{

    cursor:pointer;

}


/* DATE ICON */

.serenity-booking-field
input[type="date"]::-webkit-calendar-picker-indicator{

    opacity:.55;

    cursor:pointer;

}


/* =========================================
   DIVIDERS
========================================= */

.serenity-booking-divider{

    width:1px;

    height:42px;

    background:#ddd5cd;

}


/* =========================================
   CHECK AVAILABILITY
========================================= */

.serenity-check-availability{

    height:66px;

    margin-left:8px;

    padding:
        0 25px;

    border:0;

    outline:0;

    background:#292621;

    color:#fff;

    cursor:pointer;

    font-family:inherit;

    font-size:7px;

    letter-spacing:1.8px;

    transition:
        background .3s ease,
        transform .3s ease;

}


.serenity-check-availability span{

    display:inline-block;

    margin-left:15px;

    color:#d2ad88;

    font-size:15px;

    transition:
        transform .3s ease;

}


.serenity-check-availability:hover{

    background:#b38b68;

}


.serenity-check-availability:hover span{

    color:#fff;

    transform:translateX(4px);

}


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

@media(max-width:900px){

    .serenity-deluxe-hero{

        min-height:800px;

    }


    .serenity-rooms-booking{

        width:88%;

        grid-template-columns:
            1fr 1fr;

        gap:8px;

        padding:15px;

    }


    .serenity-booking-divider{

        display:none;

    }


    .serenity-check-availability{

        grid-column:
            1 / 3;

        width:100%;

        margin-left:0;

    }

}


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

@media(max-width:600px){

    .serenity-deluxe-hero{

        min-height:850px;

    }


    .serenity-deluxe-hero-frame{

        inset:15px;

    }


    .serenity-deluxe-hero-content{

        width:82%;

        margin-top:-170px;

    }


    .serenity-deluxe-hero-content h1{

        font-size:62px;

    }


    .serenity-deluxe-number{

        left:22px;

        bottom:22px;

    }


    .serenity-deluxe-scroll{

        display:none;

    }


    /* MOBILE BOOKING FORM */

    .serenity-rooms-booking{

        bottom:-90px;

        width:
            calc(100% - 40px);

        display:flex;

        flex-direction:column;

        align-items:stretch;

        gap:0;

        padding:15px;

    }


    .serenity-booking-field{

        padding:
            12px 10px;

    }


    .serenity-booking-field
    + .serenity-booking-field{

        border-top:
            1px solid #ddd5cd;

    }


    .serenity-booking-divider{

        display:none;

    }


    .serenity-check-availability{

        width:100%;

        height:58px;

        margin:
            8px 0 0;

    }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-5a1ed74 *//* =====================================================
   DELUXE ROOM — PART 02
   INTRODUCTION
===================================================== */

.serenity-deluxe-intro{

    position:relative;

    width:100%;

    padding:
        125px 7vw 110px;

    background:#f4f1eb;

    display:grid;

    grid-template-columns:
        1fr 1fr;

    gap:8vw;

    align-items:center;

}


/* =====================================================
   IMAGE
===================================================== */

.serenity-deluxe-intro-image{

    position:relative;

    height:620px;

    overflow:hidden;

}


.serenity-deluxe-intro-image img{

    width:100%;

    height:100%;

    display:block;

    object-fit:cover;

    transition:
        transform 1s
        cubic-bezier(.2,.7,.2,1);

}


.serenity-deluxe-intro-image:hover img{

    transform:scale(1.04);

}


/* IMAGE NUMBER */

.serenity-deluxe-intro-image-number{

    position:absolute;

    left:25px;

    bottom:22px;

    z-index:3;

    color:#fff;

    font-family:
        "Cormorant Garamond",
        serif;

    font-size:34px;

    text-shadow:
        0 3px 15px
        rgba(0,0,0,.3);

}


/* =====================================================
   CONTENT
===================================================== */

.serenity-deluxe-intro-content{

    max-width:520px;

}


.serenity-deluxe-intro-content h2{

    margin:0;

    color:#292621;

    font-family:
        "Cormorant Garamond",
        serif;

    font-size:
        clamp(52px,5vw,76px);

    line-height:.82;

    font-weight:400;

}


.serenity-deluxe-intro-content h2 em{

    display:block;

    color:#b38b68;

    font-style:italic;

}


/* =====================================================
   DIVIDER
===================================================== */

.serenity-deluxe-intro-line{

    width:50px;

    height:1px;

    margin:
        28px 0;

    background:#b38b68;

}


/* =====================================================
   TEXT
===================================================== */

.serenity-deluxe-intro-content p{

    max-width:470px;

    margin:
        0 0 16px;

    color:#77716b;

    font-size:10px;

    line-height:2;

}


/* =====================================================
   HIGHLIGHT
===================================================== */

.serenity-deluxe-intro-highlight{

    display:flex;

    align-items:center;

    gap:18px;

    margin:
        28px 0 5px;

    padding:
        15px 0;

    border-top:
        1px solid #ddd5cd;

    border-bottom:
        1px solid #ddd5cd;

}


.serenity-deluxe-intro-highlight div{

    width:42px;

    height:42px;

    display:flex;

    align-items:center;

    justify-content:center;

    border:
        1px solid #b38b68;

    border-radius:50%;

}


.serenity-deluxe-intro-highlight div span{

    color:#b38b68;

    font-family:
        "Cormorant Garamond",
        serif;

    font-size:17px;

}


.serenity-deluxe-intro-highlight p{

    margin:0;

    color:#81766d;

    font-size:6px;

    line-height:1.8;

    letter-spacing:2px;

}


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

.serenity-deluxe-book{

    display:inline-flex;

    align-items:center;

    gap:18px;

    margin-top:25px;

    padding:
        15px 20px;

    background:#292621;

    color:#fff;

    font-size:7px;

    letter-spacing:1.7px;

    transition:
        background .3s ease,
        transform .3s ease;

}


.serenity-deluxe-book span{

    color:#d2ad88;

    font-size:15px;

}


.serenity-deluxe-book:hover{

    background:#b38b68;

    color:#fff;

    transform:
        translateY(-3px);

}


.serenity-deluxe-book:hover span{

    color:#fff;

}


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

@media(max-width:800px){

    .serenity-deluxe-intro{

        grid-template-columns:1fr;

        padding:
            90px 25px;

        gap:55px;

    }


    .serenity-deluxe-intro-image{

        height:540px;

    }


    .serenity-deluxe-intro-content{

        max-width:100%;

    }

}


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

@media(max-width:600px){

    .serenity-deluxe-intro{

        padding:
            75px 20px;

    }


    .serenity-deluxe-intro-image{

        height:430px;

    }


    .serenity-deluxe-intro-content h2{

        font-size:54px;

    }


    .serenity-deluxe-intro-highlight{

        margin-top:25px;

    }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-9d28a32 *//* =====================================================
   DELUXE ROOM — PART 03
   FEATURES & COMFORT
===================================================== */

.serenity-deluxe-features{

    width:100%;

    padding:
        110px 7vw 95px;

    background:#211c18;

    color:#fff;

}


/* =====================================================
   HEADING
===================================================== */

.serenity-deluxe-features-heading{

    max-width:700px;

    margin:
        0 auto 65px;

    text-align:center;

}


.serenity-deluxe-features-heading h2{

    margin:0;

    font-family:
        "Cormorant Garamond",
        serif;

    font-size:
        clamp(52px,5vw,72px);

    line-height:.84;

    font-weight:400;

}


.serenity-deluxe-features-heading h2 em{

    display:block;

    color:#d2ad88;

    font-style:italic;

}


.serenity-deluxe-features-heading p{

    max-width:510px;

    margin:
        20px auto 0;

    color:
        rgba(255,255,255,.5);

    font-size:10px;

    line-height:2;

}


/* =====================================================
   FEATURE GRID
===================================================== */

.serenity-deluxe-feature-grid{

    max-width:1100px;

    margin:0 auto;

    display:grid;

    grid-template-columns:
        repeat(4,1fr);

    border-top:
        1px solid
        rgba(255,255,255,.13);

    border-bottom:
        1px solid
        rgba(255,255,255,.13);

}


/* =====================================================
   FEATURE
===================================================== */

.serenity-deluxe-feature{

    position:relative;

    min-height:330px;

    padding:
        35px 28px;

    border-right:
        1px solid
        rgba(255,255,255,.13);

    transition:
        background .4s ease;

}


.serenity-deluxe-feature:last-child{

    border-right:0;

}


.serenity-deluxe-feature:hover{

    background:
        rgba(255,255,255,.035);

}


/* =====================================================
   NUMBER
===================================================== */

.serenity-deluxe-feature-number{

    position:absolute;

    top:22px;

    right:24px;

    color:
        rgba(255,255,255,.15);

    font-family:
        "Cormorant Garamond",
        serif;

    font-size:35px;

}


/* =====================================================
   ICON
===================================================== */

.serenity-deluxe-feature-icon{

    width:52px;

    height:52px;

    display:flex;

    align-items:center;

    justify-content:center;

    margin-bottom:40px;

    border:
        1px solid
        rgba(210,173,136,.4);

    border-radius:50%;

    color:#d2ad88;

    font-size:19px;

    transition:
        all .4s ease;

}


.serenity-deluxe-feature:hover
.serenity-deluxe-feature-icon{

    background:#b38b68;

    color:#fff;

    transform:
        translateY(-3px);

}


/* =====================================================
   TITLE
===================================================== */

.serenity-deluxe-feature h3{

    margin:0;

    font-family:
        "Cormorant Garamond",
        serif;

    font-size:29px;

    line-height:.85;

    font-weight:400;

}


.serenity-deluxe-feature h3 em{

    display:block;

    color:#d2ad88;

    font-style:italic;

}


/* =====================================================
   DESCRIPTION
===================================================== */

.serenity-deluxe-feature p{

    max-width:200px;

    margin:
        20px 0 0;

    color:
        rgba(255,255,255,.45);

    font-size:9px;

    line-height:2;

}


/* =====================================================
   BOTTOM
===================================================== */

.serenity-deluxe-features-bottom{

    max-width:1100px;

    margin:
        35px auto 0;

    display:flex;

    align-items:center;

    gap:20px;

}


.serenity-deluxe-features-bottom span{

    color:
        rgba(255,255,255,.32);

    font-size:6px;

    letter-spacing:2px;

}


.serenity-deluxe-features-bottom div{

    flex:1;

    height:1px;

    background:
        rgba(255,255,255,.12);

}


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

@media(max-width:900px){

    .serenity-deluxe-feature-grid{

        grid-template-columns:
            1fr 1fr;

    }


    .serenity-deluxe-feature:nth-child(2){

        border-right:0;

    }


    .serenity-deluxe-feature:nth-child(-n+2){

        border-bottom:
            1px solid
            rgba(255,255,255,.13);

    }

}


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

@media(max-width:600px){

    .serenity-deluxe-features{

        padding:
            75px 20px 70px;

    }


    .serenity-deluxe-feature-grid{

        grid-template-columns:1fr;

    }


    .serenity-deluxe-feature{

        min-height:auto;

        padding:
            30px 20px;

        border-right:0;

        border-bottom:
            1px solid
            rgba(255,255,255,.13);

    }


    .serenity-deluxe-feature:last-child{

        border-bottom:0;

    }


    .serenity-deluxe-feature-icon{

        margin-bottom:28px;

    }


    .serenity-deluxe-feature p{

        max-width:100%;

    }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-ce9725c *//* =====================================================
   DELUXE ROOM — PART 04
   PHOTO GALLERY
===================================================== */

.serenity-deluxe-gallery{

    width:100%;

    padding:
        110px 7vw 120px;

    background:#f4f1eb;

}


/* =====================================================
   HEADING
===================================================== */

.serenity-deluxe-gallery-heading{

    max-width:700px;

    margin:
        0 auto 60px;

    text-align:center;

}


.serenity-deluxe-gallery-heading h2{

    margin:0;

    color:#292621;

    font-family:
        "Cormorant Garamond",
        serif;

    font-size:
        clamp(52px,5vw,72px);

    line-height:.84;

    font-weight:400;

}


.serenity-deluxe-gallery-heading h2 em{

    display:block;

    color:#b38b68;

    font-style:italic;

}


.serenity-deluxe-gallery-heading p{

    max-width:500px;

    margin:
        20px auto 0;

    color:#77716b;

    font-size:10px;

    line-height:2;

}


/* =====================================================
   GALLERY GRID
===================================================== */

.serenity-deluxe-gallery-grid{

    max-width:1200px;

    margin:0 auto;

    display:grid;

    grid-template-columns:
        1.25fr .75fr .75fr;

    grid-template-rows:
        330px 260px 330px;

    gap:12px;

}


/* =====================================================
   PHOTO
===================================================== */

.serenity-deluxe-gallery-photo{

    position:relative;

    overflow:hidden;

    cursor:pointer;

}


.serenity-deluxe-gallery-photo img{

    width:100%;

    height:100%;

    display:block;

    object-fit:cover;

    transition:
        transform 1s
        cubic-bezier(.2,.7,.2,1);

}


.serenity-deluxe-gallery-photo:hover img{

    transform:scale(1.07);

}


/* =====================================================
   MAIN IMAGE
===================================================== */

.serenity-deluxe-gallery-main{

    grid-column:
        1 / 2;

    grid-row:
        1 / 3;

}


/* =====================================================
   WIDE IMAGE
===================================================== */

.serenity-deluxe-gallery-wide{

    grid-column:
        2 / 4;

}


/* =====================================================
   LAST IMAGE
===================================================== */

.serenity-deluxe-gallery-photo:last-child{

    grid-column:
        1 / 4;

}


/* =====================================================
   OVERLAY
===================================================== */

.serenity-deluxe-gallery-overlay{

    position:absolute;

    inset:0;

    background:
        linear-gradient(
            to top,
            rgba(12,10,8,.78),
            transparent 65%
        );

    opacity:.6;

    transition:
        opacity .4s ease;

}


.serenity-deluxe-gallery-photo:hover
.serenity-deluxe-gallery-overlay{

    opacity:.9;

}


/* =====================================================
   CAPTION
===================================================== */

.serenity-deluxe-gallery-caption{

    position:absolute;

    left:20px;

    right:20px;

    bottom:18px;

    z-index:3;

    display:flex;

    align-items:center;

    gap:12px;

}


.serenity-deluxe-gallery-caption span{

    color:#d2ad88;

    font-family:
        "Cormorant Garamond",
        serif;

    font-size:14px;

}


.serenity-deluxe-gallery-caption strong{

    color:#fff;

    font-family:
        "Cormorant Garamond",
        serif;

    font-size:20px;

    font-weight:400;

}


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

@media(max-width:900px){

    .serenity-deluxe-gallery-grid{

        grid-template-columns:
            1fr 1fr;

        grid-template-rows:
            400px 280px 280px 320px;

    }


    .serenity-deluxe-gallery-main{

        grid-column:
            1 / 3;

        grid-row:
            1 / 2;

    }


    .serenity-deluxe-gallery-wide{

        grid-column:
            1 / 3;

    }


    .serenity-deluxe-gallery-photo:last-child{

        grid-column:
            1 / 3;

    }

}


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

@media(max-width:600px){

    .serenity-deluxe-gallery{

        padding:
            75px 20px 85px;

    }


    .serenity-deluxe-gallery-grid{

        display:grid;

        grid-template-columns:1fr;

        grid-template-rows:none;

        gap:10px;

    }


    .serenity-deluxe-gallery-photo,
    .serenity-deluxe-gallery-main,
    .serenity-deluxe-gallery-wide,
    .serenity-deluxe-gallery-photo:last-child{

        grid-column:auto;

        grid-row:auto;

        height:380px;

    }


    .serenity-deluxe-gallery-main{

        height:470px;

    }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-208e36d *//* =====================================================
   DELUXE ROOM — PART 05
   BOOKING CTA
===================================================== */

.serenity-deluxe-booking-cta{

    position:relative;

    width:100%;

    min-height:520px;

    padding:
        100px 7vw;

    display:flex;

    flex-direction:column;

    align-items:center;

    justify-content:center;

    overflow:hidden;

    background:#292621;

    color:#fff;

}


/* =====================================================
   DECORATIVE NUMBER
===================================================== */

.serenity-deluxe-cta-number{

    position:absolute;

    right:6vw;

    top:45px;

    color:
        rgba(210,173,136,.12);

    font-family:
        "Cormorant Garamond",
        serif;

    font-size:
        clamp(150px,18vw,250px);

    line-height:.7;

    user-select:none;

}


/* =====================================================
   CONTENT
===================================================== */

.serenity-deluxe-cta-content{

    position:relative;

    z-index:3;

    max-width:700px;

    text-align:center;

}


.serenity-deluxe-cta-content h2{

    margin:0;

    font-family:
        "Cormorant Garamond",
        serif;

    font-size:
        clamp(55px,6vw,82px);

    line-height:.82;

    font-weight:400;

}


.serenity-deluxe-cta-content h2 em{

    display:block;

    color:#d2ad88;

    font-style:italic;

}


.serenity-deluxe-cta-content p{

    max-width:500px;

    margin:
        25px auto 0;

    color:
        rgba(255,255,255,.52);

    font-size:10px;

    line-height:2;

}


/* =====================================================
   ACTIONS
===================================================== */

.serenity-deluxe-cta-actions{

    display:flex;

    align-items:center;

    justify-content:center;

    gap:12px;

    margin-top:35px;

}


/* PRIMARY */

.serenity-deluxe-cta-primary{

    display:inline-flex;

    align-items:center;

    gap:18px;

    padding:
        16px 22px;

    background:#b38b68;

    color:#fff;

    font-size:7px;

    letter-spacing:1.8px;

    transition:
        background .3s ease,
        transform .3s ease;

}


.serenity-deluxe-cta-primary span{

    font-size:15px;

}


.serenity-deluxe-cta-primary:hover{

    background:#d2ad88;

    color:#292621;

    transform:
        translateY(-3px);

}


/* SECONDARY */

.serenity-deluxe-cta-secondary{

    display:inline-flex;

    align-items:center;

    gap:18px;

    padding:
        15px 21px;

    border:
        1px solid
        rgba(210,173,136,.5);

    color:#fff;

    font-size:7px;

    letter-spacing:1.8px;

    transition:
        all .3s ease;

}


.serenity-deluxe-cta-secondary span{

    color:#d2ad88;

    font-size:15px;

}


.serenity-deluxe-cta-secondary:hover{

    background:#fff;

    color:#292621;

    border-color:#fff;

}


.serenity-deluxe-cta-secondary:hover span{

    color:#b38b68;

}


/* =====================================================
   DECORATIVE LINE
===================================================== */

.serenity-deluxe-cta-line{

    position:absolute;

    left:7vw;

    right:7vw;

    bottom:65px;

    height:1px;

    background:
        rgba(255,255,255,.1);

}


/* =====================================================
   LOCATION
===================================================== */

.serenity-deluxe-cta-location{

    position:absolute;

    bottom:38px;

    z-index:3;

    color:
        rgba(255,255,255,.3);

    font-size:6px;

    letter-spacing:3px;

}


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

@media(max-width:600px){

    .serenity-deluxe-booking-cta{

        min-height:540px;

        padding:
            80px 20px 110px;

    }


    .serenity-deluxe-cta-number{

        top:35px;

        right:20px;

        font-size:130px;

    }


    .serenity-deluxe-cta-content h2{

        font-size:55px;

    }


    .serenity-deluxe-cta-content p{

        font-size:9px;

    }


    .serenity-deluxe-cta-actions{

        flex-direction:column;

        width:100%;

    }


    .serenity-deluxe-cta-primary,
    .serenity-deluxe-cta-secondary{

        width:100%;

        justify-content:center;

    }


    .serenity-deluxe-cta-line{

        left:20px;

        right:20px;

        bottom:65px;

    }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-1af63c3 *//* =====================================================
   DELUXE ROOM — PART 06
   OTHER ROOMS
===================================================== */

.serenity-other-rooms{

    width:100%;

    padding:
        110px 7vw 115px;

    background:#f4f1eb;

}


/* =====================================================
   HEADING
===================================================== */

.serenity-other-rooms-heading{

    max-width:700px;

    margin:
        0 auto 55px;

    text-align:center;

}


.serenity-other-rooms-heading h2{

    margin:0;

    color:#292621;

    font-family:
        "Cormorant Garamond",
        serif;

    font-size:
        clamp(52px,5vw,72px);

    line-height:.84;

    font-weight:400;

}


.serenity-other-rooms-heading h2 em{

    display:block;

    color:#b38b68;

    font-style:italic;

}


.serenity-other-rooms-heading p{

    max-width:480px;

    margin:
        20px auto 0;

    color:#77716b;

    font-size:10px;

    line-height:2;

}


/* =====================================================
   ROOM GRID
===================================================== */

.serenity-other-rooms-grid{

    max-width:1200px;

    margin:0 auto;

    display:grid;

    grid-template-columns:
        1fr 1fr;

    gap:14px;

}


/* =====================================================
   ROOM CARD
===================================================== */

.serenity-other-room-card{

    position:relative;

    height:540px;

    display:block;

    overflow:hidden;

    color:#fff;

}


.serenity-other-room-image{

    position:absolute;

    inset:0;

}


.serenity-other-room-image img{

    width:100%;

    height:100%;

    display:block;

    object-fit:cover;

    transition:
        transform 1s
        cubic-bezier(.2,.7,.2,1);

}


.serenity-other-room-card:hover
.serenity-other-room-image img{

    transform:scale(1.07);

}


/* =====================================================
   OVERLAY
===================================================== */

.serenity-other-room-overlay{

    position:absolute;

    inset:0;

    background:
        linear-gradient(
            to top,
            rgba(17,14,11,.94),
            rgba(17,14,11,.25) 65%,
            rgba(17,14,11,.08)
        );

}


/* =====================================================
   CONTENT
===================================================== */

.serenity-other-room-content{

    position:absolute;

    left:35px;

    right:35px;

    bottom:35px;

    z-index:5;

}


.serenity-other-room-number{

    position:absolute;

    right:0;

    bottom:0;

    color:
        rgba(255,255,255,.16);

    font-family:
        "Cormorant Garamond",
        serif;

    font-size:80px;

    line-height:1;

}


.serenity-other-room-content h3{

    margin:0;

    color:#fff;

    font-family:
        "Cormorant Garamond",
        serif;

    font-size:
        clamp(48px,4vw,65px);

    line-height:.78;

    font-weight:400;

}


.serenity-other-room-content h3 em{

    display:block;

    color:#d2ad88;

    font-style:italic;

}


.serenity-other-room-content p{

    max-width:390px;

    margin:
        18px 0 22px;

    color:
        rgba(255,255,255,.6);

    font-size:9px;

    line-height:2;

}


/* =====================================================
   VIEW LINK
===================================================== */

.serenity-other-room-link{

    display:inline-flex;

    align-items:center;

    gap:15px;

    color:#fff;

    font-size:7px;

    letter-spacing:1.8px;

}


.serenity-other-room-link b{

    color:#d2ad88;

    font-size:16px;

    font-weight:400;

    transition:
        transform .3s ease;

}


.serenity-other-room-card:hover
.serenity-other-room-link b{

    transform:
        translateX(5px);

}


/* =====================================================
   CURRENT ROOM
===================================================== */

.serenity-other-rooms-current{

    max-width:1200px;

    margin:
        35px auto 0;

    display:flex;

    align-items:center;

    gap:15px;

}


.serenity-other-rooms-current span{

    color:#b38b68;

    font-family:
        "Cormorant Garamond",
        serif;

    font-size:24px;

}


.serenity-other-rooms-current div{

    width:55px;

    height:1px;

    background:#cdbdad;

}


.serenity-other-rooms-current small{

    color:#81766d;

    font-size:6px;

    letter-spacing:2px;

}


/* =====================================================
   ALL ROOMS BUTTON
===================================================== */

.serenity-other-rooms-bottom{

    margin-top:40px;

    text-align:center;

}


.serenity-other-rooms-bottom a{

    display:inline-flex;

    align-items:center;

    gap:17px;

    padding:
        14px 20px;

    border:
        1px solid #b38b68;

    color:#5c4b3e;

    font-size:7px;

    letter-spacing:1.8px;

    transition:
        all .3s ease;

}


.serenity-other-rooms-bottom a span{

    color:#b38b68;

    font-size:15px;

}


.serenity-other-rooms-bottom a:hover{

    background:#b38b68;

    color:#fff;

}


.serenity-other-rooms-bottom a:hover span{

    color:#fff;

}


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

@media(max-width:800px){

    .serenity-other-rooms-grid{

        grid-template-columns:1fr;

    }


    .serenity-other-room-card{

        height:500px;

    }

}


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

@media(max-width:600px){

    .serenity-other-rooms{

        padding:
            75px 20px 85px;

    }


    .serenity-other-room-card{

        height:470px;

    }


    .serenity-other-room-content{

        left:22px;

        right:22px;

        bottom:25px;

    }


    .serenity-other-room-content h3{

        font-size:50px;

    }


    .serenity-other-room-number{

        font-size:60px;

    }


    .serenity-other-rooms-current{

        gap:10px;

    }

}/* End custom CSS */