* {
	box-sizing: border-box;
}

pre {
	white-space: pre-wrap;
}

body {
	color: darkblue;
	font-family: "Stylish", sans-serif;
	font-size: 17px
	padding: 20px;
	background: black;
}

.header {
	position: relative;
}

.text-block {
	position: absolute;
	top: 20px;
	left: 20px;
	background: rgba(169, 169, 169, 0.5);
	color: darkblue;
	padding-left: 20px;
	padding-right: 20px;
}

.leftcolumn {   
	float: left;
	width: 75%;
}

.rightcolumn {
	float: left;
	width: 25%;
	padding-left: 20px;
}

.card {
	background-color: gray;
	padding: 20px;
	margin-top: 20px;
}

.image {
	background-color: gray;
	width: 100%;
	padding: 20px;
	margin-top: 20px;
}

.row:after {
	content: "";
	display: table;
	clear: both;
}

.footer {
	padding: 10px;
	text-align: center;
	background: dimgray;
	margin-top: 10px;
}

@media screen and (max-width: 800px) {
	.leftcolumn, .rightcolumn {   
		width: 100%;
		padding: 0;
  }
}
