/******************************************************************
  Template Name: Activitar
  Description:  Activitar Fitness HTML Template
  Author: Colorlib
  Author URI: https://colorlib.com
  Version: 1.0
  Created: Colorlib
******************************************************************/

/*------------------------------------------------------------------
[Table of contents]

1.  Template default CSS
	1.1	Variables
	1.2	Mixins
	1.3	Flexbox
	1.4	Reset
2.  Helper Css
3.  Header Section
4.  Hero Section
5.  Feature Section
6.  Class Section
7.  Class Time Section
8.  Price Plan Section
9.  Contact
10.  Footer Style

-------------------------------------------------------------------*/

/*----------------------------------------*/

/* Template default CSS
/*----------------------------------------*/

html,
body {
	height: 100%;
	font-family: "Nunito Sans", sans-serif;
	-webkit-font-smoothing: antialiased;
	font-smoothing: antialiased;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	margin: 0;
	color: #111111;
	font-weight: 400;
	font-family: "Oswald", sans-serif;
}

h1 {
	font-size: 70px;
}

h2 {
	font-size: 36px;
}

h3 {
	font-size: 30px;
}

h4 {
	font-size: 24px;
}

h5 {
	font-size: 18px;
}

h6 {
	font-size: 16px;
}

p {
	font-size: 16px;
	font-family: "Nunito Sans", sans-serif;
	color: #8f8fa8;
	font-weight: 400;
	line-height: 24px;
	margin: 0 0 15px 0;
}

img {
	max-width: 100%;
}

input:focus,
select:focus,
button:focus,
textarea:focus {
	outline: none;
}

a:hover,
a:focus {
	text-decoration: none;
	outline: none;
	color: #fff;
}

ul,
ol {
	padding: 0;
	margin: 0;
}

::-webkit-scrollbar {
	width: 10px;
	overflow-x: none;
}

::-webkit-scrollbar-track {
	border-radius: 0.3em;
	background: #090a11;
	margin-block: 0.25em;
}

