@import url('https://fonts.googleapis.com/css?family=Inter:300,400,500,600,700,800,900');

body {
    font-family: Inter, sans-serif !important;
}

html.login-html {
    height: 100% !important;
}

body.login-page {
    background-image: url('/web/images/v6/login/background.png');
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.pro_color .main-header,
.plus_color .main-header{
    background-color: #ffffff;
}

header.main-header .logo,
.it_products aside.main-sidebar,
.it_products aside.main-sidebar .sidebar-menu > li.header,
.it_products aside.main-sidebar .sidebar-menu > li > .treeview-menu {
    background-color: #151c2e !important;
}

.it_products aside.main-sidebar .sidebar-menu > li.header {
    color: #AFAFAF;
    font-weight: bold;
}

.it_products aside.main-sidebar .sidebar-menu > li > a,
.it_products aside.main-sidebar .sidebar-menu .treeview-menu > li > a {
    color: #9D9DA6;
    border-bottom: none;
    font-size: 13px;
}

.it_products aside.main-sidebar .sidebar-menu > li.active > a,
.it_products aside.main-sidebar .sidebar-menu .treeview-menu > li.active > a {
    color: #FAFAFA;
}

footer.main-footer {
    background-color: #ffffff !important;
    color: #646477 !important;
    font-size: 12px;
    padding: 10px 15px;
}

ul.nav.navbar-nav > li.user-menu > ul.dropdown-menu > li {
    background-color: #FAFAFA !important;
    color: #646477 !important;
}

ul.nav.navbar-nav > li.user-menu > ul.dropdown-menu > li > p {
    color: #646477 !important;
}

.it_products .main-header .navbar .sidebar-toggle {
    color: #646477 !important;
}

.it_products .main-header .navbar .sidebar-toggle:hover {
    background-color: #ffffff !important;
}

body.sidebar-collapse #page_header > a > img,
body.sidebar-collapse > div > header > a > img {
    content: url("/web/images/v6/logo/logo-small.png") !important;
}

.btn-tricolor {
    background: transparent linear-gradient(60deg, #FF30FF 0%, #CA2BFF 13%, #A127FF 24%, #8325FF 35%, #7123FF 44%, #6B23FF 50%, #6741F2 59%, #608ED2 77%, #55FAA6 100%) 0 0 no-repeat padding-box;
    color: #ffffff;
    border: none;
    border-radius: 2px !important;
}
.btn-tricolor:focus,
.btn-tricolor.focus {
    color: #fff;
    background: #ff30ff;
}
.btn-tricolor:hover {
    color: #fff;
    background: #ff30ff;
}
.btn-tricolor:active {
    color: #fff;
    background: #ff30ff;
}
.btn-tricolor:active:hover,
.btn-tricolor.active:hover,
.btn-tricolor:active:focus,
.btn-tricolor.active:focus,
.btn-tricolor:active.focus,
.btn-tricolor.active.focus {
    color: #fff;
    background: #ff30ff;
}
.btn-tricolor:active,
.btn-tricolor.active {
    background-image: none;
}
.btn-tricolor.disabled:hover,
.btn-tricolor[disabled]:hover,
.btn-tricolor.disabled:focus,
.btn-tricolor[disabled]:focus,
.btn-tricolor.disabled.focus,
.btn-tricolor[disabled].focus {
    background: #f4a2f4;
}

.btn-default {
    background-color: #939598 !important;
    box-shadow: 2px 2px 3px #00000033 !important;
    border-radius: 2px !important;
    border: none;
    color: #ffffff !important;
}

.btn-default:active,
.btn-default:focus,
.btn-default:hover {
    background-color: #6B6D6F !important;
}

.btn-primary {
    background-color: #44CB86 !important;
    box-shadow: 2px 2px 3px #00000033 !important;
    border-radius: 2px !important;
    border: none;
}

.btn-primary:active,
.btn-primary:focus,
.btn-primary:hover {
    background-color: #359564 !important;
}

.btn-success {
    background-color: #55FAA6 !important;
    box-shadow: 2px 2px 3px #00000033 !important;
    border-radius: 2px !important;
    border: none;
    color: #151C2E;
}

.btn-success:active,
.btn-success:focus,
.btn-success:hover {
    background-color: #47b27a !important;
}

.btn-info {
    background-color: #B764FF !important;
    box-shadow: 2px 2px 3px #00000033 !important;
    border-radius: 2px !important;
    border: none;
}

.btn-info:active,
.btn-info:focus,
.btn-info:hover {
    background-color: #9E57DB !important;
}

.btn-danger {
    background-color: #6B23FF !important;
    box-shadow: 2px 2px 3px #00000033 !important;
    border-radius: 2px !important;
    border: none;
}

.btn-danger:active,
.btn-danger:focus,
.btn-danger:hover {
    background-color: #654796 !important;
}

.btn-warning {
    background-color: #FF30FF !important;
    box-shadow: 2px 2px 3px #00000033 !important;
    border-radius: 2px !important;
    border: none;
}

.btn-warning:active,
.btn-warning:focus,
.btn-warning:hover {
    background-color: #ea5297 !important;
}

.it_products aside.main-sidebar .sidebar-menu > li.header.menu-header-setup {
    background: #939598 !important;
    color: #ffffff;
}

.it_products aside.main-sidebar .sidebar-menu > li.header.menu-header-content-management {
    background: #6b23ff !important;
    color: #ffffff;
}

.it_products aside.main-sidebar .sidebar-menu > li.header.menu-header-modules {
    background: #ff30ff !important;
    color: #ffffff;
}

.it_products aside.main-sidebar .sidebar-menu > li.header.menu-header-customers {
    background: #6b23ff !important;
    color: #ffffff;
}

li.menu-icon-setup i {
    color: #939598;
}

li.menu-icon-content-management i {
    color: #6b23ff;
}

li.menu-icon-modules i {
    color: #ff30ff;
}

li.menu-icon-customers i {
    color: #6b23ff;
}

div.grid-view div.panel-heading {
    background-color: #efefef !important;
    border: none;
    padding: 0;
}

div.grid-view div.panel-heading .panel-title {
    color: #404141;
    font-size: 18px;
    font-weight: bold;
}

div.grid-view div.panel-heading div.summary {
    background-color: #ffffff !important;
    border-radius: 2px 2px 0 0;
    color: #404141;
    font-size: 14px;
    padding: 10px 20px;
}

.sidebar-menu li > a > .fa-angle-up,
.sidebar-menu li > a > .pull-right-container > .fa-angle-up {
    width: auto;
    height: auto;
    padding: 0;
    margin-right: 10px;
}
.sidebar-menu li > a > .fa-angle-up {
    position: absolute;
    top: 50%;
    right: 10px;
    margin-top: -8px;
}
.sidebar-menu li.active > a > .fa-angle-up,
.sidebar-menu li.active > a > .pull-right-container > .fa-angle-up {
    -webkit-transform: rotate(-180deg);
    -ms-transform: rotate(-180deg);
    -o-transform: rotate(-180deg);
    transform: rotate(-180deg);
}

.sidebar-menu .treeview-menu > li > a > .pull-right-container > .fa-angle-up,
.sidebar-menu .treeview-menu > li > a > .pull-right-container > .fa-angle-down,
.sidebar-menu .treeview-menu > li > a > .fa-angle-up,
.sidebar-menu .treeview-menu > li > a > .fa-angle-down {
    width: auto;
}

div.info-box.ocger_box {
    border-color: #ff30ff !important;
}

.nav-tabs-custom > .nav-tabs > li.active {
    border-top-color: #ff30ff !important;
}

.grid-view-serial {
    text-align: center;
    width: 75px !important;
    max-width: 75px !important;
    min-width: 75px !important;
}

.grid-view-action,
.grid-view-action.grid-view-action-header.kv-align-center.kv-align-middle.skip-export.kv-merged-header {
    text-align: center;
    width: 150px !important;
    max-width: 150px !important;
    min-width: 150px !important;
}

.grid-view-action-wide,
.grid-view-action-wide.grid-view-action-header.kv-align-center.kv-align-middle.skip-export.kv-merged-header {
    width: 200px !important;
    max-width: 200px !important;
    min-width: 200px !important;
}

.grid-view-checkbox {
    text-align: center;
    width: 50px !important;
    max-width: 50px !important;
    min-width: 50px !important;
}

.btn-grid-button {
    box-shadow: none !important;
    margin: 0 2px;
}

.btn-grid-button * {
    color: #fff !important;
}
