/* Global Styles */
body {
    font-family: 'Poppins', sans-serif;
    padding-top: 110px; 
}
.wow {
    visibility: hidden;
}

/* Full-page overlay */
#loading-overlay {
    position: fixed;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background: #000; /* You can change this to match your theme */
    z-index: 9999;
    opacity: 1;
    transition: opacity 1s ease-out;
  }
  
  /* When loading is complete, fade the overlay out */
  .loaded #loading-overlay {
    opacity: 0;
    pointer-events: none; /* Disable click events */
  }
  /* Full-screen window effect */
  #overlay-container {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 9999;
    overflow: hidden;
  }

  /* Upper Pane Animation */
  #upper-pane {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 50%;
    background: #0f69be;
    animation: slideUp 1s ease-out forwards;
  }

  /* Lower Pane Animation */
  #lower-pane {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 50%;
    background: #0f69be;
    animation: slideDown 1s ease-out forwards;
  }

  /* Slide the upper pane upwards */
  @keyframes slideUp {
    0% {
      transform: translateY(0);
    }
    100% {
      transform: translateY(-100%);
    }
  }

  /* Slide the lower pane downwards */
  @keyframes slideDown {
    0% {
      transform: translateY(0);
    }
    100% {
      transform: translateY(100%);
    }
  }
 /* Header styling */
 .top-header {
    background-color:  #0f69be;;
    padding: 5px 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 14px;
    z-index: 1031; /* Ensure it stacks above other elements */
    position: fixed;
    width: 100%;
    top: 0;
}
/* .social-links a {
    margin-right: 15px;
    text-decoration: none;
    font-size: 16px;
}
.social-links i{
    color: #FFD700;
    font-size:18px;
}
.social-links i::after{
    content: '';
    border-right:1px solid rgba(255, 255, 255, 0.441);
    padding-right:20px;
}
.social-links i:hover {
    color: #FFD700; 
} */
.social-link-img {
    width: 30px; /* Adjust the width to your preference */
    height: 30px; /* Adjust the height to match the width for equal size */
    object-fit: cover; /* Ensures the images maintain their aspect ratio */
  }
  
.contact-info {
    color: #ffffff;
    font-weight: 400;
}
.contact-info span{
    color: #ffee00;
}
.contact-info .barline{
    padding:0 10px;
    color:rgba(255, 255, 255, 0.441);
}

/* Responsive design */
@media (max-width: 768px) {
    .top-header {
        flex-direction: column;
        align-items: flex-start;
        padding: 10px;
        display: none;
    }

    .social-links {
        margin-bottom: 10px;
    }

    .social-links a {
        margin: 0 5px;
    }

    .contact-info {
     
        text-align: left;
    }
}