::-webkit-scrollbar-thumb {
	background: #00c6ff;
	background: -webkit-linear-gradient(to right, #00c6ff, #0072ff);
	background: linear-gradient(to right, #00c6ff, #0072ff);
	border-radius: 0.3em;
}
/*---------------------
  Helper CSS
-----------------------*/

.section-title h2 {
	color: #ffffff;
	font-size: 48px;
	font-weight: 600;
	margin-bottom: 18px;
	text-transform: uppercase;
}

.section-title p {
	color: #ffffff;
	margin-bottom: 0;
}

.set-bg {
	background-repeat: no-repeat;
	background-size: cover;
	background-position: top center;
}

.spad {
	padding-top: 100px;
	padding-bottom: 100px;
}

.spad-2 {
	padding-top: 50px;
	padding-bottom: 70px;
}

.text-white h1,
.text-white h2,
.text-white h3,
.text-white h4,
.text-white h5,
.text-white h6,
.text-white p,
.text-white span,
.text-white li,
.text-white a {
	color: #fff;
}

/* buttons */

.primary-btn {
	display: inline-block;
	font-size: 14px;
	font-family: "Oswald", sans-serif;
	font-weight: 600;
	padding: 0 12px;
	color: #ffffff;
	letter-spacing: 2px;
	text-transform: uppercase;
	text-align: center;
	width: 160px;
	height: 46px;
	border-left: 2px solid #e16521;
	border-right: 2px solid #e4381C;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	background-position: 0 0, 0 100%;
	background-repeat: no-repeat;
	background-size: 100% 2px;
	background-image: -webkit-gradient(linear, left top, right top, color-stop(100%, #e4381C), to(#e16521)), -webkit-gradient(linear, left top, right top, from(#e4381C), color-stop(0%, #e16521));
	background-image: -o-linear-gradient(left, #e4381C 100%, #e16521 100%), -o-linear-gradient(left, #e4381C 0%, #e16521 0%);
	background-image: linear-gradient(to right, #e4381C 100%, #e16521 100%), linear-gradient(to right, #e4381C 0%, #e16521 0%);
	-webkit-transition-duration: 1000ms;
	-o-transition-duration: 1000ms;
	transition-duration: 1000ms;
	line-height: 45px;
	position: relative;
	z-index: 1;
	border-radius: 4px;
}

.primary-btn:after {
	color: #fff;
	-webkit-transition-duration: 500ms;
	-o-transition-duration: 500ms;
	transition-duration: 500ms;
	background: #e16521;
	background: -webkit-gradient(linear, left top, right top, from(#e16521), to(#e4381C));
	background: -o-linear-gradient(left, #e16521, #e4381C);
	background: linear-gradient(to right, #e16521, #e4381C);
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: -1;
	border-radius: 2px;
	opacity: 0;
}

.site-btn {
	display: inline-block;
	font-size: 12px;
	font-family: "Oswald", sans-serif;
	font-weight: 600;
	padding: 0 12px;
	color: #000000;
	letter-spacing: 1px;
	text-transform: uppercase;
	text-align: center;
	background: none;
	width: 127px;
	height: 40px;
	border-left: 2px solid #e16521;
	border-right: 2px solid #e4381C;
	border-top: none;
	border-bottom: none;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	background-position: 0 0, 0 100%;
	background-repeat: no-repeat;
	background-size: 100% 2px;
	background-image: -webkit-gradient(linear, left top, right top, color-stop(100%, #e16521), color-stop(0%, #e4381C)), -webkit-gradient(linear, left top, right top, from(#e16521), color-stop(0%, #e4381C));
	background-image: -o-linear-gradient(left, #e16521 100%, #e4381C 0%), -o-linear-gradient(left, #e16521 0%, #e4381C 0%);
	background-image: linear-gradient(to right, #e16521 100%, #e4381C 0%), linear-gradient(to right, #e16521 0%, #e4381C 0%);
	-webkit-transition-duration: 1000ms;
	-o-transition-duration: 1000ms;
	transition-duration: 1000ms;
	line-height: 38px;
	position: relative;
	z-index: 1;
	border-radius: 4px;
}

.site-btn:after {
	color: #fff;
	-webkit-transition-duration: 500ms;
	-o-transition-duration: 500ms;
	transition-duration: 500ms;
	background: #e16521;
	background: -webkit-gradient(linear, left top, right top, from(#e16521), to(#e4381C));
	background: -o-linear-gradient(left, #e16521, #e4381C);
	background: linear-gradient(to right, #e16521, #e4381C);
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: -1;
	border-radius: 2px;
	opacity: 0;
}

/* Preloder */

#preloder {
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 999999;
	background: #000;
}

.loader {
	width: 40px;
	height: 40px;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -13px;
	margin-left: -13px;
	border-radius: 60px;
	animation: loader 0.8s linear infinite;
	-webkit-animation: loader 0.8s linear infinite;
}
.advertisement{
	padding: 35px;
}

@keyframes loader {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
		border: 4px solid #f44336;
		border-left-color: transparent;
	}
	50% {
		-webkit-transform: rotate(180deg);
		transform: rotate(180deg);
		border: 4px solid #673ab7;
		border-left-color: transparent;
	}
	100% {
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg);
		border: 4px solid #f44336;
		border-left-color: transparent;
	}
}

@-webkit-keyframes loader {
	0% {
		-webkit-transform: rotate(0deg);
		border: 4px solid #f44336;
		border-left-color: transparent;
	}
	50% {
		-webkit-transform: rotate(180deg);
		border: 4px solid #673ab7;
		border-left-color: transparent;
	}
	100% {
		-webkit-transform: rotate(360deg);
		border: 4px solid #f44336;
		border-left-color: transparent;
	}
}

/*---------------------
  Header
-----------------------*/

.header-section {
	padding-top: 40px;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	z-index: 99;
	padding-left: 60px;
	padding-right: 60px;
}

.header-section.header-normal {
	position: relative;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	background: #151515;
	padding-top: 0;
}

.header-section.header-normal .logo {
	padding: 40px 0;
}

.header-section.header-normal .nav-menu .mainmenu ul li a {
	padding: 40px 0;
}

.header-section.header-normal .nav-menu .mainmenu ul li a:after {
	bottom: 35px;
}

.header-section.header-normal .nav-menu .mainmenu ul li:hover .dropdown {
	top: 107px;
}

.header-section.header-normal .nav-menu .mainmenu ul li .dropdown {
	top: 128px;
}

.header-section.header-normal .nav-menu .mainmenu ul li .dropdown li a {
	padding: 14px 22px;
}

.header-section.header-normal .top-social {
	padding: 39px 0;
}

.logo {
	float: left;
}

.logo a {
	display: inline-block;
}

.nav-menu {
	text-align: center;
}

.nav-menu .mainmenu {
	display: inline-block;
}

.nav-menu .mainmenu ul li {
	display: inline-block;
	list-style: none;
	margin-right: 45px;
	position: relative;
}

.nav-menu .mainmenu ul li:last-child {
	margin-right: 0;
}

.nav-menu .mainmenu ul li.active a {
	color: #e4381C;
}

.nav-menu .mainmenu ul li.active a:after {
	opacity: 1;
}

.nav-menu .mainmenu ul li a {
	color: #ffffff;
	font-size: 16px;
	text-transform: uppercase;
	font-weight: 500;
	line-height: 28px;
	-webkit-transition: 0.3s;
	-o-transition: 0.3s;
	transition: 0.3s;
	display: block;
	font-family: "Oswald", sans-serif;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}

.nav-menu .mainmenu ul li a:after {
	position: absolute;
	left: 0;
	bottom: -5px;
	width: 100%;
	height: 2px;
	background: #e4381C;
	content: "";
	opacity: 0;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}

.nav-menu .mainmenu ul li:hover .dropdown {
	opacity: 1;
	visibility: visible;
	top: 40px;
}

.nav-menu .mainmenu ul li:hover>a {
	color: #e4381C;
}

.nav-menu .mainmenu ul li:hover>a:after {
	opacity: 1;
}

.nav-menu .mainmenu ul li .dropdown {
	position: absolute;
	left: 0;
	top: 70px;
	width: 180px;
	background: #e4381C;
	opacity: 0;
	visibility: hidden;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
	z-index: 99;
}

.nav-menu .mainmenu ul li .dropdown li {
	display: block;
	margin-right: 0;
}

.nav-menu .mainmenu ul li .dropdown li a {
	text-align: left;
	text-transform: capitalize;
	padding: 10px 20px;
	color: #ffffff;
}

.nav-menu .mainmenu ul li .dropdown li a:hover {
	color: #151515;
}

.nav-menu .mainmenu ul li .dropdown li a:hover:after {
	display: none;
}

.top-social {
	float: right;
}

.top-social a {
	display: inline-block;
	font-size: 20px;
	color: #ffffff;
	margin-left: 20px;
}

.slicknav_menu {
	display: none;
}
/*---------------------
  Modals
-----------------------*/
/* Основная настройка модала */
.modal.fade .modal-dialog {
	transition: transform 0.3s ease-out;
	transform: translateY(-20%);
}

.modal.show .modal-dialog {
	transform: none;
}

/* Настройка заголовка модала */
.modal-header {
	background-color: #333;
	color: #fff;
	border-bottom: 1px solid #555;
	padding: 1rem;
}

.modal-header h7.modal-title {
	font-weight: bold;
	margin-bottom: 0;
}


/* Основная зона сообщений */
.modal-body {
	background-color: #222;
	color: #fff;
	padding: 1.5rem;
}

.modal-body div.container-fluid {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 100px;
	font-size: 1.1em;
	word-wrap: break-word;
}

/* Футер модала */
.modal-footer {
	background-color: #333;
	color: #fff;
	border-top: 1px solid #555;
	padding: 1rem;
	display: flex;
	justify-content: flex-end;
}

.modal-footer button.btn-secondary {
	background-color: #555;
	border: none;
	color: #fff;
	padding: 0.5rem 1.5rem;
	cursor: pointer;
	box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2), 0 2px 5px rgba(0, 0, 0, 0.1);
	transition: all 0.3s linear;
}

.modal-footer button.btn-secondary:hover {
	background-color: #444;
}

/* Переход при закрытии модала */
.modal.fade .modal-dialog.slide-down {
	animation: slideDownOut 0.3s forwards;
}

@keyframes slideDownOut {
	from {
		opacity: 1;
		transform: translateY(0);
	}
	to {
		opacity: 0;
		transform: translateY(-20%);
	}
}

/* Анимация открытия модала */
.modal.fade .modal-dialog.slide-up {
	animation: slideUpIn 0.3s forwards;
}

@keyframes slideUpIn {
	from {
		opacity: 0;
		transform: translateY(-20%);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

/* Макет модала */
.modal-dialog {
	max-width: 700px;
	margin: auto;
	border-radius: 0.5rem;
	overflow: hidden;
	box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
}

.modal-content {
	background-color: #222;
	border-radius: 0.5rem;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

/* Параметры шрифтов */
.modal-content h7.modal-title {
	font-size: 1.2rem;
	font-weight: bold;
}

.modal-content p {
	font-size: 1rem;
	line-height: 1.5;
}

/* Оптимизация мобильной версии */
@media screen and (max-width: 768px) {
	.modal-dialog {
		max-width: 300px;
	}

	.modal-body {
		padding: 1rem;
	}

	.modal-footer button {
		font-size: 0.9rem;
	}
}

/* Минимальное улучшение для Retina-дисплеев */
@media only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (min-resolution: 192dpi) {
	.modal-content {
		box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
	}
}
/*---------------------
  Admin Section
-----------------------*/
.card {
	width: 100%; /* Растягиваем по ширине родителя */
	background-color: #333; /* Тёмный фон */
	color: #fff; /* Белый текст для контраста */
	padding: 20px; /* Внутренние отступы */
	border-radius: 8px; /* Закруглённые углы */
	box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1); /* Лёгкая тень */
	margin-bottom: 20px;
}

/* Адаптивность для мобильных устройств */
@media (max-width: 768px) {
	.card {
		width: 100%; /* Растягиваем по ширине родителя */
		background-color: #333; /* Тёмный фон */
		color: #fff; /* Белый текст для контраста */
		padding: 5px; /* Внутренние отступы */
		border-radius: 8px; /* Закруглённые углы */
		box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1); /* Лёгкая тень */
		margin: 5px;
	}
}
/* Стили для аватара */
.avatar-container {
	position: relative;
	width: 200px;
	height: 200px;
	overflow: hidden;
	border-radius: 5%;
	border: 2px solid #ddd;
}

.avatar-container img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* Стили для кнопки загрузки файла */
.upload-btn {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	border-top-left-radius: 0;
	border-top-right-radius: 0;
}

/* Скрываем стандартный input file */
#file-carousel {
	display: none;
}

/* Стили для текстовых полей */
.form-control {
	height: auto;
	resize: vertical;
}
/* Стили для контейнера кнопки */
.card-btn {
	display: flex; /* Включаем Flexbox */
	justify-content: center; /* Центрируем по горизонтали */
	align-items: center; /* Центрируем по вертикали (если нужно) */
}

/* Стили для кнопок */

.card-btn .btn {
	width: 100%; /* Кнопка занимает всю ширину контейнера */
	padding: 10px 20px; /* Внутренние отступы */
	font-size: 16px; /* Размер шрифта */
	font-weight: 500; /* Жирность шрифта */
	color: #fff; /* Белый текст */
	background-color: #e4381C; /* Красный фон */
	border: none; /* Без границы */
	border-radius: 4px; /* Закруглённые углы */
	cursor: pointer; /* Курсор в виде указателя */
	transition: background-color 0.3s; /* Плавный переход цвета */
}

/* Стили для кнопки при наведении */
.card-btn .btn:hover {
	background-color: #e16521; /* Более тёмный оттенок при наведении */
}

/* Стили для кнопки при нажатии */
.card-btn .btn:active {
	transform: scale(0.98); /* Немного уменьшаем при нажатии */
}
.btn-primary {
	background-color: #e4381C;
	color: #fff;
	border-color: #f00;
}

.btn-primary:hover {
	background-color: #e16521;
}

/* Стили для группы ввода */
.input-group {
	margin-bottom: 15px;
}

/* Стили для текста в группе ввода */
.input-group-text {
	background-color: #e4381C;
	color: #fff;
	border: none;
	border-radius: 4px 0 0 4px;
	width: 50px;
	padding:15px;
}

/* Стили для скрытого поля H3 */
.input-group[hidden] {
	display: none;
}

/* Стили для слайдера */
.carousel.slide {
	height: 300px; /* Уменьшенная высота слайдера */
	overflow: hidden; /* Скрываем выходящие за пределы элементы */
}

/* Стили для изображения в слайде */
.carousel-item img {
	width: 100%; /* Изображение растянуто по ширине */
	height: 300px; /* Изображение растянуто по высоте */
	object-fit: cover; /* Сохраняет пропорции изображения */
}
.carousel-item {

	height: 300px /* Изображение растянуто по высоте */

}
/* Стили для текста в слайде */
.carousel-caption .hero-text {
	position: absolute; /* Позиционируем текст абсолютно */
	bottom: 20px; /* Отступ снизу */
	left: 20px; /* Отступ слева */
	right: 20px; /* Отступ справа */
	text-align: center; /* Выравнивание текста по центру */
	color: #fff; /* Белый текст */
	background-color: rgba(0, 0, 0, 0.5); /* Полупрозрачный фон для текста */
	padding: 10px;
	border-radius: 8px;
	z-index: 1; /* Поднимаем текст над изображением */
}

.carousel-caption .hero-text h6,h5{
	color: #fff; /* Белый текст */
}

/* Стили для кнопки удаления */
.delete-button {
	position: absolute; /* Позиционируем кнопку абсолютно */
	top: 10px; /* Верхний отступ */
	right: 10px; /* Правый отступ */
	width: 30px; /* Ширина кнопки */
	height: 30px; /* Высота кнопки */
	border: none; /* Без границы */
	background-color: transparent; /* Прозрачный фон */
	cursor: pointer; /* Курсор в виде указателя */
	transition: background-color 0.3s; /* Плавный переход цвета */
	z-index: 2; /* Поднимаем кнопку над текстом */
}

/* Стили для крестика */
.delete-button::before,
.delete-button::after {
	content: "";
	position: absolute;
	width: 20px; /* Длина линий */
	height: 2px; /* Толщина линий */
	background-color: #e4381C; /* Цвет линий */
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.delete-button::before {
	transform: translate(-50%, -50%) rotate(45deg); /* Первая линия */
}

.delete-button::after {
	transform: translate(-50%, -50%) rotate(-45deg); /* Вторая линия */
}

.delete-button:hover {
	background-color: rgba(0, 0, 0, 0.1); /* Лёгкая подсветка при наведении */
}
/* Стили для admin-blog-pic */
.breadcrumb, .logo-admin, .admin-blog-pic {
	padding: 20px;
	background-color: #333; /* Тёмный фон */
	color: #fff; /* Белый текст */
	border-radius: 8px;
	box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
}
/* Стили для custom-file-upload */
.custom-file-upload {
	position: relative;
	display: inline-block;
	margin-bottom: 10px;
}

/* Скрываем стандартный input file */
.custom-file-upload input[type="file"] {
	display: none;
}
/* Стили для изображений */
.breadcrumb, .logo-admin, .admin-blog-pic img {
	width: 100%;
	height: auto;
	object-fit: cover;
	border-radius: 8px;
	transition: opacity 0.3s;
}
/* Стили для строк */
.breadcrumb, .logo-admin, .admin-blog-pic .row {
	margin-bottom: 20px; /* Отступ между строками */
}
/* Стили для формы */
.breadcrumb, .logo-admin, .admin-blog-pic form {
	margin-top: 20px;
}

/* Стили для big-image */
.breadcrumb, .logo-admin, .admin-blog-pic .big-image {
	width: 100%;
	height: 400px; /* Высота для большого изображения */
	object-fit: cover;
	border-radius: 8px;
}

/* Стили для medium-image */
.breadcrumb, .logo-admin, .admin-blog-pic .medium-image {
	width: 100%;
	height: 300px; /* Высота для среднего изображения */
	object-fit: cover;
	border-radius: 8px;
}


/* Стили для smail-image */
.admin-blog-pic .smail-image {
	width: 100%;
	height: 200px; /* Высота для маленького изображения */
	object-fit: cover;
	border-radius: 8px;
}

.breadcrumb .smail-image {
	width: 100%;
	height: 250px; /* Высота для маленького изображения */
	object-fit: cover;
	border-radius: 8px;
}
.logo-admin .smail-image {
	width: 200px;
	height: 260px; /* Высота для маленького изображения */
	object-fit: cover;
	border-radius: 8px;
}
.container-fluid img{
	width: 100%;
	height: 150px; /* Высота для маленького изображения */
	object-fit: cover;

}
.container-fluid {
    width: 100%;
    padding-left: 15px;
    padding-right: 15px;
    box-sizing: border-box; /* Это уже должно быть, но проверьте */
}
.f-logo img{
	width: 100%;
	height: 150px; /* Высота для маленького изображения */
	object-fit: cover;

}
/* Адаптивность для мобильных устройств */
@media (max-width: 768px) {
	.breadcrumb, .admin-blog-pic .row {
		flex-direction: column; /* Меняем направление на вертикальное */
		align-items: center; /* Центрируем содержимое */
	}

	.breadcrumb, .admin-blog-pic .col-lg-6 {
		width: 100%; /* Полная ширина */
		padding: 10px;
	}
}

/*---------------------
  Hero Section
-----------------------*/

.hero-items .owl-item.active .single-hero-item .hero-text h2,
.hero-items .owl-item.active .single-hero-item .hero-text h1,
.hero-items .owl-item.active .single-hero-item .hero-text .primary-btn {
	top: 0;
	opacity: 1;
}

.hero-items .owl-item.active .single-hero-item .hero-text h2 {
	-webkit-transition: all 0.2s ease 0.2s;
	-o-transition: all 0.2s ease 0.2s;
	transition: all 0.2s ease 0.2s;
}

.hero-items .owl-item.active .single-hero-item .hero-text h1 {
	-webkit-transition: all 0.4s ease 0.4s;
	-o-transition: all 0.4s ease 0.4s;
	transition: all 0.4s ease 0.4s;
}

.hero-items .owl-item.active .single-hero-item .hero-text .primary-btn {
	-webkit-transition: all 0.6s ease 0.6s;
	-o-transition: all 0.6s ease 0.6s;
	transition: all 0.6s ease 0.6s;
}

.hero-items .owl-nav button[type=button] {
	position: absolute;
	left: 75px;
	top: 50%;
	-webkit-transform: translateY(-30px);
	-ms-transform: translateY(-30px);
	transform: translateY(-30px);
	line-height: 30px;
	font-size: 60px;
	color: #ffffff;
}

.hero-items .owl-nav button[type=button].owl-next {
	left: auto;
	right: 75px;
}

.hero-items .owl-dots {
	position: absolute;
	left: 0;
	bottom: 23px;
	width: 100%;
	text-align: center;
}

.hero-items .owl-dots button.owl-dot {
	height: 14px;
	width: 14px;
	background: #ffffff;
	border-radius: 50%;
	margin-right: 15px;
	position: relative;
}

.hero-items .owl-dots button.owl-dot.active:after {
	opacity: 1;
}

.hero-items .owl-dots button.owl-dot:after {
	position: absolute;
	left: -3px;
	top: -3px;
	height: 20px;
	width: 20px;
	border: 1px solid #ffffff;
	content: "";
	border-radius: 50%;
	opacity: 0;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}

.hero-items .owl-dots button.owl-dot:last-child {
	margin-right: 0;
}

.single-hero-item {
	height: 950px;
	padding-top: 20px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
}

.single-hero-item .hero-text {
	text-align: center;
}

.single-hero-item .hero-text h2 {
	color: #ffffff;
	text-transform: uppercase;
	font-family: "Nunito Sans", sans-serif;
	font-size: 30px;
	margin-bottom: 4px;
	position: relative;
	top: 50px;
	opacity: 0;
}

.single-hero-item .hero-text h1 {
	color: #ffffff;
	font-size: 40px;
	font-weight: 600;
	text-transform: uppercase;
	margin-bottom: 46px;
	position: relative;
	top: 50px;
	opacity: 0;
}

.single-hero-item .hero-text .primary-btn {
	position: relative;
	top: 50px;
	opacity: 0;
}

.single-hero-item .hero-text .primary-btn:hover:after {
	opacity: 1;
}

/*---------------------
  Feature Item
-----------------------*/

.feature-item {
	text-align: center;
	height: 380px;
	margin-left: -15px;
	margin-right: -15px;
	padding: 100px 15px 15px;
	position: relative;
}

.feature-item:hover:before {
	opacity: 1;
}

.feature-item:before {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 5px;
	background: #e4381C;
	content: "";
	opacity: 0;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}

.feature-item h3 {
	color: #ffffff;
	font-weight: 500;
	text-transform: uppercase;
	margin-bottom: 14px;
}

.feature-item p {
	color: #ffffff;
	margin-bottom: 22px;
}

.feature-item .primary-btn.f-btn:hover:after {
	opacity: 1;
}

/*---------------------
  Home About
-----------------------*/

.home-about {
	background: #151515;
}

.about-text {
	padding-top: 18px;
}

.about-text h2 {
	font-size: 48px;
	font-weight: 500;
	color: #ffffff;
	text-transform: uppercase;
	margin-bottom: 36px;
}

.about-text p.short-details {
	font-size: 20px;
	font-weight: 600;
	color: #ffffff;
	line-height: 28px;
	margin-bottom: 20px;
}

.about-text p.long-details {
	color: #ffffff;
	margin-bottom: 40px;
}

.about-text .primary-btn.about-btn:after {
	opacity: 1;
}

.about-img img {
	min-width: 100%;
}

/*---------------------
  Classes Section
-----------------------*/

.classes-section {
	background: #151515;
}

.classes-section.schedule-page .class-title {
	padding: 0;
}

.classes-section.schedule-page .class-title .section-title {
	margin-bottom: 65px;
}

.class-title {
	padding-top: 60px;
	padding-bottom: 62px;
}

.class-title .section-title h2 {
	font-weight: 500;
}

.classes-item {
	height: 480px;
	margin-left: -15px;
	margin-right: -15px;
	padding-left: 60px;
	padding-top: 162px;
	padding-right: 35px;
}

.classes-item:hover:before {
	opacity: 1;
}

.classes-item:before {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 5px;
	background: #e4381C;
	content: "";
	opacity: 0;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}

.classes-item h4 {
	font-weight: 600;
	color: #ffffff;
	text-transform: uppercase;
	margin-bottom: 20px;
}

.classes-item p {
	color: #ffffff;
	margin-bottom: 38px;
}

.classes-item .primary-btn.class-btn {
	background-image: -webkit-gradient(linear, left top, right top, color-stop(100%, #e16521), color-stop(0%, #e4381C)), -webkit-gradient(linear, left top, right top, color-stop(100%, #e4381C), color-stop(0%, #e16521));
	background-image: -o-linear-gradient(left, #e16521 100%, #e4381C 0%), -o-linear-gradient(left, #e4381C 100%, #e16521 0%);
	background-image: linear-gradient(to right, #e16521 100%, #e4381C 0%), linear-gradient(to right, #e4381C 100%, #e16521 0%);
}

.classes-item .primary-btn.class-btn:hover:after {
	opacity: 1;
}

/*---------------------
  Review Section Styles
-----------------------*/

.fragment-reviews {
    background: #151515;
}

/* Заголовок секции */
.fragment-reviews .section-title h2 {
    color: #ffffff;
    font-size: 48px;
    font-weight: 600;
    margin-bottom: 10px;
    text-transform: uppercase;
    font-family: "Oswald", sans-serif;
}

.fragment-reviews .section-title p {
    color: #8f8fa8;
    font-size: 16px;
    font-family: "Nunito Sans", sans-serif;
}

/* Таблица отзывов */
.classtime-table {
    background: transparent;
    border-radius: 8px;
    overflow: hidden;
}

.classtime-table.scroll {
    overflow-y: auto;
    overflow-x: hidden;
    max-height: 600px;
    padding-right: 10px;
}

/* Стилизация скролла */
.classtime-table.scroll::-webkit-scrollbar {
    width: 8px;
}

.classtime-table.scroll::-webkit-scrollbar-track {
    background: #2d2d2d;
    border-radius: 10px;
}

.classtime-table.scroll::-webkit-scrollbar-thumb {
    background: linear-gradient(45deg, #e16521, #e4381C);
    border-radius: 10px;
}

.classtime-table table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0 15px;
}

.classtime-table table tbody tr td {
    padding: 0;
    background: transparent;
}

/* Карточка отзыва */
.classtime-table .reviews {
    background: linear-gradient(135deg, #222, #1a1a1a);
    border-radius: 12px;
    padding: 20px;
    transition: all 0.3s ease;
    border: 1px solid rgba(255, 255, 255, 0.05);
    display: block;
}

.classtime-table .reviews:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.3);
    border-color: rgba(228, 56, 28, 0.3);
}

/* Аватар в отзыве */
.review-avatar {
    width: 100px;
    height: 100px;
    margin: 0 auto;
    border-radius: 50%;
    overflow: hidden;
    position: relative;
    box-shadow: 0 5px 15px rgba(228, 56, 28, 0.3);
}

.review-avatar::before {
    content: '';
    position: absolute;
    top: -3px;
    left: -3px;
    right: -3px;
    bottom: -3px;
    background: linear-gradient(45deg, #e16521, #e4381C);
    border-radius: 50%;
    z-index: 1;
}

.review-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
    display: block;
    position: relative;
    z-index: 2;
    background: #151515;
}

/* Текст отзыва */
.review-content {
    padding: 0 20px;
}

.review-content h5 {
    color: #ffffff;
    font-size: 16px;
    line-height: 26px;
    font-family: "Nunito Sans", sans-serif;
    font-weight: 400;
    margin: 0;
}

/* Мета-информация */
.review-meta {
    text-align: right;
}

.review-date {
    display: inline-block;
    font-size: 14px;
    color: #8f8fa8;
    font-family: "Nunito Sans", sans-serif;
    margin-bottom: 8px;
    padding: 4px 12px;
    background: rgba(0, 0, 0, 0.3);
    border-radius: 20px;
}

.review-author {
    color: #ffffff;
    font-size: 20px;
    font-weight: 500;
    font-family: "Oswald", sans-serif;
    margin: 0;
    text-transform: uppercase;
}

/* Форма отзыва */
.review-form {
    margin-top: 30px;
}

/* Кнопка загрузки */
.upload-btn {
    background: transparent;
    border: 2px solid #e4381C;
    color: #ffffff;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 12px 25px;
}

.upload-btn i {
    font-size: 18px;
}

.upload-btn:hover {
    background: linear-gradient(45deg, #e16521, #e4381C);
    border-color: transparent;
}

/* Превью изображения */
.review-preview {
    width: 100%;
    height: 100%;
    min-height: 150px;
    display: flex;
    flex-direction: column;
    margin-bottom: 0 !important;
}
.review-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    flex: 1;
}
.review-preview .preview-placeholder {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex: 1;
}
.review-preview .preview-placeholder i {
    font-size: 32px;
    margin-bottom: 10px;
}
.review-preview .preview-placeholder span {
    font-size: 14px;
}
/* Стили для textarea */
.review-textarea {
    width: 100%;
    height: 100%;
    min-height: 150px;
    resize: vertical;
    background: #2d2d2d;
    border: 1px solid #3d3d3d;
    border-radius: 8px;
    padding: 15px 20px;
    color: #ffffff;
    font-family: "Nunito Sans", sans-serif;
    font-size: 16px;
    transition: all 0.3s;
}
.review-textarea:focus {
    outline: none;
    border-color: #e4381C;
    box-shadow: 0 0 0 3px rgba(228, 56, 28, 0.1);
}

.review-preview img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Поле ввода */
.review-form textarea {
    width: 100%;
    background: #2d2d2d;
    border: 1px solid #3d3d3d;
    border-radius: 8px;
    padding: 15px 20px;
    color: #ffffff;
    font-family: "Nunito Sans", sans-serif;
    font-size: 16px;
    transition: all 0.3s;
    resize: vertical;
}

.review-form textarea:focus {
    outline: none;
    border-color: #e4381C;
    box-shadow: 0 0 0 3px rgba(228, 56, 28, 0.1);
}

.review-form textarea::placeholder {
    color: #8f8fa8;
}

/* Кнопка отправки */
.submit-review {
    background: linear-gradient(45deg, #e16521, #e4381C);
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 14px 35px;
    font-size: 16px;
}

.submit-review i {
    font-size: 18px;
}

.submit-review:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(228, 56, 28, 0.4);
}

/* Блок для неавторизованных */
.login-link {
    text-decoration: none;
    display: inline-block;
}

.login-btn {
    background: transparent;
    border: 2px solid #e4381C;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 15px;
}

.login-btn:hover {
    background: linear-gradient(45deg, #e16521, #e4381C);
    border-color: transparent;
}

.login-note {
    color: #8f8fa8;
    font-size: 14px;
    font-family: "Nunito Sans", sans-serif;
    margin: 10px 0 0;
}

.login-note i {
    color: #e4381C;
    margin-right: 5px;
}

/* Адаптивность */
@media (max-width: 992px) {
    .classtime-table .reviews .row {
        flex-direction: column;
        text-align: center;
    }

    .review-avatar {
        margin-bottom: 15px;
    }

    .review-content {
        padding: 15px 0;
    }

    .review-meta {
        text-align: center;
    }

    .review-preview {
        margin: 0 auto 20px;
    }
}
/* Адаптивность */
@media (max-width: 992px) {
    .review-row {
        flex-direction: column;
    }

    .review-row > [class*="col-"] {
        width: 100%;
        margin-bottom: 15px;
    }

    .review-preview {
        min-height: 200px;
    }

    .review-textarea {
        min-height: 200px;
    }
}
@media (max-width: 768px) {
    .fragment-reviews .section-title h2 {
        font-size: 36px;
    }

    .classtime-table.scroll {
        max-height: 500px;
    }
}

@media (max-width: 480px) {
    .fragment-reviews .section-title h2 {
        font-size: 28px;
    }

    .upload-btn, .submit-review {
        width: 100%;
        justify-content: center;
    }
}
/*-----------------------
 Стили для feature-section
 -------------------------*/
.feature-img {
	display: flex; /* Используем Flexbox для выравнивания */
	align-items: center; /* Выравниваем по вертикали */
	margin-bottom: 20px;
}

/* Стили для изображения */
.feature-img img {
	width: 200px; /* Изображение растянуто по ширине */
	height: 200px; /* Сохраняет пропорции изображения */
	border-radius: 8px; /* Закруглённые углы */
	object-fit: cover; /* Сохраняет пропорции изображения */
}

/* Стили для текста */
.feature-img .card-header {
	background-color: #333; /* Тёмный фон */
	color: #fff; /* Белый текст */
	padding: 10px;
	border-radius: 8px 8px 0 0; /* Закруглённые углы сверху */
}

/* Стили для кнопки */
.feature-img .del-reviews {
	background-color: #e4381C; /* Красный фон */
	color: #fff; /* Белый текст */
	border: none;
	border-radius: 4px;
	transition: background-color 0.3s;
}
/* Адаптивность для мобильных устройств */
@media (max-width: 768px) {
	.feature-img {
		flex-direction: column; /* Меняем направление на вертикальное */
		align-items: center; /* Центрируем содержимое */
	}

	.feature-img img {
		width: 100%; /* Изображение занимает всю ширину */
		margin-bottom: 10px; /* Добавляем отступ снизу */
	}

	.feature-img .card-header {
		text-align: center; /* Центрируем текст */
	}

	.feature-img .del-reviews {
		margin-top: 10px; /* Добавляем отступ сверху */
	}
}

/* Стили для формы */
.section-title  form {
	display: flex;
	flex-direction: column;
	align-items: center;
}

/* Стили для текстовых полей */
.section-title form input,
form textarea {
	width: 100%;
	padding: 10px;
	margin-bottom: 10px;
	border: 1px solid #ddd;
	border-radius: 4px;
	background-color: #444;
	color: #fff;
	font-size: 16px;
}

.classes-title form textarea {
	resize: vertical;
}
/* Стили для изменённого состояния */
form.active input,
form.active textarea {
	background-color: #e4381C !important; /* Красный фон */
	color: #fff !important; /* Белый текст */
}
/* Адаптивность для мобильных устройств */
@media (max-width: 768px) {
	.classes-title {
		padding: 10px;
	}

	form input,
	form textarea {
		font-size: 14px;
	}

	.btn {
		font-size: 14px;
	}
}
/* --------------------
Стили для price-admin
-------------------------*/
.container-price-admin {
	padding: 20px;
	background-color: #333; /* Тёмный фон */
	color: #fff; /* Белый текст */
	border-radius: 8px;
	box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
}

/* Стили для single-price-plan */
.single-price-plan-admin {
	background-color: #444; /* Тёмный фон */
	border-radius: 8px;
	padding: 20px;
	margin-bottom: 20px;
}

/* Стили для заголовка */
.single-price-plan-admin h4 {
	font-size: 24px;
	font-weight: 600;
	margin-bottom: 10px;
}

/* Стили для цены */
.price-plan-admin {
	margin-bottom: 20px;
}

.price-plan-admin h2 {
	font-size: 36px;
	font-weight: 700;
	margin-bottom: 10px;
}

.price-plan-admin p {
	font-size: 16px;
	margin-bottom: 20px;
}

/* Стили для списка */
.single-price-plan-admin ul {
	list-style: none;
	padding-left: 0;
}

.single-price-plan-admin ul li {
	font-size: 16px;
	margin-bottom: 10px;
}

/* Стили для input и textarea */
.single-price-plan-admin input,
.single-price-plan-admin textarea {
	width: 100%; /* Полная ширина */
	padding: 10px;
	margin-bottom: 10px;
	border: 1px solid #ddd;
	border-radius: 4px;
	background-color: #444;
	color: #fff;
	font-size: 16px;
	transition: background-color 0.3s;
}

/* Стили для input и textarea в активном состоянии */
form.active input,
form.active textarea {
	background-color: #e4381C !important; /* Красный фон */
	color: #fff !important; /* Белый текст */
}

/* Стили для textarea */
.single-price-plan-admin textarea {
	resize: vertical; /* Возможность изменения высоты */
}

/* Стили для списка */
.single-price-plan-admin ul li input {
	width: 100%; /* Полная ширина */
	padding: 10px;
	margin-bottom: 10px;
	border: 1px solid #ddd;
	border-radius: 4px;
	background-color: #444;
	color: #fff;
	font-size: 16px;
	transition: background-color 0.3s;
}


/* Адаптивность для мобильных устройств */
@media (max-width: 768px) {
	.container-price-admin {
		padding: 10px;
	}

	.single-price-plan-admin {
		padding: 10px;
	}

	.single-price-plan-admin h4 {
		font-size: 20px;
	}

	.price-plan-admin h2 {
		font-size: 30px;
	}

	.single-price-plan-admin ul li {
		font-size: 14px;
	}

}
/* Стили для галереи */
.gallery-filter {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	margin-top: 20px;
}

/* -----------------------
Стили для reviews-admin
--------------------------*/
.reviews-admin {
	position: relative;
	overflow: hidden;

	box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
	transition: transform 0.3s;
}

.reviews-admin:hover {
	transform: scale(1.05);
}

/* Стили для изображения */
.reviews-admin img {
	width: 300px;
	height: 300px;
	object-fit: cover;
	transition: opacity 0.3s;
}

.reviews-admin:hover img {
	opacity: 0.8;
}

/* Стили для заголовка */
.reviews-admin h4 {
	font-size: 18px;
	font-weight: 500;
	color: #fff;
	background-color: rgba(0, 0, 0, 0.5);
	padding: 10px;
	border-radius: 8px;
	position: absolute;
	top: -200px;
	left: 40%;
	transform: translateX(-50%);
	z-index: 1;
}

/* Стили для чекбокса */
.trainer-text {
	position: absolute;
	bottom: 10px;
	left: 10px;
	color: #fff;
}

.trainer-text label {
	display: inline-block;
	padding: 5px 10px;
	background-color: rgba(0, 0, 0, 0.5);
	border-radius: 4px;
	cursor: pointer;
}

.trainer-text input[type="checkbox"] {
	margin-right: 5px;
}

/* Адаптивность для мобильных устройств */
@media (max-width: 768px) {
	.gallery-filter .col-lg-4,
	.gallery-filter .col-sm-6 {
		width: 100%;
		padding: 10px;
	}
}
/*---------------------------------------
  LK - ПЕРЕМЕННЫЕ И ОБЩИЕ СТИЛИ
---------------------------------------*/

:root {
    /* Основные цвета */
    --color-primary: #e4381C;
    --color-primary-light: #e16521;
    --color-primary-gradient: linear-gradient(45deg, var(--color-primary-light), var(--color-primary));

    /* Цвета фона */
    --bg-dark: #151515;
    --bg-card: rgba(30, 30, 30, 0.9);
    --bg-card-light: rgba(30, 30, 30, 0.6);
    --bg-overlay: rgba(0, 0, 0, 0.7);
    --bg-input: rgba(0, 0, 0, 0.3);

    /* Цвета текста */
    --text-primary: #ffffff;
    --text-secondary: #afb4bf;
    --text-muted: #8f8fa8;
    --text-dark: #888;

    /* Цвета состояний */
    --color-success: #28a745;
    --color-warning: #ffc107;
    --color-danger: #ff6b6b;
    --color-info: #007bff;

    /* Размеры */
    --border-radius-sm: 8px;
    --border-radius-md: 12px;
    --border-radius-lg: 16px;
    --border-radius-xl: 20px;
    --border-radius-circle: 50%;

    /* Отступы */
    --spacing-xs: 5px;
    --spacing-sm: 10px;
    --spacing-md: 15px;
    --spacing-lg: 20px;
    --spacing-xl: 25px;
    --spacing-xxl: 30px;

    /* Тени */
    --shadow-sm: 0 4px 10px rgba(0, 0, 0, 0.2);
    --shadow-md: 0 10px 20px rgba(0, 0, 0, 0.3);
    --shadow-lg: 0 15px 30px rgba(0, 0, 0, 0.3);
    --shadow-xl: 0 15px 35px rgba(0, 0, 0, 0.5);
    --shadow-primary: 0 10px 20px rgba(228, 56, 28, 0.3);

    /* Транзишены */
    --transition-fast: 0.2s ease;
    --transition-normal: 0.3s ease;
    --transition-slow: 0.5s ease;
}

/*---------------------------------------
  LK - ОСНОВНАЯ СТРУКТУРА
---------------------------------------*/

/* Обертка LK */
.lk-wrapper {
    display: flex;
    gap: var(--spacing-xxl);
    max-width: 1400px;
    margin: 0 auto;
    padding: var(--spacing-lg) 0;
}

/* Сайдбар */
.lk-sidebar {
    flex: 0 0 320px;
}

/* Основной контент */
.lk-content {
    flex: 1;
    min-width: 0;
}

/* Заголовок контента */
.content-header {
    margin-bottom: var(--spacing-xxl);
    padding-bottom: var(--spacing-lg);
    border-bottom: 2px solid rgba(228, 56, 28, 0.3);
}

.content-header h2 {
    color: var(--text-primary);
    font-size: 32px;
    font-weight: 600;
    font-family: "Oswald", sans-serif;
    margin-bottom: var(--spacing-xs);
}

.content-header p {
    color: var(--text-secondary);
    font-size: 16px;
    margin: 0;
}

/* Тело контента */
.content-body {
    background: var(--bg-card-light);
    backdrop-filter: blur(5px);
    border-radius: var(--border-radius-xl);
    padding: var(--spacing-xl);
    border: 1px solid rgba(255, 255, 255, 0.05);
    min-height: 600px;
}

/*---------------------------------------
  LK - КАРТОЧКА ПРОФИЛЯ
---------------------------------------*/

.profile-card {
    background: var(--bg-card);
    backdrop-filter: blur(10px);
    border-radius: var(--border-radius-xl);
    padding: var(--spacing-xxl) var(--spacing-lg);
    box-shadow: var(--shadow-xl);
    border: 1px solid rgba(255, 255, 255, 0.05);
    color: var(--text-primary);
    position: sticky;
    top: 20px;
}

/* Аватар профиля */
.profile-avatar {
    width: 150px;
    height: 150px;
    margin: 0 auto var(--spacing-xl);
    border-radius: var(--border-radius-circle);
    overflow: hidden;
    border: 3px solid transparent;
    background: var(--color-primary-gradient) border-box;
    -webkit-mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0);
    mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    box-shadow: var(--shadow-primary);
}

.profile-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Информация профиля */
.profile-info {
    text-align: center;
    margin-bottom: var(--spacing-xl);
    padding-bottom: var(--spacing-xl);
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.profile-name {
    font-size: 24px;
    font-weight: 600;
    margin-bottom: var(--spacing-xs);
    color: var(--text-primary);
    font-family: "Oswald", sans-serif;
}

.profile-email {
    font-size: 14px;
    color: var(--text-secondary);
    margin-bottom: var(--spacing-md);
}

.profile-reg-date {
    font-size: 13px;
    color: var(--text-muted);
    background: rgba(0, 0, 0, 0.3);
    padding: var(--spacing-xs) var(--spacing-md);
    border-radius: 30px;
    display: inline-block;
}

.profile-reg-date i {
    margin-right: var(--spacing-xs);
    color: var(--color-primary);
}

/* Кнопки действий */
.profile-actions {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-sm);
}

.action-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--spacing-sm);
    width: 100%;
    padding: 14px var(--spacing-lg);
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: var(--border-radius-md);
    color: var(--text-primary);
    font-size: 16px;
    font-weight: 500;
    font-family: "Oswald", sans-serif;
    text-transform: uppercase;
    letter-spacing: 1px;
    cursor: pointer;
    transition: all var(--transition-normal);
}

.action-btn i {
    font-size: 18px;
    color: var(--color-primary);
    transition: color var(--transition-normal);
}

.action-btn:hover {
    background: var(--color-primary-gradient);
    border-color: transparent;
    transform: translateY(-2px);
    box-shadow: var(--shadow-primary);
}

.action-btn:hover i {
    color: var(--text-primary);
}

.action-btn.logout-btn {
    background: rgba(200, 50, 50, 0.1);
    border-color: rgba(200, 50, 50, 0.3);
    margin-top: var(--spacing-sm);
}

.action-btn.logout-btn i {
    color: var(--color-danger);
}

.action-btn.logout-btn:hover {
    background: linear-gradient(45deg, #ff4757, #ff6b6b);
    border-color: transparent;
}

/*---------------------------------------
  LK - ЗАГОЛОВКИ СЕКЦИЙ
---------------------------------------*/

.section-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--spacing-lg);
    padding-bottom: var(--spacing-sm);
    border-bottom: 1px solid rgba(228, 56, 28, 0.3);
}

.section-header h3,
.section-header h4 {
    color: var(--text-primary);
    font-weight: 500;
    font-family: "Oswald", sans-serif;
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    margin: 0;
}

.section-header h3 {
    font-size: 20px;
}

.section-header h4 {
    font-size: 18px;
}

.section-header h3 i,
.section-header h4 i {
    color: var(--color-primary);
    font-size: 24px;
}

.section-badge,
.section-count {
    color: var(--text-secondary);
    font-size: 14px;
    background: rgba(0, 0, 0, 0.3);
    padding: 4px 12px;
    border-radius: 20px;
    border: 1px solid rgba(228, 56, 28, 0.3);
}

/*---------------------------------------
  LK - КАРТОЧКИ
---------------------------------------*/

/* Базовая карточка */
.base-card {
    background: var(--bg-card-light);
    backdrop-filter: blur(5px);
    border-radius: var(--border-radius-lg);
    border: 1px solid rgba(255, 255, 255, 0.05);
    overflow: hidden;
    transition: transform var(--transition-normal), box-shadow var(--transition-normal);
}

.base-card:hover {
    transform: translateY(-3px);
    box-shadow: var(--shadow-lg);
    border-color: rgba(228, 56, 28, 0.3);
}

/* Карточка профиля (для редактирования) */
.profile-edit-card {
    background: var(--bg-card);
    backdrop-filter: blur(5px);
    border-radius: var(--border-radius-lg);
    border: 1px solid rgba(255, 255, 255, 0.05);
    overflow: hidden;
    box-shadow: var(--shadow-md);
    margin-bottom: var(--spacing-lg);
}

/* Заголовок карточки */
.card-header {
    background: rgba(0, 0, 0, 0.3);
    padding: 18px var(--spacing-xl);
    border-bottom: 1px solid rgba(228, 56, 28, 0.3);
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
}

.card-header i {
    color: var(--color-primary);
    font-size: 22px;
}

.card-header h4 {
    color: var(--text-primary);
    font-size: 18px;
    font-weight: 500;
    font-family: "Oswald", sans-serif;
    margin: 0;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Тело карточки */
.card-body {
    padding: var(--spacing-xl);
}

/*---------------------------------------
  LK - ФОРМЫ
---------------------------------------*/

/* Базовая форма */
.modern-form {
    background: var(--bg-card-light);
    backdrop-filter: blur(5px);
    border-radius: var(--border-radius-lg);
    padding: var(--spacing-xl);
    border: 1px solid rgba(255, 255, 255, 0.05);
}

/* Строка формы */
.form-row {
    display: flex;
    gap: var(--spacing-xl);
    flex-wrap: wrap;
}

/* Колонки формы */
.form-col {
    flex: 1;
    min-width: 250px;
}

.form-col-image {
    flex: 0 0 280px;
    min-width: 250px;
}

.form-col-image-small {
    flex: 0 0 200px;
}

.form-col-content {
    flex: 1;
    min-width: 300px;
    display: flex;
    flex-direction: column;
    width: 100%;
}

/* Группа формы */
.form-group {
    width: 100%;
    margin-bottom: var(--spacing-lg);
}

.form-group label {
    display: block;
    color: var(--text-primary);
    margin-bottom: var(--spacing-xs);
    font-weight: 500;
    font-family: "Oswald", sans-serif;
    font-size: 14px;
    letter-spacing: 1px;
}

.form-group label i {
    color: var(--color-primary);
    margin-right: var(--spacing-xs);
}

/* Поля ввода */
.form-control {
    width: 100%;
    padding: 12px var(--spacing-md);
    background: var(--bg-input);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: var(--border-radius-sm);
    color: var(--text-primary);
    font-size: 15px;
    transition: all var(--transition-normal);
    box-sizing: border-box;
}

.form-control:focus {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: 0 0 0 3px rgba(228, 56, 28, 0.2);
    background: rgba(0, 0, 0, 0.5);
}

.form-control::placeholder {
    color: var(--text-dark);
    opacity: 0.8;
}

textarea.form-control {
    resize: vertical;
    min-height: 100px;
}

/* Подсказки */
.field-hint {
    display: block;
    color: var(--text-secondary);
    font-size: 12px;
    margin-top: var(--spacing-xs);
    font-style: italic;
}

.file-hint {
    color: var(--text-secondary);
    font-size: 12px;
    margin-top: var(--spacing-xs);
    display: block;
    text-align: center;
}

.file-hint i {
    color: var(--color-primary);
    margin-right: 3px;
}

/* Кнопки */
.btn {
    padding: 12px 30px;
    border: none;
    border-radius: var(--border-radius-sm);
    font-size: 14px;
    font-weight: 600;
    font-family: "Oswald", sans-serif;
    text-transform: uppercase;
    letter-spacing: 1px;
    cursor: pointer;
    transition: all var(--transition-normal);
    color: var(--text-primary);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--spacing-xs);
}

.btn-primary {
    background: var(--color-primary-gradient);
}

.btn-primary:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-primary);
}

.btn-secondary {
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.2);
}

.btn-secondary:hover {
    background: rgba(255, 255, 255, 0.05);
    border-color: rgba(255, 255, 255, 0.3);
}

.btn-block {
    width: 100%;
}

/* Контейнер кнопок */
.form-actions {
    width: 100%;
    display: flex;
    gap: var(--spacing-md);
    margin-top: var(--spacing-sm);
}

.form-actions .btn {
    flex: 1;
    min-width: 120px;
}

/* Специальная кнопка загрузки файлов */
.upload-file-btn {
    background: transparent;
    border: 2px solid var(--color-primary);
    color: var(--text-primary);
    padding: 12px var(--spacing-lg);
    border-radius: var(--border-radius-sm);
    cursor: pointer;
    font-size: 15px;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--spacing-sm);
    transition: all var(--transition-normal);
    width: 100%;
    margin-bottom: var(--spacing-xs);
}

.upload-file-btn:hover {
    background: var(--color-primary);
    color: var(--text-primary);
    transform: translateY(-2px);
    box-shadow: var(--shadow-primary);
}

.upload-file-btn i {
    color: var(--color-primary);
    font-size: 18px;
}

.upload-file-btn:hover i {
    color: var(--text-primary);
}

.upload-file-btn.small {
    padding: 8px 12px;
    font-size: 13px;
}

.upload-file-btn.small i {
    font-size: 14px;
}

/*---------------------------------------
  LK - ЗАГРУЗКА ИЗОБРАЖЕНИЙ
---------------------------------------*/

/* Контейнер загрузки */
.image-upload-container {
    background: rgba(0, 0, 0, 0.2);
    border-radius: var(--border-radius-md);
    padding: var(--spacing-md);
    text-align: center;
}
/* Выравнивание по высоте */
.review-row {
    display: flex;
    align-items: stretch;
}
.review-row > [class*="col-"] {
    display: flex;
}

/* Превью изображения */
.image-preview {
    position: relative;
    width: 100%;
    aspect-ratio: 1 / 1;
    border-radius: var(--border-radius-sm);
    overflow: hidden;
    background: #2d2d2d;
    margin-bottom: var(--spacing-md);
    border: 2px dashed rgba(228, 56, 28, 0.3);
}

.image-preview img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: relative;
    z-index: 1;
}

/* Плейсхолдер */
.preview-placeholder {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: var(--bg-overlay);
    border-radius: var(--border-radius-sm);
    z-index: 2;
    pointer-events: none;
    backdrop-filter: blur(2px);
}

.preview-placeholder i {
    font-size: 48px;
    margin-bottom: var(--spacing-sm);
    color: var(--color-primary);
    opacity: 0.9;
    text-shadow: 0 2px 5px rgba(0, 0, 0, 0.5);
}

.preview-placeholder span {
    color: var(--text-primary);
    font-size: 14px;
    font-weight: 500;
    text-align: center;
    padding: 0 var(--spacing-md);
    line-height: 1.4;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
}

.preview-placeholder.small i {
    font-size: 32px;
}

.preview-placeholder.small span {
    font-size: 12px;
}

/* Скрытый плейсхолдер */
.preview-placeholder.hidden,
.image-preview.has-image .preview-placeholder {
    display: none;
}
.image-preview.has-image {
    border: 2px solid rgba(228, 56, 28, 0.8);
}
/*---------------------------------------
  LK - АВАТАРЫ
---------------------------------------*/

/* Аватар в карточке профиля */
.profile-avatar {
    width: 150px;
    height: 150px;
    margin: 0 auto var(--spacing-xl);
    border-radius: var(--border-radius-circle);
    overflow: hidden;
    border: 3px solid transparent;
    background: var(--color-primary-gradient) border-box;
    -webkit-mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0);
    mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;

    box-shadow: var(--shadow-primary);
}

/* Превью аватара в редактировании */
.avatar-preview-container {
    display: flex;
    justify-content: center;
    margin-bottom: var(--spacing-xl);
}

.avatar-preview {
    width: 150px;
    height: 150px;
    border-radius: var(--border-radius-circle);
    overflow: hidden;
    border: 4px solid transparent;
    background: var(--color-primary-gradient) border-box;
    -webkit-mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0);
    mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;

    box-shadow: var(--shadow-primary);
    transition: transform var(--transition-normal);
}

.avatar-preview:hover {
    transform: scale(1.05);
}

.avatar-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/*---------------------------------------
  LK - ТАТУИРОВКИ (СЕТКА)
---------------------------------------*/

/* Секция татуировок */
.tattoos-section {
    width: 100%;
    margin-bottom: var(--spacing-xxl);
    background: rgba(20, 20, 20, 0.4);
    border-radius: var(--border-radius-md);
    padding: var(--spacing-lg);
}

/* Контейнер сетки с фиксированной высотой */
.tattoos-grid-container {
    height: 400px;
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: var(--spacing-sm);
    margin-bottom: var(--spacing-sm);
    border-radius: var(--border-radius-sm);
    background: rgba(0, 0, 0, 0.1);
    mask-image: linear-gradient(to bottom, black 95%, transparent 100%);
    -webkit-mask-image: linear-gradient(to bottom, black 95%, transparent 100%);
}

/* Сама сетка */
.tattoos-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: var(--spacing-lg);
    padding: var(--spacing-xs) 0;
}

/* Карточка татуировки */
.tattoo-card {
    border-radius: var(--border-radius-sm);
    overflow: hidden;
    background: #2d2d2d;
    transition: transform var(--transition-normal), box-shadow var(--transition-normal);
    box-shadow: var(--shadow-sm);
}

.tattoo-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(228, 56, 28, 0.2);
}

/* Обертка изображения */
.tattoo-image-wrapper {
    position: relative;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    cursor: pointer;
}

/* Изображение */
.tattoo-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform var(--transition-slow);
}

.tattoo-card:hover .tattoo-image {
    transform: scale(1.1);
}

/* Оверлей */
.tattoo-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: var(--bg-overlay);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: var(--spacing-md);
    opacity: 0;
    transition: opacity var(--transition-normal);
    pointer-events: none;
}

.tattoo-card:hover .tattoo-overlay {
    opacity: 1;
    pointer-events: auto;
}

/* Описание */
.tattoo-description {
    color: var(--text-primary);
    font-size: 14px;
    line-height: 1.4;
    margin: 0;
    word-break: break-word;
    max-height: 80px;
    overflow-y: auto;
    background: rgba(0, 0, 0, 0.5);
    padding: var(--spacing-xs);
    border-radius: 4px;
    border-left: 3px solid var(--color-primary);
}

/* Кнопки действий */
.tattoo-actions {
    display: flex;
    gap: var(--spacing-sm);
    justify-content: flex-end;
}

.tattoo-btn {
    width: 36px;
    height: 36px;
    border: none;
    border-radius: var(--border-radius-circle);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all var(--transition-normal);
    background: rgba(255, 255, 255, 0.2);
    color: var(--text-primary);
    border: 1px solid rgba(255, 255, 255, 0.3);
}

.tattoo-btn i {
    font-size: 16px;
}

.delete-btn:hover {
    background: var(--color-primary);
    border-color: var(--color-primary);
    transform: scale(1.1);
}

.edit-btn:hover {
    background: var(--color-info);
    border-color: var(--color-info);
    transform: scale(1.1);
}

/*---------------------------------------
  LK - ОТЗЫВЫ
---------------------------------------*/

/* Контейнер отзывов */
.reviews-container {
    width: 100%;
    margin-bottom: var(--spacing-xxl);
}

/* Контейнер с прокруткой */
.reviews-list-container {
    max-height: 500px;
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: var(--spacing-md);
    margin-bottom: var(--spacing-lg);
    border-radius: var(--border-radius-md);
    background: rgba(0, 0, 0, 0.1);
}

/* Список отзывов */
.reviews-list {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-lg);
    padding: var(--spacing-xs) 0;
}

/* Карточка отзыва */
.review-card {
    background: var(--bg-card-light);
    backdrop-filter: blur(5px);
    border-radius: var(--border-radius-lg);
    border: 1px solid rgba(255, 255, 255, 0.05);
    overflow: hidden;
    transition: transform var(--transition-normal), box-shadow var(--transition-normal);
}

.review-card:hover {
    transform: translateY(-3px);
    box-shadow: var(--shadow-lg);
    border-color: rgba(228, 56, 28, 0.3);
}

/* Шапка карточки */
.review-card-header {
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
    padding: var(--spacing-lg);
    background: rgba(0, 0, 0, 0.2);
    border-bottom: 1px solid rgba(228, 56, 28, 0.2);
    position: relative;
}

/* Аватар автора */
.review-author-avatar {
    width: 60px;
    height: 60px;
    border-radius: var(--border-radius-circle);
    overflow: hidden;
    border: 2px solid var(--color-primary);
    flex-shrink: 0;
}

.avatar-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Информация об авторе */
.review-author-info {
    flex: 1;
}

.review-author-name {
    color: var(--text-primary);
    font-size: 18px;
    font-weight: 600;
    margin: 0 0 var(--spacing-xs) 0;
    font-family: "Oswald", sans-serif;
}

.review-meta {
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
}

.review-date {
    color: var(--text-secondary);
    font-size: 13px;
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
}

.review-date i {
    color: var(--color-primary);
    font-size: 12px;
}

/* Кнопка удаления */
.review-delete-btn {
    width: 36px;
    height: 36px;
    border-radius: var(--border-radius-circle);
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.2);
    color: var(--color-danger);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all var(--transition-normal);
    position: absolute;
    top: var(--spacing-lg);
    right: var(--spacing-lg);
}

.review-delete-btn:hover {
    background: var(--color-primary);
    color: var(--text-primary);
    transform: scale(1.1);
    border-color: var(--color-primary);
}

/* Тело карточки */
.review-card-body {
    padding: var(--spacing-lg);
}

.review-content {
    color: var(--text-primary);
    font-size: 15px;
    line-height: 1.6;
    margin: 0;
}

/* Футер карточки */
.review-card-footer {
    padding: 12px var(--spacing-lg);
    background: rgba(0, 0, 0, 0.2);
    border-top: 1px solid rgba(255, 255, 255, 0.05);
}

.review-attachment {
    display: inline-flex;
    align-items: center;
    gap: var(--spacing-xs);
    background: rgba(228, 56, 28, 0.1);
    padding: 6px var(--spacing-md);
    border-radius: 30px;
    border: 1px solid rgba(228, 56, 28, 0.3);
}

.review-attachment i {
    color: var(--color-primary);
    font-size: 14px;
}

.review-attachment span {
    color: var(--text-primary);
    font-size: 13px;
}

/*---------------------------------------
  LK - РЕЙТИНГ ЗВЕЗДАМИ
---------------------------------------*/

.rating-group {
    margin-bottom: var(--spacing-lg);
}

.rating-group label {
    display: block;
    color: var(--text-primary);
    margin-bottom: var(--spacing-sm);
    font-weight: 500;
    font-family: "Oswald", sans-serif;
    font-size: 14px;
    letter-spacing: 1px;
}

.rating-group label i {
    color: var(--color-primary);
    margin-right: var(--spacing-xs);
}

.rating-stars {
    display: flex;
    flex-direction: row-reverse;
    justify-content: flex-end;
    gap: var(--spacing-xs);
}

.rating-stars input {
    display: none;
}

.rating-stars label {
    font-size: 30px;
    color: #555;
    cursor: pointer;
    transition: all var(--transition-fast);
    margin: 0;
    padding: 0 2px;
}

.rating-stars label:hover,
.rating-stars label:hover ~ label,
.rating-stars input:checked ~ label {
    color: var(--color-warning);
    transform: scale(1.1);
    text-shadow: 0 0 10px rgba(255, 193, 7, 0.5);
}

/*---------------------------------------
  LK - ПУСТЫЕ СОСТОЯНИЯ
---------------------------------------*/

.empty-state {
    text-align: center;
    padding: 50px var(--spacing-lg);
    background: rgba(0, 0, 0, 0.2);
    border-radius: var(--border-radius-md);
    border: 2px dashed rgba(228, 56, 28, 0.3);
}

.empty-state i {
    font-size: 64px;
    color: var(--color-primary);
    opacity: 0.5;
    margin-bottom: var(--spacing-md);
}

.empty-state h4 {
    color: var(--text-primary);
    font-size: 20px;
    font-weight: 500;
    margin-bottom: var(--spacing-sm);
    font-family: "Oswald", sans-serif;
}

.empty-state p {
    color: var(--text-secondary);
    font-size: 14px;
    margin: 0;
}

.text-muted {
    color: var(--text-secondary) !important;
    font-size: 16px;
}

/*---------------------------------------
  LK - ИНФОРМАЦИОННЫЙ БЛОК
---------------------------------------*/

.info-box {
    background: rgba(228, 56, 28, 0.1);
    border-left: 4px solid var(--color-primary);
    border-radius: var(--border-radius-md);
    padding: 18px var(--spacing-lg);
    display: flex;
    gap: var(--spacing-md);
    align-items: flex-start;
}

.info-box i {
    color: var(--color-primary);
    font-size: 24px;
    flex-shrink: 0;
}

.info-content h5 {
    color: var(--text-primary);
    font-size: 16px;
    font-weight: 600;
    margin: 0 0 6px 0;
    font-family: "Oswald", sans-serif;
}

.info-content p {
    color: var(--text-secondary);
    font-size: 13px;
    line-height: 1.5;
    margin: 0;
}

/*---------------------------------------
  LK - СЕТКА ПРОФИЛЯ (РЕДАКТИРОВАНИЕ)
---------------------------------------*/

.profile-edit-grid {
    display: grid;
    grid-template-columns: 1fr 320px;
    gap: var(--spacing-xl);
    margin-top: var(--spacing-lg);
}

.profile-edit-form-col,
.profile-avatar-col {
    width: 100%;
}

.avatar-card-body {
    padding: var(--spacing-xxl) var(--spacing-xl);
    text-align: center;
}

.avatar-upload-form {
    width: 100%;
}

.avatar-upload-form .upload-controls.vertical {
    margin-bottom: var(--spacing-lg);
}

/*---------------------------------------
  LK - РАЗДЕЛИТЕЛИ
---------------------------------------*/

.file-hint.or-divider {
    display: block;
    margin: 8px 0;
    color: var(--text-secondary);
    font-size: 12px;
    position: relative;
}

.file-hint.or-divider::before,
.file-hint.or-divider::after {
    content: '';
    position: absolute;
    top: 50%;
    width: 30%;
    height: 1px;
    background: rgba(255, 255, 255, 0.1);
}

.file-hint.or-divider::before {
    left: 0;
}

.file-hint.or-divider::after {
    right: 0;
}

/*---------------------------------------
  LK - СКРОЛЛЫ
---------------------------------------*/

/* Общие стили для скроллов */
.tattoos-grid-container::-webkit-scrollbar,
.reviews-list-container::-webkit-scrollbar,
.reviews-list::-webkit-scrollbar,
.scroll-container::-webkit-scrollbar {
    width: 8px;
}

.tattoos-grid-container::-webkit-scrollbar-track,
.reviews-list-container::-webkit-scrollbar-track,
.reviews-list::-webkit-scrollbar-track,
.scroll-container::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.05);
    border-radius: 10px;
}

