@font-face {
	font-family: 'Raleway';
	src: url('/static/fonts/Raleway/Raleway_300.woff2') format('woff2');
	font-weight: 300;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Raleway';
	src: url('/static/fonts/Raleway/Raleway_400.woff2') format('woff2');
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Raleway';
	src: url('/static/fonts/Raleway/Raleway_500.woff2') format('woff2');
	font-weight: 500;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Raleway';
	src: url('/static/fonts/Raleway/Raleway_600.woff2') format('woff2');
	font-weight: 600;
	font-style: bold;
	font-display: swap;
}
@font-face {
	font-family: 'Raleway';
	src: url('/static/fonts/Raleway/Raleway_700.woff2') format('woff2');
	font-weight: 600;
	font-style: bold;
	font-display: swap;
}
@font-face {
	font-family: 'Alice';
	src: url('/static/fonts/Alice/Alice_400.woff2') format('woff2');
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

:root {
	--white-color: #fff;
	--back-color: #f6f6f6;
	--dark-color: #002573;
	--text-color: #1a313c;
	--light-color: #515252;
	--second-color: #707070;
	--menu-color: #e7eaee;
	--menu-back-color: #5bc2fc;
	--menu-hover-color: #029dd9e6;
	--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;
}
html, body {
	margin: 0;
	padding: 0;
	height: 100%;
}
body {
	font-family: 'Raleway', sans-serif;
	font-size: 14px;
	background-color: var(--white-color);
	color: var(--text-color);
}
h1, h2, h3, h4, h5, h6 { margin: 0 }
blockquote {
	border-left: 4px solid var(--menu-hover-color);
	margin-bottom: 5px;
	margin-top: 5px;
	padding-left: 16px;
	font-weight: 400;
	border-radius: 5px;
}
button {
	display: flex;
	align-items: center;
	justify-content: center;
	outline: none;
	border: none;
	background-color: transparent;
}
button,
input {
	font-family: 'Raleway', sans-serif;
	font-size: 14px;
}
.btn {
	display: flex;
	gap: 5px;
	cursor: pointer;
	text-decoration: none;
	transition: .5s;
}
.title {
	display: flex;
	align-items: center;
	gap: 5px;
    font-weight: 500;
}
.icon {
	display: block;
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
}
.ic_12 {
	width: 12px;
	height: 12px;
}
.ic_16 {
	width: 16px;
	height: 16px;
}
.ic_24 {
	width: 24px;
	height: 24px;
}
.ic_32 {
	width: 32px;
	height: 32px;
}
.ic_48 {
	width: 48px;
	height: 48px;
}
.ic_globe { background-image: url(/static/images/icons/ic_globe.svg) }
.ic_chevron { background-image: url(/static/images/icons/ic_chevron.svg) }
.ic_search { background-image: url(/static/images/icons/ic_search.svg) }
.ic_play { background-image: url(/static/images/icons/ic_play.svg) }
.ic_instagram_round { background-image: url(/static/images/icons/ic_instagram_round.svg) }
.ic_telegram_round { background-image: url(/static/images/icons/ic_telegram_round.svg) }
.ic_youtube_round { background-image: url(/static/images/icons/ic_youtube_round.svg) }
.ic_youtube_outline { background-image: url(/static/images/icons/ic_youtube_outline.svg) }
.ic_youtube_red { background-image: url(/static/images/icons/ic_youtube_red.svg) }
.ic_youtube { background-image: url(/static/images/icons/ic_youtube.svg) }
.ic_instagram { background-image: url(/static/images/icons/ic_instagram.svg) }
.ic_telegram { background-image: url(/static/images/icons/ic_telegram.svg) }
.ic_close { background-image: url(/static/images/icons/ic_close.svg) }
.ic_burger { background-image: url(/static/images/icons/ic_burger.svg) }
.ic_globe_light { background-image: url(/static/images/icons/ic_globe_light.svg) }
.ic_microphone { background-image: url(/static/images/icons/ic_microphone.svg) }
.ic_video { background-image: url(/static/images/icons/ic_video.svg) }

.ptb_35 {
	padding-top: 35px;
	padding-bottom: 35px;
}
.ptb_25 {
	padding-top: 25px;
	padding-bottom: 25px;
}
.mb_25 { margin-bottom: 25px }
.app {
	display: flex;
	flex-direction: column;
	min-height: 100%;
	transition: .5s;
}
.container { margin: 0 auto }

body.modal { overflow: hidden }
body.modal .app { pointer-events: none }
body.modal .modal_back { display: grid }
body.modal .back_banner { pointer-events: none }
.modal_back {
	display: none;
	position: fixed;
	inset: 0;
	z-index: 99;
	background-color: var(--modal-back-back);
}
.modal_back .card {
	position: fixed;
	z-index: 11;
	top: 35px;
	left: 0;
	right: 0;
	margin: auto;
	transition: .3s;
	border: 2px solid rgb(0, 0, 0, .05);
	box-shadow: 0 12px 16px rgb(20 36 56 / 4%);
}
.modal_back .card.league_table { width: 600px }
.modal_back .card.iframe {
	width: 900px;
	padding: 0;
}
.modal_back .card.iframe iframe {
	width: 900px;
	height: 600px;
	border-radius: 15px;
}
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) }

