/*
Copyright (c) 2011, Bonafide, Inc. All rights reserved.
http://www.bonafide.com
author: Victor Chen
version: 1.0.1
*/

/*
The foundational reset CSS file removes and neutralizes the inconsistent
default styling of HTML elements, creating a level playing field across
A-grade browsers and providing a sound foundation upon which you can
explicitly declare your intentions.
*/
html {
	color:#000000;
	background:#FFFFFF
}
div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td {
	margin:0;
	padding:0
}
table {
	border-collapse:collapse;
	border-spacing:0
}
fieldset,img {
	border:0
}
address,caption,cite,code,dfn,em,strong,th,var,optgroup {
	font-style:inherit;
	font-weight:inherit
}
del,ins {
	text-decoration:none
}
li {
	list-style:none
}
caption,th {
	text-align:left
}
h1,h2,h3,h4,h5,h6 {
	font-size:100%;
	font-weight:normal
}
q:before,q:after {
	content:''
}
abbr,acronym {
	border:0;
	font-variant:normal
}
legend {
	color:#000000
}
input,button,textarea,select,optgroup,option {
	font-family:inherit;
	font-size:inherit;
	font-style:inherit;
	font-weight:inherit
}
input,button,textarea,select {
	*font-size:100%
}
body {
	margin:10px;
	padding:0px;
	font:13px/1.231 Trebuchet MS,arial,helvetica,clean,sans-serif;
	*font-size:small;
	*font:x-small;
	text-align:center
}
select,input,textarea,button {
	font:99% Trebuchet MS,arial,helvetica,clean,sans-serif
}
table {
	font-size:inherit;
	font:100%
}
pre,code,kbd,samp,tt {
	font-family:monospace;
	*font-size:108%;
	line-height:100%
}
img {
	vertical-align:middle
}
a:link,a:visited,a:hover,a:active,
a.default:link,a.default:visited,a.default:hover,a.default:active {
	color:#0066CC;
	font-weight:normal;
	text-decoration:underline
}
a.black:link,a.black:visited,a.black:hover,a.black:active {
	color:#000000;
	font-weight:inherit;
	text-decoration:underline
}
a.warn:link,a.warn:visited,a.warn:hover,a.warn:active {
	color:#FF0000;
	font-weight:inherit;
	text-decoration:underline
}
a.secondary:link,a.secondary:visited,a.secondary:hover,a.secondary:active {
	color:#7F7F7F;
	font-weight:inherit;
	text-decoration:underline
}
a.plain:link,a.plain:visited,a.plain:hover,a.plain:active {
	color:inherit;
	font-weight:inherit;
	text-decoration:none
}

/*
Table for central error page.
An error table is usually used to indicate that an
unexpected program error has happended, and error
message will be displayed.
*/
table.error {
	width:100%
}
table.error>tbody>tr>td {
	text-align:left
}
table.error>tbody>tr>td.error {
	background-color:#0066CC;
	padding:6px 10px 6px 10px;
	color:#FFFFFF;
	font-size:174%;
	font-weight:bold
}
table.error>tbody>tr>td.title {
	padding:10px 10px 5px 10px;
	font-size:174%;
	font-weight:bold
}
table.error>tbody>tr>td.ticket {
	padding:0px 10px 0px 10px;
	color:#FF0000;
	font-weight:bold
}
table.error>tbody>tr>td.message {
	padding:0px 10px 12px 10px
}

