<!DOCTYPE html>
<html>
<head>
<style>
body {
margin: 0;
font: 14px Helvetica, Arial, serif;
}
.title {
text-align: center;
color: #333;
font-size: 1.6em;
}
.flip-menu {
margin: 30px 0 0;
}
.flip-item-wrap {
width: 25%;
height: auto;
float: left;
position: relative;
-webkit-perspective: 800px;
-moz-perspective: 800px;
-ms-perspective: 800px;
-o-perspective: 800px;
perspective: 800px;
}
@media screen and (min-width: 1280px) {
.flip-item-wrap {
width: 16.6%;
}
}
@media screen and (max-width: 979px) {
.flip-item-wrap {
width: 33.3%;
}