/*!
 * Custom CSS
 */

td.text10px {
	font-size: 10px!important;
	background-color: #9f0!important;
	text-align: left!important;
}

.vGood {
    background-color: #9f0;
}

.good {
    background-color: #cf0;
}

.avg {
    background-color: #fd0;
}

.poor {
    background-color: #fa0;
}

.vPoor {
    background-color: #f30;
}



thead input[type=text] { /*! only works for mobile */
	border-style: none;
	height: 30px;
	text-align: center;
	border-radius: 1px;
	padding: 5px;
	margin: 0px;
}


div.dv50hide {
	width: 50px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis; 
	}

div.dv50wrap {
	width: 50px;
	white-space: wrap;
	}

td.td50 {
	width: 250px;
	}

div.dv50wrapword {
	width: 50px;
	word-wrap: break-word;
	}

div.dv75hide {
	width: 75px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis; 
	}

div.dv75wrap {
	width: 75px;
	white-space: wrap;
	}

td.td75 {
	width: 75px;
	}

div.dv75wrapword {
	width: 75px;
	word-wrap: break-word;
	}

div.dv100hide {
	width: 100px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis; 
	}

div.dv100wrap {
	width: 100px;
	white-space: wrap;
	}

td.td100 {
	width: 100px;
	}

div.dv100wrapword {
	width: 100px;
	word-wrap: break-word;
	}

div.dv150hide {
	width: 150px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis; 
	}

div.dv150wrap {
	width: 150px;
	white-space: wrap;
	}

div.dv150wrapword {
	width: 150px;
	word-wrap: break-word;
	}

td.td150 {
	width: 150px;
	}

div.dv200hide {
	width: 200px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis; 
	}

div.dv200wrap {
	width: 200px;
	white-space: wrap;
	}

td.td200 {
	width: 200px;
	}

div.dv250hide {
	width: 250px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis; 
	}

div.dv250wrap {
	width: 250px;
	white-space: wrap;
	}

td.td250 {
	width: 250px;
	}

div.dv300hide {
	width: 300px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis; 
	}

div.dv300wrap {
	width: 300px;
	white-space: wrap;
	}

td.td300 {
	width: 300px;
	}

div.dv400hide {
	width: 400px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis; 
	}

div.dv400wrap {
	width: 400px;
	white-space: wrap;
	}

td.td400 {
	width: 400px;
	}



img.shapeBoxSelected {
	border: 5px solid #747c7c !important;
	object-fit: cover;
	opacity: 0.7;
	}

img.doorBoxSelected {
	border: 5px solid #747c7c !important;
	object-fit: cover;
	opacity: 1.0;
	}
.shapeBox:hover {
	border: 5px solid #28a745 !important;
	}


#loader {
  position: absolute;
  left: 50%;
  top: 30%;
  z-index: 1;
  width: 150px;
  height: 150px;
  margin: -75px 0 0 -75px;
  border: 16px solid #f3f3f3;
  border-radius: 50%;
  border-top: 16px solid #3498db;
  width: 120px;
  height: 120px;
  -webkit-animation: spin 2s linear infinite;
  animation: spin 2s linear infinite;
	}

@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
	}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
	}


#loaderX {
	position: absolute;
	left: 54%;
	top: 30%;
	z-index: 100;
	width: 150px;
	height: 150px;
	margin: -75px 0 0 -75px;
	border: 16px solid #f3f3f3;
	border-radius: 50%;
	border-top: 16px solid #3498db;
	width: 120px;
	height: 120px;
	-webkit-animation: spin 2s linear infinite;
	animation: spin 2s linear infinite;
	}

#greypage {
	position: absolute;
	width:100%;
	height:100%;
	background-color: black;
	z-index: 99;
	opacity: 0.7;
	}
	
@-webkit-keyframes spin {
	0% { -webkit-transform: rotate(0deg); }
	100% { -webkit-transform: rotate(360deg); }
	}
	
@keyframes spin {
	0% { transform: rotate(0deg); }
	100% { transform: rotate(360deg); }
	}

.nav-pills .pill-color .nav-link:not(.active) {
	color: #6c757d!important;
	}

.nav-pills .pill-color .nav-link:hover {
	background-color:#343a40!important;
	color:#f8f9fa!important;
	}	

.nav-pills .pill-color .nav-link.active {
	background-color:#343a40!important;
	color:#f8f9fa!important;
	}	

.nav-pills .file-pill-color:not(.active) {
	color: #cdcdcd!important;
	}

.nav-pills .file-pill-color:hover {
	color:#6c757d!important;
	}	

.nav-pills .file-pill-color.active {
	background-color:#6c757d!important;
	color:#f8f9fa!important;
	}	

.file_pill_badge {
	font-size:12px;
	font-weight:bold
	}

.hoverTable tr:hover {
	background-color:#f0f0f0!important;
	cursor:pointer!important;
	}

.activeRow {
	background-color:#e3e3e3!important;
	}

@media only screen and (max-width: 993px) {
.mobileHide {
	display:none;
	}
}

.mobileShow {
	display:none;
	}

@media only screen and (max-width: 993px) {
.mobileShow {
	display:inline-block;
	}
}

@media only screen and (max-width: 993px) {
.mobileShow img {
	max-height:200px!important;
	}
}

@media only screen and (max-width: 993px) {
.taskselect {
	width:274px!important;
	}
}

.taskpagi:not(.active) {
	color: #007bff!important;
	}

.taskpagi {
	color:#007bff!important;
	}

.taskpagi:hover {
	background-color:#f8f9fa!important;
	}

.taskpagi.active {
	background-color:#007bff!important;
	color:white!important;
	border-style:solid;
	border-color:#007bff!important;
	}

.bootstrap-table .fixed-table-toolbar .search input {
	width: 170px!important;
	border-radius: 0px!important
	}

td.noCol, th.noCol {
	display: none!important;
	}			

.bootstrap-table .fixed-table-toolbar .bs-bars,
.bootstrap-table .fixed-table-toolbar .search,
.bootstrap-table .fixed-table-toolbar .columns {
	position:relative;
	margin-top:0px;
	margin-bottom:0px
}

.bootstrap-table .fixed-table-pagination>.pagination-detail,
.bootstrap-table .fixed-table-pagination>.pagination {
	margin-top:5px;
	margin-bottom:0px;
}

.bootstrap-table .fixed-table-pagination>.pagination-detail .page-list .btn-group .dropdown-menu {
	border-radius:0!important;
	margin:0;
	padding:0;
}

.bootstrap-table .fixed-table-pagination>.pagination ul.pagination {
	border-radius:0!important;
	margin:0;
	padding:0;
}

.btn {border-radius:0!important;}

.bootstrap-table .fixed-table-pagination {
	color:#868e96!important;
	font-size: 12px;
}