html, body {
  width: 100%;
  height: 100%;
  margin: 0px 0px 0px 0px;
  background-color: #000000;
}

div#main {
  position: absolute;
  left: 50%;
  width: 400px;
  margin-left: -200px;
}

div#logo {
  position: absolute;
  top: 143px;
}

div#logo div {
  height: 32px;
  background-image: url(/img/logo0.png);
  float: left;
}

div#logo #c1 {  width: 49px;  background-position:    0px 0px; }
div#logo #c2 {  width: 35px;  background-position:  -49px 0px; }
div#logo #c3 {  width: 35px;  background-position:  -84px 0px; }
div#logo #c4 {  width: 29px;  background-position: -119px 0px; }
div#logo #c5 {  width: 35px;  background-position: -148px 0px; }
div#logo #c6 {  width: 35px;  background-position: -201px 0px; margin-left: 17px;}
div#logo #c7 {  width: 30px;  background-position: -254px 0px; margin-left: 17px;}
div#logo #c8 {  width: 34px;  background-position: -284px 0px; }
div#logo #c9 {  width: 14px;  background-position: -318px 0px; }

div#icons {
  position: absolute;
  bottom: 0px;
  left: 270px;
}

div#icons div {
  height: 50px;
  background-image: url(/img/icons.png);
  float: right;
  display: none;
}

div#icons div#i1 { width: 47px; background-position:    0px 0px;}
div#icons div#i2 { width: 50px; background-position:  -77px 0px;}
div#icons div#i3 { width: 50px; background-position: -156px 0px;}
div#icons div#i4 { width: 42px; background-position: -234px 0px;}
div#icons div#i5 { width: 30px; background-position: -306px 0px;}
div#icons div#i6 { display: none;}
div#icons div#i7 { width: 32px; background-position: -367px 0px;}
div#icons div#i8 { width: 35px; background-position: -431px 0px;}

div#icons div#i1.hover { background-position:    0px -50px;}
div#icons div#i2.hover { background-position:  -77px -50px;}
div#icons div#i3.hover { background-position: -156px -50px;}
div#icons div#i4.hover { background-position: -234px -50px;}
div#icons div#i5.hover { background-position: -306px -50px;}
div#icons div#i6.hover { display: none;}
div#icons div#i7.hover { background-position: -367px -50px;}
div#icons div#i8.hover { background-position: -431px -50px;}

div#contents {
  position: absolute;
  top: 230px;
  width: 200px;
  color: #FFFFFF;
  font-family: Verdana;
  font-size: 11px;
/*  text-align: justify;*/
}

div#contents a {
  color: #E2007A;
}

div#timer {
  display: none;
  position: absolute;
  bottom: 10px;
  left: 100px;
  right: 100px;
  z-index: 1000;
}

div#timer div {
  background-color: #E2007A;
  height: 2px;
}

div#projects {
  position: relative;
  height: 100px; 
  width: 320px;
  overflow: hidden;
}

div#projects div {
  padding-bottom: 8px;
}

div#arrow_up {
  margin: 0px 0px 20px 17px;
  width: 26px;
  height: 13px;
  background-image: url(/img/arrows.png);
  cursor: pointer;
}

div#arrow_down {
  margin: 20px 0px 0px 17px;
  width: 26px;
  height: 13px;
  background-image: url(/img/arrows.png);
  background-position: 0px -13px;
  cursor: pointer;
}

div#arrow_left {
  position: absolute;
  left: -20px;
  bottom: 15px;
  width: 13px;
  height: 26px;
  background-image: url(/img/arrows.png);
  background-position: -26px 0px;
  cursor: pointer;
}

div#arrow_right {
  position: absolute;
  left: 330px;
  bottom: 15px;
  width: 13px;
  height: 26px;
  background-image: url(/img/arrows.png);
  background-position: -39px 0px;
  cursor: pointer;
}

div#prev {
  float: left;
  width: 13px;
  height: 14px;
  margin-right: 4px;
  background-image: url(/img/arrows.png);
  background-position: -52px 0px;
  cursor: pointer;
}

div#next {
  float: right;
  width: 13px;
  height: 14px;
  margin-left: 4px;
  background-image: url(/img/arrows.png);
  background-position: -65px 0px;
  cursor: pointer;
}

/*
div#project {
  position: absolute;
  left: 75px;
  bottom: 0px;
  text-align: left;
  width: 242px;
  z-index: 1;
}*/

img#image, #project img, .project_photo {
  border: 1px solid #FFFFFF;
}

div.selected img {
  border: 1px solid #E2007A;
}

img.selected {
  border: 1px solid #E2007A;
}

div#photos {
  position: relative;
  height: 50px; 
  width: 320px;
  overflow: hidden;
}

div#photos img {
  margin-right: 10px;
}

#songs span {
  padding: 2px;
}

#songs span.active {
  background-color: #E2007A;
}

div#selectsong {
  display: none;
}

.project_photo {
  cursor: pointer;
}

#debug {
  position: absolute;
  color: #FFFFFF;
}

#overlay {
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  background: url(/overlay.png);
  z-index: 999;
  display: none;
}

#overlay_content {
  position: absolute;
  left: 50%;
  color: #000000;
  background-color: #000000;
}

div#photobook {
  display: none;
}
