.blog-container {
  width: 100%;
  height: auto;
  padding: 100px 80px;
}

.blog-container img {
  max-width: 100%;
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
  border: 2px solid black;
  border-radius: 7px;
}

.blog-container ul {
  position: relative;
  left: 20px;
}

.blog-container a {
  position: relative;
  top: 20px;
  margin-right: 10px;
}
.blog-container div {
  margin-top: 20px;
}
.blog-container div h2 {
  margin-bottom: 10px;
}

.blog-image-container {
  margin: 30px 0;
  max-width: 1800px !important;
}

/* Blogs all page css */

.blogs-all {
  width: 100%;
  height: auto;
  padding: 100px 80px;
}

.blogs-all h1{
    margin-bottom: 50px;
}

.blogs-all .blog-cards .row{
  display: flex;
  justify-content: space-between;
}

.blogs-all .blog-cards .row .blog-card a{
  text-decoration: none;
  color: black;
  display: inline-block;
}

.blogs-all .blog-cards .row .blog-card{
  width: fit-content;
  max-width: 480px;
  display: inline-block;
  overflow: hidden;
  padding: 0;
}

.blogs-all .blog-cards .row .blog-card a img{
  width: auto;
  height: auto;
  border: 2px solid black;
  border-radius: 7px;
  object-fit: cover;
  display: block;
  max-width: 100%;
}
.blogs-all .blog-cards .row .blog-card a h3{
  transition: 0.2s ease-in-out color;
  word-break: break-word;
  margin-top: 15px;
}

.blogs-all .blog-cards .row .blog-card a h3:hover{
  color: var(--secondary-color);
}

.blogs-all .blog-cards .row .blog-card a p{
  color: var(--gray);
  font-size: 15px;
}
.blogs-all .blog-cards .row .blog-card a span{
  font-size: 0.9rem;
  color: var(--gray);
  font-weight: bold;
}