@charset "utf-8";
/* ########################################################################### *
/* ***** DOCUMENT INFO  ****************************************************** *
/* ########################################################################### *
 * ##### NAME:  global.css
 * ##### VERSION: v1.0
 * ##### UPDATED: 27/10/2008 (Mick Chmielewski - Eclipse Group)
/* ########################################################################### *

/* ########################################################################### *
/* ***** INDEX *************************************************************** *
/* ########################################################################### *
/* ##### GLOBAL & CSS IMPORTS
/* ##### TYPOGRAPHY
/* ##### LAYOUT & GRIDS
/* ##### CONTAINERS
/* ##### OVERLAY GRID
/* ##### CONTENT
/* ##### MODULES
/* ##### POPUPS
/* ##### BUTTONS
/* ##### NAVIGATION
/* ##### SCROLLBARS
/* ##### SITE MAP
/* ##### FAQ
/* ##### ALTERNATE HOMEPAGE
/* ########################################################################### */

/* ########################################################################### *
/* ##### GLOBAL & CSS IMPORTS
/* ########################################################################### */

/* YUI RESET & FONTS */
@import 'ecl_reset-min.css';
@import 'ecl_fonts-min.css';

/* Default Link Style */
a:link 		{ color:#999; text-decoration:none; outline:none }
a:visited	{ color:#999; text-decoration:none; outline:none }
a:focus		{ text-decoration:underline; outline:none }
a:hover		{ text-decoration:underline; outline:none }
a:active	{ color:#999; outline:none }

.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden
}

.nodisplay {
	display: none;
}

.hidden {
	position: absolute;
	left: -9999px;
	overflow: hidden;
	margin-bottom: -1px;
	font-size: 1px;
	line-height: 1px
}

.left {
	text-align: left;
}

.center {
	text-align: center;
}

.right {
	text-align: right;
}

.floatleft {
	float: left;
}

.floatright {
	float: right;
}

.noBorder {
	border: 0 !important;
}

.noHorzScroll {
	overflow-x: hidden;
}

.noHeight {
	height: 0 !important;
}

/* ########################################################################### *
/* ##### TYPOGRAPHY
/* ########################################################################### */


body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td
{
	font-family: Arial, Helvetica, sans-serif;
}

p, h1, h2, h3, h4, h5, h6
{
	margin-bottom: 1em;
}

p
{
	font-size: 1em;
	line-height: 1.5em;
	margin-bottom: 1.5em;	
}

h1 
{
	font-size: 2em;
	line-height: 1.5em;
	margin-bottom: 0.75em;
	color: #000;
}

h2 
{
	font-size: 1.5em;
	line-height: 1em;
	margin-bottom: 1em;	
	color: #000;
}

h3 
{
	font-size: 1.333em;
	line-height: 1.125em;
	margin-bottom: 1.125em;
	color: #000;
}

h4 
{
	font-size: 1.166em;
	line-height: 1.285em;
	margin-bottom: 1.285em;	
	font-weight: bold;
	color: #000;
}

h5 
{
	font-size: 1em;
	line-height: 1.5em;
	margin-bottom: 1.5em;	
	font-weight: bold;
	color: #000;
}

h6 
{
	font-size: 1em;
	line-height: 1.5em;
	margin-bottom: 1.5em;	
	font-weight: bold;
}

strong, 
.strong 
{
	font-weight: bold;
}

em, 
.emphasis 
{
	font-style: italic !important;	
}

.subdued 
{
	color: #666;
}

.highlight 
{
	color: #039;
}

.error 
{
	color: #c90400;
}

.success 
{
	color: #639905;
}

p {
	line-height: 14px;
}

ul li {
	margin: 0 0 0 16px;
}

ol li {
	list-style: decimal;
	margin: 0 0 0 22px;
}

div.clearParagraph p {
	margin: 0px;
}

div.animateContainer {
	margin:0px;
	padding:0px;
}

.flashTitle_Promo{
	height: 55px;
}

.flashTitle{
	height: 30px;
}

/* ########################################################################### *
/* ##### LAYOUT & GRIDS
/* ########################################################################### */

body {
	background-color: #000;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	line-height: 1.5em;
}

	.container {
		position: absolute;
		top: 50%;
		left: 50%;
		margin-top: -300px;
		margin-left: -495px;
		width: 990px;
		height: 600px;
		text-align: left;
	}
	
		.bodyContent {
			position: relative;
		}
		
/* ########################################################################### *
/* ##### CONTAINERS
/* ########################################################################### */
	
.homepage .bodyContent .flashContent,
.careers .bodyContent .flashContent
{
	width: 990px;
	height: 600px;
	outline: none;
}					
	
/* ########################################################################### *
/* ##### OVERLAY GRID
/* ########################################################################### */	

#overlay {
	position: absolute;
}

	.oneColLayout1,
	.twoColLayout1 {
		top: 56px;
		left: 29px;
		width: 761px;
		height: 522px;
	}
	
	.oneColLayout2 {
		top: 56px;
		left: 375px;
		width: 415px;
		height: 522px;
	}
	
	.oneColLayout3 {
		top: 105px;
		left: 0px;
		width: 990px;
		height: 378px;
	}
	
	.oneColLayout4,
	.threeColLayout1 {
		top: 56px;
		left: 29px;
		width: 934px;
		height: 522px;
	}
	
#leftColumn,
#middleColumn,
#rightColumn {
	display: inline;
	float: left;
}

	#overlayInner {
		margin: 15px;
	}
	
		.oneColLayout1 #rightColumn {
			width: 731px;
			height: 442px;
			padding: 0;
		}
		
			.oneColLayout1 #rightColumn .scrollpane {
				width: 731px;
				height: 442px;
				overflow: hidden;
			}
			
		.oneColLayout2 #rightColumn {
			width: 375px;
			height: 492px;
			padding: 0;
		}
		
			.oneColLayout2 #rightColumn .scrollpane {
				width: 375px;
				height: 492px;
				overflow: hidden;
			}
			
		.oneColLayout3 #rightColumn {
			width: 960px;
			height: 318px;
			padding: 0;
		}
		
			.oneColLayout3 #rightColumn .scrollpane {
				width: 960px;
				height: 318px;
				overflow: hidden;
			}
			
				.oneColLayout3 #rightColumn .scrollpane .textLengthLimiter {
					width: 320px;
				}
			
		.oneColLayout4 #rightColumn {
			width: 904px;
			height: 442px;
			padding: 0;
		}
		
			.oneColLayout4 #rightColumn .scrollpane {
				width: 904px;
				height: 442px;
				overflow: hidden;
			}

		.twoColLayout1 #leftColumn {
			width: 295px;
			height: 442px;
			padding: 0 15px 0 0;
		}
		
		.twoColLayout1 #rightColumn {
			width: 421px;
			height: 442px;
			padding: 0;
		}
		
			.twoColLayout1 #rightColumn .scrollpane {
				width: 421px;
				height: 442px;
				overflow: hidden;
			}
			
				.twoColLayout1 #rightColumn .scrollpane .scrollpane {
					width: 400px;
					height: 200px;
					overflow: hidden;
				}
		
		.threeColLayout1 #careersHeader{
			width: 597px;
			float: right; 	
		}
		
			.threeColLayout1 #careersHeader .middleColumn {
				display: inline;
				float: left;
				width: 291px;
				height: 82px;
				padding: 0 15px 0 0;
			}
			
			.threeColLayout1 #careersHeader .rightColumn {
				display: inline;
				float: left;
				width: 291px;
				height: 82px;
				padding: 0;
			}
		
		.threeColLayout1 #leftColumn {
			width: 292px;
			height: 488px;
			padding: 0 15px 0 0;
		}
		
		.threeColLayout1 #middleColumn {
			width: 291px;
			height: 380px;
			padding: 0 15px 0 0;
		}
		
		.threeColLayout1 #rightColumn {
			width: 291px;
			height: 380px;
			padding: 0;
		}
		
			.threeColLayout1 #rightColumn .scrollpane {
				width: 291px;
				height: 382px;
				overflow: hidden;
			}
			
