Предлагаю такое решение:
@media screen and (max-width: 780px) {
.kc-flip-container .flipper{
width: 300px !important;
float: inherit !important;
top: calc(50% - 150px)!important;
left: calc(50% - 150px)!important;
}
}
Здесь отдельно стоит отметить данный блок:
top: calc(50% - 150px)!important;
left: calc(50% - 150px)!important;
top: calc(50% — 150px) (150px — это высота флипбокса деленная на два)
left: calc(50% — 150px) (150px — это ширина флипбокса деленная на два)
ПС. По сути при помощи указания только этих двух свойств можно прекрасно отцентровать практически любой элемент на странице.
Источник записи: https://mediadoma.com