.header {
	background-color: var(--white-color);
	position: sticky;
	width: 100%;
	top: -48px;
	z-index: 10;
	display: grid;
}
.header .container {
	display: flex;
	gap: 15px;
}
.header_wrap .container { height: 64px }
.header_top { background-color: var(--back-color) }
.header_top .container {
	align-items: center;
	height: 48px;
}

.header {
	box-shadow: 0 0 10px 0 #00000012;
}
.header .logo {
	position: relative;
	min-width: 75px;
}
.header .logo a {
	position: absolute;
	display: grid;
	background: url(/static/images/logos/app_logo_dark.png?v2) no-repeat center / 75% var(--dark-color);
	min-height: 75px;
	min-width: 75px;
}

.header .menu_bar {
	display: flex;
	align-items: center;
	justify-content: end;
	gap: 25px;
}
.header .menu_bar a {
	display: grid;
	align-items: center;
	height: 100%;
	font-size: 16px;
	font-weight: 500;
	color: var(--text-color);
	text-transform: uppercase;
	text-decoration: none;
	transition: .3s;
}
.header .menu_bar a.current {
	color: var(--dark-color);
	border-bottom: 3px solid var(--dark-color);
}
.header .menu_bar a.current:hover { color: var(--dark-color) }
.header .menu_bar a:hover {
	color: var(--dark-color);
	border-bottom: 3px solid var(--dark-color);
}

.header_wrap .social_bar {
	flex: 1;
	display: flex;
	justify-content: end;
	align-items: center;
	gap: 10px;
}
.header_wrap .social_bar a {
	display: grid;
	background-color: var(--text-color);
	padding: 5px;
	border-radius: 5px;
	transition: .3s;
}

.header .app_tools { position: relative }
.header .btn_lang { color: var(--light-color) }
.header .btn_lang:hover { opacity: .75 }

.header .app_lang:hover .lang_list {
	z-index: 1;
	opacity: 1;
}
.header .app_lang .lang_list {
	z-index: -1;
	opacity: 0;
	transition: .5s;
	position: absolute;
	display: grid;
	padding: 5px 0;
	background-color: var(--white-color);
	border-radius: 5px;
}
.header .app_lang .lang_list a {
	color: var(--dark-color);
	padding: 5px 25px;
	border-radius: 0;
	text-decoration: none;
}
.header .app_lang .lang_list a:hover { background-color: var(--transparent-black) }
.header .app_lang .lang_list a.current {
	pointer-events: none;
	opacity: .75;
	background-color: transparent;
}

.header .app_menu {
	display: flex;
	gap: 10px;
	align-items: center;
}
.header .app_menu a {
	display: flex;
	gap: 5px;
	align-items: center;
	color: var(--light-color);
	text-decoration: none;
}

.app_search {
	display: flex;
	align-items: center;
	border-radius: 10px;
	outline: 0;
	border: 0;
	padding: 5px;
	padding-left: 24px;
	background: url(/static/images/icons/ic_search.svg) no-repeat 5px center / 16px;
}

.app_search:hover,
.app_search:focus {
	background-color: var(--white-color);
}
.app_search::placeholder {
	color: var(--light-color);
}

.content { background-color: var(--back-color) }
.card {
	padding: 15px;
	border: 1px solid transparent;
	border-radius: 15px;
	background-color: var(--white-color);
	box-shadow: 0 12px 16px rgb(20 36 56 / 4%);
}
.middle {
	width: max-content;
	margin: 0 auto;
	padding: 0 15px;
	margin-top: 165px;
	background-color: var(--back-color);
	position: relative;
	z-index: 9;
	border-top-left-radius: 15px;
	border-top-right-radius: 15px;
}
.back_banner {
	position: fixed;
	overflow: hidden;
	width: 100%;
	height: 100%;
	left: 0px;
	top: 0;
	border: 0;
}

.stories { padding: 25px 0 }
.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;
}
.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;
}

