Remove unnecessary CSS

public/css/styles.css

@@ -57,7 +57,8 @@ Contact: me@bateleur.org, me@hexaitos.com.
 }
 
 * {
-    font-family: Merriweather, Merriweather Sans
+    box-sizing: border-box;
+    font-family: Merriweather, Merriweather Sans;
 }
 
 q {
@@ -103,11 +104,7 @@ h3 {
 }
 
 .main img {
-    max-width: 100%
+    width: 100%
-}
-
-div.pfp {
-    padding: .5em
 }
 
 div.main {
@@ -117,21 +114,6 @@ div.main {
     min-height: 500px
 }
 
-.pfp img {
-    border: 5px double #a72f14;
-    border-radius: 10px;
-    max-width: 150px;
-    display: block;
-    margin-left: auto;
-    margin-right: auto
-}
-
-.pfp p {
-    text-align: center;
-    font-style: italic;
-    font-size: 12px
-}
-
 div.menu {
     background: var(--menu-bg);
     padding: .5em;
@@ -182,52 +164,6 @@ a.webring-btn:hover {
     text-decoration: none;
 }
 
-div.contact {
-    text-align: center;
-}
-
-.contact a {
-    color: #fff;
-    text-decoration: none;
-    padding: .8em .8em;
-    text-align: center;
-    background-color: var(--btn-col);
-    display: grid;
-    font-size: medium;
-    border-radius: 10px;
-    margin-bottom: 1em
-}
-
-a.webring-btn {
-    color: #fff;
-    text-decoration: none;
-    padding: .5em .5em;
-    margin-right: .5em;
-    margin-left: .5em;
-    min-width: 75px;
-    text-align: center;
-    background-color: var(--btn-col);
-    display: inline-block;
-    font-size: medium;
-    border-radius: 10px
-}
-
-div.webring {
-    border-top: 2px solid var(--btn-hov);
-    border-bottom: 2px solid var(--btn-hov);
-    text-align: right;
-    display: flex;
-    align-items: center;
-    height: 50px;
-    justify-content: space-between;
-    margin-top: 5px
-}
-
-.webring span {
-    float: left;
-    padding: auto 0
-}
-
 footer {
     background: var(--foot-bg);
     padding: 1em;
@@ -279,162 +215,6 @@ footer p:last-of-type {
     }
 }
 
-div.art {
-    display: flex;
-    justify-content: center
-}
-
-div.gallery {
-    border: 5px double rgba(167, 47, 20, .3)
-}
-
-div.gallery:hover {
-    border: 5px double #dba047
-}
-
-div.gallery img {
-    width: 100%;
-    height: 200px;
-    object-fit: scale-down
-}
-
-div.desc {
-    padding: 10px;
-    text-align: center
-}
-
-* {
-    box-sizing: border-box
-}
-
-.responsive {
-    padding: 0 6px;
-    float: left;
-    width: 24.99999%
-}
-
-section.colour-cols {
-    display: flex;
-    flex-direction: column;
-    justify-content: space-around;
-    text-align: center
-}
-
-div[class*=colour-col-] {
-    display: flex;
-    justify-content: center
-}
-
-div[class*=colour-col-]>div {
-    height: 75px;
-    width: 25%
-}
-
-div[class*=colour-col-][class*="1"] :nth-child(1) {
-    background-color: #2b2623
-}
-
-div[class*=colour-col-][class*="1"] :nth-child(2) {
-    background-color: #db9f47
-}
-
-div[class*=colour-col-][class*="1"] :nth-child(3) {
-    background-color: #ae4e26
-}
-
-div[class*=colour-col-][class*="1"] :nth-child(4) {
-    background-color: #a72f14
-}
-
-div[class*=colour-col-][class*="2"] :nth-child(1) {
-    background-color: #fff
-}
-
-div[class*=colour-col-][class*="2"] :nth-child(2) {
-    background-color: #133042
-}
-
-div[class*=colour-col-][class*="2"] :nth-child(3) {
-    background-color: #2b2623
-}
-
-div[class*=colour-col-][class*="3"] :nth-child(1) {
-    background-color: #c0b6ad
-}
-
-div[class*=colour-col-][class*="3"] :nth-child(2) {
-    background-color: #9f9387
-}
-
-div[class*=colour-col-][class*="3"] :nth-child(3) {
-    background-color: #2b2623
-}
-
-div[class*=colour-col-][class*="3"] :nth-child(4) {
-    background-color: #894518
-}
-
-div[class*=hex-code-col-] {
-    display: flex;
-    justify-content: center;
-    flex-direction: row;
-    margin-bottom: 15px
-}
-
-div[class*=hex-code-col-]>span {
-    width: 25%;
-    display: inline;
-    text-align: center;
-    font-family: monospace
-}
-
-span.colour-heading {
-    margin-bottom: 5px;
-    font-size: large
-}
-
-img.refsheet {
-    width: 100%
-}
-
-@media only screen and (max-width: 700px) {
-    .responsive {
-        width: 49.99999%;
-        margin: 6px 0
-    }
-    div.art {
-        display: inherit;
-        justify-content: inherit
-    }
-}
-
-@media only screen and (max-width: 500px) {
-    .responsive {
-        width: 100%
-    }
-    div.art {
-        display: inherit;
-        justify-content: inherit
-    }
-    a.webring-btn {
-        min-width: 40px;
-        margin-right: .2em;
-        margin-left: .2em
-    }
-}
-
-.clearfix:after {
-    content: "";
-    display: table;
-    clear: both
-}
-
-code {
-    font-family: monospace;
-    background-color: #d3d3d3;
-    border: 1px gray
-}
-
 @media(prefers-color-scheme: dark) {
     :root {
         --body-bg: rgb(49, 49, 49);
@@ -446,8 +226,7 @@ code {
     }
     code {
         background-color: #a9a9a9
-    }
+    } div.gallery {
-    div.gallery {
         border: 5px double #a72f14
     }
     .main a, footer a {