@import url('https://fonts.googleapis.com/css2?family=Space+Mono:ital,wght@0,400;0,700;1,400;1,700&display=swap');


html {
	font-size: 16px;
	font-style: normal;
}

body {
	background-color: #111;
	color: #b8b5b5;
	font-family: "Space Mono", monospace;
	font-weight: 700;
}

a {
	color: #3267a0;
	text-decoration: none;
}

a:hover {
	text-decoration: underline;
}

h1, h2, h3, h4, h5, h6 {
	font-weight: 900;
}

h1 { font-size: 3rem; }

h2 { font-size: 1.95rem; }

h3 { font-size: 1.65rem; }

h4 { font-size: 1.50rem; }

h5 { font-size: 1.25rem; }

h6 { font-size: 1rem; }

input, select {
	box-sizing: border-box;
	width: 22em;
}

input, select, textarea {
	font-family: inherit;
	font-size: inherit;
}

input {
	height: 2.5em ;
}

input[type="submit"] {
	background-color: #3267a0;
	border: 0;
	border-radius: 9px;
	color: #fff;
	font-weight: bold;
	width: 12em;
}

label {
	display: block;
}

label:after {
	content: ": ";
}

p {
	font-size: 1.1em;
	font-weight: 700;
}

textarea {
	resize: none;
	width: 40em;
}

input:invalid, textarea:invalid {
	border: 2px solid #ff0000;
}

input:invalid:focus, textarea:invalid:focus {
	background-image: linear-gradient(pink, #ff0000);
}

.tagline {
	height: 3.2em;
}

.goals {
	height: 12em;
}

.container {
	margin: auto;
	width: 50vw;
}

.error {
	background-color: #ff9999;
	border: 3px solid #ff0000;
	border-radius: 13px;
	color: #fff;
	width: 48vw;
}
