diff --git a/src/frigate-card.scss b/src/frigate-card.scss
index 38745d3f..b2dbe57b 100644
--- a/src/frigate-card.scss
+++ b/src/frigate-card.scss
@@ -54,11 +54,6 @@
   border-color: var(--primary-color);
 }
 
-.frigate-card-container {
-  position: relative;
-  overflow: hidden;
-}
-
 .frigate-card-navbar {
   position: absolute;
   width: 50px;
@@ -89,7 +84,6 @@ ha-icon-button.button {
 
 ha-card {
   display: flex;
-  justify-content: center;
   flex-direction: column;
   margin: auto;
   overflow: hidden;
diff --git a/src/frigate-card.ts b/src/frigate-card.ts
index c7a8cf9c..16670bca 100644
--- a/src/frigate-card.ts
+++ b/src/frigate-card.ts
@@ -482,10 +482,7 @@ export class FrigateCard extends LitElement {
       return this._showError(localize('common.show_error'));
     }
     return html`
-      <div 
-        class="frigate-card-container"
-        @click=${this._interactionHandler}
-      >
+      <ha-card @click=${this._interactionHandler}>
         ${this._renderNavigationBar()}
         ${this._viewMode == FrigateCardView.CLIPS ?
           html`<div class="frigate-card-gallery">
@@ -509,7 +506,7 @@ export class FrigateCard extends LitElement {
         }
         ${this._renderStatusBar()}
         ${this._renderLiveViewer()}
-      </div>`;
+      </ha-card>`;
   }
 
   // private _handleAction(ev: ActionHandlerEvent): void {