
/*  div.sysdisplay element classes
 *  --------------------------------------------------------------------------------  */

div.sysdisplay {
  display:		block;
  margin:		0px;
  padding:		0px;
  border:		0px;
}

div.sysdisplay p.options {
  float:		right;
  margin:		0px;
  padding:		2px 0px;
  font:			normal normal 100 12pt arial,sans-serif;
}

div.sysdisplay p.heading {
  color:		black;
  margin:		0px;
  padding:		2px 0px;
  border-bottom:	1px solid #7E0202;
  font:			normal normal bold 14pt arial,sans-serif;
}

div.sysdisplay div.warning {
  background-color:	yellow;
  color:		#FF0000;
  position:		relative;
  margin:		8px 0px;
  padding:		6px;
  border:		1px solid #FF0000;
  text-align:		center;
  vertical-align:	middle;
  font-weight:		bold;
}

div.sysdisplay div.warning img.warning {
  position:		absolute;
  top:   0px;		left:   0px;
  width: 24px;		height: 24px;
  margin:		2px 6px;
}

div.sysdisplay div.warning a {
  color:		red;
}

div.sysdisplay table {
  width:		100%;
  margin:		10px 0px;
  padding:		0px;
}

div.sysdisplay table th {
  background-color:	#C4151C;
  color:		#D9D9D9;
  margin:		2px;
  padding:		1px 2px;
  font:			normal normal 100 10pt arial,sans-serif;
}

div.sysdisplay table th a {
  color:		white;
}

div.sysdisplay table td {
  margin:		0px;
  font:			normal normal 100 10pt verdana,sans-serif;
}

div.sysdisplay table td div.heading {
  padding-bottom:	2px;
  border-bottom:	1px solid #333;
  font-weight:		bold;
}

div.sysdisplay table td.label {
  width:		192px;
  padding:		2px 4px;
  text-align:		right;
  vertical-align:	top;
  font-size:		11pt;
}

div.sysdisplay table td.label span.required {
  color:		#C90000;
  font:			normal normal bold 9pt verdana,sans-serif;
}

div.sysdisplay table td.field {
  padding:		0px 4px;
  text-align:		left;
  font-size:		9pt;
}

div.sysdisplay table td.field span.fielderror {
  color:		#C90000;
  display:		block;
  font:			normal normal bold 8pt verdana,sans-serif;
}

div.sysdisplay img.sysicon {
  width:		16px;
  height:		16px;
  margin-top:		2px;
  padding:		0px 2px;
  border:		0px;
  cursor:		pointer;
}

/*  form field element classes
 *  --------------------------------------------------------------------------------  */

div.fieldset {
  position:		relative;
  border-top:		1px solid #C4151C;
  border-bottom:	1px solid #C4151C;
}

div.formtitle {
  margin:		1px 0px;
  padding:		1px 0px 2px 0px;
  color:		#000000;
  background-color:	#FFFF00;
  text-align:		center;
  font:			normal normal normal 8pt verdana,sans-serif
}

div.formerror {
  margin:		1px 0px;
  padding:		1px 0px 2px 0px;
  color:		#C4151C;
  background-color:	yellow;
  text-align:		center;
  font:			normal normal bold 9pt verdana,sans-serif;
}

div.formfield {
  position:		relative;
  padding:		4px 2px;
}

div.firstfield {
  margin-top:		12px;
}

div.finalfield {
  margin-bottom:	16px;
}

div.formfield label {
  float:		left;
  margin:		0px;
  padding:		4px 8px;
  text-align:		right;
}

div.formfield label span.required {
  color:		#C4151C;
  font-weight:		bold;
  font-size:		9pt;
}

div.formfield .fielderror {
  display:		block;
  position:		relative;
  margin-left:		15px;
  color:		#C4151C;
  text-align:		left;
  font:			normal normal bold 8pt verdana,sans-serif;
}

input.button {
  border:		1px solid #322111;
  color:		#322111;
  background-color:	#E8DBC1;
}


