diff --git a/settings/css/settings.css b/settings/css/settings.css
index 3f23fb6680dbe..3d4a4a7810002 100644
--- a/settings/css/settings.css
+++ b/settings/css/settings.css
@@ -507,21 +507,19 @@ span.version {
 	opacity: .5;
 }
 
-.app-level {
-	margin-top: 8px;
-}
 .app-level span {
 	color: #555;
 	background-color: transparent;
 	border: 1px solid #555;
 	border-radius: 3px;
-	padding: 3px 6px;
+	padding: 4px 6px;
+	display: block
 }
 .app-level .official {
 	border-color: #37ce02;
 	background-position: left center;
 	background-position: 5px center;
-	padding-left: 25px;
+	text-align: center;
 }
 
 .app-score {
@@ -540,45 +538,49 @@ span.version {
 	position: relative;
 	flex: 0 0 auto;
 	margin-left: 20px;
+	flex-flow: column wrap;
+	display: flex;
+	padding: 0;
 }
 #apps-list .section.apps-experimental {
 	flex-basis: 90%;
 }
-
+/* 4 columns */
 @media (min-width: 1601px) {
 	#apps-list .section {
-		width: 22%;
+		width: calc(25% - 25px); /* 5margins*20/4 */
 		box-sizing: border-box;
 	}
 	#apps-list .section:nth-child(4n) {
 		margin-right: 20px;
 	}
 }
-
+/* 3 columns */
 @media (min-width: 1201px) and (max-width: 1600px) {
 	#apps-list .section {
-		width: 30%;
+		width: calc(33% - 26px); /* 4margins*20/3 */
 		box-sizing: border-box;
 	}
 	#apps-list .section:nth-child(3n) {
 		margin-right: 20px;
 	}
 }
-
-@media (min-width: 901px) and (max-width: 1200px), (min-width: 601px) and (max-width: 770px) {
+/* 2 columns */
+@media (min-width: 951px) and (max-width: 1200px), (min-width: 701px) and (max-width: 770px) {
 	#apps-list .section {
-		width: 40%;
+		width: calc(50% - 30px);/* 3margins*20/2 */
 		box-sizing: border-box;
 	}
 	#apps-list .section:nth-child(2n) {
 		margin-right: 20px;
 	}
 }
-
-@media (max-width: 600px), (min-width: 771px) and (max-width: 900px) {
+/* 1 column */
+@media (max-width: 700px), (min-width: 769px) and (max-width: 950px) {
 	#apps-list .section {
-		width: 100%;
+		width: calc(100% - 40px);
 		box-sizing: border-box;
+		margin-right: 20px;
 	}
 }
 
@@ -586,9 +588,6 @@ span.version {
 	margin-bottom: 8px;
 	display: inline;
 }
-form.section {
-	position: relative;
-}
 .followupsection {
 	display: block;
 	padding: 0 30px 30px 30px;
@@ -597,18 +596,20 @@ form.section {
 	margin-top: -30px;
 	position: relative;
 }
+.app-info-container,
+.app-details-container {
+	width: calc(100% - 110px);
+}
+.app-details-container {
+	flex-basis: 50%;
+}
 .app-image {
 	float: left;
-	padding-right: 10px;
-	width: 80px;
-	height: 80px;
+	margin-right: 10px;
+	width: 40px;
+	height: 40px;
 	opacity: 0.8;
-}
-.app-name,
-.app-version,
-.app-score,
-.app-level {
-	display: inline-block;
+	overflow: hidden;
 }
 
 .app-description-toggle-show,
@@ -632,10 +633,6 @@ form.section {
 	white-space: pre-line;
 }
 
-#apps-list .groups-enable {
-	margin-top: 8px;
-}
-
 #app-category-1 {
 	margin-bottom: 18px;
 }
@@ -664,7 +661,25 @@ form.section {
 	margin-top: 1em;
 	margin-bottom: 1em;
 }
-
+.app-actions-container {
+	display: flex;
+	flex-direction: column;
+	width: 100px;
+	flex-grow: 0;
+	flex-basis: 50%;
+}
+.app-actions-container > div,
+.app-actions-container > input:not([type='hidden']) {
+	margin: 0 0 3px 0;
+	flex-shrink: 0;
+}
+.app-actions-container .select2-container-multi .select2-choices {
+	padding: 0;
+}
+.app-actions-container .select2-container-multi .select2-choices .select2-search-choice {
+	margin: 2px;
+	margin-right: 0;
+}
 
 /* LOG */
 #log {