/*
Table for form editing.
An editable table is usually used in the typical form
table with two columns, left hand side is the label while
the right hand side is the input field entry.
*/
table.edit {
	width:100%
}
table.edit>tbody>tr>td {
	text-align:left;
	vertical-align:top;
	white-space:nowrap
}
table.edit>tbody>tr.title>td {
	padding:12px 5px 15px 5px
}
table.edit>tbody>tr.title>td>div.name {
	font-size:182%;
	font-weight:bold;
	text-align:center
}
table.edit>tbody>tr.title>td>div.subtitle {
	text-align:center
}
table.edit>tbody>tr.message>td {
	padding:10px 5px 5px 5px
}
table.edit>tbody>tr.message>td>div.stepBox {
	position:relative
}
table.edit>tbody>tr.message>td>div.stepBox>div.stepBg {
	position:absolute;
	width:48px;
	left:-36px;
	top:-30px;
	z-index:24
}
table.edit>tbody>tr.message>td>div.canvas {
	padding:10px;
	white-space:normal
}
table.edit>tbody>tr.message>td>div.indicatorBox {
	position:relative
}
table.edit>tbody>tr.message>td>div.indicatorBox>div.indicatorBg {
	position:absolute;
	width:12px;
	left:24px;
	top:-6px;
	z-index:24
}
table.edit>tbody>tr.group>td {
	border-style:solid;
	border-color:#CBCBCB;
	border-width:0px 0px 1px 0px;
	padding:10px 5px 5px 5px;
	color:#009DD9;
	font-size:123.1%;
	font-weight:bold;
	text-align:left
}
table.edit>tbody>tr.group>td.top {
	padding-top:5px
}
table.edit>tbody>tr.confirmation>td {
	text-align:center
}
table.edit>tbody>tr.confirmation>td>div.canvas.processResult {
	margin-bottom:5px
}
table.edit>tbody>tr.menuBar>td {
	padding-left:10px;
	padding-right:10px;
	border-style:solid;
	border-color:#2A6492;
	border-width:0px 0px 1px 0px
}
table.edit>tbody>tr>td.label {
	padding:5px 2px 1px 10px;
	text-align:right
}
table.edit>tbody>tr>td.label.strong {
	font-weight:bold
}
table.edit>tbody>tr>td.entry {
	padding:3px 10px 3px 5px
}
table.edit>tbody>tr>td.entry.profileBox {
	background-color:#EEEEEE;
	border:1px solid #000000
}
table.edit>tbody>tr>td.entry.profileBox.left {
	border-right-width:0px
}
table.edit>tbody>tr>td.entry.profileBox.right {
	border-left-width:0px
}
table.edit>tbody>tr>td.links {
	padding:3px 5px 3px 5px;
	font-family:arial;
	text-align:right;
	vertical-align:bottom;
	white-space:nowrap
}
table.edit>tbody>tr.linepad>td.label {
	padding-top:12px
}
table.edit>tbody>tr.linepad>td.entry {
	padding-top:10px
}
table.edit>tbody>tr.linepad>td.entry.secondary {
	min-width:125px;
	border-style:solid;
	border-color:#CBCBCB;
	border-width:0px 0px 0px 1px
}
table.edit>tbody>tr.sentence>td.label,
table.edit>tbody>tr.sentence>td.entry {
	padding-top:6px;
	padding-bottom:6px
}
table.edit>tbody>tr.buttons>td.left {
	padding:25px 5px 3px 5px
}
table.edit>tbody>tr.buttons>td.right {
	padding:25px 5px 3px 5px;
	text-align:right
}
table.edit>tbody>tr.buttons.top>td {
	padding-top:5px;
	padding-bottom:12px;
	border-style:solid;
	border-color:#CBCBCB;
	border-width:0px 0px 1px 0px
}
table.edit>tbody>tr.buttons.squeezed>td.left,
table.edit>tbody>tr.buttons.squeezed>td.right {
	padding-top:0px;
	padding-right:0px;
	padding-bottom:10px;
	padding-left:0px
}
table.edit>tbody>tr.buttons>td>button {
	font-size:100%
}
table.edit>tbody>tr>td.entry>input[type=text].warn,
table.edit>tbody>tr>td.entry>textarea.warn {
	background-color:#FECC46;
	border-style:solid;
	border-color:#000000;
	border-width:1px
}
table.edit>tbody>tr>td.entry>input[type=text].extended,
table.edit>tbody>tr>td.entry>textarea {
	width:85%
}
table.edit>tbody>tr>td.entry>div.rich {
	width:90%;
	min-height:20px;
	margin-bottom:2px;
	padding:2px 5px 5px 5px;
	border-style:solid;
	border-top-width:2px;
	border-right-width:1px;
	border-bottom-width:1px;
	border-left-width:2px;
	border-top-color:#606060;
	border-right-color:#D4D0C8;
	border-bottom-color:#D4D0C8;
	border-left-color:#606060;
	white-space:normal
}
table.edit>tbody>tr.previewed>td.entry {
	padding-top:4px;
	padding-right:5px;
	padding-bottom:12px;
	padding-left:5px
}
table.edit>tbody>tr.previewed>td div.pc {
	background-color:#EEEEEE;
	padding:6px;
	min-height:50px;
	font-family:arial
}
table.edit>tbody>tr.previewed>td div.pc div {
	white-space:normal
}
table.edit>tbody>tr.previewed>td div.pc div.icn {
	float:left;
	border:1px solid #7F7F7F;
	width:48px;
	height:48px;
	margin-right:8px
}
table.edit>tbody>tr.previewed>td div.pc div.vld {
	float:right
}
table.edit>tbody>tr.previewed>td div.pc pre {
	font-family:arial;
	white-space:normal
}

