/*======================================================================
  Talkin' Stick » site-wide CSS
  © 2006-2008 WildernessPros Marketing, LLC/The WPM Group, LLC
  Bryan Pack
========================================================================
  core page layout & structure
----------------------------------------------------------------------*/

* {
  margin: 0;
  padding: 0;
}

body {
  font: 76% Verdana, Arial, Helvetica, sans-serif;
  background-color: #D8D0AE; /* [c]: tan */
  text-align: center;
  color: #000000; /* [c]: black */
}

/*----------------------------------------------------------------------
  layout structure
 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
    +div#page           ([wP]: 740px width)
      +div#header
      +div#subheader

      +div#main
        +div#content
        +div#sidebar
        +div#subfooter

      +div#footer
 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
----------------------------------------------------------------------*/

#page {
  margin: 20px auto;
  width: 740px; /* [wP] */
  text-align: left;
}

#header {
  background-color: #D8D0AE; /* [c]: tan */
}

#subheader {
  background: #648D9F; /* [c]: bluegray */
}

#main {
  clear: both;
  background: #FFFFFF url(gfx/main-bg.gif) repeat-y left;
}

#content,
#sidebar {
  display: inline;
  float: left;
}

#content {
  width: 420px;
  margin-left: 284px;
}

#sidebar {
  width: 284px;
  margin-left: -704px;
}

#subfooter {
  clear: both;
}


/*======================================================================
  page header
----------------------------------------------------------------------*/

#header p.tagline {
  padding-top: 140px;
  background: url(gfx/header-bg.jpg) no-repeat center top;
  overflow: hidden;
  height: 0 !important;
  height /**/: 140px;
}

#subheader {
  padding-top: 40px;
  background: #FFFFFF url(gfx/subheader-bg.gif) no-repeat center top;
}

/*--------------------------------------
    menu (horizontal bar)
......................................*/

#subheader .menu {
  float: right;
  margin-top: -24px;
  list-style: none;
}
#subheader .menu li {
  float: left;
}
#subheader .menu li a {
  display: block;
  padding: 0 0.75em;
  border-bottom: 1px dotted #8D9A94; /* [c]: gray */
  line-height: 1.5em;
  color:  #444D61; /* [c]: dkbluegray */
  text-decoration: none;
}
#subheader .menu li a:hover {
  border-bottom: 3px solid #BD8660; /* [c]: copper */
  color: #FEF1AE; /* [c]: yellow */
  background: #A54433 /* [c]: red */;
}


/*======================================================================
  page content
------------------------------------------------------------------------
                                 ::  common elements  ::
......................................................*/

.clear {
  clear: both;
}


/*--------------------------------------
    common block elements
......................................*/

#content p {
  line-height: 1.5em;
  margin: 0.75em 0;
}

#content h1 {
  margin-bottom: 0.5em;
  font-size: 2em;
  font-weight: normal;
  color: #444D61; /* [c]: dkbluegray */
}

#content h2 {
  margin: 1em 0 0.5em;
  border-bottom: 1px solid;
  font-size: 1.5em;
  font-weight: normal;
  color: #8D9A94; /* [c]: gray */
  clear: both;
}

#content h3 {
  margin: 1em 0 0.5em;
  font-size: 1.25em;
  font-weight: bold;
  color: #648D9F; /* [c]: bluegray */
  clear: both;
}

#content h4 {
  margin: 1em 0 0.5em;
  font-size: 1em;
  font-weight: bold;
}

#content hr {
  clear: both;
  margin: 1em 0;
}


#content .netvoice .msg {
  font-size: .8em;
  font-style: italic;
}

#content div.featured {
  margin: 1em 0;
  border: 1px solid #648D9F; /* [c]: bluegray */
  border-bottom-width: 5px;
  border-left-width: 3px;
  padding: 0.5em 2em;
  background-color: #ECE8D7; /* [c]: 50% tan */
}
#content div.featured h2 {
  margin-top: 0;
  font-weight: bold;
  color: #444D61 /* [c]: darkbluegray */;
}


/*--------------------------------------
    links: regular inline
......................................*/

