scroll-to-top.scss

$scroll-to-top-height: 45px;
$scroll-to-top-width: 45px;
$scroll-to-top-margin: 35px;

body #scroll-to-top {
    width: $scroll-to-top-width;
    height: $scroll-to-top-height;
    margin-right: $scroll-to-top-margin;
    margin-bottom: $scroll-to-top-margin;
    padding: 10px;
    background: var(--base-color);
    border: 1px solid transparent;
    background-clip: padding-box;
    cursor: pointer;
    box-sizing: border-box;
    position: fixed;
    right: 0;
    bottom: 0;
    transition: all 250ms ease-in-out;
    z-index: 1;
    &:hover {
        background: var(--brand-color-darker);
        border-radius: 2px;
    }
    &.hide {
        bottom: calc( 0px - #{$scroll-to-top-height + $scroll-to-top-margin});
    }
}