diff --git a/client/src/components/forms/TeamForm/index.tsx b/client/src/components/forms/TeamForm/index.tsx
index 409d81f21270670f8f1f6c5781a86863585670cd..0bb2ad69e034711e85e51e42227d39cf57e3e7b8 100644
--- a/client/src/components/forms/TeamForm/index.tsx
+++ b/client/src/components/forms/TeamForm/index.tsx
@@ -42,15 +42,15 @@ export default function TeamForm({ onSubmit, onBack, team }: Props) {
                 defaultText={name}
             />
             <div className="button-container">
+                <Button type="submit" className={!onBack ? 'expanded' : ''}>
+                    {team ? 'Update' : 'Create'}
+                </Button>
                 {
                     onBack &&
-                    <Button onClick={onBack} className="hollow">
+                    <Button onClick={onBack} className="dark">
                         Go Back
                     </Button>
                 }
-                <Button type="submit" className={!onBack ? 'expanded' : ''}>
-                    {team ? 'Update' : 'Create'}
-                </Button>
             </div>
         </form>
     )
diff --git a/client/src/components/forms/TeamForm/team-create.scss b/client/src/components/forms/TeamForm/team-create.scss
index e8d62bf26b1dcb5d00595d602916fd7b8a6279f6..e95286dbb56e845ef936b31904a117d4c98de688 100644
--- a/client/src/components/forms/TeamForm/team-create.scss
+++ b/client/src/components/forms/TeamForm/team-create.scss
@@ -1,8 +1,18 @@
+@use 'styles/mixins.scss'as mx;
 
 .team-form {
     .button-container {
-        display: flex;
-        justify-content: space-around;
-    }
-}
+        margin: -10px;
+        .button {
+            margin: 10px;
+            width: calc(100% - 20px);
+        }
+
+        @include mx.breakpoint(medium) {
+            display: flex;
+            justify-content: space-around;
+            flex-direction: row-reverse;
 
+        }
+    }
+}
\ No newline at end of file
diff --git a/client/src/components/ui/Button/index.tsx b/client/src/components/ui/Button/index.tsx
index ae3a5eea0637a69f6446a762ff63cb90606c1e15..50c5053c72448f331da852db8d93ca39ff92c92c 100644
--- a/client/src/components/ui/Button/index.tsx
+++ b/client/src/components/ui/Button/index.tsx
@@ -7,7 +7,7 @@ interface Props {
     children: ReactNode;
     type?: "button" | "submit" | "reset";
     className?: string;
-    onClick?: MouseEventHandler
+    onClick?: MouseEventHandler;
 }
 
 export default function Button({children, type, className, onClick}: Props) {
diff --git a/client/src/components/ui/Project/project.scss b/client/src/components/ui/Project/project.scss
index acb3910846fc6aa728b025c56105d4540c42d993..40bf6c2725b047f2a85dccfa9bb7d6a2b67324c4 100644
--- a/client/src/components/ui/Project/project.scss
+++ b/client/src/components/ui/Project/project.scss
@@ -49,6 +49,7 @@
         font-size: 16px;
         text-align: center;
         font-weight: s.$weight-bold;
+        overflow: hidden;
     }
 
     .info {
diff --git a/client/src/pages/Introduction/index.tsx b/client/src/pages/Introduction/index.tsx
index 9b10c0a6f6d00680bd8cdbf1af10ee1a5f39701f..ad46eccc1bd35da4513d03599a0fbcf95ba9887f 100644
--- a/client/src/pages/Introduction/index.tsx
+++ b/client/src/pages/Introduction/index.tsx
@@ -57,7 +57,7 @@ export default function Introduction() {
                                 <div className="lead-text">
                                     You are one step away from getting started with ryoko.
                                 </div>
-                                <div className="possibility">
+                                <div className="possibility framed">
                                     Ask one of your colleagues to add you to their team. <br />
                                     Your username is: <strong>{username}</strong>
                                 </div>
diff --git a/client/src/pages/Introduction/intro.scss b/client/src/pages/Introduction/intro.scss
index 19dc2d2479a59b529d91ff1f98d13443dc38a833..b88cd226db4a01b017ea7f4ed17f7513022c3c69 100644
--- a/client/src/pages/Introduction/intro.scss
+++ b/client/src/pages/Introduction/intro.scss
@@ -25,6 +25,12 @@
             padding: 60px;
             border-radius: 25px;
         }
+
+        .introduction-container {
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+        }
         
         .lead-text {
             font-size: 24px;
@@ -33,12 +39,20 @@
         .possibility {
             margin: 20px 0;
             font-size: 18px;
+            &.framed {
+                padding: 20px 40px;
+                background: s.$background-white;
+                display: inline-block;
+                border-radius: 15px;
+            }
         }
     }
     .logout-btn {
         color: s.$primary;
         font-weight: s.$weight-bold;
         cursor: pointer;
+        margin-top: 30px;
+        text-decoration: underline;
 
         &:hover {
             color: s.$primary-dark;