@media (max-width: 1024px) {
	header {
		display: flex;
		align-items: center;
		margin: auto;
		z-index: 999;
		flex-direction: column !important;
		text-align: center !important;
	}
	main {
		min-height: unset !important;
	}
	.btn-signing {
		margin: 20px auto;
	}
	.content {
		max-width: none !important;
		margin-left: 0 !important;
	}
	.tag-box {
		width: auto !important;
	}
	.bookshelve {
		position: unset !important;
	}
	.book-catalog {
		margin: auto !important;
	}
	.search-input {
		width: 100% !important;
		font-size: 1.1rem !important;
		height: 2.5rem !important;
		padding: 0 1rem !important;
		border-radius: 20px !important;
		box-sizing: border-box !important;
	}
	.search-box {
		gap: 0.5rem !important;
	}
	.search-box {
		width: 100% !important;
		max-width: 100% !important;
		margin: 0 !important;
		gap: 0.5rem !important;
	}
	.search-input {
		width: 100% !important;
		max-width: 100% !important;
		font-size: 1.1rem !important;
		height: 2.5rem !important;
		padding: 0 1rem !important;
		border-radius: 20px !important;
		box-sizing: border-box !important;
		margin: 0 !important;
	}
}

@media (min-width: 100px) {
	.book-grid {
		grid-template-columns: repeat(1, 1fr) !important;
	}
}

@media (min-width: 500px) {
	.book-grid {
		grid-template-columns: repeat(2, 1fr) !important;
	}
}

@media (min-width: 900px) {
	.book-grid {
		grid-template-columns: repeat(3, 1fr) !important;
	}
}

#toggleButton {
	display: none;
}

@media (max-width: 1440px) {
	.desktop-content {
		display: none;
	}

	#toggleButton {
		position: fixed;
		top: 20%;
		right: 5%;
		display: block;
		padding: 12px;
		color: white;
		background-color: transparent;
		border-radius: 42px;
		cursor: pointer;
		border: 2px solid white;
		width: 50px;
		height: 50px;
	}

	.mobile-content-visible {
		display: block !important;
	}
}