/* General Reset */

@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');


/* Top bar container */
/* Reduced height and added font styling */
/* Base Styles */
/* Base Styles */
.topper-wrapper {
    background-color: #f4f4f4;
    border-bottom: 1px solid #ddd;
    padding: 5px 0;
    font-family: 'Arial', sans-serif;
    font-size: 13px;
}

.topper-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap; /* Allows wrapping of content on smaller screens */
}

/* Left Section Styles */
.topper-left-section ul {
    list-style: none;
    padding: 0;
    margin: 10px;
}

.topper-left-section a {
    text-decoration: none;
    color: black;
    font-family: 'Arial', sans-serif;
    font-size: 18px;
    font-weight:600 ;
}

/* Right Section Icon Styles */
.topper-right-section ul {
    list-style: none;
    display: flex;
    align-items: center;
    padding: 0;
    margin: 0;
}

.topper-right-section ul li {
    margin-left: 15px;
}

.topper-right-section a {
    text-decoration:none;
    color: black;
    font-size: 16px;
    font-family: 'Arial', sans-serif;
}

.topper-right-section img {
    width: 24px;
    height: 24px;
    margin: 0 10px;
}

/* Social Icons and Other Icons */
.topper-socialIcons {
    display: flex;
}

.topper-socialIcons li {
    margin-left: 8px;
}

.topper-show-con {
    width: 24px;
    height: 24px;
    margin: 0 10px;
}

/* Hide specific elements on smaller screens */

/* Skip to Content button */
.topper-skip-to-content {
    margin-right: 15px;
}

/* Media Queries for Responsiveness */

/* For Tablet and Smaller Screens */
@media (max-width: 768px) {
    /* Hide specific elements */
    .topper-responsive-hide {
        display: none; /* Hide when the screen size is tablet or smaller */
    }

    /* Ensure all elements stay in one row */
    .topper-header {
        flex-wrap: nowrap; /* Prevent wrapping to maintain one row */
        justify-content: space-between;
    }

    /* Align all sections in one row */
    .topper-left-section,
    .topper-right-section {
        flex: 1; /* Allow both sections to take equal space */
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .topper-left-section ul,
    .topper-right-section ul {
        display: flex; /* Keep all items in one row */
        flex-wrap: nowrap; /* No wrapping, keep items on a single line */
    }

    /* Reduce margin and padding to fit content in a row */
    .topper-right-section ul li {
        margin-left: 10px; /* Reduce spacing between icons */
    }

    .topper-right-section img {
        width: 22px;
        height: 22px; /* Adjust icon size for tablet */
    }
}

/* For Mobile Screens */
@media (max-width: 480px) {
    /* Ensure everything is still in one row */
    .topper-header {
        flex-wrap: nowrap;
        justify-content: space-between;
    }

    /* Ensure that left and right sections stay in one line */
    .topper-left-section,
    .topper-right-section {
        flex: 1;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    /* Ensure icons and links stay in a single row */
    .topper-right-section ul {
        margin: 8px;
        flex-wrap: nowrap; /* Prevent items from wrapping into columns */
    }

    .topper-right-section ul li {
        margin-left: 8px; /* Further reduce margin to fit in smaller screens */
    }

    /* Further reduce icon size for mobile */
    .topper-right-section img {
        width: 20px;
        height: 20px;
    }
}
















.here-faq-container {
  padding: 40px;
  background-color: #fff;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  border-radius: 8px;

  margin: 40px auto;
}

.here-faq-items {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  margin-top: 20px;
}

.here-faq-item {
  width: 45%;
  background-color: #f3f3f3;
  border-radius: 8px;
  padding: 20px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.here-faq-question {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 0;
}

.here-faq-question h3 {
  font-size: 18px;
  color: #333;
  font-weight: bold;
  transition: color 0.3s ease;
}

.here-faq-question h3:hover {
  color: #007BFF; /* Change text color on hover */
}

.here-faq-answer {
  font-size: 16px;
  display: none; /* Initially hidden */
  margin-top: 10px;
  opacity: 0;
  transition: opacity 0.5s ease-in-out; /* Smooth transition for fading */
}


.here-toggle-btn {
  background: #02245B;
  border: none;
  font-size: 20px;
  color: #fff;
  padding: 5px 10px;
  border-radius: 5px;
  cursor: pointer;
  transition: background 0.3s ease;
}

.here-toggle-btn:hover {
  background: #0056b3;
}

.here-toggle-btn:focus {
  outline: none;
}

.here-faq-left {
  text-align: left;
}

}

/* Reveal animation for the FAQ answers */
@keyframes revealAnswer {
  from {
    opacity: 0;
    transform: translateY(-10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Responsive Design */
@media (max-width: 768px) {
  .here-faq-items {
    flex-direction: column;
    align-items: center;
  }

  .here-faq-item {
    width: 90%;
    margin-bottom: 20px;
    background-color: #e9ecef;
  }

  .here-faq-question h3 {
    font-size: 16px;
  }

  .here-faq-answer {
    font-size: 14px;
  }

  .here-toggle-btn {
    font-size: 18px;
  }
}

@media (max-width: 480px) {
  .here-faq-question h3 {
    font-size: 14px;
  }

  .here-faq-answer {
    font-size: 12px;
  }

  .here-toggle-btn {
    font-size: 16px;
  }
}


















/* Top Bar */
.top-bar {
    background-color: #4c59af;
    color: white;
    padding: 10px;
    text-align: center;
    font-size: 14px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.top-links {
    display: flex;
    gap: 15px;
}

.top-links a {
    color: white;
    text-decoration: none;
    font-size: 14px;
}










/* Header Section */
.header-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px;
    background-color: #f8f9fa;

    
}

.logo {
    display: flex;
    align-items: center;
}

.logo img {
    height: 84px;
    margin-right: 10px;
}

.logo span {
    font-family:Libre Baskerville;
    font-size: 28px;
    font-weight: bold;
    color: #2233b3;
}

.contact-info {
    display: flex;
    gap: 30px;
}

.contact-info .info-item {
    text-align: right;
}

.contact-info .info-item i {
    color: #007bff;
    margin-right: 5px;
}

.contact-info a {
    text-decoration: none;
    color: #333;
    font-size: 14px;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .header-container {
        flex-direction: column; /* Stack items vertically */
        align-items: flex-start; /* Align items to the start */
    }

    .logo {
        margin-bottom: 10px; /* Space below the logo */
    }

    .contact-info {
        flex-direction: column; /* Stack contact info items */
        gap: 15px; /* Reduce gap */
    }

    .contact-info a {
        font-size: 12px; /* Decrease font size */
    }

    /* Hide email and location on tablets */
    .contact-info {
        display: none;
    }
}

@media (max-width: 480px) {
    .header-container{
        display:none;
    }
    .logo img {
        display:none;
        height: 50px; /* Decrease logo size */
    }

    .logo span {
        display:none;
        font-size: 14px; /* Smaller font size */
    }

    .contact-info a {
        font-size: 10px; /* Smaller font size for links */
    }

    /* Hide email and location on phones */
    .info-item.email,
    .info-item.location {
        display: none;
    }
}














/* Navigation Menu */
.nav-tabs .nav-link.active {
    border-radius: 4px;
    padding: 4px 7px 4px 7px;
    margin: 4px 1px 4px 1px;
    border: 0px;
    color: #ffffff;
    background-color: #3e72af;
    border-color: #dee2e6 #dee2e6 #fff;
}

.nav-tabs .nav-link {
    color: #ffffff;
    border: 1px solid transparent;
    border-top-left-radius: 0.25rem;
    border-top-right-radius: 0.25rem;
}


.ho-event ul li {
    border-bottom: 1px dashed #0c87cf;
    position: relative;
    overflow: hidden;
}

/* animated-border */

    .content-font {
    font-family: 'Inter', sans-serif;
   font-size:16px;
   /*font-family: 'Poppins', sans-serif;*/
}

.btn {

padding: 2px 5px;

}
@media only screen and (max-width:768px){
    .welcome-to-ranchi {
    width: 280px !important;
    height: 10px !important; 
    
    }
}
       
@media screen and (min-width:992px) and (max-width:1184px)
{
.gl{
left: -100px;
}
.nav-link 
{
font-size:7px !important;
}
}

.nav-tabs .nav-link.active {
border-radius: 4px;
padding: 1px 5px 1px 5px;
margin: 3px 1px 3px 1px;
border: 0px;
color: #ffffff;
background-color: #3e72af;
border-color: #dee2e6 #dee2e6 #fff;
}

@media(max-width:768px){
.academic-events .nav-link {
display: block;
margin:3px 3px;
font-size: 14px;
}
.nav-tabs .nav-link.active {
border-radius: 4px;
padding: 1px 5px 1px 5px;
margin: 5px 3px 3px 3px;
border: 0px;
color: #ffffff;
background-color: #3e72af;
border-color: #dee2e6 #dee2e6 #fff;
}
}
.bg-lb{
    background: #3e72af;
}
.bd-left{
    border-left:1px solid #16365a;
}

.desk-hide-logo img {
    display: none;
}
.linedivider img{
    width:300px;height:15px;box-shadow:none;
}
.linedivider2 img{
    width:170px;height:10px;box-shadow:none;
}
.carousel-caption{
    bottom:0px;
}
 .welcome-text-2 h6 {
    /*font-family: roboto;*/
    font-family: 'Inter', sans-serif;
    font-weight: 600;
    color: #02245b;
    margin-top: 16px;
    margin-bottom: 4px;
    letter-spacing: 1px;
    font-size: 30px;
    line-height:1;
}
        .bg-overlay-black-80 {
    position: relative;
    z-index: 1
}

.bg-overlay-black-80:before {
    background: rgba(1, 32, 60, 0.8);
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 0
}

.bg-overlay-footer {
    position: relative;
    z-index: 1
}

.bg-overlay-footer:before {
   background: #01203cf2;
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 0
}
.dropdown-item {
display: inline-block;
position: relative;
color: #0087ca;
}

.dropdown-item:after {
content: '';
position: absolute;
width: 100%;
transform: scaleX(0);
height: 1px;
width:90%;
bottom: 0;
left: 10px;
/*right:30px;*/
background-color: #526178;
transform-origin: bottom right;
transition: transform 0.70s ease-out;
}

.dropdown-item:hover:after {
transform: scaleX(1);
transform-origin: bottom left;
}


.navbar {
    background: #fff;
    padding-top: 0;
    padding-bottom: 0;
    box-shadow: 1px 3px 4px 0 #adadad33;
}

.navbar-light .navbar-brand {
    color: #02245B;
}

.navbar-light .navbar-nav .nav-link {
    color: #fff;
}

.navbar-light .navbar-brand:focus,
.navbar-light .navbar-brand:hover {
    color: #1ebdc2;
}

.navbar-light .navbar-nav .nav-link:focus,
.navbar-light .navbar-nav .nav-link:hover {
    color: #fff;
}

.navbar-light .navbar-nav .nav-link {
    font-family: calibri;
    border-left: 1px solid #16365a;
    padding-top: 13px;
    padding-bottom: 13px;
    transition: 0.9s;
    padding-left: 4px;
    padding-right: 4px;
    color: #fff;
    font-size: 0.86em;
    font-weight: 300;
    text-transform: uppercase;
   
}


@media(max-width:1320px){
    .navbar-light .navbar-nav .nav-link {
    
    padding-left: 4px;
    padding-right: 4px;
    font-size: 0.62em;
   
   
}
}

@media(max-width:1200px){
    .navbar-light .navbar-nav .nav-link {
           font-size: 0.60em;
        padding-left:8px;
     padding-top: 10px;
    padding-bottom: 10px;
        border-bottom:   1px solid #8e98a3;
    }
}
@media(max-width:1080px){
    .navbar-light .navbar-nav .nav-link {
    font-size: 0.50em;
     padding-left:4px;
    
    }
}
@media(max-width:576px){
    .navbar-light .navbar-nav .nav-link {
    font-size: 13px;
     padding-left: 20px;
    }

}

.navbar-light .navbar-nav .nav-link:focus,
.navbar-light .navbar-nav .nav-link:hover {
    background: #3e72af;

    transition: 0.9s;
}

.dropdown-item:focus,
.dropdown-item:hover {
    color: #fff;
    text-decoration: none;
    /*transition: 0.9s;*/
    /* background-color: #02245B !important; */
}

.sm-menu {
    border-radius: 0px;
    border: 0px;
    top: 97%;
    box-shadow: rgba(173, 173, 173, 0.2) 1px 3px 4px 0px;
}

.dropdown-item {
    font-family: 'Noto Sans TC', sans-serif;
    color: #fff;
   
        font-size: .88em;
font-weight: 300;

}
   @media(max-width:1320px){
.dropdown-item {
        font-size: .80em;
    font-weight: 300;

}
}
@media(max-width:1200px){
  .dropdown-item {
        font-size: 9px;
    font-weight: 300;

}
}
@media(max-width:576px){
  .dropdown-item {
        font-size: 17px;
    font-weight: 300;

}
}
.submenu {
    display: none;
}

.sm-menu:hover .submenu {
    display: block;
}

.submenu.dropdown-item:focus,
.submenu.dropdown-item:hover {
    color: #fff;
    text-decoration: none;
    transition: 0.9s;
    background-color: #3e72af !important;
}

.dropdown-item.active,
.dropdown-item:active {
    color: #fff;
    text-decoration: none;
    background-color: #2196F3;
}

.navbar-toggler {
    outline: none !important;
}

.navbar-tog {
    color: #1ebdc2;
}

.megamenu-li {
    position: static;

}

.mp-bg {
    background-image: url('assets/colleges/google-map.png');
    background-repeat: no-repeat;
    background-size: cover;
}

.megamenu {
    position: absolute;
    opacity: 0.93;
    width: 100%;
    left: 0;
    right: 0;
    padding: 15px;
    background-position: center top;

    background: #02245B url('assets/img/menu-bg.html') no-repeat 100% 0;


}

.megamenu h6 {
    margin-left: 21px;
}

.megamenu i {
    width: 20px;
}

.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    opacity: 0.93;
    z-index: 1000;
    display: none;
    float: left;
    min-width: 10rem;
    padding: 0.5rem 0;
    margin: 0rem 0 0;
    font-size: 1rem;
    color: #212529;
    text-align: left;
    list-style: none;
    background-color: #02245b;
    background-clip: padding-box;
    border: 1px solid rgba(0, 0, 0, 0.15);
    border-radius: 0.25rem;

}

.dropdown:hover .dropdown-menu {
    display: block;
    background-color: #02245B;
  

    /* background: #0d5281 url('assets/img/menu-bg.png') no-repeat 100% 0; */
}

.nav-bg {
    background-color: #02245B;
}

.text-main {
    
    color: #ffffff;
   
}

.text-blue {
    color: #02245b;
}


/* submenu start*/
@media all and (min-width: 992px) {
    .dropdown-menu li {
        position: relative;
    }

    .nav-item #submenu {
        display: none;
        position: absolute;
        left: 100%;
        top: -7px;
    }

    .nav-item .submenu-left {
        right: 100%;
        left: auto;
    }

    .dropdown-menu>li:hover {
        transition: 0.9s;
        background-color: #3e72af;
    }

    .dropdown-menu>li:hover>#submenu {
        display: block;
    }
}

/* ============ desktop view .end// ============ */

/* ============ small devices ============ */
@media (max-width: 991px) {
    .dropdown-menu .dropdown-menu {
        margin-left: 4.9rem;
        margin-right: 0.7rem;
        margin-bottom: .5rem;
    }
}

/* submenu end */

@media screen and (min-width: 768px) {

    /* .hide-home {
        display: flex;
    } */

    .hide-home-txt {
        display: none;
    }

    .nav-pad {
        /*padding-left: 20px;*/
        /*padding-right: 50px;*/
        padding-left: 60px;
        padding-right: 10px;
    }


}

@media screen and (max-width: 768px) {

    .hide-home {
        display: none;
    }

    .hide-home-txt {
        display: none;
    }

    .megamenu {
        position: absolute;
        width: 100%;
        left: 0;
        right: 0;
        padding: 15px;
        max-height: 400px;
        overflow-y: scroll;
    }

    .nav-pad {
        padding: 5px;
    }

    .topmenu a {
        font-size: 12px;
        padding: 4px;
    }

    #google_translate_element {
        display: block !important;
        text-align: center;
    }

}



/*Mobile menu home start*/

.navbar>.container-fluid,
.navbar>.container-lg,
.navbar>.container-md,
.navbar>.container-sm,
.navbar>.container-xl,
.navbar>.container-xxl {
    display: flex;
    flex-wrap: inherit;
    align-items: center;
    justify-content: space-between;
}

/*Mobile menu home end*/
/* zoom button style */
.zoom-btn a {
    cursor: pointer;
}

#main-wrapper {
    transform-origin: 0% 0%;
}

.fontsizeV {
    text-align: center;
}

.fontsizeV a {
    font-size: 13px;
    color: #fff;
}

#increaseFont{
     font-size: 17px;
}
#decreaseFont{
   font-size: 12px;
}
#google_translate_element {
    display: inline-block;
}

#google_translate_element * {
    color: #000 !important;
    margin-right: 0px;
    padding: 0px;
}

#google_translate_element span {
    border: none;
    margin: 0px;
    border: none;
    background: none;
}

#google_translate_element .skiptranslate .goog-te-gadget span {
    color: #fff !important;
    margin-left: 0px !important;
    border: none !important;
}

#google_translate_element img {
    margin: 0 !important;
}

.topmenu a {
    color: #fff;
    font-weight: 100;
    border-right: 1px solid #6991bd;
    padding: 3px 3px;
}

.bi-caret-down-fill {
    font-size: 9px;
}

@media (max-width: 575px) {


    .mobile-hide img {
        display: block;
    }

    .desk-hide-logo img {
        width: 50px;
        height: 50px;
        display: block;
    }

    .nav-bg {
        background-color: #ffffff;
    }

    .nav-bg-1 {
        background-color: #02245b;
    }

    .topmenu a {
        color: #fff;
        font-weight: 100;
        border-right: 1px solid #a89b9b;
        padding: 0px 8px;
    }

    #google_translate_element * {
        margin-bottom: 0px;
    }
}







/* VIDEO SECTION */
.blue-section {
    background-color: white;
    height: 55vh;
    position: relative;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
}
 .video-container {
            width: 100vw;
            height: 100vh;
            display: flex;
            justify-content: center;
            
            position: relative;
        }
        iframe {
            position: absolute;
            width: 120vw; /* Width badha di */
            height: 120vh; /* Height bhi adjust ki */
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%); /* Center mein rakhne ke liye */
            border: none;
        }
 .overlay {
            position: absolute;
            width: 100%;
            height: 100%;
            background: transparent;
        }














.hero {
    text-align: center;
    padding: 40px;
    background-color: #e5f3f7;
}

.hero h1 {
    font-size: 1.8em;
    margin-bottom: 10px;
}

.hero p {
    font-size: 1.1em;
    margin-bottom: 20px;
}

.stats {
    display: flex;
    justify-content: center;
    gap: 50px;
    margin-bottom: 20px;
}

.stats div {
    text-align: center;
}

.stats h2 {
    font-size: 2.5em;
    color: #333;
}

.search-bar {
    display: flex;
    justify-content: center;
    margin: 20px 0;
}

.search-bar input {
    padding: 10px;
    font-size: 1em;
    border: 1px solid #ccc;
    border-radius: 4px;
    width: 300px;
    margin-right: 10px;
}

.search-bar button {
    padding: 10px 20px;
    font-size: 1em;
    border: none;
    background-color: #f36f48;
    color: #fff;
    border-radius: 4px;
    cursor: pointer;
}

.programs {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 20px;
    padding: 20px;
}

.program {
    text-align: center;
    width: 200px;
}

.program img {
    width: 100%;
    height: 150px; /* Set a fixed height */
    object-fit: cover; /* This ensures the image fits within the container without stretching */
    border-radius: 8px;
    margin-bottom: 10px;
}

@media (max-width: 768px) {
    .stats {
        flex-direction: column;
    }

    .search-bar input {
        width: 200px;
    }

    .program {
        width: 45%;
    }

    .program img {
        height: 180px; /* Adjust height for smaller screens */
    }
}

@media (max-width: 480px) {
    .program {
        width: 100%;
    }

    .program img {
        height: 200px; /* Adjust height for smaller mobile screens */
    }
}







* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: Arial, sans-serif;
}

body {
    background-color: #f5f5f5;
    color: #333;
}

.container {
    display: flex;
    padding: 0px;
    max-width: 1255px;
    margin: 0 auto;
    flex-wrap: wrap; /* Allow wrapping of columns */
}

/* Left Column (Events) */
.left-column, .right-column {
    width: 33%;
    padding: 15px;
}

.left-column {
    background-color: #f8f8f8; /* Light blue background for Events */
    border-radius: 10px;
    padding: 0px;
    height: 430px; 
    overflow-y: auto; 
}
.left-column event ::-webkit-scrollbar {
    display: none;
}

.left-column event {
    scrollbar-width: none; /* For Firefox */
}


.main-content {
    width: 50%;
    padding: 15px;
}

/* Headings */
h2 {
    margin-bottom: 15px;
    font-size: 22px;
}

