diff --git a/public/images/android-chrome-192x192.png b/public/images/android-chrome-192x192.png
new file mode 100644
index 0000000..0f4ec77
Binary files /dev/null and b/public/images/android-chrome-192x192.png differ
diff --git a/public/images/android-chrome-512x512.png b/public/images/android-chrome-512x512.png
new file mode 100644
index 0000000..4dbc4c8
Binary files /dev/null and b/public/images/android-chrome-512x512.png differ
diff --git a/public/images/apple-touch-icon.png b/public/images/apple-touch-icon.png
new file mode 100644
index 0000000..82f013d
Binary files /dev/null and b/public/images/apple-touch-icon.png differ
diff --git a/public/images/favicon-16x16.png b/public/images/favicon-16x16.png
new file mode 100644
index 0000000..ad39bd9
Binary files /dev/null and b/public/images/favicon-16x16.png differ
diff --git a/public/images/favicon-32x32.png b/public/images/favicon-32x32.png
new file mode 100644
index 0000000..e6be5f4
Binary files /dev/null and b/public/images/favicon-32x32.png differ
diff --git a/public/images/favicon.ico b/public/images/favicon.ico
new file mode 100644
index 0000000..973dab9
Binary files /dev/null and b/public/images/favicon.ico differ
diff --git a/public/images/site.webmanifest b/public/images/site.webmanifest
new file mode 100644
index 0000000..45dc8a2
--- /dev/null
+++ b/public/images/site.webmanifest
@@ -0,0 +1 @@
+{"name":"","short_name":"","icons":[{"src":"/android-chrome-192x192.png","sizes":"192x192","type":"image/png"},{"src":"/android-chrome-512x512.png","sizes":"512x512","type":"image/png"}],"theme_color":"#ffffff","background_color":"#ffffff","display":"standalone"}
\ No newline at end of file
diff --git a/src/app/cities/cities.html b/src/app/cities/cities.html
index 8941012..fbc9d12 100644
--- a/src/app/cities/cities.html
+++ b/src/app/cities/cities.html
@@ -1,4 +1,4 @@
-<div class="container mx-auto py-10 px-5 bg-white flex flex-col gap-6">
+<div class="container mx-auto py-10 px-5 bg-white flex flex-col gap-6 xl:max-w-315 md:px-0">
   <div
     class="text-center text-2xl text-ejc-dark font-extrabold leading-[130%] md:text-[40px]">
     Discover the host cities!
diff --git a/src/app/cover/cover.html b/src/app/cover/cover.html
index 27d6399..198e1ac 100644
--- a/src/app/cover/cover.html
+++ b/src/app/cover/cover.html
@@ -1,16 +1,21 @@
 <div
-  class="h-[calc(100dvh-76px)] md:h-[calc(100dvh-108px)] flex flex-col justify-center items-center px-5 gap-6 bg-[#EAEFFA] md:flex-row md:bg-[url(/images/tatabanya.jpg)] md:bg-cover md:gap-72 md:bg-blend-overlay md:bg-ejc-dark-blue/50">
-  <img
-    src="/images/cover_logo.png"
-    class="w-6/12 md:order-last md:max-h-67 md:w-auto"
-    alt="EJC2026 logo" />
-  <div class="flex flex-col justify-center items-center gap-6 md:gap-7.5 md:items-start">
+  class="h-[calc(100dvh-76px)] md:h-[calc(100dvh-108px)] bg-[#EAEFFA] md:bg-[url(/images/tatabanya.jpg)] md:bg-cover md:bg-blend-overlay md:bg-ejc-dark-blue/50 flex flex-col justify-center items-center">
+  <div
+    class="container flex flex-col justify-center items-center px-5 gap-6 md:flex-row md:justify-around xl:max-w-315 md:px-0">
+    <img
+      src="/images/cover_logo.png"
+      class="w-6/12 md:order-last md:max-h-67 md:w-auto"
+      alt="EJC2026 logo" />
     <div
