@charset "UTF-8";
/* CSS Document */


.printonly {
	display: none;
}


/******************************* Main Layout *******************************/

body  {
	font-family:"Lucida Grande", Verdana, Arial;
	font-size:12px;
	background: rgb(8,109,4);
	background-image:url(../images/bodybknd.jpg);
	background-position:top;
	background-repeat:repeat-x;
	margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
	padding: 0;
	text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
	color: #666;
}

img {
	border: none;
}

h1, h2, h3, h4, p, ul, li {
	margin: 0;
	padding: 0;
}

h1, h2, h3 {
	font-family: Arial, Helvetica, sans-serif;
}

a {
	color: rgb(8,109,4);
	text-decoration: none;
	border-bottom: 1px solid rgb(185,211,110);
}

a:visited {
	color: #666;
	text-decoration: none;
	border-bottom: 1px solid rgb(185,211,110);
}

a:hover, a:visited:hover {
	color: rgb(185,211,110);
	text-decoration: none;
	border-bottom: 1px solid rgb(185,211,110);
	cursor:pointer;
}

.hwrt #container { 
	width: 890px;  /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */
	background: #FFF;
	margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
	border: none;
	text-align: left; /* this overrides the text-align: center on the body element. */
	padding: 0;
} 
.hwrt #header { 
	
	margin: 0;
	padding: 0;
	width: 890px;
	height: 225px;
	overflow: hidden;
} 

.hwrt #header a.bigHWRTlogo {
	display:block;
	overflow:hidden;
	width: 160px;
	height: 70px;
	background-image:url(../images/hwrtbiglogo-plus-hov.jpg);
	background-position:bottom;
	background-repeat:no-repeat;
	float: left;
	position: relative;
	top: 130px;
	left: 685px;
	border: none;
}

.hwrt #header a.bigHWRTlogo:hover {
	background-position: top;
}

.hwrt #header .smallHWRTlogo {
	width: 132px;
	height: 25px;
	float: left;
	position: relative;
	top: 5px;
	left: -125px;
	border: none;
}

.hwrt #header .phonenumber {
	float: left;
	position: relative;
	top: 10px;
	left: -115px;
	font-size: 90%;
}

.hwrt #header .slogan {
	float: right;
	position: relative;
	top: 10px;
	right: 42px;
	font-size: 90%;
}

#centerArea {
	margin: 0;
	padding: 0;
	width: 890px;
	background-image:url(../images/centerbknd.jpg);
	background-position:top;
	background-repeat: repeat-y;
	overflow:auto;
}

#centerArea2 {
	margin: 0;
	padding: 0;
	width: 890px;
	background-image:url(../images/centerbkndtop.jpg);
	background-position:top;
	background-repeat: no-repeat;
	overflow:auto;
}

.hwrt #sidebar {
	float: right; /* since this element is floated, a width must be given */
	width: 265px; /* the actual width of this div, in standards-compliant browsers, or standards mode in Internet Explorer will include the padding and border in addition to the width */
	margin: 0;
	padding: 0;
}

.hwrt #main {
	float: right; /* since this element is floated, a width must be given */
	width: 560px;
	min-height: 575px;
	margin: 0 65px 0 0; /* the left margin on this div element creates the column down the left side of the page - no matter how much content the sidebar div contains, the column space will remain. You can remove this margin if you want the #main div's text to fill the #sidebar space when the content in #sidebar ends. */
	padding: 0 0 75px 0;
}

.hwrt #footer { 
	margin: 0;
	padding: 0; /* this padding matches the left alignment of the elements in the divs that appear above it. */
	background-image: url(../images/footerbknd.jpg);
	background-position:top;
	background-repeat:no-repeat;
	width: 890px;
	height: 100px;
} 

.clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}



/******************************* Styles for Main Area *******************************/


.hwrt #main h1 {
	color: rgb(8,109,4);
	line-height: 1.2em;
	padding-top: 16px;
}

