/* color palette from https://www.color-hex.com/color-palettes */
:root {
	--darkest-color: rgba(33,0,90,1);
	--lightest-color: #addbc3;
	--highlight-color: #f3f3ec;
	--bright-color-1: #faece7;
	--bright-color-2: rgba(155,175,217,1);
	--bright-color-3:  rgba(170,181,255);
	--bright-color-4:  rgba(90,119,239,1);
}
body {
	background: var(--darkest-color);
	color: var(--lightest-color);
	font-family: 'Roboto', sans-serif;
}
 .container {
 	width: 90%;
 	max-width: 1000px;
 	margin: 20px auto;
 	margin: 50px auto;
 	display: flex;
 	flex-direction: column;
 	text-align: center;
}
.circle-shape {
	width: 140px;
	height: 140px;
	position: relative;
	overflow: hidden;
	border-radius: 50%;
	border: 3px solid var(--lightest-color);
	margin: 0 auto;
}
.profile-pic {
	display: inline;
	margin: 0 auto;
	height: 140px;
	width: 140px;
	object-fit: cover;
}
a {
	color: var(--lightest-color);
	text-decoration: none;
}
.ig-link {
	margin: 10px 0;
	font-weight: bold;
}
.link-list-item {
	border: 1px solid var(--lightest-color);
	box-sizing: border-box;
	margin: 20px auto;
	color: var(--darkest-color);
	padding: 15px;
	text-align: center;
	transition: all 0.15s;
	border-radius: 2px;
}
.link-list-item:hover,
a:hover {
	color: var(--highlight-color);
	border-color: var(--highlight-color);
	text-shadow: 0 0 2em var(--highlight-color);
}
.icon-list-img {
	height: 50px;
	width: 50px;
	margin: 3px;
}
.extralight {
	background: var(--bright-color-1);
}
.light {
	background: var(--bright-color-2);
}
.medium {
	background: var(--bright-color-3);
	}
.dark {
	background: var(--bright-color-4);
}