.left_news {
	display: grid;
	gap: 5px;
	grid-template-rows: auto 1fr auto;
	min-height: 100%;
}
.left_list {
	display: grid;
	gap: 5px;
	padding: 15px 0;
}
.left_item {
	position: relative;
	display: grid;
	gap: 5px;
	align-content: center;
	border-bottom: 1px solid rgb(0, 0, 0, .05);
}
.left_item:hover b { opacity: .95 }
.left_item b {
	display: grid;
	justify-content: center;
	width: 30px;
	align-items: center;
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0;
	font-size: 52px;
	z-index: 0;
	color: #c9cacc;
	opacity: .3;
	transition: .5s;
}
.left_item span {
	font-size: 12px;
	color: var(--second-color);
}
.left_item h2 {
	font-size: 14px;
	font-weight: 400;
	color: var(--text-color);
	z-index: 1;
	padding-right: 26px;
}
.left_item h2.strong { font-weight: 600 }
.btn_outline {
	font-weight: 500;
	justify-content: center;
	border-radius: 8px;
	padding: 8px 15px;
	color: var(--dark-color);
	border: 1px solid var(--dark-color);
	background-color: var(--white-color);
}
.btn_outline:hover {
	color: var(--white-color);
	background-color: var(--dark-color);
}
.top_news {
	display: grid;
	grid-template-columns: 30fr 70fr;
	gap: 15px;
}
.news img { max-width: 100% }
.slider_news {
	display: grid;
	gap: 15px;
}
.large_news {
	border-radius: 10px;
	overflow: hidden;
	position: relative;
	color: var(--white-color);
	aspect-ratio: 800 / 450;
	background-size: 100%;
	background-repeat: no-repeat;
	background-position: center;
	transition: .5s;
}
.large_news:hover { background-size: 110% }
.news a {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 2;
}
.large_news:after {
	content: '';
	display: block;
	position: absolute;
	z-index: 1;
	left: 0;
	top: 0;
	bottom: 0;
	right: 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%);
}
.news_meta { position: relative }
.news_info {
	position: absolute;
	bottom: 0;
	max-width: 60%;
	z-index: 2;
	padding: 25px;
	display: grid;
}
.news_info h2 { font-size: 24px }

.single_news .left_news {
	align-items: start;
	min-height: auto;
	margin-bottom: 25px;
}
.single_news .left_item { padding: 15px 0 }
.news_list {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 10px;
}
.news_authors { max-width: max-content }
.news_list.three { gap: 20px 10px }
.single_item {
	display: grid;
	align-content: start;
	gap: 5px;
	cursor: pointer;
	position: relative;
}
.single_item .img {
	position: relative;
	background-size: 100%;
	background-repeat: no-repeat;
	background-position: center;
	transition: .5s;
	border-radius: 7px;
	aspect-ratio: 800 / 450;
}
.single_item:hover .img { background-size: 110% }
.news_list img {
	border-radius: 7px;
	aspect-ratio: 800 / 450;
}
.exclusive {
	background-color: #f05632;
	color: #fff;
	padding: 1px 5px;
	border-radius: 3px;
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 1px;
	text-transform: uppercase;
	margin-right: 5px;
}
.news_list span {
	font-size: 12px;
	color: var(--second-color);
}
.news_list span.author_ex { margin-top: 20px }
.news_list h2 {
	font-size: 14px;
	font-weight: 400;
	color: var(--text-color);
}
.news_image img { border-radius: 10px }
.image_description {
	margin-top: 0;
	color: var(--second-color);
}
.news_authors a {
	display: flex;
	gap: 5px;
	align-items: center;
	margin: 15px 0;
	font-weight: 500;
	text-decoration: none;
	color: var(--dark-color);
}
.news_authors img {
	width: 32px;
	border-radius: 50%;
}
.banner_middle { padding: 35px 0 }
.banner_middle img { max-width: 100% }
.news_content {
	font-size: 1.2em;
	margin-bottom: 25px;
	line-height: 1.75;
}
.news_tags { padding: 15px 0 }
.news_tags a {
	font-size: 12px;
	font-weight: 500;
	padding: 2px 15px;
	border-radius: 5px;
	border: 1px solid var(--second-color);
	color: var(--second-color);
	text-decoration: none;
	transition: .3s;
}
.news_tags a:hover {
	background-color: var(--dark-color);
	border-color: var(--dark-color);
	color: var(--white-color);
}
.search_wrap .single_item .img .author,
.all_news_wrap .single_item .img .author { display: none }

