diff --git a/ts/Manager/App.scss b/ts/Manager/App.scss
index bdc1469..14085e0 100644
--- a/ts/Manager/App.scss
+++ b/ts/Manager/App.scss
@@ -91,7 +91,8 @@ pre {
   }
 }
 
-#bbb-react-root {
+#bbb-react-root,
+#bbb-restrictions {
   #bbb-warning,
   #bbb-success {
     margin: 3em;
@@ -118,11 +119,11 @@ pre {
     line-height: 0;
     display: inline-block;
 
-    .icon {
+    &:not(button:disabled) .icon {
       opacity: 0.5;
     }
 
-    &:hover {
+    &:not(button:disabled):hover {
       background-color: var(--color-background-dark);
 
       .icon {
diff --git a/ts/Restrictions/RestrictionRow.tsx b/ts/Restrictions/RestrictionRow.tsx
index f622b52..0dad6ca 100644
--- a/ts/Restrictions/RestrictionRow.tsx
+++ b/ts/Restrictions/RestrictionRow.tsx
@@ -72,9 +72,9 @@ const RestrictionRoom: React.FC<Props> = (props) => {
 			</td>
 
 			<td className="remove icon-col">
-				{restriction.groupId && <a className="icon icon-delete icon-visible"
-					onClick={deleteRow as any}
-					title={t('bbb', 'Delete')} />}
+				<button disabled={!restriction.groupId} className="action-item" onClick={deleteRow as any} title={t('bbb', 'Delete')}>
+					<span className="icon icon-delete icon-visible"></span>
+				</button>
 			</td>
 		</tr>
 	);