:root {
	--bg-color: black;
	--color: white;
	--body-max-width: 640px;
	--nav-margin-v-top: 6rem;
	--nav-margin-v-bottom: 4rem;
	--nav-name-color: var(--color);
	--nav-name-max-width: 40%;
	--nav-name-font-size: 1rem;
	--nav-name-font-weight: 100;
	--nav-links-gap: 2rem;
	--nav-link-icon-size: 1.2rem;
	--projects-container-gap: var(--nav-links-gap);
	--projects-gap: var(--nav-margin-v-bottom);
	--projects-side-label-size: 1rem;
	--project-side-label-weight: 100;
	--project-grid-gap: 1rem;
	--project-letter-spacing: 0.1em;
	--project-line-height: 1rem;
	--project-title-font-weight: 300;
	--project-title-letter-spacing: 0.3rem;
	--project-desc-font-size: 1rem;
	--project-desc-font-weight: 100;
	--project-desc-line-height: 1.4;
	--project-desc-letter-spacing: 0.05rem;
	--link-color-default: gray;
	--link-color-hover: orange;
	--link-color-active: var(--color);
	--tag-font-size: calc(var(--project-desc-font-size) * 0.8);
	--tag-font-weight: bold;
	--footer-margin: var(--nav-margin-v-top);
	--footer-icon-size: 1.6rem;
}
* {
	margin: 0;
}
body {
	background-color: var(--bg-color);
	color: var(--color);
	font-family: -apple-system, BlinkMacSystemFont, Trebuchet MS, sans-serif;
	text-decoration: none;
	margin: auto;
	max-width: var(--body-max-width);
}
#top {
	position: absolute;
	top: 0;
}
.nav {
	margin: var(--nav-margin-v-top) 0 var(--nav-margin-v-bottom) 0;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
	color: var(--nav-name-color);
}
.nav-name {
	max-width: var(--nav-name-max-width);
	height: var(--nav-name-font-size);
	font-size: var(--nav-name-font-size);
	font-weight: var(--nav-name-font-weight);
	line-height: var(--nav-name-font-size);
}
.nav-contact-links {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: flex-end;
	gap: var(--nav-links-gap);
	text-align: center;
}
.contact-link {
	height: var(--nav-link-icon-size);
	display: flex;
	flex-direction: column;
	align-items: center;
}
.projects-container {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	gap: var(--projects-container-gap);
}
.projects {
	display: flex;
	flex-direction: column;
	gap: var(--projects-gap);
	width: 100%;
}
.projects-side-label {
	font-size: var(--projects-side-label-size);
	line-height: var(--projects-side-label-size);
	font-weight: var(--project-side-label-weight);
	letter-spacing: var(--project-letter-spacing);
	color: var(--link-color-default);
}
.project {
	display: grid;
	grid-template-columns: auto auto;
	line-height: var(--project-line-height);
}
.project-title {
	font-size: var(--projects-side-label-size);
	font-weight: var(--project-title-font-weight);
	letter-spacing: var(--project-title-letter-spacing);
	text-transform: uppercase;
}
.project-desc {
	font-size: var(--project-desc-font-size);
	font-weight: var(--project-desc-font-weight);
	line-height: var(--project-desc-line-height);
	letter-spacing: var(--project-desc-letter-spacing);
}
.project-stats {
	width: fit-content;
	border: solid 1px;
	border-radius: 10px;
	padding: 0.3rem 0.8rem;
	font-family: Courier New, monospace;
	font-size: 0.9rem;
	line-height: 1.2rem;
}
.letters-golden {
	color: var(--link-color-hover);
	font-weight: 800;
}
.tag {
	font-family: Courier New, monospace;
	font-size: var(--tag-font-size);
	font-weight: var(--tag-font-weight);
	color: var(--bg-color);
	background-color: var(--color);
	text-transform: uppercase;
	border-radius: 5px;
	padding: 0.1rem 0.3rem 0.05rem 0.3rem;
	width: fit-content;
	margin: 0 0.5rem 0 0;
}
.tag-published {
	background-color: var(--link-color-hover);
}
.project-body, .project-links {
	display: grid;
	grid-auto-flow: row;
	grid-row-gap: var(--project-grid-gap);
	align-content: start;
}
.project-links {
	text-align: right;
}
.footer {
	margin: var(--footer-margin) auto;
	text-align: center;
	position: relative;
}
.stretched-text {
	width: 100%;
	display: flex;
	flex-flow: row nowrap;
	justify-content: space-between;
	align-items: center;
}
ul {
	padding: 0 1.6rem;
	list-style-type: circle;
	font-weight: var(--project-desc-font-weight);
	line-height: var(--project-desc-line-height);
	letter-spacing: var(--project-desc-letter-spacing);
}
p {
	margin: 0;
	padding: 0;
}
a {
	text-decoration: none;
}
a:link, a:visited {
	color: var(--link-color-default);
}
a:hover {
	color: var(--link-color-hover);
}
a:active {
	color: var(--link-color-active);
}
.invisible-link:link, .invisible-link:visited {
	color: var(--link-color-active);
}
.invisible-link:hover {
	color: var(--link-color-hover);
}



