diff --git a/web/components/logos/HalfScreen.tsx b/web/components/logos/HalfScreen.tsx
new file mode 100644
index 0000000..3271055
--- /dev/null
+++ b/web/components/logos/HalfScreen.tsx
@@ -0,0 +1,17 @@
+export default function HalfScreen() {
+  return (
+    <div className="flex flex-col bg-custom-background w-full h-[20%] justify-center items-center sm:w-1/2 sm:h-full">
+      <div className="flex flex-row relative w-full h-[40%] justify-center sm:w-[17%] sm:h-[13%] sm:mb-[5%]">
+        <img
+          src="/MBBLogo.svg"
+          className="shrink-0 stroke-[2.1px] object-contain sm:stroke-[3px]"
+        ></img>
+      </div>
+      <div className="hidden sm:flex flex-col w-full h-[10%] justify-center shrink-0">
+        <p className="text-white text-center font-opensans text-3xl font-bold tracking-wide uppercase sm:text-4xl">
+          Motherhood <br /> Beyond bars
+        </p>
+      </div>
+    </div>
+  );
+}
diff --git a/web/components/logos/Loading.tsx b/web/components/logos/Loading.tsx
new file mode 100644
index 0000000..7ea65c4
--- /dev/null
+++ b/web/components/logos/Loading.tsx
@@ -0,0 +1,17 @@
+export default function LoadingScreen() {
+  return (
+    <div className="flex flex-col bg-custom-background w-full h-screen justify-center items-center">
+      <div className="flex flex-row relative w-full h-[10%] justify-center mb-[10%] sm:w-[17%] sm:h-[13%] sm:mb-[5%]">
+        <img
+          src="/MBBLogo.svg"
+          className="shrink-0 stroke-[2.1px] object-contain sm:stroke-[3px]"
+        ></img>
+      </div>
+      <div className="flex flex-col w-full h-[10%] justify-center shrink-0">
+        <p className="text-white text-center font-opensans text-3xl font-bold tracking-wide uppercase sm:text-4xl">
+          Motherhood <br /> Beyond bars
+        </p>
+      </div>
+    </div>
+  );
+}
diff --git a/web/components/mbbLogo.tsx b/web/components/mbbLogo.tsx
deleted file mode 100644
index ee20163..0000000
--- a/web/components/mbbLogo.tsx
+++ /dev/null
@@ -1,38 +0,0 @@
-import React from "react";
-
-function MBBLogo() {
-  return (
-    <svg
-      width="127"
-      height="121"
-      viewBox="0 0 127 121"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-    >
-      <path
-        d="M60 14.9058V121L0 56.7005V17.8285L16.1538 0H46.1538L60 14.9058Z"
-        fill="white"
-      />
-      <path
-        d="M67 14.9058V121L127 56.7005V17.8285L110.846 0H80.8462L67 14.9058Z"
-        fill="url(#paint0_linear_1483_15452)"
-        fillOpacity="0.8"
-      />
-      <defs>
-        <linearGradient
-          id="paint0_linear_1483_15452"
-          x1="97"
-          y1="-1.10914e-06"
-          x2="171.369"
-          y2="105.16"
-          gradientUnits="userSpaceOnUse"
-        >
-          <stop stopColor="white" />
-          <stop offset="1" stopColor="white" stopOpacity="0" />
-        </linearGradient>
-      </defs>
-    </svg>
-  );
-}
-
-export default MBBLogo;
diff --git a/web/package-lock.json b/web/package-lock.json
index 4202634..717fd0e 100644
--- a/web/package-lock.json
+++ b/web/package-lock.json
@@ -7511,6 +7511,186 @@
       "funding": {
         "url": "https://github.com/sponsors/sindresorhus"
       }
