*
   {
      margin:0px;
      padding:0px;
      font-family:arial;
      box-sizing:border-box;
   }

.navbar {
    background-color: blueviolet;
}
.green-earth-body .navbar,
.green-navbar .navbar {
    background-color: green !important;
}

.blue-earth-body .navbar 
{
    background-color: lightskyblue;  
}

.clean-earth-body .navbar 
{ 
  background-color: rgb(241, 227, 145); 
}

.blue-earth-body .navbar-dark .navbar-nav .nav-link,
.blue-earth-body .navbar-dark .navbar-brand {
    color: black !important;
}

.clean-earth-body .navbar,
.clean-earth-body .navbar .nav-link,
.clean-earth-body .navbar .navbar-brand {
    color: black !important;
}

/* If you use Bootstrap's .navbar-dark, you may also want to override link hover color: */
.clean-earth-body .navbar .nav-link.active,
.clean-earth-body .navbar .nav-link:focus,
.clean-earth-body .navbar .nav-link:hover {
    color: #007bff !important; /* Or any color you prefer */
}


    body
    {
      display: flex;
      flex-direction: column;
    }

    #body-div
    {
      display: flex;
      flex-direction: column;
      width: 100%;
      min-height: 100px;
      background-color:red;
      align-items: center; 
           
    }
       
    @media (max-width: 768px) 
    { 
      nav a { display: block; margin: 10px 0; } h1 { font-size: 1.5em; } /* Add other styles for mobile here */ 
    }
        
   .footer 
   { 
    background: blueviolet; color: white; text-align: center; width: 100%; padding: 1em; 
   } 
    .green-earth-body .footer 
   { 
    background: green;  
   } 
   .blue-earth-body .footer 
   { 
    background: lightskyblue;  
   } 
   .clean-earth-body .footer 
   { 
    background:  rgb(241, 227, 145); color: #222; 
   }
  
    main
    {
      display: flex;
      flex-direction: column;
      width: 100%;
      min-height: 100px;
      background-color:aliceblue;
      align-items: center; 
      margin-bottom: 0px;
      margin-top:0px;  
    }

    .carousel-item img 
    {
      height: 87vh;     /* Adjust this value as needed */
      width: 100%; 
      object-fit: contain;
    } 
  form input.form-control::placeholder {
  color: #b0b0b0 !important;
  font-style: italic !important;
}
.accordion-button {
  white-space: normal;
  word-break: break-word;
}
.school-accordion {
  background-color: #e3f2fd;
  border-left: 4px solid #1976d2;
}
.institute-accordion {
  background-color: #fff3e0;
  border-left: 4px solid #ff9800;
}
.professional-accordion {
  background-color: #e8f5e9;
  border-left: 4px solid #388e3c;
}

.special-nav .nav-link {
    font-weight: bold;
    color: #007bff !important; /* Change to your preferred color */
    background-color: #e3f2fd;
    border-radius: 20px;
    margin-right: 8px;
    padding-left: 16px;
    padding-right: 16px;
}



 

   /*    .carousel,*/ 
/*.carousel-inner,*/ 
/*.carousel-item,*/ 
/*.carouse: 100vw;*/ 
  /*  height: 100vh; */ /* or use a specific height if needed */
 /*   max-width: 100vw;*/ 
/*    max-height: 100vh;*/ 
/*}

/*.carousel-item img {*/ 
  /*  object-fit: cover;*/ 
  /*  width: 100vw;*/ 
/*    height: 100vh;*/ 
/*}*/