flatui/css/nanoscroller.css

0001 /** initial setup **/
0002 .nano {
0003   position : relative;
0004   width    : 100%;
0005   height   : 100%;
0006   overflow : hidden;
0007 }
0008 .nano > .nano-content {
0009   position      : absolute;
0010   overflow      : scroll;
0011   overflow-x    : hidden;
0012   top           : 0;
0013   right         : 0;
0014   bottom        : 0;
0015   left          : 0;
0016 }
0017 .nano > .nano-content:focus {
0018   outline: thin dotted;
0019 }
0020 .nano > .nano-content::-webkit-scrollbar {
0021   visibility: hidden;
0022 }
0023 .has-scrollbar > .nano-content::-webkit-scrollbar {
0024   visibility: visible;
0025 }
0026 .nano > .nano-pane {
0027   background : rgba(0,0,0,.25);
0028   position   : absolute;
0029   width      : 10px;
0030   right      : 0;
0031   top        : 0;
0032   bottom     : 0;
0033   visibility : hidden\9; /* Target only IE7 and IE8 with this hack */
0034   opacity    : .01;
0035   -webkit-transition    : .2s;
0036   -moz-transition       : .2s;
0037   -o-transition         : .2s;
0038   transition            : .2s;
0039   -moz-border-radius    : 5px;
0040   -webkit-border-radius : 5px;
0041   border-radius         : 5px;
0042 }
0043 .nano > .nano-pane > .nano-slider {
0044   background: #444;
0045   background: rgba(0,0,0,.5);
0046   position              : relative;
0047   margin                : 0 1px;
0048   -moz-border-radius    : 3px;
0049   -webkit-border-radius : 3px;
0050   border-radius         : 3px;
0051 }
0052 .nano:hover > .nano-pane, .nano-pane.active, .nano-pane.flashed {
0053   visibility : visible\9; /* Target only IE7 and IE8 with this hack */
0054   opacity    : 0.99;
0055 }