Bootstrap slider with contact us

 <div id="contacslider" class="carousel slide" data-ride="carousel">

  <!-- Indicators -->
  <ul class="carousel-indicators">
    <li data-target="#contacslider" data-slide-to="0" class="active"></li>
    <li data-target="#contacslider" data-slide-to="1"></li>
    <li data-target="#contacslider" data-slide-to="2"></li>
  </ul>

  <!-- The slideshow -->
  <div class="container">
      <div class="row">
      <div class="col-lg-7">
          <div class="carousel-inner">
    <div class="carousel-item active">
       <div class="caption">
           <h2>Awesome <br>Delicious Food</h2>
           <h4>Food & Drinks</h4>
           <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Alias, unde sapiente.</p>
       </div>
    </div>
    <div class="carousel-item">
       <div class="caption">
           <h2>Awesome <br>Delicious Food</h2>
           <h4>Food & Drinks</h4>
           <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Alias, unde sapiente.</p>
       </div>
    </div>
    <div class="carousel-item">
      <div class="caption">
           <h2>Awesome <br>Delicious Food</h2>
           <h4>Food & Drinks</h4>
           <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Alias, unde sapiente.</p>
       </div>
    </div>
  </div>
      </div>
      <div class="col-lg-5">
          <form action="" class="call-back mt-5">
             <h2>Book a table</h2>
             <p><small>Lorem ipsum dolor sit amet</small></p>
              <input type="text" name="" id="" class="form-control" placeholder="Name">
              <input type="text" name="" id="" class="form-control" placeholder="Email">
              <input type="text" name="" id="" class="form-control" placeholder="Person">
              <button type="submit" class="btn btn-danger btn-lg rounded-0"> Book Now </button>
          </form>
      </div>
  </div>
  </div>

  

</div>

  <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
   <link href="https://fonts.googleapis.com/css?family=Indie+Flower|Poppins:400,500&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<style>
    body { font-family: 'Poppins', sans-serif;  color: #fff;} 
    #contacslider { background: url(http://www.tolmatol.com/uploads-images/bootstrap-slider-with-contact-us/img.jpeg); min-height: 550px; width: 100%; background-size: cover; background-position: center;}
    #contacslider:before { position: absolute; content: ''; background: rgba(0, 0, 0, 0.45); width: 100%; height: 100%;}
    .caption { color: #fff;     margin-top: 12%;}
    .caption h2 { font-size: 5em;}
    .caption h4 {font-family: 'Indie Flower', cursive;}
    .call-back { padding: 50px 30px; border: 1px solid rgba(255, 255, 255, 0.3); background: rgba(255, 255, 255, 0.1);}
    .call-back input { min-height: 50px; border: solid 1px #fff; background: #fff; margin-bottom: 20px; border-radius: 0px;}
    </style>

 <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>

<script>
    $(document).ready(function(){
        $('.carousel').carousel({
  interval: 2000
})
    })
    </script>