/*
Table for advanced search criteria.
An advanced search criteria table is usually used in
the typical form table with two columns, left hand side
is the label while the right hand side is the input
field entry.
*/
table.criteria {
	width:100%;
	font-family:arial
}
table.criteria>tbody>tr>td {
	text-align:left;
	vertical-align:top;
	white-space:nowrap
}
table.criteria>tbody>tr.group>td {
	padding:10px 5px 5px 5px;
	font-weight:bold
}
table.criteria>tbody>tr.group>td.top {
	padding-top:2px
}
table.criteria>tbody>tr>td.label {
	padding:5px 2px 1px 15px
}
table.criteria>tbody>tr>td.entry {
	padding:3px 10px 3px 5px
}
table.criteria>tbody>tr.buttons>td {
	padding:5px 5px 3px 5px;
	text-align:right
}
table.criteria>tbody>tr.buttons>td>button {
	font-size:100%
}

/*
Table for generic grid.
A grid table is usually used to hold information
and sometimes the input components. Grid border
is displayed as a gray line.
*/
table.grid {
	width:100%
}
table.grid>tbody>tr>td {
	border:1px solid #CBCBCB;
	padding:7px 5px 7px 5px;
	text-align:left;
	vertical-align:top;
	white-space:normal
}
table.grid>tbody>tr.title>td {
	background-color:#CBCBCB;
	white-space:nowrap
}
table.grid>tbody>tr.group>td {
	color:#009DD9;
	font-weight:bold;
	white-space:nowrap
}
table.grid>tbody>tr.detail>td.extended {
	padding:0px
}
table.grid>tbody>tr.detail>td.container {
	padding:10px
}
table.grid>tbody>tr.detail>td.singleton {
	padding:10px 0px 0px 0px;
	border-width:1px 0px 0px 0px
}
table.grid>tbody>tr.detail>td.label {
	background-color:#CBCBCB;
	font-weight:bold;
	text-align:right;
	white-space:nowrap
}
table.grid>tbody>tr.detail>td.entry {
	padding:5px 10px 5px 5px;
	white-space:nowrap
}
table.grid>tbody>tr.detail>td.compact {
	padding-left:1px;
	padding-right:1px
}
table.grid>tbody>tr.detail>td.single {
	white-space:nowrap
}
table.grid>tbody>tr.buttons>td.left {
	border-width:1px 0px 0px 0px;
	padding:10px 5px 10px 0px;
	text-align:left;
	white-space:nowrap
}
table.grid>tbody>tr.buttons>td.right {
	border-width:1px 0px 0px 0px;
	padding:10px 0px 10px 5px;
	text-align:right;
	white-space:nowrap
}
table.grid>tbody>tr.buttons>td>button {
	font-size:100%
}
table.grid>tbody>tr>td.amount {
	text-align:right;
	white-space:nowrap
}

