div#debug
{
  position: absolute;
  top: 10px;
  right: 10px;
  width: 200px;
  font-size: 9px;
  text-align: left;
}



body
{
  background-color: #fff;
}


#comicflow
{
  position: relative;
  margin: 0;
  padding: 0;

  width: 700px;
  height: 425px;
  overflow: hidden;
  background-color: white;
}

#comicflow .gradient_left
{
  position: absolute;
  z-index: 4;
  top: 0;
  bottom: 0;
  left: 0;
  width: 50px;
  background: url('/files/concreteissues/img/comicflow-gradient-left.png') 0 0 repeat-y;
}

#comicflow .gradient_right
{
  position: absolute;
  z-index: 4;
  top: 0;
  bottom: 0;
  right: 0;
  width: 50px;
  background: url('/files/concreteissues/img/comicflow-gradient-right.png') 0 0 repeat-y;
}

#comicflow .navigation
{
  position: absolute;
  z-index: 4;
  bottom: 0;
  padding: 0 100px;
  clear: both;
  width: 500px;
}

#comicflow .navigation a {
  cursor: pointer;
}

#comicflow .navigation a.prev
{
  float: left;
}

#comicflow .navigation a.next
{
  float: right;
}

#comicflow .images 
{
}

#comicflow .images div.image
{
  position: absolute;
  overflow: hidden;
  margin: 0;

  background-color: white;
  border-color: #eee;
  border-style: solid;

  text-align: center;
}

#comicflow .images div.image img
{
}

#comicflow .images div.image p
{
  display: none;
}


#comicflow .info 
{
  display: none;

  font-size: 10px;
  font-family: verdana;

  position: absolute;
  z-index: 5;
  bottom: 0;
  margin: 0 200px;
  padding: 10px;
  width: 250px;

  height: 70px;
  clear: both;
  border: 2px solid #eee;
  background-color: white;
}

#comicflow .print
{
  position: absolute;
  z-index: 6;
  bottom: 0;
  margin: 0 200px;
  padding: 10px;
  width: 250px;
  cursor: pointer;
  text-align: right;
}
