diff --git a/src/app/app-routing.module.ts b/src/app/app-routing.module.ts
index 25c60d7e53a92adbb914eb9994215c9e37ea8a92..29f2664c55660f54576e8eae8e9921e93f62505f 100644
--- a/src/app/app-routing.module.ts
+++ b/src/app/app-routing.module.ts
@@ -36,6 +36,6 @@ const routes: Routes = [
 
 @NgModule({
   imports: [RouterModule.forRoot(routes)],
-  exports: [RouterModule]
+  exports: [RouterModule],
 })
-export class AppRoutingModule { }
+export class AppRoutingModule {}
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index 00354ea1f8d0584aac5c518a12780c67a6d2957f..0886d4fc332f6e2b6c73bac5cf1fb737dd9aed5c 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -57,6 +57,6 @@ import { MemberDetailsComponent } from './components/members/member-details/memb
     MatSelectModule,
   ],
   providers: [],
-  bootstrap: [AppComponent]
+  bootstrap: [AppComponent],
 })
-export class AppModule { }
+export class AppModule {}
diff --git a/src/app/components/routes/route/add-route-form/add-route-form.component.html b/src/app/components/routes/route/add-route-form/add-route-form.component.html
index 734d49cb6e807ff04896f19dd52262153def15e3..6d17938225ffd1c299fbfd7ad6c007aefc23dee9 100644
--- a/src/app/components/routes/route/add-route-form/add-route-form.component.html
+++ b/src/app/components/routes/route/add-route-form/add-route-form.component.html
@@ -3,7 +3,7 @@
 <form [formGroup]="addRouteForm">
   <mat-form-field appearance="fill">
     <mat-label>Route name</mat-label>
-    <input formControlName="routeName" matInput />
+    <input class="input-name-field" formControlName="routeName" matInput />
   </mat-form-field>
 
   <ng-container *ngIf="addRouteForm.controls['routeName'] as routeName">
diff --git a/src/app/components/routes/route/add-route-form/add-route-form.component.scss b/src/app/components/routes/route/add-route-form/add-route-form.component.scss
index 34fbfb20f59a308e332d1e024f0d607bf2f6499f..cd0db75b0a30071a4c6b905b7550926f0718f204 100644
--- a/src/app/components/routes/route/add-route-form/add-route-form.component.scss
+++ b/src/app/components/routes/route/add-route-form/add-route-form.component.scss
@@ -17,13 +17,14 @@ mat-divider {
 
 .error {
   color: red;
+  font-size: 1.1rem;
 }
 
 form {
   font-size: 1.4rem;
   border: 2px solid darkgrey;
   background-color: white;
-  width: 20%;
+  width: 27%;
   margin: 30px auto;
   padding: 20px;
 }
@@ -42,3 +43,5 @@ form * {
 .send-btn {
   margin: 0 auto;
 }
+
+
diff --git a/src/app/components/routes/route/add-route-form/add-route-form.component.ts b/src/app/components/routes/route/add-route-form/add-route-form.component.ts
index 50b996e85752b6a81d8d71d1ebaa9c4d0dd69dff..a76171439845b79224bba8d5229c1a46a731e9bf 100644
--- a/src/app/components/routes/route/add-route-form/add-route-form.component.ts
+++ b/src/app/components/routes/route/add-route-form/add-route-form.component.ts
@@ -34,7 +34,7 @@ export class AddRouteFormComponent implements OnInit {
         difficultyLevelEnum: this.addRouteForm.get('difficultyLevel')?.value,
       };
       this.routeService.addRoute(route).subscribe();
-      this.router.navigateByUrl('/routes');
+      this.router.navigateByUrl('/members', {skipLocationChange: true}).then(() => this.router.navigate(['/routes']));
     }
   }
 }
