a {
	text-decoration: none;
	color: #018636;
}

a:hover {
    color: #00843d;
}

input.date {
	width: 70px;
}

td.allocated {
	font-weight: bold;
	background-color:orangered !important;
	color: black;
}

td.warning-icon {
    background-image: url("/images/warning_24.png") !important;
    background-size: 18px 18px !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
}

div.buttonPadding {
	padding-top: 10px;
	padding-bottom: 10px;
}

input[type=text].error, input[type=text].alert {
	background-color: darkred;
	color: white;
	border-color: red;
	padding:0.35em;
	font-weight: 700;
}

div.header {
	background-color: #00843d;
	font-weight: bold;
	font-size: 12px;
	line-height: 18px;
	color:#fff;
	padding-left:5px;
}

div.fieldset {
	border: 1px solid #00843d;
	margin-right: 9px;
	margin-left: -1px;
	margin-bottom: 16px; // Leave room for borders
}

div.fieldset-last {
	margin-right: -1px;
}

div.fieldset > div {
	padding-left: 10px;
	padding-right: 10px;
}

tr.headers a {
	color: white;
}

a.selected {
	font-weight: bold;
	border: 1px solid black;
}

table.list {
	border: 1px solid #00843d;
}

table {
	table-layout: fixed;
}

td {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	vertical-align:top;
}

td.wrap {
	white-space: normal;
}

tr.headers th {
	background-color: #00843d;
	color: white;
	font-weight: bold;
	padding-left: 0.2em;
	padding-right: 1em;
	text-align: left;
}

tr.headers th.rightcell {
    text-align: right;
}

td.rightcell {
    text-align: right;
}

tr.headers {
	background-color: transparent;
}

th.action {
	background-color: #00843d;
}

tr.headers th.disabled {
	background-color: #00843d;
}

tr.headers th.wicket_orderNone {
	background-color: #00843d;
	text-align: left;
}

tr.headers th.wicket_orderNone a {
	background-color: #00843d;
	text-align: left;
	/**************************************/
	background-image: url(updown.png);
	background-repeat: no-repeat;
	padding-left: 18px;
}

tr.headers th.wicket_orderDown {
	background-color: #00843d;
	text-align: left;
}

/* Up and down are list ascend or descend - the opposite of the visual direction */
tr.headers th.wicket_orderDown a {
	background-image: url(up.png);
	background-repeat: no-repeat;
	padding-left: 18px;
}

tr.headers th.wicket_orderUp {
	background-color: #00843d;
	text-align: left;
}

tr.headers th.wicket_orderUp a {
	background-image: url(down.png);
	background-repeat: no-repeat;
	padding-left: 18px;
}

/* Wicket disagrees with blueprint over even/odd labelling. Override. */
/* Split CSS to work around IE7/IE8 bugs:
   http://stackoverflow.com/questions/3282066/ie8-and-jquery-selectors/3282118#3282118 */
tbody tr:nth-child(even) td {
	background: #bad4c1;
}
tbody tr.odd td  {
	background: #bad4c1;
}

tbody tr:nth-child(odd) td {
	background: transparent;
}
tbody tr.even td  {
	background: transparent;
}

.calheader {
	color: black;
}

span.excluded {
	font-style: italic;
}

span.included {
	font-weight: bold;
}

ul.feedbackPanel {
	list-style-type: none;
	width:850px;
}

ul.feedbackPanel li {
	border: 1px solid black;
	padding: 8px;
	margin-top: 5px;
	font-weight: bold;
}

li.feedbackPanelINFO {
	background-color: #e0ffe0;
}

li.feedbackPanelWARNING {
	background-color: #ffff99;
}

li.feedbackPanelERROR {
	background-color: #ffd6e7;
}

div.wicket-aa {
    background-color:white;
    border:1px solid #CCCCCC;
    color:black;
}
div.wicket-aa ul {
   list-style-image:none;
   list-style-position:outside;
   list-style-type:none;
   margin:0pt;
   padding:5px;
}
div.wicket-aa ul li.selected {
    background-color:#CCCCCC;
}

span.required {
	color: #f00;
}

input.invalid {
	background-color: #FF6666;
    color: black;
    border-color: darkRed;
}

select.invalid {
	background-color: #FF6666;
	color: black;
	border-color: darkRed;
}

select:focus {
     border-color: #000;
}

div.validation {
	font-size: small;
	color: #d00;
}

table.moneybox {
	border-collapse: collapse;
	border: 0.3em solid black;
}

table.moneybox td {
	border: 0.1em solid black;
}

tr.bordered {
	border: 0.3em solid black;
}

td.bordered {
	border: 0.3em solid black;
}

