@import url('https://fonts.googleapis.com/css?family=Raleway:300,400,700');
@import url("https://fonts.googleapis.com/css?family=Metal+Mania");

@font-face {
    font-family: "Booter - Zero Zero";
    src: url("Fonts/Booter - Zero Zero.woff") format("woff"),
         url("Fonts/Booter - Zero Zero.woff2") format("woff2");
    font-weight: normal;
    font-style: normal;
}

* {
    box-sizing: border-box;
    font-family: Raleway;
    
}
html{
  scroll-behavior: smooth;
  overflow-y: scroll;
}
html,body {
  margin: 0;
  padding: 0;
  width: 100%;
}
body {
  font-family: 'Montserrat', sans-serif;
   padding-top: 50px;
     background-color: #f0f0f0;
}

.parallax {
          /* The image used */
          background-image: url("../img/w.jpg");

          /* Set a specific height */
          min-height: 350px; 

          /* Create the parallax scrolling effect */
          background-attachment: fixed;
          background-position: center;
          background-repeat: no-repeat;
          background-size: cover;
          
        }
        .parallax2 {
          /* The image used */
          background-image: url("../img/bg2.png");

          /* Set a specific height */
          min-height: 350px; 

          /* Create the parallax scrolling effect */
          background-attachment: fixed;
          background-position: center;
          background-repeat: no-repeat;
          background-size: cover;
          
        }
        .parallax3 {
          /* The image used */
          background-image: url("../img/bg4.jpg");

          /* Set a specific height */
          min-height: 350px; 

          /* Create the parallax scrolling effect */
          background-attachment: fixed;
          background-position: center;
          background-repeat: no-repeat;
          background-size: cover;
          
        }
        .dropdown-item{
          margin: 5%;
        }

#navbar {
  overflow: hidden;
  background-color: #f0f0f0;
  align-items: center;
  z-index: 1;
  padding-left: 300px;

}

#navbar a {
  float: left;
  display: block;
  color: black;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 17px;
}

#navbar a:hover {
  background-color: #ddd;
  color: black;
}

.sticky {
  position: fixed;
  top: 0;
  width: 100%;
}

.sticky + .content {
  padding-top: 60px;
}

        	.card-con{margin-top: 70px;}

        	
        	
        	section{
        		padding: 7em;
        		height: calc(100vh - 14em);
        	}
        	.content2 {
	width: 90%;
	margin: 4em auto;
	font-size: 15px;
	line-height: 30px;
	text-align: justify;
	color: white;
	font-family: Montserrat;
	
}

        	
        	.welcome-page{
        		height: 100vh;
        		width: 100%;
        		text-align: center;
        		
        		
        	}
        	.group-leader{
        		height: 100%;
        		width: 100%;
        		text-align: center;
        		
        	}
        	.member{
        		
        		height: 100%;
        		width: 100%;
        		text-align: center;
        	}
        	#sec1{background-color:#ccc;}
        	#sec2{background-image: linear-gradient(to right, #4facfe 0%, #00f2fe 100%);}
        	#sec3{background-color:#fcf; color: white;}
        	#sec4{background-image: linear-gradient(to top, #5ee7df 0%, #b490ca 100%);color: white;}
        	#sec5{ color: white;}
        	#sec6{background-image: linear-gradient(120deg, #84fab0 0%, #8fd3f4 100%); color: white;}



dd {
  font-size: 15px;
}
dd a:hover{
text-decoration: none;
color: skyblue;
}

nav
{
  box-shadow:4px 10px 10px rgba(0, 0, 0, .1);
  text-transform: uppercase;
  font-style: bold;
  font-family: 'Montserrat', sans-serif;
  background-color: rgba(255, 255, 255, 0.9);
  height: 70px;
}

nav ul li{
  padding-right: 30px;
}
.content {
  width: 90%;
  margin: 4em auto;
  font-size: 15px;
  line-height: 30px;
  text-align: justify;
  color: white;
  font-family: Quicksand;
}
nav .bar::before{
  content: '';
  display: block;
  height: 5px;
  background: rgb(216, 57, 84);
  border-radius: 100%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  transform: scale(0,1);
  transition: transform ease-in-out 250ms;
}
nav .bar:hover::before{
 transform: scale(1,1);
}
.pe{margin-top: 100px;}

.sb1{
  font-size: 25px;

}
.sb:hover{
  
  border-radius: 30%;
  background-color: #f0f0f0;

}
.btn-right {
  position: relative;
  left: 90%;
}
.footer-o {
  
  
  color: white;
  background-color: #f9f9f9;
  
}
.clr-f {
  color: black;
  font-weight: 800;
}

.ftr-header {
  margin-bottom: 20px;
}

.ftr-des {
  padding: 20px 20;
}
.inp-s {
  width: 59%;
}
.ftr-last {
  padding: 20px;
  margin-top: 20px;
}
.b{
 color: black;
}
.w{
 color: white;
}

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

.dropdown>.dropdown-toggle:active {
  /*Without this, clicking will make it sticky*/
    pointer-events: none;
}
.shadowimg{
  box-shadow:0px 10px 10px rgba(0, 0, 0, .1);
}
.shadowc{
  box-shadow:0px 10px 10px rgba(0, 0, 0, .1);
}

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

 .navbar-brand span {
  display: none;
}
.navbar-brand:after {
  content: ' N C W-H';
}
  #nav{background-color: rgba(255, 255, 255, 0.9);
    height: 130px;

  }
#navbarNavDropdown{background-color: rgba(255,255,255,1); border-radius: 0px 0px 5px 5px;}

#card-filter{text-align:center;box-shadow:4px 10px 10px rgba(0, 0, 0, .1);transition: width 1s, height 1s, transform 1s;border-radius: 15px; margin: 15px;}
#card102{box-shadow:4px 10px 10px rgba(0, 0, 0, .1);transition:opacity .5s ease-in-out;height:35vh;width:60vw;border-radius: 15px;margin-left: 65px; margin-top: 100px;margin-bottom: 200px;}
#crousel1{
  margin-top: 150px;
}
.dropdown-item{
  margin: 0%;
  padding: 0%;
}
a.navbar-brand{
  font-size: 16px;
}
#cardrow{
  margin-left: 2%;
}
#mwk{
  margin-top: 50px;
}
#navbar a{
  display: none;
}
.img-m
{
  height: 200px;
  width: 200px;
}
.content2
{
 
  font-size: 12px;
  text-align: justify;
  color: white;
  font-family: Montserrat;
  text-overflow: ellipsis;

  /* Required for text-overflow to do anything */
  white-space: nowrap;
  overflow: hidden;
}


}