.hwrt #main h2 {
	color: rgb(8,109,4);
	line-height: 1.25em;
	margin-top: 1.5em;
}

.hwrt #main h3 {
	color: rgb(8,109,4);
	line-height: 1.25em;
	margin-top: 1.5em;
}

.hwrt #main p {
	margin-top: 1em;
	line-height: 1.3em;
}

.hwrt #main ul {
	margin-left: 2.5em;
	line-height: 1em;
}

.hwrt #main li {
	margin-top: .5em;
}

.hwrt #main .divider {
	width: 100%;
	height: 1px;
	display: block;
	clear: both;
}

.floatright {
	float: right;
	margin: 5px 0 10px 15px;
}

.floatleft {
	float: left;
	margin: 5px 15px 10px 0;
}

.floatright img, .floatleft img, .caption img {
	margin: 0;
	padding: 0;
	border: 0;
}

.caption {
	width: 300px;
	background-color: rgb(235,245,200);
}

.caption p {
	margin: 0 10px 15px 10px;
	line-height: 1em;
	font-size: 85%;
	font-style: italic;
	color: #000;
}

.hwrt #main .backto p {
	line-height: 1em;
	padding-top: 15px;
}

.hwrt #main .backto a {
	color: rgb(8,109,4);
	text-decoration: none;
	border-bottom: 1px solid rgb(185,211,110);
}

.hwrt #main .backto a:hover {
	color: rgb(185,211,110);
	text-decoration: none;
	border-bottom: 1px solid rgb(185,211,110);
	cursor:pointer;}

.hwrt #main .backto a span{
	display: block;
	float: left;
	vertical-align:baseline;
	margin-top: 4px;
	margin-right: 2px;
	width: 9px;
	height: 9px;
	background-image: url(../images/backarrow-dkgreen.gif);
	background-repeat: no-repeat;
	background-position: top;
	overflow: hidden;
	padding-right: 5px;
}

.hwrt #main .backto a:hover span{
	display: block;
	float: left;
	vertical-align:baseline;
	width: 9px;
	height: 9px;
	background-image: url(../images/backarrow-ltgreen.gif);
	background-repeat: no-repeat;
	background-position: top;
	overflow: hidden;
	padding-right: 5px;
}


/******************************* Styles for Sidebar *******************************/


.hwrt #sidebar h1, .hwrt #sidebar h2, .hwrt #sidebar h3, .hwrt #sidebar h4, .hwrt #sidebar p {
	color: rgb(8,109,4);
	margin-left: 55px;
	width: 180px;
}

.hwrt #sidebar .companyinfo {
	margin-top: 4em;
}

#sidebar .colorbox {
	background-color: rgb(235,245,200);
	margin: 20px 0 0 50px;
	width: 175px;
	border: 1px solid rgb(8,109,4);
}

#sidebar .colorbox p {
	margin: .5em 0 .5em 5px;
	padding-top: 10px;
	width: 170px;
}


#sidebar a.button {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	line-height: 1.5em;
	color: #333333;
	float: right;
	margin: 3px 38px 0 0;
	padding: 5px;
	border: none;
	display: block;
	text-transform: uppercase;
	background-color: #FFF;
}

#sidebar a.button:focus {
	color: rgb(8,109,4);
	border: none;
}

#sidebar a.button:hover {
	color: rgb(8,109,4);
	background-color: rgb(185,211,110);
	border: none;
	cursor: pointer;
}

/******************************* Styles for Footer *******************************/



.hwrt #footer .copyright {
	margin: 0;
	padding: 0;
	float: right;
	color: #FFF;
}

.hwrt #footer .footernav { 
	font-size: 90%;
	width: 800px;
	display: block;
	float: left;
	position: relative;
	top: 21px;
	left: 45px;
	color: #FFF;
}

.hwrt #footer .footernav a {
	color: rgb(8,109,4);
	text-decoration: none;
}

