@font-face {
	font-family: "Libre Baskerville";
	src: local("Libre Baskerville"),
		url("/fonts/LibreBaskerville-Regular.ttf") format("truetype");
}
@font-face {
	font-family: "Libre Baskerville";
	src: local("Libre Baskerville Bold"),
		url("/fonts/LibreBaskerville-Bold.ttf") format("truetype");
	font-weight: 700;
}
@font-face {
	font-family: "Emoji";
	src: local("Apple Color Emoji"), local("Segoe UI Emoji"),
		local("Noto Color Emoji"), local("Twemoji"), local("TwemojiMozilla"),
		local("Twemoji Mozilla"),
		url("/fonts/TwemojiMozilla.ttf") format("truetype");
}

html,
body {
}
* {
	margin: 0px;
	padding: 0px;
	box-sizing: border-box;
	font-size: 100%;
}

html,
body {
	position: relative;
	background: #140840 linear-gradient(to top, #140840, #0d062d) scroll
		no-repeat;
	color: #ffffff;
	min-height: 100vh;
}
:root {
	font-size: 16px;
	font-family: "Libre Baskerville", serif;
}

main {
	max-width: 32rem;
	margin: 0px auto;
	padding: 2em 1rem 100px;
	position: relative;
	min-height: 100vh;
}
main p {
	line-height: 1.85;
	margin: 1em 0px 2em;
}
main a {
	color: #ffffff;
}
main a:active,
main a:focus,
main a:hover {
	text-decoration: none;
	background-color: #ffffff;
	color: #0d062d;
	transform: scale(1.1);
}
main strong {
	font-weight: 700;
}
.icon {
	display: inline-block;
	max-height: 1em;
	max-width: 1em;
	vertical-align: baseline;
}
.emoji {
	font-family: "Emoji";
}
#signature {
	display: block;
}
#drawing-of-me {
	display: block;
	position: fixed;
	left: 15px;
	bottom: 0px;
	height: auto;
	width: auto;
	max-width: 35vw;
}

@media screen and (max-width: 92em) {
	#drawing-of-me {
		position: absolute;
		left: auto;
		right: 10px;
		height: auto;
		max-height: 50vh;
		width: auto;
		max-width: 50vw;
	}
}

@media screen and (min-height: 30em) and (max-width: 92em) {
	#drawing-of-me {
		max-height: 260px;
	}
}

@media screen and (max-width: 380px) {
	:root {
		font-size: 14px;
	}
}
