/*
    Government of Alberta Environment and Parks - WATERS Application Style Sheet
*/

/***************** Skeleton ****************/

body {
    margin: 0px 8px;
    color: #333;
}

#pageWrap {
    width: 100%;
    min-width: 960px; /* works only for Firefox, IE 7, 8, Apple Safari and Google Chrome. Does not work for IE 6 */
}

#page {
    padding: 0px;
}

#widthContainer {
    /* this style prevents the content area from
       wrapping at lower resolutions */

    width: 955px; /* 955 needed for IE 6; otherwise would be 935 */
    margin: 0px;
    padding: 0px;
}

/***************** Header ****************/

#header {
    width: 98%;
    margin: 0px 8px 0px 8px;
    height: 101px;
    overflow: visible;
}

#logo {
    padding: 50px 0px 0px 0px;
    width: 670px;
}
    #logo a img
    {
        border:0;
        float:left;
        margin-right: 10px;
    }

    #logo h1#siteTitle {
        margin: 1px 0px 0px 0px;
        color:#838c92;
        font-size: 1.15em;
    }

#breadcrumb {
    margin: 0px 8px 0px 12px;
    width: 98%;
}
    #breadcrumb p {
        padding: 5px 0px 12px 0px;
        width: 79%;
    }

    #breadcrumb .help {
        display:inline;
        float:right;
        padding: 5px 15px 12px 12px;
        font-size: .75em;
    }

    #breadcrumb .help a:link,#breadcrumb .help a:visited  {
        color:#0D3692;
    }

    #breadcrumb .help a:hover {
        color:#000000;
        text-decoration:none;
    }

#metaNav {
    width: 400px;
}
    #metaNav li {
        font-size: 0.75em;
    }

    #metaNav a {
        font-size: 1em;
    }

    #applicationSelector
    {
        position: relative;
        top: 65px;
        left:400px;
    }
    #applicationSelector img
    {
        display: block;
    }

    #applicationSelector a:link
    {
        color: #0d3692;
    }

    #applicationSelector a:visited
    {
        color: #001b6b;
    }

/***************** Footer ****************/

#footer {
    padding: 55px 0px 0px 0px;
	width: 100%;
    height: 70px;
}

#goaLinks,
#siteLinks {
	float: left;
    margin: 5px 0px 0px 20px;
    width: 60%;
	color: #fff;
}

#goaLinks li,
#siteLinks li {
    float: left;

}

#copyright {
    float: left;
    width: 70%;
	margin: 1px 0px 0px 20px;
}

/***************** Left Navigation Menu ****************/

#navColumn {
    padding: 0px 0px 20px 8px;
	margin:0px;
/* width: 182px;*/
width:auto;
}

#navColumn .popupIcon a { /* used for Public Home page EP90 */
    color: #0d3692;
	font-size:.75em;
}

#navColumn .popupIcon a:hover { /* used for Public Home page EP90 */
    color: #000;
    text-decoration: none;
}

#primNav {
	font-size: 0.75em;
	width: 182px;
	margin: 0px;
	padding: 0px;
	line-height:15px;
}

#primNav ul, #primNav li {
    margin: 0px;
    padding: 0px;
    list-style-type: none;
}

#primNav ul a {
	text-decoration:none;
	line-height: normal;
}

#primNav li.heading {
	color: #333333;
    border-bottom: 1px solid #c2d5d4;
    background-color: #f2f5a9; /* #ffcd29;*/ /*#d6e4e5;*/
}

li.heading span {
	display:block;
	font-weight: bold;
	padding: 6px 6px 6px 7px;
}

#primNav li li a:link, #primNav li li a:visited {
	display: block;
    padding: 6px 6px 6px 22px;
    color: #001b6b;
    background-color: #fff; /*#eff5f5;*/
	border-top: 1px solid #c2d5d4;
}

#primNav li li a:hover {
	color: #fff;
    background-color: #f8982f; /* #2f8eaa;*/
	text-decoration: underline;
}
 
#primNav  li li.selected, #primNav li.selected, #primNav  li li.selectedActive a:link,  #primNav  li li.selectedActive a:visited {
    display: block;
	background-color: #f8982f; /* #fcaf2e; #fff;*/
	color: #000;
	font-weight: bold;
	padding: 6px 6px 6px 22px;
    border-top: 1px solid #c2d5d4;
	background-image: url(../Images/interface/indicator_selected.gif);
    background-repeat: no-repeat;
    background-position:7px 11px;
}

#primNav  li li.selectedActive a:hover {
    color: #fff;
    background-color: #f8982f; /* #2f8eaa;*/
	text-decoration: underline; 
}

