* {
	margin: 5px;
	box-sizing: border-box;
}

body{
	background:#282A36;
	font-family: "Source Code Pro";
	display: flex;
	flex-direction: column;
}

header{
	padding: 10px;
	font-size: 40px;
}

ul.menu {
	text-align: center;
	color: #8BE9FD;
}

li.menu {
	display: inline;
	background:#6E46A4;
	color: #8BE9FD;
}

.main{
	display: flex;
	flex: 1;
}

.left{
	flex: 1 1 100px;
}

main{
	font-size: 20px;
	flex: 5 5 150px;
	text-align: left
	text-align: left;
}

.right{
	flex: 1 1 100px;
}

@media all and (max-width: 550px){
	.main{
		flex-direction: column;

	}
	main{
		padding: 5em 0 5em 0;
	}
}

footer{
	text-align: center;
}

h1 {
	color: #8be9fd;
}

h2 {
	color: #ff79c6;
}

h3 {
	color: #9b6bdf;
}

p {
	color: white;
	text-align: left;
	margin-bottom: 30px;
}

a {
	color: #8aff80;
}

ul {
	list-style: none;
	display: block;
}

ol {
	color: white;
	margin-bottom: 30px;
}

b {
	color: #f1fa8c;
}

img {
	max-width: 100%;
	height: auto;
}