diff --git a/website/client/src/assets/images/g1g1-notif.png b/website/client/src/assets/images/g1g1-notif.png
index 75633e6db2..2509b55313 100644
Binary files a/website/client/src/assets/images/g1g1-notif.png and b/website/client/src/assets/images/g1g1-notif.png differ
diff --git a/website/client/src/assets/images/g1g1-send.png b/website/client/src/assets/images/g1g1-send.png
index 774be0b37a..5a401c5bcb 100644
Binary files a/website/client/src/assets/images/g1g1-send.png and b/website/client/src/assets/images/g1g1-send.png differ
diff --git a/website/client/src/components/header/notifications/g1g1.vue b/website/client/src/components/header/notifications/g1g1.vue
index 7076ff7c08..a58028b686 100644
--- a/website/client/src/components/header/notifications/g1g1.vue
+++ b/website/client/src/components/header/notifications/g1g1.vue
@@ -6,14 +6,14 @@
       v-once
       class="mx-auto mb-2"
     >
-      {{ $t('g1g1Announcement') }}
+      {{ $t('g1g1') }}
     </strong>
-    <p
+    <small
       v-once
-      class="mx-4"
+      class="mx-4 mb-3"
     >
       {{ $t('g1g1Details') }}
-    </p>
+    </small>
     <div
       class="btn-secondary mx-auto d-flex"
       @click="showSelectUser()"
@@ -41,19 +41,13 @@
 <style lang='scss' scoped>
   @import '~@/assets/scss/colors.scss';
 
