body, html {
  overflow-x: hidden;
  overflow-y: auto;
}

::-webkit-scrollbar {
  display: none;
}

body {
	margin: 0;
	background: #1e1e1e
}

a {
	color: #ccc;
	text-decoration: none;
	font-family: Roboto, sans-serif;
	font-weight: 700;
	font-size:2em;
	margin:auto;
}

h {
	color: #fff;
	/*font-weight: 900;*/
	font-size: 2em;
}

a:hover {
	color: #a35629;
}

a:hover h {
	color: #cc6b33;
}

small {
	font-size: 0.5em;
}

#albums {
	padding-top:100px;
	width:100%;
	display: grid;
	/*grid-template-columns: repeat(3, 1fr);*/
}

#albums>a {
	display: grid;
	/*grid-column: span 3;*/
	/*grid-template-columns: subgrid;*/
	/*grid-template-rows: min-content 1fr;*/
	grid-template-columns: 1fr 2em 1fr;
	margin-bottom: .5em;
	line-height: 3em;
}

#albums>a>.date {text-align: right;}

#albums>a>.dash {text-align: center;}

#albums>a>.location {text-align: left;}

@media screen and (max-width: 50em){
	#albums {
		max-width:40em;
		margin: auto;

	}
	#albums>a {
		margin-bottom: 2em;
		grid-template-columns: 1fr;
	}
	#albums>a>.dash {display: none;}
	#albums>a>.date {
		line-height: 1em;
		text-align:center;
	}
	#albums>a>.location {
		text-align: center;
	}
}