#primNav li.homeSelected, #primNav li.home a:link, #primNav li.home a:visited {
    display: block;
    padding: 6px 6px 6px 7px;
    border-bottom: 1px solid #c2d5d4;
    background-color: #f8982f; /*#2f8eaa;*/
	color:#fff;
	font-weight: bold;
    background-position: 3px 7px;
}

#primNav li.home a:hover {
	text-decoration: underline;
 }
 
/* Fix whitespace issue in IE6: http://gtwebdev.com/workshop/gaps/white-space-bug.php */
#primNav li li a:link, #primNav li li a:visited {
	display: inline-block;
}

#primNav li li a:link, #primNav li li a:visited {
	display: block;
}
/*  close fix whitespace issue in IE6 */

/***************** Content Area General  ****************/

#contentColumn {
	float:left;
	width:745px;
	margin:0px;
	display: inline;
	overflow:visible;
}

#content { /*  Content Area should be 725 px */
	margin: 0px 0px 0px 20px;
	width:auto;
	line-height: 1.3em;
	font-size: .75em;	
}

#content * {
    font-size: 1.0em;
}

#content * * {
    font-size: 1em;
}

.emExtra {
	color: #ce2c10;
	font-weight:bold;
	}

#content h1  {
    margin: 0px 0px 15px 0px;
    padding: 0px;
    padding-bottom: 5px;
    font-size: 1.5em;
    color: #000;
    background: #f7f3f7;
}

#content h2, #content h2.section, h2 {
    font-size: 1.1em;
    color: #000;
	padding: 0px;
	margin: 25px 0px 8px 0px;
	border-bottom: none;
	font-weight:bold;
}

#content h2.title, h2.title { /* used under embedded tabs */
    margin-top: 0px;
	margin-bottom: 12px;
}

#content h3, h3 {
    font-size: 1.1em;
	font-weight:bold;
	color:#000000;
	margin:18px 0px 8px 0px;
}

#content h4, h4 {
    font-size: 1.0em;
	font-weight:bold;
	color:#333333;
	margin:17px 0px 4px 0px;
}

#content p, p {
margin: 0px 0px 12px 0px;
}

#content p.invalidResults,  p.invalidResults {
font-style:italic;
margin-bottom: 60px;
}

#content ul, ul {
margin: 0px 0px 12px 0px;
}

#content .em, .em, .bold {
font-weight:bold;
color:#000;
}

#content li, li {
margin: 4px 0px 0px 0px;
}

#content .notes, .notes {
	 font-size:.9em;
	 line-height:1.2em;
	 color:#666666;
	}
	
.indent1 {
	margin-left: 40px;
	}
	
.clear {
	clear:both;
	line-height:0px;
	}
	
.hide{
	display:none;
	}
	
.italicized {
	font-style:italic;
	}

#content .noBackground { background: #f7f3f7 none !important; }

/***************** DataGrid Decoration *****************/

.gridRecordCount 
{
    padding: 5px 0 5px 7px;
    margin-top: 1em;
    margin-bottom: 1em;
    background: #e0e0e0;
}

/***************** Collapsible/Expandable Section Headings ****************/


.headingCollapsed {
    padding: 12px 15px 12px 15px;
	font-weight:bold;
	background:url(../Images/icon_collapsed.gif) no-repeat 0px 15px;
}

.headingExpanded {
    padding: 12px 15px 12px 15px;
	font-weight:bold;
	background:url(../Images/icon_expanded.gif) no-repeat 0px 15px;
}
	

/***************** Forms - General ****************/
	
	form{
		margin:0px;
		padding:0px;
	}
	
	#content .required, .required { /* change back to 1.0em if changes line height too much */
		font-size:1.2em;
		font-weight:bold;
		color:#FF0000;
	}
	
	fieldset{
		-webkit-border-radius: 3px;
		-moz-border-radius: 3px;
		border-radius: 3px;
		border: 1px solid #D3D3D3;
		padding: 10px 10px 7px 10px;
		margin: 0px 0px 8px 0px;
		*padding-top: 0; /*to lose the added whitespace line in IEs*/
	}
	
	fieldset.hide, fieldset.noBorder{ 
		border:none;
		margin:0px;
		padding:0px;
	}
	
	legend{
		color:#000000;
		font-weight:bold;
		*margin-bottom: 1em; /*to compensate space lost due to padding-incapability in IEs*/
	}
	
	legend.hide{
		display:none;
	}
		
	input, select, textarea {
  		margin:  0px 0px 8px 0px;
		padding:0px;
		vertical-align:top;
		line-height:1.1em;
	}
	
	input, textarea {
  		padding-left:2px;
	}
	
	#content textarea, textarea {
		font-family:Arial, Helvetica, sans-serif;
		line-height:1.3em;
		padding: 4px 0px 4px 4px;
	}
	
	input.disabled, select.disabled, textarea.disabled {
	background-color: #F5F1ED;
	border:#A5AEB5 1px solid;
	font-color: #A5AEB5;
	}
	
	/***************** Two Column Styles ****************/
