diff --git a/apps/mina-sidor-fa/src/app/pages/start/start.component.html b/apps/mina-sidor-fa/src/app/pages/start/start.component.html
index cd79f2c..c720603 100644
--- a/apps/mina-sidor-fa/src/app/pages/start/start.component.html
+++ b/apps/mina-sidor-fa/src/app/pages/start/start.component.html
@@ -1,42 +1,31 @@
-<msfa-layout>
-  <section class="start">
-    <!-- User not logged in -->
-    <ng-container *ngIf="isStandardUser">
-      <digi-typography>
-        <h1>Välkommen {{ userFullName }}</h1>
-        <p>Det verkar som att du inte har fått din behörighet ännu, kontakta din administratör för att få tillgång till tjänsten.</p>
-      </digi-typography>
-    </ng-container>
-
-    <!-- User logged in -->
-    <ng-container *ngIf="!isStandardUser">
-      <digi-typography>
-        <h1>Välkommen {{ userFullName }}</h1>
-        <p>
-          Detta är Arbetsförmedlingens nya plattform för våra fristående aktörer, 
-          här kommer du bland annat kunna sköta den dagliga kontakten med 
-          arbetssökande och arbetsförmedlingen. 
-          <br/><br/>
-          Vi kommer successivt att 
-          implementera nytt innehåll, förbättringar och uppdateringar.
-          Målet är helt enkelt att underlätta ditt dagliga arbete!
-        </p>
-      </digi-typography>
-      <div class="start__wrapper">
-        <div class="start__notifications">
-          <digi-info-card af-heading="Nya deltagare" af-heading-level="h2" af-type="info">
-            <p>
-              Det har kommit in nya avrop med deltagare, länken nedan tar dig till fliken Nya deltagare. Du finner den
-              också i vänster menyn på sidan
-            </p>
-  
-            <digi-ng-link-internal afText="Till nya deltagare" afRoute="/nya-deltagare"></digi-ng-link-internal>
-          </digi-info-card>
-        </div>
-  
-        <div class="start__alerts"></div>
-        <div class="start__statistics"></div>
-      </div>
-    </ng-container>
-  </section>
+<msfa-layout *ngIf="userRoles$ | async as userRoles; else loadingRef">
+  <digi-typography>
+    <section class="start">
+      <header class="start__header">
+        <h1>Välkommen {{ userFullName$ | async }}</h1>
+        <ng-container *ngIf="isAuthorizedUser(userRoles); else unauthorizedRef">
+          <p>
+            Detta är Arbetsförmedlingens nya plattform för våra fristående aktörer, här kommer du bland annat kunna
+            sköta den dagliga kontakten med arbetssökande och arbetsförmedlingen.
+          </p>
+          <p>
+            Vi kommer successivt att implementera nytt innehåll, förbättringar och uppdateringar. Målet är helt enkelt
+            att underlätta ditt dagliga arbete!
+          </p>
+        </ng-container>
+        <ng-template #unauthorizedRef>
+          <p>
+            Det verkar som att du inte har fått din behörighet ännu, kontakta din administratör för att få tillgång till
+            tjänsten.
+          </p>
+        </ng-template>
+      </header>
+    </section>
+  </digi-typography>
 </msfa-layout>
+
+<ng-template #loadingRef>
+  <div class="msfa__loading-wrapper msfa__loading-wrapper--full-screen">
+    <digi-icon-spinner class="msfa__spinner"></digi-icon-spinner>
+  </div>
+</ng-template>
diff --git a/apps/mina-sidor-fa/src/app/pages/start/start.component.scss b/apps/mina-sidor-fa/src/app/pages/start/start.component.scss
index b039413..223e1ad 100644
--- a/apps/mina-sidor-fa/src/app/pages/start/start.component.scss
+++ b/apps/mina-sidor-fa/src/app/pages/start/start.component.scss
@@ -1,28 +1,2 @@
-@import 'variables/gutters';
 .start {
-  &__wrapper {
-    margin-top: $digi--layout--gutter--l;
-    display: grid;
-    grid-template-rows: auto;
-    grid-template-areas:
-      'header header'
-      'notifications alerts'
-      'statistics statistics ';
-    gap: $digi--layout--gutter--l;
-  }
-
-  &__notifications {
-    grid-area: notifications;
-  }
-
-  &__alerts {
-    grid-area: alerts;
-    display: flex;
-    flex-direction: column;
-    gap: var(--digi--layout--gutter);
-  }
-
-  &__statistics {
-    grid-area: statistics;
-  }
 }
