@CHARSET "ISO-8859-1";

.twoleveltabs li,
.twoleveltabs li a,
.twoleveltabs li a:link,
.twoleveltabs li a:visited,
.twoleveltabs li a:hover,
.twoleveltabs li a:active {font-size: 10pt;}

/* Making the aftertabcontainer only apply the css IF its preceded by the twoleveltabs.  Currently using the .aftertabcontainer for two separate types of tabs and they're conflicting if both CSS is included. */
.twoleveltabs + .aftertabcontainer
{
	background-color: #fff;
	width: 730px;
	clear: both;
	
	margin-top: 0px;
	margin-bottom: 15px;
	margin-left: 0px;
}



/*
.afterpaddernosubmenu, .afterpadder
{
	clear: both;

	padding-left: 10px;
	padding-right: 10px;
	padding-top: 1px;
	margin-bottom: 10px;
}
*/


.afterpadderwithsubmenu
{
	clear: both;

	padding-left: 10px;
	padding-right: 10px;
	padding-top: 43px;
	margin-bottom: 10px;
}

.afterpadderwithsubmenu > h2:first-child, .afterpadderwithsubmenu > h3:first-child {margin-top: 6px;}
.afterpadderwithsubmenu > p:first-child {margin-top: 0px;}



.twoleveltabs
{
	width: 728px;
	position: relative;
	
	background: url(css_images/two_level_tabs_bgdot.gif) repeat-x bottom;
	float: left;
	
	/* this 2 px makes up for 1px padding left and 1px padding right.  Extends the line at the top all the way to the right */
	padding-right: 2px;
}


.twoleveltabs ul
{
	list-style-type: none;
	width: 100%;
	
	margin-left: 0px;
	padding-left: 0px;
	
	margin-top: 0px;
	padding-top: 0px;

	margin-bottom: 0px;
	padding-bottom: 0px;
}


.twoleveltabs ul li
{
	float: left;
	background: url(css_images/two_level_tabs_light_gray_right.gif) no-repeat top right;
}


.twoleveltabs ul li:hover,
.twoleveltabs ul li.iehover
{
	background: url(css_images/two_level_tabs_dark_gray_right.gif) no-repeat top right;
}


.twoleveltabs ul li:hover a,
.twoleveltabs ul li.iehover a
{
	background: url(css_images/two_level_tabs_dark_gray_left.gif) no-repeat top left;
	border-bottom: 1px solid #DBDBDB;
}


.twoleveltabs ul li.active
{
	background: url(css_images/two_level_tabs_white_right.gif) no-repeat top right;
}


.twoleveltabs ul li a
{
	display: block;
	text-decoration: none;
	color: #004182;
	font-weight: bold;
	padding-left: 10px;
	padding-right: 10px;
	
	line-height: 30px;
	
	background: url(css_images/two_level_tabs_light_gray_left.gif) no-repeat top left;

	border-bottom: 1px solid #ABABAB;
}


.twoleveltabs ul li.active a
{
	background: url(css_images/two_level_tabs_white_left.gif) no-repeat top left;
	
	/* the following two border-bottom lines are an ie 6 hack.  We want browsers to have the border-bottom show up transparent, 
	but ie doesn't display transparent properly in this case. IE 6 doesn't recognize the !important declaration.  
	Non-ie6 browsers will correctly recognize !important and show up as transparent.  IE6 doesn't recognize !important so it will use white instead. */
	border-bottom: 1px solid transparent !important;
	border-bottom: 1px solid white;
	
	line-height: 30px; /* this duplicate line-height is required by IE6 */
	color: black; text-decoration: none;
}

.twoleveltabs ul li.active a:hover {color: black; text-decoration: none;}

.twoleveltabs ul li a:hover
{
	text-decoration: underline;
	color: #990000;
}


.twoleveltabs ul li a.onerow
{
	line-height: 34px;
	padding-top: 3px;
	padding-bottom: 2px;
}


.twoleveltabs ul li a.tworows
{
	line-height: 17px;
	padding-top: 3px;
	padding-bottom: 2px;
	text-align: center;
}






.twoleveltabs ul li,
.twoleveltabs ul li.active
{
	margin-bottom: 0px;
}


.twoleveltabs ul li ul
{
	width: 730px;
	margin-left: 0px;
	position: absolute;
	left: -9999px;
	height: 30px;

	/* border-bottom: 1px solid #999999; */
	
	border-left: 1px solid #999999;
	border-right: 1px solid #999999;
	
	background-color: #DBDBDB;
}


.twoleveltabs ul li.active ul
{
	background-color: #E4D2BA;
	background-color: #E8EED2;
	background-color: #D5DACC;
	background-color: white;
	/* border-top: 1px solid black; */
	border-bottom: 1px solid #999999;
}


.twoleveltabs ul li.active ul
{
	left: 0px;
}


.twoleveltabs ul li:hover ul,
.twoleveltabs ul li.iehover ul
{
	left: 0px;
	z-index: 1;
	border-bottom: 1px solid #DBDBDB;
}

/* this second declaration is used to target an issue with ie6. ul li.active ul is overridden by ul li.iehover ul since the iehover is declared last.
this redeclares the proper 999999 border bottom color */
.twoleveltabs ul li.iehover ul
{
	border-bottom: 1px solid #999999;
}

.twoleveltabs ul li.active:hover ul
{
	border-bottom: 1px solid #999999;
}


.twoleveltabs ul li:hover ul li,
.twoleveltabs ul li.iehover ul li
{
	background-image: none;
}


.twoleveltabs ul li:hover ul li a,
.twoleveltabs ul li.iehover ul li a
{
	background-image: none;
}


.twoleveltabs ul li ul li,
.twoleveltabs ul li.active ul li
{
	background: none;
	margin-bottom: 0px;
}


.twoleveltabs ul li ul li a,
.twoleveltabs ul li.active ul li a
{
	background: none;
	border-bottom: 0px;
	font-weight: normal;
	
	background: url(css_images/two_level_tabs_vertical_spacer.gif) no-repeat right center;
	
	color: #004182;
}


.twoleveltabs ul li.active ul li a:hover {color: #990000; text-decoration: underline;}



.twoleveltabs ul li.active ul li.onthispage a
{
	color: black; text-decoration: none;
}