Стилі для сторінки

                
CSS
                
/* Стилі для навігаційного меню */
.page-menu {
    margin: 20px 0; /* Відступи зверху та знизу */
    padding: 15px 0; /* Відступи всередині */
    background-color: #f8f9fa; /* Колір фону */
    border-radius: 8px; /* Закруглені кути */
}

/* Стилі для списку у меню */
.page-menu ul {
    list-style: none; /* Видаляємо маркери */
    padding: 0; /* Видаляємо відступи */
    margin: 0; /* Видаляємо відступи */
    display: flex; /* Гнучкий контейнер */
    justify-content: center; /* Вирівнювання по центру */
    flex-wrap: wrap; /* Перенесення на новий рядок */
    gap: 10px; /* Відступи між елементами */
}

/* Стилі для елементів списку */
.page-menu li {
    margin: 0; /* Видаляємо відступи */
}

/* Стилі для посилань у меню */
.page-menu a, a {
    display: block; /* Блоковий елемент */
    padding: 8px 15px; /* Відступи всередині */
    background-color: #2980b9; /* Колір фону */
    color: white; /* Колір тексту */
    text-decoration: none; /* Видаляємо підкреслення */
    border-radius: 20px; /* Закруглені кути */
    transition: all 0.3s ease; /* Плавні анімації */
    font-weight: 500; /* Напівжирний шрифт */
}

/* Ефект при наведенні на посилання */
.page-menu a:hover {
    background-color: #800080; /* Колір фону */
    transform: translateY(-2px); /* Зсув вгору */
    box-shadow: 0 4px 8px rgba(0,0,0,0.1); /* Тінь */
}

/* Стилі для кнопки "До гори" */
.page-menu a[href="#top"] {
    background-color: #2c3e50; /* Темний колір */
}

/* Плавний скролл для всієї сторінки */
html {
    scroll-behavior: smooth;
}