@font-face {
    font-family: BRoya;
    font-style: normal;
    font-weight: bold;
    src: url('../fonts/BRoya.eot');
    src: url('../fonts/BRoya.eot?#iefix') format('embedded-opentype'), /* IE6-8 */
    url('../fonts/BRoya.woff') format('woff'), /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
    url('../fonts/BRoya.ttf') format('truetype');
}

body {
    font-family: 'BRoya','yekan',tahoma, sans-serif;
    direction: rtl;
}

#wrapper {
    width: 100%;
    background: #202020;
}

#page-wrapper {
    padding: 5px 5px;
    min-height: 600px;
    background: #F3F3F3;
}

#page-inner {
    width: 100%;
    margin: 1px 1px 1px 1px;
    background-color: #fff !important;
    padding: 20px;
    min-height: 1200px;
}

@media(min-width:768px) {
    #page-wrapper {
        margin: 0 260px 0 0;
        min-height: 1200px;
    }

    .navbar-side {
        z-index: 1;
        position: absolute;
        width: 260px;
    }

    .navbar {
        border-radius: 0px;
    }
}

.sidebar-nav {
    width: 260px;
    background: #212529;
}

    .sidebar-nav ul {
        margin: 0;
        padding: 0;
        list-style: none;
        background: #343a40;
    }

    .sidebar-nav .metismenu {
        display: flex;
        flex-direction: column;
        background: #212529;
    }

        .sidebar-nav .metismenu > li {
            position: relative;
            display: flex;
            flex-direction: column;
        }

        .sidebar-nav .metismenu a {
            position: relative;
            display: block;
            padding: 13px 15px;
            transition: all .3s ease-out;
            text-decoration: none;
            color: #adb5bd;
            outline-width: 0;
        }

        .sidebar-nav .metismenu ul a {
            padding: 10px 15px 10px 30px;
        }

        .sidebar-nav .metismenu ul ul a {
            padding: 10px 15px 10px 45px;
        }

        .sidebar-nav .metismenu a:hover,
        .sidebar-nav .metismenu a:focus,
        .sidebar-nav .metismenu a:active {
            text-decoration: none;
            color: #f8f9fa;
            background: #0b7285;
        }

.toppage-nav {
    width: 100%;
    background: #343a40;
    position: relative;
    display: flex;
    flex-direction: column;
    padding: 5px;
    color: #f8f9fa;
    text-align: center;
}