/* ==================================== */
/* == ELEMENT ATTRIBUTES FOR SCREENS == */
/* ==================================== */

/* ----------------------- */
/* ELEMENT/CLASS SELECTORS */
/* ----------------------- */

body {	
	color: #005e9d;		
	background: #92c4ea url(../images/backgrounds/gradient-blue.png) repeat-x;
	}	
	h1 {
		color: #fff;
		}	
	h2 {
		color: #077cc1;
		}
	a {
		color: #005e9d;
		}
	a:hover {
		text-decoration: none;
		}
	.lnote {
		font-size:9px;
		vertical-align:text-bottom;
		}
	span.br {
		display: block; /* Used for line break */
		}
	table {
		width: 95%;
		}
		caption {			
			background: #83caf0;
			}
	dt.link:hover {
		text-decoration: underline;
		cursor: pointer;
		}
	dt.show {
		font-weight: bold;
		}
	dd.hide {
		display: none;
		}
	dd.show {
		position: absolute;
		z-index: 1000;
		top: 140px;
		left: 100px;
		width: 270px;
		height: 310px;
		text-align: center;
		}		
	/* Accessibility skip link */
	.skip {
		display: none;
		}
	/* Generic Columns */
	.column1 {
		float: left;
		width: 45%;
		}
	.column2 {
		float: right;
		width: 45%;
		}
	/* Lists in columns */ 
	ul.columns li {
		list-style-image: url(../images/list-items/circle_solid.gif);
		/*list-style-position:inside;
		list-style-type:disc;*/		
		float: left;
		width: 25%;
		margin-right: 8%; /* EDITED IN IE6 CSS */	
		font-size: .85em;		
		}		
	/* Generic navigation */
	ul.nav {
		margin: 0;
		padding: 0;
		}	
		ul.nav li {
			float: left;
			margin: 0;
			padding: 0;
			list-style-type: none;
			}		
	/* Generic error messages */
	.error {
		color: red;
		font-weight: bold;
		}
	/* Generic Forms */
	fieldset {
		margin-bottom: 15px;
		}
		fieldset ul, fieldset li {
			list-style-type: none;
			margin: 0;
			padding: 0;
			}
			fieldset li {
				display: inline;
				}
		fieldset label {
			display: inline !important; /* Needed for ASP.NET-generated labels which are not implicit */
			margin-right: 1em;			
			}
	div.input {		
		float: left;
		margin-bottom: 5px;
		padding-right: 4px;	
		/* height:38px; */
		}	
		div.input input, div.input select {			
			width: 202px;
			height: 1.5em;
			border:1px solid black;
			}
		div.input select {			
			margin-bottom:4px;
		}			
		div.input input {
			margin-bottom: 2px;
		}
		div.checkbox input {
			border: 0px;
		}
		div.input input.inputError, div.input select.inputError {	
			border-color: Red;
		}		
		div.input textarea {
			width: 586px;
			height: 3em;
			}
	div.default {
		width: auto !important;
		height: auto !important;	
		padding-top: 0 !important;
		padding-bottom: 0 !important;
		}
		div.default input, div.default select {
		 	width: auto;
			height: auto;			
			}	
	div.checkbox, div.radio {
		clear: both;		
		float: none;		
		}		
		div.checkbox input, div.radio input {
			width: auto;
			vertical-align:bottom;
			}
		div.checkbox label, div.radio label {
			display: inline; /* Needed for ASP.NET-generated labels which are not implicit */
			}
	div.phone {
		}
		div.phone input {
			width: auto !important;
			}
		div.phone fieldset {
			width: 565px;
			}
	div.address {
		clear: both;
		width: 100%;
		}
		div.address input {
			width: 100%;
			}
	div.zip {
		}
		div.zip input, div.zip select {
			width: 5em;
			}
	div.comment {
		clear: both;
		width: 100%;
		}
		div.comment textarea {
			width: 100%;
			height: 6em;
			}
	div.submit {
		float: none;
		clear: both;
		margin-bottom: 20px;
		padding-top: 10px;
		}
		div.submit * {
			clear: both;
			}
	/* Form focus */
	input[type="text"]:focus, input[type="password"]:focus, textarea:focus {
		background-color: #fbd534;
		}
	select 	{
		/*margin-bottom: 6px;*/
	}
	
/* --------------------- */
/* SPECIFIC ID SELECTORS */
/* --------------------- */

