﻿/* -------------------------- */
/* ------- Init Resets ------ */
/* -------------------------- */

body     { font-family:Tahoma, Geneva, Arial, Helvetica, sans-serif; font-size: 80%; background:#808080 url(body-bg.jpg) repeat-x left top; padding: 0 25px; margin:0; color: #777; }
a        { color: #69C;   }
a:hover  { color: #09F;   }
a:focus  { outline: none; }
p        { margin: 0 0 0.8em 0; line-height: 140%; }
strong   {  }
em       {  }
ul       { margin:0 0 0 2.5em; padding:0;}
ul li    { margin: 0.1em 0;  }
hr       { height:1px; background:#CCC; border:0; margin:1em 0; }
h1       { font-size:160%; font-weight:bold; color: #F90; }
h2       { font-size:180%; font-weight:normal; color: #666; }
h3       { font-size:150%; font-weight:normal; color: #666; }
h4       { font-size:120%; font-weight:bold; color: #666; }
img      { border:0; }
.clearer { clear:right; height:0; overflow:hidden; width: 100%; }


/* Page Layout */
#bodyContainer { padding:0; }

#header { height: 78px; background: url(gas-admin-header-background.jpg) repeat-x left top; margin: 0; overflow: hidden; }

#contentArea { padding:0; margin:0; margin-bottom: 32px; height:auto; line-height:normal; padding-left: 215px; }

.leftColContainer {  background: url(sidebar-top.jpg) no-repeat -10px top; width:195px; margin-top: -3px; float:left; }
	#bodyContainer > .leftColContainer { margin-top:0px; }
.leftColContainer h2 { background: #999; color: #FFF; margin:32px 0 0 0; padding: 7px; font-size: 16px; font-weight:bold; text-align:center; }
.leftCol { width:195px;  height:auto; margin:0; }
	.leftCol .repeater {    }
	.leftCol h1 { font-weight:normal; size:160%; text-align:center; font-family:Arial, Helvetica, sans-serif; color:#f8b48e; margin:0; }
	.leftCol .bottom { /*width:200px; height:22px; margin:0; position:relative; top:5px;*/ display:none; }
	.leftCol .navContent { margin-left:5px; }

/* Table for quick stats */

.quickStatistics {  }
.quickStatistics span { background: #999; color: #FFF; margin:0; padding: 7px; font-size: 16px; font-weight:bold; display:block; text-align:center;  }

.quickStatsTable {  color:#999; font-size:11px; width:100%; margin:10px 0 32px 0; }
	.quickStatsTable tr {  }
	.quickStatsTable td { white-space:nowrap; padding:1px 7px; }
	.quickStatsTable .quickStatsLabel { font-weight:bold; }
	.quickStatsTable .separator { height:3px;  overflow:hidden; line-height: 1px; font-size: 1px; border-bottom: 1px dotted #DDD; padding:0; }

/* Help Icon - part of admin template */
div.helpIcon { display:block; float: right; z-index: 0; margin-top: 17px; }

/* ------------------------------------- */
/* ------- Theme editor bits ----------- */
/* ------------------------------------- */

	/* General buttons style */
	.admin-button { background:url(../../images/buttons-background.jpg) repeat-x left top; display:block; padding:4px 8px; float:left;
					border:1px solid #777; border-top:1px solid #CCC; border-left:1px solid #CCC; text-align:center; color: #777; text-decoration:none; white-space:nowrap; }
		.admin-button img  { vertical-align:middle; padding-right:5px; }
		.admin-button span {  }
	
	.admin-step { display: block; }
	a.inline    {  margin:0; display:inline; vertical-align: middle; padding:0px 8px; float:none;  }
	a.align-right { float:right; margin-right:0; }
	
/* General bits used all over */
.yellowcontainer { clear:right; margin: 7px 0; background:#FFA; padding: 7px; width:98%; }
	
.previewSave { width:98%; clear:right; margin: 7px 0; }
	.previewSave .admin-button { float:right; margin:0 0 5px 5px; }	
.blueFade     { background: #ffffff url(blue-fade.jpg) repeat-y top right; margin: 0 0 7px 0; width:98%; }
	.blueFade .admin-button , .greyFade .admin-button { margin:0 5px 0 0; /* float:none; display:inline; vertical-align: text-top; */ }
	.blueFade select { vertical-align:middle; min-width: 200px; max-width: 400px; }
	.greyFade select { vertical-align:middle; min-width: 130px; max-width: 400px; }
	.blueFade .blueStep  , .greyFade .greyStep { font-family: "Impact", Arial, Helvetica, sans-serif; font-size:26px; color: #69C; text-align:left; }
.greyFade     { background: #efefef url(grey-fade.jpg) repeat-y top right; margin: 0 0 7px 0; width:98%; }
	.greyFade .greyStep { color: #888; }

table.stepTable { width:100%; border:0; }
table.stepTable td { padding:7px; margin:0; }
table.stepTable div.stepTitle { min-width: 160px; float: left; }
table.stepTable div.stepOption { float: left; }
table.stepTable div.stepButton { float: left; }
table.stepTable td.step2SampleImg { width: 148px; }

td.step1Text  { vertical-align:middle; white-space:nowrap; width:9%; text-align:left; }
td.step2Text  { vertical-align:middle; white-space:nowrap; width:9%; text-align:left; }
td.step1Text div.textContainer, td.step2Text div.textContainer { width: 75px; }
table.stepTable td.step3Text  { font-family: "Impact", Arial, Helvetica, sans-serif; font-size:26px; color: #69C; text-align:left; }


.sampleImg { display:block; padding-bottom:3px; color: #555; }

.optionsText { color: #777; font-family: Tahoma, Arial, Helvetica, sans-serif; font-size: 13px; font-weight:normal; position:relative; top: -5px; padding-left: 10px; }

td.pageOptionsCell { background: #E5E5E5; vertical-align:top; border-top:7px solid #FFF; white-space:nowrap; width: 5%; color: #777; }
	td.pageOptionsCell h3 { font-size: 13px; font-weight:bold; margin:0; padding:0; border-bottom:1px solid #AAA; text-align:left; padding-bottom:3px; }
	td.pageOptionsCell div.imageOptions {   }
td.pageExampleCell { background: #FFF; vertical-align:top; border-top:7px solid #FFF; }
	td.pageExampleCell h3 { font-size: 13px; font-weight:bold; margin:0; padding:0; border-bottom:1px solid #AAA; text-align:left; padding-bottom:3px; }
	
.colourOptions label { display:block; text-align:left; margin-top: 10px; }
	.colourOptions label input { width:7em; border:1px solid #CCC; border-left:24px solid #CCC; font-size:11px; padding:5px; font-family:Tahoma, Arial, Helvetica, sans-serif; vertical-align:middle; }
	.colourOptions label img   { position:relative;vertical-align:middle; }

div.imageOptions { white-space:normal; }
	div.imageOptions input {  }



	/* ------ Colour Picker ------ */
	
	#colourPickerExample { padding:0px; margin:1em; border: 1px solid #666; text-align:center;
							font-family:Tahoma, Geneva, Arial, Helvetica, sans-serif; font-size:11px; background: #e5e5e5; }
		#cpExheaderLinks { padding:10px 5px; text-align:right; font-weight:bold; }
		#cpExsearchArea  { padding:10px 0px 20px 0px; }
		
		#ctl00_Content_imgThemePreview     { width:270px; height:154px; }
	
		#cpExfooterLinks { padding:5px; background: #CCC; font-weight:bold; }
		.pickerButtons input { position:relative; line-height: 11px; top:3px; margin-left: 15px; }

/* ---------------------------------------*/

#ctl00_Content_gvStatistics { width:99%; }

.formdiv
{
	margin-right: 2.5em;
	width: 320px;
	float: left;
}

.formdivsearch
{
	margin-right: 2.5em;
	width: 320px;
	float:left;
	margin-top: .2em;
}

.locationdiv
{
	margin-right: 2.5em;
	width: 200px;
	float: left;
}

.locationdivsearch
{
	margin-right: 2.5em;
	clear: right;
	width: 250px;
}

.clearboth
{
	clear: both;
	margin-right: 2em;
}

.formlabeldiv
{
	width: 100px;
	float: left;
	margin-top: .2em;
	margin-bottom: .2em;
}

.formfielddiv
{
	width: 190px;
	float: left;	
	margin-top: .2em;
	margin-bottom: .2em;
}

.formlocationdiv
{
	width:	190px;
	float:	left;
}

.nowrapdiv
{
	white-space: nowrap;
	width:98%;	
	margin-top: 1em;
	margin-bottom: .3em;
	height: 18px;
	float:left;
}

.buttondiv
{
	width: 290px;	
	margin-top: .2em;
	margin-bottom: .2em;
}

/* Header Logo */

#logo {
	float: left;
	padding: 0 0 0 14px;
}

/* Header Menu */

#headerMenu { position:absolute; top:0; right:26px; background:url(top-right-links-backg.jpg) no-repeat left top; width:auto; height:80px; padding: 15px 10px 0 35px; right: 0px; }

#headerMenu a         { font: Tahoma, Verdana, Arial, Helvetica, sans-serif; color: #FFF; text-decoration:none; margin:0 1.6em 0 0; float:left; }
#headerMenu a:hover   { color:#f60; }
#headerMenu a.current { font-weight:bold; cursor:default; }
#headerMenu a.current:hover { color:#FFF; }
#headerMenu img  { display:none; }
#headerMenu span { display:block; clear:left; float:left; width:auto; white-space:nowrap; padding-top:5px; color: #FFF; }

#headerMenu #ctl00_logInOut { float:left; }

/* Page Content  */

#pageTitle { height:90px; width:auto; /* background:#0066CC url(content-area-clouds-back.jpg) no-repeat right top; */ margin:0; padding:0; position:relative; display:none; }
	#pageTitle * { margin:0; }
	#pageTitle h2 { text-align:left; padding:15px 10px 0 240px; font-size:160%; color: #FFF; position:absolute; left:0; top:0;  z-index: 10; }
	#pageTitle h2 span   { font-size: 70%; }
	#pageTitle h2 span strong { color:#FFCC00;  }
	#pageTitle h2.shadow { color:#000; left:1px; top:1px; z-index: 5; }
	#pageTitle h2.shadow strong { color:#000; }
	
#paddedArea { padding:1.5em; text-align:left; }

.adminTextarea
{
	font-size: Small;
	font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
	height: 80px;
	width: 280px;
}

.adminTextbox
{
	width: 180px;	
}

.adminCombobox
{
	width: 185px;	
}

.adminlistbox
{
	height: 250px;
	width: 200px;	
}

/* ------------------------------------ */
/* ---------  Welcome Page  ----------- */
/* ------------------------------------ */

#welcomePageBlocks { margin: 1em 0; width: 100%; float:left; }
	#welcomePageBlocks a { display:block; width: 200px; float:left; padding:10px; margin: 0 5px 5px 0; white-space:nowrap; font-size:13px; font-weight:bold; text-decoration:none;
							background:url(bg_head_top-repeater.jpg) repeat-x left top; border:1px solid #DDD; overflow:hidden; color: #888; }
	#welcomePageBlocks a:hover { background:url(welcome-page-hovers.jpg) repeat-x left top; text-decoration: none; }					
		#welcomePageBlocks a img  {  }
		#welcomePageBlocks a span { padding: 0 0 0 20px; position:relative; top: -10px; }

/* Login Styles */

div.loginBox
{
	width: 662px;	
	border: none;
	padding: none;
	margin: none;
	font: .8em Tahoma, Verdana, Arial, Helvetica, sans-serif;
}

div.loginBox a
{
	font-weight: bold;
	text-decoration: none;
	color: #31a4fc;
}

div.loginTabs
{
	height: 31px;
	border: none;
	padding: none;
	margin: none;
	background-image: url(Login-Window-TabHeader.gif);
	background-position: left bottom;
	background-repeat: no-repeat;
}

div.loginBoxContent
{
	background-color: #ffffff;
	background-image: url(Login-Window-Background.gif);
	background-position: left top;
	background-repeat: no-repeat;
	border-left: solid 1px #B8B8B8;
	border-right: solid 1px #B8B8B8;
	/* Border-Bottom is a needed HACK */
	border-bottom: solid 1px #ffffff;
	border-top: none;
	padding-top: 10px;
	padding-bottom: 0px;
	padding-left: 35px;
	padding-right: 35px;
	margin: none;
	text-align: left;
}

div.loginFooter
{
	height: 6px;
	border: none;
	padding: none;
	margin: none;
	background-color: Transparent;
}

.loginFailure
{
	color: #ff0000;
	font-weight: bold;
	padding-top: 10px;
	padding-bottom: 10px;
}

.loginTabImage
{
	left: 10px;
	top: 0px;
	position: relative;
}

.loginFooterImage
{
}

.loginInput
{
	font-size: 1.4em; 
	width: 220px;
}

.loginTitle
{
	font-size: 1.4em; 
	font-weight: bold;
	color: #707070;
	text-align: left;
}

.loginInstructions
{
	text-align: left;
	margin-top: 20px;
	margin-bottom: 20px;
	display: block;
	font-size:10pt;
}

#loginContentArea
{
	/* Matches with internal pages Navigation */
	margin-left: auto;
	margin-right:auto;
	width:665px;
	padding-top:40px;
}

/* Footer */

#spacer-above-footer-links
{
	height: 0;
}

/* -- Standard GridViews */

.gridview-body, gridview-header, .gridview-row, .gridview-alt-row, .gridview-edit-row, .gridview-pager-row, .gridview-lnk
{
}

.gridview-body, .radgridview-body
{
	width: 100%;
	background-color: #ffffff;
	border-left: solid 1px #e4e4e4;
	border-top: solid 1px #e4e4e4;
	border-right: solid 1px #a0a0a0;
	border-bottom: solid 1px #a0a0a0;
}

.gridview-body td, .radgridview-body td
{
	padding: 4px;
	margin: 0px;
	text-align: left;
	vertical-align: top;
}

.gridview-header, .radgridview-header
{
	color: #ffffff;
	background-color: #75bad9;
	padding: 0px;
	margin: 0px;
	border-right: solid 1px #6cabc8;
	border-bottom: solid 1px #6cabc8;
	border-left: solid 1px #98cde5;
	border-top: solid 1px #98cde5;
	text-align: left;
}

.gridview-header th, .radgridview-header th
{
	color: #ffffff;
	padding: 4px;
	margin: 0px;
	text-align: left;
	vertical-align: top;
	border-right: solid 1px #6cabc8;
	border-bottom: solid 1px #6cabc8;
	border-left: solid 1px #98cde5;
	border-top: solid 1px #98cde5;
	font-size: 10pt;
	border-collapse: separate;
}

.gridview-header a, .radgridview-header a
{
	color: #ffffff;
    text-decoration: underline;
	font-weight: bold;
}

.gridview-row, .radgridview-item
{
}

.gridview-row, .gridview-alt-row, .gridview-edit-row, .gridview-pager-row, .radgridview-item, .radgridview-alt-item, .radgridview-edit-item
{
	color: #666666;
}

.gridview-alt-row, .radgridview-alt-item
{
	background-color: #eef4f6;
}

.gridview-mouseover-row, .radgridview-mouseover-item
{
	background-color: #e4e4e4;
}

.gridview-edit-row, .radgridview-edit-item
{
	background-color: #e4e4e4;
	border-top: solid 1px #cccccc;
	border-bottom: solid 1px #cccccc;
}

.gridview-pager-row
{
	background-color: #e4e4e4;
	background-image: url('../../images/gridview-pager-background.gif');
	background-repeat: repeat-x;
}

.gridview-pager-row-divider
{
	margin-left: 4px;
	margin-right: 4px;
	vertical-align: middle;
}

.gridview-pager-row select
{
	font-family: Tahoma, Geneva, Arial, Helvetica, sans-serif;
	font-size: 100%;
	margin-left: 4px;
	margin-right: 4px;
	vertical-align: middle;
}

.gridview-pager-row a
{
	color: #666666;
    text-decoration: underline;
}

.gridview-sort-image
{
	margin-left: 4px;
	vertical-align: middle;
	width: 16px;
	height: 16px;
	border: none;
}

/* Other CSS */

#spacer-clear
{
	clear:both;
}

#spacer
{
	height: 1em;
}

.netscape-clear
{
	clear:both;
}

.errortext
{
	color: Red;	
}	

.linkselectorcataminus
{
    background-color: #FFDAA8;
}

.linkselectorcata
{
    background-color: #CED7DB;
}

.linkselectorcataminuslegendlabel
{
    margin-left: 3px;
}

.linkselectorcatalegendlabel
{
    margin-left: 3px;
}

.linkselectorgapbetweenlegends
{
    margin-left: 10px;
}

.affWebsitesGridPromo input
{
    margin-bottom: 1px;
    margin-top: 2px;
}

.affWebsitesGridPromoIE input
{
    margin-bottom: 0px;
    margin-top: -2px;
}

/* Toolbox Palettes Appearance */

.toolboxLabelOuter { margin-top:2em; border: 5px solid #ebebeb; width:40%; white-space:nowrap; border-bottom:0px; position:relative; top: 6px;  }
	.toolboxLabelInner { border:1px solid #CCC;background:url(tool-palette-label-background.jpg) repeat-x left top; padding:10px;
						border-bottom:0; font-size: 130%; color:#238CC5;}

.toolboxOuter { border: 5px solid #ebebeb; clear:both; margin:0; padding:0; }
	.toolboxInner { border:1px solid #CCC; background:url(tool-palette-background.jpg) repeat-x left top; padding:7px; padding-bottom:14px;  }
		.toolboxInner .labels { padding: 5px 1em 5px 2em; text-align:right; font-weight:bold;color:#999; white-space:nowrap; vertical-align:top; }
		.toolboxInner .formFields { width:400px; }
			.toolboxInner .formFields input { width:100%; font-family:Tahoma, Arial, Helvetica, sans-serif; font-size:12px; padding:5px; background:url(field-background.png) no-repeat left top; border:1px solid #CCC; }
			.toolboxInner .formFields textarea { width:100%; font-family:Tahoma, Arial, Helvetica, sans-serif; font-size:12px; padding:5px; background:url(field-background.png) no-repeat left top;  border:1px solid #CCC;}
			#ctl00_Content_btAddAffiliateWebsite { width:12em; background:url(tool-palette-label-background.jpg) repeat-x left top; color:#238CC5; font-weight:bold; }

/* ASP.NET Wizard Control - Used on Link Builder & Website Setup pages */

	.wizard { width:99%; }
		.wizard td { vertical-align:top; }
	.wizard_sideBar { white-space:nowrap; padding: 5px; vertical-align:top; text-align:left; width: 160px; 
								background: url(wizard-sidebar-back.jpg) no-repeat left top; }
		.wizard_sideBar table { width:100%; margin:0; padding:0; }
		.wizard_sideBar a { display:block; padding:5px 0 5px 15px; }
		.wizard_step { padding:10px; }
			.wizard_step label { font-size: 130%; color:#238CC5;  display:block; }
			.wizard_step .radioList { display:block; }
				.wizard_step .radioList input { display:block; width: 2em; float:left; clear: left; }
				.wizard_step .radioList label { display:block; font-size: 100%; color:#333; float:left; }
			.wizard_step .errors {  }
		.wizard_nav  { border-top:1px solid #CCC; }
		  .wizard_nav input 
		  { /* same style as .blue-button */
		    background: #6ec3e2 url(button-back.png) repeat-x left top; 
        font-size:13px; 
        font-weight:bold; 
        color:#FFF;
        font-family:Tahoma, Arial, Helvetica, sans-serif; 
        padding: 0.4em 0.9em; 
        border-top:3px double #b4dfef; 
        border-left:3px double #b4dfef;
        border-bottom:3px double #0079a0; 
        border-right:3px double #0079a0;
        display:inline;
      }

/* SIDEBAR UNDER CONSTRUCTION */

.sideBarContainer
{
	width: 200px;
}

.sideBarHeader
{
	width: 100%;
	background-color: Orange;
}

.sideBarHeader h1
{
	font-size: 36pt;
	color: #f89d6b;
	font-weight: normal;
}

.sideBarFooter
{
	width: 100%;
	background-color: Orange;
}

span.blue-heading {
  background:transparent url(bullet-bubble.gif) no-repeat scroll 0pt 0.2em;
  color:#0A7FB3;
  font-size:1.1em;
  font-weight:bold;
  margin-left:-10px;
  padding-left:11px;
}

input.blue-button {
  background: #6ec3e2 url(button-back.png) repeat-x left top; 
  font-size:13px; 
  font-weight:bold; 
  color:#FFF;
  font-family:Tahoma, Arial, Helvetica, sans-serif; 
  padding: 0.4em 0.9em; 
  border-top:3px double #b4dfef; 
  border-left:3px double #b4dfef;
  border-bottom:3px double #0079a0; 
  border-right:3px double #0079a0;
  display:inline;
}


/* CSS-based Form Layout over a Two Column Table - Mark */
div.formContainer { font-family: Verdana; padding: 4px; border: solid 1px red; }
  div.formRow { text-align: left; padding: 0.25em 0.1em 0 0; }
    div.formRow label { white-space:nowrap; font-weight: bold; margin-right: 2em; }
    div.formRow input, div.formRow select { width: 12em; font-size: 1em; }
  div.formErrorRow { text-align: center; color: #FF0000; padding: 0.2em 0.2em; }

  
/* Alternate Version - More semantically correct version */
/* div.formLayout div { 
	margin: 0 0 0.25ex 0;	clear: left;
}
div.formLayout div.errors { 
	text-align: center; color: #FF0000; padding: 0.2em 0.2em; 
}
div.formLayout div.actions {
	margin-left: 14em; padding-left: 1em;
}  
div.formLayout label { 
	width: 14em; display: block; float: left; font-weight: bold; padding-right: 1em; 
} */
/* .NET renders a radio button list a bit oddly */
div.formLayout span.radioList label, div.formLayout span.radioList input {
	/* font-weight: normal; float: left; */
}

.error {
	color: #FF0000;
}

a.bluelink, a.bluelink:link, a.bluelink:visited 
{
color:#228DC3;
font-family:tahoma;
text-decoration:underline;
}

/* ------------------------------------ */
/*  Messed-up CSS for the sticky FOOTER */
/* ------------------------------------ */

#nonFooter { background: #FFF url(body-bg-with-nav.jpg) repeat-y -10px top; border-left:1px solid #999; border-right:1px solid #999; }
#nonFooter.login { background: #FFF; border-left:1px solid #999; border-right:1px solid #999; }
#Footer { height:16px; padding:8px 10px; background: #e5e5e5 url(footer-background.png) repeat-x left top; margin:-32px 1px 0 1px; text-align:center;
		color: #888; font-size: 11px; overflow:hidden; clear:both;  }
	#Footer a { color:#888; padding:0 10px; text-decoration:none; }
		#Footer a:hover { color:#09F; text-decoration:underline; }

	#aspnetForm { height:100%; min-height:100%; margin:0; padding:0;  }
	#nonFooter{ margin: 0 auto; min-height: 100%; }
	* html #nonFooter { height: 100%; }

	/* The CSS that's required to position the footer */
	html{ height: 100%; }
	body { height: 100%; }
