body{font-family:-apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif!important;-webkit-font-smoothing:antialiased;background-color:#212121;padding-top:90px;font-size:14px;line-height:140%}
a, h1, h2, h3, h4, h5, h6 {color: #c2c2c2;}
a {text-decoration: none;outline: none;}
a, button{ text-decoration:none; outline:none; -webkit-tap-highlight-color:rgba(0,0,0,0)}
.font-16{ font-size: 16px !important;;}
.font-14{ font-size: 14px !important;;}
.font-12{ font-size: 12px !important;}
ul,li{list-style-type:none;margin: 0;padding: 0;font-weight: normal;}
input.form-control,input.btn{ outline:0px; -webkit-appearance: none;}
.form-control{display:block; width:100%; height:30px; padding: 10px; font-size:12px; line-height: 25px; border-radius:4px; transition:border-color ease-in-out .15s,box-shadow ease-in-out .15s;}
.text-muted-9{color: #999;}
.text-danger{color: #f93976;}
.xcontainer {max-width: 1140px;}
.noselect{
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.hr-gray{border-top:0;background-color:transparent;border-bottom:1px solid rgba(255,255,255,.125);opacity:1}
.hr-gray-2{border-top:0;background-color:transparent;border-bottom:1px solid rgba(0,0,0,.1);opacity:1}
a.common_ylink:active,a.common_ylink:hover{color:#fff;text-decoration:none}
a.common_alink,a.common_alink:link{color:#d0e0f0;text-decoration:none;border-bottom:1px solid transparent}
a.common_alink:active,a.common_alink:hover{color:#f93976;text-decoration:none;border-bottom:1px solid #f93976}
a.btn-light-x{background-color: #f8f9fa;cursor: pointer;}
a.btn-light-x:hover{background-color: #343535 !important;}

/* more & text */
h1{ font-size:22px; line-height: 28px;}
h5.title, h5.card-title {font-size: 16px !important;}
h6.title {font-size: 14px !important;}
.hide, .visible-lg, .visible-md, .visible-sm, .visible-xs, .visible-mi{ display: none !important;}
.margin-0{ margin: 0 !important;}
.padding-0{ padding: 0 !important;}
.margin-t0{ margin: 0 !important;}
.padding-t0{ padding: 0 !important;}
.margin-b0{ margin: 0 !important;}
.padding-b0{ padding: 0 !important;}
.hide,.visible-lg, .visible-md, .visible-sm, .visible-xs, .visible-mi{ display: none !important;}
.mask{ position: fixed; top: 0; left: 0; bottom: 0; z-index: 999;  width: 100%; height: 100%; background: rgba(0, 0, 0, 0.6); animation: fade-in; animation-duration: .5s; -webkit-animation:fade-in .5s;}
.body_content_wrapper .xtui-panel-bg:last-of-type {margin-bottom: 0;}
.body_content_wrapper .xtui-panel-bg:first-of-type {margin-top: 0;}
.viewport-m .fix-w100{--bs-gutter-x: 0;}

/* line */
.split-line{display: inline-block; margin-left: 12px; margin-right: 12px; width: 1px; height: 14px; vertical-align: -2px;background-color: #EEEEEE;}
.split-dot:after{display: inline-block; margin-left: 5px; margin-right: 5px; content: " · ";}
.top-line,.top-line-dot,.bottom-line,.bottom-line-dot{ position: relative;}
.top-line:before,.top-line-dot:before{content: " "; position: absolute; left: 0; top: 0; right: 0; width: 100%; height: 1px;border-top: 1px solid #EEEEEE;}
.bottom-line:before, .bottom-line-dot:before{content: " "; position: absolute; left: 0; bottom: 0; right: 0; width: 100%; height: 1px;}
.bottom-line:before{border-bottom: 1px solid rgba(255,255,255, .125);}
.bottom-line-dot:before{ border-bottom: 1px dotted #3b3b3b;}

/* btn */
.btn-min{ padding: 4px 15px !important;}
.btn-default{ background-color: #f5f5f5; color: #333333;}
.btn-default:hover{ background-color: #f0eeee;}
.btn-danger-x{ background-color: #f93976;color: #FFFFFF;}
.btn-danger-x .icon{ color: #FFFFFF;}
.btn-danger-x:hover, .btn-danger-x.active{ background-color: #f93976 !important;color: #FFFFFF;}
.btn-danger-x:hover .icon{ color: #FFFFFF;}
.delimiter_line{color: #6c757d;}
.delimiter_dot{color: #6c757d;}
.common-btn-link{text-decoration: none;color: #b3b3b3;}
.common-btn-link.active{color: #f93976;}
.btn-gray-x:hover, .btn-gray-x.active{ background-color: #414141 !important;color: #FFF;font-weight: 700;}
.breathing-button {animation: breathe 1s ease-in-out infinite;}
@keyframes breathe {0% {transform: scale(1);} 50% {transform: scale(1.05);} 100% {transform: scale(1);} }

/* embed */
.embed-responsive{position:relative;display:block;overflow:hidden;padding:0;height:0}
.embed-responsive .embed-responsive-item,.embed-responsive embed,.embed-responsive iframe,.embed-responsive object,.embed-responsive video{position:absolute;top:0;bottom:0;left:0;width:100%;height:100%;border:0}
.embed-responsive-16by9{padding-bottom:56.25%}
.embed-responsive-4by3{padding-bottom:75%}

/* common xtui box */
.xtui-panel-bg {background-color: #000;margin-top: 10px;margin-bottom: 10px;box-shadow: 0 1px 2px rgba(0,0,0,.05);}
.xtui-panel-box {padding: 10px;}
.xtui-panel-box.video_list_box {padding-top: 0;}

/* common sub nav box */
.text_horizontal_box.sub_nav_box .row .col-md{border: 0 none;}
.text_horizontal_box.sub_nav_box .row .col-md a{text-decoration: none;padding: 8px;border-radius: 6px;border-bottom: 1px solid rgba(136, 136, 136, .48);}

/* panel-head */
.xtui-panel__head{ position: relative; height: 40px;line-height: 40px;}
.xtui-panel__head.active{height: 40px;}
.xtui-panel__head .title{float: left; margin:0; line-height: 40px;}
.xtui-panel__head .title img{ display: inline-block; width: 24px; height: 24px; margin-right: 10px; vertical-align: -5px;}
.xtui-panel__head .more{ line-height: 30px;}
.xtui-panel__head .xtui-panel__tab{padding: 0 15px;}

/* header */
.top-fixed{ -webkit-transition:.5s; -o-transition:.5s; -moz-transition:.5s; -ms-transition:.5s; transition:.5s;}
.xtui-header__top{position:fixed;top:0;z-index: 999;width:100%;min-height:80px; background-color: #000; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);}
.top-fixed-down{margin-top:-80px}
.top-fixed-up{ margin-top: 0 !important;}
.xtui-header__side{float:right}

/* header-logo */
.xtui-header__logo, .xtui-header__menu{float:left}
.xtui-header__logo{margin-top:17px}
.xtui-header__logo .logo{ display:block; width:168px; height:50px;background-position:50% 50%; background-size:cover;background-repeat: no-repeat;}

/* header-menu */
.xtui-header__menu{position:relative;margin-left:20px}
.xtui-header__menu li{float:left;margin-top:30px;margin-right:20px}
.xtui-header__menu li a{display:inline-block;padding:3px 8px 4px;font-size:14px;border-radius:2px; color: #c2c2c2;}
.xtui-header__menu li.active a{ background-color: #f93976; color: #FFFFFF;}

/* header-seacrh */
.xtui-header__search{float:left;position:relative;margin-top:25px;width:200px}
.xtui-header__search .submit{display:block;position:absolute;top:0;right:0;width:30px;height:30px;line-height:30px;text-align:center; background: none; border: 0;cursor: pointer;}
.xtui-header__search .submit .icon{font-size:14px;color:#999;vertical-align: 1px}

/* header-user */
.xtui-header__user{float:right}
.xtui-header__user > li{ float:left; position: relative; padding: 28px 0 10px; margin-left: 30px;}
.xtui-header__user > li > a .icon{ display: inline-block; font-size: 24px; line-height: 24px; color: #999;}
.xtui-header__user > li .dropdown{ display: none; position: absolute; z-index: 999; width: 240px; top: 100%; right: -15px; padding: 15px; font-size: 12px; color: #999; background-color: #fff; box-shadow: 0 2px 8px rgba(0,0,0,.2); border-radius: 4px; background-color: #fff; box-shadow: 0 2px 8px rgba(0,0,0,.2);}
.xtui-header__user > li .dropdown:before{ content:" "; width:10px; height:10px; -webkit-transform:rotate(-45deg); -ms-transform:rotate(-45deg); transform:rotate(-45deg); position: absolute; top:-5px; right: 22px; background-color: #fff; border-top: 1px solid #eee; border-right: 1px solid #eee;}
.xtui-header__user .dropdown li{ position: relative; padding: 10px 0;}
.xtui-header__user .dropdown li:first-child{ margin-top: 10px;}
.xtui-header__user .dropdown li:last-child{ padding-bottom: 0;}

/* horizontal text for ads */
.text_horizontal_box .row {font-size: 14px;text-align: center;padding-left: 0.75rem;padding-right: 0.75rem;}
.text_horizontal_box .row .col-md {padding: 8px;border-style: solid;border-color: rgba(199, 199, 199, .2);border-width: 0;}

/* common empty data */
.common-empty {padding: 32px;display: flex;flex-direction: column;align-items: center;}
.common-empty__image {width: 160px;height: 160px;}
.common-empty__image img {width: 100%;height: 100%;}
.common-empty__description {margin-top: 16px;padding: 0 10px;color: #969799;font-size: 14px;line-height: 20px;}

/* scope component */
.g-recommend-box{display: none;}
.amazon_box{position: relative;}
.amazon_box .amazon-item {margin-bottom: .5rem;position: relative;}
.viewport-m .amazon_box .amazon-item{margin-left: 12px;margin-right:12px;}
.amazon_box .amazon-item a{display: block}
.amazon_box.amazon_box_sp{border: 1px solid #FCC260;border-radius: 2px;margin-left: 12px;margin-right:12px;}
.amazon_box.amazon_box_sp a{display: block;}
.amazon_box.amazon_box_sp .amazon-item{margin-bottom: 0}
.amazon_box.amazon_box_sp .amazon_box_sp_wrapper{display:flex;align-items:center;padding:5px 8px;background:#fff}
.amazon_box.amazon_box_sp .amazon_box_sp_logo img{width:40px !important;height:40px !important;background:#f0f0f0;display:flex;align-items:center;justify-content:center;color:#bbb;flex-shrink:0;margin-right:10px;border-radius:8px;}
.amazon_box.amazon_box_sp .amazon_box_sp_content{flex:1;display:flex;flex-direction:column;justify-content:center;min-width:0}
.amazon_box.amazon_box_sp .amazon_box_sp_content_title{font-size:14px;font-weight:700;color:#222;margin-bottom:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.amazon_box.amazon_box_sp .amazon_box_sp_content_desc{font-size:12px;color:#666;line-height:1.4;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.amazon_box.amazon_box_sp .amazon_box_sp_btn{margin-left:16px;font-size:12px;padding:0 20px;height:30px;background:#f93976;color:#fff;border:none;border-radius:4px;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.g-recommend-box__bottom{position: fixed;bottom: 0;width: 100%;border-top: 1px solid #FCC260;z-index: 170;margin: 0!important;}
.g-recommend-box__bottom .amazon_box{border: 0;}
.g-recommend-box__bottom .amazon_box .amazon-item{margin: 0!important;}

/* video scope component */
.g-recommend-box-cell{}
.g-recommend-box-cell .g-recommend {margin-bottom: .5rem;}
.g-recommend-box-cell .g-recommend-image {overflow: hidden;cursor: pointer;z-index: 99;}
.g-recommend-box-cell .g-recommend-title {box-sizing: content-box;line-height: 20px;max-height: 54px !important;overflow: hidden;font-size: 12px;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 3 !important;-webkit-box-orient: vertical;z-index:99;position: relative;font-weight: 700;}
.g-recommend-box-cell .g-recommend-title span{color: #f93976;}

/* video patch component */
.g-recommend-videometas {padding: 10px;display: flex;background-color: #fffad2;}
.g-recommend-videometas .g-recommend-videometas_img{line-height: 0;border-radius: 2px;overflow: hidden;}
.g-recommend-videometas .g-recommend-videometas_text{flex: 1;padding: 0 10px;color: #000;}
.g-recommend-videometas .g-recommend-videometas_text p {color: #999;font-size: 12px;margin-bottom:0;margin-top: 3px;}
.g-recommend-videometas .g-recommend-videometas_button button {height: 32px;padding: 0 8px;font-size: 12px;color: #fff;background-color: #1989fa;border: 1px solid #1989fa;position: relative;display: inline-block;box-sizing: border-box;text-align: center;border-radius: 2px;margin-top: 2px;transition: background-color 0.3s;}

/* pagination */
.xtui-page{margin-bottom:10px;margin-top:1rem;}
.xtui-page li{display:inline-block;margin-left:10px}
.xtui-page li .num, .xtui-page li a{display:inline-block;padding:5px 15px;border-radius:5px}
.xtui-page-text{ padding:0 20px 20px;}
.xtui-page-text a, .xtui-page-text em, .xtui-page-text span{font-style:normal;display:inline-block;margin:0;padding:6px 12px;border-radius:2px;cursor:pointer}
.xtui-page-text .pagego{ padding: 6px; margin-right: 5px;border-radius: 5px;border: 1px solid #EEEEEE;}
.xtui-page-text .pagebtn{ padding: 6px 12px; cursor: pointer;background-color: #FFFFFF; border: 1px solid #EEEEEE;}
.xtui-page li a, .xtui-page li .num, .xtui-page-text a, .xtui-page-text em, .xtui-page-text span{background-color: #FFFFFF; border: 1px solid #EEEEEE;}
.xtui-page li a {color: #666666;}
.xtui-page li a:hover, .xtui-page li.active a, .xtui-page li.active .num, .xtui-page li.disabled a, .xtui-page-text span.pagenow{ background-color: #f93976; color: #FFFFFF; border: 1px solid #f93976;}

/* screen */
.xtui-screen__list{position:relative;padding:10px 0 0;}
.xtui-screen__list li{float:left;margin-right:10px;margin-bottom:10px}
.xtui-screen__list li span{display:inline-block;padding:3px 0 3px;}
.xtui-screen__list li a{display:inline-block;padding:3px 10px;border-radius:2px;color: #b3b3b3;}
.xtui-screen__list.letter-list li{ margin: 0;}
.xtui-screen__list.letter-list li:first-child{ margin-right: 10px;}
.xtui-screen__list.letter-list li.active a{padding:3px 10px}
.xtui-screen__list li:hover a, .xtui-screen__list li.active a{ color: #FFFFFF;background-color: rgba(248,57,118);}
.video_condition_box {padding-top: 0;padding-bottom: 0;}
.video_condition_box .bottom-line:last-of-type:before {display: none !important;}

/* pages */
.videos_pages_box .video_list_box--hd {border-bottom: 2px solid #f93976 !important;}
.xtui-panel-card.card {background-color: transparent;}
.xtui-panel-card .card-text{line-height: 20px !important;}
.body_videos_category .xtui-panel-card-img, .body_videos_pages .xtui-panel-card-img, .body_videos_tag .xtui-panel-card-img{width: 48px;height: 48px;}


/* categroy & tag */
.videos_category_box .video_list_box--hd, .videos_tag_box  .video_list_box--hd{border-bottom: 2px solid #f93976 !important;}


/* player */
.xtui-player__video{background-color: #000000;}
.xtui-player__detail{}
.xtui-player__detail .more-btn{float: right; padding-top: 10px;}
.xtui-player__detail .more-btn li{display: inline-block; margin-left: 10px;}
.xtui-player__detail .more-btn .btn{padding: 6px 15px;}
.xtui-player__detail .title{margin:0 0 10px;}
.xtui-player__detail .detail-content{padding-top:10px}
.xtui-player__detail .desc{padding-left:42px}
.xtui-player__detail .desc .left{margin-left:-42px}
.xtui-player__detail .btn-x-tag {margin-right: 5px;margin-bottom: 5px;}

/* extra */
.xtui-extra{position:fixed;right:50px;z-index:999;bottom:50px}
.xtui-extra li{position:relative;padding:15px 10px 0}
.xtui-extra li a,.xtui-extra li span{background-color: #FFFFFF; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);display:block;width:50px;height:50px;line-height:50px;text-align:center;border-radius:4px;font-size:18px;cursor:pointer}
.xtui-extra li a .icon,.xtui-extra li span .icon{font-size:18px}
.xtui-extra li a img{margin-top:15px;width:20px;height:20px}
.xtui-extra li .sideslip{background-color: #FFFFFF; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);display:none;position:absolute;bottom:0;right:100%;width: 160px;}
.xtui-extra li .sideslip:before{background-color: #FFFFFF; border-color: rgba(0, 0, 0, 0.1);content:" ";width:10px;height:10px;-webkit-transform:rotate(-45deg);-ms-transform:rotate(-45deg);transform:rotate(-45deg);border-width:0 1px 1px 0;position:absolute;bottom:20px;right:-6px;border-style:solid}
.xtui-extra li:hover .sideslip{display:block}
.xtui-extra li a.xtui-extra-icon{ background-color: rgba(110, 110, 110, 0.6); color: #FFFFFF; }
.xtui-extra .sideslip #qrcode {text-align: center;padding: 10px 10px 0;}

/* carousel */
.carousel-indicators{margin-bottom: -1em;}
.carousel-indicators button{width: 20px !important;}

/* vod-list */
.xtui-vodlist__thumb{display: block; position: relative; padding-top: 150%; background: url(https://img10.360buyimg.com/ddimg/jfs/t1/211107/10/28465/2878/63751a1cEe7e9124a/b925e28a7e24632f.jpg) no-repeat; background-position: 50% 50%; background-size: cover;}
.xtui-vodlist__thumb.square{ padding-top: 100%; background: url(./statics/images/load_f.gif) no-repeat; background-position: 50% 50%; background-size: cover;}
.xtui-vodlist__thumb.active{ padding-top: 60%; background: url(./statics/images/load_w.gif?v=20231205) no-repeat; background-position: 50% 50%; background-size: cover;}
.xtui-vodlist__thumb.picture {background: none; overflow: hidden;}
.xtui-vodlist__thumb.picture img{position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.xtui-vodlist__thumb .play{display: none; position: absolute; top: 0; z-index: 1; width: 100%; height: 100%; background: rgba(0,0,0,0.1) url(./statics/images/play.png) center no-repeat;}
.xtui-vodlist__thumb .play.active{ display: block;}
.xtui-vodlist__thumb:hover .play{ display: block;}
.xtui-vodlist__detail.active{ padding: 0 10px 10px;}
.xtui-vodlist__detail .title{ font-size: 14px; margin-bottom: 0;}
.xtui-vodlist__detail .title.active{ font-size: 16px; margin-bottom: 10px;}
.xtui-vodlist__detail .text{ min-height: 19px; font-size: 12px; margin-bottom: 0; margin-top: 5px;}
.xtui-vodlist__detail .text-title{ font-size: 14px; line-height: 18px; margin:11px 0 0; height: 36px; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2;}

/* popup */
.popup{ background-color: #F8F8F8;}
.popup-head{ background-color: #FFFFFF;}

/* video scope compoments */
.video_list_box .video_list_box--hd {color: #d0e0f0;border-bottom: 1px solid rgba(255,255,255, .125);}
.video_list_box .video_list_box--hd .sub-button{height:20px;line-height:20px;padding:0 5px;font-weight:400;background-color:rgba(255,255,255,.2)!important;border-radius:2px;color:#fff!important;border:1px solid rgba(255,255,255,.3)}
.video_list_box .video_list_box--hd .title-more i{vertical-align: -1px;}
.video_list_box .video_list_box--bd {padding-top: 10px;}
.video_list_box .video_list_box--bd .video_item {margin-bottom: .5rem;}
.video_list_box .video_list_box--bd .video_item--image {overflow: hidden;cursor: pointer;z-index: 99;}
.video_list_box .video_list_box--bd .video_item--image img{transition: all linear 0.3s;}
.video_list_box .video_list_box--bd .video_item:hover img{-webkit-transform: scale(1.1);-moz-transform: scale(1.1);-ms-transform: scale(1.1);-o-transform: scale(1.1);transform: scale(1.1);}
.video_list_box .video_list_box--bd .video_item-title {box-sizing: content-box;line-height: 20px;max-height: 36px;overflow: hidden;font-size: 12px;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;z-index:99;position: relative;}
.video_list_box .video_list_box--bd .video_item--meta {font-size: 85%;}
.video_list_box .video_list_box--bd .video_item--meta span:not(:first-of-type):before{content: "•";margin: 0px 2px;}
.video_list_box .video_list_box--bd .video_item--info{font-size:12px;display:block;width:100%;position:absolute;bottom:0;left:0;padding:5px 10px;overflow:hidden;text-overflow:ellipsis;-o-text-overflow:ellipsis;white-space:nowrap;background-repeat:no-repeat;background-image:linear-gradient(transparent,rgba(0,0,0,.5));color:#fff;text-align:right;z-index:10}
.video_list_box .video_list_box--bd .video_item--property{position:absolute;top:5px;left:5px;z-index:100;}
.video_list_box .video_list_box--bd .video_item--property-label{text-align:center;color:#fff;font-size:12px !important;padding:1px 5px;border-radius:2px;display:block;}
.video_list_box .video_list_box--bd .video_item--recommend{background-color:#2579d9;box-shadow:0 2px 2px rgba(1,1,1,.24)}
.video_list_box .video_list_box--bd .video_item--media{background-color:#f93976;box-shadow:0 2px 2px rgba(1,1,1,.24)}
.video_list_box .video_list_box--bd .video_item .video-player-icon{opacity:0;position:absolute;top:50%;left:50%;width:50px;height:50px;margin:-25px 0 0 -25px;background:url(https://a.msstatic.com/huya/main3/widget/game-live-item/img/play-icon_fbf7f.png) no-repeat;transform:scale(1.5);backface-visibility:hidden;transition:all .25s ease-out;z-index:900;pointer-events:none}
.video_list_box .video_list_box--bd .video_item .video-item-cancel-fav{display:none}
.video_list_box .video_list_box--bd .video_item .video-mask{position:absolute;top:0;left:0;width:100%;height:100%;transition:all .3s ease-out;opacity:0;background:#000;pointer-events:none}
.video_list_box .video_list_box--bd .video_item:hover .video-mask{opacity:.5;background:#000}
.video_list_box .video_list_box--bd .video_item:hover .video-player-icon{opacity:1;transform:scale(1)}
.video_list_box .video_list_box--bd .video_item:hover .video-item-cancel-fav{display:block;position:absolute;right:5px;top:5px;z-index:1000;font-size:12px}
.side_box .title,.video_list_box .title{margin-bottom:0;padding-bottom:0!important}
.video_list_box .title a.common_alink{font-size:12px}
.side_box .title .title_underline,.video_list_box .title .title_underline{position:relative;display:inline-block}
.side_box .title .title_underline::after,.video_list_box .title .title_underline::after{height:2px;position:absolute;content:"";background-color:#f93976;width:100%;bottom:-1px;left:0}
.video_list_box .title .delimiter{height:10px;display:inline-block;width:1px;background-color:#6c757d;margin:0 10px}

/* play page */
.video_player_custom_wrapper_txt {background-color:#000;font-weight:bold;color:red;}
.video_player_custom_wrapper_txt p {margin: 0;font-size: 14px !important;text-align: center;padding: 10px 0;}
.video_player_custom_wrapper_txt p span {padding:0 5px !important;color: yellow;}
.video_detail_meta{color:#d0e0f0;display:inline-block;padding:5px 10px 5px 0;margin-right:5px;font-size:14px}
.video_detail_meta i{margin-right:5px;vertical-align:-1px}
.video_detail_meta_tag .btn {display: inline-block;padding: 6px 30px;font-size: 12px;border-radius: 4px;color:#c2c2c2;}
.xtui-player__detail__meta{display: block;}
.xtui-player__detail__meta .video_detail_function{cursor: pointer;}
.xtui-player__content p {margin-bottom: 0;color:#6c757d;line-height: 180%;}
.xtui-player__content p img {margin-bottom: 10px;max-width: 100%;}
.video-player-custom-wrapper{background-color:#404040;}
.video-player-custom{display:flex;padding:5px;}
.video-player-custom-item{flex:1;margin:0 2px;padding:10px 0;background-color:#0b0b0b;text-align:center;box-shadow: 0px 0px 2px rgba(0,0,0,.2);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;color:#c2c2c2;border-radius: 4px;font-size:13px;}
.xtui_player__detail__functions{display: flex !important;}
.xtui_player__detail__functions .video_detail_function {flex: 1;color: #c2c2c2;text-align: center;line-height: 180%;}
#toastTpl{z-index: 9999;}
h3.popover-header{font-size: 14px;}
.data .split-dot{margin-left: 5px;}
.data .split-dot:first-of-type{margin-left: 0}

/* category */
.videos_category_nav_box .category_nav{position:relative;background-position:center center;background-size:cover;cursor:pointer;overflow:hidden}
.videos_category_nav_box .category_nav::before{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.7);z-index:1;transition:background-color 0.3s ease-in-out, transform 0.2s ease;}
.videos_category_nav_box .category_nav.active::before,.videos_category_nav_box .category_nav:hover::before{background:rgba(0,0,0,.2);}
.videos_category_nav_box .category_nav span{position:relative;z-index:2;color:#fff;text-shadow:0 2px 4px rgba(0,0,0,.4),0 0 12px rgba(0,0,0,.3),1px 1px 1px rgba(0,0,0,.5)}

/* album */
.album_list_box .video_list_box--bd{padding-top: 0;}
.album_list_box .video_item-title{background-color: #FFF;}
.album_list_box .video_item--episode{position: absolute;right: 8px;text-align:center;bottom: 8px;border-radius:2px;background-color:rgba(40, 36, 27, .8);box-shadow:0 2px 2px rgba(1,1,1,.24);font-size: 12px;color: #FFF;padding: 1px 8px;z-index: 999;}
.album_list_box .video_item--image-cover {position: absolute;top: -6px;width: calc(100% - 36px);height: 100%;left: 18px;right: 18px;border-radius: 8px;z-index: 10;}
.album_list_box .video_item--image {border-top-left-radius: 8px;border-top-right-radius: 8px;border-top: 1px solid #FFF;}

.album_detail_box {position: relative;margin-top:10px;}
.album_detail_box .album_detail_head_bg {height: 180px;background-size: cover;background-repeat: no-repeat;background-position: center center;overflow: hidden;}
.album_detail_box .album_detail_title {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);background-color: rgba(255, 255, 255, 0.5);backdrop-filter: blur(5px);opacity: 0.8;padding: 2% 20px;}
.album_detail_box .album_detail_cover {background-image: linear-gradient(transparent, rgba(0, 0, 0, .5));position: absolute;top:0;bottom:0;width: 100%;z-index:100;}
.album_detail_box .album_detail_episode {position: absolute;bottom: 0;right: 0;background-image: url("../images/episode.png");height: 30px;line-height:30px;background-size: cover;padding: 0 15px;background-position: left center;color: #FFF;z-index:200;}
.album_menu_wrap{background-color:#000}
.album_menu_wrap .album_menu{border:none;box-shadow: 0 4px 10px 0 hsla(0, 0%, 73.7%, 0.3);display:flex;height:40px;line-height:40px;position:relative;color:#c2c2c2}
.album_menu_wrap .album_menu .album_menu_item{margin:0 20px;padding:0 8px 1px;cursor:pointer;align-items:center;justify-content:center;text-align:center;display:block;box-sizing:border-box;font-size:14px;font-weight:400;height:100%;line-height:40px}
.album_menu_wrap .album_menu .album_menu_item .text{display:inline-block;box-sizing:border-box;font-weight:400;border-bottom:2px solid transparent;height:100%;line-height:40px}
.album_menu_wrap .album_menu .album_menu_item.active .text{border-bottom:2px solid #f93976}
.album_content_wrap{background-color:#000}
.album_content_item{display:none;padding:12px;}
.album_content_item.active{display:block}
.album_content_item.desc{color:#c2c2c2;line-height:200%;font-size:13px;padding-left:20px;padding-right:20px;}
.album_content_item.desc p:last-of-type{margin-bottom:0}

.album_detail_box_m{display: flex;padding: 20px;padding-left:25px;background-color: #000;margin-top:10px;}
.album_detail_box_m .album_detail_cover_m img{height: 100px;}
.album_detail_box_m .album_detail_meta_m{padding-left: 20px;color: #6c757d;}
.album_detail_box_m .album_detail_meta_m em{font-style: normal;}
.album_detail_box_m .album_detail_meta_m p {margin-bottom: .5rem;font-size: 12px;}
.album_detail_box_m .album_detail_meta_m span:not(:first-of-type):before{content: "•";margin: 0 4px;}

/* novel index */
.novel_index{}
.novel_index .xtui-panel-bg{}
.novels_list_box .novel_item {padding:8px 10px;border-bottom: 1px dashed rgba(255,255,255, .125);}
.novels_list_box .novel_item .novel_item_no{color: #747373;}
.novels_list_box .novel_item .novel_item_no:after{content: "、";}
.novels_list_box .novel_item:hover{background-color: #111111;}
.novels_list_box .novel_item .novel_item_link{display: block;}

/* novel read */
.novels_reader_box{font-family: inherit !important;padding-left:80px;padding-right:80px;padding-bottom: 10px;}
.novels_reader_header{text-align: center;margin-bottom: .5rem;}
.novels_reader_content_wrapper .desc-end{text-indent: 0;}
.novels_reader_content{word-break: break-word;text-align: justify;line-break: anywhere;}
.novels_reader_content h2{font-size: 16px;padding:1rem 0; text-align: left;margin-bottom: 1rem;}
.novels_reader_content h2:before{content: "🔖";padding-right: 5px;}
.novels_reader_box .reader-subtitle{padding: 15px 0;border-radius: 4px;}

/* novel read dark mode */
.novels_read_dark {background-color: #1a1a1a !important;}
.novels_read_dark .xtui-panel-bg{background-color: #262626;}
.novels_read_dark .novels_reader_box{color:#d1d1d1;}
.novels_read_dark .bi-moon{display: none;}
.novels_read_dark .bi-sun{display: block;}
.novels_read_dark .reader-subtitle {color: rgba(179,179,179, .7);}
.novels_read_dark .novels_reader_content h2{color: #a0a0a0;border-bottom: 1px solid #3d3d3d;}

/* novel read light mode */
.novels_read_light {background-color: #fafafa !important;}
.novels_read_light .xtui-panel-bg{background-color: #f2f2f2;}
.novels_read_light .video_list_box .title_underline{color: #252525;}
.novels_read_light .video_list_box .video_list_box--hd{border-bottom-color: rgba(0,0,0, .08);}
.novels_read_light .bi-moon{display: block;}
.novels_read_light .bi-sun{display: none;}
.novels_read_light .reader-title{color: #252525 !important;}
.novels_read_light .novels_reader_content{color: #2c2c2c;}
.novels_read_light .novels_reader_content h2 {color: #666666;border-bottom: 1px solid #dedede;}

.novels_reader_box.reader-content-16 {font-size: 1rem;}
.reader-content-16 p {text-indent: 2rem;line-height: 2.4rem;}
.reader-content-16 .reader-subtitle{font-size: 12px;}
.reader-content-16 .desc-item{margin:0 10px;}

/* 404 page */
.error-panel {padding: 32px;display: flex;flex-direction: column;align-items: center;}
.error-panel__image {min-width: 200px;max-width: 80%;margin: 20px 0;}
.error-panel__image img {width: 100%;height: 100%;}
.error-panel__description {margin-top: 16px;padding: 0 10px;color: #969799;font-size: 14px;line-height: 20px;}
.error-panel__btn_list {text-align: center;padding:10px 0 20px 0;}
.error-panel__btn_list .btn{margin: 0 5px; font-size: 14px;}

/* foot */
.xtui-foot {padding: 10px 10px 0;}
.xtui-foot__desc{padding-left:5%;padding-right:5%;}
.reader-mode{display: none;}
.body_novels_detail .reader-mode{display: block;}

@media (min-width: 1200px){
    .visible-lg { display: block !important;}
    .hidden-lg {display: none !important;}
}

@media (max-width: 1199px) and (min-width: 992px){
    .visible-md { display: block !important;}
    .hidden-md {display: none!important;}
}

@media (max-width: 991px) and (min-width: 768px){
    .visible-sm{ display: block !important;}
    .hidden-sm {display: none !important;}
}

@media (max-width:992px){

    /* all */
    body{padding-top:100px}

    /* header */
    .top-fixed-down{margin-top:-100px}
    .xtui-header__side{float:none;position:absolute;top:0;left:150px;right:0;width:auto}
    .xtui-header__logo, .xtui-header__menu{float:none}
    .xtui-header__logo{margin:10px 0 10px}
    .xtui-header__logo .logo{width:127px;height:30px;}
    .xtui-header__search{float:right;margin-top:10px}
    .xtui-header__menu{margin:0;padding:0;height:40px;line-height:40px}
    .xtui-header__menu:before{content:" ";position:absolute;left:0;top:0;right:0;width:100%;height:1px;-webkit-transform-origin:0 0;transform-origin:0 0;-webkit-transform:scaleY(.5);transform:scaleY(.5); border-top: 1px solid rgba(255,255,255, .3);}
    .xtui-header__menu li{margin-top:0;margin-right:20px;cursor: pointer;}
    .xtui-header__menu li a{padding:0;font-size:14px;white-space:nowrap; background: none; color: #C2C2C2;}
    .xtui-header__menu li.active a{position:relative; background: none; color: #f93976;}
    .xtui-header__menu li.active a:before{content:" ";position:absolute;bottom:0;width:100%;height:2px;border-radius:2px; background-color: #f93976;}
    .xtui-header__user > li{ padding: 15px 0 10px; margin-right: 10px;}
    .xtui-header__user > li .dropdown{ right: 0;}
    .xtui-header__user > li .dropdown:before{ right: 8px;}
    .xtui-header__menu > li:hover .dropdown, .xtui-header__user > li:hover .dropdown{ display: none;}

    /* screen */
    .xtui-screen__list{ height: 40px; padding:10px 0 10px; overflow:hidden; white-space: nowrap;}
    .xtui-screen__list:last-child{ padding: 10px 0 0;}
    .xtui-screen__list li{ float: none; display: inline-block; margin-right:10px; margin-bottom:0}
    .xtui-screen__list li span{padding:2px 5px 2px 0}
    .xtui-screen__list li a{padding:2px 5px 2px; white-space:nowrap}
    .xtui-screen__list.letter-list li{ margin-right: 5px; margin-bottom: 0;}
    .xtui-screen__list.letter-list li a,.xtui-screen__list.letter-list li.active a{padding:2px 5px 2px}

    .text_horizontal_box .row{font-size: 12px !important;}

    .novels_reader_box{
        padding-left: calc((100vw + 640px) / 23);
        padding-right: calc((100vw + 640px) / 23);
    }
}

@media (min-width: 768px) {
    .text_horizontal_box .row .col-md {border-top-width: 1px;border-left-width: 1px;}
    .text_horizontal_box .row .col-md:nth-child(8n) {border-right-width: 1px;}
    .text_horizontal_box .row:last-of-type .col-md {border-bottom-width: 1px;}
}
@media (max-width:767px){

    .visible-xs { display: block !important;}
    .hidden-xs {display: none!important;}

    /* all */
    body{ font-size: 12px;}

    /* text */
    /*h1{ font-size:20px; line-height: 24px;}*/
    /*h2{ font-size:18px; line-height: 22px;}*/
    /*h3{ font-size:16px; line-height: 20px;}*/
    /*h4{ font-size:14px; line-height: 18px;}*/
    /*h5{ font-size:12px; line-height: 16px;}*/
    /*h6{ font-size:10px; line-height: 14px;}*/

    /* btn */
    .btn-min{ padding: 3px 8px;}

    /* header */
    .xtui-header__logo{margin-left:10px}
    .xtui-header__search{position:absolute;top:0;left:0;right:50px;width:auto}
    .xtui-header__menu{padding-left:10px}
    .xtui-header__user{padding-right:10px}
    .xtui-header__user > li{ padding: 14px 0; margin: 0;}

    /* form */
    .form-control{ background-color:#F8F8F8; color: #999999; border: 0;}
    .text_horizontal_box .row .col-md {flex: 25%;border-bottom-width: 1px;border-left-width: 1px;}
    .text_horizontal_box .row .col-md:nth-child(4n){border-right-width: 1px;}
    .text_horizontal_box .row:first-of-type .col-md:nth-child(-n+4) {border-top-width: 1px;}

    /* page */
    .xtui-page{margin-bottom: 0;}
    .xtui-page li{float:left;width:20%;margin:0;padding:0 5px 0 5px}
    .xtui-page li a, .xtui-page__box li .num{display:block;padding:5px 0;text-align:center}
    .xtui-page li.page-item{ width: auto; margin-bottom: 5px;}
    .xtui-page li.page-item a{ padding: 5px 15px;}

    /* line */
    .top-line:before,.top-line-dot:before{-webkit-transform-origin: 0 0;transform-origin: 0 0;-webkit-transform: scaleY(0.5);transform: scaleY(0.5);}
    .bottom-line:after,.bottom-line-dot:before{ -webkit-transform-origin: 0 100%;transform-origin: 0 100%; -webkit-transform: scaleY(0.5);transform: scaleY(0.5);}
    .m-top-line,.m-top-line-dot,.m-bottom-line,.m-bottom-line-dot{ position: relative;}
    .m-top-line:before,.m-top-line-dot:before{content: " "; position: absolute; left: 0; top: 0; right: 0; width: 100%; height: 1px; -webkit-transform-origin: 0 0;transform-origin: 0 0;-webkit-transform: scaleY(0.5);transform: scaleY(0.5);}
    .m-bottom-line:after,.m-bottom-line-dot:before{content: " "; position: absolute; left: 0; bottom: 0; right: 0; width: 100%; height: 1px; -webkit-transform-origin: 0 100%;transform-origin: 0 100%; -webkit-transform: scaleY(0.5);transform: scaleY(0.5);}

    /* video */
    .video_player_custom_wrapper_txt p{font-size: 12px;}
    .xtui-player__detail.detail .title {font-size: 16px;}
    .video_player_panel {margin-bottom: 0 !important;}

    /* foot */
    .xtui-foot p {line-height: 1.5;}
    .xtui-foot {padding: 10px 10px 0;}
    .xtui-foot__desc{padding: 0;}

    /* extra */
    .xtui-extra{right:15px;bottom:15px}
    .xtui-extra li{padding:8px 0 0}
    .xtui-extra li a,.xtui-extra li span{width:35px;height:35px;line-height:35px;font-size:16px}
    .xtui-extra li a .icon,.xtui-extra li span .icon{font-size:16px}
    .xtui-extra li a img{margin-top:8px;width:18px;height:18px}

    /* album */
    .album_menu_wrap .album_menu .album_menu_item {flex-grow: 1;flex-shrink: 0;margin: 0 10px;}

    /* category */
    .text_horizontal_box.videos_category_nav_box .row .col-md {flex: 33.3333%;}

    /* novels */
    .novels_reader_box{padding-left: 20px;padding-right: 20px;}
}

@media (max-width: 576px) {
    .xtui-panel, .xtui-header_bd {
        margin-left: -12px;
        margin-right: -12px;
    }
    .album_list_box .row{
        padding-left: 20px;
        padding-right: 20px;
    }
    .body_videos_category .xtui-panel-card-img, .body_videos_pages .xtui-panel-card-img{
        width: 60px;height: 60px;
    }
    .g-recommend-box{
        margin-left: -12px;
        margin-right: -12px;
    }
}
@media (max-width:413px){
    .visible-mi{ display: block !important;}
    .hidden-mi{display: none !important;}
}
