/* MOV MENU */
.movmenu-gear {
    transition: border-radius 0.1s, background-color 0.1s;
    -webkit-transition: border-radius 0.1s, background-color 0.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);
}

.movmenu-gear.on {
    background-color: var(--color-danger);
}

.movmenu-gear.on > .divon {
    display: flex;
}

.movmenu-gear.on > .divoff {
    display: none;
}

.movmenu-gear:not(.on) > .divon {
    display: none;
}

.movmenu-gear:not(.on) > .divoff {
    display: flex;
}

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

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

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

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

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

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

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

.mm-top.on {
    bottom: 100px;
    transition-delay: 0.1s;
    -webkit-transition-delay: 0.1s;
}

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