/* (A) GALLERY WRAPPER */
/* (A1) BIG SCREENS - 3 IMAGES PER ROW */
.gallery {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  grid-gap: 10px;
  max-width: 1200px;
  margin: 0 auto; /* horizontal center */
}

/* (A2) SMALL SCREENS - 2 IMAGES PER ROW */
@media screen and (max-width: 640px) {
  .gallery { grid-template-columns: repeat(2, 1fr); }
}

/* (B) THUMBNAILS */
.gallery img {
  width: 70%;
  height: 150px;
  object-fit: cover; /* fill | contain | cover | scale-down */
  border: 1px solid #cdcdcd;
  cursor: pointer;
}

/* (C) FULLSCREEN IMAGE */
.gallery img.full {
  position: fixed;
  top: 0; left: 0; z-index: 999;
  width: 100vw; height: 100vh;
  object-fit: contain; /* fill | contain | cover | scale-down */
  border: 0;
  background: #fff;
}







/* (D) OPTIONAL ANIMATION *
.gallery { overflow-x: hidden; }
.gallery img { transition: all 0.3s; } */




body {
  color: #262626;
  background: #ffffff;
  font-family: 'Montserrat', sans-serif;
  font-weight: 100;

}

#upper_header {
  width: 100%;
}

#dte {
  float: right;
  justify-content: center;
  align-items: center;
  padding-left: 10px;
}

#headerImage {
  width: 80%;
  float: left;

}

h1,
h2, 
h3, 
h4,
h5, 
h6 {
  font-weight: 100;
}

.navbar{
  width: 100%;
  padding-left: 1%;
 
  margin-top: 0;
  height: 40px;
}

.nav-item{
  padding-left:5px;
}




.btn:focus {
  box-shadow: none;
}

.wrapper {

  position: relative;
  width: 95%;
  max-width: auto;
  margin: 0 auto;
  background: #ffffff;
}

/*******************************/
/********** Header CSS *********/
/*******************************/


body {margin:0;font-family:Arial}

.topnav1 {
  overflow: hidden;
  background-color:#00539C;
  border-radius:.5em;
}

.topnav1 a {
  float: left;
  display: block;
  color: #f2f2f2;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 12px;

}
.topnav1 .icon {
  display: none;
}

.dropdown1 {
  float: left;
  overflow: hidden;
}

.dropdown1 .dropbtn {
  font-size: 12px;    
  border: none;
  outline: none;
  color: white;
  padding: 12px 14px;
  background-color: inherit;
  font-family: inherit;
  margin: 0;
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: #759DF9;
  min-width: 300px;
  box-shadow: 0px 8px 16px 0px white(0,0,0,0.2);
  z-index: 1;
}

.active{
  background-color: #001E62;
  color:white;
}

.dropdown-content a {
  
  float: none;
  color: white;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  text-align: left;
 
}


.topnav1 a:hover, .dropdown1:hover .dropbtn {
  background-color: white;
  color: black;
}


.dropdown-content a:hover {
  background-color:#00539C;
  color: white;
}

.dropdown1:hover .dropdown-content {
  display: block;
}

@media screen and (max-width: 1000px) {
  .topnav1 a:not(:first-child), .dropdown1 .dropbtn {
    display: none;
  }
  .topnav1 a.icon {
    float: right;
    display: block;
  }
}

@media screen and (max-width: 1000px) {
  .topnav1.responsive {position: relative;}
  .topnav1.responsive .icon {
    position: absolute;
    right: 0;
    top: 0;
  }
  .topnav1.responsive a {
    float: none;
    display: block;
    text-align: left;
  }
  .topnav1.responsive .dropdown1 {float: none;}
  .topnav1.responsive .dropdown-content {position: relative;}
  .topnav1.responsive .dropdown1 .dropbtn {
    display: block;
    width: 100%;
    text-align: left;
  }
}

.menu {
  display: flex;
  flex-direction: column;
}



.menu-item {
  position: relative;
}

.menu-item a {
  display: block;
  padding: 10px;
  background-color: #759DF9;
  color: white;
  text-decoration: none;
}

.submenu {
  display: none;
  position: absolute;
  top: 0%;
  left: 100.5%;
  width: 100%;
}

.submenu-item {
  background-color: #eee;
}

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

.menu-item.onclick .submenu{
  display: block;
}

.submenu-1 {
  display: none;
  position:absolute ;
  top: 0%;
  left: 100.5%;
  width: 100%;
}
.submenu-item-1 {
  background-color: #eee;
}
.submenu-item-1 a{
  color:white;
}