.tattoos-grid-container::-webkit-scrollbar-thumb,
.reviews-list-container::-webkit-scrollbar-thumb,
.reviews-list::-webkit-scrollbar-thumb,
.scroll-container::-webkit-scrollbar-thumb {
    background: var(--color-primary-gradient);
    border-radius: 10px;
    border: 2px solid rgba(0, 0, 0, 0.2);
}

.tattoos-grid-container::-webkit-scrollbar-thumb:hover,
.reviews-list-container::-webkit-scrollbar-thumb:hover,
.reviews-list::-webkit-scrollbar-thumb:hover,
.scroll-container::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(45deg, var(--color-primary), var(--color-primary-light));
}

/* Для Firefox */
.tattoos-grid-container,
.reviews-list-container,
.reviews-list,
.scroll-container {
    scrollbar-width: thin;
    scrollbar-color: var(--color-primary) rgba(255, 255, 255, 0.05);
}

/*---------------------------------------
  LK - АДАПТИВНОСТЬ
---------------------------------------*/

/* Десктоп (до 1200px) */
@media (max-width: 1200px) {
    .lk-wrapper {
        padding: var(--spacing-lg) var(--spacing-md);
    }
}

/* Планшеты (до 992px) */
@media (max-width: 992px) {
    .lk-wrapper {
        flex-direction: column;
    }

    .lk-sidebar {
        flex: auto;
    }

    .profile-card {
        position: static;
        max-width: 500px;
        margin: 0 auto;
    }

    .profile-actions {
        flex-direction: row;
        flex-wrap: wrap;
    }

    .action-btn {
        flex: 1 1 auto;
        min-width: 150px;
    }

    .profile-edit-grid {
        grid-template-columns: 1fr;
        gap: var(--spacing-lg);
    }

    .profile-avatar-col {
        max-width: 500px;
        margin: 0 auto;
    }
}

