* {
    cursor: none;

    @include media-breakpoint-down(md){
        cursor: initial;
    }
}

.cursor {
    position: fixed;   
    width: 25px;
    height: 25px;  
    border: 0;
    background-color: white;
    mix-blend-mode: difference;   
    display: flex;
    justify-content: center;
    align-items: center;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    pointer-events: none;
    opacity: 0;
    visibility: hidden;
    @include border-radius(50%);
    @include transform(translate(-50%, -50%));
    transition: width .25s ease-in-out, 
                height .25s ease-in-out;
    z-index: 9999;

    &-text {
        font-size: 7pt;
        font-weight: 600;
        color: $black;
        text-transform: uppercase;
    }

    &.is-moving {
        opacity: 1;
        visibility: visible;
    }

    &.cursor-link {
        width: 50px;
        height: 50px;
    }

    &.cursor-drag {
        width: 80px;
        height: 80px;
        border: 2px solid $black;
        background-color: $white-alpha;
        mix-blend-mode: normal; 

        &::before,
        &::after {
            position: fixed;
            font-weight: 600;
            font-size: 14pt;
        }
        
        &::before {
            content: "<";
            left: -30%;
        }

        &::after {
            content: ">";
            right: -30%;
        }
    }

    &.cursor-discover {
        width: 100px;
        height: 100px;

        &::before,
        &::after {
            display: none;
        }
    }

}