diff --git a/settings/js/apps.js b/settings/js/apps.js
index de35cd5367283..d56e6840882c2 100644
--- a/settings/js/apps.js
+++ b/settings/js/apps.js
@@ -116,7 +116,7 @@ OC.Settings.Apps = OC.Settings.Apps || {
 						if (app.update) {
 							var $update = $('#app-' + app.id + ' .update');
 							$update.removeClass('hidden');
-							$update.val(t('settings', 'Update to %s').replace(/%s/g, app.update));
+							$update.val(t('settings', 'Update (%s)').replace(/%s/g, app.update));
 							OC.Settings.Apps.State.availableUpdates++;
 						}
 					});
@@ -236,12 +236,12 @@ OC.Settings.Apps = OC.Settings.Apps || {
 	 */
 
 	imageUrl : function (url, appfromstore) {
-		var img = '<svg width="72" height="72" viewBox="0 0 72 72">';
+		var img = '<svg width="40" height="40" viewBox="0 0 40 40">';
 
 		if (appfromstore) {
-			img += '<image x="0" y="0" width="72" height="72" preserveAspectRatio="xMinYMin meet" xlink:href="' + url  + '"  class="app-icon" /></svg>';
+			img += '<image x="0" y="0" width="40" height="40" preserveAspectRatio="xMinYMin meet" xlink:href="' + url  + '"  class="app-icon" /></svg>';
 		} else {
-			img += '<image x="0" y="0" width="72" height="72" preserveAspectRatio="xMinYMin meet" filter="url(#invertIcon)" xlink:href="' + url + '?v=' + oc_config.version + '" class="app-icon"></image></svg>';
+			img += '<image x="0" y="0" width="40" height="40" preserveAspectRatio="xMinYMin meet" filter="url(#invertIcon)" xlink:href="' + url + '?v=' + oc_config.version + '" class="app-icon"></image></svg>';
 		}
 		return img;
 	},
@@ -420,8 +420,8 @@ OC.Settings.Apps = OC.Settings.Apps || {
 				element.val(t('settings','Uninstall'));
 			} else {
 				OC.Settings.Apps.rebuildNavigation();
-				element.parent().fadeOut(function() {
-					element.remove();
+				element.parents('.section').fadeOut(function() {
+					element.parents('.section').remove();
 				});
 			}
 		},'json');
diff --git a/settings/templates/apps.php b/settings/templates/apps.php
index 2f7d66cdf28b1..063845b3882e2 100644
--- a/settings/templates/apps.php
+++ b/settings/templates/apps.php
@@ -31,111 +31,119 @@
 
 <script id="app-template" type="text/x-handlebars">
 	<div class="section" id="app-{{id}}">
-	{{#if preview}}
-	<div class="app-image{{#if previewAsIcon}} app-image-icon{{/if}} hidden">
-	</div>
-	{{/if}}
-	<h2 class="app-name">
-		{{#if detailpage}}
-			<a href="{{detailpage}}" target="_blank" rel="noreferrer">{{name}}</a>
-		{{else}}
-			{{name}}
-		{{/if}}
-	</h2>
-	<div class="app-version"> {{version}}</div>
-	{{#if profilepage}}<a href="{{profilepage}}" target="_blank" rel="noreferrer">{{/if}}
-	<div class="app-author"><?php p($l->t('by %s', ['{{author}}']));?>
-		{{#if licence}}
-		(<?php p($l->t('%s-licensed', ['{{licence}}'])); ?>)
+	
+	<div class="app-info-container">
+		{{#if preview}}
+		<div class="app-image{{#if previewAsIcon}} app-image-icon{{/if}} hidden">
+		</div>
 		{{/if}}
+		<h2 class="app-name">
+			{{#if detailpage}}
+				<a href="{{detailpage}}" target="_blank" rel="noreferrer">{{name}}</a>
+			{{else}}
+				{{name}}
+			{{/if}}
+		</h2>
+		<div class="app-version"> {{version}}</div>
 	</div>
-	{{#if profilepage}}</a>{{/if}}
-	<div class="app-level">
-		{{{level}}}
-	</div>
-	{{#if ratingNumThresholdReached }}
-	<div class="app-score">{{{score}}}</div>
-	{{/if}}
-	<div class="app-detailpage"></div>
-
-	<div class="app-description-container hidden">
-		<div class="app-description"><pre>{{description}}</pre></div>
-		<!--<div class="app-changed">{{changed}}</div>-->
-		{{#if documentation}}
-		<p class="documentation">
-			<?php p($l->t("Documentation:"));?>
-			{{#if documentation.user}}
-			<span class="userDocumentation">
-			<a id="userDocumentation" class="appslink" href="{{documentation.user}}" target="_blank" rel="noreferrer"><?php p($l->t('User documentation'));?> ↗</a>
-			</span>
+
+	<div class="app-details-container">
+		{{#if profilepage}}<a href="{{profilepage}}" target="_blank" rel="noreferrer">{{/if}}
+		<div class="app-author"><?php p($l->t('by %s', ['{{author}}']));?>
+			{{#if licence}}
+			(<?php p($l->t('%s-licensed', ['{{licence}}'])); ?>)
 			{{/if}}
+		</div>
+		{{#if profilepage}}</a>{{/if}}
+		{{#if ratingNumThresholdReached }}
+		<div class="app-score">{{{score}}}</div>
+		{{/if}}
+		<div class="app-detailpage"></div>
+
+		<div class="app-description-container hidden">
+			<div class="app-description"><pre>{{description}}</pre></div>
+			<!--<div class="app-changed">{{changed}}</div>-->
+			{{#if documentation}}
+			<p class="documentation">
+				<?php p($l->t("Documentation:"));?>
+				{{#if documentation.user}}
+				<span class="userDocumentation">
+				<a id="userDocumentation" class="appslink" href="{{documentation.user}}" target="_blank" rel="noreferrer"><?php p($l->t('User documentation'));?> ↗</a>
+				</span>
+				{{/if}}
 
-			{{#if documentation.admin}}
-			<span class="adminDocumentation">
-			<a id="adminDocumentation" class="appslink" href="{{documentation.admin}}" target="_blank" rel="noreferrer"><?php p($l->t('Admin documentation'));?> ↗</a>
-			</span>
+				{{#if documentation.admin}}
+				<span class="adminDocumentation">
+				<a id="adminDocumentation" class="appslink" href="{{documentation.admin}}" target="_blank" rel="noreferrer"><?php p($l->t('Admin documentation'));?> ↗</a>
+				</span>
+				{{/if}}
+
+				{{#if documentation.developer}}
+				<span class="developerDocumentation">
+				<a id="developerDocumentation" class="appslink" href="{{documentation.developer}}" target="_blank" rel="noreferrer"><?php p($l->t('Developer documentation'));?> ↗</a>
+				</span>
+				{{/if}}
+			</p>
 			{{/if}}
 
-			{{#if documentation.developer}}
-			<span class="developerDocumentation">
-			<a id="developerDocumentation" class="appslink" href="{{documentation.developer}}" target="_blank" rel="noreferrer"><?php p($l->t('Developer documentation'));?> ↗</a>
-			</span>
+			{{#if website}}
+			<a id="userDocumentation" class="appslink" href="{{website}}" target="_blank" rel="noreferrer"><?php p($l->t('Visit website'));?> ↗</a>
 			{{/if}}
-		</p>
-		{{/if}}
 
-		{{#if website}}
-		<a id="userDocumentation" class="appslink" href="{{website}}" target="_blank" rel="noreferrer"><?php p($l->t('Visit website'));?> ↗</a>
-		{{/if}}
+			{{#if bugs}}
+			<a id="adminDocumentation" class="appslink" href="{{bugs}}" target="_blank" rel="noreferrer"><?php p($l->t('Report a bug'));?> ↗</a>
+			{{/if}}
+		</div><!-- end app-description-container -->
+		<div class="app-description-toggle-show" role="link"><?php p($l->t("Show description …"));?></div>
+		<div class="app-description-toggle-hide hidden" role="link"><?php p($l->t("Hide description …"));?></div>
+
+		<div class="app-dependencies update hidden">
+			<p><?php p($l->t('This app has an update available.')); ?></p>
+		</div>
 
-		{{#if bugs}}
-		<a id="adminDocumentation" class="appslink" href="{{bugs}}" target="_blank" rel="noreferrer"><?php p($l->t('Report a bug'));?> ↗</a>
+		{{#if missingMinOwnCloudVersion}}
+			<div class="app-dependencies">
+				<p><?php p($l->t('This app has no minimum Nextcloud version assigned. This will be an error in the future.')); ?></p>
+			</div>
+		{{else}}
+			{{#if missingMaxOwnCloudVersion}}
+				<div class="app-dependencies">
+					<p><?php p($l->t('This app has no maximum Nextcloud version assigned. This will be an error in the future.')); ?></p>
+				</div>
+			{{/if}}
 		{{/if}}
-	</div><!-- end app-description-container -->
-	<div class="app-description-toggle-show" role="link"><?php p($l->t("Show description …"));?></div>
-	<div class="app-description-toggle-hide hidden" role="link"><?php p($l->t("Hide description …"));?></div>
 
-	<div class="app-dependencies update hidden">
-		<p><?php p($l->t('This app has an update available.')); ?></p>
+		{{#unless canInstall}}
+		<div class="app-dependencies">
+		<p><?php p($l->t('This app cannot be installed because the following dependencies are not fulfilled:')); ?></p>
+		<ul class="missing-dependencies">
+		{{#each missingDependencies}}
+		<li>{{this}}</li>
+		{{/each}}
+		</ul>
+		</div>
+		{{/unless}}
 	</div>
 
-	{{#if missingMinOwnCloudVersion}}
-		<div class="app-dependencies">
-			<p><?php p($l->t('This app has no minimum Nextcloud version assigned. This will be an error in the future.')); ?></p>
+	<div class="app-actions-container">
+		<div class="app-level">
+			{{{level}}}
 		</div>
-	{{else}}
-		{{#if missingMaxOwnCloudVersion}}
-			<div class="app-dependencies">
-				<p><?php p($l->t('This app has no maximum Nextcloud version assigned. This will be an error in the future.')); ?></p>
-			</div>
+		<input class="update hidden" type="submit" value="<?php p($l->t('Update to %s', array('{{update}}'))); ?>" data-appid="{{id}}" />
+		{{#if active}}
+		<input class="enable" type="submit" data-appid="{{id}}" data-active="true" value="<?php p($l->t("Disable"));?>"/>
+		<input type="hidden" id="group_select" title="<?php p($l->t('All')); ?>">
+		<div class="groups-enable">
+			<input type="checkbox" class="groups-enable__checkbox checkbox" id="groups_enable-{{id}}"/>
+			<label for="groups_enable-{{id}}"><?php p($l->t('Enable only for specific groups')); ?></label>
+		</div>
+		{{else}}
+		<input class="enable{{#if needsDownload}} needs-download{{/if}}" type="submit" data-appid="{{id}}" data-active="false" {{#unless canInstall}}disabled="disabled"{{/unless}} value="<?php p($l->t("Enable"));?>"/>
+		{{/if}}
+		{{#if canUnInstall}}
+		<input class="uninstall" type="submit" value="<?php p($l->t('Uninstall App')); ?>" data-appid="{{id}}" />
 		{{/if}}
-	{{/if}}
-
-	{{#unless canInstall}}
-	<div class="app-dependencies">
-	<p><?php p($l->t('This app cannot be installed because the following dependencies are not fulfilled:')); ?></p>
-	<ul class="missing-dependencies">
-	{{#each missingDependencies}}
-	<li>{{this}}</li>
-	{{/each}}
-	</ul>
-	</div>
-	{{/unless}}
-
-	<input class="update hidden" type="submit" value="<?php p($l->t('Update to %s', array('{{update}}'))); ?>" data-appid="{{id}}" />
-	{{#if active}}
-	<input class="enable" type="submit" data-appid="{{id}}" data-active="true" value="<?php p($l->t("Disable"));?>"/>
-	<div class="groups-enable">
-		<input type="checkbox" class="groups-enable__checkbox checkbox" id="groups_enable-{{id}}"/>
-		<label for="groups_enable-{{id}}"><?php p($l->t('Enable only for specific groups')); ?></label>
 	</div>
-	<input type="hidden" id="group_select" title="<?php p($l->t('All')); ?>" style="width: 200px">
-	{{else}}
-	<input class="enable{{#if needsDownload}} needs-download{{/if}}" type="submit" data-appid="{{id}}" data-active="false" {{#unless canInstall}}disabled="disabled"{{/unless}} value="<?php p($l->t("Enable"));?>"/>
-	{{/if}}
-	{{#if canUnInstall}}
-	<input class="uninstall" type="submit" value="<?php p($l->t('Uninstall App')); ?>" data-appid="{{id}}" />
-	{{/if}}
 
 	<div class="warning hidden"></div>