diff --git a/src/frontend/app/ui/albums/album/album.component.css b/src/frontend/app/ui/albums/album/album.component.css
index f9ffeb5a..6688f752 100644
--- a/src/frontend/app/ui/albums/album/album.component.css
+++ b/src/frontend/app/ui/albums/album/album.component.css
@@ -20,7 +20,7 @@ a {
 }
 
 .photo-container {
-  border: 2px solid #333;
+  border: 1px solid #333;
   width: 180px;
   height: 180px;
   background-color: #bbbbbb;
diff --git a/src/frontend/app/ui/albums/album/album.component.html b/src/frontend/app/ui/albums/album/album.component.html
index 4a3ab59b..f48d41aa 100644
--- a/src/frontend/app/ui/albums/album/album.component.html
+++ b/src/frontend/app/ui/albums/album/album.component.html
@@ -2,22 +2,22 @@
    style="display: inline-block;">
 
 
-  <div class="photo-container"
+  <div class="photo-container rounded"
        [style.width.px]="size"
        [style.height.px]="size">
 
-    <div class="photo"
+    <div class="photo rounded"
          *ngIf="thumbnail && thumbnail.Available"
          [style.background-image]="getSanitizedThUrl()"></div>
 
-    <span *ngIf="!thumbnail || !thumbnail.Available" class="oi oi-folder no-image"
+    <span *ngIf="!thumbnail || !thumbnail.Available" class="oi oi-folder no-image rounded"
           aria-hidden="true">
     </span>
   </div>
 
 
   <!--Info box -->
-  <div class="info">
+  <div class="info rounded-bottom">
     {{album.name}} ({{album.count}})
     <span *ngIf="CanUpdate && !album.locked"
           (click)="deleteAlbum($event)"
diff --git a/src/frontend/app/ui/gallery/directories/directory/directory.gallery.component.css b/src/frontend/app/ui/gallery/directories/directory/directory.gallery.component.css
index 5428d229..8dd1f076 100644
--- a/src/frontend/app/ui/gallery/directories/directory/directory.gallery.component.css
+++ b/src/frontend/app/ui/gallery/directories/directory/directory.gallery.component.css
@@ -3,14 +3,14 @@ a {
 }
 
 .photo-container {
-  border: 2px solid #333;
+  border: 1px solid #333;
   width: 180px;
   height: 180px;
   background-color: #bbbbbb;
 }
 
-.no-image {
 
+.no-image {
   color: #7f7f7f;
   font-size: 80px;
   top: calc(50% - 40px);
diff --git a/src/frontend/app/ui/gallery/directories/directory/directory.gallery.component.html b/src/frontend/app/ui/gallery/directories/directory/directory.gallery.component.html
index 490533da..6a4df845 100644
--- a/src/frontend/app/ui/gallery/directories/directory/directory.gallery.component.html
+++ b/src/frontend/app/ui/gallery/directories/directory/directory.gallery.component.html
@@ -4,19 +4,19 @@
    style="display: inline-block;">
 
 
-  <div class="photo-container"
+  <div class="photo-container rounded"
        [style.width.px]="size"
        [style.height.px]="size">
-    <div class="photo"
+    <div class="photo rounded"
          *ngIf="thumbnail && thumbnail.Available"
          [style.background-image]="getSanitizedThUrl()"></div>
 
-    <span *ngIf="!thumbnail || !thumbnail.Available" class="oi oi-folder no-image"
+    <span *ngIf="!thumbnail || !thumbnail.Available" class="oi oi-folder no-image rounded"
           aria-hidden="true">
     </span>
   </div>
   <!--Info box -->
-  <div class="info">
+  <div class="info rounded-bottom">
     <div class="directory-name">{{directory.name}}</div>
 
   </div>
diff --git a/src/frontend/app/ui/gallery/grid/photo/photo.grid.gallery.component.html b/src/frontend/app/ui/gallery/grid/photo/photo.grid.gallery.component.html
index 7cafeb51..25ae5e03 100644
--- a/src/frontend/app/ui/gallery/grid/photo/photo.grid.gallery.component.html
+++ b/src/frontend/app/ui/gallery/grid/photo/photo.grid.gallery.component.html
@@ -1,4 +1,4 @@
-<div #photoContainer class="photo-container" (mouseover)="mouseOver()" (mouseout)="mouseOut()">
+<div #photoContainer class="photo-container rounded" (mouseover)="mouseOver()" (mouseout)="mouseOut()">
 
 
   <img alt="{{gridMedia.media.name}}" #img [src]="thumbnail.Src"
diff --git a/src/frontend/styles.css b/src/frontend/styles.css
index bdbe1023..01ecd4dd 100644
--- a/src/frontend/styles.css
+++ b/src/frontend/styles.css
@@ -27,7 +27,12 @@ element.style {
   width: 100px;
 }
 
-
+/*
+Creating btn-tertiary until bootstrap supports it our of the box.
+ */
+/*
+This is mostly btn-light
+*/
 .btn-tertiary, [data-bs-theme=light] .btn-tertiary   {
   --bs-btn-color: #000;
   --bs-btn-bg: #f8f9fa;
@@ -45,6 +50,9 @@ element.style {
   --bs-btn-disabled-border-color: #f8f9fa;
 }
 
+/*
+This is mostly btn-dark + border fix
+*/
 [data-bs-theme=dark] .btn-tertiary   {
   --bs-btn-color: #fff;
   --bs-btn-bg: #212529;