.submenu-item:hover .submenu-1{
  display: block;
}




/*
 .dropdown-menu{
    background-color: #759DF9;
  }
  .dropdown-item{color: white;}
  .dropdown-item:hover{background-color: #001E62;color:white;}

.header {
  position: relative;
  width: 100%;
  padding: 0 0 0 0;
  background: #00539C;
  border-radius: 5px;
  
}

.header.home {
  padding-bottom: 0;
  align-items: initial;
  margin-bottom: 5px;
  background-color: #345ca4;
  background-repeat: no-repeat;
  background-size: cover;
  height: 40px;
}

.header .dropdown-menu {
  margin-top: 0px;
  border: 0;
  border-radius: 5px;
  background: #6392ea;
  transition: ease-in 0.3s;
}

.header .dropdown-menu a.active {
  color: #345ca4;
}

@media (max-width: 600px) {
  nav {
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
  }
}

@media (min-width: 992px) {
  .header .navbar {
      background: transparent !important;
  }
  
  .header .navbar-brand {
      display: none;
  }
  
  .header .navbar-light a.nav-link,
  .header .navbar-light .show > .nav-link {
      position: relative;
      padding: 8px px;
      color: #ffffff;
      font-size: 10px;
      z-index: 1;
  }

  
  .header .navbar-light a.nav-link:hover,
  .header .navbar-light a.nav-link.active {
    background-color: white;
    color: #052561;
  }
}



@media (max-width: 992px) {
 
  .header .navbar {
      background: #ffffff !important;
      border: none;
      z-index: 1;
      color: #000000;
  }
  
  .header a.nav-link {
      padding: 5px 0;
  }
  
  .header .dropdown-menu {
      box-shadow: none;
  }
}

.header .navbar .btn {
  position: relative;
  margin-left: 15px;
  padding: 12px 20px 10px 20px;
  font-size: 13px;
  text-transform: uppercase;
  color: #00539C;
  border: none;
  border-radius: 5px;
  background: #ffffff;
  transition: .3s;
}

.header .navbar .btn:hover {
  color: #201e1e;
  background: #f1f3f6;
}

.header .navbar .btn i {
  font-size: 13px;
  margin-right: 8px;
}





@media (max-width: 767.98px) {
  .header .hero .form {
      margin-top: 45px;
  }
}

.dropdown-item {

   background:#345ca4;
   color: white;
   align-items: center;
 }

 .dropdown-item:hover{
  color: #000000;
 }

.dropdown-item:hover  {
  display: block;
 transition: ease-in-out 0.3s;
}
*/

/* Drofleft Menu Styling */
.dropdown-menu>li>a:hover:after {
  text-decoration: underline;
  transform: rotate(-90deg);
}
.navbar-nav li:hover>ul.dropdown-menu {
  display: block;
  margin-left: 1px;
}

.dropdown-submenu {
  position: relative;
  font-size: 13px;
}

.dropdown-submenu>.dropdown-menu {
  top: 0;
  left: 100%;
  margin-top: -4px;
  margin-right: 0;
}

.navbar-toggler {
  background-color: #e1be10;
  color: #fff;
  font-weight: bold;
  padding: 8px 10px;
  border-radius: 5px;
}

.navbar-toggler:hover {
  background-color: #d6ad09;
  color: #fff;
}

/* Slideshow starts here */
.carousel-inner img {
  margin-left: 2.5%;
  width: 95%;
  height: 780px;
}
.carousel-control-prev-icon:hover{
  transform: scale(1.2);
}
.carousel-control-next-icon:hover{
  transform: scale(1.2);
}
#demo .carousel-item {
  -webkit-transition: opacity 0.5s ease, -webkit-transform 0.5s ease;
  -o-transition: opacity 0.5s ease, -o-transform 0.5s ease;
  transition: opacity 0.5s ease, transform 0.5s ease;
  -webkit-backface-visibility: visible;
  backface-visibility: visible;
}
#demo .carousel-item.active {
  opacity: 1;
  -webkit-transform: none;
  -ms-transform: none;
  -o-transform: none;
  transform: none;
}
#demo .carousel-item.next, #demo .carousel-item.active.right {
  opacity: 0;
  -webkit-transform: translate3d(100%, 0, 0);
  transform: translate3d(100%, 0, 0);
}
#demo .carousel-item.prev, #demo .carousel-item.active.left {
  opacity: 0;
  -webkit-transform: translate3d(-100%, 0, 0);
  transform: translate3d(-100%, 0, 0);
}

