position: sticky

HTML

<div class="main">
  <div class="placeholder">This div holds place</div>
  <div class="placeholder">This div holds place</div>
  <div class="placeholder">This div holds place</div>
  <div class="placeholder">This div holds place</div>
  <div class="placeholder">This div holds place</div>
  <div class="slider">
   This is the footer
  </div>
</div>
<div class="footer">This is the main footer</div>

CSS

html, body {
    margin: 0;
}



.placeholder {
    border: 1px solid black;
    margin: 0 auto;
    text-align: center;
    height: 300px;
}

.slider {
    background: #006264;
    color: white;
    position: sticky;
    bottom: 0px;
    width: 100%;
    height: 60px;
}
.footer {
    background: #04246A;
    color: white;
    font-weight: bold;
    margin: 0 auto;
    height: 119px;
}