diff --git a/lam/docs/devel/upgrade.htm b/lam/docs/devel/upgrade.htm
index ed373e3f..494f8b5e 100644
--- a/lam/docs/devel/upgrade.htm
+++ b/lam/docs/devel/upgrade.htm
@@ -19,6 +19,7 @@
 
 
 
+
 
 
 
@@ -43,10 +44,16 @@ This is a list of API changes for all LAM releases.
 
 <br>
 
-<h2>5.0 -&gt; 5.1</h2>Module interface - getPDFEntries(): It is no
+<h2>5.0 -&gt; 5.1</h2>Module interface<br>
+<ul>
+  <li><span style="font-weight: bold;">getPDFEntries(): </span>It is no
 longer supported that modules generate PDF XML on their own. You must
 use addSimplePDFField/addPDFKeyValue/addPDFTable() from baseModule for
-this.<br>
+this.</li>
+  <li><span style="font-weight: bold;">getSelfServiceOptions:</span> the function must now return an array of htmlResponsiveRow instead of htmlTableRow<br>
+  </li>
+</ul>
+
 <br>
 <h2>4.8 -&gt; 4.9</h2>
 API changes<br>
diff --git a/lam/docs/manual-sources/howto.xml b/lam/docs/manual-sources/howto.xml
index 496bffc7..5b284a79 100644
--- a/lam/docs/manual-sources/howto.xml
+++ b/lam/docs/manual-sources/howto.xml
@@ -989,7 +989,9 @@ Have fun!
         <section>
           <title>5.0 -&gt; 5.1</title>
 
-          <para>No special actions needed.</para>
+          <para>Self Service: There were large changes to provide a responsive
+          design that works for desktop and mobile. If you use custom CSS to
+          style Self Service then this must be updated.</para>
         </section>
 
         <section>
diff --git a/lam/lib/baseModule.inc b/lam/lib/baseModule.inc
index 679ad733..e6f7e83d 100644
--- a/lam/lib/baseModule.inc
+++ b/lam/lib/baseModule.inc
@@ -1428,8 +1428,8 @@ abstract class baseModule {
 			}
 		}
 		$row = new htmlResponsiveRow();
-		$row->add(new htmlOutputText($this->getSelfServiceLabel($name, $label)), 12, 6, 6, 'tabletPlus-align-right mobile-align-left');
-		$row->add($field, 12, 6, 6, 'tabletPlus-align-left');
+		$row->add(new htmlOutputText($this->getSelfServiceLabel($name, $label)), 12, 6, 6, 'responsiveLabel');
+		$row->add($field, 12, 6, 6, 'responsiveField');
 		$container[$name] = $row;
 	}
 
diff --git a/lam/lib/html.inc b/lam/lib/html.inc
index 73f5570d..96c6ebcc 100644
--- a/lam/lib/html.inc
+++ b/lam/lib/html.inc
@@ -3408,14 +3408,14 @@ class htmlResponsiveInputField extends htmlInputField {
 			if (is_dir("../graphics")) $graphicsPath = "../graphics";
 			$labelGroup->addElement(new htmlImage($graphicsPath . '/required.png', 16, 16, _('required'), _('required')));
 		}
-		$row->add($labelGroup, 12, 6, 6, 'tabletPlus-align-right mobile-align-left');
+		$row->add($labelGroup, 12, 6, 6, 'responsiveLabel');
 		// input field
 		$fieldGroup = new htmlGroup();
 		$fieldGroup->addElement($this);
 		if (!empty($this->helpID)) {
 			$fieldGroup->addElement(new htmlHelpLink($this->helpID));
 		}
-		$row->add($fieldGroup, 12, 6, 6, 'tabletPlus-align-left');
+		$row->add($fieldGroup, 12, 6, 6, 'responsiveField');
 		return $row->generateHTML($module, $input, $values, $restricted, $tabindex, $scope);
 	}
 
diff --git a/lam/style/500_layout.css b/lam/style/500_layout.css
index 7fdbfe9f..6c73f105 100644
--- a/lam/style/500_layout.css
+++ b/lam/style/500_layout.css
@@ -667,25 +667,21 @@ div.dialog-page {
 /* mobile */
 @media only screen and (max-width: 40.0625em) {
 
-.mobile-align-left {
+.responsiveLabel {
 	text-align: left;
 }
 
-.mobile-align-right {
-	text-align: right;
-}
-
 }
 
 /* tablet */
 @media only screen and (min-width: 40.0625em) and (max-width: 64.0625em) {
 
-.tablet-align-left,.tabletPlus-align-left {
-	text-align: left;
+.responsiveLabel {
+	text-align: right;
 }
 
-.tablet-align-right,.tabletPlus-align-right {
-	text-align: right;
+.responsiveField {
+	text-align: left;
 }
 
 }
@@ -693,12 +689,12 @@ div.dialog-page {
 /* desktop */
 @media only screen and (min-width: 64.0625em) {
 
-.desktop-align-left,.tabletPlus-align-left {
-	text-align: left;
-}
-
-.desktop-align-right,.tabletPlus-align-right {
+.responsiveLabel {
 	text-align: right;
 }
 
+.responsiveField {
+	text-align: left;
+}
+
 }