/* Outer container */
div#main {
	position: relative;
	width: 802px;
	height: 721px;
	margin: 0 auto 50px auto;	
	}
	div#main h1 {
		font-size: 2.3em;
	}
	/* Header */
	div#header {		
		height: 152px;
		background: #1f2c5e url(../images/gradient-blue-slight.png) bottom repeat-x;
		}		
		div#main div#logo-columbia-pa {
			position: absolute;
			z-index: 100;
			top: 645px;
			left: 94px;
			}
		div#main.home div#logo-columbia-pa {
			position: static;			
			float: left;					
			margin: 51px 0 0 91px;						
			}
			div#main.home div#logo-columbia-pa a {
				background:transparent url(../images/logos/Logo_Masthead_pipeless.gif) no-repeat scroll 0 0;
				display:block;
				height:91px;
				left:0;
				width:210px;
				}
				div#main.home div#logo-columbia-pa img {
					display: none;
					}
		div#logo-ppc a {
			display: block;
			float: right;
			width: 262px;
			height: 78px;
			margin: 58px 59px 0 0;
			background: transparent url(../images/logos/price-protection-service.gif) no-repeat;
			}
			div#logo-ppc img {
				display: none;
				}
	/* Navigation */
	div#navigation {	
		position: relative;
		left: 82px;
		z-index: 1000; /* Always on top */	/* Commented SMH 2/10/09 for dialog */
		width: 719px;
		min-height: 27px;
		background-color: #59b6dd;
		}
		div#navigation a {
			display: block;
			margin-top: 6px; /* EDITED IN IE6 CSS */
			padding: 0 16px;
			color: #fff;
			text-decoration: none;
			text-transform: uppercase;
			border-right: 1px solid #fff;
			white-space: nowrap;
			}	
		div#navigation a:hover, div#main.about li#nav-1 a, div#navigation a:hover, div#main.making li#nav-2 a, div#navigation a:hover, div#main.service li#nav-3 a, div#main.faq li#nav-4 a, div#main.enroll li#nav-5 a {
			color: #2a579d;
			}	
		div#navigation li.last a {
			border-right: none;
			}
	/* Content */
	div#content {
		position: relative;
		width: 802px;
		height: 542px;		
		background-color: #fff;
		background-repeat: no-repeat;
		background-image: url(../images/backgrounds/gradient-w-circles-5.jpg); /* Generic background */
		}	
	div#main.home div#content {
		background-image: url(../images/backgrounds/gradient-blue-white.png);	
		}		
	div#main.about div#content, div#main.service div#content {
		background-image: url(../images/backgrounds/gradient-w-circles-1.jpg);
		}	
	div#main.making div#content {
		background-image: url(../images/backgrounds/gradient-w-circles-2.jpg);
		}
	div#main.faq div#content {		
		background-image: url(../images/backgrounds/gradient-w-circles-3.jpg);
		}		
	div#main.enroll div#content {		
		background-image: url(../images/backgrounds/gradient-w-circles-4.jpg);
		}
	div#main.enroll div#content div#content-primary div.billInfoToggle {	
		height:auto;
		margin-bottom:0;
		padding-bottom:0;
		}	
	div#main.enroll div#content div#content-primary div.billingInfo {	
		background-color:#DFEA99;
		border:4px solid #AFCB00;
		padding:5px;
		width:430px;
		margin-bottom:10px;
		margin-top:5px;
		}
	div#main.enroll div#content div#content-primary p.gasrate {
		padding-top: 20px;
	}
	div#main.enroll div#content div#content-primary div.billingInfo span {	
		margin-bottom: 10px;
		}
		div#main h1 {
			position: absolute;
			top: 50px;
			left: 262px;
			letter-spacing: 0px;
			}
		div#main.faq h1 {
			left: 425px;
			top:35px;
			}
		div#main.home h1 {
			/* position: static; */
			top: 70px;
			left: 465px;
			width: 315px; 
			color: #077cc1;
			z-index: 201;			
			}
		div#main.home div#content-primary p {
			z-index: 201;
		}
		p#privacy {
			position: absolute;
			top: 90px;
			left: 262px;
			}
		/* Primary content */
		div#main div#content-primary {
			position: absolute;
			z-index: 11;
			top: 137px;
			left: 263px;
			width: 505px;
			height: 385px;
			padding-right: 10px;
			overflow-y: auto;
			overflow-x: hidden;	
			}
		div#main.faq div#content-primary {
			position: static;			
			width: 350px;			
			padding-left: 425px;
			border-top: 137px solid transparent; /* EDITED IN IE6 CSS */
			}
		div#main.home div#content-primary {
			height:200px;
			left:0;
			margin-left:465px;
			overflow:auto;
			padding:0 32px 0 0;
			position:relative;
			top:190px;
			width:auto;
			z-index:201;
			}
			div#main.about div#content-primary div.samplePPSRates,
			div#main.making div#content-primary div.makingDecisionTable {
				margin-bottom: 15px;
				border-left: 1px solid #2A579D;
				margin-bottom: 15px;
			}			
			div#main.about div#content-primary table.samplePPSRates td,
			div#main.making div#content-primary table.makingDecisionTable td {			
				border-left-width: 0px;		
				border-left: solid 0px black;		
				margin-bottom: 0px;
				background-color: #ffffff;
			}
			div#main.about div#content-primary table.samplePPSRates, div#main.making div#content-primary table.makingDecisionTable {
				margin-bottom: 0px;
			}
			div#main.about div#content-primary table.samplePPSRates tr#tableHead td,
			div#main.making div#content-primary table.makingDecisionTable tr#tableHead td {
				background-color: #59B6DD;
				font-weight: bold;
				text-align: center;
			}
			div#main.about div#content-primary table.samplePPSRates tr#subHead td, 
			div#main.making div#content-primary table.makingDecisionTable tr#subHead td {				
				font-weight: bold;				
			}
			div#main.about div#content-primary table.samplePPSRates td, 
			div#main.making div#content-primary table.makingDecisionTable td 
			{
				text-align: center;
			}			
			div#main.about div#content-primary table.bulletedColumns td {
				border-width: 0px;
			}
			div#main.about div#content-primary table.bulletedColumns td.bullet {
				width: 10px;
				padding:5px;
			}
			div#main.about div#content-primary table.bulletedColumns td.text {
				/*width: 50px;*/
				padding-right:10px;
			}
			div#main.about div#content-primary p.smallReminder {
				font-size: 10px;
			}
			div#main.about div#content-primary h2 {
				clear: both;
				text-align: center;
			}
			div#main.faq div#content-primary dt {
				margin-bottom: 5px;
				cursor: pointer;
			}
			div#main.faq div#content-primary div.faqList div.column
			{
				width: 146px;
				float: left;
				margin-right: 20px;
			}

			a#budgetplanlink {								
				padding-bottom: 21px;
				background: transparent url(../images/buttons/what-is-this.gif) bottom no-repeat;												
				}
		/* Aside */
		div#content-aside {
			position: absolute;
			z-index: 10;
			}
		div#main.home div#content-aside {			
			top: 264px;
			left: 540px;
			width: 245px;
			height: 300px;			
			background: transparent url(../images/backgrounds/circles-small.png) no-repeat;
			}
			div#main.home div#content-aside a {
				position: relative;
				top: 60px;
				left: 20px;
				}
		div#main.about div#content-aside, div#main.service div#content-aside {			
			top: 215px;
			left: 33px;
			}
		div#main.making div#content-aside {			
			top: 225px;
			left: 33px;
			}
		div#main.making div#content-primary p#emphasisStrong {
			margin-top: 5px;
			font-size: 16px;
		}
		div#main.making div#content-primary p#emphasisStronger 
		{
			margin-top:-8px;
			font-size: 18px;
			font-weight: bold;
		}		
		div#main.faq div#content-aside {
			top: 67px;
			left: 39px;
			width: 379px;
			height: 380px;
			background: transparent url(../images/photos/hands-w-circles.jpg) no-repeat;	
			}	
		div#main.faq div#content-aside.circle {
			width: 318px;
			height: 320px;
			margin: 28px 0 0 35px;
			background: transparent url(../images/backgrounds/circle-white.png) no-repeat; /* EDITED IN IE6 CSS */
			}
			div#main.faq div#content-aside.circle p {
				display: none;
				}
			div#main.faq div#content-aside p {
				position: relative;
				top: 185px;
				left: 157px;
				color: #fff;
				font-weight: bold;
				font-size: 1.5em;				
				}	
		/* Feature */
		div#main.home div#content-feature {
			position: absolute;
			top: 4px;
			left: 0px;
			z-index: 200;
			}
			div#gas-rate {
				position: relative;
				top: -130px;
				left: 297px;
				width: 100px;
				text-align: center;
				}
				div#gas-rate span.dollars {
					display: block;
					margin-top: .2em;					
					font-size: 150%;
					}
		div#main.about div#content-feature {
			position: absolute;
			top: -115px;
			left: 100px;
			width: 334px;
			height: 241px;
			background: transparent url(../images/photos/fortune-cookie.png) no-repeat; /* EDITED IN IE6 CSS */
			}
		div#ctl00_primaryContent_ListDisplay1 > h2.sf_listTitle {
			display:none;
		}	
			
