/*Highway Garage*/

/*NOTE:For IE 5 (& 6?), it won't accept the horizontal centering method below w/out
the "text-align:center" attribute.  (This is actually a shortcoming of the browser.
See bluerobot.com/web/css/center1.html for an example.)
*/

/*NOTE:If borders are added to the side nav or the main content divs, then compensation needs
to be made in their widths.  For example, if a border is added to the #rightCol div, its
width would need to change from 600px to 599px.
*/

body{margin:20px;padding:0px;font-size:1em;text-align:center;
		font-family:arial,verdana,helvetica;min-width:760px; background-color:#cccccc;}

#wrapper{margin:0 auto;padding:10px;background:white;text-align:left;
		width:760px;min-width:760px;
		border:1px solid gray;}

/*NOTE: Be sure to compensate for image size in header.
*/
#header {background:#005784;height:80px;border-bottom:1px solid gray;}
#headerImgPic{margin:0;padding:0;float:left;margin-left:20px;margin-top:17px;
		border:1px solid gray;}
/*NOTE:margin and padding are set to 0 to avoid resizing issues for the header, most noticeable in IE.*/
#header h1{margin:0;padding:0;text-align:right;font-size:1.8em;color:white;
margin-right:10px;margin-top:10px;float:right;display:inline;}
#header h1 span{display:block;}
#header h1 span.h1Smaller{font-size:.8em;margin:0;padding:0;}

.headerInfo {float:right;margin-right:8px;font-size:.6em;}

a:link {color:#005784;text-decoration:underline;}
a:visited {color:gray;}
a:hover {text-decoration:none;color:#005784;}

#midSection{clear:both;margin:0px;padding:0;margin:10px 0px 10px 0px;min-height:450px;
		border-top:1px solid gray;border-bottom:1px solid gray;float:left;padding-bottom:10px;}

#leftCol {float:left;width:160px;margin-top:10px;}

#navWrapper{padding:0;margin:0;width:159px;background:white;border-right:1px solid gray;}
#navWrapper ul{margin:0;padding:0;padding-left:10px;font-size:.9em;font-weight:bold;
		padding-top:5px;padding-bottom:5px;}
#navWrapper li{padding-bottom:5px;padding-top:5px;list-style-type:none;}
#navWrapper a{text-decoration:none;color:#005784;font-weight:bold;}
#navWrapper a:visited{}
#navWrapper a:hover{color:#D43031;text-decoration:underline;}

/*NOTE: In order for the dynamic className change to work in JavaScript, the link must be pointed to very 
specifically, as it is below.
*/
#ulNav1 a, #ulNav1 li.highlighted a
      {}
#navWrapper li.highlighted a{color:#D43031;font-weight:bold;}

ul#ulNav1 li.highlighted a{color:#D43031;}

#news {width:135px;margin:10px 0px 30px 5px;border:1px solid gray;
		background:white;color:#D43031;font-size:.7em;padding:5px;}
#news h3{margin:0px 0px 3px 0px;padding:0px;font-size:1.2em;background:#D43031;
			line-height:1.5em;color:white;text-align:center;}
#news ul{margin:0;padding:0;margin-left:20px;padding:2px;border:none;}
#news li{list-style-type:none;font-weight:lighter;border:none;padding:0px 0px 5px 0px;
		list-style-image:url("../images/BulletStar_Small.gif");}


/*NOTE:Setting height explicitly to 100% is for IE6, but has no negative impact on the other browsers.*/
#rightCol{background-color:white;margin:0px;height:100%;
		padding-top:15px;min-width:600px;margin:10px 0px 0px 160px;}
#rightCol h2{padding:0px;margin:0;font-size:1.1em;margin:-5px 0px 0px 0px;line-height:1.2em;
			padding:5px 0px 5px 5px;}
#rightCol h3{padding:0px;margin:0;margin:20px 0px -10px 10px;font-size:.8em;}
#rightCol p{padding:0px 10px 0px 10px;font-size:.72em;margin-top:10px;line-height:1.5;
			text-align:justify;}
/*NOTE: Because of differences in IE and Firefox, first set the margin to 0, and
then position the ul using padding.  (For example, as below, "padding-left:10px".)
*/
#rightCol ul{margin:0;padding:0;font-size:.78em;margin:20px 0px 0px 30px;
		text-align:left;width:auto;list-style-type:none;
		list-style-image:url(../images/BulletStar_Small.gif);}
#rightCol li.liTitle{font-weight:bold;}

#rightCol ul.ulHours {list-style-type:none;text-align:center;font-size:.78em;
			list-style-image:none;margin:0;padding:0;margin-top:20px;}
#rightCol ul.ulHours li{display:inline;}

/*NOTE:"min-width" needed for IE7.  Wouldn't expand without this.*/
#rightCol ul#ulHoursMain {float:left;width:100%;min-width:100%;}

