p.para{
font-size: 20px; color:black; font-family:Verdana;
}
span.para1{
 font-size: 22px; color:black; font-family:Verdana;font-weight: 700;   
}


.a1 {
  text-decoration: none;
  color: #222;
  position: relative;
  display: inline-block;
}

.a1::after {
  content: "";
  position: absolute;
  width: 0;
  height: 2px;
  left: 0;
  bottom: -4px;
  background: green;
  transition: width 0.3s ease;
}

.a1:hover::after {
  width: 100%;
}


/* card post */

    article {
      background: #ffffff;
      /* margin: auto; */
      width: 320px;
      padding: 20px;
      border-radius: 12px;
      box-shadow: 0 4px 12px rgba(0,0,0,0.15);
      transition: transform 0.3s ease, box-shadow 0.3s ease;
    }

    /* CARD HOVER EFFECT */
    article:hover {
      transform: translateY(-10px);
      box-shadow: 0 12px 25px rgba(0,0,0,0.25);
    }

    article h2 {
      margin-top: 0;
      margin-bottom: 10px;
    }

    article p {
      color: #555;
      margin-bottom: 20px;
    }

    .article-btn {
      display: inline-block;
      text-decoration: none;
      background: #e60000;
      color: #fff;
      padding: 10px 20px;
      border-radius: 6px;
      font-weight: bold;
      transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
    }

    /* BUTTON HOVER EFFECT */
    .article-btn:hover {
      background: #b30000;
      transform: scale(1.08);
      box-shadow: 0 6px 15px rgba(230, 0, 0, 0.6);
    }
  




/* Mobile view */
@media(max-width:768px){
     .sidebar{background-color:#111;}
     

}

/* footer */
a.footer-a{
  color: rgb(1, 106, 175); 
  text-decoration: none;
}