.vue-scroll-picker{position:relative;width:100%;height:10em;overflow:hidden}.vue-scroll-picker-list{position:absolute;top:0;bottom:0}[dir=ltr] .vue-scroll-picker-list,[dir=rtl] .vue-scroll-picker-list{left:0;right:0}.vue-scroll-picker-list-rotator{position:absolute;top:calc(50% - .6em)}[dir=ltr] .vue-scroll-picker-list-rotator,[dir=rtl] .vue-scroll-picker-list-rotator{left:0;right:0}.vue-scroll-picker-list-rotator.-transition{transition:top .2s ease}.vue-scroll-picker-item{height:1.2em;line-height:1.2em}[dir] .vue-scroll-picker-item{text-align:center}.vue-scroll-picker-item.-placeholder{color:#aaa}.vue-scroll-picker-layer{position:absolute;top:0;bottom:0}[dir=ltr] .vue-scroll-picker-layer,[dir=rtl] .vue-scroll-picker-layer{left:0;right:0}.vue-scroll-picker-layer .bottom,.vue-scroll-picker-layer .middle,.vue-scroll-picker-layer .top{position:absolute}.vue-scroll-picker-layer .top{box-sizing:border-box;top:0;height:calc(50% - 1em)}[dir] .vue-scroll-picker-layer .top{border-bottom:1px solid #c8c7cc;cursor:pointer}[dir=ltr] .vue-scroll-picker-layer .top{background:linear-gradient(180deg,#fff 10%,hsla(0,0%,100%,.7));left:0;right:0}[dir=rtl] .vue-scroll-picker-layer .top{background:linear-gradient(-180deg,#fff 10%,hsla(0,0%,100%,.7));right:0;left:0}.vue-scroll-picker-layer .middle{top:calc(50% - 1em);bottom:calc(50% - 1em)}[dir=ltr] .vue-scroll-picker-layer .middle,[dir=rtl] .vue-scroll-picker-layer .middle{left:0;right:0}.vue-scroll-picker-layer .bottom{bottom:0;height:calc(50% - 1em)}[dir] .vue-scroll-picker-layer .bottom{border-top:1px solid #c8c7cc;background:linear-gradient(0deg,#fff 10%,hsla(0,0%,100%,.7));cursor:pointer}[dir=ltr] .vue-scroll-picker-layer .bottom,[dir=rtl] .vue-scroll-picker-layer .bottom{left:0;right:0}.vue-scroll-picker-group.flex{display:flex}.vue-scroll-picker-group:after{display:table;content:""}[dir] .vue-scroll-picker-group:after{clear:both}.vue-scroll-picker-group>.vue-scroll-picker-1{width:8.33333%}[dir=ltr] .vue-scroll-picker-group>.vue-scroll-picker-1{float:left}[dir=rtl] .vue-scroll-picker-group>.vue-scroll-picker-1{float:right}.vue-scroll-picker-group>.vue-scroll-picker-2{width:16.66667%}[dir=ltr] .vue-scroll-picker-group>.vue-scroll-picker-2{float:left}[dir=rtl] .vue-scroll-picker-group>.vue-scroll-picker-2{float:right}.vue-scroll-picker-group>.vue-scroll-picker-3{width:25%}[dir=ltr] .vue-scroll-picker-group>.vue-scroll-picker-3{float:left}[dir=rtl] .vue-scroll-picker-group>.vue-scroll-picker-3{float:right}.vue-scroll-picker-group>.vue-scroll-picker-4{width:33.33333%}[dir=ltr] .vue-scroll-picker-group>.vue-scroll-picker-4{float:left}[dir=rtl] .vue-scroll-picker-group>.vue-scroll-picker-4{float:right}.vue-scroll-picker-group>.vue-scroll-picker-5{width:41.66667%}[dir=ltr] .vue-scroll-picker-group>.vue-scroll-picker-5{float:left}[dir=rtl] .vue-scroll-picker-group>.vue-scroll-picker-5{float:right}.vue-scroll-picker-group>.vue-scroll-picker-6{width:50%}[dir=ltr] .vue-scroll-picker-group>.vue-scroll-picker-6{float:left}[dir=rtl] .vue-scroll-picker-group>.vue-scroll-picker-6{float:right}.vue-scroll-picker-group>.vue-scroll-picker-7{width:58.33333%}[dir=ltr] .vue-scroll-picker-group>.vue-scroll-picker-7{float:left}[dir=rtl] .vue-scroll-picker-group>.vue-scroll-picker-7{float:right}.vue-scroll-picker-group>.vue-scroll-picker-8{width:66.66667%}[dir=ltr] .vue-scroll-picker-group>.vue-scroll-picker-8{float:left}[dir=rtl] .vue-scroll-picker-group>.vue-scroll-picker-8{float:right}.vue-scroll-picker-group>.vue-scroll-picker-9{width:75%}[dir=ltr] .vue-scroll-picker-group>.vue-scroll-picker-9{float:left}[dir=rtl] .vue-scroll-picker-group>.vue-scroll-picker-9{float:right}.vue-scroll-picker-group>.vue-scroll-picker-10{width:83.33333%}[dir=ltr] .vue-scroll-picker-group>.vue-scroll-picker-10{float:left}[dir=rtl] .vue-scroll-picker-group>.vue-scroll-picker-10{float:right}.vue-scroll-picker-group>.vue-scroll-picker-11{width:91.66667%}[dir=ltr] .vue-scroll-picker-group>.vue-scroll-picker-11{float:left}[dir=rtl] .vue-scroll-picker-group>.vue-scroll-picker-11{float:right}.vue-scroll-picker-group>.vue-scroll-picker-12{width:100%}[dir=ltr] .vue-scroll-picker-group>.vue-scroll-picker-12{float:left}[dir=rtl] .vue-scroll-picker-group>.vue-scroll-picker-12{float:right}