/* ----------
Gulf Oil L.P.
Author: GLAD WORKS [http://www.gladworks.com/]
last updated: 1/2007
---------- */

/* reset some default styling */
* { margin:0; padding:0; }
h1, h2, h3, h4, h5, h6, p, pre, blockquote, 
form, ul, ol, dl, fieldset, table { margin:1em 0; text-align:left; }
li, blockquote { margin-left:1.8em; }
:focus { outline: 0; }
/*headers*/
h1, h2, h3, h4, h5, h6 {
	color:#055AA0;
	font-family:"Times New Roman", Times, serif;
	font-style:italic; 
	letter-spacing:1px;
	line-height:normal;
	margin-bottom:0; }
h1 {
  font-size:2.8em;
  margin-bottom:.5em;
  margin-top:0; }
h2 {
  font-size:2.2em; }
h3 {
  font-size:1.5em; }
h4, h5, h6 {
  font-size:1.2em; }
/*links*/
a img {
  border:none; }
a:link, a:visited {
  color:#035091; }
a:hover, #home #footer a:hover {
  color:#8f4300; }
#footer a:hover {
  color:#ffd9bf; }
/*lists */
dt {
  font-weight:bold; }
dd {
  margin-bottom:.5em; }
ul.simple li {
  list-style-type:none;
  margin:0; }
ul ul {
  margin-top:0; }
/*tables*/
table { 
	border-collapse:collapse;
	margin-top:0; }
	caption {
		font-weight:bold;
		padding-bottom:0.5em;
		text-align:center; }
	td, th {
		border:1px solid #0ca53b;
		padding:.2em .5em; }
	tr {
		background-color:#fff; }
	thead tr, tfoot tr, tr.even {
		background-color:#e0efe4; }
	
/* =CLASSES ------------ */	
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.clearfix { display:inline-block; } /*this trips hasLayout for ie7*/
.clearfix { display:block; } 
.clear { clear:both;}
.structureLabel {
	left:-5000em;
	overflow:hidden;
	position:absolute;
	top:-5000em; }
.external {
	background:url(../layout/external_white.gif) no-repeat right center;
  padding-right:10px; }
.pdf, .doc, .ppt {
  background-position:100% 50%;
	background-repeat:no-repeat;
  padding-right:14px; }
.pdf {
  background-image:url(../layout/icon_pdf.gif); }
.doc {
  background-image:url(../layout/icon_msword.gif); }
.ppt {
  background-image:url(../layout/icon_msppt.gif); }
.floatright {
  float:right; }
.floatleft {
  float:left; }

.vcard {}
  .vcard .org, .vcard .street-address {
    display:block; }
  .vcard.alt * {
    display:inline; }
    
.callout {
  background-color:#015da0; 
  border:1px solid #6699FF; 
  color:#FFFFFF;
  padding:10px; }
  .callout a:link, .callout a:visited {
    color: #fff; }
  .callout a:hover {
    color: #ECBB98; }    

.footnote {
	font-size: 0.88em;
}


/* =STRUCTURE ------------ */
html, html body {
  background:#6699CC url(../layout/bg.gif) repeat-x 0 0; }	
body {
  color:#000;
  font:76% Arial, Helvetica, sans-serif;
	padding-top:1px; /*prevents margin collapsing*/	
	margin:0 1em; }
	
#container {
  background:transparent url(../layout/header01.jpg) no-repeat 0 0;
  margin:0 auto;
  padding-top:275px;
  /*padding-top = height of header image + height of nav + 5px space between the two*/
  position:relative;
  width:745px; }
  
body#news-override #container {
  background-image:url(../layout/header-override.jpg); }

body#about #container,
body#downloads #container {
  background-image:url(../layout/header02.jpg); }
body#stationLocator #container {
  background-image:url(../layout/header01.jpg); }
body#promotions #container {
  background-image:url(../layout/header03.jpg); }

body#promotions-gulf-truck #container {
  background-image:url(../layout/header-gulf-truck.jpg); }

body#creditcards #container {
  background-image:url(../layout/header06.jpg); }
body#distribution #container {
  background-image:url(../layout/header04.jpg); }
body#products #container {
  background-image:url(../layout/header05.jpg); }

#home #container {
	background-image:url(../layout/home-backdrop.jpg);
	padding-top:400px;
	width:784px; }
	
#content { 
	background:#fff url(../layout/content-bg.jpg) repeat-y 0 0;
	line-height:1.6;
	margin:0 14px 0 13px;
	padding:28px; }
	
