diff --git a/README.md b/README.md
index fedcd84..99a5384 100644
--- a/README.md
+++ b/README.md
@@ -1 +1,4 @@
-# paper-challenge
+# Paper Challenge
+- Projekt powstał na potrzeby treningu Steel Challenge w domowym zaciszu
+- Ostrzeżenie: Od ponad 11 lat pracuję z PHP, więc mogą być widoczne naleciałości! Ten projekt to moje pierwsze... no może drugie kroki w Pythonie.
+### Kopiowanie, rozpowszechnianie, modyfikowanie i udostępnianie na potrzeby własne, klubowe lub dla kolegi, stanowczo zalecane
diff --git a/app.py b/app.py
index af55716..176c602 100644
--- a/app.py
+++ b/app.py
@@ -1,74 +1,112 @@
 import math
-from shutil import posix
 
 from flask import Flask, render_template, request, send_file
 from weasyprint import HTML
 import io
 
-
 app = Flask(__name__)
 
 # Original values dictionary
 VALUES = {
     "five_to_go": {
-        "t1": {"len_a": 3100, "len_h": 9100, 'width': 250, 'height': 250, 'elevation': 0, 'stop_plate': False, 'side': 'left'},
-        "t2": {"len_a": 1000, "len_h": 11000, 'width': 250, 'height': 250, 'elevation': 0, 'stop_plate': False, 'side': 'left'},
-        "t3": {"len_a": 1000, "len_h": 13700, 'width': 250, 'height': 250, 'elevation': 0, 'stop_plate': False, 'side': 'right'},
-        "t4": {"len_a": 3100, "len_h": 16500, 'width': 250, 'height': 250, 'elevation': 0, 'stop_plate': False, 'side': 'right'},
-        "t5": {"len_a": 5200, "len_h": 6400, 'width': 300, 'height': 300, 'elevation': 0, 'stop_plate': True, 'side': 'right'},
+        "t1": {"len_a": 3100, "len_h": 9100, 'width': 250, 'height': 250, 'elevation': 0, 'stop_plate': False,
+               'side': 'left'},
+        "t2": {"len_a": 1000, "len_h": 11000, 'width': 250, 'height': 250, 'elevation': 0, 'stop_plate': False,
+               'side': 'left'},
+        "t3": {"len_a": 1000, "len_h": 13700, 'width': 250, 'height': 250, 'elevation': 0, 'stop_plate': False,
+               'side': 'right'},
+        "t4": {"len_a": 3100, "len_h": 16500, 'width': 250, 'height': 250, 'elevation': 0, 'stop_plate': False,
+               'side': 'right'},
+        "t5": {"len_a": 5200, "len_h": 6400, 'width': 300, 'height': 300, 'elevation': 0, 'stop_plate': True,
+               'side': 'right'},
     },
     "showdown_left": {
-        "t1": {"len_a": 1800, "len_h": 22900, 'width': 400, 'height': 600, 'elevation': 200, 'stop_plate': False, 'side': 'left'},
-        "t2": {"len_a": 200, "len_h": 9000, 'width': 250, 'height': 250, 'elevation': 0, 'stop_plate': False, 'side': 'right'},
-        "t3": {"len_a": 1000, "len_h": 11000, 'width': 300, 'height': 300, 'elevation': 0, 'stop_plate': True, 'side': 'right'},
-        "t4": {"len_a": 3800, "len_h": 22900, 'width': 400, 'height': 600, 'elevation': 200, 'stop_plate': False, 'side': 'right'},
-        "t5": {"len_a": 2200, "len_h": 9000, 'width': 250, 'height': 250, 'elevation': 0, 'stop_plate': False, 'side': 'right'},
+        "t1": {"len_a": 1800, "len_h": 22900, 'width': 400, 'height': 600, 'elevation': 200, 'stop_plate': False,
+               'side': 'left'},
+        "t2": {"len_a": 200, "len_h": 9000, 'width': 250, 'height': 250, 'elevation': 0, 'stop_plate': False,
+               'side': 'right'},
+        "t3": {"len_a": 1000, "len_h": 11000, 'width': 300, 'height': 300, 'elevation': 0, 'stop_plate': True,
+               'side': 'right'},
+        "t4": {"len_a": 3800, "len_h": 22900, 'width': 400, 'height': 600, 'elevation': 200, 'stop_plate': False,
+               'side': 'right'},
+        "t5": {"len_a": 2200, "len_h": 9000, 'width': 250, 'height': 250, 'elevation': 0, 'stop_plate': False,
+               'side': 'right'},
     },
     "showdown_right": {
-        "t1": {"len_a": 2200, "len_h": 9000, 'width': 250, 'height': 250, 'elevation': 0, 'stop_plate': False, 'side': 'left'},
-        "t2": {"len_a": 3800, "len_h": 22900, 'width': 400, 'height': 600, 'elevation': 200, 'stop_plate': False, 'side': 'left'},
-        "t3": {"len_a": 1000, "len_h": 11000, 'width': 300, 'height': 300, 'elevation': 0, 'stop_plate': True, 'side': 'left'},
-        "t4": {"len_a": 200, "len_h": 9000, 'width': 250, 'height': 250, 'elevation': 0, 'stop_plate': False, 'side': 'left'},
-        "t5": {"len_a": 1800, "len_h": 22900, 'width': 400, 'height': 600, 'elevation': 200, 'stop_plate': False, 'side': 'right'},
+        "t1": {"len_a": 2200, "len_h": 9000, 'width': 250, 'height': 250, 'elevation': 0, 'stop_plate': False,
+               'side': 'left'},
+        "t2": {"len_a": 3800, "len_h": 22900, 'width': 400, 'height': 600, 'elevation': 200, 'stop_plate': False,
+               'side': 'left'},
+        "t3": {"len_a": 1000, "len_h": 11000, 'width': 300, 'height': 300, 'elevation': 0, 'stop_plate': True,
+               'side': 'left'},
+        "t4": {"len_a": 200, "len_h": 9000, 'width': 250, 'height': 250, 'elevation': 0, 'stop_plate': False,
+               'side': 'left'},
+        "t5": {"len_a": 1800, "len_h": 22900, 'width': 400, 'height': 600, 'elevation': 200, 'stop_plate': False,
+               'side': 'right'},
 
     },
     "smoke_and_hope": {
-        "t1": {"len_a": 4300, "len_h": 6400, 'width': 400, 'height': 600, 'elevation': 150, 'stop_plate': False, 'side': 'left'},
-        "t2": {"len_a": 2700, "len_h": 8200, 'width': 400, 'height': 600, 'elevation': 150, 'stop_plate': False, 'side': 'left'},
-        "t3": {"len_a": 0, "len_h": 12800, 'width': 300, 'height': 300, 'elevation': 0, 'stop_plate': True, 'side': 'right'},
-        "t4": {"len_a": 2700, "len_h": 8200, 'width': 400, 'height': 600, 'elevation': 150, 'stop_plate': False, 'side': 'right'},
-        "t5": {"len_a": 4300, "len_h": 6400, 'width': 400, 'height': 600, 'elevation': 150, 'stop_plate': False, 'side': 'right'},
+        "t1": {"len_a": 4300, "len_h": 6400, 'width': 400, 'height': 600, 'elevation': 150, 'stop_plate': False,
+               'side': 'left'},
+        "t2": {"len_a": 2700, "len_h": 8200, 'width': 400, 'height': 600, 'elevation': 150, 'stop_plate': False,
+               'side': 'left'},
+        "t3": {"len_a": 0, "len_h": 12800, 'width': 300, 'height': 300, 'elevation': 0, 'stop_plate': True,
+               'side': 'right'},
+        "t4": {"len_a": 2700, "len_h": 8200, 'width': 400, 'height': 600, 'elevation': 150, 'stop_plate': False,
+               'side': 'right'},
+        "t5": {"len_a": 4300, "len_h": 6400, 'width': 400, 'height': 600, 'elevation': 150, 'stop_plate': False,
+               'side': 'right'},
 
     },
     "accelerator": {
-        "t1": {"len_a": 3600, "len_h": 9100, 'width': 250, 'height': 250, 'elevation': 0, 'stop_plate': False, 'side': 'left'},
-        "t2": {"len_a": 1200, "len_h": 9100, 'width': 400, 'height': 600, 'elevation': 150, 'stop_plate': False, 'side': 'left'},
-        "t3": {"len_a": 0, "len_h": 13700, 'width': 300, 'height': 300, 'elevation': 0, 'stop_plate': True, 'side': 'right'},
-        "t4": {"len_a": 1900, "len_h": 18300, 'width': 300, 'height': 300, 'elevation': 0, 'stop_plate': False, 'side': 'right'},
-        "t5": {"len_a": 6200, "len_h": 18300, 'width': 400, 'height': 600, 'elevation': 150, 'stop_plate': False, 'side': 'right'},
+        "t1": {"len_a": 3600, "len_h": 9100, 'width': 250, 'height': 250, 'elevation': 0, 'stop_plate': False,
+               'side': 'left'},
+        "t2": {"len_a": 1200, "len_h": 9100, 'width': 400, 'height': 600, 'elevation': 150, 'stop_plate': False,
+               'side': 'left'},
+        "t3": {"len_a": 0, "len_h": 13700, 'width': 300, 'height': 300, 'elevation': 0, 'stop_plate': True,
+               'side': 'right'},
+        "t4": {"len_a": 1900, "len_h": 18300, 'width': 300, 'height': 300, 'elevation': 0, 'stop_plate': False,
+               'side': 'right'},
+        "t5": {"len_a": 6200, "len_h": 18300, 'width': 400, 'height': 600, 'elevation': 150, 'stop_plate': False,
+               'side': 'right'},
 
     },
     "pendulum": {
-        "t1": {"len_a": 3800, "len_h": 16500, 'width': 300, 'height': 300, 'elevation': 400, 'stop_plate': False, 'side': 'left'},
-        "t2": {"len_a": 1900, "len_h": 16500, 'width': 250, 'height': 250, 'elevation': 0, 'stop_plate': False, 'side': 'left'},
-        "t3": {"len_a": 0, "len_h": 9100, 'width': 300, 'height': 300, 'elevation': 0, 'stop_plate': True, 'side': 'right'},
-        "t4": {"len_a": 1900, "len_h": 16500, 'width': 250, 'height': 250, 'elevation': 0, 'stop_plate': False, 'side': 'right'},
-        "t5": {"len_a": 3800, "len_h": 16500, 'width': 300, 'height': 300, 'elevation': 400, 'stop_plate': False, 'side': 'right'},
+        "t1": {"len_a": 3800, "len_h": 16500, 'width': 300, 'height': 300, 'elevation': 400, 'stop_plate': False,
+               'side': 'left'},
+        "t2": {"len_a": 1900, "len_h": 16500, 'width': 250, 'height': 250, 'elevation': 0, 'stop_plate': False,
+               'side': 'left'},
+        "t3": {"len_a": 0, "len_h": 9100, 'width': 300, 'height': 300, 'elevation': 0, 'stop_plate': True,
+               'side': 'right'},
+        "t4": {"len_a": 1900, "len_h": 16500, 'width': 250, 'height': 250, 'elevation': 0, 'stop_plate': False,
+               'side': 'right'},
+        "t5": {"len_a": 3800, "len_h": 16500, 'width': 300, 'height': 300, 'elevation': 400, 'stop_plate': False,
+               'side': 'right'},
 
     },
     "speed_option": {
-        "t1": {"len_a": 3700, "len_h": 9100, 'width': 300, 'height': 300, 'elevation': 0, 'stop_plate': False, 'side': 'left'},
-        "t2": {"len_a": 6600, "len_h": 32000, 'width': 400, 'height': 600, 'elevation': 150, 'stop_plate': True, 'side': 'left'},
-        "t3": {"len_a": 1800, "len_h": 18300, 'width': 300, 'height': 300, 'elevation': 0, 'stop_plate': False, 'side': 'left'},
-        "t4": {"len_a": 2000, "len_h": 7300, 'width': 300, 'height': 300, 'elevation': 0, 'stop_plate': False, 'side': 'right'},
-        "t5": {"len_a": 6400, "len_h": 13700, 'width': 300, 'height': 300, 'elevation': 0, 'stop_plate': False, 'side': 'right'},
+        "t1": {"len_a": 3700, "len_h": 9100, 'width': 300, 'height': 300, 'elevation': 0, 'stop_plate': False,
+               'side': 'left'},
+        "t2": {"len_a": 6600, "len_h": 32000, 'width': 400, 'height': 600, 'elevation': 150, 'stop_plate': True,
+               'side': 'left'},
+        "t3": {"len_a": 1800, "len_h": 18300, 'width': 300, 'height': 300, 'elevation': 0, 'stop_plate': False,
+               'side': 'left'},
+        "t4": {"len_a": 2000, "len_h": 7300, 'width': 300, 'height': 300, 'elevation': 0, 'stop_plate': False,
+               'side': 'right'},
+        "t5": {"len_a": 6400, "len_h": 13700, 'width': 300, 'height': 300, 'elevation': 0, 'stop_plate': False,
+               'side': 'right'},
     },
     "roundabout": {
-        "t1": {"len_a": 2700, "len_h": 13700, 'width': 300, 'height': 300, 'elevation': 0, 'stop_plate': False, 'side': 'left'},
-        "t2": {"len_a": 600, "len_h": 6400, 'width': 300, 'height': 300, 'elevation': 0, 'stop_plate': False, 'side': 'left'},
-        "t3": {"len_a": 600, "len_h": 9100, 'width': 300, 'height': 300, 'elevation': 0, 'stop_plate': True, 'side': 'right'},
-        "t4": {"len_a": 2500, "len_h": 13700, 'width': 300, 'height': 300, 'elevation': 0, 'stop_plate': False, 'side': 'right'},
-        "t5": {"len_a": 2500, "len_h": 6400, 'width': 300, 'height': 300, 'elevation': 0, 'stop_plate': False, 'side': 'right'},
+        "t1": {"len_a": 2700, "len_h": 13700, 'width': 300, 'height': 300, 'elevation': 0, 'stop_plate': False,
+               'side': 'left'},
+        "t2": {"len_a": 600, "len_h": 6400, 'width': 300, 'height': 300, 'elevation': 0, 'stop_plate': False,
+               'side': 'left'},
+        "t3": {"len_a": 600, "len_h": 9100, 'width': 300, 'height': 300, 'elevation': 0, 'stop_plate': True,
+               'side': 'right'},
+        "t4": {"len_a": 2500, "len_h": 13700, 'width': 300, 'height': 300, 'elevation': 0, 'stop_plate': False,
+               'side': 'right'},
+        "t5": {"len_a": 2500, "len_h": 6400, 'width': 300, 'height': 300, 'elevation': 0, 'stop_plate': False,
+               'side': 'right'},
     }
 }
 
