.menu_toggle {
    background-color: #fff9;
    border-radius: 0 10px 0 0;
    padding: 5px 10px;
    cursor: pointer;
}

.nav-bar {
    font-size: medium;
    height: 100vh;
    overflow-y: auto;
    padding: 0 0 50vh 0;
    background-color: #062639;
}

.container-close {
    float: right;
    padding: 20px;
    color: #fff;
    background-color: #f11;
    cursor: pointer;
}

.container-open {
    float: right;
    padding: 20px;
    cursor: pointer;
    background-color: #ccc;
    position: fixed;
    z-index: 1;
}

.nav-bar > ul {
    margin: 0;
}

.nav-bar > ul > li {
    background: #062639;
    border-top: 1px solid #000080;
    border-bottom: 1px solid #000080;
}

.nav-bar > ul > li:hover {
    color: #000080;
}

.nav-bar > ul > li {
    color: #fff;
    cursor: pointer;
    width: 400px;
}

.nav-bar p {
    display: flex;
    align-items: center;
    letter-spacing: 4px;
}

.nav-bar p > img {
    padding: 0 10px 0 5px;
}

.close-menu {
    display: none;
}

.open-menu-btn-line > li {
    animation: loading 2s;
}

@keyframes loading {
    0% {transform: translateX(-200%);}
    100% {transform: translateX(0%);}
}

.open-menu-btn-line > li > a {
    display: block;
    padding: 10px 10px;
}

.open-menu-btn-line > li {
    color: #fff;
    background-color: #062639;
    border-bottom: 1px solid #000080;
    transform: translateX(0);
    transition: ease 0.5s;
}

.open-menu-btn-line > li:hover {
    cursor: pointer;
    transform: translateX(5%);
    transition: ease 0.8s;
    background: linear-gradient(to right, #062639, #191970);
}

.close {
    display: none;
}

@media screen and (max-width: 920px){
    .nav-bar {
        font-size: 1rem;
        height: 100vh;
        overflow-y: auto;
        padding: 0 0 100vh 2px;
    }
    
    .container-close > img {
        width: 16px;
        height: 16px;
    }

    .container-open > img {
        width: 16px;
        height: 16px;
    }
    
    .open-menu-btn-line {
        width: 100vw;
    }

    .menu_toggle {
        background-color: #fff9;
        border-radius: 0 10px 0 0;
        padding: 5px 10px;
        cursor: pointer;
    }

    .container-nav {
        position: absolute;
        z-index: 1;
    }

}