/*IMPORT ROBOTO FONT*/


/* Just for the example. Fee free to delete these three lines 
body{font-family: 'Roboto Condensed', sans-serif;}
a{color:white;}
.pikachoose {width: 100%; margin: 0 auto;}*/

.pikame-container {width:auto;margin-top: 15px;background: transparent;
	/*-webkit-border-radius: 10px;
	-moz-border-radius-left: 10px;
	-ms-border-radius: 10px;
	-o-border-radius: 10px; 
	border-radius: 10px;*/
}

/* Style the thumbnails */
.pika-thumbs {padding: 0;width: 100% !important;margin: 0 auto;background: transparent;overflow:hidden;
	/*-webkit-border-bottom-left-radius: 10px; 
	-moz-border-radius-bottomleft: 10px;
	-ms-border-bottom-left-radius: 10px;
	-o-border-bottom-left-radius: 10px; 
	border-bottom-left-radius: 10px;
	-webkit-border-bottom-right-radius: 10px; 
	-moz-border-radius-bottomright: 10px;
	-ms-border-bottom-right-radius: 10px;
	-o-border-bottom-right-radius: 10px; 
	border-bottom-right-radius: 10px;*/
}	
	.pika-thumbs li {position: relative;width: 23%;height:58px;margin: 0 1%;overflow: hidden;float: left;list-style-type: none;padding: 0; background: transparent;cursor: pointer;
	-webkit-border-radius: 10px; 
	-moz-border-radius: 10px;
	-ms-border-radius: 10px;
	-o-border-radius: 10px; 
	border-radius: 10px;
	/*-webkit-border-bottom-right-radius: 10px; 
	-moz-border-radius-bottomright: 10px;
	-ms-border-bottom-right-radius: 10px;
	-o-border-bottom-right-radius: 10px; 
	border-bottom-right-radius: 10px;*/
}
	.pika-thumbs li .clip {position:relative;height:100%;text-align: center; vertical-align: middle; overflow: hidden;background: transparent;
	-webkit-border-radius: 10px; 
	-moz-border-radius: 10px;
	-ms-border-radius: 10px;
	-o-border-radius: 10px; 
	border-radius: 10px;
	/*-webkit-border-bottom-right-radius: 9px; 
	-moz-border-radius-bottomright: 9px;
	-ms-border-bottom-right-radius: 9px;
	-o-border-bottom-right-radius: 9px; 
	border-bottom-right-radius: 9px;*/
}
	
/* The stage is the wrapper. The image fills 100% the height of the stage */
.pika-textnav {display: none;}
.pika-stage {width: 100%;position: relative;background: transparent;height: 100% !important;margin: 0 auto;
	-webkit-border-radius: 10px; 
	-moz-border-radius: 10px;
	-ms-border-radius: 10px;
	-o-border-radius: 10px; 
	border-radius: 10px;
	/*-webkit-border-top-right-radius: 10px; 
	-moz-border-radius-topright: 10px;
	-ms-border-top-right-radius: 10px;
	-o-border-top-right-radius: 10px; 
	border-top-right-radius: 10px;*/
}
.pika-stage img{width: 100%;padding: 0;background: transparent;
	-webkit-border-radius: 10px; 
	-moz-border-radius: 10px;
	-ms-border-radius: 10px;
	-o-border-radius: 10px; 
	border-radius: 10px;
	/*-webkit-border-top-right-radius: 9px; 
	-moz-border-radius-topright: 9px;
	-ms-border-top-right-radius: 9px;
	-o-border-top-right-radius: 9px; 
	border-top-right-radius: 9px;*/
}

/* SHERIFF MOD */

#sheriff-pikame	.pika-thumbs li {position: relative;width: 21%;height:58px;margin: 0 1%;overflow: hidden;float: left;list-style-type: none;padding: 1%; background: #d5dce4;cursor: pointer;
	-webkit-border-radius: 0px; 
	-moz-border-radius: 0px;
	-ms-border-radius: 0px;
	-o-border-radius: 0px; 
	border-radius: 0px;
	/*-webkit-border-bottom-right-radius: 10px; 
	-moz-border-radius-bottomright: 10px;
	-ms-border-bottom-right-radius: 10px;
	-o-border-bottom-right-radius: 10px; 
	border-bottom-right-radius: 10px;*/
}

	.pika-thumbs li .clip {position:relative;height:100%;text-align: center; vertical-align: middle; overflow: hidden;background: transparent;
	-webkit-border-radius: 5px; 
	-moz-border-radius: 5px;
	-ms-border-radius: 5px;
	-o-border-radius: 5px; 
	border-radius: 5px;
	/*-webkit-border-bottom-right-radius: 9px; 
	-moz-border-radius-bottomright: 9px;
	-ms-border-bottom-right-radius: 9px;
	-o-border-bottom-right-radius: 9px; 
	border-bottom-right-radius: 9px;*/
}



