.mm-ocd--layout--position-top {
    --mm-ocd-position-top: 0;
    --mm-ocd-position-left: 50%;
    --mm-ocd-transform: translate3d(-50%, -100%, 0);
}

.mm-ocd--layout--position-top.mm-ocd--open {
    --mm-ocd-transform: translate3d(-50%, 0, 0);
}

.mm-ocd--layout--position-right {
    --mm-ocd-position-top: 0;
    --mm-ocd-position-right: 0;
    --mm-ocd-position-bottom: 0;
    --mm-ocd-transform: translate3d(100%, 0, 0);
    --mm-ocd-width: 100%;
    --mm-ocd-min-width: 320px;
}

.mm-ocd--layout--position-right.mm-ocd--open {
    --mm-ocd-transform: translate3d(0, 0, 0);
}

.mm-ocd--layout--position-center {
    --mm-ocd-position-top: 50%;
    --mm-ocd-position-left: 50%;
    --mm-ocd-transform: translate3d(-50%, -50%, 0) scale(0.8);
}

.mm-ocd--layout--position-center.mm-ocd--open {
    --mm-ocd-transform: translate3d(-50%, -50%, 0) scale(1);
}

.mm-ocd--layout--position-bottom {
    --mm-ocd-position-left: 50%;
    --mm-ocd-position-bottom: 0;
    --mm-ocd-transform: translate3d(-50%, 100%, 0);
}

.mm-ocd--layout--position-bottom.mm-ocd--open {
    --mm-ocd-transform: translate3d(-50%, 0, 0);
}

.mm-ocd--layout--position-left {
    --mm-ocd-position-top: 0;
    --mm-ocd-position-left: 0;
    --mm-ocd-position-bottom: 0;
    --mm-ocd-transform: translate3d(-100%, 0, 0);
    --mm-ocd-width: 100%;
    --mm-ocd-min-width: 320px;
}

.mm-ocd--layout--position-left.mm-ocd--open {
    --mm-ocd-transform: translate3d(0, 0, 0);
}