diff --git a/src/app/components/home/home-page/home-page.component.html b/src/app/components/home/home-page/home-page.component.html
index e8562e801ff7bd32a6232621e53f8cbbca58d351..cdf649c1930e22d6310c42f45533fe5ddb02d776 100644
--- a/src/app/components/home/home-page/home-page.component.html
+++ b/src/app/components/home/home-page/home-page.component.html
@@ -32,6 +32,7 @@
     </mat-card>
   </div>
 
+  <!--
   <h2>
     <span class="feedback">
       <a class="info"
@@ -42,6 +43,7 @@
       </a>
     </span>
   </h2>
+  -->
 
   <button id="live_announcer-button"
           tabIndex="-1"
diff --git a/src/app/components/home/home-page/home-page.component.scss b/src/app/components/home/home-page/home-page.component.scss
index 11b2ccc26c68af1c8eb9d165f35298e98406ab16..a8c1e2067414cd8056b95130ba1719fb1d8d06f1 100644
--- a/src/app/components/home/home-page/home-page.component.scss
+++ b/src/app/components/home/home-page/home-page.component.scss
@@ -1,7 +1,8 @@
 .outer {
   width: 80%;
   max-width: 300px;
-  background-color: var(--surface);
+  background-color: var(--background);
+  box-shadow: none;
 }
 
 .main-heading-primary {
diff --git a/src/app/components/home/new-landing/new-landing.component.scss b/src/app/components/home/new-landing/new-landing.component.scss
index 5a74df385b10781080045660dfa8823dbae9a177..5d6f0b2447a8e3de1e649a9db36ee65f53535b3c 100644
--- a/src/app/components/home/new-landing/new-landing.component.scss
+++ b/src/app/components/home/new-landing/new-landing.component.scss
@@ -4,8 +4,8 @@
   border-radius: 5px;
   margin: 10% 0 2% 0;
   font-size: large;
-  background-color: var(--surface);
-  color: var(--on-surface);
+  background-color: var(--background);
+  color: var(--on-background);
 }
 
 .add {
diff --git a/src/app/components/shared/comment/comment.component.html b/src/app/components/shared/comment/comment.component.html
index 28af9e855613f0fd379d738bb626670e0335dd66..6230d12e740eb720ab6594223c8a62388cc73289 100644
--- a/src/app/components/shared/comment/comment.component.html
+++ b/src/app/components/shared/comment/comment.component.html
@@ -1,8 +1,13 @@
 <mat-card id="comment-card" class="border"
           [ngClass]="{'highlighted': comment.highlighted, '': !comment.highlighted,
           'moderator': moderator,
+          'border-notMarked': comment.correct === 0 && comment.bookmark === false && comment.favorite === false && !comment.answer && comment.creatorId !== user.id,
+          'border-ownQuestion': comment.creatorId === user.id && comment.correct === 0 && comment.bookmark === false && comment.favorite === false && !comment.answer,
+          'border-answer': comment.answer && comment.correct === 0 && comment.bookmark === false && comment.favorite === false,
           'border-correct': comment.correct === 1,
-          'border-wrong': comment.correct === 2
+          'border-wrong': comment.correct === 2, 
+          'border-bookmark': comment.bookmark === true, 
+          'border-favorite': comment.favorite === true
           }"
           [@slide]="slideAnimationState"
           (@slide.done)="changeSlideState()">