@@ -152,7 +190,7 @@ def generate_pdf():
     pdf_file = io.BytesIO()
     HTML(string=rendered_html).write_pdf(pdf_file)
     pdf_file.seek(0)
-    filename = 'Paper Challange - '+stage.replace('_', ' ')+' - '+str(distance)+'cm-'+size+'.pdf'
+    filename = 'Paper Challenge - ' + stage.replace('_', ' ') + ' - ' + str(distance) + 'cm-' + size + '.pdf'
 
     return send_file(pdf_file, download_name=filename, as_attachment=False)
 
diff --git a/templates/index.html b/templates/index.html
index 9f739e6..2e96b39 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -1,145 +1,174 @@
 <!doctype html>
 <html lang="en">
 <head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>Paper Challenge</title>
-  <script src="https://cdn.tailwindcss.com?plugins=forms,typography,aspect-ratio,line-clamp,container-queries"></script>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Paper Challenge</title>
+    <script src="https://cdn.tailwindcss.com?plugins=forms,typography,aspect-ratio,line-clamp,container-queries"></script>
     <style>
-         /* Hide the radio buttons */
-    input[type="radio"] {
-      display: none;
-    }
+        /* Hide the radio buttons */
+        input[type="radio"] {
+            display: none;
+        }
 
-    /* Style the labels to act like buttons */
-    label {
-      display: block;
-      cursor: pointer;
-      border: 2px solid gray;
-      border-radius: 8px;
-      overflow: hidden;
-      transition: border-color 0.2s, box-shadow 0.2s;
-      text-align: center;
-    }
+        /* Style the labels to act like buttons */
+        label {
+            display: block;
+            cursor: pointer;
+            border: 2px solid gray;
+            border-radius: 8px;
+            overflow: hidden;
+            transition: border-color 0.2s, box-shadow 0.2s;
+            text-align: center;
+        }
 
