/** initial setup **/ .nano { /* position : relative; width : 100%; height : 100%;*/ overflow : hidden !important; } .nano .content { position : absolute; overflow : scroll; /*overflow-x : hidden;*/ top : 0; right : 0; bottom : 0; left : 0; -webkit-overflow-scrolling: touch; } .nano .content .content-wrapper { height: 100%; } .nano .content::-webkit-scrollbar { visibility: hidden; } .has-scrollbar .content::-webkit-scrollbar { /*visibility: visible;*/ visibility: hidden; } .nano-visibility-hidden::-webkit-scrollbar { visibility: hidden; } .nano > .pane { background : none; position : absolute; width : 5px; right : 0; top : 1px; bottom : 1px; opacity : .01; filter: alpha(opacity=1); -webkit-transition : .4s; -moz-transition : .4s; -o-transition : .4s; transition : .4s; -moz-border-radius : 5px; -webkit-border-radius : 5px; border-radius : 5px; z-index: 102; margin : 2px; } .nano > .pane2 { background : none; position : absolute; height : 5px; right : 1px; left : 1px; bottom : 0; opacity : .01; filter: alpha(opacity=1); -webkit-transition : .4s; -moz-transition : .4s; -o-transition : .4s; transition : .4s; -moz-border-radius : 5px; -webkit-border-radius : 5px; border-radius : 5px; z-index: 10000; margin : 2px; } .nano > .pane > .slider { background-color: #999; background-color: rgba(0, 0, 0, 0.3); position : relative; margin : 0; -moz-border-radius : 3px; -webkit-border-radius : 3px; border-radius : 3px; width : 5px; } .nano > .pane2 > .slider2 { background-color: #999; background-color: rgba(0, 0, 0, 0.3); position : relative; margin : 0; -moz-border-radius : 3px; -webkit-border-radius : 3px; border-radius : 3px; height : 5px; } .nano:hover > .pane, .nano:hover > .pane2, .pane.activescroll, .pane2.activescroll, .pane.active, .pane2.active, .pane.flashed, .pane2.flashed { visibility : visible\9; /* Target only IE7 and IE8 with this hack */ opacity : 0.99; filter: alpha(opacity=99); } .nano > .pane:hover, .nano > .pane.active { background-color: rgba(0, 0, 0, 0.15); } .nano > .pane2:hover, .nano > .pane2.active { background-color: rgba(0, 0, 0, 0.15); } .nano > .pane:hover > .slider, .nano > .pane.active > .slider { background-color: rgba(0, 0, 0, 0.4); } .nano > .pane2:hover > .slider2, .nano > .pane2.active > .slider2 { background-color: rgba(0, 0, 0, 0.4); }