/********** SeaTrails Adventure Guidemaps style sheet - copyright 2007 Ross Wildman *************/

/********** 04/18/06 - fixed secondary navigation/compass overlap, raised side navigation. added split columns for main page */

html		{ /* forces scrollbars */
			height: 101%;
			}

body		{ /* sets body styles */
			margin: 0;
			background: url(../images/contour_back.png);
			background-color: #ccc
			;
			}
			
			
/********** main page elements ************************************************/
			
#header		{ /* caps off the top of the content card */
			position: relative;
			margin: 0px auto 0;
			width: 810px;
			height: 90px;
			background: url(../images/card_top.gif) no-repeat;
			}

#container	{ /* contains all content within the card */
			margin: 0 auto;
			width: 810px;
			background: url(../images/card_middle.gif);
			background-repeat: repeat-y;
			}
			
#inner		{ /* holds content inside container, sets margins */
			margin: 0 auto;
			width: 695px;
			height: 100%;
			padding-top: 40px;
			}
			
#leftcol	{ /* left column - contains secondary navigation */
			float: left;
			margin: 0 0 30px 0;
			width: 135px;
			height: 320px;
			padding-top: 0px;
			}
			
#rightcol	{ /* right column - contains individual page content */
			float: right;
			margin: 0 0 30px 0;
			width: 512px;
			padding-top: 15px;
			}
			
#footer 	{ /* clears both column floats, expands card to fit column length */
			position: relative;
			z-index: 5;
			clear: both;
			margin: 20px 0 0 4px;
			width: 802px;
			height: 20px;
			background: url(../images/nav_bg.gif) repeat top;
			padding-top: 14px;
			text-align: center;
			}
			
#bottom		{ /* caps off the bottom of the content card */
			margin: 0 auto;
			width: 810px;
			height: 18px;
			background: url(../images/card_bottom.gif);
			}

#logo		{ /* SeaTrails mark */
			position: absolute;
			z-index: 5;
			top: 0px;
			left: 4px;
			width: 802px;
			height: 87px;
			background: url(../images/seatrails_mark.jpg);
			}
							
#division	{ /* contains secondary right and left columns within the content area */
			position: relative;
			width: 540px;
			border-top: 1px solid #BBB;
			}
			
#leftcol2	{ /* left column inside content area */
			float: left;
			width: 260px;
			}
			
#rightcol2	{ /* right column inside content area */
			float: right;
			width: 260px;
			padding-left: 10px;
			border-left: 1px solid #BBB;
			}
			
#innercolcap { /* turns off floats for inside columns */
			clear: both;
			}
			
			

/********** primary navigation ************************************************/

			
#nav		{ /* location etc. of primary navigation */
			position: absolute;
			top: 85px;
			margin: 0px 0 0 4px;
			width: 802px;
			height: 37px;
			background: url(../images/nav_bg.gif) repeat bottom;
			font: 11px arial, sans-serif;
			}
			
			
#nav ul		{ /* primary navigation list style */
			margin: 0 0 0 47px;
			padding: 10px 10px 0;
			list-style: none;
			}
			
#nav li		{ /* primary navigation list item */
			float: left;
			background: url(../images/right_off.gif) no-repeat right top;
			margin: 0 0px 0px;
			padding: 0;
			}
			
head:first-child+body #nav li { /* fixes IE navigation line-up issue. This code is not visible to IE */
ΚΚΚΚ		margin: 0px;
			}
			
#nav a		{ /* adds left-off image */
			float: left;
			display: block;
			background: url(../images/left_off.gif) no-repeat left top;
			padding: 4px 14px 3px 14px;
			font-weight: 700;
			color: #000;
			text-decoration: none;
			line-height: 12px;
			}
			
			 /* Commented Backslash Hack
     hides rule from IE5-Mac \*/
  #nav a {float:none;}
  /* End IE5-Mac hack */
			
#nav .current { /* primary navigation current style */
			background-image: url(../images/right_on.gif);
			}
			
#nav .current a { /* adds left-on image */
			background-image: url(../images/left_on.gif);
			padding-bottom: 5px;
			color: #FFF;
			text-decoration: none;
			}

			
			
/********** secondary navigation **********************************************/

#nav2		{ /* secondary navigation */
			position: relative;
			top: 25px;
			margin: 0 0px 0 4px;
			text-align: left;
			z-index: 5;
			}
			
#nav2 ul	{ /* secondary navigation list style */
			margin: 0;
			padding: 0;
			list-style: none;
			z-index: 5;
			}
			
#nav2 li	{ /* adds border underneath items */
			padding: 4px 0;
			border-bottom: 1px solid #bbb;
			z-index: 8;
			}
			
			
/********** utilities navigation **********************************************/

#util		{ /* utilities navigation */
			position: absolute;
			top: 43px;
			right: 48px;
			width: 180px;
			height: 48px;
			text-align: right;
			;
			}
			
#util ul	{ /* utilities list style */
			margin: 0;
			padding: 0 16px 0 0;
			list-style: none;
			z-index: 5;
			}
	
#util li	{ /* adds padding */
			position: relative;
			padding: 4px 0 6px;
			z-index: 5;
			}
			
#util img	{ /* places arrows */
			position: absolute;
			top: 3px;
			right: -18px;
			z-index: 0;
			}
			
head:first-child+body #util img { /* fixes IE arrows line-up issue. This code is not visible to IE */
ΚΚΚΚ		top: 4px;
			right: -17px;
			}
			
		
	
/********** typography ********************************************************/

body		{ /* all-purpose body text */
			font: 11px arial, arial, sans-serif;
			color: #555;
			line-height: 16px;
			}
			
#nav2 a		{ /* secondary navigation link */
			font: 11px arial, arial, sans-serif;
			text-decoration: none;
			color: #666;
			}
			
#nav2 a:hover { /* secondary navigation hover blue */
			text-decoration: none;
			color: #000;
			}
			
#nav2 .current a { /* selected secondary navigation link blue */
			font-weight:bold;
			color: #000;
			}
			
#util a		{ /* utility navigation link */
			font: 9px verdana, arial, sans-serif;
			text-decoration: none;
			font-weight:bold;
			color: #fff;
			}
			
#util a:hover { /* utility navigation hover red*/
			text-decoration: underline;
			color: #Cb2027;
			}
			
#footer		{ /* copyright, etc. */
			font: 10px arial, arial, sans-serif;
			color: #444;
			}
			
h1			{ /* main headline */
			font-size: 16px;
			color: #1D6C95;
			line-height: 1.2em;
			}
			
h2			{ /* secondary headline */
			font-size: 14px;
			color: #444;
			line-height: 1.2em;
			}
			
a			{ /* main link style */
			color: #444;
			text-decoration: none;
			}
			
a:hover		{ /* main hover style */
			color: #C33B00;
			text-decoration: underline;
			}