/*scroll const is obsolete*/
@const scroll_border:#95BAF5;
@const scroll_base1:#F2F4F7;
@const scroll_base2:#F2F4F7;
@const scroll_hover1:#F0F5FB;
@const scroll_hover2:#E5EDFB;
@const scroll_default1:#F2F2F2;
@const scroll_default2:#F8F8F8;
@const scroll_active1:#E7EEF9;
@const scroll_active2:#F0F5FB;

@const default_color:#333;
@const tips_color:#666;
@const link_color:#10469E;
@const link_hover_color:#10469E;
@const link_disabled_color:#999;
@const border_color:#A2BEEC;
@const border_light_color:#CBD5E5;
@const bg_color:#F4F7FC;
@const bg_gradient_color1:#FFF;
@const bg_gradient_color2:#E5EFFF;
@const bg_node_hover:#eff5ff;
@const bg_node_selected:#e5efff;

@const btn_bg:#EEF3F5;
@const btn_glow:#66B6EE;
@const btn_border:#98B8DD;
@const btn_border_hover:#66B6EE;
@const btn_border_active:#AAC1E3;

@const font_list:"lucida grande",tahoma,verdana,arial,sans-serif;

/*vertical-scrollbar:my-v-scrollbar*/
/*@set my-v-scrollbar{.prev{background-color:@scroll_base1 @scroll_base2 @scroll_base2 @scroll_base1;background-image:url(RC://localImage/html/img/sb-v-scroll-prev.png);background-position:50% 50%;background-repeat:no-repeat;}.next{background-color:@scroll_base1 @scroll_base2 @scroll_base2 @scroll_base1;background-image:url(RC://localImage/html/img/sb-v-scroll-next.png);background-position:50% 50%;background-repeat:no-repeat;}.base,.next-page,.prev-page{background:@scroll_base1 @scroll_base2 @scroll_base2 @scroll_base1;}.slider{border:1px solid @scroll_border;background:@scroll_default1 @scroll_default2 @scroll_default2 @scroll_default1;}.next:disabled,.slider:disabled,.prev:disabled{height:0; border:none; background-image:none}.base:disabled{background-image:url(RC://localImage/html/img/sb-scroll-base.png);background-repeat:repeat;background-position:0 0 0 0;background:none}.next:hover,.slider:hover,.prev:hover{background-color:@scroll_hover1 @scroll_hover2 @scroll_hover2 @scroll_hover1; border:1px solid @scroll_border}.next:active,.slider:active,.prev:active{background-color:@scroll_active1 @scroll_active2 @scroll_active2 @scroll_active1; border:1px solid @scroll_border}.base{width:16px}}*/

