/* Сброс стандартных стилей */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* Глобальные стили */
body {
    font-family: 'Times New Roman', sans-serif; /* Выбор шрифта */
    line-height: 1.6; /* Интерлиньяж для лучшей читаемости */
    background-color: #f5f5f5; /* Фоновый цвет страницы */
    color: #000000; /* Цвет текста */
    font-size: 24px; /* Размер шрифта, чуть больше по умолчанию */
}

/* Стили для заголовков */
h1, h2, h3 {
    margin-bottom: 10px;
    font-weight: bold;
}

/* Стили для контейнера */
.container {
    display: flex;
    width: 80%;
    max-width: 900px; /* Максимальная ширина контейнера */
    margin: 0 auto; /* Центрирование */
    padding: 20px; /* Поля внутри контейнера */
    background-color: #ffffff; /* Фоновый цвет контейнера */
    /*border: 1px solid #000000; /* Рамка контейнера */
    border-radius: 8px; /* Скругленные углы */    
}

/* Стили для блоков */
.block-1 {
    flex: 1 1 calc(100% - 20px); /* Настройка ширины блоков на 1 в строку с отступом */
    margin: 10px; /* Отступы между блоками */
    background-color: #ffffff; /* Цвет фона блоков */
    /*border: 1px solid #ccc; /* Рамка блоков */
    /*border-radius: 5px; /* Скругленные углы у блоков */
    padding: 15px; /* Отступы внутри блоков */
    /*box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1); /* Тень блока */
    text-align: justify;
}
.block-2 {
    flex: 1 1 calc(50% - 20px); /* Настройка ширины блоков на 1 в строку с отступом */
    margin: 10px; /* Отступы между блоками */
    background-color: #ffffff; /* Цвет фона блоков */
    border: 1px solid #ccc; /* Рамка блоков */
    border-radius: 5px; /* Скругленные углы у блоков */
    padding: 15px; /* Отступы внутри блоков */
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1); /* Тень блока */
    text-align: justify;
}


/* Стили для кнопок */
button {
    background-color: #5f84a1; /* Цвет фона кнопки */
    color: #fff; /* Цвет текста на кнопке */
    border: none; /* Убираем границы */
    border-radius: 10px; /* Округление углов */
    padding: 10px 20px; /* Внутренние отступы */
    cursor: pointer; /* Курсор при наведении */
    transition: background-color 0.3s; /* Плавное изменение цвета фона */
}

button:hover {
    background-color: #2b6da0; /* Цвет фона при наведении */
}

/* Стили для форм */
input[type="text"],
input[type="password"],
input[type="email"],
textarea {
    width: 100%; /* Полная ширина */
    padding: 10px; /* Внутренние отступы */
    margin: 10px 0; /* Отступы между полями */
    border: 1px solid #ccc; /* Цвет границы */
    border-radius: 5px; /* Округление углов */
    font-size: 24px; /* Размер шрифта, чуть больше по умолчанию */
}

/* Стили для ссылок */
a {
    color: #5f84a1; /* Цвет ссылки */
    text-decoration: none; /* Убираем подчеркивание */
}

a:hover {
    text-decoration: underline; /* Подчеркивание при наведении */
    color: #2b6da0; /* Цвет текста при наведении */
}

/* Стили для флотающих элементов */
.clearfix::after {
    content: "";
    clear: both;
    display: table;
}
    
.widget {
    text-align: left; /*Выравнивает текст по левому краю*/
    padding-left: 15px; /*Добавляет отступ слева (можете изменить значение по своему усмотрению)*/
    margin-bottom: 10px; /*Отступ между элементами подвала*/
    font-size: 80%; /*Установка размера текста в % от размера родительского шрифта*/
}
    
.btn-primary {
    background-color: rgb(122, 170, 85); /*Цвет кнопки*/
    color: rgb(153, 45, 45); /*Цвет текста кнопки*/
    padding: 10px 20px;
    border-radius: 5px;
    border: none; /*Убирает границу кнопки*/
    cursor: pointer; /*Курсор при наведении*/
}
    
.btn-primary:hover {
    background-color: rgb(143, 206, 204); /*Цвет кнопки при наведении*/
}

.button_up {
    background-color: #5f84a1; /*Цвет кнопки*/
    color: #ffffff; /*Цвет текста кнопки*/
    padding: 10px 20px;
    border-radius: 5px;
    border: none; /*Убирает границу кнопки*/
    cursor: pointer; /*Курсор при наведении*/
}
    
.button_up:hover {
    background-color: #f5f5f5; /*Цвет кнопки при наведении*/
    color: #000000; /*Цвет текста кнопки при наведении*/
}

.footer {
    background-color: #310f00; /*Цвет фона подвала*/
    color: #fffef5; /*Цвет шрифта подвала*/
    padding: 20px 0; /*Отступы сверху и снизу*/
}

.footer-container {
    width: 100%; /*Ширина подвала на всю ширину страницы*/
    padding: 20px; /*Поля внутри подвала*/
    background-color: #310f00; /*Цвет фона подвала*/
    color: #fffef5; /*Цвет текста подвала*/
    border-radius: 0; /*Убираем округление углов, если не нужно*/
}

