Some more improvements I guess

src/about.html

@@ -48,18 +48,20 @@
         rel="noopener noreferrer"
         target="_blank"
         href="https://github.com/Ebsku"
-        >https://github.com/Ebsku</a
+        >github.com/Ebsku</a
       >) and Jorvents (<a
         class="link"
         rel="noopener noreferrer"
         target="_blank"
         href="https://github.com/Jorvents"
-        >https://github.com/Jorvents</a
+        >github.com/Jorvents</a
       >). Together we make projects like the E-Cafe Minecraft server.<br />
       <br />
 
       We started Elatteria because we wanted to have a name for our group. Our
-      goal is to make entartaining projects for everyone.
+      goal is to make entartaining projects for everyone. We didnt have
+      Elatteria at first. We wanted to make a Minecraft server but then we got a
+      idea of making a group so we can make more projects together as a team.
 
       <div class="spacer" />
 
@@ -68,13 +70,38 @@
         <figure class="features">
           <img src="Images/Profiles/Ebsku.jpg" alt="Profile picture of Ebsku" />
           <figcaption>Ebsku</figcaption>
+          <figcaption>
+            <a
+              class="link"
+              rel="noopener noreferrer"
+              target="_blank"
+              href="https://github.com/Ebsku"
+              >GitHub</a
+            ><br />
+            <a
+              class="link"
+              rel="noopener noreferrer"
+              target="_blank"
+              href="https://mastodon.social/@Ebsku"
+              >Mastodon</a
+            >
+          </figcaption>
         </figure>
         <figure class="features">
           <img
             src="Images/Profiles/Jorvents.jpg"
-            alt="Profile picture of Ebsku"
+            alt="Profile picture of Jorvents"
           />
           <figcaption>Jorvents</figcaption>
+          <figcaption>
+            <a
+              class="link"
+              rel="noopener noreferrer"
+              target="_blank"
+              href="https://github.com/Jorvents"
+              >GitHub</a
+            >
+          </figcaption>
         </figure>
       </div>
     </section>

src/ecafe/index.html

@@ -12,19 +12,28 @@
           <li><a href="/projects">Projects</a></li>
           <li><a href="/links">Links</a></li>
           <li><a href="/about">About</a></li>
+          <div class="right">
+            <li>
+              <button><a href="/ecafe/playnow">Play now!</a></button>
+            </li>
+          </div>
         </ul>
         <ul class="mobile">
           <li class="logo"><a href="/">Home</a></li>
           <li><a href="/projects">Projects</a></li>
           <li><a href="/links">Links</a></li>
           <li><a href="/about">About</a></li>
+          <div class="right">
+            <li>
+              <button><a href="/ecafe/playnow">Play now!</a></button>
+            </li>
+          </div>
         </ul>
       </nav>
     </header>
     <h1 class="title underline">E-Cafe</h1>
     <div class="description">
       E-Cafe is our Minecraft server featuring multiple gamemodes. <br />
-      <button><a href="/ecafe/playnow">Play now!</a></button>
     </div>
   </body>
 </html>

src/styles.css

@@ -36,6 +36,10 @@ html {
     position: relative;
 }
 
+.section {
+    background-color: #4fa57a;
+}
+
 body {
     background-image: url("Images/backround.png");
     background-repeat: no-repeat;
@@ -84,6 +88,27 @@ li {
     float: left;
 }
 
+li button {
+    text-align: center;
+    background-color: #fee8cb;
+    right: 0px;
+    margin-left: 100px;
+    margin-right: 150px;
+    margin-top: 30px;
+    margin-bottom: 5px;
+    padding: 0px;
+    font-size: 10px;
+    width: 70px;
+}
+
+li button:hover {
+    padding: 0;
+}
+
+.right {
+    float: right;
+}
+
 .active {
     font-weight: 700;
 }
@@ -179,6 +204,10 @@ img {
     bottom: 50%;
 }
 
+.mobile li button {
+    margin: auto;
+}
+
 @media screen and (max-width: 1100px) {
     .features {
         display: inline-grid;