/****************************
 * global.css Modifications *
 ****************************/

/* In bookclub there is no main menu, so it is changed
   into a tiny line instead */
#menu {
  position         : absolute;
  top              : 100px;
  left             : 175px;
  height           : 1px;
  width            : 825px;
  overflow         : hidden;
  clip             : auto;
  background-color : #777777;
  margin           : 0px;
  padding-top      : 0px;
  padding-bottom   : 0px;
  padding-left     : 0px;
  padding-right    : 0px;
}

/* Copy of webshop's main */
#main {
  top              : 120px;
  left             : 175px;
  height           : 605px;
  width            : 605px;
  overflow         : hidden;
  clip             : auto;
  visibility       : visible;
  position         : absolute;
  color            : #444444;
/*  background-color : #ffffff;*/
  text-indent      : 0;
  text-align       : left;
  text-decoration  : none;
  text-shadow      : none;
  margin           : 0px;
  padding-top      : 15px;
  padding-bottom   : 15px;
  padding-left     : 10px;
  padding-right    : 10px;

  /* Added */
/*
  border-left: 1px solid black;
  border-bottom: 1px solid #444444;
  border-right: 1px solid #444444;
*/

  /* Modified */
  top              : 100px;
  width            : 604px;
}

/* Change height of main scrolling div. !!! Should this be done for parent as well? */
DIV.mainScrolling {
  height         : 620px;
}

/* Left sidebar contracted at top due to larger left head image */
#leftSidebar {
  top              : 20px;
  height           : 750px;
}

/* Fixed width on left head image !!! Remove */
IMG.leftHead {
  width    : 175px;
  overflow : hidden;
}

/* Fixed height on middle head image to not to overwrite main menu 'line' */
/* !!! Remove */
IMG.middleHead {
  height   : 100px;
  overflow : hidden;
}

/**********
 * Common *
 **********/

.pointer {
  cursor: pointer;
}

.greyBorder {
  border: 1px solid #444444;
}

.whiteBorder {
  border: 1px solid white;
}

P.bookclubDescription {
  /* Maybe something..? */
}

.buttonXS {
  font-family:'Verdana', 'Arial';
  font-weight:bold;
  font-size:7pt;
  text-align:center;
  text-decoration:none;
  color:#444444;
  background-color:#cccccc;
  padding: 0;
  margin: 0;
  margin-bottom: 2px;
  border:1px solid #bbbbbb;
  cursor:pointer;
}

P.warning {
  background: #ffeeee;
  border: 1px solid black;
  padding: 0.5em 1em;
}

.red {
  color: red;
}

/* Right sidebar expanded upwards due to main menu major shrinkage.
   A bit of space also added to the text gutters. */
#rightSidebar {
  top              : 100px;
}

/*************
 * Login box *
 *************/

DIV.bookclubLoginHead {
  top      : 0px;
  left     : 800px;
  position : absolute;
  margin   : 0px;
  padding  : 0px;
  background-color: white;
  width: 200px;
  height: 100px;
  overflow: hidden;
}

DIV.bookclubLoginBox {
  width: 180px;
  margin-left: 15px;
  float: left;
  font-size: 7pt;
}

DIV.bookclubLoginHead DIV.bookclubLoginBox {
  padding-left: 10px;
  padding-right: 10px;
  margin: 0px;
  padding-top: 15px;
  padding-bottom: 5px;
  background-color: white;
  width: 178px;
}

DIV.bookclubLoginBox H3 {
  font-size: 8pt;
  margin: 0px;
  padding: 0px;
  margin-bottom: 5px;
}

FORM {
  margin: 0px;
  padding: 0px;
}

FORM.bookclubLogin INPUT {
  margin-top: 4px;
}

FORM.bookclubLogin INPUT.field {
  padding: 2px;
  width: 170px;
  background-color: #EEEEEE;
  font-size: 7pt;
}

FORM.bookclubLogin INPUT.bookclubMemberIdField {
  width: 80px;
}

FORM.bookclubLogin INPUT.buttonXS {
  width: 85px;
}

DIV.bookclubLoginBox SPAN {
  font-weight: bold;
}
 
DIV.bookclubLoginBox P {
  padding: 0px;
  margin-top: 3px;
  margin-bottom: 0px;
}

/*********************
 * Period page/index *
 *********************/

DIV.bookclubPeriodIndex {
  text-align: center;
  width: 165px;
  margin-top: 15px;
  padding: 10px;
  float: left;
  overflow: hidden;
}

DIV.bookclubPeriodIndex H3 {
  color: #888888;
  margin-top: 0px;
  margin-bottom: 8px;
  font-weight: normal;
  font-size: 8pt;
}

TABLE.webshopBookInfoBuy SPAN.bookclubOrdinaryPrice {
  font-size: 7pt;
}

/**************
 * Start page *
 **************/

TABLE.bookclubStartBoxes {
  padding-bottom: 10px;
}

TABLE.bookclubStartCollage {
  margin-top: 30px;
  padding-bottom: 10px;
}

TR.bookclubButtonRow {
  height: 130px;
}

TR.bookclubButtonRow TD {
  text-align: center;
}

DIV.bookclubPriceBox {
  text-align: center;
  padding-top: 10px;
  padding-left: 10px;
  padding-right: 9px;
  padding-bottom: 9px;
  margin-left: 10px;
  background-color: yellow;
  font-weight: bold;
  font-size: 13px;
  float: left;
  cursor: pointer;
  border-top: 1px solid black;
  border-left: 1px solid black;
  border-right: 2px solid black;
  border-bottom: 2px solid black;
}

DIV.bookclubPriceBoxOrdinary {
  width: 120px;
}

DIV.bookclubPriceBoxBookclub {
  width: 120px;
}

DIV.bookclubPriceBoxHover {
  padding-top: 9px;
  padding-left: 9px;
  padding-right: 8px;
  padding-bottom: 8px;

  border-top: 2px solid black;
  border-left: 2px solid black;
  border-right: 3px solid black;
  border-bottom: 3px solid black;
}

DIV.bookclubPrice {
  margin: 5px;
  font-size: 32px;
}

IMG.bookclubBookImageCollage {
  position: absolute;
}

/***************************
 * Join and settings forms *
 ***************************/

form#bookclubCancel,
form#bookclubJoin,
form#bookclubSettings {
  background-color: #eeeeee;
  padding: 1em;
  margin-top: 1em;
}

table#bookclubJoinCheckboxes {
  margin-bottom: 2em;
}

table#bookclubJoinCheckboxes td {
  vertical-align: top;
}

table#bookclubJoinCheckboxes td.input {
  width: 2em;
}

table#bookclubJoinCheckboxes a.thumbnail {
  float: right;
  margin-left: 20px;
}

table#bookclubJoinCheckboxes a.thumbnail img {
  background-color:white;
  border:1px solid #BBBBBB;
  padding:1em 0.5em 1em 1em;
}