td.vatcolumn select {
	width:85px;
}

tr.lightbordered {
	border: 0.1em solid black;
}

td.lightbordered {
	border: 0.1em solid black;
}

td.disabled {
	color: gray;
}

.clampedcolumn {
	display: block;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	text-align: left;
}

ul.topnav {
	list-style: none;
	padding: 0 20px;
	margin: 0;
	float: left;
	width: 910px;
	background: #222;
	font-size: 1.2em;
}
ul.topnav li {
	float: left;
	margin: 0;
	padding: 0 15px 0 0;
	position: relative; /*--Declare X and Y axis base for sub navigation--*/
}
ul.topnav li a{
	padding: 10px 5px;
	color: #fff;
	display: block;
	text-decoration: none;
	float: left;
}
ul.topnav li span { /*--Drop down trigger styles--*/
	width: 17px;
	height: 35px;
	float: left;
}
ul.topnav li span.subhover {background-position: center bottom; cursor: pointer;} /*--Hover effect for trigger--*/
ul.topnav li ul.subnav {
	list-style: none;
	position: absolute; /*--Important - Keeps subnav from affecting main navigation flow--*/
	left: 0; top: 35px;
	background: #00843d;
	margin: 0; padding: 0;
	display: none;
	float: left;
	width: 170px;
	border: 1px solid #111;
}
ul.topnav li ul.subnav li{
	margin: 0; padding: 0;
	border-top: 1px solid #252525; /*--Create bevel effect--*/
	border-bottom: 1px solid #444; /*--Create bevel effect--*/
	clear: both;
	width: 170px;
}
html ul.topnav li ul.subnav li a {
	float: left;
	width: 145px;
	padding-left: 20px;
}
div.filter {
	/*background-color: #ddd;*/
	background-color: #bad4c1;
	/*background-color: #00843d;*/
	margin-right: 9px;
	margin-left: -1px;
	margin-bottom: 16px; // Leave room for borders

}

div.filter > div {
	padding-left: 10px;
	padding-right: 10px;
}


/* Format font-size */
ul#font-size {
	margin: 0;
	padding: 0;
	line-height: 18px;
}

ul#font-size li {
	display: inline;
}

ul#font-size li a.default {
	font-size: x-small;
}

ul#font-size li a.larger {
	font-size: small;
}

ul#font-size li a.largest {
	font-size: medium;
}

body.default ul#font-size li a.default {
	text-decoration: underline;
}

body.larger ul#font-size li a.larger {
	text-decoration: underline;
}

body.largest ul#font-size li a.largest {
	text-decoration: underline;
}

html, body {
height: 100%;
}

/*
here's our class for browsers without a zoom property,
this sets the transform's origin. In this case it defines
the point from which our scale will happen.
We want it to row from the center and from the top,
so 50% and 0 it is.
*/
.no-zoom body {
	-o-transform-origin:50% 0;
	-moz-transform-origin:50% 0;
}
/*
classes for browsers with zoom
*/
.zoom body.larger {
	zoom:110%;
}
.zoom body.largest {
	zoom:125%;
}
/*
and classes for browsers that don't support zoom
*/
.no-zoom body.larger {
    -o-transform: scale(1.1);
    -moz-transform: scale(1.1);
    transform: scale(1.1);
}
.no-zoom body.largest {
    -o-transform: scale(1.25);
    -moz-transform: scale(1.25);
    transform: scale(1.25);
}

.selectbutton {
	margin: 4px;
	height: 36px;
}

.selectcontainer .selected {
	font-weight: bold;
}

.mainheader > .container {
    background-color: transparent;
}

.wrapper > .container {
    height: auto !important; /* ie6 ignores !important, so this will be overridden below */
    min-height: 100%; /* ie6 ignores min-height completely */
    height: 100%;
    background-color: white;
}


/* http://woork.blogspot.com/2008/03/clean-tab-bar-digg-like-using-css.html */

div.tab-row ul, div.tab-row li{border:0; margin:0; padding:0; list-style:none;}
div.tab-row ul{
border-bottom:solid 1px #DEDEDE;
color:#fff;
height:24px;
padding-left:20px;
margin-bottom: 12px;
}
div.tab-row li{float:left; margin-right:2px;}

div.tab-row  a:link, div.tab-row  a:visited{
background:url(tab-round.png) right 60px;
color:#fff;
display:block;
font-weight:bold;
height:24px;
line-height:24px;
text-decoration:none;
}
div.tab-row  a span{
background:url(tab-round.png) left 60px;
display:block;
height:24px;
margin-right:20px;
padding-left:8px;
color:#fff;
}
div.tab-row  a:hover{
background:url(tab-round.png) right 30px;
display:block;
}
div.tab-row  a:hover span {
background:url(tab-round.png) left 30px;
display:block;
}