#rightCol #contactHours.ulHours {text-align:left;margin-left:10px;width:185px;}
#rightCol #contactHours.ulHours li{display:block;}

#rightCol ul.ulWhyCarStar{margin:0;padding:0;margin:-10px 0px 0px 50px ! important;
				margin:-15px 0px 0px 50px;}

#rightCol ol{margin:0;padding:0;font-size:.78em;margin:20px 0px 0px 35px;}
#rightCol ol.olInstructions li{margin-bottom:10px;}

#rightCol #contactMain {float:left;margin:0px 0px 0px 20px;font-weight:bold;font-size:1.2em;}
#rightCol #contactMain ul{list-style-image:none;width:300px;margin-top:0px;text-align:center;}
#rightCol #contactMain li{float:left;width:100%;}
#rightCol #contactMain #liMainPhone{font-size:2em;}

#pic{margin:0;padding:0;text-align:center;}
.picRight{float:right;margin:0;padding:0;margin:10px;
		border:1px solid gray;}
.picLeft{margin:0;padding:0;border:1px solid gray;margin:10px 10px 0px 10px;}	

#footer{clear:both;color:white;text-align:center;border-top:1px solid gray;
	background:#005784;}
#ulFooter{margin:0;padding:0;font-size:.7em;padding-top:10px;padding-bottom:10px;}
#ulFooter li{display:inline;}

/*NOTE:Because the element with the "copyright" class is outside of the main "wrapper", it must
be styled as such.  (For example, the margin must be set as the wrapper is to center it.)  
*/
.copyright {width:760px;margin:0 auto;padding:5px;font-size:.6em;text-align:left;}
.copyright a:link{font-weight:bold;color:black;}
.copyright a:visited{color:black;}
.copyright a:hover{text-decoration:none;}


#contactUs {float:right;margin:0px 15px 10px 0px;display:inline;}
#contactForm{}
#contactForm fieldset{margin:0;padding:0px 10px 0px 20px;width:325px;border:1px solid gray;}
#contactForm legend{margin:0;padding:0;color:black;font-weight:bold;margin-left:60px;
			font-size:.72em;}
#contactForm label{display:block;font-size:.71em;}
#contactForm div.buttonContainer input{font-size:.8em;}
#contactForm input, textarea{border:1px solid gray;font-size:.71em;
				font-family:arial,verdana,helvetica;}
#contactForm textarea{width:295px;}
#contactInfo{}
#contactInfo .directions{}
#contactInfo .contactName{}
.left{float:left;}
.right{float:right;margin-right:30px;display:inline;}
.buttonContainer{clear:both;padding:15px 0px 15px 0px;text-align:center;}
.textName{width:130px;}
.contactTitle{font-weight:bold;}
/*NOTE:In order to compensate for padding and margin differences in Firefox, IE 6+, and Safari, this filler div was added for spacing in the fieldset.*/
#filler {height:15px;}

#leftCol ul#ulIcons{margin:0;padding:0;margin-top:20px;width:100%;text-align:center;}
#leftCol ul#ulIcons li{list-style-type:none;margin:0px 0px 10px 0px;}
#commercial{float:left;padding-left:10px;}
#commercial img{border:1px solid gray;}

/*NOTE:"table-layout:fixed" forces IE to use the proper width.  Also evens out columns
in Firefox.*/
#rightCol table.tblRelatedSites {margin-left:30px;width:500px;table-layout:fixed;}
#rightCol table.tblRelatedSites img{border:none;}
#rightCol table.tblRelatedSites th{background:red;}
#rightCol table.tblRelatedSites tr{}
#rightCol table.tblRelatedSites td{vertical-align:bottom;padding:0px 40px 35px 40px;
			text-align:center;}
#rightCol table.tblRelatedSites p{margin:0;padding:0;text-align:center;
					margin-top:3px;}
#rightCol h3.h3TableHeader{margin:0;padding:0;font-weight:bold;padding:5px;
				text-align:center;margin:10px 10px 20px 10px;}

#navExtraInfo {float:right;width:175px;margin:0;padding:0;margin:5px 0px 10px 10px;
			padding:5px;border:1px solid gray;}
#navExtraInfo ul{margin:0;padding:0;padding:10px 0px 0px 20px;}
#navExtraInfo li{margin-bottom:5px;}
#navExtraInfo p{margin:0;padding:0;color:white;background:#005784;text-align:center;}

p#trustCarstar {color:#D43031;font-weight:bold;font-size:1.2em;}

#rightCol #testimonials{margin-top:15px;}
#rightCol p.testimonial{margin:0;padding:0;margin:0px 10px 0px 10px;}
#rightCol p.customerName{margin:0;padding:0;margin:0px 10px 15px 10px;font-weight:bold;}