diff --git a/electron/main/index.html b/electron/main/index.html
index 7300ca3..2aa9a50 100644
--- a/electron/main/index.html
+++ b/electron/main/index.html
@@ -141,17 +141,26 @@
         <div class="checkbox-container">
           <input type="checkbox" name="docFormat" id="docFormatSummary1" value="agenda">
           <label id="label_summary" for="docFormatSummary">Agenda</label>
+          <div class="figure2">
           <img class="img-icon" src="icons/question-mark-button-icon--free-clip-art-30.png">
+          <img class="img-hover2" src="flags/india-flag-png-large.png">
+          </div>
         </div>
         <div class="checkbox-container">
           <input type="checkbox" name="docFormat" id="docFormatSummary2" value="result-protocol">
           <label id="label_summary" for="docFormatSummary">Resultprotocol</label>
-          <img class="img-icon" src="icons/question-mark-button-icon--free-clip-art-30.png">
+          <div class="figure3">
+            <img class="img-icon" src="icons/question-mark-button-icon--free-clip-art-30.png">
+            <img class="img-hover3" src="flags/united-kingdom-flag-png-large.jpg">
+          </div>
         </div>
         <div class="checkbox-container">
           <input type="checkbox" name="docFormat" id="docFormatSummary3" value="sprint-planning">
           <label id="label_summary" for="docFormatSummary">Sprint Planning Note</label>
+          <div class="figure4">
           <img class="img-icon" src="icons/question-mark-button-icon--free-clip-art-30.png">
+          <img class="img-hover4" src="flags/germany-flag-png-large.jpg">
+          </div>
         </div>
         <div class="checkbox-container">
           <input type="checkbox" name="docFormat" id="docFormatCustom" value="custom">
diff --git a/electron/main/style.css b/electron/main/style.css
index ee73be1..38c9cfc 100644
--- a/electron/main/style.css
+++ b/electron/main/style.css
@@ -186,6 +186,8 @@ input[type="file"] {
   gap: 5px;
 }
 
+/* Hover effects for all different document options (with placeholders)*/
+
 .figure1 {
   position: relative;
 }
@@ -201,12 +203,79 @@ input[type="file"] {
   object-fit: contain;
   display: none;
   transition: opacity .2s;
+  z-index: 999;
 }
 
 .figure1:hover .img-hover1 {
   display: flex;
 }
 
+.figure2 {
+  position: relative;
+}
+
+.img-hover2 {
+  position: absolute;
+  width: 200px;
+  height: 200px;
+  top: 0;
+  right: 40%;
+  left: 0;
+  bottom: 0;
+  object-fit: contain;
+  display: none;
+  transition: opacity .2s;
+  z-index: 999;
+}
+
+.figure2:hover .img-hover2 {
+  display: flex;
+}
+
+.figure3 {
+  position: relative;
+}
+
+.img-hover3 {
+  position: absolute;
+  width: 200px;
+  height: 200px;
+  top: 0;
+  right: 40%;
+  left: 0;
+  bottom: 0;
+  object-fit: contain;
+  display: none;
+  transition: opacity .2s;
+  z-index: 999;
+}
+
+.figure3:hover .img-hover3 {
+  display: flex;
+}
+
+.figure4 {
+  position: relative;
+}
+
+.img-hover4 {
+  position: absolute;
+  width: 200px;
+  height: 200px;
+  top: 0;
+  right: 40%;
+  left: 0;
+  bottom: 0;
+  object-fit: contain;
+  display: none;
+  transition: opacity .2s;
+  z-index: 999;
+}
+
+.figure4:hover .img-hover4 {
+  display: flex;
+}
+
 .img-icon {
   width: 15px;
   height: 15px;