@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;800&display=swap');
     @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;800&family=Roboto&display=swap');
     @import url('https://fonts.googleapis.com/css2?family=Poppins:ital@1&display=swap');

     /* UTILITIES */
     * {
         margin: 0;
         padding: 0;
         box-sizing: border-box;
         scroll-behavior: smooth;
         font-size: 62.5%;
     }

     body {
         /* font-family: 'Poppins'; */
         font-family: 'Roboto';
     }

     a {
         text-decoration: none;
     }

     li {
         list-style: none;
     }


     /* NAVBAR STYLING STARTS */
     header.top-nav {
         display: flex;
         justify-content: flex-end;
         align-items: center;
         width: 100%;
         background-color: #ffcc66;
         gap: 2rem;
         padding: 1rem;
         z-index: 999;
     }

     .language {
         /* border:1px solid red; */
         z-index: 99;
     }

     .language .small-icon img {
         width: 50px;

     }

     .language .small-icon a {
         font-size: 1.7rem;
         font-weight: 500;
     }

     .language .small-icon a.eng {
         margin: 0 1.2rem;
     }

     .social-media-logo {
         /* border:1px solid red; */
         gap: 1rem;
     }

     .social-logo {
         border: none;
         outline: none;
         width: 40px;
         height: 40px;
         display: flex;
         align-items: center;
         justify-content: center;
         text-align: center;
         border-radius: 5px;
         cursor: pointer;
     }

     .social-logo span {
         font-size: 1.6rem;
         color: #fff;
         text-align: center;

     }

     .social-logo.facebook,
     .telegram {
         background-color: #0A4C9A;
     }

     .social-logo.twitter {
         background-color: #00c9ff;
     }

     .social-logo.instagram {
         background-color: rgba(205, 72, 107);
     }

     .youtube-logo {
         background-image: linear-gradient(154deg, transparent 40%, rgb(255, 0, 0, .6) 70%);
         margin-left: 1rem;
         padding: .4rem 1rem;
         border-radius: 10px;
         cursor: pointer;
         transition: .3s all linear;
         animation: change-color 1s alternate infinite;
         /* border: 1px solid red; */
         display: flex;
     }

     .youtube-logo img {
         width: 120px;
     }

     .youtube-logo p {
         text-align: center;
         font-size: 1.5rem;
         color: transparent;
         -webkit-background-clip: text;
         margin-top: .3rem;
         background-image: linear-gradient(45deg, black 65%, black 50%);
         color: #0e1122;
         animation: blick-text .5s alternate infinite;
         opacity: 1;
     }

     @keyframes blick-text {
         0% {
             opacity: 1;
         }

         100% {
             opacity: 0;
         }

     }

     .youtube-logo:hover {
         box-shadow: 0px 0px 12px 2px red;
     }

     .youtube-logo:hover p {
         animation: none;
     }

     .navbar {
         display: flex;
         align-items: center;
         justify-content: space-between;
         padding: 2rem 4rem;
         background-color: white;
         color: black;
         z-index: 10;
         /* border: 1px solid red; */
     }

     .nav-links {
         display: flex;
         align-items: center;
         justify-content: space-between;
     }

     .nav-links a {
         color: #0e1122;
     }

     .nav-links a:hover {
         transform: scale(1.1);
     }

     /* LOGO */
     .main-logo {
         width: 650px;

     }

     .main-logo img {
         width: 200px;
     }

     .main-logo .logo-content {
         margin-left: 1rem;
     }

     .main-logo .logo-content h2 {
         font-weight: 500;
         font-size: 2.7rem;
         line-height: 1.4;
     }

     .main-logo .logo-content p {
         font-weight: 500;
         margin-top: 1rem;
         font-size: 2rem;
     }

     /* @keyframes change-color{
    0% {
        background-image: linear-gradient(45deg, transparent 0%, rgb(255, 0, 0, .6) 70%);
    }

    100% {
        background-image: linear-gradient(45deg, rgb(255, 0, 0, .1) 50%, rgb(255, 0, 0, .6) 70%);
    }
} */

     /* NAVBAR MENU */
     .menu {
         display: flex;
         gap: 1rem;
     }

     .menu li:hover {
         color: black;
         transition: 0.3s ease;
     }

     .menu li a i {
         display: inline;
         font-size: 2rem;
         margin-right: .5rem;
     }

     .menu li {
         padding: 4px 10px;
     }

     .menu li a {
         font-size: 1.8rem;
     }



     /* DROPDOWN MENU */
     .menu .drop-down-container {
         position: relative;
     }

     .menu li.drop-down-container ul.dropdown {
         position: absolute;
         top: 50px;
         left: 50%;
         transform: translatex(-50%);
         background-color: #0e1122;
         padding: 1rem 0;
         opacity: 0;
         pointer-events: none;
         transition: .4s;
         z-index: 9999;
         border-radius: 5px;
         z-index: 999;
     }

     ul.dropdown li {
         padding: 2rem 3rem;
         width: 250px;
         cursor: pointer;
     }

     ul.dropdown li:hover {
         background-color: #181d38;
     }

     ul.dropdown li a {
         color: #fff;
         font-size: 1.6rem;
         text-transform: capitalize;
     }

     .menu .drop-down-container:hover ul.dropdown {
         opacity: 1;
         pointer-events: all;
         top: 30px;
         z-index: 999;
     }

     .updates {
         width: 100%;
         height: 10vh;
         background-color: #f4feff;
     }

     .updates h1 {
         text-align: center;
         color: #f89624;
         font-size: 2rem;
     }

     .updates h2 {
         text-align: center;
         color: black;
         font-size: 1rem;
         display: inline-block;
         margin: 10px 30px;
     }


     .banner {

         background-image: linear-gradient(rgb(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)), url(banner-img/126.jpeg);
         width: 100%;
         height: 100%;
         background-position: center;
         background-size: cover;
         animation: change-image 10s linear infinite;
         z-index: 1;
         display: flex;
         justify-content: center;
         align-items: center;
     }

     @keyframes change-image {

         0% {
             background-image: linear-gradient(rgb(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)), url(banner-img/130.jpeg);
         }

         50% {
             background-image: linear-gradient(rgb(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)), url(banner-img/DSC_0455.JPG);
         }

         100% {
             background-image: linear-gradient(rgb(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)), url(banner-img/mmaa.JPG);
         }


     }

     .text-area {
         padding: 20rem 6rem;
         font-family: arial;
         width: 60%;
         height: max-content;
         display: flex;
         align-items: center;
         color: #fff;
         display: flex;
         flex-direction: column;
         font-size: 4rem;
         text-align: center;
     }

     .text-area h5 {
         margin-left: 5px;
         margin-bottom: 15px;
         font-size: 1.9rem;
         color: #FFF;
     }

     .text-area h1 {
         font-size: 3rem;
         margin-bottom: 20px;
         color: #FFF;
     }

     .text-area span {
         color: orange;
         font-size: 4rem;
         animation: cut-to-full 10s infinite alternate;
         background-image: linear-gradient(#FFA500, #FFA500);
         -webkit-background-clip: text;
         color: transparent;
         background-repeat: no-repeat;
         background-size: 0%;
     }

     @keyframes cut-to-full {

         0% {
             background-size: 0%;
         }

         100% {
             background-size: 110%;
         }
     }


     .text-area p {
         line-height: 1.9;
         font-size: 1.8rem;
     }

     .buttons {
         margin-top: 25px;
         display: flex;
     }

     .btn {
         display: inline-block;
         padding: 17px 38px;
         margin-right: 30px;
         font-size: 1.8rem;
         font-weight: bold;
         background-image: linear-gradient(-45deg, #33c1cf 50%, #f89624 50%);
         background-size: 230%;
         color: #fff;
         cursor: pointer;
         transition: .5s;
         position: relative;
         z-index: 1;
         border: 0;
     }



     .btn:hover {
         color: #fff;
         background-size: 100%;
     }

     .btn:hover::after {
         transform: scale(0);
     }

     .btn:active {
         transition: 0.1s;
         transform: translatey(10px);
     }

     .btttn {
         color: #fff;
         background-color: orange;
         padding: 12px 40px;
         border: none;
         overflow: hidden;
         font-size: 1.6rem;
         display: block;
         margin-top: 20px;
         transition: 0.7s;
         position: relative;
         z-index: 20;
         margin: 20px auto;
     }


     /* <!--update-section start--> */

     .update-section {
         padding: .1rem 0;
     }

     .update-section .grid-two-cols {
         grid-template-columns: 30% 70%;
         gap: .5rem;

     }

     .side-bar {
         /* background-color: #090c1a; */
         background-image: url(images/meetings-bg.jpg);
         background-size: cover;
         background-position: center;
         background-attachment: fixed;
         padding: 2.5rem 4rem;
         padding-right: 0;
     }

     .side-bar-heading {
         /* display: flex;
    justify-content: center; */
         /* border: 1px solid red; */
         width: 85%;
         padding-top: 2rem;
         padding-bottom: 2rem;

     }

     .side-bar-heading h4 {
         color: #fff;
         font-size: 3rem;
         font-weight: 400;
     }

     .side-bar-heading p {
         color: #fff;
         font-size: 1.4rem;
         line-height: 1.6;
         letter-spacing: 1.5px;
     }

     .side-bar-img img {
         width: 100px;
     }

     .side-bar-content li {
         color: #fff;
     }

     .side-bar-content i {
         margin-right: 2rem;
         font-size: 3rem;
     }

     .side-bar-content h4 {
         font-weight: 400;
         font-size: 2rem;
     }

     .side-bar-content li {
         border: 2px solid rgba(225, 225, 225, .2);
         border-top-left-radius: 50px;
         border-bottom-left-radius: 50px;
         border-right: none;
         margin: 1rem 0;
         padding: 1.5rem 2rem;
     }

     .disk {
         width: 100%;
         height: 2px;
         background-color: rgba(0, 0, 0, .2);
     }

     .accordian-content p {
         color: #090c1a;
         font-size: 2rem;
     }

     .accordian-content p a {
         color: #090c1a;
         font-size: 2rem;
     }

     .accordian-content p a:hover {
         text-decoration: underline;
     }

     .content-btn {
         padding: 1rem 2.5rem;
         background-color: #090c1a;
         border-radius: 25px;
         transition: all .3s;
         border: 0;
         outline: none;
     }

     .content-btn:hover {
         transform: scale(1.1);
     }

     .content-btn a {
         color: #fff;
         font-size: 1.5rem;
     }

     .accordian-content {
         font-size: 2.5rem;
         display: none;
         line-height: 1.6;
     }

     .side-bar-content li{
        padding:2rem 2rem;
     }

     
     .side-bar-content li .accordian-heading {
         display: flex;
         align-items: center;
         justify-content: space-between;
         transition: .5s all linear;
     }

     .side-bar-content li.active {
         background-color: #fff;
         color: #090c1a;
         border-top-left-radius: 50px;
         border-bottom-left-radius: 50px;
     }

     .side-bar-content li.active .fa-angle-up {
         background-color: #090c1a;        ;
         color: #fff;
         transition: .5s all linear;
     }

     .side-bar-content li:hover {
         background-color: #fff;
         color: #090c1a;
         border-top-left-radius: 50px;
         border-bottom-left-radius: 50px;
     }

     .side-bar-content li .fa-angle-up {
         justify-self: flex-end;
         /* position: absolute;
         right: 5%; */
         background-color: #fff;
         width: 30px;
         height: 30px;
         color: #000;
         font-siZe: 1.6rem;
         display: flex;
         align-items: center;
         justify-content: center;
         border-radius: 50%;
         transition: .5s linear;
         cursor: pointer;
     }

     .side-bar-content li:hover .fa-angle-up {
         background-color: #090c1a;
         color: #fff;
     }

     .Study-materail {
         padding: 0rem 0rem;
         /* background-image: linear-gradient(rgba(0, 0, 0, .3), rgba(0, 0, 0, .3)), url(images/portfolio_big_item_03.jpg);
         background-attachment: fixed;
         background-size: cover;
         background-position: center; */

     }



     /* our-campus Start */


     .campus-img-1 {
        grid-row-start: 1;
        grid-row-end: 3;
        font-size: 3rem;
    }

    .campus-img-2 {
        grid-row-start: 1;
        grid-row-end: 3;
        grid-column-start: 2;
        grid-column-end: 4;
        overflow: hidden;
        height: 40vh;
    }

    .campus-img-3 {
        grid-row-start: 1;
        grid-row-end: 3;

    }



    .campus-img-4 {
        grid-column-start: 1;
        grid-column-end: 3;
        height: 35vh;

    }

    .campus-img-5 {
        grid-column-start: 3;
        grid-column-end: 4;
    }

    .flex-items {
        width: 100%;
        border:1px solid rgba(0, 0, 0, .1);

    }

    .campus-img {
        height: 250px;
        overflow: hidden;
        border-radius: 5px;
        border: white solid 2px;

    }

    .campus-img img {
        transition: 0.5s;
        width: 100%;
        height: 100%;
    }

    .campus-img img:hover {
        transform: scale(1.1);
        cursor: pointer;
    }

    .our-campus h1 {
        font-weight: 400;
        font-size: 2.3rem;
        text-align: center;
    }

    .our-campus p {
        font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
        font-size: 1.6rem;
        letter-spacing: 1.6px;
color:rgba(0, 0, 0, .5);
        margin-top: 10px;
        text-align: center;
    }

    .our-campus {
        width: 98%;
        height: auto;
        overflow: hidden;
    }
    .campus-img-content{
       width:100%;
       padding:1rem ;
      background-color:  rgb(0, 0, 0, 0.03);
    }



    /* campus-end */

     /* ============================= js slider  start========================== */

     .swiper {
         width: 100%;
         height: 720px;
     }

     .swiper-slide {
         text-align: center;
         font-size: 18px;
         background: #fff;
         /* Center slide text vertically */
         display: -webkit-box;
         display: -ms-flexbox;
         display: -webkit-flex;
         display: flex;
         -webkit-box-pack: center;
         -ms-flex-pack: center;
         -webkit-justify-content: center;
         justify-content: center;
         -webkit-box-align: center;
         -ms-flex-align: center;
         -webkit-align-items: center;
         align-items: center;
         height: 100%;
         /* border:1px solid green; */
     }
     .swiper-slide{
        /* height:auto; */
        height: 720px;

     }
     .swiper-slide img {
         display: block;
         width: 100%;
         height: 100%;
         object-fit: cover;
     }


     /* ============================= js slider  end========================== */

     .mission {
         margin-top: 5rem;
         transition: 0.5s;
         position: relative;
     }

     .mission-content {
         flex-direction: column;
         gap: 10rem;
     }

     .mission-content .cont-img {
         flex-basis: 50%;
         /* border: 1px solid red; */
     }

     .mission-content .common {
         flex-basis: 50%;
         /* border: 1px solid red; */
     }

     .mission-content .cont-img img {
         width: 90%;
     }

     .mission-content h2 {
         font-size: 4.8rem;
         letter-spacing: 2;
         font-weight: 500;
         text-transform: capitalize;
         position: relative;
         width: max-content;
         font-weight: 400;
         margin-bottom: 3rem;
     }

     .mission-content span {
         font-size: 4.8rem;
         font-weight: 400;
         color: #eea412;
     }

     .mission-content .flex {
         gap: 3rem;
     }

     .mission-content h2::before {
         content: '';
         position: absolute;
         bottom: -6px;
         right: 0;
         background-color: #333;
         width: 100%;
         height: 3px;
     }

     .mission-content h2::after {
         content: '';
         position: absolute;
         bottom: -12px;
         right: -1px;
         background-color: #eea412;
         width: 15px;
         height: 15px;
         border-radius: 50%;
     }


     .mission-content p {
         line-height: 1.5;
         font-size: 1.7rem;
         text-align: left;
     }

     .mission-content p b {
         font-size: 1.7rem;
     }

     .mission-content button {
         position: relative;
         background-color: #eea412;
         border: 3px solid #eea412;
         cursor: pointer;
         margin: 0;
         margin-top: 2rem;
     }

     .mission-content button::after {
         z-index: -1;
         content: '';
         position: absolute;
         top: 0;
         left: 0;
         width: 100%;
         height: 100%;
         background-color: #333;
         transform: scale(1);
         transition: .3s;
     }

     .mission-content button:hover::after {
         transform: scale(0);
     }

     .mission button:hover {
         color: #000;
     }

     /* mission-content end */





     /* facilities-start */

     .facilites {
         width: 80%;
         margin: 0px auto;
         /* height: 400px; */
         height: auto;
         /* border: 1px solid red; */
     }

     /* .container{
        border:1px solid red;
     } */

     .facilites .grid {
         gap: 2rem;
     }

     .facilities-img {
         position: relative;
     }


     .facilities-img img {
         width: 100%;
         height: 400px;
     }

     .overlay {
         /* position: absolute;
         bottom: 0; */
         width: 100%;
         text-align: center;
         font-size: 3rem;
         font-weight: 500;
         padding: 2rem 0;
         background-color: rgb(225, 225, 225, .4);
         color: #000;
     }

     /* facilities-end */

     /* iti-contributers start */


     .iti-contributers-sec {
         background-color: #f8f0e8;
     }

     .iti-contributers {
         height: auto;
         display: grid;
         gap: 3rem;
         /* border: 1px solid red; */

     }

     .cont-1 {
         overflow: hidden;
         height: auto;
         width: 100%;
         margin: 0 auto;
         transition: 0.5s;
         cursor: pointer;
         display: block;
     }

     .cont-1:hover {
         transform: translatey(-10px);
     }

     .cont-1 img {
         width: 100%;
         height: 60%;
         border-radius: 50%;
         border: #f89624 solid 10px;
         transition: 0.3s;
     }

     .cont-1 img:hover {
         box-shadow: #f89624 0px 5px 10px;
     }

     .cont-1 h3 {
         padding-top: 10px;
         font-size: 1.5rem;
         color: #ff9800;
         text-align: center;
     }

     span {
         padding-left: 5px;
         font-size: 1.5rem;
         color: #333;
     }

     /* iti-contributers end */


     /* topper-student start */

     .top-student {
         display: grid;
         height: auto;
         gap: 2rem;
         margin: auto;
     }

     .top-1 {
         background-color: white;
         overflow: hidden;
         transition: 0.5s;
         cursor: pointer;
         border-top-right-radius: 10px;
         border-top-left-radius: 10px;
     }

     .top-1-img {
         height: 260px;
     }

     .top-1-img img {
         width: 100%;
         height: 100%;
     }

     .topper-content {
         height: 100px;
         padding: 1rem 1rem;
         /* background-color: ; */
         border: 1px solid rgba(0, 0, 0, .3);
     }

     .top-1 P {
         color: black;
         font-size: 2rem;
         text-align: center;
         line-height: 1.5;
     }

     /* .top-1:hover {
    transform: scale(1.1);
} */


     /* topper-student end */

     /* footer-start */

     .footer-b {
         background-color: #181d38;
         padding: 4rem 0;
         padding-bottom: 2rem;
     }

     .footer {
         display: grid;
         grid-template-columns: repeat(4, 1fr);
         width: 80%;
         height: auto;
         gap: 2rem;
         margin: auto;
         padding: 20px;
     }

     .foot-1 {
         background-color: #181d38;
         width: 100%;
         height: 100%;
         transition: 0.5s;
         cursor: pointer;
         display: flex;
         flex-direction: column;
     }



     .foot-1 h2 {
         font-size: 2.5rem;
         margin-bottom: 10px;
         color: white;
         font-weight: 400;
     }

     .foot-1 h4 {
         margin-top: 20px;
         color: white;
         font-size: 2rem;
         font-weight: 400;
     }

     .foot-1 a {
         color: #fff;
         font-size: 1.7rem;
         padding-top: 15px;
         transition: 0.5s ease-in-out;
     }


     .foot-1 a:hover {
         transform: scale(1.9);
         transform: translatex(10px);
     }

     .foot-1 i {
         margin-right: 15px;
         color: white;
     }


     .foot-1 p {
         padding-top: 14px;
         font-size: 1.7rem;
         color: white;
     }

     .footer-social-logo {
         display: flex;
     }

     .footer-social-logo i {
         position: relative;
         cursor: pointer;
         display: flex;
         justify-content: center;
         align-items: center;
         width: 45px;
         height: 45px;
         font-size: 2rem;
         border: 2px solid #fff;
         border-radius: 50%;
         padding: 10px 20px;
         margin-right: 10px;
         margin-top: 0px;
         transition: 0.7s;
     }

     .footer-social-logo i:hover {
         transform: rotatey(360deg);
     }

     .footer-social-logo i:active {
         transform: translatey(10px);
     }


     .dev-img {
         width: 100%;
         height: auto;
         margin: auto;
         display: flex;
         flex-wrap: wrap;
     }

     .img-1 {
         background-color: transparent;
         width: 25%;
         height: 60%;
         margin: 5px;
     }

     .img-1 img {
         width: 100%;
         height: 80%;
         border: white 1px solid;
     }

     .img-1 p {
         text-align: center;
         margin-top: -10px;
     }


     #cordinates {
         font-size: 1.5rem;
         margin-top: 2rem;
         line-height: 1.5;
     }


     footer {
         padding: 2rem 0;
         background-color: #0e1122;
         color: #fff;
         text-align: center;
     }

     footer p {
         font-size: 1.7rem;
     }

     /* footer-end */





     /* ------------------Custom Scrollbar start------------------- */
     ::-webkit-scrollbar {
         width: 10px;

     }

     /* Track */
     ::-webkit-scrollbar-track {
         background: white;
     }

     /* Handle */
     ::-webkit-scrollbar-thumb {
         background: #f89624;
         border-radius: 10%;
         height: 20px;
     }

     /* Handle on hover */
     ::-webkit-scrollbar-thumb:hover {
         background: #06BBCC;
     }

     /* ------------------Custom Scrollbar end------------------- */


     .hamburger {
         display: none;
         opacity: 0;
         pointer-events: none;
     }




     /* ============================making top button======================= */
     .top-btn {
         width: 50px;
         height: 50px;
         background-color: #f89624;
         display: flex;
         align-items: center;
         justify-content: center;
         position: fixed;
         bottom: 18%;
         right: 3%;
         z-index: 10000;
         border-radius: 50%;
         animation: topbtn 1s linear infinite;
         cursor: pointer;
         transform: translateY(0%);
         transition: .5s all linear;
     }

     @keyframes topbtn {
         0% {
             transform: translateY(0%);
         }

         50% {
             transform: translateY(20%);
         }

         50% {
             transform: translateY(20%);
         }

         75% {
             transform: translateY(0%);
         }

         100% {
             transform: translateY(0%);
         }
     }

     .top-btn i {
         color: #fff;
         font-size: 2rem;
     }










     .headlines-section {
         background-color: #ffcc66;
         padding: 1.5rem 0;
         width: 100%;
         margin-bottom: 2rem;
     }


     .headlines-section .head-lines-container {
         width: 80%;
         margin: auto;
         background-color: #fff;
         /* gap:4rem; */
     }


     .headline-heading {
         padding: 1rem 2rem;
         background-image: linear-gradient(110deg, #181d38 80%, transparent 20%);
         color: #fff;
         width: 250px;
         border-left: 4px solid yellow;
     }

     .headline-heading h2 {
         font-size: 2rem;
     }

     .headline-content {
         /* border:1px solid red; */
         /* padding:0 3rem; */
         width: max-content;
         width: 100%;
         height: 100%;
         font-size: 2.3rem;
         padding-right: 4rem;
     }



     .Study-materail .grid-four-cols {
         grid-template-columns: 1fr 1fr;
         gap: 1rem;
     }

     .study-items img {
         width: 100%;
         height: 100%;
     }

      /* .study-items{
        grid-column-start: 1 ;
        grid-column-end: 3 ;
     }  */