.hwrt #footer .footernav a:hover {
	text-decoration: none;
	border-bottom: 1px solid rgb(8,109,4);
}

.hwrt #footer .sitecredit {
	width: 890px;
	display: block;
	text-align: center;
	position: relative;
	top: 50px;
}

.hwrt #footer .siteby {
	text-align: center;
	border: none;
}




/******************************* Navigation Menu *******************************/



/*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */

.slidedoormenu{
position:relative;
left: 25px;
list-style-type: none;
margin: 0;
padding: 0;
width: 200px; /* width of menu (don't forget to add border with below!) */
border-top: 2px solid #FFF; 
}

.slidedoormenu li{
list-style-type: none;
border-bottom: 2px solid #FFF; 
text-transform: uppercase;
border-top: none; 
}

.slidedoormenu li a {
background: white url(../images/nav-bknd.jpg) repeat-y left top; /* Background image positioned to the left(v) top(h) corner initially */
	font-family:"Lucida Grande", Verdana, Arial;
	font-size:12px;
display: block;
color: #FFF;
width: auto;
padding: 8px 0; /* Vertical (top/bottom) padding for each menu link */
text-indent: 13px;
text-decoration: none;
border-left: 10px solid rgb(8,109,4); /* thick left border of menu */
border-bottom: none;
}

.slidedoormenu li a:visited, .slidedoormenu li a:active{
color: #FFF;
border-bottom: none;
}

.slidedoormenu li a:hover, .slidedoormenu li a:visited:hover {
background-position: -203px 0; /* Shift background image horizontally 203px, or the start of the 2nd background image */
border-left: 10px solid rgb(185,211,110); /* thick left border of menu */
color: #FFF;
border-bottom: none;
}

.slidedoormenu li.current a {
border-left: 10px solid rgb(185,211,110); /* thick left border of menu */
}

.slidedoormenu li.current a:hover{
background-position: left; /* Shift background image horizontally 203px, or the start of the 2nd background image */
cursor:text;
}



 /************************** Round Corners **************************/

.roundcornertoprt {
display: block;
position:relative;
top: 18px;
left: 209px;
width: 16px;
height: 16px;
background: url(../images/roundcorner-toprt.png) no-repeat center;
z-index: 1000;
}

.roundcornerbotrt {
display: block;
position:relative;
top: -18px;
left: 209px;
width: 16px;
height: 16px;
background: url(../images/roundcorner-botrt.png) no-repeat center;
z-index: 1000;
}

 /************************** Style for Sidebar Forms **************************/
 

.sidebarform .categories {
	font-size: 100%;
	font-weight: bold;
	margin: 0 0 0 5px;
}

.sidebarform label {
	font-size: 85%;
	line-height: 1em;
}

.sidebarform .checkbox {
	width: 10px;
	height: 10px;
	margin: 2px 0 0 5px;
}


 /************************** Style for Contact Forms **************************/


#contact-area {
	width: 530px;
	margin-top: 25px;
	color: #666;
}

#contact-area input, #contact-area textarea {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 1.5em;
	color: #333333;
	padding: 5px;
	width: 418px;
	margin: 0px 0px 10px 0px;
	border: 1px solid rgb(185,211,110);
	/* I added the following */
	display: block;
	float: left;
}

#contact-area select {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 1.5em;
	color: #333333;
	padding: 5px;
	width: 430px;
	margin: 0px 0px 10px 0px;
	border: 1px solid rgb(185,211,110);
	/* I added the following */
	display: block;
	float: left;
}

#contact-area textarea {
	height: 90px;
}

#contact-area textarea:focus, #contact-area input:focus {
	border: 1px solid rgb(8,109,4);
}

#contact-area input#submit-button {
	width: 100px;
	float: right;
	text-transform: uppercase;
	background-color: rgb(185,211,110);
}

#contact-area input#submit-button:focus, #contact-area input#submit-button:hover {
	color: rgb(8,109,4);
	border: 1px solid rgb(8,109,4);
}