@media (max-width: 480px) {
    .social-link-img {
        width: 25px;
        height: 25px;
    }

    .contact-info {
        font-size: 10px;
        line-height: 1.5;
    }
}
/**********Navbar***************/
.navbar {
    margin-top: 40px;
    background-color: rgb(245, 244, 234);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.navbar-nav{
    grid-gap:20px;
}
.nav-link {
    color: rgb(0, 0, 0) !important;
    font-family: "Poppins", sans-serif;
    transition: color 0.3s;
}

.nav-link:hover {
    color: #053793 !important;
}
/* Dropdown menu on hover */

/* .nav-item.dropdown:hover .dropdown-menu {
    display: block;
    opacity: 1;
    visibility: visible;
    font-size: 14px;
} */
.dropdown:hover .dropdown-menu {
    display: block; /* Show the dropdown on hover */
    animation: slideDown2 0.3s ease; /* Apply slide-down effect */
  }
  .dropdown-menu {
    background-color:#0f69be; /* Set dropdown background color */
    margin-top: 0; /* Reset any margin to avoid gaps */
    transition: max-height 0.3s ease, opacity 0.3s ease; 
  }
  .dropdown:hover .dropdown-menu {
    max-height: 500px; /* Large enough to fit content */
    opacity: 1; /* Fully visible */
  }

  .dropdown-item{
    color: white;
    font-size: 14px;
  }

  /* List item hover effect */
  .dropdown-item:hover {
    background-color: white; /* List item hover background color */
    color: black; /* Optional: Text color on hover */
  }
  /* Slide-down animation */
  @keyframes slideDown2 {
    from {
      opacity: 0;
      transform: translateY(-10px); /* Start slightly above */
    }
    to {
      opacity: 1;
      transform: translateY(0); /* End in place */
    }
  }
/* Logo styling */
.navbar-brand img {
    height: 80px;
    filter: drop-shadow(3px 3px 3px rgba(11, 11, 11, 0.379));
}

.logo-container {
    display: flex;
    align-items: center;
}
/* School name styling */
.school-name h1 {
    font-size: 24px;
    margin: 0;
    font-weight: bold;
    letter-spacing: 0px;
    color: #002366;
    text-shadow: 2px 2px rgba(255, 255, 0, 0.464);
}

.school-name p {
    font-size: 16px;
    margin: 0;
    letter-spacing: 2px;
    color: #002366;
    /* text-shadow: 2px 2px rgba(255, 255, 0, 0.464); */
}
.school-name .logo-slogan{
    color: rgb(196, 7, 7);
    font-size:10px;
    font-family:'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
}
@media (max-width: 768px) {
    .carousel-caption h1,
    .carousel-caption p{
        font-size:20px;
        padding:5px;
    }
    .navbar{
        margin-top: 0px;
    }

}
@media (max-width: 480px) {
    .navbar-brand img{
        height:60px;
    }
    body{
        padding-top: 0px;
    }
    .navbar{
        margin-top: 0px;
    }
    .navbar>.container{
        /* margin-top:20px; */
    }
    .school-name h1{
        font-size:16px;
    }
    .school-name p{
        font-size:11px;
    }
    .school-name .logo-slogan {
        font-size:8px;
    }
    .navbar-toggler{
        margin-right: 10px;
        /* margin-top: 18px; */
    }
    .logo-container{
        /* margin-top:30px; */
    }
    .carousel-caption{
       display: none;
    }
    .carousel-caption h1,
    .carousel-caption p{
        font-size:13px;
        padding:10px;
    }
}
/************Carousel**************/
/* Hero Carousel */
.carousel-item {
    height: 600px;
    background-size: cover;
    background-position: center;
}

.carousel-caption {
    background: rgba(0,0,0,0.5);
    padding: 2rem;
    border-radius: 10px;
}

/* Events Carousel */
.event-carousel .event-item {
    margin: 1rem;
}

.event-carousel .event-item img {
    height: 250px;
    object-fit: cover;
    border-radius: 8px;
}

.owl-nav button {
    background: var(--primary-color) !important;
    color: var(--white) !important;
    width: 40px;
    height: 40px;
    border-radius: 50% !important;
    margin: 0 10px;
}

.owl-nav button:hover {
    background: var(--secondary-color) !important;
}
/* About Section */
.about-section {
    padding: 50px 0;
    font-family: 'poppins' /* Professional serif font */
}

.about-section .chairman-image img {
    max-height: 400px; /* Set image height */
    object-fit: cover; /* Ensures the image fills the area proportionally */
    width: 100%; /* Responsive */
}

.about-section .chairman-image::before {
    content: '';
    position: absolute;
    top: -20px;
    left: -20px;
    width: 100%;
    height: 100%;
    border: 2px dotted #FFD700;
    z-index: -1;
} 
.chairman-image {
    position: relative;
}

.chairman-design{
    font-size: 16px;
    font-weight: bold;
    /* color: #053793; */
}
.about-section .section-title {
    font-size: 24px;
    font-weight: bold;
    margin-bottom: 40px;
}
.about-section .chairman-title{
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 20px;
}

.about-section .chairman-message {
    font-size: 14px;
    line-height: 1.8; /* Improve readability */
    text-align: justify; /* Professional alignment */
}

.about-section .btn-warning {
    font-size: 16px;
    font-weight: bold;
    padding: 10px 20px;
    border-radius: 5px;
}
@media all and (max-width:480px){
    .about-section .chairman-message {
        font-size:13px;
    }
    .namebox h2{
        font-size:11px;
    }
}

/* Align the image and text height */
.about-section .row {
    display: flex;
    align-items: stretch; /* Align items to match height */
    justify-content: space-between;
}

.about-section .col-lg-6 {
    display: flex;
    flex-direction: column;
    justify-content: center; /* Center the content vertically */
}
.namebox{
    background-color: #faf1ddd3;
    max-width:100%;
    padding:7px;
    height: auto;
    box-shadow:0px 1px 2px 0px rgba(0, 0, 0, 0.411);
}
.namebox h2{
    margin:5px;
    font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
}
.namebox h2:first-child{
    font-size:18px;
    color: rgb(156, 76, 11);
    font-weight: bold;
}

/* Why Choose Us */
.why-choose-us {
    background:url("../images/logo.png");
    position: relative;
    background-size: 300px; /* Ensures the image covers the section */
    background-position: center;
    padding: 60px 0; /* Space for content */
    color: white; /* Text color for readability */
    /* background-attachment: fixed; */
    background-repeat: no-repeat;

}
.why-choose-us::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color:#0f69bee1; /* Light blue with transparency */
    z-index: 1; /* Overlay above the background */
}
.why-choose-us .container {
    position: relative;
    z-index: 2; /* Content above the overlay */
}
.quote-icon {
    font-size: 4rem;
    color: #FFD700;
}

