#nav-bar {
    width: 100%;
    position: fixed;

    display: grid;
    justify-content: center;
    align-items: center;
    grid-template-columns: auto auto auto;
    grid-gap: 40px;

    padding: 14px 0;
    background: linear-gradient(to bottom, rgba(20, 20, 20, 0.2), rgba(20, 20, 20, 0.2));
    backdrop-filter: blur(20px);
    
    transform: translateY(0px);
    transition: transform 700ms ease-in-out;

    z-index: 5;
}
#logo-nav {
    height: 40px;
    width: auto;
}
#nav-bar .nav-title {
    font-family: 'Oswald', sans-serif;
    font-size: 20px;
    letter-spacing: 1px;
    color: white;
    text-decoration: none;

    transition: all 500ms;
}
#nav-bar .nav-title:hover {
    transition: all 500ms;
}
#nav-bar i {
    display: inline-block;
    transition: all 500ms;
}