diff --git a/onlylegs/static/sass/components/banner.sass b/onlylegs/static/sass/components/banner.sass
index 483c071..a13604d 100644
--- a/onlylegs/static/sass/components/banner.sass
+++ b/onlylegs/static/sass/components/banner.sass
@@ -20,26 +20,10 @@
             background-color: RGB($fg-black)
             color: RGB($fg-white)
 
-    &::after
-        content: ''
-
-        width: $rad
-        height: calc(#{$rad} * 2)
-
-        position: absolute
-        bottom: calc(#{$rad} * -2)
-        left: 0
-
-        background-color: RGB($bg-bright)
-        border-radius: $rad 0 0 0
-        box-shadow: 0 calc(#{$rad} * -1) 0 0 RGB($bg-100)
-
 .banner
     height: 30rem
     max-height: 69vh
 
-    background-color: RGB($bg-300)
-
     img
         position: absolute
         inset: 0
@@ -125,7 +109,6 @@
 
 .banner-small
     height: 3.5rem
-    background-color: RGB($bg-100)
 
     .banner-content
         padding: 0 0.5rem
diff --git a/onlylegs/static/sass/components/buttons/block.sass b/onlylegs/static/sass/components/buttons/block.sass
index 3891edd..f16f96e 100644
--- a/onlylegs/static/sass/components/buttons/block.sass
+++ b/onlylegs/static/sass/components/buttons/block.sass
@@ -59,6 +59,10 @@
     &.black
         @include btn-block($black)
 
+    &.disabled, &:disabled
+        color: RGB($fg-dim)
+        cursor: unset
+
 .input-checkbox
     padding: 0
     display: flex
diff --git a/onlylegs/static/sass/components/buttons/pill.sass b/onlylegs/static/sass/components/buttons/pill.sass
index e9723f3..3767c01 100644
--- a/onlylegs/static/sass/components/buttons/pill.sass
+++ b/onlylegs/static/sass/components/buttons/pill.sass
@@ -68,6 +68,10 @@
 
         color: RGB($primary)
 
+    &.disabled, &:disabled
+        color: RGB($fg-dim)
+        cursor: unset
+
 .pill__critical
     color: RGB($critical)
 
diff --git a/onlylegs/static/sass/components/gallery.sass b/onlylegs/static/sass/components/gallery.sass
index 05f2c66..87d63ca 100644
--- a/onlylegs/static/sass/components/gallery.sass
+++ b/onlylegs/static/sass/components/gallery.sass
@@ -222,3 +222,7 @@
 @media (max-width: 800px)
     .gallery-grid
         grid-template-columns: auto auto auto
+
+    .gallery-item
+        margin: 0.35rem
+        position: relative
\ No newline at end of file
diff --git a/onlylegs/static/sass/components/image-view.sass b/onlylegs/static/sass/components/image-view.sass
new file mode 100644
index 0000000..b5d459e
--- /dev/null
+++ b/onlylegs/static/sass/components/image-view.sass
@@ -0,0 +1,260 @@
+.info-container
+    padding: 0.5rem 0 0 0.5rem
+    width: 27rem
+    position: absolute
+    top: 0
+    left: 0
+    bottom: 0
+    background-image: linear-gradient(90deg, $bg-transparent, transparent)
+    overflow-y: auto
+    transition: left 0.3s cubic-bezier(0.76, 0, 0.17, 1)
+    z-index: 2
+    -ms-overflow-style: none
+    scrollbar-width: none
+    &::-webkit-scrollbar
+        display: none
+
+    &.collapsed
+        left: -27rem
+@media (max-width: 1100px)
+    .info-container
+        padding: 0 0.5rem 0 0.5rem
+        width: 100%
+        position: relative
+        background: none
+        // While probably not the best way of doing this
+        // Not bothered to fight with CSS today
+        &.collapsed
+            left: 0
+
+details
+    margin-bottom: 0.5rem
+    padding: 0.5rem
+    display: flex
+    flex-direction: column
+    background-color: RGB($bg-300)
+    color: RGB($fg-white)
+    border-radius: $rad
+    overflow: hidden
+
+    summary
+        height: 1.5rem
+        display: flex
+        flex-direction: row
+        justify-content: flex-start
+        align-items: center
+        position: relative
+        color: RGB($primary)
+
+        > i
+            margin-right: 0
+            font-size: 1.25rem
+
+            &.collapse-indicator
+                transition: transform 0.15s cubic-bezier(.79, .14, .15, .86)
+
+        h2
+            margin: 0 0.5rem
+            font-size: 1.1rem
+            font-weight: 500
+
+    &[open]
+        summary
+            margin-bottom: 0.5rem
+
+            > i.collapse-indicator
+                transform: rotate(90deg)
+
+    p
+        margin: 0
+        padding: 0
+
+        font-size: 1rem
+        font-weight: 400
+
+        text-overflow: ellipsis
+        overflow: hidden
+
+    .link
+        margin: 0
+        padding: 0
+
+        color: RGB($primary)
+
+        cursor: pointer
+        text-decoration: none
+
+        &:hover
+            text-decoration: underline
+
+    .pfp
+        width: 1.1rem
+        height: 1.1rem
+
+        border-radius: $rad-inner
+
+        object-fit: cover
+
+    table
+        margin: 0
+        padding: 0
+
+        width: 100%
+
+        overflow-x: hidden
+        border-collapse: collapse
+
+        tr
+            white-space: nowrap
+
+            td
+                padding-bottom: 0.5rem
+
+                max-width: 0
+
+                font-size: 1rem
+                font-weight: 400
+
+                vertical-align: top
+
+                > *
+                    vertical-align: top
+
+            td:first-child
+                padding-right: 0.5rem
+
+                width: 50%
+
+                overflow: hidden
+                text-overflow: ellipsis
+                white-space: nowrap
+            td:last-child
+                width: 50%
+
+                white-space: normal
+                word-break: break-word
+
+        tr:last-of-type td
+            padding-bottom: 0
+
+.img-colours
+    width: 100%
+
+    display: flex
+    gap: 0.5rem
+
+    button
+        margin: 0
+        padding: 0
+
+        width: 1.6rem
+        height: 1.6rem
+
+        display: flex
+        justify-content: center
+        align-items: center
+
+        border-radius: $rad-inner
+        border: none
+
+        i
+            font-size: 1rem
+            opacity: 0
+            transition: opacity 0.15s ease-in-out
+
+        &:hover i
+            opacity: 1
+
+.img-groups
+    width: 100%
+    display: flex
+    flex-wrap: wrap
+    gap: 0.5rem
+
+.image-container
+    padding: 0.5rem
+    position: absolute
+    top: 0
+    left: 27rem
+    right: 0
+    bottom: 0
+    z-index: 2
+    transition: left 0.3s cubic-bezier(0.76, 0, 0.17, 1), padding 0.3s cubic-bezier(0.76, 0, 0.17, 1)
+
+    picture
+        margin: auto
+        width: 100%
+        height: 100%
+        display: flex
+        overflow: hidden
+
+        img
+            margin: auto
+            padding: 0
+            width: auto
+            height: auto
+            max-width: 100%
+            max-height: 100%
+            object-fit: contain
+            object-position: center
+            border-radius: $rad
+
+    &.collapsed
+        padding: 0
+        left: 0
+
+        picture img
+            border-radius: 0
+@media (max-width: 1100px)
+    .image-container
+        position: relative
+        left: 0
+
+        picture
+            margin: 0 auto
+            max-height: 69vh
+
+            img
+                max-height: 69vh
+
+        &.collapsed
+            padding: 0.5rem
+            left: 0
+
+            picture img
+                border-radius: $rad
+
+.background
+    position: absolute
+    inset: 0
+    background-color: RGB($bg-300)
+    background-image: linear-gradient(to right, RGB($bg-400) 15%, RGB($bg-200) 35%, RGB($bg-400) 50%)
+    background-size: 1000px 640px
+    animation: imgLoading 1.8s linear infinite forwards
+    user-select: none
+    overflow: hidden
+    z-index: 1
+
+    img
+        position: absolute
+        top: 0
+        left: 0
+        width: 100%
+        height: 100vh
+        background-color: RGB($fg-white)
+        filter: blur(1rem) saturate(1.2)
+        transform: scale(1.1)
+        object-fit: cover
+        object-position: center center
+
+    &::after
+        content: ''
+        position: absolute
+        inset: 0
+        width: 100%
+        height: 100%
+        z-index: +1
+
+@media (max-width: 1100px)
+    #fullscreenImage
+        display: none
\ No newline at end of file
diff --git a/onlylegs/static/sass/components/image-view/background.sass b/onlylegs/static/sass/components/image-view/background.sass
deleted file mode 100644
index e7478b5..0000000
--- a/onlylegs/static/sass/components/image-view/background.sass
+++ /dev/null
@@ -1,42 +0,0 @@
-.background
-    width: 100%
-    height: 100vh
-
-    position: fixed
-    top: 0
-    left: 0
-
-    background-color: RGB($bg-300)
-    background-image: linear-gradient(to right, RGB($bg-400) 15%, RGB($bg-200) 35%, RGB($bg-400) 50%)
-    background-size: 1000px 640px
-    animation: imgLoading 1.8s linear infinite forwards
-
-    user-select: none
-    overflow: hidden
-    z-index: 1
-
-    img
-        position: absolute
-        top: 0
-        left: 0
-
-        width: 100%
-        height: 100%
-
-        background-color: RGB($fg-white)
-
-        filter: blur(1rem) saturate(1.2)
-        transform: scale(1.1)
-
-        object-fit: cover
-        object-position: center center
-
-    span
-        position: absolute
-        top: 0
-        left: 0
-
-        width: 100%
-        height: 100%
-
-        z-index: +1
\ No newline at end of file
diff --git a/onlylegs/static/sass/components/image-view/image.sass b/onlylegs/static/sass/components/image-view/image.sass
deleted file mode 100644
index ac7b9d7..0000000
--- a/onlylegs/static/sass/components/image-view/image.sass
+++ /dev/null
@@ -1,28 +0,0 @@
-.image-container, picture
-    margin: auto
-
-    width: 100%
-    height: 100%
-
-    display: flex
-    overflow: hidden
-
-    img
-        margin: auto
-        padding: 0
-
-        width: auto
-        height: auto
-        max-width: 100%
-        max-height: 100%
-
-        object-fit: contain
-        object-position: center
-
-@media (max-width: 1100px)
-    .image-container, picture
-        margin: 0 auto
-        max-height: 69vh
-
-        img
-            max-height: 69vh
\ No newline at end of file
diff --git a/onlylegs/static/sass/components/image-view/info-tab.sass b/onlylegs/static/sass/components/image-view/info-tab.sass
deleted file mode 100644
index c803159..0000000
--- a/onlylegs/static/sass/components/image-view/info-tab.sass
+++ /dev/null
@@ -1,232 +0,0 @@
-.info-container
-    padding: 0.5rem 0 0.5rem 0.5rem
-
-    width: 27rem
-    height: 100vh
-
-    position: absolute
-    top: 0
-    left: 0
-
-    display: flex
-    flex-direction: column
-    gap: 0.5rem
-
-    background-image: linear-gradient(90deg, $bg-transparent, transparent)
-
-    overflow-y: auto
-    z-index: +4
-    transition: left 0.3s cubic-bezier(0.76, 0, 0.17, 1)
-    -ms-overflow-style: none
-    scrollbar-width: none
-    &::-webkit-scrollbar
-        display: none
-
-    &.collapsed
-        left: -27rem
-
-.info-tab
-    display: flex
-    flex-direction: column
-
-    position: relative
-
-    background-color: RGB($bg-300)
-    border-radius: $rad
-
-    transition: max-height 0.3s cubic-bezier(.79, .14, .15, .86)
-
-    &.collapsed
-        height: 2.5rem
-
-        .collapse-indicator
-            transform: rotate(90deg)
-
-        .info-header
-            border-radius: $rad
-
-        .info-table
-            display: none
-
-.collapse-indicator
-    margin: 0
-    padding: 0
-    
-    position: absolute
-    top: 0.6rem
-    right: 0.6rem
-
-    background-color: transparent
-    color: RGB($primary)
-    border: none
-
-    z-index: +2
-
-    transition: transform 0.15s cubic-bezier(.79, .14, .15, .86)
-    cursor: pointer
-
-    > i
-        font-size: 1.1rem
-        color: RGB($primary)
-
-.info-header
-    padding: 0.5rem
-
-    width: 100%
-    height: 2.5rem
-
-    display: flex
-    justify-content: start
-    align-items: center
-    gap: 0.5rem
-
-    background-color: RGB($bg-200)
-    border-radius: $rad $rad 0 0
-
-    > i
-        font-size: 1.25rem
-        color: RGB($primary)
-
-    h2
-        margin: 0
-
-        font-size: 1.1rem
-        font-weight: 500
-
-        color: RGB($primary)
-
-        text-overflow: ellipsis
-        overflow: hidden
-
-.info-table
-    margin: 0
-    padding: 0.5rem
-
-    display: flex
-    flex-direction: column
-    gap: 1rem
-
-    color: RGB($fg-white)
-
-    overflow-x: hidden
-
-    p
-        margin: 0
-        padding: 0
-
-        font-size: 1rem
-        font-weight: 400
-
-        text-overflow: ellipsis
-        overflow: hidden
-
-    .link
-        margin: 0
-        padding: 0
-
-        color: RGB($primary)
-
-        cursor: pointer
-        text-decoration: none
-
-        &:hover
-            text-decoration: underline
-
-    .pfp
-        width: 1.1rem
-        height: 1.1rem
-
-        border-radius: $rad-inner
-
-        object-fit: cover
-
-    table
-        margin: 0
-        padding: 0
-
-        width: 100%
-
-        overflow-x: hidden
-        border-collapse: collapse
-
-        tr
-            white-space: nowrap
-
-            td
-                padding-bottom: 0.5rem
-
-                max-width: 0
-
-                font-size: 1rem
-                font-weight: 400
-
-                vertical-align: top
-
-                > *
-                    vertical-align: top
-
-            td:first-child
-                padding-right: 0.5rem
-
-                width: 50%
-
-                overflow: hidden
-                text-overflow: ellipsis
-                white-space: nowrap
-            td:last-child
-                width: 50%
-
-                white-space: normal
-                word-break: break-word
-
-        tr:last-of-type td
-            padding-bottom: 0
-
-.img-colours
-    width: 100%
-
-    display: flex
-    gap: 0.5rem
-
-    button
-        margin: 0
-        padding: 0
-
-        width: 1.6rem
-        height: 1.6rem
-
-        display: flex
-        justify-content: center
-        align-items: center
-
-        border-radius: $rad-inner
-        border: none
-
-        i
-            font-size: 1rem
-            opacity: 0
-            transition: opacity 0.15s ease-in-out
-
-        &:hover i
-            opacity: 1
-
-.img-groups
-    width: 100%
-    display: flex
-    flex-wrap: wrap
-    gap: 0.5rem
-
-@media (max-width: 1100px)
-    .info-container
-        padding: 0.5rem
-
-        width: 100%
-        height: 100%
-
-        position: relative       
-
-        &.collapsed
-            left: unset
-
-    .info-container
-        background: transparent
diff --git a/onlylegs/static/sass/components/image-view/view.sass b/onlylegs/static/sass/components/image-view/view.sass
deleted file mode 100644
index 8103d88..0000000
--- a/onlylegs/static/sass/components/image-view/view.sass
+++ /dev/null
@@ -1,59 +0,0 @@
-@import 'background'
-@import 'info-tab'
-@import 'image'
-
-
-.image-grid
-    padding: 0
-
-    width: 100%
-    height: 100vh
-
-    position: relative
-
-    display: flex
-    flex-direction: column
-    z-index: 3
-
-    .image-block
-        margin: 0 0 0 27rem
-        padding: 0.5rem
-
-        width: calc(100% - 27rem)
-        height: 100vh
-
-        position: relative
-
-        display: flex
-        flex-direction: column
-        gap: 0
-
-        z-index: 3
-        transition: margin 0.3s cubic-bezier(0.76, 0, 0.17, 1), width 0.3s cubic-bezier(0.76, 0, 0.17, 1)
-
-        .pill-row
-            margin-top: 0.5rem
-
-    &.collapsed
-        .image-block
-            margin: 0
-            width: 100%
-
-@media (max-width: 1100px)
-    .image-grid
-        height: auto
-
-        .image-block
-            margin: 0
-            padding: 0.5rem 0.5rem 0 0.5rem
-
-            width: 100%
-            height: auto
-
-            transition: margin 0s, width 0s
-
-            .pill-row
-                #fullscreenImage
-                    display: none
-
-        
diff --git a/onlylegs/static/sass/components/navigation.sass b/onlylegs/static/sass/components/navigation.sass
index c58805e..c4d5412 100644
--- a/onlylegs/static/sass/components/navigation.sass
+++ b/onlylegs/static/sass/components/navigation.sass
@@ -1,36 +1,20 @@
-.navigation
-    margin: 0
-    padding: 0
-
+nav
     width: 3.5rem
     height: 100%
     height: 100dvh
 
     display: flex
     flex-direction: column
-    justify-content: space-between
 
     position: fixed
     top: 0
     left: 0
 
-    background-color: RGB($bg-100)
-    color: RGB($fg-white)
+    background-color: transparent
+    color: inherit
 
     z-index: 69
 
-    .logo
-        margin: 0
-        padding: 0
-
-        width: 3.5rem
-        height: 3.5rem
-        min-height: 3.5rem
-
-        display: flex
-        flex-direction: row
-        align-items: center
-
 .navigation-spacer
     height: 100%
 
@@ -50,6 +34,7 @@
     align-items: center
 
     background-color: transparent
+    color: inherit
     border: none
 
     text-decoration: none
@@ -58,7 +43,7 @@
         padding: 0.5rem
         font-size: 1.3rem
         border-radius: $rad-inner
-        color: RGB($fg-white)
+        color: inherit
 
     > .nav-pfp
         padding: 0.4rem
@@ -115,25 +100,22 @@
             left: 3.9rem
 
     &.selected
-        > i
-            color: RGB($primary)
-
         &::before
             content: ''
             display: block
 
             position: absolute
             top: 3px
-            left: 0
+            left: 3px
 
             width: 3px
             height: calc(100% - 6px)
 
-            background-color: RGB($primary)
+            background-color: currentColor
             border-radius: $rad-inner
 
 @media (max-width: $breakpoint)
-    .navigation
+    nav
         width: 100vw
         height: 3.5rem
     
@@ -145,6 +127,8 @@
         bottom: 0
         left: 0
 
+        background-color: RGB($background)
+
         > span
             display: none
 
diff --git a/onlylegs/static/sass/components/notification.sass b/onlylegs/static/sass/components/notification.sass
index 3a468a2..feea589 100644
--- a/onlylegs/static/sass/components/notification.sass
+++ b/onlylegs/static/sass/components/notification.sass
@@ -22,23 +22,22 @@
     margin: 0
     padding: 0
 
-    width: 450px
+    width: 24rem
     height: auto
 
     position: fixed
-    top: 0.3rem
+    bottom: 0.3rem
     right: 0.3rem
 
     display: flex
-    flex-direction: column
+    flex-direction: column-reverse
 
     z-index: 621
 
 .sniffle__notification
-    margin: 0 0 0.3rem 0
+    margin-top: 0.3rem
     padding: 0
 
-    width: 450px
     height: auto
     max-height: 100px
 
@@ -56,7 +55,7 @@
     box-sizing: border-box
     overflow: hidden
 
-    transition: all 0.25s ease-in-out, opacity 0.2s ease-in-out, transform 0.2s cubic-bezier(.68,-0.55,.27,1.55)
+    transition: opacity 0.2s ease-in-out, transform 0.2s cubic-bezier(.68,-0.55,.27,1.55)
 
     &::after
         content: ""
@@ -89,10 +88,8 @@
     &.hide
         margin: 0
         max-height: 0
-
         opacity: 0
         transform: translateX(100%)
-
         transition: all 0.4s ease-in-out, max-height 0.2s ease-in-out
 
 .sniffle__notification-icon
@@ -130,6 +127,7 @@
 
 @media (max-width: $breakpoint)
     .notifications
+        bottom: 3.8rem
         width: calc(100vw - 0.6rem)
         height: auto
 
@@ -138,7 +136,7 @@
 
         &.hide
             opacity: 0
-            transform: translateY(-5rem)
+            transform: translateY(1rem)
     
     .sniffle__notification-time
         width: 100%
diff --git a/onlylegs/static/sass/style.sass b/onlylegs/static/sass/style.sass
index 097346c..3302ef4 100644
--- a/onlylegs/static/sass/style.sass
+++ b/onlylegs/static/sass/style.sass
@@ -18,10 +18,9 @@
 @import "components/buttons/pill"
 @import "components/buttons/block"
 
-@import "components/image-view/view"
+@import "components/image-view"
 @import "components/settings"
 
-// Reset
 *
     box-sizing: border-box
     font-family: $font
@@ -37,66 +36,49 @@
     ::-webkit-scrollbar-thumb:hover
         background: RGB($fg-white)
 
-html, body
+html
     margin: 0
     padding: 0
-
-    min-height: 100vh
-    max-width: 100vw
-
-    background-color: RGB($fg-white)
-
     scroll-behavior: smooth
-    overflow-x: hidden
 
-.wrapper
+body
     margin: 0
     padding: 0 0 0 3.5rem
 
+    max-width: 100%
     min-height: 100vh
 
+    display: grid
+    grid-template-rows: auto 1fr auto
+
+    background-color: RGB($background)
+    color: RGB($foreground)
+
+    overflow-x: hidden
+@media (max-width: $breakpoint)
+    body
+        padding: 0 0 3.5rem 0
+
+main
     display: flex
     flex-direction: column
-
-    background-color: RGB($bg-bright)
-    color: RGB($bg-100)
-
-.big-text
-    height: 20rem
-
-    display: flex
-    flex-direction: column
-    justify-content: center
-    align-items: center
-
-    color: RGB($bg-100)
-
-    h1
-        margin: 0 2rem
-        
-        font-size: 4rem
-        font-weight: 900
-        text-align: center
-
-    p
-        margin: 0 2rem
-
-        max-width: 40rem
-        font-size: 1rem
-        font-weight: 400
-        text-align: center
+    position: relative
+    background: RGBA($white, 1)
+    color: RGB($fg-black)
+    border-top-left-radius: $rad
+    overflow: hidden
+@media (max-width: $breakpoint)
+    main
+        border-top-left-radius: 0
 
 .error-page
-    width: 100%
-    height: 100vh
+    min-height: 100%
 
     display: flex
     flex-direction: column
     justify-content: center
     align-items: center
 
-    background-color: RGB($bg-bright)
-
     h1
         margin: 0 2rem
         
@@ -113,23 +95,8 @@ html, body
         font-size: 1.25rem
         font-weight: 400
         text-align: center
-
-        color: $fg-black
-
-
 @media (max-width: $breakpoint)
-    .wrapper
-        padding: 0 0 3.5rem 0
-
-    .big-text
-        height: calc(75vh - 3.5rem)
-
-        h1
-            font-size: 3.5rem
-
     .error-page
-        height: calc(100vh - 3.5rem)
-
         h1
             font-size: 4.5rem
 
diff --git a/onlylegs/static/sass/variables.sass b/onlylegs/static/sass/variables.sass
index bc1bd9f..e3fcd83 100644
--- a/onlylegs/static/sass/variables.sass
+++ b/onlylegs/static/sass/variables.sass
@@ -37,6 +37,11 @@ $font: 'Rubik', sans-serif
 $breakpoint: 800px
 
 
+// New variables, Slowly moving over to them because I suck at planning ahead and coding reeee
+$background: var(--bg-100)
+$foreground: var(--fg-white)
+
+
 \:root
     --bg-dim: 16, 16, 16
     --bg-bright: 232, 227, 227
@@ -66,7 +71,7 @@ $breakpoint: 800px
     --success: var(--green)
     --info: var(--blue)
 
-    --rad: 8px
+    --rad: 0.5rem
     --rad-inner: calc(var(--rad) / 2)
 
     --animation-smooth: cubic-bezier(0.76, 0, 0.17, 1)