/* ------------------------------------------------------------------------------
 <> BumpQ Title Frame
    Author:   Erik Burns
    Version:  2 January 2008
    ------------------------
    The title frame styles the general info pages (e.g., About Us, Privacy Page)
	and the Invite a Friend Page.  It also provides the visual style framing for
	the sign up and sign in pages.
-------------------------------------------------------------------------------- */

/* ------------------------------------------------------------------------------
 :: Body Top
    --------
    The title bar across the top of the content
/* ------------------------------------------------------------------------------ */
.bodycontent_top {
  position: relative;
  height: 82px; width: 850px;
  background-repeat: no-repeat; background-position: 0 0;
  z-index: 100;
  }

.bodycontent_top h2 {
  position: absolute; top: 21px; left: 21px;
  background-repeat: no-repeat; background-position: 0 0;
  padding: 0; margin: 0;
  }

.bodycontent_top h3 {
  position: absolute; top: 71px; left: 21px;
  background-repeat: no-repeat; background-position: 0 0;
  padding: 0; margin: 0;
  }

/* Dwyer Method Image Replacement
   http://mezzoblue.com/tests/revised-image-replacement/ */
.bodycontent_top h2 span, .bodycontent_top h3 span {
  display: block;
  height: 0; width: 0;
  overflow: hidden;
  font-size: 1pt;
  }

/* ------------------------------------------------------------------------------
  The infobody class styles the sign out, little problem, and expired session pages
/* ------------------------------------------------------------------------------ */
.infobody .bodycontent_top { background-image: url("/skins/VF/images/titleframe_title_bg3.gif"); }
.infobody .bodycontent_top h2 { height: 41px; }

.infobody .bodycontent_top h2.addgroup { background-image: url("/skins/VF/images/titleframe_title_addgroup.gif"); width: 227px; }
.infobody .bodycontent_top h2.problem { background-image: url("/skins/VF/images/titleframe_title_problem.gif"); width: 238px; }
.infobody .bodycontent_top h2.signout { background-image: url("/skins/VF/images/titleframe_title_signout.gif"); width: 154px; }

/* ------------------------------------------------------------------------------
  The signupbody class styles the sign up and sign in pages
/* ------------------------------------------------------------------------------ */
.signupbody .bodycontent_top { background-image: url("/skins/VF/images/titleframe_title_bg3.gif"); }
.signupbody .bodycontent_top h2 { height: 41px; }

.signupbody .bodycontent_top h2.check { background-image: url("/skins/VF/images/titlefram_title_check.gif"); width: 300px; }
.signupbody .bodycontent_top h2.forgot { background-image: url("/skins/VF/images/titleframe_title_forgot.gif"); width: 398px; }
.signupbody .bodycontent_top h2.forgotun { background-image: url("/skins/VF/images/titleframe_title_forgotun.gif"); width: 411px; }
.signupbody .bodycontent_top h2.signin { background-image: url("/skins/VF/images/titleframe_title_signin.gif"); width: 331px; }
.signupbody .bodycontent_top h2.signupor { background-image: url("/skins/VF/images/titleframe_title_signupor.gif"); width: 315px; }
.signupbody .bodycontent_top h2.youare { background-image: url("/skins/VF/images/titleframe_title_youare.gif"); width: 437px; }
.signupbody .bodycontent_top h2.step1 { background-image: url("/skins/VF/images/titleframe_title_signup.gif"); width: 362px; }
.signupbody .bodycontent_top h2.step2 { background-image: url("/skins/VF/images/titleframe_title_signup.gif"); width: 362px; }
.signupbody .bodycontent_top h2.step3 { background-image: url("/skins/VF/images/titleframe_title_signup.gif"); width: 362px; }
.signupbody .bodycontent_top h2.step4 { background-image: url("/skins/VF/images/titleframe_title_confirm.gif"); width: 331px; }

.signupbody .bodycontent_top h3 { height: 19px; width: 112px; }
.signupbody .bodycontent_top h3.step2 { background-image: url("/skins/VF/images/titleframe_title_step2.gif"); }
.signupbody .bodycontent_top h3.step3 { background-image: url("/skins/VF/images/titleframe_title_step3.gif"); }

.signupbody a.test_users { position: absolute; top: 10px; right: 44px; }

/* ------------------------------------------------------------------------------
  The viewbody class styles the invitation view/preview
/* ------------------------------------------------------------------------------ */
.viewbody .bodycontent_top { background-image: url("/skins/c2/images/titleframe_title_bg.jpg"); }
.viewbody .bodycontent_top h2 { height: 40px; }

.viewbody .bodycontent_top h2.invitation { background-image: url("/skins/c2/images/titleframe_title_invitation.gif"); width: 301px; }
.viewbody .bodycontent_top h2.preview { background-image: url("/skins/c2/images/titleframe_title_preview.gif"); width: 326px; }

/* ...buttons styles for view/preview page(s) */
.viewbody .buttons_top {
  position: absolute; right: 29px; top: 0px;
  width: 330px; height: 85px;
  padding: 0; margin: 0;
  background: url(/skins/c2/images/invite_title_bg.jpg) repeat-x 0 0;
  }

.viewbody .buttons_top a {
  display: block; float: right;
  position: relative; top: 25px;
  height: 38px;
  background-repeat: no-repeat; background-position: 0 0;
  margin-left: 10px; padding: 0;
  }

.viewbody .buttons_top a:hover, .viewbody .buttons_top a:active, .viewbody .buttons_top .buttons a.on {
  background-position: 0 -42px;
  }

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

.viewbody .buttons_top a.backto { background-image: url(/skins/c2/images/invite_button_backto.gif); width: 162px; }
.viewbody .buttons_top a.sendnow { background-image: url(/skins/c2/images/invite_button_sendnow.gif); width: 138px; }

/* ------------------------------------------------------------------------------
 :: Body Content
    ------------
    The main section of the content
/* ------------------------------------------------------------------------------ */
.bodycontent {
  float: left;
  color: inherit;
  padding: 0 0 26px 0; margin: 0;
  width: inherit;
  background: #fff;
  }
/* Overcome 3px margin bug in IE/Win floats
   http://www.positioniseverything.net/explorer/threepxtest.html */
   * html .bodycontent {
     margin-right: -3px;
     }

.bodycontent p.instructions {
  padding: 0; margin: 0;
  }

/* ------------------------------------------------------------------------------
   The infobody pages
/* ------------------------------------------------------------------------------ */
.infobody .bodycontent .right_column {
  display: inline; position: relative; float: right;
  width: 633px;
  z-index: 10;
  margin: 20px 13px 20px 0;
  }

.infobody .bodycontent .left_column {
  display: inline; position: relative; float: left;
  width: 168px;
  margin: 0 10px;
  text-align: left;
  }

/* ------------------------------------------------------------------------------
   The add a group page
/* ------------------------------------------------------------------------------ */
.mygroups .signupbody .bodycontent .right_column {
  display: inline; position: relative; float: right;
  z-index: 10;
  width: 473px;
  margin: 0 46px 0 7px; padding: 19px 0 0;
  }

.mygroups .signupbody .bodycontent .left_column {
  display: inline; position: relative; float: left;
  width: 202px; /* Cycloid's Tiny Box Model Hack */ width: "228px";
  margin: 0; padding: 7px 0 0 26px;
  background: url(/skins/c2/images/qbeam_infopages.gif) no-repeat 0 0;
  }