diff --git a/templates/default-layout-wrapper.hamlet b/templates/default-layout-wrapper.hamlet
index 014edc30f..c293b607a 100644
--- a/templates/default-layout-wrapper.hamlet
+++ b/templates/default-layout-wrapper.hamlet
@@ -12,7 +12,7 @@ $newline never
 
     ^{pageHead pc}
 
-  <body .no-js .theme--#{toPathPiece currentTheme} :isAuth:.logged-in>
+  <body .no-js .theme--#{toPathPiece currentTheme} :isAuth:.logged-in :isModal:.modal>
     <!-- removes no-js class from body if client supports javascript -->
     <script>
       document.body.classList.remove('no-js');
diff --git a/templates/default-layout.lucius b/templates/default-layout.lucius
index 9ab544bb6..1cdd12452 100644
--- a/templates/default-layout.lucius
+++ b/templates/default-layout.lucius
@@ -199,7 +199,7 @@ h4 {
 }
 
 @media (max-width: 768px) {
-  .logged-in {
+  .logged-in:not(.modal) {
     .main__content {
       padding-left: 60px;
     }
@@ -207,7 +207,7 @@ h4 {
 }
 
 @media (max-width: 425px) {
-  .logged-in {
+  .logged-in:not(.modal) {
     .main__content {
       padding-left: 0;
     }
@@ -215,7 +215,7 @@ h4 {
 }
 
 @media (min-width: 769px) {
-  .logged-in {
+  .logged-in:not(.modal) {
     .main__content {
       padding-left: calc(24% + 30px);
     }
@@ -223,7 +223,7 @@ h4 {
 }
 
 @media (min-width: 1200px) {
-  .logged-in {
+  .logged-in:not(.modal) {
     .main__content {
       padding-left: 320px;
     }
diff --git a/templates/standalone/modal.lucius b/templates/standalone/modal.lucius
index 043775e19..194c69515 100644
--- a/templates/standalone/modal.lucius
+++ b/templates/standalone/modal.lucius
@@ -1,4 +1,4 @@
-.modal {
+div.modal {
   position: fixed;
   left: 50%;
   top: 50%;
