/* Объеденённый стиль для линии выделения */
.table-combined {
    font-size: 12px; 
    color: #000000;
    font-weight: normal;
    transition: background-color 0.3s;
}

.table-combined:hover {
    background-color: #f0f0f0; /* Цвет выделения при наведении */
}

/* Дополнительный CSS для совместного выделения */
.table-combined:hover, 
.table-combined:hover ~ .table-combined {
    background-color: #f0f0f0; /* Цвет выделения для соседних ячеек */
}


/* Стиль для ячейки с изображением фона */
.background-image {
  vertical-align: top; /* Выравнивание по верхнему краю */
}

/* Стиль для изображения маркера */
.bullet-image {
  /* Здесь можно добавить стили для изображения, если это необходимо */
}

/* Стиль для ячейки таблицы с названием инструмента */
.table-item {
  color: #999999; /* Цвет текста */
  font-size: 12px; /* Размер шрифта */
	font-weight: normal;
}

/* Стиль для пользовательской ячейки */
.custom-cell-mod {
  /* Здесь можно добавить стили для пользовательской ячейки, если это необходимо */
}


/* Общий стиль для третьего столбца */
.table-date {
    font-size: 12px; /* Укажите размер, как в первом столбце */
  color: #000000;
  font-weight: normal;
}


.float-image {
        float: left; /*  или right, в зависимости от того, с какой стороны вы хотите, чтобы текст обтекал изображение */
        margin: 7px; /* Отступы вокруг изображения */
    }

/* Пример эффекта при наведении */
.scale_grande_max:hover {
    transform: scale(8.0); /* Увеличение при наведении до 800% */
}

/* Пример эффекта при наведении */
.scale_grande_max200 {
    transition: transform 0.9s ease; /* Анимируем только transform */
    border-radius: 5px;
    overflow: hidden;
}
.scale_grande_max200:hover {
    transform: scale(2.0);
}
.scale_grande_max {
	transition: transform 0.9s ease; /* Плавный переход при изменении масштаба */
    border-radius: 5px; /* Закругляем углы с радиусом 5px */
    overflow: hidden; /* Скрыть часть изображения, выходящую за границы закругления */
}

/* Пример эффекта при наведении */
.scale_max:hover {
    transform: scale(1.8); /* Увеличение при наведении до 180% */
}

.scale_max {
    transition: transform 0.9s ease; /* Плавный переход при изменении масштаба */
    border-radius: 5px; /* Закругляем углы с радиусом 5px */
    overflow: hidden; /* Скрыть часть изображения, выходящую за границы закругления */
}
/* Пример эффекта при наведении */
.scale:hover {
    transform: scale(5.0); /* Увеличение при наведении до 500% */
	z-index: 1000;
}
.scale {
    transition: transform 0.9s ease; /* Плавный переход при изменении масштаба */
    border-radius: 5px; /* Закругляем углы с радиусом 5px */
    overflow: hidden; /* Скрыть часть изображения, выходящую за границы закругления */
	display: inline-block; /* Чтобы трансформации работали корректно */
    max-width: 100%; /* Ограничение по ширине */
    position: relative; /* Для позиционирования */
}

}
.scale_radius {
    border-radius: 7px; /* Закругляем углы с радиусом 5px */
    overflow: hidden; /* Скрыть часть изображения, выходящую за границы закругления */
}
   
a {
	text-decoration: none;
	color: #2A0000;
}
.table {
	width: 100%;
	margin-bottom: 20px;
	border: 0px solid #dddddd;
	border-collapse: collapse;
	table-layout: fixed; 
}
.table th {
	font-weight: bold;
	padding: 0px;
	border: 0px solid #dddddd;
	table-layout: fixed; 
}
.table td {
	border: 0px solid #dddddd;
	padding: 0px;
	table-layout: fixed; 
}

.table {
	width: 100%;
	margin-bottom: 20px;
	border: 1px solid #dddddd;
	border-collapse: collapse; 
}
.table th {
	font-weight: bold;
	padding: 5px;
	background: #efefef;
	border: 1px solid #dddddd;
}
.table td {
	border: 1px solid #dddddd;
	padding: 5px;
}

/* создаём класс для таблицы "Рефракторы" */	
		
	.custom-cell {
        color: #000000; 
       /* font-size: small; */
				font-size: small;
    }

.custom-cell-mod {
        color: #999999; 
       /* font-size: small; */
				font-size: small;
    }

/* создаём класс для строк первого столбца таблицы "Рефракторы" */
.bullet-cell {
background-image: url('../Observers/Images/mapbckgrn2.gif');
   background-size: cover; /* Для адаптивности фона */
   background-repeat: no-repeat; /* Избегаем повторения фонового изображения */
    vertical-align: top; /* Равнозначная замена valign */
    padding: 0px; /* Добавляем отступ, если необходимо */
}

.background-image {
    background-image: url('../Observers/Images/mapbckgrn2.gif');
}

.bullet-image {
    width: 56px;
    height: 15px;
}
.table-row {
    transition: background-color 0.3s; /* Эффект плавного перехода */
}

.table-row:hover {
    background-color: #e0e0e0; /* Цвет фона при наведении */
}

.table-row a {
    text-decoration: none; /* Убираем подчеркивание у ссылки */
    color: #000; /* Цвет текста ссылки */
}

.table-row:hover a {
    color: #ff0000; /* Цвет текста ссылки при наведении на строку */
}

<style>
    .table-row-mod {
        transition: background-color 0.3s;
    }

    .table-row-mod:hover {
        background-color: #f0f0f0; /* Цвет выделения при наведении */
    }

    /* Дополнительный CSS для совместного выделения */
    .table-row-mod:hover, 
    .table-row-mod:hover ~ .table-row-mod {
        background-color: #f0f0f0; /* Цвет выделения для соседних ячеек */
    }
</style>