.blogs-section,
.recent-blogs {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.blogs-section h2,
.recent-blogs h2 {
  color: #d32f2f;
  padding: 5vw 5vw;
}

.recent-blogs h2 {
  margin-top: 5vw;
}

.blogs-container {
  width: 90%;
  height: auto;
  display: grid;
  grid-template-columns: auto auto;
  gap: 2vw;
}

.card {
  width: 100%;
  height: auto;
  padding: 1vw 0vw;
  overflow: hidden;
  outline: 1px solid red;
  box-shadow: 0.6px 0.8px 9px 0px #d32f2f;
  border-radius: 1.5vw;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
}

.card:hover {
  transform: scale(2vw);
}

.card-banner {
  width: 95%;
  height: auto;
  padding: 1vw 0vw;
  padding-bottom: 0.5vw;
  /*  border: 1.5px solid #d32f2f;   */
  border-radius: 1vw;
  display: flex;
  align-items: center;
  justify-content: center;
}

.card-banner img {
  width: 95%;
  height: 26vw;
  outline: 1px solid #000000;
  border-radius: 1vw;
  filter: drop-shadow(0.5px 1px 5px red#FF0000C7);
}

.card-content {
  width: 100%;
}

.card-content .card-tag {
  padding: 0vw 2vw;
}

.card-content .card-tag a {
  text-decoration: none;
  font-size: 2.6vw;
  color: #D20808F7;
}

.card-content .wrapper {
  padding: 0vw 2vw;
}

.card-content .wrapper span {
  font-size: 1.7vw;
}

.card-content h3 {
  color: #d32f2f;
  width: auto;
  height: 13vw;
  padding: 2vw;
  padding-bottom: 1vw;
  overflow: hidden;
  text-overflow: ellipsis;
}

.card-content h3 a {
  color: #d32f2f;
  text-decoration: none;
  font-size: 6vw;
}

.card-content>p {
  padding: 1vw 2.5vw;
  height: 6vw;
  overflow: hidden;
  color: #6D6464E0;
  text-overflow: ellipsis;
  font-size: 3vw;
}

.card-wrapper {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.card-wrapper>a {
  color: #d32f2f;
  margin-right: 1vw;
  padding: 1vw;
  background: linear-gradient(To right, #FFCDCDC2, #F0B0B0C2, #E7A5A5C2);
  border-radius: 5vw;
  font-size: 2vw;
  text-decoration: none;
}

.profile-card {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2vw;
  padding-right: 0vw;
}

.profile-card img {
  outline: 1px solid red;
  width: 8vw;
  height: 8vw;
  border-radius: 50%;
}

.profile-card p {
  padding: 0vw;
  padding-left: 1vw;
  color: red;
  font-size: 2vw;
}

#wellcomee .profile-card p {
  color: white;
}

.blog-card {
  width: 90%;
  margin-top: 5vw;
  border: 2px solid yellow;
  background-color: red;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
  cursor: pointer;
  overflow-x: scroll;
  display: flex;
  flex-direction: column;
}

.blog-card img {
  border: 2px solid #FFCB00;
  width: 80%;
  height: 20vw;
  margin: auto;
}

.blog-icons span {
  cursor: pointer;
  color: #8400FF;
}

.blog-card h3 {
  color: #EF1F1F;
}

.blog-card p {
  width: 80%;
  color: #1100FF;
  word-wrap: break-word;
  margin: auto;
}









/*      popular blogs................ */
.popular-blogs {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 4vw;
}

#nw {
  display: fle;
  justify-content: space-between;
  align-items: start;
}

#ext {
  width: 100%;
  height: 100%;
  overflow: hidden;
}

#ext #wellcomee {
  padding: 2vw;
  display: flex;
  flex-wrap: wrap;
  gap: 15vw;
}

.popular-blogs h2 {
  padding: 5vw 5vw;
  margin: auto;
}

.popular-blogs .blogs-container {
  width: 85%;
  height: 100%;
  margin: auto;
  display: flex;
  align-items: center;
  flex-direction: column;
}

.popular-blogs .blogs-container .card {
  width: 100%;
  height: 100%;
  padding: 1vw 1vw;
  overflow: hidden;
  outline: 1px solid red;
  box-shadow: 0.6px 0.8px 9px 0px #d32f2f;
  border-radius: 1.5vw;
  display: flex;
  flex-direction: row;
  align-items: start;
  justify-content: space-evenly;
}

.popular-blogs .blogs-container .card-banner {
  width: 60%;
  height 100%;
  padding: 1vw 0vw;
  border: 1.5px solid red;
  border-radius: 1vw;
  display: flex;
  align-items: center;
  justify-content: center;
}

.popular-blogs .blogs-container .card-banner img {
  width: 95%;
  height: 24vw;
}

.popular-blogs .card-content .card-tag {
  padding: 0vw 2vw;
  display: none;
}

.popular-blogs .card-content .wrapper span {
  font-size: 1.7vw;
  display: none;
}

.popular-blogs .card-content>p {
  padding: 1vw 2.5vw;
  height: 6vw;
  color: #6D6464E0;
  overflow: hidden;
  font-size: 3vw;
  display: none;
}

.popular-blogs .card-wrapper>a {
  color: #d32f2f;
  margin-left: 10vw;
  padding: 1vw;
  background: linear-gradient(To right, #FFCDCDC2, #F0B0B0C2, #E7A5A5C2);
  border-radius: 5vw;
  font-size: 2vw;
  text-decoration: none;
}

#wellcomee .card-tag {
  display: inline-block;
}

#wellcomee .card-wrapper {
  width: 45%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

#wellcomee .wrapper span {
  display: block;
}

#wellcomee .wrapperr {
  width: 88%;
  margin-top: 9vw; 
  margin-left: -42.9vw;
  border-radius: 0px 0vw 2vw 2vw;
  background: linear-gradient(To right, #F4000017, #FF00007D, #FF0000A6, #FF0000);
  outline: 1px solid red;
  box-shadow: 0.6px 0.8px 9px 0px #d32f2f;
  z-index: 89;
}

#wellcomee h3 {
  height: 20vw;
  overflow: hidden;
  margin: 1vw 1vw;
}

#wellcomee h3 a {}

 #wellcomee .card-contentt p {
   display: visible;
 }
#wellcomee .profile-card {}

#wellcomee .card-wrapper>a {
  background: linear-gradient(To right, #FFEAEA, #FFD3D3, #F9B2B2);
}

#wellcomee .card {
  display: flex;
  flex-direction: row;
  border-radius: 1.5vw 1.5vw 0px 0px;
}

#wellcomee .card-banner {
  height: 40vw;
}

#wellcomee .card-banner img {
  height: 100%;
}

.popular-blogs .card-wrapper {
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: absolute;
}