@set my-v-scrollbar{
	.prev, .next, .prev:disabled, .next:disabled {
		background-image:none;
		background-position:center center;
		background-repeat:no-repeat;
	}
	.prev,.prev:hover {
		/*background-image:url(RC://localImage/theme/public/image/sb-v-scroll-prev.png);*/
	}
	.next,.next:hover {
		/*background-image:url(RC://localImage/theme/public/image/sb-v-scroll-next.png);*/
	}
	.slider {
		background-image:url(RC://skinImage/theme/public/image/sb-v-scroll-slider1.png);
		background-position:3px 0 3px 0;
		background-repeat:expand;
		min-height:30px;
	}
	.slider:hover {
		background-image:url(RC://skinImage/theme/public/image/sb-v-scroll-slider2.png);
	}
	.slider:active {
		background-image:url(RC://skinImage/theme/public/image/sb-v-scroll-slider3.png);
	}
	.base {
		width:14px;
	}
	.prev-page, .next-page {
		background:none;
	}
}

body {font-family:@font_list; font:system}

_service > popup[role=tooltip] {line-height:1em; padding:3px 3px 2px 3px; font-size:12px; color:@tips_color; max-width:450px}

select option:checked {background:none; color:#000}
select option:current {background:#316AC5; color:#FFF}
select popup {border:1px solid @border_color}

.gameListSelect popup {border:1px solid @border_color; padding:0}
.gameListBox h5 {height:27px; line-height:27px; text-align:center; font-size:12px; font-weight:normal; margin:0; flow:horizontal; text-indent:0; padding:0!important}
.gameListBox h5 a {display:inline-block; width:*; color:@default_color; text-decoration:none; background:@bg_gradient_color1 @bg_gradient_color1 @bg_gradient_color2 @bg_gradient_color2; border-bottom:1px solid @border_color}
.gameListBox h5 a:first-child {border-right:1px solid @border_color}
.gameListBox h5 a.current {background-color:#FFF; border-bottom-color:#FFF}
.gameListBox div {width:344px; height:110px; overflow-x:hidden; overflow-y:auto; vertical-scrollbar:my-v-scrollbar; flow:h-flow}
.gameListBox div option {width:100px; padding:3px 10px 3px 0; color:@default_color; cursor:pointer; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; /*float:left*/} /*child flow:h-flow & overflow padding bug*/
.gameListBox div option:current {background:none; color:@link_color}
/*.gameListBox div.space {width:330px; height:1px}*/
.gameListBox div {position:relative; left:14px}

/****************************** form ******************************/

input[type=checkbox] {transition:none; width:18px; height:18px; background-image:url(RC://localImage/theme/public/image/BaseCheckbox.png); background-repeat:no-repeat; background-position:0 0}
input[type=checkbox]:hover {background-position:-18px 0}
input[type=checkbox]:active {background-position:-36px 0}
input[type=checkbox]:checked {background-position:0 -18px}
input[type=checkbox]:checked:hover {background-position:-18px -18px}
input[type=checkbox]:checked:active {background-position:-36px -18px}

input[type=radio] {transition:none; width:18px; height:18px; background-image:url(RC://localImage/theme/public/image/radio_icon.png); background-repeat:no-repeat; background-position:0 0}
input[type=radio]:hover {background-position:-18px 0}
input[type=radio]:active {background-position:-36px 0}
input[type=radio]:checked {background-position:0 -18px}
input[type=radio]:checked:hover {background-position:-18px -18px}
input[type=radio]:checked:active {background-position:-36px -18px}
input[type=radio]:disabled {background-position:-54px 0}
input[type=radio]:checked:disabled {background-position:-54px -18px}

.inp {height:14px; padding:4px; border:1px solid @border_color; vertical-align:middle; context-menu:selector(null)}

.btn {height:22px; line-height:22px; color:#002945!important; border:1px solid @btn_border; border-radius:2px; padding:0 20px; background:@bg_gradient_color1 @bg_gradient_color1 @btn_bg @btn_bg; cursor:pointer; vertical-align:middle}
.btn:hover {border-color:@btn_border_hover; outline:1px glow @btn_glow; transition:none}
.btn:active {background:@btn_bg @btn_bg @bg_gradient_color1 @bg_gradient_color1; border-color:@btn_border_active; outline:none} /*outline:0 bug*/
.btn:active > * {position:static}
.btn:disabled {color:@tips_color!important; border-color:#AAC1E3}
a.btn {display:inline-block; text-decoration:none}
a.btn:hover {text-decoration:none!important; color:#002945}

.sel {padding:0; height:22px; border:1px solid @border_color; text-indent:0.2em; vertical-align:middle}
.sel:hover {border-color:@border_color; outline:1px glow @border_color}
.sel option {text-indent:0.2em}
.sel button {background-image:url(RC://localImage/theme/public/image/icon_select_arrow.gif); border-left:1px solid @border_color; background-color:@bg_gradient_color1 @bg_gradient_color1 @bg_gradient_color2 @bg_gradient_color2;}
.sel:hover button {background-color:@bg_gradient_color2 @bg_gradient_color2 @bg_gradient_color1 @bg_gradient_color1; border-color:@border_color}
.sel:disabled button {border-color:transparent}
.sel popup {padding:0; line-height:22px}

.inp,.sel {background-image:url(RC://localImage/theme/public/image/bg_input.gif); background-repeat:expand; background-position:5px 3px 3px 6px}
.inp:disabled,.sel:disabled {background-color:#F5F5F5; background-image:none; color:@tips_color}

/*system popup menu*/
menu {border:1px solid #AAC1E3; background-color:#EFF6FD; padding-left:20px}
menu li {padding:6px 8px; background:#FFF; foreground-image:none!important}
menu li:current {background:highlight}
menu li:disabled {}
menu li span.accesskey {padding-left:5px; width:*; text-align:right}
menu hr {border-color:#AAC1E3; border-bottom:0; margin:0}
/*input[type=text] {context-menu:none}*/

/****************************** turn page ******************************/

.pageBox {height:15px; line-height:15px; width:100%; text-align:center; position:relative; font-size:12px; font-family:Arial, Helvetica, sans-serif}
.pageBox a {display:inline-block; margin:0 7px; text-decoration:none}

.pageBox em {font-style:normal}
.pageBox em a {color:#002945; padding:0 4px; border-radius:2px}
.pageBox em a:hover {color:#002945; background:#CBD9F1; text-decoration:none}
.pageBox em a.current {color:#FFF; background:#6C94D9; cursor:default}

.pageBox .firstPage,.pageBox .prevPage,.pageBox .nextPage,.pageBox .lastPage {width:11px; height:15px; background-image:url(RC://localImage/theme/public/image/btn_turn_page.png); background-repeat:no-repeat}
.pageBox .firstPage:hover,.pageBox .prevPage:hover,.pageBox .nextPage:hover,.pageBox .lastPage:hover {background-color:#CBD9F1; border-radius:2px}
.pageBox .firstPage {background-position:0px center}
.pageBox .prevPage {background-position:-11px center}
.pageBox .nextPage {background-position:-22px center}
.pageBox .lastPage {background-position:-33px center}
.pageBox .firstPage.disabled {background-position:-44px center}
.pageBox .prevPage.disabled {background-position:-55px center}
.pageBox .nextPage.disabled {background-position:-66px center}
.pageBox .lastPage.disabled {background-position:-77px center}
.pageBox .disabled {cursor:default}
.pageBox .disabled:hover {background-color:transparent}

.pageBox strong {font-weight:normal; color:#002945; display:inline-block; text-wrap:none; position:absolute; left:0; top:0}