#demo .carousel-control-prev, #demo .carousel-control-next {
  position: absolute;
  top: 0;
  bottom: 0;
  z-index: 1;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 15%;
  color: #fff;
  text-align: center;
  opacity: 0.5;
  -webkit-transition: opacity 0.15s ease;
  -o-transition: opacity 0.15s ease;
  transition: opacity 0.15s ease;
}
#demo .carousel-control-next-icon, #demo .carousel-control-prev-icon {
  display: inline-block;
  width: 20px;
  height: 20px;
  background: transparent no-repeat center center;
  background-size: 100% 100%;
}








/* College Info Starts Here */
#college {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 15px;
  margin-right: 00%;
}
#college-info {
  margin-left: 2%;
  
  width: 165%;
  padding: 35px;
  background:  #dfdfdf;
  border-radius: 150px 20px;
  color: black;

}
#youtube {
  justify-content: center;
  margin-left: 12%;
  padding-left:1.5%;
  width: 83%;
  padding-top: 4%;
  background: #dfdfdf;
    border-radius: 20px;
    overflow: hidden;
    position: relative;
  
  }

#iframe{
  margin-right: 00%;
   
}


@media only screen and (max-width: 600px) {
  #college {
    display: flex;
    flex-direction: column;
  }
  #college-info {
    width: 100%;
  }
  #youtube {
    width: 100%;
    margin-left: 0;
  }
  .chair-image {
    width: 100%;
    text-align: center;
  }
  .chair-image img {
    width: 80%;
  }
}
/* Our Programs Starts Here */



.container-fostrap {
  padding: 15px;
}

.content {
  width: 100%;
  padding: 15px;
}

.card {
  border-radius: 5px;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
  background-color: #fff;
  margin-bottom: 30px;
  -webkit-transition: box-shadow 0.5s;
  -moz-transition: box-shadow 0.5s;
  -o-transition: box-shadow 0.5s;
  transition: box-shadow 0.5s;
}

.card:hover {
 box-shadow: 0 8px 17px 0 rgba(71, 3, 244, 0.2), 0 6px 20px 0 rgba(38, 1, 248, 0.19);
 transform: scale(1.1);
 transition: ease-in-out 0.5s;
 background-color: #3395eb;
}

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

.card-content {
  padding: 15px;
  border-radius: 6px;
  border: 1px solid #e8e8e8;
  background-color: #f8f8f8;
}

.card-title {
  font-size: 14px;
  margin: 0px;
  padding: 5px;
}

.card-read-more {
  padding: 7px;
  text-align: center;
  border-radius: 6px;
  border: 1px solid #345ca4;
  background-color: #345ca4;
}

.card-read-more a {
  font-size: 14px;
  font-weight: 400;
  text-transform: uppercase;
  color: #e4eaed;
  padding-bottom: 4px;
}
.card-read-more a:hover{
  color: white  ;

}
.img-card {
  width: 100%;
  border-radius: 10px;
}

.card-title {
  font-size: 16px;
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: 0.2px;
  text-align: center;
  color: #333;
  padding-bottom: 8px;
}


.btn-link {
  color: #333;
  font-size: 14px;
  font-weight: 500;
  padding: 8px;
  border-radius: 4px;
  border: 0;
  background: none;
  text-align: center;
}

.container-fostrap img{
  height: 180px;
}

/* upcoming event */
.upcoming_events_box {
  overflow-x: hidden;
  overflow-y: auto;
  max-height: 800px;
  background-color: #b5e0f6;
  border-radius: 3px;
}

.upcomingEvent {
  overflow-x: hidden;
  overflow-y: auto;
  max-height: 400px;
}

.upcoming_events_con h2{
  color: #345ca4;
  animation: flash 1s infinite 3 alternate-reverse both;
}

.upcomingEvent a{
  color: purple;
}


/* Newsletter starts here */


.sticky-board h3 {
  font-weight: bold;
  font-size: 2rem;
}
.sticky-board p {
  font-size: 1rem;
  font-weight: normal;
}
.sticky-board ul,li{
  list-style:none;
}
.sticky-board ul{
  display: flex;
  flex-wrap: wrap;
  justify-content: left;
}

.sticky-board ul li a{
  text-align: left;
  text-decoration:none;
  color:#000;
  background:rgb(139, 139, 5);
  display:block;
  height:10em;
  width:10em;
  padding:1em;
}
.sticky-board ul li{
  margin:1em;
}

