/* Center horizontally and vertically */
.main {
	position: relative;
	margin: 0 auto;
	margin-top: 2rem;
	max-width: 80em;

.header {font-family: "IBM Plex Mono", monospace; font-size: 5rem; border: solid; padding: 2.5rem;}

.line2 {font-size: 2rem;}
.line2 > span {padding-right:0.1em; padding-left:0.1em; margin-right: 0.5em; display: inline-block}

/* Link format */

a, a:link {text-decoration: underline; color: black;}

a:hover, a:focus {position: relative; bottom: 0.05em;  border: none; border-width: 0.01em; border-radius: 1px}

.grey {color: darkgrey}

/* link hover effects */
/*#link-1:hover {background-color: magenta;} */
#link1:hover {background-color: yellow;}
#link2:hover {background-color: cyan;}
#link3:hover {background-color: magenta;}

/* on name hover slow color invert */
/* maybe only on about page */
/*.main:hover {background-color: black;}
.main:hover span {color: white;}
.main:hover #link-1 {background-color: magenta;}
.main:hover #link1 {background-color: yellow;}
.main:hover #link2 {background-color: cyan;}
*/

.content {font-size: 1.2rem; padding-left: 2.5rem; padding-right: 2.5rem; margin-top: 2rem; border:solid; font-family: "IBM Plex Mono", monospace;}

/* split into about and main */