/* ŠO˜g */
.scrollable_outline {
    float: left;
	width: 738px;
	border: 1px solid #CCC;
	background-color: #FFF;
}

/* prev, next, prevPage and nextPage buttons */
a.browse {
    background: url(../images/hori_large.png) no-repeat;
    display: block;
    width: 25px;
    height: 50px;
    float: left;
    margin: auto 0;
    cursor: pointer;
    font-size: 1px;
}

a.right { background-position: 0 -50px; float: right; margin-top: 70px;}
a.right:hover { background-position: -25px -50px; }
a.right:active { background-position: -50px -50px; }


a.left { margin-top: 70px; }
a.left:hover  { background-position: -25px 0; }
a.left:active { background-position: -50px 0; }

a.disabled {
    visibility: hidden !important;
}

/* scrollable */
.scrollable {
	float: left;
    position: relative;
    overflow: hidden;
    width: 686px;
    height: 179px;
}

.scrollable .items {
    /* this cannot be too large */
    width: 20000em;
    position: absolute;
    clear: both;
}

.items .outBox {
    float: left;
    width: 668px;
	padding: 9px;
}

.items div .bnBox {
    float: left;
    width: 216px;
	margin-right: 10px;
}

.items div .bnBox_Left {
    float: left;
    width: 216px;
	margin-bottom: 9px;
}

.items div .bnBox .ichiitem, .items div .bnBox_Left .ichiitem {
    float: left;
	margin-bottom: 10px;
}

.scrollable img {
    float: left;
    border: 1px solid #CCC;
	padding: 2px;
	background-color: #FFF;
    width: 210px;
    height: 74px;
}

/* position and dimensions of the navigator */
.navi {
	float: left;
	margin-left:350px;
	width: 100px;
	padding: 5px 0;
	display: inline;
}

/* items inside navigator */
.navi a {
    width: 8px;
    height: 8px;
    float: left;
    margin: 3px;
    background: url(../images/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;
}