html, body {margin: 0; padding: 0; height: 100%;} 

html, body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 90%;
	color: #330000;
}
body {
	background-image: url(../../images/bkgrnd.png);
	background-repeat: repeat-x;
	background-position: 0px 0px;
	background-attachment: fixed;
	background-color: #475c4a;	
}
p {
	font-size: 1em;
	margin: 0 0 5px 0;
}
h1 {
	color: #666600;
	font-size: 2em;
	margin: 0;
	padding: 0;
}
h3 {
	font-size: 1.1em;
	margin: 5px 0 5px 0;
	padding: 0;
}

#topnav {
	margin: 20px auto 0 auto;
	width: 820px;
	height: 2em;
	text-align: left;
	font: .9em, arial, sans-serif;
}
#banner {
	width: 428px;
	height: 80px;
	float: right;
	margin: 20px 95px 0 0;
}
#contact {
	float: right;
}
#contactform {
	width: 80%;
}
#topper {
	margin: 5px auto 0 auto;
	width: 850px;
	height: 100px;
	background: url(../../images/topper-trans.png) no-repeat;
	position: relative;
	z-index: 50;
}
	
#content {
	margin: 0 auto;
	padding: 25px 0 0 0;;
	width: 840px;
    background: url(../../images/bck.png);
 	position: relative;
 	min-height:350px;
  	height:auto !important;
  	height: 350px;
  	position: relative;
  	z-index: 1;
  
}

#leftcol {
	margin: 5px;
	width: 300px;
	float: left;
	position: relative;
}

#breakout {position: absolute; top: 17px; left: 150px; z-index:100; width: 150px; height: 189px;}

#post {
	width: 485px;
	margin: 0 0 0 15px;
	float: left;
	position: relative;
}
#ipost {
	width: 350px;
	margin: 100px auto;
	position: relative;
	padding: 0 0 10px 355px;
}

#footer {
	margin: 0 auto 20px auto;
	width: 850px;
	height: 100px;
	background: url(../../images/footer-trans.png) bottom left no-repeat;
}

#logo {
	position: absolute;
	top: 30px;
	left: 15px;
	z-index: 200;
}





#testimonial {border-top: 1px #666600 solid; border-bottom: 1px #666600 solid; padding: .75em .5em .5em .5em; margin: 550px 1em 1em 1em;}
.alignRight {display: block; text-align: right;}
p.testimonial {color: #666600; font-size: 1em;}
h2.testify {}

.promo {border: 1px dashed #993333; padding: 15px; margin: 5px; background: #ffffcc}
.clear {
    clear:both;
    height:1px;
    overflow:hidden;
}

*a{position:relative;}

/* INDEX DISPLAY */
#i1 {position: absolute; top: 20px; left: 0px; width: 150px; height: 132px; display: block;}
#i2 {position: absolute; top: 157px; left: 0px; width: 150px; height: 254Xpx; display: block;}
#i3 {position: absolute; top: 20px; left: 155px; width: 150px; height: 391px; display: block;}
#i4 {position: absolute; top: 20px; left: 310px; width: 150px; height: 255px; display: block;}
#i5 {position: absolute; top: 280px; left: 310px; width: 150px; height: 132px; display: block;}


:link img, :visited img, :hover img, :active img, img { border: none; }
/* QUICK LINKS */
#links {float: right; margin: 0 0 5px 7px;}
#links dl {width: 150px; margin: 0 auto; padding: 0 0 10px 0; background: #330000 url(../../images/bottom.png) no-repeat bottom left;}
#links dt {margin:0; padding: 5px; font-size: 1.1em; color: #fff; border-bottom:1px solid #fff; background: #330000 url(../../images/top.png) no-repeat top left; text-align: center;}
#links dd {margin:0 0 2px 0; padding:0 0 0 5px; color: #cc6600; font-size: .9em; font-weight: bold; border-bottom:1px solid #fff; background: #fff;}
#qlinks a, #qlinks a:visited {color:#cc6600; text-decoration:none; diplay: block; padding:0 0 3px 20px;
background: url(../../images/bullet-trans.png) no-repeat 3px 2px; width:125px;
}
#qlinks a:hover {background: url(../../images/bullet-trans.png) no-repeat 4px 2px; color:#330000;}
#qulinks.last {padding:0 0 5px 20px; }


ol li {font-size:1em;}

ul.bulletlist {list-style-image: url(../../images/bullet-trans.png); line-height: 150%;}

/* SIDE NAV */
#sn1 {
	position: absolute;
	top: 190px;
	left: 0;
	z-index: 300;
	width: 130px;
	height: 34px;
}
#sn2 {
	position: absolute;
	top: 240px;
	left: 0;
	z-index: 300;
	width: 130px;
	height: 34px;
}
#sn3 {
	position: absolute;
	top: 290px;
	left: 0;
	z-index: 300;
	width: 130px;
	height: 34px;
}
#snRopes a, #snRopes a:visited {
	display: block;
	width: 130px;
	height: 34px;
	background: url(../../images/sidnav/ropes-trans.png) no-repeat;
}
#snRopes a:hover {
	display: block;
	width: 130px;
	height: 34px;
	background: url(../../images/sidnav/ropes_over-trans.png) no-repeat;
}
#snHorses a, #snHorses a:visited {
	display: block;
	width: 130px;
	height: 34px;
	background: url(../../images/sidnav/horses-trans.png);
	}
