/*=Widget Generic Styles */
#mainWidget {
	/*height: 379px;*/
	width: 311px;
	position: absolute;
	top: 34px;
	right: 4px;	
}

#widgetWrapper{
    position:absolute;
    top:0px;
    width:100%;
    right:0px;
}

#widgetInnerWrapper{
    margin:0 auto;
    width:990px;
    position:relative;
}

.tab{
    position:absolute;
    top:66px;
    height:311px;
    left:0px;
    padding:13px 4px 0;
}

#mainWidget #widgetTabs li{ 
    text-align:center;
    height:66px;
    float:left;
    width:160px;  
}

#widgetTabs li a{
    font: 12px/14px ArtoisRegular, arial, sans-serif;
    text-shadow: -1px 2px 0 #000000;
    padding-top:31px; 
    display:block;
    color:#fec434;
    text-transform:uppercase;
    text-decoration: none;
    border-bottom: none;
}


#widgetTabs #centerTab a{padding-top:16px;}

.ie #widgetTabs li a{padding-top:35px;}
.ie #widgetTabs #centerTab a{padding-top:20px;}

#widgetTabs #leftTab{background: url(../Image/leftTabBg.png) no-repeat;margin:1px 0 0 0;}
#widgetTabs #rightTab{background: url(../Image/rightTabBg.png) no-repeat;margin:1px -3px 0 -9px; width:160px;}

#mainWidget #widgetTabs li.ui-tabs-selected{background-position: 0 -73px; z-index:10;}
.ie6 #mainWidget #widgetTabs li.ui-tabs-selected{background-position: 0 0;}

#mainWidget #widgetTabs li.ui-tabs-selected a,
#mainWidget #widgetTabs li a:hover{ color:#fff; text-decoration: none; border-bottom: none;}

#tabsLocation{background: url(../Image/widgetRedBg.png) no-repeat; width:255px;}
#tabsCalc{background: url(../Image/widgetGreenBg.png) no-repeat; width:282px;}
#tabsLogin{background: url(../Image/widgetYellowBg.png) no-repeat; width:292px;}

#widgetTabHolder #backButton{
    position:absolute; 
    top:70px; 
    width:24px;
    height:23px;
    left:15px; 
    z-index:20;
    display:none;
    padding-left:12px;
    color:#fcb725;
	font: 18px GoodDogRegular,Arial,sans-serif;
    background: url(../Image/backArrow.gif) no-repeat left center; 
    text-decoration: none; border-bottom: none;
}
#widgetTabHolder #backButton:hover{
	color:#fff;
    text-decoration: none; border-bottom: none;
}

.results #widgetTabHolder #backButton{display:block;}
.store #widgetTabHolder.widgetResults #backButton,
.detail #widgetTabHolder #backButton{display:none;}

#wrapper #collapseWidget{
    position:absolute; 
    top:70px; 
    width:24px;
    height:23px;
    right:10px; 
    z-index:20;
    text-indent:-9000px;
    display:none;
    border-bottom:none;
    background: url(../Image/collapseArrowBg.png) no-repeat; 
}
#wrapper #collapseWidget:hover{background-position:0 -23px;}

.collapseWidget #wrapper #collapseWidget{display:block;}

#expandWidget{
    background: url(../Image/expandWidgetBg.png) no-repeat; 
    height:46px;
    bottom-border:none;
}

#expandWidget span{ 
    background: url(../Image/expandArrowBg.png) no-repeat center 10px;
    display:block;
    height:46px;
    cursor:pointer;
    overflow:hidden;
}
 
#expandWidget:hover span{background-position: center -46px;}

#expandWidget, #widgetTabHolder.hideTabs #collapseWidget{
    position:absolute; 
    left:-9000px; 
    top:-9000px;
    display:block;
}

#widgetTabHolder.hideTabs .tab{position:absolute; left:-9000px; top:-9000px;}
#widgetTabHolder.hideTabs #expandWidget{position:static; border-bottom: none;}

