@import url("https://fonts.googleapis.com/css2?family=Outfit:wght@100..900&display=swap");
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, button, input, p, blockquote, th, td {
	margin: 0;
	padding: 0;
}

fieldset, img {
	border: 0;
}

img, object, embed {
	vertical-align: bottom;
}

address, caption, cite, code, dfn, em, th, var {
	font-style: normal;
	font-weight: normal;
}

ol, ul {
	list-style: none;
}

caption, th {
	text-align: left;
}

h1, h2, h3, h4, h5, h6 {
	font-size: 100%;
}

q:before, q:after {
	content: '';
}

a * {
	cursor: pointer;
}
a {
	cursor: pointer;
}

input,
textarea {
	outline: none;
}

:root {
	--font-size-general: 18px;
	--line-height-general: 1.2;
	--default-font: "Outfit", sans-serif;
	--font-weight: 400;
	--color-main: #fff;
	--color-second: #868686;
	--color-active: #FFBE00;
	--color-active-second: #ffae00;
	--color-dark: #000;
	--color-text-spot: #9c9c9c;
	--color-popup-info: #737373;
	--bg-main: #111111;
	--bg-black: #000;
	--bg-tools: #0b0b0b;
	--bg-video-tools: #272727;
	--bg-gradient-text: linear-gradient(90deg, #fc0 0%, #ffae00 100%);
	--bg-rgb-modal: 11, 11, 11;
	--bg-rgb-checkbox: 0, 0, 0;
	--bg-field: #2c2c2c;
	--color-border: #2a2a2a;
	--box-shadow-drop: 0 10px 11px 0 rgba(0, 0, 0, 0.3);
	--box-shadow-more:  4px 4px 0 rgba(0, 0, 0, 0.2);
	--border-textarea: #202028;
	--header-height: 60px;
	--box-shadow-menu: 0 4px 18px 0 rgba(0, 0, 0, 0.35);
	--bg-drop-share: #403f3f;
}

html {
	height: 100%;
	min-width: 320px;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
	scroll-behavior: smooth;
}

body {
	font: var(--font-size-general)/var(--line-height-general) var(--default-font);
	font-weight: var(--font-weight);
	height: 100%;
	min-width: 320px;
	position: relative;
	color: var(--color-main);
	background: var(--bg-main);
}

body.show-search .wrapped-search {
	transform: translate3d(0, -50%, 0);
	visibility: visible;
	opacity: 1;
}
@media screen and (max-width: 1120px) {
	body.show-search .wrapped-search {
		top: 0;
		transform: translate3d(0, 0, 0);
	}
	body.show-search .action-btn {
		transform: translateX(108px);
	}
}
@media screen and (max-width: 390px) {
	body.show-search .action-btn {
		transform: translateX(56px);
	}
}

body.show-search .action-btn use[href="#icon-close"] {
	display: block;
}

body.show-search .action-btn use[href="#icon-search"] {
	display: none;
}

body.show-search .navigation .list {
	opacity: 0;
	visibility: hidden;
}

@media screen and (max-width: 1120px) {
	body.show-search .navigation .list {
		opacity: 1;
		visibility: visible;
	}
}

@media screen and (max-width: 1120px) {
	body.show-search .hamburger,
	body.show-search .btn-upload {
		opacity: 0;
		visibility: hidden;
	}
}

@media screen and (max-width: 1460px) {
	body.open-menu .mobile-menu {
		opacity: 1;
		transform: translate3d(0, 0, 0);
		visibility: visible;
	}
	body.open-menu .action-btn {
		opacity: 0;
		visibility: hidden;
	}
}

@media screen and (max-width: 1460px) {
	body.scroll-locked {
		height: 100%;
		overflow: hidden;
		position: fixed;
		width: 100%;
	}
}

body.modal-show {
	height: 100%;
	overflow: hidden;
	position: fixed;
	width: 100%;
}

a {
	color: #2600ff;
	text-decoration: none;
}

input,
button,
textarea {
	font-family: inherit;
	font-size: inherit;
	font-weight: inherit;
}

input {
	outline: none;
	-webkit-appearance: none;
	border-radius: 0;
}

* {
	box-sizing: border-box;
	outline: none;
}

*:before, *:after {
	box-sizing: border-box;
}

* ::-moz-selection {
	background: #2600ff;
	color: #fff;
}

* ::selection {
	background: #2600ff;
	color: #fff;
}

.svg-icon {
	display: inline-block;
	vertical-align: top;
	width: 1em;
	height: 1em;
	fill: currentColor;
}

input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
	color: #999;
}

input:-moz-placeholder, textarea:-moz-placeholder {
	color: #999;
	opacity: 1;
}

input::-moz-placeholder, textarea::-moz-placeholder {
	color: #999;
	opacity: 1;
}

input:-ms-input-placeholder, textarea:-ms-input-placeholder {
	color: #999;
}

input:focus::-webkit-input-placeholder, textarea:focus::-webkit-input-placeholder {
	color: transparent;
}

input:focus:-moz-placeholder, textarea:focus:-moz-placeholder {
	color: transparent;
}

input:focus::-moz-placeholder, textarea:focus::-moz-placeholder {
	color: transparent;
}

input:focus:-ms-input-placeholder, textarea:focus:-ms-input-placeholder {
	color: transparent;
}

input.placeholder, textarea.placeholder {
	color: #999 !important;
}

.wrapper {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
}

.container {
	max-width: 1360px;
	width: 100%;
	margin: 0 auto;
	padding: 0 20px;
}

@media screen and (max-width: 991px) {
	.container {
		padding: 0 10px;
	}
}

.header {
	display: flex;
	position: relative;
	padding: 0 30px;
	flex-shrink: 0;
	flex-grow: 0;
	gap: 0 30px;
	margin-bottom: 30px;
	background-color: var(--color-dark);
	border-bottom: 2px solid var(--color-active);
}

@media screen and (max-width: 1366px) {
	.header {
		justify-content: space-between;
		gap: 10px;
	}
}

@media screen and (max-width: 1120px) {
	.header {
		flex-wrap: wrap;
		padding: 0 20px;
		margin-bottom: 20px;
		padding: 10px 10px 0;
	}
}

.logo {
	flex-grow: 0;
	flex-shrink: 0;
	font-style: italic;
	font-weight: 900;
	font-size: 30px;
	text-transform: uppercase;
	padding: 15px 0;
	line-height: 1;
	display: flex;
	align-items: center;
	gap: 0 10px;
}

@media screen and (max-width: 1120px) {
	.logo {
		order: -1;
		padding: 5px 0;
		flex-grow: 1;
		flex-shrink: 1;
		/* width: 70%; */
	}
}

@media screen and (max-width: 568px) {
	.logo {
		font-size: clamp(22px, 5.30vw, 30px);
	}
}

@media screen and (max-width: 390px) {
	.logo {
		/* font-size: 22px; */
		font-size: 20px;
		width: auto;
		padding: 8px 0;
		gap: 0 5px;
	}
}

.logo a {
	cursor: pointer;
	display: flex;
	align-items: center;
	gap: 0 10px;
	color: var(--color-main);
}

@media screen and (max-width: 390px) {
	.logo a {
		gap: 0 5px;
	}
}

.logo img {
	max-width: 18px;
	transform: rotate(10deg);
	transform-origin: center left;
}

@media screen and (max-width: 390px) {
	.logo img {
		max-width: 16px;
	}
}

.logo span {
	color: var(--color-active);
}

.navigation {
	display: flex;
	justify-content: center;
	flex-grow: 1;
	flex-shrink: 1;
}

@media screen and (max-width: 1460px) {
	.navigation {
		/* width: 100%; */
		flex-basis: 100%;
	}
}

@media screen and (max-width: 991px) {
	.navigation {
		/* width: auto; */
		margin: 0 -10px;
	}
}

.navigation .holder {
	position: relative;
	display: flex;
	justify-content: center;
}
@media screen and (max-width: 1860px) {
	.navigation .holder {
		width: 100%;
	}
}
@media screen and (max-width: 1120px) {
	.navigation .holder {
		position: static;
		/* width: 100%; */
	}
}

.navigation .list {
	display: flex;
	gap: 10px;
	font-weight: 500;
	font-size: 22px;
	transition: opacity .3s, visibility .3s;
}
@media screen and (max-width: 1860px) {
	.navigation .list {
		width: 100%;
	}
}

@media screen and (max-width: 1460px) {
	.navigation .list {
		/* width: 100%; */
		justify-content: space-between;
	}
}

@media screen and (max-width: 1366px) {
	.navigation .list {
		/* font-size: 20px; */
		font-size: 17px;
		gap: 0;
	}
}

@media screen and (max-width: 991px) {
	.navigation .list {
		font-size: 20px;
	}
}

@media screen and (max-width: 390px) {
	.navigation .list {
		font-size: 16px;
	}
}

.navigation .list li {
	height: 100%;
}

/* @media screen and (max-width: 1366px) { */
@media screen and (max-width: 1860px) {
	.navigation .list li {
		flex-shrink: 1;
		flex-grow: 1;
	}
}

.navigation .list li.active a, .navigation .list li.active span {
	color: var(--color-dark);
	background-color: var(--color-active);
}

@media screen and (max-width: 767px) {
	.navigation .list li.second {
		display: none;
	}
}

.navigation .list a {
	transition: background-color .3s, color .3s;
}

@media screen and (min-width: 1025px) {
	.navigation .list a:hover {
		color: var(--color-dark);
		background-color: var(--color-active);
	}
}

.navigation .list a, .navigation .list span {
	display: flex;
	padding: 0 30px;
	align-items: center;
	justify-content: center;
	height: 100%;
	color: var(--color-main);
	min-height: 40px;
}

@media screen and (max-width: 1760px) {
	.navigation .list a, .navigation .list span {
		padding: 8px 10px;
	}
}
@media screen and (max-width: 1860px) {
	.navigation .list a, .navigation .list span {
		padding: 8px 2px;
	}
}

@media screen and (max-width: 1366px) {
	.navigation .list a, .navigation .list span {
		justify-content: center;
		padding: 0 10px;
	}
}

@media screen and (max-width: 767px) {
	.navigation .list a, .navigation .list span {
		padding: 8px 5px;
	}
}

.header-tools {
	flex-grow: 0;
	flex-shrink: 0;
	display: flex;
	gap: 0 20px;
}

@media screen and (max-width: 1120px) {
	.header-tools {
		order: -1;
	}
}

@media screen and (max-width: 390px) {
	.header-tools {
		gap: 0 10px;
	}
}

.header-tools .group {
	display: flex;
	gap: 2px;
	height: 100%;
}

@media screen and (max-width: 1460px) {
	.header-tools .group {
		display: none;
	}
}

.header-tools .btn {
	padding: 0 30px;
}

@media screen and (max-width: 1760px) {
	.header-tools .btn {
		padding: 0 15px;
		font-size: 20px;
	}
}

.header-tools .btn,
.mobile-menu .btn {
	display: flex;
	align-items: center;
	cursor: pointer;
	border: none;
	height: 100%;
	font-weight: 500;
	font-size: 22px;
	text-transform: uppercase;
	color: var(--color-dark);
	background-color: var(--color-active);
	transition: background-color .3s, color .3s;
}

@media screen and (min-width: 1025px) {
	.header-tools .btn:hover,
	.mobile-menu .btn:hover {
		background-color: var(--color-active-second);
	}
}

.header-tools .btn.second,
.mobile-menu .btn.second {
	color: var(--color-second);
	background-color: var(--color-dark);
}

@media screen and (min-width: 1025px) {
	.header-tools .btn.second:hover,
	.mobile-menu .btn.second:hover {
		color: var(--color-dark);
		background-color: var(--color-active);
	}
}

.action-btn {
	display: flex;
	align-self: center;
	font-size: 24px;
	cursor: pointer;
	background-color: transparent;
	border: none;
	transition: color .3s;
	color: var(--color-main);
}

@media screen and (min-width: 1025px) {
	.action-btn:hover {
		color: var(--color-active);
	}
}

@media screen and (max-width: 390px) {
	.action-btn {
		/* font-size: 22px; */
		font-size: 18px;
	}
}

.action-btn use[href="#icon-close"] {
	display: none;
}

.wrapped-search {
	position: absolute;
	left: 0;
	right: 0;
	top: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	visibility: hidden;
	transition: opacity .3s, visibility .3s, transform .3s;
	transform: translate3d(0, -80%, 0);
}

@media screen and (max-width: 1120px) {
	.wrapped-search {
		top: 0;
		transform: translate3d(0, -10px, 0);
		bottom: auto;
		padding: 12px 0 0 10px;
		right: 44px;
	}
}
@media screen and (max-width: 390px) {
	.wrapped-search {
		padding-top: 7px;
	}
}

.wrapped-search .form {
	display: flex;
	background-color: var(--bg-field);
	border-radius: 15px;
	flex-grow: 1;
	flex-shrink: 1;
}

.wrapped-search .input {
	color: var(--color-main);
	background: none;
	border: none;
	flex-grow: 1;
	cursor: text;
	font-size: 16px;
	height: 40px;
	padding: 14px 0 14px 20px;
	width: 100%;
}