.sticky-board{
  width: 80%;
  background-color: rgba(0, 0, 0, 0.12);
  background-image: repeating-linear-gradient(36deg, rgba(120, 9, 255, 0.1), rgba(59, 24, 237, 0.1) 1px, transparent 0px, transparent 2px), url(../images/GeneralImages/blue.jpeg);
  margin-left: 10%;
  border-radius: 6px;
  margin-bottom: 5%;

}
.sticky-board ul li a{
  text-decoration:none;
  color:#000;
  background:rgb(186, 186, 0);
  display:block;
  height:10em;
  width:10em;
  padding:1em;
  box-shadow: 5px 5px 7px rgba(33,33,33,.7);
}

.sticky-board ul li:nth-child(even) a{
  transform:rotate(4deg);
  position:relative;
  top:5px;
}
.sticky-board ul li:nth-child(3n) a{
  transform:rotate(-3deg);
  position:relative;
  top:-5px;
}
.sticky-board ul li:nth-child(5n) a{
  transform:rotate(5deg);
  position:relative;
  top:-10px;
}

.sticky-board ul li a:hover,ul li a:focus{
  box-shadow:10px 10px 7px rgba(0,0,0,.7);
  transform: scale(1.25);
  position:relative;
  z-index:5;
}
:root {
  --crsl-bg: transparent;
  --box-bg: #1e272e;
  --box-shadow: #0000001c;
  --box-shadow-border: #0000000f;
  --box-border: #fff;
}


:root {
  --marquee-width: 100vw;
  --marquee-height: 25vh;
  --marquee-elements: 12; 
  --marquee-elements-displayed: 5;
  --marquee-element-width: calc(
    var(--marquee-width) / var(--marquee-elements-displayed)
  );
  --marquee-animation-duration: calc(var(--marquee-elements) * 3s);
}


