/* Room Features */
.room-features-content {
    display: flex;
    justify-content: space-between;
    gap:24px;
}
.room-features-content h4 {
    font-size: 18px;
    font-weight: 600;
    color:#3C3C3D;
    margin-bottom: 24px;
    line-height: 1;
}
.room-features-content .room-highlights, .room-features-content .room-amenities {
    max-width: 748px;

}
.room-features-list, .room-amenities-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
    margin:0;
    padding: 0;
}

.room-features-list li, .room-amenities-list li {
    width: 100%;
    min-width: 362px;
    font-size: 16px;
}
.room-slide-excerpt {
    min-height: 131px;
}

/* Room Gallery */

.room-gallery-slide {
    display: flex;
    gap: 30px;
    justify-content: center;
    margin-bottom: 80px !important;
}
.room-gallery-slide img {
    height: 250px !important;
    object-fit: cover;
}
.room-gallery-swiper .swiper-wrapper {
    align-items: center !important;
    margin-left: -50px !important;
    margin-right: -50px !important;
    overflow: visible;
}
.swiper-progress-bar {
    position: relative;
    width: 100%;
    max-width: 1680px;
    height: 2px;
    background:#86868A;
    margin-top: 40px;
    margin-left: auto;
    margin-right: auto;
    overflow: hidden;
}

.swiper-progress-bg {
    position: absolute;
    width: 100%;
    max-width: 1680px;
    height: 2px;
    background: #F5F5F6;
    z-index: 1;
    margin-left: auto;
    margin-right: auto;
}

.swiper-progress-active {
    position: absolute;
    width: 0%;
    height: 100%;
    background: #000;
    z-index: 2;
    transition: width 0.3s ease;
}
.room-gallery-swiper {
    width: 100%;

}

/* Room List Page */
.rooms-list-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 60px 40px;
    max-width: 1440px;
    margin:30px auto;
}
.room-item {
    max-width: 490px;
    overflow: hidden;
    width: 100%;
}
.room-item img {
    height:400px !important;
	object-fit:cover;  
}

.room-item .room-excerpt {
    height: 135px;
}
h3.room-title {
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    letter-spacing: -0.4px;
    margin-top: 16px;
    height: 60px;
}
.room-buttons a::after {
    content: '';
    display: block;
    width: 100%;
    height: 1px;
    background-color: #3C3C3D;
    transition: all 0.3s linear;
}
.room-buttons a:hover::after {
    width: 0;
}
.room-buttons {
    display: flex;
    justify-content: flex-start;
    gap: 30px;
    margin-top: 40px;
    font-weight: 600;
}
.room-slider {
    position: relative;
}
.room-slider .room-slider-buttons {
    position: absolute;
    bottom: 0;
    z-index: 999999;
    display: flex;
    justify-content: center;
    width: 100%;
}

.room-features-content li span, .room-features-list li span {
    font-size: 10px;
    display: block;

}

.room-gallery-simple.img-count {
	display: flex;
	gap: 40px;
	max-width: 1440px;
	margin: 0 auto;
}

.room-gallery-simple.img-count img {
	max-height:300px;
}


@media (min-width: 768px) and (max-width: 1024px) {

    .rooms-list-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .room-features-content {
        flex-direction: column;
    }

}

/*
  ##Device = Tablets, Ipads (landscape)
  ##Screen = B/w 768px to 1024px
*/

@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {

    /* CSS */
    .rooms-list-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .room-features-content {
        flex-direction: column;

    }

}

@media  (min-width: 320px)  and (max-width:480px ) {
    .rooms-list-grid {
        display: grid;
        grid-template-columns: 1fr;
        gap:100px;
    }

    .room-features-content {

        gap: 60px;
        flex-direction: column;
    }

    .room-features-list, .room-amenities-list {

        grid-template-columns: 1fr;

    }
    .room-features-content li span, .room-features-list li span {
        font-size: 10px;

    }
    .wp-block-list.listing-ortalama {

        align-items: flex-start !important;
    }
    .room-buttons {

        justify-content: space-between;

    }
    .room-gallery-slide {
        flex-direction: column;

    }
	.room-gallery-simple {
		flex-direction:row
	}
	.room-gallery-simple > a img {
	max-width: 150px !important;
	min-height: 150px !important;
	object-fit: cover;
}
	.room-gallery-simple > a {
		width:150px !important;
	}
	
	.rooms-list-grid img {
	object-fit: cover;
}

	
}