/*
 * CSS Styles that are needed by jScrollPane for it to operate correctly.
 *
 * Include this stylesheet in your site or copy and paste the styles below into your stylesheet - jScrollPane
 * may not operate correctly without them.
 */

.jspContainer
{
	overflow: hidden;
	position: relative;
}

.jspPane
{
	position: absolute;
}

.jspVerticalBar
{
	position: absolute;
	top: 0;
	right: 0;
	width: 10px;
	height: 100%;
	background: #fff;

}

.jspHorizontalBar
{
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 10px;
	background: #fff;
}

.jspVerticalBar *,
.jspHorizontalBar *
{
	margin: 0;
	padding: 0;
}

.jspCap
{
	display: none;
}

.jspHorizontalBar .jspCap
{
	float: left;
}

.jspTrack
{
	background: #fff;
	position: relative;
}

.jspDrag
{
	background: #000;
	position: relative;
	top: 0;
	left: 0;
	cursor: pointer;
}

.jspHorizontalBar .jspTrack,
.jspHorizontalBar .jspDrag
{
	float: left;
	height: 100%;
}

.jspArrow
{
	background: #50506d;
	text-indent: -20000px;
	display: block;
	cursor: pointer;
}

.jspArrow.jspDisabled
{
	cursor: default;
	background: #80808d;
}

.jspVerticalBar .jspArrow
{
	height: 10px;
}

.jspHorizontalBar .jspArrow
{
	width: 10px;
	float: left;
	height: 100%;
}

.jspVerticalBar .jspArrow:focus
{
	outline: none;
}

.jspCorner
{
	background: #eeeef4;
	float: left;
	height: 100%;
}

/* Yuk! CSS Hack for IE6 3 pixel bug :( */
* html .jspCorner
{
	margin: 0 -3px 0 0;
}
.wrapper{
	float:left;
	width:484px;
	height:470px;
	padding:0px 10px;
	position:relative;
	overflow:hidden;
}
.cr-container{
	width:457px;
	height:344px;
	background: url('../images/galerija_background.png');
	position:relative;
	z-index:100;
	margin:0 auto;
}
.cr-content-wrapper{
	width:100%;
	height:100%;
	overflow:hidden;
}
.cr-content-container{
	display:none;
	position:absolute;
	width:100%;
	height:100%;
	top:0px;
	left:0px;
	display:none;
	overflow:hidden;
}
.cr-img{
	position:absolute;
	top:20px;
	left:22px;
	width:405px;
	height:287px;
	z-index:1;
}
.cr-content{
	position:relative;
	z-index:10;
	margin:20px;
	height:360px;
}
.cr-content h2{
	font-size:50px;
	line-height:40px;
	width:70%;
	color:#fff;
	text-shadow: 1px -1px 1px rgba(0,0,0,0.5);
	font-family: 'Holtwood One SC', serif;
}
.cr-content h3{
	width:40%;
	color:#fff;
	padding:15px 0px;
	line-height:30px;
}
.cr-content h3 span{
	background:#000;
	padding:4px 0px;
	font-style:italic;
	font-family:Georgia, serif;
	letter-spacing:3px;
	font-size:16px;
}
.cr-more-link{
	text-transform:uppercase;
	color:#000;
	font-size:11px;
	padding:0px 5px;
}
.cr-more-link:hover{
	text-shadow: 1px -1px 1px rgba(0,0,0,0.5);
	color:#fff;
}
.cr-content-text{
	color:#000;
	background:transparent url(../images/images_gallery/bg_content.png) repeat top left;
	font-size: 14px;
	font-family: Georgia;
	font-style: italic;
	line-height: 24px;
	position:relative;
	display:none;
	z-index:999;
	clear:both;
}
.cr-content-text p{
	padding:10px;
}
.cr-thumbs{
	position:absolute;
	left:7px;
	height:90px;
	width:462px;
	top:353px;
	z-index:20;
	overflow:hidden;
}
.cr-thumbs div{
	float:left; /* Set to absolute each 150px*/
	cursor:pointer;
	position:relative;
	display:none;
	margin-right:20px;
	width:94px;
	height:80px;
}
.cr-thumbs img{
	display:block;
	margin:6px 5px 6px 0px;
	border:none;
	opacity:0.6;
	width:94px;
	height:80px;
}
.cr-thumbs div:hover img{
	opacity:1.0;
}
.cr-thumbs h4{
	position:absolute;
	left:15px;
	right:15px;
	bottom:15px;
	font-family:'Holtwood One SC', serif;
	font-size:13px;
	line-height:14px;
	text-shadow:0px 1px 1px rgba(0,0,0,0.5);
	color:#fff;
}
.cr-thumbs div:hover h4{
	bottom:14px;
}
.cr-thumbs div.cr-selected img{
	opacity:1.0;
}
.cr-nav span{
	position:absolute;
	z-index:50;
	text-indent:-9000px;
	cursor:pointer;
	width:30px;
	height:30px;
	left:-25px;
	top:383px;
}
.cr-nav-prev {background:transparent url(../images/btn_back.png) no-repeat;}
.cr-nav-next {background:transparent url(../images/btn_next.png) no-repeat;}
.cr-nav span.cr-nav-next{
	right:-24px;
	left:auto;
}
.cr-nav span.cr-nav-prev:hover,
.cr-nav span.cr-nav-next:hover{
	opacity: 0.7;
}
.cr-hide, .cr-show{
	display:none;
	position:absolute;
	z-index:50;
	left:50%;
	margin-left:-25px;
	bottom:-10px;
	background:#000 url(../images/images_gallery/hide.png) no-repeat top center;
	cursor:pointer;
	width:60px;
	height:15px;
}
.cr-show{
	background-position:bottom center;
}