/*---------------------------------Extra Skins ------------------------------*/

.skin-azure .ui-dialog .ui-dialog-titlebar, .skin-azure-light .ui-dialog .ui-dialog-titlebar {
    background-color: #1f7dce
}

.skin-azure .sidebar-menu li > a > .fa-angle-left, .skin-azure-light .sidebar-menu li > a > .fa-angle-left {
    right: 5px
}

.skin-azure .sidebar-form, .skin-azure-light .sidebar-form {
    border-radius: 3px;
    margin: 20px 10px 10px 10px
}

.skin-azure .sidebar-menu > li > a, .skin-azure-light .sidebar-menu > li > a {
    border-left: 3px solid transparent;
    font-size: 14px
}

.skin-azure .sidebar-menu .treeview-menu > li > a, .skin-azure-light .sidebar-menu .treeview-menu > li > a {
    font-size: 13px
}

.skin-azure .sidebar-form input[type="text"], .skin-azure-light .sidebar-form input[type="text"], .skin-azure .sidebar-form .btn, .skin-azure-light .sidebar-form .btn {
    box-shadow: none;
    border: 1px solid transparent;
    height: 35px
}

.skin-azure .sidebar-form .btn, .skin-azure-light .sidebar-form .btn {
    color: #999
}

.skin-azure .control-sidebar-dark, .skin-azure-light .control-sidebar-dark, .skin-azure .control-sidebar-dark + .control-sidebar-bg, .skin-azure-light .control-sidebar-dark + .control-sidebar-bg {
    background: #2475b7
}

.skin-azure .main-header .logo, .skin-azure-light .main-header .logo {
    height: 50px;
    font-weight: 600
}

.skin-azure .main-header .navbar, .skin-azure-light .main-header .navbar {
    background-color: #1d6db1;
    z-index: 999;
    min-height: initial
}

.skin-azure .main-header .sidebar-toggle, .skin-azure-light .main-header .sidebar-toggle {
    font-size: 2.5rem;
    color: #fff;
    line-height: 20px;
    border-right: 1px solid #016fce;
    padding: 15px 15px
}

.skin-azure .main-header .logo, .skin-azure-light .main-header .logo {
    font-family: 'Open Sans';
    color: #fff;
    z-index: 1000;
    background-color: #1f7dce;
    padding: 0 0
}

.skin-azure .navbar-nav > li > a, .skin-azure-light .navbar-nav > li > a {
    border-left: 1px solid #016fce;
    color: #fff
}

.skin-azure .navbar-nav > .user-menu .user-image, .skin-azure-light .navbar-nav > .user-menu .user-image {
    border: 2px solid rgba(255,255,255,.4)
}

.skin-azure .navbar-nav > li > a:hover, .skin-azure-light .navbar-nav > li > a:hover, .skin-azure .navbar-nav > li > a:active, .skin-azure-light .navbar-nav > li > a:active, .skin-azure .navbar-nav > li > a:focus, .skin-azure-light .navbar-nav > li > a:focus {
    background: transparent;
    color: #90ee90
}

.skin-azure .navbar-nav .open > a, .skin-azure-light .navbar-nav .open > a, .skin-azure .navbar-nav .open > a:hover, .skin-azure-light .navbar-nav .open > a:hover, .skin-azure .navbar-nav .open > a:focus, .skin-azure-light .navbar-nav .open > a:focus {
    background: #096bc0;
    color: #90ee90
}

.skin-azure .navbar-nav > li > a[data-toggle=control-sidebar], .skin-azure-light .navbar-nav > li > a[data-toggle=control-sidebar] {
    font-size: 18px
}

.skin-azure section.content > .s-DataGrid, .skin-azure-light section.content > .s-DataGrid {
    border-radius: 0;
    border-top: 1px solid #f0f0f0
}

.skin-azure .grid-title, .skin-azure-light .grid-title, .skin-azure .panel-titlebar, .skin-azure-light .panel-titlebar {
    color: #1f7fce;
    font-size: 17px
}

.skin-azure .s-Panel, .skin-azure-light .s-Panel {
    border-radius: 0;
    border-top: 1px solid #f0f0f0
}

.skin-azure .sidebar-menu .treeview-menu > li > a > .fa, .skin-azure-light .sidebar-menu .treeview-menu > li > a > .fa, .skin-azure .sidebar-menu .treeview-menu > li > a > .glyphicon, .skin-azure-light .sidebar-menu .treeview-menu > li > a > .glyphicon, .skin-azure .sidebar-menu .treeview-menu > li > a > .ion, .skin-azure-light .sidebar-menu .treeview-menu > li > a > .ion {
    font-size: 14px
}

.skin-azure .sidebar-menu > li > a > .fa, .skin-azure-light .sidebar-menu > li > a > .fa, .skin-azure .sidebar-menu > li > a > .glyphicon, .skin-azure-light .sidebar-menu > li > a > .glyphicon, .skin-azure .sidebar-menu > li > a > .ion, .skin-azure-light .sidebar-menu > li > a > .ion {
    font-size: 18px
}

.skin-azure .sidebar-menu > li > a > .nav-icon, .skin-azure-light .sidebar-menu > li > a > .nav-icon {
    width: 23px
}

.skin-azure .sidebar-menu .treeview-menu > li > a > .nav-icon, .skin-azure-light .sidebar-menu .treeview-menu > li > a > .nav-icon {
    width: 19px
}

