div.advanced-dication-piano{position:relative;width:90%;margin:25px auto 45px;height:180px;display:flex;flex-direction:row-reverse}div.advanced-dication-piano div.key{width:4.5372050817%;height:99%;background:#fff;border:1px solid #ccc;box-shadow:inset 0 1px 0 #fff,inset 0 -1px 0 #fff,inset 1px 0 0 #fff,inset -1px 0 0 #fff,0 4px 3px rgba(0,0,0,.7);border-radius:0 0 3px 3px;display:flex;align-items:center;flex-flow:column-reverse}div.advanced-dication-piano div.key.green{box-shadow:0 4px 3px rgba(0,0,0,.7);background:#56e675;border-bottom:1px solid #56e675;border-left:1px solid #56e675}div.advanced-dication-piano div.key.red{box-shadow:0 4px 3px rgba(0,0,0,.7);background:red;border-bottom:1px solid red;border-left:1px solid red}div.advanced-dication-piano div.key.black.green{background:linear-gradient(-20deg,#56e675,#56e675,#56e675);border-color:#89c27c #55a150 #094205 #798479;border-style:solid;border-width:1px 2px 7px;box-shadow:inset 0 -1px 2px hsla(0,0%,100%,.4),0 2px 3px rgba(0,0,0,.4);border-radius:0 0 2px 2px}div.advanced-dication-piano div.key.black.red{background:linear-gradient(-20deg,red,red,red);border-color:#a194a1 #965e60 #792d2d #9e6464;border-style:solid;border-width:1px 2px 7px;box-shadow:inset 0 -1px 2px hsla(0,0%,100%,.4),0 2px 3px rgba(0,0,0,.4);border-radius:0 0 2px 2px}div.advanced-dication-piano div.key div.note-name{position:absolute;bottom:0;color:#000;font-size:1.1em;direction:ltr}div.advanced-dication-piano div.key.black{position:absolute;width:2.7%;height:67%;top:0;z-index:1;background:linear-gradient(-20deg,#333,#000,#333);border-color:#666 #222 #111 #555;border-style:solid;border-width:1px 2px 7px;box-shadow:inset 0 -1px 2px hsla(0,0%,100%,.4),0 2px 3px rgba(0,0,0,.4);border-radius:0 0 2px 2px}div.advanced-dication-piano div.key.black div.note-name{top:-1.5em}div.advanced-dication-piano div.key:nth-child(2){left:3.1%}div.advanced-dication-piano div.key:nth-child(4){left:7.7%}div.advanced-dication-piano div.key:nth-child(7){left:16.5%}div.advanced-dication-piano div.key:nth-child(9){left:21.1%}div.advanced-dication-piano div.key:nth-child(11){left:25.8%}div.advanced-dication-piano div.key:nth-child(14){left:34.8%}div.advanced-dication-piano div.key:nth-child(16){left:39.3%}div.advanced-dication-piano div.key:nth-child(19){left:48.6%}div.advanced-dication-piano div.key:nth-child(21){left:53%}div.advanced-dication-piano div.key:nth-child(23){left:57.6%}div.advanced-dication-piano div.key:nth-child(26){left:66.6%}div.advanced-dication-piano div.key:nth-child(28){left:71.2%}div.advanced-dication-piano div.key:nth-child(31){left:80.2%}div.advanced-dication-piano div.key:nth-child(33){left:84.7%}div.advanced-dication-piano div.key:nth-child(35){left:89.3%}div.advanced-dication-piano div.key:nth-child(13){position:relative}div.advanced-dication-piano div.key:nth-child(13):after{content:"C";position:absolute;bottom:-30px;left:31%;font-weight:700}div.advanced-dictation #audio,div.advanced-dictation #paper{display:none}div.advanced-dictation div.points{margin-top:30px}div.advanced-dictation #ins-wrap{width:100%;margin:0 auto;padding-bottom:20px;overflow-x:auto;overflow-y:hidden;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}