@charset "UTF-8";
/*
Theme Name: Черкаський спорт
Author: Web Developer Vitaliy Hrebinets
Author URI: http://devh.pp.ua/
Description: Індивідуальна тема для інформаційного порталу Черкащини – "Черкаський спорт".
Version: 1.1
*/
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
#fon_m
#body
	#header
		.today
		.social
	#top
		.custom-logo-link
	#menu
	#index
		.mark_top
		#top_post
			.actual_post .post1
			.actual_post .post2, .actual_post .post3
				.fon_post
				.img
				.des
					.cat
					.title_news
					.date
		#slayd
			.slayd_li
				.fon_post
				.img
				.des
					.cat
					.title_news
					.date
		#slayd_ul
			.1, .2, .active
		#table_left
			.news_nav
			.title
			.news_title-index
			.wp-block-image
				img
			.news_content
				.wp-caption
					img
			.news
				.news_img
				.news_title
				.news_date
				.excerpt
				.news_ful
			.news_mini
				.news_img
				.news_title
				.news_date
		#table_right
			.sidebar_block
				.title
		#partners
			.part
				img
	#footer
		.devh
#fon
	img
#status_line
	div
#page_top
--------------------------------------------------------------*/

::selection
	{background-color: rgb(255, 55, 55);
	color: rgb(255, 255, 55)}
::-moz-selection
	{background-color: rgb(255, 55, 55);
	color: rgb(255, 255, 55)}
body
	{font-family: sans-serif;
	font-size: 14px;
	color: rgb(40, 40, 40);
	background-color: rgb(235, 235, 235);
	margin: 0px;
	padding: 0px}

body::-webkit-scrollbar
	{width: 16px}
body::-webkit-scrollbar-thumb
	{background: rgb(255, 55, 55);
	border-left: 1px solid rgb(120, 0, 0);
	border-radius: 3px}
body::-webkit-scrollbar-track
	{background: rgb(225, 225, 225);
	border-left: 1px solid rgb(40, 40, 40)}
#fon_m
	{display: none}
#body
	{position: relative;
	background-color: rgb(255, 255, 255);
	width: 100%;
	max-width: 1200px;
	margin: 220px auto 0px auto;
	border-top: 3px solid rgb(41, 171, 226);
	border-left: 3px solid rgb(41, 171, 226);
	border-right: 3px solid rgb(41, 171, 226);
	box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
	z-index: 1}
#header
	{background-color: rgb(70, 70, 70);
	color: rgb(225, 225, 225);
	margin: 0px;
	padding: 0px;
	font-size: 12px;
	overflow: hidden}
#header .today
	{float: left;
	margin: 10px;
	margin-left: 50px}
#header .social
	{float: right;
	margin-right: 50px}
#header .social a
	{position: relative;
	float: left;
	width: 34px;
	height: 34px;
	margin-left: 5px;
	transition: 0.5s}
#header .social a:after
	{position: absolute;
	width: 20px;
	height: 20px;
	margin: 7px;
	content: "";
	filter: invert(100%);
	background-size: cover}
#header .social a.fb:after
	{background-image: url(/wp-content/themes/cherkassy-sport/img/social/facebook.svg)}
#header .social a.fb:hover
	{background-color: rgb(60, 91, 155)}
#header .social a.instagram:after
	{background-image: url(/wp-content/themes/cherkassy-sport/img/social/instagram.svg)}
#header .social a.instagram:hover
	{background-color: rgb(247, 80, 78)}
#header .social a.youtube:after
	{background-image: url(/wp-content/themes/cherkassy-sport/img/social/youtube.svg)}
#header .social a.youtube:hover
	{background-color: rgb(255, 50, 50)}
#header .social a.rss:after
	{background-image: url(/wp-content/themes/cherkassy-sport/img/social/rss.svg)}
#header .social a.rss:hover
	{background-color: rgb(41, 171, 226)}
#top
	{position: relative;
	width: 100%;
	min-height: 75px;
	padding: 0px;
	overflow: hidden}
.custom-logo
	{height: 50px;
	width: auto}
#top p, #top table, #top tr, #top td
	{margin: 0px;
	padding: 0px}
#top table
	{width: 100%}
#top .textwidget img
	{width: 100%;
	height: auto}
