/*MOV MENU*/
.movmenu-gear {
    transition: border-radius .1s;
    bottom: 20px;
    border-radius: 50%;
    color: var(--color-white);
    height: 50px;
    position: fixed;
    right: 20px;
    width: 50px;
    z-index: 220;
    background-color: var(--color-main);

    &.on {
        background-color: var(--color-danger);
        &>.divon{
            display: flex;
        }
        &>.divoff{
            display: none;
        }
    }
    &:not(.on) {
        &>.divon{
            display: none;
        }
        &>.divoff{
            display: flex;
        }
    }

    &>.divon,
    &>.divoff{
        justify-content: center;
        align-items: center;
        width: 100%;
        height: 100%;
    }

}

.movmenu-icon {
    height: 50px;
    width: 50px;
    border-radius: 50%;
    transition: transform 1s;
    z-index: 120;

    &.one {
        background-color: var(--color-main);
        color: var(--color-lightmain);
    }

    &.two {
        background-color: var(--color-secondary);
        color: var(--color-lightsecondary);
    }

    &.three {
        background-color: var(--color-info);
        color: var(--color-lightinfo);
    }
}

.mm-left, .mm-top {
    position: fixed;
    transition: all .2s;
    bottom: 20px;
    right: 20px;
}

.mm-left {
    &.on {
        right: 100px;
    }
}

.mm-top {
    &.on {
        bottom: 100px;
        transition-delay: .1s;
    }
}

.mm-top.mm-left {
    &.on {
        bottom: 86px;
        right: 86px;
        transition-delay: .05s;
    }
}