diff --git a/public/css/home.css b/public/css/home.css
index 9edb02c..7dcf8ba 100644
--- a/public/css/home.css
+++ b/public/css/home.css
@@ -53,7 +53,7 @@
 
 .slider-content img {
     max-width: 100%;
-    height: 400px;
+    max-height: 100%;
 }
 
 .slider-nav {
@@ -118,3 +118,10 @@ button:hover{
 	background-image: url("../img/widgetclicked.png");
 	border-color: white;
 }
+
+.imgbox {
+    display: flex;
+    justify-content: center;
+    height: 400px;
+    width: 400px;
+}
\ No newline at end of file
diff --git a/resources/views/home.blade.php b/resources/views/home.blade.php
index 3abf41e..d8d2f83 100644
--- a/resources/views/home.blade.php
+++ b/resources/views/home.blade.php
@@ -30,7 +30,9 @@
                         @foreach(\App\Models\Category::all()->sortBy('name') as $category)
                            <div id="img_{{$category->name}}" class="slider-content">
                                 <a href="/catalog?category={{$category->id}}">
-                                    <img src="{{ asset("category/" . $category['icon']) }}" alt="{{$category->name}} category image">
+                                    <div class="imgbox">
+                                        <img src="{{ asset("category/" . $category['icon']) }}" alt="{{$category->name}} category image">
+                                    </div>
                                 </a>
                             </div>
                         @endforeach