/* RESET */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
/* 	vertical-align: baseline; */
}

strong {font-weight:bold;}
/* remember to define focus styles! */
:focus {
	outline: 0;
}
body {
	line-height: 1;
	color: black;
	background: white;
}
ol, ul {
	list-style: none;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}
/* end RESET */

/* STRUCTURE */
body{margin:0; padding:0; background: url(../images/common/body-bg.jpg) fixed center;}

#wrapper{margin:0 auto; padding:30px 0 0 0; width:974px; height:100%;}

#headerWrapper{float:left; margin:0; padding:0; width:974px; height:267px;}

	#topNav{float:left; margin:0; padding:0; width:974px; height:20px;}
	
	#header{float:left; margin:0; padding:0; width:974px; height:247px;}
		
		#header.home {background:url(../images/header-backgrounds/home.png) no-repeat top left;}
		
			#logo {float:left; margin:21px 0 0 28px; padding:0; width:216px; height:87px; display:inline; clear:right;  }
			
			#tagline {float:left; margin:0 0 0 319px; padding:0; width:655px; height:132px; display:inline; clear:left;}

#contentWrapper {float:left; margin:0; padding:0 0 40px 0; width:974px; height:100%; background: url(../images/common/content-bg.png) repeat-y top left;}
	
	#navigation{float:left; margin:0; padding:0; width:322px; height:100%;}
	
	#content{float:right; margin:0; padding:0; width:652px; height:100%;}

#footer {float:left; margin:0; padding:0; width:974px; height:48px; position:relative; z-index:0; background: url(../images/common/footer-bg.png) top left no-repeat;}
	
	#footerText {margin:10px 0 0 0;}


/* NAVIGATION */
ul#topNavigation {list-style:none; text-align:right; margin:0 43px 0 0; display:inline; float:right;  }

	#topNavigation li {margin:0; padding:0; display:inline;}
	
	#topNavigation li.divider {font-size:1.6em; color:#FFFFFF;}
	
	#topNavigation li a{color:#111111; text-decoration:none; font-size:1.3em;}
	
	#topNavigation li.login a{color:#FFFFFF; text-decoration:none; font-size:1.3em;}
	
	#topNavigation li a:hover {text-decoration:underline;}
	
/*ul#mainNav {list-style:none; text-align:right; float:right; display:inline; position:relative; margin:18px 90px 0 0;}
	
	#mainNav li { display:block; float:right; padding:0 0 8px 0; width:auto; line-height: normal;}
	
		#mainNav li ul { display:none; height:0; float:right; }
		
		#mainNav li ul li{display:inline; width:auto; float:right; height:auto; background:#00ff00;}
		
		#mainNav li img.roll {display:none;  vertical-align:top; margin:3px 0 0 0;}
			
			#mainNav.about li#about_blendstar img.roll{display:inline; vertical-align:top;}
			
				#mainNav.about li ul#aboutSub { display:block; float:right; height:auto; margin:10px 0 0 0;}
			
			#mainNav.terminals li#terminal_locations img.roll{display:inline; vertical-align:top;}
				
				#mainNav.terminals li ul#terminalsSub { visibility:visible; height: auto;  margin:10px 0 0 0;}
			
			#mainNav.operations li#terminal_operations img.roll{display:inline; vertical-align:top;}
			
			#mainNav.fuels li#renewable_fuels img.roll{display:inline;}
			
			#mainNav.environment li#environment_safety img.roll{display:inline; vertical-align:top;}
			
				#mainNav.environment li ul#environmentSub { visibility:visible; height: auto;  margin:10px 0 0 0;}
			
			#mainNav.news li#news img.roll{display:inline; vertical-align:top;}
			
			#mainNav.industry li#industry_links img.roll{display:inline;}		
			
	#mainNav li a{color:#FFFFFF; text-decoration:none; font-size:1.4em; position:relative; height:20px; vertical-align:top;}
	
	#mainNav li ul li a{color:#cccccc; text-decoration:none; }
	
	#mainNav li ul li a:hover{color:#ffd067; text-decoration:none; }*/
	
	ul#mainNav {list-style:none; text-align:right; float:right; display:inline; position:relative; margin:18px 90px 0 0;}
	
	#mainNav li {padding:0 0 .8em 0; width:auto;}
	
		#mainNav li ul { visibility:hidden; display:none; height:0; }
		
		#mainNav li img.roll {display:none;}
			
			#mainNav.about li#about_blendstar img.roll{display:inline;}
			
				#mainNav.about li ul#aboutSub { visibility:visible; display:inline; height: auto;  margin:10px 0 0 0;}
			
			#mainNav.locations li#terminal_locations img.roll{display:inline;}
				
				#mainNav.locations li ul#terminalsSub { visibility:visible; display:inline; height: auto;  margin:10px 0 0 0;}
			
			#mainNav.operations li#terminal_operations img.roll{display:inline;}
			
			#mainNav.fuels li#renewable_fuels img.roll{display:inline;}
			
			#mainNav.environment li#environment_safety img.roll{display:inline;}
			
				#mainNav.environment li ul#environmentSub { visibility:visible; height: auto;  margin:10px 0 0 0;}
			
			#mainNav.news li#news img.roll, #mainNav.home_page li#home_page img.roll{display:inline;}
			
			#mainNav.industry li#industry_links img.roll{display:inline;}		
			
	#mainNav li a{color:#FFFFFF; text-decoration:none; font-size:1.4em; position:relative;}
	
	#mainNav li ul li a{color:#cccccc; text-decoration:none; }
	
	#mainNav li ul li a:hover{color:#ffd067; text-decoration:none; }
	

	