.recruiter .marquee {
  width: var(--marquee-width);
  height: var(--marquee-height);
  background-color: #ffffff;
  color: #eee;
  overflow: hidden;
  position: relative;
}
.recruiter .marquee:before,
.marquee:after {
  position: absolute;
  top: 0;
  width: 10rem;
  height: 100%;
  content: "";
  z-index: 1;
}
.recruiter .marquee:before {
  left: 0;
  background: linear-gradient(to right, #ffffff 0%, transparent 100%);
}
.recruiter .marquee:after {
  right: 0;
  background: linear-gradient(to left, #ffffff 0%, transparent 100%);
}
.recruiter .marquee-content {
  list-style: none;
  height: 100%;
  display: flex;
  animation: scrolling var(--marquee-animation-duration) linear infinite;
}
.recruiter .marquee-content:hover {
  animation-play-state: paused;
} 

 @keyframes scrolling {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(
      calc(-1 * var(--marquee-element-width) * var(--marquee-elements))
    );
  }
}
.recruiter .marquee-content li {
  display: flex;
  justify-content: center;
  align-items: center;
  /* text-align: center; */
  flex-shrink: 0;
  width: var(--marquee-element-width);
  max-height: 100%;
  font-size: calc(var(--marquee-height) * 3 / 4); /* 5rem; */
  white-space: nowrap;
  border: none;
}

.recruiter .marquee-content li img {
  width: 100%;
  /* height: 100%; */
  border: 2px solid #eee;
}

@media (max-width: 600px) {
  html {
    font-size: 12px;
  }
  :root {
    --marquee-width: 100vw;
    --marquee-height: 16vh;
    --marquee-elements-displayed: 3;
  }
  .recruiter .marquee:before,
 .recruiter .marquee:after {
    width: 5rem;
  }
}


@media only screen and (max-width: 600px) {
  :root {
    --marquee-width: 80vw;
    --marquee-height: 16vh;
    --marquee-elements-displayed: 3;
  }
  .marquee {
    width: var(--marquee-width);
    height: var(--marquee-height);
  }
  .marquee:before,
  .marquee:after {
    width: 5rem;
  }
  .marquee-content li {
    font-size: calc(var(--marquee-height) * 3 / 4);
  }
  .marquee-content li img {
    width: 100%;
  }
}

/*******************************/
.footer {
  position: relative;
  margin-top: 45px;
  padding-top: 90px;
  background: #345ca4;
  color: #ffffff;
  font-weight: 300;
}

.footer .footer-contact,
.footer .footer-link,
.footer .footer-form {
  position: relative;
  margin-bottom: 45px;
}

.footer .footer-contact h2,
.footer .footer-link h2,
.footer .footer-form h2{
  position: relative;
  margin-bottom: 30px;
  font-size: 20px;
  font-weight: 400;
  color: #fefefe;
  text-transform: uppercase;
  letter-spacing: 1px;
}

.footer .footer-contact p {
  font-size: 14px;
}

.footer .footer-contact p i {
  width: 25px;
}

.footer .footer-social {
  position: relative;
  margin-top: 25px;
}

.footer .footer-social a {
  display: inline-block;
}

.footer .footer-social a i {
  margin-right: 15px;
  font-size: 25px;
  color: #ffffff;
}





.footer .footer-link a {
  display: block;
  margin-bottom: 10px;
  font-size: 14px;
  color: #ffffff;
  
}

.footer .footer-link a::before {
  position: relative;
  content: "\f0da";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  margin-right: 10px;
}

.footer .footer-link a:hover {
  color: #e0e810;
}

.footer .footer-form input {
  height: 45px;
  font-size: 14px;
  border: none;
  border-radius: 5px;
}

.footer .footer-form .btn {
  position: absolute;
  right: 5px;
  bottom: 5px;
  font-size: 14px;
  font-weight:400;
  text-transform: uppercase;
  color: #000000;
  background: #FFD662;
  border-radius: 5px;
  transition: .3s;
}

.footer .footer-form .btn:hover {
  color: #ffffff;
  background: #00539C;
}

.footer .footer-menu {
  position: relative;
  padding: 15px 0;
  border-top: 1px solid rgba(255, 255, 255, .1);
}

.footer .footer-menu .f-menu {
  font-size: 0;
  text-align: center;
}

.footer .footer-menu .f-menu a {
  color: #ffffff;
  font-size: 14px;
  margin-right: 15px;
  padding-right: 15px;
  border-right: 1px solid #ffffff;
}

.footer .footer-menu .f-menu a:hover {
  color: #FFD662;
}

.footer .footer-menu .f-menu a:last-child {
  margin-right: 0;
  padding-right: 0;
  border-right: none;
}


.footer .copyright {
  padding: 15px 10px;
  border-top: 1px solid rgba(255, 255, 255, .1);
}

.footer .copyright p {
  margin: 0;
  font-size: 14px;
}

.footer .copyright .col-md-6:last-child p {
  text-align: right;
}

.footer .copyright p a {
  color: #faf208;
  font-weight: 400;
}

.footer .copyright p a:hover {
  color: #ffffff;
}

@media (max-width: 768px) {
  .footer .copyright p,
  .footer .copyright .col-md-6:last-child p {
      margin: 5px 0;
      text-align: center;
  }
}


/* Management page styling starts here */
#management {
  /* display: grid; */
  width: 80%;
  justify-content: center;
  margin-left: 8%;
  /* background: linear-gradient(rgb(240, 243, 244), rgba(133, 135, 135, 0.5), rgb(171, 172, 174)), url(./images/GeneralImages/Screenshot_20230209_021129.png); */

}
#management-info {
  margin-left: 2.5%;
  width: 100%;
  padding: 20px;
  background: rgba(52, 92, 164, 0.8);
  border-radius: 5px;
  color: white;
}

.founder-image img{
  padding-left: 5%;
}

/* Fixed/sticky icon bar (vertically aligned 50% from the top of the screen) */
#admission-btn {
  z-index: 999;
  padding: 5px;
  position:fixed;
  /* top: 50%; */
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  right: 0;
  rotate: 90;
}

/* Style the icon bar links */
.icon a {
  justify-content: center;
  margin-bottom: 2px;
  display: inline;
  /* float: right; */
  text-align: center;
  padding:5px 5px;
  transition: all 0.3s ease;
  color: #000;
  font-size: 22px !important;
  border-radius: 10px;
  /* background: transparent; */
}

/* Style the social media icons with color, if you want */
/* .icon a:hover {
  background-color: rgba(0, 0, 0, 0.8);
} */

.facebook:hover {
  background: rgba(59,89,152,0.7);
  color: white;
}

.twitter:hover {
  background: rgba(85,172,238,0.7);
  color: white;
}

.google:hover {
  background: rgba(221,75,57,0.7);
  color: white;
}

.linkedin:hover {
  background: rgba(0,123,181,0.7);
  color: white;
}

.youtube:hover {
  background: rgba(187,0,0,0.7);
  color: white;
}
.instagram:hover{
  background: rgba(255,0,255,0.7);
  color: white;
}
.icon {
  position:relative;
}









