Material Icons

index.css

@@ -52,16 +52,10 @@ body {
     margin: 2rem;
     border: 1px solid transparent;
     height: 15rem;
-    background-color: var(--link-background);
     display: flex;
     flex-direction: column;
     justify-content: center;
 }
-.links-container .link-box img {
-    width: 10rem;
-    height: 10rem;
-    filter: drop-shadow(2px 2px 5px var(--logo-shadow));
-}
 .links-container .link-box a {
     display: flex;
     flex-direction: column;
@@ -70,7 +64,7 @@ body {
     text-decoration: none;
 }
 .links-container .link-box p {
-    font-family: 'Roboto', sans-serif;
+    font-family: 'Balsamiq Sans', cursive;
     text-align: center;
     font-size: 2rem;
     letter-spacing: 1.5px;
@@ -96,6 +90,17 @@ body {
     padding: 1rem 2rem;
 }
 
+.links-container .link-box .material-icons {
+    font-size: 10rem;
+    color: var(--link-color);
+    transition: all ease-in-out 0.3s;
+}
+
+.links-container .link-box:hover .material-icons {
+    font-size: 7.5rem;
+    margin-bottom: 1rem;
+}
+
 @media only screen and (max-width: 768px) {
     .links-container .link-box{
         border-color: var(--link-accent);