/* base element inheritance formatting */
/* start youngpup */
html {
	height:100%;
	margin:0px;
	padding:0px;
	overflow:hidden;
}
body { 
	font-family: arial, geneva, helvetica, "sans serif";  font-weight: normal; 
	background-color:#cccccc;

	height:100%;
	margin:0px;
	padding:0px;
	color:#333333;
	line-height:17px;
	font-size:13px;

	scrollbar-arrow-color:#999;
	scrollbar-face-color:#FAFAFA;
	scrollbar-base-color:#DDD;
	scrollbar-3dlight-color:#BBB;
	scrollbar-darkshadow-color:#BBB;
	scrollbar-shadow-color:#E9E9E9;
}
a         { text-decoration:none }
a:link    { color: #666666; }
a:visited { color: #666666; }
a:active  { color: #ffaa00; }
a:hover   { color: #dd7700; text-decoration:underline;} 

h1 {
	border-bottom:1px dashed #666;
	font-family:arial, sans-serif;
	margin:0px;
	margin-bottom:.5em;
	color:#E0682D;
	font-weight:bold;
	font-size:13px;
}

h2 {
	border-bottom:1px dashed #666;
	font-family:arial, sans-serif;
	margin:0px;
	margin-bottom:.5em;
	color:#999999;
	font-weight:bold;
	font-size:11px;
}

h3 {
	font-family:arial, sans-serif;
	margin:0px;
	margin-bottom:.5em;
	color:#E0682D;
	font-weight:bold;
	font-size:11px;
}

h4 {
	color:#444;
	font-size:11px;
	font-weight:bold;
	margin:0px;
}

div.byline {
	position:relative;
	font-family:geneva, verdana, tahoma;
	font-size:9px;
	color:#AAA;
	top:-8px;
}

p, ul, ol {
	font-size:14px;
	margin-top:0px;
	margin-bottom:2em;
}

a {	
	color:black;
}

a:hover {
	color:#EA4D00;
	text-decoration:underline;
}

#masthead {
	position:relative;
	margin:10px;
	height:102px;
	margin-bottom:4px;
	border:1px solid black;
}

#nav {
	position:absolute;
	left:0px; top:0px;
	width:211px; height:102px;
}

#field {
	position:relative;
	height:102px;
	margin-left:211px;
	background-image:url(../imgs/grid.gif);
	background-position:right;
}	

#logo {
	position:absolute;
	right:0px; bottom:0px;
	width:115px; height:30px;
}

#field .level {
	position:absolute;
	left:0px; top:0px;
}

#field a {
	position:absolute;
	font-family:'trebuchet ms',sans-serif;
	text-decoration:none;
	letter-spacing:1px;
	font-size:11px;
	color:#333;
	width:155px;
	height:16px;
	overflow:hidden;
	visibility:hidden;
}

#field a:hover {
	text-decoration:underline;
}

#field #blatherLevel a {
	visibility:visible;
}

#field a img {
	width:13px; height:13px;
	vertical-align:bottom;
	margin-bottom:2px;
	margin-right:6px;
	border:0px;
}

.pane {
	display:none;
	position:absolute;
	/*border:1px solid #888;*/
	overflow:hidden;
}

#content, #demos {
	width:expression(document.body.clientWidth  - this.style.pixelLeft - this.style.pixelRight  - 2);
}

#resizer2, #resizer4 {
	height:expression(document.body.clientHeight - this.style.pixelTop  - this.style.pixelBottom);
}

#resizer3 {
	width:expression(document.body.clientWidth  - this.style.pixelLeft - this.style.pixelRight);
}

#content, #compatibility, #documentation {
	height:expression(document.body.clientHeight - this.style.pixelTop  - this.style.pixelBottom - 2);
}

.pane .head {
	background-color:#F2F2F2;
	border-bottom:1px solid #888;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size:12px;
	line-height:15px;
	letter-spacing:1px;
	padding:3px 6px 1px 21px;
	color:#333;
	overflow:hidden;
	white-space:nowrap;
}

.pane#content .head {
	background-image:url(/_ui_webapp/imgs/needs.gif);
	background-repeat:no-repeat;
	background-position:right;
}

.pane.unavailable {
	-moz-opacity:50%;
	filter: Alpha(opacity=50); 
}

.pane.unavailable .message {
	text-align:center;
}