.budgetPaymentPlan 
{	
	height:400px;
	width: 600px;
	overflow-x: hidden;
	overflow-y: auto;
	position: absolute;
}

#budgetPaymentPlanInner 
{
	margin-top: 5px;
	margin-left: 5px;
	margin-bottom: 5px;
	margin-right: 30px;	
}

.sampleBillImageNoJS 
{
	width:475px; 
	overflow-x: auto;
}

.budgetPaymentPlanNoJS
{
	width: 475px;
}

/* ===================== */
/* == sIFR ATTRIBUTES == */
/* ===================== */

/* These are standard sIFR styles - do not modify */
.sIFR-flash {
	visibility: visible !important;
	margin: 0;	
	}
.sIFR-replaced {	
	visibility: visible !important;	
	}
span.sIFR-alternate {
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
	height: 0;
	display: block;
	overflow: hidden;
	}
/* "Decoy" styles - used to hide the browser text before it is replaced */
.sIFR-hasFlash h1 {	
	visibility: hidden;	
	margin-bottom: 8px;
	}


/* Simple modal */
/* Overlay */
#simplemodal-overlay {background-color:#000; cursor:wait;}

/* Container */
#simplemodal-container {height:400px; width:600px; background-color:#fff; border:3px solid #ccc;}
#simplemodal-container a.modalCloseImg {background:url(../images/x.png) no-repeat; width:25px; height:29px; display:inline; z-index:3200; position:absolute; top:-15px; right:-18px; cursor:pointer;}
#simplemodal-container #basicModalContent {padding:8px;}