diff --git a/package-lock.json b/package-lock.json
index 02100ae..0e009fa 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -29,7 +29,7 @@
 				"react-router-dom": "^6.4.0",
 				"react-scripts": "^5.0.1",
 				"sass": "^1.54.9",
-				"swiper": "^8.4.2",
+				"swiper": "^11.0.6",
 				"typescript": "^4.9.5"
 			},
 			"devDependencies": {
@@ -7083,14 +7083,6 @@
 				"url": "https://github.com/cheeriojs/dom-serializer?sponsor=1"
 			}
 		},
-		"node_modules/dom7": {
-			"version": "4.0.6",
-			"resolved": "https://registry.npmjs.org/dom7/-/dom7-4.0.6.tgz",
-			"integrity": "sha512-emjdpPLhpNubapLFdjNL9tP06Sr+GZkrIHEXLWvOGsytACUrkbeIdjO5g77m00BrHTznnlcNqgmn7pCN192TBA==",
-			"dependencies": {
-				"ssr-window": "^4.0.0"
-			}
-		},
 		"node_modules/domelementtype": {
 			"version": "2.3.0",
 			"resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-2.3.0.tgz",
@@ -15238,11 +15230,6 @@
 			"resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz",
 			"integrity": "sha512-D9cPgkvLlV3t3IzL0D0YLvGA9Ahk4PcvVwUbN0dSGr1aP0Nrt4AEnTUbuGvquEC0mA64Gqt1fzirlRs5ibXx8g=="
 		},
-		"node_modules/ssr-window": {
-			"version": "4.0.2",
-			"resolved": "https://registry.npmjs.org/ssr-window/-/ssr-window-4.0.2.tgz",
-			"integrity": "sha512-ISv/Ch+ig7SOtw7G2+qkwfVASzazUnvlDTwypdLoPoySv+6MqlOV10VwPSE6EWkGjhW50lUmghPmpYZXMu/+AQ=="
-		},
 		"node_modules/stable": {
 			"version": "0.1.8",
 			"resolved": "https://registry.npmjs.org/stable/-/stable-0.1.8.tgz",
@@ -15857,9 +15844,9 @@
 			}
 		},
 		"node_modules/swiper": {
-			"version": "8.4.7",
-			"resolved": "https://registry.npmjs.org/swiper/-/swiper-8.4.7.tgz",
-			"integrity": "sha512-VwO/KU3i9IV2Sf+W2NqyzwWob4yX9Qdedq6vBtS0rFqJ6Fa5iLUJwxQkuD4I38w0WDJwmFl8ojkdcRFPHWD+2g==",
+			"version": "11.0.6",
+			"resolved": "https://registry.npmjs.org/swiper/-/swiper-11.0.6.tgz",
+			"integrity": "sha512-W/Me7MQl5rNgdM5x9i3Gll76WsyVpnHn91GhBOyL7RCFUeg62aVnflzlVfIpXzZ/87FtJOfAoDH79ZH2Yq76zA==",
 			"funding": [
 				{
 					"type": "patreon",
@@ -15870,11 +15857,6 @@
 					"url": "http://opencollective.com/swiper"
 				}
 			],
-			"hasInstallScript": true,
-			"dependencies": {
-				"dom7": "^4.0.4",
-				"ssr-window": "^4.0.2"
-			},
 			"engines": {
 				"node": ">= 4.7.0"
 			}
diff --git a/package.json b/package.json
index b47ef5c..c8b8251 100644
--- a/package.json
+++ b/package.json
@@ -50,7 +50,7 @@
 		"react-router-dom": "^6.4.0",
 		"react-scripts": "^5.0.1",
 		"sass": "^1.54.9",
-		"swiper": "^8.4.2",
+		"swiper": "^11.0.6",
 		"typescript": "^4.9.5"
 	},
 	"devDependencies": {
diff --git a/src/components/projects/ProjectsList.tsx b/src/components/projects/ProjectsList.tsx
index cf5d5e6..7989db6 100644
--- a/src/components/projects/ProjectsList.tsx
+++ b/src/components/projects/ProjectsList.tsx
@@ -13,9 +13,9 @@ export default function ProjectsList() {
 	return (
 		<Swiper>
 			{projects?.map(project => (
-				<SwiperSlide key={project.id}>
-					<Grid item key={project.title} xs={12} sm={9} md={6}>
-						<Card sx={{p: "1rem"}}>
+				<SwiperSlide key={project.id} style={{padding: ".1rem", maxWidth: "28rem", height: "auto"}}>
+					<Grid item key={project.title} xs={12} sm={9} md={6} height="100%">
+						<Card sx={{p: "1rem", height: "100%", display: "flex", flexDirection: "column"}}>
 							<Image
 								src={`/media/project/${project.id}.webp`}
 								alt={`${t("project.imageAlt")} ${project.title}`}
diff --git a/src/components/services/ServicesList.tsx b/src/components/services/ServicesList.tsx
index 5e4a4e2..d73d116 100644
--- a/src/components/services/ServicesList.tsx
+++ b/src/components/services/ServicesList.tsx
@@ -12,9 +12,9 @@ export default function ServicesList() {
 	return (
 		<Swiper>
 			{services.map(service => (
-				<SwiperSlide key={service.id}>
-					<Grid item key={service.title} xs={12} sm={9} md={6}>
-						<Card sx={{p: "1rem", backgroundColor: "background.default"}}>
+				<SwiperSlide key={service.id} style={{padding: ".1rem", maxWidth: "28rem", height: "auto"}}>
+					<Grid item key={service.title} xs={12} sm={9} md={6} height="100%">
+						<Card sx={{p: "1rem", height: "100%", display: "flex", flexDirection: "column"}}>
 							<Image
 								src={`/media/service/${service.id}.webp`}
 								alt={`${t("service.imageAlt")} ${service.title}`}
@@ -41,7 +41,7 @@ export default function ServicesList() {
 									))}
 								</ul>
 							</CardContent>
-							<CardActions>
+							<CardActions sx={{marginTop: "auto"}}>
 								<Button fullWidth variant={"outlined"} href={service.href}>
 									{t("service.learnMore")}
 								</Button>
diff --git a/src/components/swiper/Swiper.tsx b/src/components/swiper/Swiper.tsx
index c9a66fa..7ecb3bf 100644
--- a/src/components/swiper/Swiper.tsx
+++ b/src/components/swiper/Swiper.tsx
@@ -1,5 +1,5 @@
 import React from "react";
-import { Autoplay, Mousewheel, Navigation, Pagination } from "swiper";
+import { Autoplay, Mousewheel, Navigation, Pagination } from "swiper/modules";
 import { Swiper as ReactSwiper } from "swiper/react";
 
 type Props = {
@@ -16,7 +16,6 @@ export default function Swiper({children}: Props) {
 			mousewheel={true}
 			autoplay={{delay: 10000, disableOnInteraction: false}}
 			modules={[Mousewheel, Autoplay, Pagination, Navigation]}
-			className="services-carousel"
 		>
 			{children}
 		</ReactSwiper>
diff --git a/src/styles/main.sass b/src/styles/main.sass
index 2382316..27dc9cd 100644
--- a/src/styles/main.sass
+++ b/src/styles/main.sass
@@ -19,10 +19,6 @@ main
 	padding-left: .5rem
 	padding-right: .5rem
 
-/* ********************************************* swiper ********************************************* */
-.swiper-slide
-	max-width: 25rem
-
 /* ********************************************* footer ********************************************* */
 footer
 	a