diff --git a/src/app/components/shared/comment-list/comment-list.component.html b/src/app/components/shared/comment-list/comment-list.component.html
index 1bbcc931f61b883c481626c181b9d8dcfec9b32c..4e8925aeb0f328932718eb4d5631c4c710421d75 100644
--- a/src/app/components/shared/comment-list/comment-list.component.html
+++ b/src/app/components/shared/comment-list/comment-list.component.html
@@ -35,13 +35,13 @@
       <mat-icon class="searchBarIcon">filter_list</mat-icon>
     </button>
 
-    <button id="pause-comments" mat-fab aria-labelledby="pause" class="actionButton"
+    <button id="pause-comments" mat-fab aria-labelledby="pause" class="freezeButton"
             *ngIf="!searchBox.value && !search && !freeze" (click)="pauseCommentStream()"
             matTooltip="{{ 'comment-list.pause-comments' | translate }}">
       <mat-icon class="freezeIcon">pause</mat-icon>
     </button>
 
-    <button id="play-comments" mat-fab aria-labelledby="play" class="actionButton"
+    <button id="play-comments" mat-fab aria-labelledby="play" class="freezeButton"
             *ngIf="!searchBox.value && !search && freeze" (click)="playCommentStream()"
             matTooltip="{{ 'comment-list.play-comments' | translate }}">
       <mat-icon class="freezeIcon">play_arrow</mat-icon>
diff --git a/src/app/components/shared/comment-list/comment-list.component.scss b/src/app/components/shared/comment-list/comment-list.component.scss
index f5b1dc46f61a0445e6731018308459f195329814..01de8e6d5e441f45874f2cc55632e0d3719190e2 100644
--- a/src/app/components/shared/comment-list/comment-list.component.scss
+++ b/src/app/components/shared/comment-list/comment-list.component.scss
@@ -71,6 +71,13 @@ app-comment {
   background-color: var(--primary);
 }
 
+.freezeButton {
+  width: 40px;
+  height: 40px;
+  margin: 0 2% 0 5%;
+  background-color: var(--secondary);
+}
+
 .actionIcon {
   transform: scale(1.5);
   color: var(--surface)