.pinned-footer {
  .fixed-bar();
  background: fadeout(@openstax-white, 20%);
  padding: 10px @openstax-navbar-padding-horizontal;
  bottom: 0;
}

.pinned-header {
  .make-shy-animate();
}

.pinned-on {
  .pinned-header {
    top: @openstax-navbar-height;
    .fixed-bar();
  }
}

.pinned-footer {
  .fixed-bar();
  background: fadeout(@openstax-white, 20%);
  padding: 10px @openstax-navbar-padding-horizontal;
  bottom: 0;
}

.pinned-header {
  .make-shy-animate();
}

.pinned-on {
  .pinned-header {
    top: @openstax-navbar-height;
    .fixed-bar();
  }
}

// always wrap around elements by extending bootstrap's clearfix
.card-body { &:extend(.clearfix all); }

Extend past floated elements by using clearfix
Extend past floated elements by using clearfix
