/*
	JQUERY TOOL
	complete scrollable navigation
*/

/* main vertical scroll */ 
#main { 
    position:relative; 
    overflow:hidden; 
    height: 225px; 
} 
 
/* root element for pages */ 
#pages { 
    position:absolute;
	width: 678px; 
    height:20000em; 
	background: #024878;
} 
/* root element for horizontal scrollables */ 
.scrollable { 
    position: relative; 
    overflow: hidden;
	width: 860px;  
    /*width: 510px;*/ 
    /*height: 336px;*/
	height: 350px; 
} 
 
/* root element for scrollable items */ 
.scrollable .items { 
    width: 20000em; 
    position: absolute; 
    clear: both; 
}
/* single scrollable item */
.item {
	float:left;
	cursor:pointer;
	width: 860px;
	height: 450px;
	padding: 1px 5px;
	margin-left: 10px;
}

/* main navigator */
#main_navi {
	float:left;
	padding:0px !important;
	margin:0px !important;
}

#main_navi li {
	background: #035a96 url(../images/bg_li_gallery.gif) no-repeat bottom left;
	border-bottom: 1px solid #00aeef;
	clear:both;
	color:#FFFFFF;
	font-size:12px;
	height: 92px;
	width: 302px;
	padding:10px;
	cursor:pointer;
	list-style-type:none;
}

#main_navi li:hover {
	background:#024878 url(../images/bg_li_gallery.gif) no-repeat top left;
}

#main_navi li.active {
	background:#024878 url(../images/bg_li_gallery.gif) no-repeat top left;
}

#main_navi img {
	float:left;
	margin: 8px 5px;
}

#main_navi li p {
	text-align: left;
	font-size: 11px;
	float:left;
	padding-left: 10px;
}
#main_navi li p span {
	font-weight: bold;
	font-size: 17px;
	line-height: 26px;
}


/* navigator */

/* position and dimensions of the navigator */
div.navi {
	margin-left: 326px;
	cursor:pointer;
	width:200px;
	height: 20px;
}


/* items inside navigator */
div.navi a {
	width:8px;
	height:8px;
	float:left;
	margin: 10px 3px;
	background: url(../images/navigator.png) 0 0 no-repeat;
	display:block;
	font-size:1px;
}

/* mouseover state */
div.navi a:hover {
	background-position:0 -8px;      
}

/* active state (current page state) */
div.navi a.active {
	background-position:0 -16px;     
} 

/*
	JQUERY TOOL
	Overlay eye candy
*/

/* the overlayed element */ 
.simple_overlay { 
    display:none; 
    z-index:10000; 
    background-color:#FFFFFF; 
    -moz-box-shadow:0 0 50px 2px #000; 
    -webkit-box-shadow: 0 0 50px #000;     
}
/* close button positioned on upper right corner */ 
.simple_overlay .close { 
    background-image:url(../images/close.png); 
    position:absolute; 
    right:-15px; 
    top:-15px; 
    cursor:pointer; 
    height:35px; 
    width:35px; 
	z-index: 100;
}

/* styling for elements inside overlay */ 
.details { 
    position:absolute; 
    top:15px; 
    right:15px; 
    font-size:11px; 
    color:#fff; 
    width:150px; 
} 
.details h3 { 
    color:#aba; 
    font-size:15px; 
    margin:0 0 -10px 0; 
}
.prev, .next{
	width: 22px;
	height: 22px;
	position: absolute;
	top: 91%;
	z-index: 100;
	cursor: pointer;
}
.prev { left:45%; background: url(../images/prev.png) no-repeat bottom  }
.next { right:45%; background: url(../images/next.png) no-repeat bottom  }

.prev.disabled { cursor: default; left:45%; background: url(../images/prev.png) no-repeat top  }
.next.disabled { cursor: default; right:45%; background: url(../images/next.png) no-repeat top  }
