/* Just for the example. Fee free to delete these three lines */

.pikachoose {width: 320px; margin: 0 auto;}

/* Style the thumbnails */
    .pika-thumbs{  }
	.pika-thumbs li{ width: 40; height:40; overflow: hidden; float: left; list-style-type: none; cursor: pointer;}
	.pika-thumbs li .clip {position:relative; height:100%; text-align: center; vertical-align: middle; overflow: hidden; border: 1px dotted #94AC0C;}
	
/* The stage is the wrapper. The image fills 100% the height of the stage */
    .pika-stage, .pika-textnav {width: 320px;}
    .pika-stage { height:280px; position: relative;border: 0px solid black;}
    .pika-stage img {height:100%;}
    .pika-stage .caption {visibility:hidden; position:static;  background: rgba(0,0,0,0.75);  border: 1px solid #141414; font-size: 11px; color: #fafafa; padding: 10px; text-align: right; bottom: 50px; right: 10px;}
	.pika-stage .caption p {padding: 0; margin: 0; line-height: 14px;}

/* Ths play, pause, prev and next buttons */
.pika-imgnav a {position: absolute; text-indent: -5000px; display: block;z-index:3;}
	.pika-imgnav a.previous {background: url(prev_g.png) no-repeat right; height: 100%; width: 20px; top: 0; left:0; cursor:pointer;}
	.pika-imgnav a.previous:hover {background-position: 0;}	
	.pika-imgnav a.previous:active {background-position: -2px;}	
	
	.pika-imgnav a.next {background: url(next_g.png) no-repeat right; height: 100%; width: 20px; top: 0; right:0; cursor:pointer;}
	.pika-imgnav a.next:hover {background-position: 0;}	
	.pika-imgnav a.next:active {background-position: 2px;}
	
	.pika-imgnav a.play {background: url(play.png) no-repeat 0% 50%; height: 100px; width: 44px;top:0;left:50%;display: none;cursor:pointer;}
	.pika-imgnav a.pause {background: url(pause.png) no-repeat 0% 50%; height: 100px; width: 44px;top:0;left:50%;display:none;cursor:pointer;}

/* The previous and next textual buttons */
.pika-textnav {display: none; overflow: hidden; margin: 10px 0 0 0;bottom:10px; position:absolute;}
.pika-textnav a {display: none;font-size: 12px; text-decoration: none; color: #333; padding: 4px;}
	.pika-textnav a.previous {float: left; width: auto; display: block;}
	.pika-textnav a.next {float: right; width: auto; display: block;}

/*for the tool tips*/
.pika-tooltip{font-size:12px;position:absolute;color:white;padding:3px; background-color: rgba(0,0,0,0.7);border:3px solid black;}
.pika-counter{visibility: hidden;  position: absolute;bottom: -16px;left:150px;color:white;background:rgba(148,172,12,0.7);font-size:10px;padding:2px;-moz-border-radius: 5px;border-radius:5px;}

/* If using user thumbnails there's a pause well the new large image loads. This is the loader for that */		
.pika-loader{ background:url(loading.gif) 3px 3px no-repeat #000; background-color:rgba(0,0,0,0.9); color:white; width:40px; font-size:11px; padding:5px 3px; 
	text-align:right; position:absolute; top:15px; right:15px; }

/* jCarousel Styles*/


.jcarousel-skin-pika .jcarousel-clip { overflow: hidden;}
.jcarousel-skin-pika .jcarousel-clip-horizontal { height: 42px; }
.jcarousel-skin-pika .jcarousel-item { width: 38px; height: 38px; padding:2px; }
.jcarousel-skin-pika .jcarousel-item-horizontal { padding-left: 4px; padding-right: 4px; }


.jcarousel-skin-pika .jcarousel-prev-horizontal { position: absolute; background: url(prev_t.png) no-repeat right; height: 100%; width: 14px; top: 0; left:-14px; cursor:pointer; }
.jcarousel-skin-pika .jcarousel-prev-horizontal:hover {background-position: 0;}	 
.jcarousel-skin-pika .jcarousel-prev-horizontal:active {  background-position: -2px }
.jcarousel-skin-pika .jcarousel-prev-disabled-horizontal,
.jcarousel-skin-pika .jcarousel-prev-disabled-horizontal:hover,
.jcarousel-skin-pika .jcarousel-prev-disabled-horizontal:focus,
.jcarousel-skin-pika .jcarousel-prev-disabled-horizontal:active { cursor: default; background-position: -196px 0; }


.jcarousel-skin-pika .jcarousel-next-horizontal { position: absolute; background: url(next_t.png) no-repeat right; height: 100%; width: 14px; top: 0; right:-14px; cursor:pointer; }
.jcarousel-skin-pika .jcarousel-next-horizontal:hover {background-position: 0;}	
.jcarousel-skin-pika .jcarousel-next-horizontal:active { background-position: 2px; }
.jcarousel-skin-pika .jcarousel-next-disabled-horizontal,
.jcarousel-skin-pika .jcarousel-next-disabled-horizontal:hover,
.jcarousel-skin-pika .jcarousel-next-disabled-horizontal:focus,
.jcarousel-skin-pika .jcarousel-next-disabled-horizontal:active { cursor: default; background-position: -196px 0; }