/*
Table for simple list table.
A list is usually used to hold report style
information with one header, multiple rows
and multiple columns.
*/
table.list {
	width:100%
}
table.list>tbody>tr>td {
	padding:4px 5px 4px 5px;
	text-align:left;
	vertical-align:top;
	white-space:normal
}
table.list>tbody>tr.header>td {
	border-style:solid;
	border-color:#000000;
	border-width:0px 0px 1px 0px;
	padding-bottom:3px;
	font-weight:bold;
	vertical-align:bottom;
	white-space:nowrap
}
table.list>tbody>tr.header>td>span.links {
	font-size:85%;
	font-weight:normal
}
table.list>tbody>tr.detail>td {
	border-style:solid;
	border-color:#CBCBCB;
	border-width:1px 0px 0px 0px
}
table.list>tbody>tr.detail>td.group {
	background-color:#404040;
	color:#FFFFFF; 
	padding-top:1px;
	padding-bottom:2px;
	font-weight:bold;
	white-space:nowrap
}
table.list>tbody>tr.detail>td.single {
	white-space:nowrap
}
table.list>tbody>tr.detail>td.amountLabel {
	border-right-width:1px;
	text-align:right;
	white-space:nowrap
}
table.list>tbody>tr.detail>td.none {
	padding-top:10px;
	padding-bottom:10px;
	text-align:center;
	white-space:nowrap
}
table.list>tbody>tr.detail>td.compact {
	padding-left:4px;
	padding-right:1px
}
table.list>tbody>tr.detail>td.secondaryRows {
	border-top-width:0px
}
table.list>tbody>tr.detail>td>div.links {
	text-align:right;
	white-space:nowrap
}
table.list>tbody>tr.summary>td {
	border-style:double;
	border-color:#000000;
	border-width:4px 0px 0px 0px;
	white-space:nowrap
}
table.list>tbody>tr.summary>td.statistic {
	font-weight:bold
}
table.list>tbody>tr.summary>td.subtotal {
	text-align:right;
	font-weight:bold
}
table.list>tbody>tr.summary>td.buttons {
	padding-top:12px;
	text-align:right
}
table.list>tbody>tr.summary>td.buttons>button {
	font-size:100%
}
table.list>tbody>tr>td.amount {
	text-align:right;
	white-space:nowrap
}

/*
Table for excel-like list table.
An excel is usually used to hold editable style
information with one header, multiple rows and
multiple columns.
*/
table.excel {
	width:100%;
	table-layout:fixed;
	font-family:arial
}
table.excel>caption {
	background-color:#A7A7A7;
	border-style:solid;
	border-color:#A7A7A7;
	border-width:1px;
	padding:3px 0px 2px 0px;
	color:#FFFFFF;
	font-size:108%;
	font-weight:bold;
	text-align:center;
	vertical-align:top;
	white-space:nowrap
}
table.excel>thead>tr>th {
	background-color:#E7E7E7;
	border-style:solid;
	border-color:#A7A7A7;
	border-width:1px;
	padding:0px
}
table.excel>thead>tr>th div {
	background-color:inherit;
	padding:3px 1px 3px 1px;
	color:#000000;
	font-weight:bold;
	text-align:left;
	vertical-align:top;
	white-space:nowrap
}
table.excel>thead>tr>th a:link,
table.excel>thead>tr>th a:visited,
table.excel>thead>tr>th a:hover,
table.excel>thead>tr>th a:active {
	color:inherit;
	font-weight:inherit;
	text-decoration:none
}
table.excel>tbody>tr>td {
	background-color:#FFFFFF;
	border-style:solid;
	border-color:#D7D7D7;
	border-width:1px;
	padding:0px;
	text-align:left;
	vertical-align:top;
	white-space:nowrap
}
table.excel>tbody>tr.group>td {
	padding:3px 3px 1px 3px
}
table.excel>tbody>tr>td.ln {
	border-color:#A7A7A7
}
table.excel>tbody>tr>td.text {
	padding:3px 0px 3px 0px;
	overflow:hidden;
	text-overflow:ellipsis
}
table.excel>tbody>tr>td.text.container {
	padding:3px
}
table.excel>tbody>tr.hidden>td {
	border-color:#0A246A;
	border-width:4px
}
table.excel>tbody>tr>td>input {
	padding:3px 0px 3px 0px
}
table.excel>tbody>tr>td>input[type=text] {
	width:100%;
	background-color:#FFFFFF;
	border-style:solid;
	border-color:#FFFFFF;
	border-width:0px;
	color:#000000;
	font-family:arial
}
table.excel>tbody>tr>td>input[type=text].dollar {
	padding:3px 0px 3px 0px;
	text-align:left
}
table.excel>tbody>tr>td>input[type=text].bgwarn {
	background-color:#FF0000;
	color:#FFFFFF
}
table.excel>tbody>tr.even>td,
table.excel>tbody>tr.even>td>input[type=text] {
	background-color:#E7E7E7;
	color:#000000
}
table.excel>tbody>tr>td.sorter,
table.excel>tbody>tr>td.sorter>input[type=text] {
	background-color:#E7E7E7;
	color:#000000
}
table.excel>tbody>tr>td>input[type=text].fgwarn {
	color:#FF0000
}
table.excel>tbody>tr>td>input[type=text].fgsafe {
	color:#2F861B
}
table.excel>tbody>tr>td.picked,
table.excel>tbody>tr>td.picked>input[type=text] {
	background-color:#0A246A;
	color:#FFFFFF
}

