#menu { 
    z-index:100;
    top:0px;
    position: fixed; 
}

#menu > div {
    background-color: rgb(152, 104, 255);
    opacity: 1;
    padding: 0px 20px;
    margin: 0px;
    height: 80px;
    max-width:80px;
    top: 0px;
}

#icon-menu 
{
    position: relative;
    top:20px;
    font-size: 2.7rem;
}

#logo {
    width:150px;
    position: absolute;
    top:25px;
    left:90px;
}

nav 
{
    width:250px;
    height:100vh;
    position: absolute;
    top:0px;
    z-index:100;
    background-color:#FFFFFF;
    box-shadow:0px 0px 20px rgba(0,0,0,.7);
    display:none;
}

#box_logo 
{
    border:1px solid transparent;
    width:100%;
    height:80px;
    background-color:#7A43EB;
}

#box_logo > img 
{
    width:70%;
    display:block;
    margin:20px auto;
}

nav > ul 
{
    border-bottom:1px solid rgba(0,0,0,.3);
    width:100%;
    height:auto;
    padding:0px;
    list-style: none;
}

nav > ul > li
{
    float:left;
    width:100%;
    padding:20px 20px;
    border-bottom:1px solid rgba(0,0,0,.3);
}

nav > ul > li:first-child 
{
    font-weight:bold;
    text-align: center;
}

nav > ul > li > a 
{
    color:#000000;
    text-decoration: none;
} 

/* ICONS */



#icon-menu
{
    color:#FFFFFF;
}

.icons_nav 
{
    color:#7A43EB;
    margin-right:10px;
}


#back_modal
{
    width:100%;
    height:100vh;
    background-color:rgba(0,0,0,.3);
    position:fixed;
    z-index:99;
    display:none;
    top:0px;
}