/* Мобильные (до 768px) */
@media (max-width: 768px) {
    .form-row {
        flex-direction: column;
    }

    .form-col-image,
    .form-col-image-small {
        flex: auto;
        max-width: 300px;
        margin: 0 auto;
    }

    .form-col-content .form-actions {
        flex-direction: column;
    }

    .form-col-content .form-actions .btn {
        width: 100%;
    }

    .tattoos-grid-container {
        height: 350px;
    }

    .tattoos-grid {
        grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
        gap: var(--spacing-md);
    }

    .reviews-list-container {
        max-height: 400px;
        padding-right: var(--spacing-sm);
    }

    .review-card-header {
        flex-wrap: wrap;
    }

    .review-author-avatar {
        width: 50px;
        height: 50px;
    }

    .review-author-name {
        font-size: 16px;
    }

    .review-delete-btn {
        position: static;
        margin-left: auto;
    }

    .rating-stars label {
        font-size: 25px;
    }

    .card-header {
        padding: var(--spacing-md) var(--spacing-lg);
    }

    .card-body {
        padding: var(--spacing-lg);
    }

    .avatar-preview {
        width: 120px;
        height: 120px;
    }

    .info-box {
        padding: var(--spacing-md);
    }
}

/* Маленькие мобильные (до 480px) */
@media (max-width: 480px) {
    .tattoos-grid-container {
        height: 300px;
    }

    .tattoos-grid {
        grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
        gap: var(--spacing-sm);
    }

    .reviews-list-container {
        max-height: 350px;
    }

    .empty-state {
        padding: 30px var(--spacing-md);
    }

    .empty-state i {
        font-size: 48px;
    }

    .empty-state h4 {
        font-size: 18px;
    }

    .profile-actions {
        flex-direction: column;
    }

    .action-btn {
        width: 100%;
    }

    .content-header h2 {
        font-size: 24px;
    }

    .section-header h3 {
        font-size: 18px;
    }

    .section-header h3 i {
        font-size: 20px;
    }
}
/*-------------------------------
Стили для контактной информации админ
-------------------------------*/
.contact-info-admin{
	padding: 40px;
	background-color: #333; /* Тёмный фон */
	color: #fff; /* Белый текст */
	border-radius: 8px;
	box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
	margin: 15px;
}