.feature-item {
    text-align: center;
    padding: 1.5rem;
    background: rgba(255,255,255,0.1);
    border-radius: 8px;
    transition: transform 0.3s;
}

.feature-item:hover {
    transform: translateY(-10px);
}
.feature-item i{
    color: #FFD700;
}
@media all and (max-width:480px){
    .why-choose-us-content{
        font-size:15px;
    }
    .feature-item h4{
        font-size:20px;
    }
   
}
/**************Tiny seeds****************/
.custom-text-content h3 {
    font-size: 1.3rem; /* Reduced font size */
    color: #383838;
    font-weight: bold;
    margin-bottom: 15px;
}

.custom-text-content p {
    font-size:15px;
    color: #4e4d4d;
    line-height: 1.8; /* Improved line spacing */
    text-align: justify; /* Justified text */
}

.custom-text-content ul {
    list-style-type: none;
    padding-left: 0;
}
.custom-text-content ul li .bi{
   color: #ff4444;
   font-weight:bolder;
}
.custom-text-content ul li {
    font-size:15px; 
    color: #454545;
    margin: 15px 0;
    display: flex;
    align-items: center;
}
.custom-list-heading {
    font-size:15px; 
    color: #172f3f;
    margin: 0 10px; /* Space between the heading and text */
}
.custom-text-content ul li i {
    margin-right: 10px;
    color: #2980B9; /* Icon color */
    font-size:15px; 
}
.custom-list-heading {
    font-size:15px; 
    color: #00548b;
    margin: 0 10px; /* Space between the heading and text */
}
.custom-text-content h4 {
    font-size:15px; 
    color: #373b3e;
    font-weight: bold;
    margin-top: 20px;
}
.custom-image img {
    object-fit: cover;
    height: auto;
    max-width: 100%;
    border-radius: 10px;
}
@media all and (max-width:480px) {
    .custom-text-content ul li{
        font-size:13px;
    }
    .custom-text-content p{
        font-size:13px;
    }
}
/* Events */
.event-card {
    transition: transform 0.3s;
    border: none;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1);
}
.event-card:hover {
    transform: translateY(-10px);
}

.event-card img {
    height: 200px;
    object-fit: cover;
}
.btn-custom {
    width: 200px; 
    margin: 0 auto;
    display: inline-block;
}
.card-body{
    padding:20px;
}

