h1{
	font-family: Century Gothic, sans-serif;
	color: white;
	text-align: center;
	font-size: 75px;
	padding-bottom: 10px;
}
*{
box-sizing: border-box;
margin: 0;
}

img{
top: 20px;
left: 20px;
bottom: 30px;
}
nav{
  line-height: 2em;
  width: 100%;
  font-size: 35px;
  grid-template-columns: 50px 1fr 50px;
  margin-bottom: 5vmin;
  display: block;
  background-color: rgba(0,0,0,0.5);
  display: center;
  border-color: black;
  display: block; 
  color: white;
  z-index: 9999;
  position: relative;
}
#menuToggle {
	display: block;
	position: fixed;
	width: 100%;
	top: 0;
	left: 0;
	z-index: 1;
	-webkit-user-select: none;
	user-select: none;
}
#menuToggle input{
	display: block;
	width: 50px;
	height: 50px;
	position: absolute;
	top: 0px;
	right: 0px;
	cursor: pointer;
	opacity: 0; /* hide this with 0 */
	z-index: 2; /* and place it over the hamburger */ 
	-webkit-touch-callout: none;
}
#menuToggle svg {
	display: block;
	position: absolute;
	right: 0;
	top: 0px;
	width: 60px;
	height: 60px;
	margin-bottom: 5px;
	z-index: 1;
	background: black;
}
#menu {
	position: absolute;
	width: 100%;
	margin-top: -800px;
	padding-top: 100px;
	background: black;
	list-style-type: none;
	transform-origin: 0% 0%;
	transition: margin-top 0.5s cubic-bezier(0.77,0.2,0.05,1.0);
}
#menu li {
	padding: 18px 0;
	font-size: 32px;
	text-align: center;
	border-bottom: 1px solid white;
	font-family: Century Gothic, sans-serif;
}
#menu li:hover {
	background: gray;
}
#menuToggle input:checked ~ ul {
	margin-top: -100px;
}
input {
	border: none;
}
#menu a{
color: white;

} 
nav a{
  display: block;
  font-size: 32px;
  display: block;
  text-align: center;
  display: inline-block;
  color: white;
  width: 100%;
  text-decoration: none;
  
}
body{
	background-size: cover;
	margin: 0;
	min-height: 100vh;
	background: center;
	width: 100%;
	grid-template-columns: 50px 1fr 50px;
	background-image: url("https://i.redd.it/evbu6mqrcpf21.jpg");
	background-color: rgba(0,0,0,0.5);
	background-size: contain;
	background-position: center;
}
@media only screen and (max-width: 900px){
p{padding:10px;
font-size:0.9em;
padding-top: 10px;
padding-bottom: 15px;
}
img{width:95%;}
	
}
img {
	display:block;
	margin:0 auto;
	width:95%;
	height: auto;
	}
p{
font-family: Century Gothic, sans-serif;
font-size: 25px;
color: white;
margin: auto;
padding-left: 15px;
padding-right: 15px;

}
#section {
	padding: 15px;
}
#wrapper {
width: 100%;
max-width: 960px;
margin: 0 auto;
padding: 15px;
column-count: 2;
color: white;
display: block; 
}
#Early{
display: block;
  padding: 15px;
  width: 100%;
  margin: 0 auto;
  font-size: 55px;
  font-family: Century Gothic, sans-serif;
  text-align: left;
  color: white;
  font-weight: bold;
}
#container{
padding-bottom: 500px;
width: 100%;
margin: 0 auto;
max-width: 1200px;
min-height: 100vh;
background-color: rgba(0,0,0,0.5);
border-color: black;
display: block; center;
display: center;
font-family: Century Gothic; sans-serif;
font-size: 25px;
color: white;
padding: 15px 25px;
padding-left: 15px;
}

.albumname{
   display: inline-block; 
   width: 50%;
   padding: 10px;
}

.year{
   display: inline-block;
    width: 50%;
   padding: 10px;
}
#career{
	padding: 15px;
	font-family: Century Gothic, sans-serif;
	font-size: 55px;
	font-weight: bold;
	text-align: left;
	width: 100%;
	display: block;
	margin: 0 auto;

}
#discography{
	padding: 15px;
	font-family: Century Gothic, sans-serif;
	font-size: 55px;
	font-weight: bold;
	text-align: left;
	width: 100%;
	display: block;
	margin: 0 auto;
	padding-bottom: 40px;
}