/* ****************************************************************
*   Copyrighted Material:
*
*   This document is confidential and proprietary information of
*   Silverbrooke Designs, LLC.
*   Copying, reproducing, or infringement in any form, by any means,
*   in whole or in part, or use for any purpose other than that for
*   which it is expressly provided without the written permission of
*   Silverbrooke Designs, LLC. will constitute copyright infringement.
*
*   Copyright (c) 2007 Silverbrooke Designs, LLC. All Rights Reserved
*                                                                         
* ******************************************************************
* Modification History
* 9/7/2007 - Original version
*/
/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: separate;
	border-spacing: 0;
}
.clear{
  clear: both;
}
#gallery {
  position: relative;
  background-color: #000;
  padding: 8px 7px 0 7px;
}
#info {
  position: absolute;
  top: 0;
  right: 20px;  
  width:385px;
}
#info h2 {
  text-align:center;
  margin-top: 2em;
}
#info p {
  font-size:90%;
}
ul.topic {
  padding:0;
  margin:0; 
  list-style:none; 
  position:relative; 
/*josh*/
  width:728px;
  height:452px;
}
ul.topic li {
  margin: 0 0 3px 0;
  padding: 0;
}
ul.topic li, ul.topic li a {
  display:block;
  height:30px; 
/*josh*/
  width:73px;
  color:#000; 
  /*border-width:1px 1px 0 0; */
  background:#ddd;
  /*font-family:verdana, arial, sans-serif;*/
  font-size:11px; 
  text-indent: 3px;
  line-height:30px;
  letter-spacing: 0.04em; 
}
ul.topic li img {
  border-style: none;
  float: right;
  margin-top: -15px;
  margin-right: 3px;
}
ul.topic li a {
  text-decoration:none; 
}
ul.topic li a ul, ul.topic li ul {
  /*josh*/
  visibility: hidden;
}
ul.topic li:hover {
  color:#000; 
  background:#bbb;
/* josh */
}
ul.topic li:hover img.more,
ul.topic li a:hover img.more,
ul.topic li:hover a img.more  {
  display: none;
}
ul.topic li:hover,
ul.topic li a:hover,
ul.topic li:hover a {
  /* josh */
  /* display: block; below allows IE to work */
  display: block;
  visibility: visible;
  color:#000; 
  background:#bbb;
  width: 77px;
}
ul.topic li ul {
 visibility:hidden;
 list-style:none; 
 width:226px;
 position:absolute;
 top: 0;
 left: 77px;
 background:#ddd;
 height:435px; 
 border:10px solid #bbb;
 margin: 0;
 padding: 0;
}
ul.topic li a:hover ul, 
ul.topic li:hover ul,
ul.topic li.active ul {
  visibility: visible;
}
ul.topic li a:hover ul li, 
ul.topic li:hover ul li,
ul.topic li.active ul li {
  float:left;
  /*border:1px solid #fff;*/
  /*josh*/
  width:65px; 
  height:65px;
  /*margin: 3px;*/
  padding: 0;
  text-align: center;
  margin-top: 4px;
  margin-bottom: -1px;
  margin-right: -1px;
  margin-left: 4px;
}
ul.topic li a:hover ul li a, 
ul.topic li:hover ul li a,
ul.topic li.active ul li a {
  /*display:block;*/
  cursor:default;
  /*float:left;*/
  text-decoration:none; 
  /*text-align: center;*/
/* josh */
  width:65px;
  height:65px;
  border:1px solid #000;
  border-color:#eee #555 #333 #ddd;
  margin: 0;
  padding: 0;
}

ul.topic li ul li a span {
  display:none;
}
ul.topic li ul li a:hover {
  background:#777;
  /*josh*/
  border-color: #FF6DFF;
  width: 65px;
  height: 65px;
  /*margin-left: -5px;*/
}
ul.topic li ul li a img {
  width:65px;
  height:65px;
  margin:0;
  padding:0;
}
ul.topic li ul li a:hover b, ul.topic li ul li a:active b, ul.topic li ul li a:focus b{
  position:absolute;
  /* josh */
  top: -10px;
  left: 223px;
  width:423px;
  height:455px; 
  background:#bbb;
  margin: 0;
  padding: 0;
}
ul.topic li ul li a:hover b img, ul.topic li ul li a:active b img, ul.topic li ul li a:focus b img{
  margin: 0;
  padding: 10px 0 0 0;
  border: none;
}
ul.topic li ul li a:hover span, ul.topic li ul li a:active span, ul.topic li ul li a:focus span {
  clear: both;
  display:block; 
  /*font-family:verdana, arial, sans-serif; */
  font-weight:normal; 
  font-size:150%; 
  margin:0 auto;
  /*josh*/
  text-align:center;
  width:430px;
  line-height:105%;
  color: #000;
}
ul.topic li ul li a:hover img, ul.topic li ul li a:active img, ul.topic li ul li a:focus img {
  border:1px solid #eee;
  border-color:#555 #ddd #eee #333;
  /*josh*/
  margin: 10px 8px 5px 8px;
  /*padding: 10px 12px 5px 12px;*/
  display: block;
  width:auto;
  height:auto;
}
b.rtop {
  margin-top: 4px;
}