.overlayFooter {
	width: 100%;
	position: absolute;
	bottom: 0px;
	right: 0px;
}

	.overlayFooter .left {
		
		display: inline;
		float: left;
		margin: 10px 15px;
	}	
	
	.overlayFooter .right {
		display: inline;
		float: right;
		margin: 10px 15px;
	}
	
	.oneColLayout1 .overlayFooter .left,
	.oneColLayout2 .overlayFooter .left,
	.twoColLayout1 .overlayFooter .left,
	.threeColLayout1 .overlayFooter .left {
		display: none;
	}
	
	.oneColLayout2 .overlayFooter .right {
		display: none;
	}
	
	.threeColLayout1 .overlayFooter{
		width: 597px;
	}

/* ########################################################################### *
/* ##### CONTENT
/* ########################################################################### */	

.flashTitles{
	outline:none;
}

.contactUs #leftColumn .flashTitles
{
	height: 25px;
}
	
#overlay h1{
	color: inherit;
	font-size: 16px;
	font-weight: bold;
	text-transform: uppercase;
}

#overlay h2,
.alternativeContent h2{
	color: inherit;
	font-size: 12px;
	font-weight: bold;
	margin: 2px 0px;
}

	#overlay #loginBoxes h2 {
		cursor: pointer;
		margin: 0 0 10px 0;
		color: #999;
	}
	
	#overlay .storesHeader h2 {
		margin: 0 0 5px 0;
	}