div.tab-row  a.highlight {
background:url(tab-round.png) right 120px;
display:block;
}
div.tab-row  a.highlight span{
background:url(tab-round.png) left 120px;
padding-left: 30px;
display:block;
}

div.tab-row  a:hover.highlight {
background:url(tab-round.png) right 90px;
display:block;
}
div.tab-row  a:hover.highlight span {
background:url(tab-round.png) left 90px;
display:block;
}

/* -------------------------------- */
/* ACTIVE ELEMENTS */
div.tab-row .selected a {
background:url(tab-round.png) right 0 no-repeat;
display:block;
font-weight:bold;
height:24px;
line-height:24px;
text-decoration:none;
font-style: normal;
}

div.tab-row .selected a span {
background:url(tab-round.png) left 0 no-repeat;
display:block;
height:24px;
margin-right:20px;
padding-left:8px;
}

/* Grey out placeholder in IE */
input.placeholder {
	color: #666;
}

table.fixedheight {
	display: block;
	height: 335px;
	min-height: 335px;
}

table.fixedheight td span {
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	-o-text-overflow: ellipsis;
	-ms-text-overflow: ellipsis;
}

/* Blueprint would make this 100% */
table.yui-calendar {
	width: auto;
}

div.picturebutton {
	position: relative;
	float: left;
	width: 190px;
	margin: 5px 20px;
}

div.picturebutton img {
	width: 150px;
	height: 100px;
	margin: 20px;
	margin-bottom: 40px;
}

div.picturebutton h2 {
	position: absolute;
	top: 130px;
	left: 0px;
	margin: 0;
	width: 210px;
	text-align: center;
	height: 20px;
}

div.picturebutton h2 span {
   color: #000;
   font: bold 16px/30px Helvetica, Sans-Serif;
   letter-spacing: 0px;
   background: transparent;
   /* background: rgba(255,255,255, 0.6); */
   padding: 4px;
}

div.visuraloverlaycontent {
	background-color: white;
	border: 1px solid black;
	padding: 10px;
}

.dcolumn {
	width:1200px;
}

.jobcolumn {
	width:260px;
	float:left;
	padding-left:15px;
	padding-right:15px;
}

.dcolumnleft {
	width:450px;
	float:left;
	padding-left:30px;
	padding-right:30px;
}

.dcolumnright {
	width:450px;
	float:right;
	padding-left:30px;
	padding-right:30px;
}

.wider .dcolumnright {
	width:520px;
}

.wider .dcolumnleft {
	width:520px;
}

.wider td {
    white-space:normal;
}

.datablock {
	width:450px;
	line-height: 18px;
	clear:both;
}

.datalabel {
	width:110px;
	margin-right: 10px;
	float:left;
}

.datablockitem {
	width:230px;
	float:left;
	font-weight:bold;
	color:#040404;
	overflow-y:auto
}

.datablockinput {
	width:450px;
	max-height:25px;
}

.datalabelinput {
	width:200px;
	float:left;
	max-height:25px;
}

.datablockiteminput {
	width:250px;
	float:left;
	font-weight:bold;
	max-height:25px;
}

.financeblock {
	width:525px;
	margin-left: auto;
	margin-right: auto;
}

.financelabel {
	width:300px;
	float:left;
}

.financeitem {
	width:225px;
	float:right;
	font-weight:bold;
	overflow-y:auto
}
.vehiclelabel {
	width:100px;
	float:left;
	font-weight:bold;
}
.vehicleblock {
	width:350px;
	float:left;
	/*font-weight:bold;*/
	/*color:#007430;*/
	overflow-y:auto
}

.vehicleheading {
	width:100px;
	float:left;
	max-height:25px;
}

.vehicledata {
	width:250px;
	float:left;
	font-weight:bold;
	color:#007430;
	overflow-y:auto
}

.dialogbox {
	display: block;
	text-align: center;
	padding: 30px;
}
h2 {
	font-variant: small-caps;
}
h4 {
	font-style:italic;
}
.warning {
	background: #ff0000 !important;
	color: white;
	font-weight: bold;
}

.warning input{
	background: #ff0000 !important;
	color: white;
	font-weight: bold;
}
/*.container {width:1200px;margin:0 auto;}*/
.span-nano {width:5px;}
.span-1-5 {width:50px;}
.span-2-5 {width:90px;}
center {
	padding-bottom:10px;
}

.minus-finance{
	color:red;
}

.plus-finance{
	color:darkgreen;
}