#sheriff-pikame .pika-stage img{width: 98%;padding: 1%;background: #d5dce4;
	-webkit-border-radius: 0px; 
	-moz-border-radius: 0px;
	-ms-border-radius: 0px;
	-o-border-radius: 0px; 
	border-radius: 0px;
	/*-webkit-border-top-right-radius: 9px; 
	-moz-border-radius-topright: 9px;
	-ms-border-top-right-radius: 9px;
	-o-border-top-right-radius: 9px; 
	border-top-right-radius: 9px;*/
}

/* END OF SHERIFF MOD */


/* CLERK OF COURT MOD */

#coc-pikame .pika-stage img{width: 98%;padding: 1%;background: #d5dce4;
	-webkit-border-radius: 0px; 
	-moz-border-radius: 0px;
	-ms-border-radius: 0px;
	-o-border-radius: 0px; 
	border-radius: 0px;
	/*-webkit-border-top-right-radius: 9px; 
	-moz-border-radius-topright: 9px;
	-ms-border-top-right-radius: 9px;
	-o-border-top-right-radius: 9px; 
	border-top-right-radius: 9px;*/
}


/* END OF CLERK OF COURT MOD */

.pika-stage .caption {position: absolute; background: #000; background: rgba(0,0,0,0.8);border: 0px solid #141414;font-size: 18px; 
			color: #ffffff; padding: 10px 2%; text-align: left; bottom: 0px; left: 0px;width: 96%;}
	.pika-stage .caption p {padding: 0; margin: 0; line-height: 14px;}
	.pika-stage .caption a {color: #ffffff !important;text-decoration: none;}

/* 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.png) no-repeat left 80%; height: 70%; width: 50px; top: 0px; left: 10px;cursor:pointer;}
	.pika-imgnav a.next {background: url(next.png) no-repeat right 80%; height: 70%; width: 50px; top: 0px; right: 10px;cursor:pointer;}
	.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;}

/* Ths play, pause, prev and next buttons - Clerk of Court */
#coc-pikame	.pika-imgnav a {position: absolute; text-indent: -5000px; display: block;z-index:3;}
#coc-pikame	.pika-imgnav a.previous {background: url(prev-coc.png) no-repeat left 80%; height: 70%; width: 50px; top: 0px; left: 10px;cursor:pointer;}
#coc-pikame	.pika-imgnav a.next {background: url(next-coc.png) no-repeat right 80%; height: 70%; width: 50px; top: 0px; right: 10px;cursor:pointer;}
#coc-pikame	.pika-imgnav a.play {background: url(play-coc.png) no-repeat 0% 50%; height: 100px; width: 44px;top:0;left:50%;display: none;cursor:pointer;}
#coc-pikame	.pika-imgnav a.pause {background: url(pause-coc.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 {overflow: hidden; margin: 10px 0 0 0;bottom:10px; position:absolute;}
.pika-textnav a {font-size: 12px; text-decoration: none; color: #333; padding: 4px;}
	.pika-textnav a.previous {float: left; width: auto; display: none;}
	.pika-textnav a.next {float: right; width: auto; display: none;}

/*for the tool tips*/
.pika-tooltip{font-size:12px;position:absolute;color:white;padding:3px; background-color: rgba(0,0,0,0.8);border:0px solid black;}
.pika-counter{display: none;position: absolute;bottom: 45px;left:15px;color:white;background:rgba(0,0,0,0.8);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; }

.thumb-span {position: absolute;width: 100%;text-align: center;background: rgb(0, 51, 102);background: rgba(0, 51, 102, 0.8);color: #fff;bottom: 0px;font-size: 12px;}

@media screen and (max-width : 480px) {
	.pika-stage .caption {font-size: 12px;padding: 5px 2%; text-align: left; bottom: 0px; left: 0px;width: 96%;}
	.pika-stage .caption p {padding: 0; margin: 0; line-height: 8px;}
	.thumb-span {font-size: 12px;}
	.pika-thumbs li {width: 46%;height:58px;margin: 2px 1%;float: left;padding: 1%;}
}