-      class="text-ejc-dark text-2xl xs:text-[30px] font-extrabold leading-[130%] text-center md:text-left md:text-[60px] md:text-white">
-      2026 European Junior<br />Championships
-    </div>
-    <div class="text-center text-ejc-orange font-bold text-[16px] md:text-[20px]">
-      18-27 Augustus 2026
+      class="flex flex-col justify-center items-center gap-6 md:gap-7.5 md:items-start">
+      <div
+        class="text-ejc-dark text-2xl xs:text-[30px] font-extrabold leading-[130%] text-center md:text-left md:text-[45px] lg:text-[60px] md:text-white">
+        2026 European Junior<br />Championships
+      </div>
+      <div
+        class="text-center text-ejc-orange font-bold text-[16px] md:text-[20px]">
+        18-27 Augustus 2026
+      </div>
     </div>
   </div>
 </div>
diff --git a/src/app/footer/footer.html b/src/app/footer/footer.html
index bcd784a..ad1913f 100644
--- a/src/app/footer/footer.html
+++ b/src/app/footer/footer.html
@@ -1,47 +1,82 @@
-<div class="w-screen bg-ejc-dark-blue px-5 py-10">
-  <div class="container mx-auto flex flex-col gap-6 md:flex-row md:justify-between">
-    <div class="flex justify-center">
-      <img src="/images/logo.png" class="max-w-43.75" alt="Logo" />
-    </div>
-    <div class="flex flex-col gap-3">
-      <div class="text-white font-bold text-[16px] md:text-[20px]">Location</div>
-      <div class="text-white text-[16px] leading-[160%] flex flex-col gap-2.5">
-        <div>Tatabányai Multifunkcionális Csarnok</div>
-        <div class="flex gap-2.5">
-          <app-marker></app-marker>
-          <div class="text-white text-[16px]">2800 Tatabánya, Olimpikon u.</div>
+<div class="w-screen bg-ejc-dark-blue">
+  <div
+    class="container mx-auto flex flex-col gap-6 md:flex-wrap md:justify-center xl:max-w-315 px-5 py-10 md:px-0 lg:flex-row lg:justify-between lg:gap-20 xl:gap-30">
+    <div
+      class="flex flex-col gap-6 md:flex-row lg:flex-1 lg:justify-between lg:gap-0">
+      <div class="flex justify-center md:flex-1 md:justify-start">
+        <img src="/images/logo.png" class="max-w-43.75" alt="Logo" />
+      </div>
+      <div class="flex flex-col gap-3 md:flex-1 sm:items-center md:items-start">
+        <div
+          class="text-white sm:text-center md:text-left font-bold text-[16px] md:text-[20px]">
+          Location
+        </div>
+        <div
+          class="text-white sm:text-center md:text-left text-[16px] leading-[160%] flex flex-col gap-2.5">
+          <div>Tatabányai Multifunkcionális Csarnok</div>
+          <div class="flex gap-2.5 sm:justify-center md:justify-start">
+            <app-marker></app-marker>
+            <div class="text-white sm:text-center md:text-left text-[16px]">
+              2800 Tatabánya, Olimpikon u.
+            </div>
+          </div>
         </div>
       </div>
     </div>
-    <div class="flex flex-col gap-3">
-      <div class="text-white font-bold text-[16px] md:text-[20px]">Contact</div>
-      <div class="text-white text-[16px] leading-[160%] flex flex-col gap-2.5">
-        <div>Hungarian Badminton Association</div>
-        <div class="flex gap-2.5 items-center">
-          <app-mail></app-mail>
-          <div class="text-white text-[16px]">iroda@badminton.hu</div>
+    <div
+      class="flex flex-col gap-6 md:flex-row lg:flex-1 lg:justify-between lg:gap-0">
+      <div class="flex flex-col gap-3 md:flex-1">
+        <div
+          class="text-white sm:text-center md:text-left font-bold text-[16px] md:text-[20px]">
+          Contact
         </div>
