﻿
@import url('https://fonts.googleapis.com/css2?family=Roboto+Condensed:ital,wght@0,100..900;1,100..900&display=swap');

body {
    font-family: /* 'Segoe UI';*/ Roboto Condensed;
    font-size: 24px;
    margin: 150px;
}
p
{
    text-align: justify;
}
p span.first-words {
    font-weight: bold;
}
figure
{
    text-align: center;
    font-style: italic;
    font-size: 16px;
    margin: 20px 0;
}

ul /*непосредственная вложенность*/
{
    color: cornflowerblue;
    list-style-type:none;
}

/* Стиль для примечаний */
.note {
    font-style: italic;
    color: #555; /* Серый цвет */
    padding-left: 30px; /* Отступ слева для иконки */
    text-indent: -15px; /* Выступ текста под иконку */

    margin: 20px 0; /* Отступы между примечаниями */
    line-height: 1.5; /* Межстрочный интервал */
    position: relative; /* Для позиционирования иконки */
    background-color: #f8f9fa;
    padding: 15px;
    border-left: 4px solid #6c757d;
}

    /* Псевдоэлемент с иконкой */
    .note::before {
        content: ""; /* Обязательное свойство */
        display: block;
        width: 20px; /* Ширина иконки */
        height: 20px; /* Высота иконки */
        background-image: url('img\quotes.PNG'); /* Путь к картинке */
        background-size: contain; /* Масштабирование */
        margin-right: 8px; /* Отступ от текста */
        vertical-align: middle; /* Выравнивание по центру */
    }
    a
    {
        color:gray;
    }
        /*
        element:pseudo-class{}  https://developer.mozilla.org/en-US/docs/Web/CSS/Pseudo-classes
        element:pseudo-element{} https://developer.mozilla.org/en-US/docs/Web/CSS/Pseudo-elements
        */
    a:visited
    {
        color:darkblue;
    }
    a:hover
    {
        font-weight:800;  
        /*font-size:32px; так лучше не делать, элементы не должны ездить по странице*/
        background-color:orange;
    }
    thead
    {
        background-color:#685FB5;
        /*color:white;*/
        border:solid 1px;
        border-color:black;
    }
    td
    {
       
        border:solid 1px;
    }
    th
    {
        color:white;
        border: solid 2px black;
        border-left:solid 1px white;
        border-right:solid 1px white;
        padding:10px 50px;
    }
    .table-first-header
    {
        border-left:solid 2px black;

    }
    .table-last-header
    {
        border-right:solid 2px black;
    }
    table
    {
        border:solid 1px;
        /*border-spacing:0;*/
        border-collapse:collapse;
        margin: 0 auto;
    }
    table:hover
    {
        box-shadow: 0px 0px 25px 15px grey;
        /*box-shadow: 
            horizontal-offset 25px 
            vertical-offset   25px 
            blur(размытие)    0px 
            sprad (расширение)25px 
            color             grey
            ;*/
    }
    tr:hover
    {
        box-shadow: inset 0px -2px 5px 0px green;
    }