/*=Locations tab */
#tabsLocation {
	padding: 10px 30px 0;	
}
#locateSearch {
	position: static;
}
#tabsLocation h2{
	background: url(../Image/locateAGetGoH.png) no-repeat;
	height: 30px;
	width: 164px;
	text-indent: -9999px;
	margin: 0 auto 6px;
}
#tabsLocation .addressEntry,
#tabsLocation .regionDD {
	width: 230px;
	margin: 0px 0 0px 8px;
	color: #4e4e4e;
}
#tabsLocation .addressEntry{
    width:235px; 
    padding-left:0px;
    padding-right:0px; 
}
#tabsLocation .regionDD {
	width: 238px;
	border:none;
	background:#fff;
}

#tabsLocation p {
	font: 24px GoodDogRegular,Arial,sans-serif;
	color: #ffc425;
	text-align: center;
}
#tabsLocation p sup {
	font-size:11px;
	top:-6px;
	/*top: -0.5em;*/
}
#tabsLocation .checkboxHolder {
	display: block;
	margin-top: 10px;	
	padding-left:9px;
	overflow: hidden;
}
#tabsLocation .checkboxHolder input {
	margin:0px;
	background:#fff;
	padding:0;
	height:13px;
	width:13px;
	top:2px;
	float: left;display: inline;
}

#tabsLocation .checkboxHolder input.clearLeft {clear:left;}
#tabsLocation .checkboxHolder label {
	float: left;
    width: 100px;
    padding-left:5px;
    height: 20px;
    color: #fff;
}
#tabsLocation #submitBtn {
	margin: 10px auto 0;
	display: block;
	float: none;
}
/*=Results Locations Tab */
.results #widgetTabHolder.widgetResults #tabsLocation{
	padding: 10px 10px 25px;
	width: 291px;
	height: auto;
	background: url(../Image/widgetRedBgLong.png) no-repeat bottom left;
}
.results .widgetResults #locateSearch {
	position: absolute;
	top: -9999px;
	left: -9999px;
}
#locationResults { 
	position: absolute;
	top: -9999px;
	left: -9999px;
}
.results .widgetResults #locationResults {
	position: static;
	margin-top:-10px;
}
#locationResults .featuredStoreInfo {
	float: left;
	min-height: 210px;
	padding-top: 10px;
}

#locationResults .clear{padding-top: 10px;}

#locationResults .outer {
	float: left;
	min-height: 206px;
}

.ie6 #locationResults .featuredStoreInfo,
.ie6 #locationResults .outer  {height:205px;}

#locationResults .outer ul {
	width: 291px;
}
#locationResults sup {
	font-size: .5em;
	top: -0.6em;
}
#locationResults h2{
	background: none;
	height: auto;
	width: auto;
	text-indent: 0;
	margin: 0 30px 0 5px;
	font: 24px GoodDogRegular,Arial,sans-serif;
	color: #fff;
	float: left;
}
a#newSearchLink {
	display: block;
	float: right;
	color: #fec434;	
    font:24px GoodDogRegular, arial, sans-serif;
    text-shadow: -1px 2px 1px #585757;
    padding: 0 15px 5px 0;
    margin-right: 10px;
    text-decoration: none; border-bottom: none;
    background: url(../Image/orangeLinkArrow.png) right center no-repeat;
    width: 90px;
}
#locationResults a#newSearchLink:hover {
	color: #fff;
    text-decoration: none; border-bottom: none;
}
#locationResults .topResults h3 {
	color: #00519a;
	font: bold 14px Arial, sans-serif;
}

