/* Font Size */
.fs-8 { font-size: 8px; }
.fs-9 { font-size: 9px; }
.fs-10 { font-size: 10px; }
.fs-11 { font-size: 11px; }
.fs-12 { font-size: 12px; }
.fs-13 { font-size: 13px; }
.fs-14 { font-size: 14px; }
.fs-15 { font-size: 15px; }
.fs-16 { font-size: 16px; }
.fs-17 { font-size: 17px; }
.fs-18 { font-size: 18px; }
.fs-19 { font-size: 19px; }
.fs-20 { font-size: 20px; }
.fs-21 { font-size: 21px; }
.fs-22 { font-size: 22px; }
.fs-23 { font-size: 23px; }
.fs-24 { font-size: 24px; }
.fs-25 { font-size: 25px; }
.fs-26 { font-size: 26px; }
.fs-27 { font-size: 27px; }
.fs-28 { font-size: 28px; }
.fs-29 { font-size: 29px; }
.fs-30 { font-size: 30px; }
.fs-35 { font-size: 35px; }
.fs-40 { font-size: 40px; }
.fs-45 { font-size: 45px; }
.fs-50 { font-size: 50px; }
.fs-55 { font-size: 55px; }
.fs-60 { font-size: 60px; }
.fs-65 { font-size: 65px; }
.fs-70 { font-size: 70px; }

/* Line Height */
.lh-8 { line-height: 8px; }
.lh-9 { line-height: 9px; }
.lh-10 { line-height: 10px; }
.lh-11 { line-height: 11px; }
.lh-12 { line-height: 12px; }
.lh-13 { line-height: 13px; }
.lh-14 { line-height: 14px; }
.lh-15 { line-height: 15px; }
.lh-16 { line-height: 16px; }
.lh-17 { line-height: 17px; }
.lh-18 { line-height: 18px; }
.lh-19 { line-height: 19px; }
.lh-20 { line-height: 20px; }
.lh-21 { line-height: 21px; }
.lh-22 { line-height: 22px; }
.lh-23 { line-height: 23px; }
.lh-24 { line-height: 24px; }
.lh-25 { line-height: 25px; }
.lh-26 { line-height: 26px; }
.lh-27 { line-height: 27px; }
.lh-28 { line-height: 28px; }
.lh-29 { line-height: 29px; }
.lh-30 { line-height: 30px; }
.lh-35 { line-height: 35px; }
.lh-40 { line-height: 40px; }
.lh-45 { line-height: 45px; }
.lh-50 { line-height: 50px; }
.lh-55 { line-height: 55px; }
.lh-60 { line-height: 60px; }
.lh-65 { line-height: 65px; }
.lh-70 { line-height: 70px; }

/* ---------------------------------------------------
    SIDEBAR STYLE
----------------------------------------------------- */

.wrapper {
    display: flex;
    width: 100%;
    align-items: stretch;
}

#sidebar {
    background-color: #0f172a;
    color: #ffffff;
    min-width: 250px;
    max-width: 250px;
    transition: all 0.3s;
    min-height: 100vh;
}

#sidebar.active {
    margin-left: -250px;
}

#sidebar .sidebar-header {
    padding: 20px;
}

#sidebar ul.components {
    padding: 20px 0;
}

#sidebar ul p {
    padding: 10px;
}

#sidebar ul li a {
    padding: 10px;
    font-size: 1.1em;
    display: block;
}

a[data-toggle="collapse"] {
    position: relative;
}

.dropdown-toggle::after {
    display: block;
    position: absolute;
    top: 50%;
    right: 20px;
    transform: translateY(-50%);
}

/* ---------------------------------------------------
    CONTENT STYLE
----------------------------------------------------- */

#content {
    width: 100%;
    padding: 20px;
    min-height: 50vh;
    transition: all 0.3s;
}

.cursor-pointer { cursor: pointer; }

/* ---------------------------------------------------
    SCROLL HORIZONTAL TABLE
----------------------------------------------------- */
div.scrollmenu {
    overflow: auto;
    white-space: nowrap;
}

div.scrollmenu a {
    display: inline-block;
    color: white;
    text-align: center;
    padding: 14px;
    text-decoration: none;
}

div.scrollmenu a:hover {
    background-color: #777;
}

/* ---------------------------------------------------
    BTN ACTION CUSTOM
----------------------------------------------------- */
.btn-action-custom {
    width: 50px;
    height: 50px;
    text-align: center;
    line-height: 50px;
    font-weight: 700;
    cursor: pointer;
}