-    /* Highlight the selected label */
-    input[type="radio"]:checked + label {
-      border-color: #3b82f6; /* Blue color */
-      box-shadow: 0 0 10px #3b82f6;
-    }
+        /* Highlight the selected label */
+        input[type="radio"]:checked + label {
+            border-color: #3b82f6; /* Blue color */
+            box-shadow: 0 0 10px #3b82f6;
+        }
 
-    /* Add hover effect */
-    label:hover {
-      border-color: #3b82f6;
-    }
+        /* Add hover effect */
+        label:hover {
+            border-color: #3b82f6;
+        }
 
-    /* Style the images */
-    label img {
-      width: 100%;
-      height: auto;
-      max-height: 150px; /* Limit image height */
-    }
+        /* Style the images */
+        label img {
+            width: 100%;
+            height: auto;
+            max-height: 150px; /* Limit image height */
+        }
 
-    /* Style the text below images */
-    label p {
-      margin-top: 8px;
-      font-size: 1rem;
-      font-weight: bold;
-      color: #374151; /* Gray color */
-    }
+        /* Style the text below images */
+        label p {
+            margin-top: 8px;
+            font-size: 1rem;
+            font-weight: bold;
+            color: #374151; /* Gray color */
+        }
+
+        #about {
+            display: none;
+        }
+
+        .about-container {
+            display: none;
+        }
+
+        #about:checked ~ .about-container {
+            display: block;
+        }
     </style>
 </head>
 <body class="bg-gray-100 font-sans">