/* TYPOGRAPHY */
body {font-size:62.5%; font-family: Arial, Helvetica, sans-serif;}

#content h2 {visibility:hidden; height:0;}

#content h4{ font-size:1.8em; font-weight:bold; margin:0 0 0 90px; line-height:2.0em; }
	
	#content h4.first {margin-top:40px; }

#content p {margin:0 0 0 90px;  width:504px; padding:0 0 1.0em 0; font-size:1.3em; line-height:1.4em; color:#111111; }

	#content p strong { font-weight:bold; }

	#content p.first {margin-top:40px; }
	
	#content p a {color:#8cc63f; text-decoration:none;}
	
	#content p a:hover {color:#8cc63f; text-decoration:underline;}
	
#content fieldset legend{ font-size:1.8em; font-weight:bold;margin:0 0 0 0px; line-height:2.0em; }

#content fieldset p {margin-left:0;}

label {padding:0 0 .5em 0; font-size:1.3em; line-height:1.4em; color:#111111;}
#navigation {text-align:right;}

#footer {text-align:center; color:#4B5441;}
	
	#footer p {font-size:.9em; padding:0 0 .5em 0;}
	
	#footer p a {color:#4B5441; text-decoration:underline;}
	
	#footer p a:hover {color:#CCCCCC; text-decoration:underline;}

/* FORMS */
fieldset {margin:0 0 0 90px; width:400px;}

label{display:block;}

#inquiryForm div {padding:0 0 10px 0;}

#inquiryForm div.left {width:180px; float:left;}

#inquiryForm div.right {width:180px; float:left;}

#inquiryForm div#inquiryField {width:400px; float:left;}

	#inquiryForm div#inquiryField textarea {width:335px; height:100px; float:left;}
	
#inquiryForm div#submitField {width:400px; margin:20px 0 0 0;}

/* MAP */
#mapContainer {float:left; margin:40px 0 0 90px; position:relative; height:350px; display:inline;}

	#mapContainer #map {float:left; margin:0; padding:0; position:absolute; z-index:0;}
	
	#mapContainer #locations {float:left; margin:0; padding:0; position:absolute; z-index:1;}
	
		.infoContainer {float:left; position:absolute; margin:0; padding:0; z-index:100; background:none; width:215px; height:auto;}
			
			.infoContainer .top {float:left; margin:0px 0 0 0; padding:0; background-image: url(../images/map/infobgsidecontent.png); background-repeat:repeat-y; height:auto; width:215px;}
			
			.infoContainer .infocontent {float:left; margin:0; padding:0;  background:url(../images/map/infobgsidetop.png) top left no-repeat; height:auto; width:215px;}
			
			.infoContainer .bottom {float:left; margin:-10px 0 0 0; padding:0;background:url(../images/map/infobgsidebot.png) bottom left no-repeat;  height:25px; width:215px;}
			
			/*.infoContainer .side {float:left; position:absolute; margin:0; padding:0; z-index:100; background:none; width:215px; height:auto;}
			
			.infoContainer .topside {float:left; margin:0px 0 0 0; padding:0; background-image: url(../images/map/infobgsidecontent.png); background-repeat:repeat-y; height:auto; width:215px;}
			
			.infoContainer .infocontentside {float:left; margin:0; padding:0;  background:url(../images/map/infobgsidetop.png) top left no-repeat; height:auto; width:215px;}
			
			.infoContainer .bottomside {float:left; margin:-10px 0 0 0; padding:0;background:url(../images/map/infobgsidebot.png) bottom left no-repeat;  height:25px; width:215px;}*/
			
			
			#mapContainer #locations .infoContainer p {float:left; margin:0; padding:0; width:100%; background:#0000ff;}
			/*infoContainers*/
			
			#mapContainer #locations .infoContainer table { margin:15px 0 0 5px; width:190px;}
			
			/*#mapContainer #locations .side table { margin:15px 0 0 5px; width:190px;}*/
			
			#mapContainer #locations .infoContainer div.close {text-align:right; margin:10px 25px 0 0;}
			
			/*#mapContainer #locations .side div.close {text-align:right; margin:10px 25px 0 0;}*/
				
				#mapContainer #locations .infoContainer .close a {color:#8cc63f; text-decoration:none; font-weight:bold;}
				
				#mapContainer #locations .infoContainer .close a:hover {color:#8cc63f; text-decoration:underline; font-weight:bold;}
				
			
			#mapContainer #locations .infoContainer td {padding:0 0 10px 0;}
			
				#mapContainer #locations .infoContainer tr.grey {background:#ccc;}
				
				#mapContainer #locations .infoContainer tr.white {background:#ffffff;}
			
			#mapContainer #locations #oklahomacity .infoContainer {top:107px; left:-70px;}
			
			#mapContainer #locations #tulsa .infoContainer {top:75px; left:-40px;}
			
			#mapContainer #locations #littlerock .infoContainer {top:115px; left:35px;}
			
			#mapContainer #locations #bossier .infoContainer {top:185px; left:15px;}
			
			#mapContainer #locations #collins .infoContainer {top:205px; left:105px;}
	
			#mapContainer #locations #nashville .infoContainer {top:67px; left:148px;}
			
			#mapContainer #locations #birmingham .infoContainer {top:160px; left:175px;}
			
			#mapContainer #locations #louiseville .infoContainer {top:18px; left:175px;}
			
			#mapContainer #locations #knoxville .infoContainer {top:72px; left:225px;}
		/*stars*/
	
		.star {float:left; position:absolute; width:16px; height:16px; cursor:pointer; z-index:50;}
		
			
			#mapContainer #locations #oklahomacity .star {top:122px; left:133px;}
			
			#mapContainer #locations #tulsa .star {top:92px; left:163px;}
			
			#mapContainer #locations #littlerock .star {top:132px; left:238px;}
			
			#mapContainer #locations #bossier .star {top:200px; left:221px;}
			
			#mapContainer #locations #collins .star {top:220px; left:310px;}
			
			#mapContainer #locations #nashville .star {top:83px; left:353px;}
			
			#mapContainer #locations #birmingham .star {top:176px; left:380px;}
			
			#mapContainer #locations #louiseville .star {top:32px; left:381px;}
			
			#mapContainer #locations #knoxville .star {top:89px; left:428px;}

			/*bubbles*/
		.bubble {float:left; position:absolute; width:140px; height:50px; cursor:pointer; z-index:51; background:url('../images/map/bubble.png') top left no-repeat; text-align:center;}
			
			#mapContainer #locations .bubble p {float:left; margin:0; padding:0; width:100%;}
			
				#mapContainer #locations .bubble .text {float:left; margin:5px 0 0 5px; padding:0; width:130px;}
			
			#mapContainer #locations #oklahomacity .bubble {top:75px; left:72px;}
			
			#mapContainer #locations #tulsa .bubble {top:48px; left:102px;}
			
			#mapContainer #locations #littlerock .bubble {top:84px; left:176px;}
			
			#mapContainer #locations #bossier .bubble {top:154px; left:159px;}
			
			#mapContainer #locations #collins .bubble {top:174px; left:248px;}
			
			#mapContainer #locations #nashville .bubble {top:37px; left:291px;}
			
			#mapContainer #locations #birmingham .bubble {top:130px; left:318px;}
			
			#mapContainer #locations #louiseville .bubble {top:-14px; left:319px;}
			
			#mapContainer #locations #knoxville .bubble {top:43px; left:366px;}
			
			
			
			

	