#locationResults .topResults h3 a,
#locationResults .topResults h3 a:hover{border-bottom:none;}
#locationResults .storeNum {
	background: url("../../Common/Image/numberBg.png") no-repeat scroll center top transparent;
	color: #FFFFFF;
	display: block;
	font: bold 20px/22px Arial,sans-serif;
	height: 26px;
	padding-top: 5px;
	text-align: center;
	width: 60px;
	float: left;
	display: inline;
	margin: 4px 5px 0 3px;
}
#locationResults p {
	font: 11px Arial,sans-serif;
	color: #343434;
	text-align: left;
	padding-right: 0;
}
#locationResults .features {
	width: 223px;
	height: 35px;
	padding: 5px 0 0;
	float: left; display: inline;
}
#locationResults .inner {
	float: left;	
	display: inline;
	width: 291px;
	min-height: 165px;
}
#locationResults .inner ul {
	float: left;
	min-height: 165px;
}

.ie6 #locationResults .inner,
.ie6 #locationResults .inner ul  {height:165px;}

#locationResults .inner li {
	padding: 10px;	
	font-size:11px;
}
#locationResults .inner .name {
	padding: 5px 10px;
}
#locationResults .inner .address {
	float: left;
	width: 140px;
	padding-right:0px;
	padding-top: 0px;
}
#locationResults .inner .hours {
	float: left;
	padding:0 0 45px 10px;
	width: 130px;
}
#locationResults .day {
	width: 30px;
	padding-right: 2px;
	display: block;
	float: left;
}
#locationResults .inner .details {
	float: left;
	padding: 0px 4px 10px 10px;
}
.ie6 #locationResults .inner .details {
}
#locationResults .inner .details .redBtn {
	margin: 0;
}
#locationResults .inner .items {
	padding: 10px 0 0;	
}
#locationResults .moreResults {
	font: 24px GoodDogRegular,Arial,sans-serif;
	color: #fff;
	text-align: center;
	float: left;
	clear: both;
	width: 291px;
}
/* location get directions */
#getDirections{
    /*position:absolute;
    left:-9999px;
    top:-9000px;*/
    display:none;
    position:relative; 
}

.detail #getDirections{
    display:block;
}

#getDirections h2{
    background: url(../Image/directionsHdr.png) no-repeat;
    width:210px;
}

#getDirections h3{
     color:#ffc425;
     margin-bottom:20px;
}
.detail #getDirections .formWrapper {
	overflow: hidden;
	margin-bottom: 10px;
	zoom: 1;
}
#getDirections h3, 
#getDirections label{
    font: 24px/20px GoodDogRegular,Arial,sans-serif;
}

#getDirections label{
    width:75px;
    float:left;
    color:#fff;
}

#getDirections input{
    float:left; 
    display:inline;
    width:170px;
}

#mainWidget #getDirections .getDirectionsBtn{
    float: none;
    display: block;
    margin:10px auto 0; 
}
#mainWidget .btnWrapper {
	position: relative;
	z-index: 1;
	width: 100%;
}
/*=Savings Calculator tab */
#tabsCalc{padding-left:25px;}
#tabsCalc h2{
    background: url(../Image/saveWithFoodperksH.png) no-repeat;
    width:245px;
    margin:0 0 7px 5px;
    height:33px;
    text-indent:-9000px;
}
.sliderWrapper{float:left; width:280px; font-size:1px;}
.sliderWrapper .question{
    color:#fff;
    font:24px GoodDogRegular, arial, sans-serif;
    text-shadow: -1px 2px 3px #585757;
    padding-bottom:15px;
}

.slider{
    font-size:2px; 
    height:10px; 
    float:left;
}
.slider div{width:150px;}
#wrapper .sliderWrapper .ui-slider-handle{
    background: url(../Image/handleBg.png) no-repeat;
    text-decoration:none; border-bottom: none; 
}

.ie6 .sliderWrapper .ui-slider-handle{-pie-png-fix: true;}

.sliderWrapper .sliderAmount{
    float:left;
    width:115px; 
    margin-top:-20px;
}

