@charset "utf-8";
body { 
font-family: verdana, tahoma, san-serif; 
font-size: .85em;
background: url(../img/bg.png) ;
	background-position:top left;
	background-repeat: no-repeat;
background-color : #fff; 
margin: 0px; 
padding: 0px; 
color: #333;
}

#container {
width: 984px;
height: auto;
margin: 0px; 
padding: 0px; 
border: #000 solid 0px;
}

#left {
float: left;
padding-left: 0px;
width: 262px;
height: auto;
margin: 0;
border: #000 solid 0px;
}

#left p {
margin-left: 20px;
margin-right: 20px;
}

#content {
float: right;
width: 722px;
height: auto;
margin: 0px;
padding: 0px;
border: #000 solid 0px;
}

#content p {
margin-left: 20px;
margin-right: 20px;
}

#content table {
margin-left: 20px;
}

#content textarea {
margin-left: 20px;
height: 100px;
width: 670px;
}

object {
outline: none;
}

a:active
{
  outline: none;
}

:focus
{
  -moz-outline-style: none;
}


#header {
position: relative;
width: auto;
height: 119px;
margin: 0;
padding: 0;
border: #000 solid 0px;
text-align: bottom;
}

#topnav {
position: relative;
background-color : #4490ff; 
width: 722px;
height: 29px;
padding: 0px;
margin-top: 80px;
border: #000 solid 0px;
z-index: 1000;
}

#main {
position: relative;
margin: 0;
padding: 0;
border: #fff solid 1px;
}

table {
color: #000;
}

h1  {
color:  #4490ff;
font-family: Trebuchet MS, verdana, tahoma, san-serif;
font-size: 2em;
font-weight: bold;
letter-spacing: .05em;
margin-left: 20px;
margin-right: 20px;
padding: 10px; }

h2  {
color:  #4490ff;
font-family: Trebuchet MS, verdana, tahoma, san-serif;
font-size: 1.5em;
font-style: italic;
font-weight: bold;
margin-left: 20px;
margin-right: 20px;}

h3  {
color:  #4490ff;
font-family: Trebuchet MS, verdana, tahoma, san-serif;
font-size: 1.25em;
font-style: italic;
font-weight: bold;
margin-left: 20px;
margin-right: 20px;}

h4  {
font-family: Trebuchet MS, verdana, tahoma, san-serif;
font-size: 1em;
font-weight: bold;
margin-left: 20px;
margin-right: 20px;}

hr     {
height:1px;
width:200px;}

p   {
top: 1em;
bottom: 1em;
line-height: 1.25em;}


small  {font-size: 80%;}

li   {
line-height: 1.5em;
margin-left: 20px;}


a   {
text-decoration: none;
color : #1d79ff;
}

a:hover { 
color : #66ccff; 
font-weight: bold;
}

a:active { 
color : #66ccff; 
}

a:visited { 
color : #1d79ff; 
}

/** TABLE STYLES **/

table.rates { width: 560px;
 background:#e2f0fd;
 border:1px solid #4490ff;
 border-collapse:collapse;
 color:#fff;
 font:normal 12px verdana, arial, helvetica, sans-serif;
}

table.rates td, th { color:#0066cc;
 padding:.4em;
}
table.rates tr { border:1px dotted #4490ff;
}
thead.rates th, tfoot.rates th { background-color:#4490ff;
 color:#FFFFFF;
 padding:3px 10px 3px 10px;
 text-align:left;
 text-transform:uppercase;
}
tbody.rates  td a { color:#0066cc;
 text-decoration:none;
}
tbody.rates  td a:visited { color:gray;
 text-decoration:line-through;
}
tbody.rates  td a:hover { text-decoration:underline;
}
tbody.rates  th a { color:#0066cc;
 font-weight:normal;
 text-decoration:none;
}
tbody.rates  th a:hover { color:#0066cc;
}
tbody.rates  td+td+td+td a { 
 background-position:left center;
 background-repeat:no-repeat;
 color:#03476F;
 padding-left:15px;
}
tbody.rates  td+td+td+td a:visited { 
 background-position:left center;
 background-repeat:no-repeat;
}
tbody.rates  th, tbody td { text-align:left;
 vertical-align:top;
}

.odd { background:#fdf8d1;
}

tbody.rates  tr:hover { background:#fff;
 border:1px solid #4490ff;
 color:#000000;
}


/** rollover for sidenav start pages **/