#footer { 
	background:transparent url(../layout/content-bottom.jpg) no-repeat 13px 0;
	color:#E5EEF6;
	font-size:.9em; 
	margin-bottom:1.5em;
	margin-top:-13px;
	padding-top:30px;
	text-align:center; }
#home #footer { 
	background:none;
	color:#6197C2;
  position:absolute;
  top:412px;
  width:100%; }

/* =images */
#content img {
	border:4px solid white; }
img.floatright {
	margin:0 0 1em 1em; }
img.floatleft {
	margin:0 1em 1em 0; }

/* =Navigation ------------ */

#homelink { /*large gulf logo in header*/
	height:213px;
	left:16px;
  position:absolute;
  text-indent:-999em;
	top:6px;
	width:229px; 
}

#hp-promo-link {
	display: block;
	position: absolute;
	top: 136px;
	left: 488px;
	margin: 0;
	padding: 0;
	width: 268px;
	height: 240px;
}

#hp-promo-link a {
	display: block;
	margin: 0;
	padding: 0;
	width: 268px;
	height: 240px;
	text-indent: -9999px;
}

#udm {	
	height:29px;	
	margin:0;		
	top:246px; 
}	
#home #udm {
	margin:0 20px 25px 20px;	
	top:389px;
	width:744px; 
}
  
  .navButton, .navButton:visited {
    height:29px;
    overflow:hidden; 
  }  
    .navButton span, .navButton:visited span {
		  display:block;
			background:#fff url(../layout/nav-t.gif) no-repeat 0 0;
			height:29px;
      left:0;
      position:absolute;
      top:0;
			width:100%; 
      z-index:1;      
    }

  #n1, #n1btn, #n1btn:visited {
    width:110px;
  }
    #n1btn:hover span, #n1btn:visited:hover span, 
    #about #n1btn span, #about #n1btn:visited span {
      background-position:0 -29px;
    }    
  #n2, #n2btn, #n2btn:visited {    
    width:75px;
  }
    #n2btn span, #n2btn:visited span {
      background-position:-110px 0;
    }
    #n2btn:hover span, #n2btn:visited:hover span,
    #products #n2btn span, #products #n2btn:visited span {
      background-position:-110px -29px;
    }  
  #n3, #n3btn, #n3btn:visited {    
    width:91px;
  }
    #n3btn span, #n3btn:visited span {
      background-position:-185px 0;
    }
    #n3btn:hover span, #n3btn:visited:hover span,
    #promotions #n3btn span, #promotions #n3btn:visited span {
      background-position:-185px -29px;
    } 
  #n4, #n4btn, #n4btn:visited {    
    width:125px;
  }
    #n4btn span, #n4btn:visited span {
      background-position:-276px 0;
    }
    #n4btn:hover span, #n4btn:visited:hover span,
    #creditcards #n4btn span, #creditcards #n4btn:visited span {
      background-position:-276px -29px;
    }  
  #n5, #n5btn, #n5btn:visited {    
    width:139px;
  }
    #n5btn span, #n5btn:visited span {
      background-position:-401px 0;
    }
    #n5btn:hover span, #n5btn:visited:hover span,
    #distribution #n5btn span, #distribution #n5btn:visited span {
      background-position:-401px -29px;
    }  
  #n6, #n6btn, #n6btn:visited {    
    width:112px;
  }
    #n6btn span, #n6btn:visited span {
      background-position:-540px 0;
    }
    #n6btn:hover span, #n6btn:visited:hover span,
    #stationlocator #n6btn span, #stationlocator #n6btn:visited span {
      background-position:-540px -29px;
    }  
  #n7, #n7btn, #n7btn:visited {    
    width:92px;
  }
    #n7btn span, #n7btn:visited span {
      background-position:-652px 0;
    }
    #n7btn:hover span, #n7btn:visited:hover span,
    #downloads #n7btn span, #downloads #n7btn:visited span {
      background-position:-652px -29px;
    }  
  
  /*styles to customize the udm dropdown*/  
  #udm ul {
  	border-left: 3px solid #E5EEF7;
  	border-top: 3px solid #E5EEF7;
  }
    #udm ul li a {
    	border-right: 3px solid #E5EEF7;
    	border-bottom: 1px solid #E5EEF7;
    }
    #udm ul li.last a {
    	background: transparent url(../layout/submenu-bottom.gif) no-repeat 100% 100%;
    	border-bottom: none;
    	border-right: none;
      /*line-height: 175%; created a weird space in IE*/
    }
    #udm ul li.last a:hover {
    	background-image: url(../layout/submenu-bottom-hover.gif);
    }                     
       
							
