@font-face {
    font-family: 'Solveig';
    src: url('webfont.eot');
    /* IE9 Compat Modes */
    src: url('../fonts/SolveigDisplay.otf') format('woff2'), /* Super Modern Browsers */
}


/* @font-face kit by Fonts2u (https://fonts2u.com) */

@font-face {
    font-family: "DotMatrix";
    src: url("fonts/DotMatrix/1979_dot_matrix.eot?") format("eot"), url("fonts/DotMatrix/1979_dot_matrix.woff") format("woff"), url("fonts/DotMatrix/1979_dot_matrix.ttf") format("truetype"), url("fonts/DotMatrix/1979_dot_matrix.svg#1979-Dot-Matrix") format("svg");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "SimplePrint";
    src: url("fonts/SimplePrint/Simple\ Print.ttf") format("truetype");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "EpsonPixel";
    src: url("fonts/Epson\ Pixeled.ttf") format("truetype");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "Roboto-Regular";
    src: url("fonts/Roboto-Regular.ttf") format("truetype");
    font-weight: normal;
    font-style: normal;
}

.font-dot-matrix {
    font-family: 'Times New Roman';
}

@media print {
    .font-dot-matrix {
        font-family: 'Courier';
        line-height: 1.1;
        letter-spacing: 2px;
        font-size: 16.656px;
    }
}

.fixed .wrapper {
    overflow: auto !important;
}

body {
    font-family: 'Comic Sans Serif';
    
}
.control-sidebar-light, .control-sidebar-light + .control-sidebar-bg{
    
}
.sidebar-menu>li>.treeview-menu {
    padding-left: 22px;
}

.sidebar-menu>li>.treeview-menu ul li {}

.sidebar-menu>li>.treeview-menu .fa {
    width: 10px;
}

.sidebar-menu>li>a {
    padding: 6px 5px 6px 12px;
    display: block;
}

.navbar-search {
    padding-top: 10px;
    margin-left: 10px;
    opacity: 0.2;
}

.navbar-search input:focus {
    border: 1px solid #ccc;
}

.navbar-search input.no-border-right:focus {
    border-right: 0px;
}

.navbar-search .input-group-addon .fa:hover {
    color: #0099CC;
}

.no-border-right {
    border-right: 0px;
}

.no-border-left {
    border-left: 0px
}

.navbar-search .input-group {
    margin: 0;
}

.login-page.with-background {
    /* background-image: url('../images/backgrounds/bg-1.jpg'); */
    background-size: auto;
    background-image: radial-gradient(
			circle at 67% 83%,
			hsla(317, 0%, 96%, 0.05) 0%,
			hsla(317, 0%, 96%, 0.05) 1%,
			transparent 1%,
			transparent 5%,
			transparent 5%,
			transparent 100%
		),
		radial-gradient(
			circle at 24% 80%,
			hsla(317, 0%, 96%, 0.05) 0%,
			hsla(317, 0%, 96%, 0.05) 27%,
			transparent 27%,
			transparent 63%,
			transparent 63%,
			transparent 100%
		),
		radial-gradient(
			circle at 23% 5%,
			hsla(317, 0%, 96%, 0.05) 0%,
			hsla(317, 0%, 96%, 0.05) 26%,
			transparent 26%,
			transparent 82%,
			transparent 82%,
			transparent 100%
		),
		radial-gradient(
			circle at 21% 11%,
			hsla(317, 0%, 96%, 0.05) 0%,
			hsla(317, 0%, 96%, 0.05) 35%,
			transparent 35%,
			transparent 45%,
			transparent 45%,
			transparent 100%
		),
		radial-gradient(
			circle at 10% 11%,
			hsla(317, 0%, 96%, 0.05) 0%,
			hsla(317, 0%, 96%, 0.05) 21%,
			transparent 21%,
			transparent 81%,
			transparent 81%,
			transparent 100%
		),
		radial-gradient(
			circle at 19% 61%,
			hsla(317, 0%, 96%, 0.05) 0%,
			hsla(317, 0%, 96%, 0.05) 20%,
			transparent 20%,
			transparent 61%,
			transparent 61%,
			transparent 100%
		),
		radial-gradient(
			circle at 13% 77%,
			hsla(317, 0%, 96%, 0.05) 0%,
			hsla(317, 0%, 96%, 0.05) 63%,
			transparent 63%,
			transparent 72%,
			transparent 72%,
			transparent 100%
		),
		radial-gradient(
			circle at 30% 93%,
			hsla(317, 0%, 96%, 0.05) 0%,
			hsla(317, 0%, 96%, 0.05) 33%,
			transparent 33%,
			transparent 82%,
			transparent 82%,
			transparent 100%
		),
		linear-gradient(90deg, rgb(22, 176, 207), rgb(77, 108, 245));
}
/* .login-page.with-background {
    height: 100%;
	width: 100%;
	background-color: hsla(200,40%,30%,.4);
	background-image:		
		url('../images/backgrounds//bg-1.jpg'),
		url('../images/backgrounds//bg-2.jpg'),
		url('../images/backgrounds//bg-3.jpg');
	background-repeat: no-repeat;
    background-position: 
		0 20%,
		0 100%,
		0 50%,
		0 100%,
		0 0;
	background-size: 
		cover,
		cover,
		500px 200px,
		1000px,
		400px 260px;
	animation: 50s para infinite linear;
} */
@keyframes para {
	100% {
		background-position: 
			-5000px 20%,
			-800px 95%,
			500px 50%,
			1000px 100%,
			400px 0;
		}
	}

.lockscreen.with-background {
    /* background: url('../images/bg-login.jpg') !important; */
    background-image: radial-gradient(
			circle at 67% 83%,
			hsla(317, 0%, 96%, 0.05) 0%,
			hsla(317, 0%, 96%, 0.05) 1%,
			transparent 1%,
			transparent 5%,
			transparent 5%,
			transparent 100%
		),
		radial-gradient(
			circle at 24% 80%,
			hsla(317, 0%, 96%, 0.05) 0%,
			hsla(317, 0%, 96%, 0.05) 27%,
			transparent 27%,
			transparent 63%,
			transparent 63%,
			transparent 100%
		),
		radial-gradient(
			circle at 23% 5%,
			hsla(317, 0%, 96%, 0.05) 0%,
			hsla(317, 0%, 96%, 0.05) 26%,
			transparent 26%,
			transparent 82%,
			transparent 82%,
			transparent 100%
		),
		radial-gradient(
			circle at 21% 11%,
			hsla(317, 0%, 96%, 0.05) 0%,
			hsla(317, 0%, 96%, 0.05) 35%,
			transparent 35%,
			transparent 45%,
			transparent 45%,
			transparent 100%
		),
		radial-gradient(
			circle at 10% 11%,
			hsla(317, 0%, 96%, 0.05) 0%,
			hsla(317, 0%, 96%, 0.05) 21%,
			transparent 21%,
			transparent 81%,
			transparent 81%,
			transparent 100%
		),
		radial-gradient(
			circle at 19% 61%,
			hsla(317, 0%, 96%, 0.05) 0%,
			hsla(317, 0%, 96%, 0.05) 20%,
			transparent 20%,
			transparent 61%,
			transparent 61%,
			transparent 100%
		),
		radial-gradient(
			circle at 13% 77%,
			hsla(317, 0%, 96%, 0.05) 0%,
			hsla(317, 0%, 96%, 0.05) 63%,
			transparent 63%,
			transparent 72%,
			transparent 72%,
			transparent 100%
		),
		radial-gradient(
			circle at 30% 93%,
			hsla(317, 0%, 96%, 0.05) 0%,
			hsla(317, 0%, 96%, 0.05) 33%,
			transparent 33%,
			transparent 82%,
			transparent 82%,
			transparent 100%
		),
		linear-gradient(90deg, rgb(22, 176, 207), rgb(103, 7, 215));
}

.with-background-lock {
    background: url('../images/bg-lock.png');
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: center;
    background-size: cover
}

.with-background-global {
    background-color: #000;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: center;
    background-size: cover
}


/* CUSTOMIZE BACKGROUND WITH PHOTO GRID */

.background-photo-grid {
    /* Prevent vertical gaps */
    line-height: 0;
    -webkit-column-count: 5;
    -webkit-column-gap: 0px;
    -moz-column-count: 5;
    -moz-column-gap: 0px;
    column-count: 5;
    column-gap: 0px;
}

.background-photo-grid img {
    /* Just in case there are inline attributes */
    width: 100% !important;
    height: auto !important;
}

@media (max-width: 1200px) {
    .background-photo-grid {
        -moz-column-count: 4;
        -webkit-column-count: 4;
        column-count: 4;
    }
}

@media (max-width: 1000px) {
    .background-photo-grid {
        -moz-column-count: 3;
        -webkit-column-count: 3;
        column-count: 3;
    }
}

@media (max-width: 800px) {
    .background-photo-grid {
        -moz-column-count: 2;
        -webkit-column-count: 2;
        column-count: 2;
    }
}

@media (max-width: 400px) {
    .background-photo-grid {
        -moz-column-count: 1;
        -webkit-column-count: 1;
        column-count: 1;
    }
}


/* END BACKGROUND PHOTO GRID */

span.logo-lg b {
    font-size: 15px;
    line-height: 1;
}

.login-page.with-background .login-logo a {
    color: #ccffcc;
    font-size: 0.9em;
    line-height: 1;
    font-family: 'Solveig'
}

.login-page.with-background .login-logo b {
    color: #ffffff !important;
    font-size: 0.8em;
    font-weight: bold
}

.login-box-body {
    box-shadow: 5px 5px 5px #cccccc
}

.form-group {
    margin-bottom: 3px;
}

.form-group label {
    font-size: 12px
}

.modal-header {
    cursor: move
}

.bottomRightAlert {
    position: fixed;
    right: 0;
    bottom: 50px;
    z-index: 1000;
    padding: 10px;
    border: 1px solid #ffffff;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
}

.topRightAlert {
    position: fixed;
    right: 0px;
    top: 53px;
    z-index: 1000;
    padding: 10px;
    border-top-left-radius: 2px;
    border-bottom-left-radius: 2px;
}

.topCenterAlert {
    position: fixed;
    top: 0;
    margin-left: auto;
    margin-right: auto;
    z-index: 1000;
    padding: 10px;
    border: 1px solid #ffffff;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    line-height: 1;
}

.topCenterAlert p {
    line-height: 1
}

.centerAlert {
    position: fixed;
    top: 52px;
    height: auto;
}

.flag-seller-active {
    position: absolute;
    top: -5px;
    z-index: 1000
}

.alert a.close {
    text-decoration: none;
}

a {}

.input-sm {
    padding: 2px 5px;
}

.less-padding-left {
    padding: 2px;
}

.btn-link {
    cursor: pointer
}

.clearfix {
    margin-top: 10px
}

.clear_search {
    cursor: pointer;
    font-size: 12px;
    z-index: 1000;
    font-style: italic;
}

.clear_search:hover {
    color: #b71c1c
}

.no-decoration {
    text-decoration: none
}

.btn-white {
    background: #fff;
    border: 1px solid #ccc;
    margin-left: 2px;
    margin-right: 2px;
}

.remove_attachment {
    position: absolute;
    top: 1px;
    right: 10px;
}

.btn-white .text-left {
    text-align: left;
}

.btn-white i.icon-calendar {
    position: relative;
    left: -10px;
    padding-right: 5px;
}

.btn-arrow-right,
.btn-arrow-left {
    position: relative;
    padding-left: 18px;
    padding-right: 18px;
}

.btn-arrow-right {
    padding-left: 36px;
}

.btn-arrow-left {
    padding-right: 36px;
}

.btn-arrow-right:before,
.btn-arrow-right:after,
.btn-arrow-left:before,
.btn-arrow-left:after {
    /* make two squares (before and after), looking similar to the button */
    content: "";
    position: absolute;
    top: 5px;
    /* move it down because of rounded corners */
    width: 22px;
    /* same as height */
    height: 22px;
    /* button_outer_height / sqrt(2) */
    background: inherit;
    /* use parent background */
    border: inherit;
    /* use parent border */
    border-left-color: transparent;
    /* hide left border */
    border-bottom-color: transparent;
    /* hide bottom border */
    border-radius: 0px 4px 0px 0px;
    /* round arrow corner, the shorthand property doesn't accept "inherit" so it is set to 4px */
    -webkit-border-radius: 0px 4px 0px 0px;
    -moz-border-radius: 0px 4px 0px 0px;
}

.btn-arrow-right:before,
.btn-arrow-right:after {
    transform: rotate(45deg);
    /* rotate right arrow squares 45 deg to point right */
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
}

.btn-arrow-left:before,
.btn-arrow-left:after {
    transform: rotate(225deg);
    /* rotate left arrow squares 225 deg to point left */
    -webkit-transform: rotate(225deg);
    -moz-transform: rotate(225deg);
    -o-transform: rotate(225deg);
    -ms-transform: rotate(225deg);
}

.btn-arrow-right:before,
.btn-arrow-left:before {
    /* align the "before" square to the left */
    left: -11px;
}

.btn-arrow-right:after,
.btn-arrow-left:after {
    /* align the "after" square to the right */
    right: -11px;
}

.btn-arrow-right:after,
.btn-arrow-left:before {
    /* bring arrow pointers to front */
    z-index: 1;
}

