diff --git a/docs/_static/custom.css b/docs/_static/custom.css
index 70a39650..047e2784 100644
--- a/docs/_static/custom.css
+++ b/docs/_static/custom.css
@@ -59,29 +59,29 @@
   
   /* Main index page overview cards */
   
-  .sd-card {
+  .index-card .sd-card {
     background: #fff;
     border-radius: 0;
     padding: 30px 10px 20px 10px;
     margin: 10px 0px;
   }
   
-  .sd-card .sd-card-header {
+  .index-card .sd-card-header {
     text-align: center;
   }
   
-  .sd-card .sd-card-header .sd-card-text {
+  .index-card .sd-card-header .sd-card-text {
     margin: 0px;
   }
   
-  .sd-card .sd-card-img-top {
+  .index-card .sd-card-img-top {
     height: 52px;
     width: 52px;
     margin-left: auto;
     margin-right: auto;
   }
   
-  .sd-card .sd-card-header {
+  .index-card .sd-card-header {
     border: none;
     background-color:white;
     color: #150458 !important;
@@ -91,13 +91,13 @@
     border-bottom:  none !important;
   }
   
-  .sd-card .sd-card-footer {
+  .index-card .sd-card-footer {
     border: none;
     background-color:white;
     border-top:  none !important;
   }
   
-  .sd-card .sd-card-footer .sd-card-text{
+  .index-card .sd-card-footer .sd-card-text{
     max-width: 220px;
     margin-left: auto;
     margin-right: auto;
@@ -143,7 +143,7 @@
   
   /* Main index page overview cards */
   
-  html[data-theme=dark] .sd-card {
+  html[data-theme=dark] .index-card .sd-card {
       background-color:var(--pst-color-background);
       border:  none
   }
@@ -152,12 +152,12 @@
       box-shadow: 0 .1rem 0.5rem rgba(250, 250, 250, .2) !important
   }
   
-  html[data-theme=dark] .sd-card .sd-card-header {
+  html[data-theme=dark] .index-card .sd-card-header {
       background-color:var(--pst-color-background);
       color: #150458 !important;
   }
   
-  html[data-theme=dark] .sd-card .sd-card-footer {
+  html[data-theme=dark] .index-card .sd-card-footer {
       background-color:var(--pst-color-background);
   }
   
diff --git a/docs/developer/developer.md b/docs/developer/developer.md
index fb1fd255..8a280991 100644
--- a/docs/developer/developer.md
+++ b/docs/developer/developer.md
@@ -27,6 +27,7 @@ api_reference/api_reference.md
 :link-type: ref
 :img-top: /assets/rocket_launch_48dp.svg
 :text-align: center
+:class-item: index-card
 
 ## Introduction
 
@@ -38,6 +39,7 @@ An introduction into the single-resposibility principle and the modular design o
 :link-type: ref
 :img-top: /assets/apps_48dp.svg
 :text-align: center
+:class-item: index-card
 
 ## Widget Development
 
diff --git a/docs/index.md b/docs/index.md
index e701ba4f..d90edbfc 100644
--- a/docs/index.md
+++ b/docs/index.md
@@ -14,6 +14,7 @@ A flexible and extensible framework for building graphical user interfaces in Py
 :link-type: ref
 :img-top: /assets/index_getting_started.svg
 :text-align: center
+:class-item: index-card
 
 ## Introduction
 
@@ -25,6 +26,7 @@ General information about BEC Widgets.
 :link-type: ref
 :img-top:  /assets/index_user_guide.svg
 :text-align: center
+:class-item: index-card
 
 ## User guide
 
@@ -36,6 +38,7 @@ Information for users of BEC Widgets.
 :link-type: ref
 :img-top: /assets/index_contribute.svg
 :text-align: center
+:class-item: index-card
 
 ## Developer guide
 
@@ -47,6 +50,7 @@ Information for developers of BEC Widgets.
 :link-type: ref
 :img-top: /assets/index_api.svg
 :text-align: center
+:class-item: index-card
 
 ## API reference
 
diff --git a/docs/user/user.md b/docs/user/user.md
index 4b173fed..d7b86b3d 100644
--- a/docs/user/user.md
+++ b/docs/user/user.md
@@ -25,6 +25,7 @@ api_reference/api_reference.md
 :link-type: ref
 :img-top: /assets/rocket_launch_48dp.svg
 :text-align: center
+:class-item: index-card
 
 ## Getting Started
 
@@ -36,6 +37,7 @@ Learn how to install BEC Widgets and get started with the framework.
 :link-type: ref
 :img-top: /assets/display_settings_48dp.svg
 :text-align: center
+:class-item: index-card
 
 ## Applications
 
@@ -48,6 +50,7 @@ Learn how to use BEC Widgets Applications, to modify and create new applications
 :link-type: ref
 :img-top: /assets/apps_48dp.svg
 :text-align: center
+:class-item: index-card
 
 ## Widgets
 
@@ -59,6 +62,7 @@ Learn about the building blocks of larger applications: widgets.
 :link-type: ref
 :img-top: /assets/index_api.svg
 :text-align: center
+:class-item: index-card
 
 ## API reference