#contact-area label {
	float: left;
	text-align: right;
	margin-right: 10px;
	width: 90px;
	padding-top: 5px;
	/* I added the following */
	font-size: 12px;
	display: block;
}
#contact-area label.state {
	width: 55px;
}

#contact-area label.zip {
	width: 50px;
}

#contact-area label.reference {
	width: 175px;
}

#contact-area label.gasoline, #contact-area label.gasohol, #contact-area label.ethanol, #contact-area label.biodiesel, #contact-area label.k1, #contact-area label.lsd, #contact-area label.ulsd {
	text-align: left;
	margin-right: 0px;
	margin-left: 10px;
	width: 80px;
}

#contact-area input#name, #contact-area input#email, #contact-area input#company, #contact-area input#country {
	width: 171px;
}

#contact-area input#phone, #contact-area input#fax, #contact-area input#users, #contact-area input#specialty {
	width: 135px;
}

#contact-area input#state {
	width: 25px;
}

#contact-area input#zip {
	width: 73px;
}

#contact-area input#gasoline, #contact-area input#gasohol, #contact-area input#ethanol, #contact-area input#biodiesel, #contact-area input#k1, #contact-area input#lsd, #contact-area input#ulsd {
	width: 15px;
	height: 15px;
}

#contact-area select#platform, #contact-area select#timeframe {
	width: 183px;
}

#contact-area select#reference {
	width: 345px;
}

#contact-area input#required, #contact-area input#event {
	display:none;
}

#contact-area .divider {
	width: 550px;
	height: 1px;
	display: block;
	clear: both;
}

#contact-area #footnote {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #333333;
	line-height: 2.5em;
	display: block;
	float: left;
	margin-left: 110px;
}

#contact-area .indented {
	margin-left: 100px;
}

#contact-area input.error, textarea.error {
	background-color: rgb(251,247,192); /* was rgb(255,240,215) */
}

#contact-area #errormsg  {
	margin-left: 100px;
}

#contact-area #errormsg li {
	text-align: left;
	list-style-type: none;
}




     /****************** Style for tables *****************/
	 
table a,
table a:link,
table a:visited {
	border:none;
}							
	
img {
	border:0;
	margin-top:.25em;
}	
	
/*table {
	width:90%;
	border-top:1px solid rgb(185,211,110);
	border-right:1px solid rgb(185,211,110);
	margin:1em auto;
	border-collapse:collapse;
}

tr.odd td, th	{
	background: rgb(230,243,255);
}

tr.odd .column1	{

}	

.column1	{
	font-weight: bold;
}

td {
	color: #666;
	border-bottom:1px solid rgb(185,211,110);
	border-left:1px solid rgb(185,211,110);
	padding:.3em 1em;
	text-align:left;
	vertical-align: top;
}				

th {
	font-weight: normal;
	color: rgb(185,211,110);
	text-align:left;
	border-bottom: 1px solid rgb(185,211,110);
	border-left:1px solid rgb(185,211,110);
	padding:.3em 1em;
	font-size: 115%;
}						

table.plain {
	border: none;
	width:100%;
	margin:1em auto;
	border-collapse:collapse;
}

table.plain .boldcolumn {
	font-weight: bold;
}

table.plain td {
	color: #666;
	border: none;
	padding: 0;
	text-align:left;
	vertical-align: top;
}				

table.plain th {
	font-weight: normal;
	color: rgb(185,211,110);
	text-align:left;
	border-bottom: 1px solid rgb(185,211,110);
	padding: .5em 0;
	font-size: 115%;
}		

table.plain tr {
	background-color: #FFFFFF;
}

table a, table.plain a {
	color: rgb(8,109,4);
	text-decoration: none;
	border-bottom: 1px solid rgb(185,211,110);
}

table a:hover, table.plain a:hover {
	color: rgb(185,211,110);
	text-decoration: none;
	border-bottom: 1px solid rgb(185,211,110);
}

table a:visited, table.plain a:visited {
	color: #666;
	text-decoration: none;
	border-bottom: 1px solid rgb(8,109,4);
}

table a:visited:hover, table.plain a visited:hover {
	color: rgb(185,211,110);
	text-decoration: none;
	border-bottom: 1px solid rgb(185,211,110);
}*/


     /****************** Style for special boxes *****************/