+    },
+    "node_modules/@next/swc-android-arm-eabi": {
+      "version": "12.3.4",
+      "resolved": "https://registry.npmjs.org/@next/swc-android-arm-eabi/-/swc-android-arm-eabi-12.3.4.tgz",
+      "integrity": "sha512-cM42Cw6V4Bz/2+j/xIzO8nK/Q3Ly+VSlZJTa1vHzsocJRYz8KT6MrreXaci2++SIZCF1rVRCDgAg5PpqRibdIA==",
+      "cpu": [
+        "arm"
+      ],
+      "optional": true,
+      "os": [
+        "android"
+      ],
+      "engines": {
+        "node": ">= 10"
+      }
+    },
+    "node_modules/@next/swc-android-arm64": {
+      "version": "12.3.4",
+      "resolved": "https://registry.npmjs.org/@next/swc-android-arm64/-/swc-android-arm64-12.3.4.tgz",
+      "integrity": "sha512-5jf0dTBjL+rabWjGj3eghpLUxCukRhBcEJgwLedewEA/LJk2HyqCvGIwj5rH+iwmq1llCWbOky2dO3pVljrapg==",
+      "cpu": [
+        "arm64"
+      ],
+      "optional": true,
+      "os": [
+        "android"
+      ],
+      "engines": {
+        "node": ">= 10"
+      }
+    },
+    "node_modules/@next/swc-darwin-x64": {
+      "version": "12.3.4",
+      "resolved": "https://registry.npmjs.org/@next/swc-darwin-x64/-/swc-darwin-x64-12.3.4.tgz",
+      "integrity": "sha512-PPF7tbWD4k0dJ2EcUSnOsaOJ5rhT3rlEt/3LhZUGiYNL8KvoqczFrETlUx0cUYaXe11dRA3F80Hpt727QIwByQ==",
+      "cpu": [
+        "x64"
+      ],
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">= 10"
+      }
+    },
+    "node_modules/@next/swc-freebsd-x64": {
+      "version": "12.3.4",
+      "resolved": "https://registry.npmjs.org/@next/swc-freebsd-x64/-/swc-freebsd-x64-12.3.4.tgz",
+      "integrity": "sha512-KM9JXRXi/U2PUM928z7l4tnfQ9u8bTco/jb939pdFUHqc28V43Ohd31MmZD1QzEK4aFlMRaIBQOWQZh4D/E5lQ==",
+      "cpu": [
+        "x64"
+      ],
+      "optional": true,
+      "os": [
+        "freebsd"
+      ],
+      "engines": {
+        "node": ">= 10"
+      }
+    },
+    "node_modules/@next/swc-linux-arm-gnueabihf": {
+      "version": "12.3.4",
+      "resolved": "https://registry.npmjs.org/@next/swc-linux-arm-gnueabihf/-/swc-linux-arm-gnueabihf-12.3.4.tgz",
+      "integrity": "sha512-3zqD3pO+z5CZyxtKDTnOJ2XgFFRUBciOox6EWkoZvJfc9zcidNAQxuwonUeNts6Xbm8Wtm5YGIRC0x+12YH7kw==",
+      "cpu": [
+        "arm"
+      ],
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 10"
+      }
+    },
+    "node_modules/@next/swc-linux-arm64-gnu": {
+      "version": "12.3.4",
+      "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-gnu/-/swc-linux-arm64-gnu-12.3.4.tgz",
+      "integrity": "sha512-kiX0vgJGMZVv+oo1QuObaYulXNvdH/IINmvdZnVzMO/jic/B8EEIGlZ8Bgvw8LCjH3zNVPO3mGrdMvnEEPEhKA==",
+      "cpu": [
+        "arm64"
+      ],
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 10"
+      }
+    },
+    "node_modules/@next/swc-linux-arm64-musl": {
+      "version": "12.3.4",
+      "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-musl/-/swc-linux-arm64-musl-12.3.4.tgz",
+      "integrity": "sha512-EETZPa1juczrKLWk5okoW2hv7D7WvonU+Cf2CgsSoxgsYbUCZ1voOpL4JZTOb6IbKMDo6ja+SbY0vzXZBUMvkQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 10"
+      }
+    },
+    "node_modules/@next/swc-linux-x64-gnu": {
+      "version": "12.3.4",
+      "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-gnu/-/swc-linux-x64-gnu-12.3.4.tgz",
+      "integrity": "sha512-4csPbRbfZbuWOk3ATyWcvVFdD9/Rsdq5YHKvRuEni68OCLkfy4f+4I9OBpyK1SKJ00Cih16NJbHE+k+ljPPpag==",
+      "cpu": [
+        "x64"
+      ],
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 10"
+      }
+    },
+    "node_modules/@next/swc-linux-x64-musl": {
+      "version": "12.3.4",
+      "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-musl/-/swc-linux-x64-musl-12.3.4.tgz",
+      "integrity": "sha512-YeBmI+63Ro75SUiL/QXEVXQ19T++58aI/IINOyhpsRL1LKdyfK/35iilraZEFz9bLQrwy1LYAR5lK200A9Gjbg==",
+      "cpu": [
+        "x64"
+      ],
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 10"
+      }
+    },
+    "node_modules/@next/swc-win32-arm64-msvc": {
+      "version": "12.3.4",
+      "resolved": "https://registry.npmjs.org/@next/swc-win32-arm64-msvc/-/swc-win32-arm64-msvc-12.3.4.tgz",
+      "integrity": "sha512-Sd0qFUJv8Tj0PukAYbCCDbmXcMkbIuhnTeHm9m4ZGjCf6kt7E/RMs55Pd3R5ePjOkN7dJEuxYBehawTR/aPDSQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">= 10"
+      }
+    },
+    "node_modules/@next/swc-win32-ia32-msvc": {
+      "version": "12.3.4",
+      "resolved": "https://registry.npmjs.org/@next/swc-win32-ia32-msvc/-/swc-win32-ia32-msvc-12.3.4.tgz",
+      "integrity": "sha512-rt/vv/vg/ZGGkrkKcuJ0LyliRdbskQU+91bje+PgoYmxTZf/tYs6IfbmgudBJk6gH3QnjHWbkphDdRQrseRefQ==",
+      "cpu": [
+        "ia32"
+      ],
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">= 10"
+      }
+    },
+    "node_modules/@next/swc-win32-x64-msvc": {
+      "version": "12.3.4",
+      "resolved": "https://registry.npmjs.org/@next/swc-win32-x64-msvc/-/swc-win32-x64-msvc-12.3.4.tgz",
+      "integrity": "sha512-DQ20JEfTBZAgF8QCjYfJhv2/279M6onxFjdG/+5B0Cyj00/EdBxiWb2eGGFgQhrBbNv/lsvzFbbi0Ptf8Vw/bg==",
+      "cpu": [
+        "x64"
+      ],
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">= 10"
+      }
     }
   }
 }
