/* BASIC STYLES */
	
	body, input, option, select, td, th, textarea
	 {
	 	font-size: 11px;
	 	font-family: Verdana, sans-serif;
	 }
	
	body
	   { background-image: url(/images/background.png); margin: 0px }

	#content
	{
		padding-left: 20px;
		padding-right: 20px;
		vertical-align: top;
	}


/* COMMON ELEMENTS */

	/* HEADERS
	 *
	 * Each page should have exactly one h1; it should match the title of the page.  It is highly recommended that heading levels match the outline of the page.
	 */
		h1, h2, h3, h4, h5, h6
		 { font-weight: normal }
		
		h2, h3, h4, h5, h6
		{
			margin-bottom:     0.25em;
			margin-left:       -0.25in;
			margin-top:        1em;
		}
		
		h1
		  { color: #356595; font-size: 18px }
		
		h2
		 { font-size: 16px; padding-top: 0.5em; border-style: solid; border-width: 1pt 0 0 0; border-color: silver }
h3 { font-size: 12px }

	.menuSectionText {
		padding-left: 5px;
		font-size: 16pt; 
		text-decoration: underline;
	}

img
	{
		border:            0;
	}

		#footer
		{
			padding: 10px 0 20px 20px;
		}

		acronym
		{
			border-bottom: none;
			font-style: normal;
		}

	/*
	 * Navigation links
	 */
	.logo
	{
		height: 54px;
		left: 620px;
		position: relative;
		top: 0px;
		width: 146px;
	}

	div#topnav	
	{
		/*background-color: #AF9E9B;*/
		color: white;
		height: 22px;
		padding: 11px 0 0 31px;
		width: 800px;
	}

	div#topnav a
	{
		color: white;
	}

	div#topnav h2
	{
		border: none;
		display: inline;
		font-size: 9px;
		font-weight: bold;
		margin-left: 0;
	}

	div#heading
	{
		background-image: url(/images/PlainHeader_InfoPlusServices.png);
		height: 131px;
		width: 800px;
	}

	div#trainingheading
	{
		background-image: url(/images/TrainingBanner.png);
		height: 131px;
		width: 800px;
	}

	div#sftpsetup
	{
		background-image: url(/images/SFTPBanner.png);
		height: 131px;
		width: 800px;
	}

	table td.reportaccess_subnav
	{
		vertical-align: top;
		width: 150px;
		padding: 1px 1px 1px 1px;
	}

	.reportaccess_subnav h1
	{
		color: white;
		border: none;
		font-size: 11px;
		font-weight: bold;
		margin: 7px 0px 7px 0px;
		padding: 15px 10px 0px 5px;
		font-style: italic;
	}
	
	.reportaccess_subnav h1 a
	{
		font-style: normal;
		text-decoration: underline;
	}
	
	h1.highlightedMenuItem
	{
		color: yellow;
	}
	
	.reportaccess_subnav h2
	{
		border: none;
		font-size: 11px;
		font-weight: bold;
		margin: 9px 0px 2px 0px;
		padding-left: 10px;
		padding-right: 10px;
	}


	.reportaccess_subnav p
	{
		margin-bottom: 0;
		margin-top: 0;
		padding-left: 10px;
		padding-right: 5px;
		font-size: 11px;
		font-family: Verdana, Arial, Helvetica, sans-serif;
	}

	div.page
	{
		padding:           0.25em;
		text-align:        right;
	}

	/* POP-UP HELP TEXT */
		#help		
		{
			border-color: #2f633b;
			border-style: dashed;
			border-width: 2pt;
			display: none;
			padding: 0.5em;
			margin-bottom: 1em;
			overflow:hidden;
		}

		div.helpImage
		{
			left: 740px;
			position: absolute;
			top: 140px;
		}

		div.helpImageText
		{
			float:left;
			margin-top:6px;
			font-size:12px;
			font-family: Verdana, Arial, Helvetica, sans-serif;
			font-weight: bold;
			text-align: center;
			color:#658B5E;
		}
		
		div.helpImage a:hover
		{
			text-decoration: underline;
			color: #658B5E;
		}

	/* UNORDERED LISTS */
		ul
		{
			margin-left:       0;
			padding-left:      0;
		}
		
		div.rawdata ul
		{
			padding-left:      0.25in;
		}

	/* LAYOUT TABLES
	 *
	 * 'Deprecated' HTML behavior.  Used for laying out forms and small pages where layout is very unlikely to change.
	 */
		table.layout, table.main
		{
			border-style:      none;
			margin: 0;
		}

		table.layout td, table.layout th
		{
			border: 0;
			border-style:      none;
			padding: 0;
		}


		table.topnav
		{
			border-style: none;
			margin: 0;
			padding: 2px 1px;
		}

		table.topnav td, table.topnav th
		{
			padding: 10px;
		}

	.disabled
	{
		color: #af9e9b;
	}

	.note
	{
		font-style: italic;
	}

	.expired
	{
		font-style: italic;
	}

	.expiredWarning
	{
		font-style: italic;
		text-align: center;
	}

	.backup
	{
		color: #d7a735;
	}

	.configuration
	{
		color: #2f633b;
	}

	.inventory
	{
		color: #356595;
	}

	.performance
	{
		color: #a8292a;
	}

	.security
	{
		color: #683e64;
	}


	/*
	 * Warning text of several paragraphs should be wrapped in a div.warning; shorter warnings can use p.warning.
	 */
	div.warning, p.warning
	 { padding: 0.5em; border: dashed 1.5pt #d7a735; width: 550px; }

	/*
	 * If you want to highlight a phrase of warning text, wrap it in a span.warning.
	 */
	span.warning
	 { color: #a8292a; text-decoration: underline }

	tr.even td.backup, tr.even td.configuration, tr.even td.inventory, tr.even td.performance, tr.even td.security,
	tr.odd td.backup, tr.odd td.configuration, tr.odd td.inventory, tr.odd td.performance, tr.odd td.security
	{
		cursor: pointer;
		text-align: center;
		padding: 2px;
	}

	tr.even td.noBackup, tr.even td.noConfiguration, tr.even td.noInventory, tr.even td.noPerformance, tr.even td.noSecurity,
	tr.odd td.noBackup, tr.odd td.noConfiguration, tr.odd td.noInventory, tr.odd td.noPerformance, tr.odd td.noSecurity
	{
		background-color: white;
		text-align: center;
		padding: 2px;
	}

	th.backup, th.configuration, th.inventory, th.performance, th.security
	{
		color: black;
	}

	th.backup, table.data thead th.backup, tr.even td.backup, tr.odd td.backup
	{
		background-color: #d7a735;
	}

	td.backup a:visited, td.backup a:active, td.backup a:link, td.backup a:hover
	{
		color: white;
		text-decoration: none;
	}

	td.noBackup
	{
		color: #d7a735;
	}
	
	th.configuration, table.data thead th.configuration, tr.even td.configuration, tr.odd td.configuration
	{
		background-color: #2f633b;
	}

	td.configuration a:visited, td.configuration a:active, td.configuration a:link, td.configuration a:hover
	{
		color: white;
		text-decoration: none;
	}

	td.noConfiguration
	{
		color: #2f633b;
	}
	
	th.inventory, table.data thead th.inventory, tr.even td.inventory, tr.odd td.inventory
	{
		background-color: #356595;
	}

	td.inventory a:visited, td.inventory a:active, td.inventory a:link, td.inventory a:hover
	{
		color: white;
		text-decoration: none;
	}

	td.noInventory
	{
		color: #356595;
	}

	th.performance, table.data thead th.performance, tr.even td.performance, tr.odd td.performance
	{
		background-color: #a8292a;
	}

	td.performance a:visited, td.performance a:active, td.performance a:link, td.performance a:hover
	{
		color: white;
		text-decoration: none;
	}

	td.noPerformance
	{
		color: #a8292a;
	}

	th.security, table.data thead th.security, tr.even td.security, tr.odd td.security
	{
		background-color: #683e64;
	}

	td.security a:visited, td.security a:active, td.security a:link, td.security a:hover
	{
		color: white;
		text-decoration: none;
	}

	td.noSecurity, td.noSecurity a:visited, td.noSecurity a:active, td.noSecurity a:link, td.noSecurity a:hover
	{
		color: #683e64;
	}


/* MANUFACTURER SUPPORT ANALYSIS STYLES */

	span.active
	{
		color:             blue;
	}
	
	span.current
	{
		color:             blue;
	}
	
	span.endOfLife
	{
		color:             red;
	}
	
	span.high
	{
		color:             red;
	}
	
	span.low
	{
		color:             #FFD700;
	}
	
	span.medium
	{
		color:             #f60;
	}
	
	span.none
	{
		color:             green;
	}

	span.retired
	{
		color:             #f60;
	}
	
	span.sustained
	{
		color:             green;
	}


/* SITE ADVISOR / LEAD GENERATOR STYLES */

	.showTipsLink
	{
		color:			#a8292a;
	}

	.hideTipsLink
	{
		color:			#a8292a;
	}

/* FORM PAGE ELEMENTS */

	/*
	 * Miscellaneous text inside a form layout table should be aligned left.  This is necessary because <td>s, which usually contain inputs, are aligned center.
	 */
	 
	form td p
	{
		text-align:        left;
	}

	form th p
	{
		margin-bottom: 0;
	}

	form th p.note
	{
		font-style: italic;
		font-weight: normal;
		margin-top: 0;
	}
	
	td.header {
		height: 40px;
		padding: 5px;
		overflow: hidden;
	}

	div.headerCenter h3 {
		position: relative;
		text-align: left;
		line-height: 7px;
		margin-left: 0;
	}

	div.headerLeft {
		background: url(/images/Banner_slices_01.gif);
		background-position: top left;
		float: left;
		clear: both;
		width: 11px;
		height: 29px;
	}
	
	div.headerCenter {
		background: url(/images/Banner_slices_02.gif);
		background-repeat: repeat;
		background-position: top center;
		float: left;
		height: 29px;
		width: 570px;
	}

	
	div.headerRight {
		background: url(/images/Banner_slices_03.gif);
		background-position: top right;
		float: left;
		width: 11px;
		height: 29px;
		clear: right;
	}

	/* FORM LAYOUT TABLES */
		form table.layout td, form table.layout th
		{
			padding:           0.125em;
		}
		
		form table.layout td
		{
			text-align:        center;
		}
		
		form table.layout th
		{
			padding-right:     0.25em;
			text-align:        right;
		}

		form table.layout tr.formActions td
		{
			padding-top:       0.75em;
			text-align:        center;
		}


/* LIST PAGE ELEMENTS */

	/*
	 * Text on list pages that says "X-Y of Z accounts sorted by Q."
	 */
	div.pageAndSortSummary
	{
		float:             left;
	}

	/*
	 * Widget that allows the user to page through result lists.
	 */
	div.pager
	{
		text-align: right;
	}

	/*
	 * Widget that determines how many records are displayed on a result page
	 */
	div.pageSize
	{
		float:             left;
	}


/* REPORT PAGE ELEMENTS */

	/* DEFINITION LISTS
	 *
	 * Use definition lists for sections that match the pattern
	 * Variable: value
	 * Variable 2: value 2
	 */
	 	dl
	 	{
	 		margin-top: 1em;
	 	}
	 	
		dd
		{
			display:           block;
			margin-left: 0.25in;
		}

		dt
		{
			display:           run-in;
			float:             left;
			font-weight:       bold;
			margin-right:      0.25em;
		}


	/*
	 * Final comments on a report should be wrapped in one of these divs.
	 */
	div.partingComments
	{
		border-color:      black;
		border-style:      solid;
		border-width:      1pt 0 0 0;
		padding-top:       0.5em;
	}

	/*
	 * To achieve hierarchical indentation, documents should be logically structured with div.sections.  Note that front-matter breaks the pattern.
	 *
	 * <h1>Page Heading</h1>
	 * <div class="section">
	 *     <p>Page front-matter goes here.</p>
	 * </div>
	 * <div class="section">
	 *     <h2>Section Heading</h2>
	 *     <p> ... </p>
	 *     <div class="section">
	 *         <h3>Subsection Heading</h3>
	 *         <p> ... </p>
	 *     </div>
	 * </div>
	 */
	div.section
	{
		padding-left:      0.25in;
	}

	/* DATA TABLES
	 *
	 * For best results, wrap the heading rows in a thead and the body rows in a tbody.
	 */
		table.data
		{
			border-collapse:   separate;
			border-color:      black;
			border-spacing:    0;
			border-style:      solid;
			border-width:      medium 0 thin 0;
			margin-bottom:     0.5em;
			margin-top:        0.5em;
		}

		table.data td, table.data th
		{
			background:        transparent;
			border-style:      none;
		}

		table.data thead th
		{
			background-color: #af9e9c;
			border-width:      0 0 thin 0;
			border-color:      black;
			border-style:      solid;
			color: white;
			padding: 2pt;
		}

		table.data th
		{
			font-weight: bold;
			text-align: center;
		}

		thead th.sorted
		{
			color: black;
		}

		thead tr.additional th, thead tr.additional td
		{
			border: none;
		}

		thead th a:active, thead th a:visited, thead th a:link
		{
			color: white;
		}

		tr.even td, tr.even th
		{
			background-color: #CCDBEB;
			padding: 2px;
		}

		tr.odd td, tr.odd th
		{
			padding: 2px;
		}

		/* Style for 'data' table rows that strictly act as headers for a group of rows. */
		table.data tr.row_group_header
		{
			background-color: #F9F9F9;
		}
		/* Make these 'data' table group header rows stand out from regular odd and even rows. */
		table.data tr.row_group_header td
		{
			padding-top: 3px;
			text-align: center;
			font-weight: bold;
		}

.number { text-align: center }
.topnav { 
	color: #5C5B5B; 
	font-size: 9px; 
	font-family: Verdana, Arial, Helvetica, sans-serif; 
	/*background-color: #af9e9b*/
}
.topnav a:visited { color: #5C5B5B }
.topnav a:active { color: #5C5B5B }
.topnav a:link { color: #5C5B5B }
.topnav a:hover { color: #5C5B5B; text-decoration: underline }
table.topnav td.topnav { padding-top: 9px; padding-bottom: 9px }
.reportaccess_subnav { color: #ffffff; font-size: 9px; font-family: Verdana, Arial, Helvetica, sans-serif }
.reportaccess_subnav a:visited { color: #ffffff }
.reportaccess_subnav a:active { color: #ffffff }
.reportaccess_subnav a:link { color: #ffffff }
.reportaccess_subnav a:hover { color: #ffffff; text-decoration: underline }
a:visited { color: #a8292a; text-decoration: none }
a:active { color: #a8292a; text-decoration: none }
a:link { color: #a8292a; text-decoration: none }
a:hover { text-decoration: underline }

/* SECURITY ANALYSIS ELEMENTS */
/* Used for passed/failed messages in the Security Analysis content */
	span.securityOverview
	 { font-size: 10px; }

	span.securityPass
	 { color: #2f633b; font-weight: bold; text-decoration: none }

	span.securityFail
	 { color: #a8292a; font-weight: bold; text-decoration: none }

.accountLinks
{
	float: right;
	width: 150px; 
	margin: 0px 25px 0px 0px;
	border-bottom: 1px solid silver;
	font-size: 9px;
}

.accountLinkContainer
{
	clear: right;
	background: #F8F8F8;
	padding: 5px 0px 5px 3px;
	height: 50px;
	width: 147px;
}

.accountLinks p
{
	border-bottom: 1px solid silver; 
	text-align: left; 
	font-size: 10px;
	margin: 0px;
	padding: 0px;
}

.accountLinkContainer ul
{
	margin: 0px;
 	list-style: none;
}

span.actionTitle
{
	font-weight: bold;
	font-size: 12px;
	vertical-align:middle;
}

div.actionRow
{
	clear:both;
	overflow: auto;
}

.columnDiv
{
		float: left;
		width: 140px;
}

.actionButton
{
		background: url(/images/preDefinedQueryImage.gif);
		cursor: pointer;
		cursor: hand; 
		border: none; 
		height: 76px; 
		width: 125px;
		font-size: 13px;
		margin-left: 14px;
		margin-right: 14px;
		color: white;
		word-wrap: break-word;
}

.actionButtonHovered
{
	background: url(/images/preDefinedQueryImageHovered.gif);
}

div.hiddenText
{
	display: none;
}

div.flyoverHelp
{
	background: #EEEEEE;
	position: absolute; 
	visibility: hidden;
	border: 1px solid black;
	top: 0px; 
	left: 0px;
}

div.flyoverHelp > div
{
	padding-left: 0.15in;
	padding-right: 0.15in;
	padding-top: 0.05in;
	padding-bottom: 0.05in;
	font-size:11px;
}

div.actionDescription
{
	display:table;
	background-color: #F0F0F0;
	padding: 0px;
	margin: 0px;
	border-right: 1px solid silver;
	border-bottom: 1px solid silver;
}

div.actionDescription > span
{
	font-size:12px;
	display:table-cell;
	text-align:center;
	vertical-align:middle;
	padding: 0px;
	margin: 0px;
}

div.actionDescription > span > p 
{
	text-align: left;
	padding: 0px 10px 0px 10px;
}

div.actionMenu
{
	float: left;
	background: #ffffff;
	width: 206px;
	font-size: 13px;
	text-align: center;
	margin: 10px 30px 0 30px;
}

div.actionMenuHeader
{
	width:100%;
	display: block;
	height: 29px;
}

div.actionMenuHeaderLeft
{
	width:10px;
	background: url(/images/Banner_slices_01.gif);
	background-position: top left;
	float: left;
	clear: both;
	height: 29px;
}

div.actionMenuHeaderRight
{
	width:10px;
	background: url(/images/Banner_slices_03.gif);
	background-position: top right;
	float: right;
	height: 29px;
	clear: right;
}

div.actionMenuTitle
{
	float: left;
	background: url(/images/Banner_slices_02.gif);
	height: 29px;
	width: 186px;
}

div.actionMenuTitleText
{
	float: left;
	font-size:14px;
	text-align: left;
	text-decoration: none;
	padding: 0.5em 0px 0.3em 0px;
	height:18px;
}

/* If you want to make an action-menu looking header that's longer than the typical menu, for instance, the 'New Feature' box,
    add a div after the actionMenuTitle with this class, and specify the width you need.*/
div.actionMenuTitleExtender
{
	float: left;
	background: url(/images/Banner_slices_02.gif);
	height: 29px;
}
a.actionMenuItem
{

	display: block;
	width: 199px;
	padding: 0.5em 0 0.5em 5px;
	margin:0px;
	border-width: 1px;
	border-color: #ffe #aaab9c #ccc #fff;
	border-style: solid;
	color: #800000;
	text-decoration: none;
	text-align: left;
	background-color: #f2f2fa;
}

.actionMenuTeaser
{
	display: block;
	width: 199px;
	padding: 0.5em 0 0.5em 5px;
	border-width: 1px;
	border-color: #ffe #aaab9c #ccc #fff;
	border-style: solid;
	color: #800000;
	text-decoration: none;
	background-color: #f2f2fa;
	color: #999999;
}

a.actionMenuNewItem
{
	background-image: url(/images/NewBadge.gif);
	background-repeat: no-repeat;
	background-position: center right;
}

li.actionMenuHeaderListItem
{
	display: block;
	margin: 0px;
	padding: 0px;
	border-bottom: 1px solid gray;
	background: url(/images/Banner_slices_02.gif);
	background-position: bottom left;
}

img.actionMenuNewItem
{
	/*width: 45px;*/
	padding: 0px 0px 0px 1.5em;
	float:left;
	height: 29px;
	display:inline;
}

div.actionMenu > ul
{
	text-align: left;
	list-style: none;
	padding: 0;
	margin: 0px 0px 0px 0px;
}

div.actionMenu > ul > li
{
	display: block;
	margin: 0px;
	padding: 0px;
}

a.actionMenuItem:hover
{
	color: #336699;
	background-color: #f0f0f0;
	border-color: #aaab9c #fff #fff #ccc;
}

div.endMenuRow
{
	clear:both;
}

div.partiallyTransparentDiv
{
	filter: alpha(opacity=55);
	-moz-opacity: .55;
	opacity: .55; 
}


/* EXT JS FIXES */
/*
	When we include the Ext JS stylesheet (e.g. for File Upload functionality on the Account Details page),
	it defines some broad CSS selectors that override the browser's defaults, and ruin some of the layout.
	For example, they specify 0 padding for almost all elements, including Headers.
	Here, we define selectors that are needed to compensate for these broad Ext JS CSS statements, and restore default
	behavior that is not explicity defined in our stylesheet, and thus were being inherited from the browser.
*/
td#content > h1
{
	margin-top: 0.67em;
	margin-bottom: 0.67em;
}

/* Overrides the far-too-light default color of text in ExtJS disabled controls; we use black because there's already a graying overlay on disabled controls. */
.x-item-disabled
{
    color: black;
}
.x-item-disabled *
{
    color: black !important;
}