.pane .head img {
	position:absolute;
	left:6px; top:3px;
	border:0px;
}

.pane .head a {
	background-color:#F2F2F2;
	text-decoration:none;
	color:#333;
}

.pane .head a:hover {
	text-decoration:underline;
	color:#333;
}

.pane .body {
	position:absolute;
	top:22px; left:3px; 
	bottom:3px; right:3px;
	height:expression(this.offsetParent.style.pixelHeight - 22 - 3 - 6 + "px");
	width :expression(this.offsetParent.offsetWidth - 6 - 8 + "px");
	padding:3px;
	overflow:auto;
}

.pane .body div.container {
	padding:10px;
}

.resizerH, .resizerV { 
	cursor:move; 
}

.resizerH {
	position:absolute;
	cursor:row-resize;
	height:5px;
	background-color:#CCCCCC;
}

.resizerV {
	position:absolute;
	cursor:move;
	cursor:col-resize;
	width:5px;
	background-color:#CCCCCC;
}

#slogans {
	position:absolute;
	z-index:1000;
	bottom:5px;
	left:11px;
	font-size:11px;
	line-height:12px;
	color:#888;
}

#footerLinks {
	position:absolute;
	bottom:5px;
	right:11px;
	font-size:11px;
	line-height:12px;
	text-align:right;
}

#footerLinks a, #slogans a {
	text-decoration:none;
	display:block;
	color:#BBB;
}
#slogans a:hover, #footerLinks a:hover {
	color:#EA4D00;
}
/* end youngpup */


