h1 {
	font-family: "Lucida Sans Unicode", "Lucida Grande", "Tahoma", "Verdana", sans-serif;
	font-weight: bold;
	font-size: 100px;
	color: darkslategray;
	line-height: 115px;
	position: fixed;
	top: -50px;
	left: 0px;
}

.one {
	font-family: lucinda console, monospace;
	color: darkslategray;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	display: flex;
	flex-direction: column;
}

img {
	height: 600px;
	width: 600px;
	position: fixed;
	top: 150px;
	left: 200px;
	z-index: -1;
}

.two {
	background-color: #ABFFE1;
	height: 700px;
	width: 500px;
	position: fixed;
	right: 50px;
	top: 70px;
	box-sizing: border-box;
	animation-name: fadein, movein;
	animation-duration: 1s;
}


@keyframes fadein {
	from {opacity: 0;}
	to   {opacity: 1;}
}

@keyframes movein {
	from {right: 200px;}
	to   {right: 50px;}
}

a {
	color: darkslategray;
}

a:hover {
	color: whitesmoke;
}

@media screen and (max-width: 1350px) {
	img {
		left: 100px;
	}
}

@media screen and (max-width: 1250px) {
	img {
		left: 50px;
	}
}

@media screen and (max-width: 1150px) {
	body {
		display: flex !important;
		flex-direction: column !important;
		margin: 0 !important;
		padding: 0 !important;
	}

	h1 {
		position: static !important;
		left: 10px !important;
		width: 100% !important;
		margin: 0 0 20px 0 !important;
		padding: 0 10px !important;
		text-align: left !important;
		font-size: clamp(48px, 10vw, 120px) !important;
		line-height: 1.1 !important;
		overflow-wrap: break-word !important;
	}

	img {
		position: static !important;
		top: auto !important;
		left: auto !important;
		z-index: -1 !important;
		height: auto !important;
		width: 2000px !important;
		max-width: 600px !important;
		display: block !important;
		margin: 0 auto 20px auto !important;
	}

	.one {
		position: static !important;
		right: auto !important;
		top: auto !important;
		width: 100% !important;
		margin: 0 !important;
		padding: 20px !important;
	}

	.two {
		position: static !important;
		right: auto !important;
		top: auto !important;
		width: min(95vw, 600px) !important;
		min-width: min(90vw, 600px) !important;
		height: auto !important;
		margin: 0 auto !important;
		flex-shrink: 0 !important;
		animation: none !important;
	}
}

@media screen and (max-width: 800px) {
	.two,
	.two * {
		font-size: 24px !important;
	}

	.two {
		width: min(95vw, 600px) !important;
		min-width: min(90vw, 600px) !important;
		margin: 0 auto !important;
		flex-shrink: 0 !important;
	}
}

@media screen and (max-width: 550px) {
	.two {
		width: min(95vw, 600px) !important;
		min-width: min(90vw, 600px) !important;
		margin: 0 auto !important;
		flex-shrink: 0 !important;
	}
}

@media screen and (max-width: 400px) {
	.two {
		width: 520px !important;
		min-width: 520px !important;
		margin: 0 auto !important;
		flex-shrink: 0 !important;
	}
}