html {
	height: 100vh;
	width: 100vw;
/* 	background-image: url("evillovemule.svg"); */
	background-color: #010001;
}

body {
	margin: 0px;
	height: 100vh;
	width: 100vw;
	display: flex;
	flex-flow: row nowrap;
	justify-content: center;
	align-items: center;
	gap: 0px;
}

#art {
	flex: 0 1 600px;
	height: 600px;
	width: 80%;
	background-image: url('images/MobiusTrip.jpg');
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center center;
	display: flex;
	justify-content: center;
	align-items: center;
}

#art img {
	max-width: 100%;
	max-height: 100%;
}

#player {
	flex: 0 0 600px;
	display: flex;
	flex-flow: column nowrap;
	justify-content: center;
	align-items: center;
	min-height: 480px;
	
}

#player > iframe {
 border: 0;
 width: 100%;
 max-width: 500px;
 height: 439px;
 min-height: 439px;
}


#player #stream {
	display: flex;
}

#player #stream img {
		height: 80px;
		margin: 20px;
}


@media screen and (orientation: portrait) {
	html {
		height: auto;
	}
	
	body {
		height: auto;
		flex-flow: column nowrap;
	}
	
	#art {
		flex: 1 0 85vw;
		background-position: center 8vw;
		margin: -4vw 0 -4vw 0;
		height: auto;

	}

	#player {
/* 		flex: 0 1 600px; */
	
	width: auto;

	}
	
}

@media screen and (max-height: 480px) {
	html {
	}
}