/* ============ */
/* = Carousel = */
/* ============ */

#carousel {
  width:680px;
  height:350px;
  position:relative;
  background:#ebebeb url('/images/loading.gif') 50% 50% no-repeat;
}

#carousel .img {
  width:680px;
  height:350px;
  position:absolute;
  top:0;
  left:0;
}

#carousel .button_location {
  width:30px;
  height:30px;
  position:absolute;
  left:-30px;
  bottom:35px;
  background:#669e9f url('/images/carousel_location.gif') 3px 3px no-repeat;
  cursor:pointer;
}

#carousel .button_info {
  width:30px;
  height:30px;
  position:absolute;
  left:-30px;
  bottom:0;
  background:#669e9f url('/images/carousel_info.gif') 2px 5px no-repeat;
  cursor:pointer;
}

#carousel .caption {
  min-height:30px;
  width:0;
  position:absolute;
  left:0;
  bottom:0;
  border:solid #669e9f;
  border-width:0 15px;
}

#carousel .caption p {
  padding:7px 10px;
  font-size:100%;
  background:#ffffff;
  white-space:nowrap;
  cursor:default;
  opacity:0.9;
  line-height:1.2em;
  margin:0;
}

#carousel .location {
  width:0;
  position:absolute;
  left:0;
  bottom:35px;
  border:solid #669e9f;
  border-width:0 15px;
  overflow:hidden;
}

#carousel .location .shim {
  position:absolute;
  top:0;
  left:0;
  height:260px;
  background:#ffffff;
  z-index:1;
  opacity:0.9;
}

#carousel .location .wrapper {
  width:550px;
  height:260px;
  position:relative;
  z-index:10;
}

#carousel .location h6.title,
#carousel .location p.description,
#carousel .location img {
}

#carousel .location h6.title {
  margin:0;
}

#carousel .location h6.title,
#carousel .location p.description {
  padding:10px 10px 10px 340px;
  width:200px;
}

#carousel .location p.description {
  padding-top:0;
}

#carousel .location h6.title {
  font-weight:bold;
  font-size:108%;
}

#carousel .location p.description {
  font-size:93%;
  line-height:1.5em;
}

#carousel .location p.description a {
  display: block;
} 

#carousel .location img {
  width:320px;
  height:240px;
  position:absolute;
  top:10px;
  left:10px;
}

#carousel .nav {
  position:absolute;
  right:10px;
  bottom:10px;
  width:90px;
}

#carousel .nav div {
  margin-left:10px;
  cursor:pointer;
  width:20px;
  height:20px;
  background:#000;
  float:right;
}

#carousel .nav .prev {
  background:url('/images/carousel_left.png') 0 0 no-repeat;
}

#carousel .nav .playpause {
  background:url('/images/carousel_pause.png') 0 0 no-repeat;
}

#carousel .nav .paused {
  background:url('/images/carousel_play.png') 0 0 no-repeat;
}

#carousel .nav .next {
  background:url('/images/carousel_right.png') 0 0 no-repeat;
}