#snHorses a:hover {
	display: block;
	width: 130px;
	height: 34px;
	background: url(../../images/sidnav/horses_over-trans.png);
}
#snBoards a, #snBoards a:visited {
	display: block;
	width: 130px;
	height: 34px;
	background: url(../../images/sidnav/boards-trans.png);
}
#snBoards a:hover {
	display: block;
	width: 130px;
	height: 34px;
	background: url(../../images/sidnav/boards_over-trans.png);
}
#snAdventure a, #snAdventure a:visited {
	display: block;
	width: 130px;
	height: 34px;
	background: url(../../images/sidnav/adventure-trans.png) no-repeat;
}
#snAdventure a:hover {
	display: block;
	width: 130px;
	height: 34px;
	background: url(../../images/sidnav/adventure_over-trans.png) no-repeat;
}
#snFocus a, #snFocus a:visited {
	display: block;
	width: 130px;
	height: 34px;
	background: url(../../images/sidnav/focus-trans.png) no-repeat;
}
#snFocus a:hover {
	display: block;
	width: 130px;
	height: 34px;
	background: url(../../images/sidnav/focus_over-trans.png) no-repeat;
}
#snRegistration a, #snRegistration a:visited {
	display: block;
	width: 130px;
	height: 34px;
	background: url(../../images/sidnav/registration-trans.png) no-repeat;
}
#snRegistration a:hover {
	display: block;
	width: 130px;
	height: 34px;
	background: url(../../images/sidnav/registration_over-trans.png) no-repeat;
}
#snWedding a, #snWedding a:visited {
	display: block;
	width: 130px;
	height: 34px;
	background: url(../../images/sidnav/wedding-trans.png) no-repeat;
}
#snWedding a:hover {
	display: block;
	width: 130px;
	height: 34px;
	background: url(../../images/sidnav/wedding_over-trans.png) no-repeat;
}
#snCeremony a, #snCeremony a:visited {
	display: block;
	width: 130px;
	height: 34px;
	background: url(../../images/sidnav/ceremony-trans.png) no-repeat;
}
#snCeremony a:hover {
	display: block;
	width: 130px;
	height: 34px;
	background: url(../../images/sidnav/ceremony_over-trans.png) no-repeat;
}
#snMeetings a, #snMeetings a:visited {
	display: block;
	width: 130px;
	height: 34px;
	background: url(../../images/sidnav/meetings-trans.png) no-repeat;
}
#snMeetings a:hover {
	display: block;
	width: 130px;
	height: 34px;
	background: url(../../images/sidnav/meetings_over-trans.png) no-repeat;
}







	
#leftdisplay {
	position: absolute;
	top: 30px;
	left: 0px;
	z-index: 0;
}

/* BREAD CRUMB */
.B_crumbBox {display: block; margin: 20px 0 0 0; height: 1em; font-size: .8em}
.B_firstCrumb, .B_homeCrumb, .B_crumb {color: #996600;}
.B_lastCrumb, B_currentCrumb {color: #cc6600;}

/* NAVIGATION */

#nav, 

#nav ul {padding:0; margin:0; list-style:none; font: 1em arial, verdana, sans-serif; position:relative; z-index:100;}

#nav {height:23px; width:500px; padding:0;position: absolute; top: 105px; left: 330px;}



#nav table {border-collapse:collapse;}

#nav li {float:left;}

#nav li li {float:none;}

/* a hack for IE5.x and IE6 */

#nav li a li {float:left;}



#nav li a {display:block; float:left; color:#000000; height:23px; padding:0px; line-height:22px; text-decoration:none; white-space:nowrap; font-weight:bold;}

#nav li li a {height:21px; line-height:20px; float:none;}



#nav li:hover {position:relative; z-index:100;}

#nav a:hover {position:relative; z-index:100; color:#996600;}

#nav li:hover > a {color:#996600;}



#nav :hover  ul {left:0; top:23px; z-index:300;}

#nav a:hover ul {left:-1px;}



#nav ul {position:absolute; left:-9999px; top:-9999px; background:url(../../images/menu/bck-trans.png); padding: 5px; border-top: 1px solid #330000;}



/* it could have been this simple if all browsers understood */

/* show next level */

#nav li:hover li:hover > ul {left:0; margin-left:100%; top:0;}

/* keep further levels hidden */

#nav li:hover > ul ul {position:absolute; left:-9999px; top:-9999px; width:auto;}

/* show path followed */

#nav li:hover li:hover > a {color:#996600;}



#nav li a:hover ul li a:hover {background:#;}



/* but IE5.x and IE6 need this lot to style the flyouts*/

/* show next level */

#nav a:hover a:hover ul,

#nav a:hover a:hover a:hover ul,

#nav a:hover a:hover a:hover a:hover ul,

#nav a:hover a:hover a:hover a:hover a:hover ul

{left:100%; top:0;}



/* keep further levels hidden */

#nav a:hover ul ul,

#nav a:hover a:hover ul ul,

#nav a:hover a:hover a:hover ul ul,

#nav a:hover a:hover a:hover a:hover ul ul

{position:absolute; left:-9999px; top:-9999px;}
/* END NAVIGATION */