%PDF- %PDF-
Direktori : /home/eirtvhdf/hire-va.com/legal/business/assets/css/ |
Current File : /home/eirtvhdf/hire-va.com/legal/business/assets/css/structure.css |
/* =============================== @Import Function =============================== */ /* =============================== @Import Mixins =============================== */ html { min-height: 100%; } body { color: #888ea8; height: 100%; font-size: 0.875rem; background: #f1f2f3; overflow-x: hidden; overflow-y: auto; letter-spacing: 0.0312rem; font-family: 'Quicksand', sans-serif; } h1, h2, h3, h4, h5, h6 { color: #3b3f5c; } :focus { outline: none; } ::-moz-selection { /* Code for Firefox */ color: #1b55e2; background: transparent; } ::selection { color: #1b55e2; background: transparent; } p { margin-top: 0; margin-bottom: 0.625rem; color: #515365; } hr { margin-top: 20px; margin-bottom: 20px; border-top: 1px solid #f1f2f3; } strong { font-weight: 600; } code { color: #e7515a; } /*Page title*/ .navbar .navbar-item .nav-item.page-heading { margin-left: 20px; } .navbar.expand-header .navbar-item .nav-item.page-heading { margin-left: 25px; } .main-container { min-height: 100vh; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } #container.fixed-header { margin-top: 56px; } #content { width: 50%; flex-grow: 8; margin-top: 80px; margin-bottom: 0; margin-left: 255px; -webkit-transition: .3s ease all; transition: .3s ease all; } .main-container-fluid > .main-content > .container { float: left; width: 100%; } #content > .wrapper { -webkit-transition: margin ease-in-out .1s; -moz-transition: margin ease-in-out .1s; -o-transition: margin ease-in-out .1s; transition: margin ease-in-out .1s; position: relative; } .widget { padding: 0; margin-top: 0; margin-bottom: 0; border-radius: 6px; border: 1px solid #e0e6ed; box-shadow: 0 0 40px 0 rgba(94, 92, 154, 0.06); } .layout-top-spacing { margin-top: 20px; } .layout-spacing { padding-bottom: 40px; } .layout-px-spacing { padding: 0 20px 0 20px !important; min-height: calc(100vh - 140px) !important; } .widget.box .widget-header { background: #fff; padding: 0px 8px 0px; border-top-right-radius: 6px; border-top-left-radius: 6px; } .row [class*="col-"] .widget .widget-header h4 { color: #3b3f5c; font-size: 17px; font-weight: 600; margin: 0; padding: 16px 15px; } .seperator-header { background: transparent; box-shadow: none; margin-bottom: 40px; border-radius: 0; } .seperator-header h4 { color: #888ea8; margin-bottom: 0; display: inline-block; border: 2px dashed #888ea8; line-height: 1.4; padding: 3px 6px; font-size: 15px; font-weight: 600; border-radius: 4px; letter-spacing: 1px; } .widget .widget-header { border-bottom: 0px solid #f1f2f3; } .widget .widget-header:before { display: table; content: ""; line-height: 0; } .widget .widget-header:after { display: table; content: ""; line-height: 0; clear: both; } .widget-content-area { padding: 20px; position: relative; background-color: #fff; border-bottom-left-radius: 6px; border-bottom-right-radius: 6px; } .content-area { max-width: 58.333333%; margin-left: 80px; } /* ===================== Navigation Bar ===================== */ .header-container { z-index: 1030; } .navbar { padding: 0; min-height: 80px; background: #445ede; -webkit-transition: .3s ease all; transition: .3s ease all; -webkit-box-shadow: 0 4px 6px 0 rgba(85, 85, 85, 0.08), 0 1px 20px 0 rgba(0, 0, 0, 0.07), 0px 1px 11px 0px rgba(0, 0, 0, 0.07); -moz-box-shadow: 0 4px 6px 0 rgba(85, 85, 85, 0.08), 0 1px 20px 0 rgba(0, 0, 0, 0.07), 0px 1px 11px 0px rgba(0, 0, 0, 0.07); box-shadow: 0 4px 6px 0 rgba(85, 85, 85, 0.08), 0 1px 20px 0 rgba(0, 0, 0, 0.07), 0px 1px 11px 0px rgba(0, 0, 0, 0.07); } .navbar.expand-header { padding: 0; } .navbar-brand { width: 5.5rem; padding-top: 0.0rem; padding-bottom: 0.0rem; margin-right: 0.0rem; } .navbar .border-underline { border-left: 1px solid #ccc; height: 20px; margin-top: 18px; margin-left: -5px; margin-right: 8px; } .navbar-expand-sm .navbar-item { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; padding-left: 0; margin-bottom: 0; list-style: none; } .header-container .navbar-nav.theme-brand { width: 255px; height: 80px; display: flex; justify-content: space-around; background: #fff; border-right: 1px solid #445ede; background-image: linear-gradient(to right, #445ede 0%, #304aca 100%); } .header-container .navbar-nav.theme-brand .theme-logo { align-self: center; opacity: 1; width: 47px; } .header-container .navbar-nav.theme-brand .theme-logo img { width: 48px; height: 48px; border-radius: 5px; } .header-container .navbar-nav .theme-text { align-self: center; opacity: 1; width: 68px; } .header-container .navbar-nav .theme-text a { padding: 0; font-size: 25px; font-weight: 700; color: #fff; letter-spacing: 0px; } .header-container .toggle-sidebar { align-self: center; } .header-container .sidebarCollapse svg { width: 27px; height: 27px; color: #fff; stroke-width: 2px; } .navbar-expand-sm .navbar-item .nav-link { line-height: 2.75rem; padding: 6.24px 9.6px; text-transform: initial; position: unset; } .custom-dropdown .dropdown-item.active svg, .custom-dropdown .dropdown-item:active svg, .custom-dropdown .dropdown-item:hover svg { color: #304aca; fill: rgba(48, 74, 202, 0.309804) !important; } .custom-dropdown-icon .dropdown-item.active svg, .custom-dropdown-icon .dropdown-item:active svg, .custom-dropdown-icon .dropdown-item:hover svg { color: #304aca; fill: rgba(48, 74, 202, 0.309804) !important; } .navbar .dropdown-menu { border-radius: 6px; border-color: #e0e6ed; } .navbar .dropdown-item { line-height: 1.8; font-size: 0.96rem; padding: 15px 0 15px 0; word-wrap: normal; } .navbar .navbar-item .nav-item.dropdown.show a.nav-link span { color: #5c1ac3 !important; } .navbar .navbar-item .nav-item.dropdown.show a.nav-link span.badge { background-color: #888ea8 !important; } .navbar .navbar-item .nav-item .dropdown-item.active, .navbar .navbar-item .nav-item .dropdown-item:active { background-color: transparent; color: #16181b; } .navbar .navbar-item .nav-item.dropdown .nav-link:hover span { color: #5c1ac3 !important; } .navbar .navbar-item .nav-item.dropdown .dropdown-menu { top: 109%; border-radius: 0; border: none; border-radius: 6px; -webkit-box-shadow: 0 10px 30px 0 rgba(31, 45, 61, 0.1); box-shadow: 0 10px 30px 0 rgba(31, 45, 61, 0.1); background: #fff; border: 1px solid #e0e6ed; -webkit-transition: all .2s ease-in-out; transition: all .2s ease-in-out; } .navbar .navbar-item .nav-item.dropdown .dropdown-menu .dropdown-item { border-radius: 6px; } .navbar .apps-dropdown { align-self: center; margin-left: 21px; } .navbar .apps-dropdown .custom-dropdown-icon { margin-right: 20px; } .navbar .apps-dropdown .custom-dropdown-icon a.dropdown-toggle { position: relative; padding: 14px 17px 14px 10px; border: 1px solid #304aca; border-radius: 6px; transform: none; font-size: 11px; line-height: 17px; background-color: #304aca; letter-spacing: normal; min-width: 128px; text-align: inherit; color: #fff; box-shadow: none; max-height: 50px; letter-spacing: 1px; } .navbar .apps-dropdown .custom-dropdown-icon a.dropdown-toggle img { width: 17px; height: 17px; margin-right: 9px; } .navbar .apps-dropdown .custom-dropdown-icon a.dropdown-toggle svg:not(.feather-chevron-down) { margin-right: 9px; stroke-width: 1; width: 17px; height: 17px; } .navbar .apps-dropdown .custom-dropdown-icon a.dropdown-toggle svg.feather-chevron-down { position: absolute; right: 4px; top: 16px; color: #fafafa; width: 13px; height: 13px; margin: 0; -webkit-transition: -webkit-transform .2s ease-in-out; transition: -webkit-transform .2s ease-in-out; transition: transform .2s ease-in-out; transition: transform .2s ease-in-out, -webkit-transform .2s ease-in-out; } .navbar .apps-dropdown .custom-dropdown-icon.show a.dropdown-toggle svg.feather-chevron-down { -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); } .navbar .apps-dropdown .custom-dropdown-icon .dropdown-menu { position: absolute; left: 0px; top: 56px !important; padding: 8px 0; border: none; min-width: 155px; border: 1px solid #d3d3d3; } .navbar .apps-dropdown .custom-dropdown-icon .dropdown-menu a { padding: 4px 24px; font-size: 13px; font-weight: 600; color: #888ea8; letter-spacing: 0px; line-height: 27px; } .navbar .apps-dropdown .custom-dropdown-icon .dropdown-menu a svg { fill: rgba(136, 142, 168, 0.231373); stroke-width: 1px; } .navbar .apps-dropdown .custom-dropdown-icon .dropdown-menu a:hover { background-color: transparent; color: #3b3f5c; border-radius: 0 !important; } .navbar .language-dropdown { align-self: center; } .navbar .language-dropdown .custom-dropdown-icon { margin-right: 20px; } .navbar .language-dropdown .custom-dropdown-icon a.dropdown-toggle { position: relative; padding: 14px 17px 14px 10px; border: 1px solid #304aca; border-radius: 6px; transform: none; font-size: 11px; line-height: 17px; background-color: #304aca; letter-spacing: normal; min-width: 98px; text-align: inherit; color: #fff; box-shadow: none; max-height: 50px; letter-spacing: 1px; } .navbar .language-dropdown .custom-dropdown-icon a.dropdown-toggle img { width: 17px; height: 17px; margin-right: 9px; display: none; } .navbar .language-dropdown .custom-dropdown-icon a.dropdown-toggle svg { position: absolute; right: 4px; top: 16px; color: #fafafa; width: 13px; height: 13px; margin: 0; -webkit-transition: -webkit-transform .2s ease-in-out; transition: -webkit-transform .2s ease-in-out; transition: transform .2s ease-in-out; transition: transform .2s ease-in-out, -webkit-transform .2s ease-in-out; } .navbar .language-dropdown .custom-dropdown-icon.show a.dropdown-toggle svg { -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); } .navbar .language-dropdown .custom-dropdown-icon .dropdown-menu { position: absolute; right: 1px; top: 56px !important; padding: 8px 8px; border: none; min-width: 155px; border: 1px solid #d3d3d3; } .navbar .language-dropdown .custom-dropdown-icon .dropdown-menu a { padding: 8px 7px; font-size: 13px; font-weight: 500; color: #3b3f5c; } .navbar .language-dropdown .custom-dropdown-icon .dropdown-menu a:hover { background-color: #ebedf2; color: #1b55e2; } .navbar .language-dropdown .custom-dropdown-icon .dropdown-menu img { width: 17px; height: 17px; margin-right: 7px; vertical-align: sub; } .navbar .navbar-item .nav-item.dropdown.message-dropdown { margin-left: 20px; } .navbar .navbar-item .nav-item.dropdown.message-dropdown .nav-link { font-size: 20px; padding: 6px 0; } .navbar .navbar-item .nav-item.dropdown.message-dropdown .nav-link:after { display: none; } .navbar .navbar-item .nav-item.dropdown.message-dropdown .nav-link svg { color: #e0e6ed; } .navbar .navbar-item .nav-item.dropdown.message-dropdown .nav-link span.badge { position: absolute; display: block; width: 5px; height: 5px; border-radius: 50%; padding: 0; font-size: 10px; color: #fff !important; background: #e2a03f; border: 1px solid #e2a03f; top: 15px; right: -3px; } .navbar .navbar-item .nav-item.dropdown.message-dropdown.double-digit .nav-link span.badge { top: 11px; right: 1px; width: 22px; height: 22px; padding: 3px 3px 0px; font-size: 9px; } .navbar .navbar-item .nav-item.dropdown.message-dropdown .dropdown-menu { min-width: 13rem; right: -15px; left: auto; padding: 10px !important; } .navbar .navbar-item .nav-item.dropdown.message-dropdown .dropdown-menu .dropdown-item { padding: 8px 7px; border: 1px solid #fff; } .navbar .navbar-item .nav-item.dropdown.message-dropdown .dropdown-menu .dropdown-item.active, .navbar .navbar-item .nav-item.dropdown.message-dropdown .dropdown-menu .dropdown-item:active { background-color: transparent; } .navbar .navbar-item .nav-item.dropdown.message-dropdown .dropdown-menu .dropdown-item:not(:last-child) { border-bottom: 1px solid #e0e6ed; } .navbar .navbar-item .nav-item.dropdown.message-dropdown .dropdown-menu .dropdown-item:focus, .navbar .navbar-item .nav-item.dropdown.message-dropdown .dropdown-menu .dropdown-item:hover { background-color: transparent; } .navbar .navbar-item .nav-item.dropdown.message-dropdown .dropdown-menu .dropdown-item:first-child { padding-top: 8px; } .navbar .navbar-item .nav-item.dropdown.message-dropdown .dropdown-menu:after { right: 17px; } .navbar .navbar-item .nav-item.dropdown.message-dropdown .dropdown-menu .dropdown-item:last-child { padding-bottom: 8px; cursor: pointer; } .navbar .navbar-item .nav-item.dropdown.message-dropdown .dropdown-menu .media { margin: 0; } .navbar .navbar-item .nav-item.dropdown.message-dropdown .dropdown-menu .media .avatar { position: relative; display: inline-block; width: 39px; height: 39px; font-size: 14px; margin-right: 11px; font-weight: 500; } .navbar .navbar-item .nav-item.dropdown.message-dropdown .dropdown-menu .media .avatar .avatar-title { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; background-color: #304aca; color: #fff; font-weight: 600; } .navbar .navbar-item .nav-item.dropdown.message-dropdown .dropdown-menu .media img { width: 40px; height: 40px; margin-right: 11px; } .navbar .navbar-item .nav-item.dropdown.message-dropdown .dropdown-menu .media .media-body h5.usr-name { font-size: 15px; margin-bottom: 0px; color: #0e1726; font-weight: 500; } .navbar .navbar-item .nav-item.dropdown.message-dropdown .dropdown-menu .dropdown-item:hover .media-body h5.usr-name { color: #445ede; } .navbar .navbar-item .nav-item.dropdown.message-dropdown .dropdown-menu .media .media-body { align-self: center; } .navbar .navbar-item .nav-item.dropdown.message-dropdown .dropdown-menu .media .media-body p.msg-title { font-size: 10px; font-weight: 700; color: #888ea8; margin-bottom: 0; letter-spacing: 0; } .navbar .navbar-item .nav-item.dropdown.notification-dropdown { margin-left: 20px; } .navbar .navbar-item .nav-item.dropdown.notification-dropdown .nav-link { font-size: 21px; padding: 6px 0; } .navbar .navbar-item .nav-item.dropdown.notification-dropdown .nav-link:after { display: none; } .navbar .navbar-item .nav-item.dropdown.notification-dropdown .nav-link svg { color: #e0e6ed; } .navbar .navbar-item .nav-item.dropdown.notification-dropdown .nav-link span.badge { position: absolute; top: 15px; right: -3px; width: 5px; height: 5px; border-radius: 50%; padding: 3px 0px 0px; font-size: 10px; color: #fff !important; background: #25d5e4; display: block; border: 1px solid #25d5e4; } .navbar .navbar-item .nav-item.dropdown.notification-dropdown .dropdown-menu { min-width: 15rem; right: -5px; left: auto; } .navbar .navbar-item .nav-item.dropdown.notification-dropdown .dropdown-menu .dropdown-item { padding: 0.625rem 1rem; cursor: pointer; } .navbar .navbar-item .nav-item.dropdown.notification-dropdown .dropdown-menu .dropdown-item:focus, .navbar .navbar-item .nav-item.dropdown.notification-dropdown .dropdown-menu .dropdown-item:hover { background-color: #ebedf2; } .navbar .navbar-item .nav-item.dropdown.notification-dropdown .dropdown-menu .dropdown-item:not(:last-child) { border-bottom: 1px solid #ebedf2; } .navbar .navbar-item .nav-item.dropdown.notification-dropdown .dropdown-menu .media { margin: 0; } .navbar .navbar-item .nav-item.dropdown.notification-dropdown .dropdown-menu svg { width: 23px; height: 23px; font-weight: 600; color: #e2a03f; fill: rgba(226, 160, 63, 0.270588); margin-right: 9px; align-self: center; } .navbar .navbar-item .nav-item.dropdown.notification-dropdown .dropdown-menu .media.file-upload svg { color: #e7515a; fill: rgba(231, 81, 90, 0.239216); } .navbar .navbar-item .nav-item.dropdown.notification-dropdown .dropdown-menu .media.server-log svg { color: #009688; fill: rgba(0, 150, 136, 0.368627); } .navbar .navbar-item .nav-item.dropdown.notification-dropdown .dropdown-menu .media-body { display: flex; justify-content: space-between; } .navbar .navbar-item .nav-item.dropdown.notification-dropdown .dropdown-menu .data-info { display: inline-block; white-space: normal; } .navbar .navbar-item .nav-item.dropdown.notification-dropdown .dropdown-menu .data-info h6 { margin-bottom: 0; font-weight: 600; font-size: 14px; margin-right: 8px; } .navbar .navbar-item .nav-item.dropdown.notification-dropdown .dropdown-menu .data-info p { margin-bottom: 0; font-size: 13px; font-weight: 600; color: #888ea8; } .navbar .navbar-item .nav-item.dropdown.notification-dropdown .dropdown-menu .icon-status { display: inline-block; white-space: normal; } .navbar .navbar-item .nav-item.dropdown.notification-dropdown .dropdown-menu .icon-status svg { margin: 0; } .navbar .navbar-item .nav-item.dropdown.notification-dropdown .dropdown-menu .icon-status svg.feather-x { color: #bfc9d4; width: 19px; height: 19px; cursor: pointer; } .navbar .navbar-item .nav-item.dropdown.notification-dropdown .dropdown-menu .icon-status svg.feather-x:hover { color: #e7515a; } .navbar .navbar-item .nav-item.dropdown.notification-dropdown .dropdown-menu .icon-status svg.feather-check { color: #fff; background: #0d9a5d; border-radius: 50%; padding: 3px; width: 22px; height: 22px; } .navbar .navbar-item.search-ul { margin-left: auto; margin-right: 15px; } .navbar .navbar-item .nav-item.search-animated { position: relative; margin-left: 20px; } .navbar .navbar-item .nav-item.search-animated svg { display: none; } .navbar .navbar-item .nav-item form.form-inline input.search-form-control { width: 100%; font-size: 12px; border: none; border-radius: 8px; color: #bfc9d4; letter-spacing: 1px; padding: 0px 4px 0px 20px; height: 36px; font-weight: 600; } .navbar .navbar-item .nav-item form.form-inline input.search-form-control:focus { box-shadow: 0 0.1px 0.4px rgba(0, 0, 0, 0), 0 0.1px 1.1px rgba(0, 0, 0, 0), 0 0.3px 2px rgba(0, 0, 0, 0), 0 0.4px 3.6px rgba(0, 0, 0, 0), 0 0.8px 6.7px rgba(0, 0, 0, 0.023), 0 2px 16px rgba(0, 0, 0, 0.14); } .navbar .navbar-item .nav-item .form-inline.search .search-form-control { border: 1px solid #304aca; width: 100%; width: 425px; height: 50px; background: #304aca; } .navbar .navbar-item .nav-item form.form-inline input.search-form-control::-webkit-input-placeholder { color: #bfc9d4; letter-spacing: 1px; font-size: 12px; } .navbar .navbar-item .nav-item form.form-inline input.search-form-control::-ms-input-placeholder { color: #bfc9d4; letter-spacing: 1px; font-size: 12px; } .navbar .navbar-item .nav-item form.form-inline input.search-form-control::-moz-placeholder { color: #bfc9d4; letter-spacing: 1px; font-size: 12px; } .navbar .navbar-item .nav-item form.form-inline input.search-form-control:focus::-webkit-input-placeholder { color: #888ea8; } .navbar .navbar-item .nav-item form.form-inline input.search-form-control:focus::-ms-input-placeholder { color: #888ea8; } .navbar .navbar-item .nav-item form.form-inline input.search-form-control:focus::-moz-placeholder { color: #888ea8; } /* apps */ /* apps Dropdown */ /* Language */ /* Language Dropdown */ /*Message Dropdown*/ /*Notification Dropdown*/ /* Search */ .search-overlay { display: none; position: fixed; width: 100vw; height: 100vh; background: transparent !important; z-index: 814 !important; opacity: 0; transition: all 0.5s ease-in-out; } .search-overlay.show { display: block; opacity: .1; } /* User Profile Dropdown*/ .navbar .navbar-item .nav-item.user-profile-dropdown { margin-left: 20px; margin-right: 16px; } .navbar .navbar-item .nav-item.user-profile-dropdown .dropdown-menu .user-profile-section { padding: 16px 15px; border-top-left-radius: 4px; border-top-right-radius: 4px; margin-right: -12px; margin-left: -12px; background: #2196F3; margin-top: -1px; background-image: linear-gradient(to top, #a29fff 0%, #2196F3 52%, #2196F3 100%); } .navbar .navbar-item .nav-item.user-profile-dropdown .dropdown-menu .user-profile-section .media { margin: 0; } .navbar .navbar-item .nav-item.user-profile-dropdown .dropdown-menu .user-profile-section .media img { width: 40px; height: 40px; border-radius: 50%; border: none; } .navbar .navbar-item .nav-item.user-profile-dropdown .dropdown-menu .user-profile-section .media .media-body { align-self: center; } .navbar .navbar-item .nav-item.user-profile-dropdown .dropdown-menu .user-profile-section .media .media-body h5 { font-size: 14px; font-weight: 500; margin-bottom: 0; color: #fafafa; } .navbar .navbar-item .nav-item.user-profile-dropdown .dropdown-menu .user-profile-section .media .media-body p { font-size: 11px; font-weight: 500; margin-bottom: 0; color: #e0e6ed; } .navbar .navbar-item .nav-item.user-profile-dropdown .nav-link.user { padding: 6px 0; font-size: 25px; } .navbar .navbar-item .nav-item.dropdown.user-profile-dropdown .nav-link:after { display: none; } .navbar .navbar-item .nav-item.user-profile-dropdown .nav-link svg { color: #e0e6ed; } .navbar .navbar-item .nav-item.user-profile-dropdown .dropdown-menu { z-index: 9999; max-width: 13rem; padding: 0 11px; top: 60px; left: -140px; } .navbar .navbar-item .nav-item.user-profile-dropdown .dropdown-menu .dropdown-item { padding: 0; } .navbar .navbar-item .nav-item.user-profile-dropdown .dropdown-menu .dropdown-item a { display: block; color: #3b3f5c; font-size: 13px; font-weight: 700; padding: 9px 14px; } .navbar .navbar-item .nav-item.user-profile-dropdown .dropdown-menu .dropdown-item.active, .navbar .navbar-item .nav-item.user-profile-dropdown .dropdown-menu .dropdown-item:active { background-color: transparent; } .navbar .navbar-item .nav-item.user-profile-dropdown .dropdown-menu .dropdown-item:not(:last-child) { border-bottom: 1px solid #ebedf2; } .navbar .navbar-item .nav-item.user-profile-dropdown .dropdown-menu .dropdown-item svg { width: 17px; margin-right: 7px; height: 17px; color: #2196F3; fill: #2196F3; } /* =============== Sidebar =============== */ .sidebar-wrapper { width: 255px; position: fixed; z-index: 1030; transition: .550s; top: 80px; height: 100vh; touch-action: none; user-select: none; -webkit-user-drag: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); -webkit-box-shadow: 4px 0 6px 0 rgba(85, 85, 85, 0.08), 1px 0 20px 0 rgba(0, 0, 0, 0.07), 1px 0 11px 0px rgba(0, 0, 0, 0.07); -moz-box-shadow: 4px 0 6px 0 rgba(85, 85, 85, 0.08), 1px 0 20px 0 rgba(0, 0, 0, 0.07), 1px 0 11px 0px rgba(0, 0, 0, 0.07); box-shadow: 4px 0 6px 0 rgba(85, 85, 85, 0.08), 1px 0 20px 0 rgba(0, 0, 0, 0.07), 1px 0 11px 0px rgba(0, 0, 0, 0.07); box-shadow: 0 0 40px 0 rgba(94, 92, 154, 0.06); border-right: 1px solid #e0e6ed; } .sidebar-theme { background: #fff; } #sidebar .theme-brand .toggle-sidebar { align-self: center; } #sidebar .theme-brand .toggle-sidebar svg { width: 18px; height: 18px; color: #fafafa; transition: 500ms; } #sidebar * { overflow: hidden; white-space: nowrap; } .sidebar-wrapper .profile-info { position: relative; padding-bottom: 0; background: #fafafa; } .sidebar-wrapper .profile-info * { transition: .600s; } .sidebar-wrapper .profile-info figure { width: 100%; height: 82px; background: url("../img/255x255.jpg") center center/cover no-repeat; margin-bottom: 0; } .sidebar-wrapper .profile-info .user-info { text-align: center; padding: 50px 0 0 0; height: 105px; } .sidebar-wrapper .profile-info .user-info img { position: absolute; top: 34px; border-radius: 50%; border: 6px solid rgba(235, 237, 242, 0.611765); border: 6px solid rgba(68, 94, 222, 0.24); left: 0; right: 0; height: 90px; width: 90px; margin-right: auto; margin-left: auto; } .sidebar-wrapper .profile-info .user-info h6 { font-weight: 700; font-size: 16px; letter-spacing: 0px; margin-top: 0; margin-bottom: 0; opacity: 1; } .sidebar-wrapper .profile-info .user-info p { font-size: 13px; font-weight: 600; letter-spacing: 0; opacity: 1; color: #888ea8; } #sidebar .theme-brand li.theme-logo { align-self: center; } #sidebar .theme-brand li.theme-logo img { width: 40px; height: 40px; } #sidebar .theme-brand li.theme-text a { font-size: 25px !important; color: #e0e6ed !important; line-height: 2.75rem; padding: 0.39rem 0.8rem; text-transform: initial; position: unset; font-weight: 600; } #sidebar .navbar-brand .img-fluid { display: inline; width: 44px; height: auto; margin-left: 20px; margin-top: 5px; } .shadow-bottom { display: block; position: absolute; z-index: 2; height: 33px; width: 100%; pointer-events: none; margin-top: -13px; left: -4px; -webkit-filter: blur(5px); filter: blur(7px); background: -webkit-linear-gradient(#fafafac4 41%, rgba(255, 255, 255, 0.14) 95%, rgba(255, 255, 255, 0)); background: linear-gradient(#fafafac4 41%, rgba(255, 255, 255, 0.14) 95%, rgba(255, 255, 255, 0)); } #sidebar ul.menu-categories { position: relative; padding: 20px 0 20px 0; margin: auto; width: 100%; overflow: auto; } #sidebar ul.menu-categories.ps { height: calc(100vh - 282px) !important; } #sidebar ul.menu-categories.ps .ps__rail-y:hover { background-color: transparent; } #sidebar ul.menu-categories.ps:hover > .ps__rail-y .ps__thumb-y { background-color: #888ea8; } .sidebar-closed #sidebar:hover ul.menu-categories.ps { height: calc(100vh - 282px) !important; } .sidebar-closed #sidebar ul.menu-categories.ps { height: calc(100vh - 130px) !important; } #sidebar ul.menu-categories li > .dropdown-toggle[aria-expanded="true"] svg.feather-chevron-right { transform: rotate(90deg); } #sidebar ul.menu-categories li.menu:first-child ul.submenu > li a { justify-content: flex-start; } #sidebar ul.menu-categories li.menu:first-child ul.submenu > li a i { align-self: center; margin-right: 12px; font-size: 19px; width: 21px; } .sidebar-wrapper ul.menu-categories li.menu.menu-heading > .heading { cursor: pointer; font-size: 13px; font-weight: 700; color: #515365; padding: 20px 0 20px 12px; letter-spacing: 1px; } .sidebar-wrapper ul.menu-categories li.menu.menu-heading > .heading .feather-minus { display: none; vertical-align: sub; width: 12px; height: 12px; stroke-width: 4px; color: #304aca; } #sidebar ul.menu-categories li.menu { transition: .600s; margin: 0px 15px 3px 15px; } #sidebar ul.menu-categories li.menu > .dropdown-toggle { display: flex; justify-content: space-between; cursor: pointer; font-size: 13px; color: #3b3f5c; padding: 14px 10px; font-weight: 600; transition: .600s; border-radius: 6px; letter-spacing: 0; } #sidebar ul.menu-categories li.menu > .dropdown-toggle > div { align-self: center; } #sidebar ul.menu-categories li.menu .dropdown-toggle:after { display: none; } #sidebar ul.menu-categories li.menu > .dropdown-toggle svg { color: #888ea8; margin-right: 18px; vertical-align: middle; width: 24px; height: 24px; stroke-width: 1px; fill: rgba(172, 176, 195, 0.35); transition: all .2s ease-in-out; } #sidebar ul.menu-categories li.menu .active svg { color: #fff; fill: rgba(136, 142, 168, 0.278431); stroke-width: 2px; } #sidebar ul.menu-categories li.menu .active span { color: #fff; border-radius: 12px; font-weight: 600; position: relative; transition: all .2s ease-in-out; } #sidebar ul.menu-categories li.menu:not(.active) > .dropdown-toggle:not([aria-expanded="true"]):hover svg:not(.feather-chevron-right), #sidebar ul.menu-categories li.menu:not(.active) > .dropdown-toggle:hover svg:not(.feather-chevron-right) { margin-right: 30px; } #sidebar ul.menu-categories li.menu > .dropdown-toggle svg.feather-chevron-right { vertical-align: middle; margin-right: 0; width: 15px; } #sidebar ul.menu-categories li.menu > .dropdown-toggle[aria-expanded="true"] svg.flaticon-right-arrow, #sidebar ul.menu-categories li.menu > .dropdown-toggle[aria-expanded="true"] svg.flaticon-down-arrow { background-color: transparent; } #sidebar ul.menu-categories li.menu > a span:not(.badge) { vertical-align: middle; } #sidebar ul.menu-categories ul.submenu > li a { position: relative; display: flex; justify-content: space-between; padding: 15px 12px 15px 48px; padding-left: 61px; font-size: 13px; font-weight: 500; color: #1b2e4b; } #sidebar ul.menu-categories li.menu ul.submenu > li a:before { content: ''; background-color: #d3d3d3; position: absolute; height: 3px; width: 3px; top: 22.5px; left: 50px; border-radius: 50%; } #sidebar ul.menu-categories li.menu ul.submenu > li.active a:before { background-color: #445ede; } #sidebar ul.menu-categories ul.submenu > li.active a { color: #304aca; font-size: 14px; font-weight: 700; } #sidebar ul.menu-categories li.menu.active > .dropdown-toggle { background: #304aca; } #sidebar ul.menu-categories li.menu.active > .dropdown-toggle svg.feather-chevron-right { transform: rotate(90deg); } #sidebar ul.menu-categories li.menu.active > .dropdown-toggle[aria-expanded="false"] svg { color: #fff; stroke-width: 2px; } #sidebar ul.menu-categories li.menu.active > .dropdown-toggle[aria-expanded="false"] span { color: #fff; font-weight: 600; } #sidebar ul.menu-categories ul.submenu > li a:hover { color: #304aca; } #sidebar ul.menu-categories ul.submenu > li a:hover:before { background-color: #304aca !important; } #sidebar ul.menu-categories ul.submenu li > [aria-expanded="true"]:before { background-color: #304aca !important; } #sidebar ul.menu-categories ul.submenu li > a[aria-expanded="true"] { color: #304aca; font-size: 14px; } #sidebar ul.menu-categories ul.submenu > li ul.sub-submenu > li a { position: relative; padding: 10px 12px 10px 48px; padding-left: 13px; margin-left: 62px; font-size: 11px; color: #506690; } #sidebar ul.menu-categories ul.submenu > li ul.sub-submenu > li.active a { color: #304aca; } #sidebar ul.menu-categories ul.submenu > li ul.sub-submenu > li a:hover { color: #304aca; } #sidebar ul.menu-categories ul.submenu > li ul.sub-submenu > li a:hover:before { background-color: #304aca; } #sidebar ul.menu-categories ul.submenu > li ul.sub-submenu > li a:before { content: ''; background-color: #515365; position: absolute; top: 15px !important; border-radius: 50%; left: 0; } #sidebar ul.menu-categories ul.submenu > li ul.sub-submenu > li.active a:before { background-color: #304aca; } .sidebar-closed > .sidebar-wrapper { width: 54px; } .sidebar-closed > #content { margin-left: 54px; } .sidebar-closed > .sidebar-wrapper .profile-info { position: relative; } .sidebar-closed > .sidebar-wrapper .profile-info figure { height: 0; opacity: 0; } .sidebar-closed > .sidebar-wrapper .profile-info .user-info { text-align: center; padding: 50px 0 0 0; height: 50px; } .sidebar-closed > .sidebar-wrapper .profile-info .user-info img { top: 10px; border: 3px solid rgba(68, 94, 222, 0.24); width: 36px; height: 36px; } .sidebar-closed > .sidebar-wrapper .profile-info .user-info h6, .sidebar-closed > .sidebar-wrapper .profile-info .user-info p { opacity: 0; } .sidebar-closed #sidebar ul.menu-categories li.menu { margin: 0px 8px; } .sidebar-closed .sidebar-wrapper ul.menu-categories li.menu.menu-heading > .heading { padding: 20px 9px 20px 13px; } .sidebar-closed .sidebar-wrapper ul.menu-categories li.menu.menu-heading > .heading .feather-minus { display: inline-block; } .sidebar-closed > .sidebar-wrapper ul.menu-categories li.menu.menu-heading > .heading span { display: none; } .sidebar-closed #sidebar ul.menu-categories li.menu > .dropdown-toggle { padding: 11px 7px; transition: .600s; position: relative; } .sidebar-closed #sidebar ul.menu-categories li.menu > .dropdown-toggle svg.feather-chevron-right { display: none; } .sidebar-closed #sidebar:hover ul.menu-categories li.menu { margin: 0px 15px 3px 15px; } .sidebar-closed > .sidebar-wrapper:hover { width: 255px; } .sidebar-closed > .sidebar-wrapper:hover .profile-info { position: relative; } .sidebar-closed > .sidebar-wrapper:hover .profile-info figure { height: 76px; opacity: 1; } .sidebar-closed > .sidebar-wrapper:hover .profile-info .user-info { padding: 50px 0 0 0; height: 105px; } .sidebar-closed > .sidebar-wrapper:hover .profile-info .user-info img { top: 34px; border: 6px solid rgba(68, 94, 222, 0.24); width: 90px; height: 90px; } .sidebar-closed > .sidebar-wrapper:hover .profile-info .user-info h6, .sidebar-closed > .sidebar-wrapper:hover .profile-info .user-info p { opacity: 1; } .sidebar-closed .sidebar-wrapper:hover #sidebar ul.menu-categories { padding: 20px 0 20px 0; } .sidebar-closed .sidebar-wrapper:hover ul.menu-categories li.menu.menu-heading > .heading .feather-minus { display: none; } .sidebar-closed .sidebar-wrapper:hover #sidebar ul.menu-categories li.menu > .dropdown-toggle[aria-expanded="true"]:before { display: none; } .sidebar-closed .sidebar-wrapper:hover #sidebar ul.menu-categories li.menu > .dropdown-toggle svg.feather-chevron-right { display: inline-block; } .sidebar-closed .sidebar-wrapper:hover #sidebar ul.menu-categories li.menu > .dropdown-toggle[aria-expanded="true"] svg { padding: 0; background: transparent; border-radius: 0; border: none; } .sidebar-closed > .sidebar-wrapper:hover ul.menu-categories li.menu.menu-heading > .heading { padding: 20px 0 20px 20px; } .sidebar-closed > .sidebar-wrapper:hover ul.menu-categories li.menu.menu-heading > .heading span { display: inline-block; } .sidebar-closed > .sidebar-wrapper:hover #sidebar ul.menu-categories li.menu > .dropdown-toggle { padding: 14px 10px; transition: .600s; } .overlay { display: none; position: fixed; width: 100vw; height: 100vh; background: rgba(0, 0, 0, 0.4); z-index: 1035 !important; opacity: 0; transition: all 0.5s ease-in-out; top: 0; bottom: 0; right: 0; left: 0; touch-action: pan-y; user-select: none; -webkit-user-drag: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } .animated { -webkit-animation-duration: 0.6s; animation-duration: 0.6s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } @-webkit-keyframes e-fadeInUp { 0% { opacity: 0; margin-top: 10px; } 100% { opacity: 1; margin-top: 0; } } @keyframes e-fadeInUp { 0% { opacity: 0; margin-top: 10px; } 100% { opacity: 1; margin-top: 0; } } .fadeInUp { -webkit-animation-name: e-fadeInUp; animation-name: e-fadeInUp; } /* ====================== Footer-wrapper ====================== */ .footer-wrapper { padding: 10px 20px 10px 20px; display: inline-block; background: transparent; font-weight: 600; font-size: 12px; width: 100%; border-top-left-radius: 6px; display: flex; justify-content: space-between; } .main-container.sidebar-closed .footer-wrapper { border-radius: 0; } .footer-wrapper .footer-section p { margin-bottom: 0; color: #515365; font-size: 13px; letter-spacing: 1px; } .footer-wrapper .footer-section p a { color: #515365; } .footer-wrapper .footer-section svg { color: #e7515a; fill: rgba(231, 81, 90, 0.419608); width: 15px; height: 15px; vertical-align: text-top; } /* ====================== MEDIA QUERIES ====================== */ @media (max-width: 991px) { .header-container { padding-right: 0; padding-left: 0; } /* ============= NavBar ============= */ .main-container.sidebar-closed #content { margin-left: 0; } .navbar .navbar-item .nav-item.search-animated { margin-left: 0; } .navbar .language-dropdown .custom-dropdown-icon { margin-right: 0; } .navbar .navbar-item .nav-item .form-inline.search .search-form-control { width: 189px !important; } /* ============= Sidebar ============= */ #content { margin-left: 0; } #sidebar .theme-brand { border-radius: 0; } .sidebar-closed #sidebar .theme-brand { padding: 0.9px 12px 0.9px 24px; } .main-container:not(.sbar-open) .sidebar-wrapper, body.alt-menu .sidebar-closed > .sidebar-wrapper { width: 0; left: -52px; } .main-container { padding: 0; } #sidebar ul.menu-categories.ps { height: calc(100vh - 218px) !important; } .sidebar-wrapper { position: fixed; top: 0; bottom: 0; z-index: 9999; backface-visibility: hidden; -webkit-backface-visibility: hidden; -webkit-transform: translate3d(0, 0, 0); border-radius: 0; } #sidebar { height: 100vh !important; backface-visibility: hidden; -webkit-backface-visibility: hidden; -webkit-transform: translate3d(0, 0, 0); } /* display .overlay when it has the .active class */ .overlay.show { display: block; opacity: .7; } .navbar .navbar-item .nav-item.dropdown.message-dropdown .dropdown-menu { right: -78px; padding: 24px 0; } .navbar .navbar-item .nav-item.dropdown.message-dropdown .dropdown-menu:after { right: 80px; } .navbar .navbar-item .nav-item.dropdown.notification-dropdown .dropdown-menu { right: -39px; } .navbar .navbar-item .nav-item.dropdown.notification-dropdown .dropdown-menu:after { right: 42px; } .navbar .navbar-item .nav-item.user-profile-dropdown .dropdown-menu { right: 12px; } .navbar .navbar-item .nav-item.user-profile-dropdown .dropdown-menu::after { right: 3px; } } @media (max-width: 1199px) { .navbar .navbar-item .nav-item .form-inline.search .search-form-control { width: 220px; } } @media (min-width: 992px) { .sidebar-closed #sidebar .theme-brand li.theme-text a, .md-visible { display: none; } .header-container .expand-header .navbar-nav .theme-text { opacity: 0; width: 0; display: none; } .header-container .expand-header .navbar-nav.theme-brand { width: 54px; } .header-container .expand-header .navbar-nav.theme-brand .theme-logo { opacity: 0; width: 0; display: none; } } @media (max-width: 991px) { .sidebar-wrapper { border: none; box-shadow: none; } .md-hidden { display: none; } .header-container .navbar-nav .theme-text { display: none; } .header-container .navbar-nav.theme-brand { width: 110px; } } @media (max-width: 767px) { .navbar .navbar-item.search-ul { margin: 0 0 0 auto; } .navbar .navbar-item .nav-item .form-inline.search { opacity: 0; transition: opacity 200ms, top 200ms; top: -25px; } .navbar .navbar-item .nav-item .form-inline.search .search-form-control { opacity: 0; transition: opacity 200ms, top 200ms; } .navbar .navbar-item .nav-item .form-inline.search.input-focused { position: absolute; bottom: 0; top: 0; background: #445ede; height: 100%; width: 100%; left: 0; right: 0; z-index: 32; margin-top: 0px !important; display: flex; opacity: 1; transition: opacity 200ms, top 200ms; } .navbar .navbar-item .nav-item .form-inline.search.input-focused .search-form-control { opacity: 1; transition: opacity 200ms, top 200ms; } .navbar .navbar-item .nav-item.search-animated { position: initial; margin-right: 10px; } .navbar .navbar-item .nav-item.search-animated svg { display: block; margin: 0; cursor: pointer; color: #e0e6ed; position: initial; width: 24px; height: 24px; transition: top 200ms; } .navbar .navbar-item .nav-item.search-animated.show-search svg { margin: 0; position: absolute; top: 29px; left: 16px; width: 22px; height: 22px; color: #ebedf2; z-index: 40; transition: top 200ms; } .navbar .navbar-item .nav-item .form-inline.search.input-focused .search-bar { width: 100%; } .navbar .navbar-item .nav-item .form-inline.search.input-focused .search-form-control { background: transparent; display: block; padding-left: 50px; padding-right: 12px; border: none; width: 100% !important; box-shadow: none; } .navbar .navbar-item .nav-item .form-inline.search .search-form-control { border: none; width: 100%; display: none; } } @media (max-width: 575px) { .navbar .navbar-item .nav-item.dropdown.message-dropdown, .navbar .navbar-item .nav-item.dropdown.notification-dropdown { margin-left: 15px; } .navbar .navbar-item .nav-item.user-profile-dropdown { margin-left: 15px; } .navbar .language-dropdown .custom-dropdown-icon a.dropdown-toggle { min-width: 35px; padding: 8px 8px 8px 8px; } .navbar .language-dropdown .custom-dropdown-icon .dropdown-menu { top: 50px !important; right: -119px; } .navbar .language-dropdown .custom-dropdown-icon a.dropdown-toggle img { margin-right: 0; display: block; } .navbar .language-dropdown .custom-dropdown-icon a.dropdown-toggle span, .navbar .language-dropdown .custom-dropdown-icon a.dropdown-toggle svg { display: none; } .footer-wrapper .footer-section.f-section-2 { display: none; } }