title: How to fix Form over the slider image
body: <p>I am working on codeigniter and creating a website.
  I am trying to fix user check availability form over my slider images but I didn't get output what I want.
  Here is my HTML code:</p>
  
  <pre><code>&lt;form action="index.html" class="default-form"&gt;
      &lt;span class="arrival calendar"&gt;
          &lt;input type="text" name="arrival" placeholder="Arrival" data-dateformat="m/d/y"&gt;
          &lt;i class="fa fa-calendar"&gt;&lt;/i&gt;
      &lt;/span&gt;
      &lt;span class="departure calendar"&gt;
          &lt;input type="text" name="departure" placeholder="Departure" data-dateformat="m/d/y"&gt;
          &lt;i class="fa fa-calendar"&gt;&lt;/i&gt;
      &lt;/span&gt;
      &lt;span class="adults select-box"&gt;
          &lt;select name="adults" data-placeholder="Adults"&gt;
              &lt;option&gt;Adults&lt;/option&gt;
              &lt;option value="1"&gt;1 adult&lt;/option&gt;
              &lt;option value="2"&gt;2 adults&lt;/option&gt;
              &lt;option value="3"&gt;3 adults&lt;/option&gt;
              &lt;option value="4"&gt;4 adults&lt;/option&gt;
           &lt;/select&gt;
       &lt;/span&gt;
       &lt;span class="children select-box"&gt;
           &lt;select name="children" data-placeholder="Children"&gt;
              &lt;option&gt;Children&lt;/option&gt;
              &lt;option value="1"&gt;1 children&lt;/option&gt;
              &lt;option value="2"&gt;2 childrens&lt;/option&gt;
              &lt;option value="3"&gt;3 childrens&lt;/option&gt;
              &lt;option value="4"&gt;4 childrens&lt;/option&gt;
            &lt;/select&gt;
         &lt;/span&gt;
         &lt;span class="submit-btn"&gt;
             &lt;button class="btn btn-transparent"&gt;Book Now&lt;/button&gt;
             &lt;a href="#" class="advanced"&gt;Advanced Search&lt;/a&gt;
         &lt;/span&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>Here is Css code:</p>
  
  <pre><code>#banner #hero-tabs .tab-content-list {
    padding: 40px;
    text-align: center;
    background: rgba(0, 0, 0, 0.4);
  }
  #banner #hero-tabs .tab-content-list .tab-content {
    display: none;
  }
  </code></pre>
  
  <p>Please Help me out to find how to fix form over image slider.</p>