#overlay h3{
	color: inherit;
	font-size: 11px;
	font-weight: bold;
	margin: 2px 0px;
}

#overlay p{
	color: inherit;
	font-size: 11px;
}

#overlay ul,
#overlay ol {
	margin-bottom: 15px;
}

#overlay #twoColLayout1 #rightColumn .scrollpane .scrollpane h2 {
	margin-top: 0px;
}

#overlay #rightColumn h1,
#overlay #rightColumn h2,
#overlay #rightColumn h3,
#overlay #rightColumn p,
#overlay #rightColumn .module{
	margin-right: 5px;
}

/*#overlay #rightColumn h2{
	margin-top: 20px;
}*/

.actionsHolder{
	margin-top: 12px;
}

	.actionsHolder ul.actions li{
		list-style: none;
	}	
	
	.actionsHolder ul.actions li a{
		font-size: 11px;
		color: inherit;
	}	

ul.articleList li{
	list-style: none outside;
	margin: 0;
	border-top: solid 1px #3F3F3F;
	padding-top: 15px;
}

	#overlay ul.articleList li h2 {
		margin-top: 15px;
	}

.linebreak{
	border-top: solid 1px #3F3F3F;
	padding-top: 15px;
}

table 
{
	margin-bottom: 15px;
	border-collapse: separate;
	width: 100%;
}

	table  thead th 
	{
		border-bottom: 1px solid #3F3F3F;
		padding: 5px 5px 5px 0px;
		font-weight: bold;
	}
	
	table  tbody th,
	table  tbody td 
	{
		border-bottom: 1px solid #3F3F3F;
		padding: 5px 5px 5px 0px;
	}
	
	table tbody th
	{
		font-weight: bold;
	}
		
.newsHeading {
	padding-left: 295px;
}

.newsItem {
	margin-bottom: 10px;
}

	.newsItemImage {
		display: inline;
		float: left;
		width: 280px;
		margin-right: 15px;
	}
	
		.newsItemImage img {
			display: block;
		}
		
	.newsItemText {
		display: inline;
		float: left;
		width: 419px;
	}

		#overlay.oneColLayout1 #rightColumn .newsItemText h2 {
			margin-top: 0;
			border-top: 1px solid #3F3F3F;
			padding: 8px 0 0 0;
		}

