diff --git a/src/css/default/login.css b/src/css/default/login.css
index d672c305..ee1872ec 100644
--- a/src/css/default/login.css
+++ b/src/css/default/login.css
@@ -65,3 +65,38 @@ a.LSsession_recoverPassword {
 .LSsession_recoverPassword_hidden {
   visibility:             hidden;
 }
+
+@media (max-width: 30em) {
+  body {
+    margin: 0;
+  }
+
+  #loginform_logo {
+    margin: 1em;
+  }
+
+  div.loginform {
+    width: 98vw;
+    max-width: none;
+    padding: 1vw;
+    box-sizing: border-box;
+    margin: 1vw;
+    text-align: center;
+  }
+
+  .loginform dt {
+    position: initial;
+    width: 100%;
+  }
+
+  .loginform dd {
+    margin-left: 0;
+    margin-bottom: 0.5em;
+    width: 100%;
+  }
+
+  a.LSsession_recoverPassword {
+    float: none;
+    display: block;
+  }
+}
diff --git a/src/css/default/recoverpassword.css b/src/css/default/recoverpassword.css
index 49a7d94f..318ff148 100644
--- a/src/css/default/recoverpassword.css
+++ b/src/css/default/recoverpassword.css
@@ -58,3 +58,38 @@ dl.recoverpasswordform {
   color:                  #4096b8;
   font-weight:            bold;
 }
+
+@media (max-width: 30em) {
+  body {
+    margin: 0;
+  }
+
+  div.recoverpasswordform {
+    width: 98vw;
+    max-width: none;
+    padding: 1vw;
+    box-sizing: border-box;
+    margin: 1vw;
+    text-align: center;
+  }
+
+  #recoverpasswordform_logo {
+    margin: 1em;
+  }
+
+  .recoverpasswordform dt {
+    position: initial;
+    width: 100%;
+  }
+
+  .recoverpasswordform dd {
+    margin-left: 0;
+    margin-bottom: 0.5em;
+    width: 100%;
+  }
+
+  #recoverpassword_back {
+    float: none;
+    display: block;
+  }
+}