diff --git a/apps/mina-sidor-fa/src/app/pages/start/start.component.ts b/apps/mina-sidor-fa/src/app/pages/start/start.component.ts
index 7a03ace..48ce203 100644
--- a/apps/mina-sidor-fa/src/app/pages/start/start.component.ts
+++ b/apps/mina-sidor-fa/src/app/pages/start/start.component.ts
@@ -1,8 +1,7 @@
 import { ChangeDetectionStrategy, Component } from '@angular/core';
-import { UnsubscribeDirective } from '@msfa-directives/unsubscribe.directive';
-import { RoleEnum } from '@msfa-enums/role.enum';
-import { mapResponseToRoles, Role } from '@msfa-models/role.model';
+import { Role } from '@msfa-models/role.model';
 import { UserService } from '@msfa-services/api/user.service';
+import { Observable } from 'rxjs';
 import { filter, map } from 'rxjs/operators';
 
 @Component({
@@ -11,27 +10,16 @@ import { filter, map } from 'rxjs/operators';
   styleUrls: ['./start.component.scss'],
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
-export class StartComponent extends UnsubscribeDirective {
-  private _userName: string;
-  private _userRoles: Role[];
+export class StartComponent {
+  userFullName$: Observable<string> = this.userService.user$.pipe(
+    filter(user => !!user),
+    map(userName => userName.fullName)
+  );
+  userRoles$: Observable<Role[]> = this.userService.userRoles$;
 
-  constructor(private userService: UserService) {
-    super();
-    super.unsubscribeOnDestroy(
-      this.userService.user$.pipe(
-        filter(user => !!user),
-        map(user => user)
-      ).subscribe(user => {
-        this._userName = user.fullName;
-        this._userRoles = mapResponseToRoles(user.roles);
-      }));
-  }
+  constructor(private userService: UserService) {}
 
-  get isStandardUser(): boolean {
-    return this._userRoles?.some(role => role.type === RoleEnum.MSFA_Standard);
+  isAuthorizedUser(userRoles: Role[]): boolean {
+    return !!userRoles.length;
   }
-  get userFullName(): string {
-    return this._userName;
-  }
-
 }
diff --git a/apps/mina-sidor-fa/src/app/pages/start/start.module.ts b/apps/mina-sidor-fa/src/app/pages/start/start.module.ts
index 5b9f6b1..ae827f6 100644
--- a/apps/mina-sidor-fa/src/app/pages/start/start.module.ts
+++ b/apps/mina-sidor-fa/src/app/pages/start/start.module.ts
@@ -1,6 +1,4 @@
 import { DigiNgCardModule } from '@af/digi-ng/_card/card';
-import { DigiNgLinkInternalModule } from '@af/digi-ng/_link/link-internal';
-import { DigiNgNotificationAlertModule } from '@af/digi-ng/_notification/notification-alert';
 import { CommonModule } from '@angular/common';
 import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
 import { RouterModule } from '@angular/router';
@@ -15,8 +13,6 @@ import { StartComponent } from './start.component';
     RouterModule.forChild([{ path: '', component: StartComponent }]),
     LayoutModule,
     DigiNgCardModule,
-    DigiNgNotificationAlertModule,
-    DigiNgLinkInternalModule,
   ],
 })
 export class StartModule {}
diff --git a/apps/mina-sidor-fa/src/styles/styles.scss b/apps/mina-sidor-fa/src/styles/styles.scss
index df76bba..f2bf018 100644
--- a/apps/mina-sidor-fa/src/styles/styles.scss
+++ b/apps/mina-sidor-fa/src/styles/styles.scss
@@ -4,10 +4,6 @@
 @import 'mixins/link';
 
 @keyframes spinning {
-  from {
-    transform: rotate(0deg);
-  }
-
   to {
     transform: rotate(360deg);
   }
@@ -73,9 +69,24 @@ dl {
     font-size: 0.875rem !important;
   }
 
+  &__loading-wrapper {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    z-index: 1000;
+
+    &--full-screen {
+      position: absolute;
+      top: 0;
+      right: 0;
+      bottom: 0;
+      left: 0;
+      background-color: rgba(255, 255, 255, 0.5);
+    }
+  }
   &__spinner {
     display: inline-flex;
-    animation: spinning infinite 0.6s linear;
+    animation: spinning 1s linear infinite;
   }
 
   &__digi-icon {