/*resets*/
* 						{ margin: 0; padding: 0; } /* reset */
html, body				{ height: 100%; width: 100%; background: #fff top center; 
							font-size: 100%; line-height: 1.125em; font-family: Arial, Helvetica, sans-serif; 
							color: #787878;}
ul						{ list-style: none outside; padding: 0; }
ol						{ list-style: none outside; padding: 0; }
a						{ outline: none; border: none; text-decoration: none; }
a img					{ outline: none; border: none; }
img						{ vertical-align: middle; }
table					{ border-collapse: collapse; }
fieldset				{ border: none; }

/*misc*/
.clear						{ clear: both; }
.pad						{ margin-bottom: 1em; }
.left						{ float: left; }
.right						{ float: right; }
.centre						{ margin: 0 auto; display: block; }
div.hr 					{ margin: 10px 0; border: none; border-top: 1px solid #999999; clear: both; }
div.hr hr 				{ display: none; }

/*typo*/
input, textarea					{ color: #787878; font-size: 1.125em; }
h1								{ }
h2								{ font-size: 1.375em; line-height: 1.25em; color: #787878; display: block; width: 100%; border-bottom: 1px solid #787878; margin-bottom: 0.5em; }
h3								{ font-size: 1.125em; line-height: 1.125em; font-weight: normal; color: #cc3333; margin-bottom: 0.3em; }
h4								{ font-size: 1em; line-height: 1.5em; font-weight: normal; margin-top: 15px; color: #252525; }
p, td							{ font-size: 0.75em; margin-bottom: 0.5em; text-align: justify; }
li								{ font-size: 0.75em; }
a								{ color: #787878; }
a:hover							{ border-bottom: 1px solid #787878; }
a img							{ border: none; }

/*pages*/
.wrapper						{ width: 984px; padding: 0; margin: 0 auto; position: relative; }
#footer							{ height: 135px; background: url(../images/hpfind_footer.png) repeat-x 0 0; margin-top: 20px; padding-top: 10px; text-align: right; }
#footer #foot_wrap, #content #content_wrap	{ padding: 0 10px; }						
#header h1						{ display: block; height: 142px; width: 322px; margin-left: -20px; text-indent: -9999px; overflow: hidden; background: url(../images/HPFInd_logo.png) no-repeat 0 0; }
body#home						{ background: url(../images/HPFInd_bg_home.png) repeat-x 0 0; }
body							{ background: transparent url(../images/HPFInd_bg_pages.png) repeat-x 0 0; }
#content						{ margin-top: 24px; }

/*tailgate pages*/
.images		{ float: left; width: 250px; }
.images img { margin: 10px 0; }
.details	{ float: left; width: 694px; margin-left: 20px; }
.details ul { float: left; width: 308px; margin-left: 20px; margin-right: 10px; }
.details ul li { list-style: disc inside; }
.alt_row	{ background: #CCCCCC; }
.tailgate	{ margin-bottom: 5px; }
.tailgate h3 a	{ color: #cc3333; }

/*main menu*/
#main_menu ul					{ position: absolute; top: 110px; right: 20px; }
#main_menu ul li				{ display: inline; margin-left: 15px; font-size: 1em; font-weight: bold; }
#main_menu ul li a				{ color: #000; padding-bottom: 10px; }
#main_menu ul li a:hover		{ color: #336699; border: 0; }
#home #m_home a, 
#tailgates #m_tailgates a, 
#service #m_service a, 
#contact #m_contact a, 
#warranty #m_warranty a 		{ background: url(../images/down_1.png) no-repeat center 19px; color: #336699; }

/*contact*/
.c_308		{ width: 308px; float: left; padding: 0 10px; }
form .btn_enquiry		{ float: left; display: block; height: 27px; width: 132px; text-indent: -9999px; overflow: hidden; margin: 10px 0 5px 0; border: none; background: url(../images/hpfs_buttons.png) no-repeat 0 0; }
form .btn_enquiry:hover	{ background-position: 0 -30px; border: none; }
label					{ display: block; font-size: .75em; margin-top: 4px; }
#contact_form input, #contact_form textarea	{ width: 252px; border: 1px solid #999999; font-size: .875em; padding: 3px; outline: 0; font-family: Arial, Helvetica, sans-serif; }
#contact_form input:focus, #contact_form textarea:focus	{ border: 1px solid #cc3333; }
#contact_form textarea			{ height: 100px; }
#contact_form p.thanks			{ display: block; color: #999999; }
label.error 			{ color: #cc3333; margin-top: -3px; }

/*home*/
.col472l			{ width: 471px; margin-right: 0; padding: 0 10px 0 10px; float: left; }
.col472r			{ width: 472px; margin-left: 0; padding: 0 10px 0 10px; float: left; border-left: 1px solid #787878; }
#home #content img	{ float: left; padding: 10px; }

/*scroller on home page*/
#hl						{ position: relative; height: 190px; width: 964px; margin: 0 auto; margin-top: 12px; }
#hl .next, #hl .prev	{ position: absolute; top: 75px; cursor: pointer; filter: alpha(opacity=30); opacity: 0.3;}
#hl .next:hover, #hl .prev:hover	{ background: #c4c4c4; filter: alpha(opacity=100); opacity: 1.0; }
#hl .next				{ right: 10px; }
#hl .prev				{ left: 10px; }
#sections				{ overflow: hidden; width: 800px; height: 190px; clear: left; margin: 0 auto; }
#sections ul 			{ width: 5000px; }
#sections li 			{ float: left; width: 800px; }
#sections img 			{ width: 390px; float: left; margin-right: 20px; }
#sections h3			{ color: #fff; font-size: 2em; margin: 25px 20px 10px 0; }
#sections p				{ color: #fff; font-size: 1.2em; }
#sections p a 			{ color: #fff; }
#sections p a:hover 	{ border-bottom: 1px solid #fff; }
