.xgplayer .xgplayer-poster {
	background-position: center; transition:opacity 0.3s, visibility 0.3s; left: 0px; top: 0px; width: 100%; height: 100%; display: block; visibility: visible; position: absolute; opacity: 1; pointer-events: none; background-repeat: no-repeat; background-size: 100% auto;
}
.xgplayer .xgplayer-poster.hide {
	visibility: hidden; opacity: 0;
}
.xgplayer.xgplayer-playing .xgplayer-poster {
	visibility: hidden; opacity: 0;
}
.xgplayer.xgplayer-playing .xg-not-hidden {
	visibility: visible; opacity: 1;
}
.xgplayer.xgplayer-is-enter .xgplayer-poster.xg-showplay {
	visibility: visible; opacity: 1;
}
.xgplayer.xgplayer-playing .xgplayer-poster.xg-showplay {
	visibility: visible; opacity: 1;
}
.xgplayer.xgplayer-nostart .xgplayer-poster {
	visibility: visible; opacity: 1;
}
.xgplayer.xgplayer-ended .xgplayer-poster {
	visibility: visible; opacity: 1;
}
.xgplayer.not-allow-autoplay .xgplayer-poster {
	visibility: visible; opacity: 1;
}
.xgplayer.xgplayer-nostart .xgplayer-poster.hide {
	visibility: hidden; opacity: 0;
}
.xgplayer.xgplayer-ended .xgplayer-poster.hide {
	visibility: hidden; opacity: 0;
}
.xgplayer.not-allow-autoplay .xgplayer-poster.hide {
	visibility: hidden; opacity: 0;
}
.xgplayer xg-start-inner {
	background: rgba(0, 0, 0, 0.38); border-radius: 50%; width: 100%; height: 100%; overflow: hidden; display: block;
}
.xgplayer .xgplayer-start {
	left: 50%; top: 50%; width: 70px; height: 70px; position: absolute; z-index: 5; cursor: pointer; transform: translate(-50%, -50%);
}
.xgplayer .xgplayer-start svg {
	width: 100%; height: 100%;
}
.xgplayer .xgplayer-start.hide {
	display: none; pointer-events: none;
}
.xgplayer .xgplayer-start.focus-hide {
	display: none; pointer-events: none;
}
.xgplayer .xgplayer-start:hover {
	opacity: 0.85;
}
.xgplayer .xgplayer-start .xg-icon-play {
	display: block;
}
.xgplayer .xgplayer-start .xg-icon-pause {
	display: none;
}
.xgplayer [data-state=pause].xgplayer-start .xg-icon-play {
	display: none;
}
.xgplayer [data-state=pause].xgplayer-start .xg-icon-pause {
	display: block;
}
.xgplayer .xgplayer-start.interact {
	display: block;
}
.xgplayer .xgplayer-start.interact xg-start-inner {
	animation:playPause 0.4s ease-out 0.1s forwards;
}
.xgplayer .xgplayer-start.show {
	display: block;
}
.xgplayer.xgplayer-mobile xg-start-inner {
	border-radius: 0px;
}
.xgplayer.xgplayer-mobile .xgplayer-start {
	width: 50px; height: 50px;
}
.xgplayer.xgplayer-mobile .xgplayer-start:hover {
	opacity: 1;
}
.xgplayer.xgplayer-inactive .xgplayer-start.auto-hide {
	display: none;
}
.xgplayer.xgplayer-is-enter .xgplayer-start.auto-hide {
	display: none;
}
.xgplayer.xgplayer-isloading.xgplayer-playing .xgplayer-start {
	display: none;
}
.xgplayer.xgplayer-is-enter .xgplayer-start {
	display: none;
}
.xgplayer.xgplayer-is-error .xgplayer-start {
	display: none;
}
.xgplayer.xgplayer-is-enter .xgplayer-start.show {
	display: none;
}
.xgplayer.xgplayer-is-error .xgplayer-start.show {
	display: none;
}
xg-loading-inner {
	transform-origin: center 50%; animation:loadingRotate 1s linear 0.1s infinite; width: 100%; height: 100%; display: block;
}
.xgplayer-loading {
	left: 50%; top: 50%; width: 70px; height: 70px; overflow: hidden; display: none; position: absolute; z-index: 10; pointer-events: none; transform: translate(-50%, -50%);
}
.xgplayer-loading svg {
	width: 100%; height: 100%;
}
.xgplayer-loading img {
	width: 100%; height: 100%;
}
.xgplayer-mobile .xgplayer-loading {
	width: 50px; height: 50px;
}
.xgplayer-isloading .xgplayer-loading {
	display: block;
}
.xgplayer-nostart .xgplayer-loading {
	display: none;
}
.xgplayer-pause .xgplayer-loading {
	display: none;
}
.xgplayer-is-enter .xgplayer-loading {
	display: none;
}
.xgplayer-is-ended .xgplayer-loading {
	display: none;
}
.xgplayer-is-error .xgplayer-loading {
	display: none;
}
.xgplayer .xgplayer-play .xg-icon-play {
	display: none;
}
.xgplayer .xgplayer-play .xg-icon-pause {
	display: block;
}
.xgplayer [data-state=pause].xgplayer-play .xg-icon-play {
	display: block;
}
.xgplayer [data-state=pause].xgplayer-play .xg-icon-pause {
	display: none;
}
.xgplayer .danmu-icon .danmu-switch {
	margin: 0px auto; display: flex;
}
.xgplayer .danmu-icon .danmu-switch-open {
	display: none;
}
.xgplayer .danmu-icon .danmu-switch-closed {
	display: block;
}
.xgplayer [data-state=active].danmu-icon .danmu-switch {
	padding-left: 12px; background-color: rgb(248, 89, 89);
}
.xgplayer [data-state=active].danmu-icon .danmu-switch-open {
	display: block;
}
.xgplayer [data-state=active].danmu-icon .danmu-switch-closed {
	display: none;
}
.xgplayer .xgplayer-danmu {
	left: 0px; top: 0px; height: 100%; right: 0px; overflow: hidden; display: none; position: absolute; pointer-events: none;
}
.xgplayer .xgplayer-danmu > * {
	position: absolute;
}
.xgplayer .xgplayer-danmu * {
	white-space: nowrap;
}
.xgplayer .xgplayer-panel {
	width: 40px; height: 40px; color: rgba(255, 255, 255, 0.8); font-size: 13px; display: inline-block; position: relative; z-index: 36;
}
.xgplayer .xgplayer-panel .xgplayer-panel-icon {
	position: absolute; cursor: pointer;
}
.xgplayer .xgplayer-panel-slider {
	background: rgba(0, 0, 0, 0.54); padding: 10px 20px; border-radius: 1px; left: -115px; width: 230px; height: 230px; bottom: 42px; display: none; position: absolute; z-index: 36;
}
.xgplayer .xgplayer-panel-slider .xgplayer-hidemode {
	padding-bottom: 10px;
}
.xgplayer .xgplayer-panel-slider .xgplayer-hidemode-radio li {
	list-style: none; display: inline; cursor: pointer;
}
.xgplayer .xgplayer-panel-slider .xgplayer-hidemode ul {
	display: flex; justify-content: space-around;
}
.xgplayer .xgplayer-panel-slider .xgplayer-hidemode li {
	margin: 0px 12px; color: rgb(170, 170, 170); font-size: 11px;
}
.xgplayer .xgplayer-panel-slider .xgplayer-hidemode-font {
	margin-bottom: 10px;
}
.xgplayer .xgplayer-panel-slider .xgplayer-transparency {
	margin-top: 10px; display: block;
}
.xgplayer .xgplayer-panel-slider .xgplayer-transparency .xgplayer-transparency-line {
	background: rgb(170, 170, 170); border-radius: 4px; width: 150px; height: 4px; margin-top: -2px; margin-left: 10px; cursor: pointer; -webkit-appearance: none; appearance: none; -moz-appearance: none;
}
.xgplayer .xgplayer-panel-slider .xgplayer-transparency .xgplayer-transparency-color::-ms-track {
	border-color: transparent; border-radius: 4px; width: 150px; height: 4px; color: transparent; background-color: rgb(170, 170, 170);
}
.xgplayer .xgplayer-panel-slider .xgplayer-transparency .xgplayer-transparency-bar::-ms-thumb {
	border-radius: 6px; border: 6px solid rgb(248, 89, 89); border-image: none; width: 6px; height: 6px; cursor: pointer; -webkit-appearance: none; appearance: none; -moz-appearance: none;
}
.xgplayer .xgplayer-panel-slider .xgplayer-showarea {
	margin-top: 8px; display: block;
}
.xgplayer .xgplayer-panel-slider .xgplayer-showarea-name {
	top: -10px; display: inline-block; position: relative;
}
.xgplayer .xgplayer-panel-slider .xgplayer-showarea-control {
	display: inline-block;
}
.xgplayer .xgplayer-panel-slider .xgplayer-showarea-control-up {
	width: 150px; color: rgb(170, 170, 170); margin-left: 10px; display: flex; justify-content: space-between;
}
.xgplayer .xgplayer-panel-slider .xgplayer-showarea-control-down {
	top: -10px; position: relative;
}
.xgplayer .xgplayer-panel-slider .xgplayer-showarea-control-down-dots {
	width: 150px; margin-left: 10px; display: flex; justify-content: space-between;
}
.xgplayer .xgplayer-panel-slider .xgplayer-showarea-twoquarters {
	margin-left: -6px;
}
.xgplayer .xgplayer-panel-slider .xgplayer-showarea-threequarters {
	margin-left: -6px;
}
.xgplayer .xgplayer-panel-slider .xgplayer-showarea-full {
	margin-right: 3px;
}
.xgplayer .xgplayer-panel-slider .xgplayer-showarea .xgplayer-showarea-line {
	background: rgb(170, 170, 170); border-radius: 4px; width: 150px; height: 4px; margin-top: -2px; margin-left: 10px; cursor: pointer; -webkit-appearance: none; appearance: none; -moz-appearance: none;
}
.xgplayer .xgplayer-panel-slider .xgplayer-showarea .xgplayer-showarea-color::-ms-track {
	border-color: transparent; border-radius: 4px; width: 150px; height: 4px; color: transparent; background-color: rgb(170, 170, 170);
}
.xgplayer .xgplayer-panel-slider .xgplayer-showarea .xgplayer-showarea-bar::-ms-thumb {
	border-radius: 6px; border: 6px solid rgb(248, 89, 89); border-image: none; width: 6px; height: 6px; cursor: pointer; -webkit-appearance: none; appearance: none; -moz-appearance: none;
}
.xgplayer .xgplayer-panel-slider .xgplayer-showarea .xgplayer-showarea-zero-dot {
	border-radius: 50%; border: 3px solid rgb(170, 170, 170); border-image: none; top: 16px; width: 3px; height: 3px; position: relative; z-index: -1; background-color: rgb(170, 170, 170);
}
.xgplayer .xgplayer-panel-slider .xgplayer-showarea .xgplayer-showarea-onequarters-dot {
	border-radius: 50%; border: 3px solid rgb(170, 170, 170); border-image: none; top: 16px; width: 3px; height: 3px; position: relative; z-index: -1; background-color: rgb(170, 170, 170);
}
.xgplayer .xgplayer-panel-slider .xgplayer-showarea .xgplayer-showarea-twoquarters-dot {
	border-radius: 50%; border: 3px solid rgb(170, 170, 170); border-image: none; top: 16px; width: 3px; height: 3px; position: relative; z-index: -1; background-color: rgb(170, 170, 170);
}
.xgplayer .xgplayer-panel-slider .xgplayer-showarea .xgplayer-showarea-threequarters-dot {
	border-radius: 50%; border: 3px solid rgb(170, 170, 170); border-image: none; top: 16px; width: 3px; height: 3px; position: relative; z-index: -1; background-color: rgb(170, 170, 170);
}
.xgplayer .xgplayer-panel-slider .xgplayer-showarea .xgplayer-showarea-full-dot {
	border-radius: 50%; border: 3px solid rgb(170, 170, 170); border-image: none; top: 16px; width: 3px; height: 3px; position: relative; z-index: -1; background-color: rgb(170, 170, 170);
}
.xgplayer .xgplayer-panel-slider .xgplayer-danmuspeed {
	display: block;
}
.xgplayer .xgplayer-panel-slider .xgplayer-danmuspeed-name {
	top: -10px; display: inline-block; position: relative;
}
.xgplayer .xgplayer-panel-slider .xgplayer-danmuspeed-control {
	display: inline-block;
}
.xgplayer .xgplayer-panel-slider .xgplayer-danmuspeed-control-up {
	width: 150px; color: rgb(170, 170, 170); margin-left: 10px; display: flex; justify-content: space-between;
}
.xgplayer .xgplayer-panel-slider .xgplayer-danmuspeed-control-down {
	top: -10px; position: relative;
}
.xgplayer .xgplayer-panel-slider .xgplayer-danmuspeed-control-down-dots {
	width: 150px; margin-left: 10px; display: flex; justify-content: space-between;
}
.xgplayer .xgplayer-panel-slider .xgplayer-danmuspeed .xgplayer-danmuspeed-line {
	background: rgb(170, 170, 170); border-radius: 4px; width: 150px; height: 4px; margin-top: -2px; margin-left: 10px; cursor: pointer; -webkit-appearance: none; appearance: none; -moz-appearance: none;
}
.xgplayer .xgplayer-panel-slider .xgplayer-danmuspeed .xgplayer-danmuspeed-color::-ms-track {
	border-color: transparent; border-radius: 4px; width: 150px; height: 4px; color: transparent; background-color: rgb(170, 170, 170);
}
.xgplayer .xgplayer-panel-slider .xgplayer-danmuspeed .xgplayer-danmuspeed-bar::-ms-thumb {
	border-radius: 6px; border: 6px solid rgb(248, 89, 89); border-image: none; width: 6px; height: 6px; cursor: pointer; -webkit-appearance: none; appearance: none; -moz-appearance: none;
}
.xgplayer .xgplayer-panel-slider .xgplayer-danmuspeed .xgplayer-danmuspeed-small-dot {
	border-radius: 50%; border: 3px solid rgb(170, 170, 170); border-image: none; top: 16px; width: 3px; height: 3px; position: relative; z-index: -1; background-color: rgb(170, 170, 170);
}
.xgplayer .xgplayer-panel-slider .xgplayer-danmuspeed .xgplayer-danmuspeed-middle-dot {
	border-radius: 50%; border: 3px solid rgb(170, 170, 170); border-image: none; top: 16px; width: 3px; height: 3px; position: relative; z-index: -1; background-color: rgb(170, 170, 170);
}
.xgplayer .xgplayer-panel-slider .xgplayer-danmuspeed .xgplayer-danmuspeed-large-dot {
	border-radius: 50%; border: 3px solid rgb(170, 170, 170); border-image: none; top: 16px; width: 3px; height: 3px; position: relative; z-index: -1; background-color: rgb(170, 170, 170);
}
.xgplayer .xgplayer-panel-slider .xgplayer-danmufont {
	display: block;
}
.xgplayer .xgplayer-panel-slider .xgplayer-danmufont-name {
	top: -10px; display: inline-block; position: relative;
}
.xgplayer .xgplayer-panel-slider .xgplayer-danmufont-control {
	display: inline-block;
}
.xgplayer .xgplayer-panel-slider .xgplayer-danmufont-control-up {
	width: 150px; color: rgb(170, 170, 170); margin-left: 10px; display: flex; justify-content: space-between;
}
.xgplayer .xgplayer-panel-slider .xgplayer-danmufont-control-down {
	top: -10px; position: relative;
}
.xgplayer .xgplayer-panel-slider .xgplayer-danmufont-control-down-dots {
	width: 150px; margin-left: 10px; display: flex; justify-content: space-between;
}
.xgplayer .xgplayer-panel-slider .xgplayer-danmufont .xgplayer-danmufont-line {
	background: rgb(170, 170, 170); border-radius: 4px; width: 150px; height: 4px; margin-top: -2px; margin-left: 10px; cursor: pointer; -webkit-appearance: none; appearance: none; -moz-appearance: none;
}
.xgplayer .xgplayer-panel-slider .xgplayer-danmufont .xgplayer-danmufont-color::-ms-track {
	border-color: transparent; border-radius: 4px; width: 150px; height: 4px; color: transparent; background-color: rgb(170, 170, 170);
}
.xgplayer .xgplayer-panel-slider .xgplayer-danmufont .xgplayer-danmufont-bar::-ms-thumb {
	border-radius: 6px; border: 6px solid rgb(248, 89, 89); border-image: none; width: 6px; height: 6px; cursor: pointer; -webkit-appearance: none; appearance: none; -moz-appearance: none;
}
.xgplayer .xgplayer-panel-slider .xgplayer-danmufont .xgplayer-danmufont-small-dot {
	border-radius: 50%; border: 3px solid rgb(170, 170, 170); border-image: none; top: 16px; width: 3px; height: 3px; position: relative; z-index: -1; background-color: rgb(170, 170, 170);
}
.xgplayer .xgplayer-panel-slider .xgplayer-danmufont .xgplayer-danmufont-middle-dot {
	border-radius: 50%; border: 3px solid rgb(170, 170, 170); border-image: none; top: 16px; width: 3px; height: 3px; position: relative; z-index: -1; background-color: rgb(170, 170, 170);
}
.xgplayer .xgplayer-panel-slider .xgplayer-danmufont .xgplayer-danmufont-large-dot {
	border-radius: 50%; border: 3px solid rgb(170, 170, 170); border-image: none; top: 16px; width: 3px; height: 3px; position: relative; z-index: -1; background-color: rgb(170, 170, 170);
}
.xgplayer .slider-show .xgplayer-panel-slider {
	display: block;
}
.xgplayer .xg-panel-info {
	background: rgba(0, 0, 0, 0.8); padding: 40px 0px 20px; border-radius: 4px; left: 10px; top: 10px; width: 480px; color: rgb(255, 255, 255); font-size: 14px; font-weight: lighter; display: none; position: absolute; z-index: 8;
}
.xgplayer .xg-panel-detail {
	font: 12px/1.5 PingFangSC-Regular, Helvetica, Arial, Microsoft Yahei, sans-serif; list-style: none; padding: 0px; font-size-adjust: none; font-stretch: normal;
}
.xgplayer .xg-menu {
	background: rgba(30, 30, 32, 0.8); font: 14px/1.5 PingFangSC-Regular, Helvetica, Arial, Microsoft Yahei, sans-serif; padding: 10px 0px; border-radius: 4px; width: 180px; overflow: hidden; display: none; position: absolute; z-index: 8; cursor: pointer; font-size-adjust: none; font-stretch: normal;
}
.xgplayer .v-menu-item:hover {
	color: rgb(255, 255, 255);
}
.xgplayer .v-menu-item:hover .menu-item-icon {
	color: rgb(255, 255, 255);
}
.xgplayer .v-menu-item {
	height: 34px; line-height: 34px; overflow: hidden; padding-left: 20px; display: flex; white-space: nowrap; cursor: pointer; -ms-text-overflow: ellipsis; max-width: 100%; align-items: center;
}
.xgplayer .menu-item-icon svg {
	width: 20px; height: 20px; display: block;
}
.xgplayer .menu-item-content {
	padding: 0px 10px; flex:1 1 0px; vertical-align: middle; display: table-cell;
}
.xgplayer .xg-item-label {
	width: 110px; text-align: right; margin-right: 8px; display: inline-block;
}
.xgplayer .menu-item-icon {
	
}
.xgplayer .xg-interact-icon {
	top: 15px; width: 40px; text-align: center; line-height: 1; position: absolute; cursor: pointer;
}
.xgplayer .xg-interact-icon .svg-hover {
	padding: 2px; font-size: 12px; display: none;
}
.xgplayer .xg-interact-icon svg:hover + .svg-hover {
	display: block;
}
.xgplayer .xg-interact-icon:hover {
	color: rgb(255, 255, 255);
}
.xgplayer .xg-info-close {
	right: 15px;
}
.xgplayer .xg-info-copy {
	right: 45px;
}
.xgplayer .xgplayer-pip .xg-exit-pip {
	display: none;
}
.xgplayer .xgplayer-pip .xg-get-pip {
	display: block;
}
.xgplayer [data-state=pip].xgplayer-pip .xg-exit-pip {
	display: block;
}
.xgplayer [data-state=pip].xgplayer-pip .xg-get-pip {
	display: none;
}
.xgplayer.xgplayer-inactive {
	cursor: none;
}
.xgplayer xg-thumbnail {
	display: block;
}
.xgplayer xg-trigger {
	left: 0px; top: 0px; width: 100%; height: 100%; position: absolute; -ms-user-select: none; -webkit-user-select: none; -moz-user-select: none; user-select: none;
}
.xgplayer xg-trigger .time-preview {
	margin: 0px auto; padding: 0px 20px 30px; left: 50%; top: 50%; width: 200px; text-align: center; color: rgb(255, 255, 255); font-size: 18px; display: none; position: absolute; pointer-events: none; text-shadow: 0px 0px 1px rgba(0,0,0,0.54); transform: translate(-50%, -50%);
}
.xgplayer xg-trigger .time-preview span {
	line-height: 24px;
}
.xgplayer xg-trigger .time-preview .xg-cur {
	color: red;
}
.xgplayer xg-trigger .time-preview .xg-separator {
	font-size: 14px;
}
.xgplayer xg-trigger .time-preview .xg-seek-show {
	transform: translateX(-10px);
}
.xgplayer xg-trigger .time-preview .xg-seek-show.xg-back .xg-seek-pre {
	transform: rotate(180deg) translateX(-5px);
}
.xgplayer xg-trigger .time-preview .xg-seek-show.hide-seek-icon .xg-seek-icon {
	display: none;
}
.xgplayer xg-trigger .time-preview .xg-bar {
	background: rgba(255, 255, 255, 0.3); margin: 8px auto 0px; border-radius: 10px; width: 96px; height: 2px; box-sizing: content-box;
}
.xgplayer xg-trigger .time-preview .xg-bar .xg-curbar {
	width: 0px; height: 100%; background-color: red;
}
.xgplayer xg-trigger .time-preview .xg-bar.hide {
	display: none;
}
.xgplayer xg-trigger .mobile-thumbnail {
	left: 50%; position: relative; transform: translateX(-50%);
}
.xgplayer xg-trigger .xg-top-note {
	background: rgba(0, 0, 0, 0.3); border-radius: 100px; left: 50%; top: 26px; width: 135px; height: 32px; color: rgb(255, 255, 255); margin-left: -78px; position: absolute;
}
.xgplayer xg-trigger .xg-top-note span {
	height: 32px; text-align: center; line-height: 32px; font-size: 13px; display: block;
}
.xgplayer xg-trigger .xg-top-note i {
	margin: 0px 5px; color: red;
}
.xgplayer xg-trigger .xg-playbackrate {
	display: none;
}
.xgplayer xg-trigger[data-xg-action=seeking] .time-preview {
	display: block;
}
.xgplayer xg-trigger[data-xg-action=playbackrate] .xg-playbackrate {
	display: block;
}
.xgplayer .gradient {
	left: 0px; top: 0px; width: 100%; height: 100%; display: none; position: absolute; pointer-events: none; background-image: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.36) 20%, rgba(0, 0, 0, 0) 36%, rgba(0, 0, 0, 0) 70%, rgba(0, 0, 0, 0.24) 77%, rgba(0, 0, 0, 0.36) 83%, rgba(0, 0, 0, 0.6));
}
.xgplayer .gradient.top {
	background-image: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.36) 20%, rgba(0, 0, 0, 0) 36%, rgba(0, 0, 0, 0) 70%);
}
.xgplayer .gradient.bottom {
	background-image: linear-gradient(rgba(0, 0, 0, 0) 70%, rgba(0, 0, 0, 0.24) 77%, rgba(0, 0, 0, 0.36) 83%, rgba(0, 0, 0, 0.6));
}
.xgplayer .gradient.none {
	
}
.xgplayer-mobile .xgplayer-controls {
	
}
.xgplayer-mobile.xgplayer-playing .gradient {
	display: block;
}
.xgplayer-mobile.xgplayer-inactive .gradient {
	
}
.xgplayer-mobile .xgmask {
	left: 0px; top: 0px; width: 100%; height: 100%; position: absolute; z-index: 10; pointer-events: none; background-color: rgba(0, 0, 0, 0);
}
@media not all
{
.xgplayer-mobile xg-trigger .time-preview {
	color: rgb(255, 255, 255);
}
.xgplayer-mobile xg-trigger .time-preview span.xg-cur {
	color: red;
}
.xgplayer-mobile xg-trigger .time-preview .xg-bar {
	background-color: rgba(255, 255, 255, 0.3);
}
.xgplayer-mobile xg-trigger .time-preview .xg-bar.xg-curbar {
	background-color: red;
}
}
.xgplayer-fullscreen-parent {
	left: 0px; top: 0px; width: 100%; height: 100%; position: fixed; z-index: 9999;
}
.xgplayer-fullscreen-parent .xgplayer.xgplayer-is-cssfullscreen {
	position: absolute; z-index: 10;
}
.xgplayer-fullscreen-parent .xgplayer.xgplayer-is-fullscreen {
	position: absolute; z-index: 10;
}
.xgplayer-rotate-parent {
	transform-origin: left top; left: 100%; top: 0px; width: 100vh; height: 100vw; right: 0px; bottom: 0px; position: fixed; z-index: 9999; transform: rotate(90deg);
}
.xgplayer-rotate-parent .xgplayer.xgplayer-rotate-fullscreen {
	margin: 0px; padding: 0px; left: 0px; top: 0px; width: 100%; height: 100%; position: absolute; z-index: 10; transform: rotate(0deg);
}
.xgplayer-rotate-parent .xgplayer-mobile video {
	z-index: -1;
}
.xgplayer {
	background: rgb(0, 0, 0); width: 100%; height: 100%; overflow: hidden; font-family: "PingFang SC","Helvetica Neue",Helvetica,STHeiTi,"Microsoft YaHei","WenQuanYi Micro Hei",sans-serif; font-size: 14px; font-weight: 400; position: relative; cursor: pointer; -ms-user-select: none; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -webkit-user-select: none; -moz-user-select: none; user-select: none; -webkit-touch-callout: none; -khtml-user-select: none;
}
.xgplayer * {
	margin: 0px; padding: 0px; border: 0px currentColor; border-image: none; vertical-align: baseline; white-space: normal; -ms-word-wrap: normal; overflow-wrap: normal;
}
.xgplayer ul {
	list-style: none;
}
.xgplayer li {
	list-style: none;
}
.xgplayer .xgplayer-none {
	display: none;
}
.xgplayer.xgplayer-is-fullscreen {
	margin: 0px; padding: 0px; left: 0px; top: 0px; width: 100%; height: 100%; position: fixed; z-index: 9999;
}
.xgplayer.xgplayer-is-cssfullscreen {
	left: 0px; top: 0px; width: 100%; height: 100%; position: fixed; z-index: 9999;
}
.xgplayer.xgplayer-rotate-fullscreen {
	transform-origin: left top; left: 100%; top: 0px; width: 100vh; height: 100vw; right: 0px; bottom: 0px; position: fixed; z-index: 9999; transform: rotate(90deg);
}
.xgplayer.xgplayer-rotate-fullscreen.xgplayer-mobile video {
	z-index: -1;
}
.xgplayer xg-video-container.xg-video-container {
	top: 0px; width: 100%; bottom: 48px; display: block; position: absolute;
}
.xgplayer video {
	left: 0px; top: 0px; width: 100%; height: 100%; position: absolute;
}
[data-xgfill=contain].xgplayer video {
	object-fit: contain;
}
[data-xgfill=cover].xgplayer video {
	object-fit: cover;
}
[data-xgfill=fill].xgplayer video {
	object-fit: fill;
}
.xgplayer .xg-pos {
	left: 10px; right: 10px;
}
.xgplayer .xg-margin {
	margin-right: 16px; margin-left: 16px;
}
.xgplayer .xg-bottom {
	bottom: 0px;
}
.xgplayer .btn-text {
	top: 50%; height: 24px; text-align: center; font-size: 13px; position: relative;
}
.xgplayer .btn-text span {
	background: rgba(0, 0, 0, 0.38); border-radius: 12px; height: 24px; line-height: 24px; display: inline-block; min-width: 52px;
}
.xgplayer xg-icon {
	height: 40px; color: rgba(255, 255, 255, 0.8); margin-right: 16px; margin-left: 16px; position: relative; cursor: pointer; box-sizing: border-box; fill: #fff;
}
.xgplayer xg-icon.xg-icon-disable {
	cursor: not-allowed;
}
.xgplayer xg-icon .xg-tips {
	left: 50%; top: -30px; transform: translateX(-50%);
}
.xgplayer xg-icon:active .xg-tips {
	display: block;
}
.xgplayer xg-icon:hover .xg-tips {
	display: block;
}
.xgplayer xg-icon:active .xg-tips.hide {
	display: none;
}
.xgplayer xg-icon:hover .xg-tips.hide {
	display: none;
}
.xgplayer xg-icon .xgplayer-icon {
	top: 50%; position: relative; cursor: pointer; transform: translateY(-50%);
}
.xgplayer xg-icon .xg-icon-disable {
	cursor: not-allowed;
}
.xgplayer xg-icon .xg-img {
	width: 100%;
}
.xgplayer xg-icon svg {
	height: 100%; display: block;
}
.xgplayer xg-icon img {
	height: 100%; display: block;
}
.xgplayer xg-bar {
	display: block;
}
.xgplayer.xgplayer-inactive xg-bar {
	display: none;
}
.xgplayer.xgplayer-mini xg-bar {
	display: none;
}
.xgplayer.xgplayer-inactive .xg-top-bar {
	display: flex;
}
.xgplayer.xgplayer-inactive .xg-top-bar.top-bar-autohide {
	display: none;
}
.xgplayer .xg-top-bar {
	padding: 0px 16px; top: 0px; height: 50px; display: flex; position: absolute; z-index: 10;
}
.xgplayer .xg-top-bar xg-icon {
	left: 0px; top: 10px; width: 34px; margin-top: 0px; position: relative;
}
.xgplayer .xg-top-bar xg-icon:first-child {
	margin-left: 0px;
}
.xgplayer .xg-left-bar {
	top: 50px; width: 50px; bottom: 50px; position: absolute; z-index: 9;
}
.xgplayer .xg-right-bar {
	top: 50px; width: 50px; bottom: 50px; position: absolute; z-index: 9;
}
.xgplayer .xg-left-bar {
	left: 0px;
}
.xgplayer .xg-right-bar {
	right: 0px;
}
.xgplayer .xg-tips {
	background: rgba(0, 0, 0, 0.54); padding: 4px 6px; border-radius: 4px; text-align: center; color: rgb(255, 255, 255); font-size: 12px; display: none; white-space: nowrap; position: absolute; opacity: 0.85;
}
.xgplayer .xg-margin {
	left: 0px; right: 0px;
}
.xgplayer-mobile {
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
.xgplayer-mobile * {
	text-decoration: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
.xgplayer-mobile.xgplayer-rotate-fullscreen .xg-top-bar {
	left: 6%; right: 6%;
}
.xgplayer-mobile.xgplayer-rotate-fullscreen .xg-pos {
	left: 6%; right: 6%;
}
.xgplayer-mobile xg-icon:hover .xg-tips {
	display: none;
}
@media only screen and (max-width:480px)
{
.xgplayer-mobile xg-icon {
	margin-right: 10px; margin-left: 10px;
}
.xgplayer-mobile .xg-top-bar {
	left: 10px; right: 10px;
}
}
@media screen and (orientation:portrait)
{
.xgplayer-mobile.xgplayer-is-fullscreen .xgplayer-controls {
	bottom: 34px;
}
.xgplayer-mobile.xgplayer-is-cssfullscreen .xgplayer-controls {
	bottom: 34px;
}
.xgplayer-mobile.xgplayer-is-fullscreen .xg-top-bar {
	top: 34px;
}
.xgplayer-mobile.xgplayer-is-cssfullscreen .xg-top-bar {
	top: 34px;
}
}
@media only screen and (orientation:landscape)
{
.xgplayer-mobile.xgplayer-is-fullscreen .xg-top-bar {
	left: 6%; right: 6%;
}
.xgplayer-mobile.xgplayer-is-fullscreen .xg-pos {
	left: 6%; right: 6%;
}
.xgplayer-mobile.xgplayer-rotate-fullscreen {
	left: 0px; width: 100vw; height: 100vh; transform: rotate(0deg);
}
}
.xgplayer .xgplayer-screen-container {
	width: 100%; display: block;
}
.xgplayer.not-allow-autoplay .xgplayer-controls {
	visibility: hidden; cursor: default; opacity: 0; pointer-events: none;
}
.xgplayer.xgplayer-nostart .xgplayer-controls {
	visibility: hidden; cursor: default; opacity: 0; pointer-events: none;
}
.xgplayer.xgplayer-inactive .controls-autohide {
	visibility: hidden; cursor: default; opacity: 0; pointer-events: none;
}
.xgplayer.not-allow-autoplay .xgplayer-controls-initshow {
	visibility: visible; opacity: 1; pointer-events: auto;
}
.xgplayer.xgplayer-nostart .xgplayer-controls-initshow {
	visibility: visible; opacity: 1; pointer-events: auto;
}
.xgplayer .xgplayer-controls {
	transition:opacity 0.5s, visibility 0.5s; left: 0px; height: 48px; right: 0px; bottom: 0px; display: block; visibility: visible; position: absolute; z-index: 10; opacity: 1; background-image: linear-gradient(180deg, transparent, rgba(0, 0, 0, 0.37), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0.75));
}
.xgplayer .xgplayer-controls.show {
	display: block; visibility: visible; opacity: 1; pointer-events: auto;
}
.xgplayer .xg-inner-controls {
	height: 40px; bottom: 0px; display: flex; position: absolute; justify-content: space-between;
}
.xgplayer .xg-left-grid {
	height: 100%; display: flex; position: relative; z-index: 1; flex-wrap: wrap; flex-shrink: 1;
}
.xgplayer .xg-right-grid {
	height: 100%; display: flex; position: relative; z-index: 1; flex-wrap: wrap; flex-shrink: 1;
}
.xgplayer .xg-right-grid {
	flex-direction: row-reverse;
}
.xgplayer .xg-right-grid > :first-child {
	margin-right: 0px;
}
.xgplayer .xg-right-grid xg-icon {
	margin-left: 0px;
}
.xgplayer .xg-left-grid > :first-child {
	margin-left: 0px;
}
.xgplayer .xg-left-grid xg-icon {
	margin-right: 0px;
}
.xgplayer .xg-center-grid {
	padding: 5px 0px; left: 0px; top: -20px; text-align: center; right: 0px; display: block; position: absolute;
}
.xgplayer .flex-controls .xg-inner-controls {
	bottom: 8px; display: flex; justify-content: space-around;
}
.xgplayer .flex-controls .xg-center-grid {
	padding: 0px 16px; flex:1 1 0px; left: 0px; top: 0px; height: 100%; right: 0px; display: flex; position: relative; justify-content: space-between; align-items: center;
}
.xgplayer.xgplayer-mobile .xg-center-grid {
	z-index: 2;
}
.xgplayer.xgplayer-mobile .flex-controls .xg-center-grid {
	padding: 0px 8px;
}
.xgplayer .bottom-controls .xg-center-grid {
	padding: 0px; top: 20px;
}
.xgplayer .bottom-controls .xg-left-grid {
	bottom: 10px;
}
.xgplayer .bottom-controls .xg-right-grid {
	bottom: 10px;
}
.xgplayer .mini-controls {
	background-image: none;
}
.xgplayer .mini-controls .xg-inner-controls {
	left: 0px; right: 0px; bottom: 0px;
}
.xgplayer .mini-controls .xg-center-grid {
	padding: 0px; top: auto; bottom: -28px;
}
.xgplayer .mini-controls .xg-left-grid {
	display: none;
}
.xgplayer .mini-controls .xg-right-grid {
	display: none;
}
.xgplayer .controls-follow {
	transition:bottom 0.3s; bottom: 70px;
}
.xgplayer.flex-controls .controls-follow {
	bottom: 45px;
}
.xgplayer.xgplayer-inactive .controls-follow {
	bottom: 10px;
}
.xgplayer.no-controls .controls-follow {
	bottom: 10px;
}
.xgplayer.mini-controls .controls-follow {
	bottom: 10px;
}
