#md-icon .md-note,#md-icon:focus a,#md-icon:hover a{background-color:#febf2d}#md-icon *{box-sizing:border-box}#md-icon{display:flex;flex-wrap:wrap;align-content:center;justify-content:flex-end;position:relative}#md-icon a{display:flex;width:28px;height:28px;padding:4px;border-radius:50%;transition:background-color .3s}#md-icon svg{width:20px;height:20px}#md-icon path{fill:#fff;transition:fill .3s}#md-icon.light path{fill:#fff}#md-icon.dark path,#md-icon.light:focus path,#md-icon.light:hover path,#md-icon:focus path,#md-icon:hover path{fill:#000}#md-icon .md-note{color:#000;font-family:sans-serif;height:24px;font-size:10px;text-transform:uppercase;line-height:1.1;white-space:nowrap;padding:6px 10px;border-radius:4px;position:absolute;top:2px;right:40px;transform:translateX(30px);opacity:0;transition:opacity .3s,transform .3s;pointer-events:none}#md-icon .md-note:after{content:"";display:block;width:1px;height:1px;border:4px solid transparent;border-left-width:6px;border-left-color:#febf2d;position:absolute;left:100%;top:8px}#md-icon:focus .md-note,#md-icon:hover .md-note{transform:translateX(0);opacity:1}