.flex-container {
	display: flex;
	flex-direction: row;
	align-items: stretch;
	height: 100vh;
	margin: 0;
	text-align: center;
	color: #FFF;
	border:solid 2px #FFF;
	border-radius: 10px;
	background-color: #1E90FF;
}

nav {
	flex: 0 1 20%;
	margin: 20px;
	border:solid 2px #FFF;
  	border-radius: 10px;
}

nav ul {
	list-style-type: none;
	margin: 20px;
	padding: 0;
}

.ul-two {
	border: solid 2px #FFF;
	border-radius: 10px;
	padding-bottom: 30px;
}

nav ul li {
	margin: 20px;
	border: solid 2px #FFF;
	border-radius: 10px;
	padding: 10px;
}

.body {
    flex: 1 0 auto;
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
  	align-content: flex-start;
  	margin: 20px;
}

header {
  	flex: 0 1 100%;
  	height: 15%;
  	border: solid 2px #FFF;
	border-radius: 10px;
}

aside {
  	height: 82%;
  	flex: 0 1 15%;
  	border: solid 2px #FFF;
	border-radius: 10px;
	margin: 10px 10px 0 5px;
}

.main {
  	flex: 1 0;
  	height: 83%;
  	display: flex;
  	flex-direction: column;
  	border: dotted 3px #FFF;
	border-radius: 10px;
	margin: 5px;
}

.img-container {
  	flex: 3 0;
  	display: flex;
  	flex-wrap: wrap;
  	flex-direction: row;
  	justify-content: space-around;
  	border: solid 2px #FFF;
	border-radius: 10px;
	margin: 10px;
}

.img-container p {
  	border: solid 2px #FFF;
  	border-radius: 10px;
  	padding: 10px;
}

.img-container>article {
  	flex: 0 1 15%;
  	text-align: center;
}

  .article-container {
  	flex: 3 0;
  	display: flex;
  	align-items: stretch;
}

.article-container>article {
	flex: 1 1;
	border: solid 2px #FFF;
  	border-radius: 10px;
  	margin: 10px;
}

footer {
  	flex: 1 0;
  	margin: 10px;
  	border: solid 2px #FFF;
  	border-radius: 10px;
}






