.flp-wrap{box-sizing:border-box;background-repeat:no-repeat;position:relative;height:250px;max-width:320px;top:0;-webkit-perspective:600px;perspective:600px;cursor:pointer;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;margin:30px auto}
.flp-cover,.flp-cover-clone,.flp-inside,.flp-inside-clone{position:absolute;left:0;top:0;width:50%;height:100%;transition:all .5s;overflow:hidden}
.flp-icon,.flp-wrap div h3,.flp-wrap div p{position:absolute;text-align:center;width:200%}
.flp-wrap div h3{left:0;top:115px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:20px;padding:0 10%}
.flp-wrap div p{left:0;padding:0 10%;line-height:18px;font-size:13px;top:125px}
.flp-cover-clone,.flp-inside-clone{left:auto;right:0}
.flp-icon{top:40px;left:0;color:#18bc9c}
.flp-icon img{-webkit-filter:grayscale(100%);filter:grayscale(100%)}
.flp-icon i{margin:8px}
.flp-inside .flp-icon,.flp-inside-clone .flp-icon{color:#fff}
.flp-inside .flp-icon img,.flp-inside-clone .flp-icon img{-webkit-filter:grayscale(0);filter:grayscale(0)}
.flp-icon img.img-circle{height:80px;width:80px;border-radius:50%;background-size:cover;background-repeat:no-repeat;background-position:center center;border:4px solid #eee;box-shadow:0 3px 2px rgba(0,0,0,.3)}
.flp-cover,.flp-cover-clone{color:#000;background-color:#fff;z-index:10}
.flp-wrap .flp-cover h3,.flp-wrap .flp-cover-clone h3{color:#f5b062}
.flp-inside,.flp-inside-clone{background-color:#969696;z-index:9;color:#fff}
.flp-wrap .flp-inside h3,.flp-wrap .flp-inside-clone h3,.flp-wrap a{color:#f5b062}
.flp-wrap a{text-decoration:none}
.flp-wrap>.flp-cover-clone,.flp-wrap>.flp-inside-clone{background-position:right -30px}
.frm-right>.flp-cover-clone,.frm-right>.flp-inside{-webkit-backface-visibility:hidden;backface-visibility:hidden;-webkit-transform-style:preserve-3d;transform-style:preserve-3d;-webkit-transform-origin:0;-ms-transform-origin:0;transform-origin:0;-webkit-transform:rotateY(0);transform:rotateY(0)}
.frm-right.hover>.flp-cover-clone{-webkit-transform:rotateY(-45deg);transform:rotateY(-45deg);background-color:#f2f2f2}
.frm-right>.flp-inside{-webkit-transform-origin:right;-ms-transform-origin:right;transform-origin:right;-webkit-transform:rotateY(180deg);transform:rotateY(180deg)}
.frm-right.active>.flp-cover-clone,.frm-right.hover.active>.flp-cover-clone{-webkit-transform:rotateY(-180deg);transform:rotateY(-180deg)}
.frm-right.active>.flp-inside{-webkit-transform:rotateY(0);transform:rotateY(0)}
.frm-left>.flp-cover,.frm-left>.flp-inside-clone{-webkit-backface-visibility:hidden;backface-visibility:hidden;-webkit-transform-style:preserve-3d;transform-style:preserve-3d;-webkit-transform-origin:100%;-ms-transform-origin:100%;transform-origin:100%;-webkit-transform:rotateY(0);transform:rotateY(0)}
.frm-left.hover>.flp-cover{-webkit-transform:rotateY(45deg);transform:rotateY(45deg);background-color:#f2f2f2}
.frm-left>.flp-inside-clone{-webkit-transform-origin:0;-ms-transform-origin:0;transform-origin:0;-webkit-transform:rotateY(-180deg);transform:rotateY(-180deg)}
.frm-left.active>.flp-cover,.frm-left.hover.active>.flp-cover{-webkit-transform:rotateY(180deg);transform:rotateY(180deg)}
.frm-left.active>.flp-inside-clone{-webkit-transform:rotateY(0);transform:rotateY(0)}
.active .flp-inside,.active .flp-inside-clone{z-index:11}
.flp-cover-clone .flp-icon,.flp-inside-clone .flp-icon,.flp-wrap div.flp-cover-clone h3,.flp-wrap div.flp-cover-clone p,.flp-wrap div.flp-inside-clone h3,.flp-wrap div.flp-inside-clone p{left:auto;right:0}
.flp-wrap div.flp-inside h3,.flp-wrap div.flp-inside-clone h3{top:115px}