/*  Based on 18 col grid and default 9:9 width ratio, 36px / column = 648 +15 = 663 */

.section2Col .colLeft, .section2Col .colRight { 
float:left;
width:330px;
margin-right:15px;
clear:none;
}

.section2Col .colRight {
margin-right:0px;
}

.widthRatio11-7 .colLeft { /*  Used by DS130 and EP370  */
width:393px; 
}

.widthRatio11-7 .colRight {
width:255px; 
}

.widthRatio12-6 .colLeft { /*  Used by DS130  */
width:432px; 
}

.widthRatio12-6 .colRight {
width:216px; 
}

.widthRatio7-11 .colLeft { /*  Used by DS380  */
width:252px; 
}

.widthRatio7-11 .colRight {
width:396px; 
}

.marginTopMedium { /*  Used for button placement on AA80  */
margin-top:25px;
}

/***************** Three Column Styles ****************/

/*  Based on 18 col grid and default 6:6:6 width ratio, 35px / column = 636 + 30 = 660 */

.section3Col .colLeft, .section3Col .colMiddle, .section3Col .colRight { 
float:left;
width:210px;
margin-right:15px;
clear:none;
}

.section3Col .colLeft {
width:237px;
}

.section3Col .colRight {
margin-right:0px;
width:190px;
}

/***************** Multiple Columns - can have variable width ****************/


.sectionMultiColFlex .col {  /* used by AC30 */
float:left;
margin-right:15px;
clear:none;
}

.diversion {   /* used by AC30 only */
margin-left: 148px;
}

.diversion .col {  /* used by AC30 only */
width:70px;
}

.sectionMultiColFlex .colRight {  /* used by AC30 */
float:left;
margin-right:15px;
clear:none;
}
	

	
	/***************** Dual List Box and Roles Classes for AA140 ****************/

.dualListBox div {
float:left;
margin-right:7px;
}

.dualListBox div.lastCol {
margin-right:0px;
}

.dualListBox .buttonSet {
margin-top: 50px;
padding:0px;
}

#content .dualListBox .buttonSet a.button, .dualListBox .buttonSet a.button {
display:inline-block;
width:70px;
margin:5px 0px;
text-align:center;
padding: 3px 0px;
}

.roles select {
width:222px;
}

.roles ul {
width:145px;
margin:0px;
padding:0px;
}

.roles li {
list-style:none;
}

/***************** Data Tables (ie, non-jQuery tables) ****************/

.dataTable { 
border-left:1px solid #B5AEAD;
border-bottom:1px solid #B5AEAD;
border-top:1px solid #B5AEAD;
}

.dataTable table {
width:100%;
border-collapse:collapse;
}

/* Use for dataTable widths other than 100% */
.widthExtraSmall {width:300px; }
.widthSmall {width:400px; }
.widthMedium {width:500px; } 

/* Use for data tables with vertical scroll */
.dataTable.heightExtraSmall {height:100px; }
.dataTable.heightSmall {height:175px; }
.dataTable.heightSmallMedium {height:225px; }
.dataTable.heightMedium {height:275px; }
.dataTable.heightMediumLarge {height:325px; }
.dataTable.heightLarge {height:375px; }
.dataTable.heightExtraLarge {height:475px; }

.scroll {
overflow:auto;
border-top: 1px solid #C6C3C6;
border-bottom: 1px solid #C6C3C6;}

.dataTable table th {
    text-align:left;
    font-weight: bold;
    border-right: 1px solid #C6C3C6;
    padding: 3px 6px;
	margin: 0px;
	color: #ffffff;
	background-color: #B5AEAD;
	line-height: 1.1em;
}



#history.dataTable th.col1 {/* used for history table on DS240 */
width:15%;
}

.dataTable tr {
    margin:0px;
	padding:0px;
}

.dataTable td {
    font-weight: normal;
    border-top: 1px solid #B5AEAD;
	border-right: 1px solid #B5AEAD;
    padding: 6px 6px;
	line-height:1.2em;
	vertical-align:top;
	background-color:#ffffff;
}


.dataTable tr.sectionHeading td { /* used for AC210 */
font-weight:bold;
color:#000000;
background-color:#F7F3F7;
}

.dataTable tr.odd {
}

.dataTable ol {
    list-style:lower-alpha;
}

