/* Common */
body { background: #ddd url(../img/bg2.png) top repeat-x; color:#3c3c3c; font-family:Arial, Helvetica, sans-serif; font-size:12px; margin:0px 0px 30px 0px; padding:0px; }
img, table { border:0px; }
li { margin:0px; padding:0px }
ul { margin:0px; padding:0px; }
form { margin:0px; }
p { margin:0px; padding:0px 0px 6px 0px; line-height:17px;  } 
a { outline:none; }
div.align_left { float:left; }
div.align_right { float:right; }
.border { border:#d2d2d2 solid 1px; margin-bottom:10px; }

/* Containers */
#main-container { margin:0px auto; padding:0px; width:904px; }
#header-container { background:url(../img/bg2-header2.png) top no-repeat; height:130px; margin:3px 0px 2px 0px; padding:0px; width:904px; }
.distributor-column { background:url(../img/content-bottom.gif) bottom left no-repeat; float:left; margin:0px 0px 30px 0px; padding:0px; width:669px; }
.intro-column { background:url(../img/content-bottom.gif) bottom left no-repeat; float:left; margin:0px; padding:0px; width:669px; }
#fuel-column { float:right; margin:0px 0px 0px 0px; padding:0px 0px 0px 0px; width:234px; }
.fuel-feature { background:#fff; width:200px; margin:0px 0px 0px 5px; padding:0px 12px; }

/* Menu */
.menu-container { float:right; margin:84px 3px 0px 0px; }
.menu-left { background:url(../img/menu-left.png) top no-repeat; width:50px; height:35px; float:left; }
.menu-right { background:url(../img/menu-right.png) top no-repeat; width:5px; height:35px; float:left; }
.menu-fill { background:url(../img/menu-fill.png) top repeat-x; height:21px; text-align:right; font-size:14px; font-weight:bold; padding:14px 8px 0px 0px; margin:0px; float:left; text-decoration:none; }

/*  Header  */
#bg-logo { display:block; background:url(../img/bgperformance.png) no-repeat; height:88px; width:152px; margin:17px 20px 0px 20px; float:left; }
#divider-logo { display:block; background:url(../img/divider-top.png) no-repeat; height:108px; width:2px; margin-top:12px; float:left; }
#sunoco-logo { display:block; background:url(../img/sunoco-title.png) no-repeat; height:79px; width:355px; margin:22px 0px 0px 17px; float:left; }

/*  Title Header  */
.left-cap { display:block; background:url(../img/header-left.gif) no-repeat; height:41px; width:10px; float:left; }
.right-cap { display:block; background:url(../img/header-right.gif) no-repeat; height:41px; width:11px; float:right; }
h2.title { background:url(../img/header-bg.gif) repeat-x; height:25px; width:642px; float:left; color:#0a2769; font-size:14px; font-style:italic; font-weight:bold; text-transform:uppercase; margin:0px; padding:16px 0px 0px 6px; }
h3.title { background:url(../img/header-bg.gif) repeat-x; height:25px; width:207px; float:left; color:#0a2769; font-size:14px; font-style:italic; font-weight:bold; text-transform:uppercase; margin:0px; padding:16px 0px 0px 6px; }
p.intro { padding:20px 20px 0px 20px; font-size:15px; line-height:20px; color:#000; }

/*  Distributors  */
#content-container { display:block; background:url(../img/content-bg.gif) repeat-y; width:664px; padding-left:5px; margin-bottom:26px; overflow:hidden; }
.distributor { display:block; background:url(../img/distributor-bg.gif) repeat-x; float:left; width:282px; height:88px; margin:11px 0px 0px 11px; padding:12px 16px 0px 15px; }
h1.contact { font-size:15px; font-weight:bold; margin:0px; padding:0px; line-height:16px; width:240px; }
p.contact { width:240px; }
.map { background:url(../img/map.gif) no-repeat; height:26px; width:36px; margin-top:25px; float:right; }
.map:hover { background:url(../img/map-r.gif) no-repeat; }
a { color:#0a2769; text-decoration:none; }
a:hover { color:#3c3c3c; text-decoration:underline; }

/*  Tab  */
#tab { background:url(../img/tab.gif) no-repeat; height:86px; width:234px; margin:0px; padding:21px 0px 0px 0px; text-align:center; }
h1 { font-size:16px; font-weight:bold; margin:0px; padding:0px; line-height:18px; color:#000; }
.divider { background:url(../img/divider-column.gif) no-repeat; height:2px; width:234px; padding:0px; margin:3px 0px 8px 0px; }

/*  Fuels  */
.fuel-top { background:url(../img/fuel-top.gif) repeat-y; width:234px; height:11px; overflow:hidden; }
.fuel-bottom { background:url(../img/fuel-bottom.gif) no-repeat; width:234px; height:18px; }
.fuel-purple { background:#e7e0ef; float:left; height:75px; width:200px; margin:6px 0px 0px 6px; padding:12px 0px 0px 12px; }
.fuel-blue { background:#e0ebf5; float:left; height:75px; width:200px; margin:6px 0px 0px 6px; padding:12px 0px 0px 12px; }
.fuel-green { background:#d9eae3; float:left; height:75px; width:200px; margin:6px 0px 0px 6px; padding:12px 0px 0px 12px; }
.fuel-orange { background:#feeedf; float:left; height:75px; width:200px; margin:6px 0px 0px 6px; padding:12px 0px 0px 12px; }
.fuel-red { background:#fce2e2; float:left; height:75px; width:200px; margin:6px 0px 0px 6px; padding:12px 0px 0px 12px; }
.fuel-yellow { background:#fff9d9;; float:left; height:75px; width:200px; margin:6px 0px 0px 6px; padding:12px 0px 0px 12px; }
.fuel-grey { background:#fafafa; float:left; height:75px; width:200px; margin:6px 0px 0px 6px; padding:12px 0px 0px 12px; }

/*  Colors  */
.black { color:#000; }
.purple { color:#5c2e91; }
.blue { color:#0060af; }
.green { color:#027443; }
.orange { color:#f58e25; }
.red { color:#ee3b3e; }
.yellow { color:#fdd803; }
.grey { color:#3c3c3c; }
