.area-card {
    margin-bottom: 20px; 
}
.area-card:hover {
    transform: scale(1.05); /* Adjust the scale factor as needed */
    transition: transform 0.3s ease; /* Add a smooth transition effect */
  }
  
  .area-card {
    transition: transform 0.3s ease; /* Add a smooth initial transition effect */
  }
  .custom-container {
    margin: 1% 10%;
    margin-bottom: 10%;
}

.custom-table {
    width: 80%;
    border-collapse: collapse;
    margin: 5%;
}

.custom-table th, .custom-table td {
    border: 1px solid #ddd;
    padding: 8px;
    text-align: left;
}

.company-info {
    margin: 10px 20px;
}

.company-info p {
    line-height: 1.6;
}
.vision-container {
  margin: 20px;
  padding: 20px;
  background-color: #f8f9fa;
  border-radius: 8px;
}

.vision p {
  margin-bottom: 10px;
  line-height: 1.6;
}

.company-info a {
    color: #007bff;
    text-decoration: none;
}
.mission-container {
  margin: 20px;
  padding: 20px;
  background-color: #f8f9fa;
  border-radius: 8px;
}

.mission p {
  margin-bottom: 10px;
  line-height: 1.6;
}
.objective-container {
  margin: 20px;
  padding: 20px;
  background-color: #f8f9fa;
  border-radius: 8px;
}


.objective p {
  margin-bottom: 10px;
  line-height: 1.6;
}

.objective ul {
  list-style-type: disc; /* added bullet points */
  padding: 0;
  margin-top: 10px; /* added extra margin at the top */
  margin-left: 20px; /* added left margin */
}

.objective li {
  margin-bottom: 10px; /* added extra margin between list items */
}
.ceomessage {
  background-color: #f8f9fa;
  margin-bottom: 5%;
}
.ceo-message-container {
  margin: 5px 20px;
  padding: 20px;
}

.ceo-message p {
  line-height: 1.6;
}

.ceo-message img {
  width: 100%;
  border-radius: 8px;
  margin-top: 20px;
}

.ceo-info {
  margin-top: 20px;
  font-size: 16px;
}
.custom-publications {
  padding: 20px;
}

.custom-notice {
  border-radius: 5px;
  margin-top: 20px;
}

.custom-notice-title a {
  text-decoration: none;
  color: #333;
  transition: color 0.3s; /* Add smooth transition effect */
}

.custom-notice-title a:hover {
  color: #2b8be6; /* Change color on hover */
}

.custom-table1 {
  width: 100%;
  border-collapse: collapse;
  margin-top: 10px;
  border: none; /* Remove border */
}

.custom-table1 td {
  padding: 10px;
  border: none; /* Remove border */
}

.custom-notice-title a {
  text-decoration: none;
  color: #333;
}

.card {
  height: 100%; /* Set the height of the card */
}

.fixed-height-card {
  height: 400px; /* Adjust this value as needed for the fixed card height */
  display: flex;
  flex-direction: column;
}

.fixed-height-image {
  height: 200px; /* Adjust this value as needed for the fixed image height */
  object-fit: cover; /* Maintain aspect ratio and cover the container */
}


.programme-card {
  margin-bottom: 20px; /* Adjust this value to set the desired gap between rows */
}