-  <div class="max-w-2xl mx-auto p-6 bg-white shadow-md rounded-lg mt-10">
+<div class="max-w-4xl mx-auto p-6 bg-white shadow-md rounded-lg mt-10">
     <h1 class="text-2xl font-bold mb-6 text-center text-gray-700">Paper Challenge</h1>
-    <form action="/generate-pdf" method="post">
-      <div class="mb-6">
-        <h2>Format druku</h2>
-        <div id="size" class="flex place-content-center">
-            <input type="radio" id="a4" name="size" value="a4" class="absolute inset-0 opacity-0" required>
-            <label for="a4" class="cursor-pointer border-2 border-transparent rounded-lg overflow-hidden transition-all hover:border-blue-400">
-              <img src="{{ url_for('static', filename='images/a4.png') }}" alt="A4 (210mm x 297mm)" class="w-24 h-auto">
-            </label>
-            <input type="radio" id="a3" name="size" value="a3" class="absolute inset-0 opacity-0">
-            <label for="a3" class="cursor-pointer border-2 border-transparent rounded-lg overflow-hidden transition-all hover:border-blue-400">
-              <img src="{{ url_for('static', filename='images/a3.png') }}" alt="A3 (297mm x 420mm)" class="w-24 h-auto">
-            </label>
+    <input type="checkbox" class="text-2xl font-bold mb-6 text-center text-gray-700" id="about"/>
+    <label class="mx-auto max-w-2xl" for="about">O projekcie</label>
+    <div class="about-container max-w-2xl mx-auto">
+        <p class="mt-4">Projekt powstał na potrzeby treningu Steel Challenge w domowym zaciszu</p>
+        <p class="mt-2">Ostrzeżenie: Od ponad 11 lat pracuję z PHP, więc mogą być widoczne naleciałości!<br/>Ten projekt
+            to moje pierwsze... no może drugie kroki w Pythonie. </p>
+        <p class="mt-2">Kopiowanie, rozpowszechnianie, modyfikowanie i udostępnianie na potrzeby własne, klubowe lub dla
+            kolegi, stanowczo zalecane</p>
+    </div>
+    <h2 class="my-10 mx-auto text-center font-bold text-xl">Wygeneruj tor</h2>
+    <form class="" action="/generate-pdf" method="post">
+        <div class="mb-6 max-w-2xl mx-auto">
+            <h2>Odległość od ściany</h2>
+            <input type="number" id="distance" name="distance"
+                   class="w-full p-2 border rounded-md focus:outline-none focus:ring-2 focus:ring-blue-400" required>
         </div>