/* Стили для заголовка */
.contact-info-admin h2 {
	font-size: 24px;
	font-weight: 600;
	margin-bottom: 20px;
}

/* Стили для формы */
.contact-info-admin form {
	display: flex;
	flex-direction: column;
	align-items: center;
	width:100%;
	margin:15px;
}

/* Стили для input-group */
.contact-info-admin .input-group {
	width: 100%;
	margin-bottom: 20px;
}


/* Адаптивность для мобильных устройств */
@media (max-width: 768px) {
	.contact-info-admin {
		padding: 10px;
	}

	.contact-info-admin input[type="tel"] {
		font-size: 14px;
	}

	.contact-info-admin .btn-primary {
		font-size: 14px;
		padding: 8px 16px;
	}
}
/*---------------------
  Map Section Styles
-----------------------*/

.map-section {
    position: relative;
    width: 100%;
    overflow: hidden;
    background: #f8f9fa;
}

.map-container {
    position: relative;
    width: 100%;
    height: 100%;
    min-height: 500px;
    background: #e9ecef;
    overflow: hidden;
}

/* Контейнер для рекламы */
.yandex-ad-container {
    width: 100%;
    height: 100%;
    min-height: 500px;
    background: #ffffff;
}

/* Карта если будет iframe */
.yandex-ad-container iframe {
    width: 100% !important;
    height: 100% !important;
    min-height: 500px;
    display: block;
}

/*---------------------
  Map Contact Info
-----------------------*/