/* Элементы, которые я добавил после 15.06.25 для страничек с информацией для регистрации Пользователя */
.container.content {
    display: flex;
    flex-direction: column; /* Элементы располагаются в столбик */
    flex-wrap: wrap;
    background-color: #ffffff; /*Фоновый цвет контейнера*/
    width: 100%; /* Убедитесь, что блок занимает 100% ширины */
    max-width: 1200px; /* Максимальная ширина, если требуется */
    margin: 0 auto; /* Центрирует блок */
}
.text-container {
    display: flex;
    flex-direction: column; /* Элементы располагаются в столбик */
    flex-wrap: wrap;
    background-color: #ffffff; /*Фоновый цвет контейнера*/
    width: 90%; /* Ширина контейнера 90% от ширины экрана */
    margin: 0 auto; /* Центрирует контейнер по горизонтали */
    padding: 20px; /* Внутренний отступ */
    text-align: justify; /* Текст по ширине */
    font-size: 18px; /* Размер шрифта */
}

.text-container-center {
    display: flex;
    flex-direction: column; /* Элементы располагаются в столбик */
    flex-wrap: wrap;
    background-color: #ffffff; /*Фоновый цвет контейнера*/    
    text-align: center; /* Центрирует текст внутри каждого блока */
    width: 90%; /* Обеспечивает заполнение 90% ширины блока */
    margin: 0 auto; /* Центрирует контейнер по горизонтали */
    padding: 20px; /* Внутренний отступ */
    font-size: 18px; /* Размер шрифта */
}



/* Стили дополнительные только для странички HOME делал с 18.06.25 */
.container-home {
    display: flex;
    width: 80%;
    /* max-width: 1200px; /* Максимальная ширина контейнера */
    margin: 0 auto; /* Центрирование */
    padding: 10px; /* Поля внутри контейнера */
    background-color: #ffffff; /* Фоновый цвет контейнера */
    border-radius: 8px; /* Скругленные углы */    
}
.block1-home {
    flex: 1 1 calc(100% - 20px); /* Настройка ширины блоков на 1 в строку с отступом */
    margin: 10px; /* Отступы между блоками */
    background-color: #ffffff; /* Цвет фона блоков */
    padding: 15px; /* Отступы внутри блоков */
    /*box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1); /* Тень блока */
    text-align: justify;
}
.block2-home {
    flex: 1 1 calc(50% - 20px); /* Настройка ширины блоков на 1 в строку с отступом */
    margin: 10px; /* Отступы между блоками */
    background-color: #ffffff; /* Цвет фона блоков */
    /*border: 1px solid #ccc; /* Рамка блоков */
    /*border-radius: 5px; /* Скругленные углы у блоков */
    padding: 15px; /* Отступы внутри блоков */
    /*box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1); /* Тень блока */
    text-align: justify;
}

.block2-f-home {
    flex: 1 1 calc(50% - 20px); /* Настройка ширины блоков на 1 в строку с отступом */
    margin: 10px; /* Отступы между блоками */
    background-color: #ffffff; /* Цвет фона блоков */
    /*border: 1px solid #ccc; /* Рамка блоков */
    /*border-radius: 5px; /* Скругленные углы у блоков */
    /*padding: 15px; /* Отступы внутри блоков */
    /*box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1); /* Тень блока */
}

.img-responsive {
    max-width: 100%; /* Ограничивает ширину изображения до 100% */
    height: auto;    /* Сохраняет пропорции изображения */
}

/* Дополнительный класс для всех изображений с новым стилем */
.my-custom-img {
    max-width: 100%; /* Например, 80% от родителя */
    height: auto;    /* Сохраняет пропорции изображения */
    margin: 0 auto;  /* Центрирует изображение */
    display: block;   /* Убирает лишние пробелы под изображением */
}

.p0-0 {
    margin: 2px 0;  /* Измените отступы для абзацев */
    padding: 0;     /* Убедитесь, что внутренний отступ равен 0 */
    text-indent: 0px;
}

.p0-30 {
    margin: 2px 0;  /* Измените отступы для абзацев */
    padding: 0;     /* Убедитесь, что внутренний отступ равен 0 */
    text-indent: 30px;
}

.p0-60 {
    margin: 2px 0;  /* Измените отступы для абзацев */
    padding: 0;     /* Убедитесь, что внутренний отступ равен 0 */
    text-indent: 60px;
}

.p0-90 {
    margin: 2px 0;  /* Измените отступы для абзацев */
    padding: 0;     /* Убедитесь, что внутренний отступ равен 0 */
    text-indent: 90px;
}

.p1 {
    margin: 2px 0;  /* Измените отступы для абзацев */
    padding: 0;     /* Убедитесь, что внутренний отступ равен 0 */
    text-align: center;
    font-size: 90%; /*Установка размера текста в % от размера родительского шрифта*/
}

.p2 {
    margin: 2px 0;  /* Измените отступы для абзацев */
    padding: 0;     /* Убедитесь, что внутренний отступ равен 0 */
    text-align: left;
    font-size: 80%; /*Установка размера текста в % от размера родительского шрифта*/
    font-style: italic; /* Добавлено для установки текста в курсив */
}