added css

style.css

@@ -0,0 +1,130 @@
+/* Boilerplate */
+* {
+  box-sizing: border-box;
+}
+
+@media (prefers-reduced-motion: no-preference) {
+  html {
+    scroll-behavior: smooth;
+  }
+}
+
+/* CSS */
+@font-face {
+  font-family: 'Fira Sans';
+  src: url('fonts/FiraSans-Regular.woff2');
+}
+
+html {
+  background: #0f0c29; /* fallback for old browsers */
+  background: linear-gradient(to right, #0f0c29, #302b63, #24243e);
+}
+
+body {
+  color: #eee;
+  font-family: 'Fira Sans', 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif;
+  text-align: center;
+  margin: 0 auto;
+}
+
+a {
+  color: #eee;
+}
+
+header {
+  background: #00000088;
+  backdrop-filter: blur(12px);
+  margin: 0;
+  padding: .5rem;
+  text-align: left;
+}
+
+div {
+  margin: 0 auto;
+}
+
+form {
+  margin: 1rem auto;
+}
+
+.left_container {
+  width: 12rem;
+}
+
+.left_container img {
+  border-radius: 1rem;
+}
+
+.right_container {
+  padding: 1rem;
+  width: 80%;
+}
+
+@media screen and (min-width: 900px) {
+  .left_container {
+    float: left;
+  }
+
+  .right_container {
+    float: right;
+    width: calc(60vw - 15rem);
+  }
+}
+
+.auto-fit {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
+}
+
+.auto-fit div img {
+  border-radius: 1rem;
+}
+
+.popup {
+  display: none;
+  position: fixed;
+  z-index: 1;
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 100%;
+  overflow: auto;
+  background-color: rgba(0, 0, 0, 0.5);
+}
+
+.popup-content {
+  background-color: #24243e;
+  margin: 10% auto;
+  padding: 20px;
+  border: thin solid #888;
+  border-radius: 1rem;
+  width: 80%;
+  max-width: 60vw;
+  overflow: hidden;
+}
+
+.close {
+  color: #888;
+  float: right;
+  font-size: 28px;
+  font-weight: bold;
+  cursor: pointer;
+}
+
+.close:hover,
+.close:focus {
+  color: #eee;
+  text-decoration: none;
+  cursor: pointer;
+}
+
+input[type=text],
+input[type=password],
+input[type=submit],
+input[type=number] {
+  background: rgba(0, 0, 0, 0.5);
+  border: thin solid #888;
+  padding: .5rem;
+  color: #eee;
+  border-radius: 1rem;
+}