diff --git a/src/views/Admin/components/AddUsers.vue b/src/views/Admin/components/AddUsers.vue
index a714f1c3..c2dcaa0f 100644
--- a/src/views/Admin/components/AddUsers.vue
+++ b/src/views/Admin/components/AddUsers.vue
@@ -38,10 +38,14 @@ async function save() {
 </script>
 
 <template>
-  <div class="p-size-16">
-    <slot name="back"></slot>
+  <slot name="back"></slot>
 
-    <FormSection class="mt-size-24">
+  <div class="add-users mt-size-16">
+    <h2 class="pkt-txt-22 mb-size-16">
+      {{ $t('admin.users.registerUsersButton') }}
+    </h2>
+
+    <FormSection>
       <FormComponent
         v-model="emails"
         input-type="textarea"
@@ -61,3 +65,10 @@ async function save() {
     </FormSection>
   </div>
 </template>
+
+<style lang="scss" scoped>
+.add-users {
+  padding: 1rem;
+  background: var(--color-gray-light);
+}
+</style>
diff --git a/src/views/Admin/components/AdminAccessRequests.vue b/src/views/Admin/components/AdminAccessRequests.vue
index 6d2e0e94..278cb6ca 100644
--- a/src/views/Admin/components/AdminAccessRequests.vue
+++ b/src/views/Admin/components/AdminAccessRequests.vue
@@ -53,16 +53,16 @@ function rejectRequest(request) {
           <PktButton
             :disabled="loading"
             skin="secondary"
-            data-cy="request-accept"
-            @onClick="acceptRequest(request)"
+            size="small"
+            @on-click="acceptRequest(request)"
           >
             {{ $t('btn.acceptRequest') }}
           </PktButton>
           <PktButton
             :disabled="loading"
             skin="secondary"
-            data-cy="request-reject"
-            @onClick="rejectRequest(request)"
+            size="small"
+            @on-click="rejectRequest(request)"
           >
             {{ $t('btn.rejectRequest') }}
           </PktButton>
@@ -73,15 +73,21 @@ function rejectRequest(request) {
 </template>
 
 <style lang="scss" scoped>
-.access-requests__list {
-  display: flex;
-  flex-direction: column;
-  gap: 1rem;
-  margin: 0 0 1.5rem;
-}
+.access-requests {
+  :deep(.pkt-alert__title) {
+    word-break: break-all;
+  }
 
-.access-requests__actions {
-  display: flex;
-  gap: 0.5rem;
+  &__list {
+    display: flex;
+    flex-direction: column;
+    gap: 1rem;
+    margin: 0 0 1.5rem;
+  }
+
+  &__actions {
+    display: flex;
+    gap: 0.5rem;
+  }
 }
 </style>
diff --git a/src/views/Admin/components/AdminUsers.vue b/src/views/Admin/components/AdminUsers.vue
index a66fda05..c0500522 100644
--- a/src/views/Admin/components/AdminUsers.vue
+++ b/src/views/Admin/components/AdminUsers.vue
@@ -37,11 +37,11 @@ const { results: searchResults } = useFuse(userQuery, users, {
 </script>
 
 <template>
-  <div>
-    <h2 class="title-2">{{ $t('admin.users.users') }}</h2>
+  <div class="user-list">
+    <h2 class="user-list__title">{{ $t('admin.users.users') }}</h2>
 
-    <div v-if="!selectedUser && !viewAddUsers" class="users">
-      <div class="search">
+    <div v-if="!selectedUser && !viewAddUsers" class="user-list__body">
+      <div v-if="users.length > 10">
         <input
           v-model="userQuery"
           class="pkt-input pkt-input--fullwidth"
@@ -50,22 +50,20 @@ const { results: searchResults } = useFuse(userQuery, users, {
         />
       </div>
 
-      <div class="users__list">
+      <div class="user-list__list">
         <button
           v-for="{ item: user } in searchResults"
           :key="user.id"
-          class="users__list-item pkt-txt-14-medium"
+          class="user-list__button pkt-txt-16-medium"
           @click="selectedUser = user"
         >
-          <PktIcon class="icon" :name="isAdmin(user) ? 'cogwheel' : 'user'" />
-          <span class="users__list-item-name">
-            {{ user.displayName || user.id }}
-          </span>
-          <PktIcon class="icon" name="chevron-right" />
+          <PktIcon :name="isAdmin(user) ? 'cogwheel' : 'user'" />
+          <span>{{ user.displayName || user.id }}</span>
+          <PktIcon name="chevron-right" />
         </button>
       </div>
 
-      <div class="users__footer">
+      <div class="user-list__footer">
         <PktButton
           skin="secondary"
           icon-name="plus-sign"
@@ -84,7 +82,12 @@ const { results: searchResults } = useFuse(userQuery, users, {
     >
       <template #back>
         <div>
-          <PktButton skin="secondary" @on-click="selectedUser = null">
+          <PktButton
+            skin="tertiary"
+            icon-name="chevron-left"
+            variant="icon-left"
+            @on-click="selectedUser = null"
+          >
             {{ $t('admin.users.backToUsers') }}
           </PktButton>
         </div>
@@ -93,74 +96,84 @@ const { results: searchResults } = useFuse(userQuery, users, {
 
     <AddUsers v-if="viewAddUsers" @close="viewAddUsers = false">
       <template #back>
-        <div>
-          <PktButton skin="secondary" @on-click="viewAddUsers = false">
-            {{ $t('admin.users.backToUsers') }}
-          </PktButton>
-        </div>
+        <PktButton
+          skin="tertiary"
+          icon-name="chevron-left"
+          variant="icon-left"
+          @on-click="viewAddUsers = false"
+        >
+          {{ $t('admin.users.backToUsers') }}
+        </PktButton>
       </template>
     </AddUsers>
   </div>
 </template>
 
 <style lang="scss" scoped>
-.users,
-.selected-user,
-.add-users {
-  display: flex;
-  flex-direction: column;
-  background: var(--color-gray-light);
-}
+@use '@oslokommune/punkt-css/dist/scss/abstracts/mixins/breakpoints' as *;
+@use '@oslokommune/punkt-css/dist/scss/abstracts/mixins/typography' as *;
 
-.add-users,
-.users {
-  height: 32rem;
-}
+.user-list {
+  &__title {
+    @include get-text('pkt-txt-18-medium');
+    margin-bottom: 0.75rem;
 
-.users__list {
-  display: flex;
-  flex-direction: column;
-  overflow: auto;
-}
-
-.users__list-item {
-  display: flex;
-  gap: 0.5rem;
-  align-items: center;
-  padding: 0.5rem 1rem;
-  color: var(--color-text);
-  background: none;
-  border: 0;
-  border-bottom: 2px solid var(--color-border);
-  cursor: pointer;
-
-  &:hover .users__list-item-name {
-    text-decoration: underline;
-    text-decoration-thickness: 1px;
-    text-underline-offset: 0.3em;
+    @include bp('tablet-up') {
+      @include get-text('pkt-txt-20-medium');
+    }
   }
-}
 
-.users__list-item-name {
-  flex: 1 0 auto;
-  overflow: hidden;
-  white-space: nowrap;
-  text-align: left;
-  text-overflow: ellipsis;
-}
+  &__body {
+    display: flex;
+    flex-direction: column;
+    height: 32rem;
+    background: var(--color-gray-light);
+  }
 
-.users__footer {
-  margin-top: auto;
-  padding: 1rem;
-  font-size: 0.79rem;
+  &__list {
+    flex: 1;
+    overflow: auto;
+  }
 
-  .pkt-btn {
-    justify-content: center;
+  &__button {
+    display: flex;
+    gap: 0.5rem;
+    align-items: center;
     width: 100%;
+    padding: 0.5rem 1rem;
+    color: var(--color-text);
+    background: none;
+    border: 0;
+    border-bottom: 2px solid var(--color-border);
+    cursor: pointer;
+
+    &:hover {
+      text-decoration: underline;
+      text-decoration-thickness: 1px;
+      text-underline-offset: 0.3em;
+    }
+
+    .pkt-icon {
+      height: 1rem;
+    }
+
+    span {
+      flex: 1;
+      overflow: hidden;
+      white-space: nowrap;
+      text-align: left;
+      text-overflow: ellipsis;
+    }
   }
-}
 
-.icon {
-  height: 1rem;
+  &__footer {
+    margin-top: auto;
+    padding: 1rem;
+
+    .pkt-btn {
+      justify-content: center;
+      width: 100%;
+    }
+  }
 }
 </style>
diff --git a/src/views/Admin/components/EditUser.vue b/src/views/Admin/components/EditUser.vue
index ee3d2863..67822c21 100644
--- a/src/views/Admin/components/EditUser.vue
+++ b/src/views/Admin/components/EditUser.vue
@@ -84,10 +84,12 @@ async function remove() {
 </script>
 
 <template>
-  <div class="p-size-16">
-    <slot name="back"></slot>
+  <slot name="back"></slot>
 
-    <h2 class="title-2 mt-size-24">{{ $t('admin.users.edit') }}</h2>
+  <div class="edit-user mt-size-16">
+    <h2 class="pkt-txt-22 mb-size-16">
+      {{ $t('admin.users.edit') }}
+    </h2>
 
     <FormSection v-if="user">
       <FormComponent
@@ -137,3 +139,10 @@ async function remove() {
     </FormSection>
   </div>
 </template>
+
+<style lang="scss" scoped>
+.edit-user {
+  padding: 1rem;
+  background: var(--color-gray-light);
+}
+</style>
diff --git a/src/views/Admin/components/ItemList.vue b/src/views/Admin/components/ItemList.vue
index 5ca04e14..a953c662 100644
--- a/src/views/Admin/components/ItemList.vue
+++ b/src/views/Admin/components/ItemList.vue
@@ -92,11 +92,11 @@ const itemRoute = (slug) => ({
 </script>
 
 <template>
-  <div>
-    <h2 class="title-2">{{ $t(templateConfig.title) }}</h2>
+  <div class="item-list">
+    <h2 class="item-list__title">{{ $t(templateConfig.title) }}</h2>
 
-    <div class="col">
-      <div v-if="items.length > 3" class="search">
+    <div class="item-list__body">
+      <div v-if="items.length > 10">
         <input
           v-model="itemQuery"
           class="pkt-input pkt-input--fullwidth"
@@ -105,27 +105,31 @@ const itemRoute = (slug) => ({
         />
       </div>
 
-      <div class="col__body">
-        <div v-for="{ item } in searchResults" :key="item.id" class="col__row">
+      <div class="item-list__list">
+        <template v-for="{ item } in searchResults" :key="item.id">
           <RouterLink
             v-if="!item.archived"
-            class="col__link pkt-txt-16-medium"
+            class="item-list__link pkt-txt-16-medium"
             :to="itemRoute(item.slug)"
           >
-            <PktIcon class="icon" :name="templateConfig.itemIcon" />
-            <span class="col__text">{{ item.name }}</span>
-            <PktIcon class="icon" name="chevron-right" />
+            <PktIcon :name="templateConfig.itemIcon" />
+            <span>{{ item.name }}</span>
+            <PktIcon name="chevron-right" />
           </RouterLink>
 
-          <div v-else class="col__link pkt-txt-16-medium" @click="selectedItem = item">
-            <PktIcon class="icon" :name="templateConfig.itemIcon" />
-            <span class="col__text">{{ item.name }}</span>
-            <PktIcon class="icon" name="archive" />
+          <div
+            v-else
+            class="item-list__link pkt-txt-16-medium"
+            @click="selectedItem = item"
+          >
+            <PktIcon :name="templateConfig.itemIcon" />
+            <span>{{ item.name }}</span>
+            <PktIcon name="archive" />
           </div>
-        </div>
+        </template>
       </div>
 
-      <div v-if="canCreateItem" class="col__footer">
+      <div v-if="canCreateItem" class="item-list__footer">
         <RouterLink
           class="pkt-btn pkt-btn--secondary pkt-btn--icon-left"
           :to="templateConfig.createRoute"
@@ -145,57 +149,67 @@ const itemRoute = (slug) => ({
 </template>
 
 <style lang="scss" scoped>
-.col {
-  display: flex;
-  flex-direction: column;
-  height: 32rem;
-  background: var(--color-gray-light);
-}
+@use '@oslokommune/punkt-css/dist/scss/abstracts/mixins/breakpoints' as *;
+@use '@oslokommune/punkt-css/dist/scss/abstracts/mixins/typography' as *;
 
-.col__body {
-  flex: 1;
-  overflow: auto;
-}
+.item-list {
+  &__title {
+    @include get-text('pkt-txt-18-medium');
+    margin-bottom: 0.75rem;
 
-.col__header {
-  display: flex;
-  align-items: center;
-  padding: 1rem;
-  background: var(--color-grayscale-10);
-}
+    @include bp('tablet-up') {
+      @include get-text('pkt-txt-20-medium');
+    }
+  }
 
-.col__footer {
-  margin-top: auto;
-  padding: 1rem;
+  &__body {
+    display: flex;
+    flex-direction: column;
+    height: 32rem;
+    background: var(--color-gray-light);
+  }
 
-  .pkt-btn {
-    justify-content: center;
-    width: 100%;
+  &__list {
+    flex: 1;
+    overflow: auto;
   }
-}
 
-.col__link {
-  display: flex;
-  gap: 0.5rem;
-  align-items: center;
-  padding: 0.5rem 1rem;
-  color: var(--color-text);
-  text-decoration: none;
-  border-bottom: 2px solid var(--color-border);
-  cursor: pointer;
-
-  &:hover {
-    text-decoration: underline;
-    text-decoration-thickness: 1px;
-    text-underline-offset: 0.3em;
+  &__link {
+    display: flex;
+    gap: 0.5rem;
+    align-items: center;
+    padding: 0.5rem 1rem;
+    color: var(--color-text);
+    text-decoration: none;
+    border-bottom: 2px solid var(--color-border);
+    cursor: pointer;
+
+    &:hover {
+      text-decoration: underline;
+      text-decoration-thickness: 1px;
+      text-underline-offset: 0.3em;
+    }
+
+    .pkt-icon {
+      height: 1rem;
+    }
+
+    span {
+      flex: 1;
+      overflow: hidden;
+      white-space: nowrap;
+      text-overflow: ellipsis;
+    }
   }
-}
 
-.col__text {
-  flex: 1 0 auto;
-}
+  &__footer {
+    margin-top: auto;
+    padding: 1rem;
 
-.icon {
-  height: 1rem;
+    .pkt-btn {
+      justify-content: center;
+      width: 100%;
+    }
+  }
 }
 </style>