-        <div class="flex gap-2.5 items-center">
-          <app-phone></app-phone>
-          <div class="text-white text-[16px]">+36 30 329 5154</div>
-        </div>
-        <div>Badminton Europe</div>
-        <div class="flex gap-2.5 items-center">
-          <app-mail></app-mail>
-          <div class="text-white text-[16px]">events@badmintoneurope.com</div>
+        <div
+          class="text-white sm:text-center md:text-left text-[16px] leading-[160%] flex flex-col gap-2.5">
+          <div>Hungarian Badminton Association</div>
+          <div
+            class="flex gap-2.5 items-center sm:justify-center md:justify-start">
+            <app-mail></app-mail>
+            <div class="text-white sm:text-center md:text-left text-[16px]">
+              iroda@badminton.hu
+            </div>
+          </div>
+          <div
+            class="flex gap-2.5 items-center sm:justify-center md:justify-start">
+            <app-phone></app-phone>
+            <div class="text-white sm:text-center md:text-left text-[16px]">
+              +36 30 329 5154
+            </div>
+          </div>
+          <div>Badminton Europe</div>
+          <div
+            class="flex gap-2.5 items-center sm:justify-center md:justify-start">
+            <app-mail></app-mail>
+            <div class="text-white sm:text-center md:text-left text-[16px]">
+              events@badmintoneurope.com
+            </div>
+          </div>
         </div>
       </div>
-    </div>
-    <div class="flex flex-col gap-3">
-      <div class="text-white font-bold text-[16px] md:text-[20px]">Follow us!</div>
-      <div class="flex gap-2.5">
-        <img src="/images/facebook.png" alt="Facebook" class="w-7.5 md:w-10" />
-        <img src="/images/instagram.png" alt="Instagram" class="w-7.5 md:w-10" />
-        <img src="/images/youtube.png" alt="Youtube" class="w-7.5 md:w-10" />
+      <div class="flex flex-col gap-3 md:flex-1 lg:items-end">
+        <div
+          class="text-white sm:text-center md:text-left font-bold text-[16px] md:text-[20px] lg:pr-10">
+          Follow us!
+        </div>
+        <div class="flex gap-2.5 sm:justify-center md:justify-start">
+          <img
+            src="/images/facebook.png"
+            alt="Facebook"
+            class="w-7.5 md:w-10" />
+          <img
+            src="/images/instagram.png"
+            alt="Instagram"
+            class="w-7.5 md:w-10" />
+          <img src="/images/youtube.png" alt="Youtube" class="w-7.5 md:w-10" />
+        </div>
       </div>
     </div>
   </div>
-  <div class="flex justify-center text-white text-[12px] mt-6">
+  <div class="flex justify-center text-white text-[12px] mt-6 pb-6">
     © Magyar Tollaslabda Szövetség
   </div>
 </div>
diff --git a/src/app/header/header.html b/src/app/header/header.html
index 9d6c042..0e3c5c1 100644
--- a/src/app/header/header.html
+++ b/src/app/header/header.html
@@ -1,9 +1,9 @@
 <div class="w-screen bg-ejc-orange h-10.25 hidden md:flex items-center">
-  <div class="container mx-auto flex justify-between">
+  <div class="container mx-auto flex justify-between xl:max-w-315">
     <div class="flex gap-6">
       <div class="flex gap-2.5 items-center">
         <app-mail></app-mail>
-        <div class="text-white text-[13px] font-bold">iroda@badminton.hu</div>
+        <div class="text-white text-[13px] font-bold">office@badminton.hu</div>
       </div>
       <div class="flex gap-2.5 items-center">
         <app-phone></app-phone>
@@ -12,9 +12,9 @@
     </div>
     <div class="flex gap-6 text-[13px] font-bold text-ejc-dark">
       <div>
