update to use bootstrap built in spacing classes

website/client/src/components/groups/group.vue

@@ -160,7 +160,7 @@
           </div>
         </div>
       </div>
-      <div class="below-header-sections">
+      <div class="px-3 py-3">
         <quest-sidebar-section
           v-if="isParty"
           :group="group"
@@ -255,10 +255,6 @@
   .sidebar {
     background-color: $gray-600;
     padding-bottom: 2em;
-
-    .below-header-sections {
-        padding: 1em 24px 1em 24px;
-      }
   }
 
   .buttons-wrapper {

website/client/src/components/groups/tavern.vue

@@ -229,7 +229,7 @@
           -info-button(@click="showWorldBossInfo()") {{$t('whatIsWorldBoss') }}
           -->
         </div>
-        <div class="sleep below-header-sections">
+        <div class="sleep px-4 py-3">
           <strong v-once>{{ $t('sleepDescription') }}</strong>
           <ul>
             <li v-once>
@@ -263,7 +263,7 @@
           </button>
         </div>
       </div>
-      <div class="px-3">
+      <div class="px-4">
         <sidebar-section :title="$t('staffAndModerators')">
           <div class="row">
             <div
@@ -511,15 +511,6 @@
   .sidebar {
     background-color: $gray-600;
     padding: 0em;
-
-    .below-header-sections {
-      padding: 1em 24px 1em 24px;
-    }
-  }
-
-  .px-3 {
-    padding-right: 24px !important;
-    padding-left: 24px !important;
   }
 
   .pause-button {