@charset "utf-8";
/* CSS Document */

body{
	background-color: #e3e3e3;
}

#page{
	max-width: 600px;
	margin: auto;
	font-family: halgen, sans-serif;
	color: #1a1a1a;
	background-color: #6b9daf;
}
#page h1{
	font-family: halogen, sans-serif;
	font-weight: 400;
	font-style: normal;
	color: #e3e3e3;
	text-transform: uppercase;
	font-size: 30px;
	text-align: center;
	margin-top: 20px;
}

#page{
	/*height: 120vh;*/
}

aside{
	background: #1a1a1a;
}

header img{
	width: 100%;
	margin: auto;
	display: block;
}

#logo{
	display: flex;
}

nav ul li a{
	color: #E4E4E4;
	background: #6b9daf;
	text-align: center;
	font-size: 24px;
	display: block;
	padding: 20px 10px;
	text-decoration: none;
	text-transform: uppercase;
	border-bottom: 12px solid #1a1a1a;
	font-family: halogen, sans-serif;
	font-weight: 700;
	font-style: normal;

}

nav ul li a:hover{
	background-color: #e3e3e3;
	color: #6b9daf;
}

nav ul{
	margin: 0;
	padding: 0;
	list-style-type: none;
	border-top: 20px solid #1a1a1a;
}

#footerd{
	display: none;
}


/***** Content *****/


article{
	background-color: #6b9daf;
	padding-bottom: 30px;
}
article p{
	padding: 50px;
	padding-bottom: 10px;
	font-size: 16;
	font-family: helvetica, sans-serif;
}
article img{
	width: 75%;
	display: block;
	margin: auto;
	margin-top: 40px;
}


#footerm .fa-twitch, .fa-youtube, .fa-twitter{
	color: #e3e3e3;
	font-size: 49px;
	text-align: center;
	padding: 20px 15px;
}

footer ul{
	width: 100%;
	margin: auto;
}

footer{
	margin-top: 0;
	text-align: center;
	font-family: halgen, sans-serif;
	font-weight: 100;
	font-style: normal;
}

#footerm{ padding-bottom: 20px; }

#contact { 
	width: 300px;
	display: block; }

#footerm p{
	color: #e4e4e4;
	padding: 10px 70px;
	font-size: 17px;
	line-height: 19px;
}

#footerm ul li a i:hover{
	color: #1a1a1a;
}




.songs p{
	padding: 0;
	padding-top: 25px;
	font-family: halogen, sans-serif;
	font-weight: 400;
	font-style: italic;
	text-indent: 35px;
}

.songs{
	margin-bottom: 150px;
}


audio{
	width: 90%;
	margin: auto;
	display: block
}


@media only screen and (min-width: 600px){
	#page{
		display: flex;
		max-width: 900px;
	}
	
	aside{
		flex: 1;
	}
	
	article{
		flex: 2;
	}
	
	
	#footerm{
		display: none;
	}
	
	#footerd {
		display: block;
		margin-bottom: 20px;
		color: #1e1e1e;
	}
	
	#footerd p{
		font-family: halgen, sans-serif;
		font-weight: 100;
		font-style: normal;
		color: #e3e3e3;
	}
	
	#footerd .fa-twitch, .fa-youtube, .fa-twitter{
	color: #6b9daf;
	font-size: 49px;
	text-align: center;
	padding: 20px 15px;
	}
	
	#contact a i:hover{
		color: #e3e3e3;
	}
	
	nav ul li a{
		width: 80%;
		margin: auto;
	}
	
	
	.albums{
	display: flex;
	}

	.albums img{
		flex: 1;
		padding: 20px;
		margin-bottom: 20px;
	}

}