diff --git a/grid.css b/grid.css
index e69de29..d9913e2 100644
--- a/grid.css
+++ b/grid.css
@@ -0,0 +1,24 @@
+.container {
+    margin: 10px;
+    display: grid;
+    grid-gap: 3px;
+}
+
+.header {
+    grid-column: 2 / 6;
+}
+
+.menu {
+    grid-column: 1 / 2;
+    grid-row: 1 / span 190;
+}
+
+.content {
+    grid-column: 2 / 6 ;
+    grid-row: 2 / span 189;
+}
+
+.footer {
+    grid-column: 1 / 6;
+    grid-row: 191;
+}
diff --git a/index.html b/index.html
index 535ecb1..4c6b3df 100644
--- a/index.html
+++ b/index.html
@@ -1,9 +1,45 @@
 <html>
     <head>
+        <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-uWxY/CJNBR+1zjPWmfnSnVxwRheevXITnMqoEIeG1LJrdI0GlVs/9cVSyPYXdcSF" crossorigin="anonymous">
         <link rel="stylesheet" href="grid.css">
         <link rel="stylesheet" href="style.css">
     </head>
     <body>
+        <nav class="navbar navbar-expand-lg navbar-light bg-light">
+            <div class="container-fluid">
+              <a class="navbar-brand" href="#">Navbar</a>
+              <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
+                <span class="navbar-toggler-icon"></span>
+              </button>
+              <div class="collapse navbar-collapse" id="navbarNav">
+                <ul class="navbar-nav">
+                  <li class="nav-item">
+                    <a class="nav-link active" aria-current="page" href="#">Home</a>
+                  </li>
+                  <li class="nav-item">
+                    <a class="nav-link" href="#">Features</a>
+                  </li>
+                  <li class="nav-item">
+                    <a class="nav-link" href="#">Pricing</a>
+                  </li>
+                  <li class="nav-item">
+                    <a class="nav-link disabled">Disabled</a>
+                  </li>
+                </ul>
+              </div>
+            </div>
+          </nav>
+          <br>
+          <div class="alert alert-primary d-flex align-items-center" role="alert">
+            <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" class="bi bi-exclamation-triangle-fill flex-shrink-0 me-2" viewBox="0 0 16 16" role="img" aria-label="Warning:">
+              <path d="M8.982 1.566a1.13 1.13 0 0 0-1.96 0L.165 13.233c-.457.778.091 1.767.98 1.767h13.713c.889 0 1.438-.99.98-1.767L8.982 1.566zM8 5c.535 0 .954.462.9.995l-.35 3.507a.552.552 0 0 1-1.1 0L7.1 5.995A.905.905 0 0 1 8 5zm.002 6a1 1 0 1 1 0 2 1 1 0 0 1 0-2z"/>
+            </svg>
+            <div>
+              This website is using bootstrap
+            </div>
+          </div>
+          <br>
+          <h2 class="text-center">Grid</h2>
         <div class="container">
             <div class="header">HEADER</div>
             <div class="menu">MENU</div>