/* =login/search ------------ */
#nav2 {
	line-height:1.8;
	list-style-type:none;
	margin:0;
	position:absolute;
	right:20px;
	text-align:right;
	top:12px;
	width:18em; }
#home #nav2 {
	top:30px; }	
	
	#mlogin:link, #mlogin:visited {
		font-weight:bold; 
		text-decoration:none;
    text-transform:uppercase; }	
	/*search form*/
	#nav2 form#search {
		margin:0; 
		overflow:hidden;
		text-align:right; }
		#search input { 
			font-size:0.9em; }
		#search label {
			position:absolute; 
			left:-1000em; }
		input#fm-search {
			border:1px solid #4E8DBF;
			color:#0060A3;
			padding:2px;
			width:10em; }
		input#search-btn {
			background-color:#D5711C;
			border:1px solid #E6AC7A;
			border-right-color:#7A2E07;
			border-bottom-color:#7A2E07;
			color:#fff;
			padding:1px; }	
				
#members a.ad:link img, #members a.ad:visited img {
	border-width: 1px;
	border-color: #6699CC;
}				
	
/* =Footer ---------------- */
#footer {
  position: relative;
}
  #footer p {
		position: relative;
		z-index: 10;
  	display:inline; }
  	#footer span {
  		padding-right:4px; }
  	#footer a {
  		color:#E5EEF6;		
  		padding:0 4px;
  		text-decoration:none; }
  	#home #footer a {
  		color:#6197C2; }
    
  #mlogin-logo {
    display:block;
    position:absolute;
    right:15px;
    top:30px;
  }

	#announcement-block {
		display: block;
		margin: 0;
		padding: 0;
		width: 310px;
		height: 136px;
		background: url(../layout/dealer-announcement.png) 0 0 no-repeat;
		position: absolute;
		top: 242px;
		left: 30px;
		z-index: 10000;
	}

	a#dealer-interest{
		display: block;
		margin: 0;
		padding: 0;
		width: 268px;
		height: 62px;
		position: absolute;
		top: 266px;
		left: 50px;
		z-index: 10100;
		outline: none;
		text-indent: -9999px;
	}




/* =Forms ----------------- */
fieldset {
	border:0; }
	fieldset fieldset {
		margin:0; }
	p.legend {
		font-weight:bold; }
	label, .label {
		display:block;
		font-weight:bold;
		margin-bottom:0; }
		label.required { 
			color:red; }
.group label {
	font-weight:normal; }
input:focus, textarea:focus, select:focus { 
	background-color:#FAC49F; }

input {
  padding:2px; }

form div {
  margin:.5em 0; }

form .submitRow {
  margin-top:1em; }
  form .submitRow input {
    padding:3px; }
  form .submitRow a {
    padding-left:1em; }

.error {
  color:red;
  font-weight:bold; }
.instruction {
  font-weight:bold; }  


/* =homepage promomotions */
#promo {
	height:252px;
	left:272px;
	position:absolute;
	top:131px;
	width:492px;
	text-align: right;
}
/*
	#promo a {
		display:block;
		height:100%;
		width:100%; }
*/	
/* other items */
.moreItems li { 
	list-style-type:none;
	margin:.5em 0;
	padding:5px; }
	.moreItems span a {
		font-weight:bold;
		font-size:1.3em;
		text-decoration:none; }
	.moreItems p {
    margin:.5em 0 0 0; }
	
/* =Promotions page */
.promotion {
  margin:2em 0; }
  .promotion p, .promotion h2, .promotion ul {
    margin-left:176px;
    margin-top:0; }
  .promotion .ad {
    display:block;
    float:left;
    margin:0 0 1em 0; }
	a.ad img {
	  display:block; }
  #content .promotion img {
    border: none;
    margin:0; }
  .promotion span {
    font-weight:bold; }
  .promotion p a {
    float:none; }

/* =credit cards page */
#creditcards .promotion p,
#creditcards .promotion h2 {
  margin-left:156px; }
#creditcards .promotion h2 {
  margin-bottom:.5em; }

/* =station locator page */
#stationlocator .station_address {
  float:left;
  width:50%; }

/* =GulfMobile page */
#photoswrapper {
  width:auto;
  text-align:center; }

#photoswrapper img {
  border:5px solid #FFFFFF; }
  
/* =news page */
#news dt {
  font-size: 1.2em; }
  #news dt a {
    text-decoration: none; }
#news .meta {
  font-weight: bold; }
