﻿.pikachoose
{
  margin: 0 auto 0 auto;
  text-align: center;
}

/* This is the ul you have all your images in */
.pikachoose ul
{
  text-align: center;
  margin: 0 auto;
  overflow: hidden;
}
.pikachoose ul li
{
  float: left;
  border: 2px double #FFCC00;
  background: #777;
  position: relative;
  overflow: hidden;
  margin: 2px;
}
.pikachoose ul li div img
{
  position: relative;
  cursor: pointer;
}

/* this is the surroundner for all your elements. This is also the fake border around the main img and room for caption */
.pika_main
{
  display: block;
  position: relative;
  height: 450px;
  text-align: center;
}
/*sine we give it the fake border, you need to position the image a little. */
.pika_main_img
{
  height: 400px;
}
.pika_back_img
{
  height: 400px;
  display: none;
}
.pika_subdiv
{
  position: relative;
  padding: 2px;
}
.pika_subdiv img, .pika_subdiv a img
{
  border: none;
  margin: 0 auto;
}
.pika_caption
{
  width: 500px;
  height: 16px;
  padding-top: 4px;
  text-align: center;
  position: absolute;
  bottom: 7px;
  left: 3px;
  background: url('black.png') top left;
}
.pika_caption a
{
  color: #FFF;
}

.pika_play
{
  position: absolute;
  z-index: 1;
  left: 50%;
  margin-left: -25px;
  width: 50px;
  height: 50px;
  top: 5px;
}
.pika_play a
{
  position: relative;
  margin-left: auto;
  cursor: pointer;
  display: block;
  width: 50px;
  height: 50px;
  background: url('play.png') top center no-repeat;
}
.pika_play a
{
  position: relative;
  margin-left: auto;
  cursor: pointer;
  display: block;
  width: 50px;
  height: 50px;
  background: url('pause.png') top center no-repeat;
}

.pika_navigation a
{
  font-size: 12px;
  text-decoration: none;
}
.pika_navigation a:hover
{
  text-decoration: underline;
}
.pika_navigation
{
  padding-top: 10px;
  clear: both;
  text-align: center;
}

/* if you want to 'hide' these jus make their height and width 1px */
.pika_prev_hover
{
  position: absolute;
  top: 5px;
  left: 5px;
  height: 456px;
  width: 100px;
  background: url('rewind.png') top left no-repeat;
}
.pika_next_hover
{
  position: absolute;
  top: 5px;
  right: 5px;
  height: 456px;
  width: 100px;
  background: url('fastf.png') top right no-repeat;
}
