/* Template Name: Minton - Responsive Bootstrap 4 Admin Dashboard Author: CoderThemes Version: 5.0.0 Website: https://coderthemes.com/ Contact: support@coderthemes.com File: Main Css File (Creative Demo) */ @import url("https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap"); @import url("https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600&display=swap"); html { position: relative; min-height: 100%; } body { overflow-x: hidden; } #wrapper { height: 100%; overflow: hidden; width: 100%; } .content-page { margin-left: 240px; overflow: hidden; padding: 70px 15px 65px 15px; min-height: 80vh; } .left-side-menu { width: 240px; background: #ffffff; bottom: 0; padding: 20px 0; position: fixed; transition: all .1s ease-out; top: 0; padding-top: calc(70px + 20px); box-shadow: 0 0 35px 0 rgba(154, 161, 171, 0.15); z-index: 1; } .logo-box { height: 70px; width: 240px; transition: all .1s ease-out; background-color: #02a8b5; position: fixed; top: 0; z-index: 1; } .logo-box .logo { line-height: 70px; } .logo { display: block; } .logo span.logo-lg { display: block; } .logo span.logo-sm { display: none; } .logo .logo-lg-text-dark { color: #323a46; font-weight: 700; font-size: 22px; text-transform: uppercase; } .logo .logo-lg-text-light { color: #fff; font-weight: 700; font-size: 22px; text-transform: uppercase; } .logo-light { display: block; } .logo-dark { display: none; } #sidebar-menu > ul { list-style: none; padding: 0; } #sidebar-menu > ul > li > a { color: #6e768e; display: block; padding: 12px 20px; position: relative; transition: all 0.4s; font-family: "Inter", sans-serif; font-size: 0.93rem; } #sidebar-menu > ul > li > a:hover, #sidebar-menu > ul > li > a:focus, #sidebar-menu > ul > li > a:active { color: #02a8b5; text-decoration: none; } #sidebar-menu > ul > li > a > span { vertical-align: middle; } #sidebar-menu > ul > li > a i { display: inline-block; line-height: 1.0625rem; margin: 0 10px 0 3px; text-align: center; vertical-align: middle; width: 16px; font-size: 16px; } #sidebar-menu > ul > li > a svg { width: 16px; height: 16px; margin-left: 3px; margin-right: 10px; } #sidebar-menu > ul > li > a .drop-arrow { float: right; } #sidebar-menu > ul > li > a .drop-arrow i { margin-right: 0; } #sidebar-menu > ul > li > a.mm-active { color: #02a8b5; } #sidebar-menu > ul > li ul { padding-left: 34px; list-style: none; } #sidebar-menu > ul > li ul ul { padding-left: 20px; } #sidebar-menu .badge { margin-top: 4px; } #sidebar-menu .menu-title { padding: 10px 20px; letter-spacing: .05em; pointer-events: none; cursor: default; font-size: 0.6875rem; text-transform: uppercase; color: #6e768e; font-weight: 600; } #sidebar-menu .menuitem-active > a { color: #02a8b5; } #sidebar-menu .menuitem-active .active { color: #02a8b5; } .nav-second-level li a { padding: 8px 20px; color: #6e768e; display: block; position: relative; transition: all 0.4s; font-size: 0.835rem; } .nav-second-level li a:focus, .nav-second-level li a:hover { color: #02a8b5; } .nav-second-level li.active > a { color: #02a8b5; } .menu-arrow { transition: transform .15s; position: absolute; right: 20px; display: inline-block; font-family: 'Material Design Icons'; text-rendering: auto; line-height: 1.5rem; font-size: 1.1rem; transform: translate(0, 0); } .menu-arrow:before { content: "\F0142"; } li > a[aria-expanded="true"] > span.menu-arrow { transform: rotate(90deg); } li.menuitem-active > a:not(.collapsed) > span.menu-arrow { transform: rotate(90deg); } body[data-sidebar-size="condensed"] .logo-box { width: 70px !important; } body[data-sidebar-size="condensed"] .logo span.logo-lg { display: none; } body[data-sidebar-size="condensed"] .logo span.logo-sm { display: block; } body[data-sidebar-size="condensed"] .left-side-menu { position: absolute; padding-top: 70px; width: 70px !important; z-index: 5; } body[data-sidebar-size="condensed"] .left-side-menu .simplebar-mask, body[data-sidebar-size="condensed"] .left-side-menu .simplebar-content-wrapper { overflow: visible !important; } body[data-sidebar-size="condensed"] .left-side-menu .simplebar-scrollbar { display: none !important; } body[data-sidebar-size="condensed"] .left-side-menu .simplebar-offset { bottom: 0 !important; } body[data-sidebar-size="condensed"] .left-side-menu #sidebar-menu .menu-title, body[data-sidebar-size="condensed"] .left-side-menu #sidebar-menu .menu-arrow, body[data-sidebar-size="condensed"] .left-side-menu #sidebar-menu .label, body[data-sidebar-size="condensed"] .left-side-menu #sidebar-menu .badge, body[data-sidebar-size="condensed"] .left-side-menu #sidebar-menu .collapse.in { display: none !important; } body[data-sidebar-size="condensed"] .left-side-menu #sidebar-menu .nav.collapse { height: inherit !important; } body[data-sidebar-size="condensed"] .left-side-menu #sidebar-menu > ul > li { position: relative; white-space: nowrap; } body[data-sidebar-size="condensed"] .left-side-menu #sidebar-menu > ul > li > a { padding: 15px 20px; min-height: 54px; transition: none; } body[data-sidebar-size="condensed"] .left-side-menu #sidebar-menu > ul > li > a:hover, body[data-sidebar-size="condensed"] .left-side-menu #sidebar-menu > ul > li > a:active, body[data-sidebar-size="condensed"] .left-side-menu #sidebar-menu > ul > li > a:focus { color: #02a8b5; } body[data-sidebar-size="condensed"] .left-side-menu #sidebar-menu > ul > li > a i { font-size: 1.2rem; margin-right: 20px; margin-left: 5px; } body[data-sidebar-size="condensed"] .left-side-menu #sidebar-menu > ul > li > a svg { width: 18px; height: 18px; margin-left: 6px; } body[data-sidebar-size="condensed"] .left-side-menu #sidebar-menu > ul > li > a span { display: none; padding-left: 25px; } body[data-sidebar-size="condensed"] .left-side-menu #sidebar-menu > ul > li:hover > a { position: relative; width: calc(190px + 70px); color: #02a8b5; background-color: #f4f9fb; box-shadow: inset 0 1px 7px 0 rgba(154, 161, 171, 0.2); } body[data-sidebar-size="condensed"] .left-side-menu #sidebar-menu > ul > li:hover > a span { display: inline; } body[data-sidebar-size="condensed"] .left-side-menu #sidebar-menu > ul > li:hover a.open :after, body[data-sidebar-size="condensed"] .left-side-menu #sidebar-menu > ul > li:hover a.active :after { display: none; } body[data-sidebar-size="condensed"] .left-side-menu #sidebar-menu > ul > li:hover > .collapse { display: block !important; height: auto !important; transition: none !important; } body[data-sidebar-size="condensed"] .left-side-menu #sidebar-menu > ul > li:hover > .collapse > ul { display: block !important; left: 70px; position: absolute; width: 190px; box-shadow: 0 1px 7px 0 rgba(154, 161, 171, 0.2); } body[data-sidebar-size="condensed"] .left-side-menu #sidebar-menu > ul > li:hover > .collapse > ul ul { box-shadow: 0 1px 7px 0 rgba(154, 161, 171, 0.2); } body[data-sidebar-size="condensed"] .left-side-menu #sidebar-menu > ul > li:hover > .collapse > ul a { box-shadow: none; padding: 8px 20px; position: relative; width: 190px; z-index: 6; } body[data-sidebar-size="condensed"] .left-side-menu #sidebar-menu > ul > li:hover > .collapse > ul a:hover { color: #02a8b5; } body[data-sidebar-size="condensed"] .left-side-menu #sidebar-menu > ul .collapsing { display: block !important; height: auto !important; transition: none !important; } body[data-sidebar-size="condensed"] .left-side-menu #sidebar-menu > ul ul { padding: 5px 0; z-index: 9999; display: none; background-color: #ffffff; } body[data-sidebar-size="condensed"] .left-side-menu #sidebar-menu > ul ul li:hover > .collapse { display: block !important; height: auto !important; transition: none !important; } body[data-sidebar-size="condensed"] .left-side-menu #sidebar-menu > ul ul li:hover > .collapse > ul { display: block; left: 190px; margin-top: -36px; position: absolute; width: 190px; } body[data-sidebar-size="condensed"] .left-side-menu #sidebar-menu > ul ul li > a span.pull-right { position: absolute; right: 20px; top: 12px; transform: rotate(270deg); } body[data-sidebar-size="condensed"] .left-side-menu #sidebar-menu > ul ul li.active a { color: #02a8b5; } body[data-sidebar-size="condensed"] .content-page { margin-left: 70px !important; } @media (min-width: 992px) { body[data-sidebar-size="condensed"] .footer { left: 70px !important; } } body[data-sidebar-size="condensed"] .user-box { display: none !important; } @media (min-width: 768px) { body[data-sidebar-size="condensed"]:not([data-layout="compact"]):not(.auth-fluid-pages) { min-height: 1550px; } } @media (max-width: 767.98px) { .pro-user-name { display: none; } } @media (max-width: 991.98px) { body { overflow-x: hidden; padding-bottom: 80px; } .left-side-menu { display: none; z-index: 100 !important; } .sidebar-enable .left-side-menu { display: block; } .content-page, body[data-sidebar-size="condensed"] .content-page { margin-left: 0 !important; } .footer { left: 0 !important; } } /* ============= Small Menu ============= */ body[data-sidebar-size="compact"]:not([data-sidebar-size="condensed"]) .logo-box { width: 160px !important; } body[data-sidebar-size="compact"]:not([data-sidebar-size="condensed"]) .left-side-menu { width: 160px !important; text-align: center; } body[data-sidebar-size="compact"]:not([data-sidebar-size="condensed"]) .left-side-menu #sidebar-menu > ul > li > a > i { display: block; font-size: 18px; line-height: 24px; width: 100%; margin: 0; } body[data-sidebar-size="compact"]:not([data-sidebar-size="condensed"]) .left-side-menu #sidebar-menu > ul > li > a svg { display: block; margin: 0 auto 5px auto; } body[data-sidebar-size="compact"]:not([data-sidebar-size="condensed"]) .left-side-menu #sidebar-menu > ul ul { padding-left: 0; } body[data-sidebar-size="compact"]:not([data-sidebar-size="condensed"]) .left-side-menu #sidebar-menu > ul ul a { padding: 10px 20px; } body[data-sidebar-size="compact"]:not([data-sidebar-size="condensed"]) .left-side-menu .menu-arrow, body[data-sidebar-size="compact"]:not([data-sidebar-size="condensed"]) .left-side-menu .badge { display: none !important; } body[data-sidebar-size="compact"]:not([data-sidebar-size="condensed"]) .left-side-menu + .content-page { margin-left: 160px; } body[data-sidebar-size="compact"]:not([data-sidebar-size="condensed"]) .left-side-menu + .content-page .footer { left: 160px; } body[data-sidebar-size="compact"]:not([data-sidebar-size="condensed"]) .left-side-menu .menu-title { background-color: #f4f9fb; } body[data-sidebar-size="compact"]:not([data-sidebar-size="condensed"]) .navbar-custom { left: 160px; } body[data-sidebar-color="dark"]:not([data-layout-mode="detached"]) .logo-box { background-color: #38414a; } body[data-sidebar-color="dark"]:not([data-layout-mode="detached"]) .logo-box .logo-dark { display: none; } body[data-sidebar-color="dark"]:not([data-layout-mode="detached"]) .logo-box .logo-light { display: block; } body[data-sidebar-color="dark"] .left-side-menu { background-color: #38414a; box-shadow: none; } body[data-sidebar-color="dark"] .left-side-menu #sidebar-menu > ul > li > a { color: #9097a7; } body[data-sidebar-color="dark"] .left-side-menu #sidebar-menu > ul > li > a:hover, body[data-sidebar-color="dark"] .left-side-menu #sidebar-menu > ul > li > a:focus, body[data-sidebar-color="dark"] .left-side-menu #sidebar-menu > ul > li > a:active { color: #c8cddc; } body[data-sidebar-color="dark"] .left-side-menu #sidebar-menu > ul > li > a.mm-active { color: #ffffff; background-color: #3d4751; } body[data-sidebar-color="dark"] .left-side-menu #sidebar-menu > ul > li:hover > .collapse > ul a:hover { color: #c8cddc; } body[data-sidebar-color="dark"] .left-side-menu #sidebar-menu .menu-title { color: #adb5bd; } body[data-sidebar-color="dark"] .left-side-menu #sidebar-menu .menuitem-active > a { color: #fff !important; } body[data-sidebar-color="dark"] .left-side-menu #sidebar-menu .menuitem-active .active { color: #fff !important; } body[data-sidebar-color="dark"] .left-side-menu .nav-second-level li a, body[data-sidebar-color="dark"] .left-side-menu .nav-thrid-level li a { color: #9097a7; } body[data-sidebar-color="dark"] .left-side-menu .nav-second-level li a:focus, body[data-sidebar-color="dark"] .left-side-menu .nav-second-level li a:hover, body[data-sidebar-color="dark"] .left-side-menu .nav-thrid-level li a:focus, body[data-sidebar-color="dark"] .left-side-menu .nav-thrid-level li a:hover { background-color: transparent; color: #c8cddc; } body[data-sidebar-color="dark"] .left-side-menu .nav-second-level li.active > a, body[data-sidebar-color="dark"] .left-side-menu .nav-thrid-level li.active > a { color: #ffffff; } body[data-sidebar-color="dark"] .left-side-menu .user-box .dropdown > a { color: #fff !important; } body[data-sidebar-color="dark"] .left-side-menu .user-box .dropdown + p { color: rgba(255, 255, 255, 0.7) !important; } body[data-sidebar-color="dark"][data-sidebar-size="condensed"] #wrapper .left-side-menu #sidebar-menu > ul ul { background-color: #38414a; } body[data-sidebar-color="dark"][data-sidebar-size="condensed"] #wrapper .left-side-menu #sidebar-menu > ul ul > a:hover, body[data-sidebar-color="dark"][data-sidebar-size="condensed"] #wrapper .left-side-menu #sidebar-menu > ul ul > a:active, body[data-sidebar-color="dark"][data-sidebar-size="condensed"] #wrapper .left-side-menu #sidebar-menu > ul ul > a:focus { color: #c8cddc !important; } body[data-sidebar-color="dark"][data-sidebar-size="condensed"] #wrapper .left-side-menu #sidebar-menu > ul ul:hover > a { color: #fff !important; } body[data-sidebar-color="dark"][data-sidebar-size="condensed"] #wrapper .left-side-menu #sidebar-menu > ul ul:hover > .collapse > ul a:hover { color: #c8cddc; } body[data-sidebar-color="dark"][data-sidebar-size="condensed"] #wrapper .left-side-menu #sidebar-menu > ul > li:hover > a { background-color: #38414a; box-shadow: none; } body[data-sidebar-color="dark"][data-sidebar-size="condensed"] #wrapper .left-side-menu #sidebar-menu .mm-active .active { color: #02a8b5; } body[data-sidebar-color="dark"][data-sidebar-size="compact"] #wrapper .left-side-menu .menu-title { background-color: rgba(255, 255, 255, 0.03); } body[data-sidebar-color="brand"]:not([data-layout-mode="detached"]) .logo-box, body[data-sidebar-color="gradient"]:not([data-layout-mode="detached"]) .logo-box { background-color: #02a8b5; } body[data-sidebar-color="brand"]:not([data-layout-mode="detached"]) .logo-box .logo-dark, body[data-sidebar-color="gradient"]:not([data-layout-mode="detached"]) .logo-box .logo-dark { display: none; } body[data-sidebar-color="brand"]:not([data-layout-mode="detached"]) .logo-box .logo-light, body[data-sidebar-color="gradient"]:not([data-layout-mode="detached"]) .logo-box .logo-light { display: block; } body[data-sidebar-color="brand"] .menuitem-active > a, body[data-sidebar-color="gradient"] .menuitem-active > a { color: #fff !important; } body[data-sidebar-color="brand"] .left-side-menu, body[data-sidebar-color="gradient"] .left-side-menu { background-color: #02a8b5; box-shadow: none; } body[data-sidebar-color="brand"] .left-side-menu #sidebar-menu > ul > li > a, body[data-sidebar-color="gradient"] .left-side-menu #sidebar-menu > ul > li > a { color: rgba(255, 255, 255, 0.7); } body[data-sidebar-color="brand"] .left-side-menu #sidebar-menu > ul > li > a:hover, body[data-sidebar-color="brand"] .left-side-menu #sidebar-menu > ul > li > a:focus, body[data-sidebar-color="brand"] .left-side-menu #sidebar-menu > ul > li > a:active, body[data-sidebar-color="gradient"] .left-side-menu #sidebar-menu > ul > li > a:hover, body[data-sidebar-color="gradient"] .left-side-menu #sidebar-menu > ul > li > a:focus, body[data-sidebar-color="gradient"] .left-side-menu #sidebar-menu > ul > li > a:active { color: rgba(255, 255, 255, 0.9); } body[data-sidebar-color="brand"] .left-side-menu #sidebar-menu > ul > li > a.mm-active, body[data-sidebar-color="gradient"] .left-side-menu #sidebar-menu > ul > li > a.mm-active { color: #fff; background-color: rgba(255, 255, 255, 0.07); } body[data-sidebar-color="brand"] .left-side-menu #sidebar-menu .menu-title, body[data-sidebar-color="gradient"] .left-side-menu #sidebar-menu .menu-title { color: rgba(255, 255, 255, 0.6); } body[data-sidebar-color="brand"] .left-side-menu #sidebar-menu .mm-active .active, body[data-sidebar-color="gradient"] .left-side-menu #sidebar-menu .mm-active .active { color: #fff; } body[data-sidebar-color="brand"] .left-side-menu .nav-second-level li a, body[data-sidebar-color="brand"] .left-side-menu .nav-thrid-level li a, body[data-sidebar-color="gradient"] .left-side-menu .nav-second-level li a, body[data-sidebar-color="gradient"] .left-side-menu .nav-thrid-level li a { color: rgba(255, 255, 255, 0.7); } body[data-sidebar-color="brand"] .left-side-menu .nav-second-level li a:focus, body[data-sidebar-color="brand"] .left-side-menu .nav-second-level li a:hover, body[data-sidebar-color="brand"] .left-side-menu .nav-thrid-level li a:focus, body[data-sidebar-color="brand"] .left-side-menu .nav-thrid-level li a:hover, body[data-sidebar-color="gradient"] .left-side-menu .nav-second-level li a:focus, body[data-sidebar-color="gradient"] .left-side-menu .nav-second-level li a:hover, body[data-sidebar-color="gradient"] .left-side-menu .nav-thrid-level li a:focus, body[data-sidebar-color="gradient"] .left-side-menu .nav-thrid-level li a:hover { background-color: transparent; color: #fff; } body[data-sidebar-color="brand"] .left-side-menu .nav-second-level li.active > a, body[data-sidebar-color="brand"] .left-side-menu .nav-thrid-level li.active > a, body[data-sidebar-color="gradient"] .left-side-menu .nav-second-level li.active > a, body[data-sidebar-color="gradient"] .left-side-menu .nav-thrid-level li.active > a { color: #ffffff; } body[data-sidebar-color="brand"] .left-side-menu .user-box .dropdown > a, body[data-sidebar-color="gradient"] .left-side-menu .user-box .dropdown > a { color: #fff !important; } body[data-sidebar-color="brand"] .left-side-menu .user-box .dropdown + p, body[data-sidebar-color="gradient"] .left-side-menu .user-box .dropdown + p { color: rgba(255, 255, 255, 0.7) !important; } body[data-sidebar-color="brand"][data-sidebar-size="condensed"] #wrapper .left-side-menu #sidebar-menu > ul > li:hover > a, body[data-sidebar-color="gradient"][data-sidebar-size="condensed"] #wrapper .left-side-menu #sidebar-menu > ul > li:hover > a { background-color: #02a8b5; box-shadow: none; color: #fff; } body[data-sidebar-color="brand"][data-sidebar-size="condensed"] #wrapper .left-side-menu #sidebar-menu .mm-active .active, body[data-sidebar-color="gradient"][data-sidebar-size="condensed"] #wrapper .left-side-menu #sidebar-menu .mm-active .active { color: #02a8b5; } body[data-sidebar-color="brand"][data-sidebar-size="condensed"] #wrapper .left-side-menu .nav-second-level li a, body[data-sidebar-color="brand"][data-sidebar-size="condensed"] #wrapper .left-side-menu .nav-thrid-level li a, body[data-sidebar-color="gradient"][data-sidebar-size="condensed"] #wrapper .left-side-menu .nav-second-level li a, body[data-sidebar-color="gradient"][data-sidebar-size="condensed"] #wrapper .left-side-menu .nav-thrid-level li a { color: #6e768e; } body[data-sidebar-color="brand"][data-sidebar-size="compact"] #wrapper .left-side-menu .menu-title, body[data-sidebar-color="gradient"][data-sidebar-size="compact"] #wrapper .left-side-menu .menu-title { background-color: rgba(255, 255, 255, 0.05); } body[data-sidebar-color="gradient"] .logo-box, body[data-sidebar-color="gradient"] .left-side-menu { background: #242540 !important; background-image: linear-gradient(270deg, rgba(64, 149, 216, 0.15), transparent) !important; } body[data-sidebar-color="gradient"][data-sidebar-size="condensed"] #wrapper .left-side-menu #sidebar-menu > ul > li:hover > a { background: #242540; } body[data-sidebar-color="gradient"][data-sidebar-size="condensed"] #wrapper .left-side-menu #sidebar-menu .mm-active .active { color: #02a8b5; } body[data-sidebar-color="gradient"][data-sidebar-size="condensed"] #wrapper .left-side-menu .nav-second-level li a, body[data-sidebar-color="gradient"][data-sidebar-size="condensed"] #wrapper .left-side-menu .nav-thrid-level li a { color: #6e768e; } .user-box { display: none; } .user-pro-dropdown { width: 90%; min-width: 1px; margin-left: 5%; margin-top: 10px; } body[data-layout-mode="detached"] .left-side-menu { top: 70px; padding-top: 0; } body[data-layout-mode="detached"] .left-side-menu .logo-box { display: none; } @media (min-width: 992px) { body[data-layout-mode="detached"] .navbar-custom { left: 0 !important; } body[data-layout-mode="detached"] .navbar-custom .container-fluid { max-width: 95%; } body[data-layout-mode="detached"] #wrapper { max-width: 95%; margin: 0 auto; } body[data-layout-mode="detached"] .left-side-menu { margin-top: 30px; margin-bottom: 30px; border-radius: 5px; } body[data-layout-mode="detached"] .content-page { padding-bottom: 30px; } body[data-layout-mode="detached"] .logo-box { background-color: transparent !important; background-image: none !important; } } body[data-layout-mode="detached"]:not([data-sidebar-size="condensed"]) .left-side-menu { padding-top: 30px; } body[data-sidebar-showuser="true"] .user-box { display: block; } body[data-sidebar-icon="twotones"] #sidebar-menu > ul > li > a i { color: #3b82da; } body[data-sidebar-icon="twotones"] #sidebar-menu > ul > li > a svg { width: 18px; height: 18px; margin-left: 3px; margin-right: 10px; color: #3b82da; fill: rgba(59, 130, 218, 0.2); } .navbar-custom { background-color: #02a8b5; box-shadow: 0 0 35px 0 rgba(154, 161, 171, 0.15); padding: 0 10px 0 0; position: fixed; left: 240px; right: 0; top: -10; height: 61px; transition: all .1s ease-out; z-index: 1001; /* Search */ } .navbar-custom .logo-box { display: none; } .navbar-custom .topnav-menu > li { float: left; } .navbar-custom .topnav-menu .nav-link { padding: 0 15px; color: rgba(255, 255, 255, 0.75); min-width: 32px; display: block; line-height: 70px; text-align: center; max-height: 70px; } .navbar-custom .dropdown.show .nav-link { background-color: rgba(255, 255, 255, 0.1); } .navbar-custom .container-fluid { padding: 0; } .navbar-custom .app-search { height: 70px; display: table; max-width: 180px; margin-right: 20px; } .navbar-custom .app-search .app-search-box { display: table-cell; vertical-align: middle; position: relative; } .navbar-custom .app-search .app-search-box input:-ms-input-placeholder { font-size: 0.8125rem; color: rgba(255, 255, 255, 0.6); } .navbar-custom .app-search .app-search-box input::-ms-input-placeholder { font-size: 0.8125rem; color: rgba(255, 255, 255, 0.6); } .navbar-custom .app-search .app-search-box input::placeholder { font-size: 0.8125rem; color: rgba(255, 255, 255, 0.6); } .navbar-custom .app-search .form-control { border: none; height: 38px; padding-left: 20px; padding-right: 0; color: #fff; background-color: rgba(255, 255, 255, 0.12); box-shadow: none; border-radius: 30px 0 0 30px; } .navbar-custom .app-search .input-group-append { margin-left: 0; z-index: 4; } .navbar-custom .app-search .btn { background-color: rgba(255, 255, 255, 0.12); border-color: transparent; color: rgba(255, 255, 255, 0.5); border-radius: 0 30px 30px 0; box-shadow: none !important; } .navbar-custom .button-menu-mobile { border: none; color: #fff; display: inline-block; height: 70px; line-height: 70px; width: 60px; background-color: transparent; font-size: 24px; cursor: pointer; } .navbar-custom .button-menu-mobile.disable-btn { display: none; } /* Notification */ .noti-scroll { max-height: 230px; } .notification-list { margin-left: 0; } .notification-list .noti-title { background-color: transparent; padding: 15px 20px; } .notification-list .noti-icon-badge { display: inline-block; position: absolute; top: 16px; right: 10px; } .notification-list .notify-item { padding: 12px 20px; } .notification-list .notify-item .notify-icon { float: left; height: 36px; width: 36px; font-size: 18px; line-height: 38px; text-align: center; margin-right: 10px; border-radius: 50%; color: #fff; } .notification-list .notify-item .badge { margin-top: 5px; } .notification-list .notify-item .notify-details { margin-bottom: 5px; overflow: hidden; margin-left: 45px; text-overflow: ellipsis; white-space: nowrap; color: #343a40; } .notification-list .notify-item .notify-details b { font-weight: 500; } .notification-list .notify-item .notify-details small { display: block; } .notification-list .notify-item .notify-details span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; } .notification-list .notify-item .user-msg { margin-left: 45px; white-space: normal; line-height: 16px; } .notification-list .profile-dropdown .notify-item { padding: 7px 20px; } .noti-icon { font-size: 21px; vertical-align: middle; } .profile-dropdown { min-width: 170px; } .profile-dropdown i { vertical-align: middle; margin-right: 5px; font-size: 16px; } .nav-user { padding: 0 12px !important; } .nav-user img { height: 32px; width: 32px; } .fullscreen-enable [data-toggle="fullscreen"] .fe-maximize::before { content: "\e88d"; } @media (max-width: 991.98px) { .logo-box { width: 70px !important; padding-right: 0 !important; } .logo-box .logo-lg { display: none !important; } .logo-box .logo-sm { display: block !important; } .navbar-custom { left: 0 !important; } } @media (max-width: 600px) { .navbar-custom .dropdown { position: static; } .navbar-custom .dropdown .dropdown-menu { left: 10px !important; right: 10px !important; } } body[data-sidebar-size="condensed"] .navbar-custom { left: 70px; } body[data-topbar-color="light"] .navbar-custom { background-color: #ffffff !important; box-shadow: 0 1px 1px rgba(50, 58, 70, 0.1); /* Search */ } body[data-topbar-color="light"] .navbar-custom .topnav-menu .nav-link { color: #6c757d; } body[data-topbar-color="light"] .navbar-custom .dropdown.show .nav-link { background-color: rgba(50, 58, 70, 0.03); } body[data-topbar-color="light"] .navbar-custom .button-menu-mobile { color: #323a46; } body[data-topbar-color="light"] .navbar-custom .app-search input:-ms-input-placeholder { color: #adb5bd !important; } body[data-topbar-color="light"] .navbar-custom .app-search input::-ms-input-placeholder { color: #adb5bd !important; } body[data-topbar-color="light"] .navbar-custom .app-search input::placeholder { color: #adb5bd !important; } body[data-topbar-color="light"] .navbar-custom .app-search .form-control { color: #323a46; background-color: #f4f9fb; border-color: #f4f9fb; } body[data-topbar-color="light"] .navbar-custom .app-search .btn { background-color: #f4f9fb; color: #ced4da; } body[data-topbar-color="light"] .logo-dark { display: block; } body[data-topbar-color="light"] .logo-light { display: none; } body[data-topbar-color="light"][data-sidebar-color="light"] .logo-box { background-color: #fff; } @media (max-width: 1366.98px) { body[data-layout-mode="horizontal"] .navbar-custom, body[data-layout-mode="detached"] .navbar-custom { padding: 0 !important; } } @media (max-width: 991.98px) { body[data-layout-mode="horizontal"] .navbar-custom { padding: 0 calc(12px) !important; } body[data-layout-mode="horizontal"] .navbar-toggle { border: 0; position: relative; padding: 0; margin: 0; cursor: pointer; } body[data-layout-mode="horizontal"] .navbar-toggle .lines { width: 25px; display: block; position: relative; height: 16px; transition: all .5s ease; margin-top: calc(54px / 2); } body[data-layout-mode="horizontal"] .navbar-toggle span { height: 2px; width: 100%; background-color: #fff; display: block; margin-bottom: 5px; transition: transform .5s ease; } body[data-layout-mode="horizontal"] .navbar-toggle span:first-child { width: 75%; } body[data-layout-mode="horizontal"] .navbar-toggle span:last-child { width: 50%; } body[data-layout-mode="horizontal"] .navbar-toggle.open span { position: absolute; } body[data-layout-mode="horizontal"] .navbar-toggle.open span:first-child { top: 7px; transform: rotate(45deg); width: 100%; } body[data-layout-mode="horizontal"] .navbar-toggle.open span:nth-child(2) { visibility: hidden; } body[data-layout-mode="horizontal"] .navbar-toggle.open span:last-child { width: 100%; top: 7px; transform: rotate(-45deg); } body[data-layout-mode="horizontal"] .logo-box { width: 45px !important; } body[data-topbar-color="light"] .navbar-toggle span { background-color: #6c757d; } } body[data-layout-mode="horizontal"][data-layout-width="boxed"] .navbar-custom { max-width: 1300px !important; } body[data-layout-mode="horizontal"] .button-menu-mobile { display: none; } body[data-layout-mode="horizontal"] .logo-box { width: auto; padding-right: 50px; float: left; position: relative; background-color: transparent; } @media (min-width: 992px) and (max-width: 1366px) { body[data-layout-mode="horizontal"] .logo-box { padding-left: 20px; } } @media (max-width: 360px) { .navbar-custom .topnav-menu .nav-link { padding: 0 12px; } .navbar-custom .button-menu-mobile { width: 45px; } } body[data-layout-mode="detached"] .logo-box { float: left; position: relative; } body[data-layout-mode="detached"] .navbar-custom { left: 0; right: 0; } body[data-layout-mode="detached"] .navbar-custom .logo-box { display: block; } .page-title-box { background-color: #fff; align-items: center; justify-content: space-between; display: flex; margin: 0 -27px 30px; padding: 15px 27px; box-shadow: 0 1px 1px rgba(50, 58, 70, 0.1); } .page-title-box .page-title { font-size: 1.1rem; margin: 0; color: #323a46; } .page-title-box .breadcrumb { padding: 0; } .page-title-box-alt { background-color: transparent; padding: 24px 27px; box-shadow: none; margin-bottom: 0; } @media (max-width: 639px) { .page-title-box { display: block; } .page-title-box .page-title { display: block; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } .page-title-box .page-title-right { display: block; padding-top: 5px; } } .footer { bottom: 0; padding: 19px 15px 20px; position: absolute; right: 0; color: #93a4ad; left: 240px; background-color: #e8eff5; } .footer .footer-links a { color: #93a4ad; margin-left: 1.5rem; transition: all .4s; } .footer .footer-links a:hover { color: #323a46; } .footer .footer-links a:first-of-type { margin-left: 0; } .footer-alt { left: 0 !important; text-align: center; background-color: transparent; } @media (max-width: 767.98px) { .footer { left: 0 !important; text-align: center; } } body[data-layout-mode="horizontal"] .footer { left: 0 !important; } body[data-layout-mode="horizontal"][data-layout-width="boxed"] .footer { max-width: 1300px !important; } @media (min-width: 992px) { body[data-layout-mode="detached"] .footer { position: inherit; margin: 0 10px; } } .right-bar { background-color: #ffffff; box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.06), 0 1px 0 0 rgba(0, 0, 0, 0.02); display: block; position: fixed; transition: all 200ms ease-out; width: 270px; z-index: 9999; float: right !important; right: -280px; top: 0; bottom: 0; } .right-bar .rightbar-title { background-color: #02a8b5; padding: 27px 25px; color: #fff; } .right-bar .right-bar-toggle { background-color: #414b5b; height: 24px; width: 24px; line-height: 27px; color: #fff; text-align: center; border-radius: 50%; margin-top: -4px; } .right-bar .right-bar-toggle:hover { background-color: #475364; } .right-bar .user-box { padding: 25px; text-align: center; } .right-bar .user-box .user-img { position: relative; height: 64px; width: 64px; margin: 0 auto 15px auto; } .right-bar .user-box .user-img .user-edit { position: absolute; right: -5px; bottom: 0px; height: 24px; width: 24px; background-color: #fff; line-height: 24px; border-radius: 50%; box-shadow: 0 0 45px 0 rgba(0, 0, 0, 0.12); } .right-bar .user-box h5 { margin-bottom: 2px; } .right-bar .user-box h5 a { color: #323a46; } .right-bar .notification-item .media { padding: 0.75rem 1rem; } .right-bar .notification-item .media:hover { background-color: #f4f9fb; } .rightbar-overlay { background-color: rgba(50, 58, 70, 0.2); position: absolute; left: 0; right: 0; top: 0; bottom: 0; display: none; z-index: 9998; transition: all .2s ease-out; } .right-bar-enabled .right-bar { right: 0; } .right-bar-enabled .rightbar-overlay { display: block; } @media (max-width: 767.98px) { .right-bar { overflow: auto; } .right-bar .slimscroll-menu { height: auto !important; } } body[data-layout-width="boxed"] #wrapper { max-width: 1300px; margin: 0 auto; box-shadow: 0 0 45px 0 rgba(0, 0, 0, 0.12); } body[data-layout-width="boxed"] .navbar-custom { max-width: calc(1300px - 240px); margin: 0 auto; } body[data-layout-width="boxed"] .footer { margin: 0 auto; max-width: calc(1300px - 240px); } body[data-layout-width="boxed"][data-sidebar-size="condensed"] .navbar-custom, body[data-layout-width="boxed"][data-sidebar-size="condensed"] .footer { max-width: calc(1300px - 70px); } body[data-layout-width="boxed"][data-sidebar-size="compact"] .footer { max-width: calc(1300px - 160px); } @media (min-width: 768px) { body[data-layout-width="boxed"][data-sidebar-size="condensed"]:not([data-layout-mode="horizontal"]) .content-page { min-height: calc(1550px - 60px); } } @media (min-width: 1367px) { body[data-layout-menu-position="scrollable"]:not([data-sidebar-size="condensed"]):not([data-sidebar-size="compact"]):not([data-layout-mode="two-column"]) { padding-bottom: 0; } body[data-layout-menu-position="scrollable"]:not([data-sidebar-size="condensed"]):not([data-sidebar-size="compact"]):not([data-layout-mode="two-column"]) #wrapper { display: flex; } body[data-layout-menu-position="scrollable"]:not([data-sidebar-size="condensed"]):not([data-sidebar-size="compact"]):not([data-layout-mode="two-column"]) .navbar-custom, body[data-layout-menu-position="scrollable"]:not([data-sidebar-size="condensed"]):not([data-sidebar-size="compact"]):not([data-layout-mode="two-column"]) .topnav { position: absolute; } body[data-layout-menu-position="scrollable"]:not([data-sidebar-size="condensed"]):not([data-sidebar-size="compact"]):not([data-layout-mode="two-column"]) .left-side-menu { position: relative; min-width: 240px; max-width: 240px; padding: 0; transition: none; } body[data-layout-menu-position="scrollable"]:not([data-sidebar-size="condensed"]):not([data-sidebar-size="compact"]):not([data-layout-mode="two-column"]) .left-side-menu .logo-box { position: relative; transition: none; margin-bottom: 20px; } body[data-layout-menu-position="scrollable"]:not([data-sidebar-size="condensed"]):not([data-sidebar-size="compact"]):not([data-layout-mode="two-column"]) .content-page { margin-left: 0; width: 100%; padding-bottom: 60px; } } @media (min-width: 1367px) { body[data-layout-mode="horizontal"] .container-fluid { max-width: 90%; } } body[data-layout-mode="horizontal"] .navbar-custom { padding: 0 24px; left: 0; right: 0; } body[data-layout-mode="horizontal"] .navbar-custom .logo-box { display: block; background-color: transparent; } body[data-layout-mode="horizontal"] .content-page { margin-left: 0 !important; } .topnav { background: #ffffff; box-shadow: 0 0 7px 0 rgba(154, 161, 171, 0.2); margin-top: 70px; padding: 0 calc(24px / 2); position: fixed; left: 0; right: 0; z-index: 100; } .topnav .topnav-menu { margin: 0; padding: 0; } .topnav .navbar-nav .nav-link { font-size: 0.93rem; position: relative; line-height: 22px; padding: calc(33px / 2) 1.1rem; color: #6e7488; font-family: "Inter", sans-serif; } .topnav .navbar-nav .nav-link i { font-size: 15px; display: inline-block; vertical-align: middle; } .topnav .navbar-nav .nav-link:focus, .topnav .navbar-nav .nav-link:hover { color: #02a8b5; background-color: transparent; } .topnav .navbar-nav .nav-item .dropdown.active > a.dropdown-toggle { color: #02a8b5; } @media (min-width: 992px) { .topnav { height: 55px; } .topnav .navbar-nav .nav-item:first-of-type .nav-link { padding-left: 0; } .topnav .dropdown-item { padding: .5rem 1.25rem; min-width: 180px; margin: 0 .3rem; width: auto; } .topnav .dropdown-item.active { background-color: transparent; color: #02a8b5; } .topnav .dropdown.mega-dropdown .mega-dropdown-menu { left: 0px; right: auto; } .topnav .dropdown .dropdown-menu { padding: 0.3rem 0; margin-top: 0; border-radius: 0 0 0.25rem 0.25rem; } .topnav .dropdown .dropdown-menu .arrow-down::after { right: 20px; transform: rotate(-135deg) translateY(-50%); position: absolute; } .topnav .dropdown .dropdown-menu .dropdown .dropdown-menu { position: absolute; top: 0 !important; left: 100%; display: none; } .topnav .dropdown:hover > .nav-link { color: #02a8b5; } .topnav .dropdown:hover > .dropdown-menu { display: block; } .topnav .dropdown:hover > .dropdown-menu > .dropdown:hover > .dropdown-item { color: #02a8b5; } .topnav .dropdown:hover > .dropdown-menu > .dropdown:hover > .dropdown-menu { display: block; } .navbar-toggle { display: none; } body[data-layout-mode="horizontal"] .content-page { padding: calc(70px + 55px) 12px 65px 12px; } } .arrow-down { display: inline-block; } .arrow-down:after { border-color: initial; border-style: solid; border-width: 0 0 1px 1px; content: ""; height: .4em; display: inline-block; right: 5px; top: 50%; margin-left: 10px; transform: rotate(-45deg) translateY(-50%); transform-origin: top; transition: all .3s ease-out; width: .4em; } @media (max-width: 1366.98px) { .topnav-menu .navbar-nav li:last-of-type .dropdown .dropdown-menu { right: 100%; left: auto; } } @media (max-width: 991.98px) { .topnav { max-height: 360px; overflow-y: auto; padding: 0; } .topnav .navbar-nav .nav-link { padding: 0.75rem 1.1rem; } .topnav .dropdown .dropdown-menu { background-color: transparent; border: none; box-shadow: none; padding-left: 15px; } .topnav .dropdown .dropdown-item { position: relative; background-color: transparent; } .topnav .dropdown .dropdown-item.active, .topnav .dropdown .dropdown-item:active { color: #02a8b5; } .topnav .arrow-down::after { right: 15px; position: absolute; } } @media (min-width: 992px) { body[data-layout-mode="horizontal"][data-topbar-color="light"] .topnav { background-color: #02a8b5; } body[data-layout-mode="horizontal"][data-topbar-color="light"] .topnav .navbar-nav .nav-link { color: rgba(255, 255, 255, 0.7); } body[data-layout-mode="horizontal"][data-topbar-color="light"] .topnav .navbar-nav .nav-link:focus, body[data-layout-mode="horizontal"][data-topbar-color="light"] .topnav .navbar-nav .nav-link:hover { color: rgba(255, 255, 255, 0.9); } body[data-layout-mode="horizontal"][data-topbar-color="light"] .topnav .navbar-nav .nav-link.active { color: #fff; } body[data-layout-mode="horizontal"][data-topbar-color="light"] .topnav .navbar-nav .nav-item:hover .nav-link { color: #fff; } body[data-layout-mode="horizontal"][data-topbar-color="light"] .topnav .navbar-nav > .dropdown.active > a { color: rgba(255, 255, 255, 0.9) !important; } } body[data-layout-mode="horizontal"][data-layout-width="boxed"] .topnav { max-width: 1300px; margin: 70px auto 0; } body[data-layout-mode="two-column"] .left-side-menu { width: calc(70px + 220px); background-color: transparent; box-shadow: none; } body[data-layout-mode="two-column"] .sidebar-icon-menu { position: fixed; width: 70px; z-index: 500; top: 0; bottom: 0; padding-bottom: 20px; background-color: #02a8b5; } body[data-layout-mode="two-column"] .sidebar-icon-menu .logo { display: block; width: 70px; height: 70px; line-height: 70px; text-align: center; } body[data-layout-mode="two-column"] .sidebar-icon-menu .nav { background-color: transparent; margin: 15px auto; } body[data-layout-mode="two-column"] .sidebar-icon-menu .nav .nav-link { text-align: center; width: 40px; height: 40px; line-height: 40px; margin: 10px auto; padding: 0px; border-radius: 4px; } body[data-layout-mode="two-column"] .sidebar-icon-menu .nav .nav-link.active { background-color: rgba(255, 255, 255, 0.12); box-shadow: 0 1px 1px rgba(50, 58, 70, 0.1); } body[data-layout-mode="two-column"] .sidebar-icon-menu .nav .nav-link svg { color: #fff; fill: rgba(255, 255, 255, 0.12); height: 22px; width: 22px; } body[data-layout-mode="two-column"] .sidebar-icon-menu .nav .nav-link i { color: #fff; font-size: 22px; } body[data-layout-mode="two-column"] .sidebar-main-menu { display: block; position: fixed; width: 220px; background-color: #ffffff; top: 70px; bottom: 0; left: 70px; padding: 30px 5px; box-shadow: 0 0 35px 0 rgba(154, 161, 171, 0.15); transition: all .1s ease-out; } body[data-layout-mode="two-column"] .sidebar-main-menu .sidebar-menu-body { padding: 20px; } body[data-layout-mode="two-column"] .sidebar-main-menu .menu-title { color: #adb5bd !important; margin: 0; padding: 10px 20px; letter-spacing: .05em; font-size: .7rem; text-transform: uppercase; font-weight: 600; } body[data-layout-mode="two-column"] .sidebar-main-menu .nav > .nav-item > .nav-link { color: #6e768e; font-size: 0.93rem; font-family: "Inter", sans-serif; } body[data-layout-mode="two-column"] .sidebar-main-menu .nav > .nav-item .menu-arrow { right: 10px; } body[data-layout-mode="two-column"] .sidebar-main-menu .nav .nav-link { position: relative; color: #6e768e; padding: 6px 15px; border-radius: 3px; margin: 3px 5px; } body[data-layout-mode="two-column"] .sidebar-main-menu .nav .nav-link:hover, body[data-layout-mode="two-column"] .sidebar-main-menu .nav .nav-link:focus, body[data-layout-mode="two-column"] .sidebar-main-menu .nav .nav-link.active { color: #02a8b5; } body[data-layout-mode="two-column"] .sidebar-main-menu .nav .menuitem-active > a.nav-link { color: #02a8b5; background-color: rgba(2, 168, 181, 0.07); } body[data-layout-mode="two-column"] .sidebar-main-menu .nav .menuitem-active a.active { color: #02a8b5; } body[data-layout-mode="two-column"] .sidebar-main-menu #sidebar-menu .menu-arrow { top: 7px; } body[data-layout-mode="two-column"] .sidebar-main-menu .nav-second-level { padding-left: 15px; list-style: none; } @media (min-width: 992px) { body[data-layout-mode="two-column"] .navbar-custom { left: 70px !important; padding-left: 0px; } body[data-layout-mode="two-column"] .navbar-custom .logo-box { width: 220px; display: block; position: relative; float: left; } body[data-layout-mode="two-column"] .navbar-custom .logo-box .logo-sm { display: none; } body[data-layout-mode="two-column"][data-sidebar-size="condensed"] .logo-box { width: 0 !important; } } body[data-layout-mode="two-column"][data-sidebar-color="light"] .logo-box { background-color: #ffffff; } body[data-layout-mode="two-column"][data-topbar-color="dark"] .logo-box { background-color: #02a8b5; } @media (min-width: 992px) { body[data-layout-mode="two-column"] .content-page { margin-left: calc(70px + 220px); } body[data-layout-mode="two-column"] .footer { left: calc(70px + 220px); } body[data-layout-mode="two-column"][data-sidebar-size="condensed"] .sidebar-main-menu { display: none; } } body[data-layout-mode="two-column"] .twocolumn-menu-item { display: none; } body[data-layout-mode="two-column"][data-sidebar-color="dark"] .sidebar-main-menu { background-color: #38414a; } body[data-layout-mode="two-column"][data-sidebar-color="dark"] .sidebar-main-menu .nav > .nav-item > .nav-link { color: #9097a7; } body[data-layout-mode="two-column"][data-sidebar-color="dark"] .sidebar-main-menu .nav .nav-link:hover, body[data-layout-mode="two-column"][data-sidebar-color="dark"] .sidebar-main-menu .nav .nav-link:focus, body[data-layout-mode="two-column"][data-sidebar-color="dark"] .sidebar-main-menu .nav .nav-link.active { color: #c8cddc; } body[data-layout-mode="two-column"][data-sidebar-color="dark"] .sidebar-main-menu .nav .menuitem-active > a.nav-link { color: #02a8b5; background-color: rgba(2, 168, 181, 0.07); } body[data-layout-mode="two-column"][data-sidebar-color="dark"] .sidebar-main-menu .nav .menuitem-active a.active { color: #02a8b5; } body[data-layout-mode="two-column"][data-sidebar-color="brand"] .sidebar-main-menu .nav > .nav-item > .nav-link, body[data-layout-mode="two-column"][data-sidebar-color="gradient"] .sidebar-main-menu .nav > .nav-item > .nav-link { color: rgba(255, 255, 255, 0.7); } body[data-layout-mode="two-column"][data-sidebar-color="brand"] .sidebar-main-menu .nav .nav-link:hover, body[data-layout-mode="two-column"][data-sidebar-color="brand"] .sidebar-main-menu .nav .nav-link:focus, body[data-layout-mode="two-column"][data-sidebar-color="brand"] .sidebar-main-menu .nav .nav-link.active, body[data-layout-mode="two-column"][data-sidebar-color="gradient"] .sidebar-main-menu .nav .nav-link:hover, body[data-layout-mode="two-column"][data-sidebar-color="gradient"] .sidebar-main-menu .nav .nav-link:focus, body[data-layout-mode="two-column"][data-sidebar-color="gradient"] .sidebar-main-menu .nav .nav-link.active { color: rgba(255, 255, 255, 0.9); } body[data-layout-mode="two-column"][data-sidebar-color="brand"] .sidebar-main-menu { background-color: #02a8b5; } body[data-layout-mode="two-column"][data-sidebar-color="gradient"] .sidebar-main-menu { background: #242540; background-image: linear-gradient(270deg, rgba(64, 149, 216, 0.15), transparent); } body[data-layout-mode="two-column"][data-layout-width="boxed"] .navbar-custom { max-width: calc(1300px - 70px); } body[data-layout-mode="two-column"][data-layout-width="boxed"] .sidebar-main-menu { position: absolute; top: 0; } body[data-layout-mode="two-column"][data-layout-width="boxed"]:not([data-sidebar-size="condensed"]) .footer { max-width: calc(1300px - calc(70px + 220px)); } .avatar-xs { height: 1.5rem; width: 1.5rem; } .avatar-sm { height: 2.25rem; width: 2.25rem; } .avatar-md { height: 3.5rem; width: 3.5rem; } .avatar-lg { height: 4.5rem; width: 4.5rem; } .avatar-xl { height: 6rem; width: 6rem; } .avatar-xxl { height: 7.5rem; width: 7.5rem; } .avatar-title { align-items: center; color: #fff; display: flex; height: 100%; justify-content: center; width: 100%; } .avatar-group { padding-left: 12px; } .avatar-group .avatar-group-item { margin: 0 0 10px -12px; display: inline-block; border: 2px solid #fff; border-radius: 50%; } .width-xs { min-width: 80px; } .width-sm { min-width: 100px; } .width-md { min-width: 120px; } .width-lg { min-width: 140px; } .width-xl { min-width: 160px; } .font-family-primary { font-family: "Inter", sans-serif; } .font-family-secondary { font-family: "Inter", sans-serif; } .sp-line-1, .sp-line-2, .sp-line-3, .sp-line-4 { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; } .sp-line-1 { -webkit-line-clamp: 1; } .sp-line-2 { -webkit-line-clamp: 2; } .sp-line-3 { -webkit-line-clamp: 3; } .sp-line-4 { -webkit-line-clamp: 4; } .icon-dual { color: #93a4ad; fill: rgba(147, 164, 173, 0.12); } .icon-dual-primary { color: #02a8b5; fill: rgba(2, 168, 181, 0.16); } .icon-dual-secondary { color: #6c757d; fill: rgba(108, 117, 125, 0.16); } .icon-dual-success { color: #3b82da; fill: rgba(59, 130, 218, 0.16); } .icon-dual-info { color: #4ad0e6; fill: rgba(74, 208, 230, 0.16); } .icon-dual-warning { color: #f7b84b; fill: rgba(247, 184, 75, 0.16); } .icon-dual-danger { color: #f1556c; fill: rgba(241, 85, 108, 0.16); } .icon-dual-light { color: #f4f9fb; fill: rgba(244, 249, 251, 0.16); } .icon-dual-dark { color: #323a46; fill: rgba(50, 58, 70, 0.16); } .icon-dual-pink { color: #f672a7; fill: rgba(246, 114, 167, 0.16); } .icon-dual-purple { color: #6559cc; fill: rgba(101, 89, 204, 0.16); } .icons-xs { height: 16px; width: 16px; } .icons-sm { height: 24px; width: 24px; } .icons-md { height: 32px; width: 32px; } .icons-lg { height: 40px; width: 40px; } .icons-xl { height: 48px; width: 48px; } .icons-xxl { height: 60px; width: 60px; } .item-hovered:hover { background-color: #f4f9fb; } .social-list-item { height: 2rem; width: 2rem; line-height: calc(2rem - 4px); display: block; border: 2px solid #adb5bd; border-radius: 50%; color: #adb5bd; } .bg-icon-primary { border: 6px solid rgba(2, 168, 181, 0.3) !important; background-color: rgba(2, 168, 181, 0.75) !important; } .bg-icon-secondary { border: 6px solid rgba(108, 117, 125, 0.3) !important; background-color: rgba(108, 117, 125, 0.75) !important; } .bg-icon-success { border: 6px solid rgba(59, 130, 218, 0.3) !important; background-color: rgba(59, 130, 218, 0.75) !important; } .bg-icon-info { border: 6px solid rgba(74, 208, 230, 0.3) !important; background-color: rgba(74, 208, 230, 0.75) !important; } .bg-icon-warning { border: 6px solid rgba(247, 184, 75, 0.3) !important; background-color: rgba(247, 184, 75, 0.75) !important; } .bg-icon-danger { border: 6px solid rgba(241, 85, 108, 0.3) !important; background-color: rgba(241, 85, 108, 0.75) !important; } .bg-icon-light { border: 6px solid rgba(244, 249, 251, 0.3) !important; background-color: rgba(244, 249, 251, 0.75) !important; } .bg-icon-dark { border: 6px solid rgba(50, 58, 70, 0.3) !important; background-color: rgba(50, 58, 70, 0.75) !important; } .bg-icon-pink { border: 6px solid rgba(246, 114, 167, 0.3) !important; background-color: rgba(246, 114, 167, 0.75) !important; } .bg-icon-purple { border: 6px solid rgba(101, 89, 204, 0.3) !important; background-color: rgba(101, 89, 204, 0.75) !important; } .widget-flat { position: relative; overflow: hidden; } .widget-flat i.widget-icon { font-size: 36px; } .inbox-widget .inbox-item { border-bottom: 1px solid rgba(229, 232, 235, 0.5); overflow: hidden; padding: 0.625rem 0; position: relative; } .inbox-widget .inbox-item:last-of-type { border-bottom: none; } .inbox-widget .inbox-item .inbox-item-img { display: block; float: left; margin-right: 15px; width: 40px; } .inbox-widget .inbox-item .inbox-item-img img { width: 40px; } .inbox-widget .inbox-item .inbox-item-author { color: #343a40; display: block; margin-bottom: 3px; font-weight: 600; } .inbox-widget .inbox-item .inbox-item-text { color: #93a4ad; display: block; font-size: 0.8125rem; margin: 0; overflow: hidden; } .inbox-widget .inbox-item .inbox-item-date { color: #93a4ad; font-size: 0.6875rem; position: absolute; right: 5px; top: 10px; } /* Chat widget */ .conversation-list { list-style: none; padding: 0 15px; } .conversation-list li { margin-bottom: 20px; } .conversation-list li .conversation-actions { float: right; display: none; } .conversation-list li:hover .conversation-actions { display: block; } .conversation-list li .conversation-lists { display: inline-block; position: relative; } .conversation-list .chat-avatar { float: left; text-align: center; width: 42px; } .conversation-list .chat-avatar img { border-radius: 100%; width: 100%; } .conversation-list .chat-avatar i { font-size: 12px; font-style: normal; } .conversation-list .ctext-wrap { background: #d5eef7; border-radius: 3px; display: inline-block; padding: 12px; position: relative; } .conversation-list .ctext-wrap i { display: block; font-size: 12px; font-style: normal; font-weight: 600; position: relative; } .conversation-list .ctext-wrap p { margin: 0; padding-top: 3px; } .conversation-list .ctext-wrap:after { left: -10px; top: 0; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; border-top-color: #d5eef7; border-width: 6px; margin-right: -1px; border-right-color: #d5eef7; } .conversation-list .conversation-text { float: left; font-size: 12px; margin-left: 12px; width: 70%; } .conversation-list .odd .chat-avatar { float: right !important; } .conversation-list .odd .conversation-text { float: right !important; margin-right: 12px; text-align: right; width: 70% !important; } .conversation-list .odd .ctext-wrap { background-color: #f1f5f7; } .conversation-list .odd .ctext-wrap:after { border-color: transparent; border-left-color: #f1f5f7; border-top-color: #f1f5f7; right: -10px !important; left: auto; } .conversation-list .odd .conversation-actions { float: left; } .todo-list li .custom-control-label { font-weight: 500; } .knob-chart > div { display: inherit !important; } .knob-chart input { outline: none !important; } [data-plugin="knob"] { font-family: "Inter", sans-serif !important; } .checkbox label { display: inline-block; padding-left: 8px; position: relative; font-weight: 600; margin-bottom: 0; } .checkbox label::before { background-color: transparent; border-radius: 3px; border: 2px solid #93a4ad; content: ""; display: inline-block; height: 18px; left: 0; margin-left: -18px; position: absolute; transition: 0.3s ease-in-out; width: 18px; outline: none !important; top: 2px; } .checkbox label::after { color: #6c757d; display: inline-block; font-size: 11px; height: 18px; left: 0; margin-left: -18px; padding-left: 3px; padding-top: 2px; position: absolute; top: 0; width: 18px; } .checkbox input[type="checkbox"] { cursor: pointer; opacity: 0; z-index: 1; outline: none !important; } .checkbox input[type="checkbox"]:disabled + label { opacity: 0.65; } .checkbox input[type="checkbox"]:focus + label::before { outline-offset: -2px; outline: none; } .checkbox input[type="checkbox"]:checked + label::after { content: ""; position: absolute; top: 6px; left: 7px; display: table; width: 4px; height: 8px; border: 2px solid #6c757d; border-top-width: 0; border-left-width: 0; transform: rotate(45deg); } .checkbox input[type="checkbox"]:disabled + label::before { background-color: #f4f9fb; cursor: not-allowed; } .checkbox.checkbox-circle label::before { border-radius: 50%; } .checkbox.checkbox-inline { margin-top: 0; } .checkbox.checkbox-single input { height: 18px; width: 18px; position: absolute; } .checkbox.checkbox-single label { height: 18px; width: 18px; } .checkbox.checkbox-single label:before { margin-left: 0; } .checkbox.checkbox-single label:after { margin-left: 0; } .checkbox-primary input[type="checkbox"]:checked + label::before { background-color: #02a8b5; border-color: #02a8b5; } .checkbox-primary input[type="checkbox"]:checked + label::after { border-color: #fff; } .checkbox-secondary input[type="checkbox"]:checked + label::before { background-color: #6c757d; border-color: #6c757d; } .checkbox-secondary input[type="checkbox"]:checked + label::after { border-color: #fff; } .checkbox-success input[type="checkbox"]:checked + label::before { background-color: #3b82da; border-color: #3b82da; } .checkbox-success input[type="checkbox"]:checked + label::after { border-color: #fff; } .checkbox-info input[type="checkbox"]:checked + label::before { background-color: #4ad0e6; border-color: #4ad0e6; } .checkbox-info input[type="checkbox"]:checked + label::after { border-color: #fff; } .checkbox-warning input[type="checkbox"]:checked + label::before { background-color: #f7b84b; border-color: #f7b84b; } .checkbox-warning input[type="checkbox"]:checked + label::after { border-color: #fff; } .checkbox-danger input[type="checkbox"]:checked + label::before { background-color: #f1556c; border-color: #f1556c; } .checkbox-danger input[type="checkbox"]:checked + label::after { border-color: #fff; } .checkbox-light input[type="checkbox"]:checked + label::before { background-color: #f4f9fb; border-color: #f4f9fb; } .checkbox-light input[type="checkbox"]:checked + label::after { border-color: #fff; } .checkbox-dark input[type="checkbox"]:checked + label::before { background-color: #323a46; border-color: #323a46; } .checkbox-dark input[type="checkbox"]:checked + label::after { border-color: #fff; } .checkbox-pink input[type="checkbox"]:checked + label::before { background-color: #f672a7; border-color: #f672a7; } .checkbox-pink input[type="checkbox"]:checked + label::after { border-color: #fff; } .checkbox-purple input[type="checkbox"]:checked + label::before { background-color: #6559cc; border-color: #6559cc; } .checkbox-purple input[type="checkbox"]:checked + label::after { border-color: #fff; } .radio label { display: inline-block; padding-left: 8px; position: relative; font-weight: 600; margin-bottom: 0; } .radio label::before { background-color: transparent; border-radius: 50%; border: 2px solid #93a4ad; content: ""; display: inline-block; height: 18px; left: 0; margin-left: -18px; position: absolute; transition: border 0.5s ease-in-out; width: 18px; outline: none !important; } .radio label::after { background-color: #6c757d; border-radius: 50%; content: " "; display: inline-block; height: 10px; left: 6px; margin-left: -20px; position: absolute; top: 4px; transform: scale(0, 0); transition: transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33); width: 10px; } .radio input[type="radio"] { cursor: pointer; opacity: 0; z-index: 1; outline: none !important; } .radio input[type="radio"]:disabled + label { opacity: 0.65; } .radio input[type="radio"]:focus + label::before { outline-offset: -2px; outline: 5px auto -webkit-focus-ring-color; outline: thin dotted; } .radio input[type="radio"]:checked + label::after { transform: scale(1, 1); } .radio input[type="radio"]:disabled + label::before { cursor: not-allowed; } .radio.radio-inline { margin-top: 0; } .radio.radio-single label { height: 17px; } .radio-primary input[type="radio"] + label::after { background-color: #02a8b5; } .radio-primary input[type="radio"]:checked + label::before { border-color: #02a8b5; } .radio-primary input[type="radio"]:checked + label::after { background-color: #02a8b5; } .radio-secondary input[type="radio"] + label::after { background-color: #6c757d; } .radio-secondary input[type="radio"]:checked + label::before { border-color: #6c757d; } .radio-secondary input[type="radio"]:checked + label::after { background-color: #6c757d; } .radio-success input[type="radio"] + label::after { background-color: #3b82da; } .radio-success input[type="radio"]:checked + label::before { border-color: #3b82da; } .radio-success input[type="radio"]:checked + label::after { background-color: #3b82da; } .radio-info input[type="radio"] + label::after { background-color: #4ad0e6; } .radio-info input[type="radio"]:checked + label::before { border-color: #4ad0e6; } .radio-info input[type="radio"]:checked + label::after { background-color: #4ad0e6; } .radio-warning input[type="radio"] + label::after { background-color: #f7b84b; } .radio-warning input[type="radio"]:checked + label::before { border-color: #f7b84b; } .radio-warning input[type="radio"]:checked + label::after { background-color: #f7b84b; } .radio-danger input[type="radio"] + label::after { background-color: #f1556c; } .radio-danger input[type="radio"]:checked + label::before { border-color: #f1556c; } .radio-danger input[type="radio"]:checked + label::after { background-color: #f1556c; } .radio-light input[type="radio"] + label::after { background-color: #f4f9fb; } .radio-light input[type="radio"]:checked + label::before { border-color: #f4f9fb; } .radio-light input[type="radio"]:checked + label::after { background-color: #f4f9fb; } .radio-dark input[type="radio"] + label::after { background-color: #323a46; } .radio-dark input[type="radio"]:checked + label::before { border-color: #323a46; } .radio-dark input[type="radio"]:checked + label::after { background-color: #323a46; } .radio-pink input[type="radio"] + label::after { background-color: #f672a7; } .radio-pink input[type="radio"]:checked + label::before { border-color: #f672a7; } .radio-pink input[type="radio"]:checked + label::after { background-color: #f672a7; } .radio-purple input[type="radio"] + label::after { background-color: #6559cc; } .radio-purple input[type="radio"]:checked + label::before { border-color: #6559cc; } .radio-purple input[type="radio"]:checked + label::after { background-color: #6559cc; } .ribbon-box { position: relative; /* Ribbon two */ } .ribbon-box .ribbon { position: relative; clear: both; padding: 5px 12px; margin-bottom: 15px; box-shadow: 2px 5px 10px rgba(50, 58, 70, 0.15); color: #fff; font-size: 13px; font-weight: 600; } .ribbon-box .ribbon:before { content: " "; border-style: solid; border-width: 10px; display: block; position: absolute; bottom: -10px; left: 0; margin-bottom: -10px; z-index: -1; } .ribbon-box .ribbon.float-left { margin-left: -30px; border-radius: 0 3px 3px 0; } .ribbon-box .ribbon.float-right { margin-right: -30px; border-radius: 3px 0 0 3px; } .ribbon-box .ribbon.float-right:before { right: 0; } .ribbon-box .ribbon.float-right.ribbon-shape { -webkit-clip-path: polygon(0% 0, 100% 0%, 100% 100%, 0 100%, 15% 50%); clip-path: polygon(0% 0, 100% 0%, 100% 100%, 0 100%, 15% 50%); padding-left: 25px; padding-right: 12px; margin-left: 0px; margin-right: -24px; } .ribbon-box .ribbon.ribbon-shape { -webkit-clip-path: polygon(0% 0%, 100% 0, 85% 50%, 100% 100%, 0% 100%); clip-path: polygon(0% 0%, 100% 0, 85% 50%, 100% 100%, 0% 100%); padding-right: 25px; margin-left: -24px; width: 100px; text-align: center; } .ribbon-box .ribbon.float-center span { margin: 0 auto 20px auto; } .ribbon-box .ribbon-content { clear: both; } .ribbon-box .ribbon-primary { background: #02a8b5; } .ribbon-box .ribbon-primary:before { border-color: #017983 transparent transparent; } .ribbon-box .ribbon-secondary { background: #6c757d; } .ribbon-box .ribbon-secondary:before { border-color: #545b62 transparent transparent; } .ribbon-box .ribbon-success { background: #3b82da; } .ribbon-box .ribbon-success:before { border-color: #2469be transparent transparent; } .ribbon-box .ribbon-info { background: #4ad0e6; } .ribbon-box .ribbon-info:before { border-color: #1fc3de transparent transparent; } .ribbon-box .ribbon-warning { background: #f7b84b; } .ribbon-box .ribbon-warning:before { border-color: #f5a51a transparent transparent; } .ribbon-box .ribbon-danger { background: #f1556c; } .ribbon-box .ribbon-danger:before { border-color: #ed2643 transparent transparent; } .ribbon-box .ribbon-light { background: #f4f9fb; } .ribbon-box .ribbon-light:before { border-color: #cfe5ed transparent transparent; } .ribbon-box .ribbon-dark { background: #323a46; } .ribbon-box .ribbon-dark:before { border-color: #1d2128 transparent transparent; } .ribbon-box .ribbon-pink { background: #f672a7; } .ribbon-box .ribbon-pink:before { border-color: #f34289 transparent transparent; } .ribbon-box .ribbon-purple { background: #6559cc; } .ribbon-box .ribbon-purple:before { border-color: #4639b9 transparent transparent; } .ribbon-box .ribbon-two { position: absolute; left: -5px; top: -5px; z-index: 1; overflow: hidden; width: 75px; height: 75px; text-align: right; } .ribbon-box .ribbon-two span { font-size: 13px; color: #fff; text-align: center; line-height: 20px; transform: rotate(-45deg); width: 100px; display: block; box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.06), 0 1px 0 0 rgba(0, 0, 0, 0.02); position: absolute; top: 19px; left: -21px; font-weight: 600; } .ribbon-box .ribbon-two span:before { content: ""; position: absolute; left: 0; top: 100%; z-index: -1; border-right: 3px solid transparent; border-bottom: 3px solid transparent; } .ribbon-box .ribbon-two span:after { content: ""; position: absolute; right: 0; top: 100%; z-index: -1; border-left: 3px solid transparent; border-bottom: 3px solid transparent; } .ribbon-box .ribbon-two-primary span { background: #02a8b5; } .ribbon-box .ribbon-two-primary span:before { border-left: 3px solid #016269; border-top: 3px solid #016269; } .ribbon-box .ribbon-two-primary span:after { border-right: 3px solid #016269; border-top: 3px solid #016269; } .ribbon-box .ribbon-two-secondary span { background: #6c757d; } .ribbon-box .ribbon-two-secondary span:before { border-left: 3px solid #494f54; border-top: 3px solid #494f54; } .ribbon-box .ribbon-two-secondary span:after { border-right: 3px solid #494f54; border-top: 3px solid #494f54; } .ribbon-box .ribbon-two-success span { background: #3b82da; } .ribbon-box .ribbon-two-success span:before { border-left: 3px solid #205da9; border-top: 3px solid #205da9; } .ribbon-box .ribbon-two-success span:after { border-right: 3px solid #205da9; border-top: 3px solid #205da9; } .ribbon-box .ribbon-two-info span { background: #4ad0e6; } .ribbon-box .ribbon-two-info span:before { border-left: 3px solid #1cb0c8; border-top: 3px solid #1cb0c8; } .ribbon-box .ribbon-two-info span:after { border-right: 3px solid #1cb0c8; border-top: 3px solid #1cb0c8; } .ribbon-box .ribbon-two-warning span { background: #f7b84b; } .ribbon-box .ribbon-two-warning span:before { border-left: 3px solid #eb990a; border-top: 3px solid #eb990a; } .ribbon-box .ribbon-two-warning span:after { border-right: 3px solid #eb990a; border-top: 3px solid #eb990a; } .ribbon-box .ribbon-two-danger span { background: #f1556c; } .ribbon-box .ribbon-two-danger span:before { border-left: 3px solid #e71332; border-top: 3px solid #e71332; } .ribbon-box .ribbon-two-danger span:after { border-right: 3px solid #e71332; border-top: 3px solid #e71332; } .ribbon-box .ribbon-two-light span { background: #f4f9fb; } .ribbon-box .ribbon-two-light span:before { border-left: 3px solid #bcdae7; border-top: 3px solid #bcdae7; } .ribbon-box .ribbon-two-light span:after { border-right: 3px solid #bcdae7; border-top: 3px solid #bcdae7; } .ribbon-box .ribbon-two-dark span { background: #323a46; } .ribbon-box .ribbon-two-dark span:before { border-left: 3px solid #121519; border-top: 3px solid #121519; } .ribbon-box .ribbon-two-dark span:after { border-right: 3px solid #121519; border-top: 3px solid #121519; } .ribbon-box .ribbon-two-pink span { background: #f672a7; } .ribbon-box .ribbon-two-pink span:before { border-left: 3px solid #f12a7a; border-top: 3px solid #f12a7a; } .ribbon-box .ribbon-two-pink span:after { border-right: 3px solid #f12a7a; border-top: 3px solid #f12a7a; } .ribbon-box .ribbon-two-purple span { background: #6559cc; } .ribbon-box .ribbon-two-purple span:before { border-left: 3px solid #3f33a6; border-top: 3px solid #3f33a6; } .ribbon-box .ribbon-two-purple span:after { border-right: 3px solid #3f33a6; border-top: 3px solid #3f33a6; } @media print { .left-side-menu, .right-bar, .page-title-box, .navbar-custom, .footer { display: none; } .card-body, .content-page, .right-bar, .content, body { padding: 0; margin: 0; } .card { border-color: transparent; } } #preloader { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background-color: #fff; z-index: 9999; } #status { width: 40px; height: 40px; position: absolute; left: 50%; top: 50%; margin: -20px 0 0 -20px; } .spinner { margin: 0 auto; font-size: 10px; position: relative; text-indent: -9999em; border-top: 5px solid #dee2e6; border-right: 5px solid #dee2e6; border-bottom: 5px solid #dee2e6; border-left: 5px solid #02a8b5; transform: translateZ(0); animation: SpinnerAnimation 1.1s infinite linear; } .spinner, .spinner:after { border-radius: 50%; width: 40px; height: 40px; } @keyframes SpinnerAnimation { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } .authentication-bg.enlarged { min-height: 100px; } .bg-pattern { background-image: url("../images/bg-pattern-2.png"); background-size: cover; } body.authentication-bg { background-color: #02a8b5; background-size: cover; background-position: center; } body.authentication-bg-pattern { background-image: url("../images/bg-pattern.png"); } .logout-icon { width: 140px; } .auth-fluid { position: relative; display: flex; align-items: center; min-height: 100vh; flex-direction: row; align-items: stretch; background: url("../images/bg-auth.jpg") center; background-size: cover; } .auth-fluid .auth-fluid-form-box { max-width: 480px; border-radius: 0; z-index: 2; padding: 3rem 2rem; background-color: #ffffff; position: relative; width: 100%; } .auth-fluid .auth-fluid-right { padding: 6rem 3rem; flex: 1; position: relative; color: #fff; background-color: rgba(0, 0, 0, 0.5); } .auth-brand { margin-bottom: 2rem; } .auth-user-testimonial { position: absolute; margin: 0 auto; padding: 0 2.75rem; bottom: 3rem; left: 0; right: 0; } .auth-user-testimonial p.lead { max-width: 700px; } @media (min-width: 992px) { .auth-brand { position: absolute; top: 3rem; } } @media (max-width: 991.98px) { .auth-fluid { display: block; } .auth-fluid .auth-fluid-form-box { max-width: 100%; min-height: 100vh; } .auth-fluid .auth-fluid-right { display: none; } } .auth-logo .logo-light { display: none; } .auth-logo .logo-dark { display: block; } .button-list { margin-left: -8px; margin-bottom: -12px; } .button-list .btn { margin-bottom: 12px; margin-left: 8px; } .grid-structure .grid-container { background-color: #f4f9fb; margin-bottom: 10px; font-size: 0.8rem; font-weight: 600; padding: 10px 20px; } .icons-list-demo div.col-sm-6 { cursor: pointer; line-height: 45px; white-space: nowrap; text-overflow: ellipsis; display: block; overflow: hidden; } .icons-list-demo div.col-sm-6 p { margin-bottom: 0; line-height: inherit; } .icons-list-demo i { text-align: center; vertical-align: middle; font-size: 22px; width: 50px; height: 50px; line-height: 50px; margin-right: 12px; color: #93a4ad; border-radius: 3px; display: inline-block; transition: all 0.2s; } .icons-list-demo .col-sm-6 { border-radius: 3px; background-clip: padding-box; margin-bottom: 10px; } .icons-list-demo .col-sm-6:hover, .icons-list-demo .col-sm-6:hover i { color: #02a8b5; } .icons-list-demo .icon-item svg { margin-right: 10px; } .icons-list-demo .icon-item span { line-height: 30px; display: inline-block; vertical-align: middle; } .scrollspy-example { position: relative; height: 200px; margin-top: .5rem; overflow: auto; } .text-error { color: #02a8b5; text-shadow: rgba(2, 168, 181, 0.3) 5px 1px, rgba(2, 168, 181, 0.2) 10px 3px; font-size: 84px; line-height: 90px; font-family: "Inter", sans-serif; } .error-text-box { font-size: 10rem; font-family: "Inter", sans-serif; min-height: 200px; } .error-text-box .text { fill: none; stroke-width: 6; stroke-linejoin: round; stroke-dasharray: 30 100; stroke-dashoffset: 0; animation: stroke 9s infinite linear; } .error-text-box .text:nth-child(5n + 1) { stroke: #f1556c; animation-delay: -1.2s; } .error-text-box .text:nth-child(5n + 2) { stroke: #f7b84b; animation-delay: -2.4s; } .error-text-box .text:nth-child(5n + 3) { stroke: #02a8b5; animation-delay: -3.6s; } .error-text-box .text:nth-child(5n + 4) { stroke: #4ad0e6; animation-delay: -4.8s; } .error-text-box .text:nth-child(5n + 5) { stroke: #3b82da; animation-delay: -6s; } @keyframes stroke { 100% { stroke-dashoffset: -400; } } @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { .error-text-box .text { fill: #f1556c; stroke: #f1556c; stroke-width: 6; stroke-dasharray: 0 0; stroke-dashoffset: 0; animation: none; } } .logout-checkmark { width: 120px; margin: 0 auto; padding: 20px 0; } .logout-path { stroke-dasharray: 1000; stroke-dashoffset: 0; animation: dash 2s ease-in-out; } .logout-spin { animation: spin 2s; transform-origin: 50% 50%; } @keyframes dash { 0% { stroke-dashoffset: 1000; } 100% { stroke-dashoffset: 0; } } @keyframes spin { 0% { -webkit-transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); } } @keyframes text { 0% { opacity: 0; } 100% { opacity: 1; } } .faq-question-q-box { height: 30px; width: 30px; color: #02a8b5; text-align: center; border-radius: 50%; float: left; font-weight: 700; line-height: 30px; background-color: rgba(2, 168, 181, 0.15); } .faq-question { margin-top: 0; margin-left: 50px; font-weight: 400; font-size: 16px; } .faq-answer { margin-left: 50px; color: #93a4ad; } .svg-computer { stroke-dasharray: 1134; stroke-dashoffset: -1134; animation: draw-me 5s infinite; animation-direction: normal; height: 160px; } @keyframes draw-me { from { stroke-dashoffset: -1134; } to { stroke-dashoffset: 0; } } @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { .svg-computer { stroke-dasharray: 0; stroke-dashoffset: 0; animation: none; animation-direction: normal; } } .timeline { margin-bottom: 50px; position: relative; } .timeline:before { background-color: #dee2e6; bottom: 0; content: ""; left: 50%; position: absolute; top: 30px; width: 2px; z-index: 0; } .timeline .time-show { margin-bottom: 30px; margin-top: 30px; position: relative; } .timeline .timeline-box { background: #fff; display: block; margin: 15px 0; position: relative; padding: 20px; border-radius: 0.25rem; box-shadow: none; } .timeline .timeline-album { margin-top: 12px; } .timeline .timeline-album a { display: inline-block; margin-right: 5px; } .timeline .timeline-album img { height: 36px; width: auto; border-radius: 3px; } @media (min-width: 768px) { .timeline .time-show { margin-left: -69px; text-align: right; } .timeline .timeline-box { margin-left: 45px; } .timeline .timeline-icon { background: #dee2e6; border-radius: 50%; display: block; height: 20px; left: -54px; margin-top: -10px; position: absolute; text-align: center; top: 50%; width: 20px; } .timeline .timeline-icon i { color: #93a4ad; font-size: 13px; position: absolute; left: 4px; } .timeline .timeline-desk { display: table-cell; vertical-align: top; width: 50%; } .timeline-item { display: flex; } .timeline-item:before { content: ""; display: block; width: 50%; } .timeline-item .timeline-desk .arrow { border-bottom: 12px solid transparent; border-right: 12px solid #fff !important; border-top: 12px solid transparent; display: block; height: 0; left: -12px; margin-top: -12px; position: absolute; top: 50%; width: 0; } .timeline-item.timeline-item-left:after { content: ""; display: block; width: 50%; } .timeline-item.timeline-item-left .timeline-desk .arrow-alt { border-bottom: 12px solid transparent; border-left: 12px solid #fff !important; border-top: 12px solid transparent; display: block; height: 0; left: auto; margin-top: -12px; position: absolute; right: -12px; top: 50%; width: 0; } .timeline-item.timeline-item-left .timeline-desk .album { float: right; margin-top: 20px; } .timeline-item.timeline-item-left .timeline-desk .album a { float: right; margin-left: 5px; } .timeline-item.timeline-item-left .timeline-icon { left: auto; right: -56px; } .timeline-item.timeline-item-left:before { display: none; } .timeline-item.timeline-item-left .timeline-box { margin-right: 45px; margin-left: 0; text-align: right; } } @media (max-width: 767.98px) { .timeline .time-show { text-align: center; position: relative; } .timeline .timeline-icon { display: none; } } .timeline-sm { padding-left: 110px; } .timeline-sm .timeline-sm-item { position: relative; padding-bottom: 20px; padding-left: 40px; border-left: 2px solid #dee2e6; } .timeline-sm .timeline-sm-item:after { content: ""; display: block; position: absolute; top: 3px; left: -7px; width: 12px; height: 12px; border-radius: 50%; background: #fff; border: 2px solid #02a8b5; } .timeline-sm .timeline-sm-item .timeline-sm-date { position: absolute; left: -104px; } @media (max-width: 420px) { .timeline-sm { padding-left: 0px; } .timeline-sm .timeline-sm-date { position: relative !important; display: block; left: 0px !important; margin-bottom: 10px; } } .inbox-leftbar { width: 240px; float: left; padding: 0 20px 20px 10px; position: relative; } .inbox-leftbar:before { border-right: 5px solid #f1f5f9; content: ""; position: absolute; top: 0; right: -15px; bottom: -1.5rem; } .inbox-rightbar { margin: -1.5rem 0 -1.5rem 250px; border-left: 5px solid #f1f5f9; padding: 1.5rem 0 1.5rem 25px; } .message-list { display: block; padding-left: 0; } .message-list li { position: relative; display: block; height: 51px; line-height: 50px; cursor: default; transition-duration: .3s; } .message-list li a { color: #343a40; } .message-list li:hover { background: #f4f9fb; transition-duration: .05s; } .message-list li .col-mail { float: left; position: relative; } .message-list li .col-mail-1 { width: 320px; } .message-list li .col-mail-1 .star-toggle, .message-list li .col-mail-1 .checkbox-wrapper-mail, .message-list li .col-mail-1 .dot { display: block; float: left; } .message-list li .col-mail-1 .dot { border: 4px solid transparent; border-radius: 100px; margin: 22px 26px 0; height: 0; width: 0; line-height: 0; font-size: 0; } .message-list li .col-mail-1 .checkbox-wrapper-mail { margin: 15px 10px 0 20px; } .message-list li .col-mail-1 .star-toggle { margin-top: 18px; color: #adb5bd; margin-left: 10px; } .message-list li .col-mail-1 .title { position: absolute; top: 0; left: 100px; right: 0; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; margin-bottom: 0; line-height: 50px; } .message-list li .col-mail-2 { position: absolute; top: 0; left: 320px; right: 0; bottom: 0; } .message-list li .col-mail-2 .subject, .message-list li .col-mail-2 .date { position: absolute; top: 0; } .message-list li .col-mail-2 .subject { left: 0; right: 110px; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .message-list li .col-mail-2 .date { right: 0; width: 100px; padding-left: 10px; } .message-list li.active, .message-list li.mail-selected { background: #f4f9fb; transition-duration: .05s; } .message-list li.active, .message-list li.active:hover { box-shadow: inset 3px 0 0 #4ad0e6; } .message-list li.unread a { font-weight: 600; color: #272e37; } .message-list .checkbox-wrapper-mail { cursor: pointer; height: 20px; width: 20px; position: relative; display: inline-block; box-shadow: inset 0 0 0 2px #ced4da; border-radius: 3px; } .message-list .checkbox-wrapper-mail input { opacity: 0; cursor: pointer; } .message-list .checkbox-wrapper-mail input:checked ~ label { opacity: 1; } .message-list .checkbox-wrapper-mail label { position: absolute; top: 3px; left: 3px; right: 3px; bottom: 3px; cursor: pointer; background: #93a4ad; opacity: 0; margin-bottom: 0 !important; transition-duration: .05s; } .message-list .checkbox-wrapper-mail label:active { background: #87949b; } .mail-list a { color: #343a40; padding: 9px 10px; display: block; font-size: 15px; } .reply-box { border: 2px solid #f4f9fb; } @media (max-width: 648px) { .inbox-leftbar { width: 100%; float: none; padding: 0 20px; } .inbox-leftbar:before { border-right: none; } .inbox-rightbar { padding-top: 40px; margin: 0; border: 0; padding-left: 0; } .message-list li .col-mail-1 .checkbox-wrapper-mail { margin-left: 0; } } @media (max-width: 520px) { .inbox-rightbar > .btn-group { margin-bottom: 10px; } .message-list li .col-mail-1 { width: 150px; } .message-list li .col-mail-1 .title { left: 80px; } .message-list li .col-mail-2 { left: 160px; } .message-list li .col-mail-2 .date { text-align: right; padding-right: 10px; padding-left: 20px; } } .sitemap { list-style: none; padding-left: 0; } .sitemap > li > ul { margin-top: 1rem; padding-left: 0; } .sitemap li { line-height: 1.5rem; vertical-align: top; list-style: none; position: relative; } .sitemap li a { text-decoration: none; color: #343a40; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .sitemap li a i { display: inline-block; } .sitemap li a:hover { color: #02a8b5; } .sitemap ul { margin-left: 1rem; margin-bottom: 1rem; padding-top: 10px; } .sitemap ul li { position: relative; } .sitemap ul li a { margin-left: 2rem; } .sitemap ul li:before { content: ""; display: inline-block; width: 1.5rem; height: 1.5rem; border-bottom: 1px solid #e5e8eb; border-left: 1px solid #e5e8eb; position: absolute; top: -10px; } .search-result-box .tab-content { padding: 30px 30px 10px 30px; box-shadow: none; } .search-result-box .search-item { padding-bottom: 20px; border-bottom: 1px solid #f4f9fb; margin-bottom: 20px; } .search-result-box .nav-bordered .nav-link { padding: 10px 5px !important; margin-right: 10px; } .card-pricing { position: relative; } .card-pricing .card-pricing-plan-name { padding-bottom: 20px; } .card-pricing .card-pricing-icon { font-size: 22px; background-color: rgba(2, 168, 181, 0.1); height: 60px; display: inline-block; width: 60px; line-height: 62px; border-radius: 50%; } .card-pricing .card-pricing-price { padding: 30px 0 0; } .card-pricing .card-pricing-price span { font-size: 40%; color: #93a4ad; letter-spacing: 2px; text-transform: uppercase; } .card-pricing .card-pricing-features { color: #93a4ad; list-style: none; margin: 0; padding: 20px 0 0 0; } .card-pricing .card-pricing-features li { padding: 10px; } .card-pricing-recommended { background-color: #02a8b5; color: #fff; } .card-pricing-recommended .card-pricing-icon { background-color: rgba(255, 255, 255, 0.1); } .card-pricing-recommended .card-pricing-features, .card-pricing-recommended .card-pricing-price span { color: rgba(255, 255, 255, 0.7); } .filter-menu { margin-bottom: 20px; } .filter-menu a { transition: all 0.3s ease-out; color: #323a46; border-radius: 3px; padding: 5px 10px; font-size: 13px; text-transform: uppercase; display: inline-block; margin-bottom: 5px; font-weight: 500; font-family: "Inter", sans-serif; } .filter-menu a:hover { background-color: rgba(2, 168, 181, 0.15); color: #02a8b5; } .filter-menu a.active { background-color: rgba(2, 168, 181, 0.15); color: #02a8b5; } .gal-box { background-color: #fff; border-radius: 3px; box-shadow: 0 0 35px 0 rgba(154, 161, 171, 0.15); margin-bottom: 24px; } .gal-box .image-popup { padding: 10px; display: block; } .gal-box .image-popup img { cursor: zoom-in; } .gal-box .gall-info { padding: 15px; border-top: 1px solid #f7f7f7; position: relative; } .gal-box .gall-info h4 { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .gal-box .gall-info .gal-like-btn { position: absolute; right: 15px; font-size: 22px; top: 24px; } .counter-number { font-size: 32px; font-weight: 700; } .counter-number span { font-size: 15px; font-weight: 400; display: block; } .coming-box { float: left; width: 25%; } .svg-rocket { height: 80px; } .rocket-clouds__bubble, .rocket-clouds__cloud, .rocket-rocket, .rocket-inner__rocket-and-lines { fill: #fff; } .post-user-comment-box { background-color: #f4f9fb; margin: 0 -.75rem; padding: 1rem; margin-top: 20px; } .chat-app-conversation .conversation-text { font-size: 0.875rem; } .chat-app-conversation .conversation-text .ctext-wrap i { font-size: 13px; } .user-status { position: absolute; height: 13px; width: 13px; background-color: #ced4da; border: 2.5px solid #fff; border-radius: 50%; bottom: 0; left: 30px; } .user-status.online { background-color: #1abc9c; } .user-status.busy { background-color: #f7b84b; } .user-status.do-not-disturb { background-color: #f1556c; } .task-item { padding-left: 12px; position: relative; } .task-item:before { content: "\F01DB"; font-family: "Material Design Icons"; position: absolute; left: 0; font-size: 19px; top: -3px; } .tasklist { min-height: 40px; margin-bottom: 0; } .tasklist li { background-color: white; border: 1px solid #dee2e6; border-left-width: 2px; padding: 20px; margin-bottom: 15px; border-radius: 3px; box-shadow: none; } .tasklist li:last-of-type { margin-bottom: 0; } .tasklist li .btn-sm { padding: 2px 8px; font-size: 12px; } .tasklist li.task-medium { border-left-color: #f7b84b; } .tasklist li.task-low { border-left-color: #3b82da; } .tasklist li.task-high { border-left-color: #f1556c; } .tasklist .checkbox { margin-left: 20px; margin-top: 5px; } .task-placeholder { border: 1px dashed #dee2e6 !important; background-color: #f4f9fb !important; padding: 20px; } .product-box { position: relative; } .product-box .product-img { position: relative; overflow: hidden; } .product-box .product-action { position: absolute; left: 0; bottom: 0; width: 100%; transform: translateY(52px); transition: all 0.4s; } .product-box:hover .product-action { transform: translateY(0); } .product-detail-carousel .product-nav-img { display: block; background-color: #f4f9fb; } .product-detail-carousel .product-carousel-indicators { position: relative; } .product-detail-carousel .product-carousel-indicators li { width: auto; height: auto; min-width: 80px; margin: 0px 7px; padding: 4px; border: 1px solid #dee2e6; border-radius: 4px; } .product-thumb { padding: 3px; margin-top: 3px; } .product-thumb.active { background-color: #6c757d !important; } .track-order-list ul li { position: relative; border-left: 2px solid #dee2e6; padding: 0px 0px 14px 21px; } .track-order-list ul li:first-child { padding-top: 0px; } .track-order-list ul li:last-child { padding-bottom: 0px; } .track-order-list ul li:before { content: ""; position: absolute; left: -7px; top: 0; height: 12px; width: 12px; background-color: #02a8b5; border-radius: 50%; border: 3px solid #fff; } .track-order-list ul li.completed { border-color: #02a8b5; } .track-order-list ul li .active-dot.dot { top: -9px; left: -16px; border-color: #02a8b5; } .dot { border: 4px solid #02a8b5; background: 0 0; border-radius: 60px; height: 30px; width: 30px; animation: pulse 3s ease-out; animation-iteration-count: infinite; position: absolute; top: -15px; right: -2px; z-index: 1; opacity: 0; } @keyframes pulse { 0% { -webkit-transform: scale(0); opacity: 0.0; } 25% { -webkit-transform: scale(0); opacity: 0.1; } 50% { -webkit-transform: scale(0.1); opacity: 0.3; } 75% { -webkit-transform: scale(0.5); opacity: 0.5; } 100% { -webkit-transform: scale(1); opacity: 0.0; } } /*! * Waves v0.7.6 * http://fian.my.id/Waves * * Copyright 2014-2018 Alfiana E. Sibuea and other contributors * Released under the MIT license * https://github.com/fians/Waves/blob/master/LICENSE */ .waves-effect { position: relative; cursor: pointer; display: inline-block; overflow: hidden; -webkit-user-select: none; -ms-user-select: none; user-select: none; -webkit-tap-highlight-color: transparent; } .waves-effect .waves-ripple { position: absolute; border-radius: 50%; width: 100px; height: 100px; margin-top: -50px; margin-left: -50px; opacity: 0; background: rgba(0, 0, 0, 0.2); background: radial-gradient(rgba(0, 0, 0, 0.2) 0, rgba(0, 0, 0, 0.3) 40%, rgba(0, 0, 0, 0.4) 50%, rgba(0, 0, 0, 0.5) 60%, rgba(255, 255, 255, 0) 70%); transition: all 0.5s ease-out; transition-property: transform, opacity; transform: scale(0) translate(0, 0); pointer-events: none; } .waves-effect.waves-light .waves-ripple { background: rgba(255, 255, 255, 0.4); background: radial-gradient(rgba(255, 255, 255, 0.2) 0, rgba(255, 255, 255, 0.3) 40%, rgba(255, 255, 255, 0.4) 50%, rgba(255, 255, 255, 0.5) 60%, rgba(255, 255, 255, 0) 70%); } .waves-effect.waves-classic .waves-ripple { background: rgba(0, 0, 0, 0.2); } .waves-effect.waves-classic.waves-light .waves-ripple { background: rgba(255, 255, 255, 0.4); } .waves-notransition { transition: none !important; } .waves-button, .waves-circle { transform: translateZ(0); -webkit-mask-image: radial-gradient(circle, white 100%, black 100%); mask-image: radial-gradient(circle, white 100%, black 100%); } .waves-button, .waves-button:hover, .waves-button:visited, .waves-button-input { white-space: nowrap; vertical-align: middle; cursor: pointer; border: none; outline: none; color: inherit; background-color: rgba(0, 0, 0, 0); font-size: 1em; line-height: 1em; text-align: center; text-decoration: none; z-index: 1; } .waves-button { padding: 0.85em 1.1em; border-radius: 0.2em; } .waves-button-input { margin: 0; padding: 0.85em 1.1em; } .waves-input-wrapper { border-radius: 0.2em; vertical-align: bottom; } .waves-input-wrapper.waves-button { padding: 0; } .waves-input-wrapper .waves-button-input { position: relative; top: 0; left: 0; z-index: 1; } .waves-circle { text-align: center; width: 2.5em; height: 2.5em; line-height: 2.5em; border-radius: 50%; } .waves-float { -webkit-mask-image: none; mask-image: none; box-shadow: 0px 1px 1.5px 1px rgba(0, 0, 0, 0.12); transition: all 300ms; } .waves-float:active { box-shadow: 0px 8px 20px 1px rgba(0, 0, 0, 0.3); } .waves-block { display: block; } .apex-charts { min-height: 10px !important; } .apex-charts text { font-family: "Inter", sans-serif !important; fill: #93a4ad; font-weight: 600; } .apex-charts .apexcharts-canvas { margin: 0 auto; } .apexcharts-tooltip-title, .apexcharts-tooltip-text, .apexcharts-legend-text { font-family: "Inter", sans-serif !important; } .apexcharts-legend-series { font-weight: 600; } .apexcharts-gridline { pointer-events: none; stroke: #f9f9fd; } .apexcharts-legend-text { color: #93a4ad !important; } .apexcharts-yaxis text, .apexcharts-xaxis text { font-family: "Inter", sans-serif !important; fill: #93a4ad; font-weight: 600; } .apexcharts-point-annotations text, .apexcharts-xaxis-annotations text, .apexcharts-yaxis-annotations text { fill: #93a4ad; } .apexcharts-radar-series polygon { fill: transparent; stroke: #dee2e6; } .apexcharts-radar-series line { stroke: #dee2e6; } .apexcharts-pie-label, .apexcharts-datalabel, .apexcharts-datalabel-label, .apexcharts-datalabel-value { fill: #fff !important; } .apexcharts-plot-series .apexcharts-datalabel { fill: #fff !important; } .apexcharts-datalabels-group text { fill: #93a4ad !important; font-family: "Inter", sans-serif !important; } .scatter-images-chart .apexcharts-legend { overflow: hidden !important; min-height: 17px; } .scatter-images-chart .apexcharts-legend-marker { background: none !important; margin-right: 7px !important; } .scatter-images-chart .apexcharts-legend-series { align-items: flex-start !important; } .apexcharts-pie-series path { stroke: transparent !important; } .apexcharts-track path { stroke: #edeff1; } .apexcharts-xaxis line { stroke: #ced4da !important; } .irs { position: relative; display: block; -webkit-touch-callout: none; -ms-user-select: none; -webkit-user-select: none; user-select: none; font-size: 12px; } .irs-line { position: relative; display: block; overflow: hidden; outline: none !important; } .irs-bar { position: absolute; display: block; left: 0; width: 0; } .irs-shadow { position: absolute; display: none; left: 0; width: 0; } .irs-handle { position: absolute; display: block; box-sizing: border-box; cursor: default; z-index: 1; } .irs-handle.type_last { z-index: 2; } .irs-min, .irs-max { position: absolute; display: block; cursor: default; } .irs-min { left: 0; } .irs-max { right: 0; } .irs-from, .irs-to, .irs-single { position: absolute; display: block; top: 0; left: 0; cursor: default; white-space: nowrap; } .irs-grid { position: absolute; display: none; bottom: 0; left: 0; width: 100%; height: 20px; } .irs-with-grid .irs-grid { display: block; } .irs-grid-pol { position: absolute; top: 0; left: 0; width: 1px; height: 8px; background: #6c757d; } .irs-grid-pol.small { height: 4px; } .irs-grid-text { position: absolute; bottom: 0; left: 0; white-space: nowrap; text-align: center; font-size: 9px; line-height: 9px; padding: 0 3px; color: #6c757d; } .irs-disable-mask { position: absolute; display: block; top: 0; left: -1%; width: 102%; height: 100%; cursor: default; background: rgba(0, 0, 0, 0); z-index: 2; } .lt-ie9 .irs-disable-mask { background: #6c757d; filter: alpha(opacity=0); cursor: not-allowed; } .irs-disabled { opacity: 0.4; } .irs-hidden-input { position: absolute !important; display: block !important; top: 0 !important; left: 0 !important; width: 0 !important; height: 0 !important; font-size: 0 !important; line-height: 0 !important; padding: 0 !important; margin: 0 !important; overflow: hidden; outline: none !important; z-index: -9999 !important; background: none !important; border-style: solid !important; border-color: transparent !important; } .irs--flat { height: 40px; } .irs--flat.irs-with-grid { height: 60px; } .irs--flat .irs-line { top: 25px; height: 12px; background-color: #eef0f2; border-radius: 4px; } .irs--flat .irs-bar { top: 25px; height: 12px; background-color: #02a8b5; } .irs--flat .irs-bar--single { border-radius: 4px 0 0 4px; } .irs--flat .irs-shadow { height: 1px; bottom: 16px; background-color: #eef0f2; } .irs--flat .irs-handle { top: 22px; width: 16px; height: 18px; background-color: transparent; } .irs--flat .irs-handle > i:first-child { position: absolute; display: block; top: 0; left: 50%; width: 2px; height: 100%; margin-left: -1px; background-color: #028792; } .irs--flat .irs-min, .irs--flat .irs-max { top: 0; padding: 1px 3px; color: #6c757d; font-size: 10px; line-height: 1.333; text-shadow: none; background-color: #eef0f2; border-radius: 4px; } .irs--flat .irs-from, .irs--flat .irs-to, .irs--flat .irs-single { color: #fff; font-size: 10px; line-height: 1.333; text-shadow: none; padding: 1px 5px; background-color: #02a8b5; border-radius: 4px; } .irs--flat .irs-from:before, .irs--flat .irs-to:before, .irs--flat .irs-single:before { position: absolute; display: block; content: ""; bottom: -6px; left: 50%; width: 0; height: 0; margin-left: -3px; overflow: hidden; border: 3px solid transparent; border-top-color: #02a8b5; } .irs--flat .irs-grid-pol { background-color: #eef0f2; } .irs--flat .irs-grid-text { color: #6c757d; } .irs--modern .irs-line { border: none; background: #eef0f2; } .irs--modern .irs-bar { background: #02a8b5; background: linear-gradient(to bottom, #02a8b5 0%, #017983 100%); } .irs--modern .irs-min, .irs--modern .irs-max { top: 0; padding: 1px 3px; color: #6c757d; font-size: 10px; line-height: 1.333; text-shadow: none; background-color: #eef0f2; border-radius: 4px; } .irs--modern .irs-handle > i:nth-child(1) { width: 8px; height: 8px; } .irs--modern .irs-single { background-color: #02a8b5; } .irs--modern .irs-single:before { border-top-color: #02a8b5; } .irs--sharp .irs-from, .irs--sharp .irs-to, .irs--sharp .irs-single, .irs--sharp .irs-min, .irs--sharp .irs-max, .irs--sharp .irs-handle, .irs--sharp .irs-bar { background-color: #02a8b5; } .irs--sharp .irs-line { background: #eef0f2; } .irs--sharp .irs-from:before, .irs--sharp .irs-to:before, .irs--sharp .irs-single:before, .irs--sharp .irs-handle > i:first-child { border-top-color: #02a8b5; } .irs--sharp .irs-handle.state_hover, .irs--sharp .irs-handle:hover { background-color: #016269; } .irs--sharp .irs-handle.state_hover > i:first-child, .irs--sharp .irs-handle:hover > i:first-child { border-top-color: #016269; } .irs--round .irs-from, .irs--round .irs-to, .irs--round .irs-single, .irs--round .irs-bar { background-color: #02a8b5; } .irs--round .irs-from:before, .irs--round .irs-to:before, .irs--round .irs-single:before, .irs--round .irs-bar:before { border-top-color: #02a8b5; } .irs--round .irs-handle { background-color: #eef0f2; border: 4px solid #02a8b5; box-shadow: 0 1px 3px rgba(2, 168, 181, 0.3); } .irs--round .irs-min, .irs--round .irs-max { color: #6c757d; background-color: #dee2e6; } .irs--round .irs-line { background: #eef0f2; } .irs--square .irs-from, .irs--square .irs-to, .irs--square .irs-single, .irs--square .irs-bar { background-color: #eef0f2; } .irs--square .irs-handle { border: 3px solid #02a8b5; background-color: #eef0f2; } .irs--square .irs-line { background: #eef0f2; } .irs--square .irs-min, .irs--square .irs-max { top: 0; padding: 1px 3px; color: #6c757d; font-size: 10px; line-height: 1.333; text-shadow: none; background-color: #eef0f2; border-radius: 4px; } .irs--square .irs-single { color: #323a46; } .calendar { float: left; margin-bottom: 0; } .fc-view { margin-top: 30px; } .none-border .modal-footer { border-top: none; } .fc-toolbar { margin: 10px 0 5px 0; } .fc-toolbar h2 { font-size: 1.25rem; line-height: 1.875rem; text-transform: uppercase; } .fc-day-grid-event .fc-time { font-weight: 500; } th.fc-day-header { padding: 0.5rem 0; } .fc-day { background: transparent; } .fc-toolbar .fc-state-active, .fc-toolbar .ui-state-active, .fc-toolbar button:focus, .fc-toolbar button:hover, .fc-toolbar .ui-state-hover { z-index: 0; } .fc th.fc-widget-header { background: #dee2e6; font-size: 13px; line-height: 20px; padding: 10px 0; text-transform: uppercase; font-weight: 500; } .fc-unthemed th, .fc-unthemed td, .fc-unthemed thead, .fc-unthemed tbody, .fc-unthemed .fc-divider, .fc-unthemed .fc-row, .fc-unthemed .fc-popover { border-color: #dee2e6; } .fc-unthemed td.fc-today, .fc-unthemed .fc-divider { background: #dee2e6; } .fc-button { background: #dee2e6; border: none; color: #6c757d; text-transform: capitalize; box-shadow: none; border-radius: 3px; margin: 0 3px; padding: 6px 12px; height: auto; } .fc-text-arrow { font-family: inherit; font-size: 1rem; } .fc-state-hover, .fc-state-highlight, .fc-cell-overlay { background: #dee2e6; } .fc-state-down, .fc-state-active, .fc-state-disabled { background-color: #02a8b5; color: #fff; text-shadow: none; } .fc-unthemed .fc-today { background: #fff; } .fc-event { border-radius: 2px; border: none; cursor: move; font-size: 0.8125rem; margin: 5px 7px; padding: 5px 5px; text-align: center; } .external-event { cursor: move; margin: 10px 0; padding: 8px 10px; color: #fff; border-radius: 4px; } .fc-basic-view td.fc-week-number span { padding-right: 8px; } .fc-basic-view td.fc-day-number { padding-right: 8px; } .fc-basic-view .fc-content { color: #fff; } .fc-time-grid-event .fc-content { color: #fff; } .fc-content-skeleton .fc-day-top .fc-day-number { float: right; height: 20px; width: 20px; text-align: center; line-height: 20px; background-color: #f4f9fb; border-radius: 50%; margin: 5px; font-size: 11px; } @media (max-width: 767.98px) { .fc-toolbar { display: block; } .fc-toolbar .fc-left, .fc-toolbar .fc-right, .fc-toolbar .fc-center { float: none; display: block; clear: both; margin: 10px 0; } .fc .fc-toolbar > * > * { float: none; } .fc-today-button { display: none; } } .fc-toolbar .btn { padding: 0.28rem 0.8rem; font-size: 0.7875rem; line-height: 1.5; border-radius: 0.2rem; } .fc-list-item-title, .fc-list-item-time { color: #fff; } .colorpicker { background: #fff; box-shadow: 0 0 35px 0 rgba(154, 161, 171, 0.15); border: 1px solid #e9f3f7; } .jqstooltip { box-sizing: content-box; width: auto !important; height: auto !important; background-color: #fff !important; box-shadow: 0 0 45px 0 rgba(0, 0, 0, 0.12); padding: 5px 10px !important; border-radius: 3px; border-color: #fff !important; } .jqsfield { color: #000 !important; font-size: 12px !important; line-height: 18px !important; font-family: "Inter", sans-serif !important; font-weight: 600 !important; } .dataTables_wrapper.container-fluid { padding: 0; } table.dataTable { border-collapse: collapse !important; margin-bottom: 15px !important; } table.dataTable thead .sorting:before, table.dataTable thead .sorting_asc:before, table.dataTable thead .sorting_desc:before, table.dataTable thead .sorting_asc_disabled:before, table.dataTable thead .sorting_desc_disabled:before { right: 0.5rem; content: "\F0360"; font-family: "Material Design Icons"; font-size: 1.3rem; top: 6px; } table.dataTable thead .sorting:after, table.dataTable thead .sorting_asc:after, table.dataTable thead .sorting_desc:after, table.dataTable thead .sorting_asc_disabled:after, table.dataTable thead .sorting_desc_disabled:after { right: 0.4em; content: "\F035D"; font-family: "Material Design Icons"; top: 13px; font-size: 1.3rem; } table.dataTable tbody > tr.selected, table.dataTable tbody > tr > .selected { background-color: #02a8b5; } table.dataTable tbody > tr.selected td, table.dataTable tbody > tr > .selected td { border-color: #02a8b5; } table.dataTable tbody td:focus { outline: none !important; } table.dataTable tbody th.focus, table.dataTable tbody td.focus { outline: 2px solid #02a8b5 !important; outline-offset: -1px; background-color: rgba(2, 168, 181, 0.15); } .dataTables_info { font-weight: 600; } table.dataTable.dtr-inline.collapsed > tbody > tr[role=row] > td:first-child:before, table.dataTable.dtr-inline.collapsed > tbody > tr[role=row] > th:first-child:before { box-shadow: 0 0 45px 0 rgba(0, 0, 0, 0.12); background-color: #3b82da; top: auto; bottom: auto; } table.dataTable.dtr-inline.collapsed > tbody > tr.parent > td:first-child:before, table.dataTable.dtr-inline.collapsed > tbody > tr.parent > th:first-child:before { background-color: #f1556c; } div.dt-button-info { background-color: #02a8b5; border: none; color: #fff; box-shadow: none; border-radius: 3px; text-align: center; z-index: 21; } div.dt-button-info h2 { border-bottom: none; background-color: rgba(255, 255, 255, 0.2); color: #fff; } @media (max-width: 767.98px) { li.paginate_button.previous, li.paginate_button.next { display: inline-block; font-size: 1.5rem; } li.paginate_button { display: none; } .dataTables_paginate ul { text-align: center; display: block; margin: 1.5rem 0 0 !important; } div.dt-buttons { display: inline-table; margin-bottom: 1.5rem; } } .activate-select .sorting_1 { background-color: #f4f9fb; } .daterangepicker { font-family: "Inter", sans-serif; border: 0 solid #e9f3f7; box-shadow: 0 0 35px 0 rgba(154, 161, 171, 0.15); background-color: #fff; } .daterangepicker .calendar-table { border: 1px solid #fff; background-color: #fff; } .daterangepicker .calendar-table td, .daterangepicker .calendar-table th { color: #93a4ad; } .daterangepicker .calendar-table .next span, .daterangepicker .calendar-table .prev span { border-color: #adb5bd; } .daterangepicker .calendar-table select { color: #343a40 !important; background-color: #fff !important; border: 1px solid #ced4da !important; } .daterangepicker .ranges li:hover { background-color: #f4f9fb; } .daterangepicker .ranges li.active { background-color: #02a8b5; } .daterangepicker td.in-range { background-color: #edeff1; color: #6c757d; } .daterangepicker td.off, .daterangepicker td.off.end-date, .daterangepicker td.off.in-range, .daterangepicker td.off.start-date { background-color: #fff; color: #343a40; opacity: 0.5; } .daterangepicker td.active, .daterangepicker td.active:hover { background-color: #02a8b5; color: #fff; } .daterangepicker td.available:hover, .daterangepicker th.available:hover { background-color: #02a8b5; color: #fff; } .daterangepicker:after { border-bottom: 6px solid #fff; } .daterangepicker:before { border-bottom: 7px solid #e9f3f7; } .daterangepicker .drp-buttons { border-top: 1px solid #e9f3f7; } .daterangepicker select.ampmselect, .daterangepicker select.hourselect, .daterangepicker select.minuteselect, .daterangepicker select.secondselect { background: white; border: 1px solid white; color: #343a40; } .daterangepicker.show-ranges .drp-calendar.left { border-left: 1px solid #e9f3f7 !important; } .form-wizard-header .nav-item { margin: 0 0.5em; text-align: left; } .form-wizard-header .nav-item:first-child { margin-left: 0; } .form-wizard-header .nav-item:last-child { margin-right: 0; } .form-wizard-header .nav-item .nav-link { border-radius: 4px; background-color: rgba(2, 168, 181, 0.2); border: 1px solid rgba(2, 168, 181, 0.2); } @media (max-width: 575.98px) { .form-wizard-header .nav-item .nav-link { text-align: center; } } .form-wizard-header .nav-item .nav-link .number { display: inline-block; line-height: 30px; margin-right: 10px; width: 30px; border-radius: 50%; color: #02a8b5; background-color: rgba(2, 168, 181, 0.2); text-align: center; } @media (max-width: 575.98px) { .form-wizard-header .nav-item .nav-link .number { margin: 0; } } .form-wizard-header .nav-item .nav-link.active { background-color: #02a8b5; } .form-wizard-header .nav-item .nav-link.active .number { color: #fff; background-color: rgba(255, 255, 255, 0.2); } .select2-container { width: 100% !important; } .select2-container .select2-selection--single { border: 1px solid #ced4da; height: calc(1.5em + 0.9rem + 2px); background-color: #fff; box-shadow: none; outline: none; } .select2-container .select2-selection--single .select2-selection__rendered { line-height: 36px; padding-left: 12px; color: #343a40; } .select2-container .select2-selection--single .select2-selection__arrow { height: 34px; width: 34px; right: 3px; } .select2-container .select2-selection--single .select2-selection__arrow b { border-color: #adb5bd transparent transparent transparent; border-width: 6px 6px 0 6px; } .select2-container input:-ms-input-placeholder { color: #adb5bd; } .select2-container input::-ms-input-placeholder { color: #adb5bd; } .select2-container input::placeholder { color: #adb5bd; } .select2-container--open .select2-selection--single .select2-selection__arrow b { border-color: transparent transparent #adb5bd transparent !important; border-width: 0 6px 6px 6px !important; } .select2-results__option { padding: 6px 12px; } .select2-dropdown { border: 0 solid #e9f3f7; box-shadow: 0 0 7px 0 rgba(154, 161, 171, 0.2); background-color: #fff; } .select2-container--default .select2-search--dropdown { padding: 10px; background-color: white; } .select2-container--default .select2-search--dropdown .select2-search__field { outline: none; border: 1px solid #ced4da; background-color: #fff; color: #343a40; } .select2-container--default .select2-results__option--highlighted[aria-selected] { background-color: #02a8b5; } .select2-container--default .select2-results__option[aria-selected=true] { background-color: white; color: #323a46; } .select2-container--default .select2-results__option[aria-selected=true]:hover { background-color: #02a8b5; color: #fff; } .select2-container .select2-selection--multiple { min-height: calc(1.5em + 0.9rem + 2px); border: 1px solid #ced4da !important; background-color: #fff; box-shadow: none; } .select2-container .select2-selection--multiple .select2-selection__rendered { padding: 1px 10px; } .select2-container .select2-selection--multiple .select2-search__field { border: 0; color: #343a40; } .select2-container .select2-selection--multiple .select2-selection__choice { background-color: #02a8b5; border: none; color: #fff; border-radius: 3px; padding: 0 7px; margin-top: 6px; } .select2-container .select2-selection--multiple .select2-selection__choice__remove { color: #fff; margin-right: 5px; } .select2-container .select2-selection--multiple .select2-selection__choice__remove:hover { color: #fff; } .select2-container .select2-search--inline .select2-search__field { margin-top: 7px; } [data-simplebar] { position: relative; flex-direction: column; flex-wrap: wrap; justify-content: flex-start; align-content: flex-start; align-items: flex-start; } .simplebar-wrapper { overflow: hidden; width: inherit; height: inherit; max-width: inherit; max-height: inherit; } .simplebar-mask { direction: inherit; position: absolute; overflow: hidden; padding: 0; margin: 0; left: 0; top: 0; bottom: 0; right: 0; width: auto !important; height: auto !important; z-index: 0; } .simplebar-offset { direction: inherit !important; box-sizing: inherit !important; resize: none !important; position: absolute; top: 0; left: 0; bottom: 0; right: 0; padding: 0; margin: 0; -webkit-overflow-scrolling: touch; } .simplebar-content-wrapper { direction: inherit; box-sizing: border-box !important; position: relative; display: block; height: 100%; /* Required for horizontal native scrollbar to not appear if parent is taller than natural height */ width: auto; visibility: visible; overflow: auto; /* Scroll on this element otherwise element can't have a padding applied properly */ max-width: 100%; /* Not required for horizontal scroll to trigger */ max-height: 100%; /* Needed for vertical scroll to trigger */ scrollbar-width: none; } .simplebar-content-wrapper::-webkit-scrollbar, .simplebar-hide-scrollbar::-webkit-scrollbar { display: none; } .simplebar-content:before, .simplebar-content:after { content: ' '; display: table; } .simplebar-placeholder { max-height: 100%; max-width: 100%; width: 100%; pointer-events: none; } .simplebar-height-auto-observer-wrapper { box-sizing: inherit !important; height: 100%; width: 100%; max-width: 1px; position: relative; float: left; max-height: 1px; overflow: hidden; z-index: -1; padding: 0; margin: 0; pointer-events: none; flex-grow: inherit; flex-shrink: 0; flex-basis: 0; } .simplebar-height-auto-observer { box-sizing: inherit; display: block; opacity: 0; position: absolute; top: 0; left: 0; height: 1000%; width: 1000%; min-height: 1px; min-width: 1px; overflow: hidden; pointer-events: none; z-index: -1; } .simplebar-track { z-index: 1; position: absolute; right: 0; bottom: 0; pointer-events: none; overflow: hidden; } [data-simplebar].simplebar-dragging .simplebar-content { pointer-events: none; -ms-user-select: none; user-select: none; -webkit-user-select: none; } [data-simplebar].simplebar-dragging .simplebar-track { pointer-events: all; } .simplebar-scrollbar { position: absolute; right: 2px; width: 5px; min-height: 10px; } .simplebar-scrollbar:before { position: absolute; content: ''; background: #a2adb7; border-radius: 7px; left: 0; right: 0; opacity: 0; transition: opacity 0.2s linear; } .simplebar-scrollbar.simplebar-visible:before { /* When hovered, remove all transitions from drag handle */ opacity: 0.5; transition: opacity 0s linear; } .simplebar-track.simplebar-vertical { top: 0; width: 11px; } .simplebar-track.simplebar-vertical .simplebar-scrollbar:before { top: 2px; bottom: 2px; } .simplebar-track.simplebar-horizontal { left: 0; height: 11px; } .simplebar-track.simplebar-horizontal .simplebar-scrollbar:before { height: 100%; left: 2px; right: 2px; } .simplebar-track.simplebar-horizontal .simplebar-scrollbar { right: auto; left: 0; top: 2px; height: 7px; min-height: 0; min-width: 10px; width: auto; } /* Rtl support */ [data-simplebar-direction='rtl'] .simplebar-track.simplebar-vertical { right: auto; left: 0; } .hs-dummy-scrollbar-size { direction: rtl; position: fixed; opacity: 0; visibility: hidden; height: 500px; width: 500px; overflow-y: hidden; overflow-x: scroll; } .simplebar-hide-scrollbar { position: fixed; left: 0; visibility: hidden; overflow-y: scroll; scrollbar-width: none; } .custom-scroll { height: 100%; } .jq-toast-single { padding: 15px; font-family: "Inter", sans-serif; background-color: #02a8b5; font-size: 13px; line-height: 22px; } .jq-toast-single h2 { font-family: "Inter", sans-serif; } .jq-toast-single a { font-size: 0.875rem; } .jq-toast-single a:hover { color: #fff; } .jq-has-icon { padding: 10px 10px 10px 50px; } .close-jq-toast-single { position: absolute; top: -12px; right: -12px; font-size: 20px; cursor: pointer; height: 32px; width: 32px; background-color: #323a46; border-radius: 50%; text-align: center; line-height: 28px; color: #fff; } .jq-toast-loader { height: 3px; top: 0; border-radius: 0; } .jq-icon-primary { background-color: #02a8b5; color: #fff; border-color: #02a8b5; } .jq-icon-secondary { background-color: #6c757d; color: #fff; border-color: #6c757d; } .jq-icon-success { background-color: #3b82da; color: #fff; border-color: #3b82da; } .jq-icon-info { background-color: #4ad0e6; color: #fff; border-color: #4ad0e6; } .jq-icon-warning { background-color: #f7b84b; color: #fff; border-color: #f7b84b; } .jq-icon-danger { background-color: #f1556c; color: #fff; border-color: #f1556c; } .jq-icon-light { background-color: #f4f9fb; color: #fff; border-color: #f4f9fb; } .jq-icon-dark { background-color: #323a46; color: #fff; border-color: #323a46; } .jq-icon-pink { background-color: #f672a7; color: #fff; border-color: #f672a7; } .jq-icon-purple { background-color: #6559cc; color: #fff; border-color: #6559cc; } .jq-icon-error { background-color: #f1556c; color: #fff; border-color: #f1556c; } .swal2-modal { font-family: "Inter", sans-serif; box-shadow: 0 10px 33px rgba(0, 0, 0, 0.1); } .swal2-modal .swal2-title { font-size: 24px; font-weight: 500; } .swal2-modal .swal2-content { font-size: 16px; } .swal2-modal .swal2-spacer { margin: 10px 0; } .swal2-modal .swal2-file, .swal2-modal .swal2-input, .swal2-modal .swal2-textarea { border: 2px solid #dee2e6; font-size: 16px; box-shadow: none; } .swal2-modal .swal2-confirm.btn-confirm { background-color: #02a8b5 !important; font-size: 0.875rem; } .swal2-modal .swal2-cancel.btn-cancel { background-color: #f1556c !important; font-size: 0.875rem; } .swal2-modal .swal2-styled:focus { box-shadow: none !important; } .swal2-modal .swal2-file:focus, .swal2-modal .swal2-input:focus, .swal2-modal .swal2-textarea:focus { outline: 0; border: 2px solid #02a8b5; } .swal2-icon.swal2-question { color: #02a8b5; border-color: #02a8b5; } .swal2-icon.swal2-success { border-color: #3b82da; } .swal2-icon.swal2-success .line, .swal2-icon.swal2-success [class^=swal2-success-line][class$=long], .swal2-icon.swal2-success [class^=swal2-success-line] { background-color: #3b82da; } .swal2-icon.swal2-success .placeholder, .swal2-icon.swal2-success .swal2-success-ring { border-color: #3b82da; } .swal2-icon.swal2-warning { color: #f7b84b; border-color: #f7b84b; } .swal2-icon.swal2-error { border-color: #f1556c; } .swal2-icon.swal2-error .line { background-color: #f1556c; } .swal2-icon.swal2-info { border-color: #4ad0e6; color: #4ad0e6; } .swal2-container.swal2-shown { background-color: rgba(50, 58, 70, 0.5); } .selectize-input { height: calc(1.5em + 0.9rem + 2px); padding: 0.45rem 0.9rem; font-size: 0.875rem; font-weight: 400; line-height: 1.5; color: #343a40; background-color: #fff !important; border: 1px solid #ced4da; box-shadow: none; } .selectize-input > input { color: #343a40; } .selectize-input > input:-ms-input-placeholder { color: #adb5bd; } .selectize-input > input::-ms-input-placeholder { color: #adb5bd; } .selectize-input > input::placeholder { color: #adb5bd; } .selectize-input.focus { color: #343a40; background-color: #fff; border-color: #b1bbc4; outline: 0; box-shadow: none !important; } .selectize-control.multi .selectize-input > div { padding: 1px 8px; background: #edeff1; color: #343a40; } .selectize-control.multi .selectize-input > div > a { color: #343a40; } .selectize-control.multi .selectize-input > div.active { background: #02a8b5; } .selectize-control.multi .selectize-input > div.active > a { color: #fff; } .selectize-control.single .selectize-input:after { border-style: solid; border-width: 0 2px 2px 0; border-color: transparent #adb5bd #adb5bd transparent; content: ''; display: block; height: 7px; margin-top: -5px; pointer-events: none; position: absolute; right: 15px; top: 50%; transform-origin: 66% 66%; transform: rotate(45deg); transition: all .15s ease-in-out; width: 7px; } .selectize-control.single .selectize-input.dropdown-active:after { border-width: 0 2px 2px 0; margin-top: -5px; border-color: transparent #adb5bd #adb5bd transparent; transform: rotate(-135deg); } .selectize-dropdown { padding: .3rem; color: #343a40; box-shadow: 0 0 7px 0 rgba(154, 161, 171, 0.2); background-color: #fff; background-clip: padding-box; border: 0 solid #e9f3f7; border-radius: 0.25rem; animation-name: DropDownSlide; animation-duration: .3s; animation-fill-mode: both; margin: 0; font-size: .875rem; position: absolute; z-index: 1000; } .selectize-dropdown.show { top: 100% !important; } .selectize-dropdown.active { background-color: #f4f9fb; } .selectize-dropdown .scientific { color: #93a4ad; } .selectize-dropdown .option, .selectize-dropdown .optgroup-header { display: block; width: 100%; padding: 0.375rem 1.2rem; clear: both; cursor: pointer; font-weight: 400; color: #343a40; text-align: inherit; white-space: nowrap; background-color: transparent; } .selectize-dropdown .option:hover, .selectize-dropdown .option:focus, .selectize-dropdown .optgroup-header:hover, .selectize-dropdown .optgroup-header:focus { text-decoration: none; background-color: #f4f9fb !important; } .selectize-dropdown.plugin-optgroup_columns .optgroup { border-right-color: #e5e8eb; } .selectize-dropdown .optgroup:before { background-color: #e5e8eb; } .selectize-dropdown-header { border-bottom: 1px solid transparent; color: #323a46; background-color: #f4f9fb; text-decoration: none; } .selectize-dropdown-content > div { background-color: transparent !important; color: #343a40 !important; } .tippy-tooltip .light-theme[data-animatefill] { background-color: transparent; } .light-theme { color: #343a40; box-shadow: 0 0 45px 0 rgba(0, 0, 0, 0.12); background-color: #fff; } .light-theme .tippy-backdrop { background-color: #fff; } .light-theme .tippy-roundarrow { fill: #fff; } .gradient-theme .tippy-backdrop { background: #02a8b5; background: linear-gradient(to left, #f1556c, #02a8b5); } .tippy-popper[x-placement^=top] .tippy-tooltip.light-theme .tippy-arrow { border-top: 7px solid #fff; border-right: 7px solid transparent; border-left: 7px solid transparent; } .tippy-popper[x-placement^=bottom] .tippy-tooltip.light-theme .tippy-arrow { border-bottom: 7px solid #fff; border-right: 7px solid transparent; border-left: 7px solid transparent; } .tippy-popper[x-placement^=left] .tippy-tooltip.light-theme .tippy-arrow { border-left: 7px solid #fff; border-top: 7px solid transparent; border-bottom: 7px solid transparent; } .tippy-popper[x-placement^=right] .tippy-tooltip.light-theme .tippy-arrow { border-right: 7px solid #fff; border-top: 7px solid transparent; border-bottom: 7px solid transparent; } .dd-list .dd-item .dd-handle { border: none; padding: 8px 16px; height: auto; font-weight: 600; border-radius: 3px; background: #f4f9fb; color: #343a40; } .dd-list .dd-item .dd-handle:hover { color: #02a8b5; } .dd-list .dd-item button { height: 36px; font-size: 17px; margin: 0; color: #93a4ad; width: 36px; } .dd-list .dd3-item { margin: 5px 0; } .dd-list .dd3-item .dd-item button { width: 36px; height: 36px; } .dd-list .dd3-handle { margin: 0; height: 36px !important; float: left; } .dd-list .dd3-content { height: auto; border: none; padding: 8px 16px 8px 46px; background: #f4f9fb; color: #343a40; font-weight: 600; } .dd-list .dd3-content:hover { color: #02a8b5; } .dd-list .dd3-handle:before { content: "\F035C"; font-family: "Material Design Icons"; color: #adb5bd; } .dd-empty, .dd-placeholder { background: rgba(206, 212, 218, 0.2); } .dd-dragel .dd-handle, .dd-dragel .dd3-content { box-shadow: 0 0 35px 0 rgba(154, 161, 171, 0.15); } div.hopscotch-bubble { border: 3px solid #02a8b5; border-radius: 5px; } div.hopscotch-bubble .hopscotch-next, div.hopscotch-bubble .hopscotch-prev { background-color: #02a8b5 !important; background-image: none !important; border-color: #02a8b5 !important; text-shadow: none !important; margin: 0 0 0 5px !important; font-family: "Inter", sans-serif; color: #fff !important; } div.hopscotch-bubble .hopscotch-bubble-number { background: #f1556c; padding: 0; border-radius: 50%; } div.hopscotch-bubble .hopscotch-bubble-arrow-container.left .hopscotch-bubble-arrow-border { border-right: 19px solid #02a8b5; } div.hopscotch-bubble .hopscotch-bubble-arrow-container.left .hopscotch-bubble-arrow { border: none; } div.hopscotch-bubble .hopscotch-bubble-arrow-container.right .hopscotch-bubble-arrow { border-left: 19px solid #02a8b5; left: -2px; } div.hopscotch-bubble .hopscotch-bubble-arrow-container.right .hopscotch-bubble-arrow-border { border-left: 0 solid #02a8b5; } div.hopscotch-bubble .hopscotch-bubble-arrow-container.up .hopscotch-bubble-arrow { border-bottom: 19px solid #02a8b5; top: 0; } div.hopscotch-bubble .hopscotch-bubble-arrow-container.up .hopscotch-bubble-arrow-border { border-bottom: 0 solid rgba(0, 0, 0, 0.5); } div.hopscotch-bubble .hopscotch-bubble-arrow-container.down .hopscotch-bubble-arrow { border-top: 19px solid #02a8b5; top: -2px; } div.hopscotch-bubble .hopscotch-bubble-arrow-container.down .hopscotch-bubble-arrow-border { border-top: 0 solid rgba(0, 0, 0, 0.5); } div.hopscotch-bubble h3 { font-family: "Inter", sans-serif; margin-bottom: 10px; } div.hopscotch-bubble .hopscotch-content { font-family: "Inter", sans-serif; } .jstree-default .jstree-node, .jstree-default .jstree-icon { background-image: url("../images/plugins/jstree.png"); } .jstree-default .jstree-node { background-position: -292px -4px; background-repeat: repeat-y; } .jstree-default .jstree-themeicon-custom { background-color: transparent; background-image: none; background-position: 0 0; } .jstree-default .jstree-anchor { line-height: 28px; height: 28px; } .jstree-default > .jstree-container-ul .jstree-loading > .jstree-ocl { background: url("../images/plugins/loading.gif") center center no-repeat; } .jstree-default .jstree-icon:empty { width: 24px; height: 28px; line-height: 28px; font-size: 15px; } .jstree-default .jstree-clicked, .jstree-default .jstree-wholerow-clicked { background: rgba(2, 168, 181, 0.1); box-shadow: none; } .jstree-default .jstree-hovered, .jstree-default .jstree-wholerow-hovered { background: rgba(2, 168, 181, 0.15); box-shadow: none; } .jstree-default .jstree-last { background: transparent; } .jstree-default .jstree-wholerow { height: 28px; } .flotTip { padding: 8px 12px; background-color: #323a46; z-index: 100; color: #fff; opacity: 1; border-radius: 3px; } .legend { font-size: 14px; } .legend tr { height: 30px; font-family: "Inter", sans-serif; } .legend > div { background-color: transparent !important; } .legendLabel { padding-left: 5px !important; line-height: 10px; padding-right: 10px; font-size: 13px; font-weight: 500; color: #93a4ad; text-transform: uppercase; } .legendColorBox div div { border-radius: 50%; } .flot-text { color: #93a4ad !important; } .flot-svg text { fill: #93a4ad !important; } @media (max-width: 767.98px) { .legendLabel { display: none; } } .legendIcon { width: 1.5em; height: 1.5em; } .morris-chart text { font-family: "Inter", sans-serif !important; fill: #343a40; } .morris-hover { position: absolute; z-index: 10; } .morris-hover.morris-default-style { font-size: 12px; text-align: center; border-radius: 5px; padding: 10px 12px; background: #323a46; color: #fff; font-family: "Inter", sans-serif; } .morris-hover.morris-default-style .morris-hover-row-label { font-weight: bold; margin: 0.25em 0; font-family: "Inter", sans-serif; } .morris-hover.morris-default-style .morris-hover-point { white-space: nowrap; margin: 0.1em 0; color: #fff; } .chartjs-chart { margin: auto; position: relative; width: 100%; } .ct-golden-section:before { float: none; } .ct-grid { stroke: rgba(147, 164, 173, 0.2); } .ct-chart { max-height: 300px; } .ct-chart .ct-label { fill: #adb5bd; color: #adb5bd; font-size: 12px; line-height: 1; } .ct-chart.simple-pie-chart-chartist .ct-label { color: #fff; fill: #fff; font-size: 16px; } .ct-chart .ct-series.ct-series-a .ct-bar, .ct-chart .ct-series.ct-series-a .ct-line, .ct-chart .ct-series.ct-series-a .ct-point, .ct-chart .ct-series.ct-series-a .ct-slice-donut { stroke: #3b82da; } .ct-chart .ct-series.ct-series-b .ct-bar, .ct-chart .ct-series.ct-series-b .ct-line, .ct-chart .ct-series.ct-series-b .ct-point, .ct-chart .ct-series.ct-series-b .ct-slice-donut { stroke: #3b82da; } .ct-chart .ct-series.ct-series-c .ct-bar, .ct-chart .ct-series.ct-series-c .ct-line, .ct-chart .ct-series.ct-series-c .ct-point, .ct-chart .ct-series.ct-series-c .ct-slice-donut { stroke: #f7b84b; } .ct-chart .ct-series.ct-series-d .ct-bar, .ct-chart .ct-series.ct-series-d .ct-line, .ct-chart .ct-series.ct-series-d .ct-point, .ct-chart .ct-series.ct-series-d .ct-slice-donut { stroke: #f1556c; } .ct-chart .ct-series.ct-series-e .ct-bar, .ct-chart .ct-series.ct-series-e .ct-line, .ct-chart .ct-series.ct-series-e .ct-point, .ct-chart .ct-series.ct-series-e .ct-slice-donut { stroke: #4ad0e6; } .ct-chart .ct-series.ct-series-f .ct-bar, .ct-chart .ct-series.ct-series-f .ct-line, .ct-chart .ct-series.ct-series-f .ct-point, .ct-chart .ct-series.ct-series-f .ct-slice-donut { stroke: #f672a7; } .ct-chart .ct-series.ct-series-g .ct-bar, .ct-chart .ct-series.ct-series-g .ct-line, .ct-chart .ct-series.ct-series-g .ct-point, .ct-chart .ct-series.ct-series-g .ct-slice-donut { stroke: #02a8b5; } .ct-series-a .ct-area, .ct-series-a .ct-slice-pie { fill: #3b82da; } .ct-series-b .ct-area, .ct-series-b .ct-slice-pie { fill: #3b82da; } .ct-series-c .ct-area, .ct-series-c .ct-slice-pie { fill: #f7b84b; } .ct-series-d .ct-area, .ct-series-d .ct-slice-pie { fill: #f1556c; } .ct-area { fill-opacity: .33; } .chartist-tooltip { position: absolute; display: inline-block; opacity: 0; min-width: 10px; padding: 2px 10px; border-radius: 3px; background: #323a46; color: #fff; text-align: center; pointer-events: none; z-index: 1; transition: opacity .2s linear; } .chartist-tooltip.tooltip-show { opacity: 1; } .c3-tooltip { box-shadow: 0 0 45px 0 rgba(0, 0, 0, 0.12); opacity: 1; } .c3-tooltip td { border-left: none; font-family: "Inter", sans-serif; } .c3-tooltip td > span { background: #323a46; } .c3-tooltip tr { border: none !important; } .c3-tooltip th { background-color: #323a46; color: #fff; } .c3-chart-arcs-title { font-size: 18px; font-weight: 600; } .c3 text { font-family: "Inter", sans-serif; fill: #343a40; } .c3-legend-item { font-family: "Inter", sans-serif; font-size: 14px; } .c3 line, .c3 path { stroke: #ced4da; } .c3-chart-arc.c3-target g path { stroke: #fff; } #legend { background: white; position: absolute; top: 0; right: 15px; } #legend .line { color: #323a46; } .rickshaw_graph svg { max-width: 100%; } .rickshaw_legend .label { font-family: inherit; letter-spacing: 0.01em; font-weight: 600; } .rickshaw_graph .detail .item, .rickshaw_graph .detail .x_label, .rickshaw_graph .x_tick .title { font-family: "Inter", sans-serif; } .gauge-chart text { font-family: "Inter", sans-serif !important; } .responsive-table-plugin .dropdown-menu li.checkbox-row { padding: 7px 15px; color: #343a40; } .responsive-table-plugin .table-responsive { border: none; margin-bottom: 0; } .responsive-table-plugin .btn-toolbar { display: block; } .responsive-table-plugin tbody th { font-size: 14px; font-weight: normal; } .responsive-table-plugin .checkbox-row { padding-left: 40px; } .responsive-table-plugin .checkbox-row label { display: inline-block; padding-left: 5px; position: relative; margin-bottom: 0; } .responsive-table-plugin .checkbox-row label::before { background-color: transparent; border-radius: 3px; border: 1px solid #ced4da; content: ""; display: inline-block; height: 17px; left: 0; margin-left: -20px; position: absolute; transition: 0.3s ease-in-out; width: 17px; outline: none; } .responsive-table-plugin .checkbox-row label::after { color: #ced4da; display: inline-block; font-size: 9px; height: 16px; left: 0; margin-left: -19px; padding-left: 3px; padding-top: 1px; position: absolute; top: -2px; width: 16px; } .responsive-table-plugin .checkbox-row input[type="checkbox"] { cursor: pointer; opacity: 0; z-index: 1; outline: none; } .responsive-table-plugin .checkbox-row input[type="checkbox"]:disabled + label { opacity: 0.65; } .responsive-table-plugin .checkbox-row input[type="checkbox"]:focus + label::before { outline-offset: -2px; outline: none; } .responsive-table-plugin .checkbox-row input[type="checkbox"]:checked + label::after { content: "\f00c"; font-family: 'Font Awesome 5 Free'; font-weight: 900; } .responsive-table-plugin .checkbox-row input[type="checkbox"]:disabled + label::before { background-color: #dee2e6; cursor: not-allowed; } .responsive-table-plugin .checkbox-row input[type="checkbox"]:checked + label::before { background-color: transparent; border-color: #02a8b5; } .responsive-table-plugin .checkbox-row input[type="checkbox"]:checked + label::after { color: #02a8b5; } .responsive-table-plugin table.focus-on tbody tr.focused th, .responsive-table-plugin table.focus-on tbody tr.focused td, .responsive-table-plugin .sticky-table-header { background: #02a8b5; border-color: #02a8b5; color: #fff; } .responsive-table-plugin table.focus-on tbody tr.focused th table, .responsive-table-plugin table.focus-on tbody tr.focused td table, .responsive-table-plugin .sticky-table-header table { color: #fff; } .responsive-table-plugin .fixed-solution .sticky-table-header { top: 70px !important; } .responsive-table-plugin .btn-default { background-color: #f4f9fb; color: #343a40; border: 1px solid rgba(50, 58, 70, 0.3); } .responsive-table-plugin .btn-default.btn-primary { background-color: #02a8b5; border-color: #02a8b5; color: #fff; box-shadow: 0 0 0 2px rgba(2, 168, 181, 0.5); } .responsive-table-plugin .btn-group.pull-right { float: right; } .responsive-table-plugin .btn-group.pull-right .dropdown-menu { left: auto; right: 0; } .no-touch .dropdown-menu > .checkbox-row:hover, .no-touch .dropdown-menu > .checkbox-row:active { color: #323a46; background-color: #f4f9fb; } @font-face { font-family: 'footable'; src: url("../fonts/footable.eot"); src: url("../fonts/footable.eot?#iefix") format("embedded-opentype"), url("../fonts/footable.woff") format("woff"), url("../fonts/footable.ttf") format("truetype"), url("../fonts/footable.svg#footable") format("svg"); font-weight: normal; font-style: normal; } @media screen and (-webkit-min-device-pixel-ratio: 0) { @font-face { font-family: 'footable'; src: url("../fonts/footable.svg#footable") format("svg"); font-weight: normal; font-style: normal; } } .footable-row-detail, .footable-detail-show { background-color: #f4f9fb; } .footable-pagination li { margin-left: 5px; float: left; } .footable-pagination li a { padding: 0.5rem 0.75rem; margin-left: -1px; line-height: 1.25; color: #323a46; background-color: #fff; display: block; border: 1px solid #dee2e6; border-radius: 0.25rem; } .footable-pagination li a:hover { z-index: 2; color: #323a46; text-decoration: none; background-color: #f7f7f7; border-color: #dee2e6; } .footable-pagination li.active a { color: #fff; background-color: #02a8b5; border-color: #02a8b5; } .footable > thead > tr > th > span.footable-sort-indicator { float: right; } .footable { width: 100%; } .footable.breakpoint > tbody > tr.footable-detail-show > td { border-bottom: none; } .footable.breakpoint > tbody > tr.footable-detail-show > td > span.footable-toggle:before { content: "\e001"; } .footable.breakpoint > tbody > tr:hover:not(.footable-row-detail) { cursor: pointer; } .footable.breakpoint > tbody > tr > td.footable-cell-detail { border-top: none; } .footable.breakpoint > tbody > tr > td > span.footable-toggle { display: inline-block; font-family: 'footable'; padding-right: 5px; font-size: 14px; } .footable.breakpoint > tbody > tr > td > span.footable-toggle:before { content: "\e000"; } .footable.breakpoint.toggle-circle > tbody > tr.footable-detail-show > td > span.footable-toggle:before { content: "\e005"; } .footable.breakpoint.toggle-circle > tbody > tr > td > span.footable-toggle:before { content: "\e004"; } .footable.breakpoint.toggle-circle-filled > tbody > tr.footable-detail-show > td > span.footable-toggle:before { content: "\e003"; } .footable.breakpoint.toggle-circle-filled > tbody > tr > td > span.footable-toggle:before { content: "\e002"; } .footable.breakpoint.toggle-square > tbody > tr.footable-detail-show > td > span.footable-toggle:before { content: "\e007"; } .footable.breakpoint.toggle-square > tbody > tr > td > span.footable-toggle:before { content: "\e006"; } .footable.breakpoint.toggle-square-filled > tbody > tr.footable-detail-show > td > span.footable-toggle:before { content: "\e009"; } .footable.breakpoint.toggle-square-filled > tbody > tr > td > span.footable-toggle:before { content: "\e008"; } .footable.breakpoint.toggle-arrow > tbody > tr.footable-detail-show > td > span.footable-toggle:before { content: "\e00f"; } .footable.breakpoint.toggle-arrow > tbody > tr > td > span.footable-toggle:before { content: "\e011"; } .footable.breakpoint.toggle-arrow-small > tbody > tr.footable-detail-show > td > span.footable-toggle:before { content: "\e013"; } .footable.breakpoint.toggle-arrow-small > tbody > tr > td > span.footable-toggle:before { content: "\e015"; } .footable.breakpoint.toggle-arrow-circle > tbody > tr.footable-detail-show > td > span.footable-toggle:before { content: "\e01b"; } .footable.breakpoint.toggle-arrow-circle > tbody > tr > td > span.footable-toggle:before { content: "\e01d"; } .footable.breakpoint.toggle-arrow-circle-filled > tbody > tr.footable-detail-show > td > span.footable-toggle:before { content: "\e00b"; } .footable.breakpoint.toggle-arrow-circle-filled > tbody > tr > td > span.footable-toggle:before { content: "\e00d"; } .footable.breakpoint.toggle-arrow-tiny > tbody > tr.footable-detail-show > td > span.footable-toggle:before { content: "\e01f"; } .footable.breakpoint.toggle-arrow-tiny > tbody > tr > td > span.footable-toggle:before { content: "\e021"; } .footable.breakpoint.toggle-arrow-alt > tbody > tr.footable-detail-show > td > span.footable-toggle:before { content: "\e017"; } .footable.breakpoint.toggle-arrow-alt > tbody > tr > td > span.footable-toggle:before { content: "\e019"; } .footable.breakpoint.toggle-medium > tbody > tr > td > span.footable-toggle { font-size: 18px; } .footable.breakpoint.toggle-large > tbody > tr > td > span.footable-toggle { font-size: 24px; } .footable > thead > tr > th { -webkit-touch-callout: none; -webkit-user-select: none; -ms-user-select: none; user-select: none; } .footable > thead > tr > th.footable-sortable:hover { cursor: pointer; } .footable > thead > tr > th.footable-sorted > span.footable-sort-indicator:before { content: "\e012"; } .footable > thead > tr > th.footable-sorted-desc > span.footable-sort-indicator:before { content: "\e013"; } .footable > thead > tr > th > span.footable-sort-indicator { display: inline-block; font-family: 'footable'; padding-left: 5px; opacity: 0.3; } .footable > thead > tr > th > span.footable-sort-indicator:before { content: "\e022"; } .footable > tfoot .pagination { margin: 0; } .footable.no-paging .hide-if-no-paging { display: none; } .footable-row-detail-inner { display: table; } .footable-row-detail-row { display: table-row; line-height: 1.5em; } .footable-row-detail-group { display: block; line-height: 2em; font-size: 1.2em; font-weight: 700; } .footable-row-detail-name { display: table-cell; font-weight: 700; padding-right: 0.5em; } .footable-row-detail-value { display: table-cell; } .bootstrap-table .table:not(.table-sm) > tbody > tr > td, .bootstrap-table .table:not(.table-sm) > tbody > tr > th, .bootstrap-table .table:not(.table-sm) > tfoot > tr > td, .bootstrap-table .table:not(.table-sm) > tfoot > tr > th, .bootstrap-table .table:not(.table-sm) > thead > tr > td { padding: 0.85rem; } .bootstrap-table .table { border-bottom: none; } .bootstrap-table .table > thead > tr > th { border-bottom: 2px solid transparent; } .table-borderless.table-bordered { border: none !important; } table[data-toggle="table"] { display: none; } .fixed-table-pagination .pagination-detail, .fixed-table-pagination div.pagination { margin-top: 20px; margin-bottom: 0; } .fixed-table-pagination .pagination .page-link { border-radius: 30px !important; margin: 0 3px; border: none; } .fixed-table-container { border: none; } .fixed-table-container tbody td { border-left: none; } .fixed-table-container thead th .th-inner { padding: 0.85rem; } .fixed-table-toolbar .fa { font-family: 'Font Awesome 5 Free'; font-weight: 400; } .fixed-table-toolbar .fa.fa-sync { font-weight: 900; } .fixed-table-toolbar .fa-toggle-down:before { content: "\f150"; } .fixed-table-toolbar .fa-toggle-up:before { content: "\f151"; } .fixed-table-toolbar .fa-refresh:before { content: "\f01e"; font-weight: 900; } .fixed-table-toolbar .fa-th-list:before { content: "\f0ca"; font-weight: 900; } .tablesaw thead { background: #f4f9fb; background-image: none; border: none; } .tablesaw thead th { text-shadow: none; } .tablesaw thead tr:first-child th { border: none; font-weight: 500; font-family: "Inter", sans-serif; } .tablesaw td { border-top: 1px solid #f4f9fb !important; } .tablesaw td, .tablesaw tbody th { font-size: inherit; line-height: inherit; padding: 10px !important; } .tablesaw-stack tbody tr, .tablesaw tbody tr { border-bottom: none; } .tablesaw-bar .btn-select.btn-small:after, .tablesaw-bar .btn-select.btn-micro:after { font-size: 8px; padding-right: 10px; } .tablesaw-swipe .tablesaw-cell-persist { box-shadow: none; border-color: #f4f9fb; } .tablesaw-enhanced .tablesaw-bar .btn { text-shadow: none; background-image: none; text-transform: none; border: 1px solid #dee2e6; padding: 3px 10px; color: #323a46; } .tablesaw-enhanced .tablesaw-bar .btn:after { display: none; } .tablesaw-enhanced .tablesaw-bar .btn.btn-select:hover { background: #fff; } .tablesaw-enhanced .tablesaw-bar .btn:hover, .tablesaw-enhanced .tablesaw-bar .btn:focus, .tablesaw-enhanced .tablesaw-bar .btn:active { color: #02a8b5 !important; background-color: #f4f9fb; outline: none !important; box-shadow: none !important; background-image: none; } .tablesaw-columntoggle-popup .btn-group { display: block; } .tablesaw-swipe .tablesaw-swipe-cellpersist { border-right: 2px solid #f4f9fb; } .tablesaw-sortable-btn { cursor: pointer; } .tablesaw-swipe-cellpersist { width: auto !important; } .tablesaw-bar-section label { color: inherit; } .jsgrid-cell { padding: 0.85rem; border: 1px solid #edeff1; } .jsgrid-grid-header, .jsgrid-grid-body, .jsgrid-header-row > .jsgrid-header-cell, .jsgrid-filter-row > .jsgrid-cell, .jsgrid-insert-row > .jsgrid-cell, .jsgrid-edit-row > .jsgrid-cell { border: none; } .jsgrid-row > .jsgrid-cell { background: transparent !important; } .jsgrid-alt-row > .jsgrid-cell { background: #f4f9fb; } .jsgrid-selected-row > .jsgrid-cell { background: #f4f9fb; border-color: #edeff1; } .jsgrid-header-row > .jsgrid-header-cell { background: #f4f9fb; text-align: center !important; } .jsgrid-filter-row > .jsgrid-cell { background: #fbfdfe; } .jsgrid-edit-row > .jsgrid-cell, .jsgrid-insert-row > .jsgrid-cell { background: #f4f9fb; } .jsgrid input, .jsgrid select, .jsgrid textarea { padding: .4em .6em; outline: none !important; color: #343a40; background-color: #fff; border: 1px solid #ced4da; border-radius: 0.2rem; } .jsgrid-pager-container { margin-top: 10px; } .jsgrid-pager-page { padding: 0; margin: 0 2px; } .jsgrid-pager-page.jsgrid-pager-current-page { background-color: #02a8b5; color: #fff; } .jsgrid-pager-page a, .jsgrid-pager-current-page { background-color: #f4f9fb; border-radius: 50%; height: 24px; width: 24px; display: inline-block; text-align: center; line-height: 24px; color: #6c757d; } .jsgrid-pager-nav-button a { color: #6c757d; font-weight: 600; } .jsgrid-pager-nav-button a:hover { color: #02a8b5; } .jsgrid .jsgrid-button { width: 24px; height: 24px; border-radius: 50%; background-image: url("../images/jsgrid.png"); background-color: #f7f7f7; outline: none !important; } .jsgrid .jsgrid-button:hover { opacity: 0.9; background-color: #f4f9fb; } .jsgrid-search-mode-button { background-position: 0 -295px; } .jsgrid-insert-button { background-position: 0 -160px; } .jsgrid-header-sort:before { position: absolute; } .ms-container { background: transparent url("../images/plugins/multiple-arrow.png") no-repeat 50% 50%; width: auto; max-width: 370px; } .ms-container .ms-list { box-shadow: none; border: 1px solid #ced4da; box-shadow: none; } .ms-container .ms-list.ms-focus { box-shadow: none; border: 1px solid #b1bbc4; } .ms-container .ms-selectable li.ms-elem-selectable { border: none; padding: 5px 10px; color: #343a40; } .ms-container .ms-selectable li.ms-hover { background-color: #02a8b5; color: #fff; } .ms-container .ms-selection li.ms-elem-selection { border: none; padding: 5px 10px; color: #343a40; } .ms-container .ms-selection li.ms-hover { background-color: #02a8b5; color: #fff; } .ms-container .search-input { margin-bottom: 10px; } .ms-selectable { box-shadow: none; outline: none !important; } .ms-optgroup-label { font-weight: 500; font-family: "Inter", sans-serif; color: #323a46 !important; font-size: 13px; } .ms-container .ms-selectable, .ms-container .ms-selection { background-color: #fff; } .autocomplete-suggestions { border: 0 solid #e9f3f7; background-color: #fff; cursor: default; overflow: auto; max-height: 200px !important; box-shadow: 0 0 35px 0 rgba(154, 161, 171, 0.15); } .autocomplete-suggestion { padding: 5px 10px; white-space: nowrap; overflow: hidden; } .autocomplete-no-suggestion { padding: 5px; } .autocomplete-selected { background: #f7f7f7; cursor: pointer; } .autocomplete-suggestions strong { font-weight: bold; color: #323a46; } .autocomplete-group { padding: 5px; font-weight: 500; font-family: "Inter", sans-serif; } .autocomplete-group strong { font-weight: bold; font-size: 16px; color: #323a46; display: block; } .bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn) { width: 100% !important; } .bootstrap-select .dropdown-toggle:after { content: "\F0140"; display: inline-block; font-family: "Material Design Icons"; padding-left: 10px; } .bootstrap-select .dropdown-toggle:focus { outline: none !important; outline-offset: 0; } .bootstrap-select a { outline: none !important; } .bootstrap-select .inner { overflow-y: inherit !important; } .bootstrap-select > .dropdown-toggle .bs-placeholder { color: #adb5bd; } .bootstrap-select > .dropdown-toggle .bs-placeholder:active, .bootstrap-select > .dropdown-toggle .bs-placeholder:focus, .bootstrap-select > .dropdown-toggle .bs-placeholder:hover { color: #adb5bd; } .bootstrap-touchspin .btn .input-group-text { padding: 0; border: none; background-color: transparent; color: inherit; } .parsley-errors-list { margin: 0; padding: 0; } .parsley-errors-list > li { list-style: none; color: #f1556c; margin-top: 5px; padding-left: 20px; position: relative; } .parsley-errors-list > li:before { content: "\F0159"; font-family: "Material Design Icons"; position: absolute; left: 2px; top: -1px; } .parsley-error { border-color: #f1556c; } .parsley-success { border-color: #3b82da; } .flatpickr-calendar { background: #fff; box-shadow: 0 0 35px 0 rgba(154, 161, 171, 0.15); border: 1px solid #e9f3f7; } .flatpickr-calendar.arrowTop:before { border-bottom-color: white; } .flatpickr-calendar.arrowTop:after { border-bottom-color: #fff; } .flatpickr-calendar.arrowBottom:before, .flatpickr-calendar.arrowBottom:after { border-top-color: #fff; } .flatpickr-current-month { font-size: 110%; } .flatpickr-day.selected, .flatpickr-day.startRange, .flatpickr-day.endRange, .flatpickr-day.selected.inRange, .flatpickr-day.startRange.inRange, .flatpickr-day.endRange.inRange, .flatpickr-day.selected:focus, .flatpickr-day.startRange:focus, .flatpickr-day.endRange:focus, .flatpickr-day.selected:hover, .flatpickr-day.startRange:hover, .flatpickr-day.endRange:hover, .flatpickr-day.selected.prevMonthDay, .flatpickr-day.startRange.prevMonthDay, .flatpickr-day.endRange.prevMonthDay, .flatpickr-day.selected.nextMonthDay, .flatpickr-day.startRange.nextMonthDay, .flatpickr-day.endRange.nextMonthDay { background: #02a8b5; border-color: #02a8b5; } .flatpickr-day.selected.startRange + .endRange:not(:nth-child(7n+1)), .flatpickr-day.startRange.startRange + .endRange:not(:nth-child(7n+1)), .flatpickr-day.endRange.startRange + .endRange:not(:nth-child(7n+1)) { box-shadow: -10px 0 0 #02a8b5; } .flatpickr-time input:hover, .flatpickr-time .flatpickr-am-pm:hover, .flatpickr-time input:focus, .flatpickr-time .flatpickr-am-pm:focus { background: #fff; color: #323a46; } .flatpickr-months .flatpickr-month { height: 36px; } .flatpickr-months .flatpickr-prev-month, .flatpickr-months .flatpickr-next-month, .flatpickr-months .flatpickr-month { color: #adb5bd; fill: #adb5bd; } .flatpickr-weekdays { background-color: #f4f9fb; } span.flatpickr-weekday, .flatpickr-day, .flatpickr-current-month input.cur-year[disabled], .flatpickr-current-month input.cur-year[disabled]:hover, .flatpickr-time input, .flatpickr-time .flatpickr-time-separator, .flatpickr-time .flatpickr-am-pm { color: #343a40; fill: #343a40; } .flatpickr-day.disabled, .flatpickr-day.disabled:hover, .flatpickr-day.prevMonthDay, .flatpickr-day.nextMonthDay, .flatpickr-day.notAllowed, .flatpickr-day.notAllowed.prevMonthDay, .flatpickr-day.notAllowed.nextMonthDay { color: #93a4ad; } .flatpickr-day.inRange, .flatpickr-day.prevMonthDay.inRange, .flatpickr-day.nextMonthDay.inRange, .flatpickr-day.today.inRange, .flatpickr-day.prevMonthDay.today.inRange, .flatpickr-day.nextMonthDay.today.inRange, .flatpickr-day:hover, .flatpickr-day.prevMonthDay:hover, .flatpickr-day.nextMonthDay:hover, .flatpickr-day:focus, .flatpickr-day.prevMonthDay:focus, .flatpickr-day.nextMonthDay:focus { background: #f4f9fb; border-color: #f4f9fb; } .flatpickr-calendar.showTimeInput.hasTime .flatpickr-time { border-top: 1px solid white; } .numInputWrapper:hover, .flatpickr-current-month .flatpickr-monthDropdown-months:hover { background-color: transparent; color: #323a46; } .flatpickr-day.inRange { box-shadow: -5px 0 0 #f4f9fb, 5px 0 0 #f4f9fb; } .flatpickr-day.flatpickr-disabled, .flatpickr-day.flatpickr-disabled:hover { color: #93a4ad; } .clockpicker-popover .btn-default { background-color: #02a8b5; color: #fff; } .clockpicker-popover { background: #fff; box-shadow: 0 0 35px 0 rgba(154, 161, 171, 0.15); border: 1px solid #e9f3f7; } .clockpicker-popover .popover-title { background-color: transparent; font-weight: 500; } .clockpicker-popover .clockpicker-plate { background: #f4f9fb; border: 1px solid #e9f3f7; } .clockpicker-popover .popover-content { background-color: transparent; } .clockpicker-tick { color: #343a40; } .clockpicker-tick:hover { background-color: rgba(2, 168, 181, 0.35); } .clockpicker-canvas line { stroke: #02a8b5; } .clockpicker-canvas-bg { fill: rgba(2, 168, 181, 0.35); } .clockpicker-canvas-bearing, .clockpicker-canvas-fg { fill: #02a8b5; } @font-face { font-family: "summernote"; font-style: normal; font-weight: normal; src: url("../fonts/summernote.eot"); src: url("../fonts/summernote.eot?#iefix") format("embedded-opentype"), url("../fonts/summernote.woff?") format("woff"), url("../fonts/summernote.ttf?") format("truetype"); } .note-editor.note-frame { border: 1px solid #ced4da; box-shadow: none; margin: 0; } .note-editor.note-frame .note-statusbar { background-color: #fcfcfc; border-top: 1px solid #f7f7f7; } .note-editor.note-frame .note-editable { border: none; background-color: #fff !important; color: #343a40 !important; } .note-editor .note-dropzone { color: #343a40 !important; background-color: #fcfcfc; } .note-status-output { display: none; } .note-placeholder { color: #adb5bd; } .note-editable { border: 1px solid #ced4da; border-radius: 0.2rem; padding: 0.45rem 0.9rem !important; background-color: #fff !important; color: #343a40 !important; box-shadow: none; } .note-editable p:last-of-type { margin-bottom: 0; } .note-popover .popover-content .note-color .dropdown-menu, .card-header.note-toolbar .note-color .dropdown-menu { min-width: 344px; } .note-toolbar { z-index: 1; padding: 3px 3px 8px 8px !important; background-color: #f4f9fb; } .note-toolbar .note-btn { background: #f4f9fb; border-color: #f4f9fb; padding: .28rem .65rem; font-size: 13px; } .note-color-all .note-btn.dropdown-toggle { width: 30px !important; } .note-color-all .note-btn.dropdown-toggle:before { content: "\F035D"; font: normal normal normal 24px/1 "Material Design Icons"; position: absolute; left: 2px; top: 3px; } .note-hint-popover .popover-content .note-hint-group .note-hint-item.active, .note-hint-popover .popover-content .note-hint-group .note-hint-item:hover { background-color: #02a8b5; } .note-editor.note-airframe .note-placeholder, .note-editor.note-frame .note-placeholder { padding-left: 0.9rem; } .ql-container { font-family: "Inter", sans-serif; } .ql-container.ql-snow { border-color: #ced4da; } .ql-bubble { border: 1px solid #ced4da; border-radius: 0.2rem; } .ql-toolbar { font-family: "Inter", sans-serif !important; } .ql-toolbar span { outline: none !important; color: #343a40; } .ql-toolbar span:hover { color: #02a8b5 !important; } .ql-toolbar.ql-snow { border-color: #ced4da; } .ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-label { border-color: transparent; } .ql-snow .ql-stroke, .ql-snow .ql-script, .ql-snow .ql-strike svg { stroke: #343a40; } .ql-snow .ql-fill { fill: #343a40; } .ql-snow .ql-picker-options { background-color: #fff; border-color: #e9f3f7 !important; } .dropzone { border: 2px dashed #ced4da; background: #fff; border-radius: 6px; cursor: pointer; min-height: 150px; padding: 20px; box-shadow: none; } .dropzone .dz-message { text-align: center; margin: 2rem 0; } .dropzone.dz-started .dz-message { display: none; } @font-face { font-family: 'dropify'; src: url("../fonts/dropify.eot"); src: url("../fonts/dropify.eot#iefix") format("embedded-opentype"), url("../fonts/dropify.woff") format("woff"), url("../fonts/dropify.ttf") format("truetype"), url("../fonts/dropify.svg#dropify") format("svg"); font-weight: normal; font-style: normal; } .dropify-wrapper { border: 2px dashed #ced4da; background: #fff; border-radius: 6px; color: #343a40; } .dropify-wrapper:hover { background-image: linear-gradient(-45deg, #edeff1 25%, transparent 25%, transparent 50%, #edeff1 50%, #edeff1 75%, transparent 75%, transparent); } .dropify-wrapper .dropify-preview { background-color: white; } .editable-clear-x { background: url("../images/plugins/clear.png") center center no-repeat; } .editableform-loading { background: url("../images/plugins/loading.gif") center center no-repeat; } .editable-checklist label { display: block; } .image-crop-preview .img-preview { float: left; margin-bottom: .5rem; margin-right: .5rem; overflow: hidden; background-color: #f4f9fb; text-align: center; width: 100%; } .image-crop-preview .img-preview > img { max-width: 100%; } .image-crop-preview .preview-lg { height: 9rem; width: 16rem; } .image-crop-preview .preview-md { height: 4.5rem; width: 8rem; } .image-crop-preview .preview-sm { height: 2.25rem; width: 4rem; } .image-crop-preview .preview-xs { height: 1.125rem; margin-right: 0; width: 2rem; } .img-crop-preview-btns > .btn, .img-crop-preview-btns > .btn-group { margin-bottom: 8px; margin-right: 8px; } .docs-cropped .modal-body > img, .docs-cropped .modal-body > canvas { max-width: 100%; } .docs-drop-options { max-height: 400px; overflow-y: auto; } .gmaps, .gmaps-panaroma { height: 300px; background: #f4f9fb; border-radius: 3px; } .gmaps-overlay { display: block; text-align: center; color: #fff; font-size: 16px; line-height: 40px; background: #02a8b5; border-radius: 4px; padding: 10px 20px; } .gmaps-overlay_arrow { left: 50%; margin-left: -16px; width: 0; height: 0; position: absolute; } .gmaps-overlay_arrow.above { bottom: -15px; border-left: 16px solid transparent; border-right: 16px solid transparent; border-top: 16px solid #02a8b5; } .gmaps-overlay_arrow.below { top: -15px; border-left: 16px solid transparent; border-right: 16px solid transparent; border-bottom: 16px solid #02a8b5; } .jvectormap-label { border: none; background: #323a46; color: #fff; font-family: "Inter", sans-serif; font-size: 0.875rem; padding: 5px 8px; } .mapael .map { position: relative; } .mapael .map .zoomIn { top: 25px; } .mapael .map .zoomOut { top: 50px; } .mapael .mapTooltip { position: absolute; background-color: #02a8b5; opacity: 0.95; border-radius: 3px; padding: 2px 10px; z-index: 1000; max-width: 200px; display: none; color: #fff; font-family: "Inter", sans-serif; } .mapael .zoomIn, .mapael .zoomOut, .mapael .zoomReset { display: inline-block; text-align: center; vertical-align: middle; border-radius: 2px; font-weight: 500; cursor: pointer; background-color: #02a8b5; text-decoration: none; color: #fff; font-size: 14px; position: absolute; top: 0; left: 10px; width: 24px; height: 24px; line-height: 24px; } .mapael .plotLegend text { font-family: "Inter", sans-serif !important; fill: #93a4ad; } .datepicker { padding: 10px !important; animation: none; } .datepicker td, .datepicker th { width: 30px; height: 30px; } .datepicker table tr td.active.active, .datepicker table tr td.active.disabled, .datepicker table tr td.active.disabled.active, .datepicker table tr td.active.disabled.disabled, .datepicker table tr td.active.disabled:active, .datepicker table tr td.active.disabled:hover, .datepicker table tr td.active.disabled:hover.active, .datepicker table tr td.active.disabled:hover.disabled, .datepicker table tr td.active.disabled:hover:active, .datepicker table tr td.active.disabled:hover:hover, .datepicker table tr td .active.disabled:hover[disabled], .datepicker table tr td .active.disabled[disabled], .datepicker table tr td .active:active, .datepicker table tr td .active:hover, .datepicker table tr td .active:hover.active, .datepicker table tr td .active:hover.disabled, .datepicker table tr td .active:hover:active, .datepicker table tr td .active:hover:hover, .datepicker table tr td .active:hover[disabled], .datepicker table tr td .active[disabled], .datepicker table tr td span.active.active, .datepicker table tr td span.active.disabled, .datepicker table tr td span.active.disabled.active, .datepicker table tr td span.active.disabled.disabled, .datepicker table tr td span.active.disabled:active, .datepicker table tr td span.active.disabled:hover, .datepicker table tr td span.active.disabled:hover.active, .datepicker table tr td span.active.disabled:hover.disabled, .datepicker table tr td span.active.disabled:hover:active, .datepicker table tr td span.active.disabled:hover:hover, .datepicker table tr td span.active.disabled:hover[disabled], .datepicker table tr td span.active.disabled[disabled], .datepicker table tr td span.active:active, .datepicker table tr td span.active:hover, .datepicker table tr td span.active:hover.active, .datepicker table tr td span.active:hover.disabled, .datepicker table tr td span.active:hover:active, .datepicker table tr td span.active:hover:hover, .datepicker table tr td span.active:hover[disabled], .datepicker table tr td span.active[disabled], .datepicker table tr td.today, .datepicker table tr td.today.disabled, .datepicker table tr td.today.disabled:hover, .datepicker table tr td.today:hover { background-color: #02a8b5 !important; background-image: none !important; color: #fff; } .datepicker table tr td.day.focused, .datepicker table tr td.day:hover, .datepicker table tr td span.focused, .datepicker table tr td span:hover { background: #f7f7f7; } .datepicker table tr td.new, .datepicker table tr td.old, .datepicker table tr td span.new, .datepicker table tr td span.old { color: #6c757d; opacity: 0.4; } .datepicker .datepicker-switch:hover, .datepicker .next:hover, .datepicker .prev:hover, .datepicker tfoot tr th:hover { background: #f7f7f7; } .datepicker .datepicker-switch:hover { background: none; } .datepicker-dropdown:after { border-bottom: 6px solid #fff; } .datepicker-dropdown:before { border-bottom-color: #e9f3f7; } .datepicker-dropdown.datepicker-orient-top:before { border-top: 7px solid #e9f3f7; } .datepicker-dropdown.datepicker-orient-top:after { border-top: 6px solid #fff; } .gu-mirror { position: fixed !important; margin: 0 !important; z-index: 9999 !important; opacity: 0.8; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; filter: alpha(opacity=80); } .gu-hide { display: none !important; } .gu-unselectable { -webkit-user-select: none !important; -ms-user-select: none !important; user-select: none !important; } .gu-transit { opacity: 0.2; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=20)"; filter: alpha(opacity=20); } .dragula-handle { position: relative; width: 36px; height: 36px; font-size: 24px; text-align: center; cursor: move; } .dragula-handle:before { content: "\F01DB"; font-family: "Material Design Icons"; position: absolute; }