html, body {
	width: 100%;
	height: 100%;
	overflow-x: hidden;
}

html {
	display: table;
	margin: auto;
}

body {
	display: table-cell;
	vertical-align: middle;

	background: rgba(12,96,129,1);
	background: -moz-linear-gradient(top, rgba(12,96,129,1) 0%, rgba(7,52,69,1) 100%);
	background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(12,96,129,1)), color-stop(100%, rgba(7,52,69,1)));
	background: -webkit-linear-gradient(top, rgba(12,96,129,1) 0%, rgba(7,52,69,1) 100%);
	background: -o-linear-gradient(top, rgba(12,96,129,1) 0%, rgba(7,52,69,1) 100%);
	background: -ms-linear-gradient(top, rgba(12,96,129,1) 0%, rgba(7,52,69,1) 100%);
	background: linear-gradient(to bottom, rgba(12,96,129,1) 0%, rgba(7,52,69,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0c6081', endColorstr='#073445', GradientType=0 );
}

.logout_field {
	position: fixed;
	top: 40px;
	left: 30px;
	width: 100%;
	color: #fff; 
}

.logout_field a {
	font-size: 18pt !important; 
	padding: 15px 20px; 
	background-color: #052632; 
	border-color: #0f303d; 
	border-radius: 5px!important; 
	cursor: pointer;
}

.calculator button {
	width: 80px;
	height: 60px;
}

.calculator button, .machine_list .item, #product button, .dialog button, #job tr {
	background-color: #fff;
	border-radius: 3px!important;
	font-size: 30px!important;
	border: 1px solid #f9f9f9;
	-moz-box-shadow: inset 1px -7px 12px -10px #000000;
    -webkit-box-shadow: inset 1px -7px 12px -10px #000000;
    box-shadow: inset 1px -7px 12px -10px #000000;
}

.calculator td , #product td{
	border: 10px solid transparent;
}

.calculator input[name='password'], .calculator input[name='qty'] {
	width: 352px;
	padding: 5px;
	font-size: 24px!important;
	margin: 20px 0 10px 0;
}

.calculator input[name='password'].error, .calculator input[name='qty'].error {
	border-color: #ed1c24;
}

.calculator input[name='password'].error::-webkit-input-placeholder, .calculator input[name='qty'].error::-webkit-input-placeholder {
	color: #ed1c24;
}

.machine_list {
	margin: 0 auto; width: 300px; margin-top: 20px;
}

.machine_list .item {
	cursor: pointer;
	padding: 10px 0;
	margin-bottom: 15px;
}

#product button {
	width: 320px;
	height: 80px;
}

.dialog {
	width: 700px;
	background-color: #fff;
	padding: 30px;
	border-radius: 5px;
}

.dialog-btn {
	padding: 15px 15px;
	width: 200px;
	margin: 0 15px;
}

#job .item {
	border-color: transparent;
}

#job .item td:first-child {
	padding: 20px;
	border-top-left-radius: 3px!important;
	border-bottom-left-radius: 3px!important;
}

#job .item td:last-child {
	background-color: #8cc63f; 
	padding: 20px; 
	border-top-right-radius: 3px!important; 
	border-bottom-right-radius: 3px!important;
}

#job .item td.select {
	cursor: pointer; 
}

#job .item.active td:first-child {
	color : #fff;
	background-color: #8cc63f;
}

#job .blank {
	background-color: transparent;
	border-color: transparent;
	box-shadow : none;
}

#job .blank td {
	height: 20px;
}

#clock {
	position: fixed;
	top: 15px;
	right: 30px;
	color: #fff;
	text-align: center;
	font-size: 20px;
	font-weight: bold;
}

#clock .time {
	font-size: 30px;
}

#clock .hours, #clock .minutes, #clock .seconds {
	display: inline-block;
}