/* RESOURCES */
	@import url('https://fonts.googleapis.com/css2?family=Baloo+2:wght@400;500;600;700;800&family=Lora:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&family=Oswald:wght@200;300;400;500;600;700&display=swap');
		/* Share link - 
			https://fonts.google.com/share?selection.family=Baloo%202:wght@400;500;600;700;800%7CLora:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700%7COswald:wght@200;300;400;500;600;700
		*/
/* Color Theme Swatches in Hex */
.pastel-periwinkle-web-design-1-hex { color: #313133; }
.pastel-periwinkle-web-design-2-hex { color: #676999; }
.pastel-periwinkle-web-design-3-hex { color: #7B7EB3; }
.pastel-periwinkle-web-design-4-hex { color: #ADB0D9; }
.pastel-periwinkle-web-design-5-hex { color: #E9E9F2; }

/* Color Theme Swatches in RGBA */
.pastel-periwinkle-web-design-1-rgba { color: rgba(49, 49, 51, 1); }
.pastel-periwinkle-web-design-2-rgba { color: rgba(103, 105, 153, 1); }
.pastel-periwinkle-web-design-3-rgba { color: rgba(123, 126, 179, 1); }
.pastel-periwinkle-web-design-4-rgba { color: rgba(173, 176, 217, 1); }
.pastel-periwinkle-web-design-5-rgba { color: rgba(233, 233, 242, 1); }

/* Color Theme Swatches in HSLA */
.pastel-periwinkle-web-design-1-hsla { color: hsla(240, 1, 19, 1); }
.pastel-periwinkle-web-design-2-hsla { color: hsla(237, 19, 50, 1); }
.pastel-periwinkle-web-design-3-hsla { color: hsla(236, 26, 59, 1); }
.pastel-periwinkle-web-design-4-hsla { color: hsla(235, 36, 76, 1); }
.pastel-periwinkle-web-design-5-hsla { color: hsla(240, 25, 93, 1); }

/* BASIC DESIGN */
	#nav,#section,#footer {
		background: #7B7EB3;
		max-width: 880px;
		width: 95%;
		padding: 10px;
		position:  relative;
		margin: 10px auto;
		text-align: justify;
		color: #313133;
	}

	#header {
		max-width: 899px;
		width: 100%;
		position:  relative;
		margin: auto;
		text-align: justify;
		color: #313133;
	}

	body {
		background: #ADB0D9;
	}
	a {
		color: #313133;
	}

/* SPECIFIC TWEAKS */

/* HEADER */

	#header h1, h2, h3, h4, h5, h6{
		font-family: Oswald, sans-serif;
		font-weight: 700;
		text-align: center;
	}
	#header img {
		width: 100%;
	}

/* NAV */
	#nav {
		font-family: 'Baloo 2', cursive;
		font-size: 25px;
		font-weight: 500;
	}
	#nav ul {
		text-align: center;
	}
	#nav li {
		display: inline;
		padding-right: 30px;
	}
	#nav a:link {
		text-decoration: none;
	}
	#nav a:hover {
		text-decoration: underline;
		color: #E9E9F2;
	}

/* SECTION */
	#section p {
		font-family: Lora, serif;
	}

	#section h1, h2, h3, h4, h5, h6 {
		font-family: Oswald, sans-serif;
		font-weight: 400;
		text-align: left;
		margin-left: 10px;
	}

	#section h1 {
		font-size: 2.2em;
	}
	
	#section h2 {
		font-size: 1.5em;
	}

	#section table, td, th {
		border: 3px solid #676999;
		padding: 5px 15px;
	}

	#section table {
		table-layout: fixed;
		width: 100%;
	}

	#section th {
		background: #E9E9F2;
		font-family: 'Baloo 2', cursive;
		font-weight: 600;
		font-size: 20px;
	}

	#section td {
		background: rgba(233, 233, 242, .35);
		font-family: Lora, serif;
		font-size: 16px;
	}
	.crown {
		margin: auto;
		display: block;
		width: 100%;

	}

/* FOOTER */

#footer {
	font-family: Lora, serif;
}

/* MISC */

/* spotify widget */
.sidebar {
float: right;
width: 50%;
height: auto;
margin-left: auto;
margin-right: auto;
}

.sidebar-bottom {
display: none;
}

@media screen and (max-width: 651px) {

.sidebar {
display: none;
}

.sidebar-bottom {
display: block;
position: relative;
width: 90%;
height: auto;
margin-left: auto;
margin-right: auto;
margin-bottom: 20px;
background: white;
}
}