/*
 * *****************************************************************************
 * Stephanie Kayne Website
 *
 * /style/bookcase.css - Bookcase Styles
 *
 * Assumes: site.css
 * *****************************************************************************
 */

/* -------------------------------------------------------------------------- */
/* Bookcase - Structure */

div.book-case {
  /* background: #553300 none; */
  background: rgb(59,37,26) none;
  border-collapse: collapse;
  display: table;
  margin: 0px auto;
  table-layout: fixed;
  width: 900px;
}

div.book-case-top,
div.book-case-middle,
div.book-case-bottom,
div.book-case-shelf {
  display: table-row;
  width: 900px;
}

/* ------ all cells ------ */
div.book-case-top.left,
div.book-case-top.center,
div.book-case-top.right,
div.book-case-middle.left,
div.book-case-middle.center,
div.book-case-middle.right,
div.book-case-bottom.left,
div.book-case-bottom.center,
div.book-case-bottom.right,
div.book-case-shelf.left,
div.book-case-shelf.center,
div.book-case-shelf.right {
  border: 2px solid Black;
  display: table-cell;
}

/* ------ turn off selected borders ------ */
div.book-case-top.left,
div.book-case-top.center,
div.book-case-bottom.left,
div.book-case-bottom.center {
  border-right: none;
}
div.book-case-top.center,
div.book-case-top.right,
div.book-case-bottom.center,
div.book-case-bottom.right {
  border-left: none;
}
div.book-case-middle.left,
div.book-case-middle.right,
div.book-case-shelf.left,
div.book-case-shelf.right {
  border-top: none;
  border-bottom: none;
}

/* ------ set board images ------ */
div.book-case-top.left,
div.book-case-top.center,
div.book-case-top.right,
div.book-case-middle.center,
div.book-case-bottom.left,
div.book-case-bottom.center,
div.book-case-bottom.right {
  background: rgb(59,37,26) url("/image/tiles/walnut_horizontal5.jpg");
}
div.book-case-middle.left,
div.book-case-middle.right,
div.book-case-shelf.left,
div.book-case-shelf.right {
  background: rgb(59,37,26) url("/image/tiles/walnut_vertical5.jpg");
}

/* ------ top cells ------ */
div.book-case-top.left,
div.book-case-top.center,
div.book-case-top.right {
  height: 20px;
}

/* ------ shelf cells ------ */
div.book-case-middle.left,
div.book-case-middle.center,
div.book-case-middle.right {
  height: 10px;
}

/* ------ bottom cells ------ */
div.book-case-bottom.left,
div.book-case-bottom.center,
div.book-case-bottom.right {
  height: 30px;
}

/* ------ left & right cells ------ */
div.book-case-top.left,
div.book-case-top.right,
div.book-case-middle.left,
div.book-case-middle.right,
div.book-case-bottom.left,
div.book-case-bottom.right,
div.book-case-shelf.left,
div.book-case-shelf.right {
  width: 20px;
}

/* ------ center cells ------ */
div.book-case-top.center,
div.book-case-middle.center,
div.book-case-bottom.center,
div.book-case-shelf.center {
  width: 860px;
}

div.book-case-shelf.center {
  background: rgb(59,37,26) url("/image/tiles/walnut_horizontal.jpg");
}

/* -------------------------------------------------------------------------- */
/* Bookcase - Self Books */

div.book-case-shelf ul {
  margin: 0px;
  padding: 0px;
}

div.book-case-shelf li {
  /* border: 1px solid red; */
  color: White;
  display: table-cell;
  height: 330px;
  margin: 0px;
  padding: 0px;
  text-align: center;
  vertical-align: bottom;
}

div.book-case-shelf a {
  background: transparent url("/image/book_spine_test_1.png") no-repeat;
  background-position: center;
  /* border: 1px solid white; */
  display: inline-block;
  font-family: "Monotype Corsiva", Niconne, Times, serif;
  height: 300px;
  margin: 0px 22px;
  padding: 0px;
  text-align: center;
  text-decoration: none;
  width: 60px;
}

div.book-case-shelf a.draft {
  color: DarkGray;
}

div.book-case-shelf a.complete {
  color: White;
}

div.book-case-shelf a.published {
  color: Gold;
}

div.book-case-shelf a > div {
  /* border: 1px solid white; */
  display: inline-block;
  font-size: 14pt;
  height: 50px;
  margin: 50px 0px 0px -12px;
  padding: 4px 0px;
  text-align: center;
  width: 84px;
}

div.book-case-shelf a > img {
  border: none;
  display: inline-block;
  height: 72px;
  margin: 0px; margin-top: 10px;
  padding: 0px;
  width: 48px;
}