/*
 * Website Style
 * Karson
 * 2023-12-01
 *
*/

body { 
    background-color: #dbf6e8;
    background-image: -webkit-linear-gradient(180deg, #dbf6e8 0%, #f5f5f5 3%);
    background-image: -moz-linear-gradient(180deg, #dbf6e8 0%, #f5f5f5 3%);
    background-image: -o-linear-gradient(180deg, #dbf6e8 0%, #f5f5f5 3%);
    background-image: linear-gradient(180deg, #dbf6e8 0%, #f5f5f5 3%);

	font-size: 14px;
	color: #6e7b84;
	line-height: 1.5;
	font-family: "PingFang SC","Helvetica Neue",Helvetica,Arial,"Microsoft Yahei","Hiragino Sans GB","Heiti SC","WenQuanYi Micro Hei",sans-serif;	
}

/* Basic */
a { text-decoration: none; }
.border { border: 1px solid #ededed!important; }
.card { border-color: #ededed; }
.card-header { padding: 8px 10px; border-bottom-color: #ededed; }
.card-body { padding: 10px; }

/* Top */
.top-navbar { 
	box-shadow: rgba(27, 31, 35, 0.04) 0px 1px 0px 0px;
}
.logo img { 
	width: 137px;
	height: auto;
	margin-left: 2px;
}
.navbar-expand-lg .navbar-nav .nav-link:hover { 
	color: #198754!important;
}
.racename{margin-bottom: 10px;}

/* 顶部导航栏 */
header {
	background-color:#62b88f;
	color: #fff;
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.nav-container {
	display: flex;
	align-items: center;
	max-width: 1200px;
	margin: 0 auto;
	padding: 10px;
	justify-content: space-between;
}
.nav-menu a.active {
	background-color: #fff;
	color: #FFA500;
}
.logo {
	font-size: 28px;
	font-weight: bold;
	color: #fff;
}

.nav-menu {
	display: flex;
	list-style: none;
	margin: 0;
	padding: 0;
}

.nav-menu li {
	position: relative;
	margin-left: 25px;
}

.nav-menu a {
	color: #fff;
	font-size: 16px;
	transition: color 0.3s, background-color 0.3s;
	padding: 10px 15px;
	display: block;
	border-radius: 4px;
}

.nav-menu a:hover {
	background-color: rgba(245, 240, 240, 0.1);
	color: #fff;
}

/* 二级导航 */
.sub-menu {
	display: none;
	position: absolute;
	top: 100%;
	left: 0;
	background-color: #62b88f; /* 深蓝色 */
	list-style: none;
	padding: 10px 0;
	margin: 0;
	min-width: 180px;
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
	border-radius: 4px;
	z-index: 100;
}

.sub-menu li {
	margin: 0;
}

.sub-menu a {
	padding: 10px 15px;
	font-size: 14px;
}

.nav-menu li:hover .sub-menu {
	display: block;
}

.menu-toggle {
	display: none;
	font-size: 28px;
	cursor: pointer;
	color: #fff;
}

#hot_league {
	margin: 5px;
}
.header_newnav {
	width: 1200px;
	display: flex;
	align-items: center;
	background: #ffffff;
	margin: 0 auto;
}
.headline {
	display: flex;
	align-items: center;
	margin-right: 50px;
}
/* 添加向下箭头 */
.has-submenu > a::after {
	content: "▼"; /* 向下箭头符号 */
	font-size: 12px;
	margin-left: 8px;
	transition: transform 0.3s ease;
}

/* 鼠标悬停时旋转箭头 */
.has-submenu:hover > a::after {
	transform: rotate(180deg);
}
#newNav {
	display: flex;
	flex-wrap: wrap;
	padding: 10px 10px;
}
.teamslists{padding-right: 15px;}
.famous-nav {
	color: #fff;
	background-color: #e9d8d955;
	display: flex;
	align-items: center;
	overflow-x: auto;
}
.famous-nav-item {
	display: flex;
	justify-content: center;
	min-width: 80px;
	margin: 6px 5px;
	color: #fff;
	padding: 2.5px;
	border-radius: 5px;
	background-color: #FF9E29;
}
.famous-nav-item a {
	display: flex;
	align-items: center;
}
@media (max-width: 768px) {
	.famous-nav-item {
		min-width: 90px;
	}
	.nav_reg, .header_newnav, .focus {
		width: 100%;
	}
	.headline {
		margin-right: 0;
		overflow: auto;
		padding: 4px;
	}
	#newNav {
		flex-wrap: nowrap;
		white-space: nowrap;
		overflow: auto;
	}

	.nav-menu {
		display: none;
		flex-direction: column;
		background-color: #62b88f;
		position: absolute;
		top: 60px;
		left: 0;
		right: 0;
		padding: 20px;
	}

	.nav-menu.active {
		display: flex;
		z-index: 1000;
	}

	.nav-menu li {
		margin: 10px 0;
	}

	.menu-toggle {
		display: block;
	}

	.container {
		flex-direction: column;
	}

	.sub-menu {
		position: static;
		display: none;
		background-color: rgba(0, 0, 0, 0.1);
		padding-left: 20px;
	}

	.nav-menu li:hover .sub-menu {
		display: none;
	}

	.nav-menu li.active .sub-menu {
		display: block;
	}
	.has-submenu > a::after {
		content: "▶"; /* 移动端改为向右箭头 */
	}

	.has-submenu.active > a::after {
		content: "▼"; /* 展开时改为向下箭头 */
	}
}



/* Top Live Item Style */
.top-live .card-header { 
    background: url('/images/card_head_bg.jpg') no-repeat 0 -60px;
    background-size: cover;
    color: #FFF;
}
.top-live-item-body .dw { 
	margin-bottom: 15px;
	align-items: center;
	text-align: center;
}
.top-live-item-body .dw .vs { 
	min-width: 56px;
	font-size: 14px;
	font-weight: 700;
}
.top-live-item-body .dw .icons img { 
	display: block;
	margin: 0 auto 5px;
	vertical-align: middle;
}
.top-live-item-body .dw .icons div { 
	width: 105px;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
}
.top-live-item-body .state { 
	text-align: center;
}
.top-live-item-body .state a { 
	font-size: 12px;
}

/* Main layout Style */
.t-hd { 
	position: relative;
	padding-bottom: 10px;
	border-bottom: 1px solid #ededed;
}
.t-hd h3 { 
	margin: 0;
	color: #333;
	font-size: 16px;
	font-weight: 700;
}
.t-hd:after{
	content: "";
	position: absolute;
	left: 0;
	bottom: -1px;
	width: 66px;
	height: 1px;
	background: #198754;
}
.top-news { 
	padding: 15px 10px;
	border: 1px solid #ededed;
	border-radius: 6px;
}
.top-news-body .lf { 
	float: left;
	width: 540px;
}
.top-news-body .rg { 
	margin-left: 550px;
}
.top-news-body a { 
	color: #212529!important;
}
.top-news-body a:hover { 
	color: #03a87c!important;
}
.top-news-body .lf a { 
	position: relative;
	overflow: hidden;
	color: #FFF!important;
}
.top-news-body .lf a img { 
	display: block;
	width: 100%;
	height: 328px;
	margin: 0;
	border-radius: 4px;
}
.top-news-body .lf a div { 
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 200;
	padding: 15px;
	background: linear-gradient(to top,#000000 0%,rgba(0,0,0,0) 100%);
	border-radius: 0 0 6px 6px;
}
.top-news-body .lf a div h5 { 
	margin: 0;
	font-size: 18px;
	text-align: center;
}
.top-news-rg .item { 
	margin-bottom: 14px;
}
.top-news-rg .item .thumb img { 
	max-width: 100%;
	border-radius: 4px;
}
.top-news-rg .item .info { 
	text-align: justify;
}
.top-news-rg .item .info a { 
	font-size: 15px;
}
.top-news-rg .item:last-child { 
	margin-bottom: 0;
}

/* hot-tags */
.hot-tags { 
	padding: 10px 10px;
	border: 1px solid #ededed;
	border-radius: 6px;
	font-size: 0;
	line-height: 0;
}
.hot-tags a, .hot-tags span { 
	display: inline-block;
	margin-right: 10px;
	padding: 5px 10px;
	border: 1px solid #ededed;
	border-radius: 6px;
	color: #212529!important;
	font-size: 14px;
	line-height: 22px;
}

.hot-tagsb a, .hot-tagsb span { 
	display: inline-block;
	margin-right: 10px;
	padding: 5px 10px;
	border: 1px solid #ededed;
	border-radius: 6px;
	color: #212529!important;
	font-size: 14px;
	line-height: 22px;
	margin-top: 10px;
}

.hot-tagsb { 
	padding: 10px 10px;
	border: 1px solid #ededed;
	border-radius: 6px;
	font-size: 0;
	line-height: 0;
}


.hot-tags .more { 
	float: right;
	margin-right: 0;
	color: #198754!important;
}
.hot-tags a:hover { 
	color: #198754!important;
}
.hot-tags span { 
	background-color: #198754;
	color: #FFF!important;
}

/* latest-match */
.latest-match { 
	padding: 15px;
	border: 1px solid #ededed;
	border-radius: 6px;
}
.latest-match li:last-child { 
	border-bottom: 0;
}
.list-match-item { 
	padding: 15px 0;
	border-bottom: 1px solid #ededed;
}
.list-match-item .info-a .icons { 
	float: left;
	width: 24px;
	padding-top: 10px;
}
.list-match-item .info-a .name-times { 
	min-width: 130px;
	margin-left: 44px;
}
.list-match-item .info-a .name-times span { 
	display: block;
}
.list-match-item .info-a .name-times span:first-child { 
	width: 120px;
	margin-bottom: 5px;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
	
	color: #212529;
}
.list-match-item .info-b .box span { 
	display: block;
}
.list-match-item .info-b .box .icons { 
	margin-right: 10px;
}
.list-match-item .info-b .box .name { 
	min-width: 210px;
	margin-right: 10px;
	color: #212529;
}
.list-match-item .info-b .box .bfen { 
	width: 22px;
	background-color: #eceded;
	color: #000;
	text-align: center;
}
.list-match-item .info-b .box:first-child { 
	margin-bottom: 10px;
}
.list-match-item .info-c { 
	width: 100%;
	padding-left: 15px;
}
.list-match-item .info-c .inr-box { 
	float: right;
}
.list-match-item .info-c .box { 
	padding: 0 10px;
}
.list-match-item .info-c .box a { 
	color: #6e7b84!important;
	text-align: center;
}
.list-match-item .info-c .box img { 
	display: block;
	margin: 0 auto 5px;
}
.list-match-item .info-c .box span { 
	display: block;
}
.list-match-item .info-d { 
	min-width: 120px;
	text-align: right;
}

/* Nes Match Item */
.match-item { padding: 15px 0; border-bottom: 1px solid #ededed; color: #333; }
.match-item .left-info { flex-shrink: 0; width: 270px; font-size : 0; }
.match-item .left-info div { display: inline-block; vertical-align: middle; font-size: 14px; }
.match-item .left-info .event { max-width: 122px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.match-item .left-info .time { padding-left: 20px; padding-right: 20px; }
.match-item .middle-info { flex: 1; font-size: 0; text-align: center; }
.match-item .middle-info span { display: inline-block; font-size: 14px; }
.match-item .middle-info .home { width: calc((100% - 70px) / 2); box-sizing: border-box; text-align: right; }
.match-item .middle-info .vs { width: 70px; }
.match-item .middle-info .away { width: calc((100% - 70px) / 2); box-sizing: border-box; text-align: left; }
.match-item .middle-info .home .name, .match-item .middle-info .home img { display: inline-table; }
.match-item .middle-info .away .name, .match-item .middle-info .away img { display: inline-table; }
.match-item .middle-info .home img { margin-left: 10px; }
.match-item .middle-info .away img { margin-right: 10px; }
.match-item .right-info { flex-shrink: 0; width: 170px; font-size: 0; text-align: right; }
.match-item .right-info a { display: inline-block; font-size: 14px; }
.match-item .right-info a:first-child { margin-right: 10px; }


/* Sidebar */
.sidebar-box { 
	padding: 15px;
	border: 1px solid #ededed;
	border-radius: 6px;
}
.sidebar-forecast .item { 
	padding: 0 0 15px;
}
.sidebar-forecast .item:last-child { 
	padding-bottom: 0;
}
.sidebar-forecast .item .t { 
	margin-bottom: 10px;
}
.sidebar-forecast .item .t .lf img { 
	float: left;
	width: 40px;
}
.sidebar-forecast .item .t .lf div { 
	margin-left: 50px;
}
.sidebar-forecast .item .t .lf div span { 
	display: block;
}
.sidebar-forecast .item .t .lf div span:first-child { 
	color: #000;
}
.sidebar-forecast .item .t .lf div span:last-child { 
	max-width: 50px;
	background-color: #198754;
	color: #FFF;
	font-size: 12px;
	text-align: center;
}
.sidebar-forecast .item .t .rg { 
	font-size: 0;
	line-height: 0;
}
.sidebar-forecast .item .t .rg span { 
	display: inline-block;
	padding: 0 5px;
	font-size: 12px;
	line-height: 22px;
}
.sidebar-forecast .item .t .rg span:first-child { 
	border-radius: 16px 0 0 16px;
	background-color: #dc3545;
	color: #FFF;
}
.sidebar-forecast .item .t .rg span:last-child { 
	background-color: #FFBFBF;
	color: #8C2300;
}
.sidebar-forecast .item .b { 
	position: relative;
}
.sidebar-forecast .item .b .info { 
	height: 32px;
	overflow: hidden;
	border: 1px solid #d6ebeb;
	background-image: linear-gradient(35deg,#e9ffea 40%,#ffffff 90%);
	color: #000;
	line-height: 32px;
	text-indent: 10px;
}
.sidebar-forecast .item .b .info time { 
	color: #F2393F;
}
.sidebar-forecast .item .b:before {
	content: '';
	width: 0;
	height: 0;
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	border-bottom: 10px solid #e9ffea;
	position: absolute;
	top: -8px;
	left: 10px;
	z-index: 300;
}
.sidebar-forecast .item .b:after {
	content: '';
	width: 0;
	height: 0;
	border-left: 10px solid #FFFFFF;
	border-right: 10px solid #FFFFFF;
	border-bottom: 10px solid #d6ebeb;
	position: absolute;
	top: -9px;
	left: 10px;
}
.sidebar-tabs .nav-tabs .nav-link { 
	padding: 5px 12px;
	color: #6e7b84!important;
}
.sidebar-tabs .nav-tabs .nav-link.active { 
	color: #000!important;
}
.sidebar-tabs .nav-tabs .nav-item:first-child { 
	margin-left: 5px;
}
.sidebar-tabs table a { 
	color: #000!important;
}
.sidebar-tabs table a:hover { 
	color: #03a87c!important;
}
.sidebar-tabs th { 
	color: #6e7b84;
	font-weight: 400;
}
.sidebar-tabs td { 
	padding: 8px 0;
}
.sidebar-tabs td:nth-child(n+2) { 
	padding: 8px 4px;
}
.sidebar-tabs tr td:first-child { 
	width: 40px;
	background-color: #f2fff9;
	color: #000;
	text-align: center;
}
.sidebar-tabs tr td:nth-child(n+3) { 
	text-align: center;
}

.article-sub-menu {
    display: flex;
    flex-wrap: wrap;
}

.article-sub-menu .submenu-item {
    flex: 0 0 calc(33.33% - 10px); /* 设置每个子容器的宽度为33.33%，减去margin值 */
    margin: 5px; /* 设置子容器之间的间距 */
    padding: 3px 5px;
    border-radius: 4px;
    background-color: #2b8e64;
    color: #ffffff !important;
    text-align: center;
    box-sizing: border-box; /* 让子容器的宽度包括padding和border */
}

.sidebar-article li { margin-bottom: 10px; padding: 10px; border-left: 3px solid #62b88f; background-color: #F3F4F7; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.sidebar-article li a { color: #333!important; }
.sidebar-article li a:hover { color: #03a87c!important; }
.sidebar-article li:last-child { margin-bottom: 0; }


/* 500 */
.paihang-box { width: 280px; margin: 0 auto; }
.paihang-box h3 { margin: 0; padding: 10px; border-bottom: 1px solid #ebebeb; background-color: #FFF; font-size: 14px; text-align: center; }
.paiming-table th { text-align: center; }
.paiming-table tr th:nth-child(2) { width: 82px; }
.paiming-table td { text-align: center; }

/* Nba Table */
.nba-table .tl { max-width: 93px!important; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; text-align: left!important; }


/* Matches List */
.match-time-calendar { 
	border: 1px solid #ededed;
	border-radius: 6px;
	color: #000;
}
.match-time-calendar .inr-time-item { 
	
	border-right: 1px solid #ededed;
}
.match-time-calendar .inr-time-item:last-child { 
	border: 0;
}
.match-time-calendar .inr-time-item a { 
	padding: 10px 0;
	color: #000!important
}
.match-time-calendar .inr-time-item a p { margin: 0; padding: 5px 0; text-align: center; }
.match-time-calendar .inr-time-item a:hover { border-radius: 6px; background-color: #198754; color: #FFF!important; }

/* Show Match */
.match-info { 
	padding: 20px;
	border-radius: 6px;
	background: #00f260;  
    background: -webkit-linear-gradient(to right, rgb(0, 242, 96), rgb(5, 117, 230)); 
    background: linear-gradient(to right, rgb(0, 242, 96), rgb(5, 117, 230));
	color: #FFF;
	font-size: 14px;
	text-align: center;
}
.match-info .top-info .title { margin: 0 auto; font-size: 0; }
.match-info .top-info .title span { display: inline-block; font-size: 14px; }
.match-info .top-info .title .event { margin-right: 10px; padding: 3px 8px; border-radius: 11px; background: #ff9800; }
.match-info .middle-info { padding: 15px 0; }
.match-info .middle-info .home {  }
.match-info .middle-info .vs { width: 260px; font-size: 32px; }
.match-info .middle-info img { width: 50px; height: 50px; margin-bottom: 10px; overflow: hidden; }
.match-info .middle-info h6 { font-size: 14px; }

.matches-live { border-radius: 6px; background-color: #343434; }
.matches-live .menu a { display: block; padding: 10px; color: #FFF!important; }
.matches-live .menu .doh { width: 120px; text-align: center; }
.matches-live .menu .vid { background-color: #242629; text-indent: 40px; }
.matches-live .live-content { border-radius: 0 0 6px 6px; overflow: hidden; background-color: #343434; }
.matches-live .live-content .iframe-wrap { width: 100%; height: 451px; border-radius: 0 0 6px 6px; background-color: #343434; }

.no-donghua { position: relative; height: 451px; }
.no-donghua-tips { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); padding: 20px; color: #4caf50; font-size: 32px; }

.show-matche-cont { padding: 15px; border: 1px solid #ededed; border-radius: 6px; }

.show-matche-datatable .table { 
		font-size: 14px;
	} .show-matche-datatable .table td { 
		max-width: 56px;
		padding: 10px 5px;
	} .show-matche-datatable .table th:first-child,.show-matche-datatable .table td:first-child { 
		text-align: left;
	} .show-matche-datatable .table td p { 
		overflow: hidden;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-box-orient: vertical; /*设置对齐模式*/
		-webkit-line-clamp: 2; /*设置多行的行数，示例为2行*/
	} .show-matche-datatable .table td p:first-child { 
		margin-bottom: 5px;
	} .show-matche-datatable .table td p:nth-child(2) { 
		margin: 0;
	} .show-matche-datatable .table tr:last-child { 
		border-bottom: 0!important;
		border-color: none;
	} .show-matche-datatable .table tr:last-child td { 
		border: 0!important;
	} .show-matche-datatable .table th:last-child,.show-matche-datatable .table td:last-child { 
		text-align: right;
	}


.matches-field-data { border-radius: 6px; background-color: #FFF; }
/* MatchDddPanel */
.match-odd-panel {
    border: solid #eee;
    border-width: 0 1px;
    color: #666;
    font-size: 14px;
    text-align: center;
}
.match-odd-panel .lab {
    float: left;
    height: 30px;
    line-height: 30px;
}
.match-odd-panel .head {
    border-top: 1px solid #eee;
    border-bottom: 1px solid #eee;
    border-radius: 6px 6px 0 0;
    background-color: #f2f2f2;
    clear: both;
    display: inline-block;
    vertical-align: top;
    width: 100%;
    overflow: hidden;
}
.match-odd-panel .ball, .match-odd-panel .instant, .match-odd-panel .primary {
    border-bottom: 1px solid #eee;
    clear: both;
    display: inline-block;
    vertical-align: top;
    width: 100%;
    overflow: hidden;
    background-color: #fff;
}
.match-odd-panel .ball .data, .match-odd-panel .instant .data, .match-odd-panel .primary .data {
    float: left;
}
.match-odd-panel .data .lab {
    border-left: 1px solid #eee;
    overflow: hidden;
}
.match-odd-panel .data .lab div {
    width: 33.2%;
    float: left;
    overflow: hidden;
    height: 30px;
}
.match-odd-panel .data .lab .exponent {
    display: inline-block;
    height: 30px;
}

.match-odd-panel .w-82 { width: 82px; }
.match-odd-panel .w-272 { width: 213px; }
.match-odd-panel .w-271 { width: 212px; }


/* BasketballScores */
.basketball-scores {
    border: solid #eee;
    border-width: 0 1px;
    color: #666;
    text-align: center;
}
.basketball-scores .head {
    border-top: 1px solid #eee;
    border-bottom: 1px solid #eee;
    border-radius: 6px 6px 0 0;
    clear: both;
    display: inline-block;
    vertical-align: top;
    width: 100%;
    overflow: hidden;
    background-color: #f6f6f6;
}
.basketball-scores .lab {
    float: left;
    height: 30px;
    line-height: 30px;
}
.basketball-scores .ball, .basketball-scores .instant, .basketball-scores .primary {
    border-bottom: 1px solid #eee;
    clear: both;
    display: inline-block;
    vertical-align: top;
    width: 100%;
    overflow: hidden;
    background-color: #fff;
}
.basketball-scores .ball .data, .basketball-scores .instant .data, .basketball-scores .primary .data {
    float: left;
}
.basketball-scores .data .lab {
    border-left: 1px solid #eee;
}
.basketball-scores .data .lab:last-child {
    color: #de1e30;
    font-weight: bold;
}
.basketball-scores .data .lab .score {
    width: 100%;

    float: left;

    overflow: hidden;
    height: 30px;
}
.basketball-scores .data .lab .exponent {
    display: inline-block;
    height: 30px;
}

.basketball-scores .w-82 {
    width: 82px;
}
.basketball-scores .w-199 {
    width: 156px;
}
.basketball-scores .w-200 {
    width: 154px;
}
.basketball-scores .w-271 {
    width: 271px;
}
.basketball-scores .w-272 {
    width: 272px;
}
.basketball-scores .w-1200 {
    width: 1200px;
    margin: 0 auto;
}


.show-related-matches { padding: 15px; border: 1px solid #ededed; border-radius: 6px; }



/* Show Live */
.latest-live { 
	padding: 15px;
	border: 1px solid #ededed;
	border-radius: 6px;
}
.live-item-card { 
	border-color: #ededed;
}
.live-item-card .card-body { 
	padding: 10px 5px;
}
.live-item-cardbody .info { 
	margin-left: 5px;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
}
.live-item-cardbody .info h6 { 
	margin-bottom: 5px;
	font-size: 14px;
	font-weight: 400;
	text-align: justify;
}
.live-item-cardbody .info h6 a { 
	display: block;
	overflow: hidden;
	color: #000!important;
}
.live-item-cardbody .info h6 a:hover { 
	color: #198754!important;
}
.live-item-cardbody .info .meta { 
	font-size: 12px;
	color: #999;
}
.live-item-card .thumb { 
	position: relative;
}
.live-item-card .thumb .photo { 
	height: 131px;
}
.live-item-card .thumb .live-status { 
	position: absolute;
	top: 8px;
	right: 8px;
	z-index: 100;
	padding: 3px 6px;
	background-color: #ff5722;
	border-radius: 0 6px 0 6px;
	color: #FFF;
	font-size: 12px;
	font-weight: 200;
	line-height: 1;
	text-align: center;
	white-space: nowrap;
	vertical-align: baseline;
}
.live-item-card .thumb .live-race { 
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 100;
	background: rgb(0 0 0 / 0%);  /* fallback for old browsers */
	background: -webkit-linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(41 43 40) 100%);
	background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgb(41 43 40) 100%);
}
.live-item-card .thumb .live-race span {
	display: block;
	padding: 5px 10px;
	color: #FFF;
	font-size: 12px;
	font-weight: 400;
}

/* show-live */
.show-live-header { 
	padding: 10px 15px;
	border: 1px solid #ededed;
	border-bottom: 0;
	border-radius: 6px 6px 0 0;
}
.show-live-header .meta { 
	margin-left: 10px;
	padding-top: 4px;
}
.show-live-header .meta h1 { 
	margin-bottom: 5px;
	color: #000;
	font-size: 16px;
}
.show-live-header .meta .info { 
	font-size: 0;
	color: #999;
	line-height: 0;
}
.show-live-header .meta .info span { 
	display: inline-block;
	padding: 0 15px 0 0;
	font-size: 12px;
	line-height: 22px;
}
.show-live-header .meta .info a { 
	color: #000!important;
}

.live-player { 
	background-color: #000;
	border-radius: 0 0 6px 6px;
}
.live-player .dplayer .dplayer-video-wrap video { 
	object-fit: cover;
}
.live-player .dplayer { border-radius: 0 0 6px 6px; }

.relevant-live { 
	padding: 15px;
	border: 1px solid #ededed;
	border-radius: 6px;
}

.duibiao { position: absolute; top: 40px; left: 15px; right: 15px; bottom: 30px; }
.duibiao .inr img { border-radius: 21px; }

/* List News */
.latest-news { 
	padding: 15px;
	border: 1px solid #ededed;
	border-radius: 6px;
}
.list-news-item { 
	padding: 15px 0;
	border-bottom: 1px solid #ededed;
}
.list-news-item:first-child { 
	padding-top: 0;
}
.list-news-item:last-child { 
	padding-bottom: 0;
	border-bottom: 0;
}
.list-news-item .info .label { 
	margin-bottom: 12px;
}
.list-news-item .info .label a { 
	color: #1a8a56!important;
	font-weight: 700;
}
.list-news-item .info .tit { 
	margin-bottom: 10px;
}
.list-news-item .info .tit a { 
	color: #000!important;
}
.list-news-item .info .tit a:hover { 
	color: #198754!important;
}
.list-news-item .info p { 
	margin-bottom: 10px;
}
.list-news-item .info p:last-child { 
	margin-bottom: 0;
}

/* show-news */
.show-news { 
	padding: 15px;
	border: 1px solid #ededed;
	border-radius: 6px;
}
.show-news-header { 
	padding: 25px 0;
	text-align: center;
}
.show-news-header .title { 
	margin-bottom: 20px;
	color: #000;
	font-size: 26px;
}
.show-news-header .show-news-meta span { 
	display: inline-block;
	padding: 0 10px;
}
.show-news-header .show-news-meta a { 
	color: #198754!important;
}
.show-news-content { 
	color: #333;
	font-size: 15px;
	line-height: 26px;
}
.show-news-content img, .show-news-content p img { 
	display: block;
	max-width: 100%;
	margin: 15px auto;
}
.relative-news { 
	padding: 15px;
	border: 1px solid #ededed;
	border-radius: 6px;
}

/* Show Live Chat */
.show-live-chat { height: 100%; padding: 10px 15px 0; overflow: hidden; border: 1px solid #ededed; border-radius: 6px; }
.show-live-chat ul { position: relative; border-bottom: 1px solid #ededed; }
.chat-tab-menu { height: 34px; }
.chat-tab-menu li { padding: 5px 0; text-align: center; }
.chat-tab-menu li.current { position: relative; top: 1px; z-index: 100; border: 1px solid #ededed; border-bottom: 0; background-color:#fff; }
.chat-tab-menu li a { font-size: 14px; color: #000!important; }
.chat-tab-menu li a:hover { border: 0; border-radius: 0; }
.chat-tab-menu li.current a { color: #198754!important; font-weight: 700; }

.chat-tab-item { position: relative; height: 100%; }
.chat-tab-item > div { display: flex; flex-direction: column; height: 100%; }
.live-chat-msg { flex: 1; max-height: 448px; min-height: 280px; overflow-x: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch; padding: 15px 0 0;}
.live-chat-msg .item-msg { margin-bottom: 10px; color: #333; font-size: 14px; }
.live-chat-msg .item-msg span { font-size: 14px; }
.live-chat-msg .item-msg .lv-number { margin-right: 5px; border-radius: 4px; } 
.live-chat-msg .item-msg .name { color: #237b52; }
.live-chat-post { flex: 0 0 auto; height: 60px; padding: 10px 0 5px; border-top: 1px solid #ededed; background-color: #FFFFFF; }

.chat-no-login { position:relative; }
.chat-no-login .tips { position: absolute; top: 10px; left: 0; right: 0; text-align: center; }
.chat-no-login .tips a { color: #000!important; }

/* Expert */
.expert-list .hd ul { border-bottom: 1px solid #ededed; }
.expert-list .hd .nav-tabs .nav-link.active { border-color: #ededed #ededed #FFFFFF #ededed; background-image: linear-gradient(181deg,#198754 56%,#1e665f 100%); color: #FFF!important; }
.expert-item { padding: 15px 0; border-bottom: 1px solid #ededed; }
.expert-item:last-child { border-bottom: 0!important; }
.expert-item .info .name-box .sp1 { color: #000!important; font-size: 18px; }
.expert-item .info .name-box .badge { vertical-align: text-top; }
.expert-item .info .matchess { margin-top: 5px; padding: 5px 0; background-image: linear-gradient(35deg,#e9ffea 60%,#ffffff 100%); }
.expert-item .info .matchess a { color: #000!important; font-size: 16px; }
.expert-item .info .matchess a .sp1 { color: #f44336!important; padding-left: 10px; padding-right: 10px; }
.expert-item .info .matchess a .sp2 { padding-left: 20px; padding-right: 20px; }
.expert-item .other { width: 120px; }
.expert-item .other span { display: block; text-align: right; }
.expert-item .other .sp1 .btn { font-size: 22px; font-weight: 700; font-family: Oswald-Regular; }
.expert-item .other .sp2 .btn { font-size: 12px; }
.expert-item .other span .btn { padding: 0; }

.show-expert { border: 1px solid #ededed; border-radius: 6px; }
.show-expert-header { padding: 15px; }
.show-expert-record,.show-expert-curinfo,.show-expert-content,.relevant-expert-list { padding: 15px; border: 1px solid #ededed; border-radius: 6px; }
.show-expert-header .rg span { display: block; text-align: right; }
.show-expert-header .rg .sp1 { color: #dc3545; font-size: 22px; font-weight: 700; }
.show-expert-header .rg .sp2 { font-size: 12px; }
.show-expert-user-about { border-top: 1px solid #ededed; }
.show-expert-record .hd,.show-expert-curinfo .hd,.show-expert-content .hd { margin-bottom: 15px; color: #333; font-size: 18px; font-weight: 700; }
.show-expert-record .bd span { width: 40px; height: 40px; margin: 0 10px; overflow: hidden; color: #FFF; text-align: center; line-height: 40px; }
.show-expert-curinfo .bd .md { padding: 15px 0; }
.show-expert-curinfo .bd .md .box { color: #333; font-size: 24px; }
.show-expert-curinfo .bd .md .vs { padding-left: 25px; padding-right: 25px; color: #198754; font-size: 38px; }


.show-expert-curinfo .top-info { margin-bottom: 35px; padding: 15px 0 15px; border-bottom: 1px solid #ededed; text-align: center; }
.show-expert-matches-info .bd-info .box .icons { height: 70px; }
.show-expert-matches-info .bd-info .box .icons img { display: block; height: 68px; margin: 0 auto; border-radius: 35px; }
.show-expert-matches-info .bd-info .box .name { padding: 5px 0 0; font-size: 22px; color: #333; }
.show-expert-matches-info .bd-info .vs { padding: 0 75px; font-size: 38px; color: #198754; font-weight: 700; }
.show-expert-curinfo .mb-info { margin-top: 25px; text-align: center; }

.show-expert-body { border: 1px solid #ededed; }
.show-expert-body .lef { width: 60px;  background-color: #198754; color: #FFF; font-size: 18px; text-align: center; }
.show-expert-body .lef span { display: inline-block; margin-top: 18px; writing-mode: vertical-lr; writing-mode: tb-lr; }
.show-expert-body .rig {  font-size: 18px; }
.show-expert-body .rig .host-team, .show-expert-body .rig .visiting-team { width: 50%; height: 100%; color: #000; text-align: center; }
.show-expert-body .rig .host-team { background-color: #e9ffea; }

.show-expert-body .rig .visiting-team { background-color: #e9ffea; }
.show-expert-body .rig .host-team p:first-child, .show-expert-body .rig .visiting-team p:first-child { margin-top: 15px; }
.show-expert-body .rig .rcm { position: relative; overflow:hidden; background-color: #ffc107; }
.show-expert-body .rig .rcm::after {
    content: "推";
    text-align: center;
    background-color: #f2330e;
    width: 90px;
    height: 30px;
    line-height: 30px;
    position: absolute;
    left: -25px;
    top: 5px;
    color: #fff;
    transform: rotate(-45deg);
    font-size: 20px
}

.show-expert-release .lef, .show-expert-release .rig {  }
.show-expert-body .release-no { padding-top: 13px; padding-bottom: 13px; background: url('/images/bg_release.png'); }
.show-expert-body .rig .release-box { width: 35%; margin: 0 auto; }
.release-box .input-group .form-control { height: 42px; }
.release-box .input-group .input-group-text { padding: 0; }
.release-box .get-pass .btn { width: 100%; }
.show-expert-analysis { padding: 15px; background-color: #edf8ee; color: #333; font-size: 14px; line-height: 26px; }
#expert_neirong img, .show-expert-analysis img { display: block; max-width: 100%; height: 100%; margin: 10px auto; }
#host_team_bt, #visiting_team_bt { color: #F00; }


/* Sidebar Kefu */
.suspension { width: 46px; height: 210px; position: fixed; right: 30px; bottom: 60px; z-index: 9999; }
.suspension .consult { display: block; position: relative; width: 46px; height: 46px; background-image: url('/images/headset.png'); 
 background-repeat: no-repeat; background-position: 50% 50%; background-size: 70%; background-color: #198754; }
.suspension .consult .suspension-list { display: none; position: absolute; top: -180px; right: 45px; bottom: 0; width: 190px; z-index: 30;
 overflow: hidden; border: 1px solid #ddd; background-color: #FFF; }

.suspension-list-content { position: absolute; width: 100%; background: #fff; }
.suspension-list ul { margin: 0; }
.suspension-list ul li { width: 100%; padding: 15px 10px; overflow: hidden; border-bottom: 1px solid #ddd; }
.suspension-list-content ul li:last-child { border-bottom: 0; }
.suspension-list-content ul li .icons { float: left; width: 52px; }
.suspension-list-content ul li .txts { width: 100%; margin-left: 62px; color: #000; }
.suspension-list-content ul li .txts h6 { margin: 0 0 5px 0; font-size: 15px; }
.suspension-list-content ul li .txts p { margin: 0; color: #F00; }
.suspension a.consult:hover .suspension-list { display: block !important; }


.suspension .cart { background-image: url('/images/app.png'); display: block; position: relative; width: 46px; height: 46px; 
 margin-top: 10px; border: 1px solid #bcbcbc; background-color: #38C152; background-repeat: no-repeat; background-position: 50% 50%; 
 background-size: 70%; }
.suspension .cart .pic { display: none; position: absolute; top: -120px; left: -129px; bottom: 0; width: 129px; }
.suspension .cart .pic .pic-content { position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; border: 1px solid #ddd; 
 background-color: #FFF; color: #333; text-align: center; }
.suspension .cart .pic .pic-content div { padding: 5px 0; }
.suspension a.cart:hover .pic { display: block; }
.suspension .back-top {
    background-image: url('/images/top-icon.png');
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: 70%;
    display: block;
    width: 46px;
    height: 46px;
    border: 1px solid #bcbcbc;
    background-color: #fff;
    -webkit-transition: all 0s ease-in-out;
    -moz-transition: all 0s ease-in-out;
    -o-transition: all 0s ease-in-out;
    transition: all 0s ease-in-out;
    margin-top: 10px;
}


/* Pages */
.pages { padding: 15px; border: 1px solid #ededed; background-color: #FFF; border-radius: 6px; }
.pages .pagination { display: flex; justify-content: center; align-items: center; margin: 0; }
.pages .pagination li { margin: 0 5px; border: 1px solid #ededed; background-color: #FFF; font-size: 14px; text-align: center; }
.pages .pagination li a { display: block; padding: 5px 12px; color: #333; }
.pages .pagination li.active { background-color: #2b8e64; color: #FFF; }
.pages .pagination li.active a { color: #FFF!important; }

/* Footer */
.footer { 
	padding-top: 40px;
	padding-bottom: 40px;
	background-color: #111111;
	color: #999999;
}
.footer-info { 
	margin-bottom: 15px;
	padding-top: 5px;
}
.footer-info p { 
	margin-bottom: 10px;
}
.footer-logo img { 
	width: 169px;
	height: 44px;
}
.footer-appdown a img { 
	width: 90%;
}
.footer a { 
	color: #999!important;
}

/* Media */

@media (min-width: 768px){}
@media (min-width: 992px) { 
	.navbar-expand-lg {
		padding-top: 0;
		padding-bottom: 0;
	}
	.navbar-expand-lg .navbar-nav .nav-link { 
		position: relative;
		padding: 18px 16px;
		color: #333!important;
		font-size: 16px;
	}
	.navbar-expand-lg .navbar-nav .nav-link.active:after{
		content: "";
		position: absolute;
		left: 50%;
		margin-left: -10px;
		bottom: 0;
		width: 20px;
		height: 4px;
		background: #198754;
		animation: .4s both activeScaleX;
		-webkit-animation: .4s both activeScaleX;
	}
}
@media (min-width: 1200px) {}
@media screen and (min-width: 1440px) {}

@media (max-width: 1140px){
   .top-live-item-body .dw .icons img { 
        width: 36px;
        height: 36px;
    }
    .top-live-item-body .dw .vs {
        min-width: auto;
        font-size: 14px;
    }
    .top-live .card-header:first-child span {
        width: 102px;
        white-space:nowrap;
        overflow:hidden;
        text-overflow:ellipsis;
    }
    .top-news {
        display: none;
    }
   /* #sidebar { display: none; }*/
	.col-3 {
    flex: 0 0 auto;
    width: 100%;
}
}

@media (max-width: 1024px){
    .top-navbar .navbar-toggler {
        padding: 5px;
    }
    .top-navbar .navbar-toggler .navbar-toggler-icon {
        width: 19px;
        height: 19px;
    }
    .navbar-nav .nav-item {
        border-bottom: 1px solid #ededed;
        text-align: center;
    }
    .top-r .text-end {
        text-align: center!important;
    }
    .top-r .dropdown .show {
        left: 45%;
        right: 45%;
    }
    .top-live-item-body .dw .icons div { width: 100%; }
    .hot-tags a, .hot-tags span { width: 100px; margin-bottom: 10px; text-align: center; }
    #latest-match li {
        display: block!important;
        padding-bottom: 0!important;
    }
    #latest-match li .left-info, #latest-match li .middle-info, #latest-match li .right-info {
        width: 100% !important;
    }
    .left-info .icon, .left-info .event {
        width: calc((100% - 125px) / 2); box-sizing: border-box;
    }
    .left-info .time {
        width: 125px;
    }
    .match-item .left-info .event {
        max-width: 100%!important;
        text-align: right!important;
    }
    #latest-match li .left-info {
        padding-bottom: 10px;
    }
    #latest-match li .middle-info {
        padding: 15px 15px;
        border-top: 1px solid #ededed;
        border-bottom: 1px solid #ededed;
    }
    #latest-match li .right-info {
        background-color: #eaffeb;
        text-align: center!important;
    }
    
    .live-item-card .thumb .photo { height: 110px; }

    .expert-item .info .matchess a span {
        font-size: 14px;
    }
    
    .show-expert-body .rig .release-box {
        width: 56%;
    }
    
    .endplayer {
        height: 410px !important;
    }
    .sidebar-jifen { display: none; }
    .sidebar-banner {
        padding: 15px;
        border: 1px solid #ebebeb;
        border-radius: 6px;
        background-color: #FFFFFF;
    }
    .sidebar-banner a img {
        width: 100%;
        height: 100%;
    }
    
    .footer-logo img {
        display: block;
        margin: 0 auto;
    }
    .footer-info {
        text-align: center;
    }
    .footer-appdown {
        justify-content: center !important;
    }
}



/* ----- 分页 ----- */
.pagebar .pagination {
  display: flex;
  justify-content: center;
  margin-top: 10px;
}
.pagination a {
  background: #fff;
  border: 1px solid #ccc;
  color: #333;
  font-size: 14px;
  padding: 2px 6px;
  margin: 0 2px;
  border-radius: 5px;
}
.pagination span {
    color: #333;
    font-size: 14px;
    padding: 4px 2px;
    margin: 0 5px;
    border-radius: 5px;
}
.pagination a:hover {
  color: #2b8e64;
  border: 1px solid #2b8e64;
}
.pagination a.page-num-current {
  color: #fff;
  background: #2b8e64;
  border: 1px solid #2b8e64;
  border-radius: 5px;
}
.tac.text-secondary {
    color: #ccc;
    text-align: center;
}
/* ----- 分页end ----- */