.element::-webkit-scrollbar {
  width: 0;
}

/*Убрать полосу прокрутки для всей страницы*/
::-webkit-scrollbar {
  width: 0;
}
body {
    font-family: 'Georama', sans-serif;
    background: linear-gradient(135deg, rgba(34, 193, 195, 0.8), rgba(253, 187, 45, 0.8)); /* Градиентный фон */
    background-image: url('path/to/your/background-image.jpg'); /* Добавьте изображение фона */
    background-size: cover;
    color: #e0e0e0;
    margin: 0;
    padding: 20px;
    box-shadow: inset 0 0 20px rgba(0, 0, 0, 0.8); /* Интенсивная тень для блока */
}

h1 {
    text-align: center;
    color: #ff1744;
    margin-bottom: 20px;
    text-shadow: 2px 2px 10px rgba(0, 0, 0, 0.7);
    font-size: 2.5em; /* Увеличен размер заголовка */
}
h2 {
    font-size: 20px; /* Меньший размер шрифта для заголовка */
    text-align: center; /* Центрируем заголовок */
    color: #ff3e8b; /* Цвет заголовка */
    margin-bottom: 20px; /* Отступ снизу */
}

.client-status {
    background-color: rgba(30, 30, 30, 0.9); /* Темный фон */
    border-radius: 8px;
    padding: 15px;
    margin: 10px 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    transition: background-color 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease; /* Анимация */
    position: relative;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.7); /* Увеличенная тень для блока */
}

.client-status:hover {
    background-color: rgba(57, 66, 78, 0.9); /* Потемнение при наведении */
    transform: scale(1.02); /* Увеличение блока при наведении */
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.8); /* Более сильная тень при наведении */
}

.client-status::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    height: 4px;
    background: linear-gradient(90deg, #ff1744, #ff9100);
    transform: translateY(-50%) scaleX(0);
    transition: transform 0.3s ease;
}

.client-status:hover::before {
    transform: translateY(-50%) scaleX(1);
}

.online {
    color: #76ff03; /* Зеленый для онлайн */
    font-weight: bold; /* Жирный шрифт для статуса */
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6); /* Тень для текста */
}

.offline {
    color: #ff3d00; /* Красный для оффлайн */
    font-weight: bold; /* Жирный шрифт для статуса */
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6); /* Тень для текста */
}

.error {
    color: #f44336; /* Красный для ошибок */
    font-weight: bold; /* Жирный шрифт для статуса */
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6); /* Тень для текста */
}
.work-status {
    background-color: rgba(104, 90, 90, 0);
    border-radius: 8px;
    padding: 15px;
    margin: 10px auto; /* Центрирование блока */
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.7);
    max-width: 90%; /* Ограничиваем ширину */
    color: #ff3e8b;
}

.work-status .time {
    color: #b7c7e5; /* Серый цвет для времени */
    font-style: italic; /* Курсивное начертание для времени */
}
.descr {
    text-align: left;
    width: 500px;
    color: rgb(109, 139, 109);
    font-size: 16px;
}