/* Facilities */
/* .fa-chevron-left,
.fa-chevron-right{
background-color:#0f69be;
color: #FFD700;
padding:15px;
}
.facilities-item {
    position: relative;
    overflow: hidden;
    display: inline-block;
}
.facilities .image-container {
    width: 100%;
    height: 200px;
    overflow: hidden;
  }
  .facilities .image-container img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
  }
.image-container:hover img {
    transform: scale(1.05);
}
.facilities-item::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 5px;
    background-color: #FFD700;
    transition: all 0.3s ease;
}
.facilities-item::after {
    content: '';
    position: absolute;
    bottom: 0;
    right: 0;
    width: 0;
    height: 5px;
    background-color:#FFD700;
    transition: all 0.3s ease;
}

.facilities-item:hover::before {
    width: 100%;
}

.facilities-item:hover::after {
    width: 100%;
}
.facilities-h2{
 background-color: #e3e3e3;
 margin-top:0;
 padding:20px;
 font-size:18px;
 text-align: center;
} */
.fa-chevron-left,
.fa-chevron-right{
background-color:#0f69be;
color: #FFD700;
padding:15px;
}
.facilities .image-container {
    width: 100%;
    height: 200px; /* Set a fixed height for consistency */
    overflow: hidden;
    position: relative;
}

.facilities .image-container img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Ensures the image fills the container without distortion */
    transition: transform 0.3s ease;
}

.image-container:hover img {
    transform: scale(1.05); /* Zoom effect on hover */
}

.facilities-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    margin: 0 auto;
    max-width: 400px; /* Optional: Control max width */
    padding: 10px;
}

.facilities-h2 {
    background-color: #e3e3e3;
    margin-top: 10px;
    padding: 10px;
    font-size: 18px;
    text-align: center;
    width: 100%;
    box-sizing: border-box; /* Ensures padding doesn't affect width */
}

/*********Dedication***********/
.dedication-text {
    font-size: 1rem;
    font-style: italic;
    color: grey;
    margin-bottom: 10px;
}

.center-of-excellence {
    font-size: 25px; /* Increased font size for "Center of Excellence" */
    font-weight: bold;
    text-transform: uppercase;
    color: #00548b; /* Color for the heading */
    margin-bottom: 15px;
}

.content-text {
    font-size: 16px; /* Normal font size for the content */
    color: #34495E;
    line-height: 1.8;
    text-align: center; /* Center-aligned content */
    max-width: 800px; /* Optional: Set max width for content */
    margin: 0 auto; /* Center the content block */
}
/* Footer */
.footer {
    background-color: #3c3636;
    color: white;
    padding: 30px 15px 5px;
    font-size:15px;
}
.footer-logo{
    width:50%;
}
.footer h5 {
    margin-bottom: 1.5rem;
    color: var(--secondary-color);
}

.footer ul li {
    margin-bottom: 0.5rem;
    
}

.footer a {
    color: var(--white);
    text-decoration: none;
    transition: color 0.3s;
}

.footer a:hover {
    color: var(--secondary-color);
}

 .social-links a {
    color: var(--white);
    margin: 0 10px;
    font-size: 1.5rem;
    transition: color 0.3s;
} 

.social-links a:hover {
    color: var(--secondary-color);
}
.footer-address .fa-solid{
    color: #ffd622;
}
.footer-schoolname{
    font-size:16px;
    margin:0px;
}
.footer-schoolmoto{
    color: #ffd622;
}
.footer-copyright{
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
}
/* Scroll to Top */
.scroll-to-top {
    position: fixed;
    bottom: 20px;
    right: 20px;
    background: #ffd622;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: black;
    cursor: pointer;
    opacity: 0;
    transition: opacity 0.3s;
    z-index: 1000;
}