-      </div>
-
-      <div class="mb-6">
-          <h2>Tor</h2>
-        <div id="stage" class="grid grid-cols-1 gap-4">
-          <div>
-            <input type="radio" id="five_to_go" name="stage" value="five_to_go" required>
-            <label for="five_to_go">
-                <p>Five To Go</p>
-                <img src="{{ url_for('static', filename='images/five_to_go.png') }}" alt="Five To Go">
-            </label>
-          </div>
-          <div>
-            <input type="radio" id="showdown_left" name="stage" value="showdown_left">
-            <label for="showdown_left">
-                <p>Showdown (left box)</p>
-                <img src="{{ url_for('static', filename='images/showdown_left.png') }}" alt="Showdown (left box)">
-            </label>
-          </div>
-          <div>
-            <input type="radio" id="showdown_right" name="stage" value="showdown_right">
-            <label for="showdown_right">
-                <p>Showdown (right box)</p>
-                <img src="{{ url_for('static', filename='images/showdown_right.png') }}" alt="Showdown (right box)">
-            </label>
-          </div>
-          <div>
-            <input type="radio" id="smoke_and_hope" name="stage" value="smoke_and_hope">
-            <label for="smoke_and_hope">
-                <p>Smoke & Hope</p>
-                <img src="{{ url_for('static', filename='images/smoke_and_hope.png') }}" alt="Smoke & Hope">
-            </label>
-          </div>
-          <div>
-            <input type="radio" id="accelerator" name="stage" value="accelerator">
-            <label for="accelerator">
-                <p>Accelerator</p>
-                <img src="{{ url_for('static', filename='images/accelerator.png') }}" alt="Accelerator">
-            </label>
-          </div>
-          <div>
-            <input type="radio" id="pendulum" name="stage" value="pendulum">
-            <label for="pendulum">
-                <p>Pendulum</p>
-                <img src="{{ url_for('static', filename='images/pendulum.png') }}" alt="Pendulum">
-            </label>
-          </div>
-          <div>
-            <input type="radio" id="speed_option" name="stage" value="speed_option">
-            <label for="speed_option">
-                <p>Speed Option</p>
-                <img src="{{ url_for('static', filename='images/speed_option.png') }}" alt="Speed Option">
-            </label>
-          </div>
-          <div>
-            <input type="radio" id="roundabout" name="stage" value="roundabout">
-            <label for="roundabout">
-                <p>Roundabout</p>
-                <img src="{{ url_for('static', filename='images/roundabout.png') }}" alt="RoundAbout">
-            </label>
-          </div>
+        <div class="mb-6 max-w-2xl mx-auto mt-10">
+            <h2>Format druku</h2>
+            <div id="size" class="flex place-content-center">
+                <input type="radio" id="a4" name="size" value="a4" class="absolute inset-0 opacity-0" required>
+                <label for="a4"
+                       class="cursor-pointer border-2 border-transparent rounded-lg overflow-hidden transition-all hover:border-blue-400">
+                    <img src="{{ url_for('static', filename='images/a4.png') }}" alt="A4 (210mm x 297mm)"
+                         class="w-24 h-auto">
+                </label>
+                <input type="radio" id="a3" name="size" value="a3" class="absolute inset-0 opacity-0">
+                <label for="a3"
+                       class="cursor-pointer border-2 border-transparent rounded-lg overflow-hidden transition-all hover:border-blue-400">
+                    <img src="{{ url_for('static', filename='images/a3.png') }}" alt="A3 (297mm x 420mm)"
+                         class="w-24 h-auto">
+                </label>
+            </div>
         </div>
