@import "template_base.css";
@import "navigation.css";
@import "jquery.fancybox.css";
@import "common.css";

body {
  
}

.app {
  vertical-align:top;
  padding-left:5px;
}

/* directions */

#map_area {
	margin: 20px 0 20px 0px;
}

#map_panel {
	width: 354px;
	float: left;
	border: 2px solid #C5CED4;
	margin-right: 5px;
}

#map_driving_panel {
	width: 378px;
	float: left;
	border: 2px solid #C5CED4;
	height: 254px;
	color: #333;
}

#map {
	width: 350px;
	height: 250px;
	padding: 1px;
	border: 1px solid #fff;
}

#main #map h2 {
	font-size: 1em;
	background: none;
	width: auto
}

#direction_form input.button {
	clear: both;
	margin: 10px 10px;
	display: block;
	background:transparent url(/images/bg_button_callout_lg.gif) no-repeat scroll 0 0;
	border:0 none;
	color:#FFFFFF;
	height:25px;
	padding-bottom:3px;
	width:96px;
}

#direction_form label {
	margin: 5px 0 3px 10px;
}

#direction_form input.form-field {
	clear: both;
	display: block;
	margin: 0 5px 10px 10px;
	width: 250px;
}

#main #map_driving_panel h3 {
	margin: 0 0 10px;
	font-size: 1.3em;
	color: #333;
	background: #c5ced4;
	padding: 10px;
}

#map_driving_panel p {
	font-size: 1.2em;
	padding: 10px;
}

#steps {
	clear: both;
	padding-left: 0px !important;
}

input#contactSubmit {
  background:transparent url(/images/bg_button_callout.gif) no-repeat scroll 0 0;
  border:0 none;
  color:#FFFFFF;
  height:25px;
  width:66px;
  margin-top:10px;
  padding-bottom:3px;
}


-----------------------------------------------------------*/
/* Promo */

#hero span.address {
	display: block;
	position: absolute;
	top: 4px;
	right: 50px;
	color: #fff;
	font-size: 1.3em;
}

/* Easy Slider */

#hero {
	position: relative;
	width:800px;
	height:350px;
	margin: 0 auto;
}

#slider ul, #slider li{
	margin:0;
	padding:0;
	list-style:none;
}
	
#slider, #slider li{ 
	/* 
		define width and height of container element and list item (slide)
		list items must be the same size as the slider area
	*/ 
	width:800px;
	height:347px;
	overflow:hidden; 
}

span#prevHero a,
span#nextHero a {
	width: 30px;
	height: 48px;
	position: absolute;
	top: 140px;
	display: block;
	cursor: hand;
}

span#prevHero a {
	left: 5px;
	background: url("/images/arrow_left.gif") no-repeat;
}
span#nextHero a {
	right: 5px;
	background: url("/images/arrow_right.gif") no-repeat;
}