/* Homepage CSS stylesheet for KAO Ban */
.home #content {
  height: 395px;
  position: relative;
}

/* Theater Nav */
#theaterNav {
  position: absolute;
  top: -15px;
  right: 70px;
  z-index: 999;
}
#theaterNav li {
  float: left;  display: block;
  width: 23px; height: 23px;
}
#theaterNav li a {
  display: block; width: 100%; height: 100%;
  text-indent: -9000px;
  background: url('../images/theater_navBtns.png') bottom right no-repeat;
  _background: url('../images/theater_navBtns2.gif') bottom right no-repeat;
}
#theaterNav li a:hover {
  background: url('../images/theater_navBtns.png') top left no-repeat;
  _background: url('../images/theater_navBtns2.gif') top left no-repeat;
}
#theaterNav li.current a {
  background: url('../images/theater_navBtns.png') top left no-repeat;
  _background: url('../images/theater_navBtns2.gif') top left no-repeat;
}

/* Theater Main */
#theaterMain li {
  display: block;
  width: 980px; height: 410px;
  display: none;
  position: absolute;
  top: -18px; left: 0;
  z-index: 20;
  overflow: hidden;
}
#theaterMain #output1 {
  background: url('../images/theater_bg1.jpg') top left no-repeat;

}
#theaterMain #output2 {
  background: url('../images/theater_bg2.jpg') top left no-repeat;

}
#theaterMain #output3 {
  background: url('../images/theater_bg3.jpg') top left no-repeat;

}
.home #content h1 {
  text-indent: -9000px;
  display: block;
  width: 334px; height: 129px;
  position: absolute; top: 46px; left: 315px;
  z-index: 10;
}
.home #content #output1 h1 {background: url('/images/theater_header1.jpg') top right no-repeat;}
.home #content #output2 h1 {background: url('/images/theater_header2.jpg') top right no-repeat;}
.home #content #output3 h1 {background: url('/images/theater_header3.jpg') top right no-repeat;}

.home #content #products {
  display: block;
  text-indent: -9000px;
  width: 217px; height: 341px;
  position: absolute; top: 67px; left: 65px;
  margin-bottom: 10px;
  z-index: 5;
}
.home #content #output1 #products {background: url('/images/home_products1.jpg') top left no-repeat;}
.home #content #output2 #products {background: url('/images/home_products2.jpg') top left no-repeat;}
.home #content #output3 #products {background: url('/images/home_products3.jpg') top left no-repeat;}

.home #content #theaterMain #products a {
  display: block; text-indent: -9999px;
  position: absolute;
  background-image: none;
}
.home #content #theaterMain #products a.rollon {top: 0px; left: 0px; width: 97px; height: 335px;}
.home #content #theaterMain #products a.solid {top: 39px; left: 97px; width: 117px; height: 300px;}

.home #content #theaterMain p {
  display: block;
  text-indent: -9999px;
  position: absolute;
}

.home #content #theaterMain #output1 p {
  background: url('/images/link_callout1.jpg') top left no-repeat;
  width: 216px; height: 96px; top: 258px; left: 305px;}
.home #content #theaterMain #output2 p {
  background: url('/images/link_callout2.jpg') top left no-repeat;
  width: 232px; height: 110px; top: 233px; left: 310px;}
.home #content #theaterMain #output3 p {
  background: url('/images/link_callout3.jpg') top left no-repeat;
  width: 218px; height: 97px; top: 255px; left: 304px;}

.home #content #theaterMain li a {
  display: block; position: absolute;
  background: url('/images/go_normal.gif') top left no-repeat;
  text-indent: -9999px;
}
.home #content #theaterMain li a:hover {background-image: none;}
.home #content #theaterMain li#output1 a {background-position: 156px 66px; width: 216px; height: 96px; top: 272px; left: 305px;}
.home #content #theaterMain li#output2 a {background-position: 180px 80px; width: 232px; height: 110px; top: 247px; left: 310px;}
.home #content #theaterMain li#output3 a {background-position: 157px 67px; width: 218px; height: 97px; top: 269px; left: 304px;}