diff --git a/onepage.html b/onepage.html
new file mode 100644
index 0000000..c213284
--- /dev/null
+++ b/onepage.html
@@ -0,0 +1,93 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta http-equiv="X-UA-Compatible" content="ie=edge">
+    <title>OnePage</title>
+    <link rel="stylesheet" href="css/bootstrap.css">
+</head>
+<body class="d-flex flex-column min-vh-100">
+    <!-- navigační lištu -->
+    <div class="container">
+            <header class="d-flex flex-wrap justify-content-center py-3 mb-4 border-bottom">
+              <a href="/" class="d-flex align-items-center mb-3 mb-md-0 me-md-auto text-dark text-decoration-none">
+                <span class="fs-4">OnePage</span>
+              </a>        
+              <ul class="nav nav-pills">
+                <li class="nav-item"><a href="#" class="nav-link active" aria-current="page">Home</a></li>
+                <li class="nav-item"><a href="#" class="nav-link">Link 1</a></li>
+                <li class="nav-item"><a href="#" class="nav-link">Link 2</a></li>
+                <li class="nav-item"><a href="#" class="nav-link">Link 3</a></li>
+              </ul>
+            </header>
+          </div>
+    <!-- HLAVNÍ ČÁST KÓDU -->
+    <main class="container">
+
+      <div class="px-4 py-4 my-4 text-center">
+        <div>
+          <h3 class="display-3 fw-bold">Nadpis</h3>
+          <p class="col-lg-6 mx-auto">Lorem ipsum dolor sit amet consectetur adipisicing elit. Impedit animi error nihil praesentium, natus sunt consequuntur, eum excepturi, maiores ab aliquid quasi facilis laboriosam? Quo exercitationem repellat totam pariatur enim.</p>
+        </div>
+      </div>
+      <hr>
+
+      <div class="row py-4">
+        <div class="col-lg-4 px-3">
+          <h4 class="display-4">TEXT</h4>
+          Lorem ipsum dolor, sit amet consectetur adipisicing elit. Rem dolore ad suscipit asperiores ullam quo aliquam ex repudiandae facilis fugit distinctio amet error non, blanditiis eum adipisci ipsam sapiente? Et.</div>
+        <div class="col-lg-4 px-3">
+          <h4 class="display-4">TEXT</h4>
+          Lorem ipsum dolor, sit amet consectetur adipisicing elit. Eveniet amet architecto facilis pariatur maiores omnis cum necessitatibus, provident corporis iusto, iste accusantium similique fuga ex ab eligendi expedita dolor totam.</div>
+        <div class="col-lg-4 px-3">
+          <h4 class="display-4">TEXT</h4>
+          Lorem, ipsum dolor sit amet consectetur adipisicing elit. Ducimus nesciunt perferendis quibusdam libero alias veniam incidunt optio, corrupti cum quis. Eaque adipisci vitae dicta quae laboriosam ipsam minus ducimus dolore.</div>
+      </div>
+
+      <hr>
+
+      <div class="list-group">
+        <div class="list-group-item list-group-item-action d-flex gap-3 py-3">Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolorem, ducimus! Maiores facilis ullam consectetur vitae quibusdam praesentium quam voluptas. Magni, placeat aperiam iure ut eaque suscipit sapiente numquam perspiciatis corrupti.</div>
+        <div class="list-group-item list-group-item-action d-flex gap-3 py-3">Lorem ipsum dolor sit amet consectetur adipisicing elit. Laborum vel veritatis iste nemo eius necessitatibus minima nostrum illo ab aliquid esse sit, dolorem excepturi natus modi! Deserunt recusandae quo aliquid!</div>
+        <div class="list-group-item list-group-item-action d-flex gap-3 py-3">Lorem ipsum dolor sit amet consectetur adipisicing elit. Error laborum totam numquam dolores sed dolore aliquid ipsam et deserunt enim a earum quis saepe similique nesciunt qui libero, doloribus perferendis.</div>
+
+      </div>
+      <hr>
+      <div class="px-2 py-2 my-1 col-lg-6 offset-3">
+        <h4 class="display-5">Zkontaktujte nás</h4>
+        <form action="">
+          <div class="mb-3">
+            <label for="email1" class="form-label">Email</label>
+            <input type="email" id="email1" class="form-control" >
+          </div>
+          <div class="mb-3">
+            <label for="name1" class="form-label">Jméno</label>
+            <input type="text" id="name1" class="form-control">
+          </div>
+          <div class="mb-3">
+            <label for="textarea1">Váš text</label>
+            <textarea class="form-control" 
+            id="textarea1" rows="3"></textarea> 
+          </div>
+          <button type="submit" class="btn btn-primary">Odeslat</button>
+        </form>
+      </div>
+    </main>
+    
+    
+    <!-- Footer - zakončení stránky -->    
+    <footer class="footer mt-auto">
+            <ul class="nav justify-content-center border-bottom py-2  mb-3">
+                <li class="nav-item"><a href="#" class="nav-link text-muted">HOME</a></li>
+                <li class="nav-item"><a href="#" class="nav-link text-muted">Link1</a></li>
+                <li class="nav-item"><a href="#" class="nav-link text-muted">Link2</a></li>    
+            </ul>
+            <p class="text-center text-muted">Škrabánek 2022</p>
+    </footer>
+
+
+
+    <script src="js/bootstrap.bundle.js"></script>
+</body>
+</html>
\ No newline at end of file
