/*
--------------------------------------------------------------------------------
 <> BookmarkBrief.css
    ---------------
	Controls the visual display of the main site content.
    ----------------------
    Author:  Erik Burns
	Version: March 25, 2008
-------------------------------------------------------------------------------- */
.debate_brief {
  clear: both;
  padding-top: 20px;
  width: 620px;
}

/*
--------------------------------------------------------------------------------
 :: Text Content
    ------------
    Styles the title link, posted by data, copy brief, and action bar
-------------------------------------------------------------------------------- */
.debate_brief .text_content {
  display: block; float: right;
  width: 520px !important;
  z-index: inherit;
  }

.debate_brief .text_content h3 {
  padding: 0; margin: 0;
  }

.debate_brief .text_content p.posted {
  color: #999;
  padding: 0;
  }

.debate_brief .text_content p.copy {
  padding: 0 0 10px 0;
  }

/* ------------------------------------------------------------------------------
   ... positions: agree, disagree, unsure
/* ------------------------------------------------------------------------------ */
.debate_brief .text_content p.posted .agree, .debate_brief .text_content p.posted .disagree, .debate_brief .text_content p.posted .unsure{
  text-transform: uppercase;
  font-weight: bold;
  }

.debate_brief .text_content p.posted .agree { color: #FBB040; }
.debate_brief .text_content p.posted .disagree { color: #BF1E2D; }
.debate_brief .text_content p.posted .unsure { color: #666; }

/*
--------------------------------------------------------------------------------
 :: Stats and Menu Bar
    ------------------
    Styles the stats & option menu bar
-------------------------------------------------------------------------------- */
.debate_brief .text_content div.action_bar {
  position: relative;
  border-top: 1px solid #e6e6e6; border-bottom: 1px solid #e6e6e6;
  padding: 0; margin: 0;
  z-index: inherit;
  }

.debate_brief .text_content div.action_bar p {
  padding: 3px 0; margin: 0;
  width: 400px;
  }

.debate_brief .text_content div.action_bar .divider {
  color: #e6e6e6;
  }

/* ------------------------------------------------------------------------------
   ... Options: Styles the options drop menu
/* ------------------------------------------------------------------------------ */
.debate_brief .options_wrapper {
  position: absolute; right: 0;
  padding: 3px 0; margin: 0;
  text-decoration: none;
  list-style: none;
  z-index: inherit;
  }

.debate_brief ul li {
  display: block; float: left;
  padding-bottom: 26px;
  }

.debate_brief ul li a {
  display: block; float: left;
  background-repeat: no-repeat;
  background-position: 0 0;
  color: #999 !important;
  text-decoration: none !important;
  font-size: 100%;
}

.debate_brief .options_wrapper .options_menu {
  visibility: hidden;
  position: absolute; top: -1px; right: 0px;
  width: 160px;
  margin: 0; padding: 0;
  border: 1px solid #e6e6e6;
  background-color: #fff; /* alternate yellow style background-color: #FFFAC2; */
  background-image: none;
  list-style: none;
  }

.debate_brief .options_wrapper .options_menu li {
  margin: 0 !important; padding: 0 !important;
  background: none;
  }

.debate_brief .options_wrapper .options_menu li a {
  width: 140px;
/* Cycloid's Tiny Box Model Hack http://css-discuss.incutio.com/?page=BoxModelHack */
  width: "160px";
  margin: 0; padding: 4px 10px;
  font-size: 125%;
  color: #0064BF !important;
  }

.debate_brief .options_wrapper .options_menu li a:hover, .debate_brief .options_wrapper .options_menu li a:active {
  background: #f8f8f8;
  }

/* ------------------------------------------------------------------------------
   ... What the javascript "active" class does when you rollover "more" menu
   Goal is to get the menu to appear (become visible) and have the "more" button
   stay highlighted while the user is looking at the more menu.
--------------------------------------------------------------------------------- */
.debate_brief ul.active .options_menu { visibility: visible; }

/*
--------------------------------------------------------------------------------
 :: Left Column
    -----------
    Styles the photo image and primary action button that appear in the left column
-------------------------------------------------------------------------------- */
.debate_brief .image_content {
  display: block; float: left;
  width: 90px;
  }

.debate_brief .image_content img {
  display: block;
  width: 85px; height: 85px;
  border: 1px solid #ccc;
  }

/* ------------------------------------------------------------------------------
   ... Action Button: "learn more" or "support this"
/* ------------------------------------------------------------------------------ */
.debate_brief .image_content a.more_button {
  display: block; position: relative; right: 1px;
  width: 90px; height: 33px;
  margin: 3px 0 0; padding: 0; border: 0;
  background-repeat: no-repeat;
  background-position: 0 0;
  }

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

.debate_brief .image_content a.more_button:hover, .debate_brief .image_content a.more_button:active {
  /* no styles for rollovers yet, but when/if there are, they can go here */
  }

.debate_brief .image_content a.learn { background-image: url(/skins/proto/images/button_learnmore.gif); }
.debate_brief .image_content a.endorse { background-image: url(/skins/proto/images/button_endorse.gif); }
.debate_brief .image_content a.mine { background-image: url(/skins/proto/images/button_myfav.gif); }
.debate_brief .image_content a.myfav { background-image: url(/skins/proto/images/button_myfav.gif); }
.debate_brief .image_content a.support { background-image: url(/skins/proto/images/button_support.gif); }
.debate_brief .image_content a.supported { background-image: url(/skins/proto/images/button_supported.gif); }