@import "config.less";

.ui-fastscroll {
	position: absolute;
	right: 0*@unit_base;
	background-color: @color_fastscroll_rollover_bg;
	width: 25*@unit_base;
	-ms-user-select: none;
	-o-user-select: none;
	-moz-user-select: none;
	-webkit-user-select: none;
	user-select:none;
	margin:0;
	padding-right: 0.08em;
	opacity: 1;
	ul {
		list-style-type: none;
		margin: 0;
		padding: 0;
	}
	li {
		cursor: pointer;
		color: @color_fastscroll_rollover_text;
		padding: 2*@unit_base 2*@unit_base 2*@unit_base 2*@unit_base;
		text-align: center;
		vertical-align: middle;
		font-size : 16 * @unit_base;
		font-weight : bold;

		border-left-width : 3 * @unit_base;
		border-left-color : @color_fastscroll_popup_bg;
		border-left-style : solid;

		border-top-width : 3 * @unit_base;
		border-top-color : @color_fastscroll_rollover_bg;
	}
}

.ui-fastscroll2 {
	position: absolute;
	right: 0*@unit_base;
	-ms-user-select: none;
	-o-user-select: none;
	-moz-user-select: none;
	-webkit-user-select: none;
	user-select: none;
	margin:0;
	padding-right: 0.08em;
	opacity: 1;
	ul {
		list-style-type: none;
		margin: 0;
		padding: 0;
	}
	li {
		cursor: pointer;
		color: @color_fastscroll_rollover_text;
		padding: 2*@unit_base 2*@unit_base 2*@unit_base 2*@unit_base;
		text-align: right;
	}
}

.ui-fastscroll-bg {
	position: absolute;
	right: 0*@unit_base;
	background-color: @color_fastscroll_rollover_bg;
	width: 25 * @unit_base;
	z-index: 10;
	top: 0;
}

.ui-fastscroll-popup {
	position: absolute;
	background: @color_fastscroll_popup_bg;
	color: @color_fastscroll_popup_text;
	padding:10*@unit_base 30*@unit_base;
	border: 1px solid @color_fastscroll_popup_border;
	border-radius: .1em;
	box-shadow: -2px -2px 2px #fff, 8*@unit_base 10*@unit_base 4*@unit_base @color_fastscroll_popup_shadow;
	text-shadow: 0px -2px -2px @color_fastscroll_popup_shadow;
	text-align: center;
	font-size: 75*@unit_base;
	font-weight: bold;
	display:none;
	box-sizing:border-box;
	left: 50%;
	top: 50%;
}

li.ui-fastscroll-hover,
li.ui-fastscroll-hover-down {
	border-style : solid;
	border-color : @color_fastscroll_popup_bg;
	border-width : 0px;

	padding-top : 0px;
	padding-bottom : 0px;
}

li.ui-fastscroll-hover {
	background : @color_list_bg;
	color : @color_fastscroll_popup_bg;

	border-top-width : 3 * @unit_base;
	border-right-width : 3 * @unit_base;
	border-left-width : 1px;
	border-left-color : @color_list_bg;
}

li.ui-fastscroll-hover-first-item {
	border-top-width : 0px;
	padding-top : 1.5 * @unit_base;
	padding-bottom : 1.5 * @unit_base;
}

li.ui-fastscroll-hover-down {
	border-top-width : 3 * @unit_base;
	border-left-width : 3 * @unit_base;
	padding-bottom : 2 * @unit_base;
}