:root {
            --primary-red: #a31d24;
            --secondary-blue: #1a3a6d;
            --accent-gold: #f4b41a;
            --bg-paper: #f9f7f2;
        }
  div:after {
      content:'';
      display:block;
      clear:both;
  }
  * { margin:0;padding:0;box-sizing:border-box;}
        body {
            font-family: 'Roboto', sans-serif !important;
            background-color: var(--bg-paper);
        }

        h1, h2, h3, .navbar-brand {
            font-family: 'Crimson Text', serif;
        }

        /* Top Header */
        .top-nav {
            background-color: var(--secondary-blue);
            color: white;
            padding: 5px 0;
            font-size: 0.9rem;
        }

        /* Icon Base Style */
        .location-icon {
            width: 18px;
            margin:0 7px 0 0;
            transition: transform 0.3s ease, filter 0.3s ease;
            animation: zoomInOut 2s infinite ease-in-out;
        }

        .location-icon-admission {
            width: 18px;
            transition: transform 0.3s ease, filter 0.3s ease;
            animation: zoomInOutAdmission 2s infinite ease-in-out;
        }

        .location-icon-results {
            width: 18px;
            transition: transform 0.3s ease, filter 0.3s ease;
            animation: zoomInOutresults 2s infinite ease-in-out;
        }

        .location-icon-leadership {
            width: 30px;
            transition: transform 0.3s ease, filter 0.3s ease;
            animation: zoomInOutleadership 2s infinite ease-in-out;
        }   
        
        /* Auto Zoom Animation */
        @keyframes zoomInOut {
            0%   { 
                transform: scale(1);
                filter: brightness(0) saturate(100%) 
                invert(41%) sepia(79%) saturate(749%) 
                hue-rotate(323deg) brightness(95%) contrast(95%); 
            }
            50%  { 
                transform: scale(1.2);
                filter: brightness(0) invert(1); 
            }
            100% { 
                transform: scale(1);
                filter: brightness(0) saturate(100%) 
                invert(41%) sepia(79%) saturate(749%) 
                hue-rotate(323deg) brightness(95%) contrast(95%); 
            }
        }

        @keyframes zoomInOutAdmission {
            0%   { 
                transform: scale(1);
                filter: brightness(0) saturate(100%) 
                invert(41%) sepia(79%) saturate(749%) 
                hue-rotate(323deg) brightness(95%) contrast(95%); 
            }
            50%  { 
                transform: scale(1.2);
                filter: brightness(0) saturate(100%) invert(0%); 
            }
            100% { 
                transform: scale(1);
                filter: brightness(0) saturate(100%) 
                invert(41%) sepia(79%) saturate(749%) 
                hue-rotate(323deg) brightness(95%) contrast(95%); 
            }
        }

        @keyframes zoomInOutresults {
            0%   { 
                transform: scale(1);
                filter: brightness(0) saturate(100%) 
                invert(21%) sepia(98%) saturate(2471%) 
                hue-rotate(205deg) brightness(95%) contrast(95%); 
            }
            50%  { 
                transform: scale(1.2);
                filter: brightness(0) invert(1); 
            }
            100% { 
                transform: scale(1);
                filter: brightness(0) saturate(100%) 
                invert(21%) sepia(98%) saturate(2471%) 
                hue-rotate(205deg) brightness(95%) contrast(95%); 
            }
        }

        @keyframes zoomInOutleadership {
            /* Zoom Out → rgb(129, 86, 35) */
            0%   { 
                transform: scale(1);
                filter: brightness(0) saturate(100%) 
                        invert(29%) sepia(35%) saturate(844%) 
                        hue-rotate(7deg) brightness(95%) contrast(95%);
            }
        
            /* Zoom In → Black */
            50%  { 
                transform: scale(1.2);
                filter: brightness(0) saturate(100%) invert(0%);
            }
        
            /* Back to Brown */
            100% { 
                transform: scale(1);
                filter: brightness(0) saturate(100%) 
                        invert(29%) sepia(35%) saturate(844%) 
                        hue-rotate(7deg) brightness(95%) contrast(95%);
            }
        }   
        
        /* Hover Effect */
        .location-icon:hover {
            transform: scale(1.4);
            filter: brightness(0) invert(1)
            drop-shadow(0 0 8px rgba(255,255,255,0.9));
        }

        .location-icon-admission:hover {
            transform: scale(1.4);
            filter: brightness(0) saturate(100%) invert(0%)
            drop-shadow(0 0 8px rgba(0,0,0,0.6));
        }
        
        .location-icon-results:hover {
            transform: scale(1.4);
            filter: brightness(0) invert(1)
            drop-shadow(0 0 8px rgba(255,255,255,0.9));
        }

        .location-icon-leadership:hover {
            transform: scale(1.4);
            filter: brightness(0) saturate(100%) invert(0%)
                    drop-shadow(0 0 8px rgba(0,0,0,0.6));
        }   
        
        /* Responsive Mobile Adjustment */
        @media (max-width: 576px) {
            .top-nav {
                font-size: 0.8rem;
            }
        
            .location-icon {
                width: 16px;
            }

            .location-icon-admission {
                width: 16px;
            }
            
            .location-icon-results {
                width: 16px;
            }

            .location-icon-leadership {
                width: 16px;
            }
        }

        .main-nav {
            background-color: var(--secondary-blue);
            border-top: 1px solid rgba(255,255,255,0.1);
            padding:0 !important;
        }
        .mainheader {
            position:absolute;
            top:0;width:100%;
            left:0;
            z-index:999;
        }
        .kttvlogo-head img {
            height:80px;
        }
        /* Hero Section */
