minor

style.css

@@ -26,6 +26,7 @@ main{
 
 table{
   margin: auto;
+  width: 80%;
 }
 
 
@@ -85,6 +86,8 @@ a:hover{
   flex-direction: row;
   gap: 10px;
   justify-content: space-between;
+  align-content: stetch;
+  align-items: stretch;
 }
 
 .rows{
@@ -92,6 +95,8 @@ a:hover{
   flex-direction: column;
   gap: 10px;
   align-content: stretch;
+  align-items: stretch;
+  
 }
 
 #contact{
@@ -172,6 +177,7 @@ main .socials{
   bottom: 0;
   left: 0;
 }
+
 .font_scaler button{
   background: none;
   background-color: white;
@@ -181,9 +187,10 @@ main .socials{
   padding: 5px;
   transition: background-color 0.5s;
 }
+
 .font_scaler img{
-  width: 70px;
-  height: 70px;
+  width: 7vw;
+  height: 7vw;
 }
 
 .font_scaler button::hover, .font_scaler img::hover{
@@ -192,7 +199,36 @@ main .socials{
 
 @media screen and (max-width:1000px){
 
+  table{
+    width: 80%;
+    font-size: 1.5rem;
+  }
 
+  table, th, td{
+    /* border: 2px solid; */
+    /* border-radius: 5px; */
+    /* border-collapse: collapse; */
+  }
+  
+  .font_scaler_buttons img{
+    width: 15vw;
+    height: 15vw;
+  }
+
+  .columns{
+    display: flex;
+    flex-direction: column;
+    gap: 10px;
+    justify-content: space-between;
+  }
+
+  header, article, section{
+    background-color: white;
+    padding: 10px;
+    padding-bottom: 20px;
+    border-radius: 0 0 0px 0px;
+  }
+  
   .maximised{
     position: fixed;
     left: 50%;