body {
	margin: 0px;
	padding: 0px;
	font-family: sans-serif;
}

div.content {
	margin: 8px;
}

div.overlay {
	position: fixed;
	width: 100%;
	margin: 100%;
	text-align: centre;
	left: 0px;
	top: 0px;
	margin: 0px;
	padding: 0px;
	border: 0px;
	z-index: 1000;
}
	
div.blanker
	{
		position: fixed;
		width: 100%;
		height: 100%;
		padding: 0px;
		margin: 0px;
		border:0px;
		left: 0px;
		top: 0px;
		background-color: bbb;
		opacity: 0.8;
		z-index: 950;
	}
	
	.lockPending {
		border: 3px solid orange;
	}
	
	.lockGranted {
		border: 3px solid blue;
	}
	
a.closer
	{
		position: absolute;
		width: 15%;
		height: 30%;
		min-width: 40px;
		min-height: 40px;
		top: 0px;
		right: 0px;
		z-index: 975;
		background-color: #fee;
		font-size: 30px;
		text-align: center;
		border: 3px solid red;
		border-radius: 3px;
	}
	
.errors
	{
		color: black;
		border: 1px solid red;
		margin: 5px;
		padding: 5px;
		border: 1px solid #daa;
		border-radius: 3px;
		display: inline-block;
	}
	

.searchresult {
	margin: 10px;
}

div.overlay div.displaybox
	{
		position: fixed;
		width: 95%;
		height: 85%;
		margin-top: 5%;
		margin-left: 1%;
		margin-right: 1%;
		margin-bottom: 5%;
		padding-top: 1%;
		padding-bottom: 1%;
		padding-left: 1%;
		padding-right: 1%;
		text-align: left;
		opacity: 1;
		background-color: white;
		border: 2px solid black;
		border-radius: 10px;
		z-index: 1001;
		overflow: scroll;
	}

div.overlay .errors
	{
		color: white;
		background-color: #a44;
		margin: 5px;
		padding: 5px;
		border: 1px solid #daa;
		border-radius: 3px;
		display: inline-block;
	}
	
div.overlay h2
	{
	}

label {
		min-width: 8em;
		display: inline-block;
}
	
img.companylogo {
    float: right;
    padding: 10px;
    max-width: 200px;
}
	
span.alarmmargin
	{
		color: #999;
	}
	
div.monitorLink
	{
		display: block;
		float: left;
		margin: 2px;
		border: 1px solid grey;
	}
	
	div.monitorlink a
	{
		padding: 8px;
		display: block;
		min-width: 12em;
	}
	
	
div.monitorlinkmenu a
{
	padding: 8px;
	display: block;
	width: 12em;
	color: white;
	font-family: sans-serif;
    background-color: #444;
    margin: 3px;
	text-align: left;
}

div.monitorlinkmenu a:visited
	{
		color: white;
	}

div#Wait
{
	position: fixed;
	z-index: 10;
	width: 100%;
	padding-top: 10%;
	text-align: center;
	display: none;
}

div.controlBlock {
	margin: 5px;
}

div.controlForm {
	border: 1px solid black;
    display: block;
    width: auto;
    float: left;
	/*clear: right;*/
    padding: 10px;
    margin: 10px;
	min-height: 10em;
}

div.clearer {
	clear: both;
}
	
div.displaybox input[type=text]
	{
		width: 180px;
	}

td div.Detail
{
	position: absolute;
	z-index: 10;
	background: white;
	width: 0px;
	margin: 0px;
	padding: 0px;
	border: 0px;
	overflow: hidden;
}

td:hover div.Detail
{
	width: 500px;
	transition: 0.5s width;
	transition-delay: 0.5s;
}

div.Detail:hover
{
	width: 500px;
}

div.help
{
	padding: 10px;
	width: 478px;
	border: 1px solid black;
}

div.help h2
{
	font-size: 120%;
	margin-top: 5px;
	margin-bottom: 5px;
}

h1 {
	margin-left: 20px;
	margin-right: 20px;
}

	
div.menu {
		width: 100%;
		/*height: 40px;*/
		background-color: black;
		color: white;
		text-align: right;
		font-size: 80%;
		padding: 0px;
		margin: 0px;
	}
	
div.menu .userelement
	{
		padding: 3px;
	}

div.menu input[type=button]
	{
		padding-left: 5px;
		margin-left: 10px;
		background-color: #555;
		color: #fff;
	}

div.menu input[type=submit]
	{
		padding-left: 5px;
		margin-left: 10px;
		background-color: #555;
		color: #fff;
	}

div.menu .popout
	{
		position: absolute;
		display:none;
		width: 14em;
		right: 5px;
		background-color: black;
	}
	
div.menu .popout input[type=button] {
	float:right;
	clear:right;
	margin: 5px;
	border: 0px;
}
	
div.menu .menutrigger {
	display: inline;
}
	
div.menu .menutrigger:hover .popout
	{
		display:block;
	}

.pager h4 {
	margin-bottom: 0.25em;
}

.pager a {
	display: inline-block;
	min-width: 4em;
	border-style: outset;
	margin: 5px;
	background-color: lightgrey;
	text-align: center;
	padding: 0.5em 0.5em;
	border-radius: 7px;
}

.callstable th {
	text-align: left;
	margin-right: 5px;
}
.callstable td {
	margin-right: 5px;
}
.callstable tr:nth-child(odd) {
	background-color: #ddd;
}

.callid  {
	display:none;
}

.rpl { display:none; }

.pagernote {
	font-size: 80%;
}