.page_pagination { width: 100% }
.pagination {
	display: flex;
	justify-content: center;
	list-style: none;
	padding: 0;
}
.page-link:hover,
.page-item.active .page-link { background-color: #f3f5f7 }
.page-link {
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	color: #2a2f37;
	font-weight: 500;
	text-decoration: none;
	cursor: pointer;
	width: 32px;
	height: 32px;
	margin: 0 5px;
}

.videos_wrap {
	display: grid;
	gap: 25px;
	grid-template-columns: 1fr 1fr;
}
.video_img {
	position: relative;
	border-radius: 8px;
	aspect-ratio: 800 / 450;
	background-size: 100%;
	background-repeat: no-repeat;
	background-position: center;
	transition: .5s;
}
.video_img i {
	position: absolute;
	top: 15px;
	right: 15px;
	opacity: .5;
	transition: .5s;
}
.video_item {
	display: grid;
	gap: 10px;
	align-content: start;
	cursor: pointer;
	transition: .3s;
	border-radius: 12px;
	border-top: 3px solid transparent;
}
.video_item:hover { border-color: var(--video-hover-color) }
.video_item:hover i {
	opacity: .95;
}
.video_item textarea { display: none }
.large_video img {
	max-width: 100%;
	border-radius: 10px;
}
.large_video h2 {
	font-size: 18px;
	font-weight: 500;
}
.large_video .video_img { aspect-ratio: auto }
.all_videos {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px;
}
.single_video {
	display: grid;
	gap: 5px;
	cursor: pointer;
}
.single_video:hover i { opacity: .95 }
.single_video h2 {
	font-weight: 500;
	font-size: 12px;
}

.league_tab { position: relative }
.league_tab:hover .current_league {
	color: var(--dark-color);
	border-color: var(--stories-button-back);
}
.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 var(--transparent-black);
	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;
}
.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;
	font-weight: 400;
	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 }

.forecasts {
	display: grid;
	grid-template-columns: 70fr 30fr;
	gap: 15px;
	padding: 35px 0
}
.forecasts .title { justify-content: space-between }
.forecasts .title a {
	display: grid;
	width: 60px;
	background-color: #f42525;
	padding: 5px 15px;
	border-radius: 5px;
	opacity: .75;
}
.forecasts .title a:hover { opacity: 1 }
.forecasts .title a img { max-width: 100% }

.single_item .img .author {
	display: flex;
	align-items: center;
	position: absolute;
	bottom: -18px;
	left: 5px;
}
.single_item .img .author img {
	max-width: 38px;
	border-radius: 50%;
	border: 2px solid var(--white-color);
	z-index: 1;
	aspect-ratio: unset;
}
.single_item .img .author strong {
	border-radius: 5px;
	padding: 2px 5px;
	padding-left: 15px;
	margin-left: -7px;
	background-color: var(--dark-color);
	color: var(--white-color);
	font-weight: 500;
	font-size: 12px;
}
.forecasts_wrap .single_item span,
.forecasts .single_item span { margin-top: 25px }
.all_forecasts {
	display: flex;
	justify-content: center;
	padding: 15px 0;
}
.all_forecasts a {
	max-width: max-content;
	padding: 5px 55px;
}

.category_wrap{
	display: grid;
	grid-template-columns: 70fr 30fr;
	gap: 15px;
	padding: 35px 0
}
.single_news {
	display: grid;
	grid-template-columns: 70fr 30fr;
	gap: 15px;
	padding: 25px 0;
}
.single_news img { max-width: 100% }
.breadcrumb {
	display: flex;
	align-items: center;
	gap: 5px;
	font-size: 12px;
}
.breadcrumb a {
	text-decoration: none;
	color: var(--text-color);
	font-weight: 500;
}
.breadcrumb a:hover {
	text-decoration: underline;
	color: var(--menu-hover-color)
}
.breadcrumb i svg { transform: rotate(270deg) }
.breadcrumb i svg path { stroke: var(--text-color) }
.news_title {
	font-size: 32px;
	font-weight: 500;
}
.news_iframe {
	aspect-ratio: 640 / 360;
	border-radius: 15px;
	overflow: hidden;
}
.news_iframe iframe {
	width: 100%;
	height: 100%;
}
.footer {
	background-color: var(--back-color);
	padding: 35px 0;
	color: var(--footer-text);
	position: relative;
}
.footer_wrap {
	display: grid;
	grid-template-columns: auto 300px 1fr 1fr;
	align-items: center;
	gap: 25px;
}
.footer_logo {
	display: grid;
	background: url(/static/images/logos/app_logo.png) no-repeat center / contain;
	min-height: 120px;
}
.footer_logo a { aspect-ratio: 296 / 512 }
.app_license {
	font-size: 12px;
}
.footer_menu {
	display: grid;
	gap: 5px;
}
.footer_menu a {
	text-decoration: none;
	color: var(--footer-text);
	font-weight: 600;
}
.footer_menu a:hover {
	
}
.contact_block {
	display: grid;
	gap: 15px;
}
.contact_text {
	display: grid;
	gap: 5px;
}
.contact_text span { font-size: 12px }
.footer_wrap .social_bar {
	display: flex;
	justify-content: center;
	gap: 10px;
}
.footer_wrap .social_bar a {
	background-color: var(--social-back-color);
	padding: 5px;
	border-radius: 5px;
	transition: .3s;
}
.footer_wrap .social_bar a i { opacity: .5 }
.footer_wrap .social_bar a:hover i { opacity: 1 }