diff --git a/src/app/components/routes/route/route-detail-page/route-detail-page.component.scss b/src/app/components/routes/route/route-detail-page/route-detail-page.component.scss
index c5c5739f6c32273073af0c85a86093dc18ef058b..cbfdfffb7e5b5289adbcf87822ebd7adaafa92ee 100644
--- a/src/app/components/routes/route/route-detail-page/route-detail-page.component.scss
+++ b/src/app/components/routes/route/route-detail-page/route-detail-page.component.scss
@@ -27,6 +27,7 @@ mat-divider {
 
   mat-card-title {
     font-size: 2rem;
+    margin-top: 13px;
     margin-bottom: 40px;
   }
 
diff --git a/src/app/components/routes/route/route.component.html b/src/app/components/routes/route/route.component.html
index fa165e13682ebff1eb76d0558473b6a78fee53d7..ce8a6ee3676a80b7666b523bfc2629120c3774a6 100644
--- a/src/app/components/routes/route/route.component.html
+++ b/src/app/components/routes/route/route.component.html
@@ -1,7 +1,7 @@
 <mat-card class="route">
   <span class="name-wrapper" [routerLink]="['/routeDetails', route.id]">
     <mat-icon>info</mat-icon>
-    <span>Route: {{ route?.name }}</span>
+    <span>{{ route?.name }}</span>
   </span>
   <!--  Difficulty Level: {{ route.difficultyLevel }}-->
   <span class="delete-wrapper">
diff --git a/src/app/components/routes/route/route.component.scss b/src/app/components/routes/route/route.component.scss
index b1466bbd8d9ee7d704084c50f4d46caf9959f667..c1a16766e1ba1a88cf2bb4180ea1ce9613e88a14 100644
--- a/src/app/components/routes/route/route.component.scss
+++ b/src/app/components/routes/route/route.component.scss
@@ -1,17 +1,24 @@
 .route {
   font-size: 1.1rem;
   margin: 20px auto;
-  height: 45px;
+  height: 65px;
   width: 900px;
-  margin-bottom: 20px;
+  margin-bottom: 10px;
   display: flex;
   justify-content: space-between;
+  padding: 0;
+  color: #444444;
+}
+
+.route:first-of-type {
+  margin-top: 0;
 }
 
 .delete-btn {
   width: 100px;
   height: 38px;
   cursor: pointer;
+  margin: auto 10px;
 }
 
 .delete-wrapper {
@@ -26,13 +33,27 @@ mat-icon {
 
 .name-wrapper {
   display: flex;
-  justify-content: center;
+  justify-content: flex-start;
   align-items: center;
   cursor: pointer;
+  font-size: 1.5rem;
+  min-width: 320px;
+
+  mat-icon {
+    display: flex;
+    justify-content: flex-start;
+    align-items: center;
+    padding-left: 14px;
+    padding-right: 14px;
+    border-right: 2px solid #efeded;
+    border-radius: 5px 0 0 5px;
+    height: 100%;
+    margin-left: 3px;
+    color: darkgrey;
+  }
 
   span {
     margin-left: 13px;
-    font-size: 1.5rem;
   }
 }
 
diff --git a/src/app/components/routes/route/route.component.ts b/src/app/components/routes/route/route.component.ts
index 46f94ad231ded097f7042c736f2326c682fe1e5b..e000fac7cbafd68362dbfaa2607386c7ed1c156e 100644
--- a/src/app/components/routes/route/route.component.ts
+++ b/src/app/components/routes/route/route.component.ts
@@ -17,7 +17,7 @@ export class RouteComponent implements OnInit {
 
   deleteRoute(route: Route): void {
     this.routeService.deleteRoute(route.id).subscribe();
-    // this.routeService.deleteRoute(route);
-    // this.router.navigateByUrl('/routes');
+    // redirect to "dummy" and then back to this component to achieve a "refresh" without site reload
+    this.router.navigateByUrl('/members', {skipLocationChange: true}).then(() => this.router.navigate(['/routes']));
   }
 }
diff --git a/src/app/components/routes/routes.component.html b/src/app/components/routes/routes.component.html
index 972065452009ebb4e4b9897b22eb824bb968a76f..2ed3ea8c63abf5109b95bb8b10a8e5f2a3abb240 100644
--- a/src/app/components/routes/routes.component.html
+++ b/src/app/components/routes/routes.component.html
@@ -1,8 +1,9 @@
-<button mat-button class='add-route-btn' routerLink='/routesAddForm'>
-  Add +
+<button mat-raised-button class="add-route-btn" routerLink="/routesAddForm">
+  + Add
 </button>
-<mat-list role='list'>
-  <mat-list-item *ngFor='let route of routes' role='listitem'>
-    <app-route [route]='route'></app-route>
+
+<mat-list role="list">
+  <mat-list-item *ngFor="let route of routes" role="listitem">
+    <app-route [route]="route"></app-route>
   </mat-list-item>
 </mat-list>
diff --git a/src/app/components/routes/routes.component.scss b/src/app/components/routes/routes.component.scss
index 0ec277b6904804a7bef22065cfb96c8d1621a77b..d4a42083ea0cc883b108aa4c813f755b59112dab 100644
--- a/src/app/components/routes/routes.component.scss
+++ b/src/app/components/routes/routes.component.scss
@@ -2,7 +2,7 @@ mat-list * {
   display: flex;
   align-items: center;
   justify-content: center;
-  margin: 60px auto;
+  margin: 40px auto;
 }
 
 button {
@@ -12,11 +12,14 @@ button {
 }
 
 .add-route-btn {
-  font-size: 1.3rem;
+  font-size: 1.1rem;
   display: flex;
   justify-content: center;
   align-items: center;
-  width: 200px;
-  height: 50px;
+  width: 100px;
+  height: 38px;
   cursor: pointer;
+  margin-top: 40px;
+  margin-bottom: -10px;
+  margin-left: 400px;
 }
diff --git a/src/styles.scss b/src/styles.scss
index 233abbe5561d4af7ae7215ec43c476994f57aea1..21a00369e45c5b12fb7af9f65322295c4d3e18cf 100644
--- a/src/styles.scss
+++ b/src/styles.scss
@@ -1,7 +1,7 @@
 /* You can add global styles to this file, and also import other style files */
 
-html, body { height: 100%; margin: 20px; box-sizing: border-box; font-size: 16px}
-body { margin: 0; font-family: 'Segoe UI', Roboto, "Helvetica Neue", sans-serif; }
+html, body { height: 90vh; margin: 20px; box-sizing: border-box; font-size: 16px}
+body { margin: 0; font-family: 'Segoe UI', Roboto, "Helvetica Neue", sans-serif; background-color: #efeded}
 
 .active {
   background-color: darkred;