html {
	background: black;
	color: white;
	padding-left: 10%;
	padding-right: 10%;
	font-family: monospace;
}

header {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
}

a {
	color: white;
	text-decoration: underline;
}

a:hover {
	background: white;
	color: black;
}

article {
	border: 1px solid white;
	padding-left: 5%;
	padding-right: 5%;
	padding-top: 1%;
	padding-bottom: 1%;
	margin-top: 5%;
}

hr {
	margin-top: 5%;
	color: white;
}

input {
	border: 1px solid white;
	color: white;
	background: black;
	margin: 1%;
}

.categories-div {
	display: flex;
	flex-direction: row;
}
.categories-div>* {
	margin: 1%;
}


@media (max-width: 700px) {
	header {
		display: flex;
		flex-direction: column;
		margin-bottom: 2%;
	}
	input {
		margin: 0%;
	}
}