*{
    padding:0;
    margin:0px;
   
        font-family: 'Open Sans', sans-serif;
    
    }
html,body{
    scroll-behavior:smooth;
    width:100%;
    overflow-x: hidden;
cursor:pointer;
scroll-padding-top: 6rem;

}
/* Header */

h1,h2,h3,h4{
color: #002855;
text-shadow: 0 0 10px rgba(52, 143, 164, 0.2), 0 0 20px rgba(60, 156, 188, 0.2);


}
 h2:hover,h1:hover,h4:hover,h3:hover{
     color:rgb(36, 135, 135); 
     transition: color 0.3s ease-in-out;   
} 

@keyframes slide-left{
    from {
        opacity: 0;
        transform: translateX(-100vw);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}
@keyframes blink {
    0%{opacity:1;}
    50%{opacity:0;}
    100%{opacity:1;}
}

header nav  { 
  display:flex;
  align-items: center;
  height:70px;
   background-color: #002855;
  color:white;
  position:fixed;
  z-index:10000;
  width:100%;

  

}
.ieeelogo:hover,.svcelogo:hover,.social-icons:hover{
    animation: blink 0.5s 1;
}

header nav  a{ 
    margin-left:0px;
text-decoration: none;
color:white;
font-size:18px;
width:100%;
padding: 50px;
}

header nav a:hover{

    transform:scale(1.15);
    transition: transform 1.5s ease-in-out forwards;
    }
      .event-dropdown select:hover{
    
        transform:scale(1.15);
        transition: transform 1.5s ease-in-out forwards;
        }    
         
.execom-dropdown select{
    background-color: #002855;
  border:none;
  color:white;
  font-size:18px;
  width:85px;
  margin:0px 40px 0px ;
}

header nav img {
    height:100%;
    padding:10px;

}
.ieeelogo{
    padding-left:0px;
    width:100px;
    
}
.svcelogo{
    width:200px;


}
.logos{
    position: relative;
    align-items: center;
    display: flex;
}
/* Main */
main{
    height:400vh;
}
video{
   position:absolute;
   top:0; left:0;
   height:100%;
   object-fit: cover;
   z-index:-1;
   padding-top:70px;
   width:100%;

  
}
.textonvideo{
    margin:450px 0px 0px 30px;
    color:white;
    
}
.textonvideo h1{
    margin:10px;
    color:white;
    
}
 .textonvideo p,a{
color:white;
padding-left:12px;
}
p{
    line-height:25px;
    font-size:18px;   
}

.textonvideo input{
    color:#002855;
    font-weight: bolder;
    background-color:aliceblue;
    height: 40px;
    width:170px;
    border-radius:24px;
    border:#002855 solid 2px;
    font-size:16px;
    margin-top:20px;

}
.punchline-define,.punchline-two,.punchline-one {
    opacity: 0;  
    transform: translateY-(100vw);   
}
.punchline-one{
    opacity:1;
    animation: slide-left 1.1s ease-in-out forwards ;
}
.punchline-two{
    opacity:1;
    animation: slide-left 1.5s ease-in-out forwards ;
}
.punchline-define{
    opacity:1;
    animation: slide-left 2s ease-in-out forwards ;
}

@keyframes slide-left{
    from {
        opacity: 0;
        transform: translateX(-100vw);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}


.textonvideo input:hover{

transform:scale(1.04);
transition: transform 1.5s ease-in-out forwards;
}
.sbcounsellor-container{
    background-color:aliceblue;
    width:100%;
    height:500px;
    margin-top:110px;
    display: flex;
    box-shadow: 0 0 20px rgba(52, 54, 25, 0.3);


}

.sbcounsellor h1,p{
    padding: 10px 0px 10px 30px;
    

}

.sbcounsellor p{
    width:95%;
    text-align: justify;
    font-family: 'Times New Roman', Times, serif;
    
}
.sbcounsellor-container img{
    height:350px;
    width:350px;
margin: 50px 50px 10px 50px;
box-shadow: 0 0 20px rgba(0, 0, 0, 0.3);
animation: fade-in 2s ease-in forwards;

}


.p-matter {
 position: relative;
left:80px;
}
@keyframes fade-in{
from{opacity: 0;}
to{opacity: 1;}
}
.upcomingevent{
margin:40px 0px 0px 350px;
display: flex;
    width:50%;
    height:470px;
    margin-top:20px;
    animation:fade-in 2s ease-in ;
  box-shadow: 0 0 20px rgba(13, 67, 17, 0.3),0 0 20px rgba(190, 224, 3, 0.3) ;
}
.upcomingevent img{
    width:300px;
    height:400px;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.3);
    margin:30px;

}
@keyframes blink-effect-of-event {
    0%{opacity:1;
        color:red;
    }25%{
        color:yellow; 
    }
50%{
    color:red;
}
75%{
    color:yellow;
}
100%{
    color:red;
}
}
   

.h-upcomingevent{
   
   display: flex;
   justify-content: center;
   margin-top:40px;
   animation: blink-effect-of-event 1.5s infinite ease-in-out;
   text-shadow: 0 0 10px rgba(0, 0, 0,0.2), 0 0 20px rgba(12, 12, 13,0.2);


}
.upcoming-event-matter{
    margin:60px 10px 0px 50px;
    line-height: 60px;

}
.upcoming-event-matter b{
    font-size:20px;
    color:rgb(9, 9, 68);
    text-shadow: 0 0 10px rgba(0, 0, 0,0.2), 0 0 20px rgba(12, 12, 13,0.2);

}
.upcoming-event-matter span{
    font-size:19px;
  
}
.membership-container{
    background-image: url('./groupimage.jpg');
     background-size: cover;
    height:700px;
    display: flex;
    flex-direction: row;
   
}
.heading{
    padding-top:400px;
    color:white;
    width:50%;

   
    
}
.heading h4{
    color:white;
}
.membership-container p{
    color:white;
}
.resources h4{
    color:white;
}
.societies-container{
    height:550px;
}
.societyimg{
   
    margin:100px 30px 20px 80px;
    width:240px;
    height:100px;
 animation:bounce 2s ease-in-out infinite alternate;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.3);
}

@keyframes bounce {
0%,100%{
    transform: translateY(0);
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.3);

    
}
50% {
    transform: translateY(-20px);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.4);
  }
}
 













































/* Footer */
.footerpart{
    display:flex;
    flex-direction: row;
    align-items:flex-start;
    justify-content: space-evenly;
    height:400px;
    padding-top:10px;

}


footer{
    background-color: rgb(187, 218, 245);
    border:1px solid  #002855;

}
.copyright{
   
    color:white;
   text-align: center;
   padding-top:4px;
   background-color: #002855;

}


.social-icons{
    width:40px;
    height:40px;
    padding-right:10px;
    color:#073b72;
    
}
hr{
    border :1px solid black;
}
.quicklinks-container a{
display: flex;
flex-direction:column;
margin-top:20px;
text-decoration: none;
color:black;
font-weight: bolder;
}
.quicklinks-container a:hover{
   
    transform:scale(1.05);
    transition: transform 1.5s ease-in-out forwards;
    } 

.findus hr{
    width:50%;
}
.footer-contact h3,.contact-container h3{
    margin-top:20px;
}
.contact-container hr{
    width:80%;
}
iframe{
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.3);

}
iframe:hover{
  
    transform:scale(1.03);
    transition: transform 2s ease-in-out forwards;
    }      
.contact-container p,.footer-contact p{
        padding:0px;
    }