diff --git a/app/layout.tsx b/app/layout.tsx
index 95e62e5bc..74bbc1866 100644
--- a/app/layout.tsx
+++ b/app/layout.tsx
@@ -33,7 +33,7 @@ const inter = Inter({
 export default async function RootLayout({ children }: { children: ReactNode }) {
   return (
     <html lang="en" className={inter.variable}>
-      <body className="text-black bg-gray-50 selection:bg-teal-300 dark:bg-dark dark:text-white dark:selection:bg-fuchsia-600 dark:selection:text-white">
+      <body className="bg-gray-50 text-black selection:bg-teal-300 dark:bg-dark dark:text-white dark:selection:bg-fuchsia-600 dark:selection:text-white">
         <Navbar />
         <Suspense>
           <main>{children}</main>
diff --git a/components/carousel.tsx b/components/carousel.tsx
index 9607229e5..2a8d2526f 100644
--- a/components/carousel.tsx
+++ b/components/carousel.tsx
@@ -1,11 +1,7 @@
 import { getCollectionProducts } from 'lib/shopify';
 import Image from 'next/image';
 import Link from 'next/link';
-<<<<<<< HEAD
 import Label from './label';
-=======
-import Price from './price';
->>>>>>> 27a839e (home page updated UI design)
 
 export async function Carousel() {
   // Collections that start with `hidden-*` are hidden from the search page.
@@ -14,8 +10,8 @@ export async function Carousel() {
   if (!products?.length) return null;
 
   return (
-    <div className="relative w-full pb-6 overflow-hidden">
-      <div className="flex space-x-4 animate-carousel">
+    <div className="relative w-full overflow-hidden pb-6">
+      <div className="flex animate-carousel space-x-4">
         {[...products, ...products].map((product, i) => (
           <Link
             key={`${product.handle}${i}`}
@@ -25,7 +21,7 @@ export async function Carousel() {
             {product.featuredImage ? (
               <Image
                 alt={product.title}
-                className="object-contain h-full"
+                className="h-full object-contain"
                 fill
                 sizes="33vw"
                 src={product.featuredImage.url}
diff --git a/components/label.tsx b/components/label.tsx
index 21a3007d1..5778e23cf 100644
--- a/components/label.tsx
+++ b/components/label.tsx
@@ -33,12 +33,12 @@ const Label = ({
       >
         <h3
           data-testid="product-name"
-          className="inline pl-2 mr-6 font-semibold leading-none tracking-tight"
+          className="mr-6 inline pl-2 font-semibold leading-none tracking-tight"
         >
           {title}
         </h3>
         <Price
-          className="flex-none p-2 font-semibold text-white bg-blue-600 rounded-full"
+          className="flex-none rounded-full bg-blue-600 p-2 font-semibold text-white"
           amount={amount}
           currencyCode={currencyCode}
         />
diff --git a/components/product/gallery.tsx b/components/product/gallery.tsx
index 093418087..13711cdb1 100644
--- a/components/product/gallery.tsx
+++ b/components/product/gallery.tsx
@@ -25,7 +25,7 @@ export function Gallery({ images }: { images: { src: string; altText: string }[]
       <div className="relative mb-12 h-full max-h-[550px] overflow-hidden">
         {images[currentImage] && (
           <Image
-            className="relative object-contain w-full h-full"
+            className="relative h-full w-full object-contain"
             height={600}
             width={600}
             alt={images[currentImage]?.altText as string}
@@ -35,7 +35,7 @@ export function Gallery({ images }: { images: { src: string; altText: string }[]
 
         {images.length > 1 ? (
           <div className="absolute bottom-[15%] flex w-full justify-center">
-            <div className="flex items-center mx-auto text-gray-500 border border-white rounded-full h-11 bg-light/80 backdrop-blur dark:border-black dark:bg-dark/80">
+            <div className="mx-auto flex h-11 items-center rounded-full border border-white bg-light/80 text-gray-500 backdrop-blur dark:border-black dark:bg-dark/80">
               <button
                 aria-label="Previous product image"
                 onClick={() => handleNavigate('previous')}
@@ -43,7 +43,7 @@ export function Gallery({ images }: { images: { src: string; altText: string }[]
               >
                 <ArrowLeftIcon className="h-5" />
               </button>
-              <div className="w-px h-6 mx-1 bg-gray-500"></div>
+              <div className="mx-1 h-6 w-px bg-gray-500"></div>
               <button
                 aria-label="Next product image"
                 onClick={() => handleNavigate('next')}
