@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600&family=Alice&display=swap');

:root {
	--white-color: #fff;
	--back-color: #f6f6f6;
	--back-parent: rgb(246, 246, 246, .1);
	--dark-color: #212f6c;
	--text-color: #1a313c;
	--second-color: #707070;
	--menu-color: #e7eaee;
	--menu-back-color: #5bc2fc;
	--menu-hover-color: #5bc2fc;
	--stories-back-color: #303f80;
	--story-border-color: #ff0000;
	--progress-back-color: rgb(255, 255, 255, .35);
	--stories-button-back: rgba(0, 0, 0, .25);
	--black-back-back: rgb(0, 0, 0, .1);
	--modal-back-back: rgb(0, 0, 0, .35);
	--footer-text: #636f7d;
	--social-back-color: rgb(99, 111, 125, .5);
	--transparent-black: rgb(0, 0, 0, .05);
	--video-hover-color: #ff0000;
	--dark-blue-color: #212f6c;
	--tg-color: #50b1df;
}
html, body {
	margin: 0;
	padding: 0;
	height: 100%;
}
body {
	font-family: 'Montserrat', sans-serif;
	/* background-color: #ebf0f3; */
	background-color: #fff;
	color: #2a2f37;
}
h1, h2, h3, h4, h5, h6 { font-family: 'Alice', serif }
blockquote {
	border-left: 4px solid #ddd;
	margin-bottom: 5px;
	margin-top: 5px;
	padding-left: 16px;
	font-weight: 400;
}
iframe.ql-video {
	width: 100%;
	height: 420px;
}
.app {
	display: flex;
	flex-direction: column;
	/* min-height: 100%; */
}

.header {
	/* position: fixed; */
	z-index: 99;
	display: flex;
	width: 100%;
	flex-direction: column;
	background-color: #fff;
	/* border-bottom: 1px solid #dee3e8; */
}
#home .header { border-bottom: 0 solid transparent2 } 
.header>div { padding: 0 25px }