#menu
	{background-color: rgb(41, 171, 226);
	padding-left: 50px;
	padding-right: 50px;
	margin: 0px;
	top: 0px;
	width: 100%;
	max-width: 1100px;
	box-shadow: 0px 0px 10px;
	z-index: 5}
#index
	{background-color: rgb(255, 255, 255);
	padding-left: 50px;
	padding-right: 50px;
	overflow: hidden}
.mark_top
	{box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3);
	padding: 0px;
	margin-top: 30px;
	margin-bottom: 30px}
.mark_top img
	{margin: 0px;
	padding: 0px;
	width: 100%;
	height: auto}
.run_time, #run
	{font-family: 'time news roman';
	font-weight: bold}
.run_time
	{float: left;
	width: 50px;
	background-color: rgba(86, 184, 90, 0.7);
	color: rgb(255, 255, 255);
	height: 16px;
	padding: 17px 0px 17px 0px;
	text-align: center}
#run
	{float: right;
	width: calc(100% - 50px);
	white-space: nowrap;
	text-transform: uppercase;
	border-top: 1px solid rgba(0, 0, 0, 0.3);
	border-bottom: 1px solid rgba(0, 0, 0, 0.3);
	padding: 0px;
	margin-bottom: 20px}
#run div, #run p
	{display: inline-block}
#run img
	{height: 16px;
	width: auto}
.run_title
	{background-color: rgba(86, 184, 90, 0.7);
	color: rgb(255, 255, 255);
	margin: 0px 25px 0px 25px;
	padding: 4px 10px 4px 10px;
	border-radius: 3px}
#top_post
	{overflow: hidden}
.actual_post
	{position: relative;
	display: inline-block;
	text-decoration: none;
	color: rgb(255, 255, 255);
	margin: 0px}
.fon_post
	{position: absolute;
	background-color: rgba(0, 0, 0, 0.4);
	left: 0px;
	top: 0px;
	right: 0px;
	bottom: 0px;
	z-index:1}
.post1
	{float: left;
	width: 100%;
	max-width: 658px;
	height: 490px;
	left: 0px}
.post2, .post3
	{float: right;
	width: 100%;
	max-width: 440px;
	height: 244px;
	right: 0px;
	margin-bottom: 2px}
.actual_post .img
	{position: absolute;
	left: 0px;
	right: 0px;
	top: 0px;
	bottom: 0px;
	background-position: center center;
	background-size: 100%;
	border-radius: 3px;
	z-index: 0;
	transition: 0.5s}
.actual_post:hover .img
	{background-size: 110%;
	transition: 0.5s}
.post1 .img
	{background-size: auto 100%}
.post1:hover .img
	{background-size: auto 110%}
.actual_post .des, .slayd_li .des
	{position: absolute;
	bottom: 0px;
	left: 0px;
	right: 0px;
	padding: 20px;
	z-index: 2}
.actual_post .des .cat, .slayd_li .cat
	{background-color: rgb(30, 30, 30);
	width: max-content;
	padding: 2px;
	padding-left: 10px;
	padding-right: 10px;
	border-radius: 2px;
	font-size: 12px;
	font-weight: bold;
	text-transform: uppercase;
	margin-bottom: 10px}
.post1 .des .title_news
	{font-size: 27px;
	line-height: 1em;
	font-weight: 500}
.post1 .des .date, .slayd_li .des .date
	{margin-top: 15px}
.post2 .des .title_news, .post3 .des .title_news, .slayd_li .des .title_news
	{font-size: 18px;
	line-height: 1em;
	font-weight: 500}
.post2 .des .date, .post3 .des .date
	{margin-top: 5px}
#slayd
	{position: relative;
	overflow-x: hidden;
	margin: 25px 0px 25px 0px;
	white-space: nowrap}
::-webkit-scrollbar
	{height: 7px}
::-webkit-scrollbar-thumb
	{background: rgb(55, 55, 200);
	border-radius: 5px}
::-webkit-scrollbar-track
	{background: rgb(225, 225, 225);
	border-radius: 5px}
.slayd_li
	{position: relative;
	display: inline-block;
	width: 270px;
	height: 330px;
	margin: 0px 2.5px 0px 2.5px;
	overflow: hidden;
	color: rgb(255, 255, 255);
	white-space: normal}
