@import url('https://fonts.googleapis.com/css?family=Open+Sans&display=swap');
@import url('https://fonts.googleapis.com/css?family=Roboto:300&display=swap');
html, body{
  font-family: 'Open Sans', sans-seri;
}
.navbar-toggler{
  width: 47px;
  height: 34px;


}

.navbar-toggler .line{
    width: 100%;
    float: left;
    height: 2px;
    background-color: #24aeff;
    margin-bottom: 5px;
}

.navbar {
    padding: 0.6rem;
    background-color: #000000;
}
.navbar-brand
{
  padding-top: 20px;
}
.navbar-dark{
  background-color: : #000000;
}

.navbar-nav li {
padding-right: 18px !important;
padding-top: 20px;
}

.nav-link {
  font-size: 0.82em ! important;
  letter-spacing: 0.8px;
  color: #ffffff;
  font-family: 'Open Sans', sans-serif;
  font-weight: 520;
  transition: all 0.3s ease-in-out;

}

.imageSection{

padding-top:40px;
}

.dropdown-menu{

  background-color: #000000;
  border-radius: 0;
  text-align: left;
  transform:translateY(14px);


}

.dropdown-item{
  padding: 10px;
  font-size: 0.82em ! important;
  letter-spacing: 0.8px;
  color: #ffffff;
  font-family: 'Open Sans', sans-serif;
  font-weight: 520;
  transition: all 0.3s ease-in-out;
}

.dropdown-menu a:hover{
  color: #24aeff;
  transition: all 0.25s ease-in-out;
  background-color: #040404;


}

.nav-link:hover {
  color: #24aeff;
  transition: all 0.25s ease-in-out;
}


.carousel-inner img{
width: 100%;
height:100%;

}





.carousel-caption h1{
  font-size: 4.5vw;
  font-family: 'Open Sans', sans-serif;
  font-weight: 520;
  text-shadow:1px 1px 15px #000;


}

.carousel-caption h3{
  font-family: 'Open Sans', sans-serif;
  font-size: 150%;
  font-weight: 520;
  text-align: left;
  transform: translateY(-6px);
  letter-spacing: 4.6px;
  padding-top: 6px;
  padding-bottom: 10px;

}

.btn-primary{
  background-color: #24aeff;
  border-radius: 35px;
  font-family: 'Open Sans', sans-serif;
  font-weight: 520;
  font-size: 0.82em;
  border-spacing: 20px;
  border: none;




}





/*Welocme Animation*/
.carousel-caption h1{
  animation-name: textanimation;
  animation-duration: 2.6s;

}

/*To the labortary Animation*/

.carousel-caption h3{
  animation-name: textanimation1;
  animation-duration: 2.6s;
}

.carousel-caption{
  margin-bottom: 10%;

}

.btnanimataed{
  animation-name: textanimationbutton;
  animation-duration: 2.6s;
}


@keyframes textanimation {
  0%  {color: rgba(255, 255, 255, 0.0);transform: translateY(-20px);}
  15% {color: rgba(255, 255, 255, 1);transform: translateY(20px);}


}

@keyframes textanimation1 {
  0%  {color: rgba(255, 255, 255, 0.0);transform: translateY(0px);}
  15% {color: rgba(255, 255, 255, 1);transform: translateY(8px);}

}

@keyframes textanimationbutton {
  0%  {color: rgba(255, 255, 255, 0.0);transform: translateY(-8px);background-color:rgb(0, 0, 0, 0); }
  15% {color: rgba(255, 255, 255, 0.0);transform: translateY(8px);background-color: rgb(0, 0, 0, 1);}
}


.padding{
  padding-bottom: 2rem;
}

.topic{
  margin: 0 auto;
  padding-top: 4rem;

}


.profileImage{

  width: 150px;
  height: 150px;

}

#lineSeparator{
  margin-top: 40px;
  color: #24aeff;
  border-color: #bfbfbf;
}

#imgfish{
  padding-top: 40px;
}

#imgfish1{
  transform
}

#blueText{
  color: #24aeff;
}

.firstMemeber{
  margin-top: 55px;
}


.welocme2 h2{
  font-family: 'Open Sans', sans-serif;
  font-weight: 500;
  padding-bottom: 0px;

}

.lead {
  width: 100%;
  margin: 0 auto;
  padding-top: 2rem;
  font-family: 'Roboto', sans-serif;
  font-size: 110%;
  line-height:35px;

}
.img1 img{
  padding-left:100px;
}

.para {

  width: 80%;
  margin: 10px;
  padding-top: 0.1rem;
  font-family: 'Roboto', sans-serif;
  font-size: 110%;
  line-height:35px;
}


.headTopic{
  width: 80%;
  margin: 10px;
  padding-top: 0.1rem;
  font-family: 'Roboto', sans-serif;
  font-size: 26px;
}

.buttonunder{
  padding-left:10px;
}

.headTopic{
  font-family: 'Open Sans', sans-serif;
  font-weight: 500;
}

.row{
  padding-top: 45px;
}


.coverimage{

  margin: 10px;
  background-size: cover;
  background-image: url("campusimage.png");

}


.box{
  background-color: white;
  padding: 30px;
  background: rgba(255, 255, 255, 0.7);
  margin-bottom: 40px;
  margin-right: 10px;
}


.btnmol{
  color:#24aeff;
  background: rgba(255, 255, 255, 0.0);
  border: none;
  font-size: 20px;
  padding: 6px;
  transform: translateY(-4px);
}


#bluefonts{
  color: #24aeff;
}

#addressuni{
  margin-top: 54px;
  margin-left:  150px;
}

.middletext{
  padding-left: 0px;

}

.footernew {
  font-family: 'Open Sans', sans-serif;
  font-size: 90%;
  font-weight: 400;
  margin-top: 40px;
  padding-top: 20px;
  background-color: #1f1f1f;
  color: #b0b0af;
  text-align: justify;

}

.btnmol:hover {
  color: #146697;
  transition: all 0.1s ease-in-out;

}

.Vertical1{
  border-left:1px solid yellow;
  height: 18px;
}

/* mobile device responsive */
@media (max-width: 456px) {



  .imageSection{
    padding-top:20px;
  }

.carousel-item{
  width: 300%;
  transform: translateX(-32.8%);
}

.imgq{

}

.carousel-caption{
  transform: translateY(-40px);
}

.firstsec{
  text-align: center;
}
.middletext{
  text-align: center;
  padding-left: 0px;
}

.unicorn-designer{
  text-align: center;
  margin-top: 50px;
  padding-bottom: 0px;
}


#addressuni{
  text-align: center;
  margin-top: 10px;
  margin-left:  0px;
}



  }

  @media (min-width: 456px) and (max-width:989.98px){
  .firstsec{
    text-align: center;

  }

  .middletext{
    text-align: center;
    padding-left: 0px;
  }

  .unicorn-designer{
    text-align: center;
    margin-top: 50px;
    padding-bottom: 0px;
  }


  #addressuni{
    text-align: center;
    margin-top: 10px;
    margin-left:  0px;
  }

  }




#yellowfonts
{
  color: yellow;
  b49646
}



.makeaddress{
padding-right: 40px;

}


.midddle{
  padding-top: 10px;
}



.footernews{
  font-size: 90%;
  font-weight: 400;
  margin-top: 40px;
  padding-top: 20px;
  background-color:#1a1a1a;
  text-align: center;
  color: #1e1e1e;
}


.unicorn-designer{
text-align: center;
margin-top: 50px;
padding-bottom: 30px;
}
/*
.vertical{
  border-left: 0.4px solid gray;
  height: 148px;
  background-color: ;*/


}




 }