-  p, strong {
+  small, strong {
     color: $white;
   }
 
-  p {
-    font-size: 14px;
-  }
-
   .notification {
     background-image: url('~@/assets/images/g1g1-notif.png');
-    background-size: 378px 204px;
-    width: 378px;
-    height: 204px;
+    height: 10rem;
     padding: 3rem;
     position: relative;
     overflow: hidden;
diff --git a/website/client/src/components/payments/buyGemsModal.vue b/website/client/src/components/payments/buyGemsModal.vue
index abdee6df28..da951ac4be 100644
--- a/website/client/src/components/payments/buyGemsModal.vue
+++ b/website/client/src/components/payments/buyGemsModal.vue
@@ -50,6 +50,33 @@
           </div>
         </div>
       </div>
+      <div
+        v-if="currentEvent && currentEvent.promo && currentEvent.promo === 'g1g1'"
+        class="gift-promo-banner d-flex justify-content-around align-items-center px-4"
+      >
+        <div
+          v-once
+          class="svg-icon svg-gifts left-gift"
+          v-html="icons.gifts"
+        >
+        </div>
+        <div
+          class="d-flex flex-column announce-text text-center"
+        >
+          <strong> {{ $t('g1g1') }} </strong>
+          <small
+            class="px-1 mt-1"
+          >
+            {{ $t('g1g1Details') }}
+          </small>
+        </div>
+        <div
+          v-once
+          class="svg-icon svg-gifts right-gift"
+          v-html="icons.gifts"
+        >
+        </div>
+      </div>
       <div class="container">
         <div class="row text-center">
           <h2
@@ -282,6 +309,30 @@
     line-height: 1.71;
   }
 
+  .gift-promo-banner {
+    width: 100%;
+    height: 5rem;
+    background-image: linear-gradient(90deg, $teal-50 0%, $purple-400 100%);
+
+    .announce-text {
+      color: $white;
+    }
+
+    .left-gift {
+      margin: auto 1rem auto auto;
+    }
+
+    .right-gift {
+      margin: auto auto auto 1rem;
+      filter: flipH;
+      transform: scaleX(-1);
+    }
+
+    .svg-gifts {
+      width: 4.6rem;
+    }
+  }
+
   .header-wrap {
     background-image: linear-gradient(75deg, $purple-300, $purple-200 100%);
     width: 100%;
@@ -324,6 +375,7 @@ import twentyOneGems from '@/assets/svg/21-gems.svg';
 import fortyTwoGems from '@/assets/svg/42-gems.svg';
 import eightyFourGems from '@/assets/svg/84-gems.svg';
 import svgClose from '@/assets/svg/close.svg';
+import gifts from '@/assets/svg/gifts.svg';
 
 import paymentsButtons from '@/components/payments/buttons/list';
 
@@ -344,6 +396,7 @@ export default {
         '21gems': twentyOneGems,
         '42gems': fortyTwoGems,
         '84gems': eightyFourGems,
+        gifts,
       }),
       selectedGemsBlock: null,
       alreadyTracked: false,
diff --git a/website/client/src/components/payments/selectUserModal.vue b/website/client/src/components/payments/selectUserModal.vue
index 0a49146bd4..5873f39fbe 100644
--- a/website/client/src/components/payments/selectUserModal.vue
+++ b/website/client/src/components/payments/selectUserModal.vue
@@ -2,10 +2,20 @@
   <b-modal
     id="select-user-modal"
     :hide-header="true"
-    :hide-footer="true"
+    :hide-footer="!currentEvent || currentEvent.promo !== 'g1g1'"
     @hide="onHide()"
   >
-    <h2 class="ml-2">
+    <div
+      class="g1g1 d-flex flex-column text-center justify-content-center align-items-center"
+      v-if="currentEvent && currentEvent.promo === 'g1g1'"
+    >
+      <h1> {{ $t('g1g1') }} </h1>
+      <p> {{ $t('g1g1Returning') }} </p>
+    </div>
+    <h2
+      class="ml-2"
+      v-else
+    >
       {{ $t('sendGift') }}
     </h2>
     <div class="d-flex flex-column align-items-center">
@@ -18,8 +28,8 @@
           v-html="icons.close"
         ></div>
       </div>
-      <div class="ml-2 mr-auto">
-        <strong> {{ $t('sendGiftToWhom') }} </strong>
+      <div class="mx-auto mt-3">
+        <h3> {{ $t('sendGiftToWhom') }} </h3>
       </div>
       <div
         class="form"
@@ -45,24 +55,54 @@
         >
           {{ $t('userWithUsernameOrUserIdNotFound') }}
         </div>
-        <div class="d-flex justify-content-center align-items-middle mt-3">
-          <a
-            class="my-auto ml-auto mr-3 cancel-link"
-            @click="close()"
-          >
-            {{ $t('cancel') }}
-          </a>
+        <div class="d-flex flex-column justify-content-center align-items-middle mt-3">
           <button
-            class="btn btn-primary my-auto mr-auto"
+            class="btn btn-primary mx-auto mt-2"
             type="submit"
             :disabled="searchCannotSubmit"
             @click="selectUser()"
           >
-            {{ $t('selectGift') }}
+            <div
+              v-if="currentEvent && currentEvent.promo === 'g1g1'"
+            >
+              {{ $t('selectSubscription') }}
+            </div>
+            <div
+              v-else
+            >
+              {{ $t('selectGift') }}
+            </div>
           </button>
+          <a
+            class="cancel-link mx-auto mt-3"
+            @click="close()"
+            >
+            {{ $t('cancel') }}
+          </a>
         </div>
       </div>
     </div>
+    <div
+      class="g1g1-fine-print text-center pt-3"
+      slot="modal-footer"
+    >
+      <strong>
+        {{ $t ('howItWorks') }}
+      </strong>
+      <p
+        class="mx-5 mt-1"
+      >
+        {{ $t ('g1g1HowItWorks') }}
+      </p>
+      <strong>
+        {{ $t ('limitations') }}
+      </strong>
+      <p
+        class="mx-5 mt-1"
+      >
+        {{ $t ('g1g1Limitations') }}
+      </p>
+    </div>
   </b-modal>
 </template>
 
@@ -70,12 +110,22 @@
   @import '~@/assets/scss/mixins.scss';
 
   #select-user-modal {
-    @include centeredModal();
+    .input-group {
+      margin-top: 0rem;
+    }
 
     .modal-dialog {
       width: 29.5rem;
       margin-top: 25vh;
     }
+
+    .modal-footer {
+      padding: 0rem;
+
+      > * {
+        margin: 0rem 0.25rem 0.25rem 0.25rem;
+      }
+    }
   }
 </style>
 
@@ -84,11 +134,12 @@
 
   a:not([href]) {
     color: $blue-10;
-    font-size: 16px;
+    font-size: 0.875rem;
+    line-height: 1.71;
   }
 
-  .form-control {
-    width: 26.5rem;
+  #selectUser {
+    width: 22rem;
     border: 0px;
     color: $gray-50;
   }