.button-search {
	background: none;
	border: none;
	cursor: pointer;
	font-size: 20px;
	padding: 0 20px;
	display: flex;
	align-items: center;
	color: var(--color-active);
	transition: color .3s;
}

@media screen and (min-width: 1025px) {
	.button-search:hover {
		color: var(--color-main);
	}
}

.hamburger {
	cursor: pointer;
	flex-grow: 0;
	flex-shrink: 0;
	align-self: center;
	display: none;
	background: none;
	border: none;
	font-size: 24px;
	color: var(--color-main);
	transform: translateZ(0);
	transition: transform .3s, color .3s;
}

@media screen and (min-width: 1025px) {
	.hamburger:hover {
		color: var(--color-active);
	}
}

@media screen and (max-width: 1460px) {
	.hamburger {
		display: flex;
	}
}

@media screen and (max-width: 390px) {
	.hamburger {
		/* font-size: 22px; */
		font-size: 18px;
	}
}

.mobile-menu {
	display: flex;
	flex-direction: column;
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	overflow: auto;
	height: 100svh;
	background: var(--bg-main);
	z-index: 20;
	transform: translate3d(100%, 0, 0);
	transition: transform .3s, visibility .3s, opacity .3s;
	visibility: hidden;
	opacity: 0;
	max-width: 375px;
}

@media screen and (max-width: 640px) {
	.mobile-menu {
		max-width: 100%;
		left: 0;
	}
}

.mobile-menu .wrapped {
	padding: 70px 0 20px;
}

@media screen and (max-width: 640px) {
	.mobile-menu .wrapped {
		padding: 20px 0;
	}
}

.mobile-menu .group {
	display: flex;
	align-items: center;
	margin-bottom: 35px;
}

/* .mobile-menu .item {
	width: 50%;
} */

.mobile-menu .btn {
	justify-content: center;
	padding: 17px 30px;
	line-height: 1.182;
}

.mobile-menu .list {
	display: flex;
	flex-direction: column;
	gap: 5px;
}

.mobile-menu .list li.active a, .mobile-menu .list li.active span {
	color: var(--color-dark);
	background-color: var(--color-active);
}

.mobile-menu .list a, .mobile-menu .list span {
	display: flex;
	align-items: center;
	font-weight: 500;
	font-size: 18px;
	line-height: 1.2223;
	padding: 14px 20px;
	color: var(--color-main);
}

.mobile-menu .list a {
	transition: background .3s, color .3s;
}

@media screen and (min-width: 1025px) {
	.mobile-menu .list a:hover {
		background-color: var(--color-active);
		color: var(--color-dark);
	}
}

.menu-heading {
	display: flex;
	align-items: center;
	gap: 0 10px;
	position: absolute;
	top: 20px;
	right: 20px;
}

@media screen and (max-width: 640px) {
	.menu-heading {
		position: static;
		inset: auto;
		margin-bottom: 35px;
		padding: 0 20px;
	}
}

.logo-mobile {
	flex-grow: 1;
	flex-shrink: 1;
	font-style: italic;
	font-weight: 900;
	font-size: 30px;
	text-transform: uppercase;
	line-height: 1;
	display: none;
	align-items: center;
	gap: 0 10px;
}

@media screen and (max-width: 640px) {
	.logo-mobile {
		display: flex;
	}
}

@media screen and (max-width: 390px) {
	.logo-mobile {
		font-size: 22px;
		gap: 0 5px;
	}
}

.logo-mobile a {
	cursor: pointer;
	display: flex;
	align-items: center;
	gap: 0 10px;
	color: var(--color-main);
}

@media screen and (max-width: 390px) {
	.logo-mobile a {
		gap: 0 10px;
	}
}

.logo-mobile span {
	color: var(--color-active);
}

.logo-mobile img {
	max-width: 18px;
	transform: rotate(10deg);
	transform-origin: center left;
}

@media screen and (max-width: 390px) {
	.logo-mobile img {
		max-width: 16px;
	}
}

.hamburger-mobile {
	display: flex;
	align-items: center;
	flex-grow: 0;
	flex-shrink: 0;
	background: none;
	cursor: pointer;
	color: var(--color-main);
	border: none;
	font-size: 24px;
	transition: color .3s;
}

@media screen and (min-width: 1025px) {
	.hamburger-mobile:hover {
		color: var(--color-active);
	}
}

@media screen and (max-width: 390px) {
	.hamburger-mobile {
		font-size: 22px;
	}
}

.mobile-headline {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 20px;
	padding: 0 20px;
}

.mobile-headline i {
	display: flex;
	align-items: center;
	flex-grow: 0;
	flex-shrink: 0;
	font-size: 30px;
	color: var(--color-active);
}

.mobile-headline span {
	font-weight: 600;
	font-size: 26px;
}

.user-auth {
	display: flex;
	position: relative;
}

@media screen and (max-width: 1460px) {
	.user-auth {
		display: none;
	}
}

.user-auth.show .drop-box {
	opacity: 1;
	transform: translate3d(0, 0, 0);
	visibility: visible;
}

.user-auth.show .user-btn {
	color: var(--color-active);
}

.user-auth.show .user-btn i svg {
	transform: rotate(180deg);
}

.user-btn,
.mobile-auth .button {
	display: flex;
	align-items: center;
	gap: 10px;
	cursor: pointer;
	background-color: transparent;
	border: none;
	color: var(--color-main);
	overflow: hidden;
	max-width: 100%;
	transition: color .3s;
}

@media screen and (min-width: 1025px) {
	.user-btn:hover,
	.mobile-auth .button:hover {
		color: var(--color-active);
	}
}

.user-btn .avatar,
.mobile-auth .button .avatar {
	flex-grow: 0;
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 50px;
	height: 50px;
	overflow: hidden;
	border-radius: 100%;
	font-size: 20px;
	background: var(--bg-main);
	color: var(--color-second);
}

.user-btn img,
.mobile-auth .button img {
	max-width: 100%;
	height: 100%;
	width: 100%;
	-o-object-fit: cover;
	   object-fit: cover;
}

.user-btn i,
.mobile-auth .button i {
	display: flex;
	align-items: center;
	font-size: 12px;
	flex-grow: 0;
	flex-shrink: 0;
}

.user-btn i svg,
.mobile-auth .button i svg {
	transition: transform .3s;
}

.drop-box {
	position: absolute;
	z-index: 10;
	border-radius: 10px 0 10px 10px;
	background: var(--bg-tools);
	box-shadow: var(--box-shadow-drop);
	min-width: 180px;
	right: 0;
	top: calc(100% + 15px);
	max-height: 240px;
	overflow-y: auto;
	opacity: 0;
	transform: translate3d(0, -10%, 0);
	visibility: hidden;
	transition: opacity .3s, transform .3s, visibility .3s;
}

.drop-link,
.hidden-box .link {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 10px 20px;
	font-weight: 500;
	font-size: 20px;
	color: var(--color-main);
}

.drop-link span,
.hidden-box .link span {
	font-size: 14px;
}

.drop-link.active,
.hidden-box .link.active {
	background-color: var(--color-active);
	color: var(--color-dark);
}

.hidden-box .link,
a.drop-link {
	transition: color .3s, background-color .3s;
}

@media screen and (min-width: 1025px) {
	.hidden-box .link:hover,
	a.drop-link:hover {
		background-color: var(--color-active);
		color: var(--color-dark);
	}
}

.mobile-auth {
	padding: 0 20px 0;
	margin-bottom: 35px;
}

.mobile-auth.show .hidden-box {
	display: block;
}

.mobile-auth.show .button {
	color: var(--color-active);
}

.mobile-auth.show .button .arrow {
	transform: rotate(180deg);
}

.mobile-auth .button {
	width: 100%;
}

@media screen and (max-width: 640px) {
	.mobile-auth .button {
		padding: 0;
	}
}

