diff --git a/html/styles/main.css b/html/styles/main.css
index 18679ed..14ee2d1 100644
--- a/html/styles/main.css
+++ b/html/styles/main.css
@@ -19,6 +19,10 @@ nav {
top: 0;
}
+nav .hamburger {
+ display: none;
+}
+
nav ul {
list-style-type: none;
display: block;
@@ -297,4 +301,126 @@ h2 {
bottom: 0;
left: 2px;
font-size: 12px;
-}
\ No newline at end of file
+}
+
+@media (max-aspect-ratio: 1/1.4) {
+ nav {
+ background: transparent;
+ height: 60px;
+ width: 60px;
+ left: initial;
+ right: 0;
+ border: none;
+ transition: background-color 0.3s, width 0.3s, height 0.3s;
+ z-index: 10;
+ }
+
+ nav .hamburger {
+ position: absolute;
+ right: 0;
+ display: block;
+ font-size: 40px;
+ padding: 10px;
+ margin: 0;
+ transition: color 0.3s;
+ }
+
+ nav .hamburger .checkbox {
+ position: absolute;
+ right: 5px;
+ width: 40px;
+ height: 40px;
+ cursor: pointer;
+ opacity: 0;
+ }
+
+ nav:has(> .hamburger input[type="checkbox"]:checked) {
+ width: 100%;
+ height: 100%;
+ background-color: black;
+ }
+
+ nav:has(> .hamburger input[type="checkbox"]:checked) .hamburger {
+ color: white;
+ }
+
+ nav ul {
+ margin-top: 60px;
+ display: none;
+ width: 50%;
+ }
+
+ nav .left {
+ left: 0;
+ }
+
+ nav .right {
+ right: 0;
+ }
+
+ nav ul li, nav ul li a {
+ display: block;
+ width: 50vw;
+ font-size: 40px;
+ }
+
+ nav .right a {
+ text-align: right;
+ }
+
+ nav ul li a:hover, nav ul li.active a {
+ box-shadow: inset 50vw 0 0 0 white;
+ }
+
+ nav:has(> .hamburger input[type="checkbox"]:checked) ul {
+ display: block;
+ }
+
+ h1 {
+ font-size: 35px;
+ margin-top: 0;
+ margin-bottom: 3vh;
+ }
+
+ .selection {
+ flex-direction: column;
+ max-width: 90vw;
+ align-items: center;
+ height: 100%;
+ }
+
+
+ .separator {
+ height: 13vh;
+ width: 100%;
+ }
+
+ .separator .new-pairing {
+ bottom: 0;
+ }
+
+ .mob {
+ width: 25vh;
+ height: 30vh;
+ }
+
+ .mob h2 {
+ margin: 0;
+ }
+
+ .mob img {
+ width: 25vh;
+ height: 25vh;
+ margin-top: 5vh;
+ margin-left: 0;
+ }
+
+ .middle .or, .middle .spinner{
+ top: 57%;
+ }
+
+ .middle .spinner img {
+ width: auto;
+ height: 7vh;
+ }
+}
diff --git a/view/layout.php b/view/layout.php
index 316af23..108d235 100644
--- a/view/layout.php
+++ b/view/layout.php
@@ -18,9 +18,14 @@
+