-      </div>
 
-      <div class="mb-6">
-          <h2>Odległość od ściany</h2>
-        <input type="number" id="distance" name="distance" class="w-full p-2 border rounded-md focus:outline-none focus:ring-2 focus:ring-blue-400" required>
-      </div>
+        <div class="mb-6 max-w-2xl mx-auto">
+            <h2>Tor</h2>
+            <div id="stage" class="grid grid-cols-1 gap-4">
+                <div>
+                    <input type="radio" id="five_to_go" name="stage" value="five_to_go" required>
+                    <label for="five_to_go">
+                        <p>Five To Go</p>
+                        <img src="{{ url_for('static', filename='images/five_to_go.png') }}" alt="Five To Go">
+                    </label>
+                </div>
+                <div>
+                    <input type="radio" id="showdown_left" name="stage" value="showdown_left">
+                    <label for="showdown_left">
+                        <p>Showdown (left box)</p>
+                        <img src="{{ url_for('static', filename='images/showdown_left.png') }}"
+                             alt="Showdown (left box)">
+                    </label>
+                </div>
+                <div>
+                    <input type="radio" id="showdown_right" name="stage" value="showdown_right">
+                    <label for="showdown_right">
+                        <p>Showdown (right box)</p>
+                        <img src="{{ url_for('static', filename='images/showdown_right.png') }}"
+                             alt="Showdown (right box)">
+                    </label>
+                </div>
+                <div>
+                    <input type="radio" id="smoke_and_hope" name="stage" value="smoke_and_hope">
+                    <label for="smoke_and_hope">
+                        <p>Smoke & Hope</p>
+                        <img src="{{ url_for('static', filename='images/smoke_and_hope.png') }}" alt="Smoke & Hope">
+                    </label>
+                </div>
+                <div>
+                    <input type="radio" id="accelerator" name="stage" value="accelerator">
+                    <label for="accelerator">
+                        <p>Accelerator</p>
+                        <img src="{{ url_for('static', filename='images/accelerator.png') }}" alt="Accelerator">
+                    </label>
+                </div>
+                <div>
+                    <input type="radio" id="pendulum" name="stage" value="pendulum">
+                    <label for="pendulum">
+                        <p>Pendulum</p>
+                        <img src="{{ url_for('static', filename='images/pendulum.png') }}" alt="Pendulum">
+                    </label>
+                </div>
+                <div>
+                    <input type="radio" id="speed_option" name="stage" value="speed_option">
+                    <label for="speed_option">
+                        <p>Speed Option</p>
+                        <img src="{{ url_for('static', filename='images/speed_option.png') }}" alt="Speed Option">
+                    </label>
+                </div>
+                <div>
+                    <input type="radio" id="roundabout" name="stage" value="roundabout">
+                    <label for="roundabout">
+                        <p>Roundabout</p>
+                        <img src="{{ url_for('static', filename='images/roundabout.png') }}" alt="RoundAbout">
+                    </label>
+                </div>
+            </div>
+        </div>
 
