/***********************************************************
Copyright © 2010 Herryanto Siatono, Pluit Solutions. 
Pluit Carousel is released under the MIT license. 

     _                   _                  
    | |                 | |                 
 ___| |_ _ __ _   _  ___| |_ _   _ _ __ ___ 
/ __| __| '__| | | |/ __| __| | | | '__/ _ \
\__ \ |_| |  | |_| | (__| |_| |_| | | |  __/
|___/\__|_|   \__,_|\___|\__|\__,_|_|  \___|
                                            

You'll find 2 sections below: "slider" and "simple". 
They have the default styles for those Players.
***********************************************************/


/* Standard Styles */
.pluit-carousel {
  position: relative;
  margin-bottom: 1em;
}

.pluit-carousel img {
  border: 0;
  display: block;
  cursor: pointer;
}

.pluit-carousel ul {
  margin: 0;
  padding: 0;
  list-style-type: none;
}

/* Viewport */
.pluit-carousel .viewport {
  width: 1px;
  margin-bottom: 10px;
  overflow: hidden;
  position: relative;
}


.pluit-carousel .viewport ul {
  /* If some slides are not showing up, make this bigger */
  width: 15000px;
}

.pluit-carousel .viewport ul li {
  display: block;
  float: left;
}


.pluit-carousel .viewport ul ul {
  width: auto;
  float: left;
}

.pluit-carousel .viewport ul ul li {
  margin-right: 5px;
}

/* Navigation */
.pluit-carousel .nav {
  padding: 0 3px;
}

.pluit-carousel .nav li a {
  display: block;
  overflow: hidden;
  text-indent: -100em;
  background: url(http://www.brookersmeat.com/common/templates/default/images/pluit/carousel_nav.png) no-repeat 0 0;
  outline: none;
}

.pluit-carousel .nav li a:hover {
  background-position: -46px 0;
}

.pluit-carousel .nav .prev, .pluit-carousel .nav .next {
	float: left;
	margin-right: 7px;
}

.pluit-carousel .nav .next {
	margin-right: 3px;
}

.pluit-carousel .nav .prev a, .pluit-carousel .nav .next a {
	width: 10px;
	height: 10px;
	background-position: -91px 0;
}

.pluit-carousel .nav .prev a:hover {
  background-position: -179px 0;
}

.pluit-carousel .nav .next a {
  background-position: -135px 0;
}

.pluit-carousel .nav .next a:hover {
  background-position: -223px 0;
}

.pluit-carousel .nav .pages {
 float: left;
}

.pluit-carousel .nav .pages ul {
  float: left;
}

.pluit-carousel .nav .pages li {
  float: left;
  margin-right: 8px;
}

.pluit-carousel .nav .pages li a {
  width: 10px;
  height: 10px;
}

.pluit-carousel .nav .pages li.active a {
  background-position: -46px 0;
}

.pluit-carousel ul, .pluit-carousel .nav .pages, .pluit-carousel .nav {
  zoom: 1;
}

.pluit-carousel ul:after, .pluit-carousel .nav .pages:after, .pluit-carousel .nav:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}	


/***********************************************************
       _       _       
      | |     (_)      
 _ __ | | __ _ _ _ __  
| '_ \| |/ _` | | '_ \ 
| |_) | | (_| | | | | |
| .__/|_|\__,_|_|_| |_|
| |                    
|_|             
************************************************************/

.pluit-plain .viewport li {
  position: relative;
}

.pluit-plain .viewport .desc {
  position: absolute;
  position: absolute;
  display: block;
  padding: 8px 10px;
  font-size: 11px;
  font-style: normal;
  z-index: 1;
  bottom:0;
  background: #000;
  filter: alpha(opacity=80);
  opacity: 0.8;
}


/***********************************************************
     _                 _      
 ___(_)_ __ ___  _ __ | | ___ 
/ __| | '_ ` _ \| '_ \| |/ _ \
\__ \ | | | | | | |_) | |  __/
|___/_|_| |_| |_| .__/|_|\___|
                |_|           

************************************************************/

/* Photo Tag Skin */    
.pluit-simple .viewport .tag a {
  color: #fff;
}

.pluit-simple .viewport .tag {
  position: absolute;
  font-family: "Lucida Grande", arial, serif;
  top: 295px;
  left: 350px;
  height: 28px;
  width: 150px;
}

.pluit-simple .viewport .tag span {
  position: absolute;
  display: block;
  padding: 6px 10px;
  color: #fff;
  z-index: 1;
}

.pluit-simple .viewport .tag .shadow {
  position: absolute;
  background: #000;
  filter: alpha(opacity=80);
  opacity: 0.8;
  height: 100%;
  width: 100%;
}

.pluit-simple .viewport li {
  position: relative;
}

/* Fancy Side Navigation Skin */
.pluit-simple {
  padding-bottom: 20px;
}

.pluit-simple .nav {
  position: absolute;
  top: 0;
  height: 100%;
  float: none;
}

.pluit-simple .nav li {
  float: none;
}

.pluit-simple .nav .prev, .pluit-simple .nav .next {
  position: absolute;
  top: 235px;
  left: 476px;
  width: 60px;
}

.pluit-simple .nav .next {
  left: 501px;
  top: 210px;
  z-index: 1;
}

.pluit-simple .nav .prev a, .pluit-simple .nav .next a {
  width: 50px;
  height: 54px;
  background-position: 0 -85px;
}

.pluit-simple .nav .prev a:hover {
  background-position: -80px -85px;
}

.pluit-simple .nav .next a {
  background-position: -160px -85px;
}

.pluit-simple .nav .next a:hover {
  background-position: -240px -85px;
}

.pluit-simple .nav .pages {
  position: absolute;
  top: 343px;
  width: 500px;
}

.pluit-simple .nav .pages li a {
  width: 15px;
  height: 15px;
  background-position: 0 -40px;
}

.pluit-simple .nav .pages li.active a {
  background-position: -46px -40px;
}


/***********************************************************
     _ _     _           
    | (_)   | |          
 ___| |_  __| | ___ _ __ 
/ __| | |/ _` |/ _ \ '__|
\__ \ | | (_| |  __/ |   
|___/_|_|\__,_|\___|_|   

************************************************************/

/* Top Story Skin */
.pluit-slider .nav .pages li a {
  width: auto;
  height: auto;
  background: #eee;
  padding: 4px;
  border-top: 1px solid #fff;
  border-bottom: 1px solid #ccc;
  text-indent: 0;
  text-decoration: none;
}

.pluit-slider .nav .pages li a:hover {
  background: #777;
  color: #fff;
}

.pluit-slider .nav .pages li.active a {
  background: #000;
  color: #fff;
}

.pluit-slider .nav .pages .last a {
  border-bottom: 0;
}

.pluit-slider .viewport {
  border: 1px solid #ccc;
}

.pluit-slider .viewport li {
  position: relative;
}

.pluit-slider .viewport .desc {
  position: absolute;
  left: 0;
  width: 100%;
  font-family: "Lucida Grande", arial, serif;
  color: #fff;
}

.pluit-slider .viewport .desc span {
  position: absolute;
  display: block;
  padding: 8px 10px;
  font-size: 11px;
  font-style: normal;
  color: #fff;
  z-index: 1;
  bottom:0;
}

.pluit-slider .viewport .desc a {
  color: #fff;
}

.pluit-slider .viewport .desc .shadow {
  position: absolute;
  background: #000;
  filter: alpha(opacity=80);
  opacity: 0.8;
  width: 100%;
  height: 70px;
  bottom:0;
}