-        <a class="text-ejc-dark" href="https://badmintoneurope.com"
-          >Badminton Europe</a
-        >
+        <a class="text-ejc-dark" href="https://badmintoneurope.com">
+          Badminton Europe
+        </a>
       </div>
       <div>
         <a class="text-ejc-dark" href="https://badminton.hu">badminton.hu</a>
@@ -23,7 +23,7 @@
   </div>
 </div>
 <div class="w-screen bg-ejc-dark-blue h-16.75 hidden md:flex items-center">
-  <div class="container mx-auto flex justify-between">
+  <div class="container mx-auto flex justify-between xl:max-w-315">
     <img class="w-5.25" src="/images/logo-small.png" alt="Logo" />
     <div class="flex gap-6 text-[16px] font-bold text-white">
       <div>
@@ -60,7 +60,9 @@
 <div
   #menuContainer
   class="w-screen flex md:hidden items-center h-19 bg-ejc-dark-blue justify-between px-5 relative">
-  <div></div>
+  <div>
+    <img class="w-10" src="/images/logo-small.png" alt="Logo" />
+  </div>
 
   <button
     type="button"
diff --git a/src/app/information/information.html b/src/app/information/information.html
index 779946c..918d4d8 100644
--- a/src/app/information/information.html
+++ b/src/app/information/information.html
@@ -1,5 +1,6 @@
 <div class="w-screen bg-ejc-dark-blue">
-  <div class="container mx-auto px-5 py-10 flex flex-col gap-6 md:py-20">
+  <div
+    class="container mx-auto px-5 py-10 flex flex-col gap-6 md:py-20 xl:max-w-315 md:px-0">
     <div
       class="text-white font-extrabold text-2xl text-center md:text-[40px] md:text-left">
       Useful Information
@@ -12,35 +13,44 @@
           insert this password:<br />EJC2026
         </div>
       </div>
-      <div class="flex flex-col gap-6 md:w-full md:flex-row">
-        <div class="bg-white p-10 text-ejc-dark flex flex-col gap-6 md:flex-1">
-          <div class="font-bold text-[16px] leading-[130%]">
-            Emergency number
+      <div
+        class="flex flex-col gap-6 md:w-full md:flex-row md:flex-wrap xl:flex-nowrap">
+        <div class="flex flex-col gap-6 md:w-full md:flex-row">
+          <div
+            class="bg-white p-10 text-ejc-dark flex flex-col gap-6 md:flex-1">
+            <div class="font-bold text-[16px] leading-[130%]">
+              Emergency number
+            </div>
+            <div class="text-[16px] leading-[130%]">112</div>
           </div>
-          <div class="text-[16px] leading-[130%]">112</div>
-        </div>
-        <div class="bg-white p-10 text-ejc-dark flex flex-col gap-6 md:flex-1">
-          <div class="font-bold text-[16px] leading-[130%]">
-            Nearest hospital
-          </div>
-          <div class="text-[16px] leading-[160%]">
-            <p class="mb-3">
-              Komárom-Esztergom Vármegyei Szent Borbála Kórház 2800
-            </p>
-            <p>Tatabánya, Dózsa György út 77.</p>
+          <div
+            class="bg-white p-10 text-ejc-dark flex flex-col gap-6 md:flex-1">
+            <div class="font-bold text-[16px] leading-[130%]">
+              Nearest hospital
+            </div>
+            <div class="text-[16px] leading-[160%]">
+              <p class="mb-3">
+                Komárom-Esztergom Vármegyei Szent Borbála Kórház 2800
+              </p>
+              <p>Tatabánya, Dózsa György út 77.</p>
+            </div>
           </div>
         </div>
-        <div class="bg-white p-10 text-ejc-dark flex flex-col gap-6 md:flex-1">
-          <div class="font-bold text-[16px] leading-[130%]">
-            On-site medical services
+        <div class="flex flex-col gap-6 md:w-full md:flex-row">
+          <div
+            class="bg-white p-10 text-ejc-dark flex flex-col gap-6 md:flex-1">
+            <div class="font-bold text-[16px] leading-[130%]">
+              On-site medical services
+            </div>
+            <div class="text-[16px] leading-[130%]"></div>
           </div>
