body {
	font-family: Arial;
	background: transparent url(/app/images/merchant_locator/bgnd-page-topgradient.png) repeat-x scroll center top;
}
html, body {
	padding: 0;
	margin: 0;
	height: 100%;
	font-size: 9pt;
}

p {
	width: auto;
}

a.skipToContent {
	background-color: #f0f4f7;
	color: #092d58;
	border: 2px solid #2e84bd;
	position: absolute !important;
	left: -9999px !important;
}
a.skipToContent:hover {
	color: #2e2ee8;
}
a.skipToContent:focus { 
 	left: 16px !important;
 	top: 0px !important;
 	padding: 0 16px;
 	font-size: 1.2em;
 	font-weight: bold;
 	z-index: 1;
} 

.errortext {
	color: #f00;
}

span.required {
	color: #800;
}

h1.pageTitle {
	color: #0c2074;
	font-size: 14pt;
	margin-top: 0;
	margin-bottom: 8px;
}

#header #logo {
	vertical-align: middle;
}

#searchContainer {
	max-width: 880px;
	min-width: 640px;
	margin: auto;
	padding: 2em;
}

input#address {
	width: 24em;
}

fieldset.searchControls {
	background-color: #f6f2f6;
	color: #0c2074;
	border: solid 2px #0c2074;
	border-radius: 5px;
	padding: 0;
}
fieldset.searchControls h2 {
	color: #fff;
	background-color: #0c2074;
	font-size: 10pt;
	text-align: center;
	padding: 8px;
	margin: 0;
}
fieldset.searchControls > div {
	padding: 1em;
}

fieldset.searchControls p {
	padding: 5px 10px;
}
fieldset.searchControls ul {
	list-style: none;
	margin: 10px;
	padding: 0;
}
fieldset.searchControls ul li {
	padding: 5px;
}
fieldset.searchControls ul li.inline {
	padding-right: 5px;
	float: left;
}
fieldset.searchControls ul.products li {
	padding: 0;
}
fieldset.addressSearch {
	float: left;
	width: auto;
	margin-right: 15px;
	margin-bottom: 1em;
}
fieldset.zipSearch {
	float: left;
	width: 420px;
}

fieldset.grouping legend {
    display: block;
	position: absolute;
	clip: rect(0 0 0 0);
	border: 0;
	height: 1px;
	margin: -1px;
	overflow: hidden; 
	padding: 0;
	width: 1px;
}


#searchExamples {
	padding-top: 1em;
}
#searchExamples ul {
	list-style-type: none;
}
#searchExamples ul > li {
	padding: 1px;
}

#searchBar {
	display: inline-block;
	padding: 6px;
	vertical-align: middle;
}
#searchBar #search {
	display: none;
	font-size: 18px;
	width: 400px;
	vertical-align: middle;
}
#searchBar #searchButton {
	display: none;
	padding: 4px;
	vertical-align: middle;
	margin-left: 8px;
}

#merchantBrands,
#vmsMerchantBrands {
	width: auto;
}

#merchantBrands {
	height: 492px;
}

#vmsMerchantBrands {
	height: 100px;
}

#merchantAttributesFilter {
	width: 100%;
}

#allMerchantsFilter {
	font-size: 13px;
	margin: 12px 0px;
}

#merchantAttributesFilter .merchantFiltersContainer {
	margin: 0 1em 1em 1em;
	height:550px;
	width:auto;
	min-width:85%;
}

#merchantAttributesFilter .merchantFilters {
	margin: 0 1em;
	width: auto;
}

#merchantAttributesFilter .merchantFiltersColumn {
	float: left;
	width: auto;
}

#merchantAttributesFilter ul {
/* 	width: 390px; */
/* 	background-color: #fffcff; */
/* 	padding-bottom: 10px; */
/* 	margin-bottom: 10px; */
	float: left;
}