.itemLabel {
	display: inline-block;
	min-width: 8em;
    text-align: right;
    margin-right: 0.5em;
}
input.shortbox {
	width: 5em;
}
input.medbox {
	width: 7em;
}
.lastchange { font-size: 80%; }

h2.customername {
	margin: 0px;
	margin-top: 10px;
}

.jobimages {
float: right;
clear: right;
}

.jobimages > .imagebox {
	max-width: 100px;
	max-height: 100px;
	margin: 3px;
}

.jobimages .embiggened {
	max-width: 90%;
	position: absolute;
	right: 10%;
	top:10%;
}

.jobimages .imagebox img {
	width: 100%;
}

table.joblinetable {
	width: 100%;
	border-radius: 5px;
	border: 1px solid grey;
	padding: 5px;
}

.joblinelong {
	width: 100%;
}
.joblinemedium {
	width: 8em;
}
.joblineshort {
	width: 4em;
}
.joblinedate {
	width: 6em;
}
.joblineveryshort {
	width: 2em;
}

tr.header {
	border-bottom: 1px solid grey;
}

th.narrow {
	width: 4em;
}

th.vnarrow {
	width: 2em;
	font-size: 80%;
}

.itemLabel {
	display: inline-block;
	padding: 5px;
	background-color: lightgrey;
}
	
.jobmemodetail {
	margin-bottom: 10px;
}

.jobmemodetail textarea {
	width: 100%;
    font-family: sans-serif;
    border-radius: 5px;
}

.jobmemodetail textarea {
    font-family: sans-serif;
}

.jobmemodetail textarea.changed {
	background-color: #afa;
}

input[type=checkbox].changed {
	outline: 5px solid #afa;
}

.changed {
	background-color: #afa;
}

.savebutton {
	float:right;
	clear:right;
}

.savebutton #unsavedchanges {
	color: black;
}

table.signbox { 
width: 100%;
border: 2px solid black;
border-radius: 10px;
margin-top: 5px;
padding: 10px;
display: none;
	display:none;
}
table.signbox tbody { display: block; }
table.signbox tr { display: block; }

.signature {
	border-bottom: 2px dotted grey;
	margin-bottom: 5px;
	margin-right: 5%;
	margin-top:1em;
	width: 70%;
	display:inline-block;
	font-style:italic;
}

.datebox {
	border-bottom: 2px dotted grey;
	margin-bottom: 5px;
	margin-top:1em;
	width: 20%;
	display:inline-block;
	font-style:italic;
}
.doprint {display: none; }
.doprintInline {display: none; }
	
@media print {
	a:link { text-decoration: none; color: black; }
	a:active { color: black; }
	a:hover { color: black; }
	a:visitor { color: black; }
	div.content { margin-top: 0px; margin-bottom: 0px; } 
	div.menu { display: none; }
	input[type=button], input[type=submit], input[type=reset] { display:none; }
	.noprint { display: none; }
	.doprint {display: inherit; }
	.doprintInline {display: inline-block; }
	
	.pager { display:none; }
	h1 { display:none; }
	.saveButton { display: none; }
	img.companylogo {max-width: 2cm; margin-top: 1cm;}
	.jobmemodetail textarea { /*height: 8em;*/ }
	.jobmemodetail { margin-bottom: 0px; }
	.itemlabel { font-size: 80%; font-weight: bold;}
	.input { border: 0px; }
	.select { border: 0px; }
	.joblinedate { border: 0px;width: 80px;}
	.joblinemedium { border: 0px;width: 70px;}
	.joblinelong { border: 0px; width: 565px;}
	.joblineshort { 	width: 30px;  }
	th { width: 580px; }
	th.narrow { 	width: 70px; }
	/*th.vnarrow { 	width: 60px; }*/

	th.vnarrow {
		width: 2em;
		font-size: 80%;
	}
	.joblineshort {	width: 40px; border: 0px; }
	.datecol > .joblineshort { text-align: right; }
	.lastchange { font-size: 70%; }
	a { color; black; }
	a:visited: { color: black; }
    input,select {
        border: 0 !important;
        border-style: none !important;
		min-width: 40px;
		max-width: fit-content;
		  -moz-appearance: none;
		  -webkit-appearance: none;
		appearance: none;    
    }
		table.signbox { display: block; }

	label {
			min-width: 7em;
	}
	.joblineveryshort {	width: 1em; min-width: 1em;}
	input { width: 75px; }
	textarea { border: 1px solid grey; border-radius: 10px; }
	table.joblinetable {border: 1px solid grey; border-radius: 10px; display:block;}
	table.joblinetable tbody {display:block;}
	table.joblinetable tr {display:block;}
    input[type="checkbox"] {
  -moz-appearance: auto;
  -webkit-appearance: auto;
  appearance: auto;    
    }
	.itemlabel {min-width: 6em; margin-right: 0.1em; padding:2px; }
}
@media print and (orientation: landscape) {
    /* landscape styles */
/*	.joblinelong {  width: 905px;}*/
	.joblinelong {  width: 885px;}
	th { width: 940px; }
	table.joblinetable { 	width: 100%; }
}

@media only screen and (max-width: 1024px ) {
	.jobimages { float: none; }
	.itemlabel {min-width: 6em; margin-right: 0.1em; padding:2px; }
	.joblinequantity {	width: 40px; }
	.joblinetable {margin: 0px; padding:0px;}
	img.companylogo { max-width: 25%; }
	.jobimages .embiggened { position: static; }
	
}

@page {
   size: auto;
	margin: 0;
	margin-left: 1cm; margin-right: 1cm;
	padding-top: 1cm;
}