.hero-section {
    background-image: url('../images/unnamed.jpg');
    /*background: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.5)), url('../images/unnamed.jpg') center/cover;
    min-height: 450px;*/
  color: white;
  display: flex;
  align-items: center;
  z-index: 0;
  position: relative;
  padding-top: 155px;
  padding: 180px 0 50px 0;
}
.hero-section:after {
    content:'';
    position:absolute;left:0;top:0;
    width:100%;height:100%;
    z-index:-1;
background: #020024;
background: linear-gradient(90deg,rgba(2, 0, 36, 1) 0%, rgba(9, 9, 121, 1) 35%, rgba(0, 212, 255, 1) 100%);
opacity:.2;
}
.hero-section h1 {font-size:43px;}
.hero-section p {margin:0;}
        .action-btns .btn {
            border-radius: 4px;
            padding: 10px 25px;
            font-weight: bold;line-height:1.3;
        }

        /* Leadership Section */
        .leader-card {
            background: #f6ece0;
            border-radius: 8px;
            padding: 15px;
            display: flex;
            align-items: center;
            box-shadow: 0 4px 6px rgba(0,0,0,0.05);
            height:100%;
           
        }

        .leader-card.governor { background: linear-gradient(135deg, #d35400, #e67e22); color: white; }
        .leader-card.cm { background: linear-gradient(135deg, #2980b9, #3498db); color: white; }
        .leader-card h6 {font-weight:600;}
        .leader-img {
            width: 70px;
            height: 70px;
            border-radius: 50%;
            object-fit: cover;
            border: 3px solid white;
            margin-right: 15px;
        }

        /* VC Message Section */
        .vc-card {
            background: #f6ece0;
            border: 1px solid #ddd;
            padding: 20px;
            height: 100%;
        }

        .faculties-list .list-group-item {
            background-color: #f1f1f1;
            margin-bottom: 5px;
            border: none;
            transition: 0.3s;
        }

        .faculties-list .list-group-item:hover {
            background-color: var(--primary-red);
            color: white;
        }

        /* Vision/Mission */
        .vision-section {
            background-color: #fcf8e3;
            border: 1px solid #faebcc;
        }
         .vision-section .card-title strong {
             font-family: 'Crimson Text', serif;
        }
         .vision-section i {
             color: rgb(129, 86, 35) !important;
         }
        .mission-section {
            background-color: #ebf5fb;
            border: 1px solid #d6eaf8;
        }
        .mission-section .card-title strong {
            font-family: 'Crimson Text', serif;
        }
       
        .notice-board {
            background: var(--secondary-blue);
            color: white;
            padding: 20px;
        }

        .notice-board ul {
            list-style: none;
            padding: 0;
        }

        .notice-board li {
            padding: 8px 0;
            border-bottom: 1px solid rgba(255,255,255,0.1);
        }
        .vision-section .card-title {
            padding: 10px;
  background-color: #ebd2be;border-radius:0.3rem 0.3rem 0 0;font-size:20px;
  margin:0;
        }
        .vision-section .card-body {
              background-color: #fcf0e4;
        }
               .mission-section .card-title {
            padding: 10px;
  background-color: #cfc4c8;border-radius:0.3rem 0.3rem 0 0;font-size:20px;
  margin:0;
        }
        .mission-section .card-body {
              background-color: #fcf0e4;
        }
        .vision-section h5 {font-weight:600;}
        .rightcard {
            margin-bottom:20px;
        }
        .rightcardleader-card {
  background: #f6ece0;
  border-radius: 8px 8px 0 0;
  padding: 15px;
  display: flex;
  align-items: center;
  box-shadow: 0 4px 6px rgba(0,0,0,0.05);
}
        .rightcardleader-card h6 {
            font-weight:600;font-size:25px; font-family: 'Crimson Text', serif;
        }
        .rightcardleader-footer {
            background-color:#cbaf8e5e !important;
        }
        .msgbutton {
           background-color: #815623;
  color: #fff;
  border-radius: 5px;
  padding: 8px 10px;
  display: block;
  margin: 0 auto !important;
  text-align: center;
  width: 50%;
        }
        .msgbutton a {
            color:#fff;text-decoration:none !important;
            text-align:center;
        }
        .msgbutton a img {
            height:25px;
        }
  .cardimage img {
      border-radius: 0.3rem;
  height: 388px;
  object-fit: cover;
  }
.homewrapper {
   position:relative;
}
.homewrapper:after {
    content:'';
    position:absolute;left:0;top:0;
    width:100%;height:100%;
      background-image: url('https://kttv.edu.in/assets/images/paper.jpg'); 
     background-position:center;
     background-size:cover;
     z-index:-1;
     opacity:.5;
}
.leadership-title {
    font-size:30px;font-weight:600;
}

.card-passion {
  background: #21325e !important;
  border-radius: 8px 8px 0 0;
  padding: 15px;
  box-shadow: 0 4px 6px rgba(0,0,0,0.05);
  color:#fff !important;margin-bottom: 20px;
}
.card-passion h6 {
    font-weight:600;font-size:22px;font-family: 'Crimson Text', serif;
}
.focusbox {
    border-right:1px solid #000;
}
.noticeimages {
    margin-bottom:10px;
}
.noticeimages img {
    width:100%;height:120px;object-fit:cover;
    border-radius:10px;
}

/* Custom Dropdown for Multi-level */
.dropdown-menu .dropdown-submenu {
    position: relative;
}

.dropdown-menu .dropdown-submenu .dropdown-menu {
    top: 0;
    left: 100%;
    margin-left: 0.1rem;
    display: none;
}

/* Show submenu on hover (Desktop) */
@media (min-width: 992px) {
    .dropdown:hover > .dropdown-menu {
        display: block;
    }
    .dropdown-submenu:hover > .dropdown-menu {
        display: block;
    }
}

/* Mobile adjustments */
@media (max-width: 991px) {
    .dropdown-menu .dropdown-menu {
        margin-left: 1rem;
    }
}

.main-nav {
    background: #0d6efd;
}

.nav-link {
    color: #fff !important;
}

.nav-link:hover {
    color: #ffd700 !important;
}
footer {
    padding:20px 0 0 0;
}
.footer-powered {
  padding: 10px 10px 10px 0;
  background-color: #000;font-size:13px;
}

/****** Side tab popup Starts from here *********************/

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

.buttons.noticebtn {
  display: inline-block;
  background: #e74a54;
  color: #fff;
  padding: 10px 40px;
  font-size: 15px;
  text-decoration: none;
  cursor: pointer;
}



.overlay.noticeoverlay.is-on {
  opacity: 1;
  visibility: visible;
}

.overlay.noticeoverlay.is-on .content {
  opacity: 1;
  visibility: visible;
  top: 0;
  padding: 30px;
}

.overlay.noticeoverlay .content {
  background: #fff;
  position: absolute;
  top: -50%;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  width: 50%;
  height: 380px;
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}



#close:hover {

  opacity: 1;
}

.buttons.noticebtn {
  position: fixed;
  /* right: -53px; */
  right: -62px;
  top: 50%;
  transform: rotate(270deg);
  z-index: 9999;
}

.buttons.noticebtn a {
  transform: rotate(90deg);
  color: #fff;
  font-size: 15px;
  text-decoration: none;
}

.inner-page-section{
    
    margin: 103px 0 0 0;
   
    min-height: 100vh;
    height: 100%;
 
}
.inner-heading {

    background-color: #1a3a6d;
    padding: 30px 0;
    text-align: center;color:#fff;font-size:30px;
    font-weight: 600;
}
.noticeoverlay h3 {
    font-size: 15px;
    font-weight: 600;
    line-height: 1.5;
    padding: 10px;
}


.noticeoverlay ul {
  margin: 0;
  padding: 0;
  background-color: #fafafa;
}

.noticeoverlay ul li {}

/* Marquee New Tag css */

.containers {
  font-family: sans-serif;
}

.text-style {
  color: #fff;
    background-image: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  padding: 2px 5px;
  display: inline-block;
  font-size: 12px;
  border-radius: 2px;
}

.blink-hard {
  animation: blinker 1s step-end infinite;
}

.blink-soft {
  animation: blinker 1.5s linear infinite;
}

@keyframes blinker {
  50% {
    opacity: 0;
  }
}




    




.marquee {
  background: #10474E;
    font-size: 18px;
    color: #fff;
    padding: 10px 0;
  }
  
  /* Scroll */
.scroll-y {
    overflow-y: scroll;
    position: relative;
}

div, ol, pre, span, ul {
    scrollbar-width: thin;
    scrollbar-color: #eff2f5 transparent;
}

.scroll-y::-webkit-scrollbar {
    width: 5px;
    height: 5px;
}

.scroll-y::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
    -webkit-border-radius: 10px;
    border-radius: 10px;
}

.scroll-y::-webkit-scrollbar-thumb {
    -webkit-border-radius: 10px;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.3);
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.5);
}

