*{
  overflow-x: hidden;
}
#navbar1{
  color: white;
 }
 #logo img{
     height: 60px;
     width: 360px;
 }
 @media screen and (max-width: 550px){
  #logo img{
    height: 50px;
    width: 280px;
}
.bar1, .bar2, .bar3 {
  width: 15px;
  height: 2px;
  background-color: rgb(22, 117, 155);
  margin: 1px 0;
  transition: 0.4s;
}
.change .bar1 {
  transform: translate(0, 11px) rotate(-45deg);
}

.change .bar2 {opacity: 0;}

.change .bar3 {
  transform: translate(0, -11px) rotate(45deg);
}
.navbar-toggler{
 border: 1px solid white;   
}
 }

 .container {
     display: inline-block;
     cursor: pointer;
   }
   
   .bar1, .bar2, .bar3 {
     width: 35px;
     height: 5px;
     background-color: rgb(22, 117, 155);
     margin: 6px 0;
     transition: 0.4s;
   }
   
   .change .bar1 {
     transform: translate(0, 11px) rotate(-45deg);
   }
   
   .change .bar2 {opacity: 0;}
   
   .change .bar3 {
     transform: translate(0, -11px) rotate(45deg);
   }
   #menu2{
     text-align: center;
    }
    #menu2 li{
      overflow: hidden;
    }
   #menu2 li a{
     color: grey;
     font-weight: bold;
     animation: 1.7s fadeInUp;
     overflow: hidden;
   }
   #menu2 li a i{
     color: rgb(22, 117, 155);
     animation: 1.7s fadeInUp;
   
   }
   #menu{
     text-align: center;
   }
   #menu li{
    overflow: hidden;
   }
   
   #menu li a{
     color:grey;
     font-weight: bold;
     animation: 1.5s fadeInUp;
     
   }
   #menu li a i{
     color: rgb(22, 117, 155);
     animation: 1.5s fadeInUp;
     overflow: hidden;
   }
   .cool-link::after {
     content: '';
     display: block;
     width: 0;
     height: 3px;
     background: rgb(22, 117, 155);
     transition: width .3s;
 }
 @keyframes fadeInUp {
  0% {
    transform: translateY(100%);
    opacity: 0;
    overflow: hidden;
  }
  100% {
    transform: translateY(0%);
    opacity: 1;
  overflow: hidden;
  }
}


 
 .cool-link:hover::after {
     width: 100%;
 }
 @media screen and (max-width: 991px){
  .cool-link:hover::after {
    width: 0%;
}
#menu li a:hover{
  border: 2PX solid rgb(22, 117, 155) ;
  border-radius: 20PX;
  background-color: whitesmoke;
 }
 #menu2 li a:hover{
  border: 2PX solid rgb(22, 117, 155) ;
  border-radius: 20PX;
  background-color: whitesmoke;
 }
 }

 #myBtn {
    display: none; /* Hidden by default */
    position: fixed; /* Fixed/sticky position */
    bottom: 20px; /* Place the button at the bottom of the page */
    right: 30px; /* Place the button 30px from the right */
    z-index: 99; /* Make sure it does not overlap */
    border: none; /* Remove borders */
    outline: none; /* Remove outline */
    background-color:rgb(22, 117, 155); /* Set a background color */
    color: white; /* Text color */
    cursor: pointer; /* Add a mouse pointer on hover */
    padding: 15px; /* Some padding */
    border-radius: 60px; /* Rounded corners */
    font-size: 18px; /* Increase font size */
  }
  
  #myBtn:hover {
    background-color: #999999; /* Add a grey background on hover */
    
  }
  
  .row ul {
    text-align: left;
}
#footer {
    list-style: none;
    margin: 0;
    padding:5px 10px 15px 10px;
    text-align: center;
    font-size: 14px;
    background-color:rgb(0, 0, 0);
    
}
#footer li{
    display: inline-block;    
}
#footer li a {
    display: inline-block;
    text-decoration:none;   
}
#footer h6{
    color: white;
    font-size: 13px;
}
#footer h6{
  color: white;
  font-size: 13px;
}
#footer h6 a{
    color: rgb(22, 117, 155) ;
    text-decoration: none;
}
#menuF{
  text-align: center;
}
#menuF li a{
  color:grey;
  font-weight: bold;
}
#menuF li a i{
  color: rgb(22, 117, 155);
}