/*
Table for sophisticated search result.
A spreadsheet is usually covered by a sheet cover
used to style the header. For the rest of the part
is pretty much like a simple list.
*/
div.sheetCover {
	background-color:#7F7F7F
}
table.spreadsheet {
	width:100%
}
table.spreadsheet>tbody>tr>td {
	padding:7px 5px 7px 5px;
	text-align:left;
	vertical-align:top;
	white-space:normal
}
table.spreadsheet>tbody>tr.header>td {
	color:#FFFFFF;
	font-size:108%;
	font-weight:bold;
	vertical-align:bottom;
	white-space:nowrap
}
table.spreadsheet>tbody>tr.detail>td {
	background-color:#FFFFFF;
	border-style:solid;
	border-top-color:#CBCBCB;
	border-right-color:#E7E7E7;
	border-bottom-color:#CBCBCB;
	border-left-color:#E7E7E7;
	border-width:0px 1px 1px 1px
}
table.spreadsheet>tbody>tr.detail>td.leftmost {
	border-left-color:#CBCBCB
}
table.spreadsheet>tbody>tr.detail>td.rightmost {
	border-right-color:#CBCBCB
}
table.spreadsheet>tbody>tr.detail>td.middle {
	border-bottom-color:#E7E7E7
}
table.spreadsheet>tbody>tr.detail>td.dark {
	background-color:#E7E7E7;
	border-bottom-color:#CBCBCB
}
table.spreadsheet>tbody>tr.detail>td.compact {
	padding-left:1px;
	padding-right:1px
}
table.spreadsheet>tbody>tr.detail>td.single {
	white-space:nowrap
}
table.spreadsheet>tbody>tr.detail>td>div.links {
	text-align:right;
	white-space:nowrap
}
table.spreadsheet>tbody>tr>td.amount {
	text-align:right;
	white-space:nowrap
}
table.spreadsheet>tbody>tr>td.none {
	padding-top:10px;
	padding-bottom:10px;
	border-left-color:#CBCBCB;
	border-right-color:#CBCBCB;
	text-align:center;
	white-space:nowrap
}

/*
Table for simple box.
A box is usually used to hold a big one-row information.
The single row contains either another table structure
or a pure div. A color box is usually applied on the box
with border/header-background color defined separately.
*/
table.box {
	width:100%;
	border-style:solid;
	border-width:4px
}
table.box>tbody>tr>td {
	padding:8px 5px 8px 5px;
	text-align:left;
	vertical-align:top
}
table.box>tbody>tr.title>td {
	padding:2px 5px 4px 5px;
	font-weight:bold;
	white-space:nowrap
}

