diff --git a/src/components/api-guide/ApiGuide/ApiGuide.module.scss b/src/components/api-guide/ApiGuide/ApiGuide.module.scss
index 76aca81e..eb172e2e 100644
--- a/src/components/api-guide/ApiGuide/ApiGuide.module.scss
+++ b/src/components/api-guide/ApiGuide/ApiGuide.module.scss
@@ -45,6 +45,7 @@
 [data-state~="responsive.mobileS"] {
   .apiGuideImage {
     overflow: auto;
+    justify-content: unset;
     img {
       width: 90rem;
     }
diff --git a/src/components/api-guide/ApiGuide/ApiGuideTable/ApiGuideTable.module.scss b/src/components/api-guide/ApiGuide/ApiGuideTable/ApiGuideTable.module.scss
index cbbf4107..674ed99f 100644
--- a/src/components/api-guide/ApiGuide/ApiGuideTable/ApiGuideTable.module.scss
+++ b/src/components/api-guide/ApiGuide/ApiGuideTable/ApiGuideTable.module.scss
@@ -1,6 +1,6 @@
 .apiGuideTable {
   width: 75%;
-  border-radius: 1.6rem;
+  border-radius: 4px;
   overflow: hidden;
   border: 1px solid var(--gray-02);
   th {
diff --git a/src/components/api-guide/ApiGuide/Navigator/Navigator.module.scss b/src/components/api-guide/ApiGuide/Navigator/Navigator.module.scss
index d135aebf..a14a767c 100644
--- a/src/components/api-guide/ApiGuide/Navigator/Navigator.module.scss
+++ b/src/components/api-guide/ApiGuide/Navigator/Navigator.module.scss
@@ -6,7 +6,7 @@
   right: 40px;
   z-index: 10;
   box-sizing: border-box;
-  padding: 1rem;
+  padding: 1.6rem;
   margin: 0 auto 30px;
   .navigatorContent {
     display: flex;
@@ -26,7 +26,7 @@
         background-color: var(--gray-01);
       }
       &.navigatorSubLink {
-        margin-left: 0.5rem;
+        margin-left: 0.8rem;
       }
     }
   }
diff --git a/src/components/app-registration/AppManagement/AppManagement.module.scss b/src/components/app-registration/AppManagement/AppManagement.module.scss
index 8b4d8685..9df6255d 100644
--- a/src/components/app-registration/AppManagement/AppManagement.module.scss
+++ b/src/components/app-registration/AppManagement/AppManagement.module.scss
@@ -1,15 +1,18 @@
 .manageApps {
     display: none;
+
     table {
         border-spacing: 0;
         width: 100%;
         padding: 0 5rem;
     }
+
     thead {
         background-color: var(--gray-02);
         height: 5rem;
         text-align: var(--text-align-left);
     }
+
     th,
     td {
         padding: 1.6rem;
@@ -18,18 +21,22 @@
         overflow: hidden;
         text-overflow: ellipsis;
     }
+
     td:last-child,
     th:last-child {
         white-space: nowrap;
         padding: 0 1rem;
     }
+
     td:first-child,
     th:first-child {
         padding-left: 3.2rem;
     }
+
     tbody tr:nth-child(even) {
         background-color: var(--gray-03);
     }
+
     td:nth-child(2n + 3) {
         display: flex;
         flex-wrap: wrap;
@@ -84,6 +91,7 @@
 
 .tooltip {
     position: relative;
+
     .tooltipText {
         visibility: hidden;
         width: 13rem;
@@ -102,6 +110,7 @@
         margin-left: -5.5rem;
         opacity: 0;
         transition: opacity 1s;
+
         &::after {
             content: '';
             position: absolute;
@@ -113,8 +122,10 @@
             border-color: var(--border-normal) transparent transparent transparent;
         }
     }
+
     &:hover {
         transform: translateY(-2px);
+
         .tooltipText {
             visibility: visible;
             opacity: 1;
@@ -126,9 +137,10 @@
     border: 0.16rem solid #d6dadb;
     border-radius: 0.4rem;
     padding: 0.32rem 0.32rem;
-    font-size: 1.1rem;
+    font-size: var(--text-size-xxs);
 }
+
 .adminScope {
     border: 0.1rem solid var(--teal-01);
     color: var(--teal-01);
-}
+}
\ No newline at end of file
diff --git a/src/components/app-registration/AppRegistration/AppRegistrationForm/AppRegistrationForm.module.scss b/src/components/app-registration/AppRegistration/AppRegistrationForm/AppRegistrationForm.module.scss
index c36552ba..4d19a9f2 100644
--- a/src/components/app-registration/AppRegistration/AppRegistrationForm/AppRegistrationForm.module.scss
+++ b/src/components/app-registration/AppRegistration/AppRegistrationForm/AppRegistrationForm.module.scss
@@ -68,6 +68,10 @@ fieldset .customTextInput:last-child {
         align-items: var(--text-align-center);
         justify-content: var(--text-align-center);
         width: 80%;
+        input[type='number'],
+        input[type='text'] {
+            height: 40px;
+        }
         input[type='number'] {
             appearance: none;
             &::-webkit-outer-spin-button,
@@ -215,6 +219,7 @@ input[type='checkbox'] {
         height: 1.1rem;
         border-radius: 2px;
         transition: background-color 0.25s, border-color 0.25s;
+        top: 3px;
         z-index: 1;
     }
     input:checked + .customCheckbox {
diff --git a/src/components/app-registration/AppRegistration/AppRegistrationForm/AppRegistrationForm.tsx b/src/components/app-registration/AppRegistration/AppRegistrationForm/AppRegistrationForm.tsx
index 39849293..9075ce09 100644
--- a/src/components/app-registration/AppRegistration/AppRegistrationForm/AppRegistrationForm.tsx
+++ b/src/components/app-registration/AppRegistration/AppRegistrationForm/AppRegistrationForm.tsx
@@ -65,7 +65,11 @@ export default function AppRegistrationForm() {
                     <fieldset>
                         <div className={styles.formHeaderContainer}>
                             <h4 className={styles.registerFormHeader}>App information</h4>
-                            <div className={styles.description}>Paste your API token with the admin scope here.</div>
+                            <div className={styles.description}>
+                                <span>
+                                    Paste your API token with the admin scope here.
+                                </span>
+                            </div>
                         </div>
                         <div className='api-token-wrapper'>
                             <div className={styles.customTextInput} id='custom-text-input'>
@@ -121,8 +125,10 @@ export default function AppRegistrationForm() {
                             <div className={styles.formHeaderContainer}>
                                 <h4 className={styles.registerFormHeader}>Markup</h4>
                                 <div className={styles.description}>
-                                    You can earn commission by adding a markup to the price of each trade. Enter your
-                                    markup percentage here.
+                                    <span>
+                                        You can earn commission by adding a markup to the price of each trade. Enter your
+                                        markup percentage here.
+                                    </span>
                                 </div>
                             </div>
                             <div className='input-container'>
@@ -166,8 +172,10 @@ export default function AppRegistrationForm() {
                             <div className={styles.formHeaderContainer}>
                                 <h4 className={styles.registerFormHeader}>OAuth details</h4>
                                 <div className={styles.description}>
-                                    This allows clients to log in to your app using their Deriv accounts without an API
-                                    token.
+                                    <span>
+                                        This allows clients to log in to your app using their Deriv accounts without an API
+                                        token.
+                                    </span>
                                 </div>
                             </div>
                             <div className='input-container'>
@@ -233,7 +241,11 @@ export default function AppRegistrationForm() {
                             <div>
                                 <div className={styles.formHeaderContainer}>
                                     <h4 className={styles.registerFormHeader}>Scope of authorisation</h4>
-                                    <div className={styles.description}>Select the scope for your app:</div>
+                                    <div className={styles.description}>
+                                        <span>
+                                            Select the scope for your app:
+                                        </span>
+                                    </div>
                                 </div>
                             </div>
                             <div className={styles.scopesField}>
diff --git a/src/components/app-registration/AppRegistration/RegisterAppTabs/RegisteredAppTabs.tsx b/src/components/app-registration/AppRegistration/RegisterAppTabs/RegisteredAppTabs.tsx
index 20ee4a95..8ef8efe3 100644
--- a/src/components/app-registration/AppRegistration/RegisterAppTabs/RegisteredAppTabs.tsx
+++ b/src/components/app-registration/AppRegistration/RegisterAppTabs/RegisteredAppTabs.tsx
@@ -8,14 +8,14 @@ export default function RegisteredAppTabs() {
         id="register_button"
         className="register-button"
       >
-        Register your application
+        <label>Register your application</label>
       </button>
       <button
         onClick={() => send("MANAGE_TOGGLE_TAB")}
         id="manage_button"
         className="manage-button"
       >
-        Manage existing applications
+        <label>Manage existing applications</label>
       </button>
     </div>
   );
diff --git a/src/components/docs/Docs/Sidebar/Sidebar.module.scss b/src/components/docs/Docs/Sidebar/Sidebar.module.scss
index 6e06ec16..2d590024 100644
--- a/src/components/docs/Docs/Sidebar/Sidebar.module.scss
+++ b/src/components/docs/Docs/Sidebar/Sidebar.module.scss
@@ -185,6 +185,9 @@
             opacity: unset;
             font-size: var(--text-size-xs);
             color: var(--text-01);
+            > span {
+                font-size: var(--text-size-xs);
+            }
         }
         .dropdownList {
             margin-top: 1.6rem;
diff --git a/src/components/global/Modal/Modal.tsx b/src/components/global/Modal/Modal.tsx
index f08fe315..3912727c 100644
--- a/src/components/global/Modal/Modal.tsx
+++ b/src/components/global/Modal/Modal.tsx
@@ -32,7 +32,11 @@ export default function Modal({
         {type === "success" && <div className={styles.modalImageSuccess} />}
         {type === "warning" && <div className={styles.modalImageWarning} />}
         <div className={styles.modalTitle}>{title}</div>
-        <div className={styles.modalDescription}>{description}</div>
+        <div className={styles.modalDescription}>
+          <span>
+            {description}
+          </span>
+        </div>
       </div>
       <div className={styles.modalFooter}>
         <Button type="secondary" onClick={onSecondaryButtonClick}>
diff --git a/src/index.scss b/src/index.scss
index 8f7fd447..78785fc9 100644
--- a/src/index.scss
+++ b/src/index.scss
@@ -1,5 +1,6 @@
 @charset "UTF-8";
 @import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@100;400;500;700&display=swap");
+
 :root {
   --text-01: #333333;
   --brown-01: #311912;
@@ -68,7 +69,7 @@
   --text-size-xl: 4.8rem;
   --text-size-xxl: 6.4rem;
 
-    //Line Height
+  //Line Height
   --text-lh-xxs: 1;
   --text-lh-xs: 1.25;
   --text-lh-s: 1.4;
@@ -77,79 +78,87 @@
   --text-lh-xl: 2;
   --text-lh-xxl: 2.4;
 
-    //Font Weight
+  //Font Weight
   --text-weight-lighter: lighter;
   --text-weight-normal: normal;
   --text-weight-bold: bold;
   --text-weight-bolder: bolder;
 
-    //Text Align
+  //Text Align
   --text-align-left: start;
   --text-align-right: right;
   --text-align-center: center;
 }
+
 * {
   font-family: "IBM Plex Sans", sans-serif;
   font-size: 10px;
   margin: 0;
   padding: 0;
   scroll-margin-top: 100px;
-  p{
-    font-size: var(--text-size-s);
-  }
-  a{
-    font-size: 1.6rem;
-  }
-  h5{
-    font-size: var(--text-size-s);
-  }
 }
+
+html * {
+  font-size: var(--text-size-s);
+}
+
 html,
 body {
   overflow-x: hidden;
 }
+
 a {
   color: var(--red-01);
   text-decoration: none;
 }
+
 @mixin header {
   margin-bottom: 16px;
   color: var(--text-01);
 }
+
 h1 {
   @include header;
   font-size: 48px;
   margin-bottom: 40px;
   text-align: center;
 }
+
 h2 {
   @include header;
   font-size: 32px;
   line-height: 1.5;
 }
+
 h3 {
   @include header;
   font-size: 24px;
   line-height: 1.5;
 }
+
 h4 {
   font-size: 20px;
 }
+
 h5 {
   margin-bottom: 10px;
 }
+
 p {
   line-height: 28px;
   margin-bottom: 16px;
 }
+
 .numbered-list {
   margin-left: 40px;
   margin-bottom: 24px;
+
   li {
     margin-bottom: 10px;
     list-style-type: decimal;
   }
 }
+
 .inline-code {
   font-weight: 400;
   color: var(--red-01);
@@ -158,33 +167,42 @@ p {
   background-color: var(--gray-01);
   border: 1px solid var(--gray-02);
 }
+
 .language-json {
+
   .token.string,
   .token.number {
     color: var(--json-purple) !important;
   }
+
   .token.punctuation {
     color: var(--json-gold) !important;
   }
+
   .token.property {
     color: var(--json-magenta) !important;
   }
 }
+
 .doc-content {
   display: flex;
   min-height: 95vh;
   overflow-y: auto;
 }
+
 button:focus {
   outline: none;
 }
+
 [data-state*="responsive.mobile"] {
   #sidebar {
     display: none;
   }
+
   .row-container {
     flex-direction: column;
   }
+
   .term-conditions,
   .term-conditions a {
     text-align: center;
@@ -192,26 +210,33 @@ button:focus {
     font-size: 13px;
     margin-top: 0;
   }
+
   h1 {
     font-size: 32px;
   }
+
   h2 {
     font-size: 24px;
   }
+
   h3 {
     font-size: 18px;
   }
+
   h4 {
     font-size: 16px;
   }
-  .single-container > p {
+
+  .single-container>p {
     text-align: center;
     margin-bottom: 24px !important;
   }
-  body > #content > h1 {
+
+  body>#content>h1 {
     font-size: 24px;
     margin-top: 43px;
   }
+
   .doc-content {
     padding: 75px 15px 40px;
   }
@@ -228,97 +253,122 @@ button:focus {
     padding: 40px 0;
   }
 }
+
 @media (max-width: 992px) and (max-width: 480px) {
   .main-content .main-page-row .clients-opinion {
     margin-bottom: 10px;
   }
 }
+
 @media (max-width: 992px) {
+
   .main-content .main-page-row .row-container,
   .main-content .main-page-row .row-container .single-container {
     width: 100%;
   }
 }
+
 @media (max-width: 992px) {
   .main-content .main-page-row .column-container {
     width: 100%;
   }
+
   .main-content .main-page-row .column-container h1 {
     margin-bottom: 0 !important;
   }
+
   .main-content .main-page-row .column-container .benefits {
     flex-wrap: wrap;
   }
+
   .main-content .main-page-row .column-container .benefits h3 {
     margin: 16px 0;
   }
+
   .main-content .main-page-row .column-container .benefits div {
     width: 100%;
   }
+
   .main-content .main-page-row .column-container .ways {
     max-width: 328px;
   }
+
   .main-content .main-page-row .column-container .prev {
     left: -50px;
   }
+
   .main-content .main-page-row .column-container .next {
     right: -50px;
   }
 }
+
 @media (max-width: 992px) {
   .main-content .main-page-row .card-container {
     flex-direction: column;
     padding: 24px 16px 0;
     margin-bottom: 0;
   }
+
   .main-content .main-page-row .card-container .main-page-card {
     width: unset;
     margin: 0 0 24px;
   }
 }
+
 @media (max-width: 992px) and (max-width: 480px) {
   .main-content .main-page-row h1 {
     font-size: 32px;
   }
 }
+
 @media (max-width: 992px) {
   .main-content .main-page-row .single-container h1 {
     font-size: 24px;
   }
+
   .main-content .main-page-row .single-container .subheader {
     font-size: 16px;
   }
 }
+
 @media (max-width: 992px) {
   .main-content .container {
     flex-direction: column;
   }
+
   .main-content .container .row-container {
     width: 100%;
   }
+
   .main-content .container .row-container .single-container {
     width: unset;
     padding: 40px 16px 0;
   }
 }
+
 @media (max-width: 1499px) {
   .personalisation {
     order: 2;
   }
+
   .personalisation-image {
     order: 1;
   }
+
   .earn-more-image {
     order: 3;
   }
+
   .earn-more {
     order: 4;
   }
 }
+
 li {
   font-size: var(--text-size-s);
   margin-top: 16px;
 }
+
 .container {
   display: flex;
   flex-direction: row;
@@ -328,15 +378,18 @@ li {
   align-items: center;
   justify-content: center;
 }
+
 .error-message {
   color: var(--red-01);
   font-size: 14px;
   font-weight: 400;
   padding-left: 10px;
 }
+
 .take-to-lib {
   padding: 80px 0 0;
 }
+
 .wrapper {
   overflow: hidden;
   position: relative;
@@ -344,6 +397,7 @@ li {
   height: 248px;
   z-index: 1;
 }
+
 .slide {
   width: 588px;
   height: 248px;
@@ -355,6 +409,7 @@ li {
   transition: all 1s;
   position: relative;
 }
+
 .control {
   position: absolute;
   top: 35%;
@@ -362,6 +417,7 @@ li {
   height: 50px;
   z-index: 2;
 }
+
 .prev,
 .next {
   background-size: 22px;
@@ -369,22 +425,27 @@ li {
   background-repeat: no-repeat;
   cursor: pointer;
 }
+
 .prev {
   background-image: url(/img/arrow_left.svg);
   left: -100px;
 }
+
 .next {
   background-image: url(/img/arrow_right.svg);
   right: -100px;
 }
+
 .prev:active,
 .next:active {
   transform: scale(0.8);
 }
+
 blockquote {
   position: relative;
   text-align: left;
 }
+
 blockquote:after {
   box-sizing: border-box;
   content: "\201c";
@@ -397,6 +458,7 @@ blockquote:after {
   color: var(--blockquote-text-color);
   opacity: 56%;
 }
+
 .blockquote-separator {
   margin: 20px 0;
   border: none;
@@ -404,21 +466,25 @@ blockquote:after {
   height: 1px;
   background-color: var(--blockquote-separator-color);
 }
+
 .blockquote-author {
   text-align: left;
   line-height: 1.5;
   font-size: 1rem;
   width: auto;
 }
+
 .with-pattern {
   background-image: url(/img/pattern.svg);
   object-fit: contain;
 }
+
 .card-container {
   display: flex;
   flex-direction: row;
   margin-bottom: 10px;
 }
+
 .column-container {
   display: flex;
   flex-direction: column;
@@ -427,12 +493,15 @@ blockquote:after {
   align-items: center;
   justify-content: center;
 }
+
 .gray {
   background-color: var(--blockquote-separator-color);
 }
+
 .white {
   background-color: var(--white);
 }
+
 .subheader {
   font-size: 24px;
   text-align: center;
@@ -440,6 +509,7 @@ blockquote:after {
   color: var(--text-01);
   margin-bottom: 40px;
 }
+
 textarea {
   width: calc(100% - 16px);
   min-height: 119px;
@@ -447,6 +517,7 @@ textarea {
   border: solid 1px var(--border-normal);
   margin-top: 1.5rem;
 }
+
 .center {
   display: flex;
   width: 100%;
@@ -454,53 +525,66 @@ textarea {
   align-items: center;
   margin-bottom: 1rem;
 }
+
 @media (max-width: 992px) {
-  .row-container .single-container > h2 {
+  .row-container .single-container>h2 {
     font-size: 24px;
   }
 }
+
 @media (max-width: 992px) {
   .main-content .main-page-row {
     padding: 40px 0;
   }
+
   .main-content .main-page-row .row-container,
   .main-content .main-page-row .row-container .single-container,
   .main-content .main-page-row .column-container {
     width: 100%;
   }
+
   .main-content .main-page-row .column-container h1 {
     margin-bottom: 0 !important;
   }
+
   .main-content .main-page-row .card-container {
     flex-direction: column;
     padding: 24px 16px 0;
     margin-bottom: 0;
   }
+
   .main-content .main-page-row .card-container .main-page-card {
     width: unset;
     margin: 0 0 24px;
   }
+
   .main-content .main-page-row h1 {
     width: 90%;
     font-size: 28px;
   }
+
   .main-content .main-page-row .single-container h1 {
     font-size: 24px;
   }
+
   .main-content .main-page-row .single-container .subheader {
     font-size: 16px;
   }
+
   .main-content .container {
     flex-direction: column;
   }
+
   .main-content .container .row-container {
     width: 100%;
   }
+
   .main-content .container .row-container .single-container {
     width: unset;
     padding: 40px 16px 0;
   }
 }
+
 .main-page-row {
   display: flex;
   flex-direction: column;
@@ -510,22 +594,26 @@ textarea {
   align-items: center;
   justify-content: center;
   padding: 80px 0;
+
   &.ways-row {
     padding: 0;
   }
-  .clients-opinion{
+
+  .clients-opinion {
     color: var(--text-01);
     font-size: 48px;
     margin-bottom: 40px;
     text-align: center;
   }
 }
+
 .pageWrapper {
   width: 100%;
   color: var(--text-01);
   padding-bottom: 20px;
   margin-left: 300px;
 }
+
 .single-container {
   display: flex;
   flex-direction: column;
@@ -534,28 +622,34 @@ textarea {
   align-items: center;
   justify-content: center;
   width: 80%;
-  .header{
+
+  .header {
     color: var(--text-01);
     font-size: 48px;
     margin-bottom: 40px;
     text-align: center;
   }
 }
+
 .single-container p {
   margin-bottom: 32px;
   text-align: center;
 }
+
 .single-container p a {
   color: var(--red-01);
 }
+
 .single-container h1 {
   width: 80%;
   margin-bottom: 12px;
   line-height: 1.25;
 }
+
 .single-container img {
   margin-bottom: 24px;
 }
+
 .container {
   display: flex;
   flex-direction: row;
@@ -564,15 +658,18 @@ textarea {
   align-items: center;
   justify-content: center;
 }
-.single-container > h2 {
+
+.single-container>h2 {
   font-size: 32px;
   margin-bottom: 8px;
   color: var(--white);
 }
+
 .with-pattern {
   background-image: url(/img/pattern.svg);
   object-fit: contain;
 }
+
 .community-btn {
   padding: 6px 16px;
   border-radius: 4px;
@@ -581,11 +678,13 @@ textarea {
   line-height: 20px;
   border: solid 1px var(--gray-04);
 }
+
 .card-container {
   display: flex;
   flex-direction: row;
   margin-bottom: 40px;
 }
+
 .column-container {
   display: flex;
   flex-direction: column;
@@ -593,13 +692,15 @@ textarea {
   width: 80%;
   align-items: center;
   justify-content: center;
-  .header_h2{
+
+  .header_h2 {
     color: var(--text-01);
     font-size: 48px;
     margin-bottom: 40px;
     text-align: center;
   }
 }
+
 .row-container {
   display: flex;
   flex-wrap: nowrap;
@@ -607,6 +708,7 @@ textarea {
   align-items: center;
   justify-content: center;
 }
+
 .main-page-card {
   width: 100%;
   max-width: 316px;
@@ -616,14 +718,17 @@ textarea {
   background-color: var(--white);
   margin: 0 12px;
 }
+
 .main-page-card .header {
   display: flex;
   width: 100%;
 }
+
 .main-page-card .header img {
   float: right;
   padding-left: 10px;
 }
+
 .main-page-card .header h3 {
   font-size: 24px;
   font-weight: 700;
@@ -632,45 +737,55 @@ textarea {
   float: left;
   width: 100%;
 }
+
 .main-page-card .content {
   font-size: 16px;
   line-height: 1.5;
   color: var(--text-01);
   margin-bottom: 0;
 }
+
 .main-page-card .hide-on-desktop {
   display: none;
 }
+
 @media (max-width: 480px) {
   .main-page-card .hide-on-desktop {
     display: block;
   }
 }
+
 .main-page-card .hide-on-mobile {
   display: block;
 }
+
 @media (max-width: 480px) {
   .main-page-card .hide-on-mobile {
     display: none;
   }
 }
+
 @media (max-width: 480px) {
   .main-page-card {
     padding: 28px 16px 24px;
   }
 }
+
 ul {
   margin-left: 20px;
 }
+
 ul li {
   margin-bottom: 16px;
 }
+
 .subheader {
   font-size: 24px;
   text-align: center;
   color: var(--text-01);
   margin-bottom: 40px;
 }
+
 textarea {
   width: calc(100% - 16px);
   min-height: 119px;
@@ -678,45 +793,57 @@ textarea {
   border-radius: 4px;
   border: solid 1px var(--border-normal);
 }
+
 button {
   cursor: pointer;
 }
+
 .main-content {
   display: flex;
   flex-direction: column;
 }
+
 textarea {
   font-size: 16px;
   resize: none;
 }
+
 .progress {
   margin: 0 auto;
 }
+
 .dark {
   color: var(--white);
   background-color: var(--black-01);
 }
+
 .dark .selected,
 .dark a {
   color: var(--white);
 }
+
 .dark p {
   color: var(--copy-color);
 }
+
 .hidden {
   display: none;
 }
+
 .mb-16p {
   margin-bottom: 16px;
 }
+
 [data-state*="responsive.mobile"][data-state~="hamburger.hamburger_open"] {
   .sandbox-iframe {
     pointer-events: none;
   }
 }
+
 a.active {
   background-color: var(--hamburger-active-link);
   font-weight: bold;
+
   &::before {
     content: "";
     display: inline-block;
@@ -733,6 +860,6 @@ a.active {
 
 [data-state*="responsive.mobile"] {
   .pageWrapper {
-    margin-left:0;
+    margin-left: 0;
   }
-}
+}
\ No newline at end of file
diff --git a/src/main.jsx b/src/main.jsx
index b027dbe5..362dc987 100644
--- a/src/main.jsx
+++ b/src/main.jsx
@@ -3,6 +3,7 @@ import { QueryClient, QueryClientProvider } from "react-query";
 import { BrowserRouter } from "react-router-dom";
 import ReactDOM from "react-dom";
 import "./index.scss";
+import "./themes.scss";
 import App from "./App";
 import ScrollToTop from "./global-functions/ScrollToTop";
 
diff --git a/src/routes-data/sidebar-routes.jsx b/src/routes-data/sidebar-routes.jsx
index 4fb674f6..43bd1889 100644
--- a/src/routes-data/sidebar-routes.jsx
+++ b/src/routes-data/sidebar-routes.jsx
@@ -108,7 +108,7 @@ const ImplementDropdown = (props) => {
     return (
         <div className={styles.dropdown}>
             <div className={`${styles.dropdownBtn} ${isActive ? styles.boldText : ''}`} onClick={handleToggleDropdown}>
-                Implement Now
+                <span>{props.route.label}</span>
                 <span className={`${styles.arrow} ${isActive ? styles.down : ''}`} />
             </div>
             {isActive && (
diff --git a/src/themes.scss b/src/themes.scss
index b777880c..53c9b4ac 100644
--- a/src/themes.scss
+++ b/src/themes.scss
@@ -32,4 +32,4 @@
     --text-align-left: start;
     --text-align-right: right;
     --text-align-center: center;
-}
\ No newline at end of file
+}