td        { font-family: arial, geneva, helvetica, "sans serif"; color: #000000; font-size: smaller; font-weight: normal; }
th        { font-family: arial, geneva, helvetica, "sans serif"; color: #000000; font-size: smaller; font-weight: bold; }

/*.title { color: #000000; background: #e6e6e6; font-size: 110%; vertical-align: bottom;  text-align: left; font-weight: bold; }*/
.subtitle1 {
	color: #e69f00;
	background: #d2d2d2;
	font-size: 110%;
	vertical-align: bottom;
	text-align: left;
	font-weight: bold;
}
.subtitle2 {
	color: #dd2200;
	background: #aaaaaa;
	font-size: 100%;
	vertical-align: bottom;
	text-align: left;
	font-weight: bold;
}
.wtspace  { background: #ffffff; font-size: 1pt; line-height: 1pt; }
.topmenu  { color: #333333; background: #e6e6e6; font-size: smaller; font-weight: bold; vertical-align: top; vertical-align: bottom; } 
.topmenu	a:link    { color: #666666; }
.topmenu	a:visited { color: #666666; }
.topmenu	a:active  { color: #00aaff; }
.topmenu	a:hover   { color: #dd9900; }
.topmenuspace  { background: #e6e6e6; font-size: 1pt; line-height: 1pt; }
.topmenuspace1  { background: #e6e6e6;  font-size: 1pt; }
.topmenucurrent  { color: #dd9900; background: #e6e6e6; font-size: smaller; font-weight: bold; vertical-align: top; vertical-align: bottom; } 

.secmenu  { color: #858585; background: #d2d2d2; font-size: smaller; font-weight: bold;  vertical-align: bottom; }
.secmenu	a:link    { color: #858585; }
.secmenu	a:visited { color: #858585; }
.secmenu	a:active  { color: #00aaff; }
.secmenu	a:hover   { color: #ef2a00; }
.secmenuspace  { background: #d2d2d2; font-size: 1pt; line-height: 1pt; }
.secmenucurrent  { color: #ef2a00; background: #d2d2d2; font-size: smaller; font-weight: bold;  vertical-align: bottom; }

.contenttext     { color: #ffffff; background: #aaaaaa; font-size: 13px; text-align: left; vertical-align: top; }
.contenttext	a:link    { color: #fffffff; }
.contenttext	a:visited { color: #ffffff; }
.contenttext	a:active  { color: #ef2a00; }
.contenttext	a:hover   { color: #ef2a00; }
.greyspace  { background: #aaaaaa; }


.wtext     { color: #ffffff; background: #e6e6e6; font-size: smaller; text-align: left; }
.wtext1     { color: #ffffff; background: #d2d2d2; font-size: smaller; text-align: left; }

.ytext  { color: #ffcc00; background: #aaaaaa; font-size: smaller; font-weight: bold;  text-align: right;  }
.ytext	a:link    { color: #ffcc00; }
.ytext	a:visited { color: #ffcc00; }
.ytext	a:active  { color: #ef2a00; }
.ytext	a:hover   { color: #ef2a00; }

.btext     { color: #000000; background: #e6e6e6; font-size: smaller; text-align: left; }
.graytext     { color: #999999; background: #e6e6e6; font-size: x-small; text-align: left; }
.graytextcr     { color: #999999; background: #e6e6e6; font-size: x-small; text-align: center; }
.heading 	{ color: #EF2A00; font-size: 14px; text-align: left; font-weight: bold; }

.thumbnails {border-color:#dddddd;}
.imgs {border-color:#000000;}
.imgs1 {border-color:#ffffff;}

.rightalignbg{
background: #aaaaaa; 
background-image: url(../../image/bk_square.gif);
background-repeat: no-repeat;
background-position: bottom right;
} 


/* navigation classes */
.navtop { vertical-align: top; font-size: 1pt; }
.navmsg { text-indent: -50px; }
.navimage { background-position: top left; background-repeat: no-repeat; }
.navclear { background-image: none; font-size: 1pt; vertical-align: top; }   
.nav { background-image: none; font-family: verdana, arial, geneva, "sans serif"; color: #000000; font-size: x-small; font-weight: normal; vertical-align: top; text-align: left; margin: 0px; }
.navgrey   { color: #808080; }

/* headline classes */
.headline, .subheadline { font-family: verdana, arial, geneva, "sans serif"; font-size: 110%; vertical-align: middle;  text-align: left; font-weight: bold; }
.headline { color: #000000; }
.subheadline { color: #999999; }
.sectionhd  { font-weight: bold; font-size: 100%;}	
.account { font-family: verdana, arial, geneva, "sans serif"; color: #000000; font-size: small; vertical-align: middle; text-align: left; }
.sectiontitle { font-style: italic; font-weight: bold; }

/* instructions and fine print classes */
.detailhd, .details, .disclaimer, .msgs  { font-size: x-small; }
.disclaimer  { color: #000000; font-weight: normal; background: #ffffff; }
.acct        { color: #808080; vertical-align: middle; }
.msgs     { color: #808080; text-align: right; }
.detailhd     { color: #808080; background: #eeeeee; font-weight: bold; }
.details     { color: #808080; }
.errortext   { font-size: smaller; font-weight: bold; color: #8C1A1A; text-align: left; }
.fine, .hint { font-family: arial, geneva, helvetica, "sans serif"; color: #000000; font-size: x-small; font-weight: normal; }

/* design element classes */
.bkgnd, .line, .labelspace, .greyspace   { font-size: 1pt; line-height: 1pt; }

.labelspace  { background: #eeeeee; }

.line  { background: #cccccc; }
.bline  { background: #000000; }

/* header classes. used on display screens */
.spanhd, .spanhdrt, .spanhdctr  { font-weight:  bold !important;; font-size: 100%;}
.opthd, .secthd { color: #000000; background: #aead99; font-weight: bold !important; }
.spanhd     { text-align: left; }
.spanhdrt   { text-align: right; }
.spanhdctr  { text-align: center; }
.hd, .hdrt, .hdctr, .bhd, .bhdrt, .bhdctr  { color: #333333; background: #cccccc; }
.bhd, .bhdrt, .bhdctr { font-weight: bold !important; }
.hd, .bhd       { text-align: left; }
.hdrt, .bhdrt   { text-align: right; }
.hdctr, .bhdctr { text-align: center; }
.subhd, .subhdrt, .subhdctr, .subhdcurr { color: #333333; background: #eeeeee; font-weight: bold !important; }
.subhd      { text-align: left; }
.subhdrt    { text-align: right; }
.subhdctr   { text-align: center; }
.subhdcurr  { text-align: right; }
.secthd     { text-align: left; }
.helphd		{ font-size: smaller; background: #ffffff; vertical-align: top; font-weight: bold; }

.wthd, .wthdrt  { font-weight: bold !important; color: #000000; }
.wthdrt  { text-align: right; }
a.whitelink, .whitelink:visited, .whitelink:hover, .whitelink:active { color: #ffffff; }
a.blacklink, .blacklink:visited { color: #000000; }
.blacklink:hover, .blacklink:active { color: #8C1A1A; }

/* data classes and alternating row color classes  */
.data, .bdata, .datart, .datactr, .curr, .currleft, .currneg, .term, .define { font-size: smaller; background: #ffffff; vertical-align: top; }
.datagrey, .datartgrey, .datactrgrey, .bdatagrey, .currgrey, currgreyneg { font-size: smaller; background: #eeeeee; vertical-align: top; }
.databottom, .bdatabottom { font-size: smaller; background: #ffffff; vertical-align: bottom; }
.mdata       { font-size: smaller; background: #ffffff; }
.mdatagrey   { font-size: smaller; background: #eeeeee; }
.dataimpt, .currimpt, .dataimptrt { background: #ffffcc; vertical-align: top; }
.bdata, .bdatagrey, .bdatabottom, .term  { font-weight: bold; }
.datart      { text-align: right; }
.datartgrey  { text-align: right; }
.datactr     { text-align: center; }
.datactrgrey { text-align: center; }
.dataimpt    { text-align: left; }
.dataimptrt  { text-align: right; }
.curr        { text-align: right; font-weight: bold; }
.currgrey    { text-align: right; font-weight: bold; }
.currleft    { text-align: left; font-weight: bold; }
.currimpt    { text-align: right; font-weight: bold; }
.subdata, .subdatart, .subdatagrey, .subdatartgrey  { font-size: x-small; background: #ffffff; }
.subdatart, .subdatartgrey   { text-align: right; }
.neg         { color: #990000; }

/* field label classes */
.label, .labelleft, .labelctr, .labeltop, .labeltopleft, .labelbottom { font-size: smaller; color: #333333; background: #eeeeee; font-weight: bold; }
.label     { text-align: right; }
.labelleft { text-align: left; }
.labelctr  { text-align: center; }
.labeltop  { text-align: right; vertical-align: top; }
.labeltopleft { text-align: left; vertical-align: top; }
.labelbottom  { text-align: right; vertical-align: bottom; }

/* form element cell classes */
.input     { font-size: smaller; background: #ffffff; vertical-align: baseline; }
.inputgrey { font-size: smaller; background: #eeeeee; vertical-align: baseline; }
.inputtop  { font-size: smaller; background: #ffffff; vertical-align: top; }
.inputtopgrey { font-size: smaller; background: #eeeeee; vertical-align: top; }
.inputbottom  { font-size: smaller; background: #ffffff; vertical-align: bottom; }
.inputbottomgrey  { font-size: smaller; background: #eeeeee; vertical-align: bottom; }
.submit, .submitleft, .sesubmit, .submitgrey { font-size: smaller; vertical-align: middle; font-weight: bold; color: #333333; }
.submit      { text-align: right !important; }
.submitctr   { text-align: center !important; }
.submitleft  { text-align: left !important; }
.submitgrey      { text-align: right !important; background: #eeeeee; }
.msg       { font-size: smaller; color: #000000; vertical-align: middle; text-align: center; background: #ffffcc; }

/* Search box classes */
.sehd, .seinput, .sesubmit { color: #333333; }
.sehd     { font-size: x-small; background: #cccccc; font-weight: bold; }
.seinput  { font-size: smaller; background: #eeeeee; }
.sesubmit { font-size: smaller; background: #eeeeee; text-align: right; }

/* Option box classes. See header classes for opthd color change. */
.opthd     { font-size: x-small; }
.optinput, .actsubmit { color: #333333; }
.optinput  { font-size: smaller; background: #eeeeee; }
.optsubmit { font-size: smaller; background: #eeeeee; text-align: right; }

/* Message classes - for immediate messages based on user interaction */
.note, .success, .warn, .error   { font-size: smaller; color: #000000; vertical-align: middle; text-align: left; background: #ffffcc; }
.notectr   { font-size: smaller; color: #000000; vertical-align: middle; text-align: center; background: #ffffcc; }
.noteimg, .successimg, .warnimg, .errorimg  { font-size: smaller; color: #000000; vertical-align: top; text-align: center; }
.noteimg    { background: #9FBED7; }
.successimg { background: #ccffcc; }
.warnimg    { background: #ffff99; }
.errorimg   { background: #ffcccc; }
.indicator  { font-size: medium; color: #ff0000; }
.info      { font-size: x-small; color: #000000; background: #9999ff; }
.footlt    { font-size: x-small; color: #333333; background: #ffffff; }