/*dark :  #001E62; navbar-light: #759DF9; light: #1858EC */
#ac-wrapper {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, .6);

    z-index: 1001;

}
#popup {
    border-radius: 10px;
    -webkit-box-shadow: 0px 2px 300px 46px rgba(219,213,31,1);
  -moz-box-shadow: 0px 2px 300px 46px rgba(219,213,31,1);
  box-shadow: 0px 2px 300px 46px rgba(219,213,31,1);
    position: relative;

}
.mockexam{
    z-index: 9999;
    position: fixed;
    left: 20px;
    top: 40%;
    font-size: smaller;
    background-color: transparent;
  }

.social{
    z-index: 9999;
    position: fixed;
    right: -20px;
    top: 60%;
    transform: translate(0%,-50%);
    width: 80px;
    height: 250px;
    background-color: transparent;
  }
.socialnetwork{
    position: relative;
    width: 100%;
    height: 50px;
    padding: 10px;
    border: none;
    transform: translateX(5px);
}
.socialnetwork:hover{
  transition: 0.5s;
 transform: translateX(-10px)
}
.course{
    transform: scale(0.9);

}
@media (max-width: 768px) {
   .collegelogo{ margin: 2px; padding: 0px; width: 300px; }
   .textnotifcation{font-size: 8px;}
   .h3text{font-size:13px; }
   .h4text{font-size:12px; }
   .social a  button{width: 40px; height: 40px; right: -20px;}
   .admissiontext{font-size: 16px;}
   .slideshowheader .headerquotes{font-size: 20px;}
   .slideshowheader{width: 100%; height:30vh;}
   .slideshowheader2 .img1{width: 100%; height:35vh;}
   .workingteam{display: none;}
   #courses1 h4{font-size: 15px;}
   #courses1 h6{font-size: 12px;}
   #courses1 a h6{font-size: 8px;}
   #departmentlist li button{ font-size: 8px;}
   .department22{height: 40px;}
   #departmentlist li h2{ font-size: 9px; margin-top: 30px;}
   #departmentdetail li .container h2 strong{ font-size: 25px;}
   #bggg{font-size: 25px;}
}
@media (min-width:768px) {

   #bggg{font-size: 40px;}
  .slideshowheader .headerquotes{font-size: 50px;}
}



@media (max-width: 767px) and (max-width: 991px){
    .textme{display: none;}
    .extraevent{display: none;}

    .eventimg{display: none;}
    #event{background-size: 0%;}
    #requiters{display: none;}
    #team{background-size: 0%;}
    #courses{background-size: 0%;
    }

    }

