@charset "utf-8";

.aplayer-bar-wrap { margin: 0px 0px 0px 5px; padding: 4px 0px; cursor: pointer; -webkit-box-flex: 1; flex: 1 1 0%; }

.aplayer-bar-wrap .aplayer-bar { position: relative; height: 2px; width: 100%; background: rgb(205, 205, 205); }

.aplayer-bar-wrap .aplayer-bar .aplayer-loaded { position: absolute; left: 0px; top: 0px; bottom: 0px; background: rgb(170, 170, 170); height: 2px; transition: 0.5s; will-change: width; }

.aplayer-bar-wrap .aplayer-bar .aplayer-played { position: absolute; left: 0px; top: 0px; bottom: 0px; height: 2px; transition: background-color 0.3s; will-change: width; }

.aplayer-bar-wrap .aplayer-bar .aplayer-played .aplayer-thumb { position: absolute; top: 0px; right: 5px; margin-top: -5px; margin-right: -10px; width: 10px; height: 10px; border: 1px solid; transform: scale(0.8); will-change: transform; transition: transform 300ms, background-color 0.3s, border-color 0.3s, -webkit-transform 300ms; border-radius: 50%; background: rgb(255, 255, 255); cursor: pointer; overflow: hidden; }

.aplayer-bar-wrap .aplayer-bar .aplayer-played .aplayer-thumb:hover { transform: scale(1); }

.aplayer-bar-wrap .aplayer-bar .aplayer-played .aplayer-thumb .aplayer-loading-icon { display: none; width: 100%; height: 100%; }

.aplayer-bar-wrap .aplayer-bar .aplayer-played .aplayer-thumb .aplayer-loading-icon svg { position: absolute; animation: 1s linear 0s infinite normal none running spin; fill: rgb(255, 255, 255); }

.aplayer-loading .aplayer-bar-wrap .aplayer-bar .aplayer-thumb .aplayer-loading-icon { display: block; }

.aplayer-loading .aplayer-info .aplayer-controller .aplayer-bar-wrap .aplayer-bar .aplayer-played .aplayer-thumb { transform: scale(1); }

@-webkit-keyframes spin { 
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

@keyframes spin { 
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}