/*
	Theme Name: nysus - light
	Theme URI: http://www.nysus.net/
	Author: 3:57am Creative Studios
	Author URI: http://www.357am.com/
	Description: Nysus MES Theme based on bootstrap 4.0
	Version: 0.1
*/
@charset "UTF-8";
/* CSS Document */
@import url('https://fonts.googleapis.com/css?family=Raleway:200,300,500,700,900|Roboto:200,300,500,700,900');
body {
	margin: 0px;
	background: radial-gradient(rgba(255,255,255,1), rgba(200,200,200,1));
	background-attachment: fixed;
	font-weight: 200;
	font-family: 'Roboto', sans-serif;
}
/************************************************************************ header */
header {
	width: 100%;
	height: auto;
}
#logo {
	margin: 0 auto;
}
#logo img {
	width: 100%;
	max-width: 200px;
	height: auto;
	margin-top: 12%;
}
#header-center {
	color: #003366;
}
#header-center h1 {
	padding-top: 1%;
	font-size: 300%;
	text-transform: uppercase;
	font-weight: 100;
	color:#333333;
}
#clock {
	margin-top: 12%;
	color: #666666;
	font-weight: bold;
}
#logged-in {
	color: #333333;
}
#header-right {
}
@media screen and (max-width:576px) {
	#clock {
	margin-top: 0%;
}
	#header-right {
		text-align:center;
}
}
/************************************************************************ TASK LIST STYLES */
#task-list-holder {
	float: left;
	position: relative;
	width: 100%;
	height: 100%;
	overflow: hidden;
	padding:0px;
}
.task-list-mask {
	width: 100%;
	min-height: 540px;
	height: 100%;
	-webkit-mask-image: linear-gradient(rgba(0,0,0,0)10%, rgba(0,0,0,1) 32%, rgba(0,0,0,1) 40%, rgba(0,0,0,0));
}
#task-list {
	position: absolute;
	top: 0px;

	text-align: right;
	margin-left: -40px;
}
#task-list > li {
	width: 100%;
	display: block;
	height: auto;
	line-height: 16px;
	text-align: right;
	padding: 10px 0px 10px 0;
	color: #ccc;
	position:relative;
	border-bottom:1px solid #ccc;
	-webkit-transition: all 500ms ease-out;
	-moz-transition: all 500ms ease-out;
	transition: all 500ms ease-out;
}
#task-list > li span {
	display: inline-block;
	vertical-align: middle;
	width: 100%;
	padding: 4px 40px 0 4px;

}
#task-list > li:before {
	content: '';
	display: inline-block;
	vertical-align: middle;
	height: 100%;
}
#task-list > li.active-task {
	background: linear-gradient(to left, rgba(200,200,200,1), rgba(204,204,204,1));
	box-shadow:0 0 8px rgba(0,0,0,0.2);
	color: #000;
	font-weight: bold;
	font-size:110%;
	-webkit-transition: all 500ms ease-out;
	-moz-transition: all 500ms ease-out;
	transition: all 500ms ease-out;
	opacity: 1;
	width:102%;
	position:relative;
}

#task-list > li.completed-task {
	background: url(../images/taskcompleted_check.png) no-repeat 99%;
	color: #333;
	-webkit-transition: all 500ms ease-out;
	-moz-transition: all 500ms ease-out;
	transition: all 500ms ease-out;
}
#task-list-progress{
	position:relative;
	bottom:-10px;
}
#task-list-progress.progress{
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	height: 10px;
	overflow: hidden;
	font-size: 0rem;
	background-color: transparent/*#e9ecef*/;
	border-radius: 0rem;
	margin-bottom:1px;
}
#task-list-progress.progress > .bg-success {
  color: #fff;
 /* background-color: rgba(102,153,0,1) !important;*/
	background: linear-gradient(to right, rgba(102,153,0,0.5), rgba(102,153,0,1)) !important;
}

#task-list-progress.progress > .bg-warning{
  color: #fff;
  /*background-color: rgba(204,153,0,1) !important;*/
background: linear-gradient(to right, rgba(204,153,0,0.5), rgba(204,153,0,1)) !important;
}

#task-list-progress.progress > .bg-danger{
  color: #fff;
  /*background-color: rgba(91,18,30,1) !important;*/
	background: linear-gradient(to right, rgba(91,18,30,0.5), rgba(91,18,30,1)) !important;
}

@media screen and (max-width:576px) {
#task-list-holder {

}
#task-list > li {
	text-align: center;
	padding: 10px 0 10px 0;
	border-bottom: 1px solid #666;
}
}
/************************************************************************ Instruction area*/
#task-instruction{
	padding:10px;
}
#task-instruction-photo {
	margin-top: 20px;
	width: 100%;
	height: auto;
	border: 1px solid #ccc;
}

#div_part_selection {
	padding: 10px;
}

