/****************************************/
/* SCROLLABLE AREA */
/****************************************/
#scrollbar{border:1px solid rgb(0,118,180); border-radius:0px; -moz-border-radius:0px; -webkit-border-radius:0px;}
#scrollbar .clear{clear:both; height:1px; padding:0; margin:0;}

.scrollable {
	/* required settings */
	position:relative;
	overflow:hidden;
	width: 460px;
	height:155px;
	/* custom decorations */
        float:left;
        border:1px solid rgb(200,200,200);
        border-width:0;
}

/* needed to contain all items */
.scrollable .items{width:20000em; position:absolute; clear:both; }

/* vertical align by using display table and cell */
.items div.floater {float:left; height:155px; width:420px; padding:10px 20px 0 20px; margin:0; overflow:hidden;}

.items div.floater img.image{float:right; margin:0; padding:0;}
.items div.floater h1.header{font-size:13px !important; color:black !important; font-weight:bold !important; padding:0 10px 0 10px; margin-top:0;}
.items div.floater p.bodytext{ font-size:11px !important; padding:0 10px 0 10px !important;}
.items div.floater p.link {padding:0 10px 0 10px !important;}
.items div.floater p.link a{font-size:11px !important; text-decoration:none; font-weight:bold;}

/* clear floating area on bottom*/
div.scrollable_bottom{clear:both; height:1px; padding:0; margin:0;}


/* prev, next, prevPage and nextPage buttons */
a.browse {
	display:block;
	width:20px;
	height:155px;
	float:left;
	margin:0;
        padding:0;
	font-size:1px;
        cursor:pointer;
}

/* right */
a.right { clear:right; margin-right: 0px; background-image:url(../images/scrollable/scrollbar_browse_right_bright.png); background-repeat: no-repeat; background-position:50% 50%;}
a.right:hover {  background-color:transparent !important; background-image:url(../images/scrollable/scrollbar_browse_right.png);}
a.right:active 	{  }

/* left */
a.left	{ margin-left: 0px; background-image:url(../images/scrollable/scrollbar_browse_left_bright.png); background-repeat: no-repeat; background-position:50% 50%;}
a.left:hover {  background-color:transparent !important; background-image:url(../images/scrollable/scrollbar_browse_left.png); }
a.left:active  	{  }










/****************************************/
/* NOT USED*/
/****************************************/
/* up and down */
a.up, a.down{background:url(../images/scrollable/vert_large.png) no-repeat; float: none; margin: 10px 50px;}

/* up */
a.up:hover { background-position:-30px 0; }
a.up:active { background-position:-60px 0; }
/* down */
a.down { background-position: 0 -30px; }
a.down:hover { background-position:-30px -30px; }
a.down:active  	{ background-position:-60px -30px; }

/* disabled navigational button */
a.disabled {visibility:hidden !important;}

/* active item */
.scrollable .active {border:2px solid #000; position:relative; cursor:default;}



/****************************************/
/* NAVIGATION */
/****************************************/

.navi_bar {clear:both; width:745px; text-align:center;}

/* position and dimensions of the navigator */
.navi {
	height:20px;
        width:300px;
        margin:325px;
        text-align:center;
}

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

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

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