.btn-arrow-right:before,
.btn-arrow-left:after {
    /* hide arrow tails background */
    background-color: white;
}

.pointer {
    cursor: pointer !important;
}

.pointer.pending {
    color: #bf360c !important;
}

.nopointer {
    cursor: text;
}
.cursor-default,.cursor-normal{
    cursor: default
}
li.back-top.pointer>i.fa:hover {
    background: #b0bec5;
    color: #fff
}

li i.arial-black {
    font-family: 'Arial Black';
}

.no-padding-left {
    padding-left: 0
}

canvas.chart-arc {
    background: rgba(158, 158, 158, 3%);
    border-radius: 5px;
}

.timeline {
    position: relative;
    margin: 0 0 10px 0 !important;
    padding: 0;
    list-style: none;
}

.timeline:before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    width: 4px;
    background: #ddd;
    left: 18px !important;
    margin: 0;
    border-radius: 2px;
}

.timeline>li {
    position: relative;
    margin-right: 10px;
    margin-bottom: 15px;
}

.timeline>li>.timeline-item {
    margin-left: 40px !important;
    margin-right: 0px !important;
}

.timeline>li>.fa,
.timeline>li>.glyphicon,
.timeline>li>.ion {
    width: 30px;
    height: 30px;
    font-size: 15px;
    line-height: 30px;
    position: absolute;
    color: #666;
    background: #d2d6de;
    border-radius: 50%;
    text-align: center;
    padding: 2px;
    left: 5px !important;
    top: 0;
}

li.rejectmodel-item {
    margin-left: 10px
}

li.rejectmodel-item:before {
    font-family: FontAwesome;
    content: "\f105";
    position: absolute;
    left: 0px;
}

.timeline>.time-label>span {
    font-weight: 600;
    margin-left: 2px;
    padding: 5px 10px 5px 10px;
    display: inline-block;
    background-color: #fff;
    border-radius: 4px;
}

#selectDay {
    padding: 4px 5px;
    border-radius: 0;
    border-top-left-radius: 3px;
    border-bottom-left-radius: 3px;
    margin-left: 2px;
    background: #fff;
    border: 1px solid #bdbdbd;
    border-right: 0px
}

#selectDay.bg-white {
    padding: 4px 5px;
    margin-left: 2px;
    background: #fff;
}

#resetSelectDay {
    padding: 4px 5px;
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;
    background: #fff;
    border: 1px solid #bdbdbd;
    margin-right: 3px;
}

#resetSelectDay.bg-white {
    padding: 4px 5px;
    margin-left: 2px;
    background: #fff;
}

h4.font-title a {
    font-size: 0.7em;
}

.box-group.box-group-custom .panel.box .box-header {
    padding: 2px 5px;
}

.box-group.box-group-custom .panel.box .box-header.with-border {
    border-top: none;
}

.box-header.with-border.border-primary {
    border-bottom: 1px solid #bbdefb
}

textarea.reject_desc {
    resize: none
}

textarea.no-scroll {
    resize: none
}

textarea.no-scroll-x {
    resize: vertical
}

ol.breadcrums {}

ol.breadcrums li {
    list-style: none;
    display: inline-block
}

ol.breadcrumb li a {
    color: #ffffff;
}

ol.breadcrumb li a.btn[class!='btn-default'] {
    color: #fff
}

ol.breadcrumb li a.btn[class!='btn-default']:selected {
    color: #fff
}

body.modal-open .modal[style]:not([style='display: none;']) {
    display: flex !important;
    height: 100%;
}

body.modal-open .modal[style]:not([style='display: none;']) .modal-dialog {
    margin-right: auto;
    margin-left: auto;
}

#modalDetail .modal-dialog.modal-lg {
    width: 80%;
}
.modal-xl{
    width: 85%;
}

table.tableInfoModal {
    border: 1px solid #39CCCC;
}

table.tableInfoModal td {
    padding: 5px;
    vertical-align: top;
}

button.no-padding {
    padding: 0;
}

table.tabledetail {
    font-size: 13px;
}

table#tRepairYearly tbody tr td {
    text-align: center
}

table.tabledetail tbody tr td {
    padding: 5px 3px;
    vertical-align: top;
}

table#tRepairYearly tbody tr td.total {
    color: #311b92;
    font-weight: bold;
}

.btn.no-link {
    cursor: default
}

.text-white {
    color: #fff;
}

.text-purple {
    color: #4a148c;
}

.no-cursor {
    cursor: default
}

.Sunday {
    color: #c62828;
}

.Saturday {
    color: #d50000;
}

.Holiday {
    background: #ffe57f;
}

