diff --git a/website/views/options/social/boss.jade b/website/views/options/social/boss.jade
index 43ce01ebea..970a95ba7f 100644
--- a/website/views/options/social/boss.jade
+++ b/website/views/options/social/boss.jade
@@ -6,48 +6,44 @@ mixin boss(tavern, mobile)
       h3.panel-title(ng-if='group.quest.active==true') {{::Content.quests[group.quest.key].text()}}
     .panel-body.modal-fixed-height
       div(ng-if='group.quest.active==false' ng-init="questBoxTab = 'invitesTab'")
-        ul.nav.nav-pills
-          li(ng-class="{active:questBoxTab === 'invitesTab'}")
-            a(ng-click="questBoxTab = 'invitesTab'")=env.t('invitations')
-          li(ng-class="{active:questBoxTab === 'detailsTab'}")
-            a(ng-click="questBoxTab = 'detailsTab'")=env.t('questDetails')
-        div(ng-show="questBoxTab === 'invitesTab'")
-          br
-          table.table.table-striped(bindonce='group')
-            tr(ng-repeat='member in group.members track by member._id')
-              td
-                span(ng-if=':: group.quest.leader && group.quest.leader==member._id && isMemberOfGroup(group.quest.leader,group) && isMemberOfPendingQuest(group.quest.leader,group)') 
-                  |* 
-                a
-                  span(ng-click='clickMember(member._id, true)')
-                    |{{::member.profile.name}}
-              td {{group.quest.members[member._id] === true ? env.t('accepted') : group.quest.members[member._id] === false ? env.t('rejected') : env.t('pending')}}
+        tabset
+          tab(heading=env.t('invitations'))
+            table.table.table-striped(bindonce='group')
+              tr(ng-repeat='member in group.members track by member._id')
+                td
+                  span(ng-if=':: group.quest.leader && group.quest.leader==member._id && isMemberOfGroup(group.quest.leader,group) && isMemberOfPendingQuest(group.quest.leader,group)') 
+                    |* 
+                  a
+                    span(ng-click='clickMember(member._id, true)')
+                      |{{::member.profile.name}}
+                td {{group.quest.members[member._id] === true ? env.t('accepted') : group.quest.members[member._id] === false ? env.t('rejected') : env.t('pending')}}
+
+            span(ng-if=':: group.quest.leader && isMemberOfGroup(group.quest.leader,group) && isMemberOfPendingQuest(group.quest.leader,group)')
+              |* 
+              =env.t('questOwner')
+          // This is commented-out until we have time to work out why it fails intermittently on the website and always on the mobile app (https://github.com/HabitRPG/habitrpg/issues/4074):
+          // span(ng-if=':: group.quest.leader && isMemberOfGroup(group.quest.leader,group) && ! isMemberOfPendingQuest(group.quest.leader,group)')
+            // =env.t('questOwnerNotInPendingQuest')
+          // span(ng-if=':: ! group.quest.leader || ! isMemberOfGroup(group.quest.leader,group)')
+            // =env.t('questOwnerNotInPendingQuestParty')
+          tab(heading=env.t('questDetails'))
+            div(class="quest_{{::group.quest.key}}")
+            div(ng-if='::Content.quests[group.quest.key].boss')
+              h4 {{::Content.quests[group.quest.key].boss.name()}}
+              p
+                strong=env.t('bossHP') + ': '
+                | {{::Content.quests[group.quest.key].boss.hp}}
+              p
+                strong=env.t('bossStrength') + ': '
+                | {{::Content.quests[group.quest.key].boss.str}}
+            div(ng-if='::Content.quests[group.quest.key].collect')
+              p(ng-repeat='(k,v) in ::Content.quests[group.quest.key].collect')
+                strong=env.t('collect') + ': '
+                | {{::Content.quests[group.quest.key].collect[k].count}} {{::Content.quests[group.quest.key].collect[k].text()}}
+            div(ng-bind-html='::Content.quests[group.quest.key].notes()')
 