-      <div class="text-center">
-        <button type="submit" class="bg-blue-500 text-white py-2 px-4 rounded-md hover:bg-blue-600 transition-colors">
-          Generuj
-        </button>
-      </div>
+        <div class="text-center">
+            <button type="submit"
+                    class="bg-blue-500 text-white py-2 px-4 rounded-md hover:bg-blue-600 transition-colors">
+                Generuj
+            </button>
+        </div>
     </form>
-  </div>
+</div>
 </body>
 </html>
diff --git a/templates/pdf_template.html b/templates/pdf_template.html
index 477f04d..69a64be 100644
--- a/templates/pdf_template.html
+++ b/templates/pdf_template.html
@@ -1,82 +1,97 @@
 <!doctype html>
 <html lang="en">
 <head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>Paper Challenge - {{ stage.split('_') | map('capitalize') | join(' ') }} - {{ distance }} cm - {{ size|capitalize }}</title>
-  <style>
-    @page {
-        size: {{ size }};
-        margin: 5mm;
-    }
-    body {
-        font-family: sans-serif;
-        margin-top: 0;
-    }
-    h1, h2 {
-        text-align: center;
-        margin-top: 20mm;
-    }
-    .page-break {
-        page-break-after: always;
-    }
-    .target {
-        margin: 0 auto;
-        background-color: dodgerblue;
-        position: absolute;
-        top: 0%;
-        left: 50%;
-        transform: translate(-50%, -50%);
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Paper Challenge - {{ stage.split('_') | map('capitalize') | join(' ') }} - {{ distance }} cm
+        - {{ size|capitalize }}</title>
+    <style>
+        @page {
+            size: {{ size }};
+            margin: 5mm;
+        }
 
-    }
-    .circle {
-        border-radius: 50%;
-    }
-    .post {
-        margin: auto;
-        background-color: black;
-        position: relative;
-    }
-    .elevator {
-        position: absolute;
-        bottom: 0;
-        left: 50%;
-        transform: translate(-50%, 0);
-    }
-    .stop-plate {
-        background-color: red !important;
-    }
-    .mounting-point {
-        height: 10mm;
-        width: 0.5mm;
-        background-color: #ccc;
-        margin: auto;
-    }
-    .mounting-info {
-        font-size: xx-small;
-        color: #ccc;
-    }
-    .preview {
-        position: relative;
-        display: block;
-        border-bottom: solid 1px black;
-        border-top: solid 1px black;
-        width: 100%;
-        height: 75mm;
-    }
-    .preview-post {
-        position: absolute;
-    }
-  </style>
+        body {
+            font-family: sans-serif;
+            margin-top: 0;
+        }
+
+        h1, h2 {
+            text-align: center;
+            margin-top: 20mm;
+        }
+
+        .page-break {
+            page-break-after: always;
+        }
+
+        .target {
+            margin: 0 auto;
+            background-color: dodgerblue;
+            position: absolute;
+            top: 0%;
+            left: 50%;
+            transform: translate(-50%, -50%);
+
+        }
+
+        .circle {
+            border-radius: 50%;
+        }
+
+        .post {
+            margin: auto;
+            background-color: black;
+            position: relative;
+        }
+
+        .elevator {
+            position: absolute;
+            bottom: 0;
+            left: 50%;
+            transform: translate(-50%, 0);
+        }
+
+        .stop-plate {
+            background-color: red !important;
+        }
+
+        .mounting-point {
+            height: 10mm;
+            width: 0.5mm;
+            background-color: #ccc;
+            margin: auto;
+        }
+
+        .mounting-info {
+            font-size: xx-small;
+            color: #ccc;
+        }
+
+        .preview {
+            position: relative;
+            display: block;
+            border-bottom: solid 1px black;
+            border-top: solid 1px black;
+            width: 100%;
+            height: 75mm;
+        }
+
+        .preview-post {
+            position: absolute;
+        }
+    </style>
 </head>
 <body>
 <div>