.dataTable p {
margin-bottom:4px;
}
	

	/*************** Label Types and Sizes ****************/
	
	label, .label, .inputListLabel {
		font-weight:bold;
		color:#333333;
		margin: 0px 0px;
		padding: 0px 0px 8px 0px;
	}
	
	label {
		display:inline-block;
		vertical-align: top;
		padding-right:0px;
	}
	
	.labelTop label {
	display:block;
	padding: 0px 0px 4px 0px;
	}
	
	.labelTop textarea, .labelTop select, .labelTop input {
	}
	
	.labelTiny label, .labelTiny .inputListLabel, .labelTiny .label, label.labelTiny { 
		width:40px;
	}
	
	.labelTiny .value {
		margin-left:43px;
	}
	
	.labelExtraExtraExtraSmall label, .labelExtraExtraExtraSmall .inputListLabel, .labelExtraExtraExtraSmall .label, label.labelExtraExtraExtraSmall { 
		width:60px;
	}
	
	.labelExtraExtraExtraSmall .value {
		margin-left:63px;
	}
	
	.labelExtraExtraSmall label, .labelExtraExtraSmall .inputListLabel, .labelExtraExtraSmall .label, label.labelExtraExtraSmall { 
		width:75px;
	}
	
	.labelExtraExtraSmall .value {
		margin-left:78px;
	}
	
	label.labelExtraSmall, .labelExtraSmall label, .labelExtraSmall .inputListLabel, .labelExtraSmall .label  { 
		width:100px;
	}
	
	.labelExtraSmall .value {
		margin-left:103px;
	}
	
	label.labelSmall, .labelSmall label, .labelSmall .inputListLabel, .labelSmall .label  {
		width:120px;
	}
	
	.labelSmall .value {
		margin-left:123px;
	}
	
	.labelSmallMedium label, .labelSmallMedium .inputListLabel, .labelSmallMedium .label, label.labelSmallMedium {
		width:145px;
	}
	
	.labelSmallMedium .value {
		margin-left:148px;
	}
	
	.labelMedium label, .labelMedium .inputListLabel, .labelMedium .label, label.labelMedium {
		width:175px;
	}
	
	.labelMedium .value {
		margin-left:178px;
	}
	
	.labelMediumLarge label, .labelMediumLarge .inputListLabel, .labelMediumLarge .label, label.labelMediumLarge {
		width:200px;
	}
	
	.labelMediumLarge .value {
		margin-left:203px;
	}
	
	.labelMediumMediumLarge label, .labelMediumLarge .inputListLabel, .labelMediumLarge .label, label.labelMediumLarge  {
		width:210px;
	}
	
	.labelMediumMediumLarge .value {
		margin-left:213px;
	}	
	
	.labelLarge label, .labelLarge .inputListLabel, .labelLarge .label, label.labelLarge {
		width:250px;
	}
	
	.labelLarge .value {
		margin-left:253px;
	}
	
	.labelExtraLarge label, .labelExtraLarge .inputListLabel, .labelExtraLarge .label, label.labelExtraLarge {
		width:350px;
	}
	
	.labelExtraLarge .value {
		margin-left:353px;
	}
	
	.labelExtraExtraLarge label, .labelExtraExtraLarge .inputListLabel, .labelExtraExtraLarge .label, label.labelExtraExtraLarge {
		width:400px;
	}
	
	.labelExtraExtraLarge .value {
		margin-left:403px;
	}
	
	label.labelNoWidth, .labelNoWidth label, .labelNoWidth .inputListLabel, .labelNoWidth .label, label.labelNoWidth {
		width:auto;
		padding-right:5px;
	}
	
	.labelNoWidth .value {
	margin-left: 5px;
	}
	
	label.multiCol, label.beside { /* used to insert one field to right, without breaking section into multiple columns */
		width:auto;
		padding-left: 30px;
		padding-right:3px;
	}
	
	.fieldGroup label.beside { /* used for telephone numbers and extension */
		padding-left: 5px;
	}
	
	
	
	
	/*************** Form Field Sizes ****************/
	
	
	.tiny{
		width:30px;
	}
	
	.extraExtraSmall{
		width:60px;
	}
	
	select.extraExtraSmall{
		width:65px;
	}
	
	.extraSmall{
		width:100px;
	}
	
	select.extraSmall{
		width:105px;
	}
	
	.small{
		width:150px;
	}
	
	select.small{
		width:155px;
	}
	
	.smallMedium{
		width:200px;
	}
	
	select.smallMedium{
		width:205px;
	}
	
	.medium{
		width:250px;
	}
	
	select.medium{
		width:255px;
	}
	
	.mediumLarge{
		width:300px;
	}
	
	select.mediumLarge{
		width:305px;
	}
	
	.large{
		width:350px;
	}
	
	select.large{
		width:355px;
	}
	
	.large420{
		width:420px;
	}
	
	.extraLarge{
		width:450px;
	}
	
	select.extraLarge{
		width:455px;
	}
	
	.extraExtraLarge{
		width:550px;
	}
	
	select.extraExtraLarge{
		width:555px;
	}
	
	.widthFull{
		width:100%;
	}
	
	textarea.heightExtraSmall{
		height:40px;
	}
	
	textarea.heightSmall{
		height:50px;
	}
	
	textarea.heightMediumSmall{
		height:76px;
		padding:4px 0px 4px 4px;
	}

	textarea.heightMedium{
		height:100px;
		padding:4px 0px 4px 4px;
	}
	
	textarea.heightLarge{
		height:150px;
		padding:8px 0px 8px 8px;
	}
	
	textarea.heightExtraLarge{
		height:200px;
		padding:8px 0px 8px 8px;
	}
	
			/**************** Checkboxes and Radio Buttons ****************/
	
	.inputListLabel { /* use for labelling checkbox and radio button lists */
		float:left;
		clear:left;
	}
	
	.inputList { /* use for radio and checkbox lists */
		display:inline-block;
		float:left;
		margin: 0px 0px 8px 0px;
		padding: 0px 0px;
	}
	
	.inputList label {
		padding: 0px 15px 0px 0px;
		margin: 0px;
		font-weight:normal;
		color:#000;
		width:auto;
		line-height:1.8em;
		}
	
	.inputList input {
		padding: 0px;
		margin:  0px;
		height:1.8em; /* fixes check and radio input alignment issues across browsers */
	}
	
	
	/***************** Group Box and Header Box ****************/

	.groupBox  { 
		-webkit-border-radius: 3px;
		-moz-border-radius: 3px;
		border-radius: 3px;
		background-color:#F7F7F7;
		border: 1px solid #D3D3D3;
		padding:5px;
		padding: 10px 10px 7px 10px;
		margin: 6px 0px 10px 0px;
	}
	
	.headerBox  {
		border-top: 1px dotted #00add8; /*#D1D4D3;*/ /*#B5D329;*/
		border-bottom: 1px dotted #00add8; /*#D1D4D3; */ /*#B5D329;*/
		padding: 9px 10px 8px 0px;
		margin: 0px 0px 20px 0px;
		line-height:1.0em;
	}
	
	.withIcon .dataGroup, #content .withIcon p  {
		margin-left: 32px;
		vertical-align:top;
		padding: 0px;
	}
	
	
	.personIcon  {
		background-image:url(../Images/icon_person.gif);
		background-repeat:no-repeat;
		background-position: 0px 7px;
	}
	
	.mailIcon  {
		background-image:url(../Images/icon_email.gif);
		background-repeat:no-repeat;
		background-position: 0px 0px;
	}
	
	#content .headerBox .dataGroup .label, #content .headerBox .dataGroup .value, .headerBox .dataGroup .label, .headerBox .dataGroup .value  {
		font-size:.9em;
		padding-bottom: 3px;
	}
	