.slayd_li .img
	{position: absolute;
	background-size: cover;
	background-position: center center;
	width: 100%;
	height: 100%;
	transition: 0.5s}
.slayd_li:hover .img
	{margin-top: -11px;
	margin-left: -11px;
	width: calc(100% + 22px);
	height: calc(100% + 22px)}
#slayd_ul
	{text-align: center;
	margin-bottom: 10px}
#slayd_ul span
	{display: inline-block;
	width: 10px;
	height: 10px;
	margin: 2px;
	background-color: rgba(0, 0, 0, 0.4);
	border-radius: 10px;
	cursor: pointer}
#slayd_ul span.active
	{background-color: rgb(0, 0, 0)}
#table_left
	{float: left;
	width: 785px}
#table_right
	{float: right;
	width: 300px}
.sidebar_block
	{overflow: hidden;
	margin-bottom: 15px}
#table_right img, #table_right iframe, #table_right a
	{width: 100%;
	height: auto}
.news
	{position: relative;
	margin-top: 15px;
	margin-bottom: 15px;
	overflow: hidden}
.news_mini, .sp-widget-align-none
	{display: inline-block;
	vertical-align: top;
	padding: 5px;
	width: calc(50% - 12px)}
.news_nav, .news_nav a
	{text-decoration: none;
	color: rgb(175, 175, 175);
	margin-bottom: 30px}
.news_nav a:hover
	{color: rgb(70, 70, 70)}
.news_img
	{float: left;
	width: 100%;
	max-width: 300px;
	margin-right: 15px;
	box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);
	transition: 0.5s}
.news_mini .news_img
	{max-width: 150px}
.news_title
	{color: rgb(0, 0, 0);
	text-decoration: none;
	font-size: 18px;
	font-weight: bold;
	transition: 0.5s}
.news_mini .news_title
	{font-size: 14px}
.news_title-index
	{color: rgb(0, 0, 0);
	font-size: 24px}
.news_content
	{text-align: justify;
	line-height: 1.5}
.news_content img
	{max-width: 100%;
	height: auto}
.news_content iframe
	{max-width: 100%}
.news:hover .news_title, .news_mini:hover .news_title
	{color: rgba(0, 0, 0, 0.7)}
.wp-block-image
	{text-align: center}
.news_index_img
	{width: 90%;
	height: auto;}
.news_date:before, .news_category:before
	{display: inline-block;
	margin-right: 5px;
	content: "";
	background-image: url(/wp-content/themes/cherkassy-sport/img/time.png);
	background-size: cover;
	width: 12px;
	height: 12px}
.news_category:before
	{background-image: url(/wp-content/themes/cherkassy-sport/img/category.png)}
.news p
	{text-align: justify}
.news_mini .excerpt
	{display: none}
.news_ful
	{display: inline-block;
	background-color: rgb(41, 171, 226);
	color: rgb(255, 255, 255);
	text-decoration: none;
	padding: 5px;
	padding-left: 10px;
	padding-right: 10px;
	margin-top: 15px}
.news_mini .news_ful
	{display: none}
.news .post-categories
	{list-style-type: none;
	position: absolute;
	margin: 0px;
	padding: 5px;
	padding-left: 25px;
	padding-right: 15px;
	top: 0px;
	left: 0px;
	background-color: rgb(0, 0, 0);
	box-shadow: 0px 0px 5px rgba(255, 255, 255, 0.3);
	border-radius: 3px}
.news .post-categories a
	{text-decoration: none;
	color: rgb(255, 255, 255)}
.wp-caption
	{position: relative;
	max-width: 100%;
	margin: 10px 0px;}
.wp-caption img
	{width: 100%;
	height: auto}
.wp-caption p
	{position: absolute;
	left: 0px;
	right: 0px;
	bottom: 3px;
	margin: 0px;
	padding: 10px 20px;
	background-color: rgba(0, 0, 0, 0.7);
	color: rgb(255, 255, 255)}
.page-numbers
	{background-color: rgb(55, 55, 200);
	color: rgb(255, 193, 0);
	margin: 2px;
	margin-top: 15px;
	margin-bottom: 15px;
	padding: 10px;
	text-decoration: none;
	font-weight: bold;
	transition: 0.5s}