-          span(ng-if=':: group.quest.leader && isMemberOfGroup(group.quest.leader,group) && isMemberOfPendingQuest(group.quest.leader,group)')
-            |* 
-            =env.t('questOwner')
-        // This is commented-out until we have time to work out why it fails intermittently on the website and always on the mobile app (https://github.com/HabitRPG/habitrpg/issues/4074):
-        // span(ng-if=':: group.quest.leader && isMemberOfGroup(group.quest.leader,group) && ! isMemberOfPendingQuest(group.quest.leader,group)')
-          // =env.t('questOwnerNotInPendingQuest')
-        // span(ng-if=':: ! group.quest.leader || ! isMemberOfGroup(group.quest.leader,group)')
-          // =env.t('questOwnerNotInPendingQuestParty')
-        div(ng-show="questBoxTab === 'detailsTab'")
-          br
-          div(class="quest_{{::group.quest.key}}")
-          div(ng-if='::Content.quests[group.quest.key].boss')
-            h4 {{::Content.quests[group.quest.key].boss.name()}}
-            p
-              strong=env.t('bossHP') + ': '
-              | {{::Content.quests[group.quest.key].boss.hp}}
-            p
-              strong=env.t('bossStrength') + ': '
-              | {{::Content.quests[group.quest.key].boss.str}}
-          div(ng-if='::Content.quests[group.quest.key].collect')
-            p(ng-repeat='(k,v) in ::Content.quests[group.quest.key].collect')
-              strong=env.t('collect') + ': '
-              | {{::Content.quests[group.quest.key].collect[k].count}} {{::Content.quests[group.quest.key].collect[k].text()}}
-          div(ng-bind-html='::Content.quests[group.quest.key].notes()')
         hr
+
         .npc_ian.pull-left
         p=env.t('questStart')
 
@@ -61,71 +57,67 @@ mixin boss(tavern, mobile)
 
       div(ng-if='group.quest.active==true' ng-init="questBoxTab='detailsTab'")
         unless tavern
