/*** basic setup ***/
ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,q,blockquote,fieldset,input {margin:0; padding:0;}

body {font-size: 76%; color: #fff; background-color: #575656; font-family: verdana, arial, helvetica, sans-serif;}

a {text-decoration: none; color: #323232;}
a:link {}
a:visited {}
a:hover {}
a:active {}
a img {border: none;}

h1 {font-size: 1.5em; font-weight: bold;}
h2 {font-size: 1.2em; font-weight: bold;}
h3 {font-size: 1.1em; font-weight: bold;}
h4 {font-size: 1em; font-weight: bold;}
p, li {font-size: 1em; line-height: 1.6em;}
blockquote p {font-size: 1em; line-height: 1.6em; font-style: italic;}
abbr, acronym {font-style: normal; border-bottom: dotted 1px; cursor: help;}
.clearboth {clear: both;}

/*** cross-template theme ***/
#wrapper {background-color: #575656;}
#maincolumn {width: 868px; margin: 0 auto; padding: 0; border: solid #fff; border-width: 0 1px; color: #323232; background-color: #d6d2c2;}

#mastheadHome {height: 110px; background: url(/img/site/mastheadHome.jpg) no-repeat;}
#mastheadAdvLog {height: 110px; background: url(/img/site/mastheadAdvLog.jpg) no-repeat;}
#mastheadDest {height: 110px; background: url(/img/site/mastheadDest.jpg) no-repeat;}
#mastheadPhoto {height: 110px; background: url(/img/site/mastheadPhoto.jpg) no-repeat;}
#mastheadTips {height: 110px; background: url(/img/site/mastheadTips.jpg) no-repeat;}
#mastheadAbout {height: 110px; background: url(/img/site/mastheadHome.jpg) no-repeat;}

#nav {margin:0; padding:0; background:#d6d2c2; float:left; width:100%; border:1px solid #fff; border-width:1px 0;}
#nav li {display:inline; margin:0; padding:0;}
#nav a:link, #nav a:visited {color:#323232; background:#d6d2c2; padding:10px 20px; float:left; width:auto; border-right:1px solid #fff; text-decoration:none; font-weight:bold; font-size: 1.1em;}
#nav a:hover {color:#fff; background:#575656;}
#alog #nav-alog a, #dest #nav-dest a, #photo #nav-photo a, #tips #nav-tips a, #about #nav-about a {background: #b45c01; color: #fff;}
#home #nav-home a:hover, #alog #nav-alog a:hover, #dest #nav-dest a:hover, #photo #nav-photo a:hover, #tips #nav-tips a:hover, #about #nav-about a:hover {color:#fff; background:#b45c04;}
#nav a:active {}

/*** main content area - the body of the site ***/
#contentarea {}
#contentarea p{margin: 0 20px 12px 20px;}
#contentarea h1 {margin: 20px 20px 20px 20px;}
#contentarea h2 {margin: 20px 20px 6px 20px;}
#contentarea h3 {margin: 20px 20px 6px 20px;}
#contentarea h4 {margin: 20px 20px 6px 20px;}
#contentarea ul {margin: 0px 20px 12px 20px; padding-left: 40px;}
#contentarea ul li {list-style-type: disc;}
#contentarea ul ul {margin: 0;} /*** need to tweak this one ***/
#contentarea ol {margin: 0px 20px 12px 20px; padding-left: 40px;}
#contentarea ol li {list-style-type: decimal;}
#contentarea ul.nobullet {margin: 0px 20px 12px 20px; padding-left: 20px;}
#contentarea ul.nobullet li {list-style-type: none;}
#contentarea ul.nobullet li a {text-decoration: underline;}
#contentarea ul.nobullet li a:hover {color: #fff; background: #b45c04;}
#contentarea blockquote p {margin: 0 20px 12px 20px;}

#contentarea img.thumbright {float: right; margin: 0 20px 12px 20px; background: #fff; padding: 6px; border-right: 1px solid #575656; border-bottom: 1px solid #575656;}
#contentarea img.thumbleft {float: left; margin: 0 20px 12px 20px; background: #fff; padding: 6px; border-right: 1px solid #575656; border-bottom: 1px solid #575656;}
#contentarea img.imgright {float: right; margin: 0 20px 12px 20px; background: #fff; padding: 9px; border-right: 1px solid #575656; border-bottom: 1px solid #575656;}
#contentarea img.imgleft {float: left; margin: 0 20px 12px 20px; background: #fff; padding: 9px; border-right: 1px solid #575656; border-bottom: 1px solid #575656;}

a.readmore {height: 16px; margin: 0 20px 12px 20px; border: 1px solid #fff; padding: 2px 4px 2px 6px; background: url(../img/site/bgMore.jpg) repeat-x; color: #fff; font-size: 10px; font-weight: bold;}
a:hover.readmore {text-decoration: underline;}

#contentarea p a {text-decoration: underline;}
#contentarea p a:hover {color: #fff; background: #b45c04;}
#contentarea li a {}
#contentarea li a:hover{}
#contentarea q {width: 300px; float: right; margin: 12px 20px 12px 12px; padding-bottom: 12px; border-bottom: solid 10px #b45c04; font-size: 2em; font-family: Georgia,Times,serif;}
#contentarea .sharethis 0 {margin: 0 20px 12px 20px;}

/*** image gallery stuff - lots of extra hooks for later use ***/
/*** if you're reading my code and can help me figure out how to prevent my bottom gallery rows from collapsing without placing a non-floated element beneath them, I would love to hear from you ***/
#gallery {background: url(/img/site/gallery_bg.gif) no-repeat; padding-top: 50px;}
#gallerybg {padding-top: 50px;}

.photo4 {clear: both; margin: 20px 0 0 20px;}
.photo4 img {background: #fff; padding: 6px; border-right: 1px solid #575656; border-bottom: 1px solid #575656;}
.photo4x1 {float: left; width: 208px; text-align: center;}
.photo4x2 {float: left; width: 208px; text-align: center;}
.photo4x3 {float: left; width: 208px; text-align: center;}
.photo4x4 {float: left; width: 208px; text-align: center;}

.photo3 {clear: both; margin: 20px 0 0 20px;}
.photo3 img {background: #fff; padding: 8px; border-right: 1px solid #575656; border-bottom: 1px solid #575656;}
.photo3x1 {float: left; width: 278px; text-align: center;}
.photo3x2 {float: left; width: 278px; text-align: center;}
.photo3x3 {float: left; width: 278px; text-align: center;}

.photo2 {clear: both; margin: 20px 0 0 20px;}
.photo2 img {background: #fff; padding: 10px; border-right: 1px solid #575656; border-bottom: 1px solid #575656;}
.photo2x1 {float: left; width: 410px; text-align: center;}
.photo2x2 {float: left; width: 410px; text-align: center;}

.gcaption {font-size: .9em;}
.caption {font-size: .9em;}

/*** home page stuff ***/
#hero {border-bottom: 1px solid #fff;}
#herocaption {background-color: #d6d2c2; border-bottom: solid #fff 1px; font-size: .8em; padding: 3px 20px 5px 20px;}
#herocaption a {color: #323232; text-decoration: none;}
#herocaption a:hover {text-decoration: underline;}

#feature {width: 189px; height: 228px; float: right; background: url(../img/site/featureBgHome.jpg); margin: 0 0 5px 5px;}
#feature img {clear: both; margin-top: 17px; margin-left: 24px;}

/*** article stuff ***/
#breadcrumb {float: left; width: 100%;}
#breadcrumb p {margin: 12px 20px 12px 20px; font-size: .8em;}
#breadcrumb a {text-decoration: underline;}
#breadcrumb a:hover {text-decoration: none;}
#breadcrumb span {color: #666;}

#articleHero {width: 270px; height: 320px; float: right; margin: 0 20px 12px 12px;}
#articleHero p {font-size: .9em; margin-left: 10px;}
#articleHero p a {font-weight: bold; text-decoration: underline;}

/*** beautiful solution -- too bad ie6 doesn't support png alpha transparency -- you bastards!
#articleHero {width: 270px; height: 290px; float: right; margin: 0 20px 12px 12px; padding: 19px 0 0 23px; background-color:#d6d2c2; background-image: url(../img/site/bg-aloghero.png); background-repeat: no-repeat;}
#articleHero p {clear: both; float: left; font-size: .9em; margin-top: 30px;}
#articleHero p a {font-weight: bold; text-decoration: underline;}
***/

#byline {font-size: .8em; }

/*** destinations stuff ***/
#destmap {width: 425px; height: 320px; float: right; margin: 0 20px 12px 20px; border: solid 1px red;}

#destfavs {width: 350px; height: 320px; border: solid 1px #fff; margin: 0 20px; background-color:#E3DFCE;}
#destfavs h2 {margin-top: 5px;}
#destfavs h3 {margin-top: 5px;}
#destfavs div ul {padding: 0 5px;}
#destfavs div ul li {list-style-type: none;}
#destfavs a {text-decoration: underline;}
#destfavs a:hover {color: #fff; background: #b45c04;}

#guidelist {clear: both; border: 1px solid #fff; margin: 0 20px 14px 20px; padding: 10px 0; background-color:#E3DFCE;}
#guidelist h2 {margin-top: 5px;}
#guidelist h3 {margin-top: 5px;}
#guidelist div ul {padding: 0 5px;}
#guidelist div ul li {list-style-type: none;}
#guidelist a {text-decoration: underline;}
#guidelist a:hover {color: #fff; background: #b45c04;}
#guidelist p {clear: both; margin-bottom: 5px;}

#planlist {clear: both; border: solid 1px #fff; margin: 0 20px 14px 20px; padding: 10px 0; background-color:#E3DFCE;}
#planlist h2 {margin-top: 5px;}
#planlist h3 {margin-top: 5px;}
#planlist div ul {padding: 0 5px;}
#planlist div ul li {list-style-type: none;}
#planlist a {color: #b45c04; text-decoration: underline;}
#planlist a:hover {color: #fff; background: #b45c04;}
#planlist p {clear: both; margin-bottom: 5px;}

#resourcelist {clear: both; border: solid 1px #fff; margin: 0 20px 14px 20px; padding: 10px 0; background-color:#E3DFCE;}
#resourcelist h2 {margin-top: 5px; width: 100%;}
#resourcelist h3 {margin-top: 5px;}
#resourcelist div ul {padding: 0 5px;}
#resourcelist div ul li {list-style-type: none;}
#resourcelist a {color: #b45c04; text-decoration: underline;}
#resourcelist a:hover {color: #fff; background: #b45c04;}
#resourcelist p {clear: both; margin-bottom: 5px;}

div.dest3column {width: 32%; float: left;}
div.dest2column {width: 50%; float: left;}

/*** adventure log ***/
#featuredtrip {width: 430px; height: 210px; float: right; margin: 0 20px 12px 20px; border: 0;}

#alogfavs {width: 350px; height: 200px; border: solid 1px #fff; margin: 0 20px; padding-top: 10px; background-color:#E3DFCE;}
#alogfavs h2 {margin-top: 5px;}
#alogfavs h3 {margin-top: 5px;}
#alogfavs div ul {padding: 0 5px;}
#alogfavs div ul li {list-style-type: none;}
#alogfavs a {text-decoration: underline;}
#alogfavs a:hover {color: #fff; background: #b45c04;}

.triplisting {clear: both; margin: 20px; border-top: solid 1px #fff;}
.triplisting img {float: right; margin: 20px 12px 12px 12px; background: #fff; padding: 6px; border-right: 1px solid #575656; border-bottom: 1px solid #575656;}
.triplisting h2 {margin-top: 5px;}
.triplisting h2 a {text-decoration: none;}
.triplisting p {font-size: 11px;}

/*** photography ***/
#mgpsets {width: 225px; height: 900px; float: left; margin: 0 0 20px 20px;}
#mgpsets h2 {width: 215px; background: #b45c04; color: #fff; margin: 0; padding: 5px; text-align: center; border: 1px solid #fff;}
#mgpsets h3 {text-align: right; text-transform: uppercase; margin: 2px 0 0 0;}
#mgpsets img {margin: 20px 0 0 0; background: #fff; padding: 8px; border-right: 1px solid #575656; border-bottom: 1px solid #575656;}
#jcpsets {width: 225px; height: 900px; float: left; margin: 0 0 20px 20px;}
#jcpsets h2 {width: 215px; background: #b45c04; color: #fff; margin: 0; padding: 5px; text-align: center; border: 1px solid #fff;}
#jcpsets h3 {text-align: right; text-transform: uppercase; margin: 2px 0 0 0;}
#jcpsets img {margin: 20px 0 0 0; background: #fff; padding: 8px; border-right: 1px solid #575656; border-bottom: 1px solid #575656;}
#photoarticles {width: 325px; height: 125px; float: left; border: 1px solid #fff; margin: 0 0 20px 20px;}
#photoarticles h2 {padding: 5px 5px 5px 20px; border-bottom: 1px solid #fff; margin: 0 0 20px 0; background: #fff; color: #b45c04;}
#photoarticles ul {padding: 0 5px;}
#photoarticles ul li {list-style-type: none;}
#photoarticles a {text-decoration: underline;}
#photoarticles a:hover {color: #fff; background: #b45c04;}
#featuredphoto {width: 325px; height: 300px; float: left; border: 1px solid #fff; margin: 0 0 20px 20px;}

/*** pagination ***/
#contentarea .page {clear: both; margin: 20px 20px 12px 20px; padding-left: 0; padding-top: 10px; text-align: left;}
.page li {display: inline; list-style-type: none; background-color: #d6d2c2; border: 1px solid #575656; padding: 2px 3px; margin-right: 3px;}
.page li.currentpage {background: #b45c04;}
.page li.currentpage a {font-weight: bold; color: #fff;}
.page li.pagelabel {}
.page li.pagelabel a {}

/*** footer ***/
#footer {height: 60px; background: url(../img/site/footer.jpg) no-repeat; border-top: 1px solid #fff; border-bottom: 2px solid #fff; margin-top: 20px;}
#footer p {margin-right: 130px; margin-left: 130px; margin-top: 10px; font-size: .8em; padding: 5px;}
#footer ul {margin-right: 130px; margin-left: 130px;}
#footer li {display: inline; list-style-type: none; font-size: .8em; padding: 5px;}
#footer li a {text-decoration: underline;}
#footer li a:hover {text-decoration: none;}

/*** contact ***/
form {font-size:1.1em; font-family: verdana, arial, helvetica, sans-serif; border:0; padding:0; margin:0;}
input, textarea {padding:3px;}
#name {width:280px;}
#email {width:280px;}
#message {width:400px; height:220px;}