@@ -103,17 +154,28 @@
     padding: 1.5rem;
     color: $white;
 
-    .heading {
-      font-size: 16px;
-      font-weight: bold;
-      margin-bottom: 1rem;
+    h1 {
+      font-size: 1.25rem;
+      line-height: 1.4;
+      color: $white;
     }
 
-    .details {
-      padding: 0rem 6rem;
+    p {
+      font-size: 0.75rem;
+      line-height: 1.33;
+      margin-left: 4rem;
+      margin-right: 4rem;
+      margin-bottom: 0rem;
     }
   }
 
+  .g1g1-fine-print {
+    color: $gray-100;
+    background-color: $gray-700;
+    font-size: 0.75rem;
+    line-height: 1.33;
+  }
+
   .input-error {
     color: $red-50;
     font-size: 90%;
@@ -149,6 +211,7 @@
 <script>
 import debounce from 'lodash/debounce';
 import isUUID from 'validator/lib/isUUID';
+import { mapState } from '@/libs/store';
 import closeIcon from '@/assets/svg/close.svg';
 
 export default {
@@ -163,6 +226,9 @@ export default {
     };
   },
   computed: {
+    ...mapState({
+      currentEvent: 'worldState.data.currentEvent',
+    }),
     searchCannotSubmit () {
       if (this.userSearchTerm.length < 1) return true;
       return typeof this.foundUser._id === 'undefined';
diff --git a/website/common/locales/en/groups.json b/website/common/locales/en/groups.json
index f3cb569d2b..cb1fc94319 100644
--- a/website/common/locales/en/groups.json
+++ b/website/common/locales/en/groups.json
@@ -117,6 +117,7 @@
   "leaderOnlyChallenges": "Only group leader can create challenges",
   "sendGift": "Send a Gift",
   "selectGift": "Select Gift",
+  "selectSubscription": "Select Subscription",
   "sendGiftToWhom": "Who would you like to send a gift to?",
   "inviteFriends": "Invite Friends",
   "inviteByEmail": "Invite by Email",
@@ -164,7 +165,7 @@
   "userAlreadyInAParty": "UserID: <%= userId %>, User \"<%= username %>\" already in a party.",
   "userWithIDNotFound": "User with id \"<%= userId %>\" not found.",
   "userWithUsernameNotFound": "User with username \"<%= username %>\" not found.",
-  "usernameOrUserId": "Username or User ID",
+  "usernameOrUserId": "Enter @username or User ID",
   "userWithUsernameOrUserIdNotFound": "Username or User ID not found.",
   "userHasNoLocalRegistration": "User does not have a local registration (username, email, password).",
   "uuidsMustBeAnArray": "User ID invites must be an array.",
diff --git a/website/common/locales/en/limited.json b/website/common/locales/en/limited.json
index 9fd39e6954..f4bd8654de 100644
--- a/website/common/locales/en/limited.json
+++ b/website/common/locales/en/limited.json
@@ -188,5 +188,11 @@
     "winterPromoGiftDetails2": "Please note that if you or your gift recipient already have a recurring subscription, the gifted subscription will only start after that subscription is cancelled or has expired. Thanks so much for your support! <3",
     "discountBundle": "bundle",
     "g1g1Announcement": "<strong>Gift a subscription and get a subscription free</strong> event going on now!",
-    "g1g1Details": "Gift a sub to a friend from their profile and you’ll receive the same sub for free!"
+    "g1g1Details": "Gift a subscription to a friend, and you'll receive the same subscription for free!",
+    "g1g1": "Gift One, Get One",
+    "g1g1Returning": "In honor of the season, we’re bringing back a very special promotion. Now when you gift a subscription, you’ll receive the same in return!",
+    "howItWorks": "How it Works",
+    "g1g1HowItWorks": "Type in the username of the account you’d like to gift to. From there, pick the sub length you’d like to gift and check out. Your account will automatically be rewarded with the same level of subscription you just gifted.",
+    "limitations": "Limitations",
+    "g1g1Limitations": "This is a limited time event that starts on December 17th at 8:00 AM ET (13:00 UTC) and will end January 7th at 8:00 PM ET (1:00 UTC). This promotion only applies when you gift to another Habitican. If you or your gift recipient already have a subscription, the gifted subscription will add months of credit that will only be used after the current subscription is canceled or expires."
 }