.to-top{
    position: fixed;
    bottom:25% ;
    right: .5rem;
    height: 2.5rem;
    width: 2.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(0, #222, #333);
    border-radius: 50%;
    font-size: 1.5rem;
    color: #fff;
    outline: 2px solid #ff9900;
    pointer-events: none;
    opacity: 0;
    z-index: 101;
    transition: 300ms ease;
    visibility: hidden;
    transform: rotate(180deg);
    box-shadow: 0 5px 8px rgba(0,0,0, .180);
}

.to-top:hover{
    scale: 1.030;
}

.to-top.active{
    transform: rotate(0);
    pointer-events: all;
    opacity: 1;
    visibility: visible;
}