Добавил раскрытие меню

404.html

@@ -55,8 +55,7 @@
 	</header>	
 	<main>
 		<h1>Ошибка 404: запрашиваемый ресурс не найден!</h1>
-		<br/>
-		<p>Измените запрос или <a href="/">перейдите на главную</a></p>
+		<p>Измените запрос или <a href="/">перейдите на главную</a>.</p>
 	</main>
 	<footer>
 		<div>Казанское объединение молодых поэтов</div>

js/main.js

@@ -4,9 +4,11 @@ const menu = document.getElementById('menu')
 function toggleMenu() {
 	if (menu.className == '') {
 		menu.className = button.className = 'active'
+		menu.style.maxHeight = menu.scrollHeight + 'px'
 	}
 	else {
 		menu.className = button.className = ''
+		menu.style.maxHeight = null
 	}
 }
 

style/main.css

@@ -86,6 +86,9 @@ header {
 
 #menu {
 	display: none;
+	overflow: hidden;
+	max-height: 0;
+	transition: max-height .2s ease-out
 }
 
 #menu .button {
@@ -168,6 +171,7 @@ label p {
 
 .input:hover {
 	border-color: color-mix(in srgb, var(--border-color), black 30%);
+	transition: border-color .2s;
 }
 
 .input:focus {
@@ -196,6 +200,7 @@ input[type=submit] {
 
 input[type=submit]:hover {
 	background: color-mix(in srgb, var(--accent-color), black 20%);
+	transition: background-color .2s;
 }
 
 .content {
@@ -274,7 +279,7 @@ footer a:first-child {
 	.right > button {
 		display: block;
 	}
-	#menu.active {
+	#menu {
 		display: block;
 	}
 	footer {