<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">

  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet"
    integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous" />
  <script defer src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"
    integrity="sha384-C6RzsynM9kWDrMNeT87bh95OGNyZPhcTNXj1NW7RuBCsyN/o0jlpcV8Qyq46cDfL"
    crossorigin="anonymous"></script>

  <link rel="stylesheet" href="..\..\stylesheets\articles.css">
  <script src="..\..\scripts\articles.js"></script>

  <link rel="stylesheet" href="..\..\stylesheets\index.css">
  <script src="..\..\scripts\index.js"></script>

  <title>Articles</title>
</head>

<body>
  <div class="container-fluid" style="height: 100vh;">
    <div class="row h-100">
      <%- include('navbar') %>

      <!-- Content -->
      <div class="col-9 scrollable-column" style="background-color: aqua;">
        <div class="row">
          <!-- Article -->
          <div class="col-8">
            <nav aria-label="breadcrumb">
              <ol class="breadcrumb">
                <li class="breadcrumb-item"><a href="#">Home</a></li>
                <li class="breadcrumb-item"><a href="#">Library</a></li>
                <li class="breadcrumb-item active" aria-current="page">Data</li>
              </ol>
            </nav>

            <h1>Article Title</h1>
            <h5>1/1/2001 by Bob McAnderson</h5>
            <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Eveniet mollitia vero fugiat vitae modi? Porro, error in soluta repellat magni eveniet exercitationem, consequuntur reiciendis sed itaque, ipsum voluptatum dignissimos. Iusto consectetur veritatis suscipit dolores quas autem molestias quibusdam atque, deleniti unde voluptate, ut quis aliquam facere voluptas nemo dignissimos necessitatibus aliquid. Nobis quos labore at. Aut ab harum necessitatibus labore, vitae ad dolor sint odio accusantium. Asperiores rerum quod quidem quia aliquid ex necessitatibus et voluptas esse vitae tempore ut deserunt, nobis sapiente impedit autem nam, optio aperiam totam excepturi culpa odit earum veniam omnis. Eum at vel eius iure provident maxime, non reprehenderit voluptate consectetur dolorum fugiat accusamus optio, in facilis, commodi autem necessitatibus eveniet dolorem repudiandae inventore. Odit veritatis, consequatur corporis fugiat inventore nam a deserunt explicabo optio quibusdam excepturi saepe nostrum labore voluptatum, commodi magnam, quidem eos voluptatibus. Reprehenderit odit blanditiis quaerat ullam, temporibus qui pariatur voluptates magni nemo repellendus rem distinctio incidunt facilis corrupti nesciunt omnis saepe doloremque animi vel! Labore odit numquam repellendus tenetur obcaecati atque, consectetur eos distinctio itaque ullam. Harum, vitae soluta! Neque ipsam officiis eius dignissimos error aliquam rerum, quae vel fugit libero sapiente sint illum quis inventore repudiandae dolorum cumque totam cupiditate velit? Maxime consequuntur alias animi! Assumenda similique aliquam adipisci quas libero suscipit natus quos sapiente placeat, nulla saepe velit voluptas! Eveniet assumenda error in ab perspiciatis quae autem quidem nesciunt eos impedit aliquid modi, ad nihil quia commodi maiores! Consequatur temporibus alias voluptatem rerum debitis optio soluta, quo porro earum repellendus doloremque, eos inventore pariatur unde? Quos aspernatur deserunt minus cum ducimus, veniam repellat voluptatibus sunt commodi reiciendis, ratione suscipit cupiditate molestias laboriosam eum, eveniet hic aliquid dolore iure impedit assumenda error sint pariatur eligendi. Hic in tenetur esse exercitationem neque rem rerum sequi alias repellat! Illo exercitationem sint deserunt facilis, aliquid expedita soluta et magni aspernatur ex harum ratione omnis libero cum reiciendis enim porro dicta mollitia at id eum dignissimos? Consequuntur sapiente saepe quia, soluta, ea rerum placeat animi porro facilis libero officiis minima maxime aliquam quas molestiae fugiat delectus, quidem molestias ut fugit reiciendis? Sit voluptates, repellat sapiente rerum qui tempora eum assumenda odio ipsum commodi labore nulla ex facilis nihil explicabo minus incidunt repudiandae sed accusamus unde nostrum excepturi consequatur fugiat. Voluptate expedita earum eveniet impedit numquam pariatur, non quae exercitationem distinctio sint tempore deserunt nihil ducimus aspernatur laborum commodi iure beatae modi saepe! Cumque architecto rem, voluptas expedita incidunt officia voluptate sunt repellat deleniti neque quaerat molestias id deserunt et. Architecto consequatur, earum dolorem quod nihil fuga eaque adipisci accusamus ipsa! Ut totam aliquid, quibusdam veniam commodi doloremque maxime molestias tempore consequuntur, facilis ducimus aliquam accusantium ipsa odio illum nemo esse est ex soluta illo nam vero repudiandae ullam? Nihil saepe nobis ut fugit qui unde adipisci praesentium, facilis officia iste nesciunt labore ipsam! Ipsam modi, quidem eum id perspiciatis commodi porro vitae sequi ullam accusantium voluptas quod consequatur voluptates dolorem sit, expedita iste nulla inventore assumenda, atque saepe in illum nobis. Autem porro consequuntur quibusdam incidunt quasi accusantium? Obcaecati et iusto officiis nemo nihil iure quaerat perferendis numquam laboriosam assumenda, minus ratione magni exercitationem est molestias dolores adipisci vero similique saepe! Nihil in eligendi doloremque, optio dolorum quod facere rerum, excepturi aliquam facilis odit magni assumenda. Reiciendis laudantium labore tenetur quasi soluta maiores placeat laboriosam quos saepe aliquid accusamus, alias cupiditate itaque eaque veritatis a sint similique consequatur odio culpa, repellat nihil! Molestias blanditiis sed autem cumque libero iste, non facilis veritatis aut nisi ratione quibusdam vitae distinctio sint laboriosam animi esse adipisci deserunt, ab nobis quod! Consectetur veniam quasi excepturi facilis iure enim sapiente quae quod, voluptate velit quo id illum tempore sequi expedita adipisci laudantium, optio autem iusto reprehenderit repellendus! Quos similique cumque veritatis ratione placeat vitae modi a veniam voluptatibus id exercitationem mollitia commodi blanditiis, corporis facere quas voluptates at velit ullam nostrum dicta quibusdam. Quisquam dicta quos nulla id cumque deleniti adipisci maiores saepe, sunt, magnam veritatis ea aliquid fugit. Dolores qui distinctio veniam neque vel beatae, cupiditate sed numquam saepe harum quos reiciendis natus velit expedita consectetur voluptate earum dicta atque ipsam unde ipsum repellat inventore. Laudantium pariatur tempora repellendus at tenetur nemo aliquid nobis laboriosam accusamus a quas illo vel voluptates deserunt sequi repudiandae maiores, dolores quidem deleniti qui, perspiciatis blanditiis iure. Aspernatur quidem maiores vel nam tempora atque deserunt, velit ullam nostrum odio, quas rem quis. Distinctio possimus voluptates temporibus nam numquam illum tempore, atque ipsam impedit consequatur quo consectetur cupiditate modi minus, facilis blanditiis rem laboriosam necessitatibus voluptate ipsa sed asperiores assumenda corrupti. Facilis accusantium voluptatem dolore blanditiis voluptas at id laborum deleniti odit explicabo, praesentium sint, illum inventore culpa doloremque rerum voluptate modi ad. Sint, iste est atque perspiciatis recusandae asperiores quasi! Tenetur est odio quod blanditiis voluptatem doloribus consequuntur minima illo repudiandae, consectetur libero iste error iusto eaque ab harum sint necessitatibus magnam nostrum dignissimos numquam atque id laborum reprehenderit! Illo ipsam quibusdam accusantium quae? Sapiente cupiditate earum temporibus. Cum veritatis quaerat ducimus voluptates natus. Facilis natus quae ex, ad deleniti in corporis molestias at officiis dolorum laborum quibusdam praesentium dignissimos sequi unde eveniet porro. Ea, labore harum sed unde ipsa excepturi, cum magni voluptas culpa, consequuntur quibusdam obcaecati quasi quisquam repellendus perferendis? Inventore iste deserunt qui officia voluptatem a praesentium similique facere suscipit earum ut aliquid nesciunt ea consequatur consectetur consequuntur laboriosam libero recusandae exercitationem commodi, esse nihil ex quos! Minima praesentium ratione animi assumenda eum provident hic dolores sit accusantium corrupti. Voluptates quod recusandae cumque temporibus neque, illo iusto laborum repellat possimus voluptatum reiciendis nulla sunt debitis asperiores quos iure omnis consectetur tempore eius voluptate minus dolor. Accusantium, recusandae. Quas officiis minima ipsam nesciunt aut eum neque at officia autem ad minus debitis veritatis commodi facere, harum vel fugit quos tempore facilis, qui ut voluptas laborum! Dolorem dolores, similique vel dolor sapiente minus quis repellat? Suscipit eaque veritatis obcaecati, iure neque, est non voluptatum porro vero ex, unde vitae praesentium nostrum laborum officiis velit! Aperiam cupiditate eveniet quis quo repudiandae odio.</p>
          </div>
          <div class="col-4 p-5" style="background-color: azure;">
            <ul class="list-group">
              <li class="list-group-item"><a href="#">FAQs</a></li>
              <li class="list-group-item"><a href="#">Getting Started</a></li>
              <li class="list-group-item"><a href="#">How to Become a Publisher</a></li>
              <li class="list-group-item"><a href="#">About Us</a></li>
              <li class="list-group-item"><a href="#">Contact Us</a></li>
              <li class="list-group-item"><a href="#">Terms of Service</a></li>
              <li class="list-group-item"><a href="#">Privacy Policy</a></li>
              <li class="list-group-item"><a href="#">Community Guidelines</a></li>
              <li class="list-group-item"><a href="#">Blog</a></li>
              <li class="list-group-item"><a href="#">Feedback</a></li>
            </ul>
          </div>
        </div>
      </div>
    </div>
  </div>
  </div>


  <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"
    integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz"
    crossorigin="anonymous"></script>
</body>

</html>