.sliderWrapper .sliderAmount .type{
    font-size:14px;
    color:#fff;
    line-height:16px;
    font-weight:bold;
    float:left;
    width:60px;
}
#gallons{padding-bottom:8px;}
#gallons .sliderAmount .type{margin-top:23px;}
#fillup .sliderAmount .type{margin-top:10px;}

.sliderWrapper .sliderAmount .amount{
    color:#e13a3f;
    width:55px;  
    float:left;  
    text-align:center;
    font: 42px/30px ArtoisRegular, arial, sans-serif;
    text-shadow: -1px 1px 1px #535252;
}

.ie .sliderWrapper .sliderAmount .amount{line-height:42px;}

#perksValue{
    float:left;
    padding:10px 10px 0 0;
    position:relative;
    width:270px;
}

#perksValue input{
    border:1px solid #486b23;
    position:relative;
    height:19px;
    width:36px;
    padding:0 2px;
    color:#605f5f;    
    font-weight:bold;
    font-size:18px;
    background:#fff;
    -moz-box-shadow: 0 0 3px #666;
	-webkit-box-shadow: 0 0 3px #666;
    box-shadow: 0 0 3px #666;
    -moz-border-radius: 4px;
    border-radius: 4px;
    margin-left:2px;
}

#perksValue .info{
    font: 17px/18px ArtoisRegular, arial, sans-serif;
    color:#fff;
    position:relative;
    text-shadow: -1px 1px 0px #787878;
    margin-bottom:1px;
}

.ie #perksValue .info{line-height:21px;}

#perksValue .info .smaller{
    font:12px/14px arial, sans-serif;
}

#perksValue .disclaimer{
    font-size:10px;
    line-height:10px;
    text-align:center;
    margin-top:5px;
}
.ie #perksValue .disclaimer{margin-top:0;}

#perksValue .disclaimer a{border-bottom:1px solid #cee3c0; line-height:15px;}
#perksValue .disclaimer a:hover{border-bottom:none;}

#perksValue .disclaimer a,
#perksValue .disclaimer{ color:#cee3c0; }

#perksValue .trademark{
    font-size:6px; 
    top:-.8em; 
    vertical-align:middle;
}

#perksValue .savings{
    font-size:28px;
    position:absolute;
    left:210px;
    height:28px;
    line-height:16px;
    top:16px;
}
.ie #perksValue .savings{ line-height:28px;}

/*=login / register */
#tabsLogin{padding-left:15px;}
#tabsLogin #login h2{
    width:262px;
    margin:0 0 20px 8px;
    font:34px/28px GoodDogRegular, arial, sans-serif;
    color:#00519a;
    text-align:center;
}

#tabsLogin #login label,
#forgotPassword label{
    padding:0 5px 0 20px;
    color:#00519a; 
    float:left;
    clear:left;
    width:70px;
    font:20px/28px GoodDogRegular, arial, sans-serif;
}

#tabsLogin input{
    width:160px;
    color:#4e4e4e;
    margin-top:5px;
    float:left;
}

#tabsLogin .bottomButtons{
    padding:40px 13px 0 20px; 
    float:left;
    width:260px;
}

#login{padding:15px 0 0 ;}
#myinfo{padding:0px 25px 0 17px; width:250px;}

#myinfo.hide,
#login.hide,
#forgotPassword.hide,
#sentNewPassword.hide{
    position:absolute; 
    left:-9000px; 
    top:-9000px;
    overflow:hidden;
}

#mainWidget  a.redArrowLink{
    padding-right:15px;
    font:24px/24px GoodDogRegular, arial, sans-serif;
    color:#e13a3f;
    float:left;
    text-decoration:none;
    border-bottom:none;
    background: url(../Image/redArrowBg.gif) no-repeat right 10px;
}
#mainWidget  a.redArrowLink:hover{color:#00519a;}

#login p{
    color:#4e4e4e;
    padding-left:20px;
    width:250px;  
    line-height:16px;  
}

#myinfo .noInfo{
    /*display:none;*/
    font-size:14px;
    padding-bottom:10px;
}

