| 1 |
- ._fingeringContainer_ruvam_1{width:100%;height:100%;display:flex;justify-content:space-evenly;align-items:center;padding:0 .26667rem .16rem}._vertical_ruvam_9{position:relative;padding:.26667rem .16rem .26667rem 0;box-shadow:rgba(0,0,0,.05) 0 0 .26667rem}._vertical_ruvam_9 ._imgs_ruvam_14{flex:1}._vertical_ruvam_9:before{content:"";position:absolute;left:0;top:0;right:0;height:.8rem;background:linear-gradient(180deg,#FFFFFF 0%,rgba(255,255,255,0) 100%);z-index:1}._vertical_ruvam_9:after{content:"";position:absolute;left:0;bottom:0;right:0;height:.8rem;background:linear-gradient(360deg,#FFFFFF 0%,rgba(255,255,255,0) 100%);z-index:1}._imgs_ruvam_14{position:relative;width:84%;height:100%}._imgs_ruvam_14>img{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:block;max-width:100%;max-height:100%}._rightContent_ruvam_51{display:flex;flex-direction:column;justify-content:space-evenly;align-items:center;height:100%;flex-shrink:0}.saxophone{padding:.26667rem 0}.saxophone ._imgs_ruvam_14{width:100%}.saxophone ._rightContent_ruvam_51{position:absolute;right:.16rem;height:90%}.horn{padding:.26667rem .10667rem}.horn ._imgs_ruvam_14{width:100%}.horn ._rightContent_ruvam_51{position:absolute;right:.26667rem;height:100%}.up-bass-horn,.tuba{padding:.26667rem .10667rem}.up-bass-horn ._imgs_ruvam_14,.tuba ._imgs_ruvam_14{width:100%}.up-bass-horn ._rightContent_ruvam_51,.tuba ._rightContent_ruvam_51{position:absolute;right:.26667rem;height:100%}._yidiao_ruvam_95{width:.8rem;color:var(--van-primary-color);font-size:12Px;text-align:center;opacity:0}._tizhi_ruvam_102{width:.8rem;height:.8rem;text-align:center;line-height:.8rem;border-radius:100%;background-color:var(--van-primary-color);color:#fff;box-shadow:0 0 .26667rem rgba(0,0,0,.05);font-size:12Px;opacity:0;pointer-events:none}._tizhi_ruvam_102:active{opacity:.8}._canDisplay_ruvam_118{opacity:1;pointer-events:initial}@keyframes _activeopacity_ruvam_1{0%{transforopacitym:0}to{opacity:1}}@keyframes _leftrotates_ruvam_1{0%{transform:rotate(0)}50%{transform:rotate(-10deg)}to{transform:rotate(-10deg)}}@keyframes _rightrotates_ruvam_1{0%{transform:rotate(0)}50%{transform:rotate(5deg)}to{transform:rotate(5deg)}}.small-drum img[data-index=active]{animation:_activeopacity_ruvam_1 .2s;animation-delay:.3s;transform-origin:0 0}.small-drum img[data-index=left]{animation:_leftrotates_ruvam_1 .5s;transform-origin:0 0}.small-drum img[data-index=right]{animation:_rightrotates_ruvam_1 .5s;transform-origin:0 0}.piccolo{margin-top:0}
|