-          <div class="text-[16px] leading-[130%]"></div>
-        </div>
-        <div class="bg-white p-10 text-ejc-dark flex flex-col gap-6 md:flex-1">
-          <div class="font-bold text-[16px] leading-[130%]">
-            Massage booking
+          <div
+            class="bg-white p-10 text-ejc-dark flex flex-col gap-6 md:flex-1">
+            <div class="font-bold text-[16px] leading-[130%]">
+              Massage booking
+            </div>
+            <div class="text-[16px] leading-[130%]"></div>
           </div>
-          <div class="text-[16px] leading-[130%]"></div>
         </div>
       </div>
       <div class="flex flex-col gap-6 md:w-full md:flex-row">
diff --git a/src/app/media/media.html b/src/app/media/media.html
index c41b57c..740fc3b 100644
--- a/src/app/media/media.html
+++ b/src/app/media/media.html
@@ -1,14 +1,20 @@
-<div class="container mx-auto px-5 py-10 bg-white">
+<div class="container mx-auto px-5 py-10 bg-white xl:max-w-315 md:px-0">
   <div class="font-extrabold text-ejc-dark text-2xl text-center md:text-[40px]">
     Media
   </div>
 </div>
-<div class="container mx-auto px-5 pb-10 bg-white flex flex-col gap-5 md:flex-row">
-  <div class="md:order-last md:flex-1 md:flex md:justify-center md:items-center">
-    <img src="/images/badminton_europe_tv.png" class="w-full md:max-w-[395px] md:max-h-[120px]" alt="Badminton Europe TV" />
+<div
+  class="container mx-auto px-5 pb-10 bg-white flex flex-col gap-5 md:flex-row xl:max-w-315 md:px-0">
+  <div
+    class="md:order-last md:flex-1 md:flex md:justify-center md:items-center">
+    <img
+      src="/images/badminton_europe_tv.png"
+      class="w-full md:max-w-98.75 md:max-h-30"
+      alt="Badminton Europe TV" />
   </div>
   <div class="flex flex-col gap-5 md:flex-1">
-    <div class="font-extrabold text-2xl text-ejc-dark leading-[130%] md:text-[40px]">
+    <div
+      class="font-extrabold text-2xl text-ejc-dark leading-[130%] md:text-[40px]">
       Watch every match live on badmintoneurope.tv
     </div>
     <div
diff --git a/src/app/two-events/two-events.html b/src/app/two-events/two-events.html
index 878d6b0..8599c85 100644
--- a/src/app/two-events/two-events.html
+++ b/src/app/two-events/two-events.html
@@ -1,5 +1,5 @@
 <div
-  class="container mx-auto py-10 px-5 bg-white flex flex-col gap-6 md:px-0 md:py-20">
+  class="container mx-auto py-10 px-5 bg-white flex flex-col gap-6 md:px-0 md:py-20 xl:max-w-315">
   <div
     class="text-center text-2xl text-ejc-dark font-extrabold leading-[130%] md:text-[40px]">
     Follow the two events!
diff --git a/src/app/venue/venue.html b/src/app/venue/venue.html
index fc23e22..ebf04d9 100644
--- a/src/app/venue/venue.html
+++ b/src/app/venue/venue.html
@@ -1,7 +1,7 @@
 <div class="w-screen bg-ejc-orange">
   <div
-    class="container mx-auto px-5 py-10 flex flex-col gap-6 md:flex-row md:pb-0">
-    <div class="md:order-last flex-1">
+    class="container mx-auto px-5 py-10 flex flex-col gap-6 md:flex-row lg:pb-0 md:gap-15 lg:gap-20 xl:max-w-315 md:px-0">
+    <div class="md:order-last flex-1 md:flex md:items-center">
       <img
         class="inline-block md:hidden"
         src="/images/csarnok.jpg"