.sitemap h2 {
	margin-bottom: 2px;
	border-top: 1px solid #CCC;
	padding: 8px 0 4px 0;
}

	.sitemap h2.first {
		border-top: 0;
		padding: 0 0 4px 0;
	}

.sitemap .column {
	display: inline;
	float: left;
	margin-left: 11px;
	width: 93px;
}

.sitemap .smartedit .column {
	width: 170px;

}

.sitemap .first {
	margin-left: 0;
}

	#overlay .sitemap .column ul {
		margin-bottom: 2em;
	}

		.sitemap .column ul li {
			list-style-position: outside;
			list-style-type: none;
			list-style-image: none;
			margin: 0;
		}

.storesHeader {
	display: none;
	margin-bottom: 15px; 
	border-bottom: 1px solid #3F3F3F;
	padding-bottom: 10px;
}

	.storesHeader .storesSearch,
	.storesHeader .sectionsFilter {
		display: inline;
		float: left;
		width: 200px;
	}
	
.storesContainer {
	display: none;
}

.storeLocation {
	display: none;
}

ol.storesList li {
	list-style-type: none;
	margin: 0 0 15px 0;
	border-bottom: 1px solid #3F3F3F;
}

	ol.storesList .storeHeader h2 {
		display: inline;
		float: left;
	}
	
	ol.storesList .storeHeader a {
		display: inline;
		float: right;
	}

	ol.storesList ul.sections li {
		display: inline;
		border-bottom: 0;
	}
	
	ol.storesList .vcard,
	ol.storesList .openHours {
		display: inline;
		float: left;
		padding: 0 10px 15px 0;
		width: 190px;
	}
	
	ol.storesList .openHours {
		padding-right: 0;
		width: 200px;
	}
	
		ol.storesList .vcard p,
		ol.storesList .openHours p {
			margin-bottom: 0;
		}
	
		ol.storesList .openHours table {
			border: 0;
			padding: 0;
			width: auto;
		}
	
			ol.storesList .openHours table td {
				border: 0;
				padding: 0 10px 0 0;
			}
	
		ol.storesList .vcard .adr .org {
			display: none;
		}
		
	ol.storesList .storeMap {
		display: none;
		width: 400px;
		height: 180px;
		margin-bottom: 10px;
	}
	
		ol.storesList .storeMap img {
			display: block;
		}

.ctrlHolder ul.checklist li{
	list-style: none !important;
	list-style-image: none !important;
}

/* ########################################################################### *
/* ##### MODULES
/* ########################################################################### */	

.module
{
	margin: 10px 0px 15px 0px;
}

	.module .moduleContent
	{
		/*color: #000;
		background: #FFF;*/
		border-bottom: 1px solid #3F3F3F;
		padding: 0 0 15px 0;
		margin: 10px 0 0 0;
	}
	
	.modulesContainer .module .moduleContent {
		border-bottom-width: 0;
		padding: 0;
	}

#leftColumn .module{
	width: 242px;
}

/* ########################################################################### *
/* ##### POPUPS
/* ########################################################################### */

#popup{
	padding: 15px;
}

#popupFooter{
	position: absolute;
	bottom: 0px;
	right: 0px;
	margin: 10px 15px;
}

#popupFooter .close_white{
	display: none;
}

/* ########################################################################### *
/* ##### BUTTONS
/* ########################################################################### */

a.btn {
	color: #000;
	background-color:#FFF;
	font-weight: bold;
	font-size: 11px;
	padding: 3px 4px;
	outline: none;
}

a.btn:link,
a.btn:visited {
	text-decoration: none;
}

button:hover,
button:focus,
button:active,
a.btn:hover,
a.btn:focus,
a.btn:active {
	color: #FFF;
	background-color:#3F3F3F;
	text-decoration: none;
	outline: none;
	border: none;
}

