@media only screen   
and (min-width : 768px) {
  .my-main-Navbar{

    padding: 1% 8%;
    position: absolute !important;
    z-index: 1;
    width: 100%;
    min-width: 400px;
    
}
}
li.link-wrapper > a.active {
    display: block;
    width: 100%;
    height:100%;
    color: white;
    background-color: blue;
}
.navh1{
  color:#000;
  margin-left:1.4%;
}


.main-nav-active{
    color: #0022FA;
}

.navFOnt{
font-family: 'IBM Plex Sans', sans-serif;


}

.mr-auto{
text-align: right;
width: 100%;
}

/* .my-main-Navbar:hover{
background-color:rgb(240, 240, 240);
} */

.navbar-12{
    opacity: 0;
    position: fixed;
    background: #FABE00;
    transition: 0.5s;
    transition-delay: 0.5s;
    -webkit-transition-delay: 0.5s;
  
    animation:          fadeout 1s;
    -webkit-animation:  fadeout 1s;
    -moz-animation:     fadeout 1s;  
}

.navbar-12:hover{
    opacity: 1;
  transition: 1s;
}

/* Keyframes */
@keyframes fadeout {
    0%      { opacity: 1; }
    75%     { opacity: 1; }
    100%    { opacity: 0; }
  }
  
  @-webkit-keyframes fadeout {
    0%      { opacity: 1; }
    75%     { opacity: 1; }
    100%    { opacity: 0; }
  }
  
  @-moz-keyframes fadeout {
    0%      { opacity: 1; }
    75%     { opacity: 1; }
    100%    { opacity: 0; }
  }
  
  .navbar-light .navbar-toggler {
    color: rgba(0,0,0,.5);
    border-color: transparent;
}

.Navpad{
  padding: 0 1rem;
  text-decoration: none !important;
}