-          ul.nav.nav-pills
-            li(ng-class="{active:questBoxTab === 'participantsTab'}")
-              a(ng-click="questBoxTab = 'participantsTab'")=env.t('questParticipants')
-            li(ng-class="{active:questBoxTab === 'detailsTab'}")
-              a(ng-click="questBoxTab = 'detailsTab'")=env.t('questDetails')
-          div(ng-show="questBoxTab === 'participantsTab'")
-            br
-            table.table.table-striped(bindonce='group')
-              tr(ng-repeat='(k,v) in group.members track by v._id', ng-if='::group.quest.members[v._id]')
-                td
-                  span(ng-if=':: group.quest.leader && group.quest.leader==v._id && isMemberOfGroup(group.quest.leader,group) && isMemberOfRunningQuest(group.quest.leader,group)')
-                    |* 
-                  a
-                    span(ng-click='clickMember(v._id, true)')
-                      |{{::v.profile.name}}
-            span(ng-if=':: group.quest.leader && isMemberOfGroup(group.quest.leader,group) && isMemberOfRunningQuest(group.quest.leader,group)')
-              |* 
-              =env.t('questOwner')
-            // This is commented-out until we have time to work out why it fails intermittently on the website and always on the mobile app (https://github.com/HabitRPG/habitrpg/issues/4074):
-            // span(ng-if=':: group.quest.leader && isMemberOfGroup(group.quest.leader,group) && ! isMemberOfRunningQuest(group.quest.leader,group)')
-              // =env.t('questOwnerNotInRunningQuest')
-            // span(ng-if=':: ! group.quest.leader || ! isMemberOfGroup(group.quest.leader,group)')
-              // =env.t('questOwnerNotInRunningQuestParty')
-        div(ng-show="questBoxTab === 'detailsTab'")
-          unless tavern
-            br
-          div(ng-if='::Content.quests[group.quest.key].boss',ng-init='boss=Content.quests[group.quest.key].boss;progress=group.quest.progress')
-            if tavern
-              div(class="quest_{{group.quest.key}} quest_{{group.quest.key}}_#{env.worldDmg.recent}")
-            else
-              div(class="quest_{{::group.quest.key}}")
-            //-
-              .progress
-              .bar(style='width: {{Shared.percent(group.quest.hp, Content.quests[group.quest.key].hp)}}%;')
-              span.meter-text
-                span.glyphicon.glyphicon-heart
-                | {{group.quest.hp | number:0}} / {{Content.quests[group.quest.key].hp}}
-            .hero-stats
-              .meter-label(tooltip=env.t('bossHP'))
-                span.glyphicon.glyphicon-heart
-              .meter.health
-                .bar(style='width: {{Shared.percent(progress.hp, boss.hp)}}%;')
-                span.meter-text.value
-                  | {{Math.ceil(progress.hp) | roundLargeNumbers}} / {{boss.hp | roundLargeNumbers}}
-              .meter-label(tooltip='Rage', ng-if='boss.rage')
-                span.glyphicon.glyphicon-fire
-              .meter.mana(ng-if='boss.rage',popover="{{::boss.rage.description()}}",popover-title="{{::boss.rage.title()}}",popover-trigger='mouseenter',popover-placement='right')
-                .bar(style='width: {{Shared.percent(progress.rage, boss.rage.value)}}%;')
-                span.meter-text.value
-                  | {{Math.ceil(progress.rage)  | roundLargeNumbers}} / {{boss.rage.value | roundLargeNumbers}}
-          div(ng-if='::Content.quests[group.quest.key].collect')
-            div(class="quest_{{::group.quest.key}}")
-            h4=env.t('collected') + ':'
-            table.table.table-striped
-              tr(ng-repeat='(k,v) in group.quest.progress.collect', class='quest_collected_{{v >= Content.quests[group.quest.key].collect[k].count}}')
-                td
-                  div.pull-left(class='quest_{{::group.quest.key}}_{{::k}}')
-                  | {{::Content.quests[group.quest.key].collect[k].text()}}
-                td
-                  |{{v}} / {{Content.quests[group.quest.key].collect[k].count}}
+          tabset
+            tab(heading=env.t('questDetails'))
+              div(ng-if='::Content.quests[group.quest.key].boss',ng-init='boss=Content.quests[group.quest.key].boss;progress=group.quest.progress')
+                if tavern
+                  div(class="quest_{{group.quest.key}} quest_{{group.quest.key}}_#{env.worldDmg.recent}")
+                else
+                  div(class="quest_{{::group.quest.key}}")
+                //-
+                  .progress
+                  .bar(style='width: {{Shared.percent(group.quest.hp, Content.quests[group.quest.key].hp)}}%;')
+                  span.meter-text
+                    span.glyphicon.glyphicon-heart
+                    | {{group.quest.hp | number:0}} / {{Content.quests[group.quest.key].hp}}
+                .hero-stats
+                  .meter-label(tooltip=env.t('bossHP'))
+                    span.glyphicon.glyphicon-heart
+                  .meter.health
+                    .bar(style='width: {{Shared.percent(progress.hp, boss.hp)}}%;')
+                    span.meter-text.value
+                      | {{Math.ceil(progress.hp) | roundLargeNumbers}} / {{boss.hp | roundLargeNumbers}}
+                  .meter-label(tooltip='Rage', ng-if='boss.rage')
+                    span.glyphicon.glyphicon-fire
+                  .meter.mana(ng-if='boss.rage',popover="{{::boss.rage.description()}}",popover-title="{{::boss.rage.title()}}",popover-trigger='mouseenter',popover-placement='right')
+                    .bar(style='width: {{Shared.percent(progress.rage, boss.rage.value)}}%;')
+                    span.meter-text.value
+                      | {{Math.ceil(progress.rage)  | roundLargeNumbers}} / {{boss.rage.value | roundLargeNumbers}}
+              div(ng-if='::Content.quests[group.quest.key].collect')
+                div(class="quest_{{::group.quest.key}}")
+                h4=env.t('collected') + ':'
+                table.table.table-striped
+                  tr(ng-repeat='(k,v) in group.quest.progress.collect', class='quest_collected_{{v >= Content.quests[group.quest.key].collect[k].count}}')
+                    td
+                      div.pull-left(class='quest_{{::group.quest.key}}_{{::k}}')
+                      | {{::Content.quests[group.quest.key].collect[k].text()}}
+                    td
+                      |{{v}} / {{Content.quests[group.quest.key].collect[k].count}}
+
+              div(ng-bind-html='::Content.quests[group.quest.key].notes()')
+              unless tavern
+                quest-rewards(key='{{::group.quest.key}}')
+
+            tab(heading=env.t('questParticipants'))
+              table.table.table-striped(bindonce='group')
+                tr(ng-repeat='(k,v) in group.members track by v._id', ng-if='::group.quest.members[v._id]')
+                  td
+                    span(ng-if=':: group.quest.leader && group.quest.leader==v._id && isMemberOfGroup(group.quest.leader,group) && isMemberOfRunningQuest(group.quest.leader,group)')
+                      |* 
+                    a
+                      span(ng-click='clickMember(v._id, true)')
+                        |{{::v.profile.name}}
+              span(ng-if=':: group.quest.leader && isMemberOfGroup(group.quest.leader,group) && isMemberOfRunningQuest(group.quest.leader,group)')
+                |* 
+                =env.t('questOwner')
+              // This is commented-out until we have time to work out why it fails intermittently on the website and always on the mobile app (https://github.com/HabitRPG/habitrpg/issues/4074):
+              // span(ng-if=':: group.quest.leader && isMemberOfGroup(group.quest.leader,group) && ! isMemberOfRunningQuest(group.quest.leader,group)')
+                // =env.t('questOwnerNotInRunningQuest')
+              // span(ng-if=':: ! group.quest.leader || ! isMemberOfGroup(group.quest.leader,group)')
+                // =env.t('questOwnerNotInRunningQuestParty')
 
-          div(ng-bind-html='::Content.quests[group.quest.key].notes()')
-          unless tavern
-            quest-rewards(key='{{::group.quest.key}}')
         hr
+
         div(ng-if='::Content.quests[group.quest.key].boss')
           .npc_ian.pull-left
           if tavern