.scroll-to-top.visible {
    opacity: 1;
}
@media all and (max-width:480px) {
    .footer ul li{
        font-size: 12px;
    }
    .footer-address p{
        font-size: 13px;
    }
    .footer-address .email{
        
        word-break: break-all;
    }
    .footer {
        font-size:10px;
    }
    .footer h5{
        font-size:14px;
    }
    .footer-logo{
        width:42%;
    }
    .content-text{
        font-size:20px;
    }
    .center-of-excellence {
        font-size:18px;
    }
    .content-text{
        font-size:15px;
    }

}

/*****************Breadcrumbs*************/
.photo-gallery-header {
    position: relative;
    background: url('../images/first-day.jpeg') no-repeat center 35%/cover; /* Replace with your image path */
    height: 200px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    
}
.breadcrumbs-active:hover{
    color: #ffd622;
}
/* Content inside the photo gallery header */
.photo-gallery-header .content {
    position: relative; /* Keeps content above the overlay */
    z-index: 2; /* Content should sit above the overlay */
    text-align: center;
    color: #fff;
    background-color: #0000009f;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-content: center;
    flex-direction: column;
}

.photo-gallery-header h1 {
    font-size: 2.5rem;
    font-weight: bold;
    margin: 0 0 10px 0;
}

.photo-gallery-header p {
    font-size: 1rem;
    margin: 0;
}

.photo-gallery-header p a {
    color: #fff;
    text-decoration: none;
    font-weight: bold;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .photo-gallery-header {
        height: 200px;
        margin-top: -23px;
    }

    .photo-gallery-header h1 {
        font-size: 2rem;
    }

    .photo-gallery-header p {
        font-size: 0.9rem;
    }
}
@media all and (max-width:480px){
    .photo-gallery-header{
        margin-top: 30px;
        height:200px;
    }
    .photo-gallery-header .container-xxl h1{
        padding-top:55px;
    }
}


/*********Events Details*****************/
.underline-title {
    position: relative;
    font-size: 2.5rem; /* Adjust size as needed */
    font-weight: bold;
    display: inline-block; /* Centers the title properly */
    /* margin-top: 30px; */
    color: #333; /* Title color */
    text-align: center;
}

.underline-title::after {
    content: "";
    position: absolute;
    bottom: -5px; /* Adjust distance below the text */
    left: 5%; /* Start the line at 25% of the title width */
    min-width: 30%; /* Line spans 50% of the title width */
    height: 3px; /* Thickness of the line */
    background-color: #ff5722; /* Line color (adjust to match design) */
   
}
/* Events Gallery Styles */
.events-gallery .event-item {
    text-align: center; /* Center text */
    margin-bottom: 20px; /* Space between items */
}

.events-gallery .event-image {
    width: 100%;
    height: 250px; /* Fixed height for all images */
    object-fit: cover; /* Ensures images maintain aspect ratio and fill the container */
    border-radius: 8px; /* Rounded corners */
    transition: transform 0.3s ease-in-out; /* Smooth zoom effect */
}

.events-gallery .event-name {
    margin-top: 10px; /* Space between image and name */
    font-size: 1rem; /* Adjust font size */
    font-weight: 500; /* Semi-bold text */
    background-color: #f5f5f5; /* Light grey background */
    color: #333; /* Text color */
    padding: 8px 10px; /* Padding around text */
    border-radius: 4px; /* Rounded corners for the background */
    display: inline-block; /* Ensures the background fits snugly around the text */
    max-width: 90%; /* Ensures responsiveness for long text */
}

.events-gallery .event-item:hover .event-image {
    transform: scale(1.1); /* Zoom-in effect */
}

/* Responsive Adjustments */
@media (max-width: 768px) {
    .events-gallery .event-image {
        height: 200px; /* Adjust height for smaller screens */
    }
}

@media (max-width: 576px) {
    .events-gallery .event-image {
        height: 150px; /* Further adjust height for very small screens */
    }
}

.events-gallery .event-item:hover img {
    transform: scale(1.1); /* Zoom-in effect */
}

.events-gallery .event-item .overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
    border-radius: 8px;
}

