.mx-panel{display: flex;}
.mx-panel.column{flex-direction: column;}
.mx-panel.center{align-items: center;}
.mx-panel.small{gap: 20px;}
.mx-panel.big{gap: 80px;}
.mx-panel.small:not(.inner){padding: 20px;}
.mx-panel.big:not(.inner){padding: 50px;}
.mx-panel.min100{min-width: 100%;}
.mx-panel.centered{justify-content: center; align-items: center;}
.mx-panel.centered.max{min-height: 100vh; min-width: 100vw;}

.mx-swipe{
    position: relative;
    overflow: hidden;
    display: flex;
}
.mx-swipe > *:not(.icon) {
    min-width: 100%;
    max-width: 100%;
}
.mx-swipe > .icon.left { left: 20px; }
.mx-swipe > .icon.right { right: 20px; }
.mx-swipe > .icon {
    position: absolute;
    top: calc(50% - 24px);
    font-size: 48px;
    cursor: pointer;
    color: white;
    text-shadow: 0 0 20px black;
    width: 48px;
}