#nav_list, #nav-list {
  
  
  
}

$appAside-bg: #333;


.aside_lnk, .aside_lnk a {
    display: block;
}

.aside_lnk {
    display: block;
    line-height: 2.5rem;
    text-align: left;
    @include noWrap;
    overflow: hidden;
    text-decoration: none;
    cursor: pointer;
    .icn, .labl {
        line-height: 2.5rem;
        height: 2.5rem;
    }
    .icn {
        font-size: 1.2rem;
        width: 2.5rem;
        float: left;
        text-align: center;
        img { margin-top: .25rem; }
    }

    .aside_nav, .aside_nav li, .aside_nav li a {
        display: block; position: relative;
        margin: 0; padding: 0;
    }
    
    img.flag { width: 1.2rem; }

    .aside_nav {
        display: none;
        list-style: none;
        padding: 0.25rem 0 0.5rem;
        background: darken( $appAside-bg, 5% );
        li {
            margin: 0;

            &.divide {
                display: block;
                height: 0;
                margin: 0.25rem 0.5rem;
                border: none;
                background: transparent;
                border-top: solid 1px rgba(0,0,0,.23);
                border-bottom: solid 1px rgba(255,255,255,.42);
            }

            a {
                height: 2.2rem;
                text-decoration: none;
                background: darken( $appAside-bg, 5% );
                &:hover { background: darken( $appAside-bg, 10% ); }

                .icn, .labl {
                    line-height: 2.2rem;
                    height: 2.2rem;
                    padding: 0;
                    color: #777;
                }
                .icn {
                    font-size: 1.2rem;
                    width: 2.5rem;
                    float: left;
                    text-align: center;
                }

                &.current, &.active {
                    .icn, .labl { color: $brand-color; }
                }
            }
        }
    }


    &.on {
        & > .aside_nav { display: block; }
    }

}

a.aside_lnk, .aside_lnk > a {
    &.current { color: #069; }
    &:hover {
        background: darken( $appAside-bg, 20% );
    }
    &:hover, &:focus, &:active, &.active {
        text-decoration: none;
    }
}