/*
 * This CSS is meant to be the browser-neutral stylesheet that's added to the page for all browsers.
 * It is being developed against IE7 because that is one of the more common browsers at the time of development.
 *
 * For browsers other than this, a separate browser-specific css file will be linked in for fixes.
 */


/*
 * Localization
 *
 * For skin images that have text or symbolism that needs to be translated, 
 * organize all of the localization here.
 *
 * A div with a class of "en" or "fr" (<div class="en">) will be the outermost
 * div ov the page and can be used as follows.
 *
 *  .en .logo { background: url(images/localized/en/logo.png); }
 *  .fr .logo { background: url(images/localized/fr/logo.png); }
 */

/*.en .beginSearch .searchTextBox { background-image: url(images/shared/en/search-textbox-background.gif); }
.fr .beginSearch .searchTextBox { background-image: url(images/shared/fr/search-textbox-background.gif); } */

/* TODO make background image disappear when the textbox has focus. why doesn't this work? doc-type? */
.en .beginSearch .searchTextBox:focus,
.fr .beginSearch .searchTextBox:focus { background-image: none; color: Green; }

/*
 * Set defaults, override DNN stuff, etc.
 */

img { border: 0; }

/*
 * Basic Layout of big structures
 */

body { margin:0; padding: 0; text-align:center; }
.sitewrapper { width: 1030px; margin: auto; }
.mainArea  { margin:0px; padding:0px; min-height:450px; position: relative; }

.headerArea { min-height:80px; margin: auto; }
.headerArea .localSiteLogo { float: left; width: 350px; }
.headerArea .partnerLogos  { float: right; width: 600px; text-align: right; vertical-align:top; padding-right:50px; }
.headerArea .localSiteLogo, .headerArea .partnerLogos
{
	/* The 20px bottom to the images defines the height of the header (tallest image height +20px)
		which ends at the top of the content area (bottom of menu) which achieves the overlap of the menus
	 */
	padding-bottom:20px; }

.headerArea .partnerLogos .patnerLogoImg img { vertical-align: top; }

.middleArea 
{ 
	clear: both; width: 940px; margin:auto; margin-bottom:15px; position: relative; z-index: 5; min-height:300px; 	
}

.middleArea .mainMenu { position: absolute; bottom: 100%; left: 0; z-index: 10; } /* on top of mainArea, over top of logos */
.middleArea .mainMenu .topMenu { white-space: nowrap; }
.middleArea .mainMenu .topMenu .menuItem  { float: left; position: relative; }
.middleArea .mainMenu .endcap { float: left; position: relative; z-index: 15; }
.middleArea .mainMenu .topMenu a { display: inline-block; height: 100%; }

.middleArea .mainMenu .subMenu 
{
	/* sub menu is normally hidden, displayed bottom-left of menu item */
	display: none; position: absolute; z-index: 10000; overflow: hidden; top:100%; left: 0; padding: 0; 
	/* the fixed width is a hack. It wants to default the width to the width of the parent div (the tab). Ideally it should be content-driven. */
	width: 225px; 
}
.middleArea .mainMenu .menuItem:hover .subMenu 
{
	/* sub menu is shown when you mouse over it's container. Note that :hover behaves differently for different doc-type's so we need to introduce a skin.doctype.xml file for DNN */
	display: block;
}
.middleArea .mainMenu .subMenu .subMenuInner 
{
	/* inner div is on top of iframe. iframe is on top of (but cropped by) the outer submenu div */
	background-color: White; padding: 0; text-align: left; padding: 4px 0 15px 0;
}
.middleArea .mainMenu .subMenu .subMenuInner a 
{ 
	display: block; color: Black; font-size: 9pt; padding: 5px 5px 5px 24px; 
}
.middleArea .mainMenu .subMenu .subMenuInner a:hover
{
	 background-color: #CCCCCC;
} 

.middleArea .mainMenu .subMenu iframe 
{
	/* iframe with no content is in front of windowed controls (drop down lists, etc) but cropped by container. */
	position: absolute; top: 0; left: 0; width: 1000px; height: 1000px; padding: 0; margin: 0; z-index: -1;
}

