:root {
    --color1: rgba(234, 218, 158, 0.8);
    --color2: rgba(2, 2, 44, 0.94);
    --color3: #66d330;
    --color4: #efda8e;
}
    /*header {*/
    /*          padding: 15px 20px;*/
    /*}*/
 footer{
    padding: 5px;
}


    /*header, footer{*/
    /*    background: url("../image/free-png.ru-187.png"), linear-gradient(to right, var(--color1) 0%,var(--color2) 100%);*/
    /*    background-size: contain;*/
    /*}*/

/*header, footer {*/
/*    background: url("../image/65-655486_clipart-cables-clip-art.png") no-repeat, linear-gradient(to right, var(--color1) 0%, var(--color2) 100%);*/
/*    background-size: contain; !* Масштабируем изображение, сохраняя соотношение сторон *!*/
/* !*   background-position: 80px 20px; !* Позиция по оси x и y *!*!*/
/*}*/

/*header, footer {*/
/*    background: url("/image/main_logo.png") no-repeat 50px center, !* Перемещаем изображение на 50px от левого края *!*/
/*    linear-gradient(to right, var(--color1) 0%, var(--color2) 100%) center/cover; !* Градиент растянут на всю ширину *!*/
/*    background-size: contain; !* Масштабируем изображение, сохраняя пропорции *!*/
/*}*/

header {
    min-height: 70px; /* Минимальная высота равна ширине изображения */
    display: flex;
    align-items: center; /* Центрируем содержимое по вертикали */
    padding: 10px 10px;
}

header, footer {
    /*background-image: url("/image/main_logo.png"), */
    background-image: linear-gradient(to right, var(--color1) 0%, var(--color2) 100%);
    /*background-position: 100px center, left center; !* Позиционирование для изображения и градиента отдельно *!*/
    /*background-repeat: no-repeat, repeat-x; !* Повторяемость фона для обоих уровней *!*/
    /*background-repeat: no-repeat;*/
    /*background-size: 170px auto, cover;*/

}


ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    display: inline;
    float:right;
}

li {
    display: inline;
}
.bold-text {
    font-weight: bold;
}

/* Настройки градиентного фона */
/*body {*/
/*    background: linear-gradient(to bottom, rgb(231, 228, 236), #573283);*/
/*    min-height: 100vh;*/
/*    margin: 0;*/
/*}*/


/* фоновое изображение для всей страницы */
body {
    background-image: url('/image/10.JPG'); /* Путь к изображению */
    background-position: center center; /* Центрируем изображение горизонтально и вертикально */
    background-repeat: no-repeat; /* Изображение не повторяется */
    background-size: cover; /* Растягиваем изображение на весь экран, сохраняя пропорции */
    color: #282525; /* Цвет текста поверх фона */
    font-family: Arial, sans-serif; /* Семейство шрифтов */
    height: 100vh; /* Высота тела документа равна высоте окна браузера */
    margin: 0; /* Обнуляем отступы вокруг body */
}

 /*линейный градиент поверх изображения*/
html::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1; /* Фон находится ниже содержимого страницы */
    background: rgba(243, 241, 241, 0.82); /* Полупрозрачная подложка */
}

 /*плавный переход цвета сверху-вниз */
html::after {
    content: '';
    position: fixed; /* Градиент закреплён фиксировано */
    top: 0;
    left: 0;
    width: 100vw; /* Ширина градиента равна виду окна */
    height: 100vh; /* Высота равняется всему окну браузера */
    z-index: -1; /* Расположен под всеми элементами */
    pointer-events: none; /* Наведение мышью игнорируется */
    background: linear-gradient(
            to bottom,
            rgba(186, 201, 204, 0.58),
            rgba(132, 123, 145, 0.6)
    );
}

/* Радиус закругления уголков (чем больше значение, тем сильнее округляются углы) */
.rounded-img {
    border-radius: 10px;
}

/* карточа плавный переход цвета сверху-вниз */
.card {
    background: linear-gradient(
            /*to bottom,*/
            rgba(204, 181, 94, 0.32),
            rgba(185, 165, 210, 0.4)

            /*rgba(205, 215, 215, 0.4),*/
            /*rgba(239, 218, 142, 0.87)*/
    );
    /*background-color: rgba(138, 28, 41, 0.56) !important; !* Единый цвет фона для всех карточек *!*/
}