/*
Table for profile style.
A profile is pretty much like a grid table, but with
more control like the title and header. The grid is
of darker color for the purpose of printing.
*/
table.profile {
	width:100%;
	border:2px solid #000000
}
table.profile>tbody>tr>td {
	border:1px solid #000000;
	padding:5px;
	text-align:left;
	vertical-align:top;
	white-space:normal
}
table.profile>tbody>tr.title>td {
	padding-top:15px;
	padding-bottom:15px;
	font-size:108%;
	text-align:center;
	white-space:nowrap
}
table.profile>tbody>tr.title.withTopper>td {
	padding-top:5px
}
table.profile>tbody>tr.title>td>table.topper {
	width:100%;
	font-size:93%;
	margin-bottom:5px
}
table.profile>tbody>tr.title>td>table.topper>tbody>tr>td {
	padding:0px;
	text-align:left;
	vertical-align:top;
	white-space:nowrap
}
table.profile>tbody>tr.title>td>table.topper>tbody>tr>td.left {
	padding-right:5px
}
table.profile>tbody>tr.title>td>table.topper>tbody>tr>td.right {
	padding-left:5px;
	text-align:right
}
table.profile>tbody>tr.title>td>div {
	white-space:nowrap
}
table.profile>tbody>tr.title>td>div.name {
	font-size:174%;
	font-weight:bold
}
table.profile>tbody>tr.title>td>div.subtitle {
	font-size:108%
}
table.profile>tbody>tr.header>td {
	background-color:#CBCBCB;
	padding-top:0px;
	padding-bottom:0px;
	font-size:85%;
	font-weight:bold;
	white-space:nowrap
}
table.profile>tbody>tr.header>td.group {
	background-color:#FFFFFF;
	padding:5px;
	color:#009DD9;
	font-size:116%
}
table.profile>tbody>tr.header>td.skipped {
	background-color:#FFFFFF
}
table.profile>tbody>tr.detail>td {
}
table.profile>tbody>tr.detail>td.container {
	padding:10px
}
table.profile>tbody>tr.detail>td.single {
	white-space:nowrap
}
table.profile>tbody>tr.buttons>td.left {
	padding:25px 5px 10px 5px
}
table.profile>tbody>tr.buttons>td.right {
	padding:25px 5px 10px 5px;
	text-align:right
}
table.profile>tbody>tr.buttons>td>button {
	font-size:100%
}
table.profile>tbody>tr>td.amount {
	text-align:right;
	white-space:nowrap
}

/*
Table for paging.
Paginator is usually hold the page navigation
information for the user to perform back and
forth browsing.
*/
table.paginator {
	border-collapse:separate;
	border-spacing:4px;
	margin-top:5px;
	margin-right:auto;
	margin-bottom:5px;
	margin-left:auto
}
table.paginator>tbody>tr>td {
	padding:3px 4px 4px 4px;
	border-style:solid;
	border-color:#CBCBCB;
	border-width:1px;
	color:#7F7F7F
}
table.paginator>tbody>tr>td.current {
	color:#000000;
	font-weight:bold
}

/*
Div for editable data.
Components include the displayed information
as a form as text, and an editable text field
which allows direct input, and also a supporting
line with links and icons.
*/
div.editableArea>div.display.highlight {
	background-color:#F6EFBE
}
div.editableArea>div.editing {
	margin-right:5px;
	display:none
}
div.editableArea>div.editing>div.support>span.icons {
	display:none
}

/*
Div for extended container.
Usually used in opened window to extend the
main content to the extreme of the window size.
Need to apply the following css together to its
enclosing tags:
html,body,form {
	height:100%;
	margin:0px
}
*/
div.extended {
	min-width:850px;
	height:100%;
	margin:0px auto;
	vertical-align:top
}
div.extended>table {
	width:100%;
	height:100%;
	border:2px solid #000000
}
div.extended>table>tbody>tr>td {
	text-align:left;
	vertical-align:top
}
div.extended>table>tbody>tr>td.main {
	padding-top:0px;
	padding-right:8px;
	padding-bottom:0px;
	padding-left:8px
}
div.extended>table>tbody>tr>td.buttons {
	padding:15px 8px 10px 8px;
	text-align:right;
	vertical-align:bottom
}
div.extended>table>tbody>tr>td.footer {
	padding:15px 8px 10px 8px;
	text-align:center;
	vertical-align:bottom
}

