diff --git a/.idea/valier.iml b/.idea/valier.iml
index 8d18b36..e9008c5 100644
--- a/.idea/valier.iml
+++ b/.idea/valier.iml
@@ -2,6 +2,8 @@
 <module type="WEB_MODULE" version="4">
   <component name="NewModuleRootManager">
     <content url="file://$MODULE_DIR$">
+      <sourceFolder url="file://$MODULE_DIR$/spec" isTestSource="true" />
+      <sourceFolder url="file://$MODULE_DIR$/tests" isTestSource="true" />
       <excludeFolder url="file://$MODULE_DIR$/vendor/composer" />
       <excludeFolder url="file://$MODULE_DIR$/vendor/dealerdirect/phpcodesniffer-composer-installer" />
       <excludeFolder url="file://$MODULE_DIR$/vendor/eftec/bladeone" />
diff --git a/tailwind/custom/base.css b/tailwind/custom/base.css
index 49d74b0..71d1b18 100644
--- a/tailwind/custom/base.css
+++ b/tailwind/custom/base.css
@@ -13,5 +13,23 @@
 */
 body {
 	@apply bg-background text-tertiary font-sans;
-	font-size: 18px;
+	font-size: 14px;
+	@media screen(lg) {
+		font-size: 18px;
+	}
+}
+
+#menu-toggle:checked + #menu {
+	display: flex;
+	justify-content: center;
+}
+
+@media (max-width: 768px) {
+	footer {
+		.legal, .wp-block-group {
+			flex-direction: column;
+			margin-left: 1rem;
+			margin-right: 1rem;
+		}
+	}
 }
