@import url('https://fonts.googleapis.com/css?family=Frijole|Karma|Margarine&display=swap');
html{
	margin: 0;
	padding: 0;
}
body
{
	font-family: 'Margarine', cursive, serif;
	padding:0;
	margin: 0;
}
#headerstars
{
	height: 3rem;
	background-image: url(images/nav/SVG/headerblack.svg);
	margin: 0rem;
	padding: 0rem;
	
}
.articlemerch
{
	display: flex;
	margin: 2rem 1rem;
	align-items: space-between;

}
.articlemerch img
{
	max-width: 80%;
}
#home
{
	background-color: red;
}
#about
{
	background-color: orange;
}
#music
{
	background-color: lightgoldenrodyellow;
}
#tour
{
	background-color: yellow;
}
a
{
	text-decoration: none;
}
.link 
{
	padding: .5rem 1rem;
	text-align: center;
	color: white;
	margin: .5rem 2rem 0rem 2rem;
	border: black .1rem solid;
	background-color:darkgrey;
	display: inline-block;
	font-size: .9rem;
	font-family: sans-serif;
	
}
.link:hover
{
	background-color: white;
	color: red;
	border: black .1rem solid;
}
.mercharticle .link
{
	margin-left: 0;
}
.featuredinfo .link
{
	margin-left: 0;
}
nav ul
{
	display: flex;
	list-style-type: none;
	margin: 0rem auto;
	padding: 0rem;
	justify-content: space-around;
	align-items:center;
	max-width: 80%;
	

	
}
nav ul li a 
{
	text-decoration: none;
	margin:  0;
	padding: 0 3rem;
	color: black;
	font-size: 1.2rem;
	
}
nav ul li a:hover
{
	color: red;
}
.active
{
	background-color: lightgoldenrodyellow;
}

img
{
	display: block;
	padding: 0;
	margin: 0;
	border: solid black 1rem;	
}
header nav
{
	background-color: white;
	border-bottom: solid black 1.8rem;
	border-top: solid black 1.8rem;
}
h1
{
	max-width: 1500px;
	text-align: center;
	padding: 3rem 3rem;
	margin: 0 auto 3rem auto;
	font-size: 6rem;
	font-family: 'Frijole', cursive, serif;
	line-height: 5rem;
}
#herohome
{
	background-image: url(images/heroimage/falsecoral.jpg);
	background-size: cover;
	color: white;

}
#herotour
{
	background-image: url(images/heroimage/blackandyellowwall.jpg);
	padding: 5.5rem 3rem;
	background-size: cover;
	color: yellow;
}
#heroabout
{
	background-image: url(images/heroimage/redhands.jpg);
		background-size: cover;
	color: orange;
	margin: 0;
}
#heromusic
{
	background-image: url(images/heroimage/redbrick.jpg);
		background-size: cover;
	color: lightgoldenrodyellow;
	padding: 5.5rem 3rem;
	
}
#heromerch
{
	background-image: url(images/heroimage/snakeye.jpg);
		background-size: cover;
	color: white;
	padding: 5.5rem 3rem;
}
main
{

	margin: 2rem;
	display: flex;
	justify-content: flex-start;
}
h2
{
	font-size: 2.5rem;
	margin: 0 2rem;
	padding: 0;
	line-height: 3rem;
	
}
#merch h2
{
	margin: 0 0 .5rem 0;
	padding: 0;
}
h3
{
	margin: 0 2rem 1.5rem 2rem;
	padding: 0;
	font-size: .9rem;
}
.productpg h3
{
	font-size: 1.5rem;
	margin-bottom: .8rem;
}
.mercharticle h3
{
	font-size: 1.5rem;
	margin: 1rem 0 0 0;
}
.mercharticle p
{
	margin: 0 0 .5rem 0;
	padding: 0;
	max-width: 250px;

}
p
{
	font-family: 'Karma', serif;
	margin: 0 2rem .5rem 2rem;
	padding: 0;
	max-width: 600px
	
}
.productpg p
{
	max-width: 350px;
}
.article
{
	display: flex;
	padding: 2rem 3rem;
	align-items: flex-start;
}
.articlemerch
{
	margin: 0 0 5rem 0;
	
}
.article img 
{
	max-width: 250px;
}
#mainmerch
{
	display: block;
}

.featuredinfo h2
{
	padding: 2rem 0 .5rem 0;
}
.left 
{
		margin-left: 0;
	
}

.featuredinfo button:hover
{
	background-color: white;
	color: red;
	border: black .1rem solid;
}
.infoblockmusic button img
{
	border: none;
	height: 40px;
	display: inline;
	margin: 0 .5rem;
}
.infoblockmusic button
{
	display: flex;
	margin: 1rem 2rem 0rem 2rem;
	justify-content: center;
	align-items:center;
	padding: 0 0rem 0 1rem;
}
.infoblockmusic button:hover
{
	background-color: white;
	color: red;
	border: black .1rem solid;
}
button 
{
	padding: .5rem 1rem;
	text-align: center;
	color: white;
	margin: .5rem 2rem 0rem 2rem;
	border: black .1rem solid;
	background-color:darkgrey;
}
.infoblock button:hover
{
	background-color: white;
	color: red;
	border: black .1rem solid;	
}
}
button:hover
{
	background-color: white;
	color: red;
	border: black .1rem solid;
}
{
	background-color: black;
	color: yellow;
}
.mercharticle button
{
	margin-left: 0;
}
.mercharticle button:hover
{
	background-color: white;
	color: red;
	border: black .1rem solid;
}
table
{
	width: 85%;
	margin: 0 auto;
	border-collapse: collapse;
	padding-bottom: 0rem;
	margin-bottom: 4rem;
	
}
#table h2
{
	text-align: center;
	padding-bottom: 0;
}
caption
{
	padding-bottom: 1rem;
}
th
{
	text-align: left;
	color: yellow;
	padding: 0.5rem;
	background-color: black;
}
th, td
{
	padding: 0.5rem;
	font-size: 1rem;
}
td img
{
	border: none;
	margin: 0 auto;
	padding: 0;
	height: 50px;

}
tr
{
	border-bottom: 3px solid black;
	
}
td
{
	font-family: 'Karma', serif;
}
tr:hover
{
	background-color: lightgoldenrodyellow;
}
footer
{
	padding: .4rem 0 .5rem 0;
	margin-top: 3rem;
	font-size: .6rem;
	background-color: black;
	color: white;
	
}
footer .button
{
	margin: .5rem 0rem .8rem 2rem;
	min-width: 250px;
	background-color: white;
	color: black;
	text-align: left;
	font-size: .8rem;
	padding: .5rem 1rem;
}
footer button
{
	margin-left: .5rem;
	margin-bottom: .8rem;
	border: none;
}
footer button:hover
{
	background-color: white;
	color: red;

	

}
#emaillist
{
	display: flex;
}
#socialicons
{
	display: flex;
	justify-content: space-around;
	background-color: white;
	
}
#socialicons img
{
	border: none;
	height: 25px;
	padding: .5rem 0rem;
}
#footernav ul
{
	padding: .5rem .5rem;
	justify-content: flex-start;
	margin: 0;	
}
#footernav ul li a 
{
	color: white;
	font-size: 1rem;
	margin-left: 0;
	padding: 0 1.5rem;
}
#footernav ul li a:hover
{
	color: red;
}