-    <h1>Paper Challange</h1>
+    <h1>Paper Challenge</h1>
     <h2>{{ stage.split('_') | map('capitalize') | join(' ') }}</h2>
     <div class="preview">
         {% for target in preview_target_info %}
-            <div class="post preview-post {% if target.stop_plate %} stop-plate {% endif %}" style="top: {{ 50 - target.post_height }}mm; left: {{ target.position + 3 }}mm; width: {{ target.post_width }}mm; height: {{ target.height }}mm;">
-                 <div class="target {% if target.width == target.height %} circle {% endif %}" style="width: {{ target.width }}mm; height: {{ target.height }}mm"></div>
+            <div class="post preview-post {% if target.stop_plate %} stop-plate {% endif %}"
+                 style="top: {{ 50 - target.post_height }}mm; left: {{ target.position + 3 }}mm; width: {{ target.post_width }}mm; height: {{ target.height }}mm;">
+                <div class="target {% if target.width == target.height %} circle {% endif %}"
+                     style="width: {{ target.width }}mm; height: {{ target.height }}mm"></div>
             </div>
         {% endfor %}
     </div>
@@ -86,7 +101,9 @@
     <ul>
         <li>Umieść z lewej strony ściany pierwszy cel ze znacznikiem "punkt ZERO"</li>
         <li>Wyznacz pole startowe {{ box_position }}cm od punktu "zero"</li>
-        <li>Upewnij się, że pole startowe znjaduje się w dogodnym miejscu, pomieszczenia, tak aby nic nie przeszkazdało w swobodnym dobyciu i składaniu do celów na całej szerokości ściany</li>
+        <li>Upewnij się, że pole startowe znjaduje się w dogodnym miejscu, pomieszczenia, tak aby nic nie przeszkazdało
+            w swobodnym dobyciu i składaniu do celów na całej szerokości ściany
+        </li>
         <li>W razie potrzeby dostosuj pierwszy cel wraz z punktem ZERO i powtórz dwa powyższe kroki</li>
         <li>Umieść na ścianie pozostałe cele zgodnie z odległościami podanymi na znacznikach pozycji na dole każdego celu. Upewnij się, że wszystkie cele są umieszczone w jednej linii równoległej do podłoża</li>
     </ul>