ul#merchantFilterTabs  {
 	margin: 1em 0 -2px 0;
}
ul#merchantFilterTabs.tabs li button {
	font-size: 1.1em;
	margin: 4px 10px;
	padding: 0 10px;
}

#merchantAttributesFilter ul li {
/* 	float: left; */
	width: auto;
	padding: 0 9px;
	margin: 0;
}

#merchantAttributesFilter ul li.title {
	width: auto;
	font-weight: bold;
	padding: 2px 0 3px 0;
	margin-bottom: 6px;
	font-size: 13px;
	background-color: #0c2074;
	color: #fff;
}

#header {
	background-color: #efefef;
	background: transparent url(/app/images/merchant_locator/bgnd-page-topshields.png) no-repeat right top;
}
#header img {
	height: 90px;
}
#container {
	position: relative;
	overflow: hidden;
}

#search, #searchButton {
	vertical-align: center;
}

#toolbar {
	float: right;
	margin-right: 35px;
	margin-top: 35px;
}
#toolbar a {
	display: block;
	float: left;
	padding: 5px 8px;;
	background-color: #fff;
	border: solid 1px #888;
	text-decoration: none;
	color: #666;
}
#toolbar a:hover {
	background-color: #eee;
}
#toolbar a.firstLink {
	border-right: none;
	border-radius: 5px 0 0 5px;
}
#toolbar a.lastLink {
	border-left: none;
	border-radius: 0 5px 5px 0;
}

#messageArea {
	background-color: #555;
	color: #fff;
	height: 27px;
	overflow: hidden;
}
#resultsMessage {
	display: inline-block;
	background-color: #0c2074;
	color: #fff;
	text-align: center;
	width: 250px;
	padding: 6px 0;
	font-weight: bold;
}
#priceDisplay {
	display: inline-block;
	padding: 4px 0 6px 0;
}
#priceDisplay span.price {
	display: inline-block;
	width: 160px;
	margin-left: 20px;
}
#priceNotice {
	font-style: italic;
}
span.dollarPrice {
	display: inline-block;
	color: #555;
	background-color: white;
	border-radius: 3px;
	font-weight: bold;
	padding: 1px 4px;
}

#backToLocations {
	display: none;
	background: #ccc;
	border-bottom: solid 1px #666;
	text-align: center;
}

#resultsPanel {
	position: absolute;
	top: 0;
	left: 0;
	min-width: 250px;
	width: auto;
	overflow: auto;
	z-index: 5;
	font-size: 8pt;
	background: #fff;
	border-right: 1px solid #999;
}
#resultsPanel a {
	color: #00a;
}

#map {
	position: relative;
	padding-left: 250px;
	overflow: hidden;
	border: inherit;
	margin: inherit;
}

#loadingIndicator {
	position: absolute;
	color: #477EBD;
	font-weight: bold;
	top: 50%;
	left: 50%;
	margin-top: -100px;
	margin-left: -100px;
	width: 187px;
	height: 113px;
	text-align: center;
	background-image: url(/app/images/merchant_locator/loading_bg.png);
	background-repeat: no-repeat;
	z-index: 100;
	padding-top: 25px;
}

#merchantInfoBox {
	position: absolute;
  	z-index: 999;
	width: auto;
	height: auto;
	background-color: #fff;
	border: solid 1px #aaa;
	padding: 10px;
	font-size: 12px;
	border-radius: 8px;
	box-shadow: #8b8b8b 0px 4px 10px 0px;
}
#merchantInfoBox.hiddenContent {
	clip: rect(0 0 0 0);
	height: 1px;
	margin: -1px;
	overflow: hidden;
}

#merchantInfoBox .beak {
	position: absolute;
	width: 10px;
	height: 19px;
}
#merchantInfoBox .beak.left {
	left: -9px;
	background: transparent url(/app/images/merchant_locator/infobox_beak_left.png) no-repeat left top;
}
#merchantInfoBox .beak.right {
	right: -10px;
	background: transparent url(/app/images/merchant_locator/infobox_beak_right.png) no-repeat left top;
}
#merchantInfoBox .beak.lower {
	bottom: 5px;
}
#merchantInfoBox .beak.top {
	top: 5px;
}