.beginSearch { position: absolute; bottom: 100%; right: 0;} /* on top of tabContent */
.beginSearch .searchTextBox { border: 0; width: 120px; }
.beginSearch .searchSubmitButton { width: 1px; height: 1px; border: 0px;}

.middleArea .paneLayoutTop 
{
	width: 100%; table-layout:fixed; border-collapse: collapse; border-spacing:0px; text-align:left;
	position: relative; top:15px;
}
.middleArea .paneLayout { width: 100%; table-layout:fixed; border-collapse: collapse; border-spacing:0px; }

.bottomArea { clear: both; margin-top: 15px; padding:10px 0px 5px 30px; min-height:150px; text-align:left; }
.bottomArea table { border-collapse: collapse }
.bottomArea .bottomLeft   { width: 310px; overflow: hidden; padding: 0 5px 0px 5px; vertical-align:top; }
.bottomArea .bottomMiddle { width: 320px; overflow: hidden; padding: 0 5px 0px 5px; vertical-align:top; }
.bottomArea .bottomRight  { width: 310px; overflow: hidden; padding: 0 5px 0px 5px; vertical-align:top; }

.footerArea { clear: both; padding: 10px 0 80px 0;  }
.footerArea .innerFooter { width: 950px; margin: auto; text-align:left; padding-left:40px;}
.footerArea .left { width: 500px; float: left; }
.footerArea .right { width: 370px; float: right; text-align: right; }
.footerArea .right .footererlogo { float:left; vertical-align:top; }



/* Sytles for a Local News Rotator */
.LocalNewsNoLink a { text-decoration:none; color:White;}

.LocalNewsCalendarMonth
{
	font-family:Tahoma; font-weight:bold; color:White; font-size:11px; top:20px !important;
}
.LocalNewsCalendarDay
{
	font-family:Tahoma; font-weight:bold; font-size:32px; color:Black; top:40px !important;
}
.LocalNewsCaptionLabel
{
	font-family:Tahoma; font-weight:bold; color:Gray; font-size:14px;
}
.LocalNewsTitle
{
	font-family:Tahoma; font-weight:bold; color:White; font-size:12px;
}
.LocalNewsDescription
{
	font-family:Trebuchet MS,Trebuchet; font-weight:normal; color:#CCCCCC; font-size:12px;
}
/* End of Sytles for a Local News Rotator */


/* Styles for a Local Search Result */
.resultArea
{
	padding:10px 30px 10px 30px;
	background-color: #7B8688;
	min-height:300px;
}
.resultArea .resultHeaderArea
{
	border-bottom: 1px solid silver;
	position: relative;
	padding-bottom: 1px;
	padding-top: 5px;
	height: 32px;
}
.resultArea .resultTitleArea
{
	float:left;	
	font-family:Trebuchet, Trebuchet MS;
	font-weight:bold;
}
.resultTitle
{
	color: White;
	font-size:20px;
	float:left;
	left: 0px;	
}
.pagingArea
{
	font-family:Trebuchet MS,Trebuchet;
	margin-top:5px;
	float:right;
	color: White;
	font-size:12px;
	vertical-align:middle;
}
.pagingArea input
{
	vertical-align:middle;
}
.pagingArea a
{	
	text-decoration:none; 
	color:White;
	font-size:12px;
	vertical-align:middle;
}

.pagingArea a .selected
{	
	color:Red;
}

.noSearchParagraph
{
	font-family:Trebuchet MS,Trebuchet;
	color: #E3E3E3;
	text-align:left;
	padding-top: 10px;
	font-size:12px;
}

.resultParagraph
{
	font-family:Trebuchet MS,Trebuchet;
	color: #E3E3E3;
	font-size:10px;
	border-bottom: 1px solid silver;
	padding: 10px 0px 8px 0px;
	text-align:left;
}
.resultParagraph a
{
	text-decoration:none; 
	color:White;
	font-size:12px;
}

.resultParagraph a:hover
{
	text-decoration:underline;
}

.resultParagraph .itemTitle
{
	margin-bottom:5px;
}
.resultParagraph .itemDescr
{		
	
}

/* End of Styles for a Local Search Result */