diff --git a/resources/mmv/mmv.lightboxinterface.less b/resources/mmv/mmv.lightboxinterface.less
index bd98235c5..46279bf77 100644
--- a/resources/mmv/mmv.lightboxinterface.less
+++ b/resources/mmv/mmv.lightboxinterface.less
@@ -2,6 +2,7 @@
 @import "mmv.mixins";
 
 @metadata-background: rgb(248, 248, 248);
+@metadata-above-fold-reveal-height: 12;
 
 .mw-mmv-wrapper {
 	top: 0px;
@@ -58,11 +59,11 @@
 // above-the-fold part of the metadata panel
 .mw-mmv-above-fold {
 	width: 100%;
-	height: @metadatabar-above-fold-height;
+	height: @metadatabar-above-fold-height - @metadata-above-fold-reveal-height;
 	// min-height is used when the height is changed to auto to display long texts, to make sure the layout
 	// is not messed up wheen the text is short and does not fill the available place. It is also used by
 	// Javascript to get the "default" height.
-	min-height: @metadatabar-above-fold-height;
+	min-height: @metadatabar-above-fold-height - @metadata-above-fold-reveal-height;
 	position: relative;
 	border-bottom: 1px solid #dddddd;