/*
Application-wise style.
Miscellaneous componments layout.
*/
tr.hidden>td,td.hidden {
	display:none
}
div.box {
	border:2px solid #000000;
	padding:8px;
	vertical-align:top
}
div.tight {
	width:650px;
	margin-left:auto;
	margin-right:auto;
	vertical-align:top
}
div.fit {
	width:775px;
	margin-left:auto;
	margin-right:auto;
	vertical-align:top
}
div.loose {
	width:925px;
	margin-left:auto;
	margin-right:auto;
	vertical-align:top
}
div.borderized {
	padding:10px;
	border-style:solid;
	border-color:#000000;
	border-width:2px
}
div.canvas {
	padding:8px;
	vertical-align:top
}
div.fluorescent {
	background-color:#FFD33C
}
div.singleLine {
	white-space:nowrap
}
div.wrapped {
	white-space:normal
}
div.dialogMessage {
	text-align:left
}
div.dialogFieldBox {
	background-color:#FFFFFF;
	border:1px solid #000000;
	margin-top:10px;
	padding:8px 5px 8px 5px;
	text-align:left;
	vertical-align:top
}
div.pivot {
	position:relative
}
div.autogrow {
	display:inline-block
}
span.nudge {
	font-size:8px
}
span.hint {
	color:#7F7F7F;
	font-family:arial;
	font-size:85%
}
span.light {
	color:#7F7F7F
}
span.warn {
	color:#FF0000
}
span.strong {
	font-weight:bold
}
span.shade {
	background-color:#CBCBCB
}
button.secondary {
	color:#808080
}
img.borderized {
	border-style:solid;
	border-color:#000000;
	border-width:1px
}
input[type=text].focusin,textarea.focusin {
	background-color:#F6EFBE;
	border-style:solid;
	border-color:#000000;
	border-width:1px;
	padding:1px
}
input.attention,textarea.attention,select.attention {
	background-color:#E7A53D;
	border-style:solid;
	border-color:#000000;
	border-width:1px
}
input[type=text].attention,textarea.attention {
	padding:1px
}
input[type=text].hint,textarea.hint {
	color:#7F7F7F
}
input[type=text].attention.hint,textarea.attention.hint {
	color:#444444
}
input[type=checkbox].marker,input[type=radio].marker {
	width:18px;
	height:18px;
	vertical-align:middle
}
input[type=text].dollar {
	padding-right:1px;
	text-align:right
}
input[type=text].uppercase,textarea.uppercase {
	text-transform:uppercase
}
textarea.display {
	background-color:#E7E7E7;
	border:1px solid #000000;
	overflow:hidden
}

/*
Application-wise style.
Component layout separators.
*/
.enlarge1	{font-size:108%}
.enlarge2	{font-size:116%}
.enlarge3	{font-size:123.1%}
.enlarge4	{font-size:131%}
.enlarge5	{font-size:138.5%}
.enlarge6	{font-size:146.5%}
.enlarge7	{font-size:153.9%}
.enlarge8	{font-size:161.6%}
.enlarge9	{font-size:167%}
.enlarge10	{font-size:174%}
.enlarge11	{font-size:182%}
.enlarge12	{font-size:189%}

.shrink1	{font-size:93%}
.shrink2	{font-size:85%}
.shrink3	{font-size:77%}
.shrink4	{font-size:70%}

div.linepad1	{height:1px}
div.linepad2	{height:2px}
div.linepad3	{height:3px}
div.linepad4	{height:4px}
div.linepad5	{height:5px}
div.linepad6	{height:6px}
div.linepad7	{height:7px}
div.linepad8	{height:8px}
div.linepad9	{height:9px}
div.linepad10	{height:10px}
div.linepad15	{height:15px}
div.linepad20	{height:20px}
div.linepad25	{height:25px}

div.indent5		{padding-left:5px}
div.indent10	{padding-left:10px}
div.indent15	{padding-left:15px}
div.indent20	{padding-left:20px}
div.indent25	{padding-left:25px}