/***************** Read-Only Name/Value Pairs (ie, Data Groups) ****************/
	
	
	
	
	.dataGroup div {
	clear:both;
	}
	
	.dataGroup .label, .label {
		display:block;
		float:left;
		padding-bottom:8px;
	}
	
	.dataGroup .value, .value {
		display:block;
		padding-bottom: 8px;
	}
	
	.compact {
	margin-bottom: 8px;
	}
	
	.compact .dataGroup .label, .compact .dataGroup .value {
	padding-bottom: 2px;
	}

	
	/***************** Standard Buttons and Links ****************/
		
	.buttonRow {
	margin: 35px 0px 12px 0px;
	}
	
	.linkRow {
	margin: 20px 0px 12px 0px;
	}
	
	.gridButtonRow {
	margin: 10px 0px 12px 0px;
	}
	
	.sectionButtonRow {
	margin: 10px 0px 12px 0px;
	}

	#content a:hover {
	padding-bottom: 0; 
	border: 0;
	/*border-bottom-color: rgb(0, 80, 114); border-bottom-width: 1px; border-bottom-style: solid;*/
	}
	
	
	#content ul li {
		/*margin: 2px 0px 0px;*/
		list-style-type:none;
	}
	
	#content a.button, #content a.button:link, #content a.button:active, #content a.button:visited, a.button:link, a.button:active, a.button:visited {
		border: 1px solid #8C8A8C;
		background: url(../Images/bu_bg.jpg) center no-repeat; 
		border-radius: 3px;
    	-moz-border-radius: 3px;
    	-webkit-border-radius: 3px;
		padding: 3px 12px;
		text-decoration:none;
		margin-right: 15px;
		color:#333333;
		font-weight:bold;
		font-size:.9em;
		display:inline-block;
		min-width:60px;
		text-align:center;
	}
	
	#content .gridButtonRow a.button:link, #content .gridButtonRow a.button:active, #content .gridButtonRow a.button:visited, .gridButtonRow a.button:link, .gridButtonRow a.button:active, .gridButtonRow a.button:visited  {
	margin-right:8px;
	}

	#content a.button:hover, a.button:hover {
		background-image:url(../Images/bu_bgHover.jpg);
		border: 1px solid #7F7F7F;
		color:#000;
	}
	

	
	#content a.disabled, #content a.disabled:link, #content a.disabled:visited, #content a.disabled:hover, a.disabled:link, a.disabled:visited, a.disabled:hover {
		border: 1px solid #8C8A8C;
		color:#333333;
		cursor: default;
		background: url(../Images/bu_bg.jpg) center no-repeat; 
		opacity: .35; filter:Alpha(Opacity=35);
	}
	
	#content a.inline, a.inline {
		margin-left: 8px
	}
	
	
	/***************** Tall Buttons ****************/
	
	#content .buttonsTall  {
	margin: 0;
	padding: 0 0 20px;
	}
	
	#content .buttonsTall ul  {
	padding: 0px;
	margin:0px;
	display:block;
	}
	
	#content .buttonsTall li.button { 
		float:left;
		list-style:none;
		border: 1px solid #8C8A8C;
		background:url(../Images/bu_bg_tall.jpg) no-repeat center;
		border-radius: 3px;
    	-moz-border-radius: 3px;
    	-webkit-border-radius: 3px;
		padding: 3px 8px;
		margin:0px;
		margin-right: 8px;
		line-height:1.0em;
		height:25px;
		text-align:center;
		vertical-align:middle;		
	}
	#content .buttonsTall li.button a:link, #content .buttonsTall li.button a:active, #content .buttonsTall li.button a:visited {
	text-decoration:none;
	color:#333333;
	font-weight:bold;
	font-size:.9em;
	}
	
	#content .buttonsTall li.hover {
	background-image:url(../Images/bu_bgHover_tall.jpg);
	/*background-color: #FF0000;*/
	
	}
	
	
	#content .buttonsTall li.disabled {
	background-image:url(../Images/bu_bgDisabled_tall.jpg);
	border: 1px solid #C4C3C4;
	color:#C7C7C7;
	
	}
	
	#content .buttonsTall li.disabled a:link, #content .buttonsTall li.disabled a:visited,  #content .buttonsTall ul li.disabled a:hover {
	text-decoration:none;
	color:#C7C7C7;
	cursor: default;
	}

