diff --git a/resources/assets/stylesheets/scss/courseware.scss b/resources/assets/stylesheets/scss/courseware.scss
index 611da353d9de9d8a4de98941421a73fde3f41976..891932de6ac46f26352c0346be1ca108a5c97435 100644
--- a/resources/assets/stylesheets/scss/courseware.scss
+++ b/resources/assets/stylesheets/scss/courseware.scss
@@ -438,7 +438,7 @@ $consum_ribbon_width: calc(100% - 58px);
     box-shadow: 2px 2px #ccc;
     position: absolute;
     right: -570px;
-    top: 0;
+    top: 15px;
     height: 100%;
     max-width: calc(100% - 28px);
     display: flex;
@@ -448,6 +448,7 @@ $consum_ribbon_width: calc(100% - 58px);
 
     &.unfold {
         right: 0px;
+        margin-right: 15px;
     }
 
     &.cw-ribbon-tools-consume {
@@ -460,6 +461,7 @@ $consum_ribbon_width: calc(100% - 58px);
     &.cw-ribbon-tools-sticky {
         position: absolute;
         top: -1px;
+        margin-right: 0;
     }
 
     .cw-ribbon-tool-content {
@@ -570,7 +572,7 @@ $consum_ribbon_width: calc(100% - 58px);
 
 .cw-structural-element-consumemode {
     .cw-ribbon-tools {
-        top: 14px;
+        top: 25px;
     }
 }
 
diff --git a/resources/assets/stylesheets/scss/responsive.scss b/resources/assets/stylesheets/scss/responsive.scss
index 2e6e9852e01ad23a58a0dc78a66e1d1336dfc481..3f226d3d3a7f13c06b0b273ca19697e4ec325157 100644
--- a/resources/assets/stylesheets/scss/responsive.scss
+++ b/resources/assets/stylesheets/scss/responsive.scss
@@ -465,6 +465,8 @@ $sidebarOut: -330px;
         &.cw-ribbon {
             .cw-ribbon-tools {
                 max-width: calc(100% - 2px);
+                top: 0;
+                margin-right: 0;
             }
         }