<div class="alert alert-info alert-dismissible fade show mb-0 text-center" role="alert">
  We use cookies to ensure you get the best experience on our website. 
  <button type="button" class="btn btn-info btn-sm ms-3">Accept</button>
  <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div>

<div class="alert alert-light alert-dismissible fade show mb-0 text-center shadow" role="alert">
  We use cookies to improve your experience on our site. <a href="#" class="alert-link">Learn more</a>. 
  <button type="button" class="btn btn-dark btn-sm ms-3">Accept</button>
  <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div>

<div class="alert alert-warning alert-dismissible fade show mb-0 text-center" role="alert">
  We use cookies to ensure you get the best experience on our website. 
  <button type="button" class="btn btn-secondary btn-sm ms-3">Accept</button>
  <button type="button" class="btn btn-outline-secondary btn-sm ms-2">Decline</button>
  <a href="#" class="btn btn-link btn-sm">Learn more</a> 
  <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div>

<div class="container-fluid py-3">
  <div class="row justify-content-center">
    <div class="col-md-10 col-lg-12">
      <div class="alert p-4 bg-white border rounded shadow d-flex flex-column flex-md-row align-items-center">
        <div class="flex-grow-1 mb-3 mb-md-0 me-md-4">
          <p class="mb-2"> We use cookies to personalise content and ads, to provide social media features and to analyse our traffic. We also share information about your use of our site with our social media, advertising and analytics partners who may combine it with other information that you’ve provided to them or that they’ve collected from your use of their services. </p>
          <a href="#" class="text-decoration-none fw-bold">Show details <i class="bi bi-chevron-right"></i></a>
        </div>
        <div class="d-flex flex-md-column gap-2 text-nowrap">
          <button class="btn btn-dark btn-lg">Allow all</button>
          <button class="btn btn-outline-dark btn-lg">Deny</button>
        </div>
      </div>
    </div>
  </div>
</div>

<div class="container-fluid py-3 fixed-bottom">
  <div class="row justify-content-center">
    <div class="col-md-10 col-lg-12">
      <div class="alert p-4 bg-white border-0 rounded shadow-sm d-flex flex-column flex-md-row align-items-center">
        <div class="flex-grow-1 mb-3 mb-md-0">
          <p class="mb-2"> We use cookies to personalise content and ads, to provide social media features and to analyse our traffic. We also share information about your use of our site with our social media, advertising and analytics partners who may combine it with other information that you’ve provided to them or that they’ve collected from your use of their services. </p>
          <a href="#" class="text-decoration-none fw-bold">Show details <i class="bi bi-chevron-right"></i></a>
        </div>
        <div class="d-flex flex-md-column gap-2 text-nowrap">
          <button class="btn btn-dark btn-lg">Allow all</button>
          <button class="btn btn-outline-dark btn-lg">Deny</button>
        </div>
      </div>
    </div>
  </div>
</div>

<div class="container-fluid py-3 fixed-top">
  <div class="row justify-content-center">
    <div class="col-md-10 col-lg-12">
      <div class="alert p-4 bg-white border-0 rounded shadow-sm d-flex flex-column flex-md-row align-items-center">
        <div class="flex-grow-1 mb-3 mb-md-0">
          <p class="mb-2"> We use cookies to personalise content and ads, to provide social media features and to analyse our traffic. We also share information about your use of our site with our social media, advertising and analytics partners who may combine it with other information that you’ve provided to them or that they’ve collected from your use of their services. </p>
          <a href="#" class="text-decoration-none fw-bold">Show details <i class="bi bi-chevron-right"></i></a>
        </div>
        <div class="d-flex flex-md-column gap-2 text-nowrap">
          <button class="btn btn-dark btn-lg">Allow all</button>
          <button class="btn btn-outline-dark btn-lg">Deny</button>
        </div>
      </div>
    </div>
  </div>
</div>

<div class="position-fixed bottom-0 start-0 end-0 p-3">
  <div class="alert p-4 bg-white border-0 rounded shadow-sm d-flex flex-column flex-md-row align-items-center">
    <div class="flex-grow-1 mb-3 mb-md-0">
      <p class="mb-2"> We use cookies to personalise content and ads, to provide social media features and to analyse our traffic. We also share information about your use of our site with our social media, advertising and analytics partners who may combine it with other information that you’ve provided to them or that they’ve collected from your use of their services. </p>
      <a href="#" class="text-decoration-none fw-bold">Show details <i class="bi bi-chevron-right"></i></a>
    </div>
    <div class="d-flex flex-md-column gap-2 text-nowrap">
      <button class="btn btn-dark btn-lg">Allow all</button>
      <button class="btn btn-outline-dark btn-lg">Deny</button>
    </div>
  </div>
</div>