 body {
 	/*margin-top: 100px;*/
 	font-size: 20px;
 	margin: auto;
 	display: flex;
 	flex-direction: column;
 	height: 90vh;
 	width: 90vw;
 	justify-content: flex-start;
 	align-items: center;
 	background-color: whitesmoke;
 }

 .back {
 	font-family: 'Abel';
 	letter-spacing: 2px;
 	margin: 20px 0px;
 	width: 100%;
 	float: left;
 }

 .back:hover {
 	color: lightskyblue;
 }

 div.mask-info {
 	margin: 50px 0px;
 	padding: 2px;
 	float: left;
 	background-color: white;
 	box-shadow: 0px 0px 50px lightgrey;
 }

 #mask-description {
 	line-height: 1.4
 }

 img.mask-img {
 	width: 100%;
 	/*margin: 10px 0px;*/
 }

 h1 {
 	margin-top: 0px;
 	margin-bottom: 0px;
 	line-height: .9;
 }



 .credit>a>img,
 .credit>img {
 	width: 20px;
 	padding: 2px 0px;
 	/*vertical-align: middle;*/
 }

 .button {
 	font-size: 18px;
 	letter-spacing: 2px;
 	font-family: 'Abel';
 	background-color: white;
 	color: black;
 	padding: 4px 10px;
 	border-radius: 3px;
 	vertical-align: bottom;
 	white-space: nowrap;
 	/*line-height: 2;*/
 	-webkit-transition-duration: 0.5s;
 	/* Safari */
 	transition-duration: 0.5s;
 }

 .button:hover {
 	color: black;
 }

 .button.play {
 	background-color: lightgrey;
 	font-size: 150%;
 	letter-spacing: 7px;
 }

 .button.play:hover {
 	background-color: skyblue;
 }

 .button.download {
 	font-size: smaller;
 	background-color: rgb(234, 234, 234);
 	text-decoration: underline;
 }

 .button.download:hover {
 	background-color: skyblue;
 }
 
 .photo > img {
  object-fit: cover;
  width: 100%;
  max-height: 100%;
}
 a {
 	color: coral;
 	-webkit-transition-duration: 0.5s;
 	/* Safari */
 	transition-duration: 0.5s;
 }

 a:hover {
 	color: lightskyblue;
 }

 /* Mobile Layout */
 @media only screen and (max-width: 768px) {
 	body {
 		width: 90vw;
 	}

 	div.mask-info {
 		margin-top: 3vw;
 	}

 	img.mask-img {
 		width: 100%;
 		height: unset;
 	}
 }