@font-face {
	font-family: zm-player-icon-font;
	src: url(//at.alicdn.com/t/font_1433317952_4430285.eot?#iefix) format("embedded-opentype"), url(//at.alicdn.com/t/font_1433317952_4430285.woff) format("woff"), url(//at.alicdn.com/t/font_1433317952_4430285.ttf) format("truetype"), url(//at.alicdn.com/t/font_1433317952_4430285.svg#iconfont) format("svg");
}
.hide {
	display: none !important;
}
.show {
	display: block !important;
}
.pull-left {
	float: left !important;
}
.pull-right {
	float: right !important;
}
.zm-player {
	background: radial-gradient(at center, rgb(49, 51, 53) 0px, rgb(27, 28, 29) 100%); height: 100%; overflow: hidden; position: relative; z-index: 1; -webkit-user-select: none; -moz-user-select: none; user-select: none;
}
.is-ready.zm-player .player {
	left: 0px; top: 0px; width: 100%; height: 100%;
}
.is-ready.zm-player .cover-img {
	display: none !important;
}
.is-ready.is-paused.zm-player .cover-img {
	display: none !important;
}
.is-paused.zm-player .state .pause.icon {
	display: block;
}
.is-paused.zm-player .state .cover-img {
	display: block;
}
.is-paused.zm-player .control-bar .play.button.control .icon::after {
	content: "\e603";
}
.is-muted.zm-player .control-bar .volume.button.control .icon::after {
	content: "\e605";
}
.is-fullscreen.zm-player .control-bar .full-screen.button.control .icon::after {
	content: "\e600";
}
.is-waiting.zm-player .state {
	background: rgba(0, 0, 0, 0.4);
}
.is-waiting.zm-player .state .loading-spinner {
	display: block;
}
.is-waiting.zm-player .state .loading-spinner .spinner-container b {
	animation-play-state: running; -webkit-animation-play-state: running;
}
.is-hide-control-bar.zm-player .player-ui .control-bar {
	bottom: -37px !important;
}
.is-hide-control-bar.zm-player .player-ui .control-bar .progress-bar {
	left: 0px; top: 0px; right: 0px;
}
.is-hide-control-bar.zm-player .player-ui .control-bar .progress-bar .progress {
	border-radius: 0px; -webkit-border-radius: 0; -moz-border-radius: 0;
}
.is-hide-control-bar.zm-player .player-ui .control-bar .progress-bar .buffer {
	border-radius: 0px; -webkit-border-radius: 0; -moz-border-radius: 0;
}
.is-hide-control-bar.zm-player .player-ui .control-bar .progress-bar .progress b {
	display: none;
}
.is-error.zm-player .state {
	cursor: default;
}
.is-error.zm-player .state .error {
	display: table;
}
.is-error.zm-player .control-bar {
	display: none;
}
.zm-player .zm-player-container {
	height: 100%; font-size: 12px; position: relative; z-index: 1;
}
.zm-player .state {
	width: 100%; height: 100%; position: relative; cursor: pointer;
}
.zm-player .state .icon {
	left: 50%; top: 50%; width: 128px; height: 128px; margin-top: -64px; margin-left: -64px; display: none; position: absolute;
}
.zm-player .state .loading-spinner {
	left: 50%; top: 50%; width: 128px; height: 128px; margin-top: -64px; margin-left: -64px; display: none; position: absolute;
}
.zm-player .state .icon {
	font-size: 128px; opacity: 0.8; text-shadow: 0px 0px 20px rgba(0,0,0,0.5);
}
.zm-player .state .loading-spinner {
	width: 48px; height: 48px; margin-top: -24px; margin-left: -24px;
}
.zm-player .state .error {
	width: 100%; height: 100%; display: none; table-layout: fixed;
}
.zm-player .state .error .wrap {
	width: 100%; height: 100%; display: table-row;
}
.zm-player .state .error .inner-wrap {
	width: 100%; height: 100%; text-align: center; vertical-align: middle; display: table-cell;
}
.zm-player .state .error .inner-wrap .logo {
	vertical-align: top; display: inline-block;
}
.zm-player .state .error .inner-wrap .text {
	vertical-align: top; display: inline-block;
}
.zm-player .state .error .inner-wrap .logo {
	background: url("/static/desktop/widget/zm-player/zm_logo_x_db7e3fc.png"); width: 35px; height: 70px; margin-right: 20px;
}
.zm-player .state .error .inner-wrap .text {
	text-align: left; padding-top: 10px;
}
.zm-player .state .error .inner-wrap .text .title {
	display: block;
}
.zm-player .state .error .inner-wrap .text .message {
	display: block;
}
.zm-player .state .error .inner-wrap .text .title {
	color: rgb(255, 255, 255); line-height: 30px; font-size: 18px; font-weight: 700;
}
.zm-player .state .error .inner-wrap .text .message {
	color: rgb(184, 184, 184); font-size: 13px;
}
.zm-player .state .error .inner-wrap .button-wrap {
	padding-top: 30px; padding-left: 25px;
}
.zm-player .state .error .inner-wrap .button {
	background: rgb(235, 37, 37); padding: 0px 15px; border-radius: 2px; height: 30px; color: rgb(255, 255, 255); line-height: 30px; font-size: 14px; font-weight: 700; text-decoration: none; display: inline-block; -webkit-border-radius: 2px; -moz-border-radius: 2px;
}
.zm-player .icon {
	color: rgb(255, 255, 255); line-height: 1; font-family: zm-player-icon-font !important; font-style: normal; -webkit-font-smoothing: antialiased; -webkit-text-stroke-width: .2px; -moz-osx-font-smoothing: grayscale;
}
.zm-player .player {
	background: rgb(0, 0, 0); left: -999px; top: -999px; width: 0px; height: 0px; overflow: hidden; position: absolute; z-index: 1;
}
.zm-player .player-ratio {
	display: block;
}
.zm-player .player-ui {
	left: 0px; top: 0px; width: 100%; height: 100%; position: absolute; z-index: 2;
}
.zm-player .player-ui .control-bar {
	background: rgba(0, 0, 0, 0.8); left: 0px; height: 40px; right: 0px; bottom: 0px; position: absolute; z-index: 9;
}
.zm-player .player-ui .control-bar {
	transition:0.4s; -webkit-transition: all ease .4s; -moz-transition: all ease .4s;
}
.zm-player .player-ui .progress-bar {
	transition:0.4s; -webkit-transition: all ease .4s; -moz-transition: all ease .4s;
}
.zm-player .player-ui .control {
	height: 40px; position: absolute;
}
.zm-player .player-ui .button.control {
	outline: 0px; border: 0px currentColor; transition:0.2s; border-image: none; width: 40px; height: 40px; text-align: center; line-height: 40px; cursor: pointer; opacity: 0.8; background-color: transparent; -moz-transition: all ease .2s; -webki-ttransition: all ease .2s;
}
.zm-player .player-ui .button.control:hover {
	opacity: 1; background-color: rgb(0, 0, 0);
}
.zm-player .player-ui .button.control .icon {
	width: 16px; height: 16px; color: rgb(255, 255, 255); font-size: 16px; font-style: normal; display: inline-block;
}
.zm-player .player-ui .time.control {
	width: 50px; height: 40px; text-align: center; color: rgb(255, 255, 255); line-height: 40px; text-shadow: 0px 1px 3px rgba(0,0,0,0.9);
}
.zm-player .player-ui .play.control {
	left: 0px; top: 0px;
}
.zm-player .player-ui .play.control .icon::after {
	content: "\e602";
}
.zm-player .player-ui .current-time.control {
	left: 40px; top: 0px;
}
.zm-player .player-ui .progress-bar.control {
	background: rgba(255, 255, 255, 0.25); border-radius: 4px; left: 100px; top: 18px; height: 4px; right: 140px; -webkit-border-radius: 14px; -moz-border-radius: 14px;
}
.zm-player .player-ui .progress-bar.control .time-flag {
	background: rgb(0, 0, 0); padding: 0px 10px; border-radius: 2px; left: 0px; height: 24px; bottom: 12px; color: rgb(255, 255, 255); line-height: 24px; font-size: 12px; display: none; position: absolute; -webkit-border-radius: 2px; -moz-border-radius: 2px;
}
.zm-player .player-ui .progress-bar.control .show.time-flag {
	display: block;
}
.zm-player .player-ui .progress-bar.control .time-flag .arrow {
	border-width: 6px 6px 0px; border-style: solid; border-color: rgb(0, 0, 0) transparent transparent; border-image: none; left: 50%; bottom: -6px; margin-left: -6px; position: absolute; content: "";
}
.zm-player .player-ui .progress-bar.control .progress {
	border-radius: 6px; left: 0px; top: 0px; width: 0px; height: 4px; position: absolute; z-index: 1; -webkit-border-radius: 4px; -moz-border-radius: 4px;
}
.zm-player .player-ui .progress-bar.control .buffer {
	border-radius: 6px; left: 0px; top: 0px; width: 0px; height: 4px; position: absolute; z-index: 1; -webkit-border-radius: 4px; -moz-border-radius: 4px;
}
.zm-player .player-ui .progress-bar.control .progress {
	background: rgb(225, 182, 72); z-index: 2;
}
.zm-player .player-ui .progress-bar.control .progress b {
	background: rgb(255, 255, 255); border-radius: 100%; top: -2px; width: 8px; height: 8px; right: -4px; position: absolute; content: ""; box-shadow: 0px 1px 3px 1px rgba(0,0,0,0.1); -webkit-border-radius: 100%; -moz-border-radius: 100%;
}
.zm-player .player-ui .progress-bar.control .buffer {
	background: rgb(170, 170, 170);
}
.zm-player .player-ui .duration.control {
	top: 0px; right: 80px;
}
.zm-player .player-ui .volume.control {
	top: 0px; right: 40px;
}
.zm-player .player-ui .volume.control .icon::after {
	content: "\e604";
}
.zm-player .player-ui .full-screen.control {
	top: 0px; right: 0px;
}
.zm-player .player-ui .full-screen.control .icon::after {
	content: "\e601";
}
.lt-ie10 .zm-player .player-ui .state .loading-spinner {
	background: url("/static/desktop/widget/zm-player/loading_3d6ad79.gif") no-repeat center rgb(51, 51, 51); border-radius: 4px; left: 50%; top: 50%; width: 96px; height: 96px; margin-top: -48px; margin-left: -48px;
}
.lt-ie10 .zm-player .player-ui .state .loading-spinner .spinner-container {
	display: none;
}
.loading-spinner {
	width: 20px; height: 20px;
}
.loading-spinner .spinner-container {
	width: 100%; height: 100%; position: absolute;
}
.loading-spinner .spinner-container b {
	border-radius: 100%; animation:bouncedelay 1.2s ease-in-out infinite both; width: 10px; height: 10px; position: absolute; animation-play-state: paused; background-color: rgb(255, 255, 255); -webkit-animation: bouncedelay 1.2s infinite ease-in-out; -webkit-animation-fill-mode: both; -webkit-animation-play-state: paused;
}
.loading-spinner .container2 {
	transform: rotateZ(45deg); -webkit-transform: rotateZ(45deg);
}
.loading-spinner .container3 {
	transform: rotateZ(90deg); -webkit-transform: rotateZ(90deg);
}
.loading-spinner .circle1 {
	left: 0px; top: 0px;
}
.loading-spinner .circle2 {
	top: 0px; right: 0px;
}
.loading-spinner .circle3 {
	right: 0px; bottom: 0px;
}
.loading-spinner .circle4 {
	left: 0px; bottom: 0px;
}
.loading-spinner .container2 .circle1 {
	animation-delay: -1.1s; -webkit-animation-delay: -1.1s;
}
.loading-spinner .container3 .circle1 {
	animation-delay: -1s; -webkit-animation-delay: -1s;
}
.loading-spinner .container1 .circle2 {
	animation-delay: -0.9s; -webkit-animation-delay: -.9s;
}
.loading-spinner .container2 .circle2 {
	animation-delay: -0.8s; -webkit-animation-delay: -.8s;
}
.loading-spinner .container3 .circle2 {
	animation-delay: -0.7s; -webkit-animation-delay: -.7s;
}
.loading-spinner .container1 .circle3 {
	animation-delay: -0.6s; -webkit-animation-delay: -.6s;
}
.loading-spinner .container2 .circle3 {
	animation-delay: -0.5s; -webkit-animation-delay: -.5s;
}
.loading-spinner .container3 .circle3 {
	animation-delay: -0.4s; -webkit-animation-delay: -.4s;
}
.loading-spinner .container1 .circle4 {
	animation-delay: -0.3s; -webkit-animation-delay: -.3s;
}
.loading-spinner .container2 .circle4 {
	animation-delay: -0.2s; -webkit-animation-delay: -.2s;
}
.loading-spinner .container3 .circle4 {
	animation-delay: -0.1s; -webkit-animation-delay: -.1s;
}
