BODY {
font-family: 'Times New Roman', Times, Arial, Comic Sans MS, Courier, Courier New, Lucida Console, Tahoma, serif;
font-size: 25px;
margin: 0; /* обнуляем поля у страницы для браузеров IE и Netscape */
padding: 0; /* обнуляем поля у страницы для браузера Опера */
text-align: justify; /* выравнивание по центру */
}
#main {
margin: 0 auto; /* центрируем таблицу */
border-collapse: collapse; /* смыкаем ячейки */
width: 100%;
}
TD { /* задаем стиль для всех ячеек */
vertical-align: top;
margin: 0;
padding: 5px;
}
#header { /* стиль заголовка */
background-color: #dda5ff;
text-align: center;
height: 100px;
border-radius: 15%;
}
#left_col { /* стиль левой колонки */
width: 400px;
background-color: #bbbbbb;
}
#center_col { /* стиль центральной колонки */
height: 100%;
overflow-y: hidden; /* запрет вертикальной прокрутки, поставь scroll для разрешения */
overflow-x: hidden; /* запрет горизонтальной прокрутки */
}
#right_col { /* стиль правой колонки */
width: 400px;
background-color: #bbbbbb;
}
#footer { /* стиль нижнего блока */
background-color: #00ddff;
text-align: center;
height: 150px;
}
.open {
border: 1px solid black; /* Рамка вокруг текущей вкладки */
border-right: none; /* Границу справа убираем */
border-bottom: none; /* Линию снизу тоже прячем */
text-align: center; /* Выравнивание текста по центру */
font-weight: bold; /* Жирное начертание текста */
}
.close {
border: 1px solid black; /* Рамка вокруг вкладок */
background: #cfd6d4; /* Цвет фона вкладок */
border-right: none; /* Границу справа убираем */
text-align: center; /* Выравнивание текста по центру */
}
DIV#textcenter {/* Выравнивание рисунка по центру */
text-align: center;
}
A {font-size: 25px; text-decoration: none}

A:link { color: #000000; text-decoration: none } /* непосещенная ссылка black. Псевдокласс  link обычно не используют, 
поскольку он определяет то же самое, что и обычный селектор A, а именно стиль для непосещенных ссы-
лок (синий цвет с подчеркиванием). Но я изменил на черный цвет и убрал подчеркивание */

A:visited { color: #0000ff }  /* посещенная ссылка blue */

A:hover { color: #ff0000;
 text-decoration: underline
 }                          /* состояние ссылки при наведенном на нее курсоре мыши red */

A:active { color: #ffff00; text-decoration: none }/* активная ссылка. Состояние ссылки при наведенном на нее курсоре мыши и нажатии 
на кнопку yellow */

 P { text-indent: 40px;
 word-spacing: 15px;
padding: auto
 }

Pre { text-indent: 40px;
 word-spacing: 15px;
padding: auto
 }

 H1 { 
  margin: 0px;     /* Убираем отступы вокруг заголовка */ 
  color: #ccc      /* Цвет тени серый */ 
} 
 DIV H1 { 
  position: relative;   /* Относительное позиционирование */ 
  left: -5px;      /* Сдвиг тени влево */ 
  top: -65px;      /* Сдвиг тени вверх от исходного положения */ 
  color: #800000;     /* Цвет текста заголовка */
font: Tahoma
} 

 HR { 
  border: 0px solid #ffffff ; /* Убираем ненужную рамку для браузера Opera */ 
  background-color: #ffffff ; /* Цвет линии для браузера Opera и Netscape */ 
  color: #ffffff ;      /* Цвет линии для браузера IE */ 
  height: 2px;   /* Высота линии */  
  text-align: center    /* Выравнивание по центру */ 
} 



/* оформленеи всплывающих подсказок 24.07.25 */
/* 1 тип 24.07.25 */
.custom-tooltip .tooltip-text {
  visibility: hidden;
  /* Настраиваем стили согласно своим предпочтениям */
}

.custom-tooltip:hover .tooltip-text {
  visibility: visible; /* Вот такое чудо! */
}
/* 2 тип 24.07.25 */
/* Контейнер подсказок */
.tooltip {
  position: relative;
  display: inline-block;
  border-bottom: 1px dotted black; /* Если вы хотите, чтобы точки под перемещаемым текстом */
}

/* Текст подсказки */
.tooltip .tooltiptext {
  visibility: hidden;
  width: 250px;
  background-color: #555;
  color: #fff;
  text-align: center;
  padding: 5px 0;
  border-radius: 8px;

  /* Расположите текст подсказки */
  position: absolute;
  z-index: 1;
  bottom: 125%;
  left: 50%;
  margin-left: -60px;

  /* Исчезают в подсказке */
  opacity: 0;
  transition: opacity 0.3s;
}

/* Подсказка стрелка */
.tooltip .tooltiptext::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: #555 transparent transparent transparent;
}

/* Отображение текста подсказки при наведении курсора мыши на контейнер подсказки */
.tooltip:hover .tooltiptext {
  visibility: visible;
  opacity: 1;
}