div.merchantDetails {
	float:left;
}
div.merchantDetails h2.name1 {
	font-size: 13px;
	font-weight: bold;
	color: #0c2074;
	padding-bottom: 5px;
}
div.merchantDetails div.distance {
	color: #666;
}
#merchantInfoBox ul {
	list-style: none;
	margin: 0 0 0 18px;
	padding: 0;
}
#merchantInfoBox div.links {
	margin-top: 10px;
	padding-top: 10px;
	border-top: solid 1px #ddd;
}
#merchantInfoBox div.links a {
	display: inline-box;
	margin: 0 8px;
}

h3.resultsTitle {
	background-color: #0c2074;
	color: #fff;
	text-align: center;
	font-size: 11pt;
	margin: 0;
	padding: 5px;
}

#filtersBox {
	border-bottom: 1px solid #999;
}

#filtersBox #filterToggleContainer {
	text-align: center;
	padding: 5px 0;
	background-color: #666;
	color: #fff;
	cursor: pointer;
}
#filtersBox #filterToggle {
	padding: 1px 3px;
	color: #fff;
}
#filtersBox #filterToggleSymbol {
	display: inline-block;
	padding-right: 1em;
	float: right;
}
#filtersBox #filters {
	display: none;
	background-color: #eee;
	padding: 8px;
	font-size: 9pt;
}
#filtersBox #filters ul {
	list-style: none;
	margin: 0 0 0 20px;
	padding: 0;
}
#filtersBox #filters div.filterCategory {
	font-weight: bold;
	margin-top: 10px;
}
#filtersBox #filters label.checked {
	font-weight: normal;
}
#filtersBox #merchantBrandsFilter , #filtersBox #vmsMerchantBrandsFilter {
	height: 100px;
	margin: 8px 0 8px 18px;
}

div#resultsList ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

div#resultsList ul li.merchantNotFound {
	margin:1em;
	font-size:1.3em;
}

div#resultsList ul li.merchantFound {
	padding: 8px 0 8px 8px;
	background-color: #fff;
	border-bottom: dotted 1px #ddd;
	-webkit-transition: background-color .25s linear;
}
div#resultsList li.merchantFound:hover, #resultsList div.merchantSelected {
	-webkit-transition: background-color 0s linear;
	background-color: #f3f7fd;
}
div#resultsList div.resultsLinks {
	padding: 5px 0;
	margin-left: 30px;
	clear: both;
}
div#resultsList div.resultsLinks a {
	display: inline-block;
	margin-right: 8px;
}
div#resultsList .MicrosoftMap.directionsPanel {
	padding-top: 0;
}

#legend {
	position: absolute;
	bottom: 0;
	left: 50%;
	width: 300px;
	color: #0C2074;
}
#legendTitleContainer {
	border-bottom: solid 1px #888;
}
#legendTitle {
	height: 18px;
	width: 85px;
	margin: 0 auto;
	margin-bottom: -1px;
	padding: 3px 0 0 0;
	text-align: center;
	background-color: #fff;
	border: solid 1px #888;
	border-bottom: 1px solid #fff;
	border-radius: 5px 5px 0 0;
	cursor: pointer;
	box-shadow: #666 0px 0px 10px 0px;
}
#legendSymbols {
	display: none;
	background-color: #fff;
	padding: 10px;
	border: solid 1px #888;
	border-top: none;
}
#legendSymbols ul {
	list-style: none;
	padding: 0;
	margin: 0;
}
#legendSymbols ul li img {
	margin-right: 8px;
}

div.locationPin {
	cursor: pointer;
}

