/*
 *
 *  @Id: locate.css
 *  @Description: CSS used for the Locate Salons and Distributors Page on rusk1.com
 *  @Author: Tony Collings
 *  @Version: 1.0
 * 	@Date: Mar 2009
 *  
 */
 
/*	core.css OVERRIDES
	------------------------------------------------------------------------------------- */
	ul.forms label {width: 80px;}
	/*.main_stage_right { background:#000;}  NOTE: already set in core.css -- Width = 377px and Height = 363px */
	/*.decoration_top { height: 14px; _height: 19px; background: #000 url('img/main_stage/top_right_decoration.jpg') top right no-repeat; clear: both; margin-top: 6px; width: 377px; } NOTE: moved to core.css */
	/*.decoration_bottom {height: 17px; background: #000 url('img/main_stage/bottom_right_decoration.jpg') top right no-repeat;  clear: both;  margin-bottom: 6px; }  NOTE: moved to core.css */
	/*.desc_content { *margin-top: -5px; background-image: none; background-color: #fff; position:relative; top:0px; left:0px; width: 363px; height: 320px; color: #000; font-size: 11px; } NOTE: moved to core.css */
	/*.desc_content .banner {top: 0px; background-color: #efefef; color: #bb5370; }  NOTE: moved to core.css */
	/*.desc_content .bannertext {color: #8b1b43; text-transform: uppercase; font-weight: normal; font-size: 16px; }  NOTE: moved to core.css */


/*	LAYOUT
	------------------------------------------------------------------------------------- */
	
	/*div.left_col_content {background-color: #000; height: 282px; padding: 10px; *height: 302px; *margin-top: -3px; color: #fff; font-size: 11px;  } /* 300px - 20px padding + 2px (border-width?) NOTE: Moved to core.css */
    div.left_col_content.form { _padding: 10px 10px 0px 10px; _height: 292px;  }
	span.searchRadiusTxt {color: #525252; font-size: 10px; }
	
	div#locations {width: 345px; /* .disc_content.width - 20px locateContentWrapper.padding */ height: 250px; overflow: auto; margin: 5px 0 0 0; padding: 0; border: 1px solid #f3f3f3;}
	div.location {float: left; width: 150px; padding: 5px;  }
	
	div.breadcrumbs, div.search_results { padding-left: 4px;  height: 12px; display: block; }
	div.search_results {font-weight: stronger; }
	div.locateContentWrapper { padding: 8px 0 0 10px; font-size: 11px;  }
	
	form#addressLocate .fixwidth {width: 150px; }
	form#addressLocate label {color: #525252; text-transform: uppercase; }
	/*
	form#addressLocate .border {border: 1px solid #f1f1f1;}	
	*/
	
	.errors {color: #dc2d7e; }
	ul.errors {margin: 0px; padding: 0px 15px; list-style-type: square; }
	input.errors, select.errors, textarea.errors {border: 2px solid #d12a62; color: #dc2d7e; font-weight: bold; }
	
	/* Data 'Grid' Styling */

	.dataRowAlt{background-color: #efefef; }
	.dataRowNormal{}
	.dataGridRow {clear: both; }
	
	span.multi-distributor {color: #535353; }
	div.distributor-tooltip {background-color: #44444a; color: #fff; text-align: left; /*border: 1px solid #961541;*/ padding: 8px; font-size: 10px; width: 150px; } /* The Tooltip popup. Injected via. Mootools

	
		
/*	Location popup 
	---------------------------------------------------------------------- */
	div.print {clear: both; text-align: right; border-bottom: 1px solid #efefef; padding: 8px; padding-top: 0px; margin: 0px; margin-top: -8px; }
	div.locationColWrapper {width: 697px; }
	div.locationLeft {width: 260px; float: left;  }
	div.locationRight {width: 410px; float: right; padding: 8px;  }		
	h1.sectionTitle {margin: 0px; padding: 8px; display: block; line-height: 110%; color: #982149; font-size: 12px; background: #d4d4d6 url('img/locationTitleGradient.jpg') top left repeat-x; border: 1px solid #c3c3c3;border-left: none;  }
	div.sectionContent { padding: 8px; background-color: #f6f6f6; font-size: 11px;   }
     form#getDirections { padding: 0; margin: 0;  /* remove extra space in IE6/7 */ }
		
			
	/* Google Map Stuff */
	div#google_map {width: 408px; height: 408px; border: 1px solid #d1cdd3; /* Note width = 410px (+2px border)*/ }		
	/* These styles override styling set by Google. Attribute names CANNOT be altered */
	.googledir,
	.googledir table,
	.googledir td {font-size: 11px; }
	#loadingDirections img {vertical-align: middle; }
	#loadingDirections {display: block; margin: 4px; }
	input#resetButton {display: block; margin: 5px; }
	
	p.noMap {margin-left: 10px; }
	
/*	AJAX Content
	------------------------------------------------------------------------------------- */
	
	/* Category Popup (CLEAN) */
	#ajaxContent{ width: 728px; text-align: left; margin: 0px auto; background-color: #fff; }
	#popupWrapper {width: 728px; padding: 3px; background-color: #fff; font-size: 12px;  }
	/* CALC : Width = 728 - (6px padding(inherited) + 2px margin) = 8) = 720px. Remember your box model !!(http://www.w3.org/TR/CSS2/box.html) !! */
	#popupContent {width: 720px; border: 3px solid #2f2b2b; margin: 1px; background-color: #fff; } 
	#logo_close_container { float:left; width:720px; height:57px; background:url('../images/popup/right_bdr_top.gif') no-repeat top right; margin:0px; padding:0px;}
		.logo { width:160px; height:57px; margin:0px; padding:0px; float:left;}
		.close_btn { width:52px; height:16px; margin:15px 20px 0px 0px; display:block; float:right;}
	
	/* CALC : Width = 720 - (border-left 13px + border-right 10px) = 23) = 697px.
	/* NOTE : IE doesn't include borders in the box model so no need to add these ... why? because it's stupid ! */
	.main_content_container,
	#zoomedProductImage { width:697px; /*_width: 720px;*/ border-left:#BCBDC1 13px solid; border-right:#BCBDC1 10px solid; height:auto; float:left; margin:0px; padding:0px 0px -20px 0px;}
	
	.bottom_corners { 
		/*_width: 720px;*/
		_margin-top:-10px ;
		clear: both; 
		border-left:#BCBDC1 13px solid; 
		height:11px; 
		line-height:11px; 
		background:url('../images/popup/right_bdr_corner.gif') no-repeat bottom right;
	}
	div.ajaxLoading {text-align: center; font-size: 12px; padding: 20px; padding-top: 50px; }