.v-window { overflow: hidden; } .v-window__container { display: flex; flex-direction: column; height: inherit; position: relative; transition: 0.3s cubic-bezier(0.25, 0.8, 0.5, 1); } .v-window__controls { position: absolute; left: 0; top: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: space-between; padding: 0 16px; pointer-events: none; } .v-window__controls > * { pointer-events: auto; } .v-window--show-arrows-on-hover { overflow: hidden; } .v-window--show-arrows-on-hover .v-window__left { transform: translateX(-200%); } .v-window--show-arrows-on-hover .v-window__right { transform: translateX(200%); } .v-window--show-arrows-on-hover:hover .v-window__left, .v-window--show-arrows-on-hover:hover .v-window__right { transform: translateX(0); } .v-window-x-transition-enter-active, .v-window-x-transition-leave-active, .v-window-x-reverse-transition-enter-active, .v-window-x-reverse-transition-leave-active, .v-window-y-transition-enter-active, .v-window-y-transition-leave-active, .v-window-y-reverse-transition-enter-active, .v-window-y-reverse-transition-leave-active { transition: 0.3s cubic-bezier(0.25, 0.8, 0.5, 1); } .v-window-x-transition-leave-from, .v-window-x-transition-leave-to, .v-window-x-reverse-transition-leave-from, .v-window-x-reverse-transition-leave-to, .v-window-y-transition-leave-from, .v-window-y-transition-leave-to, .v-window-y-reverse-transition-leave-from, .v-window-y-reverse-transition-leave-to { position: absolute !important; top: 0; width: 100%; } .v-window-x-transition-enter-from { transform: translateX(100%); } .v-window-x-transition-leave-to { transform: translateX(-100%); } .v-window-x-reverse-transition-enter-from { transform: translateX(-100%); } .v-window-x-reverse-transition-leave-to { transform: translateX(100%); } .v-window-y-transition-enter-from { transform: translateY(100%); } .v-window-y-transition-leave-to { transform: translateY(-100%); } .v-window-y-reverse-transition-enter-from { transform: translateY(-100%); } .v-window-y-reverse-transition-leave-to { transform: translateY(100%); }