.top-of-page
    margin: 0
    padding: 0

    width: auto
    height: auto

    position: fixed
    bottom: 0.75rem
    right: -3rem

    display: flex
    justify-content: center
    align-items: center

    background-color: RGB($bg-200)
    color: RGB($fg-white)
    border-radius: $rad
    border: none
    opacity: 0

    z-index: 20
    cursor: pointer
    transition: all 0.2s cubic-bezier(.86, 0, .07, 1)

    &:hover
        color: RGB($primary)

    svg
        margin: 0.5rem

        width: 1.25rem
        height: 1.25rem

    &.show
        right: 0.75rem
        opacity: 1

@media (max-width: $breakpoint)
    .top-of-page
        bottom: 4.25rem