.noInfo a{color:#00519a;}
.noInfo a:hover{color:#e23a3f;}

#loginBtn{margin-right:20px;}

#mainWidget #logoutBtn{float:right; margin-top:5px;}
#loginName{float:left;}

#myinfo .hide {
	display: none;
}

#myinfo h2{
    color:#00519a; 
    font:26px/28px GoodDogRegular, arial, sans-serif;
    padding-bottom:3px;
}
#myinfo h2 span {
	text-transform: capitalize;
}
#perksInfo{float:left;clear:both;}

#perksInfo h3, .discountAvailable, .noInfo{
    color:#e13a3f; 
    font-weight:bold;
    font-size:18px;
}

.discountAvailable{padding-left:7px;}

#myinfo .floatHolder h3{
    font-size:12px;
    float:left;
}

#myinfo .floatHolder h3 span{
    padding-top:6px; 
    float:left;
}

.floatHolder h3 .logo{
    text-indent:-9000px;
    padding:0px;
    position:relative;
    width:54px;
    height:31px;    
}

.fuelperks h3 .logo{background: url(../Image/fuelperksLogo.png) no-repeat;}
.foodperks h3 .logo{background: url(../Image/foodperksLogo.gif) no-repeat;}

#myinfo .floatHolder{overflow:hidden; width:250px;}

#myinfo .fuelperks,
#myInfo .foodperks{
    float:right;
    clear:both;
}

#storeInfo h3{
    color:#00519a;
    font-weight:bold;
    font-size:14px;
}

#storeInfo h3 a,
#storeInfo h3 a:hover{border-bottom:none;}

#myinfo .gasInfo{
    color:#4e4e4e; 
    font:bold 14px arial, sans-serif;
}

#myinfo .gasInfo ul{margin-bottom:5px;}

#myinfo .gasInfo li{
    margin-right:8px;
    display:inline;
}

#myinfo .gasInfo li.prem{margin:0;}
#storeInfo.discounted .gasInfo li span{color:#E13A3F;}
#myinfo .gasInfo .moreStoresLink{
    float:left; 
    font-size:12px;
    display:none;
}

#myinfo .gasInfo .disclaimer{
    font-size:10px; 
    color:#E13A3F; 
    float:right;
    display:none;
}

#storeInfo.discounted .gasInfo .disclaimer{display:block;}

#myinfo .viewAccountBtn{
    margin:12px 60px 0 0;
    clear:both;
}

#forgotPasswordLink{
    clear:both;
    float:left; display:inline;
    margin-left:97px;
    color:#00519a;
    font-size:12px;
    width:120px;
    line-height:18px;
}

#forgotPasswordLink:hover{color:#e23a3f;}

#forgotPassword{
    padding:7px 25px 0 17px; 
    height:250px;
}

#forgotPassword h2{
    color:#00519a; 
    font: 23px "GoodDogRegular", arial, sans-serif;
}

#forgotPassword label{padding-left:0; width:45px;}
#forgotPassword input{
    width:190px;
    float:left;  
}

#forgotPassword .buttonHolder{
    padding-top:30px; 
    float:left;
    width:100%;
}
#mainWidget #forgotPassword .buttonHolder a{margin:0;}

#mainWidget #cancelSendPasswordBtn{float:left;}

#sentNewPassword{
    padding:0 30px 0 20px;    
}
#sentNewPassword p{
    color:#4e4e4e;
    margin-bottom:30px;
    line-height:16px;  
    padding-top:15px;
}

/*
 * jQuery UI CSS Framework 1.8.13
 *
 * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about)
 * Dual licensed under the MIT or GPL Version 2 licenses.
 * http://jquery.org/license
 *
 * http://docs.jquery.com/UI/Theming/API
 */
