diff --git a/client/src/app/owners/owner-doorboard.component.html b/client/src/app/owners/owner-doorboard.component.html
index ed8c087..f24b52d 100644
--- a/client/src/app/owners/owner-doorboard.component.html
+++ b/client/src/app/owners/owner-doorboard.component.html
@@ -17,13 +17,14 @@ <h3>{{this.owner.name}}</h3>
         <!--Each message is its own mat-card-->
         <div fxFlex="column" class="list-of-notes">
           <mat-card fxLayout="row wrap" class="note-card">
-            <p class="timestamp">{{note.timestamp}}<br/>
-            {{note.message}}</p>
+            <mat-list-item>
+              <p matLine class="timestamp">{{note.timestamp}}</p>
+              <p matLine class="message">{{note.message}}</p>
+            </mat-list-item>
           </mat-card>
         </div>
       </mat-list-item>
     </mat-list>
   </div>
-
 </div>
 
diff --git a/client/src/app/owners/owner-doorboard.component.scss b/client/src/app/owners/owner-doorboard.component.scss
index 0c4dddb..2ea1cb6 100644
--- a/client/src/app/owners/owner-doorboard.component.scss
+++ b/client/src/app/owners/owner-doorboard.component.scss
@@ -2,6 +2,7 @@
   font-size: 1.5em;
   padding-bottom: 2rem;
   overflow-wrap: break-word;
+  padding-top: 10px;
 }
 .add-button-container{
   padding-top: 1rem;
@@ -47,4 +48,10 @@ h3{
   overflow-wrap: break-word;
 }
 
+.timestamp{
+  color: black;
+}
 
+.message{
+  color: black;
+}