.box{list-style:none;display:block;text-align:center;width:100%;margin:0;padding:0}.box i{padding-right:5px}.box >li{width:220px;height:220px;display:inline-block;margin:8px}.front,.back{font-family:"Open Sans",sans-serif;float:left;width:220px;height:220px;background:#F2F2F2;-webkit-border-radius:100%;-moz-border-radius:100%;border-radius:100%;-webkit-box-shadow:0 0 3px 0 #e3dfd6;box-shadow:0 0 3px 0 #e3dfd6;-webkit-transition:all .3s ease-in-out;-moz-transition:all .3s ease-in-out;-o-transition:all .3s ease-in-out;-ms-transition:all .3s ease-in-out;transition:all .3s ease-in-out}.color-1 .bg,.color-1 .choose span{background:#2cbae8}.color-1 .title,.color-1 .price{color:#2cbae8}.color-1 .choose span{-webkit-box-shadow:0 2px 0 0 #3495b5;box-shadow:0 2px 0 0 #3495b5}.color-2 .bg,.color-2 .choose span{background:#e7b148}.color-2 .title,.color-2 .price,.color-2 .popular{color:#e7b148}.color-2 .choose span{-webkit-box-shadow:0 2px 0 0 #c4963d;box-shadow:0 2px 0 0 #c4963d}.color-3 .bg,.color-3 .choose span{background:#e96b5d}.color-3 .title,.color-3 .price{color:#e96b5d}.color-3 .choose span{-webkit-box-shadow:0 2px 0 0 #be4b3e;box-shadow:0 2px 0 0 #be4b3e}.color-4 .bg,.color-4 .choose span{background:#63cac9}.color-4 .title,.color-4 .price{color:#63cac9}.color-4 .choose span{-webkit-box-shadow:0 2px 0 0 #49a1a0;box-shadow:0 2px 0 0 #49a1a0}.front >div{text-align:center}.title{font-size:15px;text-transform:uppercase;text-align:center;padding:20px 10px 10px}.price span{vertical-align:top;line-height:0.7}.price span.currency{font-size:40px;font-weight:400}.price .total{font-size:80px;font-weight:700}.currency,.end{font-size:30px;font-weight:300}.description{text-align:center}.front .description{color:#999;font-size:13px;line-height:13px;padding:16px 30px 12px}.choose span{text-align:center;color:#fff;font-weight:bold;font-size:12px;line-height:12px;padding:6px 12px;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px}.back .title{color:#FFF}.back .description ul{width:70%;margin:auto}.back .description ul li{color:#FFF!important;text-align:center;list-style:none;line-height:1.4}.popular{font-size:30px;position:absolute;left:0;top:0;opacity:0}.circle{border-radius:50%;position:relative;-webkit-transition:all .4s ease-in-out;-moz-transition:all .4s ease-in-out;-o-transition:all .4s ease-in-out;-ms-transition:all .4s ease-in-out;transition:all .4s ease-in-out}.info{position:absolute;border-radius:50%;opacity:0;-moz-transform:scale(0) rotate(0deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);-webkit-transform:scale(0) rotate(0deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);-o-transform:scale(0) rotate(0deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);-ms-transform:scale(0) rotate(0deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);transform:scale(0) rotate(0deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);-webkit-backface-visibility:hidden}.circle:hover .front{-moz-transform:scale(1.1);-webkit-transform:scale(1.1);-o-transform:scale(1.1);-ms-transform:scale(1.1);transform:scale(1.1);opacity:1}.circle:hover .info{-moz-transform:scale(1) rotate(360deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);-webkit-transform:scale(1) rotate(360deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);-o-transform:scale(1) rotate(360deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);-ms-transform:scale(1) rotate(360deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);transform:scale(1) rotate(360deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);opacity:1}.circle:hover .front-popular{border-radius:10% 50% 50% 50%!important}.circle:hover .popular{opacity:1;animation:popularAnim 1s 1;-webkit-animation:popularAnim 1s 1}@keyframes popularAnim{from{opacity:0;left:40px}to{opacity:1;left:0}}@-webkit-keyframes popularAnim {from{opacity:0;left:40px}to{opacity:1;left:0}}