@charset "UTF-8";
/* CSS Document */
html {
	font-size: 100%;
}

a {
	text-decoration: none;
    color: black;
	padding: 20px;
}

a:hover {
    color: white;
}

body {
	font-family: 'Poppins', sans-serif;
	background-color: #EDDDD4;
	margin: 0px;
}

header {
	font-family: 'Poppins', sans-serif;
	background-image:radial-gradient(#454851,#54577C);
	height: 250px;
	margin: 0px;
	padding: 0px;
}

header h1 {
	text-align: center;
	padding: 100px;
	margin: 0px;
	color: white;
	font-size: 300%;
}

.flex-container {
	display: flex;
	flex-direction: row;
}

nav {
	font-family: 'Poppins', sans-serif;
	flex: 15%;
	background-color: #9DB4C0;
	margin: 0px;
	padding: 0px; 
}

nav ul {
	margin: 0px;
	padding: 20px;
	text-align: center;
}

nav ul li {
	list-style-type: none;
	padding: 10px;
	align: center;
}

nav a {
  	text-decoration: none;
    color: black;
	padding: 0px;
}

nav a:hover {
    color: white;
}

a:active {
  color: yellow;
}

.mainContent {
	font-family: 'Poppins', sans-serif;
	flex: 70%;
	margin: 20px;
}

.sidePanel {
	font-family: 'Poppins', sans-serif;
	flex: 15%;
	padding: 20px;
	background-color: #9DB4C0;
	text-align: center;
	margin: 0px;
}

#profileImage {
	border-radius: 50%;
}

img {
	margin: 25px; 
}

ul {
	margin: 0px;
	padding: 10px;
	text-align: center;
}

ul li {
	list-style-type: none;
	padding: 10px;
	align: center;
	margin: 0px;
	text-align: center;
}

footer {
	font-family: 'Poppins', sans-serif;
	background-color: #454851;
	padding: 20px; 
	margin: 0px;
	color: white;
	text-align-last: center;
}