.sidebar {
	position: fixed;
	top: 0;
	left: 0;
	display: grid;
	background-color: #fff;
	height: 100%;
	z-index: 99;
	transform: translateX(-100%);
	transition-duration: .3s;
	padding: 25px 0;
	padding-right: 35px;
}
.menu .sidebar { transform: translateX(0) }
.sidebar .menu_bar {
	display: flex;
	flex-direction: column;
}
.sidebar .menu_bar 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;
}
.btn_menu_close {
	position: fixed;
	right: 10px;
}
.btn_menu_close svg {
	width: 100%;
	height: 100%;
}
.app_tools {
	padding: 15px;
}
.app_tools .app_search { border: 1px solid var(--black-back-back) }
.app_tools.app_lang {
	padding: 10px 20px;
}
.app_tools.app_lang a {
	padding: 0;
	font-weight: 400;
	text-transform: none;
	padding: 5px;
	border-radius: 55px;
	max-width: max-content;
}
.app_tools.app_lang .current { color: var(--menu-hover-color) }
@media only screen and (max-width: 768px) {
	.back_banner { display: none }
	.container { width: 100% }
	.middle {
		width: auto;
		margin-top: 15px;
	}
	.stories { padding: 15px 0 }
	.stories_wrap { grid-template-columns: 1fr }
	.stories_boxes { justify-content: center}
	.stories_nav { display: none }
	.header_wrap .menu_bar { display: none }
	.top_news {
		display: flex;
		flex-direction: column-reverse;
	}
	.news_list { grid-template-columns: 1fr }
	.news_info {
		padding: 10px;
		max-width: 100%;
	}
	.news_info h2 { font-size: 18px }
	.large_news h2 {
		font-size: 16px;
		font-weight: 500;
	}
	.large_news:after {background-image: linear-gradient(to top, rgba(0, 0, 0, 0.74) 20%, rgba(0, 0, 0, 0.66) 30%, rgba(0, 0, 0, 0) 50%) }
	.left_item { padding: 15px 0 }
	.banner_middle { padding: 15px 0 }
	.videos_wrap { grid-template-columns: 1fr }
	.modal_back .card.iframe iframe {
		max-width: 100%;
		max-height: 350px;
	}
	.modal_back .card.iframe { width: 100% }
	body.modal .modal_back .close { right: 5px }
	.forecasts { grid-template-columns: 1fr }
	.modal_back .card.league_table {
		max-width: 100%;
		width: auto;
	}
	.footer_wrap {
		display: flex;
		flex-wrap: wrap;
		padding: 0 25px;
	}
	.footer_logo { max-height: 50px }
	.app_license { flex: 1 }
	.footer_menu { display: none }
	.contact_block {
		text-align: center;
		flex: 400px;
	}
	.header_wrap { padding: 0 15px }
	.header_top .app_search { display: none }
	.header_wrap .logo { width: 85px }
	.stories_view_wrap {
		max-width: 100%;
		max-height: 100%;
		width: 100%;
	}
	.single_news { grid-template-columns: auto }
	.news_title { font-size: 25px }
	.category_wrap { grid-template-columns: auto }
	.single_news .news_list { grid-template-columns: 1fr 1fr }
	blockquote {
		padding-left: 10px;
		margin-inline-start: 10px;
		margin-inline-end: 0;
	}
	.title a { display: none }
	.page-link {
		width: 16px;
		height: 16px;
	}
}
@media (min-width: 576px) { .container { width: 540px } }
@media (min-width: 768px) { .container { width: 720px } }
@media (min-width: 992px) { .container { width: 960px } }
@media (min-width: 1200px) { .container { width: 1140px } }
@media (min-width: 1300px) { .container { width: 1140px } }