diff --git a/addons/web_planner/static/src/less/web_planner_common.less b/addons/web_planner/static/src/less/web_planner_common.less
index f36cc1ea4a0..c8b15ba9346 100644
--- a/addons/web_planner/static/src/less/web_planner_common.less
+++ b/addons/web_planner/static/src/less/web_planner_common.less
@@ -204,14 +204,13 @@
     }
 }
 
-@o_planner_width: 480px;
 #PlannerDialog {
     font-family: "Lato", serif;
     position: absolute;
     top: 46px; // enterprise fine-tuning
     right: 0px;
     bottom: 0px;
-    width: @o_planner_width;
+    width: 960px;
     z-index: 1001; // z-index website + 1
     padding-bottom: 40px;
     background-color: white;
@@ -219,6 +218,10 @@
     box-shadow: 0 3px 9px #666666;
     outline: none;
 
+    @media (max-width: 992px) {
+        width: 90%;
+    }
+
     .o-planner-header() {
         display: inline-block;
         padding: 5px 5px 5px 5px;
@@ -287,8 +290,8 @@
         &.marked:after {
             position: absolute;
             top: 0;
-            left: 105px;
-            font-size: 20em;
+            left: 360px;
+            font-size: 300px;
             font-family: "FontAwesome";
             content: "\f00c";
             color: #21b799;
@@ -312,6 +315,11 @@
             -ms-animation-iteration-count: 1;
             -ms-transform-origin: 50% 50%;
             -ms-animation-fill-mode:forwards; /*IE 10+*/
+
+            @media (max-width: 992px) {
+                left: 40%;
+                font-size: 30vw;
+            }
         }
 
         //NOTEBOOK