.scroll-y::-webkit-scrollbar-thumb:window-inactive {
    background: rgba(255, 255, 255, 0.3);
}
/* Mobile Navbar Fix */
@media (max-width: 991px) {

    .navbar-toggler{
        border: none;
        outline: none;
    }

    .navbar-toggler-icon::before{
        top: -8px;
    }

    .navbar-toggler-icon::after{
        top: 8px;
    }

    /* Navbar hidden by default */
    #navbarNav{
        display: none;
        width: 100%;
        margin-top: 9px !important;
        background: var(--secondary-blue);
        padding: 10px 0;
    }

    /* When active */
    #navbarNav.active{
        display: block;
    }

    .navbar-nav{
        flex-direction: column;
        width: 100%;
    }

    .navbar-nav .nav-item{
        width: 100%;
        border-bottom: 1px solid rgba(255,255,255,0.1);
    }

    .navbar-nav .nav-link{
        padding: 10px 15px;
        display: block;
        color: #fff;
    }

    .dropdown-menu{
        position: static;
        float: none;
        width: 100%;
        background: #0e2a47;
        border: none;
    }

    .dropdown-item{
        color: #fff;
        padding: 8px 25px;
    }
}

/* When menu open → convert to X */
.navbar-toggler.active .navbar-toggler-icon{
    background:transparent;
}

.navbar-toggler.active .navbar-toggler-icon::before{
    transform:rotate(45deg);
    top:0;
}

.navbar-toggler.active .navbar-toggler-icon::after{
    transform:rotate(-45deg);
    top:0;
}

 .navbar-toggler {
    border: none;
}

.navbar-toggler-icon {
    background-image: none;
    width: 30px;
    height: 2px;
    background-color: #000;
    position: relative;
    display: block;
    transition: 0.3s;
}

.navbar-toggler-icon::before,
.navbar-toggler-icon::after {
    content: "";
    position: absolute;
    margin: 13px 0px;
    width: 30px;
    height: 2px;
    background-color: #000;
    left: 0;
    transition: 0.3s;
}

.navbar-toggler-icon::before {
    top: -8px;
}

.navbar-toggler-icon::after {
    top: 8px;
}