.flip-container {
  position:absolute;
  left:50%;
  top:50%;
  margin-top:-100px;
  margin-left:-100px;
  -webkit-perspective:1200;
  -moz-perspective:1200;
  perspective:1200;
}
.flip-container:hover .creation {
  -webkit-transform:rotateY(180deg);
  -moz-transform:rotateY(180deg);
 
}
.creation {
  width: 150px;
  height: 150px;
  /* float:left; */
  -webkit-transition:all 0.6s;
  -moz-transition:all 0.6s;
  transition:all 0.6s;
  -webkit-transform-style:preserve-3d;
  -moz-transform-style:preserve-3d;
  transform-style:preserve-3d;
}
.front, .back {
  position:absolute;
  top:0;
  left::0;
  -webkit-backface-visibility:hidden;
  -moz-backface-visibility:hidden;
  backface-visibility:hidden;
}
.back {
  z-index:800;
  -webkit-transform:rotateY(-180deg);
  -moz-transform:rotateY(-180deg);
  transform:rotateY(-180deg);
  
}
.creation p {
  color:#fff;
  display:block;
  width:auto;
  text-align:center;
  line-height:135px;
  margin:0 30px;
   font-size:24px;
  /*text-transform:uppercase;
  /* text-shadow:1px 1px 1px #999; */
  font-family:'lato', helvetica;
}
.creation p span {
  vertical-align:middle;
  display:inline-block;
  line-height:1.4;
  width:auto;
}
.cont {
  border-radius:50%;
  background-color:#C0504C;
  width: 150px;#6E3158
  height: 150px;
  display:inline-block;
  border: 2px solid #f5f5f5;
  color:#FFF;
}