@@ -11,7 +11,7 @@
         src="/images/csarnok.png"
         alt="Hall" />
     </div>
-    <div class="flex flex-col gap-6 flex-1">
+    <div class="flex flex-col gap-6 flex-1 md:flex-2 lg:flex-1">
       <div class="text-white font-extrabold text-2xl md:text-[40px]">Venue</div>
       <div class="text-white text-[16px] leading-[160%]">
         The Tatabánya Multifunctional Sports Hall is a state-of-the-art indoor
@@ -21,29 +21,29 @@
         volleyball and other indoor sports, as well as major cultural and
         sporting events.
       </div>
-      <div class="flex flex-col gap-6 md:flex-row">
-        <div class="flex flex-col gap-6">
-          <div class="flex gap-2.5 md:flex-col">
+      <div class="flex flex-col gap-6 lg:flex-row lg:flex-wrap">
+        <div class="flex flex-col gap-6 lg:flex-row lg:w-full lg:flex">
+          <div class="flex gap-2.5 lg:flex-col lg:flex-1">
             <app-marker></app-marker>
             <div class="text-white font-bold text-[16px]">
               2800 Tatabánya, Olimpikon u.
             </div>
           </div>
-          <div class="flex gap-2.5 md:flex-col">
+          <div class="flex gap-2.5 lg:flex-col lg:flex-1">
             <app-car></app-car>
             <div class="text-white font-bold text-[16px]">
               500 parkingplaces are available
             </div>
           </div>
         </div>
-        <div class="flex flex-col gap-6">
-          <div class="flex gap-2.5 md:flex-col">
+        <div class="flex flex-col gap-6 lg:flex-row lg:w-full lg:flex">
+          <div class="flex gap-2.5 lg:flex-col lg:flex-1">
             <app-bus></app-bus>
             <div class="text-white font-bold text-[16px]">
               Shuttle buses from and to the official hotels
             </div>
           </div>
-          <div class="flex gap-2.5 md:flex-col">
+          <div class="flex gap-2.5 lg:flex-col lg:flex-1">
             <app-bus></app-bus>
             <div class="text-white font-bold text-[16px]">
               The schedule is available on the Sportity app
diff --git a/src/app/welcome/welcome.html b/src/app/welcome/welcome.html
index adce8a0..ee76c6f 100644
--- a/src/app/welcome/welcome.html
+++ b/src/app/welcome/welcome.html
@@ -1,6 +1,6 @@
 <div
   class="bg-ejc-orange py-10 px-5 text-center text-white font-extrabold text-2xl leading-[130%] md:px-0 md:py-20 md:text-[40px] md:text-left">
-  <div class="container mx-auto">
+  <div class="container mx-auto xl:max-w-315">
     Welcome to the 2026 Europen Junior Championships in Tatabánya, Hungary!
   </div>
 </div>
diff --git a/src/index.html b/src/index.html
index 09c94c0..92b110d 100644
--- a/src/index.html
+++ b/src/index.html
@@ -1,13 +1,16 @@
 <!doctype html>
 <html lang="en">
-<head>
-  <meta charset="utf-8">
-  <title>2026 European Junior Championships</title>
-  <base href="/">
-  <meta name="viewport" content="width=device-width, initial-scale=1">
-  <link rel="icon" type="image/x-icon" href="favicon.ico">
-</head>
-<body>
-  <app-root></app-root>
-</body>
+  <head>
+    <meta charset="utf-8" />
+    <title>2026 European Junior Championships</title>
+    <base href="/" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <link rel="apple-touch-icon" sizes="180x180" href="/images/apple-touch-icon.png" />
+    <link rel="icon" type="image/png" sizes="32x32" href="/images/favicon-32x32.png" />
+    <link rel="icon" type="image/png" sizes="16x16" href="/images/favicon-16x16.png" />
+    <link rel="manifest" href="/images/site.webmanifest" />
+  </head>
+  <body>
+    <app-root></app-root>
+  </body>
 </html>