/* Just for the example. Fee free to delete these three lines */
.pikachoose { width: 700px; margin: 0 auto; }
/* Style the thumbnails */
.pika-thumbs { padding: 0; height: 102px; width: 584px; }
.pika-thumbs li { width: 135px; height: 102px; margin: 0 5px; padding: 0; 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; }
.pika-thumbs li img { display: block; float: left; }
/* The stage is the wrapper. The image fills 100% the height of the stage */
.pika-stage, .pika-textnav { width: 500px; }
.pika-stage { position: relative; text-align: center; height: 526px; margin: 0 0 10px 0; }
.pika-stage img { height: 100%; }
.pika-stage .caption { position: absolute; background: #000; 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 { display: none; }
/* The previous and next textual buttons */
.pika-textnav { overflow: hidden; bottom: -80px; position: absolute; width: 700px; /*z-index: 10;*/ }
.pika-textnav a { display: block; height: 32px; width: 49px; cursor: pointer; background-image: url(../images/detail-page-gallery-arrows.png); background-repeat: no-repeat; text-indent: -9999px; }
.pika-textnav a.previous { float: left; background-position: 0 0; }
.pika-textnav a.previous:hover { background-position: 0 -32px; }
.pika-textnav a.next { float: right; background-position: -49px 0; }
.pika-textnav a.next:hover { background-position: -49px -32px; }
/*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 { position: absolute; bottom: 45px; left: 15px; color: white; background: rgba(0,0,0,0.7); font-size: 11px; padding: 3px; -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: 60px; font-size: 11px; padding: 5px 3px; text-align: right; position: absolute; top: 15px; right: 15px; }