div.shadowTop, div.shadowLeft {
    position: absolute;
    z-index: 3;
    padding: 0;
    margin: 0;
    overflow: hidden;
    margin-left: -250px;
}
div.shadowTop {
	background-image: url(/app/images/merchant_locator/map_shadow_top.png);
	background-repeat: repeat-x;
	height: 7px;
	width: 100%;
}
div.shadowLeft {
	background-image: url(/app/images/merchant_locator/map_shadow_left.png);
	background-repeat: repeat-y;
	width: 7px;
	height: 100%;
}


.cheapestBothResult, .cheapestDieselResult, .cheapestUnleadedResult, .unmatchedMerchantResult, .matchedMerchantResult, 
.unmatchedMaintenanceResult, .matchedMaintenanceResult, .unknownProductsResult {
	padding-left: 30px;
	background-repeat: no-repeat;
	background-position: 0 2px;
	height: 30px;
	float: left;
}
.cheapestBothResult {
	background-image: url(/app/images/merchant_locator/legend_lowest_both.gif);
}
.cheapestDieselResult {
	background-image: url(/app/images/merchant_locator/legend_lowest_diesel.gif);
}
.cheapestUnleadedResult {
	background-image: url(/app/images/merchant_locator/legend_lowest_unleaded.gif);
}
.unmatchedMerchantResult {
	background-image: url(/app/images/merchant_locator/legend_merchant_unmatched.gif);
}
.matchedMerchantResult {
	background-image: url(/app/images/merchant_locator/legend_merchant_matched.gif);
}
.unmatchedMaintenanceResult {
	background-image: url(/app/images/merchant_locator/legend_maintenance_unmatched.gif);
} 
.matchedMaintenanceResult {
	background-image: url(/app/images/merchant_locator/legend_maintenance_matched.gif);
}
.unknownProductsResult {
	background-image: url(/app/images/merchant_locator/legend_unknown_products.gif);
}

.productTitle {
	font-weight: bold;
	padding-top: 5px;
}

#resultsList1__LPanel, #resultsList1__SPanel {
	display: none;
}

.hiddenTextForScreenReadersOnly {
	position: absolute !important;
   	top: -9999px !important;
   	left: -9999px !important;
   	overflow: hidden;
}

.required {
    color: #CC0000;
    font-weight: bold;
    font-size: 10pt;
}

@media all and (max-width: 600px) {
	#resultsPanel {
		width: 0;
		display: none;
	}
	#map {
		padding-left: 0;
	}
	#header #logo {
		height: 45px;
		width: 122px;
	}
	#toolbar {
		float: right;
		margin-right: 5px;
		margin-top: 10px;
	}
	#searchBar {
		display: block;
	}
	h1.pageTitle {
		font-size: 11pt;
		margin-bottom: 3px;
		text-align: center;
	}
	#toolbar #newSearch, #toolbar #print, #legend {
		display: none;
	}
	#toolbar #modifySearch {
		border-radius: 5px;
		border: solid 1px #888;
	}
}

input#selectAllProducts:focus,input#selectAllMaintenance:focus,input#selectBrands:focus,input#vmsSelectAllMaintenance:focus,input#selectVMSBrands:focus {
	outline: 2px solid #ffffff;
}

input[type=checkbox]:focus{
	outline: 2px solid #636466;
}
	
.MicrosoftMap.dirSDK ol, .MicrosoftMap.dirSDK ul, 
.MicrosoftMap.dirSDK li, .MicrosoftMap.dirSDK table, 
.MicrosoftMap.dirSDK tr, .MicrosoftMap.dirSDK th, 
.MicrosoftMap.dirSDK td, .MicrosoftMap.dirSDK p, 
.MicrosoftMap .directionsPanel th, .MicrosoftMap 
.directionsPanel td {
    margin: 0;
    padding: 0;
    border: 0;
    border-collapse: collapse;
    border-spacing: 0;
    list-style: none;
}
.drMinsLabel, .drHoursLabel{
	font-size: 13px;
}
