/* 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. */
	margin: auto;
	width: 100vw;
	height: 80pt;
	top: 0;
	bottom: 0;
	position: relative; 
	left:0; top:0; width:100%; height:100%;
	/* This filter is a lot of the magic, try commenting it out to see how the morphing works! */
	filter: url(#threshold) blur(0.2px);
}

/* Your average text styling */
#text1, #text2 {
	position: absolute;
	width: 100%;
	display: inline-block;
	color: #1B2D55;
	font-family: 'Raleway', sans-serif;
	font-size: 600%;
	padding-right:  25px;
	text-align: center;
	padding-top : 80px;
    padding-right: 2000px;
	user-select: none;
}