   
/*Navbar*/
nav {
    display: inline;
}
     .nav-item{
        letter-spacing: 2px;
        font-size: 0.8em;
        font-family: 'Montserrat', sans-serif;
        text-transform: uppercase;
        color:white;
        font-weight: bold;
        transition: color 0.2s;
    }
.nav-item a:hover{
    transition: color 0.2s;
    color:gray !important;
}


.nav-item.special a:hover{
    transition: color 0.2s;
    color: #0c45a0 !important;
}

#logo{
    font-style: italic;
    font-family: 'EB Garamond', serif;
    letter-spacing: 1px;
    color:white;
}


/*use if image logo is used
#logo{
    margin-top:10px;
    height:30px;
}
*/

.icon-bar{
    width: 25px;
    height: 2px;
    background:white;
    display: block;
    margin-top: 4px;
}

.active{
    color: #0c45a0;
}
.nav-active{
    background-color: white;
    transition: all 0.5s;
}
.navbar-toggler{
    border:none;
    background: transparent !important;
}

 
.top-bar {
    transform: rotate(0) translate(0);
    transition: 150ms ease-in-out transform;
  }

.top-bar-active{
    transform: rotate(45deg) translate(0, 8px);
    transition: 250ms ease-in-out transform;
  }
 
  .middle-bar {
    transform: scale(1);
    transform-origin: left;
    transition: 250ms ease-in-out transform;
  }

  .middle-bar-active {
    transform: scale(0,1);
    transform-origin: left;
    transition: transform 150ms ease-in-out;
}
   
   .bottom-bar {
    transform: rotate(0) translate(0);
    transition: 150ms ease-in-out transform;
  }
  .bottom-bar-active {
    transform: rotate(-45deg) translate(0, -8px);
    transition: 250ms ease-in-out transform;
  }


@media (max-width: 992px) {
    .navbar li{
      margin-right: auto;
    }   
}


