diff --git a/index.html b/index.html
index 6ff25af..65a3927 100644
--- a/index.html
+++ b/index.html
@@ -5,6 +5,7 @@
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Formulář</title>
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
     <style>
         label:hover {
             cursor: pointer;
@@ -13,52 +14,63 @@
 </head>
 <body>
     <h1>Registrační formulář</h1>
-    <form id="regform" action="">
-        <p>
-            <input type="text" name="name" value="" placeholder="e.g. Bob">
-        </p>
-        <p>
-            <input type="number" name="age" min="1" max="199" placeholder="Your age">
-        </p>
-
-        <p>
-            pohlaví <br>
-            <input id="male" type="radio" name="sex" value="male"> <label for="male">muž</label> 
-            <input id="female" type="radio" name="sex" value="female"> <label for="female">žena</label>
-        </p>
-
-        <p>
-            <select name="country">
-                <option value="CZ">Česko</option>
-                <option value="SK">Slovensko</option>
-                <option value="DE">Německo</option>
-            </select>
-        </p>
-        <p>
-            Chci zasílat novinky z: <br>
-            <input type="checkbox" name="news" value="1" id="vedtech"> 
-            <label for="vedtech">Věda a technika</label> <br>
-            <input type="checkbox" name="news" value="2" id="eko">
-            <label for="eko">Ekonomika</label>
-        </p>
-
-        <p>
-            <label for="">Datum narození</label>
-            <input type="date" max="2021-11-03">
-        </p>
-
-        <p>
-            <label for="">Zájmy</label>
-            <textarea name="zajmy" id="" cols="30" rows="10"></textarea>
-        </p>
-
-        
-
-
-        <input type="submit" name="reg" value="Registrovat">
-        <button type="submit">Registrovat 2</button>
-    </form>
+    <div class="card" style="width: 24rem;">
+        <div class="card-body">
+            <form id="regform" action="">
+                <div class="mb-3">
+                    <label for="name" class="form-label">Jméno</label>
+                    <input class="form-control" id="name" type="text" name="name" value="" placeholder="e.g. Bob">
+                </div>
+                <div class="mb-3">
+                    <label for="age" class="form-label">Věk</label>
+                    <input class="form-control" id="age" type="number" name="age" min="1" max="199" placeholder="Your age">
+                </div>
 
+                <div class="mb-3">
+                    <div class="form-check">
+                        <input class="form-check-input" id="male" type="radio" name="sex" value="male">
+                        <label class="form-check-label" for="male">muž</label> 
+                    </div>
+                    <div class="form-check">
+                        <input class="form-check-input" id="female" type="radio" name="sex" value="female"> 
+                        <label class="form-check-label" for="female">žena</label>
+                    </div>
+                </div>
+                <div class="mb-3">
+                    <label for="country" class="form-label"></label>
+                    <select id="form-label" name="country" class="form-select">
+                        <option value="CZ">Česko</option>
+                        <option value="SK">Slovensko</option>
+                        <option value="DE">Německo</option>
+                    </select>
+                </div>
+                <div class="mb-3">
+                    Chci zasílat novinky z: <br>
+                    <div class="form-check form-switch">
+                        <input class="form-check-input" type="checkbox" name="news" value="1" id="vedtech"> 
+                        <label class="form-check-label" for="vedtech">Věda a technika</label> <br>
+                    </div>
+                    <div class="form-check form-switch">
+                        <input class="form-check-input" type="checkbox" name="news" value="2" id="eko">
+                        <label class="form-check-label" for="eko">Ekonomika</label>
+                    </div>
+                </div>
+                <div class="mb-3">
+                    <label class="form-label" for="birthday">Datum narození</label>
+                    <input class="form-control" id="birthday" type="date" max="2021-11-03">
+                </div>
+                <div class="mb-3">
+                    <label class="form-label" for="hobbies">Zájmy</label>
+                    <textarea class="form-control" id="hobbies" name="hobbies" cols="30" rows="10"></textarea>
+                </div>
+                <div class="mb-3">
+                    <input class="btn btn-primary" type="submit" name="reg" value="Registrovat">
+                    <button class="btn btn-primary" type="submit">Registrovat 2</button>
+                </div>
+            </form>
+        </div>
+    </div>
+    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p" crossorigin="anonymous"></script>
     <script>
         let form = document.querySelector("#regform");
 
