@charset "UTF-8"; @media (min-width: 768px) { .app.sidenav-toggled .app-content { margin-left: 0; } .app.sidenav-toggled .app-sidebar { left: -230px; } .app.sidenav-toggled .app-sidebar__overlay { visibility: hidden; } } @media (max-width: 767px) { .app { overflow-x: hidden; } .app .app-sidebar { left: -230px; } .app .app-sidebar__overlay { visibility: hidden; } .app.sidenav-toggled .app-content { margin-left: 0; } .app.sidenav-toggled .app-sidebar { left: 0; } .app.sidenav-toggled .app-sidebar__overlay { visibility: visible; } } .app-content { min-height: calc(100vh - 50px); margin-bottom: 0 !important; -webkit-transition: margin-left 0.3s ease; -o-transition: margin-left 0.3s ease; transition: margin-left 0.3s ease; } .sidebar-mini.sidenav-toggled .app-sidebar .main-logo { display: none; } .sidebar-mini.sidenav-toggled .app-sidebar .logo { display: block; } .sidebar-mini .app-sidebar .logo { display: none; } .footer .container { width: 100%; padding-right: 0.75rem; padding-left: 0.75rem; margin-right: auto; margin-left: auto; } @media (min-width: 768px) { .app-content { margin-left: 230px; } } @media (max-width: 767px) { .app-content { min-width: 100%; } .navbar .navbar-brand img { height: 40px; } } @media (max-width: 480px) {} @media print { .app-content { margin: 0; padding: 0; background-color: #fff; } } .light-text { font-weight: 300 !important; } .semibold-text { font-weight: 600 !important; } .line-head { padding-bottom: 10px; border-bottom: 1px solid #ddd; } /*----- Componant: Top Navigation Bar ----- */ .app-header { position: absolute; left: 0; right: 0; top: 0; width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; background-color: #ffffff; z-index: 1030; padding-right: 15px; padding: 10px 0; } .app-header .input-icon.mt-1 { margin-top: 2px !important; } @media (min-width: 768px) { .app-header { padding-right: 30px; } } @media print { .app-header { display: none; } } .app-header__logo { -webkit-box-flex: 1; -ms-flex: 1 0 auto; flex: 1 0 auto; color: #fff; text-align: center; font-family: 'Niconne'; padding: 0 15px; font-size: 26px; font-weight: 400; line-height: 50px; } @media (min-width: 768px) { .app-header__logo { -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; display: block; width: 230px; } } .app-header__logo:focus, .app-header__logo:hover { text-decoration: none; } .app-sidebar__toggle { padding: 0 15px; font-family: feather; color: #081340; line-height: 2.4; -webkit-transition: background-color 0.3s ease; -o-transition: background-color 0.3s ease; transition: background-color 0.3s ease; } .app-sidebar__toggle:hover, .app-sidebar__toggle:focus{ color:#00c3ed; } @media (max-width: 767px) { .app-sidebar__toggle { -webkit-box-ordinal-group: 0; -ms-flex-order: -1; order: -1; } } .app-sidebar__toggle:before { content: "\e908"; font-size: 21px; } .app-sidebar__toggle:focus, .app-sidebar__toggle:hover { text-decoration: none; } .app-nav { display: -webkit-box; display: -ms-flexbox; display: flex; margin-bottom: 0; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; } @media (min-width: 768px) { .app-nav { -webkit-box-flex: 1; -ms-flex: 1 0 auto; flex: 1 0 auto; } } .app-nav__item { display: block; padding: 15px; line-height: 20px; color: #3e4b5b; -webkit-transition: background-color 0.3s ease; -o-transition: background-color 0.3s ease; transition: background-color 0.3s ease; } .app-nav__item:hover, .app-nav__item:focus { background: rgba(0, 0, 0, 0.1); color: #f6f6f6; } .app-search { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-item-align: center; align-self: center; margin-right: 15px; padding: 10px 0; } @media (max-width: 480px) { .app-search { display: none; } } .app-search__input { border: 0; padding: 5px 10px; padding-right: 30px; border-radius: 2px; background-color: rgba(255, 255, 255, 0.8); -webkit-transition: background-color 0.3s ease; -o-transition: background-color 0.3s ease; transition: background-color 0.3s ease; } .app-search__input::-webkit-input-placeholder { color: rgba(0, 0, 0, 0.4); } .app-search__input:-ms-input-placeholder { color: rgba(0, 0, 0, 0.4); } .app-search__input::-ms-input-placeholder { color: rgba(0, 0, 0, 0.4); } .app-search__input::placeholder { color: rgba(0, 0, 0, 0.4); } .app-search__button { position: absolute; right: 0; top: 10px; bottom: 10px; padding: 0 10px; border: 0; color: rgba(0, 0, 0, 0.8); background: none; cursor: pointer; } .app-notification { min-width: 270px; } .app-notification__title { padding: 8px 20px; text-align: center; background-color: rgba(0, 150, 136, 0.4); color: #333; } .app-notification__footer { padding: 8px 20px; text-align: center; background-color: #eee; } .app-notification__content { max-height: 220px; overflow-y: auto; } .app-notification__content::-webkit-scrollbar { width: 6px; } .app-notification__content::-webkit-scrollbar-thumb { background: rgba(0, 0, 0, 0.2); } .app-notification__item { display: -webkit-box; display: -ms-flexbox; display: flex; padding: 8px 20px; color: inherit; border-bottom: 1px solid #ddd; -webkit-transition: background-color 0.3s ease; -o-transition: background-color 0.3s ease; transition: background-color 0.3s ease; } .app-notification__item:focus, .app-notification__item:hover { color: inherit; text-decoration: none; background-color: #e0e0e0; } .app-notification__message, .app-notification__meta { margin-bottom: 0; } .app-notification__icon { padding-right: 10px; } .app-notification__message { line-height: 1.2; } .app-sidebar { position: fixed; top: 0; bottom: 0; left: 0; width: 230px; overflow: auto; border-right: 1px solid #dae0ef; z-index: 10; background:#fff; -webkit-box-shadow: 0 0 2rem 0 rgba(136, 152, 170, .15) !important; box-shadow: 0 0 2rem 0 rgba(136, 152, 170, .15) !important; -webkit-transition: left 0.3s ease, width 0.3s ease; -o-transition: left 0.3s ease, width 0.3s ease; transition: left 0.3s ease, width 0.3s ease; } .app-sidebar::-webkit-scrollbar { width: 6px; } .app-sidebar::-webkit-scrollbar-thumb { background: rgba(0, 0, 0, 0.2); } @media print { .app-sidebar { display: none; } } @media (max-width: 767px) { .app-sidebar__overlay { position: fixed; top: 0; left: 0; bottom: 0; right: 0; z-index: 9; } } .app-sidebar__user { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 10px; margin: 20px 0; color: #3e4b5b; } .app-sidebar__user-avatar { -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; margin-right: 15px; } .app-sidebar__user-name.text-sm { font-size: 13px; } .app-sidebar__user-name { font-size: 17px; line-height: 1.3; } .app-sidebar__user-name, .app-sidebar__user-designation { white-space: nowrap; overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; margin-bottom: 0; } .side-menu { margin-bottom: 0; padding-bottom: 40px; list-style: none; padding: 0; } .side-menu li.slide { border-top:1px solid #dae0ef; } .side-menu li:last-child{ border-top:1px solid #dae0ef; } .slide-menu li:last-child{ border-top:0; } .side-menu li.slide:last-child { border-bottom:1px solid #dae0ef; } .side-menu li a:hover{ color:#f8f9fe; } .side-menu li a.side-menu__item:hover{ color:#f8f9fe; background: #00c3ed; } .side-menu li a.side-menu__item:hover .angle{ color:#f8f9fe; } .side-menu li a.side-menu__item:hover .side-menu__icon{ color:#f8f9fe; } .side-menu__item { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 14px 24px; font-size: 0.9em; font-weight: 300; border-left: 3px solid transparent; -webkit-transition: border-left-color 0.3s ease, background-color 0.3s ease; -o-transition: border-left-color 0.3s ease, background-color 0.3s ease; transition: border-left-color 0.3s ease, background-color 0.3s ease; color: #70768e; } .app-sidebar .navbar-brand { margin: 0 auto; text-align: center; padding: 21px 10px; display: table; } .app-sidebar .navbar-brand-img { max-height: 2.5rem; text-align: center; display: block; } .app-sidebar .mCSB_draggerContainer { right: -11px; } .slide.is-expanded a { color: #70768e; } .side-menu__icon { -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; font-size: .9375rem; line-height: 1.5rem; min-width: 2.25rem; color:#081340; } .side-menu__label { white-space: nowrap; -webkit-box-flex: 1; -ms-flex: 1 1 auto; flex: 1 1 auto; } .slide.is-expanded [data-toggle='slide'] {} .slide.is-expanded li a:hover { background: #00c3ed; color:#fff; } .slide.is-expanded li a:hover .side-menu__icon{ color:#fff; } .slide a:hover .side-menu__icon{ color:#fff; } .slide a:hover{ background: #00c3ed; } .slide.is-expanded .slide-menu { max-height: 200vh; } .slide.is-expanded .angle { -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); } .slide-menu { max-height: 0; overflow: hidden; -webkit-transition: max-height 0.3s ease; -o-transition: max-height 0.3s ease; transition: max-height 0.3s ease; background: #f4f6fb; padding: 0; list-style: none; } .slide-item { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 10px 10px 10px 54px; font-size: 0.8em; color: #70768e; } .slide-item.active, .slide-item:hover, .slide-item:focus { text-decoration: none; color: rgba(255,255,255) !important; background-color:#00c3ed; } .slide-item .icon { margin-right: 5px; } .angle { -webkit-transform-origin: center; -ms-transform-origin: center; transform-origin: center; -webkit-transition: -webkit-transform 0.3s ease; transition: -webkit-transform 0.3s ease; -o-transition: transform 0.3s ease; transition: transform 0.3s ease; transition: transform 0.3s ease, -webkit-transform 0.3s ease; color: #70768e; font-weight: 700; } @media (min-width: 768px) { .sidebar-mini.sidenav-toggled .app-sidebar__user-name, .sidebar-mini.sidenav-toggled .app-sidebar__user-designation, .sidebar-mini.sidenav-toggled .angle { display: none; } .sidebar-mini.sidenav-toggled .app-sidebar__user-avatar { width: 30px; height: 30px; } .sidebar-mini.sidenav-toggled .app-content { margin-left: 70px; } .sidebar-mini.sidenav-toggled .app-sidebar { left: 0; width: 70px; overflow: hidden; } .sidebar-mini.sidenav-toggled .app-sidebar:hover { overflow: visible; } .sidebar-mini.sidenav-toggled .side-menu__item { overflow: hidden; } .sidebar-mini.sidenav-toggled .side-menu__item:hover { overflow: visible; } .sidebar-mini.sidenav-toggled .side-menu__item:hover .side-menu__label { opacity: 1; } .sidebar-mini.sidenav-toggled .side-menu__item:hover+.slide-menu { visibility: visible; } .sidebar-mini.sidenav-toggled .side-menu__label { display: block; position: absolute; top: 0; left: 50px; min-width: 180px; padding: 12px 5px 12px 20px; margin-left: -3px; line-height: 1; opacity: 0; background: #ffffff; color: #3e4b5b; border-top-right-radius: 4px; border-bottom-right-radius: 4px; } .sidebar-mini.sidenav-toggled .slide:hover .side-menu__item { overflow: visible; border-left-color: #766cc5; background: #e0e2e8; color: #111; } .sidebar-mini.sidenav-toggled .slide:hover .side-menu__label { opacity: 1; } .sidebar-mini.sidenav-toggled .slide:hover .slide-menu { max-height: 100vh; opacity: 1; visibility: visible; z-index: 10; } .sidebar-mini.sidenav-toggled .slide .side-menu__label { border-bottom-right-radius: 0; } .sidebar-mini.sidenav-toggled .slide-menu { position: absolute; left: 50px; min-width: 180px; padding: 12px 0; opacity: 0; border-bottom-right-radius: 4px; z-index: 9; visibility: hidden; -webkit-transition: visibility 0.3s ease; -o-transition: visibility 0.3s ease; transition: visibility 0.3s ease; } } .dropdown-menu { border-radius: 0; } .dropdown-menu.dropdown-menu-right { left: auto; } .dropdown-item .fa, .dropdown-item .icon { vertical-align: middle; } .btn { cursor: pointer; } .btn:not([disabled]):not(.disabled):not(.btn-link):hover, .btn:not([disabled]):not(.disabled):not(.btn-link):focus { text-decoration: none; -webkit-transform: translate3d(0, -1px, 0); transform: translate3d(0, -1px, 0); -webkit-box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.4); box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.4); } .btn[disabled] { cursor: not-allowed; } .btn .icon, .btn .fa { font-size: 14px; margin-right: 5px; vertical-align: middle; } .app-title { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; background-color: #FFF; margin: -30px -30px 30px; padding: 20px 30px; -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); } @media print { .app-title { display: none; } } @media (max-width: 480px) { .app-title { margin: -15px -15px 15px; padding: 20px; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } } .app-title h1 { margin: 0; font-size: 24px; font-weight: 400; } .app-title p { margin-bottom: 0; font-style: italic; } @media (max-width: 480px) { .app-title p { display: none; } } .app-breadcrumb { margin-bottom: 0; text-align: right; font-weight: 500; font-size: 13px; text-transform: capitalize; padding: 0; text-align: left; padding: 0; background-color: transparent; } @media (max-width: 480px) { .app-breadcrumb { margin-top: 10px; } } .sidenav-toggled .app-sidebar__user .avatar-md { width: 1.8rem; height: 1.8rem; line-height: 2rem; font-size: 1rem; }