.btn-danger {
  background: #7d0202;
  border-color: #7d0202;
}


.title-tab h4,
        .title-tab h1,
        .page-title h1,
        .page-title h4 {
            font-weight: bold;
            color: #004d4d;
        }

        .page-title {
            background: #fff;
            border-bottom: 2px solid rgb(0 77 77);
            color: #004d4d;
            border-radius: 5px 5px 0 0;
        }

       

        .datepicker {
            z-index: 99999 !important;
        }

        .modal-header {
            border-bottom: 2px solid rgb(0 77 77);
            color: #004d4d;
            font-weight: bold;
        }

        .modal-header h4 {
            font-weight: bold;
        }

        .modal-header .btn-close {
            color: #fff;
            background-color: #7d0202;
            opacity: 1;
        }

        .add-item {
            margin-top: -60px;
            position: relative;
        }

        .cut {
            background-color: #7d0202 !important;
        }

        .btn-outline-danger {
            color: #7d0202;
            border-color: #7d0202 !important;
        }

        .select2-container .select-all {
            position: absolute;
            top: 6px;
            right: 4px;
            width: 20px;
            height: 20px;
            margin: auto;
            display: block;
            background: url('data:image/svg+xml;utf8;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pgo8IS0tIEdlbmVyYXRvcjogQWRvYmUgSWxsdXN0cmF0b3IgMTYuMC4wLCBTVkcgRXhwb3J0IFBsdWctSW4gLiBTVkcgVmVyc2lvbjogNi4wMCBCdWlsZCAwKSAgLS0+CjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+CjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4PSIwcHgiIHk9IjBweCIgd2lkdGg9IjUxMnB4IiBoZWlnaHQ9IjUxMnB4IiB2aWV3Qm94PSIwIDAgNDc0LjggNDc0LjgwMSIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgNDc0LjggNDc0LjgwMTsiIHhtbDpzcGFjZT0icHJlc2VydmUiPgo8Zz4KCTxnPgoJCTxwYXRoIGQ9Ik0zOTYuMjgzLDI1Ny4wOTdjLTEuMTQtMC41NzUtMi4yODItMC44NjItMy40MzMtMC44NjJjLTIuNDc4LDAtNC42NjEsMC45NTEtNi41NjMsMi44NTdsLTE4LjI3NCwxOC4yNzEgICAgYy0xLjcwOCwxLjcxNS0yLjU2NiwzLjgwNi0yLjU2Niw2LjI4M3Y3Mi41MTNjMCwxMi41NjUtNC40NjMsMjMuMzE0LTEzLjQxNSwzMi4yNjRjLTguOTQ1LDguOTQ1LTE5LjcwMSwxMy40MTgtMzIuMjY0LDEzLjQxOCAgICBIODIuMjI2Yy0xMi41NjQsMC0yMy4zMTktNC40NzMtMzIuMjY0LTEzLjQxOGMtOC45NDctOC45NDktMTMuNDE4LTE5LjY5OC0xMy40MTgtMzIuMjY0VjExOC42MjIgICAgYzAtMTIuNTYyLDQuNDcxLTIzLjMxNiwxMy40MTgtMzIuMjY0YzguOTQ1LTguOTQ2LDE5LjctMTMuNDE4LDMyLjI2NC0xMy40MThIMzE5Ljc3YzQuMTg4LDAsOC40NywwLjU3MSwxMi44NDcsMS43MTQgICAgYzEuMTQzLDAuMzc4LDEuOTk5LDAuNTcxLDIuNTYzLDAuNTcxYzIuNDc4LDAsNC42NjgtMC45NDksNi41Ny0yLjg1MmwxMy45OS0xMy45OWMyLjI4Mi0yLjI4MSwzLjE0Mi01LjA0MywyLjU2Ni04LjI3NiAgICBjLTAuNTcxLTMuMDQ2LTIuMjg2LTUuMjM2LTUuMTQxLTYuNTY3Yy0xMC4yNzItNC43NTItMjEuNDEyLTcuMTM5LTMzLjQwMy03LjEzOUg4Mi4yMjZjLTIyLjY1LDAtNDIuMDE4LDguMDQyLTU4LjEwMiwyNC4xMjYgICAgQzguMDQyLDc2LjYxMywwLDk1Ljk3OCwwLDExOC42Mjl2MjM3LjU0M2MwLDIyLjY0Nyw4LjA0Miw0Mi4wMTQsMjQuMTI1LDU4LjA5OGMxNi4wODQsMTYuMDg4LDM1LjQ1MiwyNC4xMyw1OC4xMDIsMjQuMTNoMjM3LjU0MSAgICBjMjIuNjQ3LDAsNDIuMDE3LTguMDQyLDU4LjEwMS0yNC4xM2MxNi4wODUtMTYuMDg0LDI0LjEzNC0zNS40NSwyNC4xMzQtNTguMDk4di05MC43OTcgICAgQzQwMi4wMDEsMjYxLjM4MSw0MDAuMDg4LDI1OC42MjMsMzk2LjI4MywyNTcuMDk3eiIgZmlsbD0iIzAwMDAwMCIvPgoJCTxwYXRoIGQ9Ik00NjcuOTUsOTMuMjE2bC0zMS40MDktMzEuNDA5Yy00LjU2OC00LjU2Ny05Ljk5Ni02Ljg1MS0xNi4yNzktNi44NTFjLTYuMjc1LDAtMTEuNzA3LDIuMjg0LTE2LjI3MSw2Ljg1MSAgICBMMjE5LjI2NSwyNDYuNTMybC03NS4wODQtNzUuMDg5Yy00LjU2OS00LjU3LTkuOTk1LTYuODUxLTE2LjI3NC02Ljg1MWMtNi4yOCwwLTExLjcwNCwyLjI4MS0xNi4yNzQsNi44NTFsLTMxLjQwNSwzMS40MDUgICAgYy00LjU2OCw0LjU2OC02Ljg1NCw5Ljk5NC02Ljg1NCwxNi4yNzdjMCw2LjI4LDIuMjg2LDExLjcwNCw2Ljg1NCwxNi4yNzRsMTIyLjc2NywxMjIuNzY3YzQuNTY5LDQuNTcxLDkuOTk1LDYuODUxLDE2LjI3NCw2Ljg1MSAgICBjNi4yNzksMCwxMS43MDQtMi4yNzksMTYuMjc0LTYuODUxbDIzMi40MDQtMjMyLjQwM2M0LjU2NS00LjU2Nyw2Ljg1NC05Ljk5NCw2Ljg1NC0xNi4yNzRTNDcyLjUxOCw5Ny43ODMsNDY3Ljk1LDkzLjIxNnoiIGZpbGw9IiMwMDAwMDAiLz4KCTwvZz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8L3N2Zz4K') no-repeat center;
            background-size: contain;
            cursor: pointer;
            z-index: 999999;
        }

        .btn-danger:hover,
        .btn-danger:focus,
        .btn-outline-danger:hover,
        .btn-outline-danger:focus {
            background: #b90404;
            border-color: #b90404;
        }

        .dt-buttons>.buttons-excel,
        .dt-buttons>.buttons-print,
        .DTTT_container>.column-show-hide-popover {
            background-color: #004d4d !important;
            columns: #fff !important;
            font-weight: bold;
        }

        .DTTT_container>.column-show-hide-popover>svg {
            color: #fff !important;
        }

        .dt-buttons>.buttons-excel:hover,
        .dt-buttons>.buttons-excel:focus,
        .dt-buttons>.buttons-print:hover,
        .dt-buttons>.buttons-print:focus,
        .DTTT_container>.column-show-hide-popover:hover,
        .DTTT_container>.column-show-hide-popover:focus {
            background-color: #148f77;
            border-color: #148f77;
            color: #FFF !important;
            font-weight: bold;
        }

        .dt-buttons>.buttons-excel>span,
        .dt-buttons>.buttons-print>span {
            color: #FFF !important;
        }

        .popover-body>ul.list-group>li.list-group-item {
            background: #7d0202;
            border-color: #7d0202;
            color: #FFF !important;
        }

        .nav-tabs li,
        .nav-tabs li {
            color: #7d0202 !important;
            border-color: #7d0202 !important;
            font-weight: bold;
        }

        .nav-tabs li a {
            border-color: #7d0202 !important;
            border-bottom: solid 2px;

        }

        .nav-tabs li:not(:first-child) {
            margin-left: 10px;
        }

        .nav-tabs li a.active,
        .nav-tabs li a.active {
            border-color: #148f77 !important;
            border-bottom: solid 2px;
        }

        .input-group-text:hover {
            color: #FFF !important;
            background-color: #148f77;
        }

        #inventory thead tr th {
            background: #004d4d;
            border-color: #004d4d;
            color: #fff;
        }

        #inventory thead tr th span {
            font-weight: bold;
        }

        .min_height {
            min-height: auto;
        }

        #payment-body tr td {
            font-size: 16px;
            font-weight: bold;
        }

        .general-form .form-control,
        .form-control {
            border-color: #566d64 !important;
            background-color: #fff !important;
        }

        .general-form .has-new-error {
            background: url('<?= base_url("assets/images/alert-circle.svg"); ?>');
            background-size: 20px;
            background-repeat: no-repeat;
            background-position: 1px 5px;
            padding-left: 40px;
            border: 1px solid #8d0202 !important;
            border-color: #8d0202 !important;
            color: #8d0202 !important;
        }

        .general-form input[aria-invalid="true"] {
            background: url('<?= base_url("assets/images/alert-circle.svg"); ?>');
            background-size: 20px;
            background-repeat: no-repeat;
            background-position: 1px 5px;
            padding-left: 40px;
            border: 1px solid #8d0202 !important;
            border-color: #8d0202 !important;
            color: #8d0202 !important;
        }

        .select2-container {
            border-width: 1px;
            border: 1px solid;
            border-bottom: 1px solid !important;
            border-color: #566d64 !important;
            background-color: #fff !important;
        }

        .text-danger {
            color: #7d0202 !important;
        }

        .main-header {
            height: 50px;
        }

        .sidebar-mini .breadcrumb-header .left-content {
            top: -5px;
        }

        .page-wrapper {
            padding: 0;
        }

        .page-container {
            margin-top: 5px;
        }

        .main-content .container-fluid {
            padding-left: 20px;
            padding-right: 20px;
            padding-top: 20px;
        }

        .main-header-right {
            margin-top: -25px;
        }

        .main-profile-menu {
            padding: 0.5rem 0.5rem !important;
        }

        .header-img {
            background: linear-gradient(rgb(0 77 77), rgb(80 224 171 / 93%));
        }

        .main-profile-menu .dropdown-item:last-child {
            margin-bottom: 0px;
        }

        .top-menu-checkin {
            margin-top: 13px;
            margin-left: 20px;
        }

        .box.banana_map {
            color: #fff;
            background: #eff4f7;
            padding: 0;
            box-shadow: none;
        }

        .box.banana_map .title {
            padding-top: 40px;
            padding-left: 25px;
            font-size: 16px;
        }

        .box.banana_map .subtitle {
            font-weight: 700;
            padding-top: 10px;
            padding-left: 25px;
            font-size: 22px;
        }

        .box {
            max-height: 444px;
        }

        .box .banana {
            min-height: 404px;
            background-image: url('img/banana.png');
            background-size: cover;
        }

        .box .map {
            min-height: 404px;
            background-image: url('img/map.png');
            background-size: cover;
        }

        .box .cog-icon {
            cursor: pointer;
            position: absolute;
            right: 55px;
            top: 25px;
            z-index: 10;
        }

        @media screen and (max-width:760px) {
            #topnav {
                flex-wrap: wrap;
            }

            .admin-menu {
                flex-basis: 20%;
            }

            .logo {
                justify-content: flex-end;
                padding-right: 10px;
            }

            .logo {
                flex-basis: 80%;
            }

            .topnav-rightmenu,
            .search-bar {
                display: none;
            }
        }

        .box {
            box-shadow: 0px 1px 22px -12px #607D8B;
            background-color: #fff;
            padding: 25px 35px 25px 30px;
        }

        #monthly-earnings-chart #apexcharts-canvas {
            position: relative;
        }

        #monthly-earnings-chart #apexcharts-canvas:after {
            content: "";
            position: absolute;
            left: 0;
            right: 58%;
            top: 0;
            bottom: 0;
            background: #24bdd3;
            opacity: 0.65;
        }

        #monthly-earnings-chart #apexcharts-title-text {
            font-weight: 600;
        }

        #monthly-earnings-chart #apexcharts-subtitle-text {
            font-weight: 700;
        }

        .monthly-earnings-text {
            position: absolute;
            left: 70px;
            top: 187px;
            color: #fff;
            z-index: 10;
        }

        .monthly-earnings-text h6 {
            font-size: 16px;
        }

        .chart-title h5 {
            font-size: 18px;
            color: rgba(51, 51, 51, 1);
            margin-bottom: 38px;
        }


        @media screen and (max-width:760px) {
            .monthly-earnings-text {
                left: 30px;
            }

            .box {
                padding: 25px 0;
            }
        }

        .sparkboxes .box {
            padding: 3px 0 0 0;
            position: relative;
        }

        #spark1,
        #spark2,
        #spark3,
        #spark4 {
            position: relative;
            padding-top: 15px;
        }


        /* overrides */
        .sparkboxes #apexcharts-subtitle-text {
            fill: #8799a2 !important;
        }

        /* fusionexport btn CSS START */
        #fusionexport-btn {
            min-width: 169px;
            min-height: 38px;
            text-align: center;
        }

        #fusionexport-btn .span {
            display: inline-block;
        }

        #fusionexport-btn[disabled] {
            cursor: wait;
        }


        .spinner-border {
            display: none;
        }

        #fusionexport-btn[disabled] .spinner-border {
            display: inline-block;
        }

        #fusionexport-btn[disabled] .btn-text {
            display: none;
        }

        .select2-container .select-all {
            position: absolute;
            top: 6px;
            right: 4px;
            width: 20px;
            height: 20px;
            margin: auto;
            display: block;
            background: url('data:image/svg+xml;utf8;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pgo8IS0tIEdlbmVyYXRvcjogQWRvYmUgSWxsdXN0cmF0b3IgMTYuMC4wLCBTVkcgRXhwb3J0IFBsdWctSW4gLiBTVkcgVmVyc2lvbjogNi4wMCBCdWlsZCAwKSAgLS0+CjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+CjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4PSIwcHgiIHk9IjBweCIgd2lkdGg9IjUxMnB4IiBoZWlnaHQ9IjUxMnB4IiB2aWV3Qm94PSIwIDAgNDc0LjggNDc0LjgwMSIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgNDc0LjggNDc0LjgwMTsiIHhtbDpzcGFjZT0icHJlc2VydmUiPgo8Zz4KCTxnPgoJCTxwYXRoIGQ9Ik0zOTYuMjgzLDI1Ny4wOTdjLTEuMTQtMC41NzUtMi4yODItMC44NjItMy40MzMtMC44NjJjLTIuNDc4LDAtNC42NjEsMC45NTEtNi41NjMsMi44NTdsLTE4LjI3NCwxOC4yNzEgICAgYy0xLjcwOCwxLjcxNS0yLjU2NiwzLjgwNi0yLjU2Niw2LjI4M3Y3Mi41MTNjMCwxMi41NjUtNC40NjMsMjMuMzE0LTEzLjQxNSwzMi4yNjRjLTguOTQ1LDguOTQ1LTE5LjcwMSwxMy40MTgtMzIuMjY0LDEzLjQxOCAgICBIODIuMjI2Yy0xMi41NjQsMC0yMy4zMTktNC40NzMtMzIuMjY0LTEzLjQxOGMtOC45NDctOC45NDktMTMuNDE4LTE5LjY5OC0xMy40MTgtMzIuMjY0VjExOC42MjIgICAgYzAtMTIuNTYyLDQuNDcxLTIzLjMxNiwxMy40MTgtMzIuMjY0YzguOTQ1LTguOTQ2LDE5LjctMTMuNDE4LDMyLjI2NC0xMy40MThIMzE5Ljc3YzQuMTg4LDAsOC40NywwLjU3MSwxMi44NDcsMS43MTQgICAgYzEuMTQzLDAuMzc4LDEuOTk5LDAuNTcxLDIuNTYzLDAuNTcxYzIuNDc4LDAsNC42NjgtMC45NDksNi41Ny0yLjg1MmwxMy45OS0xMy45OWMyLjI4Mi0yLjI4MSwzLjE0Mi01LjA0MywyLjU2Ni04LjI3NiAgICBjLTAuNTcxLTMuMDQ2LTIuMjg2LTUuMjM2LTUuMTQxLTYuNTY3Yy0xMC4yNzItNC43NTItMjEuNDEyLTcuMTM5LTMzLjQwMy03LjEzOUg4Mi4yMjZjLTIyLjY1LDAtNDIuMDE4LDguMDQyLTU4LjEwMiwyNC4xMjYgICAgQzguMDQyLDc2LjYxMywwLDk1Ljk3OCwwLDExOC42Mjl2MjM3LjU0M2MwLDIyLjY0Nyw4LjA0Miw0Mi4wMTQsMjQuMTI1LDU4LjA5OGMxNi4wODQsMTYuMDg4LDM1LjQ1MiwyNC4xMyw1OC4xMDIsMjQuMTNoMjM3LjU0MSAgICBjMjIuNjQ3LDAsNDIuMDE3LTguMDQyLDU4LjEwMS0yNC4xM2MxNi4wODUtMTYuMDg0LDI0LjEzNC0zNS40NSwyNC4xMzQtNTguMDk4di05MC43OTcgICAgQzQwMi4wMDEsMjYxLjM4MSw0MDAuMDg4LDI1OC42MjMsMzk2LjI4MywyNTcuMDk3eiIgZmlsbD0iIzAwMDAwMCIvPgoJCTxwYXRoIGQ9Ik00NjcuOTUsOTMuMjE2bC0zMS40MDktMzEuNDA5Yy00LjU2OC00LjU2Ny05Ljk5Ni02Ljg1MS0xNi4yNzktNi44NTFjLTYuMjc1LDAtMTEuNzA3LDIuMjg0LTE2LjI3MSw2Ljg1MSAgICBMMjE5LjI2NSwyNDYuNTMybC03NS4wODQtNzUuMDg5Yy00LjU2OS00LjU3LTkuOTk1LTYuODUxLTE2LjI3NC02Ljg1MWMtNi4yOCwwLTExLjcwNCwyLjI4MS0xNi4yNzQsNi44NTFsLTMxLjQwNSwzMS40MDUgICAgYy00LjU2OCw0LjU2OC02Ljg1NCw5Ljk5NC02Ljg1NCwxNi4yNzdjMCw2LjI4LDIuMjg2LDExLjcwNCw2Ljg1NCwxNi4yNzRsMTIyLjc2NywxMjIuNzY3YzQuNTY5LDQuNTcxLDkuOTk1LDYuODUxLDE2LjI3NCw2Ljg1MSAgICBjNi4yNzksMCwxMS43MDQtMi4yNzksMTYuMjc0LTYuODUxbDIzMi40MDQtMjMyLjQwM2M0LjU2NS00LjU2Nyw2Ljg1NC05Ljk5NCw2Ljg1NC0xNi4yNzRTNDcyLjUxOCw5Ny43ODMsNDY3Ljk1LDkzLjIxNnoiIGZpbGw9IiMwMDAwMDAiLz4KCTwvZz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8L3N2Zz4K') no-repeat center;
            background-size: contain;
            cursor: pointer;
            z-index: 999999;
        }

        #page-content {
            margin-top: 20px !important;
        }

        .bg-danger {
            background-color: #7d0202 !important;
            color: #fff;
        }

        .account-background:before {
            background: rgb(0 77 77 / 86%) !important;
        }

        .select2-container .select2-choice {
            height: 30px;
        }
        th,td {
            white-space: nowrap;
        }

        .ps .ps__rail-x {
            position: absolute; /* please don't change 'position' */
            bottom: 3px; /* there must be 'bottom' for ps__rail-x */
            height: 8px;
            -webkit-border-radius: 4px;
            -moz-border-radius: 4px;
            border-radius: 4px;
            opacity: 0.6;
            filter: alpha(opacity=60);
            -o-transition: background-color .2s linear, opacity .2s linear;
            -webkit-transition: background-color .2s linear, opacity .2s linear;
            -moz-transition: background-color .2s linear, opacity .2s linear;
            transition: background-color .2s linear, opacity .2s linear;
        }

        .ps:hover .ps__rail-x,
        .ps.hover .ps__rail-x {
            opacity: 0.6;
            filter: alpha(opacity=60);
        }

        .ps .ps__rail-x:hover,
        .ps .ps__rail-x.hover {
            background-color: #eee;
            opacity: 0.9;
            filter: alpha(opacity=90);
        }

        .ps .ps__rail-x.in-scrolling {
            background-color: #eee;
            opacity: 0.9;
            filter: alpha(opacity=90);
        }

        .ps .ps__rail-y {
            position: absolute; /* please don't change 'position' */
            right: 3px; /* there must be 'right' for ps__rail-y */
            width: 8px;
            -webkit-border-radius: 4px;
            -moz-border-radius: 4px;
            border-radius: 4px;
            opacity: 0.8;
            filter: alpha(opacity = 80);
            -o-transition: background-color .2s linear, opacity .2s linear;
            -webkit-transition: background-color .2s linear, opacity .2s linear;
            -moz-transition: background-color .2s linear, opacity .2s linear;
            transition: background-color .2s linear, opacity .2s linear;
        }

        .ps:hover .ps__rail-y,
        .ps.hover .ps__rail-y {
            opacity: 0.6;
            filter: alpha(opacity=60);
        }

        .ps .ps__rail-y:hover,
        .ps .ps__rail-y.hover {
            background-color: #eee;
            opacity: 0.9;
            filter: alpha(opacity=90);
        }

        .ps .ps__rail-y.in-scrolling {
            background-color: #eee;
            opacity: 0.9;
            filter: alpha(opacity=90);
        }

        .ps .ps-scrollbar-x {
            position: absolute; /* please don't change 'position' */
            bottom: 0; /* there must be 'bottom' for ps-scrollbar-x */
            height: 8px;
            background-color: #aaa;
            -webkit-border-radius: 4px;
            -moz-border-radius: 4px;
            border-radius: 4px;
            -o-transition: background-color .2s linear;
            -webkit-transition: background-color.2s linear;
            -moz-transition: background-color .2s linear;
            transition: background-color .2s linear;
        }

        .ps.ie6 .ps-scrollbar-x {
            font-size: 0; /* fixed scrollbar height in xp sp3 ie6 */
        }

        .ps .ps__rail-x:hover .ps-scrollbar-x,
        .ps .ps__rail-x.hover .ps-scrollbar-x {
            background-color: blue;
        }

        .ps .ps-scrollbar-y {
            position: absolute; /* please don't change 'position' */
            right: 0; /* there must be 'right' for ps-scrollbar-y */
            width: 8px;
            background-color: red;
            -webkit-border-radius: 4px;
            -moz-border-radius: 4px;
            border-radius: 4px;
            -o-transition: background-color .2s linear;
            -webkit-transition: background-color.2s linear;
            -moz-transition: background-color .2s linear;
            transition: background-color .2s linear;
        }

        .ps.ie6 .ps-scrollbar-y {
            font-size: 0; /* fixed scrollbar height in xp sp3 ie6 */
        
        }

        .ps .ps__rail-y:hover .ps-scrollbar-y,
        .ps .ps__rail-y.hover .ps-scrollbar-y {
            background-color: #7d0202;
        }

        .ps.ie .ps-scrollbar-x,
        .ps.ie .ps-scrollbar-y {
            visibility: visible;
        }

        .ps.ie:hover .ps-scrollbar-x,
        .ps.ie:hover .ps-scrollbar-y,
        .ps.ie.hover .ps-scrollbar-x,
        .ps.ie.hover .ps-scrollbar-y {
            visibility: visible;
        }