/*

	root element for the scrollable.

	when scrolling occurs this element stays still.

*/

.scrollable {



	/* required settings */

	position:relative;

	overflow:hidden;

	width: 410px;

	height:68px;



	/* custom decorations */

	border:0px solid #ccc;

	background:url(/indexcss/images/scrollable/h300.png) repeat-x;

}



/*

	root element for scrollable items. Must be absolutely positioned

	and it should have a extremely large width to accomodate scrollable items.

	it's enough that you set the width and height for the root element and

	not for this element.

*/

.scrollable .items {

	/* this cannot be too large */

	width:20000em;

	position:absolute;

	

}



.items div {

	float:left;

	width:410px;

}



/* single scrollable item */

.scrollable img {

	float:left;

	margin:5px 2px 2px 12px;

	background-color:#fff;

	padding:2px;

	border:1px solid #ccc;

	width:60px;

	height:54px;

	

	-moz-border-radius:4px;

	-webkit-border-radius:4px;

}



/* active item */

.scrollable .active {

	border:2px solid #000;

	position:relative;

	cursor:default;

}







/* this makes it possible to add next button beside scrollable */

.scrollable {

	float: left;	

}





.scrollable0 {



	/* required settings */

	position:relative;

	overflow:hidden;

	width: 410px;

	height:68px;



	/* custom decorations */

	border:0px solid #ccc;

	background:url(/indexcss/images/scrollable/h300.png) repeat-x;

}



/*

	root element for scrollable items. Must be absolutely positioned

	and it should have a extremely large width to accomodate scrollable items.

	it's enough that you set the width and height for the root element and

	not for this element.

*/

.scrollable0 .items {

	/* this cannot be too large */

	width:20000em;

	position:absolute;

	

}



.items div {

	float:left;

	width:410px;

}



/* single scrollable item */

.scrollable0 img {

	float:left;

	margin:5px 2px 2px 12px;

	background-color:#fff;

	padding:2px;

	border:1px solid #ccc;

	width:60px;

	height:54px;

	

	-moz-border-radius:4px;

	-webkit-border-radius:4px;

}



/* active item */

.scrollable0 .active {

	border:2px solid #000;

	position:relative;

	cursor:default;

}







/* this makes it possible to add next button beside scrollable */

.scrollable0 {

	float: left;	

}





/* prev, next, prevPage and nextPage buttons */

a.browse {

	background:url(/indexcss/images/scrollable/hori_large2.png) no-repeat;

	display:block;

	width:18px;

	height:18px;

	float:left;

	margin:28px 2px 0px 2px;

	cursor:pointer;

	font-size:1px;

}



/* right */

a.right 				{ background-position: 0 -18px; clear:right; margin-right: 0px;}

a.right:hover 		{ background-position:-18px -18px; }

a.right:active 	{ background-position:-54px -18px; } 





/* left */

a.left				{ margin-left: 0px; } 

a.left:hover  		{ background-position:-18px 0; }

a.left:active  	{ background-position:-54px 0; }



/* up and down */

a.up, a.down		{ 

	background:url(/indexcss/images/scrollable/vert_large.png) no-repeat; 

	float: none;

	margin: 10px 10px;

}



/* 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;		

}



/* the overlayed element */

.simple_overlay {

	

	/* must be initially hidden */

	display:none;

	

	/* place overlay on top of other elements */

	z-index:10000;

	

	/* styling */

	background-color: #efefef;

	

	width:670px;	

	min-height:200px;

	border:1px solid #666;

	

	/* CSS3 styling for latest browsers */

	-moz-box-shadow:0 0 90px 5px #000;

	-webkit-box-shadow: 0 0 90px #000;	

}



/* close button positioned on upper right corner */

.simple_overlay .close {

	background-image:url(/indexcss/images/scrollable/close.png);

	position:absolute;

	right:-1px;

	top:-1px;

	cursor:pointer;

	height:35px;

	width:35px;

}







.simple_overlay0 {

	

	/* must be initially hidden */

	display:none;

	

	/* place overlay on top of other elements */

	z-index:10000;

	

	/* styling */

	background-color: #efefef;

	

	width:300px;	

	min-height:200px;

	border:1px solid #666;

	

	/* CSS3 styling for latest browsers */

	-moz-box-shadow:0 0 90px 5px #000;

	-webkit-box-shadow: 0 0 90px #000;	

}



/* close button positioned on upper right corner */

.simple_overlay0 .close {

	background-image:url(/indexcss/images/scrollable/close.png);

	position:absolute;

	right:-1px;

	top:-1px;

	cursor:pointer;

	height:35px;

	width:35px;

}



.details{ padding:0px 20px;}



.logonceping{background:url(/indexcss/images/scrollable/reg.gif) no-repeat; width:70px; height:27px; display:block;color:#FFF; font-size:18px; text-align:center; line-height:24px; font-weight:bold;}

.regceping{background:url(/indexcss/images/scrollable/reg.gif) no-repeat; width:70px; height:27px; display:block;color:#FFF; font-size:14px; text-align:center; line-height:24px;font-weight:bold;}