@media only screen and (max-width: 700px) {
	body {
		padding: 0 1rem;
	}
	.nav {
		margin: var(--nav-margin-v-bottom) 0;
	}
	.projects-container {
		gap: 1rem;
	}
}
@media (pointer: coarse) {
	a:link, a:visited, a:hover, a:active {
		color: var(--link-color-default)
	}
	a.invisible-link:link, a.invisible-link:visited {
		color: var(--link-color-active);
	}
}
@media (pointer: coarse) and (max-width: 700px), (max-width: 500px) {
	.projects-container {
		flex-direction: column;
	}
	.nav {
		display: flex;
		flex-direction: column;
		width: 100%;
		gap: 2rem;
		align-items: center;
	}
	.nav-name {
		max-width: 70%;
		font-weight: 200;
	}
}

.oui--email, .email {
	display: inline-block;
	width: var(--nav-link-icon-size);
	height: var(--nav-link-icon-size);
	--svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='%23000' fill-rule='evenodd' d='M14.95 3.684L8.637 8.912a1 1 0 0 1-1.276 0l-6.31-5.228A.999.999 0 0 0 1 4v8a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V4a.999.999 0 0 0-.05-.316M2 2h12a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2m-.21 1l5.576 4.603a1 1 0 0 0 1.27.003L14.268 3z'/%3E%3C/svg%3E");
	background-color: currentColor;
	-webkit-mask-image: var(--svg);
	mask-image: var(--svg);
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-size: 100% 100%;
	mask-size: 100% 100%;
}
.simple-icons--github, .github {
	display: inline-block;
	width: var(--nav-link-icon-size);
	height: var(--nav-link-icon-size);
	--svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M12 .297c-6.63 0-12 5.373-12 12c0 5.303 3.438 9.8 8.205 11.385c.6.113.82-.258.82-.577c0-.285-.01-1.04-.015-2.04c-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729c1.205.084 1.838 1.236 1.838 1.236c1.07 1.835 2.809 1.305 3.495.998c.108-.776.417-1.305.76-1.605c-2.665-.3-5.466-1.332-5.466-5.93c0-1.31.465-2.38 1.235-3.22c-.135-.303-.54-1.523.105-3.176c0 0 1.005-.322 3.3 1.23c.96-.267 1.98-.399 3-.405c1.02.006 2.04.138 3 .405c2.28-1.552 3.285-1.23 3.285-1.23c.645 1.653.24 2.873.12 3.176c.765.84 1.23 1.91 1.23 3.22c0 4.61-2.805 5.625-5.475 5.92c.42.36.81 1.096.81 2.22c0 1.606-.015 2.896-.015 3.286c0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12'/%3E%3C/svg%3E");
	background-color: currentColor;
	-webkit-mask-image: var(--svg);
	mask-image: var(--svg);
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-size: 100% 100%;
	mask-size: 100% 100%;
}
.simple-icons--linkedin, .linkedin {
	display: inline-block;
	width: var(--nav-link-icon-size);
	height: var(--nav-link-icon-size);
	--svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037c-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85c3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433a2.062 2.062 0 0 1-2.063-2.065a2.064 2.064 0 1 1 2.063 2.065m1.782 13.019H3.555V9h3.564zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0z'/%3E%3C/svg%3E");
	background-color: currentColor;
	-webkit-mask-image: var(--svg);
	mask-image: var(--svg);
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-size: 100% 100%;
	mask-size: 100% 100%;
}
.iconoir--www, .www {
	display: inline-block;
	width: var(--nav-link-icon-size);
	height: var(--nav-link-icon-size);
	--svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5'%3E%3Cpath d='M3.338 17A9.996 9.996 0 0 0 12 22a9.996 9.996 0 0 0 8.662-5M3.338 7A9.996 9.996 0 0 1 12 2a9.996 9.996 0 0 1 8.662 5'/%3E%3Cpath d='M13 21.95s1.408-1.853 2.295-4.95M13 2.05S14.408 3.902 15.295 7M11 21.95S9.592 20.098 8.705 17M11 2.05S9.592 3.902 8.705 7M9 10l1.5 5l1.5-5l1.5 5l1.5-5M1 10l1.5 5L4 10l1.5 5L7 10m10 0l1.5 5l1.5-5l1.5 5l1.5-5'/%3E%3C/g%3E%3C/svg%3E");
	background-color: currentColor;
	-webkit-mask-image: var(--svg);
	mask-image: var(--svg);
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-size: 100% 100%;
	mask-size: 100% 100%;
}
.ph--file-code-light, .source {
	display: inline-block;
	width: var(--nav-link-icon-size);
	height: var(--nav-link-icon-size);
	--svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1.5rem' height='1.5rem' viewBox='42 26 172.00003051757812 204'%3E%3Cpath fill='white' d='M180.24 147.76a6 6 0 0 1 0 8.48l-24 24a6 6 0 0 1-8.48-8.48L167.51 152l-19.75-19.76a6 6 0 1 1 8.48-8.48Zm-72-24a6 6 0 0 0-8.48 0l-24 24a6 6 0 0 0 0 8.48l24 24a6 6 0 1 0 8.48-8.48L88.49 152l19.75-19.76a6 6 0 0 0 0-8.48M214 88v128a14 14 0 0 1-14 14H56a14 14 0 0 1-14-14V40a14 14 0 0 1 14-14h96a6 6 0 0 1 4.25 1.76l56 56A6 6 0 0 1 214 88m-56-6h35.52L158 46.48Zm44 134V94h-50a6 6 0 0 1-6-6V38H56a2 2 0 0 0-2 2v176a2 2 0 0 0 2 2h144a2 2 0 0 0 2-2'/%3E%3C/svg%3E");
	background-color: currentColor;
	-webkit-mask-image: var(--svg);
	mask-image: var(--svg);
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-size: 100% 100%;
	mask-size: 100% 100%;
}
.solar--programming-outline, .programming, .top {
	display: inline-block;
	width: var(--footer-icon-size);
	height: var(--footer-icon-size);
	--svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M17.75 15a.75.75 0 0 1-.75.75h-5a.75.75 0 0 1 0-1.5h5a.75.75 0 0 1 .75.75M7.48 9.424a.75.75 0 1 0-.96 1.152l.234.195c.659.55 1.09.91 1.366 1.216c.262.29.287.427.287.513c0 .086-.025.222-.287.513c-.277.306-.707.667-1.366 1.216l-.234.195a.75.75 0 0 0 .96 1.152l.277-.23c.605-.504 1.12-.933 1.476-1.328c.378-.42.674-.901.674-1.518s-.296-1.099-.674-1.518c-.356-.395-.871-.824-1.476-1.328z'/%3E%3Cpath fill='%23000' fill-rule='evenodd' d='M11.943 1.25h.114c2.309 0 4.118 0 5.53.19c1.444.194 2.584.6 3.479 1.494c.895.895 1.3 2.035 1.494 3.48c.19 1.411.19 3.22.19 5.529v.114c0 2.309 0 4.118-.19 5.53c-.194 1.444-.6 2.584-1.494 3.479c-.895.895-2.035 1.3-3.48 1.494c-1.411.19-3.22.19-5.529.19h-.114c-2.309 0-4.118 0-5.53-.19c-1.444-.194-2.584-.6-3.479-1.494c-.895-.895-1.3-2.035-1.494-3.48c-.19-1.411-.19-3.22-.19-5.529v-.114c0-2.309 0-4.118.19-5.53c.194-1.444.6-2.584 1.494-3.479c.895-.895 2.035-1.3 3.48-1.494c1.411-.19 3.22-.19 5.529-.19m-5.33 1.676c-1.278.172-2.049.5-2.618 1.069c-.57.57-.897 1.34-1.069 2.619c-.174 1.3-.176 3.008-.176 5.386s.002 4.086.176 5.386c.172 1.279.5 2.05 1.069 2.62c.57.569 1.34.896 2.619 1.068c1.3.174 3.008.176 5.386.176s4.086-.002 5.386-.176c1.279-.172 2.05-.5 2.62-1.069c.569-.57.896-1.34 1.068-2.619c.174-1.3.176-3.008.176-5.386s-.002-4.086-.176-5.386c-.172-1.279-.5-2.05-1.069-2.62c-.57-.569-1.34-.896-2.619-1.068c-1.3-.174-3.008-.176-5.386-.176s-4.086.002-5.386.176' clip-rule='evenodd'/%3E%3C/svg%3E");
	background-color: currentColor;
	-webkit-mask-image: var(--svg);
	mask-image: var(--svg);
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-size: 100% 100%;
	mask-size: 100% 100%;
}