/* BASIC STYLES */
	
	body, input, option, select, td, th, textarea
	 {
	 	font-size: 9px;
	 	font-family: Verdana, sans-serif;
	 }
	
	body
	   { background-image: url(/4dcgi/images/background.gif); 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: 630px;
		position: relative;
		top: -25px;
		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(/4dcgi/images/PlainHeader_InfoPlusServices.gif);
		height: 131px;
		width: 800px;
	}

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

	div#sftpsetup
	{
		background-image: url(/4dcgi/images/SFTPBanner.gif);
		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;
	}

	.reportaccess_subnav h2
	{
		border: none;
		font-size: 9px;
		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: 9px;
		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;
	}


/* FACTORY 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;
	}


/* 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
	 */
		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;
		}

.number { text-align: center }
.topnav { 
	color: #ffffff; 
	font-size: 9px; 
	font-family: Verdana, Arial, Helvetica, sans-serif; 
	/*background-color: #af9e9b*/
}
.topnav a:visited { color: #ffffff }
.topnav a:active { color: #ffffff }
.topnav a:link { color: #ffffff }
.topnav a:hover { color: #ffffff; 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: 8px;
}

.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(/4dcgi/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;
}

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; 
}

/* 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;
}