/***************** Error Messages ****************/

#content h1.systemError, h1.systemError {
    color: #CE0808;
    background: url(../Images/icon_alertLarge.gif) no-repeat 1px 0px;
    padding-left: 35px;
    line-height: 1.4em;
}

#content h1.AlertHeader, h1.AlertHeader {
    color: #fbad2e;
    background: url(../Images/alert_lrg.gif) no-repeat 0px 20px;
    padding-left: 40px;
    line-height: 2.4em;
}
	
	#content p.systemError, p.systemError {
	}
	
	.errorMessageContainer {
		-webkit-border-radius: 4px;
		-moz-border-radius: 4px;
		border-radius: 4px;
		background-color:#FFFDE3;
		border: 1px solid #FCE486;
		padding: 10px 10px 10px 28px;
		margin-bottom: 12px;
		background-image:url(../Images/icon_alert.gif);
		background-repeat: no-repeat;
    	background-position:10px 12px;
	}
	
	.messageHeader {
   	 	color: #CE0808;
   	 	font-weight: bold;
	}
	
	#messages ul, .errorMessageContainer ul {
    	padding: 0px;
		margin: 4px 0px 0px 20px;
}

	#messages ul li, #content .errorMessageContainer ul li, .ui-dialog .errorMessageContainer ul li{
    	list-style-image: none;
    	list-style-type: circle;
   	 	padding: 0px;
		margin: 0px 0px 0px 8px;
}

/***************** Informational / Status Messages ****************/

	.infoMessage {
    	-webkit-border-radius: 4px;
		-moz-border-radius: 4px;
		border-radius: 4px;
		background-color: #F6F6F3;
    	border: 1px solid #00add8; /*#B5D329;*/
    	padding: 10px 10px 4px 28px;
		background-image:url(../Images/icon_info.gif);
		background-repeat: no-repeat;
    	background-position:10px 11px;
		margin-bottom: 12px;
	}
	
	#content .infoMessage p, .infoMessage p {
    margin-bottom:6px;
	padding-bottom:0px;
	}

/***************** Criteria Table Styles ****************/

.CriteriaContainer{
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	background-color:#F7F7F7;
	border: 1px solid #D3D3D3;
	padding: 10px 10px 7px 10px;
	margin: 6px 0px 10px 0px;
}

.CriteriaContainer.noContainer {
	background:none;
	border:none;
	padding:0px;
	margin:0px;
}

.CriteriaArea{
    
}