.map-contact-info {
    background: #ffffff;
    padding: 40px;
    height: 100%;
    min-height: 590px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

/* Блоки информации */
.info-block {
    margin-bottom: 30px;
}

.info-block h5 {
    font-size: 20px;
    color: #000000;
    font-weight: 600;
    text-transform: uppercase;
    margin-bottom: 20px;
    font-family: "Oswald", sans-serif;
}

.info-block p {
    font-size: 16px;
    color: #333333;
    font-family: "Nunito Sans", sans-serif;
    margin: 0;
    padding: 5px 0;
}

/* Форма */
.info-block form input,
.info-block form textarea {
    width: 100%;
    padding: 12px 15px;
    margin-bottom: 15px;
    border: 1px solid #e1e1e1;
    border-radius: 4px;
    font-size: 15px;
    font-family: "Nunito Sans", sans-serif;
    color: #333333;
    background: #ffffff;
}

.info-block form input:focus,
.info-block form textarea:focus {
    border-color: #e4381C;
    outline: none;
}

.info-block form textarea {
    height: 100px;
    resize: vertical;
}

.info-block form button {
    width: 100%;
    padding: 14px 20px;
    background: #e4381C;
    color: #ffffff;
    border: none;
    border-radius: 4px;
    font-size: 16px;
    font-weight: 600;
    font-family: "Oswald", sans-serif;
    text-transform: uppercase;
    letter-spacing: 1px;
    cursor: pointer;
    transition: background 0.3s;
    margin-top: 10px;
}

.info-block form button:hover {
    background: #e16521;
}

/* Статус сообщения */
.status-message {
    margin-top: 15px;
    padding: 10px;
    border-radius: 4px;
    font-size: 14px;
    text-align: center;
    font-family: "Nunito Sans", sans-serif;
}

.status-message[th\:text]:not(:empty) {
    background: #d4edda;
    color: #155724;
    border: 1px solid #c3e6cb;
}

/* Адаптивность */
@media (max-width: 992px) {
    .map-contact-info {
        min-height: auto;
        padding: 30px;
    }
}

@media (max-width: 768px) {
    .map-contact-info {
        padding: 25px;
    }

    .info-block h5 {
        font-size: 18px;
    }
}
/*---------------------
  Price Section
-----------------------*/

.price-section {
	padding-top: 90px;
	padding-bottom: 70px;
}

.price-section .section-title {
	text-align: center;
	margin-bottom: 36px;
}

.price-section .section-title p {
	color: #ffffff;
}

.price-section .toggle-option {
	text-align: center;
	margin-bottom: 50px;
}

.price-section .toggle-option li {
	list-style: none;
	display: inline-block;
	font-size: 16px;
	font-family: "Oswald", sans-serif;
	color: #ffffff;
	letter-spacing: 1px;
	margin-right: 10px;
}

.price-section .toggle-option li:last-child {
	margin-right: 0;
}

.price-section .toggle-option li .switch {
	position: relative;
	display: inline-block;
	width: 70px;
	height: 30px;
	margin-bottom: 0;
}

.price-section .toggle-option li .switch input {
	opacity: 0;
	width: 0;
	height: 0;
}

.price-section .toggle-option li .switch .slider {
	position: absolute;
	cursor: pointer;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(255, 255, 255, 0.3);
	border-radius: 2px;
	-webkit-transition: 0.4s;
	-o-transition: 0.4s;
	transition: 0.4s;
}

.price-section .toggle-option li .switch .slider::before {
	position: absolute;
	content: "";
	height: 30px;
	width: 35px;
	right: 0;
	bottom: 0;
	background-color: white;
	-webkit-transition: 0.4s;
	-o-transition: 0.4s;
	transition: 0.4s;
	border-radius: 2px;
}

.price-section .toggle-option li .switch input:checked+.slider:before {
	-webkit-transform: translateX(-35px);
	-ms-transform: translateX(-35px);
	transform: translateX(-35px);
}

.single-price-plan {
	background: #ffffff;
	text-align: center;
	padding: 45px 0 50px;
	position: relative;
	overflow: hidden;
	margin-bottom: 30px;
}

.single-price-plan h4 {
	color: #272727;
	font-weight: 600;
	text-transform: uppercase;
	margin-bottom: 34px;
}

.single-price-plan .price-plan {
	margin-bottom: 35px;
}

.single-price-plan .price-plan h2 {
	color: #272727;
	font-size: 48px;
	font-weight: 700;
	position: relative;
	padding-left: 18px;
	margin-bottom: 10px;
	display: inline-block;
}

.single-price-plan .price-plan h2 span {
	color: #272727;
	font-size: 18px;
	font-weight: 700;
	position: absolute;
	left: 0;
	top: 9px;
}

.single-price-plan .price-plan p {
	font-size: 16px;
	line-height: 20px;
	color: #272727;
	font-family: "Oswald", sans-serif;
	text-transform: uppercase;
	letter-spacing: 2px;
}

.single-price-plan ul {
	margin-bottom: 35px;
}

.single-price-plan ul li {
	list-style: none;
	font-size: 16px;
	font-weight: 600;
	color: #272727;
	line-height: 42px;
}

.single-price-plan .primary-btn.price-btn {
	background-image: -webkit-gradient(linear, left top, right top, color-stop(100%, #e16521), color-stop(0%, #e4381C)), -webkit-gradient(linear, left top, right top, color-stop(100%, #e4381C), color-stop(0%, #e16521));
	background-image: -o-linear-gradient(left, #e16521 100%, #e4381C 0%), -o-linear-gradient(left, #e4381C 100%, #e16521 0%);
	background-image: linear-gradient(to right, #e16521 100%, #e4381C 0%), linear-gradient(to right, #e4381C 100%, #e16521 0%);
	color: #e4381C;
}

.single-price-plan .primary-btn.price-btn:hover {
	color: #ffffff;
}

.single-price-plan .primary-btn.price-btn:hover:after {
	opacity: 1;
}

.single-price-plan .tic-text {
	width: 160px;
	height: 40px;
	background: #e4381C;
	position: absolute;
	right: -67px;
	top: -5px;
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
}

.single-price-plan .tic-text i {
	position: absolute;
	left: 69px;
	top: 15px;
	color: #ffffff;
}

/*---------------------
  Choseup Section
-----------------------*/

.chooseus-section {
	background: #151515;
	padding-top: 88px;
	padding-bottom: 50px;
}

.chooseus-section.schedule-page .section-title {
	text-align: center;
}

.chooseus-section.schedule-page .choose-item {
	text-align: center;
}

.chooseus-section .section-title {
	margin-bottom: 52px;
}

.choose-item {
	margin-bottom: 40px;
}

.choose-item h5 {
	font-size: 20px;
	color: #ffffff;
	font-weight: 500;
	text-transform: uppercase;
	margin-top: 20px;
	margin-bottom: 25px;
}

.choose-item p {
	color: #7b7b7b;
	font-weight: 500;
}

/*---------------------
  Video Section
-----------------------*/

.video-section {
	text-align: center;
	height: 500px;
}

.video-section .video-text {
	text-align: center;
	padding-top: 150px;
}

.video-section .video-text h2 {
	font-size: 60px;
	color: #ffffff;
	font-weight: 500;
	text-transform: uppercase;
	margin-bottom: 42px;
}

.video-section .video-text .play-btn {
	display: inline-block;
	height: 60px;
	width: 60px;
	font-size: 22px;
	background: #ffffff;
	text-align: center;
	line-height: 62px;
	color: #e4381C;
	border-radius: 50%;
	position: relative;
	padding-left: 5px;
}

.video-section .video-text .play-btn:after {
	position: absolute;
	left: -5px;
	top: -5px;
	width: 70px;
	height: 70px;
	background: #ffffff;
	opacity: 0.3;
	border-radius: 50%;
	content: "";
}

/*---------------------
  Blog Section
-----------------------*/

.blog-section {
	background: #151515;
	padding-top: 90px;
	padding-bottom: 66px;
}

.blog-section .section-title {
	margin-bottom: 55px;
}

.blog-item {
	position: relative;
	margin-bottom: 30px;
}

.blog-item:hover .play-btn {
	opacity: 1;
	visibility: visible;
}

.blog-item.large-item {
	height: 420px;
}

.blog-item.large-item.xl-large {
	height: 440px;
}

.blog-item.large-item.xls-large {
	height: 460px;
}

.blog-item.large-item.m-item {
	height: 400px;
}

.blog-item.small-item {
	height: 260px;
}

.blog-item.sm-item {
	height: 330px;
}

.blog-item.sms-item {
	height: 320px;
}

.blog-item .blog-text {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	padding-left: 30px;
	padding-bottom: 30px;
	padding-right: 30px;
}

.blog-item .blog-text .categories {
	font-size: 14px;
	color: #ffffff;
	text-transform: uppercase;
}

.blog-item .blog-text h5 {
	font-size: 20px;
	color: #ffffff;
	font-weight: 500;
	margin-top: 10px;
}

.blog-item.instagram-item {
	background: -webkit-gradient(linear, left top, right top, from(#e16521), to(#e4381C));
	background: -o-linear-gradient(left, #e16521, #e4381C);
	background: linear-gradient(to right, #e16521, #e4381C);
	padding: 44px 30px 65px;
}

.blog-item.instagram-item .instagram-text {
	display: block;
}

.blog-item.instagram-item .instagram-text .categories {
	font-size: 14px;
	color: #ffffff;
	text-transform: uppercase;
	position: relative;
}

.blog-item.instagram-item .instagram-text .categories i {
	font-size: 20px;
	position: absolute;
	right: 0;
	top: 0;
}

.blog-item.instagram-item .instagram-text h5 {
	font-size: 20px;
	color: #ffffff;
	font-weight: 500;
	margin-top: 10px;
	text-transform: uppercase;
	line-height: 1.5;
}

.blog-item .play-btn {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	height: 100%;
}

.blog-item .play-btn .play-in-btn {
	display: inline-block;
	height: 60px;
	width: 60px;
	font-size: 22px;
	background: #ffffff;
	text-align: center;
	line-height: 62px;
	color: #e4381C;
	border-radius: 50%;
	position: relative;
	padding-left: 5px;
}

.blog-item .play-btn .play-in-btn:after {
	position: absolute;
	left: -5px;
	top: -5px;
	width: 70px;
	height: 70px;
	background: #ffffff;
	opacity: 0.3;
	border-radius: 50%;
	content: "";
}

/*---------------------
  Cta Section
-----------------------*/

.cta-section {
	background: -o-linear-gradient(45deg, #e16521, #e4381C);
	background: linear-gradient(45deg, #e16521, #e4381C);
	padding: 38px 0;
}

.cta-section .cta-text {
	float: left;
}

.cta-section .cta-text h3 {
	color: #ffffff;
	font-weight: 500;
	text-transform: uppercase;
	margin-bottom: 10px;
}

.cta-section .cta-text p {
	color: #ffffff;
	margin-bottom: 0;
}

.cta-section .primary-btn.cta-btn {
	float: right;
	border-color: #ffffff;
	background-image: -webkit-gradient(linear, left top, right top, color-stop(100%, #ffffff), to(#ffffff)), -webkit-gradient(linear, left top, right top, from(#ffffff), color-stop(0%, #ffffff));
	background-image: -o-linear-gradient(left, #ffffff 100%, #ffffff 100%), -o-linear-gradient(left, #ffffff 0%, #ffffff 0%);
	background-image: linear-gradient(to right, #ffffff 100%, #ffffff 100%), linear-gradient(to right, #ffffff 0%, #ffffff 0%);
	margin-top: 14px;
}

/*---------------------
  Map Section
-----------------------*/

.map {
	height: 590px;
	position: relative;
}

.map iframe {
	width: 100%;
}

.map-contact-detalis .open-time {
	overflow: hidden;
	margin-bottom: 10px;
}

.map-contact-detalis .open-time h5 {
	font-size: 20px;
	color: #000000;
	font-weight: 500;
	text-transform: uppercase;
	float: left;
}

.map-contact-detalis .open-time ul {
	float: right;
}

.map-contact-detalis .open-time ul li {
	font-size: 14px;
	color: #000000;
	list-style: none;
	font-weight: 600;
	line-height: 30px;
	position: relative;
	padding-right: 108px;
}

.map-contact-detalis .open-time ul li span {
	position: absolute;
	right: 0;
	top: 0;
}

.map-contact-detalis .map-contact-form h5 {
	font-size: 20px;
	color: #000000;
	font-weight: 500;
	text-transform: uppercase;
	margin-bottom: 20px;
}

.map-contact-detalis .map-contact-form form input {
	width: calc(53% - 20px);
	margin-right: 20px;
	float: left;
	height: 40px;
	margin-bottom: 20px;
	font-size: 16px;
	color: #272727;
	border: 1px solid #e1e1e1;
	padding-left: 20px;
	border-radius: 2px;
}

.map-contact-detalis .map-contact-form form input.phone {
	width: 47%;
	margin-right: 0;
}

.map-contact-detalis .map-contact-form form input::-webkit-input-placeholder {
	color: #272727;
	font-weight: 600;
}

.map-contact-detalis .map-contact-form form input::-moz-placeholder {
	color: #272727;
	font-weight: 600;
}

.map-contact-detalis .map-contact-form form input:-ms-input-placeholder {
	color: #272727;
	font-weight: 600;
}

.map-contact-detalis .map-contact-form form input::-ms-input-placeholder {
	color: #272727;
	font-weight: 600;
}

.map-contact-detalis .map-contact-form form input::placeholder {
	color: #272727;
	font-weight: 600;
}

.map-contact-detalis .map-contact-form form textarea {
	width: 100%;
	height: 80px;
	resize: none;
	font-size: 16px;
	color: #272727;
	border: 1px solid #e1e1e1;
	border-radius: 2px;
	padding-left: 20px;
	padding-top: 10px;
	margin-bottom: 18px;
	background-color: white;
}

.map-contact-detalis .map-contact-form form textarea::-webkit-input-placeholder {
	color: #272727;
	font-weight: 600;
}

.map-contact-detalis .map-contact-form form textarea::-moz-placeholder {
	color: #272727;
	font-weight: 600;
}

.map-contact-detalis .map-contact-form form textarea:-ms-input-placeholder {
	color: #272727;
	font-weight: 600;
}

.map-contact-detalis .map-contact-form form textarea::-ms-input-placeholder {
	color: #272727;
	font-weight: 600;
}

.map-contact-detalis .map-contact-form form textarea::placeholder {
	color: #272727;
	font-weight: 600;
}

/*---------------------
  Footer Section
-----------------------*/

.footer-section {
	background: #151515;
	padding-top: 72px;
}

.footer-logo-item {
	margin-bottom: 30px;
}

.footer-logo-item .f-logo {
	margin-bottom: 40px;
}

.footer-logo-item .f-logo a {
	display: inline-block;
}

.footer-logo-item p {
	color: #afb4bf;
	margin-bottom: 32px;
}

.footer-logo-item .social-links h6 {
	color: #ffffff;
	font-weight: 500;
	text-transform: uppercase;
	margin-bottom: 20px;
}

.footer-logo-item .social-links a {
	color: #ffffff;
	display: inline-block;
	font-size: 14px;
	margin-right: 32px;
}

.footer-logo-item .social-links a:last-child {
	margin-right: 0;
}

.footer-widget {
	margin-bottom: 30px;
}

.footer-widget h5 {
	font-size: 20px;
	font-weight: 500;
	color: #ffffff;
	text-transform: uppercase;
	margin-bottom: 40px;
}

.footer-widget .footer-blog .fb-item {
	display: block;
	margin-bottom: 20px;
}

.footer-widget .footer-blog .fb-item:hover h6 {
	color: #e4381C;
}

.footer-widget .footer-blog .fb-item h6 {
	color: #ffffff;
	text-transform: uppercase;
	margin-bottom: 12px;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}

.footer-widget .footer-blog .fb-item span {
	font-size: 14px;
	text-transform: uppercase;
	font-weight: 500;
	display: block;
	color: #afb4bf;
}

.footer-widget .footer-blog .fb-item span i {
	color: #e4381C;
	margin-right: 5px;
}

.footer-widget .workout-program li {
	list-style: none;
}

.footer-widget .workout-program li a {
	display: block;
	font-size: 16px;
	font-family: "Oswald", sans-serif;
	font-weight: 500;
	color: #ffffff;
	line-height: 18px;
	margin-bottom: 22px;
}

.footer-widget .footer-info li {
	list-style: none;
	font-size: 16px;
	color: #afb4bf;
	position: relative;
	padding-left: 35px;
	margin-bottom: 20px;
}

.footer-widget .footer-info li i {
	position: absolute;
	left: 0;
	top: 0;
	font-size: 24px;
	color: #e4381C;
}

.footer-widget .footer-info li span {
	color: #ffffff;
	display: block;
	font-family: "Oswald", sans-serif;
	font-weight: 500;
}

.copyright-text {
	background: #000000;
	border-top: 1px solid #0a0a0a;
	padding: 20px 0;
	margin-top: 20px;
}

.copyright-text .ct-inside {
	font-size: 14px;
	color: #afb4bf;
}

.copyright-text .ct-inside a {
	font-weight: 600;
	color: #e4381C;
}

/* ----------------------------------- Other Pages Styles ------------------------------*/

/*---------------------
  Breadcrumb Section
-----------------------*/

.breadcrumb-section {
	padding-bottom: 105px;
}

.breadcrumb-text {
	text-align: center;
}

.breadcrumb-text h2 {
	font-size: 48px;
	font-weight: 500;
	color: #ffffff;
	text-transform: uppercase;
	margin-bottom: 14px;
}

.breadcrumb-text .breadcrumb-controls a {
	font-size: 16px;
	color: #ffffff;
	margin-right: 15px;
	position: relative;
}

.breadcrumb-text .breadcrumb-controls a:after {
	position: absolute;
	right: -13px;
	top: -2px;
	content: "";
	font-family: "FontAwesome";
	font-size: 16px;
	color: #ffffff;
}

.breadcrumb-text .breadcrumb-controls a i {
	margin-right: 2px;
}

.breadcrumb-text .breadcrumb-controls span {
	font-size: 16px;
	color: #ffffff;
}

/*---------------------
  AboutUs Section
-----------------------*/

.aboutus-section {
	background: #151515;
	padding-top: 90px;
	padding-bottom: 80px;
}

.aboutus-page-text .section-title {
	text-align: center;
	margin-bottom: 45px;
}

.aboutus-page-text img {
	margin-bottom: 54px;
}

.aboutus-page-text .about-us h4 {
	color: #ffffff;
	font-weight: 500;
	text-transform: uppercase;
	margin-bottom: 30px;
}

.aboutus-page-text .about-us p {
	color: #ffffff;
	line-height: 26px;
}

.aboutus-page-text .about-quality h4 {
	color: #ffffff;
	font-weight: 500;
	text-transform: uppercase;
	margin-bottom: 30px;
}

.aboutus-page-text .about-quality p {
	color: #ffffff;
	line-height: 22px;
}

.aboutus-page-text .about-quality ul li {
	list-style: none;
	font-size: 16px;
	color: #ffffff;
	line-height: 26px;
	margin-bottom: 10px;
}

.aboutus-page-text .about-quality ul li i {
	color: #e4381C;
	display: inline-block;
	margin-right: 9px;
}

/*---------------------
  Testimonial Section
-----------------------*/

.testimonial-section {
	padding-bottom: 130px;
}

.testimonial-slider .ts-item {
	text-align: center;
}

.testimonial-slider .ts-item .rating {
	margin-bottom: 16px;
}

.testimonial-slider .ts-item .rating i {
	font-size: 20px;
	color: #ffca04;
	display: inline-block;
}

.testimonial-slider .ts-item h4 {
	color: #ffffff;
	line-height: 34px;
	font-family: "Nunito Sans", sans-serif;
	margin-bottom: 20px;
}

.testimonial-slider .ts-item .author-name {
	margin-bottom: 28px;
}

.testimonial-slider .ts-item .author-name h5 {
	color: #ffffff;
	font-weight: 500;
	margin-bottom: 4px;
}

.testimonial-slider .ts-item .author-name span {
	display: inline-block;
	color: #ffffff;
}

.testimonial-slider .ts-item .author-pic img {
	height: 60px;
	width: 60px;
	border-radius: 50%;
	margin: 0 auto;
}

.testimonial-slider .owl-dots {
	text-align: center;
	position: absolute;
	left: 0;
	bottom: -41px;
	width: 100%;
}

.testimonial-slider .owl-dots button.owl-dot {
	height: 4px;
	width: 20px;
	background: #ffffff;
	border-radius: 50px;
	margin-right: 10px;
}

.testimonial-slider .owl-dots button.owl-dot.active {
	background: #e4381C;
}

.testimonial-slider .owl-dots button.owl-dot:last-child {
	margin-right: 0;
}

/*---------------------
  Trainer Section
-----------------------*/

.trainer-section {
	background: #151515;
	padding-top: 90px;
	padding-bottom: 70px;
}

.trainer-section .section-title {
	text-align: center;
	margin-bottom: 45px;
}

.trainer-item {
	position: relative;
	overflow: hidden;
	margin-bottom: 30px;
}

.trainer-item:hover .ti-pic .ti-links {
	left: 20px;
}

.trainer-item .ti-pic img {
	width: 300px; /* Изображение растянуто по ширине */
	height: 400px; /* Сохраняет соотношение сторон */
	object-fit: cover; /* Картинка покрывает весь блок */
	transition: transform 0.3s ease-in-out; /* Плавный переход эффектов */
}

.trainer-item:hover .ti-pic img {
	transform: scale(1.1); /* Немного увеличиваем картинку при наведении */
}

.trainer-item .ti-pic .ti-links {
	position: absolute;
	left: -50px;
	top: 20px;
	transition: all 0.5s;
}

.trainer-item .ti-pic .ti-links a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	font-size: 16px;
	color: #afb4bf;
	background: #ffffff;
	margin-bottom: 10px;
	border-radius: 2px;
	transition: all 0.3s;
}

.trainer-item .ti-pic .ti-links a:hover {
	background: linear-gradient(45deg, #e16521, #e4381C);
	color: #ffffff;
}

.trainer-item .ti-pic .trainer-text {
	position: absolute;
	left: 0;
	bottom: 0;
	background: linear-gradient(45deg, #e16521, #e4381C);
	width: 100%;
	padding-left: 20px;
	padding-top: 15px;
	padding-bottom: 12px;
	clip-path: polygon(0 0, 100% 0%, 81% 0, 100% 100%, 0 100%);
}

.trainer-item .ti-pic .trainer-text h5 {
	font-size: 20px;
	color: #ffffff;
	font-weight: 500;
}

.trainer-item .ti-pic .trainer-text h5 span {
	font-size: 14px;
	color: #ffffff;
	font-family: "Nunito Sans", sans-serif;
}
/*---------------------
  Gallery Filter Section
-----------------------*/

.galleryFilter {
    background: #151515;
    padding: 0;
}

/* Сетка галереи */
.gallery-filter {
    margin: -15px;
}

.gallery-filter .mix {
    padding: 15px;
}

/* Элемент галереи */
.gallery-item {
    position: relative;
    overflow: hidden;
    border-radius: 8px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
    transition: all 0.3s ease;
}

.gallery-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 25px rgba(228, 56, 28, 0.3);
}

.gallery-item:before {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 5px;
    background: linear-gradient(45deg, #e16521, #e4381C);
    content: "";
    opacity: 0;
    z-index: 2;
    transition: all 0.3s;
}

.gallery-item:hover:before {
    opacity: 1;
}

.gallery-item:after {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    content: "";
    z-index: 1;
    opacity: 0;
    transition: all 0.3s;
}

.gallery-item:hover:after {
    opacity: 1;
}

/* Изображение галереи */
.gallery-img {
    width: 100%;
    height: 300px;
    object-fit: cover;
    transition: transform 0.5s ease;
    display: block;
}

.gallery-item:hover .gallery-img {
    transform: scale(1.1);
}

/* Ховер-эффект */
.gi-hover-warp {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9;
}

.gi-hover {
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s;
    text-align: center;
    transform: translateY(20px);
}

.gallery-item:hover .gi-hover {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.gi-hover a {
    display: inline-block;
    width: 60px;
    height: 60px;
    background: linear-gradient(45deg, #e16521, #e4381C);
    border-radius: 50%;
    text-align: center;
    line-height: 60px;
    font-size: 24px;
    color: #ffffff;
    margin-bottom: 15px;
    transition: all 0.3s;
    box-shadow: 0 5px 15px rgba(228, 56, 28, 0.3);
}

.gi-hover a:hover {
    transform: scale(1.1);
    box-shadow: 0 8px 25px rgba(228, 56, 28, 0.5);
}

.gi-hover h6 {
    color: #ffffff;
    font-size: 16px;
    font-weight: 500;
    font-family: "Oswald", sans-serif;
    text-transform: uppercase;
    letter-spacing: 1px;
    text-shadow: 0 2px 5px rgba(0, 0, 0, 0.5);
}

/* Пагинация */
.blog-option {
    margin-top: 50px;
    padding: 20px 0;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 20px;
}

.blog-pagination {
    display: flex;
    align-items: center;
    gap: 10px;
}

.blog-pagination a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    height: 40px;
    padding: 0 10px;
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 4px;
    color: #ffffff;
    font-size: 16px;
    font-family: "Nunito Sans", sans-serif;
    transition: all 0.3s;
    text-decoration: none;
    cursor: pointer;
}

.blog-pagination a:hover {
    background: rgba(228, 56, 28, 0.1);
    border-color: #e4381C;
}

.blog-pagination a.active {
    background: linear-gradient(45deg, #e16521, #e4381C);
    border-color: transparent;
    font-weight: 600;
}

.blog-pagination a.page-nav {
    background: rgba(255, 255, 255, 0.05);
}

.blog-pagination a.page-nav:hover {
    background: linear-gradient(45deg, #e16521, #e4381C);
    border-color: transparent;
}

.blog-pagination a.page-nav i {
    font-size: 18px;
}

.blog-pagination .page-separator {
    color: #8f8fa8;
    font-size: 14px;
    font-family: "Nunito Sans", sans-serif;
    margin: 0 5px;
}

/* Настройки отображения */
.blog-option-right {
    display: flex;
    align-items: center;
    gap: 20px;
    flex-wrap: wrap;
}

.blog-result {
    color: #8f8fa8;
    font-size: 14px;
    font-family: "Nunito Sans", sans-serif;
}

.show-result {
    display: flex;
    align-items: center;
    gap: 10px;
}

.show-label {
    color: #ffffff;
    font-size: 14px;
    font-family: "Nunito Sans", sans-serif;
}



.show-result-select:hover {
    background-color: rgba(228, 56, 28, 0.1);
    border-color: #e4381C;
}

.show-result-select:focus {
    outline: none;
    border-color: #e4381C;
    box-shadow: 0 0 0 2px rgba(228, 56, 28, 0.2);
}

.show-result-select option {
    background: #2d2d2d;
    color: #ffffff;
}

/* Lightbox стили */
.image-popup {
    cursor: pointer;
}

/* Адаптивность */
@media (max-width: 992px) {
    .blog-option {
        flex-direction: column;
        align-items: flex-start;
    }

    .blog-option-right {
        width: 100%;
        justify-content: space-between;
    }

    .gallery-img {
        height: 250px;
    }
}

@media (max-width: 768px) {
    .blog-option-right {
        flex-direction: column;
        align-items: flex-start;
        gap: 15px;
    }

    .show-result {
        width: 100%;
    }

    .show-result-select {
        flex: 1;
    }

    .gallery-img {
        height: 220px;
    }
}

@media (max-width: 480px) {
    .blog-pagination {
        width: 100%;
        justify-content: center;
    }

    .blog-result {
        text-align: center;
        width: 100%;
    }

    .gallery-img {
        height: 200px;
    }

    .gi-hover a {
        width: 50px;
        height: 50px;
        line-height: 50px;
        font-size: 20px;
    }

    .gi-hover h6 {
        font-size: 14px;
    }
}
/*---------------------
  Gallery Section
-----------------------*/

.gallery-section {
	background: #151515;
	padding-bottom: 70px;
	padding-top: 95px;
}

.gallery-controls {
	text-align: center;
	margin-bottom: 45px;
}

.gallery-controls ul li {
	list-style: none;
	font-size: 16px;
	font-weight: 500;
	font-family: "Oswald", sans-serif;
	text-transform: uppercase;
	color: #ffffff;
	display: inline-block;
	margin-right: 45px;
	cursor: pointer;
	position: relative;
}

.gallery-controls ul li.active {
	color: #e4381C;
}

.gallery-controls ul li.active:after {
	opacity: 1;
}

.gallery-controls ul li:after {
	position: absolute;
	left: 0;
	bottom: 1px;
	width: 100%;
	height: 2px;
	background: #7D2719;
	content: "";
	opacity: 0;
}

.gallery-controls ul li:last-child {
	margin-right: 0;
}

.gallery-item {
	text-align: center;
	position: relative;
	z-index: 1;
	overflow: hidden; /* Обрезает выступающие края */
	width: 100%; /* Максимальный размер родителя */
	height: auto; /* Высота рассчитывается автоматически */
	margin-bottom: 30px;
}

.gallery-item img.gallery-img {

	height: 300px; /* Сохраняет соотношение сторон */
	object-fit: cover; /* Картинка покрывает весь блок */
	transition: transform 0.3s ease-in-out; /* Плавный переход эффектов */
}

.gallery-item:hover .gallery-img {
	transform: scale(1.1); /* Немного увеличиваем картинку при наведении */
}

.gallery-item:hover:after,
.gallery-item:hover:before {
	opacity: 1;
}

.gallery-item:hover .gi-hover {
	opacity: 1;
	visibility: visible;
}

.gallery-item:before {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 5px;
	background: #e4381C;
	content: "";
	opacity: 0;
	z-index: 2;
	transition: all 0.3s;
}

.gallery-item:after {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.5);
	content: "";
	z-index: 1;
	opacity: 0;
	transition: all 0.3s;
}

.gallery-item .gi-hover-warp {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 9;
}

.gallery-item .gi-hover {
	opacity: 0;
	visibility: hidden;
	transition: all 0.3s;
}

.gallery-item .gi-hover a {
	height: 60px;
	width: 60px;
	border: 2px solid #ffffff;
	border-radius: 50%;
	text-align: center;
	line-height: 60px;
	font-size: 24px;
	display: inline-block;
	color: #ffffff;
}

.gallery-item .gi-hover a:first-child {
	margin-right: 15px;
}

.gallery-item .gi-hover h6 {
	color: #ffffff;
	margin-top: 25px;
}

.gallery-item .gi-hover h6 span {
	font-family: "Nunito Sans", sans-serif;
	margin-top: 7px;
	display: block;
}

.mfp-zoom-out-cur,
.mfp-zoom-out-cur .mfp-image-holder .mfp-close {
	cursor: pointer;
}

/*---------------------
  Blog Page Section
-----------------------*/

.blog-section.blog-page {
	padding-top: 100px;
	padding-bottom: 100px;
}

.blog-option {
	margin-top: 30px;
}

.blog-option .blog-pagination {
	font-size: 16px;
	color: #ffffff;
	float: left;
}

.blog-option .blog-pagination a {
	font-size: 16px;
	color: #ffffff;
	display: inline-block;
	height: 40px;
	width: 40px;
	line-height: 40px;
	text-align: center;
	border-radius: 2px;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}

.blog-option .blog-pagination a.active {
	background: -o-linear-gradient(45deg, #e16521, #e4381C);
	background: linear-gradient(45deg, #e16521, #e4381C);
}

.blog-option .blog-pagination a:hover {
	background: -o-linear-gradient(45deg, #e16521, #e4381C);
	background: linear-gradient(45deg, #e16521, #e4381C);
}

.blog-option .blog-pagination a:first-child {
	margin-right: 14px;
}

.blog-option .blog-pagination a:last-child:hover {
	background: transparent;
}

.blog-option .blog-pagination i {
	font-size: 18px;
}

.blog-option .blog-option-right {
	float: right;
}

.blog-option .blog-option-right .blog-result {
	display: inline-block;
	font-size: 16px;
	color: #ffffff;
	line-height: 42px;
	margin-right: 39px;
}

.blog-option .blog-option-right .show-result {
	display: inline-block;
	width: 144px;
	height: 40px;
	border: 1px solid #ecedee;
	border-radius: 3px;
}

.blog-option .blog-option-right .show-result p {
	display: inline-block;
	color: #ffffff;
	font-size: 14px;
	font-size: 14px;
	padding: 8px 0 0 20px;
}

.blog-option .blog-option-right .nice-select {
	float: right;
	border-radius: 2px;
	background: transparent;
	border: none;
	font-size: 14px;
	color: #ffffff;
	padding-right: 45px;
	padding-left: 0;
}

.blog-option .blog-option-right .nice-select:after {
	border-bottom: 2px solid #fff;
	border-right: 2px solid #fff;
	height: 7px;
	right: 25px;
	top: 46%;
	width: 7px;
}

.blog-option .blog-option-right .nice-select .list {
	width: 100%;
}

.blog-option .blog-option-right .nice-select .list .option {
	color: #222222;
}

/*---------------------
  Blog Single Hero
-----------------------*/

.blog-single-hero {
	height: 500px;
	padding-top: 176px;
}

.bs-hero-text h2 {
	color: #ffffff;
	font-weight: 500;
	line-height: 48px;
	text-transform: uppercase;
	margin-bottom: 24px;
}

.bs-hero-text ul li {
	list-style: none;
	color: #ffffff;
	font-size: 16px;
	display: inline-block;
	margin-right: 58px;
	position: relative;
}

.bs-hero-text ul li:after {
	position: absolute;
	right: -33px;
	top: 0;
	content: "|";
	font-size: 16px;
	color: #ffffff;
}

.bs-hero-text ul li:last-child {
	margin-right: 0;
}

.bs-hero-text ul li:last-child:after {
	display: none;
}

/*---------------------
  Blog Single Section - Адаптировано под Activitar
-----------------------*/

.blog-single-section {
    background: #151515;
    padding-top: 65px;
}

.blog-single-text .blog-text {
    margin-bottom: 40px;
}

.blog-single-text .blog-text p {
    color: #ffffff;
    line-height: 28px;
    font-family: "Nunito Sans", sans-serif;
    font-size: 16px;
}

.blog-single-text .blog-pic {
    margin-bottom: 24px;
}

.blog-single-text .blog-pic img {
    margin-bottom: 20px;
    width: 100%;
    object-fit: cover;
    transition: transform 0.3s ease-in-out;
}

.blog-pic .big-image {
    width: 100%;
    height: 400px;
    object-fit: cover;
    border-radius: 8px;
}

.blog-pic .medium-image {
    width: 100%;
    height: 190px;
    object-fit: cover;
    border-radius: 8px;
}

.blog-pic .smail-image {
    width: 100%;
    height: 190px;
    object-fit: cover;
    border-radius: 8px;
}

.blog-single-text .blog-title {
    margin-bottom: 35px;
}

.blog-single-text .blog-title h4 {
    color: #ffffff;
    font-weight: 500;
    margin-bottom: 18px;
    font-family: "Oswald", sans-serif;
    font-size: 24px;
    text-transform: uppercase;
}

.blog-single-text .blog-title p {
    color: #ffffff;
    line-height: 28px;
    font-family: "Nunito Sans", sans-serif;
}

.blog-single-text .blog-quote {
    padding-left: 50px;
    position: relative;
    margin-bottom: 40px;
}

.blog-single-text .blog-quote i {
    font-size: 26px;
    color: #e4381C;
    position: absolute;
    left: 0;
    top: 5px;
}

.blog-single-text .blog-quote .quote-text {
    font-size: 20px;
    color: #ffffff;
    font-weight: 600;
    font-style: italic;
    line-height: 28px;
    margin-bottom: 13px;
    font-family: "Nunito Sans", sans-serif;
}

.blog-single-text .blog-quote h5 {
    font-size: 20px;
    color: #ffffff;
    font-weight: 500;
    font-family: "Oswald", sans-serif;
}

.blog-single-text .blog-more-title {
    margin-bottom: 42px;
}

.blog-single-text .blog-more-title h4 {
    color: #ffffff;
    font-weight: 500;
    margin-bottom: 18px;
    font-family: "Oswald", sans-serif;
    font-size: 24px;
    text-transform: uppercase;
}

.blog-single-text .blog-more-title p {
    color: #ffffff;
    line-height: 28px;
    font-family: "Nunito Sans", sans-serif;
}

.blog-single-text .blog-tag-share {
    overflow: hidden;
    margin-top: 30px;
    padding-top: 20px;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.blog-single-text .blog-tag-share .social-share {
    float: right;
}

.blog-single-text .blog-tag-share .social-share span {
    font-size: 14px;
    color: #ffffff;
    font-family: "Nunito Sans", sans-serif;
    margin-right: 15px;
}

.blog-single-text .blog-tag-share .social-share a {
    display: inline-block;
    color: #a6a6a6;
    margin-left: 15px;
    font-size: 18px;
    transition: all 0.3s;
}

.blog-single-text .blog-tag-share .social-share a:hover {
    color: #e4381C;
}

/*---------------------
  Blog Single Sidebar
-----------------------*/

.blog-single-sidebar .bs-latest-news {
    margin-bottom: 74px;
}

.blog-single-sidebar .bs-latest-news h4 {
    color: #ffffff;
    font-weight: 500;
    text-transform: uppercase;
    margin-bottom: 35px;
    font-family: "Oswald", sans-serif;
    font-size: 20px;
}

.blog-single-sidebar .bs-latest-news .bl-item {
    position: relative;
    background: #ffffff;
    padding-left: 30px;
    padding-top: 20px;
    padding-bottom: 20px;
    padding-right: 30px;
    border-radius: 4px;
    margin-bottom: 20px;
    display: block;
    background-repeat: no-repeat;
    background-size: cover;
    overflow: hidden;
    transition: all 0.4s;
}

.blog-single-sidebar .bs-latest-news .bl-item:after {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background: #ffffff;
    opacity: 1;
    transition: all 0.4s;
}

.blog-single-sidebar .bs-latest-news .bl-item:hover:after {
    opacity: 0;
}

.blog-single-sidebar .bs-latest-news .bl-item:hover h5 {
    color: #ffffff;
}

.blog-single-sidebar .bs-latest-news .bl-item:hover span {
    color: #ffffff;
}

.blog-single-sidebar .bs-latest-news .bl-item h5 {
    color: #151515;
    font-weight: 500;
    line-height: 26px;
    position: relative;
    z-index: 9;
    transition: all 0.3s;
    font-family: "Oswald", sans-serif;
    font-size: 16px;
    margin-bottom: 8px;
}

.blog-single-sidebar .bs-latest-news .bl-item span {
    display: inline-block;
    font-size: 14px;
    color: #151515;
    position: relative;
    z-index: 9;
    transition: all 0.3s;
    font-family: "Nunito Sans", sans-serif;
}

.blog-single-sidebar .bs-recent-news {
    margin-bottom: 40px;
}

.blog-single-sidebar .bs-recent-news h4 {
    color: #ffffff;
    font-weight: 500;
    text-transform: uppercase;
    margin-bottom: 35px;
    font-family: "Oswald", sans-serif;
    font-size: 20px;
}

.blog-single-sidebar .bs-recent-news .br-item {
    overflow: hidden;
    margin-bottom: 20px;
    display: block;
    transition: all 0.3s;
}

.blog-single-sidebar .bs-recent-news .br-item:hover .bi-text h5 {
    color: #e4381C;
}

.blog-single-sidebar .bs-recent-news .br-item .bi-pic {
    float: left;
    margin-right: 20px;
}

.blog-single-sidebar .bs-recent-news .br-item .bi-pic img {
    border-radius: 3px;
    width: 100px;
    height: 100px;
    object-fit: cover;
    transition: transform 0.3s ease-in-out;
}

.blog-single-sidebar .bs-recent-news .br-item:hover .bi-pic img {
    transform: scale(1.1);
}

.blog-single-sidebar .bs-recent-news .br-item .bi-text {
    display: table;
    padding-top: 8px;
}

.blog-single-sidebar .bs-recent-news .br-item .bi-text span {
    display: inline-block;
    font-size: 14px;
    color: #ffffff;
    margin-bottom: 5px;
    font-family: "Nunito Sans", sans-serif;
}

.blog-single-sidebar .bs-recent-news .br-item .bi-text h5 {
    color: #ffffff;
    font-weight: 500;
    line-height: 22px;
    font-family: "Oswald", sans-serif;
    font-size: 16px;
    transition: color 0.3s;
}

/*---------------------
  Recent News
-----------------------*/

.recent-news {
    padding-top: 30px;
    margin-bottom: 50px;
}

.recent-news h4 {
    color: #ffffff;
    text-transform: uppercase;
    font-weight: 500;
    margin-bottom: 35px;
    font-family: "Oswald", sans-serif;
    font-size: 24px;
}

.recent-item {
    position: relative;
    overflow: hidden;
    margin-bottom: 30px;
    border-radius: 8px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
    transition: transform 0.3s ease-in-out;
    height: 300px;
}

.recent-item:hover {
    transform: scale(1.02);
}

.recent-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 8px;
    transition: opacity 0.3s;
}

.recent-item:hover img {
    opacity: 0.8;
}

.recent-item .recent-text {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    padding: 25px;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.9), transparent);
    color: #ffffff;
    text-decoration: none;
    transition: all 0.4s;
    opacity: 0;
    visibility: hidden;
}

.recent-item:hover .recent-text {
    opacity: 1;
    visibility: visible;
}

.recent-item .recent-text .categories {
    font-size: 14px;
    color: #e4381C;
    text-transform: uppercase;
    margin-bottom: 8px;
    font-family: "Nunito Sans", sans-serif;
    font-weight: 600;
}

.recent-item .recent-text h5 {
    font-size: 18px;
    color: #ffffff;
    font-weight: 500;
    margin: 0;
    font-family: "Oswald", sans-serif;
    line-height: 24px;
}

/*---------------------
  Leave Comment Form
-----------------------*/

.leave-comment-form {
    margin-top: 40px;
}

.leave-comment-form h4 {
    color: #ffffff;
    text-transform: uppercase;
    font-weight: 500;
    margin-bottom: 36px;
    font-family: "Oswald", sans-serif;
    font-size: 24px;
}


.leave-comment-form form textarea::placeholder {
    color: #8f8fa8;
    font-weight: 400;
}

.leave-comment-form form textarea:focus {
    background: #3d3d3d;
    border-color: #e4381C;
    outline: none;
}

.leave-comment-form .leave-btn {
    font-size: 14px;
    color: #ffffff;
    font-weight: 600;
    text-transform: uppercase;
    background: linear-gradient(45deg, #e16521, #e4381C);
    padding: 12px 35px;
    border: none;
    font-family: "Oswald", sans-serif;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.3s;
    letter-spacing: 1px;
    display: inline-block;
    position: relative;
    z-index: 1;
    overflow: hidden;
}

.leave-comment-form .leave-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(228, 56, 28, 0.3);
}

.leave-comment-form .leave-btn:active {
    transform: translateY(0);
}

.leave-comment-form p {
    color: #8f8fa8;
    font-size: 14px;
    margin-top: 15px;
    font-family: "Nunito Sans", sans-serif;
}

/* Адаптивность для мобильных */
@media (max-width: 992px) {
    .blog-single-sidebar {
        padding-top: 40px;
    }
}

@media (max-width: 768px) {
    .blog-pic .big-image,
    .blog-pic .medium-image,
    .blog-pic .smail-image {
        height: auto;
        margin-bottom: 15px;
    }

    .recent-item {
        height: 250px;
    }

    .blog-single-text .blog-tag-share .social-share {
        float: none;
        text-align: center;
    }
}

@media (max-width: 480px) {
    .blog-single-text .blog-quote {
        padding-left: 30px;
    }

    .blog-single-text .blog-quote i {
        font-size: 20px;
    }

    .blog-single-text .blog-quote .quote-text {
        font-size: 16px;
    }

    .recent-item {
        height: 200px;
    }
}

/*---------------------
  Contact Section
-----------------------*/

.contact-section {
	background: #151515;
	padding-top: 95px;
}

.contact-section .contact-info {
	margin-bottom: 50px;
}

.contact-section .contact-info h4 {
	color: #ffffff;
	text-transform: uppercase;
	font-weight: 500;
	margin-bottom: 30px;
}

.contact-section .contact-info ul li {
	list-style: none;
	font-size: 18px;
	color: #ffffff;
	line-height: 48px;
}

.contact-section .contact-info ul li i {
	color: #e4381C;
	margin-right: 18px;
}

.contact-section .contact-address {
	margin-bottom: 40px;
}

.contact-section .contact-address h4 {
	color: #ffffff;
	text-transform: uppercase;
	font-weight: 500;
	margin-bottom: 30px;
}

.contact-section .contact-address ul li {
	list-style: none;
	font-size: 18px;
	color: #ffffff;
	line-height: 25px;
	position: relative;
	padding-left: 35px;
}

.contact-section .contact-address ul li i {
	font-size: 18px;
	color: #e4381C;
	margin-right: 18px;
	position: absolute;
	left: 0;
	top: 7px;
}

.contact-form h4 {
	color: #ffffff;
	text-transform: uppercase;
	font-weight: 500;
	margin-bottom: 48px;
}

.contact-form form input {
	width: 100%;
	height: 48px;
	border-radius: 2px;
	background: #2d2d2d;
	border: none;
	padding-left: 20px;
	margin-bottom: 30px;
	font-size: 16px;
	color: #a6a6a6;
	-webkit-transition: all 0.3s;
	-webkit-transition: 0.3s;
	-o-transition: 0.3s;
	transition: 0.3s;
	border: 1px solid #131313;
}

.contact-form form input::-webkit-input-placeholder {
	font-weight: 600;
}

.contact-form form input::-moz-placeholder {
	font-weight: 600;
}

.contact-form form input:-ms-input-placeholder {
	font-weight: 600;
}

.contact-form form input::-ms-input-placeholder {
	font-weight: 600;
}

.contact-form form input::placeholder {
	font-weight: 600;
}

.contact-form form input:focus {
	background: #ffffff;
	color: #151515;
	font-weight: 600;
}

.contact-form form textarea {
	width: 100%;
	height: 198px;
	border-radius: 2px;
	background: #2d2d2d;
	border: none;
	padding-left: 20px;
	padding-top: 15px;
	font-size: 16px;
	color: #a6a6a6;
	-webkit-transition: all 0.3s;
	-webkit-transition: 0.3s;
	-o-transition: 0.3s;
	transition: 0.3s;
	resize: none;
	margin-bottom: 25px;
	border: 1px solid #131313;
}

.contact-form form textarea::-webkit-input-placeholder {
	font-weight: 600;
}

.contact-form form textarea::-moz-placeholder {
	font-weight: 600;
}

.contact-form form textarea:-ms-input-placeholder {
	font-weight: 600;
}

.contact-form form textarea::-ms-input-placeholder {
	font-weight: 600;
}

.contact-form form textarea::placeholder {
	font-weight: 600;
}

.contact-form form textarea:focus {
	background: #ffffff;
	color: #151515;
	font-weight: 600;
}

.contact-form form .c-btn {
	font-size: 14px;
	color: #ffffff;
	font-weight: 500;
	text-transform: uppercase;
	background: -o-linear-gradient(45deg, #e16521, #e4381C);
	background: linear-gradient(45deg, #e16521, #e4381C);
	padding: 12px 40px;
	border: none;
	font-family: "Oswald", sans-serif;
	border: 1px solid #000000;
	border-radius: 2px;
}

/*---------------------------- Other Pages Styles ------------------------------*/

@media only screen and (min-width: 1200px) {
	.container {
		max-width: 1200px;
	}
}

/* Medium Device : 1200px */

@media only screen and (min-width: 992px) and (max-width: 1199px) {
	.header-section {
		padding-left: 0;
		padding-right: 0;
	}
	.top-social a {
		margin-left: 15px;
	}
}

/* Tablet Device : 768px */

@media only screen and (min-width: 768px) and (max-width: 991px) {
	.header-section {
		padding-left: 0;
		padding-right: 0;
	}
	.nav-menu {
		text-align: right;
	}
	.nav-menu .mainmenu ul li {
		margin-right: 25px;
	}
	.nav-menu .mainmenu ul li .dropdown {
		left: auto;
		right: 0;
	}
	.top-social {
		display: none;
	}
	.hero-items .owl-nav button[type=button] {
		left: 15px;
	}
	.hero-items .owl-nav button[type=button].owl-next {
		right: 15px;
	}
	.about-text {
		margin-bottom: 30px;
	}
	.timetable-controls ul li {
		margin-right: 50px;
	}
	.cta-section .cta-text {
		float: none;
	}
	.cta-section .primary-btn.cta-btn {
		float: none;
	}
	.blog-single-sidebar {
		padding-top: 30px;
	}
	.recent-item {
		margin-bottom: 30px;
	}
}

/* Large Mobile : 480px */

@media only screen and (max-width: 767px) {
	.header-section {
		padding-left: 0;
		padding-right: 0;
	}
	.nav-menu .mainmenu {
		display: none;
	}
	.top-social {
		display: none;
	}
	.slicknav_menu {
		display: block;
		background: transparent;
		padding: 0;
	}
	.slicknav_btn {
		margin: 0;
		border-radius: 0;
	}
	.header-normal .slicknav_btn {
		margin: 37px 0;
	}
	.slicknav_nav {
		background: #222;
	}
	.slicknav_nav ul {
		margin: 10px 15px;
	}
	.slicknav_nav a {
		padding: 8px 10px;
	}
	.slicknav_nav a:hover,
	.slicknav_nav .slicknav_row:hover {
		border-radius: 0;
		background: #e4381C;
		color: #ffffff;
	}
	.hero-items .owl-nav button[type=button] {
		left: 5px;
	}
	.hero-items .owl-nav button[type=button].owl-next {
		left: auto;
		right: 5px;
	}
	.single-hero-item {
		height: 680px;
	}
	.single-hero-item .hero-text h1 {
		font-size: 70px;
	}
	.single-hero-item .hero-text h2 {
		font-size: 50px;
	}
	.about-text {
		margin-bottom: 30px;
	}
	.classtime-table {
		overflow-x: auto;
	}
	.timetable-controls ul li {
		margin-right: 12px;
	}
	.cta-section .cta-text {
		float: none;
	}
	.cta-section .primary-btn.cta-btn {
		float: none;
	}
	.blog-option .blog-pagination {
		float: none;
		margin-bottom: 20px;
	}
	.blog-option .blog-option-right {
		float: none;
	}
	.bs-hero-text ul li {
		margin-right: 45px;
	}
	.bs-hero-text ul li:after {
		right: -27px;
	}
	.blog-single-sidebar {
		padding-top: 30px;
	}
	.recent-item {
		margin-bottom: 30px;
	}
	.map-contact-detalis {
		right: 30px;
	}
}

/* Small Mobile : 320px */

@media only screen and (max-width: 479px) {
	.section-title h2,
	.breadcrumb-text h2 {
		font-size: 30px;
	}
	.slicknav_menu {
		text-align: center;
	}
	.slicknav_nav {
		text-align: left;
	}
	.logo {
		float: none;
		text-align: center;
		margin-bottom: 10px;
	}
	.slicknav_btn {
		float: none;
		display: inline-block;
	}
	.slicknav_nav ul {
		margin: 10px 0 10px 0;
	}
	.slicknav_nav .slicknav_row,
	.slicknav_nav a {
		margin: 0;
	}
	.header-normal .slicknav_btn {
		margin: 0 0 10px 0;
	}
	.header-section.header-normal .logo {
		padding: 18px 0 5px;
	}
	.single-hero-item .hero-text h1 {
		font-size: 50px;
	}
	.single-hero-item .hero-text h2 {
		font-size: 40px;
	}
	.hero-items .owl-nav button[type=button] {
		left: -15px;
	}
	.hero-items .owl-nav button[type=button].owl-next {
		right: 15px;
	}
	.map-contact-detalis {
		width: 319px;
		right: 0;
	}
	.video-section .video-text {
		padding-top: 100px;
	}
	.timetable-controls ul li {
		margin-right: 5px;
		margin-bottom: 12px;
	}
	.gallery-controls ul li {
		margin-right: 8px;
	}
	.blog-single-text .blog-tag-share .tags {
		float: none;
		margin-bottom: 10px;
	}
	.blog-single-text .blog-tag-share .social-share {
		float: none;
	}
	.contact-map .map-hover {
		left: 15%;
	}
}