.sidenav a {
	display: block;
	text-indent: -9999px;
	margin: auto auto 10px auto;
	cursor: pointer;
	outline: transparent solid 0px;
}
.sidenav3 a {
	visibility: visible;
	display: block;
	text-indent: 0px;
	margin: auto auto 10px auto;
	cursor: pointer;
	outline: transparent solid 0px;
}

#portfolio1 a {
	height: 60px; 
	width: 205px; 
	background: url(../img/sidenav_portfolio1.gif) no-repeat left top;
}
#portfolio1 a:hover{
	background: url(../img/sidenav_portfolio1_r.gif) no-repeat left top;
}
#portfolio1 a.selected{
	background: url(../img/sidenav_portfolio1_r.gif) no-repeat left top;
}

#portfolio2 a {
	height: 60px; 
	width: 205px; 
	background: url(../img/sidenav_portfolio2.gif) no-repeat left top;
}
#portfolio2 a:hover{
	background: url(../img/sidenav_portfolio2_r.gif) no-repeat left top;
}
#portfolio2 a.selected{
	background: url(../img/sidenav_portfolio2_r.gif) no-repeat left top;
}

#start1 a {
	height: 60px; 
	width: 205px; 
	background: url(../img/sidenav_start1.gif) no-repeat left top;
}
#start1 a:hover{
	background: url(../img/sidenav_start1_r.gif) no-repeat left top;
}
#start1 a.selected{
	background: url(../img/sidenav_start1_r.gif) no-repeat left top;
}

#start2 a {
	height: 60px; 
	width: 205px; 
	background: url(../img/sidenav_start2.gif) no-repeat left top;
}
#start2 a:hover{
	background: url(../img/sidenav_start2_r.gif) no-repeat left top;
}
#start2 a.selected{
	background: url(../img/sidenav_start2_r.gif) no-repeat left top;
}
#start3 a {
	height: 60px; 
	width: 205px; 
	background: url(../img/sidenav_start3.gif) no-repeat left top;
}
#start3 a:hover{
	background: url(../img/sidenav_start3_r.gif) no-repeat left top;
}
#start3 a.selected{
	background: url(../img/sidenav_start3_r.gif) no-repeat left top;
}
#start4 a {
	height: 60px; 
	width: 205px; 
	background: url(../img/sidenav_start4.gif) no-repeat left top;
}
#start4 a:hover{
	background: url(../img/sidenav_start4_r.gif) no-repeat left top;
}
#start4 a.selected{
	background: url(../img/sidenav_start4_r.gif) no-repeat left top;
}
#start5 a {
	height: 60px; 
	width: 205px; 
	background: url(../img/sidenav_start5.gif) no-repeat left top;
}
#start5 a:hover{
	background: url(../img/sidenav_start5_r.gif) no-repeat left top;
}
#start5 a.selected{
	background: url(../img/sidenav_start5_r.gif) no-repeat left top;
}
#start6 a {
	height: 60px; 
	width: 205px; 
	background: url(../img/sidenav_start6.gif) no-repeat left top;
}
#start6 a:hover{
	background: url(../img/sidenav_start6_r.gif) no-repeat left top;
}
#start6 a.selected{
	background: url(../img/sidenav_start6_r.gif) no-repeat left top;
}
#stopwatch a {
	height: 60px; 
	width: 205px; 
	background: url(../img/button_stopwatch.gif) no-repeat left top;
}
#stopwatch a:hover {
	background: url(../img/button_stopwatch_r.gif) no-repeat left top;
}

#scripts a {
	height: 60px; 
	width: 205px; 
	background: url(../img/button_scripts.gif) no-repeat left top;
}
#scripts a:hover {
	background: url(../img/button_scripts_r.gif) no-repeat left top;
}

#spokes a {
	height: 60px; 
	width: 205px; 
	background: url(../img/button_spokes.gif) no-repeat left top;
}
#spokes a:hover {
	background: url(../img/button_spokes_r.gif) no-repeat left top;
}
#backgrounds a {
	height: 60px; 
	width: 205px; 
	background: url(../img/button_backgrounds.gif) no-repeat left top;
}
#backgrounds a:hover {
	background: url(../img/button_backgrounds_r.gif) no-repeat left top;
}
#email a {
	height: 60px; 
	width: 205px; 
	background: url(../img/button_email.gif) no-repeat left top;
}
#email a:hover {
	background: url(../img/button_email_r.gif) no-repeat left top;
}
#ratebutton a {
	height: 60px; 
	width: 205px; 
	background: url(../img/button_rates.gif) no-repeat left top;
}
#ratebutton a:hover {
	background: url(../img/button_rates_r.gif) no-repeat left top;
}
#print a {
	height: 60px; 
	width: 205px; 
	background: url(../img/button_print.gif) no-repeat left top;
}
#print a:hover {
	background: url(../img/button_print_r.gif) no-repeat left top;
}