.Sunday.Holiday {
    background-image: -ms-linear-gradient(top left, #FFE57F 50%, #CCFF90 50%);
    background-image: -moz-linear-gradient(top left, #FFE57F 50%, #CCFF90 50%);
    background-image: -o-linear-gradient(top left, #FFE57F 50%, #CCFF90 50%);
    background-image: -webkit-gradient(linear, left top, right bottom, color-stop(50, #FFE57F), color-stop(50, #CCFF90));
    background-image: -webkit-linear-gradient(top left, #FFE57F 50%, #CCFF90 50%);
    background-image: linear-gradient(to bottom right, #FFE57F 50%, #CCFF90 50%);
}

table tr td:not([class*="bg-"]) {
    position: relative;
}

table tr td.bg-warning {
    border: 1px solid #ccc !important
}

table tr td .ribbon {
    position: absolute;
    top: -5px;
    width: 5px;
    height: 5px;
    cursor: help;
    z-index: 9001
}

table tr td .ribbon.left {
    left: 0;
}

table tr td .ribbon.right {
    right: 0;
}

.ribbon .fa {}

.cursor-help {
    cursor: help;
}

.font-8px {
    font-size: 8px;
}

.Saturday.Holiday {
    background-image: -ms-linear-gradient(bottom right, #B2FF59 50%, #FFE57F 50%);
    background-image: -moz-linear-gradient(bottom right, #B2FF59 50%, #FFE57F 50%);
    background-image: -o-linear-gradient(bottom right, #B2FF59 50%, #FFE57F 50%);
    background-image: -webkit-gradient(linear, right bottom, left top, color-stop(50, #B2FF59), color-stop(50, #FFE57F));
    background-image: -webkit-linear-gradient(bottom right, #B2FF59 50%, #FFE57F 50%);
    background-image: linear-gradient(to top left, #B2FF59 50%, #FFE57F 50%);
}

.bg-noday {
    background: #e0e0e0;
    background-image: -ms-linear-gradient(top, #f6f8f9 0%, #D7DEE3 51%, #f5f7f9 100%);
    background-image: -moz-linear-gradient(top, #f6f8f9 0%, #D7DEE3 51%, #f5f7f9 100%);
    background-image: -o-linear-gradient(top, #f6f8f9 0%, #D7DEE3 51%, #f5f7f9 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #f6f8f9), color-stop(51, #D7DEE3), color-stop(100, #f5f7f9));
    background-image: -webkit-linear-gradient(top, #f6f8f9 0%, #D7DEE3 51%, #f5f7f9 100%);
    background-image: linear-gradient(to bottom, #f6f8f9 0%, #D7DEE3 51%, #f5f7f9 100%);
}

.bg-cyan {
    background: #4dd0e1;
    color: #fff
}

.bg-transparent {
    background: rgba(0, 25, 0, 0.2) !important;
}

.badge.badge-flat {
    border-radius: 3px !important;
    margin-left: 2px;
}

.permodel {
    margin-bottom: 2px;
}

.summaryModel {
    margin-bottom: 5px;
}

.text-12 {
    font-size: 12px;
}

.bg-yellow-light {
    background: rgb(238, 255, 65) !important;
    color: #0d47a1;
}

.bg-yellow-light {
    background: rgb(238, 255, 65, 0.3) !important;
}

.bg-yellow-light-header,
th.bg-yellow-light {
    background: rgb(244, 255, 8)
}

.bg-yellow-extra-light {
    background: rgba(255, 235, 59, 0.3)
}

.bg-yellow-extra-light-header,
th.bg-yellow-extra-light {
    background: rgba(255, 235, 59, 0.7)
}

.bg-green-light {
    background: rgb(178, 255, 89) !important;
}

.bg-green-light1 {
    background: #76ff03 !important;
}

th.bg-green-light1 {
    background: #76ff03 !important;
}

.bg-green-extra-light {
    background: rgb(178, 255, 89, 0.3)
}

.bg-green-extra-light-header,
th.bg-green-extra-light {
    background: rgb(178, 255, 89, 0.7)
}

.bg-blue-light {
    background: rgb(144, 202, 249) !important;
}

.bg-lime {
    background: rgb(244, 255, 129, 0.7)
}

.bg-lime-header,
th.bg-lime {
    background: rgb(244, 255, 129, 0.3)
}

.bg-blue-light {
    background: rgb(144, 202, 249, 0.3) !important;
    color: #4a148c;
}

.bg-red-light {
    background: rgb(244, 67, 54) !important;
}

.bg-warning-header,
th.bg-warning:not(.days) {
    background: #ffecb3
}

input.bg-warning,
textarea.bg-warning {
    background: #ffecb3;
}
input.font-14,
textarea.font-14{
    font-size: 14px
}

.bg-info-header,
th.bg-info:not(.days) {
    background: rgb(0, 190, 255, 0.3)
}

.bg-success-header,
th.bg-success:not(.days) {
    background: #c1e2b3
}

.bg-purple-light1-header,
th.bg-purple-light1 {
    background: rgb(209, 196, 233, 0.6)
}

.bg-purple-light1 {
    background: #ede7f6
}


/* td.bg-red-light{
	background: rgb(244,67,54,0.3) !important;
} */

.bg-pink-light1 {
    background: rgb(244, 143, 177) !important;
}

.bg-pink-light {
    background: #fce4ec !important;
}

@media screen and (min-width:900px) {
    #modalDetail .modal-dialog {
        width: 90%
    }
    .right-md {
        float: right !important;
    }
    .left-md {
        float: left !important;
    }
}

@media screen and (max-width: 450px) {
    section.content-header h1 {
        font-size: 20px !important;
        font-weight: 600;
    }
    .row-xs {
        display: block !important;
        line-height: 1.5;
    }
    sup.row-xs {}
    .right-xs {
        text-align: right;
    }
    .left-xs {
        float: left !important;
    }
}

.countermeasure_content {
    padding: 3px;
    margin-left: 10px;
}

.popover {}

.popover-content {
    font-size: 10px;
    max-height: 300px;
    overflow-y: auto
}

li div.li-content {
    display: block;
    padding-left: 5px;
}

.input-setting-printer {
    border: 1px solid #ccc;
}

.input-setting-printer.form-control {
    width: 100px;
}

.input-setting-printer:focus {
    border: 1px solid blue;
}

.no-border-right {
    border-right: 0
}

.no-border-left {
    border-left: 0
}

.form-inline.group-footer-setting {
    position: relative;
    float: right;
    display: inline-block;
}

.form-inline.group-footer-setting .printer-set {
    display: inline-block;
}

.printer-set {
    margin-right: 5px;
    line-height: 1.5;
    margin-top: 5px
}

table.XdataTable {
    margin: 0 auto;
    width: 100%;
    clear: both;
    border-collapse: collapse;
    table-layout: fixed;
    word-wrap: break-word;
}

.XdataTables_scrollBody thead {
    visibility: collapse
}

.XdataTables_scrollBody {
    scrollbar-width: thin;
    width: 102%;
    padding-right: 0;
    padding-bottom: 15px;
}

.XdataTables_scrollBody tbody {}

.dataTables_processing {
    z-index: 5000;
}

table.XdataTable.minimize-padding-all {
    margin-bottom: 0px;
}

table.XdataTable.minimize-padding-all thead th {
    /* background:  #bbdefb; */
}

/* table.dataTable.minimize-padding-all thead th, */
table.dataTable.minimize-padding-all tbody td,
table.dataTable.minimize-padding-all tfoot th,
table.dataTable.minimize-padding-all tfoot td {
    padding-left: 7px;
    padding-right: 12px;
    padding-top: 5px !important;
    padding-bottom: 5px !important;
    vertical-align: top;
}

table.XdataTable.minimize-padding-all tbody td .less-padding-input {
    padding: 2px !important;
}

table.XdataTable.minimize-padding-all tfoot th.text-right {
    text-align: right;
}

table.XdataTable.minimize-padding-all.cell-border thead tr th,
table.XdataTable.minimize-padding-all.cell-border tfoot tr th,
table.XdataTable.minimize-padding-all.cell-border tbody tr td,
table.XdataTable.minimize-padding-all.cell-border tfoot tr td {
    border: 1px solid #ccc;
}

table.XdataTable.minimize-padding-all.cell-border thead tr:last-child th {
    border-bottom: 2px solid #ccc;
}

table.XdataTable.minimize-padding-all.cell-border thead tr.bottom-border-double th {
    border-bottom: 3px double #ccc;
}

input.qty-item[readonly] {
    background: transparent;
    border: 0px;
}

input.qty-item {
    width: 100%;
    border: 1px solid #ccc;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -ms-border-radius: 2px;
    -o-border-radius: 2px;
}

table.XdataTable.minimize-padding-all tbody td button.btn,
table.XdataTable.minimize-padding-all tfoot td button.btn {
    margin-top: -1px !important;
    padding: 2px !important;
}

table.XdataTable.minimize-padding-all tbody td ul {
    position: relative;
    top: 6px;
}

table.XdataTable.minimize-padding-all tbody td.text-top {
    padding-top: 8px !important;
}

table.XdataTable.minimize-padding-all tbody td.text-top .btn {
    margin-top: 4px !important;
}


/*
table.XdataTable.minimize-padding-all.text-center thead th,table.XdataTable.minimize-padding-all tbody td.text-center{
	text-align: center;
}
*/

table.XdataTable thead th.text-left,
table.XdataTable body td.text-left {
    padding-left: 3px !important;
}

table.XdataTable tbody td.text-middle {
    vertical-align: middle
}

table.XdataTable.minimize-padding-all thead th,
table.XdataTable.minimize-padding-all tfoot th {
    padding-top: 5px;
    padding-bottom: 5px;
    vertical-align: middle;
}

table.XdataTable.minimize-padding-all thead th.sorting_disabled.text-left,
table.XdataTable.minimize-padding-all tfoot th.sorting_disabled.text-left {
    padding-left: 10px !important;
}

table.XdataTable thead th.text-left.sorting,
table.XdataTable tfoot th.text-left.sorting {
    padding-left: 10px !important;
}

table.XdataTable {}


/* icon down */

table.XdataTable.minimize-padding-all.dtr-inline.collapsed>tbody>tr>td:first-child::before,
table.minimize-padding.XdataTable.dtr-inline.collapsed>tbody>tr>th:first-child::before {
    background-color: #31b131;
    height: 12px !important;
    width: 12px !important;
    font-family: "FontAwesome";
    line-height: 1 !important;
    content: "\f107";
}

table.XdataTable.minimize-padding-all.dtr-inline.collapsed>tbody>tr.parent>td:first-child::before,
table.XdataTable.dtr-inline.collapsed>tbody>tr.parent>th:first-child::before {
    background: #b71c1c;
    height: 12px !important;
    width: 12px !important;
    line-height: 0.8 !important;
    font-family: "FontAwesome";
    content: "\f106";
    margin-top: auto !important;
    margin-bottom: auto !important;
}

table.XdataTable.minimize-padding-all.margin-top-5.dtr-inline.collapsed>tbody>tr.parent>td:first-child::before,
table.XdataTable.margin-top-5.dtr-inline.collapsed>tbody>tr.parent>th:first-child::before,
table.XdataTable.minimize-padding-all.margin-top-5.dtr-inline.collapsed>tbody>tr>td:first-child::before,
table.minimize-padding.margin-top-5.XdataTable.dtr-inline.collapsed>tbody>tr>th:first-child::before {
    margin-top: -5px !important;
}

.XdataTables_length,
.XdataTables_paginate {
    margin-top: 7px;
}

.XdataTables_paginate {
    margin-top: 3px
}

.XdataTables_wrapper .XdataTables_info {
    clear: none;
    color: #0099CC
}


/* set span width for responsive table */

table tr.child td.child ul li span.dtr-title {
    min-width: 100px !important;
    float: left !important;
}

.XdataTables_paginate.paging_simple_numbers {
    margin-left: 10px;
    margin-right: 10px;
}

.XdataTables_paginate.paging_simple_numbers a.paginate_button {
    padding: 3px 6px !important;
}

.XdataTables_wrapper {}

.XdataTables_wrapper table thead {
    border: 0 !important;
}

.XdataTables_wrapper .XdataTables_length,
.XdataTables_wrapper .XdataTables_info {
    margin-left: 10px !important;
}

.XdataTables_wrapper .XdataTables_filter {
    margin-right: 10px !important;
}

.XdataTables_wrapper .XdataTables_length select {
    border: 1px solid #bdbdbd !important;
    border-radius: 2px;
    padding: 2px 5px !important;
}

.XdataTables_wrapper .XdataTables_filter input {
    border: 1px solid #bdbdbd !important;
    border-radius: 2px;
    padding: 2px 5px !important;
}

.XdataTables_wrapper .XdataTables_filter input:focus {
    border: 1px solid #90caf9 !important;
    border-radius: 2px;
}

.filter-area .search-form-inline {
    display: inline-block;
    max-width: 250px;
}

.filter-area .search-form-inline-group {
    display: inline-block;
}


/* CSS for customSearch */

.search-form-inline.no-border {
    border: 0;
    display: inline-block;
    margin-left: 0px;
    margin-bottom: 5px;
    z-index: 1000;
    max-width: 250px;
}
.search-form-inline .smalltext-insearch{
    position: absolute; top: 33px;margin-left: 6px;line-height: 1;height: auto;
    font-size: 0.8em
}
.search-form-inline-group.no-border {
    border: 0;
    display: inline-block;
    margin-left: 6px;
    margin-bottom: 5px;
    z-index: 1000;
}

.search-form-inline .input-group-addon {
    cursor: pointer;
}

.search-form-inline .inline-label,
.search-form-inline-group .inline-label {
    position: relative;
}

.search-form-inline .inline-label.label-checkbox,
.search-form-inline-group .inline-label.label-checkbox {
    position: relative;
    top: 0;
}

.search-form-inline .control-label,
.search-form-inline-group .control-label {
    position: relative;
    top: -2px;
    margin-left: 10px !important;
}

.search-form-inline label input[type='radio'],
.search-form-inline label input[type='checkbox'],
.search-form-inline-group label input[type='radio'],
.search-form-inline-group label input[type='checkbox'] {
    position: relative;
}

.search-form-inline.padding-left-5 {
    padding-left: 5px
}


/* End Of CSS for customSearch */

.dt-buttons {
    margin-bottom: 10px;
    padding: 4px;
}

.dt-buttons.inline-block {
    display: inline-block;
    position: relative;
    top: -5px;
    margin-left: 5px;
}

.dt-buttons.pull-right {
    float: right;
}

.dt-buttons.margin-left {
    margin-left: 20px;
}

.dt-buttons .dt-button {
    padding: 3px 6px;
    font-size: 14px;
    font-weight: normal;
    line-height: 1.42857143;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border: 1px solid transparent;
}

.dt-buttons.pull-bottom {
    margin-bottom: 0;
    margin-left: 0;
}

.dt-buttons.right {
    float: right;
    margin-right: 10px;
}


.modal-body table tr th,
.modal-body table tr td,
.modal-body .XdataTables_wrapper {
    font-size: 11px;
}

table.XdataTable.no-footer {}

table.XdataTable th,
table.XdataTable.small-font th {
    font-size: 13px;
    vertical-align: top;
}

table.XdataTable td,
table.XdataTable.small-font td {
    font-size: 13px;
}

.small-font {
    font-size: 13px;
}

@media screen(max-width: 800px) {
    table tr.child td.child ul li span.dtr-title {
        min-width: 80px !important;
    }
}

.ucwords {
    text-transform: capitalize;
}

.timeline-footer {
    position: relative;
}

.absolute {
    position: relative;
}

.item-followup .post .h4.box-title {
    padding-top: 0;
    margin-top: 0;
}

.item-followup blockquote footer {
    position: sticky;
    bottom: 0px !important;
}

textarea.followup.live-update {
    height: 130px;
    overflow-y: auto;
    overflow-x: hidden;
}

ul.nav.nav-tabs li.active {
    background: #ff0000
}

.border-top {
    border: none;
    border-top: 2px solid #bdbdbd;
    border-radius: 2px;
}

.border-top .box-header {
    border-right: 1px solid #e0e0e0;
    border-left: 1px solid #e0e0e0;
}

.item-followup blockquote {
    padding: 5px 8px;
}

.modal-body blockquote {
    font-size: 13px;
    padding: 2px 5px;
}

h5.blockquote-title {
    margin-bottom: 2px;
    font-weight: 100
}

.text-line {
    white-space: pre-wrap;
    /* css-3 */
    white-space: -moz-pre-wrap;
    /* Mozilla, since 1999 */
    white-space: -pre-wrap;
    /* Opera 4-6 */
    white-space: -o-pre-wrap;
    /* Opera 7 */
    word-wrap: break-word;
    /* Internet Explorer 5.5+ */
}

.modal-body blockquote p.text-line,
.modal-body blockquote div.text-line {
    padding: 0;
    padding-left: 10px;
    white-space: pre-wrap;
    /* css-3 */
    white-space: -moz-pre-wrap;
    /* Mozilla, since 1999 */
    white-space: -pre-wrap;
    /* Opera 4-6 */
    white-space: -o-pre-wrap;
    /* Opera 7 */
    word-wrap: break-word;
    /* Internet Explorer 5.5+ */
    color: #616161 !important;
}

.modal-body blockquote.link_update {
    height: 140px;
}

.modal-body blockquote.link_update div {
    height: 130px;
    overflow-x: hidden;
    overflow-y: auto;
    position: relative;
}

.modal-body blockquote.link_update footer {
    position: sticky;
    bottom: 0;
}


/*
textarea.live-update{
	overflow: hidden;
	resize: none
}
*/

.item-followup blockquote {
    height: 140px;
    position: relative;
}

.item-followup blockquote p,
.item-followup blockquote div {
    font-size: 14px;
    font-family: 'Arial';
    font-weight: normal;
    background: none;
    margin: 0;
    padding: 0;
    border: none;
    height: 130px;
    overflow-y: auto;
    overflow-x: hidden;
    white-space: pre-wrap;
    /* css-3 */
    white-space: -moz-pre-wrap;
    /* Mozilla, since 1999 */
    white-space: -pre-wrap;
    /* Opera 4-6 */
    white-space: -o-pre-wrap;
    /* Opera 7 */
    word-wrap: break-word;
    /* Internet Explorer 5.5+ */
}

select.btn.btn-sm {
    height: 30px;
}

.btn-default.followup-link {
    color: #2196f3
}
.btn.btn-purple{
    background: #aa66cc;
    color: #ffffff;
}
.item-followup blockquote textarea {
    border: 1px solid #e0e0e0 !important;
    resize: none;
    font-size: 14px;
    font-family: 'Arial'
}

.item-followup blockquote textarea:focus {
    border: 1px solid #bbdefb;
}

.item-followup blockquote footer {
    position: sticky;
    bottom: 0;
    font-size: 12px;
    font-style: italic;
}

.border-grey {
    border: 1px solid #e0e0e0
}

.title-skin-grey {
    padding: 10px;
    background: #fafafa;
    border: 1px solid #e0e0e0;
    border-radius: 3px;
    opacity: 0.8
}

.title-skin-grey:hover {
    opacity: 1
}

.title-skin-grey.opacity-1 {
    opacity: 1;
}

.body-skin {
    padding: 3px auto;
    padding-bottom: 5px;
}

.body-skin.with-border {
    border: 1px solid #e0e0e0;
}

.body-skin-grey {
    padding: 3px auto;
    padding-bottom: 5px;
    background: #e8eaf6;
    border: 1px solid #e0e0e0;
    border-radius: 3px
}

.body-skin-grey.no-bg {
    background: none
}

.tableRejectModel .panel {
    margin-bottom: 5px;
}

.panel.less-padding {
    border-top: ;
}

.panel.less-padding.box.no-border {
    border: none;
}

.panel.less-padding .box-header {
    padding: 5px 20px 5px 20px;
}

.panel.less-padding .box-body {
    padding: 3px;
    margin-bottom: 0;
}

.panel.less-padding .box-header h5 {
    font-size: 14px;
    text-transform: capitalize !important;
    padding: 5px;
}

.tableRejectModel table.XdataTable {
    font-size: 12px !important;
}

canvas {
    padding: 10px;
    border-radius: 3px;
}

canvas.bg-cyanLight {
    background: rgba(0, 188, 212, 0.02);
}

canvas.with-border {
    border: 1px solid #b2dfdb;
}

.box-header.less-padding {
    padding: 5px 10px !important;
}

.box-header.less-padding h5.box-title {
    font-size: 14px
}

.link {
    font-style: italic;
    cursor: pointer;
}

.text-blue-light {
    color: #64b5f6
}

.link:hover {
    text-decoration: underline;
    color: #0d47a1
}

.input.noborder {
    border: none;
    width: auto;
    max-width: 100px
}

.styled-select select {
    appearance: none;
    -moz-appearance: none;
    /* Firefox */
    -webkit-appearance: none;
    /* Safari and Chrome */
    padding-left: 10px
}

.styled-select i.select {
    position: relative;
    left: -5px
}

table.XdataTable.minimize-padding tbody td {
    padding-top: 3px;
    padding-bottom: 3px;
    vertical-align: top;
}

h5.tableRejectModel-title {
    margin-bottom: 2px;
}

div.pieSourceArea {
    position: relative;
    overflow: auto;
}

div.pieSourceArea .pie-d3 svg {
    background: #f5f5f5;
    border: 1px solid #9e9e9e;
    border-radius: 3px;
}

.pie-d3#pie-all svg {
    height: 500px !important;
    padding-top: 10px !important;
}

.abs-left {
    position: absolute;
    left: -10px;
    margin-right: 10px;
}

.abs-right {
    position: absolute;
    right: -5px;
    top: 0;
}

.panel-less-padding .box-header a {
    margin-right: 10px;
    position: relative;
    background: #ff0000
}

.panel-less-padding .box-header h5 a .pull-right {
    position: absolute;
    top: 0;
    right: 0
}

.progress.less-padding {
    margin-top: 5px;
    margin-bottom: 3px;
}

.qtytotal {
    font-weight: bold;
}

.border-site-name {
    position: relative;
    /*
	background: -webkit-linear-gradient(#ffffff,#ffbb33);
	  -webkit-background-clip: text;
	  -webkit-text-fill-color: transparent;
	 */
}

.border-site-name:hover {
    color: #fff
}

.border-site-name:before,
.border-site-name:after {
    content: "";
    position: absolute;
    bottom: -3px;
    left: -3px;
}

.border-site-name:after {
    right: -3px;
    height: 2px;
    background-image: -webkit-gradient(linear, 0 0, 100% 0, from(#76ff03), to(transparent));
    background-image: -webkit-linear-gradient(left, transparent, #76ff03, transparent);
    background-image: -moz-linear-gradient(left, transparent, #76ff03, transparent);
    background-image: -o-linear-gradient(left, transparent, #76ff03, transparent);
}

.XdataTables_scroll {}

.popover-heading {
    font-weight: bold;
    font-size: 14px;
    font-family: 'Comic sans-serif';
    padding: 5px 10px;
    text-transform: uppercase
}

.popover-body table {
    width: 500px;
    overflow-y: auto
}

.popover-body table thead tr th {
    padding: 5px;
    vertical-align: middle;
}

.popover-body table tr td {
    vertical-align: top;
    padding: 5px;
}

table#tReport th {
    vertical-align: middle;
}

table#tReport th.fixed {
    height: 30px;
    vertical-align: middle
}

table#tReport tbody td {}

table#tReport tbody td ul li {
    text-align: center;
    vertical-align: middle;
}

table tr th.text-middle,
table tr td.text-middle {
    vertical-align: middle !important;
}

table#tReport tbody tr td {
    padding-top: 4px;
    padding-bottom: 0px;
}

table tr td.text-top .btn {
    position: relative;
    top: -9px;
}

table tr td.text-top ul.table-ul {
    top: 1px;
}

table tr td.text-middle .btn {
    position: relative;
    top: 0
}

table#tRepairDaily.minimize-padding-all.collapsed {
    border-spacing: 0px !important;
    border-collapse: collapse
}

table#tRepairDaily.minimize-padding-all th:first-child,
table#tRepairDaily.minimize-padding-all td:first-child {
    border-top: 0px !important
}

table#tRepairDaily.minimize-padding-all thead th.less-padding,
table#tRepairDaily.minimize-padding-all tbody td.less-padding {
    padding-left: 4px !important;
    padding-right: 4px !important;
}

table.boder-outside {
    border: 1px solid #000;
}

.text-normal {
    font-weight: normal
}

.font-serif {
    font-family: 'Comic Sans Serif'
}

.content-header h1 {
    font-family: 'Comic Sans Serif'
}

table tr td ul.table-ul {
    padding-left: 1px;
    position: relative;
    top: 10px;
    list-style-type: none;
}

table tr td ul.table-ul i {
    padding-right: 7px;
}

table tr td ul.table-ul li,
table tr td ul.table-ul li ul {
    list-style-type: none;
    padding-left: 0px;
}

table tr td ul.table-ul li ul li {
    display: none;
    line-height: 2
}

table tr td ul.table-ul li ul li {
    list-style-type: none;
    padding-left: 3.3em;
    line-height: 2
}

table tr td ul.table-ul li i,
table tr td ul.table-ul li ul i,
table tr td ul.table-ul li ul li i {}

table tr td ul.table-ul li ul li i {
    position: absolute;
    left: 20px;
    padding-top: 5px;
    font-weight: normal;
}
table tr td, table tr th{
    padding: 2px 3px
}
td.valign-top {
    vertical-align: top;
}

td.valign-middle {
    vertical-align: middle;
}


/*
table tr td ul.table-ul li ul li:before{
  content: attr('ul-li-icon'); 
  font-family: FontAwesome;
  color: #FF7777;
  display: inline-block;
  margin-left: -1.3em; 
  width: 1.3em; 
}
*/

table tr td ul.table-ul.no-icon {
    padding-left: 2em;
}


/* back to top */

.back-to-top {
    background: none;
    margin: 0;
    position: fixed;
    bottom: 5px;
    right: 11px;
    width: 40px;
    height: 35px;
    z-index: 100;
    display: none;
    text-decoration: none;
    color: #ffffff;
    background-color: #ff9000;
    opacity: 0.5
}

.back-to-top:hover {
    opacity: 0.8
}

.back-to-top i {
    font-size: 22px;
}
ol.striped-list > li:nth-of-type(odd) ,
ul.striped-list > li:nth-of-type(odd) {
    background-color: #ddd ;
}

/* end back to top */


/* form changes control */

@media only screen and (min-width: 800px) {
    div.changes_area {
        position: fixed;
        top: 189px;
        right: 0px;
        z-index: 300
    }
}

.with-bg-white {
    background: #eee;
}

.bs-callout {
    padding: 0;
    margin: 10px 0;
    border: 1px solid #eee;
    border-left-width: 5px;
    border-radius: 3px;
}

.bs-callout h4 {
    margin-top: 0;
    margin-bottom: 5px;
    padding: 2px 15px 4px 5px;
    font-size: 14px;
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    border-bottom: 1px solid #f5f5f5;
    border-right: 1px solid #ccc;
    border-bottom-right-radius: 5px;
    width: auto;
    display: inline;
}

.bs-callout .bs-callout-content {
    padding: 5px;
}

.bs-callout .bs-callout-content label.btn {
    margin: 2px;
}

.bs-callout p:last-child {
    margin-bottom: 0;
}

.bs-callout code {
    border-radius: 3px;
}

.bs-callout+.bs-callout {
    margin-top: -5px;
}

.bs-callout-default {
    border-left-color: #777;
}

.bs-callout-default h4 {
    color: #777;
}

.bs-callout-primary {
    border: 1px solid #428bca;
    border-left-width: 5px;
    border-left-color: #428bca;
}

.bs-callout-primary h4 {
    color: #428bca;
}

.bs-callout-success {
    border-left-color: #5cb85c;
}

.bs-callout-success h4 {
    color: #5cb85c;
}

.bs-callout-danger {
    border-left-color: #d9534f;
}

.bs-callout-danger h4 {
    color: #d9534f;
}

.bs-callout-warning {
    border-left-color: #f0ad4e;
}

.bs-callout-warning h4 {
    color: #f0ad4e;
}

.bs-callout-info {
    border-left-color: #5bc0de;
}

.bs-callout-info h4 {
    color: #5bc0de;
}

.bs-callout.border-dotted-primary {
    border-top: 1px dotted #428bca;
    border-right: 1px dotted #428bca;
    border-bottom: 1px dotted #428bca;
}

.bs-callout.less-padding div {
    padding: 5px;
    margin: 2px;
}

.bs-callout.less-padding ul {
    padding: 5px 5px 5px 15px;
    margin: 2px;
}

.box.with-full-border {
    border-left: 1px solid #d2d6de;
    border-right: 1px solid #acbad6;
}

.modal-body .box h5.box-title {
    font-size: 15px;
    padding: 2px;
    font-weight: bold;
    font-family: 'Calibri'
}

.modal-icon {
    font-size: 18px;
    padding: 2px 7px;
    border-radius: 2px;
}


/* select 2 
https://github.com/techhysahil/Select2-Flat-UI/blob/master/Overide.css
*/

.select2-container {
    text-align: left;
}

.select2-container span span span {
    position: relative;
    top: -2px;
}

.form-group .select2-container {
    display: block;
}

.select2-dropdown,
.select2-container--default .select2-selection--single {
    border-radius: 0px !important;
}

.select2-results__group {
    color: #3F729B;
    font-style: italic;
    background: #eeeeee;
}

time.timeago {}

.summarymodel-title {
    margin-bottom: 4px;
    font-weight: bold;
    text-transform: uppercase;
    cursor: default;
}

.summaryModel {
    overflow-y: auto;
    max-height: 399px;
    background: #cfd8dc;
}

.summaryModel .external-event {
    cursor: default;
    font-size: 14px;
    font-weight: normal;
    font-family: 'Arial'
}


/* customer backgroun */

.bg-purple {
    background: #aa00ff;
    color: #fff;
}

.bg-purple-accent {
    background: #e040fb;
    color: #000;
}

.bg-purple-darken {
    background: #4a148c;
    color: #fff;
}

.bg-purple-dark {
    background: #7b1fa2;
    color: #fff;
}

.bg-purple-light {
    background: #e1bee7;
    color: #000
}

.bg-blue-light {
    background: #039be5;
    color: #fff;
}

.bg-yellow-accent {
    background: #ffea00;
    color: #fff;
}

.bg-indigo {
    background: #3f51b5;
    color: #fff;
}

.bg-indigo-light {
    background: #9fa8da;
    color: #000;
}

.bg-indigi-darken {
    background: #1a237e;
    color: #fff;
}

.bg-green {}

.bg-green-light {
    background: #76ff03;
    color: #000;
}

.bg-green-accent {
    background: #64dd17;
    color: #fff;
}

.bg-green-light2 {
    background: #00e676;
    color: #000
}

.bg-green-dark {
    background: #00c853;
    color: #fff;
}

.bg-yellow {
    background: #ffee58 !important;
    color: #0277bd !important;
}

[input:required].bg-yellow {
    background: #ffee58 !important;
    color: #0277bd !important;
}

.bg-yellow-darken {
    background: #f9a825;
    color: #fff;
}

.bg-cyan-accent {
    background: #18ffff;
    color: #000;
}

.bg-cyan-dark {
    background: #00b8d4;
    color: #fff;
}

.bg-cyan-light {
    background: #84ffff;
    color: #000;
}

.bg-pink-light {
    background: #f8bbd0;
    color: #000
}

.bg-pink-accent {
    background: #f48fb1;
    color: #000;
}

.bg-pink-darken {
    background: #d81b60;
    color: #fff;
}

.bg-red-light {
    background: #ffcdd2;
    color: #000;
}

.progress-bar-grey {
    background: #e0e0e0;
    height: 1px
}

#loader {
    position: fixed;
    z-index: 3000
}

.form-login {
    position: fixed;
    right: -13px;
    top: 50px;
    z-index: 5000;
}

.panel-purple {
    padding: 0;
    margin: 0;
}

.panel-purple .panel-heading.bg-purple {
    background: #605ca8;
    color: #fff
}


/* CSS talk bubble */

.talk-bubble {
    margin: 12px;
    display: inline-block;
    position: relative;
    background-color: #fff
}

.border {
    border: 2px solid #605ca8;
}

.round {
    border-radius: 5px;
}

.tri-right.right-top:before {
    content: ' ';
    position: absolute;
    width: 0;
    height: 0;
    left: auto;
    right: 0px;
    top: -30px;
    bottom: auto;
    border: 15px solid;
    border-color: transparent transparent #605ca8 transparent;
}


/* talk bubble contents */

.talktext {
    padding: 1em;
    text-align: left;
    line-height: 1.5em;
}

.talktext p {
    /* remove webkit p margins */
    -webkit-margin-before: 0em;
    -webkit-margin-after: 0em;
}


/* .ui-datepicker-div {
    z-index: 5000
}

.datepicker-years span.year.disabled,
.datepicker-months span.month.disabled,
.datepicker-days span.day.disabled {
    color: #cfd8dc;
}

.datepicker-years span.year.disabled:hover.datepicker-months span.month.disabled:hover,
.datepicker-days span.day.disabled:hover {
    color: #b0bec5;
}
 */

.datepicker-inline {
    width: 100%;
}

.datepicker table {
    width: 100%;
}

.input-group .form-control {
    z-index: 0;
}

.form-control:focus {
    border: 1.6px outset #00b8d4
}

.form-control.no-bg {
    background: none;
}

.form-control.no-padding-left {
    padding-left: 0;
}

.input-group .form-control.input-sm {
    padding: 2px 5px !important;
}

.input-group-radio label {
    padding: 1px 5px 2px 5px;
    border-radius: 2px;
}

.search-form-inline .input-group .btn {
    padding: 0px 5px;
}

.form-control.input-no-border {
    border: 0px;
    background: transparent;
}

div.callout.less-padding {
    padding: 2px 5px !important;
}
div.callout.less-padding ul{
    margin-bottom: 3px
}
div.callout .editable {
    line-height: 1;
    min-height: 80px
}

div.callout .editable:focus {
    border: 1px dotted #ff0000 !important;
}

.dropdown.user.user-menu a.dropdown-toggle {
    height: 50px;
}

.dropdown-submenu {
    position: relative;
}

.dropdown-menu.multi-level>.dropdown-submenu>.dropdown-menu {
    display: none !important;
}

.dropdown-submenu>ul.dropdown-menu {
    top: 0;
    left: 100%;
    margin-top: -6px;
    margin-left: -1px;
    -webkit-border-radius: 0 6px 6px 6px;
    -moz-border-radius: 0 6px 6px;
    border-radius: 0 6px 6px 6px;
}

.dropdown-menu.multi-level>.dropdown-submenu:hover>.dropdown-menu {
    display: block !important;
}

.dropdown-submenu>a:after {
    display: block;
    content: " ";
    float: right;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid;
    border-width: 5px 0 5px 5px;
    border-left-color: #ccc;
    margin-top: 5px;
    margin-right: -10px;
}

.dropdown-submenu:hover>a:after {
    border-left-color: #fff;
}

.dropdown-submenu.pull-left {
    float: none;
}

.dropdown-submenu.pull-left>.dropdown-menu {
    left: -100%;
    margin-left: 10px;
    -webkit-border-radius: 6px 0 6px 6px;
    -moz-border-radius: 6px 0 6px 6px;
    border-radius: 6px 0 6px 6px;
}

.callout.with-border {
    min-height: 50px;
    border-top: 1px dashed #e0e0e0;
    border-right: 1px dashed #e0e0e0;
    border-bottom: 1px dashed #e0e0e0;
}

.callout.callout-border-blue {
    border-left-color: #33b5e5;
    border-top: 1px dotted #0099CC;
    border-right: 1px dotted #0099CC;
    border-bottom: 1px dotted #0099CC;
}

.callout.callout-border-primary {
    border-left-color: #337ab7;
    border-top: 1px dotted #4285F4;
    border-right: 1px dotted #4285F4;
    border-bottom: 1px dotted #4285F4;
}

.callout.callout-border-purple {
    border-left-color: #4a148c;
    border-top: 1px dotted #e1bee7;
    border-right: 1px dotted #e1bee7;
    border-bottom: 1px dotted #e1bee7;
}

.callout.callout-border-danger {
    border-left-color: #a94442;
    border-top: 1px dotted #ff4444;
    border-right: 1px dotted #ff4444;
    border-bottom: 1px dotted #ff4444;
}

.callout.callout-border-success {
    border-left-color: #3c763d;
    border-top: 1px dotted #007E33;
    border-right: 1px dotted #007E33;
    border-bottom: 1px dotted #007E33;
}

.callout.callout-border-info {
    border-left-color: #31708f;
    border-top: 1px dotted #33b5e5;
    border-right: 1px dotted #33b5e5;
    border-bottom: 1px dotted #33b5e5;
}

.callout.callout-border-warning {
    border-left-color: #c87f0a;
    border-top: 1px dotted #f0ad4e;
    border-right: 1px dotted #f0ad4e;
    border-bottom: 1px dotted #f0ad4e;
}

.callout.border-left {
    border-top: none;
    border-right: 0;
    border-bottom: 0;
}
.callout .callout-title{
    margin-bottom: 5px
}
.cke_textarea_inline.cke_editable.cke_editable_inline {
    min-height: 50px;
    line-height: 1.2;
}

.cke_textarea_inline.cke_editable.cke_editable_inline p {
    line-height: 1.2;
    padding: 0;
    margin: 0;
}

.cke_textarea_inline.cke_editable.cke_editable_inline li {
    margin-left: -10px;
}

td p {
    line-height: 1.2 !important;
    margin: 0;
}

td ul li {
    margin-left: -15px;
}

.cke_textarea_inline.cke_editable.cke_editable_inline:focus {}

.modal-dialog {
    overflow-y: initial !important
}

.modal-body {
    height: auto;
    max-height: 420px;
    overflow-y: auto;
}

.set-title-modal {
    text-transform: uppercase !important;
    font-weight: bold;
}


/* Switch button */

.btn-default.btn-on,
.btn-default.btn-off {
    border: 1px solid #e0e0e0;
    border-radius: 5px;
}

.btn-default.btn-on.active {
    background-color: #33b5e5;
    color: white;
}

.btn-default.btn-on {
    color: #9e9e9e
}

.btn-default.btn-off.active {
    color: white
}

span.divider-right {
    margin-right: 10px;
}

.removeAttachment {
    position: relative;
    top: 0;
}

.text-overflow {
    border: 1px solid #000000;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: clip;
}

.wrapping-text {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: clip;
}

.hovering:hover {
    background: #eceff1 !important;
}

.wrapping-text:hover {
    white-space: normal;
    overflow: auto;
    text-overflow: clip;
}

table tr td ul[class!='custom'] li {
    margin-left: -20px;
}

ul.custom.angle-right {
    list-style: none;
    padding: 0;
}

ul.custom.angle-right li {
    padding-left: 0.5em;
}

ul.custom.angle-right li:before {
    content: "\f105";
    /* FontAwesome Unicode */
    font-family: FontAwesome;
    display: inline-block;
    margin-left: -0.5em;
    /* same as padding-left set on li */
    width: 0.5em;
    /* same as padding-left set on li */
}

.font-10px {
    font-size: 10px
}

.font-12px,
.font-12 {
    font-size: 12px;
}

.font-8px {
    font-size: 8px;
    font-family: Calibri
}

.font-9px {
    font-size: 9px
}

.modal-image {
    display: none;
    /* Hidden by default */
    position: fixed;
    /* Stay in place */
    z-index: 1;
    /* Sit on top */
    padding-top: 100px;
    /* Location of the box */
    left: 0;
    top: 0;
    width: 100%;
    /* Full width */
    height: 100%;
    /* Full height */
    overflow: auto;
    /* Enable scroll if needed */
    background-color: rgb(0, 0, 0);
    /* Fallback color */
    background-color: rgba(0, 0, 0, 0.9);
    /* Black w/ opacity */
}


/* Modal Content (Image) */

.modal-image .modal-content {
    margin: auto;
    display: block;
    width: 80%;
    max-width: 700px;
}

.img-zoom {
    margin-bottom: 10px !important;
}

.filter-table:not(.bg-primary):hover {
    background: #e3f2fd
}


/* Caption of Modal Image (Image Text) - Same Width as the Image */

.modal-image #caption {
    margin: auto;
    display: block;
    width: 80%;
    max-width: 700px;
    text-align: center;
    color: #ccc;
    padding: 10px 0;
    height: 150px;
}

.modal-image .modal-content #image-caption {
    -webkit-animation-name: zoom;
    -webkit-animation-duration: 0.6s;
    animation-name: zoom;
    animation-duration: 0.6s;
}


/* Add Animation - Zoom in the Modal */

.modal-content {
    -webkit-animation-name: zoom;
    -webkit-animation-duration: 0.6s;
    animation-name: zoom;
    animation-duration: 0.6s;
}

@-webkit-keyframes zoom {
    from {
        -webkit-transform: scale(0)
    }
    to {
        -webkit-transform: scale(1)
    }
}

@keyframes zoom {
    from {
        transform: scale(0)
    }
    to {
        transform: scale(1)
    }
}


/* The Close Button */

.modal-image .close {
    position: absolute;
    top: 15px;
    right: 35px;
    color: #f1f1f1;
    font-size: 40px;
    font-weight: bold;
    transition: 0.3s;
}

.modal-image .close:hover,
.modal-image .close:focus {
    color: #bbb;
    text-decoration: none;
    cursor: pointer;
}


/* 100% Image Width on Smaller Screens */

@media only screen and (max-width: 700px) {
    .modal-image .modal-content {
        width: 100%;
    }
}

.lb-nav,
.lb-nav:hover {
    display: none !important;
}


/* for bid monitor */

.extra-font {}

.extra-font table tr th,
.extra-font table tr td {
    font-weight: bolder;
    font-size: 1.5em;
    padding: 2px;
}

.terima {
    color: #007E33;
}

.tolak {
    color: #ff0000;
}

.text-ucword {
    text-transform: capitalize;
}

ol.breadcrumb li a {
    color: #4285F4 !important;
}

ol.breadcrumb li a:hover {
    color: #0d47a1 !important;
}

section.content-header h1 {
    color: #3F729B;
}


/* new button from bootstrap 4 */

.btn-outline-primary,
a.btn-outline-primary {
    text-decoration: none;
    color: #0275d8;
    background-image: none;
    background-color: transparent;
    border-color: #0275d8;
}

.btn-outline-primary:hover,
a.btn-outline-primary:hover {
    text-decoration: none;
    color: #fff;
    background-color: #0275d8;
    border-color: #0275d8;
}

.btn-outline-primary {
    color: #0275d8;
    background-image: none;
    background-color: transparent;
    border-color: #0275d8;
}

.btn-outline-primary:hover {
    color: #fff;
    background-color: #0275d8;
    border-color: #0275d8;
}

.btn-outline-primary:focus,
.btn-outline-primary.focus {
    -webkit-box-shadow: 0 0 0 2px rgba(2, 117, 216, 0.5);
    box-shadow: 0 0 0 2px rgba(2, 117, 216, 0.5);
}

.btn-outline-primary.disabled,
.btn-outline-primary:disabled {
    color: #0275d8;
    background-color: transparent;
}

.btn-outline-primary:active,
.btn-outline-primary.active,
.show>.btn-outline-primary.dropdown-toggle {
    color: #fff;
    background-color: #0275d8;
    border-color: #0275d8;
}

.btn-outline-secondary {
    color: #ccc;
    background-image: none;
    background-color: transparent;
    border-color: #ccc;
}

.btn-outline-secondary:hover {
    color: #fff;
    background-color: #ccc;
    border-color: #ccc;
}

.btn-outline-secondary:focus,
.btn-outline-secondary.focus {
    -webkit-box-shadow: 0 0 0 2px rgba(204, 204, 204, 0.5);
    box-shadow: 0 0 0 2px rgba(204, 204, 204, 0.5);
}

.btn-outline-secondary.disabled,
.btn-outline-secondary:disabled {
    color: #ccc;
    background-color: transparent;
}

.btn-outline-secondary:active,
.btn-outline-secondary.active,
.show>.btn-outline-secondary.dropdown-toggle {
    color: #fff;
    background-color: #ccc;
    border-color: #ccc;
}

.btn-outline-info {
    color: #5bc0de;
    background-image: none;
    background-color: transparent;
    border-color: #5bc0de;
}

.btn-outline-info:hover {
    color: #fff;
    background-color: #5bc0de;
    border-color: #5bc0de;
}

.btn-outline-info:focus,
.btn-outline-info.focus {
    -webkit-box-shadow: 0 0 0 2px rgba(91, 192, 222, 0.5);
    box-shadow: 0 0 0 2px rgba(91, 192, 222, 0.5);
}

.btn-outline-info.disabled,
.btn-outline-info:disabled {
    color: #5bc0de;
    background-color: transparent;
}

.btn-outline-info:active,
.btn-outline-info.active,
.show>.btn-outline-info.dropdown-toggle {
    color: #fff;
    background-color: #5bc0de;
    border-color: #5bc0de;
}

.btn-outline-success {
    color: #5cb85c;
    background-image: none;
    background-color: transparent;
    border-color: #5cb85c;
}

.btn-outline-success:hover {
    color: #fff;
    background-color: #5cb85c;
    border-color: #5cb85c;
}

.btn-outline-success:focus,
.btn-outline-success.focus {
    -webkit-box-shadow: 0 0 0 2px rgba(92, 184, 92, 0.5);
    box-shadow: 0 0 0 2px rgba(92, 184, 92, 0.5);
}

.btn-outline-success.disabled,
.btn-outline-success:disabled {
    color: #5cb85c;
    background-color: transparent;
}

.btn-outline-success:active,
.btn-outline-success.active,
.show>.btn-outline-success.dropdown-toggle {
    color: #fff;
    background-color: #5cb85c;
    border-color: #5cb85c;
}

.btn-outline-warning {
    color: #f0ad4e;
    background-image: none;
    background-color: transparent;
    border-color: #f0ad4e;
}

.btn-outline-warning:hover {
    color: #fff;
    background-color: #f0ad4e;
    border-color: #f0ad4e;
}

.btn-outline-warning:focus,
.btn-outline-warning.focus {
    -webkit-box-shadow: 0 0 0 2px rgba(240, 173, 78, 0.5);
    box-shadow: 0 0 0 2px rgba(240, 173, 78, 0.5);
}

.btn-outline-warning.disabled,
.btn-outline-warning:disabled {
    color: #f0ad4e;
    background-color: transparent;
}

.btn-outline-warning:active,
.btn-outline-warning.active,
.show>.btn-outline-warning.dropdown-toggle {
    color: #fff;
    background-color: #f0ad4e;
    border-color: #f0ad4e;
}

.btn-outline-danger {
    color: #d9534f;
    background-image: none;
    background-color: transparent;
    border-color: #d9534f;
}

.btn-outline-danger:hover {
    color: #fff;
    background-color: #d9534f;
    border-color: #d9534f;
}

.btn-outline-danger:focus,
.btn-outline-danger.focus {
    -webkit-box-shadow: 0 0 0 2px rgba(217, 83, 79, 0.5);
    box-shadow: 0 0 0 2px rgba(217, 83, 79, 0.5);
}

.btn-outline-danger.disabled,
.btn-outline-danger:disabled {
    color: #d9534f;
    background-color: transparent;
}

.btn-outline-danger:active,
.btn-outline-danger.active,
.show>.btn-outline-danger.dropdown-toggle {
    color: #fff;
    background-color: #d9534f;
    border-color: #d9534f;
}

.input-file input[id^='att'] {
    opacity: 0;
    filter: alpha(opacity=0);
}

.btn-file {
    text-align: left !important;
}

div.form-control {
    border: none;
}

a.filename {
    font-style: italic;
    color: #3F729B;
    font-size: 12px;
    display: block;
}

a.filename:hover {
    color: #0d47a1;
}

textarea.resize-horizontal-off,
textarea.resize-vertical {
    resize: vertical
}

textarea.resize-horizontal-off.default-height,
textarea.resize-vertical.default-height {
    height: 30px;
}

.ui-datepicker-title select {
    border: 1px solid #ccc;
    padding: 3px 5px;
    border-radius: 3px;
}

.inline-text-dinamic .row input {
    margin-bottom: 10px
}

.inline-text-dinamic .col-sm-8 {
    padding-right: 5px;
}

.inline-text-dinamic .col-sm-4 {
    padding-left: 5px
}

.inline-text-dinamic .padding-bottom-0 {
    padding-bottom: 0 !important;
}

table tbody .inside-table {
    display: block !important;
    width: 100%;
}

.inside-table:before {
    content: '';
    display: block
}

.box-footer .main-footer {
    -webkit-transition: -webkit-transform 0.3s cubic-bezier(0.32, 1.25, 0.375, 1.15);
    -moz-transition: -moz-transform 0.3s cubic-bezier(0.32, 1.25, 0.375, 1.15);
    -o-transition: -o-transform 0.3s cubic-bezier(0.32, 1.25, 0.375, 1.15);
    transition: transform 0.3s cubic-bezier(0.32, 1.25, 0.375, 1.15);
    -webkit-transition: margin-left 0.3s cubic-bezier(0.32, 1.25, 0.375, 1.15);
    -o-transition: margin-left 0.3s cubic-bezier(0.32, 1.25, 0.375, 1.15);
    transition: margin-left 0.3s cubic-bezier(0.32, 1.25, 0.375, 1.15);
    border-top: 0px;
    margin-left: 0px;
    z-index: 820;
}

.content-wrapper .content {
    padding-bottom: 2px;
}

.showtotal {
    margin-top: 10px;
    border-top: 1px solid #ccc;
    padding: 5px 0;
}

.less-left-padding {
    padding-left: 2px;
}

.input-group-addon.remove-icon {
    padding: 0px 3px;
    line-height: 1;
    height: 18px;
    font-size: 12px;
    border: 0px;
    background: transparent;
    position: relative;
    top: -5px;
    cursor: pointer;
    width: 15px;
}

.input-group-addon.remove-icon i {
    margin: 0;
}

.footer-checkbox {
    font-weight: normal;
    cursor: pointer;
    padding-right: 10px;
}

.font-xlg {
    font-size: 5em;
    font-family: 'Times New Roman';
    vertical-align: middle;
}

.counter-small-font {
    font-size: 2em;
    position: relative;
    float: right;
    vertical-align: middle;
}


/*
 * Component: Sidebar Mini :: HIDE COMPLETELY SIDEBAR ON TOGGLE;
 */

@media (min-width: 768px) {
    .sidebar-mini.sidebar-collapse .content-wrapper,
    .sidebar-mini.sidebar-collapse .right-side,
    .sidebar-mini.sidebar-collapse .main-footer {
        margin-left: 0px !important;
        z-index: 840;
    }
    .sidebar-mini.sidebar-collapse .main-sidebar {
        -webkit-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
        -o-transform: translate(0, 0);
        transform: translate(0, 0);
        width: 0px !important;
        z-index: 850;
    }
    .sidebar-mini.sidebar-collapse .sidebar-menu>li {
        position: relative;
    }
    .sidebar-mini.sidebar-collapse .sidebar-menu>li>a {
        margin-right: 0;
    }
    .sidebar-mini.sidebar-collapse .sidebar-menu>li>a>span {
        border-top-right-radius: 4px;
    }
    .sidebar-mini.sidebar-collapse .sidebar-menu>li:not(.treeview)>a>span {
        border-bottom-right-radius: 4px;
    }
    .sidebar-mini.sidebar-collapse .sidebar-menu>li>.treeview-menu {
        padding-top: 5px;
        padding-bottom: 5px;
        border-bottom-right-radius: 4px;
    }
    .sidebar-mini.sidebar-collapse .main-sidebar .user-panel>.info,
    .sidebar-mini.sidebar-collapse .sidebar-form,
    .sidebar-mini.sidebar-collapse .sidebar-menu>li>a>span,
    .sidebar-mini.sidebar-collapse .sidebar-menu>li>.treeview-menu,
    .sidebar-mini.sidebar-collapse .sidebar-menu>li>a>.pull-right,
    .sidebar-mini.sidebar-collapse .sidebar-menu li.header {
        display: none !important;
        -webkit-transform: translateZ(0);
    }
    .sidebar-mini.sidebar-collapse .main-header .logo {
        width: 50px;
    }
    .sidebar-mini.sidebar-collapse .main-header .logo>.logo-mini {
        display: block;
        margin-left: -15px;
        margin-right: -15px;
        font-size: 18px;
    }
    .sidebar-mini.sidebar-collapse .main-header .logo>.logo-lg {
        display: none;
    }
    .sidebar-mini.sidebar-collapse .main-header .navbar {
        margin-left: 50px;
    }
}
.content-wrapper{
    background-color: #fafdfb;
background-image: linear-gradient(180deg, #ffffff 0%, #a9a8f1 100%);

}
/* .skin-green .wrapper, .skin-green .main-sidebar, .skin-green .left-side{
background-size: auto;
    background-image: radial-gradient(
			circle at 67% 83%,
			hsla(317, 0%, 96%, 0.05) 0%,
			hsla(317, 0%, 96%, 0.05) 1%,
			transparent 1%,
			transparent 5%,
			transparent 5%,
			transparent 100%
		),
		radial-gradient(
			circle at 24% 80%,
			hsla(317, 0%, 96%, 0.05) 0%,
			hsla(317, 0%, 96%, 0.05) 27%,
			transparent 27%,
			transparent 63%,
			transparent 63%,
			transparent 100%
		),
		radial-gradient(
			circle at 23% 5%,
			hsla(317, 0%, 96%, 0.05) 0%,
			hsla(317, 0%, 96%, 0.05) 26%,
			transparent 26%,
			transparent 82%,
			transparent 82%,
			transparent 100%
		),
		radial-gradient(
			circle at 21% 11%,
			hsla(317, 0%, 96%, 0.05) 0%,
			hsla(317, 0%, 96%, 0.05) 35%,
			transparent 35%,
			transparent 45%,
			transparent 45%,
			transparent 100%
		),
		radial-gradient(
			circle at 10% 11%,
			hsla(317, 0%, 96%, 0.05) 0%,
			hsla(317, 0%, 96%, 0.05) 21%,
			transparent 21%,
			transparent 81%,
			transparent 81%,
			transparent 100%
		),
		radial-gradient(
			circle at 19% 61%,
			hsla(317, 0%, 96%, 0.05) 0%,
			hsla(317, 0%, 96%, 0.05) 20%,
			transparent 20%,
			transparent 61%,
			transparent 61%,
			transparent 100%
		),
		radial-gradient(
			circle at 13% 77%,
			hsla(317, 0%, 96%, 0.05) 0%,
			hsla(317, 0%, 96%, 0.05) 63%,
			transparent 63%,
			transparent 72%,
			transparent 72%,
			transparent 100%
		),
		radial-gradient(
			circle at 30% 93%,
			hsla(317, 0%, 96%, 0.05) 0%,
			hsla(317, 0%, 96%, 0.05) 33%,
			transparent 33%,
			transparent 82%,
			transparent 82%,
			transparent 100%
		),
		linear-gradient(90deg, rgb(22, 176, 207), rgb(77, 108, 245));
}
.skin-green .sidebar-menu > li.header {
    color: #ebf89f;
background: #1814e7;
} */
.content-wrapper {
    overflow: hidden
}

.search-form-inline label {
    font-size: 12px;
    vertical-align: middle;
}

.search-form-inline .input-group input,
.search-form-inline .input-group select {
    padding-top: 2px !important;
    padding-bottom: 2px;
}

.form-control.inline-block,
.inline-block {
    display: inline-block;
    margin-top: 5px
}

.less-padding-input {
    padding: 2px;
}

table.table-desc-formula tr td {
    vertical-align: top;
    padding: 2px 5px;
    font-size: 10px;
}

table.table-desc-formula tr td.desc {}

table.table-desc-formula tr td.desc b {
    font-style: normal;
    color: blue;
    font-size: 11px;
}

ol.desc ,
ul.desc {
    margin-top: 10px;
    padding-left: 10px;
    line-height: 1.2;
}

.callout ul.desc {
    margin-top: 5px;
    padding-left: 20px;
}
.callout ol.desc {
    margin-top: 5px;
    padding-left: 15px;
    margin-bottom: 5px;
}

.callout .block-title {}

ul.desc.sub {
    margin-top: 2px;
}

ul.desc li {
    font-family: Calibri, 'Gill Sans', 'Gill Sans MT', 'Trebuchet MS', sans-serif;
    text-align: justify;
    line-height: 1.2;
}

ul.desc.font-12 li {
    font-size: 14px
}

ul.desc li a {
    text-decoration: none;
}

ul.desc li a:hover {
    color: #0d47a1;
    text-decoration: underline
}

h5.box-title.small-font {
    font-size: 14px;
    font-weight: bold;
}

.font-bold {
    font-weight: bold;
}

input.text-primary,
a.text-primary,
.text-blue-primary {
    color: #0d47a1
}

input.not-editable {
    background: none;
    border: 0px;
}

input.printer_address {
    width: 115px
}

#msg {
    position: fixed;
    opacity: 0;
    filter: alpha(opacity=0);
    width: 400px;
    top: -300px;
    left: 50%;
    margin-left: -200px;
}

#msg.alert.alert-success {
    background-color: #dff0d8 !important;
    border-color: #d6e9c6 !important;
    color: #3c763d !important;
}

#msg.alert.alert-danger {
    background-color: #f2dede !important;
    border-color: #ebccd1 !important;
    color: #a94442 !important;
}

#msg.alert.alert-info {
    background-color: #d9edf7 !important;
    border-color: #bce8f1 !important;
    color: #31708f !important;
}

#msg.alert.alert-warning {
    background-color: #fcf8e3 !important;
    border-color: #faebcc !important;
    color: #8a6d3b !important;
}

.login-alert .message {
    font-size: 12px;
    font-style: italic;
}

.inline-checkbox label {
    margin-right: 5px;
    padding: 3px;
}

.inline-checkbox label.btn {
    padding-right: 10px;
}

.inline-checkbox label span {
    position: relative;
    top: -2px;
}

.bg-incomplete {
    background: rgb(234, 128, 252, 0.5);
}

.text-italic {
    font-style: italic
}

.btn-po {
    margin-bottom: 3px;
    margin-right: 3px;
}


/* PRINT CUSTOM */

.printarea {
    line-height: 1;
}

.printarea table {
    border-spacing: 0px;
    border-collapse: collapse;
}

.printarea table tr td ul,
.rejection-list ul {
    margin: 2px;
    padding-left: 15px;
}

.printarea table tr td ul li ul li,
.rejection-list ul li ul li {
    margin-left: 15px;
    list-style-type: disc
}

.printarea table tr td ul li ul li p,
.rejection-list ul li ul li p {
    line-height: 1;
    margin: 0;
}

.printarea .table-print tr th,
.printarea .table-print tr td {
    cell-spacing: none;
    padding: 2px 5px;
    vertical-align: top;
}

.form-title.with-border-bottom {
    padding: 5px 2px;
    border-bottom: 1px solid #ccc;
    line-height: 1;
}

span.text-checkbox {
    position: relative;
    top: -3px;
}

.block-list {
    border: 1px solid #ddd;
    display: inline-block;
    vertical-align: top;
    padding: 5px;
}

.table-title {
    padding: 0;
    margin-bottom: 5px;
    line-height: 1;
}

.bg-grey-light {
    background: #ddd
}

.printarea .date-print {
    display: none;
}

.label-square-default {
    border: 1px solid #cccccc;
    border-radius: 2px;
    background: #e0e0e0;
    color: #000;
    padding: 2px 5px;
    font-weight: normal;
}

.label-square-warning {
    border: 1px solid #cc7b09;
    border-radius: 2px;
    background: #f0ad4e;
    color: #fff;
    padding: 2px 5px;
    font-weight: normal;
}

.label-square-info {
    border: 1px solid #003399;
    border-radius: 2px;
    background: #039be5;
    color: #fff;
    padding: 2px 5px;
    font-weight: normal;
}

.label-square-success {
    border: 1px solid #007E33;
    background: #5cb85c;
    color: #fff;
    padding: 2px 5px;
    font-weight: normal;
    border-radius: 2px;
}

.label input[type='checkbox'] {
    position: relative;
    top: 3px
}

table.table-print tr td li.list-desc-in-table {
    margin-left: 10px;
}

.ui-tooltip {
    padding: 3px 5px !important;
    position: absolute;
    z-index: 9999;
    max-width: 300px;
}

body .ui-tooltip {
    border-width: 2px;
}

.red-tooltip+.tooltip>.tooltip-inner {
    background: #f00;
}

.solid-box-title {
    background: #f7f7f7;
    font-size: 16px;
    padding: 7px 10px;
    margin-top: 0;
    margin-bottom: 5px;
}

body.modal-open {
    margin-right: 0px!important;
}

.modal {
    overflow: hidden
}

.modal-body {
    overflow-y: hidden;
    max-height: 100% !important;
}

.parent-chart .online_status {
    font-family: 'Comic Sans';
    display: inline-block;
    padding: 3px 5px;
    position: relative;
    top: -10px;
    left: -8px;
    border-bottom-right-radius: 5px
}
.parent-chart .remarks-sensor {
    font-family: 'Comic Sans';
    display: inline-block;
    padding: 3px 5px;
    position: relative;
    top: -10px;
    left: -8px;
    border-bottom-right-radius: 5px
}

/* overlay at start */

.mfp-fade.mfp-bg {
    opacity: 0;
    -webkit-transition: all 0.15s ease-out;
    -moz-transition: all 0.15s ease-out;
    transition: all 0.15s ease-out;
}


/* overlay animate in */

.mfp-fade.mfp-bg.mfp-ready {
    opacity: 0.8;
}


/* overlay animate out */

.mfp-fade.mfp-bg.mfp-removing {
    opacity: 0;
}


/* content at start */

.mfp-fade.mfp-wrap .mfp-content {
    opacity: 0;
    -webkit-transition: all 0.15s ease-out;
    -moz-transition: all 0.15s ease-out;
    transition: all 0.15s ease-out;
}


/* content animate it */

.mfp-fade.mfp-wrap.mfp-ready .mfp-content {
    opacity: 1;
}

.form-group .message {
    font-style: italic;
}

.label-card {}

.block-text-left {
    display: block;
    text-align: left;
    margin: 2px;
}

.row-header {
    padding: 7px 5px
}

.row-header .form-inline-search {
    position: absolute;
    top: 2px;
    right: 20px;
    float: right;
}

.row.padding-5 {
    padding: 5px
}

.btn.no-pointer {
    cursor: default;
}

sup.required,
.required {
    color: #e53935;
}

.inline-form-input {
    border: 1px solid #ccc;
    border-radius: 2px;
    padding-left: 5px;
}

.row-span {
    margin-top: 5px;
}

.inline-image img {
    margin: 1px;
    border: 1px solid #ffee58;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    display: inline-block;
    position: relative;
}

.display-block {
    display: block;
}

.btn .label-checkbox {
    position: relative;
    top: -2px;
}

.btn.text-left {
    text-align: left !important;
}

::-ms-clear {
    display: none;
}

.form-control-clear {
    z-index: 10;
    pointer-events: auto;
    cursor: pointer;
}

.event-with-desc p {
    border-radius: 3px;
    margin: 0 7% 2px 7%;
    padding: 5px 10px;
    font-weight: normal;
    background: rgba(255, 255, 255, 0.2);
}

.event-with-desc p .content-event-list {
    display: inline-block;
    width: 40px;
}

.sub-desc-total {
    font-color: #ddd;
}

.btn-app.btn-primary {
    background: #0d47a1;
    color: #fff;
}

.no-col .input-group {
    max-width: min-content;
}

.input-group-addon.bg-primary {
    background: #4285F4;
    color: #fff;
}

.input-group-addon.bg-info {
    background: #33b5e5;
    color: #fff;
}

.input-group-addon.bg-warning {
    background: #ffecb3;
    color: #000;
}

.input-group-addon.bg-success {
    background: #00e676;
    color: #000;
}


/* content animate out */

.mfp-fade.mfp-wrap.mfp-removing .mfp-content {
    opacity: 0;
}

td.bg-disabled {
    text-align: center !important;
}

.bg-disabled {
    background: #eeeeee;
}

.text-line-through {
    text-decoration-line: line-through;
    -moz-text-decoration-line: line-through;
}

input[readonly] {
    background: #fbe9e7 !important;
}


/* PAGE SERVICE */

.group-row-hover {
    background: #f8bbd0 !important;
}

.single-row-hover {
    background: #ce93d8 !important;
}

.link-remove-group.pull-right {
    position: relative;
    top: 3px;
}

.bg-grey {
    background: #fafafa;
}


/* END PAGE SERVICE */

@media print {
    body {
        margin: 0;
        padding: 5mm;
    }
    .printarea {
        width: 210mm;
        min-height: 297mm;
    }
    .printarea a {
        text-decoration: none;
    }
    .printarea .date-print {
        display: inline-block;
        color: #ccc;
        font-style: italic;
        font-size: 10px;
    }
    .bg-grey-light {
        background: #ddd;
    }
    .printarea table {
        border-spacing: 0px;
        border-collapse: collapse;
    }
    .printarea .table-print tr th,
    .printarea .table-print tr td {
        cell-spacing: none;
        padding: 2px 5px;
        vertical-align: top;
    }
    .form-title.with-border-bottom {
        padding: 5px 2px;
        border-bottom: 1px solid #ccc;
        margin: 0;
    }
    .block-list {
        border: 1px solid #ddd;
        display: inline-block;
        vertical-align: top;
        padding: 5px;
    }
    .table-title {
        padding: 0;
        margin-bottom: 5px;
    }
}

blockquote.note {
    padding: 2px 5px;
    margin-left: 0;
    border-left: 5px solid;
    border-radius: 3px;
}

blockquote.with-border {
    border-top: 1px dashed;
    border-bottom: 1px dashed;
    border-right: 1px dashed;
}

blockquote div.block-title {
    padding-left: 10px;
    font-weight: bold;
    margin-bottom: 0;
    font-size: 13px;
}

blockquote ul {
    margin-top: 2px;
}

blockquote ul li {
    font-size: 14px;
    margin-left: -5px;
}

.process-logs {
    margin-top: 10px;
    background: #e0e0e0;
    padding: 5px;
}

.process-logs span {
    display: block;
}

.process-logs span.error {
    background: #f8bbd0
}

.process-logs span.complete {
    background: #c5e1a5
}

.input-group.with-radius .radius-left {
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    border: 1px solid #ddd;
    border-right: 0;
}

.input-group.with-radius .radius-right {
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    border: 1px solid #ddd;
    border-left: 0;
}

.input-group.with-radius .radius-left.active {
    -webkit-box-shadow: -11px -1px 53px -33px rgba(40, 110, 240, 1);
    -moz-box-shadow: -11px -1px 53px -33px rgba(40, 110, 240, 1);
    box-shadow: -11px -1px 53px -33px rgba(40, 110, 240, 1);
    border-right: 0;
}

::-webkit-input-placeholder {
    /* WebKit, Blink, Edge */
    color: #909;
}

:-moz-placeholder {
    /* Mozilla Firefox 4 to 18 */
    color: #909;
}

::-moz-placeholder {
    /* Mozilla Firefox 19+ */
    color: #909;
}

:-ms-input-placeholder {
    /* Internet Explorer 10-11 */
    color: #909;
}

.ts-search-title-center {
    font-weight: 500;
    display: block;
    text-align: center;
    font-size: 36px;
    line-height: 1;
    margin: 5px;
    letter-spacing: 3px;
    color: #3F729B;
    font-family: 'Comic Sans Serif'
}

@media screen and (max-width: 600px) {
    .ts-search-title-center {
        font-size: 30px;
    }
}

.layout-top-nav .navbar-brand {
    padding-top: 12px;
}

.navbar-brand img {
    display: inline-block
}

.layout-top-nav .wrapper .main-header .sidebar-toggle {
    margin-left: -10px;
    margin-right: 10px;
}

.onoffswitch {
    display: inline-block;
    position: relative;
    width: 55px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}

.onoffswitch-checkbox {
    display: none;
}

.onoffswitch-label {
    display: block;
    overflow: hidden;
    cursor: pointer;
    border: 2px solid #F7EFEF;
    border-radius: 50px;
}

.onoffswitch-inner {
    display: block;
    width: 200%;
    margin-left: -100%;
    transition: margin 0.3s ease-in 0s;
}

.onoffswitch-inner:before,
.onoffswitch-inner:after {
    display: block;
    float: left;
    width: 50%;
    height: 18px;
    padding: 0;
    line-height: 18px;
    font-size: 12px;
    color: white;
    font-family: Trebuchet, Arial, sans-serif;
    font-weight: bold;
    box-sizing: border-box;
}

.onoffswitch-inner:before {
    content: "ON";
    padding-left: 5px;
    background-color: #242121;
    color: #11AB49;
    text-align: left;
}

.onoffswitch-inner:after {
    content: "OFF";
    padding-right: 6px;
    background-color: #242121;
    color: #EB0909;
    text-align: right;
}

.onoffswitch-switch {
    display: block;
    width: 15px;
    height: 15px;
    margin: 1.8px;
    background: #F5112C;
    position: absolute;
    top: 1px;
    bottom: 0;
    right: 35px;
    border: 1px solid #F7EFEF;
    border-radius: 50px;
    transition: all 0.3s ease-in 0s;
}

.onoffswitch-checkbox:checked+.onoffswitch-label .onoffswitch-inner {
    margin-left: 0;
}

.onoffswitch-checkbox:checked+.onoffswitch-label .onoffswitch-switch {
    right: 2px;
    background-color: #26CC42;
}

.select-templates label.label-inline {
    display: inline;
    vertical-align: top;
}

.text-violet {
    color: #aa00ff
}

ul.timeline-box {
    position: relative;
    padding-left: 15px;
    list-style-type: none;
}

ul.timeline-box li:before {
    font-family: FontAwesome;
    position: absolute;
    content: '\f009';
    left: 2px;
    padding-top: 4px;
    color: #aa00ff;
    border-bottom: 2px solid #aa00ff;
    border-bottom-left-radius: 5px
}

ul.timeline-box li .line-title {
    padding-left: 15px;
    margin-bottom: 0;
    vertical-align: middle;
    font-size: 16px;
}

ul.timeline-box li .line-title input {
    position: relative;
    top: 2.5px;
}

ul.timeline-box li .line-title span {
    vertical-align: middle;
}

ul.timeline-box li ul {
    padding-left: 10px;
    margin-top: 1px;
    padding-top: 6px;
    border-left: 2px solid #aa00ff;
}

ul.timeline-box li ul li {
    list-style-type: none;
    line-height: 1.5;
    border-bottom: 1px outset #aa00ff;
    border-bottom-left-radius: 5px;
    padding: 3px;
}

ul.timeline-box li ul li .get-barcodes:hover {
    text-decoration: underline;
}

ul.timeline-box li ul li.bg-select {
    background-color: rgba(72, 255, 251, 0.3);
}

ul.timeline-box li ul li:before {
    font-family: FontAwesome;
    content: "\f061";
    border-bottom: 0;
    left: 17px;
    font-size: 12px;
}

ul.timeline-box li ul li .sm_box_no {
    position: relative;
    font-weight: bold;
    margin-left: 10px;
}

.box .box-body h2.box-title {
    font-size: 18px;
    font-weight: bold;
    margin: 0;
    padding: 5px 0;
    display: block;
    border-bottom: 1px solid
}

.box .box-body h2.box-title .badge {
    position: relative;
    top: -2px
}

.box .box-body h2.box-title label.label-checkbox {
    font-size: 12px;
}

.box .box-body h2.box-title #is_vendor {
    transform: scale(1.5);
    outline: 1px solid;
    outline-offset: -1px;
}

.scan-replacement-area {
    position: relative;
}

.scan-replacement-area .qty_scanned {
    position: absolute;
    right: 0;
    top: -5px;
    padding: 0;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    vertical-align: middle;
}

.scan-replacement-area textarea {
    border-top-right-radius: 25px;
}

.scan-replacement-area .qty_scanned span {
    font-size: 2em;
    vertical-align: middle;
}

ul.related-so li.total {
    list-style: none;
}

.label.label-green-light {
    background: rgb(0, 200, 83)
}

.wsprint-link {
    z-index: 500;
    border-radius: 2px;
    line-height: 1.5;
}

.wsprint-link label.label {
    border-radius: 0;
    font-size: inherit;
    -webkit-box-shadow: -5px -1px 10px -6px rgba(250, 250, 145, 1);
    -moz-box-shadow: -5px -1px 10px -6px rgba(250, 250, 145, 1);
    box-shadow: -5px -1px 10px -6px rgba(250, 250, 145, 1);
}

.wsprint-link label.label.radius-bottom-left {
    border-bottom-left-radius: 5px;
}

.wsprint-link label.label.setting {
    -webkit-box-shadow: -5px -1px 10px -6px rgba(250, 250, 145, 1);
    -moz-box-shadow: -5px -1px 10px -6px rgba(250, 250, 145, 1);
    box-shadow: -5px -1px 10px -6px rgba(250, 250, 145, 1);
    border-top: none;
    z-index: 600;
    position: relative;
    margin-top: 2px;
}

.__chatbox-container {
    background: none
}

.__chatbox-container .pinned-msg {
    position: relative;
}

.__chatbox-container .pinned-msg .pinned-msg-title {
    position: absolute;
    top: 0px;
    padding: 0 5px;
    background: #ff0000;
    border-bottom-right-radius: 5px;
    color: #ffffff;
}

.__chatbox-container .pinned-msg ul.pinned-msg-list {
    display: block;
    padding: 5px;
    margin-top: 0;
    margin-left: 5px;
}

.__chatbox-container .pinned-msg ul.pinned-msg-list li {
    padding-left: 10px;
}

.__chatbox-container .pinned-msg ul.pinned-msg-list li:before {
    font-family: FontAwesome;
    content: "\f101";
    margin-left: -10px;
    position: absolute;
    color: #9e9e9e
}

.__chatbox-container .__chatbox-content {
    background: transparent;
    border: none;
}

.__chatBoxArea {
    position: relative;
    border: 1px solid #ffbb33;
}

.__chatBoxArea:after,
.__chatBoxArea:before {
    bottom: 100%;
    right: 2%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}

.__chatBoxArea .direct-chat-messages .direct-chat-replyof {
    border-left: 3px solid #b2ff59;
    background: rgba(255, 255, 255, 0.5);
    border-radius: 5px;
    margin-bottom: 5px;
    padding: 2px 5px;
    color: #7283a7;
}

.__chatBoxArea .reply-area div.set {
    border-left: 3px solid #b2ff59;
    border-radius: 5px;
    margin-bottom: 5px;
    padding: 2px 5px;
    font-style: italic;
    color: #37474F;
    background: #f5f5f5
}

.__chatBoxArea .reply-area .cancel_reply {
    z-index: 4000
}

.__chatBoxArea .reply-area .message {
    margin-left: 10px;
}

.__chatBoxArea .direct-chat-messages .direct-chat-replyof .text {
    color: #7283a7
}

.__chatBoxArea .direct-chat-messages .direct-chat-msg {
    width: 85%;
    position: relative;
}

.__chatBoxArea .direct-chat-messages .direct-chat-msg.msg-received .chat-text,
.__chatBoxArea .direct-chat-messages .direct-chat-msg:not(.right) .chat-text {
    background: #eefded;
    border: 1px solid #bdbdbd;
    padding: 5px 10px;
    border-radius: 5px;
}

.__chatBoxArea .direct-chat-messages .direct-chat-msg[read="0"]:not(.right) .chat-text {
    background: #64ffda;
}


/* BACKGROUND OF TRIANGLE */

.__chatBoxArea .direct-chat-messages .direct-chat-msg:not(.right) .chat-text:after {
    border-color: rgba(224, 224, 224, 0);
    border-bottom-color: #eefded;
}

.__chatBoxArea .direct-chat-messages .direct-chat-msg:not(.right) .chat-text:before {
    border-color: rgba(224, 224, 224, 0);
    border-bottom-color: #e0e0e0;
}

.__chatBoxArea .direct-chat-messages .direct-chat-msg[read="0"]:not(.right) .chat-text:after {
    border-color: rgba(224, 224, 224, 0);
    border-bottom-color: #64ffda;
}

.__chatBoxArea .direct-chat-messages .direct-chat-msg[read="0"]:not(.right) .chat-text:before {
    border-color: rgba(224, 224, 224, 0);
    border-bottom-color: #e0e0e0;
}

.__chatBoxArea .direct-chat-messages .direct-chat-msg.right {
    float: right
}

.__chatBoxArea .direct-chat-messages .direct-chat-msg.msg-sent .chat-text,
.__chatBoxArea .direct-chat-messages .direct-chat-msg .chat-text {
    color: #000;
    position: relative;
}


/* chat right -> for sent item*/

.__chatBoxArea .direct-chat-messages .direct-chat-msg .chat-text {
    position: relative;
    border: 1px solid #ffe57f;
    background: #fff8e1;
    padding: 5px 10px;
    border-radius: 5px;
    margin-top: 5px
}

.__chatBoxArea .direct-chat-messages .direct-chat-msg .chat-text:after,
.__chatBoxArea .direct-chat-messages .direct-chat-msg .chat-text:before {
    bottom: 100%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}

.__chatBoxArea .direct-chat-messages .direct-chat-msg .chat-text:after {
    border-color: rgba(255, 229, 127, 0);
    border-bottom-color: #fff8e1;
    border-width: 7px;
    margin-left: -7px;
}

.__chatBoxArea .direct-chat-messages .direct-chat-msg .chat-text:before {
    border-color: rgba(255, 248, 225, 0);
    border-bottom-color: #ffe57f;
    border-width: 8px;
    margin-left: -8px;
}

.__chatBoxArea .direct-chat-messages .direct-chat-msg:not(.right) .chat-text:after,
.__chatBoxArea .direct-chat-messages .direct-chat-msg:not(.right) .chat-text:before {
    left: 20px
}

.__chatBoxArea .direct-chat-messages .direct-chat-msg.right .chat-text:after,
.__chatBoxArea .direct-chat-messages .direct-chat-msg.right .chat-text:before {
    right: 15px
}

.__chatBoxArea .direct-chat-messages .direct-chat-replyof label.title {
    margin: 0;
    font-size: 12px;
    padding: 0;
}

.__chatBoxArea .direct-chat-msg .chat-link-reply {}

.__chatBoxArea .direct-chat-msg:hover>.chat-link-reply {
    display: inline-block;
}

.__chatBoxArea .reply_temp_area {
    background: #ff0000
}

@media screen and (max-width: 600px) {
    .__chatBoxArea:after,
    .__chatBoxArea:before {
        left: 0% !important
    }
}

@media screen and (max-width: 800px) and (min-width: 601px) {
    .__chatBoxArea:after,
    .__chatBoxArea:before {
        right: 30% !important
    }
}

@media screen and (max-width: 1000px) and (min-width: 801px) {
    .__chatBoxArea:after,
    .__chatBoxArea:before {}
}

@media screen and (max-width: 1200px) and (min-width: 1001px) {
    .__chatBoxArea:after,
    .__chatBoxArea:before {
        right: 3% !important
    }
}

.__chatBoxArea:after {
    border-color: rgba(136, 183, 213, 0);
    border-bottom-color: #ffffff;
    border-width: 12px;
    margin-right: 0px;
}

.__chatBoxArea:before {
    border-color: rgba(194, 225, 245, 0);
    border-bottom-color: #ffbb33;
    border-width: 13px;
    margin-right: -1px;
}

.__chatBoxArea .pinned-msg {
    margin: 5px;
    border: 1px dotted #ff0000;
    border-left: 3px solid #ff0000;
}

.__chatBoxArea .hidden-file {
    position: absolute;
}

@media only screen and (min-width: 400px) {
    .row-searching .row div:nth-child(2):before {
        content: ":";
        color: #000;
        margin-right: 10px
    }
}

.row-searching table {
    border: 1px solid #ccc;
    border-radius: 5px;
}

.row-searching .row div:nth-child(1) {
    color: #212121
}

.row-searching tr:nth-child(even) {
    background: rgba(205, 220, 57, 0.05)
}

.row-searching tr:nth-child(odd) {
    background: rgba(0, 188, 212, 0.05)
}

.row-searching table tr td {
    padding: 3px 5px;
    vertical-align: top;
    ;
}

.row-searching .row div:nth-child(2) {
    color: #0d47a1
}

.bg-warning-head {
    background: #f5e9a9
}

.bg-info-head {
    background: #aadcf6
}

.bg-success-head {
    background: #cef1c0
}


/* MANIPULATE CSS FOR FOOTER */

.XdataTables_scrollBody tfoot,
.XdataTables_scrollBody tfoot tr {
    background: transparent
}

.XdataTables_scrollBody tfoot tr th,
.XdataTables_scrollBody tfoot tr td {
    background: transparent !important
}

.text-blink {
    animation: blinker 5s linear infinite;
}

@keyframes blinker {
    50% {
        opacity: 0.2;
    }
}

  table.XdataTable.full-border{
    border: 1px solid #ddd
  }
  table.XdataTable.full-border tr th,
  table.XdataTable.full-border tr td{
    border: 1px solid #ddd
  }

.modal.dragable{
    background: rgba(255,255,255,0);
}
.modal.modal-solid .modal-dialog{
   height: max-content
}
.modal.modal-solid.primary .modal-dialog{
    border: 1px solid #4285F4;
}
.modal.modal-solid.primary .modal-dialog .modal-content>.modal-header{
    background: #4285F4
}
.modal.modal-solid.primary .modal-dialog{
    border: 1px solid #4285F4
}
.modal.modal-solid.success .modal-dialog .modal-content>.modal-header{
    background: #00a65a;
}
.modal.modal-solid.success .modal-dialog{
    /* border: 1px solid #00a65a */
}
.modal.modal-solid.info .modal-dialog .modal-content>.modal-header{
    background: #00c0ef
}
.modal.modal-solid.warning .modal-dialog{
    border: 1px solid #ffbb33;
}
.modal.modal-solid.warning .modal-dialog .modal-content>.modal-header{
    background: #ffbb33;

}
.modal.modal-solid.danger .modal-dialog{
    border: 1px solid #ff4444
}
.modal.modal-solid.danger .modal-dialog .modal-content>.modal-header{
    background: #ff4444;

}
.modal.modal-solid.purple .modal-dialog{
    border: 1px solid #aa66cc;
}
.modal.modal-solid.purple .modal-dialog .modal-content>.modal-header{
    background: #aa66cc;
    color: #ffffff;
    font-weight: bold;
}
.modal.modal-solid.elegan .modal-dialog{
    border: 1px solid #2E2E2E
}
.modal.modal-solid.elegan .modal-dialog .modal-content>.modal-header{
    background: #2E2E2E;
    color: #ffffff;
}
.modal.modal-solid.elegan .modal-dialog .modal-content>.modal-header .close span{
    
    color: #ffffff;
}
.modal h4.modal-title{
    font-style: bold;
    font-size: 14px
}
pre.less-padding{
    padding: 3px
}
pre.text-normal{
    font-family: 'Courier New', Courier, monospace;
}
pre.pre-text{
    border: 0px;
    background: transparent;
    margin: 0;
    padding: 0;
    font-family: 'Courier New', Courier, monospace;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
}

.row [class^='col']{
    padding-bottom: 5px
}

.form-control.auto-height{
    height: auto;
    min-height: 30px;
}
/* 5S style */
.label-observation,
.label-finding{
  background: #9c27b0;
    color: #fff;
    cursor: default;
}
.label-yellow{
    background: #ffb300;
    color: #fff;
    cursor: default;
}
.label-committee{
    background: #33b5e5;
    color: #fff;
    cursor: default;
}
.label-red{
    background: #f44336;
    color: #fff;
    cursor: default;
}

body.skin-midnight table.table-striped > tbody > tr:nth-of-type(odd) {
  background-color: #3e464c;
}
body.skin-midnight section.content-header h1 {
    color: #ffffff;
}
body.skin-midnight section.content-header small {
    color: #ccc;
}
.skin-midnight .table-bordered > thead > tr > th, .skin-midnight .table-bordered > tbody > tr > th, .skin-midnight .table-bordered > tfoot > tr > th, .skin-midnight .table-bordered > thead > tr > td, .skin-midnight .table-bordered > tbody > tr > td, .skin-midnight .table-bordered > tfoot > tr > td {
    border: 1px solid #f5f5f5;
}
.skin-midnight .box {
    -webkit-box-shadow: -5px 2px 40px 7px;
-moz-box-shadow: -5px 2px 40px 7px;
box-shadow: -5px 2px 40px 7px;
}
.skin-midnight .box label{
    color: #ffffff
}
table tr.bg-success th,
table tr.bg-success td{
    background: #cef1c0
}
.dragable .modal-dialog{
    border-radius: 5px;
}

#topBarBookMark .active{
    border-left: 3px solid #ffffff;
    border-top-left-radius: 5px;
    border-top-right-radius: 30px;
}
.visible-hide{
    visibility: hidden !important;
}
.DTFC_LeftWrapper .DTFC_LeftBodyWrapper .DTFC_LeftBodyLiner .display thead tr th,
.DTFC_LeftWrapper .DTFC_LeftBodyWrapper .DTFC_LeftBodyLiner .display thead tr th[class*='sorting']{
    background-image: none;
}
.display{
    background: white
}

body{
}
table.XdataTable thead tr:first-child th[rowspan='1'], 
table.XdataTable thead tr:first-child td[rowspan='1']{
    border-bottom: 0px
}
table.XdataTable thead tr:last-child th, 
table.XdataTable thead tr:last-child td{
    border-bottom: 1px solid #003399;
}
.ml-5{
    margin-left: 5px
}
.ml-10{
    margin-left: 10px
}
.pl-5{
    padding-left: 5px
}

table thead tr.invisible-row th{
  border: 0 !important;
  padding: 0 !important;
  border-top-width: 0 !important;
  visibility: hidden;
}

table.fix-border tr td,
table.fix-border tr th,
table.XdataTable.fix-border tr th,
table.XdataTable.fix-border tr td,
table.XdataTable.fix-border tbody tr td{
    background-clip: padding-box;
    border: 1px solid #bdbdbd
}

.fa-rotate-45 {
  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)";
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}
.readmore-text{
    color:rgb(77, 108, 245)
}

.modal {
  overflow-y:auto;
}
tfoot th{
    padding: 5px !important
}


.modal.modal-custom .modal-content {
    top: 30vh;
    border-radius: 15px;
    -webkit-box-shadow: 10px 10px 5px rgba(0, 0, 0, 0.125);
    box-shadow: 10px 10px 5px rgba(0, 0, 0, 0.125);
    border: 2px inset #00c0ef;
    border-top: 4px solid #003399
}