#content a {
  text-decoration: none;
  font-weight: bold;
  color: #A54433 /* [c]: red */;
  border-bottom: 1px dotted;
}
#content a:hover {
  background-color: #FEF1AE; /* [c]: yellow */
  border-bottom: 2px solid;
}

#content a img {
  border: 0;
}



#content a.pdf_file {
	padding-left: 21px;
	background: url(gfx/filetypes/pdficon_small.gif) no-repeat left top;  
}


/*--------------------------------------
    img elements
......................................*/

#content img {
  display: block;
  margin: 0 auto; /* center the image */
}

/*--------------------------------------
    list elements
......................................*/

#content ul {
  margin: 0 1em;
}
#content ul li {
  margin: 0.25em 0;
  line-height: 1.25em;
}

/*------------------------------------------------------
                                    ::  product list  ::
......................................................*/

#content .products img {
  float: right;
  margin-left: 2em;
}

#content .products ul {
}

#content .products .price {
  color: #A54433 /* [c]: red */;
}

/*------------------------------------------------------
                  ::  location addresses (retailers)  ::
......................................................*/

#content dl.locations dt {
  margin: 1.5em 0 0.25em 1em;
  font-weight: bold;
  color: #648D9F; /* [c]: bluegray */
}
#content dl.locations dd {
  margin-left: 2em;
}
#content dl.locations dd .note {
  margin: 0.5em 2em 0.5em -1em;
  font-size: 0.9em;
  color: #444D61; /* [c]: dkbluegray */
}

/*------------------------------------------------------
                                   ::  photo gallery  ::
......................................................*/

#content .gallery .thumb {
  float: left;
}
#content .gallery .thumb a img {
  display: block;
  border: 1px dotted white;
  padding: 4px;
}
#content .gallery .thumb a:hover img {
  border-color: #BD8660; /* [c]: copper */
}


/*======================================================================
  sidebar items
----------------------------------------------------------------------*/

#sidebar {
}

#sidebar .panel {
  margin: 0 74px 0 40px;
}

#sidebar .panel h4 {
  margin-bottom: 0.5em;
  padding: 4px 8px;
  text-align: right;
  font-size: 1em;
  font-style: normal;
  font-weight: normal;
  color: #FFFFFF; /* [c]: white */
  background: #BD8660; /* [c]: copper */
}

#sidebar .panel a img {
	border: 2px solid #BD8660; /* [c]: copper */
}
#sidebar .panel a:hover img {
	border-color: #FEF1AE; /* [c]: yellow */
}
#sidebar .panel a:active img {
	border-color: #A54433; /* [c]: red */
}

/*--------------------------------------
    menu (vertical panel)
......................................*/

#sidebar .panel .menu {
  list-style: none;
  margin-bottom: 2em;
}
#sidebar .panel .menu li {
  display: inline;
}
#sidebar .panel .menu li a {
  display: block;
  border-bottom: 1px dotted #8D9A94; /* [c]: gray */
  padding-left: 8px;
  line-height: 1.5em;
  color: #444D61; /* [c]: dkbluegray */
  text-decoration: none;
}
#sidebar .panel .menu li.featured a {
  border-left: 4px solid #BD8660; /* [c]: copper */
  color: #A54433; /* [c]: red */
  background: #FEF1AE; /* [c]: yellow */
}
#sidebar .panel .menu li a:hover {
  border-left: 4px solid #BD8660; /* [c]: copper */
  padding-left: 4px;
  color: #FEF1AE; /* [c]: yellow */
  background: #A54433; /* [c]: red */
}


/*======================================================================
  page footer
----------------------------------------------------------------------*/

#subfooter {
  padding-top: 90px;
  background: url(gfx/subfooter-bg.jpg) no-repeat center bottom;
}
#subfooter p {
  margin-right: 36px;
  font-size: 0.8em;
  font-style: italic;
  text-align: right;
  color: #FEF1AE; /* [c]: yellow */
}

#footer {
  padding-top: 116px;
  background: url(gfx/footer-bg.jpg) no-repeat center top;
}

#footer p {
  margin-left: 284px;
  font-size: 0.8em;
}