.header .top_menu_wrap {
    top: 0;
    left: 0;
    right: 0;
    position: fixed;
    z-index: 10;
}
.header .main_menu_wrap {
    display: flex;
	background-color: #2a2f37;
	width: 100%;
}
.header .menu_bar {
	 display: flex;
	 justify-content: center;
	 align-items: center;
}
.header .menu_bar a {
    padding: 15px;
    text-decoration: none;
    color: rgb(255, 255, 255, .75);
	font-size: 14px;
    font-weight: 500;
}
.header .menu_bar img { max-width: 200px }
.header .main_menu_wrap .menu_bar a:hover,
.header .main_menu_wrap .menu_bar a.active {
	color: rgb(255, 255, 255);
}
.header .main_menu_wrap>.menu_bar { background-color: #2a2f37 }

.header .second_menu_wrap {
    display: flex;
    background-color: #fff;
    border-top: 1px solid #dee3e8;
    border-bottom: 1px solid #dee3e8;
	width: 100%;
}
.header .second_menu_wrap .menu_bar:hover a { color: rgb(42, 47, 55, .5) }
.header .second_menu_wrap .menu_bar a { color: rgb(42, 47, 55) }
.header .second_menu_wrap .menu_bar a:hover { color: rgb(42, 47, 55) }

.header .app_logo_bar {
	position: relative;
	display: flex;
	padding: 15px;
}
.header .app_logo_bar > div {
	flex: 0 0 25%;
	display: flex;
	align-items: center;
	justify-content: center;
}
.header .app_logo_bar .language_bar { flex: 0 0 5% }
.header .app_logo_bar .language_bar {
	align-items: flex-start;
	flex-direction: column;
}
.header .app_logo_bar .language_bar a {
    text-decoration: none;
    color: #4c4c4c;
    font-size: 14px;
	border-bottom: 1px dotted transparent;
}
.header .app_logo_bar .language_bar a.current {
    color: #1c2548;
    font-weight: 500;
    font-size: 16px;
}
.header .app_logo_bar .language_bar a:hover { border-bottom: 1px dotted }
.header .app_logo_bar > a{
	flex: 1;
    text-align: center;
}
.header .app_logo_bar a img { max-height: 65px }
.header .app_logo_bar a:hover { opacity: 1 }

.header .app_logo_bar .search_bar {
    align-items: center;
    justify-content: flex-end;
    padding-right: 15px;
}
.header .app_logo_bar .search_box {
	display: flex;
    align-items: center;
}
.header .app_logo_bar .search_box .search_val {
	display: flex;
	align-items: center;
	padding: 0 10px;
	background-color: #e4e9ed;
	border-radius: 5px;
	overflow: hidden;
	height: 32px;
}
.header .app_logo_bar .search_box .search_val i {
	font-size: 20px;
	color: #2a2f37;
	margin-right: 10px;
}
.header .app_logo_bar .search_box .search_val input {
	background-color: transparent;
	color: #2a2f37;
	border: none;
	outline: none;
	font-size: 20px;
	font-weight: 500;
	box-sizing: border-box;
}
.header .app_logo_bar .search_bar .search_box button {
	background-color: #353a41;
	color: #f3f5f7;
	border: none;
	outline: none;
	height: 32px;
	line-height: 34px;
	border-radius: 5px;
	padding: 0 25px;
	margin-left: 5px;
	cursor: pointer;
}
.header .app_logo_bar .search_bar .search_box button:hover {
	color: #353a41;
	background-color: #e4e9ed;
}
.header .app_logo_bar .search_bar .live_url { display: none }

.stories {
	padding: 15px 0;
	border-top: 0 solid var(--black-back-back);
}
.stories.back { padding-top: 370px }

.stories_wrap {
	display: grid;
	grid-template-columns: auto 1fr auto;
	gap: 1px;
}
.stories_nav {
	display: flex;
	display: none;
	align-items: center;
	padding: 0 10px;
}
.stories_nav button {
	overflow: hidden;
	border-radius: 50%;
	width: 40px;
	height: 40px;
	background-color: var(--stories-button-back);
	background-image: url(/static/images/icons/ic_arrow.svg);
	background-repeat: no-repeat;
	background-position: center;
	opacity: .5;
	cursor: pointer;
}
.stories_nav button:hover { opacity: .75 }
.stories_nav button.prev { transform: rotate(180deg) }

.stories_boxes {
	display: flex;
	gap: 5px;
	flex-wrap: nowrap;
	touch-action: auto;
	overflow-x: auto;
	overflow-y: hidden;
	position: relative;
	scroll-behavior: smooth;
	scrollbar-width: none;
}
.story_box {
	display: grid;
	gap: 5px;
	color: var(--text-color);
	font-size: 12px;
	cursor: pointer;
    border: 0;
    background-color: transparent;
	background-color: var(--white-color);
	border-radius: 15px;
	max-width: 95px;
}
.story_img {
	display: flex;
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	overflow: hidden;
	border-radius: 50%;
	width: 75px;
	height: 75px;
	margin-top: 2px;
	border: 2px solid var(--white-color);
	box-shadow: 0 0 0 2px var(--story-border-color);
}

.stories_view_html { display: none }
.stories_view_wrap {
	display: flex;
	position: fixed;
	top: 50%;
	transform: translateY(-50%);
	left: 0;
	right: 0;
	margin: 0 auto;
	overflow: hidden;
	width: 540px;
	height: 960px;
	max-height: 100%;
	/* 
	width: 360px;
	height: 640px;
	*/
}
.stories_view_boxes {
	display: flex;
}
.stories_view {
    display: grid;
    align-items: start;
	width: 540px;
	/* width: 360px; */
    aspect-ratio: 1080 / 1920;
    background-color: #efefef;
    background-size: cover;
    background-repeat: no-repeat;
	background-position: center;
}
.story_header {
	display: grid;
	position: relative;
	padding-bottom: 35px;
}
.story_header:after {
	content: '';
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background-image: linear-gradient(180deg, rgba(38, 38, 38, .8) 0%, rgba(38, 38, 38, 0) 100%);
	z-index: 1;
}
.story_progress {
	display: flex;
	gap: 5px;
	padding: 20px 16px 10px;
	z-index: 2;
}
.progress_bar {
	flex: 1;
	position: relative;
	border-radius: 16px;
	height: 5px;
	background-color: var(--progress-back-color);
	overflow: hidden;
}
.progress_bar i {
	display: block;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	width: 0;
	border-radius: 16px;
	background-color: var(--white-color);
	transition: none;
}
.progress_bar.current i {
	width: 100%;
	transition: 5s;
}
.progress_bar.viewed i { width: 100% }

.progress_bar img { display: none }
.story_info {
	display: grid;
	grid-template-columns: 1fr auto;
	gap: 10px;
	padding: 15px;
	color: var(--white-color);
	font-weight: 600;
	z-index: 2;
}
.story_info .story_author {
	display: grid;
	grid-template-columns: auto 1fr;
	align-items: center;
	gap: 10px;
}
.story_info .story_author_img {
	border-radius: 50%;
	width: 32px;
	height: 32px;
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
}
body.modal .modal_back .story_info .close {
	position: relative;
	top: auto;
	right: auto;
}
body.modal { overflow: hidden }
body.modal .modal_back .close {
	position: absolute;
	top: -12px;
	right: -12px;
	z-index: 12;
	border-radius: 50%;
	background-size: 65%;
	background-color: var(--white-color);
	border: 1px solid var(--transparent-black);
	cursor: pointer;
}
body.modal .modal_back .close:hover { background-color: rgb(255, 255, 255, .5) }
body.modal .modal_back { display: grid }
.modal_back {
	display: none;
	position: absolute;
	inset: 0;
	height: 100%;
	z-index: 999;
	background-color: var(--modal-back-back);
}
.ic_close {
    background-image: url(/static/images/ic_close.svg);
}
.icon {
    display: block;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}
.ic_32 {
    width: 32px;
    height: 32px;
}
.content {
	flex: 1;
	display: flex;
	flex-direction: column;
	position: relative;
}
.content>iframe {
	min-height: 100%;
	height: 100%;
	min-width: 100%;
	width: 1px;
	position: absolute;
	z-index: 1;
	cursor: pointer;
}

.partners {
    padding: 25px 0;
    background-color: #f6f6f6;
	z-index: 9999;
}
.partners .container { background-color: #f6f6f6 }
.partners .partner_wrap {
    display: flex;
    justify-content: center;
	flex-wrap: wrap;
}
.partners a {
    flex: 0 0 12.5%;
    display: flex;
    align-items: center;
    background-color: #fff;
    margin: 5px;
    padding: 25px;
    border: 1px solid #e8e8e8;
    text-decoration: none;
    border-radius: 10px;
    transition: all .3s ease-in-out;
}
.partners a:hover { box-shadow: 0px 0px 30px 1px rgba(0, 0, 0, .06) }
.partners a img { max-width: 100% }

.footer {
	padding: 25px 35px;
	border-top: 1px solid rgb(255, 255, 255, .1);
	background-color: #2a2f37;
	z-index: 9999;
}
.footer>div {
	display: flex;
	background-color: #2a2f37;
}
.footer .social_icons {
	flex: 0 0 50%;
	display: flex;
	align-items: center;
	background-color: #2a2f37;
}
.footer .social_icons>a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    font-size: 20px;
    text-decoration: none;
    color: rgb(255, 255, 255, .75);
    background-color: #353a41;
    border-radius: 5px;
    margin-right: 15px;
    cursor: pointer;
}
.footer .social_icons>a:hover { background-color: #55595f }
.footer .site_info {
	flex: 1;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-end;
	background-color: #2a2f37;
}
.footer .site_info p {
    margin: 0;
    font-size: 14px;
    display: flex;
    align-items: center;
}
.footer .site_info a {
	margin: 0 10px;
	font-weight: 400;
	font-size: 12px;
}
.footer .site_info a:last-child { margin-right: 0 }
.footer .site_info a:hover { opacity: 1 }
.footer .site_info p b { font-size: 8px }
.footer .site_info * {
	color: #fff;
	opacity: .5;
}

.page_pagination { width: 100% }
.pagination {
	display: flex;
	justify-content: center;
	list-style: none;
}
.page-link:hover,
.page-item.active .page-link { background-color: #f3f5f7 }
.page-link {
	border-radius: 3px;
	color: #2a2f37;
	font-weight: 500;
	padding: 0 5px;
	transition: none;
	text-decoration: none;
	cursor: pointer;
	margin-bottom: 0!important;
	line-height: normal!important;
	letter-spacing: normal!important;
}

/* басты бет */
.header_news {
	display: flex;
	padding: 25px 0;
	gap: 15px;
    background-color: var(--back-color);
    border-top-right-radius: 15px;
    border-top-left-radius: 15px;
    padding: 15px;
}
.header_news .main_news {
	flex: 0 0 25%;
	display: flex;
	flex-direction: column;
}
.header_news .main_news h3 {
    font-family: 'Montserrat', sans-serif;
    margin: 0;
    padding-bottom: 15px;
    border-bottom: 1px solid #dee3e8;
}
.header_news .main_news .main_news_list:hover a { opacity: .65 }
.header_news .main_news .main_news_list a:hover { opacity: 1 }
.header_news .main_news .main_news_list a {
	text-decoration: none;
	color: #000;
	font-size: 15px;
	letter-spacing: .3px;
	line-height: 1.2em;
	transition: color .5s ease;
	min-height: 115px;
	border-bottom: 1px solid #dee3e8;
	display: flex;
	justify-content: center;
	flex-direction: column;
}
.header_news .main_news .main_news_list a p {
	display: flex;
	align-items: center;
	margin: 0;
}
.header_news .main_news .main_news_list a p.news_info { margin: 5px 0 }
.header_news .main_news .main_news_list a p strong {
	margin: 0 10px;
	font-size: 20px;
}

.header_news .slider_news a:hover { filter: brightness(102%) }
.header_news .slider_news {
	flex: 1;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.header_news .slider_news a {
    flex: 1 0 auto;
	max-width: 33%;
    display: flex;
    flex-direction: column;
    text-decoration: none;
    color: #000;
	font-size: 15px;
    letter-spacing: .3px;
    line-height: 1.2em;
	margin-bottom: 5px;
}
.header_news .slider_news a img {
	width: 100%;
	border-radius: 10px;
}
.header_news .slider_news a p {
	display: flex;
	align-items: center;
	margin: 0;
}
.header_news .slider_news a p.news_info { margin: 15px 0 5px }
.header_news .slider_news a p strong {
	margin: 0 10px;
	font-size: 20px;
}

.header_news .slider_news a:first-child {
	max-width: 100%;
	position: relative;
    border-radius: 10px;
    overflow: hidden;
}
.header_news .slider_news a:first-child:before {
    content: "";
    display: block;
    position: absolute;
    z-index: 1;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    background-image: -webkit-gradient(linear, left bottom, left top, color-stop(10%, rgba(0, 0, 0, 0.74)), color-stop(20%, rgba(0, 0, 0, 0.66)), color-stop(40%, rgba(0, 0, 0, 0)));
    background-image: linear-gradient(to top, rgba(0, 0, 0, 0.74) 10%, rgba(0, 0, 0, 0.66) 20%, rgba(0, 0, 0, 0) 40%);
}
.header_news .slider_news a:first-child .news_meta .news_title {
	font-size: 28px;
	font-weight: bold;
	line-height: 1;
}
.header_news .slider_news a:first-child .news_meta {
	position: absolute;
    bottom: 20px;
    left: 30px;
    right: 40%;
    z-index: 10;
	color: #fff;
}
.header_news .slider_news a:first-child  p.news_info { color: #fff }
/* басты бет */

.middle_wrap {
	display: flex;
	padding: 25px 15px;
	background-color: var(--back-color);
}
.middle_wrap .left_box {
    flex: 0 0 25%;
    display: flex;
    flex-direction: column;
}
.middle_wrap .regular_news {
    flex: 1;
    padding: 0 25px;
    display: flex;
	flex-direction: column;
}
.middle_wrap .regular_news a {
	display: flex;
	text-decoration: none;
	color: #000;
	margin-bottom: 15px;
}
.middle_wrap .regular_news a .news_image {
	flex: 0 0 25%;
	position: relative;
}
.middle_wrap .regular_news a .news_image span {
	position: absolute;
	top: 0;
	left: 0;
	padding: 2px 5px;
	color: #fff;
	background-color: var(--dark-color);
	font-size: 14px;
	border-radius: 3px;
}
.middle_wrap .regular_news a .news_image img {
	max-width: 100%;
	border-radius: 5px;
}
.middle_wrap .regular_news a p {
	display: flex;
	align-items: center;
	padding: 0 15px;
	margin: 0;
}
.middle_wrap .regular_news a p strong {
	margin: 0 10px;
	font-size: 20px;
}
.middle_wrap .regular_news a .news_title {
	font-size: 18px;
	font-weight: 500;
}
p.news_info {
	display: flex;
	color: #4c4c4c;
	font-size: 13px;
}

/* Категорияның жаңалықтары */
.category_news {
	display: flex;
	flex-wrap: wrap;
	padding: 15px 0 25px;
}
.category_news a div { padding: 0 10px }
.category_news a {
    flex: 1 0 auto;
	max-width: 33%;
    display: flex;
    flex-direction: column;
    text-decoration: none;
    color: #000;
	font-size: 15px;
    letter-spacing: .3px;
    line-height: 1.2em;
	margin-bottom: 25px;
}
.category_news a img {
	width: 100%;
	border-radius: 10px;
}
.category_news a p {
	display: flex;
	align-items: center;
	margin: 0;
}
.category_news a p.news_info { margin: 15px 0 5px }
.category_news a p strong {
	margin: 0 10px;
	font-size: 20px;
}
/* Категорияның жаңалықтары */

.single_news {
	display: flex;
	padding: 25px 0;
}
.single_news .news_box {
    flex: 1;
    padding: 0 25px;
    display: flex;
	flex-direction: column;
}
.single_news .news_box .time_ago {
	font-size: 14px;
	margin: 25px 0 5px;
}
.single_news .news_box .news_authors { margin: 0 10px 10px 0 }
.single_news .news_box .news_authors a {
	display: flex;
	align-items: center;
	font-size: 14px;
	font-weight: 600;
	color: #0072b8;
}
.single_news .news_box .news_authors a img {
	max-height: 32px;
	margin-right: 5px;
	border-radius: 7px;
}
.single_news .news_box .news_title {
    color: #2a2f37;
    font-weight: 500;
    font-size: 32px;
	margin: 0 0 25px;
}
.single_news .news_box .news_image img {
	width: 100%;
	max-width: 100%;
	border-radius: 10px;
}
.single_news .news_box .news_image .image_description {
	font-size: 14px;
	color: #4c4c4c;
	margin-top: 0;
}
.single_news .news_box .news_content {
    color: #2a2f37;
    font-weight: 300;
    font-size: 18px;
	margin: 0 0 15px;
}
.single_news .news_box .news_content iframe { max-width: 100% }
.single_news .news_box .news_content img {
	max-width: 100%;
	border-radius: 5px;
}
.single_news .news_box .news_content a {
	text-decoration: none;
    color: #0072b8;
}
.single_news .news_box .news_content a:hover {
	color: #4196ff;
	border-bottom: 1px dotted;
}

.single_news .news_box .news_tags {
	display: flex;
}
.single_news .news_box .news_tags a {
	text-decoration: none;
	font-size: 14px;
	background-color: rgb(0, 114, 184, .05);
    color: #0072b8;
	border: 1px solid #0072b8;
	border-radius: 15px;
	padding: 2px 10px;
	margin: 5px;
}

.single_news .more_news {
	display: flex;
	flex-wrap: wrap;
	padding: 15px 0 25px;
}
.single_news .more_news a div { padding: 0 10px }
.single_news .more_news a {
    flex: 1 0 auto;
	max-width: 33%;
    display: flex;
    flex-direction: column;
    text-decoration: none;
    color: #000;
	font-size: 15px;
    letter-spacing: .3px;
    line-height: 1.2em;
	margin-bottom: 25px;
}
.single_news .more_news a img {
	width: 100%;
	border-radius: 10px;
}
.single_news .more_news a p {
	display: flex;
	align-items: center;
	margin: 0;
}
.single_news .more_news a p.news_info { margin: 15px 0 5px }
.single_news .more_news a p strong {
	margin: 0 10px;
	font-size: 20px;
}
.single_news .right_box {
    flex: 0 0 25%;
    display: flex;
    flex-direction: column;
}

.banner_img img { max-width: 100% }
.breadcrumb {
	display: flex;
	align-items: center;
}
.breadcrumb i { }
.breadcrumb a {
	font-family: 'Alice', serif;
	font-weight: 400;
	text-decoration: none;
    color: #0072b8;
}
.breadcrumb a:hover { color: #4196ff }
.section_title {
    font-family: 'Montserrat', sans-serif;
    margin: 0;
    padding: 25px 10px 0;
}
.container {
	background-color: #fff;
	width: 100%;
	margin: 0 auto;
	/* padding: 0 15px; */
	z-index: 2;
}

.error_shape {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 404px;
    height: 404px;
    margin: 35px auto;
    border-radius: 50%;
    background-color: #f3f3f1;
    font-size: 102px;
    color: #555;
}
.error_content {
	font-size: 16px;
	text-align: center
}

.sidebar_menu { display: none }
.burger_button { display: none!important }
.sharethis-inline-share-buttons { margin: 15px 0 }

.league_tab { position: relative }
.league_tab:hover .current_league {
	color: var(--dark-color);
	border-color: rgba(0, 0, 0, .25);
}
.league_tab:hover .current_league path { stroke: rgb(0, 0, 0, .5) }
.league_tab.open .current_league path { stroke: var(--dark-color) }
.league_tab.open .current_league { border-color: var(--dark-color) }
.league_tab .current_league {
	display: grid;
	grid-template-columns: 1fr auto;
	gap: 5px;
	color: var(--text-color);
	border: 1px solid rgb(0, 0, 0, .05);
	border-radius: 8px;
	padding: 8px 16px;
	cursor: pointer;
}
.league_tab .current_league svg { transition: all .15s ease-in-out }
.league_tab.open .current_league svg { transform: rotate(180deg) }
.league_tab.open .league_list {
	opacity: 1;
	pointer-events: auto;
	transform: scale(1) translateY(0);
}
.league_tab .current_league path { stroke: var(--stories-button-back) }

.league_tab .league_list {
	position: absolute;
	display: grid;
	opacity: 0;
	overflow: hidden;
	padding: 0;
	pointer-events: none;
	top: 100%;
	left: 0;
	width: 100%;
	background-color: #fff;
	border-radius: 15px;
	border-top-left-radius: 0;
	box-shadow: 0px 5px 10px 2px rgb(34, 60, 80, .2);
	overflow: hidden;
	transform-origin: 50% 0;
	transform: scale(.75) translateY(-21px);
	transition: all .2s cubic-bezier(.5, 0, 0, 1.25), opacity .15s ease-out;
	z-index: 9;
}
.league_tab .btn_league {
	display: grid;
	align-content: center;
	justify-content: start;
	background-color: transparent;
	text-align: left;
	padding: 10px 15px;
	outline: none;
	border: 0;
}
.league_tab .btn_league:hover { background-color: var(--transparent-black) }
.league_tab .btn_league.current { font-weight: 600 }
.league_tab .btn_league:first-child { padding-top: 15px }
.league_tab .btn_league:last-child { padding-bottom: 15px }

.league_table_wrap {
	display: grid;
	gap: 10px;
	position: relative;
}
.league_table {
	display: none;
	transition: all .2s cubic-bezier(.5, 0, 0, 1.25), opacity .15s ease-out;
	margin: 15px 0;
}
.league_table.current { display: grid }
.table_header.table_row {
	font-size: 10px;
	color: var(--second-color);
	border-bottom: 1px solid var(--stories-button-back);
	opacity: 1;
}
.short_table .table_row { grid-template-columns: 20px 1fr 42px }
.short_table .table_row .hide { display: none }
.table_row {
	display: grid;
	gap: 5px;
	grid-template-columns: 10px 8fr 2fr 2fr 2fr 2fr 2fr 2fr;
	padding: 5px 0;
	cursor: pointer;
	border-bottom: 1px solid var(--transparent-black);
	opacity: .8;
}
.table_row:hover { opacity: 1 }
.table_row img {
	width: 18px;
	border-radius: 5px;
}
.table_row .team_name {
    display: flex;
    gap: 5px;
    align-items: center;
}
.table_row .score_count { font-weight: 500 }
.table_row .center { text-align: center }

.live_url {
	padding: 1px 5px;
	border-radius: 3px;
	background-color: #e46a76;
	color: #fff!important;
	display: flex;
	align-items: center;
	position: relative;
	height: 0;
}
.live_url i { margin-left: 5px }
.live_box.mobile { display: none }
.live_items {
	padding-top: 25px;
	display: grid;
	gap: 10px;
}
.live_match {
	display: grid;
	grid-template-columns: 200px 40px 125px 40px 200px;
	gap: 10px;
	align-items: center;
	text-decoration: none;
	color: #333;
	font-weight: 600;
	font-size: 18px;
	border-radius: 15px;
	width: max-content;
}
.team_name:first-child { text-align: right }
.live_match:hover { background-color: rgb(0, 0, 0, .05) }
.live_match .match_time {
	font-size: 16px;
	text-align: center;
}
.live_match img {
	height: 40px;
	border-radius: 12px;
	border: 1px solid rgb(0, 0, 0, .05);
}

.live_box {
	position: absolute;
	top: 0;
	right: 10%;
	display: flex;
	gap: 35px;
	border: 1px solid rgb(0, 0, 0, .05);
	background-color: #5bc2fc;
	border-radius: 5px;
	padding: 15px;
}
.live_info {
	display: grid;
	gap: 5px;
}
.live_box .box_close {
	position: absolute;
	right: 5px;
	top: 5px;
	cursor: pointer;
}
.team_box {
	display: flex;
	gap: 5px;
	align-items: center;
	font-weight: 600;
	color: #212f6c;
}
.live_watch a {
	border-radius: 5px;
	background-color: #0072b8;
	color: #fff;
	padding: 5px 15px;
	text-decoration: none;
	text-transform: uppercase;
	font-size: 14px;
	font-weight: 500;
}
.live_box img {
	max-width: 32px;
	border-radius: 50%;
}

.quest {
	font-size: 22px;
	margin: 0;
}
.answer_box {
	display: grid;
	gap: 5px;
	padding: 15px 0;
}
.answer_val {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 5px;
	font-size: 18px;
	font-weight: 500;
}
.answer_val input {
	width: 18px;
	height: 18px;
	cursor: pointer;
}
.answer_val label:hover {
	color: var(--dark-blue-color);
	cursor: pointer;
}
.btn:hover {
	background-color: var(--dark-blue-color);
	color: var(--white-color);
}
.btn {
	margin-top: 10px;
	display: flex;
	gap: 5px;
	cursor: pointer;
	text-decoration: none;
	transition: .5s;
	font-weight: 500;
	justify-content: center;
	border-radius: 8px;
	padding: 8px 15px;
	color: var(--dark-blue-color);
	border: 1px solid var(--dark-blue-color);
	background-color: var(--white-color);
	outline: 0;
	font-size: 18px;
}

.answer_res {
	display: grid;
}
.answer_data {
	display: grid;
	grid-template-columns: 16px 1fr 50px;
	gap: 10px;
	position: relative;
	overflow: hidden;
	border-radius: 15px;
	padding: 5px 10px;
	background-color: rgb(28, 37, 72, .05);
	color: rgb(28, 37, 72);
	font-weight: 500;
}
.answer_data i {
	display: flex;
	width: 16px;
	height: 16px;
	background-color: var(--dark-parent);
	border: 2px solid var(--dark-color);
	border-radius: 50%;
}
.current i { background-color: rgb(255, 255, 255) }
.answer_bar {
	position: absolute;
	top: 0;
	left: 0;
	border-radius: 15px;
	height: 100%;
	background-color: rgb(28, 37, 72, .15);
}

.tb_box {
	display: grid;
	gap: 15px;
	padding: 15px;
	color: #fff;
	background: var(--tg-color) url(/static/images/tg_icon.png) no-repeat right bottom / 120px;
	border-radius: 3px;
}
.tb_box h4 {
	font: 500 18px 'Montserrat';
	margin: 0;
}
.tb_box p {
	font-size: 14px;;
	max-width: 75%;
	margin: 0;
}
.tb_box a {
	display: flex;
	gap: 5px;
	align-items: center;
	max-width: max-content;
	padding: 5px;
	background-color: #fff;
	color: var(--tg-color);
	font-size: 14px;
	font-weight: 500;
	text-decoration: none;
	border-radius: 3px;
}

.video_wrap {
    display: grid;
	gap: 15px;
    padding: 25px 15px;
    background-color: #2a2f37;
	color: #fff;
}
.video_wrap h3 {
	display: flex;
	gap: 10px;
	font: 500 24px 'Montserrat';
	align-items: center;
	margin: 0;
}
.video_wrap h3 img { max-width: 24px }
.video_box {
    display: grid;
	grid-template-columns: 6fr 4fr;
	gap: 15px;
}
.video_iframe {
	overflow: hidden;
	border-radius: 10px;
}
.video_iframe iframe {
    width: 100%;
    aspect-ratio: 6 / 4;
}
.video_list {
    display: flex;
    flex-direction: column;
	gap: 10px;
}
.video_list a {
    display: grid;
	grid-template-columns: 35fr 75fr;
	gap: 10px;
	align-items: center;
	cursor: pointer;
}
.video_list a:hover { color: rgb(99, 214, 244) }
.video_list img {
	max-width: 100%;
	border-radius: 5px;
}
.video_list textarea { display: none }

.header .app_logo_bar .mobile_block,
.mobile_block { display: none }
@media only screen and (max-width: 768px) {
	.social_icons a {
	    padding: 15px;
	    text-decoration: none;
	    color: rgb(255, 255, 255, .75);
	    font-size: 14px;
	    font-weight: 500;
	}
	.header .app_logo_bar .mobile_block,
	.mobile_block { display: flex }
	.stories {
		padding: 15px 0;
		padding-top: 20px;
	}
	.stories.back { padding-top: 20px }
	.back_banner { display: none }
	.stories_wrap { grid-template-columns: 1fr }
	.stories_boxes { justify-content: center }
	.stories_nav { display: none }
	.stories_view_wrap {
		max-width: 100%;
		max-height: 100%;
		width: 100%;
	}
	.container { padding: 0 }
	.content { position: unset; margin-top: 15px; }
	.content>iframe {
	    position: fixed;
	    top: 0;
	    z-index: 3;
	}
	.content>iframe.mobile_hide { display: none }
	.header { position: relative }
	.header>div { padding: 0 }
	.header .main_menu_wrap { display: none }
	.header .second_menu_wrap { display: none }
	.header .app_logo_bar {
		display: grid;
		grid-template-columns: auto auto 1fr;
		align-items: center;
		padding: 15px 0;
		background-color: #2a2f37;
	}
	.header .app_logo_bar .language_bar {
	    flex: 0 0 10%;
	    padding-left: 25px;
	}
	.header .app_logo_bar a img { max-height: 45px }
	.header .app_logo_bar .search_bar {
	    padding-right: 0;
	    justify-content: center;
		max-width: 90%;
		margin: 10px auto;
		flex-direction: column;
	}
	.header .app_logo_bar .search_box .search_val i { display: none }
	.header .app_logo_bar .search_bar .live_url {
	    display: flex;
	    height: auto;
	    margin-left: 10px;
	    text-decoration: none;
		margin-top: 15px;
	    padding: 5px 40px;
	}
	.header_news {
		flex-direction: column-reverse;
		padding: 0;
	}
	.header_news .slider_news { padding: 0 15px }
	.header_news .slider_news a {
		position: relative;
		max-width: 100%;
	    border-radius: 5px;
	    overflow: hidden;
	}
	.header_news .slider_news a:before {
	    content: "";
	    display: block;
	    position: absolute;
	    z-index: 1;
	    left: 0;
	    top: 0;
	    bottom: 0;
	    right: 0;
	    background-image: -webkit-gradient(linear, left bottom, left top, color-stop(10%, rgba(0, 0, 0, 0.74)), color-stop(20%, rgba(0, 0, 0, 0.66)), color-stop(40%, rgba(0, 0, 0, 0)));
	    background-image: linear-gradient(to top, rgba(0, 0, 0, 0.74) 10%, rgba(0, 0, 0, 0.66) 20%, rgba(0, 0, 0, 0) 40%);
	}
	.header_news .slider_news a:first-child .news_meta,
	.header_news .slider_news a .news_meta {
		position: absolute;
		bottom: 20px;
	    left: 10px;
	    right: 10px;
		z-index: 10;
		color: #fff;
	}
	.header_news .slider_news a p.news_info { color: #fff }
	.header_news .slider_news a:first-child .news_meta .news_title { font-size: 16px }
	.header_news .main_news { padding: 15px }
	.header_news .main_news .main_news_list a {
	    min-height: auto;
	    padding: 10px 0;
	}
	.middle_wrap .regular_news { padding: 0 15px }
	.middle_wrap {
		display: block;
		padding: 15px 0 0;
	}
	.middle_wrap .left_box  { padding: 0 15px }
	.middle_wrap .regular_news a p { font-size: 12px }
	.middle_wrap .regular_news a .news_title {
		font-size: 14px;
	    font-weight: 400;
	    letter-spacing: -.5px;
	}
	.middle_wrap .regular_news a .news_image { flex: 0 0 35% }
	.footer { margin-top: 0 }
	.footer>div { flex-direction: column }
	.footer .social_icons {
		flex: 1;
		justify-content: center;
	}
	.footer .site_info {
		text-align: center;
		margin-top: 15px;
	}
	.footer .site_info  p {
		margin-top: 10px;
		width: 100%;
		justify-content: center;
	}
	.category_news a { max-width: 100% }
	.single_news { padding: 0 }
	.single_news .right_box { display: none }
	.single_news .news_box .time_ago { margin-top: 0 }
	.single_news .news_box { padding: 0 15px }
	.single_news .news_box .news_title {
		font-size: 18px;
		margin-bottom: 15px;
	}
	.sharethis-inline-share-buttons { margin: 5px 0 }
	.banner_img  { margin: 15px 0 0 }

	.single_news .more_news a {
		max-width: 100%;
		flex-direction: row;
	}
	.single_news .more_news a div { padding: 0 }
	.single_news .more_news a div.news_meta { padding-left: 10px }
	.single_news .more_news a .news_image { flex: 0 0 35% }
	.single_news .news_box .news_image img { border-radius: 5px }
	.single_news .more_news a p.news_info { margin: 0 }
	.single_news .more_news a p:last-child {
	    font-size: 14px;
	    letter-spacing: -.3px;
		line-height: 1.35;
	}
	.single_news .more_news { padding: 15px 0 0 }

	.sidebar_overlay {
		position: fixed;
		z-index: 20;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		opacity: 0;
		transition: 0.5s;
		display: none;
		background-color: rgb(0, 0, 0, .7);
	}
	.sidebar_menu {
		position: fixed;
		z-index: 100000;
		height: 100%;
		width: 0;
		top: 0;
		right: 0;
		background-color: #f8f9fb;
		overflow-x: hidden;
		transition: .2s;
	    flex-direction: column;
		display: flex;
		padding-top: 25px;
	}
	.sidebar_menu a {
	    white-space: nowrap;
	    padding: 10px 20px;
	    text-decoration: none;
	    color: #333;
	    font-weight: 700;
	    display: flex;
	    align-items: center;
	    text-transform: uppercase;
	    font-size: .9em;
	}
	.sidebar_menu a.current { background-color: #eee }
	.sidebar_menu a i {
	    font-size: 1.5em;
	    width: 54px;
	    text-align: center;
	    margin-right: 10px;
	}
	.menu_open { overflow: hidden }
	.menu_open .sidebar_menu {
		display: flex;
		opacity: 1;
		width: 80%
	}
	.menu_open .sidebar_overlay {
		display: block;
		opacity: 1;
	}
	.burger_button {
		flex: 0 0 10%!important;
		padding-right: 25px;
	    display: flex!important;
		align-items: center;
		justify-items: center;
	    border: none;
	    background: none;
	    outline: none;
	    height: max-content;
		font-size: 32px;
		color: #fff;
	}
	.burger_button:focus { outline: none }
	.burger_button.close {
		opacity: 0;
		position: absolute;
		top: 25px;
		right: 0;
	    transition-duration: .1s;
	}
	.menu_open .burger_button.close { opacity: 1 }
	.live_box.mobile {
		display: flex;
		position: fixed;
		top: unset;
		bottom: 0;
		left: 0;
		right: 0;
		z-index: 9;
	}
	.live_box.mobile .live_info { flex: 1 }
	.live_watch {
		display: flex;
		align-items: center;
	}
	.header .app_logo_bar > div.live_box.desktop { display: none }
	.video_box { grid-template-columns: auto }
}
@media (min-width: 576px) {
	.container { max-width: 540px }
}
@media (min-width: 768px) {
	.container { max-width: 720px }
}
@media (min-width: 992px) {
	.container { max-width: 960px }
}
@media (min-width: 1200px) {
	.container { max-width: 1080px }
}
@media (min-width: 1400px) {
	.container { max-width: 1080px }
}
.r41589 a,
.r41591 a { max-width: none!important }