﻿/* GENERAL STYLES */
body				{ font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 100%; color: #000000; text-align: center; background: #666666; margin: 25px 0px 25px 0px; }
h1					{ font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 90%; font-weight: bold; color: #336600; margin: 20px 0px 20px 0px; }
h2					{ font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 80%; font-weight: bold; color: #336600; margin: 20px 0px 9px 0px; }
h2.extra			{ margin: 20px 0px 15px 0px; }
p					{ font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 75%; color: #000000; margin: 0px 0px 9px 0px; line-height: 1.5em; }
p.small				{ font-size: 70%; color: #333333; margin: 0px 0px 6px 0px; line-height: 1.4em; }
ul					{ margin: 0px 0px 12px 30px; padding: 0px 0px 1px 0px; /* Need padding for cross-browser differences */ }
li					{ font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 75%; color: #d31145; margin: 0px 0px 3px 0px; text-align: left; line-height: 1.5em; }
li span				{ color: #000000; }
a:link, a:visited, a:active	{ color: #000000; text-decoration: none; }
a:hover				{ color: #46461C; text-decoration: underline; }
span.red			{ color: #d31145; }
span.bigger			{ font-size: 130%; }
img.fright			{ position: relative; float: right;  margin: 0px 0px 9px 25px; }
img.fleft				{ position: relative; float: left;  margin: 0px 20px 9px 0px; }


/* LAYOUT STYLES */
#outer				{ position: relative; width: 740px; margin-right: auto; margin-left: auto; border: 1px solid #666666; background: url(images/header.gif) center top no-repeat; }
#header				{ position: relative; height: 145px; padding: 32px 0px 0px 0px; }
html>body #header	{ height: 113px; }
#banner				{ position: relative; height: 135px; background: url(images/banner.gif) top left no-repeat; }
#bannerfrog			{ position: absolute; bottom: -1px; left: 50px; width: 137px; height: 123px; background: url(images/header-frog.png) bottom left no-repeat; }
#tipofthemonth		{ position: absolute; top: 20px; left: 246px; }
#tipofthemonth p	{ text-align: left; color: #FFFFFF; margin: 0px 50px 9px 0px; line-height: 1.4em; }
#usercontent		{ position: relative; background: url(images/page.gif) center top repeat-y; padding: 0px 10px; }
#maincontent		{ position: relative; text-align: left; background: url(images/copybackground.gif) left top repeat-x; padding: 10px 40px 20px 40px; }
#footer				{ position: relative; padding: 16px 0px 0px 0px; text-align: left; background: url(images/footer.gif) bottom left no-repeat; height: 145px; }
html>body #footer	{ padding: 10px 0px 0px 0px; height: 135px; }
#footer p			{ font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif; font-size: 70%; color: #666666; margin: 8px 50px 0px 50px; text-align: left; }
#footer a			{ color: #666666; }
#footer span		{ float: right; }
#footerfrog			{ position: absolute; bottom: 9px; right: 8px; width: 220px; height: 91px; background: url(images/footer-frog.png) bottom right no-repeat; }
html>body #footerfrog	{ bottom: 10px; right: 10px; }


/* NAV STYLES */
#nav				{ position: relative; width: 720px; height: 42px; background: url(images/tabs.gif) 0px 0px no-repeat; margin: 0px; padding: 0px 0px 0px 24px; z-index: 2; }
html>body #nav		{ width: 696px; }
#nav span			{ display: none; }
#nav li, #nav a		{ height: 42px; display: block; }
#nav li				{ float: left; list-style: none; margin: 0px; }
#nav-home						{ width: 70px; }
#nav-sage-training				{ width: 119px; }
#nav-payroll-management			{ width: 172px; }
#nav-book-keeping				{ width: 123px; }
#nav-why-use-us					{ width: 107px; }
#nav-contact					{ width: 81px; }
#nav-home a:hover				{ background: transparent url(images/tabs.gif) -24px -42px no-repeat; }
#nav-sage-training a:hover		{ background: transparent url(images/tabs.gif) -94px -42px no-repeat; }
#nav-payroll-management a:hover	{ background: transparent url(images/tabs.gif) -213px -42px no-repeat; }
#nav-book-keeping a:hover		{ background: transparent url(images/tabs.gif) -385px -42px no-repeat; }
#nav-why-use-us a:hover			{ background: transparent url(images/tabs.gif) -508px -42px no-repeat; }
#nav-contact a:hover			{ background: transparent url(images/tabs.gif) -615px -42px no-repeat; }
#home #nav-home a:visited 								{ background: transparent url(images/tabs.gif) -24px -84px no-repeat; }
#sage-training #nav-sage-training a:visited 			{ background: transparent url(images/tabs.gif) -94px -84px no-repeat; }
#payroll-management #nav-payroll-management a:visited	{ background: transparent url(images/tabs.gif) -213px -84px no-repeat; }
#book-keeping #nav-book-keeping a:visited 				{ background: transparent url(images/tabs.gif) -385px -84px no-repeat; }
#why-use-us #nav-why-use-us a:visited 					{ background: transparent url(images/tabs.gif) -508px -84px no-repeat; }
#contact #nav-contact a:visited 						{ background: transparent url(images/tabs.gif) -615px -84px no-repeat; }
