*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

body{
    font-family:Poppins,sans-serif;
    background:#f4f6f9;
}

.wrapper{
    display:flex;
    width:100%;
}

/* Sidebar */

.sidebar{

    width:260px;

    min-height:100vh;

    background:#111827;

    position:fixed;

    left:0;

    top:0;

    overflow-y:auto;

}

.sidebar-header{

    padding:25px;

    text-align:center;

    color:#fff;

    border-bottom:1px solid #2d3748;

}

.sidebar .nav-link{

    color:#d1d5db;

    padding:14px 25px;

}

.sidebar .nav-link:hover{

    background:#2563eb;

    color:#fff;

}

/* Main */

.main{

    margin-left:260px;

    width:calc(100% - 260px);

}

/* Header */

.navbar{

    height:70px;

    background:#fff;

    box-shadow:0 2px 8px rgba(0,0,0,.08);

}

/* Content */

.content{

    padding:25px;

    min-height:calc(100vh - 130px);

}

/* Footer */

footer{

    background:#fff;

    padding:15px;

    text-align:center;

    border-top:1px solid #ddd;

}

/* Mobile */

@media(max-width:991px){

.sidebar{

left:-260px;

transition:.3s;

z-index:999;

}

.sidebar.show{

left:0;

}

.main{

margin-left:0;

width:100%;

}

}