/*
--------------------------------------------------------------------------------
 [] Base.css
    --------
    The Base.css page stylesheet provides screen styles for the basic
	structural layout and visual format of VoiceFire.org.
	    ----------------------
    Author:  Erik Burns
	Version: January 2, 2008
-------------------------------------------------------------------------------- */

/* ------------------------------------------------------------------------------
 :: Globals
    -------
    The globals section defines global layout for the header, footer, and
	structural columns.  It also defines visual displays for standardized sitewide
	tags, such as headers, anchors, and img tags.
/* ------------------------------------------------------------------------------ */

/* ------------------------------------------------------------------------------
   ... Layout
-------------------------------------------------------------------------------- */
body {
  margin: 0; padding: 0;
  background: #000;
  color: #000;
  font-size: 100%;
  font-family:  Verdana, Arial, Helvetica, sans-serif;
  text-align: center;
  }

.wrapper {
  position: relative;
  width: 850px;
  margin: 0 auto; padding: 0;
  color: inherit;
  text-align:left;
  }

/* ------------------------------------------------------------------------------
   ... Display
-------------------------------------------------------------------------------- */
h1, h2, h3 {
  font-family: Verdana, Arial, Helvetica, sans-serif;
  padding: 0; margin: 0;
  background-color: inherit;
  font-weight: bold;
  color: #222;
  }

h1 {
  font-size: 185%;
  padding: 0; margin-bottom: 3px;
  }

h2 {
  font-size: 145%;
  margin: 10px 0 5px 0;
  clear: both;
  }

h3 {
  font-size: 104%;
  margin: 5px 0 2px 0;
  color: #666;
/*  clear: both; */
  }

p, ul, ol {
  font-size: 80%;
  color: #222;
  }

p {
  padding: 0 0 15px 0; margin: 0;
  background-color: inherit;
  }

img {
  border: 0;
  }

/* ------------------------------------------------------------------------------
   ... Links Display
-------------------------------------------------------------------------------- */
.bodycontent .right_column a {
  color: #0064BF;
  background-color: inherit;
  text-decoration: none;
  }

.bodycontent .right_column a:hover, .bodycontent .right_column a:active {
  color: #0064BF;
  background-color: inherit;
  text-decoration: underline;
  }

/* ------------------------------------------------------------------------------
 :: Header
    ------
    Controls the visual display of the header, search tool, and sidetool nav.
/* ------------------------------------------------------------------------------ */
.header {
  position: relative;
  padding: 0; margin: 0;
  height: 133px; width: 850px;
  background: #eee url("/skins/VF/C1/images/header_banner.jpg") no-repeat 0 0;
  }

.header h1 {
  background: none;
  padding: 0; margin: 0;
  }

.header h1 a {
  display: block; float: left;
  height: 99px; width: 310px;
  background: none; border: none;
  text-decoration: none;
  color: inherit;
  }

/* Dwyer Method Image Replacement
   http://mezzoblue.com/tests/revised-image-replacement/ */
.header h1 a span {
  display: block;
  height: 0; width: 0;
  overflow: hidden;
  }

.header h2 {
  display: none;
  }

/* ------------------------------------------------------------------------------
   ... the Sidetool Nav Links
/* ------------------------------------------------------------------------------ */
.header ul {
  display: block;
  position: absolute; right: 10px; top: 8px;
  padding: 0 20px; margin: 0;
  list-style: none;
  }

.header ul li {
  display: block; float: left;
  color: #ddd;
  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 8pt;
  }

.header ul li em {
  font-style: normal;
  color: #ddd;
  }

.header ul li a {
  display: inline;
  background-repeat: no-repeat; background-position: 0 0;
  color: #fff;
  text-decoration: none;
  }

.header ul li a:active, .header ul li a:hover {
  color: #fff;
  }

/* ------------------------------------------------------------------------------
 :: Advertisement
    -------------
    Controls the visual display of the top banner advertisment.
/* ------------------------------------------------------------------------------ */
.advertisement_wrapper {
  text-align: center;
  }

.advertisement {
  display: block;
  margin: 0 auto;
  }

/* ------------------------------------------------------------------------------
 :: Status Message
    --------------
    Controls the visual display of sitewide maintenance messages and notifications
/* ------------------------------------------------------------------------------ */
.status_message_wrapper {
  position: relative;
  padding-top: 3px;
  text-align: center;
  }

.status_message {
  display: block;
  margin: 0 auto;
  }

.status_message_wrapper h3 {
  position: absolute; top: 57px; left: 154px;
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-weight: bold; font-size: 95%;
  }

/* ------------------------------------------------------------------------------
 :: Main Content Area
    -----------------
    Controls the visual display of the main content area.
/* ------------------------------------------------------------------------------ */
.bodycontent_wrapper {
  margin: 0; padding: 0;
  }


.bodycontent_bottom {
  height: 0;
  font-size: 0; line-height: 0;
  }
  
/* ------------------------------------------------------------------------------
 :: Footer Display Styles
    ---------------------
	Controls the visual display of the searchAndSort nav links and copyright notice.
--------------------------------------------------------------------------------- */
.footer {
  position: relative; clear: both;
  height: 43px; width: 850px;
  background: #F9F3A3 url("/skins/VF/C1/images/footer_banner.gif") no-repeat 0 0;
  color: #fff;
  margin: 0;
  }

/*  ----------------------------------------------------------------------------
    ... The Links
-------------------------------------------------------------------------------- */
.footer ul {
  list-style: none; padding: 0; margin: 0 0 0 18px;
  }

.footer ul li {
  display: inline; float: left;
  padding: 16px 0 0; margin: 0;
  color: #ddd;
  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 85%;
  }

.footer ul li a {
  display: inline;
  color: #666;
  margin: 0 7px;
  text-decoration: none; 
  }

.footer ul li a:hover, .footer ul li a:active { color: #333; }

/*  ----------------------------------------------------------------------------
    ... Copyright notice
-------------------------------------------------------------------------------- */
.footer p {
  position: absolute; right: 25px;
  background-color: transparent;
  padding: 16px 0 0 0; margin: 0;
  height: 24px;
  color: #666;
  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 70%;
  }

/*
--------------------------------------------------------------------------------
 :: Skins
    -----
    Styles for the Header Footer Frame in specific contexts
-------------------------------------------------------------------------------- */

/* ------------------------------------------------------------------------------
  ... sign up styled page(s)
/* ------------------------------------------------------------------------------ */
.titleframe_wrapper .header { background-image: url("/skins/VF/C1/images/header_banner_signup.jpg"); height: 100px; }
.titleframe_wrapper .footer { background-image: url("/skins/VF/C1/images/footer_banner.gif"); }