.col-lg-12 {
      width: 80%;
      margin: 0 auto;
      margin-top: 10px;
   }
   .title {
      font-size: 1.8rem !important;
      text-align: center;
   }
   .card-body {
      padding: 20px;
   }
   .title-con {
      margin: 30px 0px;
   }
   .student-info-con {
      width: 30%;
      margin: 0 auto;
      font-size: 1.2rem;
   }
   .status-con {     
      display: flex;
      align-items: center;
      justify-content: center;
   }
   .status {
      width: 30%;
      background-color: #28a745;
      border-radius: 20px;
      color: white;
      font-size: 1.5rem;
      font-weight: 600;
      padding: 10px 20px;
      text-align: center;
   }
   .remarks-con {
      width: 30%;
      margin: 0 auto;
      margin-top: 20px;
   }
   .img-con {
      width: 30%;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      margin-bottom: 20px;
      margin: 0 auto;
   }
   .img-con img {
      max-width: 100%;
      height: auto;
      display: block;
   }

@media (max-width: 576px) {
   .col-lg-12 {
      width: 100%;
   }
   .title {
      font-size: 1.5rem !important;
   }
   .card-body {
      padding: 20px;
      display: block;
   }
   .student-info-con, .remarks-con, .status {
      width: 80%;
   }
   .img-con {
      width: 100%;
   }
   .card-body img {
      width: 90%;
   }
   .title-con {
      margin: 20px 10px;
   }
}