Sticky header using hook that hides when scrolling down?

I was able to get the following to display the header I want. Is there a way to have it as a sticky header that hides when scrolling down? Can itbe made to fade transition like the sticky menu feature?

I used the code provided in another thread to get things going.

Before header hook:

CSS:
.custom-fixed-header {
position: fixed;
top: 0;
width: 100%;
z-index: 2000;
}

.custom-fixed-header + * {
padding-top: 120px;
}