diff --git a/frontend/src/lib/components/BottomAppBar.svelte b/frontend/src/lib/components/BottomAppBar.svelte
index d339db0..5cb44c6 100644
--- a/frontend/src/lib/components/BottomAppBar.svelte
+++ b/frontend/src/lib/components/BottomAppBar.svelte
@@ -18,6 +18,9 @@
 		position: fixed;
 		bottom: 0;
 		left: 0;
+		display: grid;
+		height: 10vh;
+		margin-bottom: 10px;
 	}
 	#container {
 		display: flex;
@@ -28,7 +31,7 @@
 		box-shadow: 0 0 50px #ccc;
 		background-color: var(--card-background-color);
 		margin: 0 auto;
-		margin-bottom: 10px;
+	
 	}
 
 	#container > a {
diff --git a/frontend/src/lib/components/Path.svelte b/frontend/src/lib/components/Path.svelte
index 4217ba8..94cd96c 100644
--- a/frontend/src/lib/components/Path.svelte
+++ b/frontend/src/lib/components/Path.svelte
@@ -75,8 +75,10 @@
 		display: grid;
 		height: 100%;
 		align-content: center;
-		padding: 20px;
-		font-size: 28px;
+		padding: 0;
+		margin-left: 10px;
+		margin-right:10px;
+		font-size: 27px;
 	}
 
 	.route-card .name > * {
diff --git a/frontend/src/routes/+layout.svelte b/frontend/src/routes/+layout.svelte
index 6149d40..fc35be1 100644
--- a/frontend/src/routes/+layout.svelte
+++ b/frontend/src/routes/+layout.svelte
@@ -32,10 +32,15 @@
 </script>
 
 <div bind:this={node}></div>
-<slot />
-	<BottomAppBar />
+
+<main><slot /></main>
+<BottomAppBar />
 
 <style>
+	main {
+		max-height: calc(100% - 10vh - 10px);
+	}
+
 	div {
 		position: absolute;
 		width: 0;
diff --git a/frontend/src/routes/+page.svelte b/frontend/src/routes/+page.svelte
index 983875c..c6fe874 100644
--- a/frontend/src/routes/+page.svelte
+++ b/frontend/src/routes/+page.svelte
@@ -5,11 +5,8 @@
 </script>
 
 <Splash />
-<header>
-	<div id="welcome-message">Benvenuti a <span class="bold">Pianello Val Tidone</span></div>
-</header>
-
 <main>
+	<div id="welcome-message">Benvenuti a <span class="bold">Pianello Val Tidone</span></div>
 	<div id="route-cards">
 		<Path color="#de0e1b" type="naturalistici" />
 		<Path color="#f6ae04" type="storici" />
@@ -18,28 +15,32 @@
 </main>
 
 <style>
-	header {
-		text-align: center;
-		display: grid;
-		place-items: center;
-	}
 	main {
 		width: 100%;
-		height: 72vh;
+		height: 100%;
 		margin: 0px;
 		font-family: 'Roboto-Regular';
-		display: grid;
+		display: flex;
+		flex-direction: column;
 		place-items: center;
 	}
 
 	.bold {
 		font-weight: bold;
+		font-size: 22px;
 	}
 	#welcome-message {
 		font-size: 18px;
+		height: 15%;
+		display: grid;
+		width: 100%;
+		place-content: center;
+		grid-template-columns: 1fr;
+		text-align: center;
 	}
 
 	#route-cards {
+		height: 80%;
 		display: flex;
 		flex-direction: column;
 		height: 100%;