.CriteriaArea.dataTable{
    border: none;
}

.CriteriaTable {
	margin-bottom: 1em;
	border:none;
}

.CriteriaArea th.transparent {
    border-left:none;
	background:none;
	width:20px;
}

.CriteriaTable td {
	border-bottom: 1px solid #B5AEAD;
}

.CriteriaTable td.transparent {
    border-bottom:none;
	border-top:none;
	background:none;
	padding-left:0;
}

.CriteriaTable td select, .CriteriaTable td input {
margin: 0px 0px;
    
}

.CriteriaTable input.criteriaTextBox {
width:130px;    
}

.CriteriaTable select.criteriaSelectValue {
width:150px;    
}

.valueCell select.criteriaSelect {      
}


.CriteriaTable .attributeCell {
    font-weight: bold;
    color: #404040;
    background-color: #EFF7F7;
}


.CriteriaTable .actionCell {
}

.PossibleAttributesDropDown {
	margin-left:33px;
}

.valueCell textarea  {
margin-bottom: 4px;
line-height:1.2em;
height: 50px;
width: 260px;
}

.comparisonCell select {
width:112px;
}

.CriteriaTable .valueCell input.buttonSecondary {
width: 75px;
}

/***************** Popup Styles ****************/
		
	body.popup {
    margin: 0px;
	color: #333;
	background: #ffffff;
}

	
	#popupHeader {
	 background:#ffffff url('../Images/bu_bannerPopup.jpg') repeat-x left top;
	 color:#ffffff;
	 font-weight:normal;
	 font-size:1.0em;
	 margin:0px;
	 padding: 6px 10px;
	 border: solid 1px #21759c;
	 
	}

.popup #content { 
	margin: 15px;
	padding: 0px;
}

.popup .buttonRow {
border-top: dotted 1px #cccccc;
padding: 15px 0px;
}

/***************** AC20 Dashboard Styles ****************/

/*  Based on 4 col grid with equal widths, 170px / column = 680 + 45 = 725 */

#content #dashboard h1 {
margin-bottom:25px;
}

#dashboardSection1.section2Col .colLeft, #dashboardSection1.section2Col .colRight  {
width: 355px;
}

#dashboardSection2 .section2Col .colLeft  {
width: 720px;
}

#dashboardSection2 .section2Col .colRight  {
margin-right:0px;
margin-left:35px;
width:130px;
}
#stats {	
background-color:White;
padding: 10px;
}

#content #dashboard h2.section {
border-top: solid 1px #b0b0b0;
padding-top: 2px;
font-size:1.0em;
line-height:1.1em;
vertical-align:top;
}


#content #dashboard #legend h2 {
color:#333333;
font-size:1.0em;
}


.section4Col .colLeft, .section4Col .colMiddle, .section4Col .colRight { 
float:left;
width:160px;
margin-right:15px;
text-align:center;
clear:none;
}

.section4Col .colRight {
margin-right:0px;
}

#dashboardSection2 .section4Col .colRight {
margin-left:40px;
width:130px;
text-align:left;
}

.gauge {
position:relative;
top:0px;
width:135px;
margin-bottom:35px;
margin-top:10px;
}

#content .gauge a img 
{
	border:0;
	}
	

#content .gauge a.button, #content .gauge a.button:visited  {
position:absolute;
top:85px;
left:15px;
border: 1px solid #dedede;
background: url(../Images/gaugeBu_bg.gif) top repeat; 
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
padding: 3px 0px;
text-decoration:none;
color:#666666;
font-weight:normal;
font-size:.9em;
width:135px;
text-align:center;
margin-right:0px;
}

#content .gauge a.tall {
top:67px;
padding: 4px 0px;
}

#content .gauge a.button span, #content .gauge a.button:visited span  {
text-decoration:underline;
color:#002698;
font-weight:bold;
}

#content .gauge a.button:hover {
background: url(../Images/gaugeBu_bg_hover.gif) bottom repeat;
}

#content .gauge a.button:hover span {
color:#000000;
text-decoration:none;
}

#content #dashboard .legend ul {
margin:0px;
padding:0px;
}

#content #dashboard .legend li {
position:relative;
list-style:none;
margin:0px 0px 10px 0px;
padding-left:15px;
font-size:.9em;
color:999999;
line-height:1.1em;
}

#dashboard .legend img {
position:absolute;
top:0px;
left:0px;
}

/***************** Page Loader ****************/

#pageLoader {
text-align:center;
margin-top:80px;
}

#content #pageLoader p {
margin-top:20px;
line-height: 1.4em;
}

#pageLoader p span {
text-weight:normal;
font-style:italic;
color:#999999;
}

/***************** EP90 Public Home Page ****************/