diff --git a/tailwind/custom/components/components.css b/tailwind/custom/components/components.css
index b59a584..4dec8ec 100644
--- a/tailwind/custom/components/components.css
+++ b/tailwind/custom/components/components.css
@@ -62,10 +62,10 @@ header {
 	background-size: cover;
 	background-position: center;
 
-	#site-navigation {
-		img.linkedin {
-			height: 1rem;
-		}
+	img.linkedin {
+		height: 1rem;
+		margin-left: 1rem;
+		margin-top: -0.5rem;
 	}
 
 	.header-cointainer {
@@ -84,6 +84,8 @@ header {
 
 		video {
 			width: 100%;
+			height: 100%;
+			object-fit: cover;
 		}
 	}
 
@@ -116,7 +118,13 @@ footer {
 		top: 15%;
 		z-index: 1000;
 		width: 40vw;
+		min-width: 500px;
 		margin-left: 15vw;
+		@media (max-width: 500px) {
+			width: 90vw;
+			min-width: 0;
+			margin: 5vw;
+		}
 	}
 }
 
@@ -128,13 +136,16 @@ footer {
 		@apply absolute;
 		left: -10vw;
 		top: 10vw;
+		@media (max-width: 500px) {
+			left: 10vw;
+		}
 	}
 }
 
 .overlay-icons {
-	@apply absolute drop-shadow-xl p-5;
+	@apply p-5;
 	width: 40vw;
-
+	min-width: 645px;
 	img {
 		width: 100px;
 	}
@@ -142,4 +153,8 @@ footer {
 	p {
 		width: 250px;
 	}
+
+	@media (min-width: 782px) {
+		@apply drop-shadow-xl absolute;
+	}
 }
diff --git a/theme/footer.php b/theme/footer.php
index b6d4ca3..fc131cb 100644
--- a/theme/footer.php
+++ b/theme/footer.php
@@ -18,6 +18,6 @@
 </div><!-- #page -->
 
 <?php wp_footer(); ?>
-
+<div class="m-2 hidden"></div>
 </body>
 </html>
diff --git a/theme/template-parts/layout/footer-content.php b/theme/template-parts/layout/footer-content.php
index 4eb1626..fe64437 100644
--- a/theme/template-parts/layout/footer-content.php
+++ b/theme/template-parts/layout/footer-content.php
@@ -24,7 +24,7 @@
 		</a>
 	</div>
 	<div class="bg-primary text-black py-2 has-playfair-font-family">
-		<div class="container mx-auto has-mini-font-size flex justify-center gap-3 italic">
+		<div class="container legal mx-auto has-mini-font-size flex justify-center gap-3 italic">
 			<?= get_field('texto_legal', 'option') ?>
 			<?php
 			wp_nav_menu(
diff --git a/theme/template-parts/layout/header-home.php b/theme/template-parts/layout/header-home.php
index dc07bf3..ccec1e1 100644
--- a/theme/template-parts/layout/header-home.php
+++ b/theme/template-parts/layout/header-home.php
@@ -4,26 +4,47 @@
 	</div>
 
 	<div class="header-cointainer">
-		<div class="container mx-auto flex justify-between self-start justify-self-start ">
-			<img src="<?= get_field('logo_home', 'option') ?>" alt="<?= get_bloginfo('name') ?>">
-			<nav id="site-navigation" aria-label="<?php esc_attr_e('Main Navigation', 'valier'); ?>"
-				 class="has-small-font-size uppercase has-cinzel-font-family flex items-center gap-6">
-				<?php
-				wp_nav_menu(
-					array(
-						'theme_location' => 'menu-primary',
-						'container' => false,
-						'menu_id' => 'menu-primary',
-						'items_wrap' => '<ul id="%1$s" class="%2$s flex justify-center gap-6 text-white " aria-label="submenu">%3$s</ul>',
-					)
-				);
-				?>
-				<a href="<?= get_field('linkedin_link', 'option') ?>" target="_blank">
-					<img src="<?= get_field('abrevitura_de_linkedin', 'option') ?>" alt="Linkedin" class="linkedin">
+		<nav class="container p-4 2xl:mx-auto flex flex-wrap items-center  self-start">
+			<div class="flex-1 flex justify-between items-center">
+				<a href="<?= get_home_url() ?>" class="flex text-lg font-semibold">
+					<img src="<?= get_field('logo_home', 'option') ?>" alt="<?= get_bloginfo('name') ?>">
 				</a>
-			</nav>
+			</div>
+			<label for="menu-toggle" class="cursor-pointer lg:hidden block">
+				<svg
+					class="fill-current text-white"
+					xmlns="http://www.w3.org/2000/svg"
+					width="20"
+					height="20"
+					viewBox="0 0 20 20"
+				>
+					<title>menu</title>
+					<path d="M0 3h20v2H0V3zm0 6h20v2H0V9zm0 6h20v2H0v-2z"></path>
+				</svg>
+			</label>
+			<input class="hidden" type="checkbox" id="menu-toggle"/>
+			<div class="hidden lg:flex lg:items-center lg:w-auto w-full" id="menu">
+				<nav id="site-navigation" aria-label="
+		<?php esc_attr_e('Main Navigation', 'valier'); ?>"
+					 class="has-small-font-size uppercase has-cinzel-font-family flex items-center gap-6">
+					<?php
+					wp_nav_menu(
+						array(
+							'theme_location' => 'menu-primary',
+							'container' => false,
+							'menu_id' => 'menu-primary',
+							'items_wrap' => '<ul id="%1$s" class="%2$s text-xl text-center items-center pt-4 md:gap-x-4 lg:text-lg lg:flex lg:pt-0  gap-6 text-white" aria-label="submenu">%3$s</ul>',
+						)
+					);
+					?>
+
+				</nav>
+			</div>
+			<a href="<?= get_field('linkedin_link', 'option') ?>" target="_blank">
+				<img src="<?= get_field('abrevitura_de_linkedin', 'option') ?>" alt="Linkedin" class="linkedin hidden lg:block  ">
+			</a>
+		</nav>
 
-		</div>
 		<h1 class="self-start justify-self-center has-extreme-font-size has-white-color has-cinzel-font-family uppercase "><?= get_the_title() ?></h1>
 	</div>
 </header>
diff --git a/theme/template-parts/layout/header-page.php b/theme/template-parts/layout/header-page.php
index bc1835b..e5d6f82 100644
--- a/theme/template-parts/layout/header-page.php
+++ b/theme/template-parts/layout/header-page.php
@@ -1,24 +1,43 @@
 <header id="masthead">
 	<div class="bg-white py-6">
-		<div class="container mx-auto flex justify-between self-start justify-self-start ">
-			<?= get_custom_logo() ?>
-			<nav id="site-navigation" aria-label="<?php esc_attr_e('Main Navigation', 'valier'); ?>"
-				 class="has-small-font-size uppercase has-cinzel-font-family flex items-center gap-6 ">
-				<?php
-				wp_nav_menu(
-					array(
-						'theme_location' => 'menu-primary',
-						'container' => false,
-						'menu_id' => 'menu-primary',
-						'items_wrap' => '<ul id="%1$s" class="%2$s flex justify-center gap-6 " aria-label="submenu">%3$s</ul>',
-					)
-				);
-				?>
-				<a href="<?= get_field('linkedin_link', 'option') ?>" target="_blank">
-					<img src="<?= get_field('abrevitura_de_linkedin', 'option') ?>" alt="Linkedin" class="linkedin">
-				</a>
-			</nav>
-		</div>
+		<nav class="container p-4 2xl:mx-auto flex flex-wrap items-center  self-start">
+			<div class="flex-1 flex justify-between items-center">
+				<?= get_custom_logo() ?>
+			</div>
+			<label for="menu-toggle" class="cursor-pointer lg:hidden block">
+				<svg
+					class="fill-current"
+					xmlns="http://www.w3.org/2000/svg"
+					width="20"
+					height="20"
+					viewBox="0 0 20 20"
+				>
+					<title>menu</title>
+					<path d="M0 3h20v2H0V3zm0 6h20v2H0V9zm0 6h20v2H0v-2z"></path>
+				</svg>
+			</label>
+			<input class="hidden" type="checkbox" id="menu-toggle"/>
+			<div class="hidden lg:flex lg:items-center lg:w-auto w-full" id="menu">
+				<nav id="site-navigation" aria-label="
+		<?php esc_attr_e('Main Navigation', 'valier'); ?>"
+					 class="has-small-font-size uppercase has-cinzel-font-family flex items-center gap-6">
+					<?php
+					wp_nav_menu(
+						array(
+							'theme_location' => 'menu-primary',
+							'container' => false,
+							'menu_id' => 'menu-primary',
+							'items_wrap' => '<ul id="%1$s" class="%2$s md:gap-x-4 lg:flex lg:pt-0  gap-6 " aria-label="submenu">%3$s</ul>',
+						)
+					);
+					?>
+
+				</nav>
+			</div>
+			<a href="<?= get_field('linkedin_link', 'option') ?>" target="_blank">
+				<img src="<?= get_field('abrevitura_de_linkedin', 'option') ?>" alt="Linkedin" class="linkedin hidden lg:block  ">
+			</a>
+		</nav>
 	</div>
 	<h1 class="self-start justify-self-center has-extreme-font-size has-white-color has-cinzel-font-family uppercase text-center py-10"
 		style="background-image: url(<?= get_the_post_thumbnail_url() ?>)"><?= get_the_title() ?></h1>