button {
	font: inherit;
	color: #FFFFFF;
	background-color:#3F3F3F;
	font-weight: bold;
	font-size: 11px;
	padding: 2px;
	outline: none;
	border: none;
	cursor: pointer;
}

input.btn {
	font-weight: bold;
	font-size: 11px;
	border: none;
	padding: 2px;
	outline: none;
	cursor: pointer;
}

input.btn:hover, 
input.btn:focus,
input.btn:active {
	outline: none;
	color: #FFF !important;
	background-color: #3F3F3F !important;
}

/* ########################################################################### *
/* ##### NAVIGATION
/* ########################################################################### */

#subNav {
	margin-bottom: 15px;
}

#subNav li {
	list-style: none outside;
	margin: 0;
}

	#subNav li a {
		color: inherit;
		font-size: 16px;
		font-weight: bold;
		text-decoration: none;
		text-transform: uppercase;
	}
	
	#subNav li a:hover,
	#subNav li a:active,
	#subNav li a:focus {
		color: inherit;
		text-decoration: underline;
	}

	ul#subNav li span
	{
		display:block;
	}	

	
		#subNav ul {
			margin: 0 0 0 10px;
		}
		
			#subNav ul ul {
				margin: 0 0 0 20px;
			}

	
	/* Used by Michael Sangorgio in place of flash nav on cardholder page */
	#subNav li input
	{
		display: block;
		float: left;
		width: auto;
		height: 20px;
		overflow: visible;
		margin: 0;
		border: 0;
		padding: 0;
		background-color: transparent;
		font-size: 16px;
		font-weight: bold;
		text-transform: uppercase;
		color: #fff;
		cursor: pointer;
	}
	
/* ########################################################################### *
/* ##### SCROLLBARS
/* ########################################################################### */

.jScrollPaneContainer {
	position: relative;
	overflow: hidden;
	z-index: 1;
}

.jScrollPaneTrack {
	position: absolute;
	cursor: pointer;
	right: 0;
	top: 0;
	height: 100%;
}
.jScrollPaneDrag {
	position: absolute;
	cursor: pointer;
	overflow: hidden;
}

.jScrollPaneDragTop {
	position: absolute;
	top: 0;
	left: 0;
	overflow: hidden;
}
.jScrollPaneDragBottom {
	position: absolute;
	bottom: 0;
	left: 0;
	overflow: hidden;
}
a.jScrollArrowUp {
	display: block;
	position: absolute;
	z-index: 1;
	top: 0;
	right: 0;
	text-indent: -2000px;
	overflow: hidden;
	/*background-color: #666;*/
	height: 9px;
}
a.jScrollArrowUp:hover {
	/*background-color: #f60;*/
}

a.jScrollArrowDown {
	display: block;
	position: absolute;
	z-index: 1;
	bottom: 0;
	right: 0;
	text-indent: -2000px;
	overflow: hidden;
	/*background-color: #666;*/
	height: 9px;
}
a.jScrollArrowDown:hover {
	/*background-color: #f60;*/
}
a.jScrollActiveArrowButton, a.jScrollActiveArrowButton:hover {
	/*background-color: #f00;*/
}

/* ########################################################################### *
/* ##### FAQ
/* ########################################################################### */
	
ul#faq{
	margin: 0 0 20px 0;
}

	ul#faq li{
		margin: 0 0 2px 0;
		list-style: none outside;
	}
	
		ul#faq li a{
			color: inherit;
			font-weight: bold;
		}

#faqAnswers li{
	padding-top: 0px;
	margin-bottom: 15px;	
}

	#faqAnswers li p.last{
		margin-bottom: 10px;	
	}
	
	#faqAnswers li a{
		color: inherit;
	}


/* ########################################################################### *
/* ##### ALTERNATE HOMEPAGE
/* ########################################################################### */

.alternativeContent{
	width: 315px;
	height: 300px;
	position: absolute;
	left: 338px;
	top: 250px;
}