#walk a {
	height: 60px; 
	width: 205px; 
	background: url(../img/button_walkon.gif) no-repeat left top;
}
#walk a:hover {
	background: url(../img/button_walkon_r.gif) no-repeat left top;
}

#portfolio1 a {
	height: 60px; 
	width: 205px; 
	background: url(../img/sidenav_portfolio1.gif) no-repeat left top;
}
#portfolio1 a.selected {
	height: 60px; 
	width: 205px; 
	background: url(../img/sidenav_portfolio1_r.gif) no-repeat left top;
}
#portfolio1 a:hover {
	background: url(../img/sidenav_portfolio1_r.gif) no-repeat left top;
}

#portfolio2 a {
	height: 60px; 
	width: 205px; 
	background: url(../img/sidenav_portfolio2.gif) no-repeat left top;
}
#portfolio2 a.selected {
	height: 60px; 
	width: 205px; 
	background: url(../img/sidenav_portfolio2_r.gif) no-repeat left top;
}
#portfolio2 a:hover {
	background: url(../img/sidenav_portfolio2_r.gif) no-repeat left top;
}
/** end rollover for start buttons **/

#nav {
margin:0;
padding: 0;
border: 0;
font-size: 10px;
line-height: 1.3em;
background-color : #4490ff; 
}

#nav ul { /* all lists */
	padding: 0;
	margin: 0;
	list-style: none;
}

#nav a {
	display: block;
	padding: 0;
	margin: 0;
}

#nav li { /* all list items */
	float: left;
	padding: 0;
	margin: 0;
	list-style: none;
}

#nav li ul { /* second-level lists */
	position: absolute;
	background: #ffe57f;
	padding: 0px;
	margin: 0px;
	line-height: 1.3em;
	left: -999em; /* using left instead of display to hide menus because display: none isn't read by screen readers */
}

#nav li.start { /* second-level lists */
 position: relative;
	background: #ffe57f;
	padding: 0px;
	margin: 0px;
	width: 163px;
	padding-left: 10px;
	line-height: 1.3em;
}

#nav li.gettingstarted { /* second-level lists */
 position: relative;
	background: #ffe57f;
	padding: 0px;
	margin: 0px;
	width: 173px;
	line-height: 1.3em;
}

#nav li.port { /* second-level lists */
 position: relative;
	background: #ffe57f;
	padding: 0px;
	margin: 0px;
	width: 108px;
	line-height: 1.3em;
	padding-left: 10px;
	line-height: 1.3em;
}

#nav li.portfolio { /* second-level lists */
 position: relative;
	background: #ffe57f;
	padding: 0px;
	margin: 0px;
	width: 118px;
	height: 29px;
	line-height: 1.3em;
}


#nav li:hover ul, #nav li.sfhover ul { /* lists nested under hovered list items */
	left: auto;
	padding: 0;
	margin: 0;
}



/**========= TOP NAV STYLES  ========**/
 
ul.dropdown-horizontal li img {
display:block;
border:none;
}

/**========= HOME  ========**/
#nav li.home {
  background-image: url(../img/topnav_home_r.gif);
  background-repeat: no-repeat;
}

#nav  li.home a:hover img {
  visibility: hidden;
}

/**====== PORTFOLIO ======== **/
#nav  li.portfolio {
  background-image: url(../img/topnav_portfolio_r.gif);
  background-repeat: no-repeat;
}

#nav  li.portfolio a:hover img {
  visibility: hidden;
}    

/**===== GETTING STARTED ===== **/
   
#nav  li.gettingstarted {
  background-image: url(../img/topnav_start_r.gif);
  background-repeat: no-repeat;
}

#nav  li.gettingstarted a:hover img {
  visibility: hidden;
} 

/**===== RATES ===== **/
   
#nav  li.rates {
  background-image: url(../img/topnav_rates_r.gif);
  background-repeat: no-repeat;
}

#nav  li.rates a:hover img {
  visibility: hidden;
} 
/**===== ABOUT ===== **/
   
#nav  li.about {
  background-image: url(../img/topnav_about_r.gif);
  background-repeat: no-repeat;
}

#nav  li.about a:hover img {
  visibility: hidden;
} 
/**===== CONTACT ===== **/
   
#nav  li.contact {
  background-image: url(../img/topnav_contact_r.gif);
  background-repeat: no-repeat;
}

#nav  li.contact a:hover img {
  visibility: hidden;
} 