#event{
  background-image: url(../../img/event.svg);
  background-position: right;
  background-repeat: no-repeat;
  background-size: 100%;
}
#back{
  background-image: url(../../img/background.svg);

  background-size: 100%;
}
#courses{
  background-image: url(../../img/coursec.svg);
  background-position: left;
  background-repeat: no-repeat;
  background-size: 100%;


}
#team{
  background-image: url(../../img/team.svg);
  background-position: right;
  background-repeat: no-repeat;
  background-size: 100%;


}
#kkkk{
background-image: url(../../img/bg1.svg);
background-position: left;
background-size: 100%;
background-repeat: no-repeat;

}
#requiters{
background-image: url(../../img/requiters3.svg);
background-position: left;
background-size: 90%;
background-repeat: no-repeat;
}


  .custom-toggler{background-color: #001E62; border-color: white;}
  .nav-item{
    padding-left: 7px;
    padding-right: 7px;
  }
  .nav-link{
    color: white;
  }
  .nav-link:hover{
    background-color: #001E62;
    color:white;
  }
  .active{
    background-color: #001E62;
    color:white;
  }
  .dropdown-menu{
    background-color: #759DF9;
  }
  .dropdown-item{color: white;}
  .dropdown-item:hover{background-color: #001E62;color:white;}



#l{
    transform-origin: bottom;animation: round 6s linear infinite;height: 3px; width:100%; background-color: #1858EC;}
@keyframes round {
    16% { transform: scale(0);}
    32% { transform: scale(0.3); }
    48% {transform: scale(0.6); }
    64% {transform: scale(1); }
    80% {transform: scale(0.7); }

}

.course:hover {
    display: block;
    transition: 0.5s;
    transform: scale(1);
}

.course{
  transition: 0.5s;

    transform: scale(0.9);
    background-color: white;
}
.devp:hover {

    display: block;
    transition: 0.7s;
    transform: scale(1);
    border-radius: 20px;

}

.devp{
  transition: 0.7s;

    transform: scale(0.9);
    background-color:#f2f3f7;
}
.line{
    animation: app 3s linear infinite;
}
@keyframes app{
    16% { transform: scale(0);}
    32% { transform: scale(0.3); }
    48% {transform: scale(0.6); }
    64% {transform: scale(1); }
    80% {transform: scale(0.7); }
}

.course:hover {
    display: block;
    transition: 0.5s;
    transform: scale(1);
}
hr.solid {
    border-top: 1px solid #999;
}
.event:hover{
  text-decoration: none;
    transition: 0.5s;
    transform: scale(1.05);
}
.event{
  transition: 0.5s;

}
#footer a{
    color: white;
}

.slideshow{
    margin: 4% auto;
    width: 100%;
    height: 130px;
    overflow: hidden;
    position: relative;
    perspective: 1000px;


}
  .carousel1{
  width: 100%;
  height: 100%;
  position: absolute;
  transform-style: preserve-3d;
  animation: rotate 50s infinite linear
  }
  .carousel1:hover{
    animation-play-state: paused;
  }

.carousel1 .slide{
text-align: center;
justify-content: center;
display: block;
position: absolute;
width: 100%;
height: 100%;
overflow: hidden;


  }
  .carousel1 .slide:nth-child(1){transform: rotateY(0deg) translateZ(280px);}
  .carousel1 .slide:nth-child(2) { transform: rotateY(40deg) translateZ(280px);}
  .carousel1 .slide:nth-child(3) { transform: rotateY(80deg) translateZ(280px);}
  .carousel1 .slide:nth-child(4) { transform: rotateY(120deg) translateZ(280px);}
  .carousel1 .slide:nth-child(5) { transform: rotateY(160deg) translateZ(280px);}
  .carousel1 .slide:nth-child(6) { transform: rotateY(200deg) translateZ(280px);}
  .carousel1 .slide:nth-child(7) { transform: rotateY(240deg) translateZ(280px);}
  .carousel1 .slide:nth-child(8) { transform: rotateY(280deg) translateZ(280px);}
  .carousel1 .slide:nth-child(9) { transform: rotateY(320deg) translateZ(280px);}



  .carousel1 .slide  img{
    width: 180px;
    height: 80px;
    cursor: pointer;
    transition: all .5s ease;
    border: solid 2px #001E62;
    -webkit-box-shadow: 2px 5px 2px 0px rgba(129, 127, 127, 0.75);

    }
.carousel1 .slide img:hover{

     transform: scale(1.1,1.1);
    }

@keyframes rotate{
   from{
       transform: rotateY(0deg);
   }
   to{
       transform: rotateY(-360deg);
   }
}



.slide1, .slide2, .slide3, .slide4{
    position: absolute;
    height: 500px;
    width: 100%;
    overflow: hidden;
    background: rgba(76, 175, 80, 0.1);
}
.img1{
    position: relative;
    width: 100%;
    height: 80vh;
    
    animation: slide 8s linear infinite;
}
@keyframes slide{
    25%{
        transform: translateX(10px);
    }
    50%{
        transform: scale(1.1);
    }
    75%{
        transform: scale(1);
    }
    100%{
        transform: translateY(-20px);
    }

}
.slide1{
    animation: slide1 32s linear infinite;
}
.slide2{
    animation: slide2 32s linear infinite;
}
.slide3{
    animation: slide3 32s linear infinite;
}
.slide4{
    animation: slide4 32s linear infinite;
}
@keyframes slide1{
    0%{
        visibility: visible;
    }
    25%{
        visibility: hidden;
    }
    50%{
        visibility: hidden;
    }
    75%{
        visibility: hidden;
    }
    100%{
        visibility: hidden;
    }
}
@keyframes slide2{
    0%{
        visibility: hidden;
    }
    25%{
        visibility: visible;
    }
    50%{
        visibility: hidden;
    }
    75%{
        visibility: hidden;
    }
    100%{
        visibility: hidden;
    }
}
@keyframes slide3{
    0%{
        visibility: hidden;
    }
    25%{
        visibility: hidden;
    }
    50%{
        visibility: visible;
    }
    75%{
        visibility: hidden;
    }
    100%{
        visibility: hidden;
    }
}
@keyframes slide4{
    0%{
        visibility: hidden;
    }
    25%{
        visibility: hidden;
    }
    50%{
        visibility: hidden;
    }
    75%{
        visibility: visible;
    }
    100%{
        visibility: hidden;
    }
}
@keyframes slide1{
    0%{
        visibility: hidden;
    }
    25%{
        visibility: hidden;
    }
    50%{
        visibility: hidden;
    }
    75%{
        visibility: hidden;
    }
    100%{
        visibility: visible;
    }
}
.navbar-nav li:hover > ul.dropdown-menu {
    display: block;
}
.dropdown-submenu {
    position:relative;
}
.dropdown-submenu>.dropdown-menu {
    top: 0;
    left: 100%;
    margin-top:-6px;

}

/* rotate caret on hover */

#hod-profile,#syllabus,#pospeos,#labdetail,#vm,#research,#faculty,#dlocking,#gearlever,#other,#moim,#ss,#wo,#poa,#iqacc,#function1,#goalso,#student{
  display: none;
 
}
#introduction{
  display: block;
}
.pp ul li button{
  font-size: 10px;
  font-family:serif;
  font-weight: bold;


}
.actived{
  background-color: yellow;
  border: none;

}

