diff --git a/src/screens/Characters.vue b/src/screens/Characters.vue
index 881480d..176b7c0 100644
--- a/src/screens/Characters.vue
+++ b/src/screens/Characters.vue
@@ -19,7 +19,7 @@
           <div class="selected-character group-[.active]:max-w-[170px] absolute max-w-0 w-4/6 h-[3px] bg-white rounded-[3px] left-1/2 -bottom-4 -translate-x-1/2 transition-all ease-in-out duration-300"></div>
         </div>
 
-        <div class="character new-character mr-auto m-4 w-[170px] h-[275px] flex flex-col shrink-0 rounded-2xl relative bg-gray-50/50 bg-no-repeat shadow-character" v-if="characters.length < 4">
+        <div class="character new-character first:ml-auto mr-auto m-4 w-[170px] h-[275px] flex flex-col shrink-0 rounded-2xl relative bg-gray-50/50 bg-no-repeat shadow-character" v-if="characters.length < 4">
           <button class="h-full w-full py-10 flex flex-col justify-between" @click="isModalOpen = true">
             <div class="filler"></div>
             <img class="w-24 h-24 m-auto" draggable="false" src="/assets/icons/plus-icon.svg" />