#news .date {
  font-size: .9em;
  font-style: italic; }  
#news .tagline {
  display: block;
  font-weight: bold;
  text-align: center; }  


/* =sIFR ---------- */
.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; }
.sIFR-flash + div[adblocktab=true] { display: none !important; }
/* decoy styles */
.sIFR-hasFlash #content h1 {
	visibility: hidden;
	letter-spacing: -9px;	
	font-size: 35px;
	margin-bottom:0; }
	
/* gulfGraphicImageStandards - thumbs, lightbox */

.thumbContainer {
	background-color:#fff;
	margin-top:10px;
  overflow: hidden;
	text-align:center;  
}
.thumbRow {
 	margin:20px 0;
	overflow: hidden;
	width:100%;
}
.thumb {
	float:left;	
	padding:15px auto;
	width:220px;
}
.thumb img {
	vertical-align:middle;
	border:none !important;
}
.no-border img { border:none;}	

/* Lightbox 2 */
#lightbox{
	position: absolute;
	left: 0;
	width: 100%;
	z-index: 100;
	text-align: center;
	line-height: 0;
}
#lightbox a img{ border: none; }
#outerImageContainer{
	position: relative;
	background-color: #fff;
	width: 250px;
	height: 250px;
	margin: 0 auto;
}
#imageContainer{
	padding: 10px;
}

#loading{
	position: absolute;
	top: 40%;
	left: 0%;
	height: 25%;
	width: 100%;
	text-align: center;
	line-height: 0;
}
#hoverNav{
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 10;
}
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}
#prevLink, #nextLink{
	width: 49%;
	height: 100%;
	background: transparent url(/assets/js/lightbox2/blank.gif) no-repeat; /* Trick IE into showing hover */
	display: block;
}
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(/assets/js/lightbox2/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(/assets/js/lightbox2/nextlabel.gif) right 15% no-repeat; }
#imageDataContainer{
	font: 10px Verdana, Helvetica, sans-serif;
	background-color: #fff;
	margin: 0 auto;
	line-height: 1.4em;
	overflow: auto;
	width: 100%	
}
#imageData{	padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em;	}	
#overlay{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 90;
	width: 100%;
	height: 500px;
	background-color: #000;
} 
/* End Lightbox CSS */

/* MISC STYLES */
.secTitle {
	font-size: 1.48em;
	font-weight: bold;
	font-style: italic;
}

.textbig2 {
	font-size: 1.18em;
}

.gulfLife {
	font-family: georgia;
	font-weight: bold;
	font-style: italic;
	color: #ff923a;
}

.gulfTag {
	font-weight: bold;
	color: #056099;
}

.img_l {
	float: left;
	margin: 10px 20px 8px 0;
	padding: 0;
}

.img_r {
	float: right;
	margin: 10px 0 8px 10px;
	padding: 0;
}

.img_c {
	display: block;
	margin: 0 auto 10px auto;
	padding: 0;
}

.icon_l {
	float: left;
	padding: 0 10px 8px 0;
}

.icon_r {
	float: right;
	padding: 0 0 8px 20px;
}

.no-top-margin {
	margin-top: 0;
}

/* GULF TRUCK PROMO PAGE */
#gulf-truck-locations div.location-list {
	display: block;
	margin: 10px 0 0 0;
	padding: 0;
	width: 660px;
}

#gulf-truck-locations div.location-list div.location {
	float: left;
	display: block;
	margin: 0 0 20px 0;
	padding: 0;
	width: 220px;
}

#gulf-truck-locations div.location-list div.location div.name {
	font-weight: bold;
}


/* GULF OVERRIDE PROMO PAGE */
#content h1.override {
	display: block;
	margin: 0;
}

#content div.flashblock {
	float: right;
	display: block;
	margin: -22px 0 0 0;
	padding: 0;
	width: 250px;
	height: 90px;
}

div.coming-soon-r {
	float: right;
	display: block;
	margin: -32px 0 0 5px;
	padding: 0;
	width: 100px;
	height: 77px;
	background: url(../layout/coming_soon_r_v2.gif) 0 0 no-repeat;
	text-indent: -9999px;
	position: relative;
	z-index: 1000;
}

span.pink {
	color:#ff0066;
	font-style: italic;
	text-decoration: none;  
}

.new-r {
	display: block;
	background: url('../layout/new_swack_r.png') 98% 0 no-repeat;
	padding-right: 60px;
}

.new-l {
	display: block;
	background: url('../layout/new_swack_l.png') 0 0 no-repeat;
	padding-left: 60px;
}