/************************************************************************ Misc Styles*/
.nopadding {
	padding: 0px !important;
}
.wrapper, .stat{
	background:#fff;
	border-radius: 5px;
	box-shadow:0 0 8px rgba(0,0,0,0.2);
	overflow:hidden;
}
.row > [class*='col-'] {
  display: flex;
  flex-direction: column;
}
/************************************************************************ Operator Stats area*/
#operator-stats {
}
#operator-timer {
	padding: 20px 0px;
}
#operator-stats p {
	margin: 0.5rem 0px;
}
.stat{
	background:#fff;
	border-radius: 5px;
	box-shadow:0 0 8px rgba(0,0,0,0.2);
	margin:10px 0;
}

@media screen and (max-width:768px) {
#operator-stats {
	background: none;
	padding-left: 0px;
	text-align: center;
}
}



/************************************************************************* modal overrides*/
@media (min-width: 1280px) {
	.modal-lg {
	  max-width: 1200px;
	}
	.modal-xlg {
	  max-width: 95%;
	}
}
.modal-content {
	background: linear-gradient(rgba(255,255,255,1), rgba(180,180,180,1)) !important;
}
/************************************************************************ Footer Area*/
footer{
	padding:1% 0px;
	position:absolute;
	bottom:0;
}
#footer-left{}
#footer-center{}
#footer-right{}
#nysus-branding{
}
#product-version{
	color:#999;
	font-size:12px;
}
#user-ip{
	color:#000;
	font-size:12px;
	text-align: right;
}
@media screen and (max-width:768px) {
footer{
	position:relative;

}
}
/************************************************************************ dock overrides*/

#dock{
	width:100%;
	height:40px;
	position:absolute;
	bottom:0px;
	left:0px;
	z-index: 100;
	overflow:hidden;
}
#dock-trigger{
	max-width:80px;
	height:40px;
	background: radial-gradient(circle at top, rgba(255,255,255,1), rgba(200,200,200,1));
	margin:0 auto;
	margin-top:5px;
	text-align:center;
	padding:10px;
	color:#fff;
	border-radius: 8px 8px 0 0;
	border: 1px solid #8794a5;
	box-shadow: 0 0 10px rgba(0,0,0,1);
	cursor:pointer;
}
#dock-trigger:hover{
	box-shadow: 0 0 0px rgba(0,0,0,1);
	color:#ccc;
}
#dock-content{
	color:#333333;
	background: radial-gradient(circle at top, rgba(255,255,255,1), rgba(200,200,200,1));
	width:100%;
	height:260px;
	padding:10px;
	border-top:1px solid #8794a5;
	box-shadow: 0 0 20px rgba(0,0,0,1);

}

/************************************************************************ alert overrides*/
#operator-stats .bg-info {
	background: linear-gradient(to right, rgba(20,20,20,1), rgba(20,20,20,1)) !important;
	margin-bottom: 1px;
	color:#FFFFFF !important;
}
#operator-stats .bg-success {
	background: linear-gradient(to right, rgba(102,153,0,1), rgba(102,153,0,1)) !important;
	margin-bottom: 1px;
	color:#FFFFFF !important;
}
#operator-stats .bg-warning {
	background: linear-gradient(to right, rgba(204,153,0,1), rgba(204,153,0,1)) !important;
	margin-bottom: 1px;
	color:#FFFFFF !important;
}
#operator-stats .bg-danger {
	background: linear-gradient(to right, rgba(91,18,30,1), rgba(91,18,30,1)) !important;
	margin-bottom: 1px;
	color:#FFFFFF !important;
}

/************************************************************************* modal overrides*/
@media (min-width: 1280px) {
  .modal-lg {
    max-width: 1200px;
  }
}
.modal-content {
	background: linear-gradient(rgba(255,255,255,1), rgba(180,180,180,1)) !important;
}

/************************************************************************* login screen*/
.login-bg{
	background:url(../../images/login-bg.png) #000;
	background-size:100%;
	background-repeat: no-repeat;
}
.login-prompt{
	background: linear-gradient(rgba(255,255,255,0.8), rgba(180,180,180,1));
	box-shadow:0 0 20px 0 rgba(0,0,0,1);
	position:fixed;
	left:50%;
	top:10%;
	width:50%;
	min-height:50%;
	margin-left:-25%;
	padding:5%;
	text-align:center;
	border-radius:5px;
}
.login-logo-client{
	width:60%;
	max-width:300px;
	height:auto;
}
.login-logo-nysus{
	width:20%;
	height:auto;
}

INPUT.no-spin::-webkit-inner-spin-button, INPUT.no-spin::-webkit-outer-spin-button {
	-webkit-appearance: none;
    margin: 0;
}

.bg-body-danger {
	background: radial-gradient(rgba(255,255,255,1), rgba(200,0,0,1));
}

.bg-body-warning {
	background: radial-gradient(rgba(255,255,255,1), rgb(200, 113, 0));
}

.bg-body-success {
	background: radial-gradient(rgba(255,255,255,1), rgb(0, 200, 10));
}

#div_select_parameter_range BUTTON.inactive SPAN {
	display: none;
}

#div_select_parameter_range BUTTON.active {
	background-color: limegreen;
}

BUTTON.btn-scale {
	font-size: 1.5vh;
}