body {
	font-family: 'Roboto';
	margin: 0%;
}

svg {
	fill: white;
	stroke: red;
	position: absolute;
	bottom: 0;
	width: 100%;
	height: 6vw;
}

ul {
	list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: #E84C3D;
}

li {
	float: right;
}

li a {
	display: block;
	color: white;
	text-align: center;
	padding: 14px 16px;
	text-decoration: none;
}

li a:hover {
	padding-bottom: 5px;
	border-bottom: 2px solid white;
}

#title {
	margin: 0%;
 	padding-top: 25px;
  	font-size: 500%;
}

#blog {
	margin: 0%;
	font-size: 300%;
}

#header {
	position: relative;
	width: 100;
	height: 300px;
	background-color: #E84C3D;
	color: white;
}

#container {
    text-align: center;
    max-width: 1200px;
    margin: 0 auto;
}

.box {
	position: relative;
    width: 500px;
    height: 250px;
    margin: 10px;
    display: inline-block;
    border-style: solid;
    border-color: #E84C3D;
}

.wrapper {
  	text-align: center;
  	max-width: 500px;
    margin: auto;
}

img {
	width: 500px;
    height: 250px;
}

.centered {
	position: absolute;
	top: 50%;
    left: 0%;
    color: white; 
	font: bold 24px/45px Helvetica, Sans-Serif; 
	letter-spacing: -1px;  
	background: rgb(0, 0, 0); 
	background: rgba(0, 0, 0, 0.7);
	padding: 10px; 
}