.specialbox-180 {
	display: block;
	width: 180px;
	float: right;
	clear: right;
	margin: 10px 0 15px 15px;
	padding: 0;
	background-image: url(../images/leftspecialbox-top.gif);
	background-position:top;
	background-repeat: no-repeat;
	font-weight: normal;
	text-align:center;
	color: #000000;
}


.specialboxbottom-180 {
	display: block;
	width: 180px;
	min-height: 30px;
	background-image: url(../images/leftspecialbox-bottom.gif);
	background-position:bottom;
	background-repeat: no-repeat;
	padding: 5px 0 20px 0; 
	margin: 0;
	text-align:center;
}

.specialbox {
	width: 300px;
	float: right;
	margin: 10px 15px 15px 15px;
	padding: 0;
	background-image: url(../images/mainspecialbox-top.gif);
	background-position:top;
	background-repeat: no-repeat;
	font-weight: normal;
	text-align:center;
	color: #000000;
}


.specialboxbottom {
	width: 300px;
	background-image: url(../images/mainspecialbox-bottom.gif);
	background-position:bottom;
	background-repeat: no-repeat;
	padding: 5px 0 20px 0; 
	margin: 0;
	text-align:center;
}

a .specialbox, a .specialbox-180 {
	color: rgb(8,109,4);
	border: 0;
}

a .specialbox:hover, a .specialbox-180:hover, .hwrt #sidebar a .specialbox:hover, .hwrt #sidebar a .specialbox-180:hover {
	color: #000;
	border: 0;
}

.bigbutton {
	display: block;
	margin-top: 15px;
}


.hwrt #sidebar .specialbox-180 {
	width: 180px;
	float: right;
	margin: 10px 25px 15px 0;
	padding: 0;
	background-image: url(../images/leftspecialbox-top.gif);
	background-position:top;
	background-repeat: no-repeat;
	font-weight: normal;
	text-align:center;
	color: #000000;
}

.hwrt #sidebar .specialbox-180 p {
	margin-left: 0;
	margin-top: 1em;
}


     /****************** Style for location page *****************/
	 
#locationtable {
	width: 180px;
	display: block;
	float: right;
	margin: 25px 0 10px 15px;
}

#locationtable table {
	border: none;
	width:100%;
	margin:1em auto;
	border-collapse:collapse;
	border: 1px solid rgb(185,211,110);
}

#locationtable table td {
	color: #666;
	border: none;
	padding: 1px 1px 1px 15px;
	text-align:left;
	vertical-align: middle;
}				

#locationtable table td.terminalStateTD {
	text-align: center;
	padding-right: 1px;
	padding-left: 1px;
}

#locationtable table tr {
	background-color: #FFFFFF;
}


#locationtable table th {
	border: 1px solid rgb(185,211,110);
	padding: 2px 15px;
	background-color: rgb(185,211,110);
	color: #FFF;
	cursor: pointer;
}


#locationtable table .rowHover td, #locationtable table .rowSelected td {
	color: rgb(8,109,4);
	background-color: rgb(235,245,200);
	cursor: pointer;
}


#locationinfo {
	display: block;
}

dl.map {
	background: url(../images/mapbknd.jpg) no-repeat;
	border: 1px solid rgb(185,211,110);
	margin: 0;
	padding: 0;
	text-align:center;
	display: block;
	width: 560px;
	height: 380px;
	position: relative;
}

