/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/

/*************** ADD CUSTOM CSS HERE.   ***************/

@media only screen and (max-width: 48em) {
  /*************** ADD MOBILE ONLY CSS HERE  ***************/
}
.blog-slider-wrapper {
  display: flex;
  gap: 20px;
  flex-wrap: wrap;
}

.blog-slide-item {
  background: #000;
  border-radius: 20px;
  overflow: hidden;
  flex: 1 1 calc(50% - 10px);
  display: flex;
  flex-direction: column;
}

.blog-slide-item .thumb img {
  width: 100%;
  height: auto;
  object-fit: cover;
  display: block;
}

.blog-title {
  color: #fff;
  padding: 15px;
  font-weight: 600;
  font-size: 1rem;
  text-align: center;
}

@media (max-width: 768px) {
  .blog-slider-wrapper {
    overflow-x: auto;
    flex-wrap: nowrap;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
  }
  .blog-slide-item {
    flex: 0 0 80%;
    scroll-snap-align: start;
  }
}
