 .sectionBlogContent {
      margin: 50px 10px;
    }

    .bl-blog {
      display: flex;
      justify-content: center;
      align-items: flex-start;
      gap: 94px;
      flex-wrap: wrap;
      margin-top: 120px;
    }

    .bl-card-column {
      display: flex;
      flex-direction: column;
      gap: 317px;
    }
   
  .bl-divider {
  width: 2px;
  background-color: #e4e8ed;
  align-self: stretch; /* Makes sure it takes the full height of flex container */
    }

    .bl-card {
      width: 500px;
      border-radius: 10px;
      overflow: hidden;
      transition: transform 0.2s;
    }

    .bl-card1 {
      width: 500px;
      border-radius: 10px;
      margin-top: 243px;
      overflow: hidden;
      transition: transform 0.2s;
    }
   

    .bl-card-image {
      max-height: 310px;
      width: 100%;
      display: block;
    }

    .bl-card-content {
      padding: 30px;
    }

    .bl-card-content h2 {
      font-size: 20px;
      color: #111;
      font-family: 'Poppins', sans-serif;
      font-weight: 600;
      line-height: 1.4;
    }

    .bl-card:hover,
.bl-card1:hover {
  transform: translateY(-5px);
  border: 2px solid #333;
  background-color: #333;
  color: #fff;
}

.bl-card:hover .bl-card-content h2,
.bl-card1:hover .bl-card-content h2 {
  color: #fff;
  transform: translateY(-5px);
}


    /* Media Query for tablets and small laptops (max-width: 786px) */
 @media (max-width: 786px) {
  .sectionBlogContent {
    margin: 40px 20px;
  }

  .bl-blog {
    flex-direction: column;
    align-items: center;
    gap: 60px;
  }

  .bl-card-column {
    gap: 80px;
  }

  .bl-card,
  .bl-card1 {
    width: 100%;
    margin-top: 0;
  }

  .bl-card-content {
    padding: 25px;
  }

  .bl-card-content h2 {
    font-size: 18px;
  }

  .bl-divider {
    display: none;
  }
}

/* Media Query for mobile devices (max-width: 480px) */
@media (max-width: 480px) {
  .sectionBlogContent {
    margin: 30px 15px;
  }

  .bl-blog {
    flex-direction: column;
    align-items: center;
    gap: 40px;
  }

  .bl-card-column {
    gap: 40px;
  }

  .bl-card,
  .bl-card1 {
    width: 100%;
    margin-top: 0;
  }

  .bl-card-content {
    padding: 20px;
  }

  .bl-card-content h2 {
    font-size: 16px;
  }

  .bl-divider {
    display: none;
  }
}

    
.pagination {
  display: inline-block;
}

.pagination a {
  color: black;
  float: left;
  padding: 16px 16px;
  text-decoration: none;
}