/* Events Section */
.event {
    display: flex;
    margin-bottom: 20px;
    background-color: #ffffff; /* White background for each event */
    padding: 10px;
    border-radius: 8px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

.date {
    background-color: #e6e6e6;
    padding: 10px;
    text-align: center;
    font-size: 16px;
    font-weight: bold;
    margin-right: 15px;
    border-radius: 8px;
}

.event-info h3 {
    font-size: 18px;
    margin-bottom: 5px;
}

.event-info p {
    margin-bottom: 5px;
    font-size: 14px;
}

/* Course Finder */
.course-finder {
    margin-bottom: 30px;
    background-color: #e3f2fd; /* Light blue background for Course Finder */
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

.course-finder select, 
.course-finder input {
    width: 100%;
    padding: 10px;
    margin: 10px 0;
    font-size: 16px;
}

.course-finder button {
    padding: 10px 20px;
    font-size: 16px;
    background-color: #007BFF;
    color: white;
    border: none;
    cursor: pointer;
}

.course-finder a {
    display: inline-block;
    margin-top: 10px;
    color: #007BFF;
}

/* Video Tour */
.video-tour {
    background-color: #f8f8f8; /* Light orange background for Video Tour */
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    width: 100%;
    height: 415px;
}

.video-tour iframe {
    margin-bottom: 15px;
    width: 100%; /* Make the video responsive */
    height: auto; /* Adjust height automatically */
}


.side-buttons {
    top: 50%;
    right: 0;
   
}

.side-button {
    display: block;  
}


.admission-enquiry {
    font-size: 16px;
    transform: rotate(270deg);
    position: fixed;
    right: -66px;
    padding: 12px; /* Same padding for both */
    width: 170px;  /* Same width for both */
    border-radius: 5px;
    z-index: 1;
    color: white;
}

/* Specific styles for admission-enquiry */
.admission-enquiry {
    top: 330px;
    background-color: #FF5722;
}





/* Right Column (Quick Links & Testimonials) */
.quick-links {
    background-color: #e8f5e9; /* Light green background */
    padding: 20px;
    border-radius: 10px;   
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    margin-left: auto;
    margin-right: auto;
}

.quick-links ul {    
    list-style: none; /* Remove bullet points */
    padding: 0;
    margin: 0;
    max-height: 200px; /* Set max height to make it scrollable */
    overflow-y: auto; /* Scrollable content */
}

.quick-links ul::-webkit-scrollbar {
    display: none;
}

.quick-links ul {
    scrollbar-width: none; /* For Firefox */
}

.quick-links li {
    margin-bottom: 15px; /* Gap between list items */
    padding: 5px;
    color: #000000;
    background-color: #fff; /* White background for list items */
    border: 1px solid #c8e6c9; /* Light green border */
    border-radius: 5px; /* Rounded corners */
    transition: box-shadow 0.3s ease;
}
.quick-links h2{
    font-size: 24px;
    text-align: center;
}

.quick-links a {
    color: #000000;
    text-decoration: none;
}

.testimonials {
    background-color:#02245b; /* Light green background */
    padding: 20px;
    border-radius: 10px;
    margin-top: 0px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    max-width: 600px; /* Limit the width for better readability */
    margin-left: auto;
    margin-right: auto;
}

.testimonials h2 {
    font-size: 30px;
    color: #000000; /* Dark green for title */
    margin-bottom: 10px;
    text-align: center;
}

.testimonials ul {
    
    list-style: none; /* Remove bullet points */
    padding: 0;
    margin: 0;
    max-height: 300px; /* Set max height to make it scrollable */
    
}

.testimonials ul:hover {
  animation-play-state: paused;
}

.testimonials ul li {
    margin-bottom: 15px; /* Gap between list items */
    padding: 10px;
    color: #000000;
    background-color: #fff; /* White background for list items */
    border: 1px solid #c8e6c9; /* Light green border */
    border-radius: 5px; /* Rounded corners */
    transition: box-shadow 0.3s ease;
}

.testimonials ul li:hover {
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Slight shadow on hover */
}

.testimonials ul li a {
    color: #000000; /* Dark green text color */
    font-size: 16px;
    font-weight: bold;
}

.testimonials ul li a:hover {
    text-decoration: underline; /* Underline on hover */
}

/* Hide scrollbar while still allowing scrolling */
.testimonials ul::-webkit-scrollbar {
    display: none;
}

.testimonials ul {
    scrollbar-width: none; /* For Firefox */
}


.noticeboard li {
    list-style-type: none; /* Remove default list style */
    padding-left: 25px; /* Add padding for the GIF */
  /*  background-image: url('./assets/Gif/blinking_new.gif');  Path to your GIF */
    background-size: 20px 20px; /* Size of the GIF */
    background-repeat: no-repeat;
    background-position: left center; /* Position the GIF to the left */
}


/* Responsive Design */
@media (max-width: 1024px) {
    .left-column, .right-column {
        width: 30%; /* Adjust to 30% for medium screens */
    }

    .main-content {
        width: 40%; /* Adjust main content to 40% */
    }
}

@media (max-width: 768px) {
    .left-column, .right-column, .main-content {
        width: 100%; /* Full width for smaller screens */
    }

    .left-column {
        height: auto; /* Allow height to adjust based on content */
    }

    .event {
        flex-direction: column; /* Stack event details on small screens */
    }

    .date {
        margin-right: 0; /* Reset margin for date on small screens */
        margin-bottom: 10px; /* Add space below date */
    }
    
    .video-tour {
        height: auto; /* Allow height to adjust for smaller screens */
    }
}

@media (max-width: 480px) {
    h2 {
        font-size: 20px; /* Smaller font size for headings */
    }

    .testimonials h2 {
        font-size: 22px; /* Adjust testimonials heading size */
    }

    .course-finder select, 
    .course-finder input,
    .course-finder button {
        font-size: 14px; /* Smaller font size for inputs/buttons */
    }
}




/* FOOTER */

footer {
    background: #02245b;
    color: #fff;
    padding: 40px 20px;
    font-family: 'Arial', sans-serif;
    position:relative;
}

.footer-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    max-width: 1200px;
    margin: 0 auto;
}

.footer-section {
    flex: 1;
    min-width: 250px;
    margin: 20px;
}

.footer-section h3 {
    font-size: 20px;
    margin-bottom: 20px;
    border-bottom: 2px solid #ffcc00;
    padding-bottom: 5px;
}

.footer-section p,
.footer-section a {
    font-size: 14px;
    color: #ddd;
    margin-bottom: 10px;
}

.footer-section a:hover {
    color: #ffcc00;
    transition: color 0.3s ease;
}

.footer-section ul {
    list-style: none;
    padding: 0;
}

.footer-section ul li {
    margin-bottom: 10px;
}

.footer-section ul li a {
    text-decoration: none;
    color: #ddd;
    position: relative;
}

.footer-section ul li a::after {
    content: '';
    display: block;
    width: 0;
    height: 2px;
    background: #ffcc00;
    transition: width 0.3s;
}

.footer-section ul li a:hover::after {
    width: 100%;
}

.social-icons {
    margin-top: 15px;
}

.social-icons a {
    color: #ddd;
    margin-right: 15px;
    font-size: 18px;
    display: inline-block;
    transition: transform 0.3s, color 0.3s;
}

.social-icons a:hover {
    color: #ffcc00;
    transform: translateY(-5px);
}

.footer-bottom {
    text-align: center;
    margin-top: 30px;
    padding-top: 10px;
    border-top: 1px solid #444;
    font-size: 14px;
    color: #aaa;
}

.footer-bottom a {
    color: #ffcc00;
    text-decoration: none;
}

.footer-bottom a:hover {
    color: #fff;
}

/* Responsive styles */
@media (max-width: 768px) {
    .footer-container {
        flex-direction: column;
    }

    .footer-section {
        margin: 10px 0;
    }
}

/* Add some subtle animations */
footer {
    overflow: hidden;
}

footer::before {
    content: '';
    position: absolute;
    top: -50px;
    left: -50px;
    width: 200px;
    height: 200px;
    background: rgba(255, 204, 0, 0.3);
    border-radius: 50%;
    animation: animate 10s linear infinite;
    z-index: 1;
}

footer::after {
    content: '';
    position: absolute;
    bottom: -50px;
    right: -50px;
    width: 200px;
    height: 200px;
    background: rgba(255, 204, 0, 0.3);
    border-radius: 50%;
    animation: animate 10s linear infinite;
    z-index: 1;
}

@keyframes animate {
    0% {
        transform: translate(0, 0);
    }
    50% {
        transform: translate(50px, 50px);
    }
    100% {
        transform: translate(0, 0);
    }
}










.owl-nav {
    position: absolute;
    bottom: 50%;
    width: 100%;
  }
  .owl-prev {
    display:block;
    float: left;
    margin-left: -50px;
    width: 50px;
    height: 50px;
  }
  .owl-next {
    float:right;
    margin-right: -50px;
    display:block;
    height: 50px;
    width: 50px;
  }
  
  .card-title { color: #18abd0; }
  
  .card-img-top img { max-height: 70px; max-width: 70px; margin: auto; }






















































@charset "utf-8";
*{ margin:0; padding:0;}
/* @import url('https://fonts.googleapis.com/css2?family=PT+Sans:wght@400;700&family=Roboto:wght@100;300;400;500;700;900&display=swap'); */
html {  font-size: 100%;overflow-y: scroll; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%;}
* {-webkit-box-sizing: border-box; -moz-box-sizing:border-box; box-sizing:border-box;}
*:before, *:after {-webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;}
a[href^="tel:"] { color: inherit; text-decoration: none;}
::selection{ background:#2f4557!important; color:#fff}
::-moz-selection{ background:#2f4557!important; color:#fff}
a{ color:#2f4557; text-decoration: none; outline:none}
a:hover, a:focus{  text-decoration: none; outline:none} 
ul{list-style: none; padding: 0; margin: 0;}
:root{ 
    --blue:#0763a7;
    --light-blue:#e1f3ff;
    --dark-blue:#002c4d;
    --sky-blue:#3d9de3;
    --text-color:#587386;
    --gray:#f5f5f5; 
    --light-gray:#e8f0f1;
    --dark-gray:#222222;
    --white:#fff;  
  } 
img{ max-width:100%; border:0;}
body{ font-family: 'Roboto', sans-serif; font-size: 14px; color:var(--text-color); line-height:1.3; min-width:320px;}
 h2, h3 {font-family: 'Roboto', sans-serif;}
 h2{color: var(--dark-blue); font-weight: 900; font-size:40px;}
img{ height:auto; max-width:100%;} 
.container{ max-width:1230px; margin:0 auto;}  
 .btn.focus, .btn:focus{box-shadow:none;}
 .btn-link.focus, .btn-link:focus { text-decoration:inherit;}
p{}
.topmenu a, .sociallink a, .rightlink > ul > li > a, .eventcont, .contactfor, .loginlink, .notificationbox > a, .morelink, .tabtext .tab-pane ul li a, .morebtn, .imp-card-link .border-left-primary, .bluebox > ul > li{  -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out;  transition: all 0.3s ease-in-out;}  
 
.topstrip{background:var(--dark-blue); font-family: 'PT Sans', sans-serif;}
.toplinks{ display: flex; flex-wrap: wrap; justify-content: space-between; }
.toplinks a{color: var(--white);}
.leftlink > ul, .rightlink > ul{display: flex;flex-wrap: wrap;}
.leftlink > ul > li{position: relative;}
.leftlink > ul > li > a{padding:10px 15px; min-height: 40px;  display:flex; align-items: center; position: relative;}

.rightlink > ul > li{padding-left: 3px;}
/*.rightlink > ul > li > a{ padding: 10px; background: var(--white); color: var(--blue); display: block;}*/
.rightlink > ul > li > a, .rightlink .search {padding: 10px; background:var(--light-blue); color: var(--dark-blue); display: block; height:32px; line-height:14px; font-weight: 600; letter-spacing:-1px; border-radius:3px; min-width:32px; text-align:center; cursor: pointer;}
.rightlink > ul > li > a:hover{background:var(--sky-blue); color: var(--white);}
.rightlink .search:hover {background: #e1f3ff;color: #0d0d0d;}
.rightlink .search {width: auto;vertical-align: middle;padding: 7px 10px;background: #3d9de3;color: #fff;}
.searchsec .field {height: 32px;border: none;width: 0px;position: absolute;right: 0px;top: 32px;border-radius: 2px;background: #e1f3ff;}
.rightlink .search span {font-weight: 500; font-size: 14px;  letter-spacing: normal;}
#google_translate_element {background: var(--sky-blue); padding:6px 10px; border-radius: 4px; min-width:140px; /*margin-top: 3px;*/}
#google_translate_element div, #google_translate_element span{background: none!important; border: none!important;}
#google_translate_element img{display: none;}
#google_translate_element a, #google_translate_element a span{color: var(--white)!important;font-family: 'Roboto', sans-serif; font-weight:400;letter-spacing:0;}

/*.headersec{ background:rgba(0,89,163,0.8); padding: 5px 0; position: absolute; left: 0; top: 40px; width: 100%; z-index: 99; }*/
.headersec{background:var(--dark-blue); padding: 5px 0;}
.topheader{display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center;}
a.headlink.morebtn{color:var(--white);}
.logo{  }
.logo a{display: flex; align-items: center;}
.logo img{ width: 90px; -webkit-transition: width 0.3s;     -moz-transition: width 0.3s;    -ms-transition: width 0.3s;   -o-transition: width 0.3s;   transition: width 0.3s;}
.logo a span{color: var(--white);font-size: 16px; font-weight: 700;}
.logo a span small {display: block; font-size: 18px; margin-top: 5px;}

.gridsec ul {list-style: none; -webkit-column-gap: 20px;  -moz-column-gap: 20px;  column-gap: 20px;  -webkit-columns: 300px 3;  -moz-columns: 300px 3;
    columns: 300px 3; width: 100%;}
.gridsec>ul>li {page-break-inside: avoid;}
.gridbox {background: #fff; border: 1px solid #e0e2e3; margin-bottom: 20px; cursor: pointer; display: block; width: 100%; border-radius:5px; overflow:hidden;}

.topmenubg{background:var(--blue);}
.navicon{display: none;}
.topmenu{ }
.topmenu > ul{display: flex; flex-wrap: wrap;justify-content:space-between;}
.topmenu > ul > li{ position: relative;}
.topmenu > ul > li > a{ color:#fff;  font-size: 15px; display:flex; align-items: center; padding: 10px 16px; line-height: 24px; font-weight:500; position: relative; }
.topmenu > ul > li > a:hover{color: var(--sky-blue);}
.sublinks > a:after{ content:""; width: 8px; height: 8px; margin-top:-4px; border-right: 1px solid #fff; border-bottom: 1px solid #fff; transform: rotate(45deg); display:inline-block; margin-left: 5px; }

.topmenu > ul > li > ul > li > a{display: block; padding: 10px 15px;}
.sublinks2 > a{position: relative;}
.sublinks2 > a:after{ content:""; width: 8px; height: 8px; border-right: 1px solid #fff; border-top: 1px solid #fff; transform: rotate(45deg); display:inline-block; position: absolute; right: 10px; top: 14px;}

.vision-desc ul{margin-bottom: 15px; line-height: 1.5;  list-style: disc; margin-left: 18px;}
.vision-desc h2{margin-bottom:5px; font-size:40px;}
.lilist6{flex-wrap:wrap;}
.lilist6 li { min-width: 16%;padding: 5px;}
.lilist6 li .lbox{padding: 5px; border: 1px solid #f1f1f1;  border-radius: 5px; display:block;height:100%;}
.lilist6 li .lbox span{display:block; width:100%; height:100px;}
.lilist6 li .lbox span img{width:100%; height:100%; object-fit:contain;}
.lilist6.onimg li .lbox span{ height:auto;}

.btn.btn-link{color:#212529;}
.owl-nav button{border-radius:5px 0px 0px 5px;}

.toptabsec .tab-content ol{margin-left:15px;}


@media (min-width: 1000px) {
.bleft{width: 60%;} 
.sub-menu{display: none; position: absolute; left: 0; top: 100%; background: var(--dark-blue); width: 220px; z-index: 9;}
.topmenu > ul > li:last-child .sub-menu{left: inherit; right: 0;}
.sub-menu li{position: relative;}
.sub-menu li a{display: block; color: var(--white); padding: 10px 20px; font-size: 13px;}
.sub-menu li:hover a{color:var(--light-blue);}
.sub-menu li{border-top: 1px solid #00365e;}
.sub-menu li:first-child{border: none;}
.sub-menu > li > ul{display: none; position: absolute; left: 100%; top: 0; background: var(--dark-blue); width: 220px; z-index: 9;}

.sub-menu > li:hover > ul{display: block;}

.topmenu > ul > li:hover > a{  background:var(--dark-blue); color:#45a7ef;}
.topmenu > ul > li:hover > .sub-menu{ display: block;  }
.topmenu > ul > li .sub-menu > li:hover > a{ color:#45a7ef;}

.menuscroll{ width:100%; padding-right: 15px; max-height:260px;overflow: auto; /*overflow-y: scroll; */}
.menuscroll-primary::-webkit-scrollbar {width: 6px; background-color: #F5F5F5;border-radius: 10px;}
.menuscroll-primary::-webkit-scrollbar-track {-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);  background-color: #F5F5F5; border-radius: 10px;}
.menuscroll-primary::-webkit-scrollbar-thumb {border-radius: 10px; -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);-moz-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1); background-color:var(--sky-blue);}



/*.sub-menu{box-shadow:0px 1px 3px #dfdfdf;}
#menu-item-23 .sub-menu{width: 700px;padding: 30px; left: inherit;right: 0; box-shadow:0px 1px 3px #dfdfdf;}
#menu-item-23 .sub-menu{column-count: 2; column-gap:1px; column-rule-width: 1px;}
#menu-item-23 .sub-menu > li{  padding-right: 5px;border: none;}
#menu-item-23 .sub-menu > li > a{position: relative; padding-left:15px; color:#2f4557;}
#menu-item-23 .sub-menu > li > a:before{content:""; width: 6px; height: 6px; display: inline-block;position: absolute; left: 0; top: 15px; border-top:1px solid #2f4557; border-right:1px solid #2f4557; transform: rotate(45deg); }
.sub-menu{list-style: none;   padding: 10px; position: absolute;left: 0; top: 100%; width: 260px; background: #fff; z-index: 99; }*/

}

 
@keyframes menu_sticky {
    0% {
        margin-top: -100px;
    }
    50% {
        margin-top: -90px;
    }
    100% {
        margin-top: 0;
    }
}
.headerbg.fixed{position: fixed; top:-67px; left: 0; /*background:rgba(0,108,145,1);*/ width: 100%;  z-index: 991;  animation-name: menu_sticky;  animation-duration: 0.60s;
    animation-timing-function: ease-out; -webkit-box-shadow: 0px 13px 30px -12px rgba(0, 0, 0, 0.75);
    -moz-box-shadow: 0px 13px 30px -12px rgba(0, 0, 0, 0.75);   box-shadow: 0px 13px 30px -12px rgba(0, 0, 0, 0.75);}

.headerbg.fixed .logo img{ width: 70px; }  
.heighthead.fixed{height:131px;}


@media (min-width: 1025px) and (max-width: 1199px) {
/* .headerbg.fixed .logo {width: 250px; padding: 15px 50px 15px 20px;} */
#menu-item-23 .sub-menu{width: 580px;}
/* .headerbg.fixed .topmenu {margin-top:13px;}
.headerbg.fixed .topmenu > ul > li > a { font-size: 13px; padding:8px 12px; } */
/* .headerbg.fixed .topmenu > ul > li:last-child > a {padding: 7px 15px;} */
}

 


.slide{width: 1200px; position: absolute;  top: 50%;  left: 50%;  transform: translate(-50%, -50%);}
.btitle {-webkit-transition:0.7s ease; transition: 0.7s ease; -webkit-transition-delay: 300ms; -moz-transition-delay: 300ms; transition-delay: 300ms; -webkit-transform: scale(0);  -moz-transform: scale(0); -ms-transform: scale(0);  transform: scale(0);}
.btitle span{color: var(--white);}
.bcontent {-webkit-transition: 1s ease; transition: 1s ease; -webkit-transition-delay: 400ms; -moz-transition-delay: 400ms; transition-delay: 400ms; -webkit-transform: scale(0);
  -moz-transform: scale(0); -ms-transform: scale(0);  transform: scale(0);}
.active .bcontent, .active .btitle { -webkit-transform: scale(1);-moz-transform: scale(1);  -ms-transform: scale(1);transform: scale(1);}
.bcontent p span{color: var(--white);}
.btitle{ font-size:40px; font-weight: 700; line-height: 1; color: var(--dark-blue); margin-bottom:10px;}
.bcontent{color:var(--dark-blue); font-size: 16px; line-height: 1.5; max-width: 50%;}
 
.homeslider .owl-dots{position: absolute;left: inherit; bottom:40%;right: 15px;text-align: center;width: 30px;}
/*.homeslider .owl-dots > div{padding: 10px;}
.homeslider .owl-dot span{position: relative;}
.homeslider .owl-dot.active span:before{content:""; width: 19px; height: 19px; border-radius: 50%; border:1px solid #fff; position: absolute;left:-4px; top:-4px; display: block;}*/
/*.owl-item:nth-child(4n) .btitle{ color:#2F4557; }*/
  
.stripbg{background: url(../images/stripbg.jpg) center center no-repeat; background-size: cover; padding: 30px 0;}
.stripsec{display: flex; flex-wrap: wrap; align-items:center; justify-content:center; color: var(--white);}
.textleft{display: flex; flex-wrap: wrap; align-items: center;}
.textleft small{font-size: 24px; /*font-style: italic;*/ font-weight:600; margin-right: 10px;}
.textleft span{font-size: 26px; font-weight:600; display:flex; flex-wrap:wrap;}
.textleft span a{color: var(--white);}
.contactfor{display: inline-block; border:2px solid var(--white); border-radius: 30px; color: var(--white);font-family: 'PT Sans', sans-serif; font-size: 20px; font-weight: 700; padding: 10px 30px; margin:2px;}
.contactfor:hover{background: var(--sky-blue); color: var(--white); border-color:var(--sky-blue);}

.boxsec{padding: 50px 0;}
.blist > ul{display: flex; flex-wrap: wrap; margin:0 -6px; }
.blist > ul > li{ width: 38%; padding:5px; }
.blist > ul > li:nth-child(3){width: 24%;}
.box{border: 1px solid #dce8ef; border-radius: 10px; padding:25px 70px 25px 25px; height: 100%; position: relative; overflow: hidden;}
.bicon { position: absolute; right: 0; top: 0; display: flex; height: 65px; align-items: center; justify-content: center;  width: 56px;}
.bicon:before{ content:""; width:110px; height:110px; background: var(--dark-blue); display: inline-block; position: absolute; top: 0; right: 0; clip-path: polygon(100% 0, 0 0, 100% 100%);}
.bicon img{position: relative;}
.box h3{ font-family: 'PT Sans', sans-serif; font-size: 20px; font-weight: 700; margin: 0 0 5px; color: var(--dark-blue);}
.box ul{}
.box ul li{}
.box ul li a{position: relative; padding: 4px 15px; display: block; color: var(--text-color);}
.box ul li a:before{ content:""; width: 8px; height: 8px; background: var(--dark-blue); border-radius:3px; position: absolute; left: 0; top:7px;  display:inline-block; }

.blist > ul > li:nth-child(3) .box{ height:calc(50% - 5px); }
.blist > ul > li:nth-child(3) .box:first-child{margin-bottom: 10px;}
.blist > ul > li:nth-child(4){width: 100%;}
.bluebox{background: var(--blue); border-radius: 10px; overflow: hidden; height:100px;}
.bluebox > ul{width: 100%;}
.bluebox > ul > li{ width: 100%;background: var(--dark-blue);} 
.bluebox > ul > li a{color: var(--white); padding:15px 25px; display: block;background: var(--dark-blue);}
.bluebox > ul > li:nth-child(2n) a{background: var(--sky-blue);}
/* .bluebox > ul > li:nth-child(3) a{background: var(--dark-blue);} */

.bluebox li a{} 
/*.bluebox li {   height: 80px;  display:block; width: 100%; position: relative;  top: 0; left: 0; 
-webkit-animation:move 5s; -moz-animation:move 5s;  -ms-animation:move 5s;   -o-animation:move 5s;    animation:move 5s; 
-webkit-animation-iteration-count:infinite; -moz-animation-iteration-count:infinite; -ms-animation-iteration-count:infinite;  -o-animation-iteration-count:infinite;        animation-iteration-count:infinite; 
-webkit-animation-delay:3s; -moz-animation-delay:3s; -ms-animation-delay:3s; -o-animation-delay:3s;   animation-delay:3s;
}
.bluebox li a{padding:0 25px; height: 100%; display:flex; align-items: center; }

@keyframes move{
0%  { top: 0px; }
33.33% { top: -80px; }
66.33% { top: -160px; }
/*75% { top: -240px; }
80% { top: -200px; }*/


@-webkit-keyframes move {
 0%  { top: 0px; }
33.33% { top: -80px; }
66.33% { top: -160px; }
}
@-moz-keyframes move {
0%  { top: 0px; }
33.33% { top: -80px; }
66.33% { top: -160px; }
}
@-o-keyframes move {
0%  { top: 0px; }
33.33% { top: -80px; }
66.33% { top: -160px; }
}
@keyframes move {
0%  { top: 0px; }
33.33% { top: -80px; }
66.33% { top: -160px; }
}
*/





.heading2{font-size: 46px; font-weight: 900; color: var(--dark-blue); }
.heading2 span, .importantbg h3 span{font-weight: 300;}

.centerheading{text-align: center; justify-content:center; }
.centerheading .heading2{margin-bottom: 10px;}
.centerheading p{ color: var(--white); }
.importantbg .centerheading{margin-bottom: 30px;}

.importantbg{background:var(--dark-blue) url(../images/importantbg.jpg) center center no-repeat; background-size: cover; padding: 50px 0; overflow: hidden;}
.importantbg h2, .importantbg h3{color: var(--white); } 
.importantbg h3{margin: 0 0 10px; font-size:24px;}
.importantsec{display: flex; flex-wrap: wrap; margin: 0 -5px;}
.impbox{width:27%; padding: 5px;}
.importantsec .impbox:nth-child(2){ width: 46%; }

.loginlink{background: var(--light-blue); color: var(--dark-blue); padding: 25px; min-height: 130px; display:flex; align-items: center; width: 100%; margin-bottom: 10px; border-radius:10px; font-weight:600;}
.loginlink img{margin-right: 15px;}
.loginlink small{font-size:14px;}
.loginlink:hover{background: var(--sky-blue); color: var(--white);}
.loginlink:hover img{ filter: brightness(110); }
.impbox .nav{justify-content: center; border: none;}
.impbox .nav li{padding: 0 2px;}
.impbox .nav li a{ display: block; padding: 10px 20px; min-width: 150px; text-align: center; background:var(--blue); color: var(--white); border-radius:10px 10px 0 0;}
.impbox .nav li a.active{ background: var(--white); color: var(--dark-blue);}

.tabtext .tab-pane{background: var(--white); padding: 15px; border-radius: 10px; min-height:346px;}
.tabtext .tab-pane ul{display: flex; flex-wrap: wrap; margin:0 -2px; }
.tabtext .tab-pane ul li{width: 25%; padding: 2px;}
.tabtext .tab-pane ul li a{display: block; text-align: center; min-height: 66px; padding: 10px 0px; border-radius: 4px; border:1px solid transparent; }
.tabtext .tab-pane ul li a:hover{border:1px solid #a5d7f9;}
.tabtext .tab-pane ul li a span{display: block;padding-top: 5px;}

.tabtext #recent ul li a img{ max-height: 30px; }
.tabtext #erp ul li a img{ max-height: 40px; }
.tabtext #erp ul li a{ min-height: 130px; border:1px solid #a5d7f9; padding: 15px 5px; }
.tabtext #erp ul li a:hover{background: var(--light-blue);}
.tabtext #erp ul li a span{}

.font12 span{font-size:12px;}

.notificationbox{margin-bottom: 10px;}
.notificationbox > a{padding: 15px; background: var(--white); border-radius: 10px; display: block;}
.noteicon{display: flex; align-items: center; margin-bottom: 8px;}
.noteicon img{margin-right: 5px; }
.dates{background: var(--light-blue); padding: 3px 8px; border-radius: 3px; font-size: 13px; display: inline-block;}
.notificationbox > a:hover .dates{background: var(--white);}
.notificationbox > a:hover{background:var(--light-blue); color: var(--text-color);}

.scrollmarque{width: 100%; height: 345px; overflow:hidden; }

.studybg{background:var(--white) url(../images/pattern.png) center center repeat; padding: 50px 0;}
.studysec{display: flex; flex-wrap: wrap; justify-content: space-between;}
.leftheading{width: 38%;}
.leftheading .heading2{ margin-bottom: 10px;}
.leftheading p{font-size: 18px;margin: 0;color: var(--dark-blue); }
.studysec ul{display: flex; justify-content: center; width: 58%;}
.studysec ul li{width: 33.33%; padding: 15px; text-align: center;}
.counts{font-size:50px; font-weight: 900; color: var(--dark-blue);}
.counts span{ display: block; font-size: 18px; font-weight: 700;}

.eventbg{background:var(--light-blue) url(../images/eventbg.jpg) center center no-repeat; background-size: cover; padding:50px 0;}
.eventbox{position: relative; }
.eventcont{position: absolute; left: 0; top:calc(100% - 68px); width:80%; clip-path: polygon(0 0, 90% 0%, 100% 100%, 0% 100%); background:var(--dark-blue); color: var(--white); padding:15px 20px;}
.eventcont h3{font-size:18px; margin: 0; color:var(--white); overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp:1;-webkit-box-orient: vertical; line-height: 1.2;}
.eventcont p{ display: none; margin-top: 10px;}
.eventimg{display: block; height:300px;}
.eventimg img{width: 100%; height: 100%; object-fit: cover;}
.eventbox:hover .eventcont{ padding: 30px; top:0; height: 100%; width: 100%; background:rgba(1, 35, 64, 0.9);clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);}
.eventbox:hover .eventcont p{display:block;}
.eventbox:hover .eventcont h3{ -webkit-box;-webkit-line-clamp:4;}

.deskbg{padding: 50px 0;}
.desklist{}
.desklist ul{display: flex; flex-wrap: wrap; margin: 0 -10px;}
.desklist ul li{width: 50%; padding:20px; border-top:2px dashed #c2def0;}
.desklist ul li:nth-child(1), .desklist ul li:nth-child(2){border-top:none; /*padding-top: 0;*/}
.desklist ul li:nth-child(2n){border-left:2px dashed #c2def0; padding-right: 0;}

.deskbox{display: flex; flex-wrap: wrap; align-items:center; justify-content: space-between;}
.deskcont{width: calc(100% - 200px);}
.deskcont h3{margin: 0 0 5px; font-size: 22px; color: var(--dark-blue);}
.deskcont h4{margin: 0; font-weight: 600; font-size: 15px; color: var(--blue);font-family: 'PT Sans', sans-serif; margin: 0 0 5px;}
.deskcont p{ overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp:4;-webkit-box-orient: vertical; margin-bottom: 5px; line-height: 1.4;}
.deskimg{ width: 170px;height: 170px; padding: 10px; background: var(--light-blue); border-radius:5px; position: relative; }
.deskimg img{display: block; object-fit: cover; width: 100%; height: 100%; border-radius: 4px;}
.deskimg:after { top: 50%; border: solid transparent; content: ""; height: 0; width: 0; position: absolute;  pointer-events: none; border-color: rgba(225, 243, 255, 0);border-width: 15px; margin-top: -15px;}
.desklist ul li:nth-child(1) .deskimg:after, .desklist ul li:nth-child(3) .deskimg:after, .desklist ul li:nth-child(5) .deskimg:after {right: 100%; border-right-color: #e1f3ff;}
.desklist ul li:nth-child(2n) .deskimg:after {left: 100%;border-left-color: #e1f3ff;}

.morebtn{background: var(--dark-blue); color: var(--white); border-radius: 4px; padding: 5px 15px; display: inline-block; font-size: 13px;}
.morebtn:hover{background: var(--sky-blue); color: var(--white); }
.desklist ul li:nth-child(1), .desklist ul li:nth-child(3), .desklist ul li:nth-child(5){ padding-left: 0;}
.desklist ul li:nth-child(1) .deskimg, .desklist ul li:nth-child(3) .deskimg, .desklist ul li:nth-child(5) .deskimg{order: 2;}


/*clip-path: polygon(0 0, 100% 0, 100% 100%, 20% 100%);*/
.aboutbg{background:var(--light-blue) url(../images/aboutimg.jpg) center right no-repeat; background-size:55% auto; padding:60px 0px 80px; position: relative;}
.aboutbg:before{ content:""; clip-path: polygon(0 0, 90% 0, 100% 100%, 0 100%);background:var(--light-blue); position: absolute; left:0; top: 0; width:52%; height: 100%;   }
.aboutbg .container{position: relative;}
.aboutcont{width:39%;}
.aboutcont h2{  margin-bottom: 15px;}
.aboutcont p{line-height: 1.7; margin-bottom: 20px;}
.morelink{background: var(--blue); color: var(--white); border-radius: 30px; padding:13px 30px; min-width: 150px; font-size: 15px; text-align: center; display: inline-block;}
.morelink:hover{background:var(--dark-blue);color: var(--white);}
.dpbg{padding: 50px 0;}
.dpsec{display: flex; flex-wrap: wrap; margin: 0 -15px;}
.dpsec h3{margin-bottom: 5px; font-size: 22px; color: var(--dark-blue); border-left:4px solid var(--sky-blue); padding:0 10px; display: flex; justify-content: space-between; align-items: center;}
.dpsec h3 a{font-size: 14px; color: var(--blue);}
.box3{width: 50%; padding:15px;}
.box3 ul{display: flex; flex-wrap: wrap; margin: 0 -5px;}
.box3 ul li{padding:5px; width: 33.33%;}
.bgbox{display: block; height:130px; border-radius: 5px;overflow: hidden; background: var(--dark-blue); position: relative;}
.bgbox img{object-fit: cover; width: 100%; height: 100%; opacity: 0.4;}
.bgbox span{display: block; position: absolute; left: 0; bottom: 0; padding: 15px; color: var(--white); font-size: 16px;}

.contactbg{background:var(--blue) url(../images/contactimg.jpg) center right no-repeat; background-size:cover; padding: 60px 0;}
.contactbg h2, .contactbg p a{color: var(--white);}
.addtext{color: var(--light-blue); position:relative; padding-left: 30px; margin-top: 25px; font-size: 15px; font-weight: 300; line-height: 1.4;}
.addtext .fa{position: absolute; left: 0; width: 18px; font-size: 18px; text-align: center;}
.addtext a{color: var(--white); }
.addtext.number a{font-size: 18px; font-weight: 700;}

.searchbox{ display:flex; justify-content:center; padding:8px; border-radius:5px; background:var(--blue); margin-bottom:15px;}
.searchbox ul{width:100%; display:flex; flex-wrap:wrap; justify-content:center; background:var(--gray); padding:10px 15px; border-radius:5px;}
.searchbox ul li{ min-width:200px; padding-right:5px;}
.searchbox ul li:nth-child(2){width:300px;}
.searchbox .inputsec{border:none; background:var(--white); width:100%; padding:10px 15px; border-radius:4px; min-height:40px;}
.searchbox button{width:100%; background:var(--blue);color:var(--white); border:none; min-height:40px;border-radius:4px;}

.sectionbox{width:100%;display:flex; flex-wrap:wrap; justify-content:space-between; }
.sidefilter{width:280px;border:1px solid var(--light-gray); border-radius:5px;}
.filtertitle{background:var(--dark-blue); color:var(--white); padding:10px 15px; border-radius:4px 4px 0px 0px;font-size:16px;display:flex;justify-content:space-between;}
.boxs{ padding:0 15px;  }
.boxs h4{margin:15px 0 5px; font-size:15px; color:var(--dark-blue);}
.boxs ul{max-height:120px; overflow:auto;}
.boxs ul::-webkit-scrollbar {width: 6px; background-color: #F5F5F5;border-radius: 10px;}
.boxs ul::-webkit-scrollbar-track {-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);  background-color: #F5F5F5; border-radius: 10px;}
.boxs ul::-webkit-scrollbar-thumb {border-radius: 10px; -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);-moz-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1); background-color:var(--sky-blue);}
 
.boxs li label{display:flex; align-items:center; font-size:14px;text-transform:capitalize;}
.boxs li label input{margin-right:5px;}
.boxs li label input[type=checkbox]:checked + span{ color:var(--blue)}

.pagingsec{width:100%;display:flex; flex-wrap:wrap; justify-content:space-between; align-items: center;color:var(--dark-blue); }
.paginations ul{display:flex;flex-wrap:wrap; }
.paginations ul li{padding:2px;}
.paginations ul li a{display:block;cursor:pointer; min-width:26px; height:26px; line-height:24px; padding:0 5px; text-align:center; border:1px solid var(--light-gray); border-radius:3px; color:var(--dark-blue);}
.paginations ul li a:hover{background:var(--light-gray);}
.paginations ul li.active a, .paginations ul li a.current{background:var(--dark-blue);border-color:var(--dark-blue); color:var(--white)}

.paginations ul li.prev, .paginations ul li.next{padding:5px; cursor:pointer;}


.listarea{width:calc(100% - 300px);}
 
.line-content.active{display:block!important;}




.searchlist ul::-webkit-scrollbar {width: 6px; background-color: #F5F5F5;border-radius: 10px;}
.searchlist ul::-webkit-scrollbar-track {-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);  background-color: #F5F5F5; border-radius: 10px;}
.searchlist ul::-webkit-scrollbar-thumb {border-radius: 10px; -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);-moz-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1); background-color:var(--sky-blue);}
 




.searchlist{position:relative;min-height:100px;}
.searchlist > ul{max-height:580px; overflow:auto;}
.searchlist > ul > li{ padding:5px 0;}
.listbox{display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; border:1px solid var(--light-blue);border-radius: 5px;}
.proimg {width: 140px;  height: 150px; padding: 8px; background: var(--light-blue); border-radius: 5px 0px 0px 5px;  position: relative;}
.proimg:after { top: 50%;  border: solid transparent;  content: "";  height: 0;  width: 0;  position: absolute;  pointer-events: none; border-color: rgba(225, 243, 255, 0);
    border-width: 15px;  margin-top: -15px; left: 100%; border-left-color: #e1f3ff;}
.proimg img{width:100%; height:100%; object-fit:cover;border-radius:4px; background:var(--white);}

.protext{width:calc(100% - 180px);}
.protext h3{margin: 0 0 10px; font-size: 20px;color:var(--dark-blue);}
.protext p{margin:0 0 8px;}
.protext p span{padding-right:15px;}
.protext p a{color:var(--blue)}

.showcont{position:relative; padding-left:18px; display:block; margin-bottom:5px; color:var(--text-color); cursor:pointer;}

.showcont:before{content:""; width:13px; height:13px; border:1px solid #767676; display:block; position:absolute; left:0px; top:2px; border-radius:3px;}
.showcont.active:before{background:#0075ff;border-color:#0075ff;}
.showcont.active:hover:before{background:#0268e1;}
.showcont.active:after{content:""; width:5px; height:8px;  border-bottom:2px solid var(--white); border-right:2px solid var(--white); display:block; position:absolute; left:4px; top:3px; transform:rotate(45deg);}

.add-content .table {  margin-top: 15px;  border: 1px solid var(--light-blue);}

.loader {border: 10px solid #f3f3f3;  border-top: 10px solid #3498db;  border-radius: 50%;  width: 60px;  height: 60px;  position: absolute;  animation: spin 1s linear infinite;
    z-index: 2;  left: 46%;   top: 46%;}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}
 








.owl-nav{}
.owl-nav button{position:absolute; top: 38%; border:none; /*transform:translate(0, -50%);*/}
.owl-nav button span{width: 36px; height: 40px; line-height: 40px; display: inline-block; font-size: 0; background:var(--light-blue) url(../images/arrow.png) center center no-repeat; border-radius:5px 0px 0px 5px;}
.owl-nav button.owl-next{ right: 0; }
.owl-nav button.owl-prev{ left: 0; transform: rotate(180deg); }
.owl-dots{display: flex; align-items: center; justify-content: center;}
.owl-dots button{ width: 12px; height: 12px; border: 1px solid var(--blue)!important; background:var(--light-blue)!important; border-radius: 50%; margin: 4px; }
.owl-dots button.active{ background: var(--blue)!important; }

.homeslider .owl-dots{flex-wrap: wrap; width:24px;}
.semesterChart text{fill:var(--dark-blue)!important;text-decoration:none!important;}
.testimonialbg{padding: 60px 0; background: var(--light-blue);}
.testimonialsec{display: flex; justify-content: space-between;}
.testimonialsec .leftheading{ width:40%; border-left: 4px solid var(--blue); padding: 30px; display: flex; flex-wrap: wrap; align-items: center;}
.testimonialslide{width: 58%;}
.tbox{background: var(--dark-blue); border-radius: 5px; padding:35px 10px; text-align: center; color: var(--white); margin-bottom: 15px;}
.timg{width: 100px; height: 100px; border-radius: 10px 0px 10px 0; overflow: hidden; margin: 0 auto;}
.timg img{object-fit: cover; width: 100%; height: 100%;}
.tbox h4{background:url(../images/comma.png) center top no-repeat; padding-top:35px; margin:20px 0px 10px; color: var(--white); font-size: 18px; font-weight: 600;}
.tbox p{color: var(--light-blue); font-size: 13px; min-height: 50px;}

.graybg{background:var(--gray);}
.graybg .centerheading p{color:var(--dark-blue)}
.semesterChart{padding:15px; background:var(--white); border-radius:10px;}


.importantlinkbg{padding: 50px 0;} 
.logos a{display: block; border: 1px solid var(--light-blue); border-radius:5px; overflow: hidden;}
.logos a img{max-height:84px; object-fit: contain;}

.footerbg{background:var(--dark-blue) url(../images/footer-pattern.png) center top repeat; padding: 50px 0; }
.footerlinks{display: flex; flex-wrap: wrap;}
.footerlinks h4{ font-family: 'PT Sans', sans-serif; font-size: 20px; font-weight: 700;}
.footerlinks h4, .footerlinks a{color: var(--white);}

.fmenu{width: 20%; padding-left:30px;}
.fmenu ul li a{padding: 5px 0; display: block;}
.flogo{width: 25%;}
.flogo a{ display: flex; align-items: center; font-size: 16px; font-weight: 700;}
.flogo a img{max-height: 70px; margin-right: 10px;}
.socials{width: 15%;}
.socials ul{display: flex;}
.socials ul li{ padding: 0 5px; }

.copyright{text-align: center; padding: 15px; color:var(--text-color); font-size: 13px; background:#011b31;}
.copyright a{color: var(--light-blue);}

#back-top{position: fixed; right: 30px; bottom:15px;}
#back-top a i{width: 30px; height: 30px; background: var(--blue); text-align: center; line-height: 30px; color: #fff; font-size: 20px; border-radius: 4px; cursor: pointer;}



.contact-address-section1 iframe{display:block;}
.contact-address{background:#e1f3ff;padding:5%;}
.contact-address > div > div{margin-bottom:20px;}
.contact-address h4{margin:0;color:var(--dark-blue);}

.list-group-flush {flex-direction: inherit; flex-wrap: wrap;margin:0 -0.5%;}
.list-group-flush > li{border:1px solid #f1f1f1!important; width:49%;margin:0.5%; }

.tablsepad.table-bordered th {background:var(--blue); border-color:var(--blue); color:var(--white);}


.rs-gallery .card{border:none;}
.rs-gallery .card-header { padding:0; border:1px solid #f1f1f1; background:#f1f1f1;   }
.rs-gallery .card-header a{ padding: .75rem 1.25rem; display:block;}
.rs-gallery .card-body{ border:1px solid #f1f1f1;}
.rs-gallery .card-link{position:relative;}
.rs-gallery .card-link.collapsed:after {content: "+"; position: absolute; right: 0; width: 30px; text-align: center; font-size: 18px;}

.paging{}
.paging ul{display:flex; justify-content:center; align-items:center;}
.paging ul li{padding:3px; font-size:18px;}
.paging ul li button {border: none;font-size:14px; border-radius: 4px; line-height: 30px; height: 30px; padding: 0px 10px; background: var(--dark-blue); color: var(--white);}


.toptabsec .nav{justify-content:center;}
.toptabsec .nav li{padding:0 2px; margin-bottom:-1px;}
.toptabsec .tab-content{ border:1px solid var(--sky-blue); padding:20px 10px;}
.toptabsec .nav-pills .nav-link{background-color:var(--sky-blue); color:var(--white); border-radius:4px 4px 0 0 ;border:1px solid var(--sky-blue); padding:8px 15px; }
.toptabsec .nav-pills .nav-link.active, .toptabsec .nav-pills .show>.nav-link { color:var(--blue); background-color:var(--white); border:1px solid var(--sky-blue); border-bottom:1px solid var(--white); }
.toptabsec .tab-content p{margin-bottom:3px;}
.imp-card-link .card-body { border: none!important;  background: var(--white); padding:0;}
.imp-card-link .card-body a{color:var(--blue); display:block; padding:15px; height:100%;}

 
.action-buttons{text-align:center;}

.flexsec{display:flex;flex-wrap:wrap; align-items:center; background:var(--light-blue);}
.flexsec > div{width:50%;}
.flexsec:nth-child(2) > div.imgs{order:2;}
.imgs{height:440px;}
.imgs img{width:100%; height:100%; object-fit:cover;}
.abtaxt{padding:30px;}
.abtaxt h2{font-size:32px; margin:0 0 5px;}
.abtaxt ul{margin-bottom:15px; list-style:disc; margin-left:18px;}
.abtaxt ul li{padding:2px 0;}

.field{ height: 44px;border: none; width:0px;  position: absolute; right: 40px; top: 0;}
.field.active{width:250px;padding:10px 15px;-webkit-transition: width 0.3s; -moz-transition: width 0.3s; -ms-transition: width 0.3s; -o-transition: width 0.3s; transition: width 0.3s;}
.searchsec{position: relative;}
.search { width:40px; height:44px; background:var(--light-blue); color:var(--blue); cursor: pointer;  display: flex; align-items: center; justify-content: center; font-size: 18px;   }
.searchsec ul{list-style: none; padding: 0; margin: 0; position: absolute; right: 0; top:44px; z-index:999; width: 290px; border:1px solid #f1f1f1; border-top:0; border-radius:0 4px 4px 0; background:var(--white); max-height:350px; overflow:auto;}
.searchsec ul li{ border-top:1px solid #f1f1f1; }
/* .searchsec ul li:first-child{border:none;} */
.searchsec ul li a{padding:10px 15px; display: block; text-decoration:none; }
.searchsec ul li a:hover{background:var(--light-blue);}

.searchsec ul::-webkit-scrollbar {width: 6px; background-color: #F5F5F5;border-radius: 10px;}
.searchsec ul::-webkit-scrollbar-track {-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);  background-color: #F5F5F5; border-radius: 10px;}
.searchsec ul::-webkit-scrollbar-thumb {border-radius: 10px; -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);-moz-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1); background-color:var(--sky-blue);}
 


@media (max-width: 1440px) {
 .stripbg{padding: 20px 0;}
} 



@media (min-width: 767px) and (max-width:1024px) {
 .abtaxt p{font-size:13px;}
.imgs{height:550px;}
}
 

@media (max-width:1199px) {
.container{max-width: 980px;}
.heighthead.fixed{height:125px;}
 .slide{max-width: 94%;}
 .bleft{width: 70%;}
 .btitle{font-size: 30px;}
 .topmenu > ul > li > a{font-size: 14px;padding:9px 8px;}
 .sublinks > a:after{margin-top: -4px;}
.textleft small, .leftheading p{font-size: 18px;}
.textleft span {font-size: 24px;}
.morelink {padding: 9px 25px;}
.contactfor{font-size: 17px; padding:8px 20px;}
.counts{font-size: 40px;}
.heading2{font-size: 40px;}
.importantbg h3 {font-size: 20px; margin-bottom: 15px;}
.container{max-width: 980px;}
.box{padding: 20px 60px 20px 20px;}
.aboutcont {width: 45%;}
.addtext{margin-top: 10px;}
.footerlinks h4{font-size: 18px;}
.testimonialsec .leftheading{width: 40%;}
.testimonialslide {width: 58%;}
.fmenu ul li a {font-size: 13px;}
.flogo a img {max-height: 60px;}
.flogo a{font-size: 15px;}
.boxsec, .importantbg, .studybg, .eventbg, .deskbg, .aboutbg, .dpbg, .contactbg, .testimonialbg, .importantlinkbg, .footerbg{padding: 40px 0;}

}

 

@media (max-width:1000px) { 
.container{max-width:750px;}
.headerbg .container{max-width:100%;}
.heading2 {font-size: 32px;}

.navicon{display: block; float: right; cursor: pointer; position: absolute; top:20px; right:15px; z-index: 99; width: 30px; height: 30px; padding-top: 15px;}
.navicon span{ width:18px; height: 2px; background:#fff; position: relative; display: block;}
.navicon span:before, .navicon span:after{content:""; width: 25px; height: 2px; background:#fff; display: block; position: absolute; left: 0;}
.navicon span:after { width: 18px;  }
.navicon span:before{top: -6px;   }
.navicon span:after{bottom: -7px; }
.navicon.active{position: fixed;}
.navicon.active span{ background: none;}
.navicon.active span:before{ transform: rotate(-48deg);background: #ccc;}
.navicon.active span:after{ transform: rotate(45deg); bottom: 6px;background: #ccc;}
.active span:before, .navicon span:after { width: 18px; }
.inner-sub-menu{position:relative;}
ul .__sub-menu{border:none; height:auto; overflow:inherit; padding:0 12px;}

.headerbg.fixed .topmenu { }
.topmenubg { margin: 0; box-shadow: 0 0 3px #ccc; background:#fff; position: fixed;top: 0;right: 0; z-index: 9; width: 250px; padding:25px 0; height: 100%; overflow-x: hidden; overflow: auto; -webkit-font-smoothing: antialiased;  transform-origin: 0% 0%;  transform: translate(100%, 0);  transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);}
.topmenubg.showmenu{ transform: translate(0%, 0); }
.topmenu > ul{flex-wrap: wrap;}
.topmenu > ul > li{width: 100%;border:none; position: relative; border-top:1px solid #f0f3f6;}
.topmenu > ul > li:first-child{border: none;}
.topmenu > ul > li > a { color:#2f4557;padding: 10px 0px;}

.ddclick{position: absolute; right: 0; top: 0; width: 32px; height:42px;/* background:#ccc;*/ cursor: pointer;color:#405464;}
.ddclick:before {content: "+";display: inline-block; width: 100%; text-align: center; line-height: 42px; font-size: 24px;}
.ddclick.active:before {content: "-";}
.sub-menu{ display: none;} 
.sub-menu li a {padding: 5px; display: block;}
.sublinks2{position: relative;}
.topmenu > ul > li > ul > li > a{padding: 10px;}
.sublinks2  li a {padding: 4px 15px; font-size: 13px;}

.headerbg.fixed{top: 0;}
.rightlink{margin-right:40px;}
.logo img{width: 80px;}

/* .textleft {width: 65%;}
.textleft small{width: 100%;} */
.blist > ul > li{width: 50%;}
.blist > ul > li:nth-child(3) {width: 100%; display: flex; flex-wrap: wrap;}
.blist > ul > li:nth-child(3) .box {height: 124px; width: calc(50% - 5px);}
.blist > ul > li:nth-child(3) .box:first-child{ margin-right: 10px;}

.impbox {width:50%;}
.scrollmarque{height: 270px;}
.importantsec .impbox:nth-child(2) {width:100%; order: 3;}
.impbox .nav { justify-content: inherit; margin-left: 10px;}
.notificationscrol{order: 2;}
 

.leftheading{text-align: center;}
.leftheading, .studysec ul{width: 100%;}
.counts {font-size: 30px;}
.counts span {font-size: 15px;}

.desklist ul li{padding: 10px;}
.deskimg {width: 130px; height: 130px; padding: 5px;}
.deskcont {width: calc(100% - 140px);}
.deskcont h3 {font-size: 16px; font-weight: 600;}
.deskcont h4 {margin: 0; font-size: 14px;}
.deskcont p {line-height: 1.3; font-size: 13px;}
.aboutcont p {line-height: 1.4; margin-bottom: 10px; font-size: 13px;}
.aboutcont h2 { margin-bottom: 5px;}
.box3 {width: 100%;}
.dpsec h3{font-size: 18px;}
.testimonialsec{flex-wrap: wrap;}
.testimonialsec .leftheading{padding: 15px; border: none;}
.testimonialsec .leftheading, .testimonialslide{width: 100%;}

.toptabsec .nav-pills .nav-link {border-radius: 4px; border: 1px solid var(--sky-blue)!important; margin-bottom: 3px;}
.boxsec, .importantbg, .studybg, .eventbg, .deskbg, .aboutbg, .dpbg, .contactbg, .testimonialbg, .importantlinkbg, .footerbg {    padding: 30px 0;}
}


@media (max-width: 991px) {
.list-group-flush > li{width:99%;}
}
 
.rs-breadcrumbs{min-height:215px;}
.noticepagesec{min-height:280px;}

@media (max-width: 767px) { 
.rs-breadcrumbs {min-height: 140px;}
.noticepagesec{min-height:200px;}
.sidefilter, .listarea{width:100%;}	
.filtertitle{border-radius:5px;}
.listarea{margin-top:10px;}
.boxs{display:none;}
.sidefilter.active .boxs{display:block;}
.protext {width: calc(100% - 90px);}
.listbox{padding: 10px 15px;/*text-align:center;*/}
.proimg{/*margin:0 auto 10px;*/ width:80px; height:80px; padding:4px;}
.proimg:after{border-width:5px; margin-top:-5px;}
.protext h3{font-size:16px; margin:0 0 5px;}
.protext p {margin: 0 0 4px;}


body{font-size: 13px;}
h2{font-size:24px;}
.imglistsec img{max-width:170px;}
.lilist6 li{width:50%; }
.__vertical-tabs-section .tabs-v{display:block!important;}
.tabs-v img{max-width:160px; max-height:160px; margin:0 auto 10px; display:block;}
.txt-tab h3{font-size:20px;}
.__vertical-tabs-section .tabs-v .txt-tab .txt-tab-overflow{height:auto!important; max-height:500px!important;}

.bcontent p{ display: none; }
.btitle {font-size: 22px; line-height: 1.2;}
.textleft { width: 100%; text-align: center; justify-content: center; padding-bottom: 10px;}
.morelink{display: none;}

.contactfor {font-size: 14px; padding: 5px 15px; margin:2px;}
/* .contactfor{display:block; margin: 0 auto;} */
.textleft span { font-size: 20px;}
.blist > ul > li {width: 100%;}
.blist > ul > li:nth-child(3) .box { width: 100%;}
.blist > ul > li:nth-child(3) .box:first-child { margin-right: 0;}
.heading2 { font-size: 26px;}

.impbox {width: 100%;}
.importantbg h3 {margin-bottom: 5px;}
.notificationscrol{margin-bottom: 15px;}
.impbox.logtabs{ width: 100%; display: flex; flex-wrap: wrap;}
.loginlink img { margin-right: 10px; width: 30px;}
.logtabs h3, .importantbg h3{width: 100%; text-align: center;}
.logtabs a {width:calc(50% - 5px); padding: 15px; min-height: auto;}
.logtabs a.adminlogs{margin-right: 10px;}
.tabtext .tab-pane ul li { width: 50%;}
.tabtext .tab-pane ul li a{border: 1px solid #a5d7f9;}
.counts { font-size: 22px;}
.counts span {font-size: 13px;}
.desklist ul li{width: 100%; padding:10px 0!important; border: none!important; border-top:1px dashed #c2def0!important;}
.desklist ul li:first-child{border-top:none!important;}
.deskimg {width: 100px; height: 100px;}
.desklist ul{margin: 0;}
.deskcont {width: calc(100% - 120px);}
.deskcont p{-webkit-line-clamp: 3;}
.aboutcont {width: 100%;}
.aboutbg:before{display: none;}
.aboutbg {background: var(--light-blue);}
.logo img {width: 70px;}
.logo a span {font-size: 13px;}
.logo a span small {font-size: 13px;}

.flogo {width: 100%; margin-bottom: 30px;}
.socials{ margin-top:30px; }
.footerlinks h4{font-size: 16px;}
.fmenu, .socials{width:100%; padding-left: 0;}
.fmenu > h4{position: relative; padding:10px 0; border-bottom: 1px solid #518bad; margin: 0;}
.fmenu > h4:after{ content:""; width: 8px; height: 8px; border-right: 1px solid #fff; border-bottom: 1px solid #fff; transform: rotate(45deg); display:inline-block; position: absolute; right:5px; margin-top: 5px; }
.fmenu > h4.active:after{transform: rotate(0deg);}
.fmenu > ul{display: none;}
.fmenu > ul.active{display: block;}

.fmenu ul li a{padding: 7px 15px; position: relative;}
.fmenu ul li a:after{ content:""; width: 8px; height: 8px; border-radius:2px; background:var(--sky-blue); display:inline-block; position: absolute; left:0px; top: 10px; }

.vision-desc h2{font-size:24px;}

.toptabsec .nav-pills .nav-link{padding:5px 10px;}
.flexsec > div{width:100%;}
.flexsec > div.imgs{order:2;}
.imgs {height: auto;}
}
 

@media (max-width: 639px) {
 .rightlink { margin: 5px 0 0; width: 100%; display: none;}
.bgbox{height: 110px;}
.bgbox span { padding:10px; font-size: 14px;}

.searchbox ul li {min-width: 100%; padding: 0 0 5px;}
}
 

@media (max-width: 479px) {
.listbox{position:relative; padding:10px 10px 30px;}
/* .phonemail{position:absolute; left:15px; bottom:5px;} */
.depart-add span{display:block;}
.btitle { font-size: 20px;}
 .bgbox span { padding: 7px; font-size: 13px;}

 .homeslider.owl-carousel .owl-item img {width: inherit; max-width: inherit;  height: 170px;}
}
 

 




/* Second MY-TABS VERTICAL */
.__vertical-tabs-section .tabs-v { position: relative; display: flex; flex-direction: column; flex-wrap: wrap; justify-content: center;}
.__vertical-tabs-section .tabs-v label { position: relative; order: 1; display: flex; justify-content: flex-start; align-items: center; width: 325px; /* height: calc(500px / 8); */   padding: 10px 15px; margin-bottom: 0; background-color: transparent; cursor: pointer;  transition: background-color 500ms ease-in-out;}
.__vertical-tabs-section .tabs-v label > img {width: 30px;height: auto; filter: saturate(0);  transition: all 500ms ease-in-out;}
.__vertical-tabs-section .tabs-v label > p {  padding: 0 0 0 15px;  margin: 0;  font-family: sans-serif;  font-size: 0.8em;  color: #909090;  text-transform: uppercase;  transition: all 500ms ease-in-out;}
.__vertical-tabs-section .tabs-v label:hover {  background-color: rgba(0, 0, 0, 0.03);}
.__vertical-tabs-section .tabs-v label:hover > img { filter: hue-rotate(185deg);}
.__vertical-tabs-section .tabs-v label:hover > p { color: var(--c1);}
.__vertical-tabs-section .tabs-v .tab-content { position: absolute; top: 0; right: 0; width: calc(100% - 350px); padding: 0; margin: 0; display: none; height:100%; border:1px solid #f1f1f1}
.__vertical-tabs-section .tabs-v .tab-content > div {display: flex; flex-direction: row; flex-wrap: wrap; align-items: stretch; background-color: #fff;}
/* .__vertical-tabs-section .tabs-v .tab-content > div > div { height: 500px;} */
.__vertical-tabs-section .tabs-v .txt-tab {display: flex; flex-direction: row; flex-wrap: wrap; align-items: center;  /* width: 50%; */ padding: 4vh calc(1vw + 15px);}
.__vertical-tabs-section .tabs-v .txt-tab .txt-tab-overflow {max-height: 650px; overflow: auto; padding-right: 5px;} 
.__vertical-tabs-section .tabs-v .txt-tab .txt-tab-overflow::-webkit-scrollbar {width: 6px; background-color: #F5F5F5;border-radius: 10px;}
.__vertical-tabs-section .tabs-v .txt-tab .txt-tab-overflow::-webkit-scrollbar-track {-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);  background-color: #F5F5F5; border-radius: 10px;}
.__vertical-tabs-section .tabs-v .txt-tab .txt-tab-overflow::-webkit-scrollbar-thumb {border-radius: 10px; -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);-moz-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1); background-color:var(--sky-blue);}

.__vertical-tabs-section .tabs-v > input { display: none;}
.__vertical-tabs-section .tabs-v > input + label::before { content: ""; position: absolute;  left: 100%;  top: 50%;  transform: translateY(-50%);  width: 0;  height: 0;  border: 0 solid transparent;  border-right: 0;  transition: all 500ms ease;  z-index: 1;}
.__vertical-tabs-section .tabs-v > input + label::after {  content: "";  position: absolute;  right: 0;  top: 50%;  transform: translateY(-50%);  width: 1px;  height: 100%;  background-color: #ccc;  transition: all 500ms ease;}
.__vertical-tabs-section .tabs-v > input:checked + label {  background-color:var(--blue); color:var(--white)}
.__vertical-tabs-section .tabs-v > input:checked + label::before {  border: 8px solid transparent;  border-right: 0;  border-left-color: var(--c1);}
.__vertical-tabs-section .tabs-v > input:checked + label::after {  width: 5px;  background-color: var(--c1);}
.__vertical-tabs-section .tabs-v > input:checked + label > img {  filter:brightness(1); /*  hue-rotate(185deg) */}
.__vertical-tabs-section .tabs-v > input:checked + label > p {  color: var(--c1);}
.__vertical-tabs-section .tabs-v > input:checked + label + .tab-content {  display: block;}

.__vertical-tabs-section .tabs-v {  margin-bottom: 10%;}
.__vertical-tabs-section .dn {display: none !important;}

.__vertical-tabs-section .my-btn {position: relative;  display: inline-block;  padding: 15px 25px;  border-style: solid;  border-width: 2px; border-radius: 2px;  box-sizing: border-box;  transition: all 350ms ease-in-out;  font-size: 1em;  line-height: 1;  text-decoration: none;  text-align: center;  color: #151515;  background-color: transparent;  border-color: #151515;}
.__vertical-tabs-section .my-btn:hover {  color: #fff;  background-color: var(--c1);  border-color: var(--c1);}

.__vertical-tabs-section .tabs-v label{border:1px solid #f1f1f1; margin:2px 0;}
.__vertical-tabs-section .tabs-v > input + label::after{width:0!important;}
.__vertical-tabs-section .tabs-v > input:checked + label::before {  border-left-color:var(--blue)!important;}
.tab-content div{width:100%;}

.contact-add{flex-wrap:wrap;}
.contact-add > div{min-width:50%;width:50%;}
.contact-add > div iframe{display:block;}
.newpost {background: red; color: #fff;display: inline-block;padding: 2px 5px;position: absolute;border-radius: 0px 0px 0px 4px;right: 0;top: 0;}
.paging ul li button:disabled {background-color: #bfbfbf;cursor: not-allowed;}
@media only screen and (max-width: 1239px) {
  .__vertical-tabs-section .tabs-v { flex-direction: row;  }
  .__vertical-tabs-section .tabs-v label { display: block;  width: calc(100% / 4);  height: auto;  padding: 15px 0 20px;  text-align: center;  }
  .__vertical-tabs-section .tabs-v label > img { width: 50px;  }
  .__vertical-tabs-section .tabs-v label > p { padding: 15px 10px 0; }
  .__vertical-tabs-section .tabs-v > input + label::before { display: none;  }
  .__vertical-tabs-section .tabs-v > input + label::after {right: auto; left: 50%; top: auto; bottom: 0; transform: translateX(-50%); width: 100%; height: 1px; border: none;  }
  .__vertical-tabs-section .tabs-v > input:checked + label::after { width: 100%; height: 5px; background-color: var(--c1);}
  .__vertical-tabs-section .tabs-v .tab-content { order: 2; position: relative; width: 100%; }
  .__vertical-tabs-section .tabs-v .tab-content > .reverse-tab > .txt-tab {     order: 2;  }
  .__vertical-tabs-section .tabs-v .tab-content > div > div { width: 50%; height: auto;  }
  .__vertical-tabs-section .tabs-v .txt-tab { min-height: 25vh; }
}

@media only screen and (max-width: 959px) {
  .__vertical-tabs-section .tabs-v .tab-content > div > div { width: 100%; padding-right:0px;  }
  .__vertical-tabs-section .tabs-v .tab-content > .reverse-tab > .txt-tab { order: 0;  }
}

@media only screen and (max-width: 767px) {
	.contact-add > div { min-width: 100%; width: 100%;}
	.contact-add > div iframe{height:245px;}
  .__vertical-tabs-section .tabs-v label { width:100%;  padding: 15px 0;  }
  .__vertical-tabs-section .tabs-v label > img { display: none;  }
  .__vertical-tabs-section .tabs-v label > p { padding: 0;  }
  .__vertical-tabs-section .tabs-v [class*="img-tab"] { min-height: 25vh;  }
}

@media only screen and (max-width: 480px) {
  .__vertical-tabs-section .tabs-v label { width: 100%; }
}









/* Importing Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700&display=swap');



/* Section Styling */
.vc-unique-section {
    background: linear-gradient(135deg, #2980b9, #8e44ad, #e67e22);
    background-size: 400% 400%;
    animation: gradientAnimation 10s ease infinite;
    padding: 30px 10px; 
    overflow: hidden;
}

@keyframes gradientAnimation {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

.vc-unique-container {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
}

/* Image Section */
.vc-unique-image {
    flex: 1;
    max-width: 400px;
    margin-right: 20px;
    position: relative;
}

.vc-unique-image img {
    width: 100%;
    border-radius: 20px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
    transform: scale(1);
    transition: transform 0.4s ease, box-shadow 0.4s ease;
}

.vc-unique-image img:hover {
    transform: scale(1.05);
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.3);
}

/* Content Section with Glassmorphism */
.vc-unique-content {
    flex: 1;
    max-width: 600px;
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(10px);
    padding: 20px;
    border-radius: 20px;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
    
    color: #fff;
    z-index: 2;
}

/* Title Section */
.vc-title-container {
    margin-bottom: 30px;
  
}

.vc-unique-content h2 {
    font-size: 3rem;
    font-weight: 500;
    color: #fff;
    margin-bottom: 10px;
    text-shadow: 2px 2

   

    
}








.logo-carousel {
    background-color: #fff;
    padding: 40px 20px;
    text-align: center;
    position: relative;
}

.logo-carousel h2 {
    font-weight:600;
    font-size: 2.5rem;
    color: #333;
    margin-bottom: 30px;
}

.logo-carousel h2::after{
    content: "";
    display: block;
    width: 30%;
    height: 3px;
    background: #0077cc;
    margin: 8px auto 0;
    animation: slideIn 1s forwards;
  }

.carousel-container {
    overflow: hidden;
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
  
}

.carousel-track {
    display: flex;
    transition: transform 0.5s ease-in-out;
    flex-wrap: wrap;
    row-gap: 1rem;
    justify-content: space-evenly;
}

.logo-item {
    width: 110px; /* Set a fixed width */
    height: 110px; /* Set a fixed height */
    padding: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 2px solid #ccc; /* Add a border */
    border-radius: 15px; /* Add border radius for rounded corners */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Add shadow */
    margin: 0 5px; /* Optional: add some margin between items */
    background-color: #f9f9f9; /* Optional: background color for logo items */
    overflow: hidden;
    transition: transform 0.3s ease-in-out; 
}

.logo-item:hover {
    transform: scale(1.3); /* Zoom in slightly on hover */
}


.logo-item img {
    object-fit: contain; /* Maintain aspect ratio of the image */
    width: 100%;
}


/* Responsive styles */
@media (max-width: 1024px) {
    .logo-item {
        width: 100px; /* Adjust width for smaller screens */
        height: 100px; /* Adjust height for smaller screens */
    }
}

@media (max-width: 768px) {
    .logo-item {
        width: 100px; /* Further adjust width */
        height: 100px; /* Further adjust height */
    }
}

@media (max-width: 480px) {
    .logo-item {
        width: 80px; /* Further adjust width */
        height: 80px; /* Further adjust height */
    }
}









/* NOTICE SCROLLING  */
.container {
    display: flex;
    padding: 0px;
    max-width: 1200px;
    margin: 0 auto;
    flex-wrap: nowrap; /* Ensure no wrapping of columns */
}

.left-column, .right-column {
    width: 23%; /* Set each column to occupy 1/4th of the container */
    padding: 5px;
    box-sizing: border-box; /* Ensures padding doesn't increase element width */
}

.left-column {
    background-color: #f8f8f8;
    border-radius: 10px;
    height: 430px;
    overflow-y: auto;
}

.left-column event ::-webkit-scrollbar {
    display: none;
}

.left-column event {
    scrollbar-width: none; /* For Firefox */
}

.main-content {
    width: 50%;
    padding: 15px;
}

/* Headings */
h2 {
    margin-bottom: 15px;
    font-size: 22px;
}

/* Events Section */
.event {
    display: flex;
    margin-bottom: 20px;
    background-color: #ffffff; /* White background for each event */
    padding: 10px;
    border-radius: 8px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

.date {
    background-color: #e6e6e6;
    padding: 10px;
    text-align: center;
    font-size: 16px;
    font-weight: bold;
    margin-right: 15px;
    border-radius: 8px;
}

.event-info h3 {
    font-size: 18px;
    margin-bottom: 5px;
}

.event-info p {
    margin-bottom: 5px;
    font-size: 14px;
}

/* Course Finder */
.course-finder {
    margin-bottom: 30px;
    background-color: #e3f2fd; /* Light blue background for Course Finder */
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

.course-finder select, 
.course-finder input {
    width: 100%;
    padding: 10px;
    margin: 10px 0;
    font-size: 16px;
}

.course-finder button {
    padding: 10px 20px;
    font-size: 16px;
    background-color: #007BFF;
    color: white;
    border: none;
    cursor: pointer;
}

.course-finder a {
    display: inline-block;
    margin-top: 10px;
    color: #007BFF;
}

/* Video Tour */
.video-tour {
    background-color: #f8f8f8; /* Light orange background for Video Tour */
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    width: 100%;
    height: 415px;
}

.video-tour iframe {
    margin-bottom: 15px;
    width: 100%; /* Make the video responsive */
    height: auto; /* Adjust height automatically */
}

/* Right Column (Quick Links & Testimonials) */
.quick-links {
    background-color: #e8f5e9; /* Light green background */
    padding: 20px;
    border-radius: 10px;   
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    margin-left: auto;
    margin-right: auto;
}

.quick-links ul {    
    list-style: none; /* Remove bullet points */
    padding: 0;
    margin: 0;
    max-height: 200px; /* Set max height to make it scrollable */
    overflow-y: auto; /* Scrollable content */
}

.quick-links ul::-webkit-scrollbar {
    display: none;
}

.quick-links ul {
    scrollbar-width: none; /* For Firefox */
}

.quick-links li {
    margin-bottom: 15px; /* Gap between list items */
    padding: 5px;
    color: #000000;
    background-color: #fff; /* White background for list items */
    border: 1px solid #c8e6c9; /* Light green border */
    border-radius: 5px; /* Rounded corners */
    transition: box-shadow 0.3s ease;
}
.quick-links h2{
    font-size: 24px;
    text-align: center;
}

.quick-links a {
    color: #000000;
    text-decoration: none;
}







/* TESTIMONIAL SECTION */




/* Main container */
/* Main container */
.container {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    justify-content: space-between;
}

/* Left & Right Columns */
.right-column {
    flex: 1 1 23%; /* Set columns to 22% for 4 equal columns in 1024px screen */
    box-sizing: border-box;
}

/* Heading Style */
.h2style {
    font-family:Libre Baskerville;
    font-size: 17px; /* Set font size */
    text-align: center; /* Center the text */
    background-color: #02245b; /* Set background color */
    color: #ffffff; /* Set text color for contrast */
    padding: 10px 0; /* Add some padding for better appearance */
    border-radius: 5px; /* Optional: Add rounded corners */
    margin: 0; /* Remove default margin */
}

/* Testimonials (for scrolling list) */
.testimonials {
    position: relative;
    overflow: hidden; /* Hide overflowing content */
    height: 300px; /* Set a fixed height for the container */
    overflow-y: scroll;
     height: 300px;
}

.testimonials ul {
    
    bottom: 0; /* Start from the bottom */
   
    display: flex;
    flex-direction: column; /* Stack items vertically */
}

@keyframes scroll {
    0% {
        transform: translateY(0); /* Start position */
    }
    100% {
        transform: translateY(-100%); /* Scroll to the top */
    }
}

.testimonials ul li {
    margin-bottom: 15px; /* Gap between list items */
    margin-right: 10px;
    padding: 1px;
    color: #000000;
    background-color: #fff; /* White background for list items */
    border: 1px solid #c8e6c9; /* Light green border */
    border-radius: 5px; /* Rounded corners */
    transition: box-shadow 0.3s ease;
}

.testimonials ul li:hover {
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Slight shadow on hover */
}

.testimonials ul li a {
    color: #000000; /* Dark green text color */
    font-size: 16px;
}

.testimonials ul li a:hover {
    text-decoration: underline; /* Underline on hover */
}

/* Hide scrollbar while still allowing scrolling */
.testimonials ul::-webkit-scrollbar {
    display: none;
}

.testimonials ul {
    scrollbar-width: none; /* For Firefox */
}

/* Noticeboard list items */
.noticeboard li {
    list-style-type: none; /* Remove default list style */
    padding-left: 25px; /* Add padding for the GIF */
    /*background-image: url('./assets/Gif/blinking_new.gif');  Path to your GIF */
    background-size: 20px 20px; /* Size of the GIF */
    background-repeat: no-repeat;
    background-position: left center; /* Position the GIF to the left */
}


/* Responsive Design */
@media (max-width: 1024px) {
    /* 4 equal columns in 1024px screen */
    .right-column {
        flex: 1 1 36%; /* Set each column to 22% width for 4 columns */
    }
}

@media (max-width: 768px) {
    /* Full width for smaller screens */
    .right-column {
        flex: 1 1 100%; /* 100% width for all columns */
    }

    /* Adjust testimonials height */
   

    /* Stack items vertically in the list */
    .testimonials ul {
        flex-direction: column;
    }
}

@media (max-width: 480px) {
    /* Heading font size */
    .h2style {
        font-size: 18px; /* Smaller font size for headings */
    }

    /* Testimonials text size */
    .testimonials ul li a {
        font-size: 14px; /* Smaller font size for links */
    }

    /* Adjust list item padding */
    .testimonials ul li {
        padding: 8px; /* Smaller padding for list items */
    }

    /* Make the list occupy full width */
    .noticeboard li {
        padding-left: 10px; /* Less padding for small screens */
    }
}







/* QUICKS LINKS ACTION */

.quick-links-section {
    text-align: center;
    padding: 0px 0px;
    background-color: #ffffff;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
    border-radius: 15px;
    max-width: 1200px;
    margin: 50px auto;
}

.quick-links-title {
    font-size: 2.5rem;
    margin-bottom: 40px;
    color: #0d47a1;
    position: relative;
    display: inline-block;
    padding-bottom: 10px;
}

.quick-links-title::after {
    content: '';
    width: 80px;
    height: 4px;
    background-color: #0d47a1;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0;
}

.quick-links-container {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 25px;
    justify-items: center;
}

.link-item {
    background-color: #ffffff;
    border-radius: 20px;
    padding: 18px 8px;
    width: 190px;
    text-align: center;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.05);
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
}

.link-item::before {
    content: '';
    position: absolute;
    top: 0;
    left: 50%;
    width: 100%;
    height: 100%;
    background-color: rgba(13, 71, 161, 0.1);
    border-radius: 50%;
    transform: scale(0);
    transition: transform 0.5s ease;
}

.link-item:hover::before {
    transform: scale(1.5);
}

.icon-container {
    margin-bottom: 20px;
}

.icon-container img {
    width: 80px;
    height: 80px;
    transition: transform 0.3s ease;
}

.link-item:hover img {
    transform: scale(1.1);
}

.link-item p {
    font-size: 1.1rem;
    color: #000;
    font-weight: 700;
    font-family: sans-serif;
}

.link-item:hover {
    transform: translateY(-10px);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

@media (max-width: 768px) {
    .quick-links-title {
        font-size: 2rem;
    }

    .link-item {
        width: 150px;
    }

    .link-item p {
        font-size: 0.9rem;
    }
    .quick-links-container {
        grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));

    }
}

@media (max-width: 400px) {
    .quick-links-container {
        grid-template-columns: repeat(2, 1fr); /* 2 columns in mobile view */
    }
}

.intro-stats-section {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 40px;
    background-color: #e7eff9;
    gap: 20px;
}

/* Intro Text Styling */
.intro-text {
    flex: 1 1 40%; /* Adjust width */
    padding: 20px;
}

.intro-text h1 {
    font-size: 2.5rem;
    color: #002060;
    margin-bottom: 20px;
    text-align: justify;
}

.intro-text p {
    font-size: 1.1rem;
    line-height: 1.8;
    color: #333;
    margin-bottom: 20px;
    text-align: justify;
}

.read-more {
    text-decoration: none;
    color: white;
    background-color: #02245B;
    padding: 10px 20px;
    border-radius: 5px;
    transition: background-color 0.3s;
}

.read-more:hover {
    background-color: #003e7d;
}

/* Statistics Section Styling */
.stats-section {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    flex: 1 1 50%; /* Adjust width */
    gap: 10px;
}

.stats-box {
    background-color: #fff;
    border: 2px solid #f1f1f1;
    border-radius: 8px;
    text-align: center;
    padding: 20px;
    margin: 5px;
    width: 148px;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s, background-color 0.3s;
}

.stats-box h2 {
    font-size: 1.9rem;
    color: #002060;
    margin-bottom: 10px;
}

.stats-box p {
    font-size: 20px;
    color: #333;
}

.stats-box:hover {
    transform: translateY(-10px);
    background: linear-gradient(135deg, #2980b9, #8e44ad, #e67e22);

}
.stats-box p:hover{
    color:#ffffff;
}
.stats-box h2:hover{
    color:white;
}

/* Responsive View */
@media (max-width: 768px) {
    .intro-stats-section {
        flex-direction: column;
        padding: 0;
    }

    .intro-text, .stats-section {
        flex: 1 1 100%;
    }
    .stats-box {
        margin-left:38px;
        width: 40%;
    }
}

@media (max-width: 480px) {
    .stats-box {
        width: 35%;
    }
}














.desk-section {
    display: flex;
    flex-direction: row; /* Change to row to align items horizontally */
    justify-content: space-between; /* Add space between desk items */
    max-width: 1255px;
    margin: 20px auto; /* Center align the section */
    gap: 20px; /* Add spacing between items */
}

.desk-item {
    display: flex;
    flex-direction: column; /* Keep the content of each item vertical */
    align-items: center; /* Center align the content */
    padding: 20px;
    background: linear-gradient(135deg, #2980b9, #8e44ad, #e67e22);
    animation: gradientAnimation 10s ease infinite;
    border-radius: 10px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    flex: 1; /* Ensure all items are equal width */
    max-width: 400px; /* Optional: Set a max width for each item */
}

.image-container img {
    width: 120px;
    height: 145px;
    border-radius: 10px;
    object-fit: cover;
}

.text-container {
    margin-top: 10px;
    text-align: center; /* Center align the text */
}

.text-container h3 {
    font-size: 20px;
    color: #ffffff;
    margin-bottom: 5px;
}

.text-container p {
    font-size: 16px;
    color: #ffffff;
}

.divider {
    display: none; /* Hide dividers as all items are in a row */
}

@media screen and (max-width: 768px) {
    .desk-section {
        flex-direction: column; /* Stack items vertically on smaller screens */
    }

    .desk-item {
        max-width: 100%; /* Take full width on smaller screens */
    }
}





/* LATEST NEWS START */


.latest-news-container {
    display: flex; /* Arrange items in a row */
    overflow: hidden; /* Hide the scrollbar */
    background-color: #ffffff;
    padding: 10px;
    border-radius: 5px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    gap: 10px;
    animation: scrollLeft 24s linear infinite; /* Continuous scrolling animation */
}

/* Card style */
.latest-news-card {
    flex: 0 0 270px; /* Increased width for each card */
    background-color: #f9f9f9;
    border: 1px solid #ccc;
    border-radius: 5px;
    overflow: hidden;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    position: relative;
    transition: transform 0.3s ease;
    opacity: 0;
    animation: fadeIn 0.6s ease-in-out forwards; /* Fade-in animation */
}

/* Hover effect for scaling */
.latest-news-card:hover {
    transform: scale(1.05);
}

/* Image styling with increased size */
.latest-news-card img {
    width: 100%;
    height: 300px; /* Increased height for uniformity */
    object-fit: cover; /* Ensure the image covers the area */
}

/* Information overlay */
.latest-news-info {
    position: absolute;
    bottom: 0;
    left: 0;
    color: #ffffff;
    background-color: rgba(0, 0, 0, 0.7);
    padding: 10px;
    border-radius: 0 0 5px 5px;
}

/* Fade-in animation keyframes */
@keyframes fadeIn {
    0% { opacity: 0; transform: translateY(20px); }
    100% { opacity: 1; transform: translateY(0); }
}

/* Continuous scrolling animation keyframes */
@keyframes scrollLeft {
    0% { transform: translateX(0); }
    100% { transform: translateX(calc(-270px * 6 - 10px * 6)); } /* Double the width for a smooth scroll */
}







/* Container for the profile cards */
/* Container for the profile cards */
/* Profile Card Section Styles */














/* .multi-slider-section {
    padding: 80px 0;
}

.multi-slider-title {
    margin-bottom: 81px;
}
.multi-slider-title h2 {
    position: relative;
    z-index: 1;
    padding-bottom: 10px;
    color: #333;
}

.multi-slider-title h2:before {
    content: "";
    top: 100%;
    left: 0;
    width: 55px;
    height: 6px;
    background: #ECECEB;
    border-radius: 15px;
}

.multi-slider-title h2:after {
    position: absolute;
    content: "";
    top: 100%;
    left: 0;
    width: 45px;
    height: 6px;
    background: #14ADF3;
    border-radius: 15px;
}

.owl-carousel .owl-item .single-slider-item img {
    max-width: 325px;
    width: 160px;
    border-radius: 50%;
}

.team-meta {
    font-size: 12px;
    color: #b7b7b7;
    margin-top: 20px;
}

.team-meta h3 {
    font-size: 20px;
    margin: 0 0 10px;
}

.multi-slider .owl-nav button {
    display: inline-block;
    width: 50px;
    height: 40px;
    background-color: #f3f3f3 !important;
    margin-left: 10px;
    transition: .3s;
}

.multi-slider .owl-nav button:hover {
    background: #14ADF3 !important;
    color: white !important;
}

.multi-slider .owl-nav {
    position: absolute;
    right: 0;
    top: -46px;
}

.team-desc {
    margin-top: 20px;
    color: #333;
} */





.carousel-row-container {
    display: flex;
    gap: 20px; /* Space between carousels */
    justify-content: center;
    flex-wrap: wrap; /* Allow wrapping on small screens */
    margin: auto;
    max-width: 1200px;
}

.unique-carousel-container {
    width: 100%;
    height: 250px;
    max-width: 350px;
    overflow: hidden;
    position: relative;
}

.unique-carousel-track {
    display: flex;
    transition: transform 0.5s ease-in-out;
}

.unique-carousel-slide {
    min-width: 100%;
    box-sizing: border-box;
}

.unique-carousel-slide img {
    width: 120%;
    height: 250px;
    display: block;
}

.unique-carousel-nav {
    text-align: center;
    margin-top: 10px;
}

.unique-carousel-dot {
    height: 10px;
    width: 10px;
    margin: 0 5px;
    background-color: #ddd;
    border-radius: 50%;
    display: inline-block;
    cursor: pointer;
}

.unique-carousel-dot.active {
    background-color: #333;
}















.carousel {
    position: relative;
    width: 80%;
    max-width: 600px;
    overflow: hidden;
  }

  .carousel-track {
    margin-bottom: 20px;
    margin-top: 20px;
    display: flex;
    transition: transform 0.5s ease;
  }

  .carousel-item {
    min-width: 100%;
    box-sizing: border-box;
    background-size: cover;
    background-position: center;
  }

  .carousel-item img {
    width: 100%;
    display: block;
  }

  .carousel-nav {
    position: absolute;
    top: 50%;
    width: 100%;
    display: flex;
    justify-content: space-between;
    transform: translateY(-50%);
  }

  .carousel-button {
    background-color: rgba(0, 0, 0, 0.5);
    border: none;
    color: #fff;
    font-size: 1.5rem;
    cursor: pointer;
    padding: 0.5rem 1rem;
  }

  .movie-details {
    position: absolute;
    bottom: 20px;
    left: 20px;
    background-color: rgba(0, 0, 0, 0.7);
    padding: 10px;
    width: calc(100% - 40px);
    box-sizing: border-box;
  }

  .movie-title {
    font-size: 1.2rem;
    font-weight: bold;
  }

  .movie-description {
    font-size: 0.9rem;
  }















  
//slider css
.university-carousel-section {
    padding: 50px 10px;
    text-align: center;
    overflow: hidden;
    /* position: relative; */
  }

  .university-carousel-heading {
    text-align: center;
    font-size: 2.5em;
    font-weight:600;
    color: #333;
    margin-bottom: 20px;
    position: relative;
  }

  .university-carousel-heading::after {
    content: "";
    display: block;
    width: 20%;
    height: 3px;
    background: #0077cc;
    margin: 8px auto 0;
    animation: slideIn 1s forwards;
  }

  /* Carousel Wrapper */
  .carousel-wrapper {
    display: flex;
    transition: transform 0.4s ease;
    width: 100%;
    display: none;
  }

  /* College Card */
  .college-card {
    flex: 0 0 32%; /* Show one card at a time */
    margin: 0 10px;
    background-color: white;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    overflow: hidden;
    opacity: 0;
    animation: fadeIn 0.8s ease-out forwards;
  }

  /* Card Image */
  .college-card img {
    width: 100%;
    height: 200px;
    object-fit: cover;
  }

  /* Card Content */
  .college-content {
    padding: 20px;
  }

  .college-title {
    font-size: 1.5em;
    color: #0077cc;
    margin-bottom: 10px;
  }

  .college-description {
    font-size: 1em;
    color: #666;
    line-height: 1.5;
    text-align: justify;
  }


  /* Navigation Buttons */

  .carousel-control-btn{
    max-width: 1200px;
    margin: 0 auto;
  }


  .carousel-btn {
    background-color: #02245B;
    color: white;
    border: none;
    margin:20px;
    padding: 10px;
    cursor: pointer;
    font-size: 1.5em;
    border-radius: 50%;
    opacity: 0.8;
    transition: opacity 0.3s;
    width: 3.5rem;
    height: 3.5rem;
  }

  .carousel-btn:hover {
    opacity: 1;
  }

  /* Animation Keyframes */
  @keyframes fadeIn {
    0% { opacity: 0; transform: translateY(20px); }
    100% { opacity: 1; transform: translateY(0); }
  }

  @keyframes slideIn {
    0% { width: 0; }
    100% { width: 50%; }
  }

  /* Responsive Design */
  @media (max-width: 768px) {
    .college-card {
      flex: 0 0 100%; /* Show one card on smaller screens */
    }

    .university-carousel-heading {
      font-size: 2em;
    }
  }

















  

   /* Achievements Section */
   .achievements-section-container {
    text-align: center;
    padding: 50px 20px;
  }
  .achievements-section {
    max-width: 1200px;
    margin: auto;
    display: grid;
    gap: 20px;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  }

  /* Section Heading */
  .achievements-heading {
    font-weight:600;
    font-size: 2.5rem;
    color: #333;
    margin-bottom: 30px;
  }
  .achievements-heading::after{
    content: "";
    display: block;
    width: 30%;
    height: 3px;
    background: #0077cc;
    margin: 8px auto 0;
    animation: slideIn 1s forwards;
  }
  /* Achievement Card */
  .achievement-card {
    background-color: #fff;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
  }

  /* Hover Effect */
  .achievement-card:hover {
   transform: scale(1.05);
        box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.2);
    
  }
     .card h-100 shadow{
        transform: scale(1.05);
        box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.2);
}

  /* Image */
  .achievement-image {
    width: 100%;
    height: 200px;
    object-fit: cover;
    transition: transform 0.3s ease-in-out;
  }

  /* Hover Effect for Image */
  .achievement-card:hover .achievement-image {
    transform: scale(1.1);
  }

  /* Content */
  .achievement-content {
    padding: 20px;
    text-align: center;
  }
  .achievement-title { font-size: 1.5rem; color: #333; margin-bottom: 10px; }
  .achievement-description { font-size: 1rem; color: #666; }

  /* View More Button */
  .view-more-button {
    display: inline-block;
    margin-top: 30px;
    padding: 10px 20px;
    font-size: 1rem;
    color: #fff;
    background-color: #02245B;
    border-radius: 5px;
    text-decoration: none;
    transition: background-color 0.3s ease-in-out;
  }
  .view-more-button:hover {
    background-color: #0056b3;
  }

  /* Responsive Design */
  @media (max-width: 768px) {
    .achievements-section-container {
      padding: 30px 10px;
    }
    .achievements-heading { font-size: 2rem; }
    .achievement-title { font-size: 1.3rem; }
    .achievement-description { font-size: 0.9rem; }
    .view-more-button { font-size: 0.9rem; padding: 8px 16px; }
  }










/* Style for Accessibility Icon Dropdown */
.accessibility-dropdown-container {
    position: relative;
}

.accessibility-dropdown {
    display: none;
    position: absolute;
    top: 100%;
    right: 0;
    background-color: #f9f9f9;
    min-width: 60px;
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
    z-index: 1;
}

/* Optional styling for the dropdown items */
.accessibility-dropdown a {
    color: black;
    font-weight:600;
    padding: 3px 16px;
    text-decoration: none;
    display: block;
}

.accessibility-dropdown a:hover {
    background-color: #ddd;
}
















/* CONTACT PAGE CSS */


map-container {
    width: 100%;
    max-width: 800px; /* Set a max width for larger screens */
    padding: 10px;
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    
}

.map-container iframe {
    width: 100%;
    height: 450px; /* Adjust the height as needed */
   
}


/* LANGUAGE CHANGE */

.langu{
    margin-left: 7px;
    font-weight: 600;
}
@media (max-width: 480px) {
    .langu{
    display:none;
    }
}






/* ABOUT CSS */
.about-section {
    max-width: 1200px;
    margin: 40px auto;
    padding: 20px;
    text-align: justify;
    line-height: 1.8;
    color: #333;
    background-color: #f9f9f9;
    border-radius: 10px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
    overflow: hidden;
    animation: fadeIn 1.5s ease-in-out;
}

/* Heading Style */
.about-section h2 {
    font-size: 2.5em;
    font-weight: bold;
    margin-bottom: 20px;
    color: #2c3e50;
    text-align: center;
    animation: slideDown 1s ease-in-out;
}

/* Paragraph Styling */
.about-section p {
    font-size: 1.1em;
    margin-bottom: 20px;
    animation: fadeInUp 1s ease-in-out;
line-height: 1.3;
}

/* Classic Style Animation */
@keyframes fadeIn {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes fadeInUp {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes slideDown {
    from { opacity: 0; transform: translateY(-20px); }
    to { opacity: 1; transform: translateY(0); }
}

/* Responsive Design */
@media (max-width: 768px) {
    .about-section {
        padding: 15px;
    }

    .about-section h2 {
        font-size: 2em;
    }

    .about-section p {
        font-size: 1em;
    }
}













.eyes-main-container{
    font-family: Arial, sans-serif;
    background-color: #093070; /* Matches the red background */
    height:70vh;
}


.eyes-container {
    display: flex;
    justify-content: space-between;
   
    padding: 50px;
    color: #ffffff;
    min-height: 100vh;
}

.eyes-text-section {
    flex: 1;
}

.eyes-text-section h1 {
    font-size: 2.5em;
    font-weight: 700;
}
..eyes-text-section p {
    font-size: 2.5em;
    font-weight: 700;
}
.eyes-image-section {
    display: flex;
    gap: 20px;
    margin-top: 0px;
}

.eyes-image {
    width: 300px; /* Adjust the width as needed */
    height: 350px; /* Adjust the height as needed */
    background-size: cover;
    background-position: center;
    border-radius: 8px;
}

/* Replace 'image1.jpg' and 'image2.jpg' with your actual image paths */
.eyes-image1 {
    background-image: url('./images/ug-program3.jpg');
}

.eyes-image2 {
    background-image: url('./images/ug-program2.png');
}


/* Responsive adjustments */
@media (max-width: 1024px) {
    .eyes-container {
        padding: 30px;
    }

    .eyes-text-section h1 {
        font-size: 2em;
    }

    .eyes-image {
        width: 250px;
        height: 300px;
    }
}

@media (max-width: 768px) {
    .eyes-container {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    .eyes-text-section {
        margin-bottom: 20px;
    }

    .eyes-text-section h1 {
        font-size: 1.8em;
    }

    .eyes-image-section {
        flex-direction: column;
        align-items: center;
    }

    .eyes-image {
        width: 80%;
        height: auto;
    }
}

@media (max-width: 480px) {
    .eyes-container {
        padding: 20px;
    }

    .eyes-text-section h1 {
        font-size: 1.5em;
    }

    .eyes-text-section p {
        font-size: 1em;
    }

    .eyes-image {
        width: 90%;
        height: auto;
    }
}











.container1{
    position: relative;
    margin: 0 auto;
    /* top: 50%;
    left: 50%;
    transform: translate(-50%, -50%); */
     width: 1200px; 
    height: 600px;
    background: #f5f5f5;
    box-shadow: 0 30px 50px #dbdbdb;
}

.container1 .slide1 .item{
   
    height: 300px;
    position: absolute;
    top: 50%;
    transform: translate(0, -50%);
    border-radius: 20px;
    
    background-position: 50% 50%;
    background-size: cover;
    display: inline-block;
    transition: 0.5s;
}

.slide1 .item:nth-child(1),
.slide1 .item:nth-child(2){
    top: 0;
    left: 0;
    transform: translate(0, 0);
    border-radius: 0;
    width: 100%;
    height: 100%;
}


.slide1 .item:nth-child(3){
    left: 50%;
}
.slide1 .item:nth-child(4){
    left: calc(50% + 220px);
}
.slide1 .item:nth-child(5){
    left: calc(50% + 440px);
}

/* here n = 0, 1, 2, 3,... */
.slide1 .item:nth-child(n + 6){
    left: calc(50% + 660px);
    opacity: 0;
}



.item .content{
    position: absolute;
    top: 50%;
    left: 100px;
    width: 300px;
    text-align: left;
    color: #eee;
    transform: translate(0, -50%);
    font-family: system-ui;
    display: none;
}


.slide1 .item:nth-child(2) .content{
    display: block;
}


.content .name{
    font-size: 15px;
    text-transform: uppercase;
    font-weight: bold;
    opacity: 0;
    animation: animate 1s ease-in-out 1 forwards;
 backdrop-filter: blur(17px);
    color: white;
    padding: 5px 5px 5px 5px;

}

.content .des{
    margin-top: 10px;
    margin-bottom: 20px;
    opacity: 0;
    animation: animate 1s ease-in-out 0.3s 1 forwards;
}

.content button{
    padding: 10px 20px;
    border: none;
    cursor: pointer;
    opacity: 0;
    animation: animate 1s ease-in-out 0.6s 1 forwards;
}


@keyframes animate {
    from{
        opacity: 0;
        transform: translate(0, 100px);
        filter: blur(33px);
    }

    to{
        opacity: 1;
        transform: translate(0);
        filter: blur(0);
    }
}



.button{
    width: 100%;
    text-align: center;
    position: absolute;
    bottom: 20px;
}

.button button{
    width: 40px;
    height: 35px;
    border-radius: 8px;
    border: none;
    cursor: pointer;
    margin: 0 5px;
    border: 1px solid #000;
    transition: 0.3s;
}

.button button:hover{
    background: #ababab;
    color: #fff;

}

@media only screen and (max-width: 600px) {
    .button{
        text-align: left;
        margin-left: 10px;
    }
    
}









/* UG Section css */
.degree-banner {
    display: flex;
    flex-direction: column; 
    align-items: center;
    justify-content: center;
    position: relative;
    height: 240px; /* Adjust height as needed */
    color: rgb(14, 10, 10);
    text-align: center;
    overflow: hidden; /* To ensure background effect stays contained */
}

.degree-banner::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5); /* Semi-transparent black overlay */
    z-index: -1; /* Ensure the overlay stays behind content */
}

.degree-banner::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url('./images/23-12.jpg') center/cover no-repeat;
    z-index: -2; /* Ensure the image stays behind the overlay */
}

.degree-banner h1 {
    font-size: 2.3em; 
    font-weight: bold;
    color: rgb(255, 255, 255);
    margin: 0;
    z-index: 1; /* Ensure text stays above background */
}

.underline {
    width: 90px; /* Adjust width as needed */
    height: 2px;
    background-color: #d4af37; 
    margin: 10px auto 0;
    z-index: 1; /* Ensure underline stays above background */
}






  .BAmaincontainer{
    font-family: Arial, sans-serif;
    display: flex;
    justify-content: center;
    align-items: center;

    margin: 0;
    background-color: #f5f5f5;
    
  }
  .BAcontainer {
    text-align: center;
    padding: 20px;
    width: 900px;      /* Set a fixed width */
    height: 300px;     /* Set a fixed height */
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
  
  .BAtitle {
    font-weight: bold;
    font-size: 18px;
  }
  
  .BAsubtitle {
    font-size: 16px;
    margin: 10px 0;
  }
  
  .BAlink {
    font-size: 16px;
    color: blue;
    text-decoration: underline;
    cursor: pointer;
  }
  
  .BAnotice {
    font-size: 14px;
    margin-top: 15px;
  }
  
  .BAlink:hover {
    color: darkblue;
  }



  /* ba uske niche ka section */


  .BA-table-container {
    width: 80%;
    max-width: 800px;
    margin: auto;
    text-align: center;
  }

  .BA-table-title {
    font-weight: bold;
    font-size: 22px;
    margin-bottom: 10px;
  }

  .BA-table-subtitle {
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 20px;
  }

  .BA-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 16px;
  }

  .BA-th, .BA-td {
    padding: 12px;
    border: 1px solid #ddd;
    text-align: center;
  }

  .BA-th {
    background-color: #02245b;
    color: #fff;
    font-weight: bold;
  }

  .BA-subject-cell {
    text-align: left;
    padding-left: 20px;
  }

/* UG BA css */
.UG_BA_maincontainer{
    font-family: Arial, sans-serif;
    display: flex;
    justify-content: center;
    align-items: center;
  
    background-color: #fff;
}
.UG_BA_container {
    text-align: center;
    width: 80%;
    max-width: 800px;
  }
  
  .UG_BA_header {
    font-size: 24px;
    margin-bottom: 10px;
    font-weight: bold;
  }
  
  .UG_BA_subheader {
    font-size: 20px;
    margin-bottom: 20px;
  }
  
  .UG_BA_table {
    width: 100%;
    border-collapse: collapse;
    font-size: 16px;
  }
  
  .UG_BA_table-header {
    background-color: #02245B;
    color: #fff;
    padding: 12px;
  }
  
  .UG_BA_table-cell {
    padding: 12px;
    border: 1px solid #333;
  }
  
  .UG_BA_table tbody tr:nth-child(even) {
    background-color: #f9f9f9;
  }


  /* PG section Css */
  
.degree-banner1 {
    display: flex;
    flex-direction: column; 
    align-items: center;
    justify-content: center;
    background: url('./images/importantbg.jpg') center/cover no-repeat;
    height: 250px; /* Adjust height as needed */
    color: rgb(14, 10, 10);
    position: relative;
    text-align: center;
}

.degree-banner1 h1 {
    font-size: 4em; 
    font-weight: bold;
    color: rgb(255, 255, 255);
    margin: 0;
}

.underline1 {
    width: 90px; /* Adjust width as needed */
    height: 2px;
    background-color: #d4af37; 
    margin: 10px auto 0;
}





/* POP-UP SECTION CSS */
/* General Popup Styling */
.popup1 {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: rgba(0, 0, 0, .3);
    display: grid;
    place-content: center;
    opacity: 0;
    pointer-events: none;
    transition: opacity 200ms ease-in-out;
    z-index: 1111;
}

/* Popup content styling */
.popup-content1 {
    width: clamp(280px, 90vw, 700px); /* Adjust width to fit on smaller screens */
    height: 60vh;
    background-color: #fff;
    padding: 0;
    box-shadow: 0 0 .5em rgba(0, 0, 0, .5);
    border-radius: .5em;
    opacity: 0;
    transform: translateY(20%);
    transition: opacity 200ms ease-in-out, transform 200ms ease-in-out;
    position: relative;
    display: flex;
    flex-direction: column;
}

/* Popup header with title and close button */
.popup-header {
    position: sticky;
    top: 0;
    width: 100%;
    background-color: #fff;
    padding: 1rem;
    display: flex;
    justify-content: center;
    align-items: center;
    border-bottom: 1px solid #ddd;
    z-index: 1;
}

.main-title {
    font-weight: 600;
    font-size: clamp(24px, 4vw, 32px); /* Responsive font size */
    margin: 0;
    flex-grow: 1;
    text-align: center;
}

.close-btn {
    position: absolute;
    top: 1rem;
    right: 1rem;
    font-size: 1.5rem;
    cursor: pointer;
    user-select: none;
}

.close-btn:active {
    transform: scale(.9);
}

/* Popup body styling and overflow management */
.popup-body {
    position: relative;
    overflow: hidden; /* Hide overflow to create a clean scrolling effect */
    padding: 1rem clamp(1rem, 5vw, 2rem);
    flex-grow: 1;
}

/* Scroll container and animation */
.scroll-container {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    overflow-y: scroll;
    height: 350px;
}

.scroll-container:hover {
    animation-play-state: paused;
}

@keyframes scrollUp {
    0% {
        transform: translateY(0%);
    }
    100% {
        transform: translateY(-100%);
    }
}

/* Show Popup when the class is added */
.showPopup1 {
    opacity: 1;
    transform: translateY(0);
    pointer-events: all;
}

/* Hide scrollbar for Chrome, Safari */
.popup-body::-webkit-scrollbar {
    display: none;
}

/* Hide scrollbar for Firefox */
.popup-body {
    scrollbar-width: none;
}

/* For Edge and IE */
.popup-body {
    -ms-overflow-style: none;
}

.notice-link {
    display: block;
    color: inherit;
    text-decoration: none;
    padding: 0.5rem 0;
    transition: color 0.2s ease-in-out;
}

.notice-link:hover {
    color: #007bff;
}







h1 {
    color: #2f4f6f;
    font-size: 24px;
    text-align: left;
    margin-bottom: 10px;
}
.table-container {
    overflow-x: auto;
    width: 70%;
    max-width: 1200px;
    margin: 10px auto;
    padding: 10px;
}
table {
    width: 100%;
    border-collapse: collapse;
    background-color: #ffffff;
    margin: 0 auto;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}
th, td {
    padding: 12px;
    text-align: left;
    border-bottom: 1px solid #dddddd;
}
th {
    background-color: #eaf0f5;
    color: #333333;
}
tr:hover {
    background-color: #f5f5f5;
}
.responsive-img {
    max-width: 60px;
    height: auto;
    border-radius: 5px;
}
@media (max-width: 768px) {
    th, td {
        font-size: 14px;
        padding: 10px;
    }
    h1 {
        font-size: 20px;
    }
}















/* Container */
/* Container */
.chancellor-container {
    width: 90%;
    margin: 50px;
    padding: 30px;
    background-color: #fff;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
    border-radius: 10px;
    overflow: hidden;
    text-align: center;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    animation: fadeIn 1s ease;
}

.chancellor-container:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3);
}

/* Title */
.chancellor-title {
    font-size: 32px;
    color: #0056b3;
    margin-bottom: 10px;
    animation: slideInFromLeft 0.8s ease;
    text-align: center; /* Center the title */
    font-family: 'Roboto', sans-serif; /* Change font style */
    font-weight: 700; /* Bold for emphasis */
}

/* Subtitle */
.chancellor-subtitle {
    font-size: 24px;
    font-weight: bold;
    color: #333;
    margin-bottom: 20px;
    animation: slideInFromRight 0.8s ease;
}

/* Image Wrapper */
.chancellor-image-wrapper {
    text-align: center;
    margin-bottom: 20px;
    animation: fadeIn 1s ease;
}

.chancellor-image-wrapper img {
    max-width: 100%;
    height: auto;
    border-radius: 5px;
    transition: transform 0.3s ease;
}

.chancellor-image-wrapper img:hover {
    transform: scale(1.05);
}

/* Description */
.chancellor-description {
    font-size: 18px;
    color: #666;
    line-height: 1.8;
    margin-top: 20px;
    text-align: Center;
    animation: fadeIn 1.2s ease;
}

/* Links */
.chancellor-link {
    display: flex;
    justify-content: center;
    align-items: center;
    color: #0073e6;
    text-decoration: none;
    font-weight: bold;
    transition: color 0.3s ease;
}

.chancellor-link:hover {
    color: #0056b3;
    text-decoration: underline;
}

/* Highlighted Text */
.chancellor-highlighted-text {
    font-weight: bold;
    color: #333;
}

/* Animations */
@keyframes fadeIn {
    0% { opacity: 0; transform: translateY(20px); }
    100% { opacity: 1; transform: translateY(0); }
}

@keyframes slideInFromLeft {
    0% { opacity: 0; transform: translateX(-100px); }
    100% { opacity: 1; transform: translateX(0); }
}

@keyframes slideInFromRight {
    0% { opacity: 0; transform: translateX(100px); }
    100% { opacity: 1; transform: translateX(0); }
}

/* Responsive Design */
@media (max-width: 768px) {
    .chancellor-container {
        padding: 15px;
        margin: 20px 10px;
    }
    .chancellor-title {
        font-size: 26px;
    }
    .chancellor-subtitle {
        font-size: 20px;
    }
    .chancellor-description {
        font-size: 16px;
    }
}

@media (max-width: 480px) {
    .chancellor-title {
        font-size: 22px;
    }
    .chancellor-subtitle {
        font-size: 18px;
    }
    .chancellor-description {
        font-size: 14px;
    }
}























.main-welfare-container{
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0;
}

.welfare-container {
    max-width: 1000px;
    width: 100%;
    background-color: #fff;
    padding: 20px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    border-radius: 8px;
    
}

.welfare-title {
    font-size: 28px;
    color: #0056b3;
    text-align: center;
    margin-bottom: 20px;
}

.welfare-info {
    text-align: center;
    margin-bottom: 20px;
}

.welfare-name {
    font-size: 24px;
    color: #333;
    font-weight: bold;
}

.welfare-email a {
    color: #0056b3;
    text-decoration: none;
}

.welfare-email a:hover {
    text-decoration: underline;
}

.welfare-list-title {
    font-style: italic;
    color: #555;
}

.welfare-table-container {
    overflow-x: auto;
    width: 70%; /* Reduced container width */
    max-width: 1200px; /* Set a max-width for the container */
    margin: 10px auto; /* Center the container and add some margin */
    padding: 10px; /* Added a bit of padding */
}

label {
    display: inline-block;
    margin-bottom: 10px;
}

#entries {
    margin: 0 5px;
    padding: 5px;
    font-size: 14px;
}

.search-input {
display:none;
    float: right;
    padding: 5px;
    font-size: 14px;
    border: 1px solid #ddd;
    border-radius: 4px;
}

.welfare-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 10px;
}

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

.welfare-table th {
    background-color: #e9f5ff;
    color: #333;
}

.pagination {
    margin-top: 10px;
    font-size: 14px;
    color: #555;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.pagination-controls a {
    color: #0073e6;
    text-decoration: none;
    margin-left: 10px;
}

.pagination-controls a:hover {
    text-decoration: underline;
}

/* Responsive Adjustments */
@media (max-width: 600px) {
    .welfare-title {
        font-size: 24px;
    }

    .welfare-name {
        font-size: 20px;
    }

    .search-input {
        width: 100%;
        margin-top: 10px;
    }
}











.deansh2{
text-align:center;
font-weight:500;
}



.deas-table-container {
    width: 90%;
    margin: 20px auto;
    overflow-x: auto;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
    border-radius: 10px;
    background-color: #fff;
    padding: 20px;
}

table {
    width: 100%;
    border-collapse: collapse;
    font-size: 16px;
}

.deas-th, .deas-td {
    padding: 12px 15px;
    text-align: left;
    border-bottom: 1px solid #ddd;
}

.deas-th {
    background-color: #2c3e50;
    color: white;
}

.deas-tr:nth-child(even) {
    background-color: #f9f9f9;
}

.deas-tr:hover {
    background-color: #f1f1f1;
}

.deas-photo img {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    object-fit: cover;
}

.deas-responsive-search {
    text-align: right;
    margin-bottom: 10px;
}

.deas-responsive-search input {
    padding: 8px;
    width: 200px;
    border: 1px solid #ddd;
    border-radius: 4px;
}

.deas-entries-info {
    font-size: 14px;
    margin-bottom: 15px;
}

















.admission-title {
    text-align: center;
    color: #2c3e50;
    margin-top: 20px;
    font-size: 2em;
    font-weight: bold;
}

/* Container for the table */
.admission-table-container {
    width: 90%;
    margin: 20px auto;
    overflow-x: auto;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
    border-radius: 10px;
    background-color: #fff;
    padding: 20px;
}

/* Table styling */
.admission-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 16px;
}

.admission-table th, .admission-table td {
    padding: 12px 15px;
    text-align: left;
    border-bottom: 1px solid #ddd;
}

.admission-table th {
    background-color: #2c3e50;
    color: white;
    position: sticky;
    top: 0;
    z-index: 1;
}

.admission-table tr:nth-child(even) {
    background-color: #f9f9f9;
}

.admission-table tr:hover {
    background-color: #f1f1f1;
    transition: background-color 0.3s ease;
}

/* Responsive search bar */
.admission-search-container {
    text-align: right;
    margin-bottom: 10px;
}

.admission-search-container input {
    padding: 8px;
    width: 200px;
    border: 1px solid #ddd;
    border-radius: 4px;
    transition: width 0.4s ease;
}

.admission-search-container input:focus {
    width: 250px;
    outline: none;
    border-color: #2c3e50;
}

/* Image styling */
.admission-photo img {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    object-fit: cover;
    box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.2);
    transition: transform 0.3s ease;
}

.admission-photo img:hover {
    transform: scale(1.1);
}

/* Pagination and entries information */
.admission-entries-info, .admission-pagination {
    font-size: 14px;
    margin-top: 10px;
}

.admission-pagination {
    text-align: right;
}

/* Animation for table rows */
.admission-table tr {
    animation: admission-fadeIn 0.5s ease-in;
}

@keyframes admission-fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .admission-title {
        font-size: 1.5em;
    }

    .admission-table-container {
        width: 95%;
        padding: 15px;
    }

    .admission-table th, .admission-table td {
        font-size: 14px;
        padding: 10px 12px;
    }

    .admission-search-container input {
        width: 150px;
    }

    .admission-search-container input:focus {
        width: 200px;
    }

    .admission-entries-info, .admission-pagination {
        font-size: 12px;
    }
}

@media (max-width: 480px) {
    .admission-title {
        font-size: 1.2em;
    }

    .admission-search-container {
        text-align: center;
        margin-bottom: 15px;
    }

    .admission-search-container input {
        width: 100%;
        max-width: 300px;
    }

    .admission-table th, .admission-table td {
        font-size: 12px;
        padding: 8px 10px;
    }



    .admission-pagination {
        text-align: center;
    }
}
.admission-entries-info, .admission-pagination {
    cursor:pointer;
    font-size: 14px;
    margin-top: 10px;
}






.enhanced-gallery {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 15px;
    width: 90%;
    max-width: 1200px;
    padding: 20px;
}

.gallery-item {
    position: relative;
    overflow: hidden;
    border-radius: 12px;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    animation: fadeIn 0.6s ease forwards;
    opacity: 0;
}

.gallery-item:nth-child(odd) {
    animation-delay: 0.2s;
}

.gallery-item:nth-child(even) {
    animation-delay: 0.4s;
}

.gallery-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}

/* Fade-in Animation */
@keyframes fadeIn {
    from {
        transform: scale(0.8);
        opacity: 0;
    }
    to {
        transform: scale(1);
        opacity: 1;
    }
}

/* Hover Effects */
.gallery-item:hover {
    transform: scale(1.05);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
}

.gallery-item:hover img {
    transform: scale(1.1);
}

/* Overlay with Unique Styles */
.gallery-item::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.3);
    opacity: 0;
    transition: opacity 0.3s ease;
    border-radius: 12px;
}

.gallery-item:hover::before {
    opacity: 1;
}

/* Unique Class Sizes for Staggered Layout */
.image-one { grid-column: span 2; }
.image-two { grid-row: span 2; }
.image-three { grid-row;}






/* Initially hide the logosize */
.logosize {
    display: none;
}

/* Show logosize only for screens with width 480px or smaller */
@media (max-width: 480px) {
    .logosize {
        display: block;
        font-size: 9px; /* Adjust font size as needed */
        font-weight:500;
    }

    
}







/* General styling */
/* Section Styling */
.college-section {
    padding: 40px 20px;
    background-color: #f5f7fa;
    text-align: center;
}

.college-section h2 {
    font-size: 2.5em;
    color: #003366;
    margin-bottom: 30px;
}

/* Container and Card Styling */
.college-container {
    display: flex;
    flex-direction: column;
    gap: 20px;
    align-items: center;
}

.college12-card {
    display: flex;
    flex-direction: row; /* Align image and details side by side */
    background-color: #ffffff;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    border-radius: 12px;
    overflow: hidden;
    width: 90%;
    max-width: 990px;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.college12-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 6px 15px rgba(0, 0, 0, 0.2);
}

/* Image Section */
.college-image {
    flex: 1;
    max-width: 300px;
}

.college-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-right: 2px solid #e6e6e6; /* Optional: Adds a divider between image and text */
}

/* Details Section */
.college-details {
    flex: 2;
    padding: 20px;
    text-align: left;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.college-details h3 {
    font-size: 1.8em;
    color: #004080;
    margin-bottom: 10px;
}

.college-details h4 {
    font-size: 1.2em;
    color: #555;
    margin-bottom: 8px;
}

.college-details p {
    font-size: 1em;
    color: #333;
    margin: 5px 0;
}

.view-map-btn {
    display: inline-block;
    margin-top: 10px;
    padding: 10px 20px;
    font-size: 1em;
    color: #004080;
    border: 2px solid #004080;
    border-radius: 6px;
    text-decoration: none;
    text-align: center;
    transition: all 0.3s ease;
}

.view-map-btn:hover {
    background-color: #004080;
    color: #ffffff;
}

/* Responsive Design */
@media (max-width: 768px) {
    .college12-card {
        flex-direction: column; /* Stack image and details */
    }

    .college-image {
        max-width: 100%; /* Full-width image */
        border-right: none; /* Remove divider */
    }

    .college-details {
        text-align: center; /* Center-align text */
    }
}














  .coming-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    height: 100vh;
    padding: 20px;
    background:#ffffff /* linear-gradient(to bottom, #ffffff, #ffffff)*/;
    color: black;
  }
  
  /* Logo styling */
  .coming-logo img {
    width: 100px;
    height: 100px; /* Adjust as needed */
    margin-bottom: 20px;
    background-image: url('./assets/logo2.jpg'); /* Replace with your logo URL */
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
  }
  
  /* Heading styling */
  .coming-heading {
    color:blue;
    font-size: 5rem;
    margin-bottom: 10px;
  }
  
  /* Text styling */
  .coming-text {
    font-size: 3rem;
    margin-bottom: 30px;
  }

















  .content-section {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    max-width: 1200px;
    margin: 20px auto;
}

.text-column {
    flex: 1;
    padding: 20px;
    max-width: 50%;
    text-align: justify;
}

.text-column p {
    font-size: 20px;
    line-height: 1.6;
    color: #333;
}

.image-column {
    flex: 1;
    padding: 20px;
    text-align: center;
}

.image-column img {
    width: 100%;
    max-width: 554px;
    height: auto;
    border-radius: 12px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

/* Features Section */
.features-section {
    padding: 60px 20px;
    text-align: center;
    background-color: #f9f9f9;
}

.section-title {
    font-size: 2.5rem;
    margin-bottom: 40px;
}

.feature-cards {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    justify-content: center;
}

.feature-card {
    background: linear-gradient(135deg, #ffffff, #f8f8ff);
    color: #333;
    padding: 30px;
    border-radius: 15px;
    width: 280px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
    text-align: center;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.feature-card:hover {
    transform: scale(1.1);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3);
    background: linear-gradient(135deg, #0076ff, #00d4ff);
    color: white;
}

.feature-card i {
    font-size: 2.5rem;
    margin-bottom: 15px;
    color: #0076ff;
    transition: color 0.3s ease;
}

.feature-card:hover i {
    color: white;
}

/* Responsive Design */
@media (max-width: 1024px) {
    .text-column, .image-column {
        max-width: 100%;
        padding: 10px;
        text-align: center;
    }

    .text-column p {
        font-size: 18px;
    }

    .image-column img {
        max-width: 100%;
        height: auto;
    }
}

@media (max-width: 768px) {
    .section-title {
        font-size: 2rem;
    }

    .feature-card {
        width: 100%;
        max-width: 400px;
    }

    .text-column p {
        font-size: 16px;
    }
}

@media (max-width: 480px) {
    .section-title {
        font-size: 1.8rem;
    }

    .feature-card {
        padding: 20px;
        width: 100%;
        font-size: 14px;
    }

    .feature-card i {
        font-size: 2rem;
    }
}
/* Responsive Design */
@media (max-width: 768px) {
    .content-section {
        flex-direction: column; /* Stack columns vertically */
    }

    .text-column, .image-column {
        max-width: 100%;
        padding: 10px;
        text-align: center;
    }

    .text-column p {
        font-size: 16px;
        TEXT-ALIGN: justify;
    }

    .image-column img {
        max-width: 100%;
        height: auto;
    }
}

@media (max-width: 480px) {
    .section-title {
        font-size: 1.8rem;
    }

    .feature-card {
        padding: 20px;
        width: 100%;
        font-size: 14px;
    }

    .feature-card i {
        font-size: 2rem;
    }
}




















/* General Chatbot Styles */
.chatbot {
    position: fixed;
    bottom: 20px;
    right: 20px;
    width: 300px;
    font-family: Arial, sans-serif;
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.3);
    border-radius: 10px;
    z-index: 1111;
    overflow: hidden;
}

/* Chat Icon */
.chat-icon {
    position: fixed;
    bottom: 20px;
    right: 20px;
    width: 60px;
    height: 60px;
    background-color: #007bff;
    color: white;
    font-size: 30px;
    border-radius: 50%;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
    justify-content: center;
    align-items: center;
    text-align: center;
    cursor: pointer;
    z-index: 1112;
}

/* Chat Header */
.chat-header {
    background: linear-gradient(45deg, #007bff, #0056b3);
    color: #fff;
    padding: 10px;
    font-weight: bold;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    transition: background 0.3s;
}

.chat-header:hover {
    background: linear-gradient(45deg, #0056b3, #003f7f);
}

/* Body */
.chat-body {
    background-color: #f7f7f7;
    max-height: 400px;
    overflow-y: auto;
    border: 1px solid #ddd;
    border-top: none;
    transition: max-height 0.3s ease;
}

/* Chat Messages */
.chat-messages {
    padding: 10px;
    max-height: 350px;
    overflow-y: auto;
}

/* User and Bot Message Bubbles */
.user-message, .bot-message {
    padding: 10px;
    border-radius: 10px;
    margin: 5px 0;
    max-width: 80%;
    word-wrap: break-word;
    animation: fadeInUp 0.3s ease;
}

.user-message {
    background-color: #007bff;
    color: #fff;
    margin-left: auto;
    text-align: right;
}

.bot-message {
    background-color: #e0e0e0;
    color: #000;
    margin-right: auto;
    text-align: left;
}

/* Chat Input and Send Button */
.chat-input {
    display: flex;
    border-top: 1px solid #ddd;
    padding: 10px;
    background-color: #f7f7f7;
}

.chat-input input[type="text"] {
    flex: 1;
    padding: 10px;
    border: 1px solid #ddd;
    border-radius: 20px;
    font-size: 14px;
    outline: none;
    transition: border-color 0.3s ease;
}

.chat-input input[type="text"]:focus {
    border-color: #007bff;
}

.chat-input button {
    background-color: #007bff;
    color: #fff;
    border: none;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    margin-left: 10px;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

.chat-input button:hover {
    background-color: #0056b3;
}

.chat-input button:active {
    background-color: #003f7f;
}

/* Responsive Design */
@media (max-width: 768px) {
    .chatbot {
        display: none; /* Hide chatbot */
    }
    
    .chat-icon {
        display: flex; /* Show the chat icon on mobile */
    }
}

@media (max-width: 480px) {
    .chat-icon {
        width: 50px;
        height: 50px;
        font-size: 24px;
    }
}

/* Animation for message bubbles */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}



        /* Base styles remain unchanged */







        .main-form-container4 {
            display: flex;
            justify-content: center;
            align-items: center;
            
            background-color: #f0f4f8;
          }
          
          .form-container4 {
            background: #ffffff;
            padding: 40px 50px;
            border-radius: 25px;
            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
            width: 100%;
            max-width: 800px;
            animation: bounceIn4 1.5s ease-out;
          }
          
          .form-container4 h2 {
            text-align: center;
            font-size: 30px;
            color: #0077b6;
            margin-bottom: 20px;
          }
          
          .form-container4 h2::after {
            content: "";
            display: block;
            width: 70px;
            height: 4px;
            background: #00b4d8;
            margin: 8px auto;
            border-radius: 10px;
          }
          
          .form-group4 {
            margin-bottom: 20px;
          }
          
          .form-group4 label {
            display: block;
            margin-bottom: 5px;
            color: #333333;
            font-weight: 600;
            font-size: 14px;
          }
          
          .form-group4 input,
          .form-group4 select,
          .form-group4 textarea {
            width: 100%;
            padding: 12px 15px;
            border: 2px solid #e0f4fc;
            border-radius: 10px;
            background-color: #f5faff;
            font-size: 16px;
            transition: all 0.3s ease;
          }
          
          .form-group4 input:focus,
          .form-group4 select:focus,
          .form-group4 textarea:focus {
            border-color: #00b4d8;
            background-color: #ffffff;
            box-shadow: 0 4px 10px rgba(0, 119, 182, 0.2);
            outline: none;
          }
          
          .form-group4 textarea {
            resize: none;
            height: 100px;
          }
          
          .btn-submit4 {
            display: block;
            width: 100%;
            background: linear-gradient(135deg, #0077b6, #00b4d8);
            color: #ffffff;
            font-size: 18px;
            font-weight: bold;
            padding: 15px;
            border: none;
            border-radius: 50px;
            cursor: pointer;
            transition: transform 0.3s ease, box-shadow 0.3s ease;
            position: relative;
            overflow: hidden;
          }
          
          .btn-submit4::before {
            content: "";
            position: absolute;
            top: 0;
            left: -100%;
            width: 100%;
            height: 100%;
            background: rgba(255, 255, 255, 0.2);
            transform: skewX(-30deg);
            transition: all 0.4s ease;
          }
          
          .btn-submit4:hover {
            transform: translateY(-3px);
            box-shadow: 0 8px 20px rgba(0, 119, 182, 0.4);
          }
          
          .btn-submit4:hover::before {
            left: 100%;
          }
          
          /* Animations */
          @keyframes fadeIn4 {
            from {
              opacity: 0;
            }
            to {
              opacity: 1;
            }
          }
          
          @keyframes bounceIn4 {
            0% {
              opacity: 0;
              transform: translateY(20px);
            }
            50% {
              opacity: 0.6;
              transform: translateY(-10px);
            }
            100% {
              opacity: 1;
              transform: translateY(0);
            }
          }
          
          /* Responsive Design */
          @media (max-width: 768px) {
            .form-container4 {
              padding: 30px;
            }
            .form-container4 h2 {
              font-size: 24px;
            }
          }
          
          @media (max-width: 480px) {
            .form-container4 {
              padding: 20px;
            }
            .form-container4 h2 {
              font-size: 20px;
            }
          }
          











          .enhanced-tab-row {
            display: flex;
            justify-content: space-between;
            align-items: center;
            background: linear-gradient(90deg, #001f3f, #003366);
            padding: 15px 20px;
            border-radius: 10px;
            box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3);
            flex-wrap: wrap;
            gap: 10px;
        }
        
        .enhanced-tab {
            padding: 10px 20px;
            background-color: #004080;
            border: 2px solid #0066cc;
            border-radius: 50px;
            text-align: center;
            text-decoration: none;
            color: #ffffff;
            font-weight: bold;
            font-family: 'Arial', sans-serif;
            font-size: 16px;
            transition: transform 0.3s ease, background-color 0.3s ease, color 0.3s ease;
            cursor: pointer;
        }
        
        .enhanced-tab:hover {
            background-color: #0066cc;
            transform: translateY(-5px) scale(1.05);
        }
        
        
        .enhanced-image-container {
            margin-top: 20px;
            display: flex;
            justify-content: center;
            flex-wrap: wrap;
            gap: 15px; 
        }
        
        .enhanced-image-group {
            display: none;
            gap: 15px;
            flex-wrap: wrap; 
        }
        
        .enhanced-image-group img {
            width: 397px; 
            height: 397px; 
            margin: 10px;
            border-radius: 10px;
            box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
            transition: transform 0.3s ease, box-shadow 0.3s ease;
        }
        
        .enhanced-image-group img:hover {
            transform: scale(1.1);
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
        }
        
        
        .enhanced-image-group.active {
            display: flex;
            flex-direction: row; 
            justify-content: center;
        }
        
        
        @media (max-width: 768px) {
            .enhanced-tab-row {
                justify-content: center; 
                gap: 10px;
            }
        
            .enhanced-tab {
                padding: 8px 15px; 
                font-size: 14px; 
            }
        
            .enhanced-image-group img {
                    width: 500px;
                height: 360px;
            }
        }
        
        @media (max-width: 480px) {
            .enhanced-tab-row {
                flex-direction: column; 
                align-items: center; 
            }
        
            .enhanced-tab {
                margin-bottom: 10px; 
            }
        
            .enhanced-image-group {
                flex-direction: column; 
            }
        
        
           
        
            .enhanced-image-container {
                margin-top: 10px;
                padding: 0 10px; 
            }
        } 


        @media (min-width: 480px) and (max-width: 575px) {
            .logo{
                display: none;
            }
        }























/* VISITOR COUTER SETION CSS */
.counter-container {
    text-align: center;
    padding: 20px;
    background-color: #ffffff;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
    border-radius: 10px;
  }
  
  #visitorCount {
    font-size: 2em;
    color: #333333;
  }



  .vision-mission-section {
    display: flex;
    gap: 40px;
    padding: 40px;
    justify-content: center;
    flex-wrap: wrap;
}

/* Card Styles */
.vision-mission-card {
    position: relative;
    width: 450px;
    height: 500px;
    border-radius: 15px;
    overflow: hidden;
    box-shadow: 0 6px 15px rgba(0, 0, 0, 0.3);
    transition: transform 0.3s ease;
}

.vision-mission-card:hover {
    transform: scale(1.05);
}

/* Image */
.vision-mission-card img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Overlay */
.overlay {
    position: absolute;
    bottom: 0;
    width: 100%;
    padding: 30px;
    color: #fff;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.85), transparent);
    transform: translateY(100%);
    transition: transform 0.5s ease;
}

/* Hover Effect */
.vision-mission-card:hover .overlay {
    transform: translateY(0);
}

/* Overlay Text */
.overlay h3 {
    font-size: 2em;
    font-weight: bold;
    margin-bottom: 15px;
}

.overlay p {
    font-size: 1.1em;
    line-height: 1.6em;
}

/* Animation */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(100%);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Responsive Styles */
@media (max-width: 768px) {
    .vision-mission-section {
        flex-direction: column;
        align-items: center;
    }

    .vision-mission-card {
        width: 90%;
        height: 400px;
    }

    .overlay h3 {
        font-size: 1.5em;
    }

    .overlay p {
        font-size: 1em;
    }
}

.item .content button{
    border-radius: 5px;
    background-color: #02245B;
    color: #fff;
    padding: 10px 20px;
}


/* Event section responsive */

@media only screen and (max-width: 600px){
    .container1{
        width: 100%;
        height: 500px;
        overflow: hidden;
    }
    .slide1 .item:nth-child(3){
        left: 100%;
    }
    .item .content{
        left: 16px;
        transform: none;
    }
    .content .des{
        margin-top: 0;
        margin-bottom: 15px;
    }
    .item .content button{
        padding: 8px 16px;
        font-size: 0.9em;
    }
}

/* Initially hide the logosize */
.logosize {
    display: none;
}
.nav-bbmku{
    display: none;
}

/* Show logosize only for screens with width 480px or smaller */
@media (max-width: 568px) {
    .logosize {
        display: block;
        font-size: 9px; /* Adjust font size as needed */
        font-weight:500;
    }
}

@media only screen and (max-width: 400px){
    .logosize{
      
    }
    .nav-bbmku{
        display: block;
        font-size: 12px;
        font-weight: 600;
    }
}


@media only screen and (max-width: 400px) {
    .topper-left-section a{
        font-size: 12px;
    }
}


@media only screen and (max-width: 400px) {
    .admission-enquiry{
        font-size: 16px;
        width: 157px;
        padding: 4px;
    }
}

/* @media only screen and (max-width: 800px) {
    .admission-enquiry{
        font-size: 16px;
        width: 157px;
        padding: 4px;
    }
} */

@media only screen and  (min-width: 574px) and (max-width: 990px)
{
    .admission-enquiry{
        font-size: 16px;
        width: 157px;
        padding: 4px;
        margin-top: 100px;
    }
}

.container-college {
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px;
  }
  
  #college-section {
    background-color: #f9f9f9;
    padding: 40px 20px;
    text-align: center;
  }
  #college-section h2::after{
    content: "";
    display: block;
    width: 30%;
    height: 3px;
    background: #0077cc;
    margin: 8px auto 0;
    animation: slideIn 1s forwards;
  }
  #college-section h2 {
    font-weight:600;
    font-size: 2.5rem;
    margin-bottom: 10px;
  }
  
  #college-section p {
    font-size: 1rem;
    margin-bottom: 30px;
  }
  
 .college-grid {
    display: flex;  /* Use flexbox for a horizontal layout */
    gap: 20px; /* Space between grid items */
    overflow-x: auto; /* Enables horizontal scrolling */
    white-space: nowrap; /* Prevents wrapping of grid items */
    padding-bottom: 10px; /* Optional: Adds space below for better scrolling visibility */
}

.college-card {
    flex-shrink: 0; /* Prevents items from shrinking */
    width: 200px; /* Set a fixed width for each item */
}


  
  .college-card {
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 8px;
    width: 300px;
    padding: 20px;
    text-align: center;
    transition: transform 0.3s ease, box-shadow 0.3s ease, background-color 0.3s ease;
    animation: fadeIn 0.5s ease forwards;
    opacity: 0; /* Start with invisible state for animation */
  }
  
  .college-card:nth-child(1) {
    animation-delay: 0.2s;
  }
  
  .college-card:nth-child(2) {
    animation-delay: 0.4s;
  }
  
  .college-card:nth-child(3) {
    animation-delay: 0.6s;
  }
  
  .college-card:hover {
    transform: translateY(-10px) scale(1.05);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
    background-color: #f0f8ff;
  }
  
  .college-card img {
    width: 100%;
    border-radius: 5px;
    margin-bottom: 15px;
    transition: transform 0.3s ease;
  }
  
  .college-card:hover img {
    transform: scale(1.1);
  }
  
  .college-card h3 {
    font-size: 1.5rem;
    margin-bottom: 10px;
  }
  
  .college-card p {
    font-size: 0.9rem;
    margin-bottom: 15px;
    color: #555;
  }
  
  .college-card a {
    display: inline-block;
    padding: 10px 20px;
    background-color: rgb(2, 36, 91);
    color: #fff;
    text-decoration: none;
    border-radius: 5px;
    transition: background-color 0.3s ease;
  }
  

  
  /* Keyframe Animation */
  @keyframes fadeIn {
    0% {
      transform: translateY(20px);
      opacity: 0;
    }
    100% {
      transform: translateY(0);
      opacity: 1;
    }
  }
  
 /* Mobile Responsiveness */
@media (max-width: 768px) {
    .college-grid {
        flex-direction: column; /* Stack cards vertically */
        align-items: center; /* Center the cards horizontally */
        overflow-x: hidden; /* Hide any horizontal overflow */
        padding: 10px; /* Add some padding to prevent cards from touching edges */
    }

    .college-card {
        width: 100%; /* Full width */
        max-width: 400px; /* Card width max at 400px */
        margin-bottom: 20px; /* Add space between cards */
        box-sizing: border-box; /* Ensures padding and margin are included in the width */
    }
}

  




















  @media only screen and (min-width: 481px) and (max-width: 968px) {
    .container1 .slide1 .item {
        overflow: hidden;
    }
    
}
@media only screen and (max-width: 480px) {
    .container1 .slide1 .item {
        overflow: hidden;
    }
}
@media only screen and (min-width: 968px) {
    .container1 .slide1 .item {
        overflow: hidden;
    }
}

  

 
@media only screen and (min-width:991) and (max-width:1184)
{
    .navbar-light .navbar-nav .nav-link {
        font-size: 0.60em;
        padding-left:8px;
        padding-top: 10px;
        padding-bottom: 10px;
        border-bottom:   1px solid #8e98a3;
 }
 
 
 
}










/* Reset Styles */
.main-kelgeet {
    margin: 0;
    padding: 0;
    height: 100%;
    font-family: Arial, sans-serif;
    background-color: #f8f8f8;
  }
  
  /* Centered container with adjusted height and width */
  .kelgeet-center-section {
    display: flex;
    flex-direction: column;
    justify-content: center; /* Vertical centering */
    align-items: center; /* Horizontal centering */
    text-align: center; /* Align text to center */
    padding: 30px;
    box-sizing: border-box;
    background: #ffffff;
    border-radius: 15px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2); /* Subtle shadow */
    max-width: 1200px; /* Increased width */
    min-height: 60vh; /* Reduced height */
    margin: 5% auto; /* Centered horizontally with space from top */
    animation: fadeInUp 1.2s ease-out;
  }
  
  /* Heading styles with animation */
  .kelgeet-heading {
    font-size: 3.9rem;
    font-weight: bold;
    margin-bottom: 20px;
    color: #333;
    position: relative;
    animation: slideInFromLeft 1s ease-in-out;
  }
  
  /* Add a decorative underline below heading */
  .kelgeet-heading::after {
    content: '';
    display: block;
    width: 100px;
    height: 4px;
    background-color: #ff9800; /* Orange underline */
    margin: 10px auto 0;
    border-radius: 2px;
  }
  
  /* Poem paragraph styles with fade-in animation */
  .kelgeet-poem {
    font-size: 1.5em;
    line-height: 0.8;
    white-space: pre-line; /* Preserve line breaks */
    color: #000;
    max-width: 900px;
    margin: 0 auto;
    animation: fadeIn 1.5s ease-out;
  }
  
  /* Add hover effect to the container */
  .kelgeet-center-section:hover {
    transform: translateY(-5px);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    box-shadow: 0 8px 15px rgba(0, 0, 0, 0.3);
  }
  
  /* Responsive Design */
  @media (max-width: 1024px) {
    .kelgeet-center-section {
      max-width: 90%; /* Adjust width */
      min-height: 50vh; /* Adjust height */
    }
    .kelgeet-heading {
      font-size: 2rem;
    }
  
    .kelgeet-poem {
      font-size: 1.1rem;
      line-height: 1.6;
    }
  }
  
  @media (max-width: 768px) {
    .kelgeet-center-section {
      max-width: 95%; /* Adjust width for small devices */
      min-height: auto; /* Allow container to shrink */
    }
    .kelgeet-heading {
      font-size: 1.8rem;
    }
  
    .kelgeet-poem {
      font-size: 1rem;
      line-height: 1.5;
    }
  }
  
  @media (max-width: 480px) {
    .kelgeet-heading {
      font-size: 1.5rem;
      margin-bottom: 10px;
    }
  
    .kelgeet-poem {
      font-size: 0.9rem;
      line-height: 1.4;
    }
  
    .kelgeet-center-section {
      padding: 15px;
      max-width: 100%; /* Full width for very small screens */
      min-height: auto; /* Reduce height */
    }
  }
  
  /* Keyframe Animations */
  
  /* Fade In Animation */
  @keyframes fadeIn {
    from {
      opacity: 0;
    }
    to {
      opacity: 1;
    }
  }
  
  /* Fade In Up Animation */
  @keyframes fadeInUp {
    from {
      transform: translateY(30px);
      opacity: 0;
    }
    to {
      transform: translateY(0);
      opacity: 1;
    }
  }
  
  /* Slide In From Left */
  @keyframes slideInFromLeft {
    from {
      transform: translateX(-50px);
      opacity: 0;
    }
    to {
      transform: translateX(0);
      opacity: 1;
    }
  }
  







  .subject-main-container {
    width: 80%;
    margin: 30px auto;
    padding: 20px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.5);
    background-color: #fff;
    border-radius: 8px;
}

.subject-tabs {
    display: flex;
    border-bottom: 2px solid #ccc;
}
.subject-tab {
    flex: 1;
    padding: 10px;
    text-align: center;
    cursor: pointer;
    background: #f8f8f8;
    transition: background 0.3s, color 0.3s;
}
.subject-tab.active {
    border-bottom: 2px solid #007bff;
    font-weight: bold;
    color: #007bff;
    background: white;
}
.subject-tab:hover {
    background: #02245b;
    color: white;
}
.subject_h2{
    
text-align: center;
color: #2c3e50;
margin-top: 20px;
font-size: 2em;
font-weight: bold;
}

.subject-content {
    padding: 15px;
}
.subject-content-section {
    display: none;
}
.subject-content-section.active {
    display: block;
}

@media (max-width: 720px), (max-width: 480px) {
    .subject-tabs {
        flex-direction: column;
    }
    .subject-tab {
        padding: 12px;
        border-bottom: 1px solid #ccc;
    }
    .subject-tab.active {
        border-right: 2px solid #007bff;
        border-bottom: none;
    }
    .subject-content {
        font-size: 14px;
        padding: 10px;
    }
}




.vc_h1{
    text-align:center;
    font-weight:600;
    font-size: 2.5rem;
    color: #333;
    margin-bottom: 30px;
}

.vc_h1::after{
    content: "";
    display: block;
    width: 30%;
    height: 3px;
    background: #0077cc;
    margin: 8px auto 0;
    animation: slideIn 1s forwards;
  }




























.designvc-container {
  
            padding: 20px;
            text-align: center;
            max-width: 900px;
            margin: 20px auto;
            background: #fff;
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.8);
            border-radius: 8px;
        }

        .designvc-logo {
            display: block;
            margin: 0 auto;
            width: 120px;
            height: auto;
        }

        .designvc-title {
            color: #003366;
            font-weight: bold;
            margin: 10px 0;
            font-size: 1.8rem;
        }
        .designvc-title::after{
            content: "";
            display: block;
            width: 30%;
            height: 3px;
            background: #0077cc;
            margin: 8px auto 0;
            animation: slideIn 1s forwards;
          }

        .designvc-subtitle {
            color: #003366;
            font-size: 1.5rem;
            margin-bottom: 20px;
        }

        .designvc-content {
            text-align: justify;
            max-width: 800px;
            margin: 0 auto;
            line-height: 1.6;
            font-size: 1rem;
        }

        .designvc-list {
            margin-top: 20px;
            text-align: left;
            max-width: 800px;
            margin: 20px auto;
            padding: 0;
            list-style-type: disc;
            padding-left: 20px;
        }

        .designvc-list li {
            margin-bottom: 10px;
        }

        @media (max-width: 768px) {
            .designvc-title {
                font-size: 1.5rem;
            }

            .designvc-subtitle {
                font-size: 1.2rem;
            }

            .designvc-content {
                font-size: 0.9rem;
            }
        }
        
        .subject-img {
            width: 397px;
            height: 397px;
            border-radius: 10px;
            margin: 30px; /* Added space between images */
            transition: transform 0.3s ease, box-shadow 0.3s ease;
            cursor: pointer;
          }
          
          .subject-img:hover {
            transform: scale(1.1);
            box-shadow: 0 10px 20px rgba(0, 0, 0, 0.3);
          }
      

          @media (max-width: 768px) {
            .subject-img {
                width: 100%;
                max-width: 100%; /* Images will fill the container on smaller screens */
            }
        }


        @media (max-width: 480px) {
            .subject-img {
        width: 397px;
        height: 236px;
        border-radius: 10px;
        margin: 6px;
        transition: transform 0.3s ease, box-shadow 0.3s ease;
        cursor: pointer;
        }
        }










/* CONTACT PAGE CSS */

.contact-page {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    max-width: 100%;
    background-color: white;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.3);
    border-radius: 8px;
    overflow: hidden;
    margin: 5% 3%;
    padding: 20px;
    position: relative; /* Allows absolute positioning of the social links */
}

.contact-info1 {
    display: flex; /* Enables flexbox for this container */
    flex-direction: row; /* Ensures children are in a single row */
    gap: 20px; /* Adds spacing between items */
    justify-content: space-between; /* Distributes space evenly */
    align-items: stretch; /* Stretches items to the same height */
    padding: 30px;
    width: 100%;
}

.info-box {
    background-color: whitesmoke;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
    border-radius: 15px;
    padding: 20px;
    flex: 1; /* Ensures equal distribution of space */
    min-width: 300px; /* Prevents boxes from becoming too narrow */
    min-height: 200px; /* Sets a minimum height for consistent sizing */
    text-align: center; /* Centers text content */
    display: flex; /* Enables flexbox for internal alignment */
    flex-direction: column; /* Stacks content vertically */
    justify-content: space-between; /* Evenly spaces content inside */
}

.info-box h2 {
    margin-bottom: 10px;
    font-size: 18px;
    color: #333;
}

.info-box p {
    color: #555;
    line-height: 1.6;
}

/* Container for social links */
.social-links-container {
    position: absolute; /* Positions the social links at the bottom */
    bottom: 6px; /* Distance from the bottom edge */
    left: 50%; /* Center horizontally */
    transform: translateX(-50%); /* Adjust for centering */
    display: flex;
    justify-content: center;
    align-items: center;
}

.social-links {
    display: flex;
    gap: 15px; /* Adds spacing between icons */
    animation: slideIn 1s ease; /* Optional animation */
}

.social-icon {
    color: rgb(99, 105, 163);
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.5);
    padding: 10px;
    border-radius: 50%;
    text-align: center;
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background-color 0.3s;
}

.social-icon:hover {
    background-color: #0056b3;
}

@keyframes slideIn {
    from {
        transform: translateY(20px);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

/* Media Queries for Responsiveness */

/* For tablets (max width 768px) */
@media (max-width: 768px) {
    .contact-info1 {
        flex-direction: column; /* Stack items vertically */
        align-items: center; /* Center align items */
    }
    .info-box {
        min-width: 90%; /* Make boxes responsive to smaller widths */
    }
}

/* For mobile phones (max width 480px) */
@media (max-width: 480px) {
    .contact-info1 {
        flex-direction: column; /* Stack items vertically */
        align-items: center; /* Center align items */
    }
    .info-box {
        min-width: 100%; /* Full width on mobile */
        padding: 15px; /* Reduce padding for smaller screens */
    }
    .social-links-container {
        bottom: 6px; /* Adjust spacing for smaller screens */
    }
}




/* Responsive Design */
@media (min-width: 768px) {
   
} 












.mobile-dekho{
background-color:red;


}






.vc_h3{
    text-align: center;
    font-weight: 600;
    font-size: 1.7rem;
    color: #333;
    margin-bottom: 30px;
}
.vc_h3::after {
    content: "";
    display: block;
    width: 30%;
    height: 3px;
    background: #0077cc;
    margin: 8px auto 0;
    animation: slideIn 1s forwards;
}





 .events-section {
      display: flex;
      flex-wrap: wrap;
      gap: 20px;
      justify-content: center;
    }

    .event-card {
      background-color: #fff;
      border-radius: 8px;
      box-shadow: 0 2px 8px rgba(0,0,0,0.1);
      overflow: hidden;
      max-width: 350px;
      width: 100%;
      display: flex;
      flex-direction: column;
    }

    .event-card img {
      width: 100%;
      height: auto;
      display: block;
    }

    .event-content {
      padding: 15px;
    }

    .event-date {
      font-weight: bold;
      color: #555;
      margin-bottom: 5px;
    }

    .event-title {
      font-size: 16px;
      color: #222;
    }

    @media screen and (max-width: 768px) {
      .event-card {
        max-width: 100%;
      }
    }










.pgfee-container {
      background-color: #ffffff;
      padding: 30px;
      border-radius: 12px;
      box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
      max-width: 720px;
      margin: auto;
    }

    .pgfee-title {
      color: #1e3a8a;
      text-align: center;
      margin-bottom: 30px;
      font-size: 1.8rem;
    }

    .pgfee-list {
      list-style: none;
      padding: 0;
    }

    .pgfee-item {
      padding: 12px 0;
      border-bottom: 1px solid #e0e0e0;
      color: #333;
    }

    .pgfee-sublist {
      padding-left: 25px;
      margin-top: 8px;
      font-size: 0.95em;
      color: #555;
    }

    .pgfee-link-container {
      text-align: center;
      margin-top: 30px;
    }

    .pgfee-link-container a {
      display: inline-block;
      background-color: #2563eb;
      color: #fff;
      padding: 12px 28px;
      border-radius: 6px;
      text-decoration: none;
      font-weight: 600;
      font-size: 1rem;
      transition: background-color 0.3s ease;
    }

    .pgfee-link-container a:hover {
      background-color: #1d4ed8;
    }