/* Layout helpers
----------------------------------*/
.ui-helper-hidden { display: none; }
.ui-helper-hidden-accessible { position: absolute !important; clip: rect(1px 1px 1px 1px); clip: rect(1px,1px,1px,1px); }
.ui-helper-reset { margin: 0; padding: 0; border: 0; outline: 0; line-height: 1.3; text-decoration: none; border-bottom: none; font-size: 100%; list-style: none; }
.ui-helper-clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.ui-helper-clearfix { display: inline-block; }
/* required comment for clearfix to work in Opera \*/
* html .ui-helper-clearfix { height:1%; }
.ui-helper-clearfix { display:block; }
/* end clearfix */
.ui-helper-zfix { width: 100%; height: 100%; top: 0; left: 0; position: absolute; opacity: 0; filter:Alpha(Opacity=0); }

/* Interaction Cues
----------------------------------*/
.ui-state-disabled { cursor: default !important; }

/* Overlays */
.ui-widget-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
/*
 * jQuery UI Tabs 1.8.13
 *
 * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about)
 * Dual licensed under the MIT or GPL Version 2 licenses.
 * http://jquery.org/license
 *
 * http://docs.jquery.com/UI/Tabs#theming
 */
.ui-tabs { position: relative; zoom: 1; } /* position: relative prevents IE scroll bug (element with position: relative inside container with overflow: auto appear as "fixed") */
.ui-tabs .ui-tabs-nav li {  float: left; position: relative; border-bottom: 0 !important; padding: 0; white-space: nowrap; }
.ui-tabs .ui-tabs-nav li.ui-tabs-selected a, .ui-tabs .ui-tabs-nav li.ui-state-disabled a, .ui-tabs .ui-tabs-nav li.ui-state-processing a { cursor: text; }
.ui-tabs .ui-tabs-nav li a, .ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a { cursor: pointer; } /* first selector in group seems obsolete, but required to overcome bug in Opera applying cursor: text overall if defined elsewhere... */
.ui-tabs .ui-tabs-panel { display: block; border-width: 0; background: none; }
.ui-tabs .ui-tabs-hide { left:-9999px; position:absolute; top:-9999px;}

/* The styles given to the form element in order to hide it */
.fd-form-element-hidden{ display:none; } 
/* Horizontal Outer wrapper - all other DOM elements added as children to this top level wrapper */
.fd-slider{                     
    width: 163px;
}
.ie6 .fd-slider-handle{-pie-png-fix: true;}
/* Shared rules */
.fd-slider{
    text-align:center;
    display:block;
    position:relative;  
    cursor:hand;      
    text-decoration:none;
    border:0 none;
    -moz-user-select:none;
    -khtml-user-select:none;
    -webkit-touch-callout:none; 
    user-select:none;     
}
.fd-slider-inner{
    /* Set this to display:none if not styling - it's used by IE for the onFocus glow effect */
    display:none;
}
/* The inner track bar */
.fd-slider-bar{
    position:absolute;
    display:block;
    z-index:2;
    margin:0;
    overflow:hidden;
    background: url("../Image/sliderBg.png") no-repeat scroll 0 0 transparent;
    left:0px;
    font-size: 2px;
    height: 10px;
    padding: 0 0px 5px;
    width: 160px;     
}

/* The drag handle */
.fd-slider-handle {
    position:absolute;
    display:block;
    padding:0;
    border:0 none;
    margin:0;
    z-index:3;
    top:-11px;
    left:0;
    width:22px;
    height:34px;
    outline:0 none;
    background:transparent url(../Image/handleBg.png) no-repeat 0px 0px;
    cursor:pointer;  
    line-height:20px;
    font-size:10px;       
    -webkit-user-select: none;
    -webkit-touch-callout:none;        
    -moz-user-select:none;
    -moz-user-focus:none; 
    user-select:none;           
    -moz-outline:0 none;               
}
/* Focus styles */
.fd-slider-handle:focus{
    outline:0 none;
    border:0 none;
    -moz-user-focus:normal;
}
button.fd-slider-handle:focus::-moz-focus-inner { border-color: transparent; }