.page-numbers:hover, .page-numbers.current
	{background-color: rgb(38, 38, 140);
	color: rgb(255, 255, 255)}
.title
	{position: relative;
	padding: 0px;
	text-align: initial;
	margin-bottom: 15px;
	background: linear-gradient(45deg, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.1));
	font-size: 18px;
	font-weight: bold;
	height: 18px;
	text-transform: uppercase}
.title:before
	{position: absolute;
	content: "";
	width: 12px;
	height: 12px;
	display: inline-block;
	background-color: rgb(41, 171, 226);
	left: 0;
	top: 49%;
	-webkit-transform: translateY(-49%);
	-ms-transform: translateY(-49%);
	transform: translateY(-49%)}
.title span, .title a
	{background-color: rgb(255, 255, 255);
	color: rgb(41, 171, 226);
	text-decoration: none;
	padding: 0px 10px 0px 25px}
.search
	{position: relative}
.search>input[type="text"]
	{outline: none;
	width: calc(100% - 46px);
	background-color: rgb(225, 225, 225);
	border: 1px solid rgb(220, 220, 220);
	border-radius: 5px;
	height: 30px;
	padding-left: 10px;
	padding-right: 34px;
	transition: 0.5s}
.search>input[type="text"]:focus
	{border: 1px solid rgb(70, 70, 70)}
.search>input[type="submit"]
	{outline: none;
	position: absolute;
	right: 0px;
	background-image: url(/wp-content/themes/cherkassy-sport/img/search.svg);
	background-color: rgba(41, 171, 226, 0.7);
	background-size: 20px;
	background-position: center center;
	background-repeat: no-repeat;
	width: 34px;
	height: 34px;
	border: 0px;
	border: 1px solid rgb(0, 130, 185);
	border-radius: 0px 5px 5px 0px;
	cursor: pointer;
	transition: 0.5s}
.search>input[type="submit"]:hover
	{background-color: rgb(41, 171, 226)}
.search>input[type="submit"]:active
	{background-size: 15px}
#partners
	{float: left;
	width: 100%;
	text-align: center;
	white-space: nowrap;
	overflow-x: auto}
#partners .part
	{display: inline-block;
	margin: 15px}
#partners .part img
	{height: 64px;
	width: auto;
	box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3)}
#footer
	{position: relative;
	background-color: rgb(34, 34, 34);
	color: rgb(255, 255, 255);
	text-align: center;
	padding: 20px 50px 24px 50px}
#footer a
	{color: rgb(255, 255, 255)}
#footer .devh
	{position: relative;
	display: block;
	bottom: -20px;
	margin: 20px -50px 0px -50px;
	padding: 20px;
	background-color: rgba(255, 55, 55, 0.3);
	text-decoration: none;
	color: rgb(255, 255, 70);
	transition: 0.5s}
#status_line
	{position: fixed;
	width: 1200px;
	left: 50%;
	margin-left: -600px;
	bottom: 0px;
	height: 5px;
	background-color: rgb(225, 225, 225);
	z-index: 3}
#status_line div
	{background-color: rgb(255, 55, 55);
	height: 100%;
	width: 0%}
#page_top
	{position: fixed;
	bottom: -45px;
	right: 15px;
	width: 40px;
	height: 40px;
	background-color: rgb(255, 55, 55);
	cursor: pointer;
	opacity: 0.8;
	transition: 0.5s;
	z-index: 1}
#page_top.ok
	{bottom: 50px}
#page_top:hover
	{opacity: 1}
#page_top:before
	{position: relative;
    display: block;
    content: "❯";
    color: rgb(255, 255, 255);
    transform: rotate(-90deg);
    font-size: 24px;
    top: -19px;
    margin-top: 50%;
    left: -12px;
    margin-left: 50%}
#fon a
	{position: fixed;
	top: 0px;
	left: 0px;
	right: 0px;
	bottom: 0px;
	opacity: 0;
	z-index: 0}
#fon p
	{margin: 0px}
.p404
	{color: rgb(245, 245, 245);
	font-size: 180px;
	text-shadow: 0px 0px 5px rgb(200, 200, 200)}