I Added scroll to top amp but causing spacing element

Hello, I try add custom top to scroll amp but causing header and site container spacing, how to fix that. thanks

​“animations”: [{
“selector”: “#scrollToTopButton”,
“keyframes”: [{
“opacity”: “1”,
“visibility”: “visible”
}]
}]
}
</script>
</amp-animation>
<amp-animation id=”hideAnim” layout=”nodisplay”>
<script type=”application/json”>
{
“duration”: “200ms”,
“fill”: “both”,
“iterations”: “1”,
“direction”: “alternate”,
“animations”: [{
“selector”: “#scrollToTopButton”,
“keyframes”: [{
“opacity”: “0”,
“visibility”: “hidden”
}]
}]
}
</script>
</amp-animation>

<main>
<!– Invisible 0x0px marker div that sits 100px off the top –>
<div id=”marker”>
<amp-position-observer on=”enter:hideAnim.start; exit:showAnim.start” layout=”nodisplay”>
</amp-position-observer>
</div>
<div class=”spacer”></div>
<div class=”spacer”></div>
<button id=”scrollToTopButton” on=”tap:topHeader.scrollTo(duration=200)” class=”scrollToTop”>↑</button>
</main>
</body>

</html>`

this screenshoot problem

The page I need help with: [log in to see the link]