#imgcomp{
background-image: url('../../img/computere.jpg');
background-position: center;
width: 100%;
height: 400px;
position: absolute;
background-size: cover;
background-repeat: no-repeat;
}
#imgiqac{
background-image: url('../../img/iqac/iqac.jpg');
background-position: center;
width: 100%;
height: 400px;
position: absolute;
background-size: cover;
background-repeat: no-repeat;
}
#imgworkshop{
background-image: url('../../img/workshop/workshop.jpg');
background-position: center;
width: 100%;
height: 400px;
position: absolute;
background-size: cover;
background-repeat: no-repeat;
}
#alumnibac{
  background-image: url('../../img/alumni/alumni.jpg');
  background-position: center;
  width: 100%;
  height: 400px;
  position: absolute;
  background-size: cover;
  background-repeat: no-repeat;

}
#imglibrary{
  background-image: url('../../img/library/library1.jpg');
  background-position: center;
  width: 100%;
  height: 400px;
  position: absolute;
  background-size: cover;
  background-repeat: no-repeat;

}
#imgetc{
  background-image: url('../../img/e_tc-lab/e_tc.jpg');
  background-position: center;
  width: 100%;
  height: 400px;
  position: absolute;
  background-size: cover;
  background-repeat: no-repeat;

}
#imgmech{
  background-image: url('../../img/mech-lab/mechb.jpg');
  background-position: center;
  width: 100%;
  height: 400px;
  position: absolute;
  background-size: cover;
  background-repeat: no-repeat;

}
#imgcivil{
  background-image: url('../../img/civil-lab/civilb.jpg');
  background-position: center;
  width: 100%;
  height: 400px;
  position: absolute;
  background-size: cover;
  background-repeat: no-repeat;

}
#imgfe{
  background-image: url('../../img/fe-lab/feback.jpg');
  background-position: center;
  width: 100%;
  height: 400px;
  position: absolute;
  background-size: cover;
  background-repeat: no-repeat;

}



#burst{
     background: #f09e07;
     top: 50px;
     right: 35px;
     width: 170px;
     height: 170px;
     position: relative;
     text-align: center;
   }
   #burst:before,
   #burst:after {
     content: "";
     position: absolute;
     top: 0;
     left: 0;
     height: 170px;
     width: 170px;
     background: #f09e07;
   }
   #burst:before {
     transform: rotate(30deg);
   }
   #burst:after {
     transform: rotate(60deg);
   }

 .collegelogo{ margin: 2px; padding: 0px; width: 300px; }
   .textnotifcation{font-size: 8px;}
   .h3text{font-size:13px; }
   .h4text{font-size:12px; }
   .social a  button{width: 40px; height: 40px; right: -20px;}
   .admissiontext{font-size: 16px;}
   .slideshowheader .headerquotes{font-size: 20px;}
   .slideshowheader{width: 100%; height:30vh;}
   .slideshowheader2 .img1{width: 100%; height:35vh;}
   .workingteam{display: none;}
   #courses1 h4{font-size: 15px;}
   #courses1 h6{font-size: 12px;}
   #courses1 a h6{font-size: 8px;}
   #departmentlist li button{ font-size: 8px;}
   .department22{height: 40px;}
   #departmentlist li h2{ font-size: 9px; margin-top: 30px;}
   #departmentdetail li .container h2 strong{ font-size: 25px;}
   #bggg{font-size: 25px;}




   #alumnibac{
    background-image: url('../../img/alumni/alumni.jpg');
    background-position: center;
    width: 100%;
    height: 400px;
    position: absolute;
    background-size: cover;
    background-repeat: no-repeat;
  
  }