--- /dev/null
+<!DOCTYPE html>
+<html>
+<head>
+<title>Welcome to nginx!</title>
+<link rel="stylesheet" type="text/css" href="styles.css?v=1.14">
+</head>
+<body>
+<main class="vcard-parent">
+ <h1 class="vcard-header">Misomosispi's Home Page!</h1>
+ <nav>
+ <ul class="vcard-list">
+ <li><a href="https://github.com/tf2spi"><button>
+ <h3>GitHub</h3>
+ <p>My main GitHub where I do all sorts of whacky things</p>
+ </button></a></li>
+ <li><a href="https://gist.github.com/tf2spi"><button>
+ <h3>GitHub Gists</h3>
+ <p>My GitHub gists where I keep cool code snippets</p>
+ </button></a></li>
+ <li><a href="https://tf2spi.github.io/percentn"><button>
+ <h3>Portfolio</h3>
+ <p>Blog and programming accomplishments here</p>
+ </button></a></li>
+ <li><a href="https://misomosispi.neocities.org/"><button>
+ <h3>Neocities</h3>
+ <p>The more fun personal site (in progress...)</p>
+ </button></a></li>
+ <li><a href="https://twitch.tv/misomosispi"><button>
+ <h3>Twitch Channel</h3>
+ <p>Where I do silly streams</p>
+ </button></a></li>
+ <li><a href="https://youtube.com/@misomosi666"><button>
+ <h3>YouTube Channel</h3>
+ <p>Where I put silly VODs or edited videos</p>
+ </button></a></li>
+ </ul>
+ </nav>
+</main>
+</body>
+</html>
--- /dev/null
+html {
+ color-scheme: light dark;
+}
+body {
+ width: 35em;
+ margin: 0 auto;
+ font-family: Tahoma, Verdana, Arial, sans-serif;
+}
+.vcard-parent {
+ align-items: center;
+ height: 100vh;
+}
+.vcard-header {
+ text-align: center;
+}
+.vcard-list {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ list-style: none;
+ gap: 20px;
+}
+.vcard-list > li > a > button {
+ width: 400px;
+ height: 100px;
+ padding: 20px;
+}