<!--Main Navigation-->

<header>

​

  <nav class="navbar fixed-top navbar-expand-lg navbar-dark pink scrolling-navbar">

    <a class="navbar-brand" href="#"><strong>Navbar</strong></a>

    <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent"

      aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">

      <span class="navbar-toggler-icon"></span>

    </button>

    <div class="collapse navbar-collapse" id="navbarSupportedContent">

      <ul class="navbar-nav mr-auto">

        <li class="nav-item active">

          <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></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" href="#">Opinions</a>

        </li>

      </ul>

      <ul class="navbar-nav nav-flex-icons">

        <li class="nav-item">

          <a class="nav-link"><i class="fab fa-facebook-f"></i></a>

        </li>

        <li class="nav-item">

          <a class="nav-link"><i class="fab fa-twitter"></i></a>

        </li>

        <li class="nav-item">

          <a class="nav-link"><i class="fab fa-instagram"></i></a>

        </li>

      </ul>

    </div>

  </nav>

​

</header>

<!--Main Navigation-->

<div style="height: 2000px; background-color: black">

  example text

</div>

<!-- Modal -->

<div class="modal fade" id="basicExampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel"

  aria-hidden="true">

  <div class="modal-dialog" role="document">

    <div class="modal-content">

      <div class="modal-header">

        <h5 class="modal-title" id="exampleModalLabel">Modal title</h5>

        <button type="button" class="close" data-dismiss="modal" aria-label="Close">

          <span aria-hidden="true">&times;</span>

        </button>

      </div>

      <div class="modal-body" style="height: 800px">

        ...

      </div>

      <div class="modal-footer">

        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>

        <button type="button" class="btn btn-primary">Save changes</button>

      </div>

    </div>

  </div>

</div>

​

<!-- Modal -->

<div class="modal bottom modal-content-clickable" id="gdpr_basic">

    <div class="modal-dialog modal-frame modal-bottom modal-notify modal-notify">

      <div class="modal-content">

        <div class="modal-body">

          <div class="d-lg-flex">

            <p class="pt-3 pr-2" style="font-size:.8rem;flex:4;">

              example text 

            </p>

            <div class="d-lg-inline-flex" style="padding-top: 10px;align-items: flex-start;">

              <button class="btn btn-md grey white-text" id="gdpr_btn_close">close<i

                  class="fas fa-book ml-1"></i>

              </button>

            </div>

          </div>

        </div>

      </div>

    </div>

  </div>

<!-- Modal -->

​