.events-gallery .event-item:hover .overlay {
    opacity: 1;
}

.events-gallery .event-item .overlay h2 {
    color: #fff;
    font-size: 1.5rem;
    text-align: center;
    margin: 0;
}

.events-gallery .event-item h5 {
    margin-top: 10px;
    font-size: 1rem;
    font-weight: 500;
    text-align: center;
}

@media (max-width: 576px) {
    .events-gallery .event-item h5 {
        font-size: 0.9rem; /* Adjust font size for smaller screens */
    }
    .events-gallery .event-image {
        height: 200px; /* Adjust height for smaller screens */
    }
}

@media (min-width: 768px) {
    .events-gallery .event-item {
        margin-bottom: 1rem; /* Add spacing between rows on tablets and up */
    }
    .events-gallery .event-image {
        height: 150px; /* Further adjust height for very small screens */
    }
}
/****************About school***************/

.about-section .aboutschool-image img {
    max-height: 400px; /* Set image height */
    object-fit: contain; /* Ensures the image fills the area proportionally */
    width: 100%; /* Responsive */
}

.aboutschool-image {
    position: relative;
}

.aboutschool-design{
    font-size: 16px;
    font-weight: bold;
    /* color: #053793; */
}
.about-section .aboutschool-message {
    font-size: 14px;
    line-height: 1.8; /* Improve readability */
    text-align: justify; /* Professional alignment */

}
.vision-section,
.mission-section {
    background-color: #FAF0E6; /* Pale linen color */
    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1); /* Light shadow */
    border-radius: 8px; /* Rounded corners for a smoother look */
    padding: 20px; /* Add some padding inside the div */
    margin: 10px 0; /* Add space between the divs and their surroundings */
}
@media (max-width: 768px) {
    .vision-section, .mission-section {
        padding: 15px; /* Reduce padding on smaller screens */
        margin: 5px 0; /* Adjust margins for tight spaces */
    }

    .section-title {
        font-size: 1.5rem; /* Scale down the font size */
    }
}
@media all and (max-width:480px){
    .about-section .section-title{
        font-size:15px;
    }
    .vision-section p,
    .mission-section p{
        font-size:12px;
    }
    .about-section .aboutschool-message{
        font-size:13px;
    }
}
.read-more-btn {
    display: inline-flex;
    align-items: center;
    font-size: 1.1rem;
    color: #007bff;
    text-decoration: none;
    padding-top: 10px;
    border-top: 2px solid #007bff; /* Left border line */
    margin-top: 15px;
}

.read-more-btn .read-more-text {
    margin-right: 10px;
    font-weight: 600;
}

.read-more-btn .read-more-arrow {
    font-size: 1.5rem;
    color: #007bff;
    margin-left: 5px;
}

.read-more-btn:hover {
    color: #0056b3;
    border-top: 2px solid #0056b3;
}

.read-more-btn:hover .read-more-arrow {
    transform: translateX(5px); /* Arrow movement effect on hover */
    transition: transform 0.3s ease;
}

/*****************Academics***************/
.academics-section {
    background-color: #f7f5f2; /* White background */
    padding: 30px;
}
.section-title {
    font-size: 2rem;
    color: #1a1a1a;
    margin-bottom: 20px;
    text-transform: uppercase;
}
.academics-description {
    font-size: 15px;
    color: #232323;
    line-height: 1.6;
    text-align: justify;
    margin-bottom: 15px;
}
.section-subtitle {
    font-size: 15px;
    color: #333;
    margin-top: 20px;
    text-transform: capitalize;
    font-weight: bolder;
}
.academics-list {
    font-size: 15px;
    color: #232323;
    line-height: 1.6;
    margin-top: 10px;
    padding-left: 20px;
}
.academics-list li {
    margin-bottom: 10px;
}
.faculty-motto {
    font-family: 'Georgia', serif; /* Elegant font family for the motto */
    font-size: 1.5rem;
    font-weight: 400;
    color: #333;
    line-height: 1.6;
    display: inline-block;
    text-align: center;
    margin-top: 20px;
}

