eu · Atlas7005 · Dec 17, 2020 · Dec 29, 2020 · Dec 29, 2020
diff --git a/badge.png b/badge.png
diff --git a/example.png b/example.png
diff --git a/index.html b/index.html
@@ -1,9 +1,35 @@
 <!DOCTYPE html>
 <html>
-  <head>
-    <title>eu.github.io</title>
-   </head>
-   <body>
-    <h1>eu.github.io</h1>
-    <p>Site coming soon.</p>
-</html>
+	<head>
+		<title>eu.github.io</title>
+		<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@exampledev/new.css@1/new.min.css">
+		<link rel="stylesheet" href="https://fonts.xz.style/serve/inter.css">
+		<link rel=stylesheet href="style.css">
+	</head>
+	<body>
+		<h1><span class="eu">EU</span> <span class="eubadge">Badge</span><img src="badge.png" alt="Badge Logo." class="badge" height="25" width="25"></h1>
+		<p>Would you like an EU Badge on your GitHub Profile?</p>
+		<img src="example.png" alt="Example-Profile" title="Example Profile" >
+		<h1>Getting the badge</h1>
+		<p>The "badge" is nothing more than a label that you're a part of the <code>eu</code> team. To join the team:</p>
+		<ol>
+		    <li><a href="https://github.com/eu/join/edit/master/list.txt">Fork <code>list.txt</code></a> and add your username to the bottom of this file.</li>
+		    <li>Propose the file changes.</li>
+		</ol>
+		I'll merge it and add you as soon as possible.
+		<h1>Enabling the badge</h1>
+		<p>To enable the badge, do the following:</p>
+		<ol>
+		    <li>Click the link in the Email you'll receive from GitHub asking if you wanna join the organization.</li>
+		    <li>Go to the <a href="https://github.com/eu/">eu organization</a>.</li>
+		    <li>Click "People".</li>
+		    <li>Search for your name in the list.</li>
+		    <li>Click the "Private" lock next to your name.</li>
+		    <li>Select "Public" from the dropdown.</li>
+		</ol>
+		<p>That's it! You'll now have the badge displayed on your GitHub Profile.</p>
+		<hr>
+		<p>Any questions? Just <a href="https://github.com/eu/join/issues/new">open an issue</a>.</p>
+		<blockquote>This organization has no relation with the European Union. This is just done by some guy who happens to have the username. (>_<)</blockquote>
+	</body>
+</html>
diff --git a/style.css b/style.css
@@ -0,0 +1,60 @@
+* {
+	box-sizing: border-box;
+	padding: 0;
+	margin: 0;
+}
+
+@media (prefers-color-scheme: dark) {
+	:root {
+		--nc-tx-1: #ffffff !important;
+		--nc-tx-2: #eeeeee !important;
+		--nc-bg-1: #0D1117 !important;
+		--nc-bg-2: #222222 !important;
+		--nc-bg-3: #333333 !important;
+		--nc-lk-1: #3291FF !important;
+		--nc-lk-2: #3291FF !important;
+		--nc-lk-tx: #FFFFFF !important;
+		--nc-ac-1: #7928CA !important;
+		--nc-ac-tx: #FFFFFF !important;
+	}
+}
+
+img:not(.badge) {
+	width: 345px;
+}
+
+img.badge {
+	margin-left: .6rem;
+	margin-bottom: 0;
+}
+
+@media only screen and (max-width: 768px) {
+	img:not(.badge) {
+		width: 50%;
+	}
+}
+
+::selection {
+	background-color: #003399 !important;
+}
+
+a {
+	text-decoration-line: none;
+}
+
+a:hover {
+	text-decoration-line: underline;
+}
+
+blockquote {
+	background-color: #05070A !important;
+	border-left: 5px solid #68560C;
+	color: #9A9A9A;
+}
+
+.eu {
+	color: #003399;
+}
+.eubadge {
+	color: #FFCC00;
+}