#rooms-section .line-button{
    box-shadow: 0px 7px 12px 0px rgba(0, 0, 0, 0.20);
    padding: 18px 48px;
    border-radius: 5px;
}
#rooms-section .line-button  .span-line {
    width: 52px;
    height: 2px;
    margin-right: 10px;
    transition: .3s;
}
#rooms-section .line-button:hover .span-line {
    width: 30px;
    transition: .3s; 
}
#rooms-section .room-info-container{
    padding: 150px 50px;
    box-shadow: 0px 100px 80px 0px rgba(0, 0, 0, 0.07), 0px 41.778px 33.422px 0px rgba(0, 0, 0, 0.05), 0px 22.336px 17.869px 0px rgba(0, 0, 0, 0.04), 0px 12.522px 10.017px 0px rgba(0, 0, 0, 0.04), 0px 6.65px 5.32px 0px rgba(0, 0, 0, 0.03), 0px 2.767px 2.214px 0px rgba(0, 0, 0, 0.02);
}
#rooms-section .room-carousel img{
    height: 815px;
}

#rooms-section .room-carousel{
    border-radius: 20px;
    overflow: hidden;
}

#rooms-section .slick-next{
    border-radius: 46.828px;
    border: 1px solid #FFF;
    background: transparent;
    display: flex;
    width: 56px;
    height: 56px;
    padding: 4.828px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 4.828px;
    position: absolute;
    bottom: 3%;
    left: 93%;
    transform: translateX(-50%);
    transition: all .3s linear;
}

#rooms-section .slick-prev{
    border-radius: 46.828px;
    border: 1px solid #FFF;
    background: transparent;
    display: flex;
    width: 56px;
    height: 56px;
    padding: 4.828px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 4.828px;
    position: absolute;
    bottom: 3%;
    left: 85%;
    z-index: 1;
    transform: translateX(-50%);
    transition: all .3s linear;
    opacity: 1 !important;
}
#rooms-section .slick-prev svg path{
    transition: all .3s linear;
}
#rooms-section .slick-next svg path{
    transition: all .3s linear;
}
#rooms-section .slick-prev:hover{
    background: #FFF;
}
#rooms-section .slick-next:hover{
    background: #FFF;
}
#rooms-section .slick-prev:hover svg path{
    fill: #000;
}
#rooms-section .slick-next:hover svg path{
    fill: #000;
}

@media screen and (max-width:1500px){
    #rooms-section .slick-prev{
        left: 80%;
    }
}
@media screen and (max-width:991px){
    #rooms-section .room-carousel img{
        height: 500px;
    }
}
@media screen and (max-width:500px){
    #rooms-section .slick-prev{
        left: 70%;
    }
    #rooms-section .slick-next{
        left: 90%;
    }
}