.mobile-auth .button span {
	flex-grow: 1;
	flex-shrink: 1;
	text-align: left;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.hidden-box {
	margin-top: 10px;
	display: none;
}

.main {
	flex-shrink: 1;
	flex-grow: 1;
}

.section {
	margin-bottom: 50px;
}

@media screen and (max-width: 991px) {
	.section {
		margin-bottom: 30px;
	}
}

.section:last-child {
	margin-bottom: 0;
}

.general-heading {
	text-align: center;
	margin-bottom: 30px;
}

@media screen and (max-width: 991px) {
	.general-heading {
		margin-bottom: 15px;
	}
}

.general-heading .title {
	font-weight: 700;
	font-size: 60px;
	text-transform: uppercase;
}

@media screen and (max-width: 1366px) {
	.general-heading .title {
		font-size: 54px;
	}
}

@media screen and (max-width: 991px) {
	.general-heading .title {
		font-size: 44px;
	}
}

@media screen and (max-width: 767px) {
	.general-heading .title {
		font-size: 34px;
	}
}

.general-heading .title span {
	position: relative;
	background: var(--bg-gradient-text);
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}

.general-heading .title span::after {
	content: '';
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	width: 100%;
	height: 2px;
	background: radial-gradient(ellipse at center, #ffcc00 0%, rgba(255, 204, 0, 0) 80%, rgba(255, 204, 0, 0) 100%);
}

.general-heading .sub {
	margin-top: 10px;
	font-size: 22px;
	color: var(--color-second);
}

@media screen and (max-width: 1366px) {
	.general-heading .sub {
		font-size: 20px;
	}
}

@media screen and (max-width: 767px) {
	.general-heading .sub {
		font-size: 18px;
	}
}

.general-grid {
	margin: -7px;
	font-size: 0;
}

@media screen and (max-width: 991px) {
	.general-grid {
		margin: 0;
	}
}

.general-grid .thumb {
	width: 32.8%;
	padding: 10px;
	display: inline-block;
	vertical-align: top;
	font-size: 16px;
}

@media screen and (max-width: 991px) {
	.general-grid .thumb {
		padding: 0;
	}
}

.general-grid .thumb.lg {
	width: 67.2%;
	float: left;
}

@media screen and (max-width: 991px) {
	.general-grid .thumb.lg {
		float: none;
	}
}

.general-grid .thumb.lg .media::before {
	top: auto;
	bottom: 0;
	height: 250px;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 19.11%, #000 100%);
}

.general-grid .thumb.lg .content {
	padding: 20px;
}

@media screen and (max-width: 991px) {
	.general-grid .thumb.lg .content {
		padding: 10px;
	}
}

.general-grid .thumb.lg .title {
	font-size: 40px;
}

@media screen and (max-width: 991px) {
	.general-grid .thumb.lg .title {
		font-size: 30px;
	}
}

.general-grid .swiper-wrapper {
	display: inline;
	overflow: hidden;
}

@media screen and (max-width: 991px) {
	.general-grid .swiper-wrapper {
		display: flex;
		overflow: visible;
	}
}

@media screen and (max-width: 991px) {
	.general-grid .swiper {
		margin: 0 -10px;
		padding: 0 10px;
	}
}

.general-grid .swiper-pagination {
	position: static;
	margin-top: 15px;
	align-items: center;
	justify-content: center;
	display: none;
}

@media screen and (max-width: 991px) {
	.general-grid .swiper-pagination {
		display: flex;
	}
}

.general-grid .swiper-pagination-bullet {
	width: 10px;
	height: 10px;
	background: var(--color-border);
	opacity: 1;
	transition: width .3s, height .3s;
}

.general-grid .swiper-pagination-bullet.swiper-pagination-bullet-active {
	background: var(--color-active);
	width: 14px;
	height: 14px;
}

.card {
	position: relative;
	border-radius: 10px;
	display: block;
	height: auto;
	width: 100%;
	overflow: hidden;
	padding-bottom: 56.661%;
	color: var(--color-main);
	transition: color .3s;
}

@media screen and (min-width: 1025px) {
	.card:hover {
		color: var(--color-active);
	}
}

@media screen and (max-width: 991px) {
	.card {
		min-height: 400px;
		padding-bottom: 0;
	}
}

.card .media {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	top: 0;
}

.card .media::before {
	position: absolute;
	z-index: 1;
	content: '';
	left: 0;
	right: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 19.11%, #000 100%);
}

.card img {
	position: absolute;
	bottom: 0;
	height: 100%;
	left: 0;
	-o-object-fit: cover;
	   object-fit: cover;
	right: 0;
	top: 0;
	width: 100%;
}

.card .content {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	z-index: 2;
	padding: 20px 15px;
}

@media screen and (max-width: 991px) {
	.card .content {
		display: flex;
		flex-direction: column-reverse;
		gap: 10px;
		padding: 10px;
	}
}

.card .title {
	font-weight: 600;
	font-size: 30px;
	line-height: 1.1;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	display: -webkit-box;
	overflow: hidden;
	text-overflow: ellipsis;
}

@media screen and (max-width: 1366px) {
	.card .title {
		font-size: 26px;
	}
}

@media screen and (max-width: 991px) {
	.card .title {
		font-size: 30px;
	}
}

@media screen and (max-width: 767px) {
	.card .title {
		-webkit-line-clamp: 2;
	}
}

.card .list {
	display: flex;
	align-items: center;
	gap: 10px;
	color: var(--color-main);
	margin-bottom: 5px;
}

.card .list li {
	display: flex;
	align-items: center;
	gap: 5px;
}

.card .list span {
	font-size: 16px;
}

.headline {
	margin-bottom: 25px;
	display: flex;
	flex-wrap: wrap;
	gap: 25px 20px;
	font-size: 40px;
	justify-content: space-between;
}

@media screen and (max-width: 991px) {
	.headline {
		font-size: 30px;
	}
}

@media screen and (max-width: 390px) {
	.headline {
		font-size: 22px;
	}
}

.headline .wrap {
	position: relative;
	display: flex;
	align-items: center;
	gap: 0 10px;
}

.headline .wrap::after {
	content: '';
	position: absolute;
	top: calc(100% + 7px);
	left: 0;
	right: 0;
	width: 100%;
	height: 2px;
	background: radial-gradient(ellipse at center, #ffcc00 0%, rgba(255, 204, 0, 0) 80%, rgba(255, 204, 0, 0) 100%);
}

.headline svg {
	color: var(--color-active);
	flex-grow: 0;
	flex-shrink: 0;
}

.headline .title {
	font-weight: 700;
	font-size: 50px;
	text-transform: uppercase;
}

@media screen and (max-width: 1366px) {
	.headline .title {
		font-size: 44px;
	}
}

@media screen and (max-width: 767px) {
	.headline .title {
		font-size: 34px;
	}
}

@media screen and (max-width: 390px) {
	.headline .title {
		font-size: 26px;
	}
}

.sort {
	display: flex;
	align-items: center;
	flex-grow: 0;
	flex-shrink: 0;
	font-weight: 500;
	font-size: 18px;
	border-radius: 10px;
	overflow: hidden;
}

@media screen and (max-width: 767px) {
	.sort {
		width: 100%;
	}
	.sort:not(.second) .item {
		width: 33.333%;
	}
	.sort .item {
		flex-shrink: 1;
		flex-grow: 1;
	}
}

.sort .item.active .link {
	background: var(--color-active);
	color: var(--bg-black);
}

.sort .link {
	display: flex;
	align-items: center;
	color: var(--color-second);
	background-color: var(--bg-tools);
	padding: 14px 30px;
	line-height: 1.2223;
}

@media screen and (max-width: 767px) {
	.sort .link {
		padding: 14px 5px;
		justify-content: center;
	}
}

@media screen and (max-width: 390px) {
	.sort .link {
		font-size: 14px;
	}
}

.sort a.link {
	transition: background .3s;
}

@media screen and (min-width: 1025px) {
	.sort a.link:hover {
		background: var(--color-active);
		color: var(--bg-black);
	}
}

.main-flex,
.video-flex {
	--flex-gap: 20px;
	display: flex;
	flex-wrap: wrap;
	gap: var(--flex-gap);
}

@media screen and (max-width: 991px) {
	.main-flex,
	.video-flex {
		--flex-gap: 10px;
		gap: 20px var(--flex-gap);
	}
}

.main-flex .th,
.video-flex .th {
	width: calc((100% / var(--flex-items)) - (((var(--flex-items) - 1) / var(--flex-items)) * var(--flex-gap)));
}

.main-flex {
	--flex-items: 3;
}

@media screen and (max-width: 767px) {
	.main-flex {
		--flex-items: 2;
	}
}

@media screen and (max-width: 480px) {
	.main-flex {
		--flex-items: 1;
	}
}

.video-flex {
	--flex-items: 2;
}

@media screen and (min-width: 1025px) {
	a.card-main:hover .title {
		color: var(--color-active);
	}
	a.card-main:hover .img {
		opacity: .9;
	}
}

.card-main {
	color: var(--color-main);
	display: flex;
	flex-direction: column;
	height: 100%;
	padding: 20px 10px;
	border-radius: 10px;
	box-shadow: 0 10px 11px 0 rgba(0, 0, 0, 0.3);
	background: rgba(0, 0, 0, 0.01);
}

@media screen and (min-width: 1025px) {
	.card-main:hover .swiper-button-next,
	.card-main:hover .swiper-button-prev {
		opacity: 1;
		transform: translate3d(0, -50%, 0) scale(1);
	}
}

@media screen and (min-width: 1025px) {
	.card-main .link-wrap:hover .title {
		color: var(--color-active);
	}
}

.card-main .title {
	font-weight: 600;
	font-size: 40px;
	line-height: 1.1;
	flex-grow: 1;
	flex-shrink: 1;
	color: var(--color-main);
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	display: -webkit-box;
	overflow: hidden;
	text-overflow: ellipsis;
	transition: color .3s;
}

@media screen and (max-width: 1366px) {
	.card-main .title {
		font-size: 36px;
	}
}

@media screen and (max-width: 991px) {
	.card-main .title {
		font-size: 30px;
	}
}

@media screen and (max-width: 390px) {
	.card-main .title {
		font-size: 24px;
	}
}

@media screen and (min-width: 1025px) {
	.card-main a.title:hover {
		color: var(--color-active);
	}
}

.card-main .sub {
	margin-top: 15px;
	font-weight: 400;
	font-size: 18px;
	line-height: 1.25;
	color: var(--color-second);
	flex-grow: 0;
	flex-shrink: 0;
	min-height: 7.25vh;
	-webkit-line-clamp: 4;
	-webkit-box-orient: vertical;
	display: -webkit-box;
	overflow: hidden;
	text-overflow: ellipsis;
}

@media screen and (max-width: 390px) {
	.card-main .sub {
		font-size: 16px;
		margin-top: 10px;
	}
}

.card-main .list {
	margin-top: 10px;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 5px 10px;
	color: var(--color-second);
}

.card-main .list span {
	font-size: 16px;
}

.card-main li {
	display: flex;
	align-items: center;
	gap: 5px;
}

.card-main .media {
	display: block;
	flex-grow: 0;
	flex-shrink: 0;
	position: relative;
	padding-bottom: 60.65%;
	border-radius: 10px;
	overflow: hidden;
	margin-top: 12px;
	background-color: var(--bg-field);
}

@media screen and (max-width: 390px) {
	.card-main .media {
		margin-top: 10px;
	}
}

.card-main .img {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
	-o-object-fit: cover;
	   object-fit: cover;
	transition: opacity .3s;
}

.card-main .checkbox-label {
	position: absolute;
	left: 10px;
	top: 10px;
	z-index: 3;
}

.card-main .checkbox {
	background: rgba(var(--bg-rgb-checkbox), 0.7);
}

.wrap-card {
	margin-top: 10px;
	position: relative;
}

.wrap-card .card-swiper {
	margin: 0;
}

.wrap-more,
.bottom-tools {
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top: 30px;
	gap: 20px;
}

@media screen and (max-width: 767px) {
	.wrap-more,
	.bottom-tools {
		margin-top: 20px;
	}
}

.wrap-more .btn,
.bottom-tools .btn {
	cursor: pointer;
	border: none;
	background-color: var(--bg-tools);
	border-radius: 10px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	font-weight: 500;
	color: var(--color-second);
	padding: 14px 50px;
	line-height: 1.2223;
	transition: color .3s, background-color .3s;
}

@media screen and (min-width: 1025px) {
	.wrap-more .btn:hover,
	.bottom-tools .btn:hover {
		color: var(--color-dark);
		background-color: var(--color-active);
	}
}

.wrap-more .btn span {
	font-size: 18px;
}

@media screen and (max-width: 410px) {
	.bottom-tools {
		gap: 0 10px;
	}
}

/* .bottom-tools input {
	display: none;
} */

@media screen and (max-width: 410px) {
	.bottom-tools .btn {
		padding: 14px 20px;
		font-size: 16px;
	}
}

.bottom-tools .btn.active {
	background-color: var(--color-active);
	color: var(--color-dark);
}

.bottom-tools .btn:disabled {
	opacity: .6;
	pointer-events: none;
	transition: opacity .3s;
}

.news-list {
	-moz-column-count: 2;
	     column-count: 2;
	-moz-column-gap: 50px;
	     column-gap: 50px;
}

@media screen and (max-width: 767px) {
	.news-list {
		-moz-column-count: 1;
		     column-count: 1;
	}
}
.news-list.second {
	column-count: 1;
}
.news-list li {
	font-weight: 600;
	font-size: 26px;
	line-height: 1.5;
}

@media screen and (max-width: 767px) {
	.news-list li {
		font-size: 24px;
	}
}
.news-list .wrap {
	margin-top: 5px;
	display: flex;
	align-items: center;
	gap: 5px;
	font-size: 18px;
	color: var(--color-second);
	font-weight: 400;
}
.news-list .wrap .added {
	font-size: 16px;
}
.news-list a {
	display: block;
	color: var(--color-main);
	transition: border-color .3s;
	margin-bottom: 20px;
	padding-bottom: 20px;
	border-bottom: 1px solid var(--color-border);
}

@media screen and (min-width: 1025px) {
	.news-list a:hover {
		border-color: var(--color-active);
	}
}
.news-list .title {
	font-size: 30px;
	margin-bottom: 10px;
}
.news-list .description {
	color: var(--color-second);
	font-size: 16px;
}
.headline-second {
	margin-bottom: 15px;
}

.headline-second .title {
	font-weight: 600;
	font-size: 30px;
}

@media screen and (max-width: 991px) {
	.headline-second .title {
		font-size: 26px;
	}
}

@media screen and (max-width: 767px) {
	.headline-second .title {
		font-size: 24px;
	}
}

.intro-desc {
	color: var(--color-second);
	line-height: 1.3;
}

@media screen and (max-width: 767px) {
	.intro-desc {
		font-size: 16px;
	}
}

.intro-desc p, .intro-desc ul {
	margin-bottom: 34px;
}

@media screen and (max-width: 767px) {
	.intro-desc p, .intro-desc ul {
		margin-bottom: 20px;
	}
}

.intro-desc p:last-child, .intro-desc ul:last-child {
	margin-bottom: 0;
}

.intro-desc .list {
	padding-left: 20px;
	list-style-type: disc;
}

.intro-desc li {
	margin-bottom: 12px;
}

.intro-desc li:last-child {
	margin-bottom: 0;
}

.pagination-list {
	display: flex;
	margin-top: 30px;
	justify-content: center;
}

.pagination-list .list {
	display: flex;
}

.pagination-list .list .item {
	margin-left: 6px;
}

@media screen and (max-width: 767px) {
	.pagination-list .list .item {
		display: none;
	}
}

.pagination-list .list .item:first-child {
	margin: 0;
}

@media screen and (max-width: 767px) {
	.pagination-list .list .item.active {
		display: block;
		margin: 0;
	}
}

.pagination-list .list .item.active a,
.pagination-list .list .item.active span {
	border-radius: 30px;
	pointer-events: none;
	color: var(--color-main);
	background: var(--color-border);
}

.pagination-list a,
.pagination-list .list span {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 10px;
	height: 50px;
	min-width: 50px;
	border-radius: 30px;
	background: var(--bg-tools);
	color: var(--color-second);
	font-weight: 500;
	transition: color .3s, background .3s;
}

@media screen and (min-width: 1025px) {
	.pagination-list a:hover {
		background: var(--color-active);
		color: var(--color-dark);
	}
}

.pagination-list .item.pager {
	display: flex;
	align-items: center;
}

.pagination-list .item.pager svg {
	font-size: 12px;
}

.pagination-list .item.pager .wrap {
	gap: 10px;
	padding: 10px 20px;
	min-width: 50px;
	font-weight: 500;
}

@media screen and (max-width: 991px) {
	.pagination-list .item.pager a span {
		display: none;
	}
}

.pagination-list .item.pager:first-child {
	margin-right: 20px;
}

@media screen and (max-width: 991px) {
	.pagination-list .item.pager:first-child {
		margin-right: 14px;
	}
}

.pagination-list .item.pager:last-child {
	margin-left: 20px;
}

@media screen and (max-width: 991px) {
	.pagination-list .item.pager:last-child {
		margin-left: 14px;
	}
}

.pagination-list .dots a, .pagination-list .dots span {
	background: none;
	display: flex;
	color: var(--color-second);
	justify-content: center;
	align-items: center;
	min-width: 34px;
	height: 100%;
}

@media screen and (min-width: 1025px) {
	.pagination-list .dots a:hover {
		color: var(--color-main);
	}
}

.twocolumns {
	display: flex;
	align-items: flex-start;
	gap: 30px 20px;
}

@media screen and (max-width: 1120px) {
	.twocolumns {
		flex-direction: column;
	}
}

.twocolumns .column {
	flex-grow: 1;
	flex-shrink: 1;
}

.twocolumns .column.second {
	flex-grow: 0;
	flex-shrink: 0;
	width: 370px;
}

@media screen and (max-width: 1120px) {
	.twocolumns .column.second,
	.twocolumns .column  {
		width: 100%;
	}
}

.twocolumns .row {
	margin-bottom: 10px;
}

@media screen and (max-width: 1120px) {
	.twocolumns .row {
		margin-bottom: 30px;
	}
}

.twocolumns .row:last-child {
	margin-bottom: 0;
}

.videoplayer {
	border-radius: 10px;
	/* display: block; */
	/* height: auto; */
	width: 100%;
	/* overflow: hidden; */
	/* position: relative; */
	/* padding-bottom: 56.022%; */
}

@media screen and (max-width: 1120px) {
	.videoplayer {
		margin: -20px -20px 0;
		width: auto;
		border-radius: 0;
	}
}

@media screen and (max-width: 991px) {
	.videoplayer {
		margin: -20px -10px 0;
	}
}

.videoplayer .media {
	position: absolute;
	bottom: 0;
	height: 100%;
	left: 0;
	-o-object-fit: cover;
	   object-fit: cover;
	right: 0;
	top: 0;
	width: 100%;
}

.videoplayer-adv {
	margin-top: 20px;
	display: flex;
	align-items: center;
	justify-content: center;
}

@media screen and (max-width: 480px) {
	.videoplayer-adv {
		margin-top: 10px;
	}
}

.videoplayer-adv .wrap {
	border-radius: 15px;
	overflow: hidden;
}

.videoplayer-adv img {
	max-width: 100%;
	height: auto;
}

.videoplayer .is-splash.kt-player .fp-ui:before, 
.videoplayer .is-poster.kt-player .fp-ui:before, 
.videoplayer .is-paused.kt-player .fp-ui:before{
	background-image: url('data:image/svg+xml,<svg width="120" height="120" viewBox="0 0 120 120" fill="none" xmlns="http://www.w3.org/2000/svg"><g opacity="0.8" clip-path="url(%23clip0_13_1237)"><path d="M60.002 6.10352e-05C93.1376 6.10352e-05 120.004 26.8584 120 60.002C120 93.1297 93.1376 119.984 60.002 119.984C26.8583 119.984 0 93.1337 0 60.002C3.10458e-05 26.8584 26.8583 8.5405e-05 60.002 6.10352e-05ZM54.875 39.5255C53.9606 38.8626 52.7464 38.7623 51.7441 39.2774C50.7339 39.7885 50.1035 40.8272 50.1035 41.9493V78.1631C50.1035 79.2972 50.7339 80.3317 51.7441 80.8428C52.1714 81.0585 52.6392 81.1661 53.1104 81.1661C53.7252 81.166 54.348 80.9703 54.875 80.5831L79.793 62.4864C80.5795 61.9074 81.038 61.0128 81.0381 60.0626C81.0421 59.0964 80.5714 58.2058 79.793 57.6387L54.875 39.5255Z" fill="%23FFBE00"/></g><defs><clipPath id="clip0_13_1237"><rect width="120" height="120" fill="white"/></clipPath></defs></svg>');
	background-repeat: no-repeat;
	background-position: center;
	opacity: 1;
	transform: scale(1);
	transition: transform .3s;
}
/* @media screen and (min-width: 1025px) {
	.videoplayer .is-mouseover.is-splash.kt-player .fp-ui:before, 
	.videoplayer .is-mouseover.is-poster.kt-player .fp-ui:before, 
	.videoplayer .is-mouseover.is-paused.kt-player .fp-ui:before {
		transform: scale(0.9);
	}
} */
 @media screen and (min-width: 1025px) {
	.videoplayer:hover .is-splash.kt-player .fp-ui:before, 
	.videoplayer:hover .is-poster.kt-player .fp-ui:before,
	.videoplayer:hover .is-paused.kt-player .fp-ui:before{
		transform: scale(0.9);
	}
}
/* @media screen and (max-width: 400px) {
	.videoplayer .is-splash.kt-player .fp-ui:before, 
	.videoplayer .is-poster.kt-player .fp-ui:before, 
	.videoplayer .is-paused.kt-player .fp-ui:before{
		background-size: 20%;
	}
} */
/* .btn-play {
	position: absolute;
	z-index: 3;
	top: 50%;
	left: 50%;
	transform: translate3d(-50%, -50%, 0) scale(1);
	font-size: 120px;
	background-color: transparent;
	border: none;
	cursor: pointer;
	display: flex;
	color: rgba(255, 190, 0, 0.8);
	align-items: center;
	justify-content: center;
	transition: background .3s, color .3s, transform .3s, font-size .3s;
} */

/* @media screen and (min-width: 1025px) {
	.btn-play:hover {
		transform: translate3d(-50%, -50%, 0) scale(0.95);
	}
}

@media screen and (max-width: 1366px) {
	.btn-play {
		font-size: 100px;
	}
}

@media screen and (max-width: 767px) {
	.btn-play {
		font-size: 75px;
	}
}

@media screen and (max-width: 480px) {
	.btn-play {
		font-size: 60px;
	}
} */

.video-tools {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-top: 20px;
}

@media screen and (max-width: 767px) {
	.video-tools {
		flex-wrap: wrap;
		gap: 5px;
	}
}

@media screen and (max-width: 480px) {
	.video-tools {
		margin-top: 10px;
	}
}

.video-tools .item {
	width: 25%;
}

@media screen and (max-width: 767px) {
	.video-tools .item {
		width: calc(50% - 3px);
	}
}

.video-tools .item.active .btn {
	color: var(--bg-black);
	background-color: var(--color-active);
}

.video-tools .btn {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	cursor: pointer;
	padding: 13px 8px;
	border-radius: 10px;
	font-size: 24px;
	font-weight: 500;
	background-color: var(--bg-video-tools);
	border: none;
	color: var(--color-main);
	transition: background-color .3s, color .3s;
}
.video-tools .btn.active {
	background-color: var(--color-active);
	color: var(--color-dark);
}

@media screen and (min-width: 1025px) {
	.video-tools .btn:hover {
		color: var(--bg-black);
		background-color: var(--color-active);
	}
}

@media screen and (max-width: 1366px) {
	.video-tools .btn {
		font-size: 20px;
	}
}

@media screen and (max-width: 767px) {
	.video-tools .btn {
		gap: 5px;
		font-size: 20px;
		line-height: 1.3334;
	}
}

.video-tools .btn span {
	font-size: 18px;
}

@media screen and (max-width: 1366px) {
	.video-tools .btn span {
		font-size: 16px;
	}
}

@media screen and (max-width: 390px) {
	.video-tools .btn span {
		display: none;
	}
}

.video-tools .btn svg {
	flex-grow: 0;
	flex-shrink: 0;
}

.tab-content {
	display: none;
	margin-top: 20px;
}

.tab-content.selected {
	display: block;
}

.tab-content .item {
	margin-bottom: 20px;
}

.tab-content .item:last-child {
	margin-bottom: 0;
}

.screen-box {
	--flex-gap: 10px;
	display: flex;
	flex-wrap: wrap;
	gap: var(--flex-gap);
	--flex-items: 4;
}

@media screen and (max-width: 767px) {
	.screen-box {
		--flex-items: 3;
	}
}

@media screen and (max-width: 480px) {
	.screen-box {
		--flex-items: 2;
	}
}

.screen-box .th {
	width: calc((100% / var(--flex-items)) - (((var(--flex-items) - 1) / var(--flex-items)) * var(--flex-gap)));
}

.screen-card {
	display: block;
	position: relative;
	padding-bottom: 50%;
	border-radius: 10px;
	overflow: hidden;
}

.screen-card img {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
	-o-object-fit: cover;
	   object-fit: cover;
	transition: opacity .3s;
}

.label-share {
	display: flex;
	flex-direction: column;
	width: 100%;
}

.label-share .text {
	margin-bottom: 5px;
	display: block;
	flex-grow: 0;
	flex-shrink: 0;
}

.label-share .input {
	line-height: 1.2223;
	color: var(--color-second);
	width: 100%;
	background-color: var(--bg-field);
	border-radius: 10px;
	border: none;
	padding: 14px 20px;
}

.video-title {
	font-weight: 600;
	font-size: 30px;
}

@media screen and (max-width: 767px) {
	.video-title {
		font-size: 26px;
	}
}

@media screen and (max-width: 480px) {
	.video-title {
		font-size: 24px;
	}
}

.video-title.second {
	margin-top: 20px;
}

.video-desc {
	margin-top: 20px;
	display: flex;
	flex-direction: column;
	gap: 20px;
}

@media screen and (max-width: 480px) {
	.video-desc {
		margin-top: 10px;
	}
}

.video-desc .text {
	padding-left: 30px;
	font-weight: 400;
	font-size: 20px;
	color: var(--color-second);
}

.video-desc .text a {
	color: var(--color-active);
	text-decoration: none;
}
@media screen and (min-width: 1025px) {
	.video-desc .text a:hover {
		text-decoration: underline;
	}
}

.video-desc.second {
	display: flex;
	flex-direction: row;
	align-items: center;
	flex-wrap: wrap;
}

.author-box {
	display: flex;
	align-items: center;
	gap: 10px;
}

.author-box .avatar {
	flex-grow: 0;
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 50px;
	height: 50px;
	overflow: hidden;
	border-radius: 10px;
	font-size: 20px;
	background: var(--bg-main);
	color: var(--color-second);
}

.author-box .avatar img {
	width: 100%;
	height: 100%;
	-o-object-fit: cover;
	   object-fit: cover;
	max-width: 100%;
}

.author-box .name {
	font-weight: 600;
	font-size: 18px;
	color: var(--color-main);
	transition: color .3s;
}

@media screen and (min-width: 1025px) {
	.author-box .name:hover {
		color: var(--color-active);
	}
}

.author-box .list {
	margin-top: 9px;
	display: flex;
	align-items: center;
	gap: 10px;
	color: var(--color-second);
	font-weight: 400;
}

.author-box .list li {
	display: flex;
	align-items: center;
	gap: 5px;
}

.author-box .list span {
	font-size: 16px;
}

.wrapped-categories {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
}

.video-categories {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 15px 10px;
}

.video-categories .name {
	flex-grow: 0;
	flex-shrink: 0;
	font-weight: 600;
	font-size: 18px;
	display: flex;
	align-items: center;
}

.video-categories .list {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px;
}

.video-categories li.active a {
	color: var(--color-dark);
	background-color: var(--color-active);
}

.video-categories a {
	font-weight: 500;
	font-size: 18px;
	color: var(--color-second);
	display: flex;
	align-items: center;
	border-radius: 10px;
	background-color: var(--bg-tools);
	padding: 14px 20px;
	line-height: 1.2223;
	transition: color .3s, background-color .3s;
}

@media screen and (min-width: 1025px) {
	.video-categories a:hover {
		color: var(--color-dark);
		background-color: var(--color-active);
	}
}

.screen-wrap.active .link {
	color: var(--color-dark);
	background-color: var(--color-active);
}

.screen-wrap .link {
	font-weight: 500;
	font-size: 18px;
	color: var(--color-second);
	display: flex;
	gap: 0 5px;
	align-items: center;
	border-radius: 10px;
	background-color: var(--bg-tools);
	padding: 14px 20px;
	line-height: 1.2223;
	transition: color .3s, background-color .3s;
}

@media screen and (min-width: 1025px) {
	.screen-wrap .link:hover {
		color: var(--color-dark);
		background-color: var(--color-active);
	}
}

.adv-place {
	margin-top: 30px;
	border-radius: 10px;
	padding: 10px 28px 25px;
	background-color: var(--bg-black);
}

@media screen and (max-width: 1120px) {
	.adv-place {
		display: none;
	}
}

.adv-place .text {
	font-weight: 400;
	font-size: 12px;
	letter-spacing: .3em;
	text-transform: uppercase;
	text-align: center;
	margin-bottom: 10px;
	color: var(--color-second);
}

.text-frame {
	margin-top: 20px;
	font-size: 20px;
}

.text-frame .wrap {
	padding: 0 20px;
	max-width: 790px;
	margin: 0 auto;
}

.text-frame p {
	margin-bottom: 20px;
}

.text-frame p:last-child {
	margin-bottom: 0;
}

.video-link {
	cursor: pointer;
	border: none;
	width: 100%;
	line-height: 1.25;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 10px 30px;
	font-size: 24px;
	text-transform: uppercase;
	color: var(--color-dark);
	background-color: var(--color-active);
	border-radius: 10px;
	transition: background-color .3s;
	margin-top: 20px;
}

@media screen and (min-width: 1025px) {
	.video-link:hover {
		background-color: var(--color-active-second);
	}
}

@media screen and (max-width: 767px) {
	.video-link {
		font-size: 22px;
	}
}

@media screen and (max-width: 480px) {
	.video-link {
		font-size: 20px;
	}
}

@media screen and (max-width: 390px) {
	.video-link {
		font-size: 15px;
	}
}

.video-link strong {
	font-weight: 700;
}

.spot {
	padding: 15px 30px 25px;
	background: var(--bg-tools);
	border-radius: 10px;
	overflow: hidden;
}

.spot .text {
	margin-bottom: 10px;
	font-weight: 400;
	font-size: 12px;
	letter-spacing: .3em;
	text-transform: uppercase;
	text-align: center;
	color: var(--color-second);
}

.spot .item {
	text-align: center;
	border-radius: 10px;
	overflow: hidden;
	margin-bottom: 10px;
}

.spot .item:last-child {
	margin-bottom: 0;
}

.spot img {
	max-width: 100%;
	height: auto;
}

.aside-content {
	background: var(--bg-tools);
	border-radius: 10px;
	padding: 20px;
	overflow: hidden;
	box-shadow: var(--box-shadow-drop);
}

@media screen and (max-width: 1120px) {
	.aside-content {
		margin: 0 -20px;
		border-radius: 0;
	}
}

@media screen and (max-width: 991px) {
	.aside-content {
		margin: 0 -10px;
	}
}

.aside-content .more {
	display: flex;
	align-items: center;
	color: var(--color-second);
	box-shadow: var(--box-shadow-more);
	background: var(--bg-main);
	font-weight: 500;
	font-size: 18px;
	cursor: pointer;
	border: none;
	padding: 14px 20px;
	line-height: 1.2223;
	width: 100%;
	justify-content: center;
	margin-top: 18px;
	border-radius: 10px;
	transition: color .3s, background-color .3s;
}

@media screen and (min-width: 1025px) {
	.aside-content .more:hover {
		color: var(--color-dark);
		background-color: var(--color-active);
	}
}

@media screen and (max-width: 1366px) {
	.aside-content .more {
		width: auto;
		margin: 18px auto 0;
	}
}

@media screen and (max-width: 480px) {
	.aside-content .more {
		width: 100%;
		margin: 22px 0 0;
	}
}

.aside-title,
.comment-title {
	margin-bottom: 20px;
	display: flex;
	align-items: flex-start;
	gap: 20px;
}

.aside-title .wrap,
.comment-title .wrap {
	position: relative;
}

.aside-title .wrap::after,
.comment-title .wrap::after {
	content: '';
	position: absolute;
	top: calc(100% + 7px);
	left: 0;
	right: 0;
	width: 100%;
	height: 2px;
	background: radial-gradient(ellipse at center, #ffcc00 0%, rgba(255, 204, 0, 0) 80%, rgba(255, 204, 0, 0) 100%);
}

.aside-title .title,
.comment-title .title {
	font-weight: 600;
	font-size: 30px;
}

@media screen and (max-width: 767px) {
	.aside-title .title,
	.comment-title .title {
		font-size: 26px;
	}
}

@media screen and (max-width: 480px) {
	.aside-title .title,
	.comment-title .title {
		font-size: 24px;
	}
}

@media screen and (max-width: 767px) {
	.comment-title {
		flex-direction: column;
	}
	.comment-title .add-comment {
		width: 100%;
	}
}

.aside-title {
	flex-direction: column;
}

.aside-title .add-comment {
	width: 100%;
}

.add-comment,
.enter-box .submit {
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 500;
	font-size: 18px;
	color: var(--color-dark);
	background-color: var(--color-active);
	border-radius: 10px;
	padding: 10px 20px;
	border: none;
	cursor: pointer;
	line-height: 1.1112;
	transition: background-color .3s;
}

@media screen and (min-width: 1025px) {
	.add-comment:hover,
	.enter-box .submit:hover {
		background-color: var(--color-active-second);
	}
}

@media screen and (max-width: 1120px) {
	.add-comment,
	.enter-box .submit {
		width: auto;
	}
}

@media screen and (max-width: 480px) {
	.add-comment,
	.enter-box .submit {
		width: 100%;
	}
}

.wrapped-list {
	padding: 0 50px;
}

@media screen and (max-width: 767px) {
	.wrapped-list {
		padding: 0;
	}
}

.comments-list .item {
	margin-bottom: 20px;
}

.comments-list .item:last-child {
	margin-bottom: 0;
}

.comments-list .item .item {
	margin-top: 20px;
	padding-left: 20px;
	border-left: 2px solid var(--color-active);
}

.comments-list .head {
	display: flex;
	align-items: center;
	gap: 10px;
}

.comments-list .name {
	font-weight: 600;
	font-size: 20px;
	color: var(--color-main);
	transition: color .3s;
}

@media screen and (min-width: 1025px) {
	.comments-list .name:hover {
		color: var(--color-active);
	}
}

.comments-list .date {
	display: flex;
	align-items: center;
	font-weight: 400;
	color: var(--color-second);
	gap: 5px;
}

.comments-list .date span {
	font-size: 16px;
}

.comments-list .comment {
	margin-top: 10px;
	font-weight: 500;
	font-size: 18px;
	color: var(--color-second);
}

.comments-list .tools {
	margin-top: 10px;
	display: flex;
	align-items: center;
	gap: 0 15px;
}

.comments-list .btn {
	cursor: pointer;
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 20px;
	background-color: transparent;
	border: none;
	color: var(--color-second);
	transition: color .3s;
}

@media screen and (min-width: 1025px) {
	.comments-list .btn:hover {
		color: var(--color-active);
	}
}

.comments-list .btn.active {
	color: var(--color-active);
}

.comments-list .btn span {
	font-weight: 500;
	font-size: 18px;
}

.wrap-comment {
	display: flex;
	align-items: center;
	gap: 10px 20px;
	margin-top: 10px;
}

.wrap-comment .comment {
	flex-grow: 1;
	flex-shrink: 1;
	margin: 0;
}

.enter-box {
	display: none;
	margin-bottom: 20px;
}

.enter-box.second .submit {
	width: auto;
}

.enter-box.active {
	display: block;
}

.enter-box .box {
	margin-bottom: 20px;
}

.enter-box .box:last-child {
	margin-bottom: 0;
}

.enter-box .textarea,
.enter-box .input {
	line-height: 1.2223;
	color: var(--color-main);
	width: 100%;
	background-color: var(--bg-field);
	border-radius: 10px;
	border: none;
}

.enter-box .input {
	padding: 14px 20px;
}

.enter-box .textarea {
	resize: none;
	height: 100px;
	padding: 20px;
}

.enter-box .submit {
	width: 100%;
}

.gallery-list {
	margin-top: 20px;
}

.gallery-list .item {
	margin-bottom: 20px;
	display: block;
}

@media screen and (max-width: 480px) {
	.gallery-list .item {
		margin-bottom: 10px;
	}
}

.gallery-list .item:last-child {
	margin-bottom: 0;
}

.gallery-list .media {
	border-radius: 10px;
	max-width: 100%;
	width: 100%;
	height: auto;
}

.block-profile {
	display: flex;
	align-items: flex-start;
	gap: 20px;
}

@media screen and (max-width: 991px) {
	.block-profile {
		flex-direction: column;
	}
}

.viewlist {
	flex-grow: 1;
	flex-shrink: 1;
}

.viewlist .list {
	-moz-column-count: 3;
	     column-count: 3;
	font-size: 16px;
	margin-bottom: 20px;
	line-height: 1.396;
}

@media screen and (max-width: 767px) {
	.viewlist .list {
		-moz-column-count: 2;
		     column-count: 2;
	}
}

@media screen and (max-width: 390px) {
	.viewlist .list {
		font-size: 14px;
	}
}
.viewlist .list a {
	color: var(--color-main);
}
@media screen and (min-width: 1025px) {
	.viewlist .list a:hover {
		color: var(--color-active);
	}
}
.viewlist .list li {
	margin-bottom: 10px;
}

.viewlist .list li:last-child {
	margin-bottom: 0;
}

.viewlist .list span {
	color: var(--color-second);
}

.viewlist .text {
	font-size: 20px;
}

@media screen and (max-width: 390px) {
	.viewlist .text {
		font-size: 18px;
	}
}

.posted-model {
	flex-grow: 0;
	flex-shrink: 0;
	max-width: 186px;
	overflow: hidden;
	width: 100%;
}
.posted-model .avatar {
	position: absolute;
    left: 50%;
    top: 50%;
    transform: translate3d(-50%, -50%, 0);
    font-size: 60px;
}
@media screen and (max-width: 991px) {
	.posted-model {
		margin: 0 auto;
	}
}

.posted-model .wrap {
	padding-bottom: 149.466%;
	position: relative;
	border-radius: 10px;
	overflow: hidden;
	background-color: var(--bg-tools);
}

.posted-model img {
	position: absolute;
	object-fit: cover;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
}

.headline-profile {
	display: flex;
	align-items: flex-start;
	margin-bottom: 20px;
	gap: 20px;
}

@media screen and (max-width: 767px) {
	.headline-profile {
		flex-direction: column;
		align-items: center;
	}
}

.headline-profile .wrap {
	flex-grow: 1;
	flex-shrink: 1;
}

.headline-profile .title {
	font-weight: 700;
	font-size: 36px;
	line-height: 1;
	text-transform: uppercase;
}

@media screen and (max-width: 390px) {
	.headline-profile .title {
		font-size: 32px;
	}
}

.headline-profile .tools {
	flex-grow: 0;
	flex-shrink: 0;
	display: flex;
	align-items: center;
	gap: 10px;
}

.headline-profile .btn {
	display: flex;
	align-items: center;
	font-size: 26px;
	color: var(--color-second);
	background-color: var(--bg-tools);
	border: none;
	cursor: pointer;
	padding: 12px;
	border-radius: 10px;
	transition: color .3s, background-color .3s;
}

@media screen and (min-width: 1025px) {
	.headline-profile .btn:hover {
		color: var(--color-dark);
		background-color: var(--color-active);
	}
}

.headline-list {
	margin-top: 6px;
	display: flex;
	align-items: center;
	gap: 10px;
	color: var(--color-second);
}

@media screen and (max-width: 767px) {
	.headline-list {
		justify-content: center;
	}
}

.headline-list li {
	display: flex;
	align-items: center;
	gap: 5px;
}

.btn-edit {
	display: flex;
	align-items: center;
	gap: 10px;
	background-color: var(--color-active);
	color: var(--color-dark);
	padding: 12px 30px;
	border: none;
	cursor: pointer;
	border-radius: 10px;
	font-size: 20px;
	line-height: 1.3;
	transition: background-color .3s;
}

@media screen and (min-width: 1025px) {
	.btn-edit:hover {
		background-color: var(--color-active-second);
	}
}

@media screen and (max-width: 390px) {
	.btn-edit {
		padding: 12px;
		font-size: 26px;
	}
	.btn-edit span {
		display: none;
	}
}

@media screen and (max-width: 767px) {
	.wrap-list {
		margin: 0 -10px;
	}
}

.wrap-list .list {
	margin-top: 20px;
	display: flex;
	align-items: center;
}

@media screen and (max-width: 767px) {
	.wrap-list .list {
		overflow: auto;
		padding: 0 10px;
	}
}

.wrap-list .list li {
	width: 20%;
	font-weight: 500;
}

@media screen and (max-width: 767px) {
	.wrap-list .list li {
		width: auto;
	}
}

.wrap-list .list li.active a, .wrap-list .list li.active span {
	background-color: var(--color-active);
	color: var(--color-dark);
}

.wrap-list .list li:first-child a, .wrap-list .list li:first-child span {
	border-radius: 10px 0 0 10px;
}

.wrap-list .list li:last-child a, .wrap-list .list li:last-child span {
	border-radius: 0 10px 10px 0;
}

.wrap-list .list a, .wrap-list .list span {
	display: flex;
	gap: 5px;
	align-items: center;
	justify-content: center;
	padding: 14px 20px;
	line-height: 1.2223;
	width: 100%;
	background: var(--bg-tools);
	color: var(--color-second);
}

.wrap-list .list a {
	transition: color .3s, background .3s;
}

@media screen and (min-width: 1025px) {
	.wrap-list .list a:hover {
		background-color: var(--color-active);
		color: var(--color-dark);
	}
}

@media screen and (max-width: 767px) {
	.wrap-list .list a, .wrap-list .list span {
		white-space: nowrap;
	}
}
.card-swiper {
	margin-top: 10px;
	padding-bottom: 24px;
	width: 100%;
}

.card-swiper .swiper-pagination {
	bottom: 0;
	display: flex;
	align-items: center;
	justify-content: center;
}

.card-swiper .swiper-pagination-bullet {
	margin: 0;
	width: 10px;
	height: 10px;
	background-color: var(--color-border);
	opacity: 1;
}

.card-swiper .swiper-pagination-bullet.swiper-pagination-bullet-active {
	background-color: var(--color-active);
	width: 14px;
	height: 14px;
}

.card-swiper .media {
	margin: 0;
}

.card-swiper svg {
	width: 1em;
	height: 1em;
}

.card-swiper .swiper-button-next,
.card-swiper .swiper-button-prev {
	width: 50px;
	height: 50px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 30px;
	backdrop-filter: blur(15px);
	background: rgba(var(--bg-rgb-modal), 0.8);
	border-radius: 100%;
	overflow: hidden;
	font-size: 14px;
	color: var(--color-second);
	top: calc(50% - 12px);
	margin: 0;
	transform: translate3d(0, -50%, 0) scale(0.8);
	transition: background-color .3s, color .3s, opacity .3s, transform .3s;
	opacity: 0;
}

@media screen and (min-width: 1025px) {
	.card-swiper .swiper-button-next:hover,
	.card-swiper .swiper-button-prev:hover {
		background-color: var(--color-active);
		color: var(--color-dark);
	}
}

@media screen and (max-width: 1024px) {
	.card-swiper .swiper-button-next,
	.card-swiper .swiper-button-prev {
		opacity: 1;
	}
}

.card-swiper .swiper-button-next.swiper-button-disabled,
.card-swiper .swiper-button-prev.swiper-button-disabled {
	display: none;
}

.card-swiper .swiper-button-next::after,
.card-swiper .swiper-button-prev::after {
	display: none;
}

.card-swiper .swiper-button-next {
	right: 10px;
}

.card-swiper .swiper-button-prev {
	left: 10px;
}

.tab-upload {
	display: none;
}

.tab-upload.selected {
	display: block;
}

.upload-list {
	display: flex;
	align-items: center;
	margin-bottom: 30px;
	gap: 5px;
}

@media screen and (max-width: 767px) {
	.upload-list {
		margin-bottom: 15px;
	}
}

.upload-list li {
	line-height: 1.2223;
	font-weight: 500;
	font-size: 18px;
	display: flex;
	align-items: center;
	gap: 10px;
}
.upload-list li a:not(.link) {
	color: var(--color-active);
}
@media screen and (min-width: 1025px) {
	.upload-list li a:not(.link):hover {
		color: var(--color-active-second);
	}
}

@media screen and (max-width: 480px) {
	.upload-list li {
		width: 50%;
	}
}

.upload-list li.active .link {
	background-color: var(--color-active);
	color: var(--color-dark);
}

.upload-list li:first-child {
	border-radius: 10px 0 0 10px;
	overflow: hidden;
}

.upload-list li:last-child {
	border-radius: 0 10px 10px 0;
	overflow: hidden;
}

.upload-list .link {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 14px 30px;
	color: var(--color-second);
	transition: color .3s, background-color .3s;
}

@media screen and (min-width: 1025px) {
	.upload-list .link:hover {
		background-color: var(--color-active);
		color: var(--color-dark);
	}
}

@media screen and (max-width: 480px) {
	.upload-list .link {
		width: 100%;
		padding: 14px;
	}
}

.upload-text {
	font-size: 20px;
	margin-bottom: 50px;
}

@media screen and (max-width: 767px) {
	.upload-text {
		margin-bottom: 30px;
	}
}

@media screen and (max-width: 390px) {
	.upload-text {
		font-size: 18px;
	}
}

.upload-cols {
	display: flex;
	gap: 50px;
}

@media screen and (max-width: 1366px) {
	.upload-cols {
		gap: 50px 30px;
	}
}

@media screen and (max-width: 991px) {
	.upload-cols {
		flex-direction: column;
	}
}

.upload-cols .col {
	flex-grow: 1;
	flex-shrink: 1;
}

@media screen and (max-width: 1366px) {
	.upload-cols .col {
		width: 60%;
	}
}

@media screen and (max-width: 991px) {
	.upload-cols .col {
		width: 100%;
	}
}

.upload-cols .col.second {
	max-width: 570px;
	width: 100%;
	flex-grow: 0;
	flex-shrink: 0;
}

@media screen and (max-width: 1366px) {
	.upload-cols .col.second {
		width: 40%;
		flex-grow: 1;
		flex-shrink: 1;
		max-width: 100%;
	}
}

@media screen and (max-width: 991px) {
	.upload-cols .col.second {
		width: 100%;
	}
}

.upload-cols .content {
	line-height: 1.5;
}

.upload-cols .row {
	margin-bottom: 20px;
}

.upload-cols .row:last-child {
	margin-bottom: 0;
}

.upload-title,
.section-title {
	font-weight: 700;
	font-size: 36px;
	text-transform: uppercase;
	margin-bottom: 20px;
	display: block;
}

@media screen and (max-width: 767px) {
	.upload-title,
	.section-title {
		font-size: 30px;
	}
}

.upload-desc {
	font-size: 20px;
}

@media screen and (max-width: 390px) {
	.upload-desc {
		font-size: 18px;
	}
}

.upload-desc p {
	margin-bottom: 20px;
}

.upload-desc p:last-child {
	margin-bottom: 0;
}

.radio-block .input {
	line-height: 1.2223;
	color: var(--color-main);
	width: 100%;
	border-radius: 10px;
	border: none;
	font-size: 16px;
	padding: 10px 20px;
	height: 50px;
	background-color: var(--bg-field);
}

.radio-block .label-choice {
	margin-bottom: 10px;
	display: block;
}

.radio-info {
	cursor: pointer;
	display: inline-block;
	vertical-align: top;
	position: relative;
	color: var(--color-main);
	padding-left: 30px;
	font-size: 18px;
}

.radio-info::before {
	position: absolute;
	content: '';
	width: 20px;
	height: 20px;
	background: var(--bg-field);
	border-radius: 100%;
	left: 0;
	transition: .3s;
	top: 50%;
	transform: translate3d(0, -50%, 0);
}

.radio-info::after {
	position: absolute;
	content: '';
	width: 8px;
	height: 8px;
	background: var(--color-dark);
	border-radius: 50%;
	top: 50%;
	left: 6px;
	transition: background .4s, opacity .3s;
	transform: translate3d(0, -50%, 0);
	z-index: 2;
	opacity: 0;
}

.input-choice {
	display: none;
}

.input-choice:checked + .radio-info::before {
	background-color: var(--color-active);
}

.input-choice:checked + .radio-info::after {
	opacity: 1;
}

.upload-bar {
	margin-bottom: 50px;
}

@media screen and (max-width: 767px) {
	.upload-bar {
		margin-bottom: 30px;
	}
}

.upload-bar .text {
	text-align: center;
	font-weight: 700;
	font-size: 24px;
	margin-bottom: 15px;
}

.upload-bar .line {
	width: 100%;
	background-color: var(--bg-field);
	height: 8px;
	border-radius: 20px;
	position: relative;
}

.upload-bar .line-active {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	height: 100%;
	background: var(--color-active);
	border-radius: 20px;
}

.section-one {
	flex-grow: 1;
	flex-shrink: 1;
	width: calc(100% - 456px);
}

@media screen and (max-width: 991px) {
	.section-one {
		width: 100%;
		order: -1;
	}
}

.section-one.show .list-selector-popup {
	display: block;
}
.section-two.secondary {
	margin-left: 0;
	margin-top: 20px;
	max-width: 100%;
	flex-grow: 1;
	flex-shrink: 1;
}
.section-two {
	max-width: 426px;
	width: 100%;
	flex-grow: 0;
	flex-shrink: 0;
	margin-left: 30px;
}
.section-two img {
	max-width: 100%;
	width: 100%;
	height: auto;
}
@media screen and (max-width: 991px) {
	.section-two {
		margin-left: 0;
		margin-top: 50px;
		max-width: 100%;
	}
	.section-two .card-main {
		max-width: 426px;
		width: 100%;
	}
}

.two-sections {
	display: flex;
	align-items: flex-start;
	flex-wrap: wrap;
}

@media screen and (max-width: 991px) {
	.two-sections {
		flex-direction: column;
	}
}

.two-sections .textfield,
.two-sections .textarea {
	width: 100%;
	border-radius: 10px;
	background: var(--bg-field);
	color: var(--color-main);
	padding: 10px 20px;
}

.two-sections .textarea {
	border: 1px solid var(--border-textarea);
	resize: none;
	height: 104px;
}

.two-sections .textfield {
	border: none;
	height: 50px;
}

.two-sections .row {
	margin-bottom: 30px;
	position: relative;
}

@media screen and (max-width: 767px) {
	.two-sections .row {
		margin-bottom: 20px;
	}
}

.two-sections .row:last-child {
	margin-bottom: 0;
}

.field-label {
	display: block;
	margin-bottom: 10px;
}

.file-control {
	position: relative;
	width: 100%;
}

@media screen and (min-width: 1025px) {
	.file-control:hover .textfield {
		box-shadow: 0 0 0 2px inset var(--color-active);
	}
}

.file-control .textfield {
	padding-right: 100px;
	transition: box-shadow .3s;
}

@media screen and (max-width: 390px) {
	.file-control .textfield {
		font-size: 16px;
	}
}

.file-control .textfield.second {
	color: var(--color-second);
	white-space: nowrap;
	text-overflow: ellipsis;
}

.file-control .file {
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	padding: 0;
	opacity: 0;
	width: 100%;
	z-index: 10;
	transform: none;
	transition: border .3s, color .3s;
}

.file-control .button {
	display: flex;
	align-items: center;
	position: absolute;
    right: 5px;
    top: 5px;
    border-radius: 10px;
    text-align: center;
    font-weight: 500;
    padding: 6px 20px;
	min-height: 40px;
    font-size: 18px;
    color: var(--color-dark);
    background-color: var(--color-active);
	z-index: 2;
	transition: background-color .3s;
}

.bottom {
	width: 100%;
	margin-top: 30px;
}

@media screen and (max-width: 991px) {
	.bottom {
		order: -1;
		margin-top: 20px;
	}
}

.bottom .submit {
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 500;
	font-size: 22px;
	padding: 11px 30px;
	line-height: 1.273;
	border: none;
	font-family: inherit;
	background: var(--color-active);
	border-radius: 10px;
	color: var(--color-dark);
	cursor: pointer;
	transition: background .3s;
}

@media screen and (min-width: 1025px) {
	.bottom .submit:hover {
		background-color: var(--color-active-second);
	}
}

.list-selector-popup {
	position: absolute;
	width: 100%;
	height: 160px;
	left: 0;
	bottom: 52px;
	border-radius: 10px;
	z-index: 10000;
	background-color: var(--color-dark);
	box-shadow: var(--box-shadow-drop);
}

.list-selector-popup .filter {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	background: none;
	z-index: 4;
}

.list-selector-popup input {
	width: 100%;
	height: 100%;
	padding: 8px 10px;
	border: none;
	background-color: var(--bg-main);
	color: var(--color-main);
	font-weight: inherit;
	font-size: 16px;
	font-family: inherit;
}

.list-selector-popup .checkbox {
	display: none;
}

.list-selector-popup .checkbox:checked + label::before {
	background-color: var(--color-active);
}

.list-selector-popup .checkbox:checked + label::after {
	opacity: 1;
}

.list-selector-popup label {
	color: var(--color-main);
	font-size: 12px;
	cursor: pointer;
	position: relative;
	padding: 0 0 0 25px;
}

.list-selector-popup label::before {
	content: "";
	position: absolute;
	left: 0;
	top: -2px;
	z-index: 2;
	width: 20px;
	height: 20px;
	border-radius: 5px;
	border: 1px solid var(--color-active);
	transition: background-color .3s, border .3s, color .3s;
}

.list-selector-popup label::after {
	content: "";
	position: absolute;
	opacity: 0;
	transition: opacity .2s;
	left: 7px;
	top: 2px;
	width: 6px;
	height: 10px;
	z-index: 10;
	border: solid var(--color-dark);
	border-width: 0 2px 2px 0;
	transform: rotate(45deg);
}

.button-group {
	overflow-y: auto;
	overflow-x: hidden;
	position: absolute;
	top: 8px;
	left: 8px;
	bottom: 30px;
	right: 8px;
}

.button-group .item {
	display: inline-block;
	width: 31%;
	padding: 3px 0 10px;
	vertical-align: top;
}

@media screen and (max-width: 480px) {
	.button-group .item {
		width: 45%;
	}
}

.sticky-chat {
	cursor: pointer;
	position: fixed;
	z-index: 5;
	right: 30px;
	bottom: 30px;
	background: var(--color-active);
	color: var(--color-dark);
	border: none;
	font-size: 24px;
	border-radius: 10px;
	width: 50px;
	height: 50px;
	display: flex;
	justify-content: center;
	align-items: center;
	opacity: 0;
	visibility: hidden;
	transform: scale(0.2);
	transition: opacity .3s, visibility .3s, transform .3s, background-color .3s;
}

@media screen and (min-width: 1025px) {
	.sticky-chat:hover {
		background-color: var(--color-active-second);
	}
}

.sticky-chat[data-attr-sticky-chat="true"] {
	transform: scale(1);
	opacity: 1;
	visibility: visible;
}

.footer {
	margin-top: 50px;
	flex-shrink: 0;
	flex-grow: 0;
}

@media screen and (max-width: 991px) {
	.footer {
		margin-top: 30px;
	}
}

.adv-spot {
	background-color: var(--bg-black);
	border-radius: 10px;
	padding: 15px 50px 50px;
}

.adv-spot .spots {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 20px 70px;
}

@media screen and (max-width: 991px) {
	.adv-spot .spots {
		gap: 20px;
	}
}

.adv-spot img {
	max-width: 100%;
	-o-object-fit: cover;
	   object-fit: cover;
	border-radius: 10px;
	width: 100%;
	height: auto;
}

.adv-spot .text {
	font-size: 12px;
	letter-spacing: .3em;
	text-transform: uppercase;
	text-align: center;
	margin-bottom: 15px;
	color: var(--color-text-spot);
}

.footer-holder {
	margin-top: 50px;
	padding: 30px;
	background: var(--bg-black);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px 40px;
}

@media screen and (max-width: 991px) {
	.footer-holder {
		flex-direction: column;
		padding: 20px;
		text-align: center;
		margin-top: 30px;
	}
}

.footer-holder .col {
	flex-grow: 0;
	flex-shrink: 0;
}

.footer-holder .col.second {
	flex-grow: 1;
	flex-shrink: 1;
	text-align: end;
}

@media screen and (max-width: 991px) {
	.footer-holder .col.second {
		text-align: center;
	}
}

.footer-holder .list {
	margin-top: 22px;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	font-weight: 500;
	font-size: 16px;
	text-transform: uppercase;
	gap: 12px 45px;
}
.footer-holder .list li.active span {
	color: var(--color-active);
}
@media screen and (max-width: 991px) {
	.footer-holder .list {
		justify-content: center;
	}
}

.footer-holder .list a {
	color: var(--color-main);
	transition: color .3s;
}

@media screen and (min-width: 1025px) {
	.footer-holder .list a:hover {
		color: var(--color-active);
	}
}

@media screen and (max-width: 991px) {
	.footer-holder .col.second {
		display: flex;
		flex-direction: column-reverse;
		align-items: center;
	}
}

.footer-logo {
	font-style: italic;
	font-weight: 900;
	font-size: 30px;
	text-transform: uppercase;
	line-height: 1.2;
	display: flex;
	align-items: center;
	gap: 0 10px;
}

@media screen and (max-width: 991px) {
	.footer-logo {
		justify-content: center;
	}
}

@media screen and (max-width: 390px) {
	.footer-logo {
		font-size: 26px;
		gap: 0 5px;
	}
}

.footer-logo span {
	color: var(--color-active);
}

.footer-logo img {
	max-width: 18px;
	transform: rotate(10deg);
	transform-origin: center left;
}

@media screen and (max-width: 390px) {
	.footer-logo img {
		max-width: 17px;
	}
}

.copyright {
	font-size: 14px;
	line-height: 1.2;
	color: var(--color-second);
}

.modal-box {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	min-width: 1px;
	z-index: 99;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.3s, visibility 0.3s;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 10px;
	backdrop-filter: blur(15px);
	background: rgba(var(--bg-rgb-modal), 0.8);
}

.modal-box.show {
	opacity: 1;
	visibility: visible;
}

.modal-content,
.modal-comment {
	width: 100%;
	padding: 50px;
	border-radius: 10px;
	max-height: 100%;
	overflow: auto;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	transition: transform 0.3s;
	position: relative;
	margin: auto;
}

@media screen and (max-width: 767px) {
	.modal-content,
	.modal-comment {
		padding: 20px;
	}
}

.modal-content .input,
.modal-content .textarea,
.modal-comment .input,
.modal-comment .textarea {
	line-height: 1.2223;
	color: var(--color-main);
	background-color: var(--bg-field);
	width: 100%;
	border-radius: 10px;
	border: none;
	font-size: 16px;
}

.modal-content .input,
.modal-comment .input {
	height: 50px;
	padding: 14px 20px;
}

.modal-content .textarea,
.modal-comment .textarea {
	resize: none;
	padding: 20px;
}

.modal-content .close,
.modal-comment .close {
	display: flex;
	align-items: center;
	justify-content: center;
	position: absolute;
	top: 0;
	right: 0;
	z-index: 8041;
	padding: 20px;
	background-color: transparent;
	cursor: pointer;
	border: none;
	color: var(--color-main);
	font-size: 20px;
	transition: color .3s, transform .3s;
}

@media screen and (min-width: 1025px) {
	.modal-content .close:hover,
	.modal-comment .close:hover {
		color: var(--color-active);
	}
}

.modal-content .row,
.modal-comment .row {
	margin-bottom: 20px;
}

.modal-content .row:last-child,
.modal-comment .row:last-child {
	margin-bottom: 0;
}

.modal-comment {
	max-width: 590px;
	background-color: var(--bg-tools);
	box-shadow: var(--box-shadow-drop);
}

.modal-comment .checkbox-label {
	line-height: 1.1;
	display: flex;
}

.modal-comment .title {
	font-size: 40px;
	padding: 0 20px;
	text-align: center;
	margin-bottom: 20px;
	line-height: 1;
}

@media screen and (max-width: 767px) {
	.modal-comment .title {
		font-size: 30px;
	}
}

.modal-comment .title span {
	position: relative;
}

.modal-comment .title span::after {
	content: '';
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	width: 100%;
	height: 2px;
	background: radial-gradient(ellipse at center, #ffcc00 0%, rgba(255, 204, 0, 0) 80%, rgba(255, 204, 0, 0) 100%);
}

.modal-comment .textarea {
	height: 100px;
	display: block;
}

.modal-comment .submit {
	display: inline-block;
	vertical-align: middle;
	padding: 14px 50px;
	background-color: var(--color-active);
	color: var(--color-dark);
	cursor: pointer;
	border: none;
	font-weight: 500;
	border-radius: 10px;
	line-height: 1.2223;
	transition: background-color .3s;
}

@media screen and (min-width: 1025px) {
	.modal-comment .submit:hover {
		background-color: var(--color-active-second);
	}
}

.modal-comment .wrap {
	text-align: center;
}

.modal-comment .checkbox-label span:not(.checkbox) {
	text-align: start;
	color: var(--color-second);
}

.modal-content {
	width: 484px;
	background-color: var(--bg-main);
}
@media screen and (max-width: 767px) {
	.modal-content {
		width: 100% !important;
		max-width: 100%;
	}
}
[data-attr-l] .field-label{
	margin-bottom: 0;
}
.modal-content[data-attr-l] {
	width: 950px;
}

@media screen and (max-width: 991px) {
	.modal-content[data-attr-l] {
		width: 100% !important;
		max-width: 100%;
	}
}

.modal-content .textarea {
	height: 140px;
	display: block;
}

.modal-content .title {
	padding-right: 30px;
	line-height: 1;
	font-weight: 600;
	font-size: 40px;
	margin-bottom: 30px;
}

@media screen and (max-width: 991px) {
	.modal-content .title {
		font-size: 30px;
	}
}

.modal-content .wrap {
	line-height: 1.1;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	padding-bottom: 10px;
}

.modal-content .text {
	color: var(--color-second);
	text-align: center;
	line-height: 1;
	margin-bottom: 10px;
}

.modal-content .hold.second {
	padding-bottom: 30px;
	margin-bottom: 20px;
	border-bottom: 1px solid var(--color-border);
}

/* .modal-content .hold:last-child {
	padding-bottom: 0;
	margin-bottom: 0;
	border-bottom: none;
} */

.modal-content .button {
	width: 100%;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	line-height: 1.3334;
	border-radius: 10px;
	padding: 13px 20px;
	border: none;
	color: var(--color-main);
	background-color: var(--bg-video-tools);
	transition: background-color .3s, color .3s;
}

@media screen and (min-width: 1025px) {
	.modal-content .button:hover {
		background-color: var(--color-active);
		color: var(--color-dark);
	}
}

.modal-content .btn,
.aside-content .button {
	cursor: pointer;
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 10px;
	padding: 11px 20px;
	border: none;
	font-size: 22px;
	font-weight: 500;
	line-height: 1.273;
	background-color: var(--color-active);
	color: var(--color-dark);
	transition: background-color .3s, color .3s;
}

@media screen and (min-width: 1025px) {
	.modal-content .btn:hover,
	.aside-content .button:hover {
		background-color: var(--color-active-second);
	}
}

.modal-content .info{
	font-family: var(--font-family);
	font-weight: 400;
	font-size: 18px;
	line-height: 111%;
	text-align: center;
	color: var(--color-popup-info);
	margin-top: 25px;
}

.modal-content .info a {
	color: var(--color-main);
}

@media screen and (min-width: 1025px) {
	.modal-content .info a:hover {
		color: var(--color-active);
	}
}

.modal-content .name {
	display: block;
	margin-bottom: 5px;
}

.modal-field {
	display: flex;
	gap: 20px 50px;
}

@media screen and (max-width: 991px) {
	.modal-field {
		gap: 20px;
	}
}

@media screen and (max-width: 767px) {
	.modal-field {
		flex-direction: column;
	}
}

.modal-field .col {
	width: 50%;
}

@media screen and (max-width: 767px) {
	.modal-field .col {
		width: 100%;
	}
}

.checkbox-label {
	display: inline-flex;
	gap: 5px 10px;
	vertical-align: top;
	align-items: center;
	cursor: pointer;
}

.checkbox-label .input {
	display: none;
}

.checkbox-label .input:checked + .checkbox {
	background: var(--color-active);
}

.checkbox-label .input:checked + .checkbox::after {
	opacity: 1;
}

.checkbox-label .checkbox {
	flex-grow: 0;
	flex-shrink: 0;
	display: inline-flex;
	vertical-align: top;
	position: relative;
	width: 20px;
	border: 2px solid var(--color-active);
	transition: background .2s, border .2s;
	border-radius: 5px;
	height: 20px;
}

.checkbox-label .checkbox::after {
	content: "";
	position: absolute;
	opacity: 0;
	transition: opacity .2s;
	left: 5px;
	top: 2px;
	width: 6px;
	height: 10px;
	border: solid var(--bg-black);
	border-width: 0 2px 2px 0;
	transform: rotate(45deg);
}

@media screen and (max-width: 390px) {
	.checkbox-label span {
		font-size: 16px;
	}
}

.forgot-link {
	cursor: pointer;
	color: var(--color-second);
	transition: color .3s;
}

@media screen and (min-width: 1025px) {
	.forgot-link:hover {
		color: var(--color-active);
	}
}

.save-btn {
	margin-top: 30px;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 11px 30px;
	border: none;
	font-size: 22px;
	font-weight: 500;
	line-height: 1.273;
	background-color: var(--color-active);
	color: var(--color-dark);
	transition: background-color .3s;
	border-radius: 10px;
	transition: background-color .3s;
}

@media screen and (min-width: 1025px) {
	.save-btn:hover {
		background-color: var(--color-active-second);
	}
}

.modal-user-box {
	margin-top: 20px;
	display: flex;
	align-items: center;
	gap: 20px;
}

@media screen and (max-width: 390px) {
	.modal-user-box {
		gap: 10px;
	}
}

.modal-user-box .ava {
	width: 160px;
	height: 160px;
	border-radius: 100%;
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 80px;
	color: var(--color-second);
	background-color: var(--bg-field);
}

@media screen and (max-width: 390px) {
	.modal-user-box .ava {
		width: 120px;
		height: 120px;
		font-size: 60px;
	}
}

.modal-user-box img {
	width: 100%;
	height: 100%;
	max-width: 100%;
	-o-object-fit: cover;
	   object-fit: cover;
}

select {
	display: none;
}

.select2-container{
	z-index: 11111;
}
.select2-container--default .select2-selection--single {
	border-radius: 10px;
	height: 50px;
	display: flex;
	align-items: center;
	font-family: inherit;
	background: var(--bg-field);
	font-weight: 400;
	font-size: 16px;
	border: none;
}

.select2-selection__arrow::before {
	background-image: url("../images/down-arrow.svg");
	background-position: 50%;
	background-repeat: no-repeat;
	background-size: cover;
	content: "";
	height: 10px;
	left: 0;
	position: absolute;
	top: 20px;
	width: 10px;
	transition: transform .3s;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
	height: 100%;
	position: absolute;
	right: 20px;
	width: 10px;
}

.select2-container--open .select2-selection__arrow::before {
	transform: rotate(180deg);
}

.select2-container--default .select2-selection--single .select2-selection__arrow b {
	display: none;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
	color: var(--color-second);
	padding: 0 20px;
}

.select2-results__option--selectable {
	color: var(--color-second);
	height: 36px;
	padding: 0 20px;
	display: flex;
	align-items: center;
}

.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
	background-color: var(--color-active);
	color: var(--color-dark);
}

.select2-dropdown {
	background-color: var(--color-dark);
	border-radius: 10px;
	overflow: hidden;
	border: none;
	font-family: inherit;
	font-size: 16px;
}

.select2-container--default .select2-search--dropdown .select2-search__field {
	height: 36px;
	border-radius: 10px;
	background: var(--bg-main);
	border: none;
	color: var(--color-main);
	padding: 0 20px;
}

.select2-container--default .select2-selection--single .select2-selection__placeholder {
	color: var(--second-color);
}

.select2-container--default .select2-results__option--selected {
	background-color: var(--bg-main);
	color: var(--color-main);
}

.wrap-select {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
}

.col-list {
	flex-grow: 1;
	flex-shrink: 1;
	min-width: 80px;
	width: 16.936%;
}

.col-list.second {
	width: 100%;
	max-width: 163px;
	flex-grow: 0;
	flex-shrink: 0;
}

.wrap-mask {
	position: relative;
}

.mask-input {
	display: flex;
	align-items: center;
	font-size: 16px;
	color: var(--color-second);
	height: 50px;
	border-radius: 10px;
	position: relative;
	padding: 5px 110px 5px 20px;
	width: 100%;
	background-color: var(--bg-field);
	border: none;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.wrap-btn input[type=file] {
	display: none;
}

.wrap-btn .button {
	display: flex;
	align-items: center;
	border-radius: 10px;
	cursor: pointer;
	font-size: 18px;
	min-height: 40px;
	padding: 6px 20px;
	background-color: var(--color-active);
	color: var(--color-dark);
	font-weight: 500;
	position: absolute;
	right: 5px;
	top: 50%;
	transform: translate3d(0, -50%, 0);
	z-index: 2;
	transition: background-color .3s;
}

@media screen and (min-width: 1025px) {
	.wrap-btn .button:hover {
		background-color: var(--color-active-second);
	}
}
.fancybox-skin {
	color: var(--color-main);
	box-shadow: none;
    background: none;
}
.fancybox-close {
	width: 20px !important;
	height: 20px !important;
	top: 20px !important;
    right: 20px !important;
    opacity: 0;
}
.modal-content .inf,
.aside-content .inf,
.modal-comment .inf {
	color: var(--color-second);
	margin-bottom: 10px;
	display: block;
}
.captcha-control .image img {
    width: 200px !important;
	margin-bottom: 10px;
}
.captcha-control .image {
	margin-bottom: 20px;
}

input:-webkit-autofill,
input:-webkit-autofill:focus {
    transition: background-color 0s 600000s, color 0s 600000s !important;
}

.fancybox-inner, .fancybox-outer, .fancybox-wrap.fancybox-type-ajax {
	width: auto !important;
}
@media screen and (max-width: 991px) {
	.fancybox-inner, .fancybox-outer, .fancybox-wrap.fancybox-type-ajax {
		width: 100% !important;
	}
}

.fancybox-wrap {
    top: 50% !important;
    left: 50% !important;
    max-width: 950% !important;
    transform: translate(-50%, -50%);
    border: 10px solid transparent !important;
}
.fancybox-type-inline{
	width: 100% !important;
}
.no-thumb {
	cursor: pointer;
    display: flex;
    align-items: center;
    gap: 0 10px;
    color: var(--color-main);

	position: absolute;
    left: 50%;
    top: 50%;
	transform: translate3d(-50%,-50%,0);
}
.no-thumb img {
    max-width: 14px;
    transform: rotate(10deg);
    transform-origin: center left;
}
.no-thumb span {
    font-style: italic;
    font-weight: 900;
    font-size: 20px;
    text-transform: uppercase;
    line-height: 1;
    display: flex;
    align-items: center;
}
.no-thumb strong {
	color: var(--color-active);
}
.link-wrap {
    display: flex;
    flex-direction: column;
    height: 100%;
}
.link-wrap .title {
    flex-grow: 1;
	flex-shrink: 1;
}
.player-wrap {
	position: relative;
}
#kt_player{
	position: absolute !important;
	left: 0 !important;
	top: 0 !important;
	width: 100% !important;
	height: 100% !important;
	z-index: 2;
}
.block-size, 
.custom-size{
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px;
} 
.block-size a {
	font-weight: 500;
    font-size: 18px;
    color: var(--color-second);
    display: flex;
    align-items: center;
    border-radius: 10px;
    background-color: var(--bg-tools);
    padding: 14px 20px;
    line-height: 1.2223;
    transition: color .3s, background-color .3s;
}
@media screen and (min-width: 1025px) {
	.block-size a:hover {
		color: var(--color-dark);
		background-color: var(--color-active);
	}
}

.custom-size .label-share {
	display: flex;
	align-items: center;
	flex-direction: row;
	margin-bottom: 0;
	gap: 10px;
}

.hidden{
	display: none;
}
.rating-container {
	position: relative;
}
.rating-container .voters {
	position: absolute;
	bottom: calc(100% + 5px);
	text-align: center;
	width: 100%;
}

.static-page .headline .title{
	font-size: 34px;
}
.static-page h2{
    color: var(--color-main);
    font-size: 18px;
    font-weight: 700;
    margin-top: 20px;
    margin-bottom: 20px;
}
.static-page h2:first-child{
	margin-top: 0;
}
.static-page p {
	color: var(--color-second);
    margin-bottom: 15px;
	line-height: 1.3;
}
.static-page p:last-child {
	margin-bottom: 0;
}
.static-page ul {
	list-style-type: disc;
	padding-left: 20px;
	margin-bottom: 20px;
	color: var(--color-second);
}
.static-page li {
	margin-bottom: 10px;
}
.static-page li:last-child {
	margin-bottom: 0;
}
.static-page ol {
	list-style-type: auto;
	padding-left: 20px;
	margin-bottom: 20px;
	color: var(--color-second);
}
.static-page a {
	color: var(--color-active);
}
@media screen and (min-width: 1025px) {
	.static-page a:hover {
		text-decoration: underline;
	}
}
.social-list {
  display: flex;
  align-items: center;
  gap: 10px !important;
  margin-bottom: 20px;
}

@media screen and (max-width: 390px) {
  .social-list {
    gap: 5px;
  }
}

.social-list .link {
  display: flex;
  align-items: center;
  background-color: var(--bg-video-tools);
  color: var(--color-main);
  padding: 13px;
  font-size: 24px;
  border-radius: 10px;
  transition: color .3s, background .3s;
}

@media screen and (min-width: 1025px) {
  .social-list .link:hover {
    background-color: var(--color-active);
    color: var(--color-dark);
  }
}

@media screen and (max-width: 390px) {
  .social-list .link {
    font-size: 20px;
  }
}

form .generic-error {
    text-align: center;
    margin: 0 0 10px;
    color: red;
}

.page-error {
	display: flex;
    align-items: center;
    justify-content: center;
	text-align: center;
    padding: 100px 10px;
	font-weight: 700;
    font-size: 50px;
    text-transform: uppercase;
}
@media screen and (max-width: 767px) {
	.page-error {
		font-size: 38px;
	}
}
@media screen and (max-width: 480px) {
	.page-error {
		font-size: 24px;
	}
}
.drop-share {
	position: relative;
}
.drop-share.show .dropped {
	opacity: 1;
    transform: translate3d(0, 0, 0);
    visibility: visible;
}
.drop-share.show .btn {
	background-color: var(--color-active);
	color: var(--color-dark);
}
.drop-share .social-list {
	margin-bottom: 0;
	gap: 0 !important;
}
.drop-share .link {
	margin-left: 10px;
}
.drop-share .link:first-child {
	margin-left: 0;
}
.drop-share .dropped {
	position: absolute;
    z-index: 10;
    background-color: var(--bg-drop-share);
    right: 0;
    border-radius: 10px;
    box-shadow: var(--box-shadow-menu);
    overflow: hidden;
    top: calc(100% + 10px);
	padding: 10px;
    opacity: 0;
    transform: translate3d(0, -10%, 0);
    visibility: hidden;
    transition: opacity .3s, transform .3s, visibility .3s;
}

.upload-holder {
	position: relative;
}
.upload-holder.show .upload-box {
	opacity: 1;
    transform: translate3d(0, 0, 0);
    visibility: visible;
}
.btn-upload {
	cursor: pointer;
	display: flex;
    height: 100%;
    align-items: center;
	background-color: transparent;
	border: none;
	font-size: 24px;
    padding: 10px;
	color: var(--color-main);
	transition: background-color .3s, color .3s;
}
@media screen and (min-width: 1025px) {
	.btn-upload:hover {
		background-color: var(--color-active);
		color: var(--color-dark);
	}
}
@media screen and (max-width: 390px) {
	.btn-upload {
		font-size: 18px;
		padding: 2px;
	}
}
.upload-box {
	position: absolute;
    z-index: 10;
    border-radius: 10px 0 10px 10px;
    background: var(--bg-tools);
    box-shadow: var(--box-shadow-drop);
    min-width: 180px;
    right: 0;
    top: calc(100% + 15px);
    overflow: hidden;
	padding: 10px;
    opacity: 0;
    transform: translate3d(0, -10%, 0);
    visibility: hidden;
    transition: opacity .3s, transform .3s, visibility .3s;
}
.upload-box a {
	margin-bottom: 10px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 10px;
	color: var(--color-main);
	padding: 10px 20px;
	transition: color .3s, background-color .3s;
}
.upload-box a:last-child {
	margin-bottom: 0;
}
@media screen and (min-width: 1025px) {
	.upload-box a:hover {
		background-color: var(--color-active);
		color: var(--color-dark);
	}
}
.row-upload .field-error {
	margin-top: 5px;
}
.field-error {
    color: #ff0015;
}

.form-upload.uploading {
	margin-bottom: 50px;
}
.progressbar {
	display: flex;
	flex-direction: column;
}

.progress {
	background: var(--color-active);
    height: 8px;
    border-radius: 20px;
    position: relative;
	width: 0;
}

.progressbar .text {
	order: -1;
    text-align: center;
    font-weight: 700;
    font-size: 24px;
    margin-bottom: 15px;
}
.preview {
	position: relative;
	border-radius: 10px;
	overflow: hidden;
}
.preview .left {
    position: absolute;
    left: 5px;
    bottom: 5px;
    background: var(--bg-tools);
    color: var(--color-main);
    font-size: 14px;
    padding: 5px;
    line-height: 1;
    border-radius: 10px;
}
.preview .right {
	position: absolute;
	right: 5px;
	top: 5px;
	background: var(--bg-tools);
    color: var(--color-main);
	font-size: 14px;
	padding: 5px;
    line-height: 1;
    border-radius: 10px;
}
.form-upload.uploading .upload-text,
.form-upload.uploading .upload-cols {
	display: none;
}
.row-upload .file-control {
	margin-bottom: 20px;
}
.row-upload .file-control:last-child {
	margin-bottom: 0;
}
.file-btn {
	display: flex;
    align-items: center;
    border-radius: 10px;
    cursor: pointer;
    font-size: 18px;
    min-height: 40px;
    padding: 6px 20px;
    background-color: var(--color-active);
    color: var(--color-dark);
    font-weight: 500;
    position: absolute;
    right: 5px;
    top: 50%;
    transform: translate3d(0, -50%, 0);
    z-index: 2;
    transition: background-color .3s, color .3s;
}
@media screen and (min-width: 1025px) {
	.file-btn:hover {
		background-color: var(--color-active-second);
	}
}
.mask-button input[type=file] {
	display: none;
}
.spot-wrap {
	display: flex;
	gap: 20px;
}
.spot-wrap .item {
    border-radius: 10px;
    overflow: hidden;
}
.line-processing,
.line-disabled {
	color: var(--color-second);
    position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: rgba(var(--bg-rgb-modal), 0.6);
	color: var(--color-active);
	display: flex;
	justify-content: center;
	align-items: center;
    font-size: 20px;
}
.autocomplete-suggestions {
	display: none;
}
.card-swiper {
	display: none;
}
.card-swiper.swiper-initialized {
	display: block;
}
.main-flex .processing .swiper-wrapper {
	display: block;
    flex-grow: 0;
    flex-shrink: 0;
    position: relative;
    padding-bottom: 60.65%;
    border-radius: 10px;
    overflow: hidden;
    background-color: var(--bg-field);
}
.message-text {
	font-size: 26px;
	line-height: 1.3;
	padding: 20px;
}
.edit-link {
	position: absolute;
    top: 10px;
    right: 10px;
    z-index: 2;
    color: var(--color-active);
    font-size: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
	transition: color .3s;
}
@media screen and (min-width: 1025px) {
	.edit-link:hover {
		color: var(--color-active-second);
	}
}
.list-screenshots {
	--flex-items: 3;
}
.list-albums-images {
	--flex-items: 4;
}
@media screen and (max-width: 991px) {
	.list-albums-images {
		--flex-items: 3;
	}
}
@media screen and (max-width: 480px) {
	.list-albums-images {
		--flex-items: 2;
	}
}
.list-screenshots,
.list-albums-images {
	margin-top: 20px;
	--flex-gap: 10px;
	display: flex;
	flex-wrap: wrap;
	gap: var(--flex-gap);
}

.list-screenshots .item,
.list-albums-images .item{
	width: calc((100% / var(--flex-items)) - (((var(--flex-items) - 1) / var(--flex-items)) * var(--flex-gap)));
}
.list-screenshots .item .img {
    padding-bottom: 60.65%;
}
.list-albums-images a{
    padding-bottom: 120%;
}
.list-screenshots .item .img,
.list-albums-images a{
	display: block;
    position: relative;
    border-radius: 10px;
    overflow: hidden;
	margin-bottom: 10px;
}
.list-screenshots .item img,
.list-albums-images .img-plug{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.row-title {
	font-size: 20px;
	display: inline-flex;
	align-items: center;
	gap: 10px;
}
.row-title svg {
	flex-grow: 0;
	flex-shrink: 0;
	font-size: 16px;
	transition: transform .3s;
}
.row-title.collapse svg {
	transform: rotate(180deg);
}
.del-img.active {
	color: var(--color-active);
}

.lazyload, 
.lazyloading {
    opacity: 0;
}

.lazyloaded {
    opacity: 1;
    -webkit-transition: opacity 500ms;
    transition: opacity 500ms;
}
.toggle-button span {
	cursor: pointer;
}
.pseudo-url {
	margin: 0 auto;
    text-align: center;
    display: block;
	color: var(--color-dark);
	background-color: var(--color-active);
    max-width: 430px;
	width: 100%;
	font-weight: 500;
	font-size: 18px;
	border-radius: 10px;
	padding: 10px 20px;
	border: none;
	cursor: pointer;
	line-height: 1.1112;
	transition: background-color .3s;
}
@media screen and (min-width: 1025px) {
	.pseudo-url:hover {
		background-color: var(--color-active-second);
	}
}