/**
 * TrackpadScrollEmulator
 * Version: 1.0.1
 * Author: Jonathan Nicol @f6design
 * https://github.com/jnicol/trackpad-scroll-emulator
 */

.tse-scrollable
{
    position: relative;
    width:100%;
    height:100%;
    overflow: hidden;
}
.tse-scrollable .tse-scroll-content
{
    overflow: hidden;
    overflow-y: auto;
}
/* No longer using ::scrollbar too, since it breaks Chrome 25 */
.tse-scrollable .tse-scroll-content::-webkit-scrollbar
{
    width: 0;
    height: 0;
}
.tse-scrollbar
{
    z-index: 99;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 15px;
     
    border-radius: 2px;
}
.tse-scrollbar .drag-handle
{
    position: absolute;
    right: 2px;
    -webkit-border-radius: 7px;
    -moz-border-radius: 7px;
    border-radius: 7px;
    min-height: 10px;
    width: 11px;
    opacity: 0.2;
    -webkit-transition: opacity 0.2s linear;
    -moz-transition: opacity 0.2s linear;
    -o-transition: opacity 0.2s linear;
    -ms-transition: opacity 0.2s linear;
    transition: opacity 0.2s linear;
    background-color: #446644;
    -webkit-background-clip: padding-box;
    -moz-background-clip: padding;
}
.tse-scrollbar:hover .drag-handle
{
    /* When hovered, remove all transitions from drag handle */
    opacity: 0.7;
    -webkit-transition: opacity 0.2 linear;
    -moz-transition: opacity 0.2 linear;
    -o-transition: opacity 0.2 linear;
    -ms-transition: opacity 0.2 linear;
    transition: opacity 0.2 linear;
}
.tse-scrollbar .drag-handle.visible
{
    opacity: 1;
}
/* Used when testing the scrollbar width */
/* No longer using ::scrollbar too, since it breaks Chrome 25 */
.scrollbar-width-tester::-webkit-scrollbar
{
    width: 0;
    height: 0;
}
/* Horizontal scroller */
.tse-scrollable.horizontal .tse-scroll-content
{
    overflow-x: scroll;
    overflow-y: hidden;
}
.tse-scrollable.horizontal .tse-scroll-content::-webkit-scrollbar, .tse-scrollable.horizontal .tse-scroll-content::scrollbar
{
    width: auto;
    height: 0;
}
.tse-scrollable.horizontal .tse-scrollbar
{
    top: auto;
    left: 0;
    width: auto;
    height: 11px;
}
.tse-scrollable.horizontal .tse-scrollbar .drag-handle
{
    right: auto;
    top: 2px;
    height: 7px;
    min-height: 0;
    min-width: 10px;
    width: auto;
}