/*  utility classes
------------------------------------------------------------------------------------- */

.absolute
{ position:		absolute; }
.relative
{ position:		relative; }

.fullwidth
{ width:		100%; }
.halfwidth
{ width:		50%; }
.thirdwidth
{ width:		33%; }

/*  width classes */
.x48
{ width:		48px; }
.x64
{ width:		64px; }
.x96
{ width:		96px; }
.x128
{ width:		128px; }
.x160
{ width:		160px; }
.x192
{ width:		192px; }
.x256
{ width:		256px; }
.x512
{ width:		512px; }

/*  whitespace classes  */
.autoright
{ margin-right:		auto; }
.autoleft
{ margin-left:		auto; }
.separated
{ margin:		15px 0px; }
.outerpad4
{ margin:		4px; }
.outerpad8
{ margin:		8px; }
.innerpad2
{ padding:		2px; }
.innerpad4
{ padding:		4px; }
.innerpad8
{ padding:		8px; }
.innerpad16
{ padding:		16px; }
.innerpad24
{ padding:		24px; }
.squeeze4
{ padding-left: 4px;	padding-right: 4px; }
.squeeze8
{ padding-left: 8px;	padding-right: 8px; }
.squeeze16
{ padding-left: 16px;	padding-right: 16px; }
.pinch2
{ padding-top: 2px;	padding-bottom: 2px; }
.pinch4
{ padding-top: 4px;	padding-bottom: 4px; }
.pinch8
{ padding-top: 8px;	padding-bottom: 8px; }
.pinch16
{ padding-top: 16px;	padding-bottom: 16px; }
.pinch24
{ padding-top: 24px;	padding-bottom: 24px; }
.pinch32
{ padding-top: 32px;	padding-bottom: 32px; }
.indent24
{ padding-left:		24px; }
.indent128
{ padding-left:		128px; }
.indent160
{ padding-left:		160px; }
.indent192
{ padding-left:		192px; }

/* display styles */
.block
{ display:		block; }
.inline
{ display:		inline; }
.hidden
{ display:		none; }
.item
{ padding:		2px 0px; }


/*  float  */
.floatleft
{ float:		left; }
.floatright
{ float:		right; }
.clearfloat
{ clear:		both; }
.remainder
{ position: relative;	overflow: hidden; }


/*  background  */
.bglight
{ background-color:	#F9F9F9; }
.bgred
{ background-color:	#C90000; }
.bgblue
{ background-color:	#4977B5; }
.bggrey
{ background-color:	#C6C6C6; }


/*  font-sizes  */
.huge
{ font-size:		18pt; }
.xlarge
{ font-size:		14pt; }
.large
{ font-size:		12pt; }
.normal
{ font-size:		10pt; }
.medium
{ font-size:		9pt; }
.small
{ font-size:		8pt; }
.tiny
{ font-size:		7pt; }


/*  text-alignment  */
.top
{ vertical-align:	top; }
.left
{ text-align:		left; }
.right
{ text-align:		right; }
.center
{ text-align:		center; }
.justify
{ text-align:		justify; }


/*  font weights & colours  */
.bold
{ font-weight:		bold; }
.italic
{ font-style:		italic; }
.underline
{ text-decoration:	underline; }
.red
{ color:		#C90000; }
.amber
{ color:		orange; }
.green
{ color:                #00C900; }
.blue
{ color:                #003366; }
.gold
{ color:		#FFD700; }
.yellow
{ color:		#FFFF00; }
.white
{ color:		#FFFFFF; }
.black
{ color:		#000000; }
.golden
{ color:		#FFD100; }

.link
{ cursor:		pointer; }
.disabled
{ color:		gray; }


/*  broken browser  */
.clearfix:after {
  content:		"."; 
  display:		block; 
  height:		0px; 
  clear:		both; 
  visibility:		hidden;
}

* html>body .clearfix {
  display:		inline-block; 
  width:		100%;
}

* html .clearfix {
  /* Hides from IE-mac \*/
  height:		1%;
  /* End hide from IE-mac */
}