diff --git a/web/pages/login.tsx b/web/pages/login.tsx
index 7d309f1..93df252 100644
--- a/web/pages/login.tsx
+++ b/web/pages/login.tsx
@@ -8,7 +8,6 @@ import { AuthFormValues } from "@lib/types/common";
 import { UserContext } from "@lib/contexts/userContext";
 
 import ErrorAlert from "@components/errorAlert";
-import MBBLogo from "@components/mbbLogo";
 import Button from "@components/atoms/Button";
 import TextInput from "@components/atoms/TextInput";
 
@@ -26,9 +25,9 @@ export default function LoginScreen() {
         <div className="flex h-screen">
           <div className="w-1/2 place-items-center gradient-bg">
             <div className="flex flex-wrap flex-col place-content-center h-full">
-              <div className="self-center">
+              {/* <div className="self-center">
                 <MBBLogo />
-              </div>
+              </div> */}
               <br />
               <div className="text-white text-4xl uppercase text-center font-opensans font-bold">
                 Motherhood <br /> Beyond Bars
diff --git a/web/public/MBBLogo.svg b/web/public/MBBLogo.svg
new file mode 100644
index 0000000..09682ab
--- /dev/null
+++ b/web/public/MBBLogo.svg
@@ -0,0 +1,3 @@
+<svg width="89" height="85" viewBox="0 0 89 85" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path id="Vector 38" d="M44.9253 12.6387L33.1865 1.3999H12.3226M12.3226 1.3999L1.44995 12.9196V40.1736M12.3226 1.3999L26.7216 28.0919M1.44995 40.1736L43.4715 82.5999M1.44995 40.1736L26.7216 28.0919M43.4715 82.5999L87.5499 38.4878V34.5542M43.4715 82.5999L35.0965 55.3459M43.4715 82.5999L69.037 41.8925M26.7216 28.0919L35.0965 55.3459M26.7216 28.0919L56.1073 3.14611M26.7216 28.0919L62.0075 31.1826M35.0965 55.3459L64.6291 43.6397M87.5499 34.5542V13.7625L83.7298 10.1099M87.5499 34.5542L69.037 41.8925M69.037 41.8925L64.6291 43.6397M64.6291 43.6397L63.0128 35.9591M56.1073 3.14611L58.1643 1.3999H74.6203L83.7298 10.1099M56.1073 3.14611L62.0075 31.1826M63.0128 35.9591L83.7298 10.1099M63.0128 35.9591L62.0075 31.1826" stroke="white" stroke-width="2.1"/>
+</svg>
diff --git a/web/tailwind.config.js b/web/tailwind.config.js
index 7ed9afe..ce8d6b6 100644
--- a/web/tailwind.config.js
+++ b/web/tailwind.config.js
@@ -11,6 +11,9 @@ module.exports = {
       opensans: ["Open Sans", "sans-serif"],
     },
     extend: {
+      backgroundImage: {
+        'custom-background': 'radial-gradient(115.79% 108.31% at 24.4% 30.17%, #EDB1CB 0.01%, #B14378 92.53%)'
+      },
       fontFamily: {
         sans: ["Open Sans", ...defaultTheme.fontFamily.sans],
       },