diff --git a/src/app/components/shared/comment/comment.component.scss b/src/app/components/shared/comment/comment.component.scss
index 99b8a839e06fd6ac5ef61cb4eab257bc802f1f7a..303434bb761eb353e226efeb638b8d28e686c401 100644
--- a/src/app/components/shared/comment/comment.component.scss
+++ b/src/app/components/shared/comment/comment.component.scss
@@ -52,7 +52,7 @@ mat-card-content > :first-child {
 }
 
 .bookmark-icon {
-  color: var(--red);
+  color: var(--magenta);
 }
 
 .wrong-icon {
@@ -139,6 +139,21 @@ mat-card-content > :first-child {
   &-wrong{
     @include card-box-shadow(var(--red));
   }
+  &-bookmark{
+    @include card-box-shadow(var(--magenta));
+  }
+  &-favorite{
+    @include card-box-shadow(var(--yellow));
+  }
+  &-notMarked{
+    @include card-box-shadow(var(--grey));
+  }
+  &-answer{
+    @include card-box-shadow(var(--primary));
+  }
+  &-ownQuestion{
+    @include card-box-shadow(var(--purple));
+  }
   &-bonus{
     @include card-box-shadow(var(--yellow));
   }
diff --git a/src/theme/blue-theme/blueTheme.const.ts b/src/theme/blue-theme/blueTheme.const.ts
index fc6581f68e70fb4de5b3df55c1f0eaf9b80c2ffd..e8e379ef7d3a292b3b4fc4842e70342ec75ce6e0 100644
--- a/src/theme/blue-theme/blueTheme.const.ts
+++ b/src/theme/blue-theme/blueTheme.const.ts
@@ -23,8 +23,9 @@ export const blue = {
   '--yellow': '#FFD54F',
   '--blue': '#3f51b5',
   '--purple': '#9c27b0',
+  '--magenta': '#ea0a8e',
   '--light-green': '#80ba24',
-  '--grey': '#BDBDBD',
+  '--grey': 'slategrey',
   '--grey-light': '#EEEEEE',
   '--black': '#212121',
   '--moderator': 'darkred'
diff --git a/src/theme/dark-theme/darkTheme.const.ts b/src/theme/dark-theme/darkTheme.const.ts
index 7cd195e52e4cda842bbfcc4399efaba144af682a..365fbe1570585f31d86f8ede81ca8a2ed9cc2733 100644
--- a/src/theme/dark-theme/darkTheme.const.ts
+++ b/src/theme/dark-theme/darkTheme.const.ts
@@ -26,8 +26,9 @@ export const dark = {
   '--yellow': 'yellow',
   '--blue': '#3f51b5',
   '--purple': '#9c27b0',
+  '--magenta': '#ea0a8e',
   '--light-green': '#80ba24',
-  '--grey': '#BDBDBD',
+  '--grey': 'slategrey',
   '--grey-light': '#9E9E9E',
   '--black': 'black',
   '--moderator': 'maroon'
diff --git a/src/theme/high-contrast-theme/highContrastTheme.const.ts b/src/theme/high-contrast-theme/highContrastTheme.const.ts
index bb11ab8c351583856e9ec4c9b683e02fe15dfbd4..e9b6e254f6b6100a7784099eda7f077b9d064551 100644
--- a/src/theme/high-contrast-theme/highContrastTheme.const.ts
+++ b/src/theme/high-contrast-theme/highContrastTheme.const.ts
@@ -26,6 +26,7 @@ export const highcontrast = {
   '--yellow': '#e9d533',
   '--blue': '#3833e9',
   '--purple': '#e933e2',
+  '--magenta': '#ea0a8e',
   '--light-green': '#33e98d',
   '--grey': '#7e7e7e',
   '--grey-light': '#9c9c9c',
diff --git a/src/theme/light-theme/light-theme.ts b/src/theme/light-theme/light-theme.ts
index c26611a07aaa80341b53f6ed7d775e4838805d03..afec344e3682c6dec64793625aca256fe5148941 100644
--- a/src/theme/light-theme/light-theme.ts
+++ b/src/theme/light-theme/light-theme.ts
@@ -26,8 +26,9 @@ export const arsnova = {
   '--yellow': 'red',
   '--blue': '#002878',
   '--purple': '#9c27b0',
+  '--magenta': '#ea0a8e',
   '--light-green': 'lightgreen',
-  '--grey': '#BDBDBD',
+  '--grey': 'slategrey',
   '--grey-light': '#EEEEEE',
   '--black': '#000000',
   '--moderator': 'lightsalmon'
diff --git a/src/theme/purple-theme/purpleTheme.const.ts b/src/theme/purple-theme/purpleTheme.const.ts
index 494418293f33ae7d60b34e4dad3f59aa666cddb5..880063da1b140a73ccae68f541c24b54c287cabd 100644
--- a/src/theme/purple-theme/purpleTheme.const.ts
+++ b/src/theme/purple-theme/purpleTheme.const.ts
@@ -26,8 +26,9 @@ export const purple = {
   '--yellow': 'red',
   '--blue': 'blue',
   '--purple': 'purple',
+  '--magenta': '#ea0a8e',
   '--light-green': 'lightgreen',
-  '--grey': 'grey',
+  '--grey': 'slategrey',
   '--grey-light': 'lightgrey',
   '--black': 'black',
   '--moderator': 'lightsalmon'