/* Explanation in JS tab */

/* Cool font from Google Fonts! */
@import url('https://fonts.googleapis.com/css?family=Raleway:900&display=swap');

body {
	margin: 0px;
}

#container {
	/* Center the text in the viewport. */
	position: relative;
	margin: auto;
	padding-top: 10px;
/*	width: 100vw;
	height: 80pt;
	top: 0;
	bottom: 0;
*/	
	display: flex;
	justify-content: center;
	/* This filter is a lot of the magic, try commenting it out to see how the morphing works! */
	filter: url(#threshold) blur(0.6px);
}

/* Your average text styling */
#text1, #text2 {
	position: absolute;
	width: 100%;
	display: inline-block;
	font-family: 'Raleway', sans-serif;
	font-size: 2.8rem;
	color: white;
	text-align: center;
	letter-spacing: 1.7px;
	user-select: none;
}

@media screen and (max-width: 768px){
  #text1, #text2 {
	font-size: 1.8rem;
	opacity: 0.5;
	}
}