diff --git a/website/client/assets/scss/animals.scss b/website/client/assets/scss/animals.scss
new file mode 100644
index 0000000000..a75f6dcb17
--- /dev/null
+++ b/website/client/assets/scss/animals.scss
@@ -0,0 +1,20 @@
+.Pet {
+  margin: auto !important;
+  display: block;
+  position: relative;
+  right: 0;
+  bottom: 0;
+  left: 0;
+
+  &:not([class*="FlyingPig"]) {
+    top: -28px !important;
+  }
+}
+
+.Pet[class*="FlyingPig"] {
+  top: 7px !important;
+}
+
+.Pet.Pet-Dragon-Hydra {
+  top: -16px !important;
+}
diff --git a/website/client/assets/scss/index.scss b/website/client/assets/scss/index.scss
index 88df7bf699..6c2fa94f5a 100644
--- a/website/client/assets/scss/index.scss
+++ b/website/client/assets/scss/index.scss
@@ -33,3 +33,4 @@
 @import './banner';
 @import './progress-bar';
 @import './pin';
+@import './animals';
diff --git a/website/client/components/inventory/stable/index.vue b/website/client/components/inventory/stable/index.vue
index f9a37b95cb..51eb5078cb 100644
--- a/website/client/components/inventory/stable/index.vue
+++ b/website/client/components/inventory/stable/index.vue
@@ -276,18 +276,6 @@
     display: inline-block;
   }
 
-  .stable .item .item-content.Pet:not(.FlyingPig) {
-    top: -28px;
-  }
-
-  .stable .item .item-content.FlyingPig {
-    top: 7px;
-  }
-
-  .stable .item .item-content.Pet-Dragon-Hydra {
-    top: -16px !important;
-  }
-
   .hatchablePopover {
     width: 180px
   }
diff --git a/website/client/components/userMenu/profile.vue b/website/client/components/userMenu/profile.vue
index ee89f50450..531c374f1e 100644
--- a/website/client/components/userMenu/profile.vue
+++ b/website/client/components/userMenu/profile.vue
@@ -189,7 +189,7 @@ div
             .row.col-12
               .col-12.col-md-4
                 .box(:class='{white: user.items.currentPet}')
-                  .pet(:class="`Pet-${user.items.currentPet}`")
+                  .Pet(:class="`Pet-${user.items.currentPet}`")
               .col-12.col-md-8
                 div
                   | {{ formatAnimal(user.items.currentPet, 'pet') }}
@@ -340,10 +340,6 @@ div
     margin-bottom: 2em;
   }
 
-  .pet {
-    margin-top: -1.4em !important;
-  }
-
   .mount {
     margin-top: -0.2em !important;
   }