dl.map a.location {
  background: url(../images/star.gif) no-repeat bottom center;
  display: block;
  outline: none;
  text-decoration: none;
  border: none;
  text-align: center;
  font-size: 80%;
  width: 140px;
  height: 28px;
  position: absolute;
  z-index: 10;
  font-weight: normal;
  color: rgb(8,109,4);
  cursor: pointer;
}

dl.map a.location:hover, dl.map a.locationHover, dl.map a.locationSelected {
  background: url(../images/star2-hov.gif) no-repeat bottom center;
  font-weight: bold;
  color: rgb(8,109,4);
  cursor: pointer;
}

dl.map a#Hartford:hover,
dl.map a#NorthLittleRock:hover,
dl.map a#NorrisCity:hover,
dl.map a#Seymour:hover,
dl.map a#Hartford.locationHover,
dl.map a#NorthLittleRock.locationHover,
dl.map a#NorrisCity.locationHover,
dl.map a#Seymour.locationHover,
dl.map a#Hartford.locationSelected,
dl.map a#NorthLittleRock.locationSelected,
dl.map a#NorrisCity.locationSelected,
dl.map a#Seymour.locationSelected
{
	background: url(../images/starhwrt2-hov.gif) no-repeat bottom center;
}

dl.map a#Amboy {
	top: 5px; left: 175px;
}

dl.map a#Carthage {
	top: 125px; left: -30px;
}

dl.map a#Clermont {
	top: 40px; left: 340px;
}

dl.map a#Columbia {
	top: 85px; left: 15px;
}

dl.map a#FortSmith {
	top: 215px; left: -27px;
}

dl.map a#Hartford {
	top: 100px; left: 135px;
	width: 200px;
	font-size: 100%;
	letter-spacing: -.02em;
	background: url(../images/starhwrt2.gif) no-repeat bottom center;
}

dl.map a#Helena {
	top: 250px; left: 160px;
}

dl.map a#Heyworth {
	top: 35px; left: 220px;
}

dl.map a#Lebanon {
	top: 55px; left: 440px;
}

dl.map a#NorthLittleRock {
	top: 235px; left: 70px;
	font-size: 100%;
	letter-spacing: -.01em;
	background: url(../images/starhwrt2.gif) no-repeat bottom center;
}

dl.map a#NorrisCity {
	top: 120px; left: 260px;
	font-size: 100%;
	letter-spacing: -.01em;
	background: url(../images/starhwrt2.gif) no-repeat bottom center;
}

dl.map a#Palmyra {
	top: 65px; left: 70px;
}

dl.map a#Petersburg {
	top: 65px; left: 160px;
}

dl.map a#Princeton {
	top: 96px; left: 305px;
}

dl.map a#ScottCity {
	top: 150px; left: 205px;
}

dl.map a#Seymour {
	top: 70px; left: 355px;
	font-size: 100%;
	letter-spacing: -.01em;
	background: url(../images/starhwrt2.gif) no-repeat bottom center;
}

dl.map a#Shreveport {
	top: 330px; left: 5px;
}

dl.map a#Springfield {
	top: 155px; left: 0px;
}

dl.map a#StCharles {
	top: 127px; left: 150px;
}


dl.map .nodata {
	font-size: 100%;
	display: block;
	width: 360px;
	position: absolute;
	top: 175px; left: 100px;
	text-align: center;
    z-index: 10;
}


     /****************** Style for chart of all locations *****************/

table.bigchart {
	border-top: none;
	border-right: none;
}

.bigchart td {
	font-size: 80%;
	vertical-align: middle;
}

.bigchart th {
	font-size: 90%;
	font-weight: bold;
	color: rgb(8,109,4);
	background-color: rgb(235,245,200);
	text-align: center;
}

.bigchart th.blank {
	background-color: #FFF;
	border-left: none;
}

.bigchart th.toprow {
	background-color: #FFF;
	border-left: none;
	border-right: none;
}

.bigchart td li {
	margin-left: 10px;
}

.bigchart .terminalPartnersTD {
	border-right: 1px solid rgb(185,211,110);
}