.skin-azure .main-header li.user-header, .skin-azure-light .main-header li.user-header {
    background-color: #1f7dce
}

.skin-azure .s-QuickSearchBar .quick-search-icon, .skin-azure-light .s-QuickSearchBar .quick-search-icon {
    background: #1f7fce
}

.skin-azure .quick-filters-bar, .skin-azure-light .quick-filters-bar {
    border: none;
    border-top: 1px solid #f0f0f0;
    border-bottom: 1px solid #f0f0f0;
    background-color: #f9f9f9;
    border-radius: 0
}

.skin-azure .s-FilterDisplayBar, .skin-azure-light .s-FilterDisplayBar {
    border-color: #e1e9f1;
    margin-bottom: 0
}

.skin-azure .slick-header-column.ui-state-default, .skin-azure-light .slick-header-column.ui-state-default {
    color: #016fce
}

.skin-azure .slick-cell > a, .skin-azure-light .slick-cell > a {
    color: #30569c
}

.skin-azure .main-sidebar {
    background-color: #1f7dce;
    background: linear-gradient(-65deg,#222d32,#1f7dce)
}

.skin-azure .sidebar a {
    color: #dee5fb
}

.skin-azure .sidebar-menu > li > .treeview-menu {
    background-color: rgba(85,133,175,.2)
}

.skin-azure .sidebar-menu > li:hover > a, .skin-azure .sidebar-menu > li.active > a {
    color: #fff;
    border-left-color: #9ccbf7;
    background-color: rgba(0,0,0,.3)
}

.skin-azure .sidebar-menu > li li:hover > a, .skin-azure .sidebar-menu li li.active > a {
    color: #83f78c
}

.skin-azure .sidebar-form {
    border: 1px solid rgba(0,0,0,.2)
}

    .skin-azure .sidebar-form input[type="text"], .skin-azure .sidebar-form .btn {
        background-color: rgba(0,0,0,.15)
    }

    .skin-azure .sidebar-form input[type="text"] {
        color: #bbb
    }

.skin-azure-light .content-wrapper, .skin-azure-light .right-side {
    background-color: #f4f8fb
}

.skin-azure-light .main-sidebar {
    background-color: #fff
}

.skin-azure-light .sidebar a {
    color: #222
}

.skin-azure-light .sidebar-menu > li > .treeview-menu {
    background-color: rgba(196,196,196,.2)
}

.skin-azure-light .sidebar-menu > li:hover > a, .skin-azure-light .sidebar-menu > li.active > a {
    color: #fff;
    border-left-color: #64b7ff;
    background-color: #016fce
}

    .skin-azure-light .sidebar-menu > li:hover > a i.nav-icon, .skin-azure-light .sidebar-menu > li.active > a i.nav-icon {
        color: #fff
    }

.skin-azure-light .sidebar-menu .nav-icon {
    color: #31386b
}

.skin-azure-light .sidebar-menu > li > a > .nav-icon {
    color: #575b7b
}

.skin-azure-light .sidebar-menu .treeview-menu {
    padding-top: 4px;
    padding-bottom: 4px
}

    .skin-azure-light .sidebar-menu .treeview-menu > li > a {
        padding-left: 19px
    }

    .skin-azure-light .sidebar-menu .treeview-menu > li {
        margin: 1px 4px 1px 0
    }

.skin-azure-light .sidebar-menu li > a > .fa-angle-left {
    right: 1px
}

.skin-azure-light .sidebar-menu > li > ul > li:hover > a, .skin-azure-light .sidebar-menu > li > ul > li.active > a {
    color: #fff;
    background-color: #4393d5;
    border-radius: 13px;
    border-right: 4px solid #c0d7f3;
    border-left: 4px solid #c0d7f3;
    box-shadow: 0 0 2px white;
    padding-left: 15px
}

    .skin-azure-light .sidebar-menu > li > ul > li:hover > a .nav-icon, .skin-azure-light .sidebar-menu > li > ul > li.active > a .nav-icon {
        color: #fff
    }

.skin-azure-light .sidebar-form input[type="text"], .skin-azure-light .sidebar-form .btn {
    background-color: #eaf1f7
}

.skin-azure-light .sidebar-menu > li li li:hover > a, .skin-azure-light .sidebar-menu li li li.active > a {
    color: #0595ec
}

    .skin-azure-light .sidebar-menu > li li li:hover > a .nav-icon, .skin-azure-light .sidebar-menu li li li.active > a .nav-icon {
        color: #50316b
    }

.skin-azure-light .sidebar-form input[type="text"] {
    color: #666
}

@media(min-width: 768px) {
    .skin-azure .content, .skin-azure-light .content {
        padding: 25px 15px 15px 20px
    }

    .skin-azure .content-header, .skin-azure-light .content-header {
        padding-left: 20px
    }

    .skin-azure .main-header .navbar, .skin-azure-light .main-header .navbar {
        min-height: 62px;
        margin-left: 0;
        background: #1f7dce
    }

    .skin-azure .main-header .sidebar-toggle, .skin-azure-light .main-header .sidebar-toggle {
        padding-right: 1.25rem;
        position: absolute;
        left: 4px;
        top: -8px;
        line-height: inherit;
        border-right: 1px solid transparent;
        padding: 21px 15px
    }

    .skin-azure .main-header .logo, .skin-azure-light .main-header .logo {
        position: absolute;
        left: 6rem;
        border-left: 1px solid #016fce;
        top: 6px;
        background-color: transparent;
        padding: 0 15px
    }

        .skin-azure .main-header .logo b, .skin-azure-light .main-header .logo b {
            float: left;
            margin-left: 8px
        }

    .skin-azure .navbar-nav, .skin-azure-light .navbar-nav {
        margin-top: 6px
    }

        .skin-azure .navbar-nav > li > a, .skin-azure-light .navbar-nav > li > a {
            line-height: 20px;
            padding: 15px 22px;
            font-size: 15px
        }

        .skin-azure .navbar-nav > .user-menu .user-image, .skin-azure-light .navbar-nav > .user-menu .user-image {
            height: 45px;
            width: 45px;
            margin-top: -12px
        }

    .skin-azure.fixed .content-wrapper, .skin-azure-light.fixed .content-wrapper, .skin-azure.fixed .right-side, .skin-azure-light.fixed .right-side {
        padding-top: 62px
    }

    .skin-azure .main-sidebar, .skin-azure-light .main-sidebar, .skin-azure .left-side, .skin-azure-light .left-side {
        padding-top: 62px
    }

    .skin-azure.sidebar-mini.sidebar-collapse .main-header .navbar, .skin-azure-light.sidebar-mini.sidebar-collapse .main-header .navbar {
        margin-left: 0
    }

    .skin-azure.sidebar-mini.sidebar-collapse .main-header .logo, .skin-azure-light.sidebar-mini.sidebar-collapse .main-header .logo {
        width: 80px
    }

        .skin-azure.sidebar-mini.sidebar-collapse .main-header .logo > .logo-mini, .skin-azure-light.sidebar-mini.sidebar-collapse .main-header .logo > .logo-mini {
            margin-left: 0;
            margin-right: 0
        }

    .skin-azure.sidebar-mini.sidebar-collapse .main-sidebar, .skin-azure-light.sidebar-mini.sidebar-collapse .main-sidebar {
        width: 62px !important
    }

    .skin-azure.sidebar-mini.sidebar-collapse .content-wrapper, .skin-azure-light.sidebar-mini.sidebar-collapse .content-wrapper, .skin-azure.sidebar-mini.sidebar-collapse .right-side, .skin-azure-light.sidebar-mini.sidebar-collapse .right-side, .skin-azure.sidebar-mini.sidebar-collapse .main-footer, .skin-azure-light.sidebar-mini.sidebar-collapse .main-footer {
        margin-left: 62px !important
    }
}

@media(min-width: 768px) {
    .skin-azure .main-header {
        box-shadow: 0 2px 5px rgba(24,96,158,.6)
    }

    .skin-azure .main-sidebar {
        box-shadow: 2px 0 3px rgba(24,96,158,.2);
        border-right: 1px solid #0a59a0
    }

    .skin-azure-light .main-header {
        box-shadow: 0 1px 3px rgba(40,37,89,.3)
    }

    .skin-azure-light .main-sidebar {
        border-right: 1px solid #d2d2d2
    }
}

.skin-cosmos .ui-dialog .ui-dialog-titlebar, .skin-cosmos-light .ui-dialog .ui-dialog-titlebar {
    background: #584fc3
}

.skin-cosmos .sidebar-menu li > a > .fa-angle-left, .skin-cosmos-light .sidebar-menu li > a > .fa-angle-left {
    right: 5px
}

.skin-cosmos .sidebar-form, .skin-cosmos-light .sidebar-form {
    border-radius: 3px;
    margin: 20px 10px 10px 10px
}

.skin-cosmos .sidebar-menu > li > a, .skin-cosmos-light .sidebar-menu > li > a {
    border-left: 3px solid transparent;
    font-size: 14px
}

.skin-cosmos .sidebar-menu .treeview-menu > li > a, .skin-cosmos-light .sidebar-menu .treeview-menu > li > a {
    font-size: 13px
}

.skin-cosmos .sidebar-form input[type="text"], .skin-cosmos-light .sidebar-form input[type="text"], .skin-cosmos .sidebar-form .btn, .skin-cosmos-light .sidebar-form .btn {
    box-shadow: none;
    border: 1px solid transparent;
    height: 35px
}

.skin-cosmos .sidebar-form .btn, .skin-cosmos-light .sidebar-form .btn {
    color: #999
}

.skin-cosmos .sidebar-form input[type="text"], .skin-cosmos-light .sidebar-form input[type="text"] {
    color: #666
}

.skin-cosmos .control-sidebar-dark, .skin-cosmos-light .control-sidebar-dark, .skin-cosmos .control-sidebar-dark + .control-sidebar-bg, .skin-cosmos-light .control-sidebar-dark + .control-sidebar-bg {
    background: #130d46
}

.skin-cosmos .main-header .logo, .skin-cosmos-light .main-header .logo {
    height: 50px
}

.skin-cosmos .main-header .navbar, .skin-cosmos-light .main-header .navbar {
    background-color: #3d3780;
    border-bottom: 1px solid #3d3780;
    z-index: 999;
    min-height: initial
}

.skin-cosmos .main-header .sidebar-toggle, .skin-cosmos-light .main-header .sidebar-toggle {
    font-size: 2.5rem;
    color: #fff;
    line-height: 20px;
    border-right: 1px solid #342e73;
    padding: 15px 15px
}

.skin-cosmos .main-header .logo, .skin-cosmos-light .main-header .logo {
    font-family: 'Open Sans';
    color: #fff;
    z-index: 1000;
    background-color: #383371;
    padding: 0 0
}

.skin-cosmos .navbar-nav > li > a, .skin-cosmos-light .navbar-nav > li > a {
    border-left: 1px solid #342e73;
    color: #fff
}

.skin-cosmos .navbar-nav > .user-menu .user-image, .skin-cosmos-light .navbar-nav > .user-menu .user-image {
    border: 2px solid #00f9a6
}

.skin-cosmos .navbar-nav > li > a:hover, .skin-cosmos-light .navbar-nav > li > a:hover, .skin-cosmos .navbar-nav > li > a:active, .skin-cosmos-light .navbar-nav > li > a:active, .skin-cosmos .navbar-nav > li > a:focus, .skin-cosmos-light .navbar-nav > li > a:focus {
    background: transparent;
    color: #90ee90
}

.skin-cosmos .navbar-nav .open > a, .skin-cosmos-light .navbar-nav .open > a, .skin-cosmos .navbar-nav .open > a:hover, .skin-cosmos-light .navbar-nav .open > a:hover, .skin-cosmos .navbar-nav .open > a:focus, .skin-cosmos-light .navbar-nav .open > a:focus {
    background: #4c468e;
    color: #90ee90;
    border-color: #342e73
}

.skin-cosmos .navbar-nav > li > a[data-toggle=control-sidebar], .skin-cosmos-light .navbar-nav > li > a[data-toggle=control-sidebar] {
    font-size: 18px
}

.skin-cosmos section.content > .s-DataGrid, .skin-cosmos-light section.content > .s-DataGrid {
    border-radius: 0;
    border-top: 2px solid #656bbb;
    box-shadow: 0 0 3px rgba(0,0,0,.2)
}

.skin-cosmos .grid-title, .skin-cosmos-light .grid-title, .skin-cosmos .panel-titlebar, .skin-cosmos-light .panel-titlebar {
    color: #656bbb;
    font-size: 17px
}

.skin-cosmos .s-Panel, .skin-cosmos-light .s-Panel {
    border-radius: 0;
    border-top: 3px solid #656bbb
}

.skin-cosmos .sidebar-menu .treeview-menu > li > a > .fa, .skin-cosmos-light .sidebar-menu .treeview-menu > li > a > .fa, .skin-cosmos .sidebar-menu .treeview-menu > li > a > .glyphicon, .skin-cosmos-light .sidebar-menu .treeview-menu > li > a > .glyphicon, .skin-cosmos .sidebar-menu .treeview-menu > li > a > .ion, .skin-cosmos-light .sidebar-menu .treeview-menu > li > a > .ion {
    font-size: 14px
}

.skin-cosmos .sidebar-menu > li > a > .fa, .skin-cosmos-light .sidebar-menu > li > a > .fa, .skin-cosmos .sidebar-menu > li > a > .glyphicon, .skin-cosmos-light .sidebar-menu > li > a > .glyphicon, .skin-cosmos .sidebar-menu > li > a > .ion, .skin-cosmos-light .sidebar-menu > li > a > .ion {
    font-size: 18px
}

.skin-cosmos .sidebar-menu > li > a > .nav-icon, .skin-cosmos-light .sidebar-menu > li > a > .nav-icon {
    width: 23px
}

.skin-cosmos .sidebar-menu .treeview-menu > li > a > .nav-icon, .skin-cosmos-light .sidebar-menu .treeview-menu > li > a > .nav-icon {
    width: 19px
}

.skin-cosmos .main-header li.user-header, .skin-cosmos-light .main-header li.user-header {
    background-color: #3a327c
}

.skin-cosmos .s-QuickSearchBar .quick-search-icon, .skin-cosmos-light .s-QuickSearchBar .quick-search-icon {
    background: #656bbb
}

.skin-cosmos .quick-filters-bar, .skin-cosmos-light .quick-filters-bar {
    border: none;
    border-top: 3px solid #d4d1fb;
    background-color: #f5f5f5;
    border-radius: 0
}

.skin-cosmos .s-FilterDisplayBar, .skin-cosmos-light .s-FilterDisplayBar {
    border-color: #d4d1fb;
    background-color: #f9f6ff
}

    .skin-cosmos .s-FilterDisplayBar .edit, .skin-cosmos-light .s-FilterDisplayBar .edit {
        background-color: #f9f6ff;
        color: #6f39c4
    }

.skin-cosmos .main-sidebar {
    background-color: #1a1640;
    background: linear-gradient(149deg,#2f206d,#3d3780)
}

.skin-cosmos .sidebar a {
    color: #aab7dc
}

.skin-cosmos .sidebar-menu > li > .treeview-menu {
    background-color: rgba(85,133,175,.2)
}

.skin-cosmos .sidebar-menu > li:hover > a, .skin-cosmos .sidebar-menu > li.active > a {
    color: #fff;
    border-left-color: #938ce0;
    background-color: rgba(0,0,0,.25)
}

.skin-cosmos .sidebar-menu > li li:hover > a, .skin-cosmos .sidebar-menu li li.active > a {
    color: #fff
}

.skin-cosmos .sidebar-form {
    border: 1px solid #3f3c61
}

    .skin-cosmos .sidebar-form input[type="text"], .skin-cosmos .sidebar-form .btn {
        background-color: rgba(0,0,0,.4)
    }

.skin-cosmos-light .content-wrapper, .skin-cosmos-light .right-side {
    background-color: #edf5fb
}

.skin-cosmos-light .main-sidebar {
    background-color: #fff
}

.skin-cosmos-light .sidebar a {
    color: #222
}

.skin-cosmos-light .sidebar-menu > li > .treeview-menu {
    background-color: rgba(196,196,196,.2)
}

.skin-cosmos-light .sidebar-menu > li:hover > a, .skin-cosmos-light .sidebar-menu > li.active > a {
    color: #fff;
    border-left-color: #d5caf9;
    background-color: #534d8f
}

    .skin-cosmos-light .sidebar-menu > li:hover > a i.nav-icon, .skin-cosmos-light .sidebar-menu > li.active > a i.nav-icon {
        color: #fff
    }

.skin-cosmos-light .sidebar-menu .nav-icon {
    color: #50316b
}

.skin-cosmos-light .sidebar-menu > li > a > .nav-icon {
    color: #62577b
}

.skin-cosmos-light .sidebar-menu .treeview-menu {
    padding-top: 4px;
    padding-bottom: 4px
}

    .skin-cosmos-light .sidebar-menu .treeview-menu > li > a {
        padding-left: 19px
    }

    .skin-cosmos-light .sidebar-menu .treeview-menu > li {
        margin: 1px 4px 1px 0
    }

.skin-cosmos-light .sidebar-menu li > a > .fa-angle-left {
    right: 1px
}

.skin-cosmos-light .sidebar-menu > li li:hover > a, .skin-cosmos-light .sidebar-menu li li.active > a {
    color: #fff;
    background-color: #68468b;
    border-radius: 3px;
    box-shadow: 0 0 2px white
}

    .skin-cosmos-light .sidebar-menu > li li:hover > a .nav-icon, .skin-cosmos-light .sidebar-menu li li.active > a .nav-icon {
        color: #fff
    }

.skin-cosmos-light .sidebar-form input[type="text"], .skin-cosmos-light .sidebar-form .btn {
    background-color: #e8e9f5
}

.skin-cosmos-light .sidebar-menu > li li li:hover > a, .skin-cosmos-light .sidebar-menu li li li.active > a {
    background-color: transparent;
    border-radius: 0;
    box-shadow: none;
    color: #8a2be2
}

    .skin-cosmos-light .sidebar-menu > li li li:hover > a .nav-icon, .skin-cosmos-light .sidebar-menu li li li.active > a .nav-icon {
        color: #50316b
    }

    .skin-cosmos-light .sidebar-menu > li li li:hover > a .sidebar-form input[type="text"], .skin-cosmos-light .sidebar-menu li li li.active > a .sidebar-form input[type="text"], .skin-cosmos-light .sidebar-menu > li li li:hover > a .sidebar-form .btn, .skin-cosmos-light .sidebar-menu li li li.active > a .sidebar-form .btn {
        background-color: #e8e9f5
    }

@media(min-width: 768px) {
    .skin-cosmos .content, .skin-cosmos-light .content {
        padding: 25px 15px 15px 20px
    }

    .skin-cosmos .content-header, .skin-cosmos-light .content-header {
        padding-left: 20px
    }

    .skin-cosmos .main-header .navbar, .skin-cosmos-light .main-header .navbar {
        min-height: 62px;
        margin-left: 0;
        background: linear-gradient(149deg,#2f206d,#3d3780)
    }

    .skin-cosmos .main-header .sidebar-toggle, .skin-cosmos-light .main-header .sidebar-toggle {
        padding-right: 1.25rem;
        position: absolute;
        left: 4px;
        top: -8px;
        line-height: inherit;
        border-right: 1px solid transparent;
        padding: 21px 15px
    }

    .skin-cosmos .main-header .logo, .skin-cosmos-light .main-header .logo {
        position: absolute;
        left: 6rem;
        border-left: 1px solid #342e73;
        top: 6px;
        background-color: transparent;
        padding: 0 15px;
    }

        .skin-cosmos .main-header .logo b, .skin-cosmos-light .main-header .logo b {
            float: left;
            margin-left: 8px
        }

    .skin-cosmos .navbar-nav, .skin-cosmos-light .navbar-nav {
        margin-top: 6px
    }

        .skin-cosmos .navbar-nav > li > a, .skin-cosmos-light .navbar-nav > li > a {
            line-height: 20px;
            padding: 15px 22px;
            font-size: 15px
        }

        .skin-cosmos .navbar-nav > .user-menu .user-image, .skin-cosmos-light .navbar-nav > .user-menu .user-image {
            height: 45px;
            width: 45px;
            margin-top: -12px
        }

    .skin-cosmos.fixed .content-wrapper, .skin-cosmos-light.fixed .content-wrapper, .skin-cosmos.fixed .right-side, .skin-cosmos-light.fixed .right-side {
        padding-top: 62px
    }

    .skin-cosmos .main-sidebar, .skin-cosmos-light .main-sidebar, .skin-cosmos .left-side, .skin-cosmos-light .left-side {
        padding-top: 62px
    }

    .skin-cosmos.sidebar-mini.sidebar-collapse .main-header .navbar, .skin-cosmos-light.sidebar-mini.sidebar-collapse .main-header .navbar {
        margin-left: 0
    }

    .skin-cosmos.sidebar-mini.sidebar-collapse .main-header .logo, .skin-cosmos-light.sidebar-mini.sidebar-collapse .main-header .logo {
        width: 80px
    }

        .skin-cosmos.sidebar-mini.sidebar-collapse .main-header .logo > .logo-mini, .skin-cosmos-light.sidebar-mini.sidebar-collapse .main-header .logo > .logo-mini {
            margin-left: 0;
            margin-right: 0
        }

    .skin-cosmos.sidebar-mini.sidebar-collapse .main-sidebar, .skin-cosmos-light.sidebar-mini.sidebar-collapse .main-sidebar {
        width: 62px !important
    }

    .skin-cosmos.sidebar-mini.sidebar-collapse .content-wrapper, .skin-cosmos-light.sidebar-mini.sidebar-collapse .content-wrapper, .skin-cosmos.sidebar-mini.sidebar-collapse .right-side, .skin-cosmos-light.sidebar-mini.sidebar-collapse .right-side, .skin-cosmos.sidebar-mini.sidebar-collapse .main-footer, .skin-cosmos-light.sidebar-mini.sidebar-collapse .main-footer {
        margin-left: 62px !important
    }
}

@media(min-width: 768px) {
    .skin-cosmos .main-header {
        box-shadow: 0 2px 5px rgba(40,37,89,.6)
    }

    .skin-cosmos .main-sidebar {
        box-shadow: 2px 0 8px #413069
    }

    .skin-cosmos-light .main-header {
        box-shadow: 0 1px 3px rgba(40,37,89,.3)
    }

    .skin-cosmos-light .main-sidebar {
        border-right: 1px solid #d2d2d2
    }
}

.skin-glassy .ui-dialog .ui-dialog-titlebar, .skin-glassy-light .ui-dialog .ui-dialog-titlebar {
    background-color: #378436
}

.skin-glassy #PageBackground, .skin-glassy-light #PageBackground {
    position: fixed;
    z-index: -1;
    background: #fff url(/demo/Content/site/slides/slide2.jpg) no-repeat center center;
    background-color: #fff;
    background-size: cover;
    display: block !important;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    overflow: hidden
}

.skin-glassy .main-header, .skin-glassy-light .main-header {
    background: #000 url(/demo/Content/site/slides/slide2.jpg) no-repeat center top;
    background-size: cover
}

    .skin-glassy .main-header .navbar, .skin-glassy-light .main-header .navbar {
        background: rgba(0,0,0,.3)
    }

.skin-glassy .sidebar-menu li > a > .fa-angle-left, .skin-glassy-light .sidebar-menu li > a > .fa-angle-left {
    right: 5px
}

.skin-glassy .sidebar-form, .skin-glassy-light .sidebar-form {
    border-radius: 3px;
    margin: 20px 10px 10px 10px
}

.skin-glassy .sidebar-menu > li > a, .skin-glassy-light .sidebar-menu > li > a {
    border-left: 3px solid transparent;
    font-size: 14px
}

.skin-glassy .sidebar-menu .treeview-menu > li > a, .skin-glassy-light .sidebar-menu .treeview-menu > li > a {
    font-size: 13px
}

.skin-glassy .sidebar-form input[type="text"], .skin-glassy-light .sidebar-form input[type="text"], .skin-glassy .sidebar-form .btn, .skin-glassy-light .sidebar-form .btn {
    box-shadow: none;
    border: 1px solid transparent;
    height: 35px
}

.skin-glassy .sidebar-form .btn, .skin-glassy-light .sidebar-form .btn {
    color: #999
}

.skin-glassy .control-sidebar-dark, .skin-glassy-light .control-sidebar-dark, .skin-glassy .control-sidebar-dark + .control-sidebar-bg, .skin-glassy-light .control-sidebar-dark + .control-sidebar-bg {
    background: #81906b
}

.skin-glassy .main-header .logo, .skin-glassy-light .main-header .logo {
    height: 50px
}

.skin-glassy .main-header .navbar, .skin-glassy-light .main-header .navbar {
    z-index: 999;
    min-height: initial
}

.skin-glassy .main-header .sidebar-toggle, .skin-glassy-light .main-header .sidebar-toggle {
    font-size: 2.5rem;
    color: #fff;
    line-height: 20px;
    border-right: 1px solid rgba(255,255,255,.2);
    padding: 15px 15px
}

.skin-glassy .main-header .logo, .skin-glassy-light .main-header .logo {
    font-family: 'Open Sans';
    color: #fff;
    z-index: 1000;
    background-color: rgba(0,0,0,.35);
    padding: 0 0
}

.skin-glassy .navbar-nav > li > a, .skin-glassy-light .navbar-nav > li > a {
    border-left: 1px solid rgba(255,255,255,.2);
    color: #fff
}

.skin-glassy .navbar-nav > .user-menu .user-image, .skin-glassy-light .navbar-nav > .user-menu .user-image {
    border: 2px solid rgba(255,255,255,.4)
}

.skin-glassy .navbar-nav > li > a:hover, .skin-glassy-light .navbar-nav > li > a:hover, .skin-glassy .navbar-nav > li > a:active, .skin-glassy-light .navbar-nav > li > a:active, .skin-glassy .navbar-nav > li > a:focus, .skin-glassy-light .navbar-nav > li > a:focus {
    background: transparent;
    color: #90ee90
}

.skin-glassy .navbar-nav .open > a, .skin-glassy-light .navbar-nav .open > a, .skin-glassy .navbar-nav .open > a:hover, .skin-glassy-light .navbar-nav .open > a:hover, .skin-glassy .navbar-nav .open > a:focus, .skin-glassy-light .navbar-nav .open > a:focus {
    background: rgba(255,255,255,.2);
    border-color: transparent;
    color: #90ee90
}

.skin-glassy .navbar-nav > li > a[data-toggle=control-sidebar], .skin-glassy-light .navbar-nav > li > a[data-toggle=control-sidebar] {
    font-size: 18px
}

.skin-glassy section.content > .s-DataGrid, .skin-glassy-light section.content > .s-DataGrid {
    border-radius: 0;
    border-top: 2px solid #086cc0;
    box-shadow: 0 1px 3px rgba(0,0,0,.3)
}

.skin-glassy .grid-title, .skin-glassy-light .grid-title, .skin-glassy .panel-titlebar, .skin-glassy-light .panel-titlebar {
    color: #1f7fce;
    font-size: 17px
}

.skin-glassy .s-Panel, .skin-glassy-light .s-Panel {
    border-radius: 0;
    border-top: 3px solid #1f7fce
}

.skin-glassy .sidebar-menu .treeview-menu > li > a > .fa, .skin-glassy-light .sidebar-menu .treeview-menu > li > a > .fa, .skin-glassy .sidebar-menu .treeview-menu > li > a > .glyphicon, .skin-glassy-light .sidebar-menu .treeview-menu > li > a > .glyphicon, .skin-glassy .sidebar-menu .treeview-menu > li > a > .ion, .skin-glassy-light .sidebar-menu .treeview-menu > li > a > .ion {
    font-size: 14px
}

.skin-glassy .sidebar-menu > li > a > .fa, .skin-glassy-light .sidebar-menu > li > a > .fa, .skin-glassy .sidebar-menu > li > a > .glyphicon, .skin-glassy-light .sidebar-menu > li > a > .glyphicon, .skin-glassy .sidebar-menu > li > a > .ion, .skin-glassy-light .sidebar-menu > li > a > .ion {
    font-size: 18px
}

.skin-glassy .sidebar-menu > li > a > .nav-icon, .skin-glassy-light .sidebar-menu > li > a > .nav-icon {
    width: 23px
}

.skin-glassy .sidebar-menu .treeview-menu > li > a > .nav-icon, .skin-glassy-light .sidebar-menu .treeview-menu > li > a > .nav-icon {
    width: 19px
}

.skin-glassy .main-header li.user-header, .skin-glassy-light .main-header li.user-header {
    background-color: rgba(0,0,0,.35)
}

.skin-glassy .s-QuickSearchBar .quick-search-icon, .skin-glassy-light .s-QuickSearchBar .quick-search-icon {
    background: #1f7fce
}

.skin-glassy .quick-filters-bar, .skin-glassy-light .quick-filters-bar {
    border: none;
    border-top: 1px solid #d8d8d8;
    border-bottom: 1px solid #ddd;
    background-color: rgba(255,255,255,.95);
    border-radius: 0
}

.skin-glassy .slick-header-column, .skin-glassy-light .slick-header-column, .skin-glassy .slick-header-column.ui-state-default, .skin-glassy-light .slick-header-column.ui-state-default {
    color: #016fce
}

.skin-glassy .slick-cell > a, .skin-glassy-light .slick-cell > a {
    color: #30569c
}

.skin-glassy.full-height-page .content-wrapper, .skin-glassy-light.full-height-page .content-wrapper {
    background: transparent
}

.skin-glassy .main-footer, .skin-glassy-light .main-footer {
    border-top: none;
    background: rgba(0,0,0,.2);
    color: #ddd
}

.skin-glassy .main-sidebar {
    background-color: rgba(0,0,0,.4)
}

.skin-glassy .sidebar a {
    color: #f3f3f3
}

.skin-glassy .sidebar-menu > li > .treeview-menu {
    background-color: rgba(0,0,0,.1)
}

.skin-glassy .sidebar-menu > li:hover > a, .skin-glassy .sidebar-menu > li.active > a {
    color: #fff;
    border-left-color: #9ccbf7;
    background-color: rgba(0,0,0,.3)
}

.skin-glassy .sidebar-menu > li li:hover > a, .skin-glassy .sidebar-menu li li.active > a {
    color: #8ede98
}

.skin-glassy .sidebar-form {
    border: 1px solid rgba(0,0,0,.2)
}

    .skin-glassy .sidebar-form input[type="text"], .skin-glassy .sidebar-form .btn {
        background: rgba(255,255,255,.15)
    }

    .skin-glassy .sidebar-form input[type="text"] {
        color: #bbb
    }

.skin-glassy-light .main-sidebar {
    background-color: rgba(255,255,255,.7)
}

.skin-glassy-light .content-wrapper, .skin-glassy-light .right-side {
    background-color: rgba(255,255,255,.9)
}

.skin-glassy-light .sidebar a {
    color: #000
}

.skin-glassy-light .sidebar-menu > li > .treeview-menu {
    background-color: rgba(255,255,255,.3)
}

.skin-glassy-light .sidebar-menu > li:hover > a, .skin-glassy-light .sidebar-menu > li.active > a {
    color: #fff;
    border-left-color: #fff;
    background-color: rgba(35,83,150,.6)
}

    .skin-glassy-light .sidebar-menu > li:hover > a i.nav-icon, .skin-glassy-light .sidebar-menu > li.active > a i.nav-icon {
        color: #fff
    }

.skin-glassy-light .sidebar-menu .nav-icon {
    color: #053100
}

.skin-glassy-light .sidebar-menu > li > a > .nav-icon {
    color: #0a2f2a
}

.skin-glassy-light .sidebar-menu .treeview-menu {
    padding-top: 4px;
    padding-bottom: 4px
}

    .skin-glassy-light .sidebar-menu .treeview-menu > li > a {
        padding-left: 19px
    }

    .skin-glassy-light .sidebar-menu .treeview-menu > li {
        margin: 1px 4px 1px 0
    }

.skin-glassy-light .sidebar-menu li > a > .fa-angle-left {
    right: 1px
}

.skin-glassy-light .sidebar-menu > li > ul > li:hover > a, .skin-glassy-light .sidebar-menu > li > ul > li.active > a {
    color: #fff;
    background-color: #666e90;
    border-radius: 4px
}

    .skin-glassy-light .sidebar-menu > li > ul > li:hover > a .nav-icon, .skin-glassy-light .sidebar-menu > li > ul > li.active > a .nav-icon {
        color: #fff
    }

.skin-glassy-light .sidebar-form input[type="text"], .skin-glassy-light .sidebar-form .btn {
    background-color: rgba(255,255,255,.4)
}

.skin-glassy-light .sidebar-menu > li li li:hover > a, .skin-glassy-light .sidebar-menu li li li.active > a {
    color: #0595ec
}

    .skin-glassy-light .sidebar-menu > li li li:hover > a .nav-icon, .skin-glassy-light .sidebar-menu li li li.active > a .nav-icon {
        color: #50316b
    }

.skin-glassy-light .sidebar-form input[type="text"] {
    color: #666
}

.skin-glassy-light.light-sidebar .premium-feature, .skin-glassy-light.light-sidebar .premium-note i {
    color: #ff0 !important
}

@media(min-width: 768px) {
    .skin-glassy .content, .skin-glassy-light .content {
        padding: 25px 15px 15px 20px
    }

    .skin-glassy .content-header, .skin-glassy-light .content-header {
        padding-left: 20px
    }

    .skin-glassy .main-header .navbar, .skin-glassy-light .main-header .navbar {
        min-height: 62px;
        margin-left: 0
    }

    .skin-glassy .main-header .sidebar-toggle, .skin-glassy-light .main-header .sidebar-toggle {
        padding-right: 1.25rem;
        position: absolute;
        left: 4px;
        top: -8px;
        line-height: inherit;
        border-right: 1px solid transparent;
        padding: 21px 15px
    }

    .skin-glassy .main-header .logo, .skin-glassy-light .main-header .logo {
        position: absolute;
        left: 6rem;
        border-left: 1px solid rgba(255,255,255,.2);
        top: 6px;
        background-color: transparent;
        padding: 0 15px
    }

        .skin-glassy .main-header .logo b, .skin-glassy-light .main-header .logo b {
            float: left;
            margin-left: 8px
        }

    .skin-glassy .navbar-nav, .skin-glassy-light .navbar-nav {
        margin-top: 6px
    }

        .skin-glassy .navbar-nav > li > a, .skin-glassy-light .navbar-nav > li > a {
            line-height: 20px;
            padding: 15px 22px;
            font-size: 15px
        }

        .skin-glassy .navbar-nav > .user-menu .user-image, .skin-glassy-light .navbar-nav > .user-menu .user-image {
            height: 45px;
            width: 45px;
            margin-top: -12px
        }

    .skin-glassy.fixed .content-wrapper, .skin-glassy-light.fixed .content-wrapper, .skin-glassy.fixed .right-side, .skin-glassy-light.fixed .right-side {
        padding-top: 62px
    }

    .skin-glassy .main-sidebar, .skin-glassy-light .main-sidebar, .skin-glassy .left-side, .skin-glassy-light .left-side {
        padding-top: 62px
    }

    .skin-glassy.sidebar-mini.sidebar-collapse .main-header .navbar, .skin-glassy-light.sidebar-mini.sidebar-collapse .main-header .navbar {
        margin-left: 0
    }

    .skin-glassy.sidebar-mini.sidebar-collapse .main-header .logo, .skin-glassy-light.sidebar-mini.sidebar-collapse .main-header .logo {
        width: 80px
    }

        .skin-glassy.sidebar-mini.sidebar-collapse .main-header .logo > .logo-mini, .skin-glassy-light.sidebar-mini.sidebar-collapse .main-header .logo > .logo-mini {
            margin-left: 0;
            margin-right: 0
        }

    .skin-glassy.sidebar-mini.sidebar-collapse .main-sidebar, .skin-glassy-light.sidebar-mini.sidebar-collapse .main-sidebar {
        width: 62px !important
    }

    .skin-glassy.sidebar-mini.sidebar-collapse .content-wrapper, .skin-glassy-light.sidebar-mini.sidebar-collapse .content-wrapper, .skin-glassy.sidebar-mini.sidebar-collapse .right-side, .skin-glassy-light.sidebar-mini.sidebar-collapse .right-side, .skin-glassy.sidebar-mini.sidebar-collapse .main-footer, .skin-glassy-light.sidebar-mini.sidebar-collapse .main-footer {
        margin-left: 62px !important
    }
}

@media(min-width: 768px) {
    .skin-glassy .main-header {
        box-shadow: 0 1px 3px rgba(40,89,37,.6)
    }

    .skin-glassy-light .main-header {
        box-shadow: 0 1px 3px rgba(40,89,37,.6)
    }

    .skin-glassy-light .main-sidebar {
        border-right: 1px solid #d2d2d2
    }
}