/* Get rid of this if this is causing layout issues */
form.inline {
	line-height:2.75;
}

tbody tr.even td.grey {
	background-color:#DCDCDC;
	font-style:italic;
}

tbody tr.odd td.grey {
	background-color:#DCDCDC;
	font-style:italic;
}

tbody tr.even td.blue {
	background-color:#6599FF;
	font-style:italic;
}

tbody tr.even td.unsold-last {
	background-color:#1f7a1f;
    color:#fff;
	font-style:italic;
	font-weight: bold;
}

tbody tr.even td.all {
	background-color:#99FF99;
}

tbody tr.even td.some {
	background-color:#FFFF99;
	font-style:italic;
}

tbody tr.even td.amended {
	background-color:#c178e2;
	font-style:italic;
}

tbody tr.even td.none {
	background-color:#FF6666;
	color: white;
	font-style:italic;
}

tbody tr.odd td.blue {
	background-color:#6599FF;
	font-style:italic;
}

tbody tr.odd td.unsold-last {
	background-color:#1f7a1f;
	color:#fff;
	font-style:italic;
	font-weight: bold;
}

tbody tr.odd td.all {
	background-color:#99FF99;
}

tbody tr.odd td.some {
	background-color:#FFFF99;
	font-style:italic;
}

tbody tr.odd td.amended {
	background-color:#c178e2;
}

tbody tr.odd td.none {
	background-color:#FF6666;
	color: white;
	font-style:italic;
}

tbody td.obsolete, div.obsolete {
    text-decoration: line-through;
    color: #444;
}

td.virtuallot div:before {
    content: 'V:';
    font-weight: bold;
}

tbody td.invoiceunissued {
    color: #CC6600;
}

/* Save datepicker from blueprint defaults: http://stackoverflow.com/a/3996610/184998 */
/* remove blue backgrounds - separate for TH to work in IE */
.ui-datepicker-calendar tbody tr:nth-child(even) td,
.ui-datepicker-calendar tbody tr.even td {
  background-color:inherit;
 }
.ui-datepicker-calendar thead th {
  background-color:inherit;
  padding: 0px 3px;
 }
/* set correct line height */
.ui-datepicker-calendar tbody tr td {
  line-height: 1.1;
}
/* (optional)  make same size as example */
.ui-datepicker { font-size: 0.9em; }


.alignright {
	text-align:right;
}
tr.headers th.alignright {
    text-align:right;
}


div.warning {
   border: 3px solid #f00;
   padding: 10px;
   margin: 10px;
}

div.wicket-aa {
	background-color: white;
	border: 1px solid #CCCCCC;
	color: black;
}

div.wicket-aa ul {
	list-style-image: none;
	list-style-position: outside;
	list-style-type: none;
	margin: 0pt;
	padding: 5px;
}

div.wicket-aa ul li.selected {
	background-color: #CCCCCC;
}

.mainheader
{
    width:100%;
    height: 50px;
    background-color: black;
    color:white;
    font-family: Arial;
}

.mainheader a:hover {
    color: #bad4c1;
}

.left{
    float:left;
    width:100px;
}
.right{
    float:right;
}

.mainheader .right {
    padding-top: 8px;
    height: 50px;
    /*width:100px;*/
}
.center{
    display:block;
    margin:auto;
    width:300px;
    padding-top: 8px;
    height: 50px;
}

body {
    background-image:url(images/wrapper_background_1250.png);
    background-repeat:repeat-y;
    background-position: center;
}

a.ui-button {
   margin-top: 2px;
   margin-bottom: 2px;
}

div#menubackground {
    background: url(images/menu_background.png) repeat-x;
    height:32px; z-index:1000;
}

.overflow-left {
	direction: rtl;
}

table tfoot tr.navigation div.navigator {
	font-size: 140%;
}

div.flexcolumns {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
}

div.flexrows {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
}

div.inputpanel {
    display: flex;
    align-items: baseline;
}

td.emphasise {
	font-weight: bold;
}

div.tab-panel {
    clear: both;
}

.pill {
	padding: 2px 8px 4px 8px;
	font-weight: 500;
	background-color: #e70012;
	font-size: 12px;
	border-radius: 10px;
}

.checkered-background {
    background-image:
      linear-gradient(45deg, #ccc 25%, transparent 25%),
      linear-gradient(135deg, #ccc 25%, transparent 25%),
      linear-gradient(45deg, transparent 75%, #ccc 75%),
      linear-gradient(135deg, transparent 75%, #ccc 75%);
    background-size:25px 25px;
    background-position:0 0, 12.5px 0, 12.5px -12.5px, 0px 12.5px;
}

input[readonly] {
    background-color: #eee;
}