.quote {
    font-size: 2rem;
    color: #888;
    font-weight: bold;
    margin-right: 10px;
}

.faculty-motto br {
    margin-bottom: 15px;
}
@media all and (max-width:480px){
    .academics-description {
        font-size:12px;
    }
    .section-title{
        font-size:22px;
    }
    .academics-list li {
        font-size:12px;
    }
    .faculty-img{
        min-width:110%;
    }
    .quote{
        font-size:1rem;
    }
    .faculty-div{
        padding-left: 0px;
    }
    .faculty-motto{
        font-size:23px;
        line-height:20px;
    }
}
/***********Academics sports and Dance********/
.academy-section {
    padding: 60px 20px;
    background-color: #f8f9fa;
}

.academy-container {
    max-width: 1200px;
    margin: 0 auto;
}

.academy-title {
    font-size:20px;
    margin-bottom: 20px;
    color: #333;
    font-weight: bold;
}

.academy-description {
    font-size: 15px;
    color: #555;
    margin-bottom: 40px;
}

.academy-row {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    justify-content: center;
}

.academy-card {
    flex: 1 1 calc(50% - 20px);
    max-width: calc(50% - 20px);
    background: #ffffff;
    border: 1px solid #ddd;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.academy-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 12px rgba(0, 0, 0, 0.15);
}

.academy-content {
    text-align: center;
    padding-bottom: 20px;
}

.academy-image {
    width: 100%;
    height: 200px;
    object-fit: cover;
    border-bottom: 1px solid #ddd;
}

.academy-name {
     font-size: 17px;
    font-weight:bold;
    margin: 15px 0;
    color: #333;
}

.academy-text {
    padding: 0 15px;
    color: #555;
    font-size:14px;
}

/* Responsive for tablet and mobile devices */
@media (max-width: 768px) {
    .academy-title {
        font-size: 21px;
        font-weight: bolder;
    }

    .academy-description {
        font-size: 15px;
      
    }

    .academy-row {
        flex-direction: column;
        gap: 15px;
    }

    .academy-card {
        flex: 1 1 100%;
        max-width: 100%;
    }

    .academy-image {
        height: 180px;
    }

    .academy-name {
        font-size: 1.3rem;
    }

    .academy-text {
        font-size: 0.95rem;
    }
}

/* Responsive for smaller mobile devices */
@media (max-width: 480px) {
    .academy-title {
        font-size: 14px;
        font-weight: bold;
    }

    .academy-description {
        font-size: 12px;
    }

    .academy-card {
        flex: 1 1 100%;
        max-width: 100%;
    }

    .academy-image {
        height: 160px;
    }

    .academy-name {
        font-size: 14px;
    }

    .academy-text {
        font-size: 12px;
    }
}
/******************Contact Details****************/
 /* Custom styles */
 .school-info {
    display: flex;
    flex-wrap: wrap;
    grid-column-gap: 70px;
    grid-row-gap: 30px;
}
.school-image {
    flex: 1;
    max-width: 100%;
}
.contact-details .contactpage-div{
    display: flex;
    flex-direction: column;
    align-content: space-between;
    grid-row-gap:20px;
    max-width:100%;
}
.contact-details {
    flex: 1;
    max-width: 100%;
}
.location-map {
    width: 100%;
    height: 500px;
    position: relative;
}
.contactpage-div .fa-solid{
    color: #0f69be;
    border:1px solid #ceaa09;
    padding:10px 10px;
    border-radius:50%;
    text-align: center;
}
.contactpage-div .fa-location-dot{
    padding:10px 12px;
    text-align: center;
}
.school-address p:first-child{
   font-weight:bolder;
}
@media (max-width: 768px) {
    .school-info {
        flex-direction: column;
    }
}
@media all and (max-width:480px){
    .contact-data{
        font-size:13px;
    }
    .contact-email{
        font-size:13px;
        word-break: break-word;
    }
}