.runningHead  {
    font-size: 1.0em;
	line-height:1.0em;
	font-weight:bold;
	color: #00add8; /*#8ea620;*/
	margin: 0px 0px 4px 0px;
	padding:0px;
}

#sectionMain h1 {
font-size:1.5em;
}

/*  Based on 4 col grid with equal widths, 170px / column = 680 + 45 = 725 */

#sectionMain.section2Col .colLeft {
width:505px;
margin-right:20px;
}


#sectionMain.section2Col .colRight {
width:200px;
}

#map {
	display:block;
	float:left;
	margin-right:15px;
}

.leader {
	display:block;
	float:left;
	margin-right:6px;
}

#sectionMain .highSpeed {
border-bottom: 1px dotted #B5D329;
margin-bottom:15px;
}

/*  Home page Icons */
#sectionMain .withIcon p, #questions .withIcon p  {
	margin-left: 35px;
}

.highSpeedIcon  {
	background-image:url(../Images/icon_highSpeed.gif);
	background-repeat:no-repeat;
	background-position: 0px 0px;
}

.clockIcon  {
	background-image:url(../Images/icon_clock.gif);
	background-repeat:no-repeat;
	background-position: 0px 0px;
}

.questionIcon  {
	background-image:url(../Images/icon_questionMark.gif);
	background-repeat:no-repeat;
	background-position: 0px 0px;
}

/*  News section */

#news.groupBox {
margin-bottom:20px;
padding-top:12px;
}

#news .colLeft {
width:50px;
margin-left:10px;
margin-right:15px;
font-size:1.1em;
}

#news .colLeft img {
margin-top:4px;
}

#news .colRight {
width:580px;
}

#news ul {
margin:0px;
padding:0px;
}

#news li {
list-style:none;
margin: 0px 0px 6px 0px;
}

/* EP90 Questions Section */

#questions {
margin-bottom:12px;
}

#questions p {
}

#questions .section2Col .colLeft, #questions .section2Col .colRight { 
float:left;
width:395px;
margin-right:15px;
}


#questions .section2Col .colRight {
margin-right:0px;
width:295px;
}

#questions .dataGroup .label, #questions .dataGroup .value  {
padding-bottom:2px;
}

/***************** Definition Lists - used for EP90 Nav Menu popup ****************/

#navMenuList h2.section {
border-top: 1px dotted #B5D329;
padding-top:3px;

}

#navMenuList dl {
margin-bottom:30px
}

#navMenuList dt {
float:left;
width:150px;
font-weight:bold;
}

#navMenuList dd {
margin-left:155px;
margin-bottom:6px;
}

/***************** Anchor Lists ****************/
#content ul.anchors {
 margin: 0 0 12px;
}

#content ul.anchors li {
list-style-image:url(../Images/icon_downArrow.gif);
padding: 0 0 0 0px;
}

/***************** Link Icons ****************/
.withLinkIcon { /* used for PDF and Word doc links */
display:block;
vertical-align:top;
padding: 0 0 3px 0;
margin-bottom:6px;
}
.withLinkIcon a {
margin-left: 24px;
}

/*#navColumn .withLinkIcon a {
font-size: .75em;
color: #0D3692;
} */


.wordIcon  {
background-image:url(../Images/icon_word.gif);
background-repeat:no-repeat;
background-position: 0px 0px;
}


.pdfIcon  {
background-image:url(../Images/icon_pdf.gif);
background-repeat:no-repeat;
background-position: 0px 0px;
}

.popupIcon  {
background-repeat:no-repeat;
background-position: 0px 5px;
}

/***************** Wait Message ****************/

.waitMessage {
text-align:center;
margin-top:60px;
padding-bottom:60px;
}

#content .waitMessage p {
margin-top:20px;
line-height: 1.4em;
}

.waitMessage p span {
text-weight:normal;
font-style:italic;
color:#999999;
}

.miniWaitMessage {
	text-align:center;
}

/*Fix for Defect 518 - Use Points grid displayng badly in Firefox */
#useGrid {float: left;}

/****************** File Upload *********************/

body.fileUpload 
{
    background-color: #fff;
    border-bottom-style:none;
    border-width:0px;
    padding:0px;
    margin:0px;
}
body.fileUpload.grey
{
    background-color:#f7f7f7;
    border-bottom-style:none;
    border-width:0px;
    padding:0px;
    margin:0px;
}
body.fileUpload.background
{
	background-color: #F1F2F2;
}
body.fileUpload p 
{
    font-size:0.75em;
    font-family:Arial, Helvetica, sans-serif;
}

body.fileUpload span 
{
    font-size:8pt;
    font-family:Arial, Helvetica, sans-serif;
}

iframe.fileUpload 
{
    height:70px;
    border-style:none;
    border-width:0px;    
}
.dataGroup .fileUpload
{padding-bottom:0;}