.calendar-day {
    cursor: pointer;
    transition: all 0.2s;
}
.nav-link:hover {    
    color: #5184b8;
}
.card {
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}
body {        
    font-family: 'Cinzel', serif;  
}

.header {
    font-family: 'Cinzel', serif;
    align-items: center; /* Вертикальное центрирование */
    color: #FFF5E1;
    padding: 20px 20px;
    position: relative;
    background-color: #83acd4;            
}

.header h3{
    font-size: 2.5rem; /* Размер шрифта */
}

.header-pattern {
    
    
    background: radial-gradient(
        circle at top,
        rgba(79, 70, 228, 0.45) 10%,
        rgba(79, 70, 228, 0.45) 15%,
        transparent 16%
    ),
    radial-gradient(
        circle at bottom,
        rgba(79, 70, 228, 0.45) 20%,
        rgba(79, 70, 228, 0.45) 25%,
        transparent 26%
    );
    background-size: 3em 3em; /* Размер узора */
    background-color: rgba(131, 172, 212, 0.45); /* Фоновый цвет */
    background-size: cover; /* Масштабирование изображение */
    margin-left: auto; /* Двигаем узор в правую часть */
}


@media (max-width: 768px) {
    .header {
        text-align: center; /* Центрирование заголовка на мобильных устройствах */
    }
    .header h3 {
        font-size: 2rem; /* Уменьшение размера шрифта на мобильных устройствах */
    }
    .overlay-container {      
           width: 100% !important; /* Изменено на 100% для адаптивности */
        }    
  }
.overlay-container {
            position: fixed;
            top: 0;
            left: 50%;
            transform: translateX(-50%);
            width: 70%; /* Изменено на 100% для адаптивности */
            background-color: #83acd4; 
            
            height: 100vh;
            overflow-y: auto; /* Разрешить вертикальную прокрутку */
            padding-bottom: 100px;
}
#navbar-container{
    position: relative; /* Устанавливаем относительное позиционирование */
    z-index: 1001; /* Убедитесь, что он выше .overlay-container */
}
.page {
    background-image: url('../images/pencil2.png'), url('../images/pencil1.png');
    background-position: left center, right center; /* Позиционируем изображения по бокам */
    background-repeat: no-repeat; /* Избегаем повторения изображений */     
    height: 100vh;    
}
.footer {
    background-color: #ffffff; /* Белый фон */
    padding: 20px 0; /* Отступы сверху и снизу */
    position: relative; /* Для позиционирования */
    z-index: 1000; /* Убедитесь, что футер выше других слоев */
    bottom: 0; /* Фиксированное положение внизу страницы */
    width: 100%; /* Ширина на весь экран */    
}
.footer p {
    margin: 0; /* Убираем отступы у параграфов */
    color: #343a40; /* Цвет текста */
}
.footer a {
    color: #5184b8; /* Цвет ссылок */
    text-decoration: none; /* Убираем подчеркивание */
}
.footer a:hover {
    text-decoration: underline; /* Подчеркивание при наведении */
}
h4 {
    color: #343a40;
}
.btn-outline-primary {
    border-color: #343a40;
    color: #343a40;
}
.btn-outline-primary:hover {
    background-color: #343a40;
    color: white;
}
article {
            font-size: 22px; /* Увеличиваем размер шрифта */
            font-weight: bold;
            color: #333;
            font-family: 'Georgia', serif; /* Меняем шрифт на Arial */
            line-height: 1.6;
        }