centering home page content

latosa-frontend/app/page.tsx

@@ -8,7 +8,7 @@ export default async function Home() {
 	return (
 		<main>
 			<Hero />
-			<div className="flex flex-col">
+			<div className="flex flex-col p-12">
 				<Features
 					title="DÉVELOPPEMENT DU SYSTÈME"
 					description="Latosa Escrima Concepts est un système martial dynamique et en constante évolution. Ce système repose sur une approche logique, qui progresse au fil du développement des compétences techniques des pratiquants."
@@ -108,9 +108,9 @@ export default async function Home() {
 						</ul>
 					</FeatureItem>
 				</Features>
+				<Gallery6 />
+				<Gallery6 />
 			</div>
-			<Gallery6 />
-			<Gallery6 />
 		</main>
 	);
 }

latosa-frontend/components/features.tsx

@@ -8,8 +8,8 @@ const Features: React.FC<
 	}>
 > = ({ title, description, cta, children }) => {
 	return (
-		<section className="py-32 px-4 container self-center">
+		<section className="lg:md:py-24 sm:py-12 container self-center">
-			<div className="flex flex-col gap-16 lg:px-16">
+			<div className="flex flex-col gap-16">
 				<div className="lg:max-w-sm">
 					<h2 className="mb-3 text-xl font-semibold md:mb-4 md:text-4xl lg:mb-6">
 						{title}

latosa-frontend/components/gallery.tsx

@@ -73,7 +73,7 @@ const Gallery6 = () => {
 		};
 	}, [carouselApi]);
 	return (
-		<section className="py-32 py-32 flex flex-col items-center overflow-visible">
+		<section className="lg:md:py-24 sm:py-12 flex flex-col items-center overflow-visible">
 			<div className="container">
 				<div className="mb-8 flex flex-col justify-between md:mb-14 md:flex-row md:items-end lg:mb-16">
 					<div>