body{
    background:white;
    display:flex;
    flex-direction:column;
    min-height:100vh;
}

.navbar{
    background:#1C1C80 !important;
    border-bottom:3px solid #D4AF37;
}

#sidebar{

    position:fixed;

    top:56px;
    left:0;

    width:250px;
    height:100%;

    background:#1C1C80;

    transition:.3s;

    z-index:999;
    
    border-right:3px solid #D4AF37;
}

#sidebar.hidden{
    left:-260px;
}

#sidebar.active{
    left:0;
}

#sidebar ul{
    list-style:none;
    padding:0;
}

#sidebar ul li{
    border-bottom:1px solid rgba(255,255,255,.1);
}

#sidebar ul li a{

    display:block;

    padding:15px;

    color:white;

    text-decoration:none;
}

#sidebar ul li a:hover{
    background:#D4AF37;
    color:#1C1C80;
}

#sidebar ul li a{

    display:flex;
    align-items:center;

    padding:14px 18px;

    color:#fff;

    text-decoration:none;

    transition:0.3s;
}

#sidebar ul li a i{

    font-size:18px;

    width:24px;
}

#sidebar ul li a:hover{

    background:rgba(255,255,255,0.15);

    padding-left:25px;
}

#content{
    padding:15px;
    margin-left:250px;
    transition:.3s;
    flex:1;
}

#content.content-hidden{
    margin-left:0;
}

.footer{

    background:#1C1C80;

    color:white;

    padding:15px;

    border-top:3px solid #D4AF37;
    
    margin-top:auto;
    
    position:sticky;
    bottom:0;
    
    z-index:10;
    
    text-align:center;
}

.footer .text-center{
    color:white;
}

.footer a{
    color:#D4AF37;
    text-decoration:none;
}

.footer a:hover{
    color:white;
}

@media (max-width: 768px) {
    #sidebar{
        left:-260px;
    }
    
    #sidebar.hidden{
        left:-260px;
    }
    
    #sidebar.active{
        left:0;
    }
    
    #content{
        margin-left:0;
    }
}