diff --git a/src/addon/mod/quiz/pages/player/player.ts b/src/addon/mod/quiz/pages/player/player.ts
index 669445fbc..83fb1dca3 100644
--- a/src/addon/mod/quiz/pages/player/player.ts
+++ b/src/addon/mod/quiz/pages/player/player.ts
@@ -94,7 +94,7 @@ export class AddonModQuizPlayerPage implements OnInit, OnDestroy {
         // Create the navigation modal.
         this.navigationModal = modalCtrl.create('AddonModQuizNavigationModalPage', {
             page: this
-        });
+        }, { cssClass: 'core-modal-lateral' });
     }
 
     /**
diff --git a/src/app/app.scss b/src/app/app.scss
index eb0aad801..63d415519 100644
--- a/src/app/app.scss
+++ b/src/app/app.scss
@@ -721,13 +721,22 @@ ion-app.app-root {
     width: 100%;
   }
 
-  .core-modal-fullscreen {
-    .modal-wrapper {
-      position: absolute;
-      @include position(0 !important, null, null, 0 !important);
-      display: block;
-      width: 100% !important;
-      height: 100% !important;
+  .core-modal-fullscreen  .modal-wrapper {
+    position: absolute;
+    @include position(0 !important, null, null, 0 !important);
+    display: block;
+    width: 100% !important;
+    height: 100% !important;
+  }
+
+  @media only screen and (min-height: 600px) and (min-width: 768px) {
+      .core-modal-lateral  .modal-wrapper {
+        position: absolute;
+        @include position(0 !important, 0 !important, 0 !important, auto);
+        display: block;
+        height: 100% !important;
+        width: auto;
+        min-width: 400px;
     }
   }