﻿.custom-scroll_ {

	&container {
		overflow: hidden !important;
		position: relative;
	}

	&inner {
		overflow: scroll;
		height: 100%;
		*position: absolute; /* ie7 fix */
		*left: 0;
		*right: 0;
		-ms-overflow-style: none;

		&::-webkit-scrollbar {
			width: 0;
			height: 0;
		}
	}

	&bar-y,
	&bar-x {
		cursor: default;
		position: absolute;
		border-radius: 0;
		z-index: 1;
		background: #888;
		opacity: .4;
		-webkit-user-select: none;
		-khtml-user-select: none;
		-moz-user-select: none;
		-o-user-select: none;
		user-select: none;
		transition: opacity .2s;

		&:hover {
			opacity: .7;
		}

		&:active {
			opacity: 1;
		}
	}

	&bar-y {
		top: 0;
		right: 0;
		width: 7pt;
	}

	&bar-x {
		left: 0;
		bottom: 0;
		height: 7pt;
	}

	&hidden-y > &bar-y,
	&hidden-x > &bar-x {
		opacity: 0;
		visibility: hidden;
		transition: opacity .2s, visibility step-end .3s;
	}
}
