/** * The LogiFlow Platform * * A cloud based we application development platform * built upon the CodeIgniter framework. * * Copyright (C) 2016 Logibase Limited - All Rights Reserved * * @package LogiFlow * @author Logibase Dev Team * @copyright Copyright (c) 2016, Logibase Limited (http://logibase.com) * * @link http://logibase.com */ /* --------------------------------------------------------------------- | XS Styles less than 768px */ /* | ====================================================================== | General | ====================================================================== */ html, body { color: #33353f; background-color: #DDDDDD; } b, strong { font-weight: 600; } .content-body > .row + .row { padding-top: 0; } .glyphicons{ position:relative; top:1px; display:inline-block; font-style:normal; font-weight:400; line-height:1; vertical-align:baseline; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; } .fa-rotate-45 { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); } .header .logo { margin: 0; } .userbox .profile-picture img { width: 40px; } .userbox.open .dropdown-menu { top: -14px; } .userbox .custom-caret { font-size: 18px; } .notifications > li { margin-right: 10px; /* 15px for > 1 icon */ } .notifications > li .notification-icon { background-color: #F1F1F1; } .header .separator { margin: 0 20px 0; } @media only screen and (max-width: 1140px) { #global_search_container, #global_search_separator { display: none !important; }} /* if not using the right slide in bar then pad away from right edge */ .page-header .breadcrumbs { padding-right: 15px; } .page-header .breadcrumbs i { vertical-align: baseline; } .page-header .breadcrumbs i.fa-home { font-size: 1.7rem; } html .scroll-to-top { right: auto; left: 13px; background: #DDDDDD; color: #0088CC; } html .scroll-to-top:hover { color: #0088CC; opacity: 1; } .inner-toolbar { background: #CCCCCC; border: 0px!important; } html.sidebar-light:not(.dark) .inner-toolbar { background: #CCCCCC; } .inner-toolbar > ul > li { border-right: 2px solid #ECEDF0; border-left:0; padding: 10px; } .inner-toolbar > ul > li > .btn { margin-top: 0; } .inner-toolbar > ul > li.right { border-left: 2px solid #ECEDF0; border-right:0; } .inner-toolbar > ul > li > a { color: #F1F1F1; } html.sidebar-light:not(.dark) .inner-toolbar > ul > li > a { color: #F1F1F1; } html.sidebar-light:not(.dark) .inner-toolbar > ul > li > a:hover, html.sidebar-light:not(.dark) .inner-toolbar > ul > li > a:focus { color: #F1F1F1; } .inner-toolbar > ul > li > a.btn { padding: 6px 12px; } .inner-toolbar > ul > li > a:hover { color: #FFF; } .inner-toolbar > ul > li.has-btn { padding-bottom: 9px; padding-left:9px; border: 0!important; } @media only screen and (max-width: 480px) { .inner-toolbar ul > li.right { float: right; clear:none; }} .demo-mode-header { padding: 3px 10px 0 10px; background: #f2dede; display: inline-block; height: 100%; margin: 0 20px; vertical-align: middle; } .demo-mode-header b { color: #bb0000; } .input-from-to { width: 100%; } .input-from-to .input-group-addon { /*width: auto;*/ min-width: 16px; padding: 4px 10px; line-height: 1.42857143; text-shadow: 0 1px 0 #fff; margin-left: -5px; margin-right: -5px; } .input-from-to .input-group-addon:not(:first-child):not(:last-child) { border-width: 1px 0; } .widget-profile-info .profile-info .profile-footer { border-top-color: rgba(255, 255, 255, 0.2); } .widget-profile-info .profile-info .profile-footer a { color: #fff; opacity: 0.6; } .widget-profile-info .profile-info { display: block; text-align: center; } .widget-profile-info .profile-info h1 { font-size: 22px; line-height: 29px; } .bg-default .widget-profile-info .profile-info .profile-footer { border-top-color: rgba(162, 162, 162, 0.2); } .bg-default .widget-profile-info .profile-info .profile-footer a { color: #666; opacity: 0.6; } .widget-profile-info .profile-picture-square { display: block; } .widget-profile-info .profile-picture-square img { display: block; width: 100px; height: 100px; margin-right: auto; border: 4px solid #48a9da; border-radius: 0; } .status-strip { margin-bottom: 18px; border: 0px solid #999; } .status-strip > div { display: table-cell; background-color: #f1f1f1; color: #c3c3c3; vertical-align: middle; } .status-strip > div:nth-child(1) { padding: 5px 15px 5px 15px; white-space: nowrap; font-style: italic; } .status-strip > div:nth-child(2) { padding: 5px 12px; white-space: nowrap; background-color: #999; color: #fff; font-size: 1.9rem; font-weight: 400; } .status-strip > div:nth-child(3) { padding: 5px 15px 5px 10px; width: 100%; white-space: normal; color: #666; font-size: 1.3rem; } .status-strip > div:nth-child(3) > div { float:right; } .status-strip > div:nth-child(3) > div span { font-size: 1.2rem; color: #c3c3c3; white-space: nowrap; margin-left: 12px; font-style: italic; } .status-strip > div:nth-child(3) > div span i { padding-right: 2px; } .status-strip.success { border-color: #47a447; } .status-strip.success > div:nth-child(2) { background: #47a447; color: #FFF; } .status-strip.warning { border-color: #ed9c28; } .status-strip.warning > div:nth-child(2) { background: #ed9c28; color: #FFF; } .status-strip.danger { border-color: #d2322d; } .status-strip.danger > div:nth-child(2) { background: #d2322d; color: #FFF; } .status-strip.info { border-color: #5bc0de; } .status-strip.info > div:nth-child(2) { background: #5bc0de; color: #FFF; } .status-strip.primary { border-color: #0088cc; } .status-strip.primary > div:nth-child(2) { background: #0088cc; color: #FFF; } .status-strip.dark { border-color: #171717; } .status-strip.dark > div:nth-child(2) { background: #171717; color: #FFF; } .text-left-not-xs, .text-left-not-sm, .text-left-not-md, .text-left-not-lg { text-align: left; } .text-center-not-xs, .text-center-not-sm, .text-center-not-md, .text-center-not-lg { text-align: center; } .text-right-not-xs, .text-right-not-sm, .text-right-not-md, .text-right-not-lg { text-align: right; } .text-justify-not-xs, .text-justify-not-sm, .text-justify-not-md, .text-justify-not-lg { text-align: justify; } @media (max-width: 767px) { .text-left-not-xs, .text-center-not-xs, .text-right-not-xs, .text-justify-not-xs { text-align: inherit; } .text-left-xs { text-align: left; } .text-center-xs { text-align: center; } .text-right-xs { text-align: right; } .text-justify-xs { text-align: justify; } } @media (min-width: 768px) and (max-width: 991px) { .text-left-not-sm, .text-center-not-sm, .text-right-not-sm, .text-justify-not-sm { text-align: inherit; } .text-left-sm { text-align: left; } .text-center-sm { text-align: center; } .text-right-sm { text-align: right; } .text-justify-sm { text-align: justify; } } @media (min-width: 992px) and (max-width: 1199px) { .text-left-not-md, .text-center-not-md, .text-right-not-md, .text-justify-not-md { text-align: inherit; } .text-left-md { text-align: left; } .text-center-md { text-align: center; } .text-right-md { text-align: right; } .text-justify-md { text-align: justify; } } @media (min-width: 1200px) { .text-left-not-lg, .text-center-not-lg, .text-right-not-lg, .text-justify-not-lg { text-align: inherit; } .text-left-lg { text-align: left; } .text-center-lg { text-align: center; } .text-right-lg { text-align: right; } .text-justify-lg { text-align: justify; } } .panel-lb-dashboard.panel-featured-left { border-left-width: 5px; } .panel-lb-dashboard.panel-featured-left.panel-featured-default { border-left-color: #c7c7c7; } .panel-lb-dashboard .widget-summary .summary .title { } .panel-lb-dashboard.panel-featured-primary .widget-summary .summary .title { } .panel-lb-diag .widget-summary .summary { min-height: 0px; } .panel-lb-diag .panel-body { padding: 5px 10px 10px 10px; } .panel-lb-diag .widget-summary .summary .title { font-size: 1.3rem; color: #8a8a8a; } .panel-lb-diag .widget-summary .summary .amount { font-size: 2rem; font-weight: 400; color: #33353f; } .panel-lb-diag .widget-summary .summary .info { font-size: inherit; line-height: inherit; } .panel-lb-diag .panel-featured-success .panel-body { background-color: #eaf7ea !important; } .panel-lb-diag .panel-featured-warning .panel-body { background-color: #fff3e1 !important; } .panel-lb-diag .panel-featured-danger .panel-body { background-color: #f9eded !important; } .panel-lb-diag .panel-featured-primary .panel-body { background-color: #eaf7fd !important; } .panel-lb-diag .panel-featured-clickable:hover { cursor: pointer; } .panel.panel-lb-help { } .panel.panel-lb-help .panel-heading { background-color: #9dc7ca; border: none; } .panel.panel-lb-help .panel-title { color: #ffffff; font-weight: 400; } .panel.panel-lb-help .panel-title i { color: white; font-size: 30px; margin-right: -12px; } .panel.panel-lb-help .panel-body { background-color: #f0feff; border: 3px solid #9dc7ca; border-width: 0 2px 2px 2px; color: #7b7b7b; } .div-lb-help { background-color: #f0feff; border: 3px solid #9dc7ca; border-width: 2px; color: #7b7b7b; padding: 5px 10px; margin-bottom: 15px; } .model-attr-updater:not(.disabled) { cursor: pointer; position: relative; } .model-attr-updater:not(.disabled):hover { background-color: lightyellow!important; } .model-attr-updater:not(.disabled)::before { position: absolute; top:2px; right:2px; color: #000000; opacity: 0.2; font-style: normal; font-variant: normal; text-rendering: auto; -webkit-font-smoothing: antialiased; font-family: "Font Awesome 5 Free"; font-weight: 400; content: "\f044"; } .model-attr-updater:not(.disabled):hover::before { color: #caca6e; opacity: 1; } .help-tooltip { } .help-tooltip.xxl { font-size: 22px; } .help-tooltip.xl { font-size: 18px; } .help-tooltip.lg { font-size: 16px; } .help-tooltip.md { font-size: 15px; } .help-tooltip.sm { font-size: 14px; } .help-tooltip.xs { font-size: 12px; } .colour-default { color: #ebebeb; } .colour-primary { color: #CCC; } .colour-secondary { color: #E36159; } .colour-tertiary { color: #2BAAB1; } .colour-quartenary { color: #734BA9; } .colour-success { color: #dff0d8; } .colour-warning { color: #fdd59b; } .colour-danger { color: #f2dede; } .colour-info { color: #d9edf7; } .colour-dark { color: #171717; } .colour-misc { color: #2baab1; } .colour-yellow-pastel { color: #fdfd96; } .bg-misc { color: #fff; background-color: #2baab1; } .bg-danger-light {color: #000;background-color: #f2dede !important;} .bg-warning-light {color: #000;background-color: #ffeacb !important;} .bg-success-light {color: #000;background-color: #d0f1d0 !important;} .bg-info-light{ color: #000; background-color: #dff4ff !important; } .bg-yellow-pastel { color: #000; background-color: #fdfd96 !important; } .bg-misc-light { color: #000; background-color: #d2edef !important; } .bg-quartenary-light { color: #000; background-color: #e0d7ec !important; } .checkbox-primary { color: #bfbfbf; } .checkbox-success { color: #3f923f; } .checkbox-warning { color: #e89113; } .checkbox-danger { color: #bd2d29; } .checkbox-info { color: #46b8da; } .checkbox-dark { color: #0a0a0a; } p[class^="contex-bg-"] { padding: 5px 10px; } .contex-bg-default { background: #ebebeb; color: #33353f; } .contex-bg-primary { background: #CCC; color: #33353f; } .contex-bg-secondary { background: #E36159; color: #fff; } .contex-bg-tertiary { background: #2BAAB1; color: #fff; } .contex-bg-quartenary { background: #734BA9; color: #fff; } .contex-bg-success { background: #dff0d8; color: #33353f; } .contex-bg-warning { background: #fdd59b; color: #33353f; } .contex-bg-danger { background: #f2dede; color: #33353f; } .contex-bg-info { background: #d9edf7; color: #33353f; } .contex-bg-dark { background: #171717; color: #fff; } .body-sign .center-sign { vertical-align: top; } .body-sign .center-sign .logo { margin-bottom: 20px; } .body-sign .center-sign .title-sign { font-size: 20px; line-height: 38px; text-align: center; } .popover { min-width: 0px; max-width: none; display: block; white-space: normal; z-index: 99999; } .popover .popover-content { display: block; white-space: nowrap; } .popover .popover-content .btn { display: inline-block; white-space: nowrap; margin-right: 10px; } .popover .popover-content .btn:last-child { margin-right: 0; } .popover h3 { color: #777; font-family: "Open Sans", Arial, sans-serif; line-height: 22px; font-size: 15px; } ul.dropdown-menu li a.edit-hover:hover { color: #ed9c28; cursor: pointer; } ul.dropdown-menu li a.archive-hover:hover { color: #ed9c28; cursor: pointer; } ul.dropdown-menu li a.delete-hover:hover { color: #d2322d; cursor: pointer; } ul.dropdown-menu li a.history-hover:hover { cursor: pointer; } table.data-display > tbody > tr > th { font-weight: 400; color: #BBB; text-align: right; white-space: nowrap; width: 1%; } table.data-display > tbody > tr > th, table.data-display > tbody > tr > td { border-bottom: 1px solid #f1f1f1; border-top: 0; } table.data-display > tbody > tr.spacer th, table.data-display > tbody > tr.spacer td { height: 10px; padding: 0px; line-height: 0px; background-color: #f1f1f1; } table.receipt-display > tbody > tr > td { text-align: right; white-space: nowrap; width: 1%; } table.receipt-display > tbody > tr > th, table.receipt-display > tbody > tr > td { font-weight: 400; border-bottom: 1px solid #f1f1f1; border-top: 0; } table.receipt-display > tbody > tr.total > td, table.receipt-display > tbody > tr.total > th { font-weight: 600; font-size: 14px; text-align: right; border-bottom: none; border-top: 3px double #CCCCCC; } h4.lined { background: #c1c1c1; padding-top: 10px; font-weight: 300; font-size: 17px; } h4.lined span { display: inline-block; background: #fff; padding: 4px 10px; margin: 0 10px; text-align: center; line-height: 22px; } h4.lined-thin { background: #e2e2e2; padding-top: 4px; font-weight: 300; font-size: 17px; padding-left: 0px; } h4.lined-thin span { display: inline-block; background: #fff; padding: 0px 10px; margin: 0 4px; text-align: center; line-height: 22px; } .mt-xxl { margin-top: 50px !important; } .mb-xxl { margin-bottom: 50px !important; } .ml-xxl { margin-left: 50px !important; } .mr-xxl { margin-right: 50px !important; } .modal-wrapper { padding: 10px 0; } #modalIcon > section > header.modal-stickey-header { position: sticky; top: 0; z-index: 99999!important; } .modal-block.modal-block-xl { max-width: 1200px; } .modal-icon .fa, .modal-icon .far, .modal-icon .fas { font-size: 52px; } .modal-block-primary .fa, .modal-block-primary .far,.modal-block-primary .fas {color: #CCC;} .modal-block-success .fa, .modal-block-success .far, .modal-block-success .fas {color: #47a447;} .modal-block-warning .fa, .modal-block-warning .far, .modal-block-warning .fas {color: #ed9c28;} .modal-block-danger .fa, .modal-block-danger .far, .modal-block-danger .fas {color: #d2322d;} .modal-block-info .fa, .modal-block-info .far, .modal-block-info .fas {color: #5bc0de;} .modal-block-dark .fa, .modal-block-dark .far, .modal-block-dark .fas { color: #171717; } .label { border-radius: 4px; } .label-successfull { background: #47a447; color: #FFF;} .label-pending { background: #ed9c28; color: #FFF; } .label-fail, .label-failed, .label-error { background: #d2322d; color: #FFF; } .text-underline { text-decoration: underline; } .text-xs { font-size: 1.1rem !important; } .text-sm { font-size: 1.2rem !important; } .text-md { font-size: 1.3rem !important; } .text-lg { font-size: 1.5rem !important; } .text-xl { font-size: 2rem !important; } /* weights */ .text-weight-light { font-weight: 300 !important; } .text-weight-normal { font-weight: 400 !important; } .text-weight-semibold { font-weight: 600 !important; } .text-weight-bold { font-weight: 700 !important; } .simple-card-list li.primary { background: #0088cc; color: #FFF; } .simple-card-list li.default { background: #ebebeb; color: #777; } ul.simple-card-list-small li { padding: 6px 8px; } ul.simple-card-list-small li h3 { font-size: 19px; font-weight: 400; } ul.simple-card-list-small li p { font-size: 12px; line-height: 14px; padding-bottom: 3px; } .highlight { font-family: Consolas, Monaco, Courier New, Courier, monospace; /* border-radius: 5px; */ box-shadow: inset 0px 2px 4px 0px rgba(0, 0, 0, 0.2), inset 2px 0px 4px 0px rgba(0, 0, 0, 0.2); } .highlight.highlight-xs { font-size: 10px; padding: 1px 5px; box-shadow: inset 0px 1px 2px 0px rgba(0, 0, 0, 0.2), inset 1px 0px 2px 0px rgba(0, 0, 0, 0.2); } .highlight.highlight-sm { font-size: 12px; padding: 1px 6px; } .highlight.highlight-lg { font-size: 13px; padding: 5px 10px; line-height: 13px; display: inline-block; } .highlight.highlight-xl, .highlight.highlight-xlg { font-size: 14px; padding: 15px 15px; line-height: 14px; display: inline-block; } .highlight.bg-default { background-color: #ebebeb; color: #777; } .highlight.bg-primary { background-color: #CCC; color: #FFF; } .highlight.bg-secondary { background-color: #E36159; color: #FFF; } .highlight.bg-tertiary { background-color: #2BAAB1; color: #FFF; } .highlight.bg-quartenary { background-color: #734BA9; color: #FFF; } .highlight.bg-success { background-color: #47a447; color: #FFF; } .highlight.bg-warning { background-color: #ed9c28; color: #FFF; } .highlight.bg-danger { background-color: #d2322d; color: #FFF; } .highlight.bg-info { background-color: #5bc0de; color: #FFF; } .highlight.bg-dark { background-color: #171717; color: #FFF; } .fa-beat { animation: fa-beat 5s ease infinite; } @keyframes fa-beat { 0% { transform: scale(1); } 5% { transform: scale(1.25); } 20% { transform: scale(1); } 30% { transform: scale(1); } 35% { transform: scale(1.25); } 50% { transform: scale(1); } 55% { transform: scale(1.25); } 70% { transform: scale(1); } } /* | ====================================================================== | Footer | ====================================================================== */ .inner-wrapper:after { content: ""; display: block; } .footer { padding: 5px 0; background: #F6F6F6; font-size: 12px; color: #C1C1C1; } .footer a { color: #C1C1C1; } .footer .logibase { color: #DF0363; } .footer .logibase:hover { color: #DF0363; } /* | ====================================================================== | Shortcuts | ====================================================================== */ .lf-clear-both { clear: both!important; } .lf-display-none { display: none; } .lf-display-inline { display: inline!important; } .lf-display-block { display: block!important; } .lf-no-wrap { white-space:nowrap!important; } .lf-wrap { white-space:normal!important; } /* | ====================================================================== | Left Nav | ====================================================================== */ ul.nav-main li .nav-children .nav-children li a { padding: 6px 15px 6px 70px; } ul.nav-main li .nav-children .nav-children .nav-children li a { padding: 6px 15px 6px 85px; } ul.nav-main li .nav-children .nav-children .nav-children .nav-children li a { padding: 6px 15px 6px 100px; } ul.nav-main li .nav-children .nav-children .nav-children .nav-children .nav-children li a { padding: 6px 15px 6px 115px; } ul.nav-main li i { font-size: 1.7rem; } html.sidebar-left-collapsed .sidebar-toggle i.fa-thumbtack { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); } html.sidebar-light:not(.dark) .sidebar-left .sidebar-header .sidebar-toggle i { color: #bbb; } ul.nav-main > li.nav-expanded > ul.nav-children > li.nav-expanded > a, ul.nav-main > li.nav-expanded > ul.nav-children > li.nav-expanded > ul.nav-children > li.nav-expanded > a { background: #f1f1f1; } /* | ====================================================================== | Panels | ====================================================================== */ .panel-actions-lb { right: 15px; position: absolute; top: 10px; } .panel-action-toggle:before { content: "\f070"; font-weight: 400; } .panel-collapsed .panel-action-toggle:before { content: "\f06e"; font-weight: 400; } .panel-heading { padding: 5px 15px; background: #F8F8F9; border-top: 0 solid #DADADA; border-bottom: 1px solid #ECECEC; } .panel-transparent .panel-heading { padding: 0 15px 0 15px; margin-bottom: 15px; border-bottom: 1px dotted #b9b9b9!important; } .panel-body { -webkit-box-shadow: none; box-shadow: none; border-top: 0 solid #DADADA; background-color: #FFF; } .panel-heading + .panel-body { border-top: none; } .panel-footer { background-color: #F8F8F9; border-top: 1px solid #ECECEC; padding: 12px 15px; -webkit-box-shadow: none; box-shadow: none; } .panel-title { color: #33353F; font-size: 22px; font-weight: 300; line-height: 30px; padding: 0; text-transform: none; letter-spacing: .001em; } .panel-subtitle { color: #808697; font-size: 12px; line-height: 1.2em; margin: 5px 0; padding: 0; } .table-container-scroll-x { overflow-x: auto; } .panel-fullscreen { display: block; z-index: 9999; position: fixed; width: 100%; height: 100%; top: 0; right: 0; left: 0; bottom: 0; overflow: auto; } /* | ====================================================================== | Messages | ====================================================================== */ .ui-pnotify { z-index: 10003!important; } .ui-pnotify .notification .ui-pnotify-text { font-size: 13px; color: rgba(255, 255, 255, 1)!important; } .ui-pnotify .notification .ui-pnotify-text a { font-size: 13px; color: rgba(255, 255, 255, 1)!important; font-weight: 600; text-decoration: underline; } .ui-pnotify.ui-pnotify-icon-small .notification .ui-pnotify-icon > span { border: 0; font-size: 30px; height: 30px; line-height: 31px!important; width: 30px; } .ui-pnotify.ui-pnotify-icon-small .notification .ui-pnotify-icon { width: 55px; } .ui-pnotify.ui-pnotify-icon-small .notification { padding-left: 55px; } .ui-pnotify.stack-bar-bottom { bottom: 0; left: 0; margin: 0 auto; right: 0; top: auto; } .ui-pnotify.stack-bar-top { margin: 0 auto; left: 0; } .ui-pnotify.click-2-close { cursor: pointer !important; } .ui-pnotify-closer, .ui-pnotify-sticker { margin-left: .2em; margin-top: -8px; height: 15px; } .ui-pnotify-closer, .ui-pnotify-sticker span { font-size: 18px; } .ui-pnotify.click-2-close .ui-pnotify-closer { display: block !important; font-size: 18px; visibility: visible !important; } .ui-pnotify .notification-validation { background: rgba(134, 78, 152, 0.95); color: rgba(255, 255, 255, 0.7); } .ui-pnotify .notification-validation .ui-pnotify-icon > span { border-color: rgba(255, 255, 255, 0.7); } .ui-pnotify.stack-bar-top .notification-validation, .ui-pnotify.stack-bar-bottom .notification-validation { background: #864E98; } .ui-pnotify.notification-validation .notification, .ui-pnotify.notification-validation .notification-validation { background: rgba(134, 78, 152, 0.95); color: rgba(255, 255, 255, 0.7); } .ui-pnotify.notification-validation .notification .ui-pnotify-icon > span, .ui-pnotify.notification-validation .notification-validation .ui-pnotify-icon > span { border-color: rgba(255, 255, 255, 0.7); } .ui-pnotify.notification-validation.stack-bar-top .notification, .ui-pnotify.notification-validation.stack-bar-top .notification-validation, .ui-pnotify.notification-validation.stack-bar-bottom .notification, .ui-pnotify.notification-validation.stack-bar-bottom .notification-validation { background: #864E98; } /* | ====================================================================== | Noti Banner | ====================================================================== */ .noti-banner { position: relative; } .noti-banner code { background-color: transparent; } .noti-banner .nb-content { padding:25px; border: 0; /*border: 1px solid transparent;*/ display: block; text-align: center; color: #333; line-height: 24px; /*border-radius: 4px; */ } .noti-banner .nb-content .nb-heading { margin: 8px 0; font-weight: 300; } .noti-banner .nb-content .nb-icon { width: 40px; height: 40px; background-size: contain; margin: auto; display: block; background-repeat: no-repeat; } .noti-banner.success { background-color: #f2f9f3; } .noti-banner.success .nb-content { border-color: #008312; } .noti-banner.success .nb-heading { color: #008312; } .noti-banner.info { background-color: #f2fbfe; } .noti-banner.info .nb-content { border-color: #0076b6; } .noti-banner.info .nb-heading { color: #0076b6; } .noti-banner.validation { background-color: #faf1ff; } .noti-banner.validation .nb-content { border-color: #7408ab; } .noti-banner.validation .nb-heading { color: #7408ab; } .noti-banner.error { background-color: #fcf5f5; } .noti-banner.error .nb-content { border-color: #c33; } .noti-banner.error .nb-heading { color: #c33; } .noti-banner.warning { background-color: #fffcf3; } .noti-banner.warning .nb-content { border-color: #ffbe10; } .noti-banner.warning .nb-heading { color: #ffbe10; } .noti-banner.success .nb-content .nb-icon { background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB3aWR0aD0iNDhweCIgaGVpZ2h0PSI0OHB4IiB2aWV3Qm94PSIwIDAgNDggNDgiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+CiAgICA8IS0tIEdlbmVyYXRvcjogU2tldGNoIDUxLjMgKDU3NTQ0KSAtIGh0dHA6Ly93d3cuYm9oZW1pYW5jb2RpbmcuY29tL3NrZXRjaCAtLT4KICAgIDx0aXRsZT5JY29ucy8g4q2Q77iPUG9wdWxhci90aWNrPC90aXRsZT4KICAgIDxkZXNjPkNyZWF0ZWQgd2l0aCBTa2V0Y2guPC9kZXNjPgogICAgPGRlZnM+PC9kZWZzPgogICAgPGcgaWQ9IlN5bWJvbHMiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxnIGlkPSJOYXZpZ2F0aW9uLS8tc3RlcC1pbmRpY2F0b3ItLy1kZXNrdG9wIj4KICAgICAgICAgICAgPGcgaWQ9Ikljb25zLy3irZDvuI9Qb3B1bGFyL3RpY2siPgogICAgICAgICAgICAgICAgPGcgaWQ9ImNoZWNrYm94Ij4KICAgICAgICAgICAgICAgICAgICA8cmVjdCBpZD0iUEgiIGZpbGwtcnVsZT0ibm9uemVybyIgeD0iMCIgeT0iMCIgd2lkdGg9IjQ4IiBoZWlnaHQ9IjQ4Ij48L3JlY3Q+CiAgICAgICAgICAgICAgICAgICAgPGcgaWQ9Imljb24iIHN0cm9rZT0iIzAwODMxMiI+CiAgICAgICAgICAgICAgICAgICAgICAgIDxwYXRoIGQ9Ik0yNCw0Ny40NTQ1NDU1IEMzNi45NTM1ODc4LDQ3LjQ1NDU0NTUgNDcuNDU0NTQ1NSwzNi45NTM1ODc4IDQ3LjQ1NDU0NTUsMjQgQzQ3LjQ1NDU0NTUsMTEuMDQ2NDEyMiAzNi45NTM1ODc4LDAuNTQ1NDU0NTQ1IDI0LDAuNTQ1NDU0NTQ1IEMxMS4wNDY0MTIyLDAuNTQ1NDU0NTQ1IDAuNTQ1NDU0NTQ1LDExLjA0NjQxMjIgMC41NDU0NTQ1NDUsMjQgQzAuNTQ1NDU0NTQ1LDM2Ljk1MzU4NzggMTEuMDQ2NDEyMiw0Ny40NTQ1NDU1IDI0LDQ3LjQ1NDU0NTUgWiIgaWQ9Ik92YWwiIHN0cm9rZS13aWR0aD0iMS4wOTA5MDkwOSI+PC9wYXRoPgogICAgICAgICAgICAgICAgICAgICAgICA8cGF0aCBkPSJNMjEuNDAwMTkwOCwzMC45MTU2Mzk5IEwxNC4zMzAyNDExLDI1LjI1OTI5ODQgQzE0LjAwMjg0OTEsMjQuOTkzOTQ4NiAxMy41MjE3ODMzLDI1LjA1MDI2MzggMTMuMjU2NDMzNSwyNS4zNzg2MTAzIEMxMi45OTU4NTYxLDI1LjcwNjk1NjkgMTMuMDQ4MzUzNCwyNi4xODcwNjgyIDEzLjM3NTc0NTQsMjYuNDUyNDE4IEwyMS4wMTE3MTEsMzIuNTU5MjgxNSBDMjEuMTUzOTMwOSwzMi42NzA5NTc1IDIxLjMyMTkyMjEsMzIuNzI3MjcyNyAyMS40ODg5NTg5LDMyLjcyNzI3MjcgQzIxLjcwMTgxMTQsMzIuNzI3MjcyNyAyMS45MTA4NDYsMzIuNjQxMzY4MSAyMi4wNjM1NjUzLDMyLjQ2OTU1ODkgTDM0LjI3ODI0NjcsMTguNzI2NzI5OCBDMzQuNTYxNzMyLDE4LjQwOTgzNzIgMzQuNTMxMTg4MSwxNy45Mjg3NzE0IDM0LjIxNDI5NTUsMTcuNjQ5MTA0MiBDMzMuOTAxMjIwOSwxNy4zNjU2MTg5IDMzLjQxNzI5MTYsMTcuMzk2MTYyOCAzMy4xMzc2MjQ0LDE3LjcxMzA1NTQgTDIxLjQwMDE5MDgsMzAuOTE1NjM5OSBaIiBpZD0iRmlsbC0yIiBzdHJva2Utd2lkdGg9IjAuMjUiIGZpbGw9IiMwMDgzMTIiPjwvcGF0aD4KICAgICAgICAgICAgICAgICAgICA8L2c+CiAgICAgICAgICAgICAgICA8L2c+CiAgICAgICAgICAgIDwvZz4KICAgICAgICA8L2c+CiAgICA8L2c+Cjwvc3ZnPg==); } .noti-banner.warning .nb-content .nb-icon { background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+Cjxzdmcgd2lkdGg9IjM0cHgiIGhlaWdodD0iMzNweCIgdmlld0JveD0iMCAwIDM0IDMzIiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPgogICAgPCEtLSBHZW5lcmF0b3I6IFNrZXRjaCA0OS4yICg1MTE2MCkgLSBodHRwOi8vd3d3LmJvaGVtaWFuY29kaW5nLmNvbS9za2V0Y2ggLS0+CiAgICA8dGl0bGU+YWxlcnRfd2FybmluZ19pY29uPC90aXRsZT4KICAgIDxkZXNjPkNyZWF0ZWQgd2l0aCBTa2V0Y2guPC9kZXNjPgogICAgPGRlZnM+PC9kZWZzPgogICAgPGcgaWQ9IjEtQ29tcG9uZW50cyIgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+CiAgICAgICAgPGcgaWQ9IkFsZXJ0cyIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTI5NS4wMDAwMDAsIC04MjcuMDAwMDAwKSI+CiAgICAgICAgICAgIDxnIGlkPSJJY29uLS8tZ2VuZXJhbC0vLUljb24td2FybmluZy10cmlhbmdsZSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjk2LjAwMDAwMCwgODI4LjAwMDAwMCkiPgogICAgICAgICAgICAgICAgPHBhdGggZD0iTTE0Ljk1OTgxMSwwLjc3NzgzODQyMSBMMC4zMzQwNTIwNDEsMjkuMzI4OTgwNSBDLTAuMzE3MTM3MjgxLDMwLjYwMDE3NiAwLjIzMDg2NTU4MiwzMS41IDEuNjUxNjY3NTIsMzEuNSBMMzAuMzQ4MDMyNCwzMS41IEMzMS43NzI1NzU2LDMxLjUgMzIuMzE3MjY5NSwzMC42MDEwMiAzMS42NjU2NDc4LDI5LjMyODk4MDUgTDE3LjAzOTg4ODksMC43Nzc4Mzg0MjEgQzE2LjQwNDM5MTQsLTAuNDYyNzI0NzE3IDE1LjU5NDk0ODcsLTAuNDYyMDIyNDY4IDE0Ljk1OTgxMSwwLjc3NzgzODQyMSBaIiBpZD0iUmVjdGFuZ2xlIiBzdHJva2U9IiNGRkJFMTAiPjwvcGF0aD4KICAgICAgICAgICAgICAgIDxnIGlkPSJHcm91cC0yIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDE0LjY2NjY2NywgMTAuNjY2NjY3KSIgZmlsbD0iI0ZGQkUxMCI+CiAgICAgICAgICAgICAgICAgICAgPHJlY3QgaWQ9IlJlY3RhbmdsZSIgeD0iMC42NjY2NjY2NjciIHk9IjAiIHdpZHRoPSIxLjMzMzMzMzMzIiBoZWlnaHQ9IjEwLjY2NjY2NjciIHJ4PSIwLjY2NjY2NjY2NyI+PC9yZWN0PgogICAgICAgICAgICAgICAgICAgIDxjaXJjbGUgaWQ9Ik92YWwtMTYiIGN4PSIxLjMzMzMzMzMzIiBjeT0iMTQuNjY2NjY2NyIgcj0iMS4zMzMzMzMzMyI+PC9jaXJjbGU+CiAgICAgICAgICAgICAgICA8L2c+CiAgICAgICAgICAgIDwvZz4KICAgICAgICA8L2c+CiAgICA8L2c+Cjwvc3ZnPg==); } .noti-banner.info .nb-content .nb-icon { background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB3aWR0aD0iMjRweCIgaGVpZ2h0PSIyNHB4IiB2aWV3Qm94PSIwIDAgMjQgMjQiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+CiAgICA8IS0tIEdlbmVyYXRvcjogU2tldGNoIDUxLjMgKDU3NTQ0KSAtIGh0dHA6Ly93d3cuYm9oZW1pYW5jb2RpbmcuY29tL3NrZXRjaCAtLT4KICAgIDx0aXRsZT5JbmZvIGljb248L3RpdGxlPgogICAgPGRlc2M+Q3JlYXRlZCB3aXRoIFNrZXRjaC48L2Rlc2M+CiAgICA8ZGVmcz48L2RlZnM+CiAgICA8ZyBpZD0iU3ltYm9scyIgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+CiAgICAgICAgPGcgaWQ9IkFsZXJ0LS8tZGVza3RvcC0vLWluZm8tLy1iaWctLy1pY29uLSstYnV0dG9uIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMjAuMDAwMDAwLCAtMzAuMDAwMDAwKSI+CiAgICAgICAgICAgIDxnIGlkPSJJbmZvLWljb24iIHRyYW5zZm9ybT0idHJhbnNsYXRlKDIwLjAwMDAwMCwgMzAuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICA8cmVjdCBpZD0iUEgiIGZpbGwtcnVsZT0ibm9uemVybyIgeD0iMCIgeT0iMCIgd2lkdGg9IjI0IiBoZWlnaHQ9IjI0Ij48L3JlY3Q+CiAgICAgICAgICAgICAgICA8cGF0aCBkPSJNMTIsMjMgQzE4LjA3NTEzMjIsMjMgMjMsMTguMDc1MTMyMiAyMywxMiBDMjMsNS45MjQ4Njc3NSAxOC4wNzUxMzIyLDEgMTIsMSBDNS45MjQ4Njc3NSwxIDEsNS45MjQ4Njc3NSAxLDEyIEMxLDE4LjA3NTEzMjIgNS45MjQ4Njc3NSwyMyAxMiwyMyBaIE0xMiwyNCBDNS4zNzI1ODMsMjQgMCwxOC42Mjc0MTcgMCwxMiBDMCw1LjM3MjU4MyA1LjM3MjU4MywwIDEyLDAgQzE4LjYyNzQxNywwIDI0LDUuMzcyNTgzIDI0LDEyIEMyNCwxOC42Mjc0MTcgMTguNjI3NDE3LDI0IDEyLDI0IFoiIGlkPSJPdmFsLTExIiBmaWxsPSIjMDA3NkI2IiBmaWxsLXJ1bGU9Im5vbnplcm8iPjwvcGF0aD4KICAgICAgICAgICAgICAgIDxyZWN0IGlkPSJSZWN0YW5nbGUiIGZpbGw9IiMwMDc2QjYiIHg9IjExLjUiIHk9IjEwIiB3aWR0aD0iMSIgaGVpZ2h0PSI4IiByeD0iMC41Ij48L3JlY3Q+CiAgICAgICAgICAgICAgICA8Y2lyY2xlIGlkPSJPdmFsLTE2IiBmaWxsPSIjMDA3NkI2IiBjeD0iMTIiIGN5PSI3IiByPSIxIj48L2NpcmNsZT4KICAgICAgICAgICAgPC9nPgogICAgICAgIDwvZz4KICAgIDwvZz4KPC9zdmc+); } .noti-banner.validation .nb-content .nb-icon { background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAyNC4xLjEsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iTGF5ZXJfMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4IiB5PSIwcHgiDQoJIHZpZXdCb3g9IjAgMCAyNCAyNCIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgMjQgMjQ7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+DQoJLnN0MHtmaWxsOm5vbmU7fQ0KCS5zdDF7ZmlsbDojNzQwOEFCO30NCgkuc3Qye2ZpbGwtcnVsZTpldmVub2RkO2NsaXAtcnVsZTpldmVub2RkO2ZpbGw6Izc0MDhBQjt9DQo8L3N0eWxlPg0KPGRlc2M+Q3JlYXRlZCB3aXRoIFNrZXRjaC48L2Rlc2M+DQo8ZyBpZD0iU3ltYm9scyI+DQoJPGcgaWQ9IkFsZXJ0LV94MkZfLWRlc2t0b3AtX3gyRl8taW5mby1feDJGXy1iaWctX3gyRl8taWNvbi1feDJCXy1idXR0b24iIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMC4wMDAwMDAsIC0zMC4wMDAwMDApIj4NCgkJPGcgaWQ9IkluZm8taWNvbiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjAuMDAwMDAwLCAzMC4wMDAwMDApIj4NCgkJCTxyZWN0IGlkPSJQSCIgeT0iMCIgY2xhc3M9InN0MCIgd2lkdGg9IjI0IiBoZWlnaHQ9IjI0Ii8+DQoJCQk8cGF0aCBpZD0iT3ZhbC0xMSIgY2xhc3M9InN0MSIgZD0iTTEyLDIzYzYuMSwwLDExLTQuOSwxMS0xMVMxOC4xLDEsMTIsMVMxLDUuOSwxLDEyUzUuOSwyMywxMiwyM3ogTTEyLDI0QzUuNCwyNCwwLDE4LjYsMCwxMg0KCQkJCVM1LjQsMCwxMiwwczEyLDUuNCwxMiwxMlMxOC42LDI0LDEyLDI0eiIvPg0KCQkJPHBhdGggaWQ9IlJlY3RhbmdsZSIgY2xhc3M9InN0MiIgZD0iTTEyLDEwTDEyLDEwYzAuMywwLDAuNSwwLjIsMC41LDAuNXY3YzAsMC4zLTAuMiwwLjUtMC41LDAuNWwwLDBjLTAuMywwLTAuNS0wLjItMC41LTAuNXYtNw0KCQkJCUMxMS41LDEwLjIsMTEuNywxMCwxMiwxMHoiLz4NCgkJCTxjaXJjbGUgaWQ9Ik92YWwtMTYiIGNsYXNzPSJzdDIiIGN4PSIxMiIgY3k9IjciIHI9IjEiLz4NCgkJPC9nPg0KCTwvZz4NCjwvZz4NCjwvc3ZnPg0K); } .noti-banner.error .nb-content .nb-icon { background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+Cjxzdmcgd2lkdGg9IjMycHgiIGhlaWdodD0iMzJweCIgdmlld0JveD0iMCAwIDMyIDMyIiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPgogICAgPCEtLSBHZW5lcmF0b3I6IFNrZXRjaCA0OS4yICg1MTE2MCkgLSBodHRwOi8vd3d3LmJvaGVtaWFuY29kaW5nLmNvbS9za2V0Y2ggLS0+CiAgICA8dGl0bGU+YWxlcnRfZXJyb3JfaWNvbjwvdGl0bGU+CiAgICA8ZGVzYz5DcmVhdGVkIHdpdGggU2tldGNoLjwvZGVzYz4KICAgIDxkZWZzPjwvZGVmcz4KICAgIDxnIGlkPSIxLUNvbXBvbmVudHMiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxnIGlkPSJBbGVydHMiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yOTYuMDAwMDAwLCAtNTkyLjAwMDAwMCkiPgogICAgICAgICAgICA8ZyBpZD0iZXJyb3IiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDI2Ni4wMDAwMDAsIDU1Mi4wMDAwMDApIj4KICAgICAgICAgICAgICAgIDxnIGlkPSJ2YWxpZGF0aW9uIj4KICAgICAgICAgICAgICAgICAgICA8ZyBpZD0icG9wdXAiPgogICAgICAgICAgICAgICAgICAgICAgICA8ZyBpZD0iSWNvbi0vLWdlbmVyYWwtLy1JY29uLXdhcm5pbmctY2lyY2xlIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgzMC4wMDAwMDAsIDQwLjAwMDAwMCkiPgogICAgICAgICAgICAgICAgICAgICAgICAgICAgPGcgaWQ9IkluZm8iPgogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIDxjaXJjbGUgaWQ9Ik92YWwtMTEiIHN0cm9rZT0iI0NDMzMzMyIgY3g9IjE2IiBjeT0iMTYiIHI9IjE1LjUiPjwvY2lyY2xlPgogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIDxnIGlkPSJHcm91cC0yIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxNC42NjY2NjcsIDguMDAwMDAwKSIgZmlsbD0iI0NDMzMzMyI+CiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIDxyZWN0IGlkPSJSZWN0YW5nbGUiIHg9IjAuNjY2NjY2NjY3IiB5PSIwIiB3aWR0aD0iMS4zMzMzMzMzMyIgaGVpZ2h0PSIxMC42NjY2NjY3IiByeD0iMC42NjY2NjY2NjciPjwvcmVjdD4KICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgPGNpcmNsZSBpZD0iT3ZhbC0xNiIgY3g9IjEuMzMzMzMzMzMiIGN5PSIxNC42NjY2NjY3IiByPSIxLjMzMzMzMzMzIj48L2NpcmNsZT4KICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICA8L2c+CiAgICAgICAgICAgICAgICAgICAgICAgICAgICA8L2c+CiAgICAgICAgICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgICAgICAgICA8L2c+CiAgICAgICAgICAgICAgICA8L2c+CiAgICAgICAgICAgIDwvZz4KICAgICAgICA8L2c+CiAgICA8L2c+Cjwvc3ZnPg==); } /* | ====================================================================== | Daterangepicker | ====================================================================== */ .daterangepicker { z-index: 10013; } .daterangepicker select.hourselect, .daterangepicker select.minuteselect, .daterangepicker select.secondselect, .daterangepicker select.ampmselect { padding: 3px; height: auto; font-size: 14px; } .daterangepicker select.monthselect, .daterangepicker select.yearselect { padding: 3px; font-weight: 400; font-size: 14px; } .daterangepicker select.monthselect option:disabled, .daterangepicker select.yearselect option:disabled { color:#ccc; cursor: not-allowed; } .daterangepicker select.monthselect { width: 50%; } .daterangepicker select.yearselect { width: 45%; } /* | ====================================================================== | Wizards | ====================================================================== */ html .wizard-progress.wizard-progress-lg { margin: 0; width: 100%; padding: 20px 30px 0 30px; background: #F8F8F9; } html .wizard-progress.wizard-progress-lg ul li a { padding-top: 40px; font-size: 14px; font-weight: 400; line-height: 18px; } .form-wizard .tab-content { padding: 15px 0 5px 0; } /* | ====================================================================== | Tables | ====================================================================== */ .table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td { padding: 8px 10px; vertical-align: middle; } .table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th { font-weight: 600; background: #FFF; } .table.table-condensed > thead > tr > th, .table.table-condensed > tbody > tr > th, .table.table-condensed > tfoot > tr > th, .table.table-condensed > thead > tr > td, .table.table-condensed > tbody > tr > td, .table.table-condensed > tfoot > tr > td { padding: 5px 8px; vertical-align: middle; } .table.table-no-wrap > thead > tr > th, .table.table-no-wrap > tbody > tr > th, .table.table-no-wrap > tfoot > tr > th, .table.table-no-wrap > thead > tr > td, .table.table-no-wrap > tbody > tr > td, .table.table-no-wrap > tfoot > tr > td { white-space: nowrap; } .table.table-font-lg > thead > tr > th, .table.table-font-lg > tbody > tr > th, .table.table-font-lg > tfoot > tr > th, .table.table-font-lg > thead > tr > td, .table.table-font-lg > tbody > tr > td, .table.table-font-lg > tfoot > tr > td { font-size: 15px; } .table.table-font-sm > thead > tr > th, .table.table-font-sm > tbody > tr > th, .table.table-font-sm > tfoot > tr > th, .table.table-font-sm > thead > tr > td, .table.table-font-sm > tbody > tr > td, .table.table-font-sm > tfoot > tr > td { font-size: 12px; } .table.table-font-xs > thead > tr > th, .table.table-font-xs > tbody > tr > th, .table.table-font-xs > tfoot > tr > th, .table.table-font-xs > thead > tr > td, .table.table-font-xs > tbody > tr > td, .table.table-font-xs > tfoot > tr > td { font-size: 11px; } .table.table-no-border > tbody > tr, .table.table-no-border > tbody > tr > td { border:0; } table.dataTable tr.child { text-align: left; } table.dataTable > tbody > tr.child, table.dataTable > tbody > tr.child:hover { background-color: #f1f1f1!important; } table.dataTable > tbody > tr.child > td { } table.dataTable th, table.dataTable td { white-space: nowrap; } table.dataTable th { font-weight: 600; background: #FFF; } table.dataTable th.never, table.dataTable td.never { display: none; } table.dataTable tr.not_active td { color: #999999; text-decoration: line-through; } table.dataTable tr.not_active td.actions { text-decoration: none; } table.dataTable tr.not_active td.select { text-decoration: none; } table.dataTable td button, table.dataTable td a.btn { white-space: nowrap; } table.dataTable td.child tr td { border-bottom: 1px solid #dedede; padding: 4px 5px; white-space: normal; } table.dataTable td.child tr td:first-child { font-weight: 600; } table.dataTable td.child tr td:last-child { padding-left: 10px; } table.dataTable td.child tr.not_active td:first-child { color: #333333; text-decoration: none; } table.dataTable tr.filter th, table.dataTable tr.filters th { padding-right: 8px!important; } table.dataTable tr.filter th input, table.dataTable tr.filters th input { width:100%; } table.dataTable tr.quickcopy th { padding-right: 8px!important; } table.dataTable tr.quickcopy th input { width:100%; } table.dataTable.dtr-column>tbody>tr>td.control:before, table.dataTable.dtr-column>tbody>tr>th.control:before { font-weight: 600; } table.dataTable thead > tr > th.sorting_disabled { padding-right: 8px!important; } table.dataTable.dtr-column > tbody > tr > td.control, table.dataTable.dtr-column > tbody > tr > th.control { width: 35px; padding: 0 18px; } table.dataTable tr.dtrg-group.dtrg-start { background-color:#eaeaea !important; } table.dataTable tr.dtrg-group.dtrg-start td { font-weight: 400; } table.dataTable tr.dtrg-group.dtrg-start td:hover { cursor: pointer; } table.table thead tr th.table-group-heading { background-color: #f1f1f1; text-align: center; color: #999; } table.table thead .sorting, table.table thead .sorting_asc, table.table thead .sorting_desc, table.table thead .sorting_asc_disabled, table.table thead .sorting_desc_disabled { background: #FFF; position: relative; } table.table thead .sorting:after, table.table thead .sorting_asc:after, table.table thead .sorting_desc:after, table.table thead .sorting_asc_disabled:after, table.table thead .sorting_desc_disabled:after { position: absolute; bottom: 8px; right: 8px; display: block; font-family: "Font Awesome 5 Free"; font-weight: 900; opacity: 1; } table.table thead .sorting:after { opacity: 0.2; content: "\f0dc" } table.table thead .sorting_asc:after { content: "\f0de" } table.table thead .sorting_desc:after { content: "\f0dd" } .table-striped > tbody > tr:nth-of-type(even) { background-color: #FFF; } .dataTables_wrapper .dataTables_length .select2-container { width: 68px!important; margin-right: 5px; } .dataTables_length .select2-container--bootstrap .select2-selection--single { height: 25px !important; padding: 0 10px 0 6px; font-size: 12px; line-height: 24px; } div.dataTables_wrapper div.dataTables_info { font-size: 1.2rem; color: #999; } div.dataTables_wrapper div.dataTables_length label { font-size: 1.2rem; color: #999; } div.dataTables_wrapper div.dataTables_paginate ul.pagination { margin: 8px 0 0 0; } .dataTables_paginate > .pagination > .disabled > span, .dataTables_paginate > .pagination > .disabled > span:hover, .dataTables_paginate > .pagination > .disabled > span:focus, .dataTables_paginate > .pagination > .disabled > a, .dataTables_paginate > .pagination > .disabled > a:hover, .dataTables_paginate > .pagination > .disabled > a:focus { color: #ccc; } .dataTables_paginate > .pagination > li > a, .dataTables_paginate > .pagination > li > span { padding: 2px 12px; } div.dataTables_wrapper { width: 100%; margin: 0 auto; } div.dataTables_processing {color: #666; background: rgba(250,250,250,0.7); z-index: 9999; font-size: 16px; border-radius: 0;box-shadow: none;position:absolute;bottom:0;left:0;width:100%;margin-left:0;margin-top:-3px;text-align:center;padding:15px 0 0 0;} .dataTables_wrapper .dataTables_filter { text-align: right; } .dataTables_wrapper .dataTables_filter .select2-container { text-align: left; } .dataTables_wrapper div.text-left .dataTables_filter { text-align: left!important; } .dataTables_wrapper div.text-right .dataTables_filter .select2-container { text-align: right!important; } table.dataTable.dtr-column>tbody>tr>td.control:before, table.dataTable.dtr-column>tbody>tr>th.control:before{ top:50%; left:0; height:22px; width:80%; margin-top:-11px; margin-left:10%; display:block; position:absolute; color:white; border:none; border-radius:0; box-shadow:none; box-sizing:content-box; text-align:center; text-indent:0 !important; font-family: "Font Awesome 5 Free"; font-size: 20px; line-height:22px; content:'\f150'; background-color:transparent; color: #999; font-weight: 400; } table.dataTable.dtr-column>tbody>tr.parent td.control:before, table.dataTable.dtr-column>tbody>tr.parent th.control:before { background-color:transparent; content: '\f151'; font-weight: 900; } td.cellEditable { cursor: pointer; position: relative; } td.cellEditable:hover { background-color: lightyellow!important; } td.cellEditable::before { position: absolute; top:2px; right:2px; color: #ececa7; font-style: normal; font-variant: normal; text-rendering: auto; -webkit-font-smoothing: antialiased; font-family: "Font Awesome 5 Free"; font-weight: 400; content: "\f044"; } .table-filters .form-group:last-child, .table-filters .form-group:last-of-type { margin-bottom: 0; } .table-filters .form-group .control-label { margin-bottom: 0; } .table-filters .form-group input { height: 30px; padding: 3px 8px; font-size: 13px; line-height: 1.5; } @media only screen and (max-width: 991px) { .table.table-no-more.table-bordered > tbody > tr > td { min-height: 29px; } } .table > tbody > tr.line-through td { text-decoration: line-through!important; } .table > tbody > tr.not_active td { color: #999999!important; text-decoration: line-through!important; } .table > thead > tr > td.danger-light, .table > tbody > tr > td.danger-light, .table > tfoot > tr > td.danger-light, .table > thead > tr > th.danger-light, .table > tbody > tr > th.danger-light, .table > tfoot > tr > th.danger-light, .table > thead > tr.danger-light > td, .table > tbody > tr.danger-light > td, .table > tfoot > tr.danger-light > td, .table > thead > tr.danger-light > th, .table > tbody > tr.danger-light > th, .table > tfoot > tr.danger-light > th { color: #000; background-color: #f2dede !important; } .table > thead > tr > td.warning-light, .table > tbody > tr > td.warning-light, .table > tfoot > tr > td.warning-light, .table > thead > tr > th.warning-light, .table > tbody > tr > th.warning-light, .table > tfoot > tr > th.warning-light, .table > thead > tr.warning-light > td, .table > tbody > tr.warning-light > td, .table > tfoot > tr.warning-light > td, .table > thead > tr.warning-light > th, .table > tbody > tr.warning-light > th, .table > tfoot > tr.warning-light > th { color: #000; background-color: #ffeacb !important; } .table > thead > tr > td.success-light, .table > tbody > tr > td.success-light, .table > tfoot > tr > td.success-light, .table > thead > tr > th.success-light, .table > tbody > tr > th.success-light, .table > tfoot > tr > th.success-light, .table > thead > tr.success-light > td, .table > tbody > tr.success-light > td, .table > tfoot > tr.success-light > td, .table > thead > tr.success-light > th, .table > tbody > tr.success-light > th, .table > tfoot > tr.success-light > th { color: #000; background-color: #d0f1d0 !important; } .table > thead > tr > td.info-light, .table > tbody > tr > td.info-light, .table > tfoot > tr > td.info-light, .table > thead > tr > th.info-light, .table > tbody > tr > th.info-light, .table > tfoot > tr > th.info-light, .table > thead > tr.info-light > td, .table > tbody > tr.info-light > td, .table > tfoot > tr.info-light > td, .table > thead > tr.info-light > th, .table > tbody > tr.info-light > th, .table > tfoot > tr.info-light > th { color: #000; background-color: #dff4ff !important; } .table > thead > tr > td.yellow-pastel, .table > tbody > tr > td.yellow-pastel, .table > tfoot > tr > td.yellow-pastel, .table > thead > tr > th.yellow-pastel, .table > tbody > tr > th.yellow-pastel, .table > tfoot > tr > th.yellow-pastel, .table > thead > tr.yellow-pastel > td, .table > tbody > tr.yellow-pastel > td, .table > tfoot > tr.yellow-pastel > td, .table > thead > tr.yellow-pastel > th, .table > tbody > tr.yellow-pastel > th, .table > tfoot > tr.yellow-pastel > th { color: #000; background-color: #fdfd96 !important; } .table > thead > tr > td.misc, .table > tbody > tr > td.misc, .table > tfoot > tr > td.misc, .table > thead > tr > th.misc, .table > tbody > tr > th.misc, .table > tfoot > tr > th.misc, .table > thead > tr.misc > td, .table > tbody > tr.misc > td, .table > tfoot > tr.misc > td, .table > thead > tr.misc > th, .table > tbody > tr.misc > th, .table > tfoot > tr.misc > th { color: #fff; background-color: #2baab1 !important; } .table > thead > tr > td.misc-light, .table > tbody > tr > td.misc-light, .table > tfoot > tr > td.misc-light, .table > thead > tr > th.misc-light, .table > tbody > tr > th.misc-light, .table > tfoot > tr > th.misc-light, .table > thead > tr.misc-light > td, .table > tbody > tr.misc-light > td, .table > tfoot > tr.misc-light > td, .table > thead > tr.misc-light > th, .table > tbody > tr.misc-light > th, .table > tfoot > tr.misc-light > th { color: #000; background-color: #c0ecef !important; } /* | ====================================================================== | Tables - Table Data History | ====================================================================== */ .table-data-history th, .table-data-history td { white-space: nowrap; } @media only screen and (max-width: 991px) { .table-data-history.table.table-no-more td { padding-left: 30%; } .table-data-history.table.table-no-more td:before { width: 25%; } } /* | ====================================================================== | Forms | ====================================================================== */ .lb-required { border-left: 3px solid #0088cc !important; } .help-block { line-height: 16px; } .help-block-validation { display: block; margin-top: 5px; margin-bottom: 10px; color: #737373; line-height: 16px; } .has-success .help-block-validation { color: #3c763d; } .has-warning .help-block-validation { color: #8a6d3b; } .has-error .help-block-validation { color: #a94442; } .form-horizontal .has-feedback span.form-control-feedback { left: -3px; width: 15px; } /* was right: -11px; */ .form-horizontal.left-feedback-icons .has-feedback span.form-control-feedback { left: -18px; } /* .form-horizontal .has-feedback div span.select2 + span.form-control-feedback { right: 62px; } .form-horizontal .has-feedback div span.select2 + span + span.form-control-feedback { right: 35px; } */ .toggle .form-group label.activate-file-input.btn-default { border-color: #CCCCCC; } .input-group-addon:last-child { border-left: 1px solid #ccc; } .input-group-addon-blank { padding: 0; border: 0; } .form-separator { font-size: 16px; padding-bottom: 15px; padding-bottom: 20px; } .input-group-xs>.form-control, .input-group-xs>.input-group-addon, .input-group-xs>.input-group-btn>.btn, .input-xs { height: 23px; padding: 1px 5px; font-size: 12px; line-height: 1.5; } .input-sm { font-size: 13px; } .input-group-sm > .form-control { padding: 5px 6px; } /* | ====================================================================== | BlockUI | ====================================================================== */ div.blockOverlay { z-index: 10002!important; background: #FFFFFF !important; } /* | ====================================================================== | Spinners | ====================================================================== */ @keyframes rotateRight{ 0%{ transform:rotate(0deg); transform-origin:50% 50%; } 100%{ transform:rotate(360deg); } } @-webkit-keyframes rotateRight{ 0%{ -webkit-transform:rotate(0deg); -webkit-transform-origin:50% 50%; } 100%{ -webkit-transform:rotate(360deg); } } @keyframes rotateLeft{ 0%{ transform:rotate(0deg); } 100%{ transform:rotate(-360deg); } } @-webkit-keyframes rotateLeft{ 0%{ -webkit-transform:rotate(0deg); } 100%{ -webkit-transform:rotate(-360deg); } } .spinner{ width:35px; height:35px; display: inline-block; border:5px solid #000; border-color:#000 #000 transparent transparent; opacity:0.4; border-radius:30px; animation:.8s rotateRight infinite linear; -webkit-animation:.8s rotateRight infinite linear; } .spinner::before{ content:''; display:block; width:16px; height:16px; margin:4px; border-radius:30px; border:5px solid #000; border-color:transparent transparent #000 #000; animation:.35s rotateLeft infinite linear; -webkit-animation:.35s rotateLeft infinite linear; } .spinner-message { padding: 10px 15px; background-color: #f1f1f1; border: 1px solid #f1f1f1; filter: drop-shadow(0 0 5px #ccc); } /* | ====================================================================== | Select2 Dropdowns | ====================================================================== */ .select2-dropdown { z-index: 10013; } .select2-search { z-index: 10013; } .select2-search input { z-index: 10013; } .select2-container--bootstrap .select2-results__option[aria-selected=true] { background-color: #619ED2; color: #FFFFFF; } .select2-container--bootstrap .select2-selection__clear { margin-right: 5px; } .input-group .select2-container--bootstrap { width: 100%/*!important;*/ } .select2-container--bootstrap .select2-selection.form-control { border-radius: 0; } /* to add readonly style functionality */ select[readonly].select2-hidden-accessible + .select2-container { pointer-events: none;touch-action: none;} select[readonly].select2-hidden-accessible + .select2-container .select2-selection {background: #eee;box-shadow: none;} select[readonly].select2-hidden-accessible + .select2-container .select2-selection__arrow, select[readonly].select2-hidden-accessible + .select2-container .select2-selection__clear {display: none;} .select2-container--bootstrap .select2-selection--multiple.input-sm, .input-group-sm .select2-container--bootstrap .select2-selection--multiple, .form-group-sm .select2-container--bootstrap .select2-selection--multiple { border-radius: 0; font-size: 13px; } .select2-container--bootstrap .select2-selection--single.input-sm, .input-group-sm .select2-container--bootstrap .select2-selection--single, .form-group-sm .select2-container--bootstrap .select2-selection--single { border-radius: 0; font-size: 13px; } .select2-container--bootstrap .select2-selection--multiple.input-xs, .input-group-xs .select2-container--bootstrap .select2-selection--multiple, .form-group-xs .select2-container--bootstrap .select2-selection--multiple, .select2-container--bootstrap .select2-selection--single.input-xs, .input-group-xs .select2-container--bootstrap .select2-selection--single, .form-group-xs .select2-container--bootstrap .select2-selection--single { border-radius: 0; font-size: 12px; height: 23px; padding: 2px 18px 0px 5px; } .select2-container--bootstrap .select2-selection--single.input-xs .select2-selection__arrow, .input-group-xs .select2-container--bootstrap .select2-selection--single .select2-selection__arrow, .form-group-xs .select2-container--bootstrap .select2-selection--single .select2-selection__arrow { position: absolute; bottom: 0; right: 0px; top: 0; width: 14px; } .select2-container--bootstrap .select2-selection--single.input-xs .select2-selection__arrow b, .input-group-xs .select2-container--bootstrap .select2-selection--single .select2-selection__arrow b, .form-group-xs .select2-container--bootstrap .select2-selection--single .select2-selection__arrow b { margin-left: 0px; } .select2-container--bootstrap .select2-selection--single.input-xs .select2-selection__clear, .input-group-xs .select2-container--bootstrap .select2-selection--single .select2-selection__clear, .form-group-xs .select2-container--bootstrap .select2-selection--single .select2-selection__clear { margin-right: 0px; } /* | ====================================================================== | List styling | ====================================================================== */ .agile-list { list-style: none; margin: 0; padding: 0; } .agile-list > li { background: #F6F6F6; /*border: 1px solid #e7eaec;*/ margin: 0 0 10px 0; padding: 10px; } .agile-list > li:hover { /*cursor: pointer;*/ /*background: #fff;*/ } .agile-list > li.warning-element { border-left: 3px solid #f8ac59; } .agile-list > li.danger-element { border-left: 3px solid #ed5565; } .agile-list > li.info-element { border-left: 3px solid #1c84c6; } .agile-list > li.success-element { border-left: 3px solid #1ab394; } .agile-list > li .agile-detail { margin-top: 5px; font-size: 12px; min-height: 22px; } h4.list-group-item-heading { } h5.list-group-item-heading { font-size: 14px; font-weight: 600; } ol.ol-sub-numbering > li > ol > li { list-style: lower-alpha; } /* | ====================================================================== | Accordian toggles | ====================================================================== */ .lf-acordian-toggle, .lf-acordian-toggle > section.toggle { height: auto !important; overflow: visible !important; } .toggle label { padding: 5px 20px 5px 10px; } .toggle label.btn-xs { padding: 1px 12px 1px 5px; } .toggle label.toggle-off.btn-xs { padding: 1px 5px 1px 12px; } .toggle.active label { color: inherit; margin-bottom: 0; } .toggle.active i.fa-minus { display: none; color: inherit; } .toggle.active > label i.fa-minus { display: inline; color: #FFF; } .toggle.active i.fa-plus { display: inline; } .toggle.active > label i.fa-plus { display: none; } .lf-acordian-toggle.toggle-content-bordered > .toggle.active > .toggle-content, .lf-acordian-toggle.toggle-content-bordered > .toggle > .toggle-content { padding: 15px; border-width: 0 4px 4px 4px; border-color: #DADADA; border-style: solid; } .toggle label.bg-default { border-left-color: #666; color: #666; } .toggle.active > label.bg-default { background: #DADADA !important; border-color: #DADADA; color: #666; } .toggle label.bg-primary { } .toggle.active > label.bg-primary { color: #FFF; } .toggle label.bg-secondary { border-left-color: #E36159; color: #E36159; } .toggle.active > label.bg-secondary { background: #E36159 !important; border-color: #E36159; color: #FFF; } .toggle label.bg-tertiary { border-left-color: #2BAAB1; color: #2BAAB1; } .toggle.active > label.bg-tertiary { background: #2BAAB1 !important; border-color: #2BAAB1; color: #FFF; } .toggle label.bg-quartenary { border-left-color: #734BA9; color: #734BA9; } .toggle.active > label.bg-quartenary { background: #734BA9 !important; border-color: #734BA9; color: #FFF; } .toggle label.bg-success { border-left-color: #47a447; color: #47a447; } .toggle.active > label.bg-success { background: #47a447 !important; border-color: #47a447; color: #FFF; } .toggle label.bg-warning { border-left-color: #ed9c28; color: #ed9c28; } .toggle.active > label.bg-warning { background: #ed9c28 !important; border-color: #ed9c28; color: #FFF; } .toggle label.bg-danger { border-left-color: #d2322d; color: #d2322d; } .toggle.active > label.bg-danger { background: #d2322d !important; border-color: #d2322d; color: #FFF; } .toggle label.bg-info { border-left-color: #5bc0de; color: #5bc0de; } .toggle.active > label.bg-info { background: #5bc0de !important; border-color: #5bc0de; color: #FFF; } .toggle label.bg-dark { border-left-color: #171717; color: #171717; } .toggle.active > label.bg-dark { background: #171717 !important; border-color: #171717; color: #FFF; } /* | ====================================================================== | Tabs | ====================================================================== */ .tab-success a { color: #47a447 !important; } .tab-success a:hover { border-top-color: #47a447 !important; } .tab-success.active a { border-top-color: #47a447 !important; color: #47a447 !important; } .tab-danger a { color: #d2322d !important; } .tab-danger a:hover { border-top-color: #d2322d !important; } .tab-danger.active a { border-top-color: #d2322d !important; color: #d2322d !important; } .tabs > .nav-tabs > li.disabled > a { color: #999; } .tabs > .nav-tabs > li.disabled > a:hover, .tabs > .nav-tabs > li.disabled > a:focus { color: #999; text-decoration: none; background-color: #F4F4F4; cursor: not-allowed; border-top-color: #DDD; } /* | ====================================================================== | Checkbox toggle switches | ====================================================================== */ .lf-toggle { margin-top: 0!important; } .lf-toggle label.btn-success { color: #fff!important; } .lf-toggle label.btn-danger { color: #fff!important; } .lf-toggle label.btn-default { color: #000!important; } .lf-toggle label.btn-primary { color: #fff!important; } .toggle.active .lf-toggle i.fa-minus { display: inline-block !important; } .toggle.off .toggle-group:hover { left: -92%; } .toggle-group:hover { left: -8%; } /* | ====================================================================== | Notepad style paper | ====================================================================== */ .notepad { background: #f6f6f6; box-shadow: 0 1px 4px hsla(0,0%,0%,.25); margin: 0 auto 15px; position: relative; background-image: -webkit-radial-gradient(#fff 21%, transparent 21%), -webkit-radial-gradient(hsla(0,0%,0%,.25) 21%, transparent 26%), -webkit-linear-gradient(top, hsla(0,0%,0%,0) 0%, hsla(0,0%,0%,0) 95%, hsla(180,25%,50%,.1) 95%, hsla(180,25%,50%,.1) 100%); background-image: -moz-radial-gradient(#fff 21%, transparent 21%), -moz-radial-gradient(#fff 10%, transparent 12%), -moz-linear-gradient(top, hsla(0,0%,0%,0) 0%, hsla(0,0%,0%,0) 95%, hsla(180,25%,50%,.1) 95%, hsla(180,25%,50%,.1) 100%); background-image: radial-gradient(#fff 21%, transparent 21%), radial-gradient(#fff 10%, transparent 12%), linear-gradient(top, hsla(0,0%,0%,0) 0%, hsla(0,0%,0%,0) 95%, hsla(180,25%,50%,.1) 95%, hsla(180,25%,50%,.1) 100%); background-position: -5px 1px, -5px 0px, 50% 13px; background-repeat: repeat-y, repeat-y, repeat; background-size: 48px 48px, 48px 48px, 24px 24px; padding: 15px 20px 1px 50px; } .notepad:after { border-left: 1px solid hsla(0,75%,50%,.2); border-right: 1px solid hsla(0,75%,50%,.2); bottom: 0; content: ''; left: 35px; position: absolute; top: 0; width: 2px; } .notepad:before { bottom: 8px; border-radius: 4px; box-shadow: 0 10px 10px hsla(0,0%,0%,.25); content: ''; height: 100px; max-width: 300px; position: absolute; right: 5px; width: 300px; z-index: -10; -webkit-transform: rotate(1deg); -moz-transform: rotate(1deg); -ms-transform: rotate(1deg); -o-transform: rotate(1deg); transform: rotate(1deg); } .notepad p { color: #124B77; font: 18px/24px 'Handlee-Regular', sans-serif; margin-bottom: 0; /* for 1 line space use 24px */ } .notepad div.notepad-footer { color: #aaa; font: 12px/24px 'Open Sans', sans-serif; margin-bottom: 5px; } /* | ====================================================================== | Activity Stream | ====================================================================== */ .activity-stream { max-height: 70vh; min-height: 100px; } .activity-stream-shadow { -webkit-box-shadow: inset 0px -15px 20px -20px rgba(0,0,0,0.55); -moz-box-shadow: inset 0px -15px 20px -20px rgba(0,0,0,0.55); box-shadow: inset 0px -15px 20px -20px rgba(0,0,0,0.55); } .activity-stream .timeline.timeline-simple .tm-body { padding: 10px 0; } .activity-stream .timeline.timeline-simple .tm-body:after { left: 15px; width: 2px; } .activity-stream .timeline.timeline-simple .tm-body .tm-items > li { margin: 0; padding: 8px 0 8px 41px; } .activity-stream .timeline.timeline-simple .tm-body .tm-items > li .tm-box { border: none; padding: 4px 10px; min-height: 1px; } .activity-stream .timeline.timeline-simple .tm-body .tm-items > li .tm-box .tm-meta { margin: 0; } .activity-stream .timeline.timeline-simple .tm-body .tm-items > li .tm-box .tm-meta > span { color: #9e9e9e; display: inline-block; font-size: 12px; } .activity-stream .timeline.timeline-simple .tm-body .tm-items > li .tm-box .tm-meta > span > span { padding-right: .6em; } .activity-stream .timeline.timeline-simple .tm-body .tm-items > li:before { left: 15px; content: "\f069"; font-family: "Font Awesome 5 Free"; font-weight: 900; position: absolute; top: 50%; font-size: 20px; border: 0; background: #ddd; border-radius: 20px; width: 38px; height: 38px; margin-left: -17px; margin-top: -17px; padding: 7px 0 0 6px; color: #acacac; box-shadow: none; } .activity-stream .timeline.timeline-simple .tm-body .tm-items > li.stream_created:before { content: "\f0fe"; padding: 9px 0 0 7px; font-size: 22px; } .activity-stream .timeline.timeline-simple .tm-body .tm-items > li.stream_updated:before { content: "\f044"; padding: 9px 0 0 7px; font-size: 21px; } .activity-stream .timeline.timeline-simple .tm-body .tm-items > li.stream_link:before { content: "\f0c1"; padding: 8px 0 0 6px; } .activity-stream .timeline.timeline-simple .tm-body .tm-items > li.stream_email:before { content: "\f003"; padding: 7px 0 0 6px; } .activity-stream.scrollable .scrollable-pane { right: 0!important; } .activity-stream.scrollable .scrollable-content { right: -10px!important; padding: 0 10px 10px 0!important; margin-bottom: 1px; } .activity-stream .timeline.timeline-simple.timeline-simple-on-white .tm-body .tm-items > li .tm-box { border: 1px solid #e9e9e9; } .activity-stream .timeline.timeline-simple.timeline-simple-on-white .tm-body .tm-items > li:before { background: #fff; } .activity-stream-no-scroll { max-height: none; } .tm-single-item .tm-box { border: none; padding: 0; min-height: 1px; } .tm-single-item .tm-box .tm-meta { margin: 0; } .tm-single-item .tm-box .tm-meta > span { color: #9e9e9e; display: inline-block; font-size: 12px; } .tm-single-item .tm-box .tm-meta > span > span { padding-right: .6em; } /* | ====================================================================== | File Manager | ====================================================================== */ table.file-manager-file-strip { margin-bottom: 0 !important; } table.file-manager-file-strip tr { } table.file-manager-file-strip tr td { padding: 0; border-bottom: 0; } table.file-manager-file-strip tr td.file-strip-name { padding: 8px 10px 8px 8px; word-break: break-word; } table.file-manager-file-strip tr td.file-strip-btn { padding: 0 5px 0 0; } table.file-manager-file-strip tr td.file-strip-icon { font-size: 11px; padding: 6px 10px 0 10px; border-bottom: 1px solid #ddd; text-align: center; } table.file-manager-file-strip tr td.file-strip-icon i { font-size: 25px; } table.file-manager-file-strip tr td.file-strip-meta { background-color: #f1f1f1; padding: 3px 15px 3px 0; font-size: 11px; color: #a0a0a0; border-top: 0; border-bottom: 1px solid #ddd; } table.file-manager-file-strip tr td.file-strip-meta span { display: inline-block; white-space: nowrap; padding-left: 15px; } table.file-manager-file-strip tr td.file-strip-meta i { padding-right: 2px; color: #d4d4d4; } .file-manager-file-details-modal { } .file-manager-file-details-modal h4 { word-wrap: break-word; line-height: 24px; } .file-manager-file-details-modal .details { width: 100%; table-layout: fixed; } .file-manager-file-details-modal .details td:nth-child(1) { width: 60px; padding: 0 15px 0 0; } .file-manager-file-details-modal .details td:nth-child(2) span.filename { word-wrap: break-word; } .file-manager-file-details-modal .details span.file-icon { font-size: 20px; text-align: center; } .file-manager-file-details-modal .details span.file-icon i { font-size: 50px; } .file-manager-file-details-modal .details span.current-icon { padding-right: 10px; white-space: nowrap; font-size: 12px; } .file-manager-file-details-modal .details span.current-icon i { padding-right: 5px; } .file-manager-file-details-modal .revisions_table_wrapper { overflow-x: auto; } .file-manager-file-details-modal table.revisions { margin-bottom: 0; } /* Font-Awesome file type icons */ .file-icon { color: #666; } .file-icon-pdf { color: red } .file-icon-pdf i:before { content: "\f1c1" } .file-icon-text, .file-icon-txt { color: #808080 } .file-icon-text i:before, .file-icon-txt i:before { content: "\f15c" } .file-icon-word, .file-icon-doc, .file-icon-docx { color: #2a3281 } .file-icon-word i:before, .file-icon-doc i:before, .file-icon-docx i:before { content: "\f1c2" } .file-icon-excel, .file-icon-xls, .file-icon-xlsx { color: #007133 } .file-icon-excel i:before, .file-icon-xls i:before, .file-icon-xlsx i:before { content: "\f1c3" } .file-icon-powerpoint, .file-icon-ppt, .file-icon-pptx { color: #db5a26 } .file-icon-powerpoint i:before, .file-icon-ppt i:before, .file-icon-pptx i:before { content: "\f1c4" } .file-icon-photo, .file-icon-picture, .file-icon-image, .file-icon-bmp, .file-icon-gif, .file-icon-jpeg, .file-icon-jpg, .file-icon-png { color: #ffaa00 } .file-icon-photo i:before, .file-icon-picture i:before, .file-icon-image i:before, .file-icon-bmp i:before, .file-icon-gif i:before, .file-icon-jpeg i:before, .file-icon-jpg i:before, .file-icon-png i:before { content: "\f1c5" } .file-icon-archive, .file-icon-bz2, .file-icon-dmg, .file-icon-gz, .file-icon-gzip, .file-icon-iso, .file-icon-rar, .file-icon-tar, .file-icon-tgz, .file-icon-zip { color: #333355 } .file-icon-archive i:before, .file-icon-bz2 i:before, .file-icon-dmg i:before, .file-icon-gz i:before, .file-icon-gzip i:before, .file-icon-iso i:before, .file-icon-rar i:before, .file-icon-tar i:before, .file-icon-tgz i:before, .file-icon-zip i:before { content: "\f1c6" } /* | ====================================================================== | Magnific popup | ====================================================================== */ .mfp-iframe-scaler iframe { background: url('/app_images/loading-666666.gif') no-repeat scroll center center #666666 !important; height: 90vh!important; } .mfp-iframe-scaler iframe.remove-loading { background: #FFF !important; } .mfp-iframe-holder { padding: 40px 0 0 0; } .mfp-iframe-holder .mfp-content { vertical-align: top; max-width: 95vw!important; } .mfp-close, .mfp-close-btn-in .mfp-close { color: #FFF; font-size: 30px; opacity: 1; filter: alpha(opacity=100); } .mfp-fluid .mfp-content { width: auto; } .modal-block-fluid { min-width: 200px; max-width: 98%; } /* | ====================================================================== | Logiflow Diagnostics | ====================================================================== */ #logiflow_diagnostics_add_feedback { background-color: #999; border-radius: 6px 0 0 6px; color: #fff; font-size: 13px; height: 34px; line-height: 34px; text-align: left; text-decoration: none; width: 105px; position: fixed; bottom: 50px; z-index: 1008; right: -74px; } #logiflow_diagnostics_add_feedback i { font-size: 13px; padding: 6px 10px 0; line-height: 24px; } #logiflow_diagnostics_add_feedback:hover { background-color: #DF0363; right: 0px; } /* | ====================================================================== | multi-steps Progress Bar | https://codepen.io/athimannil/pen/wWPYkQ | ====================================================================== */ .multi-steps { display: table; table-layout: fixed; width: 100%; } .multi-steps > li { counter-increment: stepNum; text-align: center; display: table-cell; position: relative; color: #000; /* text color */ z-index: 1; } .multi-steps > li:before { content: "\f00c"; font-family: "Font Awesome 5 Free"; display: block; margin: 0 auto 4px; background-color: #fff; /* circle color */ color: #398439; /* circle text color */ width: 36px; height: 36px; line-height: 32px; text-align: center; font-weight: 900; font-size: 15px; border-width: 2px; border-style: solid; border-color: #398439; /* circle border color */ border-radius: 50%; } .multi-steps > li:after { content: ''; height: 2px; width: 100%; background-color: #398439; /* connector line color */ position: absolute; top: 16px; left: 50%; z-index: -1; } .multi-steps > li:last-child:after { display: none; } .multi-steps > li.is-active { font-weight: 600; } .multi-steps > li.is-active:before { background-color: #fff; /* active circle color */ border-color: #fff; /* active circle border color */ color: #000; /* active circle text color */ } .multi-steps > li.is-active ~ li { color: #808080; /* remaining text color */ } .multi-steps > li.is-active ~ li:before { background-color: #fff; /* remaining circle color */ border-color: #fff; /* remaining circle border color */ color: #808080; /* remaining circle text color */ } .multi-steps > li.is-active:before, .multi-steps > li.is-active ~ li:before { content: counter(stepNum); font-family: inherit; font-weight: 700; } .multi-steps > li.is-active:after, .multi-steps > li.is-active ~ li:after { background-color: #fff; /* remaining connector line color */ } .multi-steps > li:last-child:before, .multi-steps > li.is-active:last-child:before, .multi-steps > li.is-active ~ li:last-child:before { content: "\f11e"; font-family: "Font Awesome 5 Free"; font-weight: 900; } /* | ====================================================================== | Right slider Add this to the bottom of any page to use

Style Switcher

Primary Color
hello
| ====================================================================== */ .right-slider { background: #171717; width: 350px; position: fixed; top: 110px; bottom: 0; height: 100%; z-index: 1008; border-radius: 0; right: -350px } .right-slider .right-slider-wrap { height: 100%; margin: 0; overflow-y: auto; padding: 15px 20px; position: relative } .right-slider h4 { background: #171717; color: #fff; font-size: 15px; font-weight: 600; line-height: 30px; margin: 0 0 7px; padding: 0 } .right-slider .right-slider-open { background-color: #171717; border-radius: 6px 0 0 6px; color: #fff; display: block; font-size: 13px; height: 34px; left: -33px; line-height: 34px; position: absolute; text-align: center; text-decoration: none; top: 35px; width: 34px } .right-slider h5 { color: #999; margin: 0 0 2px; padding: 0; line-height: 30px; font-size: 13px; font-weight: 400; text-transform: none } .right-slider .form-control { background-color: #fff!important; border: 1px solid #ccc!important } .right-slider .colorpicker-element { margin: -3px 0 7px } .right-slider ul.options { list-style: none; margin: -3px 0 10px; padding: 0; overflow: hidden } .right-slider ul.options li { float: left; margin: 2px } .right-slider ul.options li a { display: block; width: 15px; height: 15px; cursor: pointer } .right-slider ul.options li a.pattern { background-repeat: repeat; background-position: 0 0; background-color: transparent } .right-slider .color-picker { display: none; margin-bottom: 15px } .right-slider .options-links { padding: 0 0 10px } .right-slider .options-links a { background-color: #000; color: #ccc; font-size: 12px; margin-bottom: 0; margin-right: 5px; padding: 5px 12px; text-decoration: none; border-radius: 4px } .right-slider .options-links a:last-child { margin-right: 0 } .right-slider .options-links a:hover { background-color: #262626 } .right-slider .options-links a.active { background: #FFF; color: #666 } .right-slider .right-slider-buttons { border-top: 1px solid #000; margin-top: 15px; padding-top: 15px; text-align: center } .right-slider .right-slider-buttons a { padding: 8px; font-size: 13px; display: inline-block } .right-slider .right-slider-buttons .reset { width: 74px } .right-slider .right-slider-buttons .get-css { width: 137px; font-weight: 700 } .right-slider .right-slider-buttons .get-css i { font-size: 14px; margin-right: 5px } textarea.get-css { height: 325px; width: 100%; resize: none; cursor: text } .right-slider-color-picker { z-index: 1009!important } html.boxed .right-slider { top: 0!important } html.header-fixed .right-slider { top: 56px!important } html.sidebar-light:not(.dark) .right-slider { background: #f6f6f6 } html.sidebar-light:not(.dark) .right-slider:before { content: " "; height: 100%; top: 0; left: 0; bottom: 0; width: 5px; background: #e2e3e6; position: absolute } html.sidebar-light:not(.dark) .right-slider .right-slider-open { background: #f6f6f6; color: #777; border-left: 3px solid #e2e3e6; border-top: 3px solid #e2e3e6; border-bottom: 3px solid #e2e3e6; height: 39px; width: 38px } html.sidebar-light:not(.dark) .right-slider h4 { background: 0 0; color: #777 } html.sidebar-light:not(.dark) .right-slider .options-links a { background-color: #ececec; color: #777 } html.sidebar-light:not(.dark) .right-slider .options-links a:hover { background-color: #f2f2f2 } html.sidebar-light:not(.dark) .right-slider .options-links a.active { background: #333; color: #fff } html.sidebar-light:not(.dark) .right-slider .right-slider-buttons { border-top: 1px solid #ececec } /* | ====================================================================== | Files uploader | ====================================================================== */ .fileuploader-theme-thumbnails { background: none; padding: 0; margin: 0; border-radius: 0; } .fileuploader-theme-thumbnails .fileuploader-items .fileuploader-items-list { position: relative; padding-top: 170px; margin: 0; } .fileuploader-theme-thumbnails .fileuploader-thumbnails-input { margin: 0; width: 100%; height: 150px; padding-top: 0; position: absolute; top: 0; left: 0; } .fileuploader-theme-thumbnails .fileuploader-items .fileuploader-item { border-bottom: 0; margin-right: 1rem; } .fileuploader-theme-thumbnails .fileuploader-items-list .fileuploader-item { margin: 0 1rem 1rem 0; width: 193px; height: 100px; padding-top: 0; } .fileuploader-theme-thumbnails .fileuploader-thumbnails-input-inner { background: #f8fbff; border: 3px dashed #eae7e4; font-size: 20px; font-weight: 400; line-height: 1.5; color: #6c757d; padding-top: 30px; width: 100%; border-radius: 0px; } .fileuploader-theme-thumbnails .fileuploader-thumbnails-input-inner:hover { opacity: 1; color: #f8f7f5; } .fileuploader-theme-thumbnails .fileuploader-thumbnails-input-inner i { color: #495057; font-weight: 300; } .fileuploader-theme-thumbnails .fileuploader-items .fileuploader-item .fileuploader-item-icon { background-position: center 15%; } /* | ====================================================================== | BITS AND BOBS TO TIDY | DEV : these needs moving correct place / file | ====================================================================== */ #contacts_list td:nth-child(8) { white-space: normal!important; min-width: 250px; } .list-group-item:first-child, .list-group-item:last-child { border-radius: 0; } ul.lf-user-list li .image { float: left; } ul.lf-user-list li .image img { width: 42px; margin-right: 10px; } ul.lf-user-list li span.main-line { } ul.lf-user-list li span.sub-line { color: #ccc; } .circular-bar canvas { margin-left: auto; margin-right: auto; display: block; } /* remember to add ("size": 100) to data-plugin-options */ .circular-bar.circular-bar-sm {width: 100px;} .circular-bar.circular-bar-sm strong {font-size: 12px;line-height: 30px;left: 0;text-align: center;top: 28%;width: 100%;} .circular-bar.circular-bar-sm label {font-size: 11px;line-height: 20px;left: 0;text-align: center;top: 48%;width: 100%;} /* remember to add ("size": 150) to data-plugin-options */ .circular-bar.circular-bar-md {width: 150px;} .circular-bar.circular-bar-md strong {font-size: 25px;line-height: 30px;left: 0;text-align: center;top: 30%;width: 100%;} .circular-bar.circular-bar-md label {font-size: 14px;line-height: 20px;left: 0;text-align: center;top: 52%;width: 100%;} .ui-effects-transfer { border: 2px dotted #222; background-color: yellow; opacity: 0.2; } ul.changelog li { font-family: Consolas, Monaco, Courier New, Courier, monospace; line-height: 18px; border-bottom: 1px solid #f1f1f1; margin-bottom: 3px; padding-bottom: 3px; } .note-editor.panel { margin-bottom: 0; } .dont-break-out { /* These are technically the same, but use both */ overflow-wrap: break-word; word-wrap: break-word; -ms-word-break: break-all; /* This is the dangerous one in WebKit, as it breaks things wherever */ word-break: break-all; /* Instead use this non-standard one: */ word-break: break-word; /* Adds a hyphen where the word breaks, if supported (No Blink) */ -ms-hyphens: auto; -moz-hyphens: auto; -webkit-hyphens: auto; hyphens: auto; } /* | ====================================================================== | EOF - BITS AND BOBS TO TIDY | ====================================================================== */ /* | ====================================================================== | TEMP | ====================================================================== */ .task-list .task-item { padding: 15px 20px; background: #ffffff; border-top: 1px solid #e7eaec; border-left: 3px solid #FFF; } .task-list .task-item .task-item-action { padding-left: 15px; border-left: 1px dotted #e7eaec; display: table-cell; vertical-align: middle; } .task-list .task-item .task-item-title { display: table-cell; padding-right: 15px; vertical-align: middle; font-size: 14px; width:100%; } .task-list .task-item .task-item-details { padding-top: 4px; color: #B7B7B7; } .task-list .task-item .task-item-details div { display: inline-block; } .task-list .task-item .task-item-details div:first-child { margin-right: 10px; } .task-list .task-item.task-default { border-left-color: #CCC; } .task-list .task-item.task-primary { border-left-color: #0088cc; } .task-list .task-item.task-secondary { border-left-color: #E36159; } .task-list .task-item.task-tertiary { border-left-color: #2BAAB1; } .task-list .task-item.task-quartenary { border-left-color: #734BA9; } .task-list .task-item.task-success { border-left-color: #47a447; } .task-list .task-item.task-warning { border-left-color: #ed9c28; } .task-list .task-item.task-danger { border-left-color: #d2322d; } .task-list .task-item.task-info { border-left-color: #5bc0de; } .task-list .task-item.task-dark { border-left-color: #171717; } @media (min-width : 1000px) { } /* | ====================================================================== | EOF - TEMP | ====================================================================== */ html.popup .inner-wrapper { display: block; } @media (max-width : 768px) { /* | ====================================================================== | General | ====================================================================== */ .header .logo-container { border-top:0; } html > body > .ui-pnotify { top:0!important; } /* Layout Fixed Popup mode */ html.fixed.popup .inner-wrapper .content-body { padding: 15px; } html.fixed.popup .header .header-right { min-height: 40px; height: auto; text-align: center; } } /* --------------------------------------------------------------------- | SM Styles 768px and up */ @media (min-width : 768px) { /* | ====================================================================== | General | ====================================================================== */ .userbox.open .dropdown-menu { top: -8px; } .body-sign .center-sign .logo { margin-bottom: 30px; } .body-sign .center-sign .title-sign { padding-left: 10px; text-align: left; float:left; } .inner-toolbar > ul > li > .btn { margin-top: -6px; } .inner-toolbar > ul > li { padding: 15px; } /* Layout Fixed Popup mode */ html.fixed.popup .inner-wrapper { padding-top: 60px; } html.fixed.popup .content-body { margin-left: 0; } .widget-profile-info .profile-info { display: table-cell; text-align: left; } .widget-profile-info .profile-info h1 { font-size: 30px; line-height: 38px; margin: 0; } .widget-profile-info .profile-picture-square { display: table-cell; vertical-align: top; width: 1%; text-align: center; } .widget-profile-info .profile-picture-square img { margin-right: 15px; } /* | ====================================================================== | Footer | ====================================================================== */ .inner-wrapper { margin-bottom: -30px; } .inner-wrapper:after { content: ""; display: block; } .footer { padding: 5px 0 0 95px; } .footer, .inner-wrapper:after { height: 30px; } /* | ====================================================================== | Tables | ====================================================================== */ /* TRYING NO WRAP ALL THE TIME table.dataTable th, table.dataTable td { white-space: nowrap; }*/ } @media (max-width : 992px) { /* | ====================================================================== | Wizards | ====================================================================== */ html .wizard-progress.wizard-progress-lg { padding-bottom: 20px; } } /* --------------------------------------------------------------------- | MD Styles 992px and up */ @media (min-width : 992px) { /* | ====================================================================== | General | ====================================================================== */ .widget-profile-info .profile-info h1 { font-size: 36px; line-height: 45px; } } @media (max-width : 1200px) { } /* --------------------------------------------------------------------- | LG Styles 1200px and up */ @media (min-width : 1200px) { }