Een go to top pijl rechtsonder in de pagina die pas verschijnt na 160px scrollen. In combinatie met een menu dat verdwijnt met naar beneden scrollen maar meteen terugkomt bij terug omhoog scrollen. En het hamburgermenu.

(plaats in footer of widget in footer)

<button onclick="topFunction()" id="back-top" title="Go to top"><i class="fa fa-arrow-circle-up"></i></button>

/* CSS go to top button: */
#back-top {
    position: fixed;
    bottom: 10px;
    right: 20px;
    z-index: 99999;

}
.fa-arrow-circle-up {
    font-size: 3em !important;
    color: #084B8A;
        text-shadow: #fff 0px 0px 30px;
}
.fa-arrow-circle-up:hover {
        color:#c6851f;
}

<nav id="menu" class="container-fluid row">
	<a href="javascript:void(0)" class="openbtn"  onclick="openNav()"><i class="fa fa-navicon"></i></a>
	<div id="menu-mobile">
		<a href="javascript:void(0)" class="closebtn"  onclick="closeNav()"><i class="fa fa-times"></i></a>
		<div class="menu-hoofdmenu-container">
		  <ul id="menu-hoofdmenu" class="menu">
		    <li id="menu-item-1" class="menu-item">
		    <a href="https://portfolio.ceciliaverhaar.nl/.../" itemprop="url">Naam link1</a>
		    </li>
		    <li id="menu-item-2" class="menu-item">
		    <a href="https://portfolio.ceciliaverhaar.nl/.../" itemprop="url">Naam link2</a>
		    </li>
		  </ul>
		</div>	
		<div id="search" class="">
		  <form role="search" method="get" class="search-form" 
			action="https://portfolio.ceciliaverhaar.nl/">
			  <label>
				<span class="screen-reader-text">Zoeken naar:</span>
				<input type="search" class="search-field" 
				placeholder="Zoeken &hellip;" value="" name="s" />
			  </label>
			<input type="submit" class="search-submit" value="Zoeken" />
		  </form>
		</div>
  	</div>
</nav>

/* HAMBURGERMENU Small devices have a width between 576 to 767 pixels */
@media only screen and (min-width:768px) {
        #menu-mobile {
            	display:flex;
            	flex-flow: row nowrap;
            	justify-content: center;
        	width: 100%;
        	background-color: transparent;
            	margin-top:0px;
        }
        .closebtn {display:none}
     	.menu > ul {
        	display:flex;
        	flex-flow:row wrap;
        }
        .fa-navicon {display:none}
}

@media only screen and (max-width:767px) {
	#menu-open {display:none;}
	.fa-navicon {               
		padding: 5px; 
        	display: flex;
        	align-items: baseline;
        	margin: 0 auto;
        	font-size: 1.5em !important;
        	color: #fff;
        }
        #menu { background-color:#444}         
	 #menu-mobile {             
		display: none;               
		flex-flow: column wrap; 
       		width: 100%;        	
		background-color: #444;           	
		margin-top:-30px;        
	}
        .fa-times {
             	padding: 5px;
        	display: flex;
        	align-items: baseline;
        	margin: 0 auto;
        	font-size: 1.5em !important;
        	color: #fff;
        }
        .menu-hoofdmenu-container { width:100vw; margin-top:40px}
        #menu-hoofdmenu {
        	width: 90%;
        	background-color: #444;
              	margin-top:-30px;
        }
}