#navbar {
  position: fixed;
  left:0;
  width: 100%;
  z-index: 9999;
  height:6rem;
  transition: top 0.3s;
  /*background-color:#3A4B67 !important;*/
  background-color: #ffff ;
  box-shadow: 5px 5px 10px 5px rgba(0, 0, 0, 0.2);
}

#navbar a{
  color: #186085;
  margin-right: 1.5rem;
  font-size:1.1rem;
  font-weight:600;
}

#navbar a:hover{
    color:#FF0000;
}

.navbar-brand img{
    width:38%;
    margin-left:2rem;
    position:relative;
    top:-0.1rem;
}

#myul{
    width:70%;
    margin:0 auto;
}

#myicon {
    opacity: 0;
    color: #000000;
  }

.un-list{
    width: 100%;
    z-index: 5000;
    position: absolute;
    top: 68%;
    left: 0;
    transform: translateY(5rem);
    transition: transform 0.5s ease, opacity 0.5s ease; 
    /*pointer-events: none;*/
    border-top:none;
     visibility: hidden;
    opacity: 0;
    transform: translateY(1rem);
    transition: all 0.3s ease;
}

.nav-item.on-hover:hover .un-list{
    visibility: visible;
    opacity: 1;
    transform: translateY(0);
}

.show{
    display:block;
}

.on-hover .inner2{
    width:100%;
}
.on-hover .inner2 hr{
    opacity:0;
}

.mylist{
    width:25%;
    margin:0 auto;
    left:40%;
}

.mylist .content{
   position:relative;
   top:-1rem;
}

.caret{
    margin-left:0.3rem;
    font-size:1.2rem;
}

.un-list .inner{
    width:95%;
    margin:0 auto;
    background:#fff;
    padding-top:3.8rem;
    padding-bottom:1.8rem;
    border-radius:2rem 0;
    box-shadow: 5px 5px 10px 5px rgba(0, 0, 0, 0.2);
    /*overflow-y:scroll;*/
    position:relative;
}

.un-list .content ul li{
    list-style-type:none;
    font-weight:600;
    margin-bottom:1rem;
}

.un-list .content ul li a{
    text-decoration:none;
    color: #186085;
    font-size:1.2rem;
}

.un-list .content i{
    margin-right:0.5rem;
}

.un-list .content ul li a:hover{
    color:#FF0000;
}
.un-list.hidden{
    display:none;
}

.cutting{
    position:absolute;
    right:1rem;
    top:1rem;
    font-size:1.5rem;color: #186085;
    /*opacity:0;*/
    cursor:pointer;
}

.preloader{
    display:flex;
    justify-content:center;
    width:100%;
    height:100vh;
    position:fixed;
    background:#fff;
    z-index:99999;
}

.preloader img{
    width:15%;
   animation: shake 0.5s infinite ease-in-out;
}

 @keyframes shake {
            0% { transform: translateX(0); }
            25% { transform: translateX(-5px); }
            50% { transform: translateX(5px); }
            75% { transform: translateX(-5px); }
            100% { transform: translateX(0); }
        }

.preloader.remove{
    display:none;
}
  
  @media only screen and (max-width:1350px){
      
#navbar a{
  margin-right: 1rem;
  font-size:1.rem;
  font-weight:600;
}

}


  @media only screen and (max-width:1288px){
      
#navbar a{
  margin-right: 1rem;
  font-size:1.rem;
  font-weight:600;
}
#navbarNav{
    width:100%;
}
#myul{
    width:75%;
}

}


  @media only screen and (max-width:1147px){
      #navbarNav{
    width:150%;
}
.navbar-brand img{
    width:70%;
    margin-left:0.5rem;
}

}

  @media only screen and (max-width:1064px){
      #navbarNav{
    width:180%;
}
.navbar-brand img{
    width:80%;
    margin-left:0.5rem;
}

}
 

  @media only screen and (max-width:1040px){
      #navbarNav{
    width:270%;
}
.navbar-brand img{
    width:90%;
    margin-left:0.5rem;
}

}
 
@media only screen and (max-width:992px){
    
.un-list{
    top: 90%;
    left: 0;
}
.cutting{
    opacity:25;
    cursor:pointer;
}

    .mylist{
    width:100%;
    margin:0 auto;
    left:25%;
}

.un-list .content{
    width:100%;
}


    #myul{
    width:100%;
    /*margin:0 auto;*/
    padding:0 1rem;
}

.navbar-brand img{
    width:38%;
    margin-left:0.5rem;
}

#navbarNav{
    background:#ffff;
     padding:0 1rem;
     padding-bottom:1.5rem;
      box-shadow: 5px 5px 10px 5px rgba(0, 0, 0, 0.2);
}
#full-banner{
    width:100%;
    background:#fff !important;
}
}


@media only screen and (max-width:768px){
     .un-list {
        width: 100%;
        left: 0;
        transform: translateY(0);
    }

    .un-list .inner {
        padding: 1rem;
        border-radius: 0;
        box-shadow: none;
    }
}

@media only screen and (max-width:576px){
 
.un-list .content ul li{
    list-style-type:none;
    font-weight:600;
    margin-bottom:0.5rem;
    font-size:0.9rem;
}
.un-list{
    top: -30%;
    left: 0;
}
    .mylist{
    width:100%;
    margin:0 auto;
    left:0%;
    top:60%;
}

.mylist .content{
    padding-top:2rem;
}
 
.un-list .inner{
    padding-top:0.5rem;
    padding-bottom:0.5rem;
    border-radius:2rem 0;
    box-shadow: 5px 5px 10px 5px rgba(0, 0, 0, 0.2);
    /*overflow-y:scroll;*/
}


}

@media only screen and (max-width:430px){
 
.navbar-brand img{
    width:38%;
    margin-left:0.5rem;
    position:relative;
    top:-0.3rem;
}

 
}