
.flip a:hover {text-decoration:none;}

.card-flip {
  -webkit-perspective: 1000px;
          perspective: 1000px;
		  margin-bottom:8px;
		  -webkit-animation-name: spinner; 
    -webkit-animation-timing-function: linear; 
    -webkit-animation-iteration-count: infinite; 
    -webkit-animation-duration: 8s; 
    animation-name: spinner; 
    animation-timing-function: linear; 
    animation-iteration-count: infinite; 
    animation-duration: 8s; 
    -webkit-transform-style: preserve-3d; 
    -moz-transform-style: preserve-3d; 
    -ms-transform-style: preserve-3d; 
    transform-style: preserve-3d;
}
.card-flip:hover {animation-iteration-count: 0;-webkit-animation-iteration-count: 0;-webkit-transform: rotateY(-360deg);
          transform: rotateY(-360deg);}

.card-flip:hover .flip, .card-flip.hover .flip {
  -webkit-transform: rotateY(180deg);
          transform: rotateY(180deg);
}

.card-flip,
.front,
.back {
  width: 100%;border-radius: 10px 10px 10px 10px;
-moz-border-radius: 10px 10px 10px 10px; text-align:center;
-webkit-border-radius: 10px 10px 10px 10px; background:#fff; height:110px; display:block;box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.2);
}

.card-flip2 {
  -webkit-perspective: 1000px;
          perspective: 1000px;
		  margin-bottom:8px;
}
.card-flip2:hover .flip, .card-flip2.hover .flip {
  -webkit-transform: rotateY(180deg);
          transform: rotateY(180deg);
}

.card-flip2,
.front,
.back {
  width: 100%;border-radius: 10px 10px 10px 10px;
-moz-border-radius: 10px 10px 10px 10px; text-align:center;
-webkit-border-radius: 10px 10px 10px 10px; background:#fff; height:110px; display:block;box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.2);
}



.front img {border-radius: 10px 10px 10px 10px;
-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px; height:110px;}

.flip {
  -webkit-transition: 0.6s;
  transition: 0.6s;
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  position: relative;
}

.front,
.back {
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  position: absolute;
  top: 0;
  left: 0;
}

.front {
  z-index: 2;
  -webkit-transform: rotateY(0deg);
          transform: rotateY(0deg);
}

.back {
  -webkit-transform: rotateY(180deg);
          transform: rotateY(180deg);
}

.card-primary {border-bottom:2px solid #fa7e0a;}

 /* WebKit and Opera browsers */ @-webkit-keyframes spinner { 
    from 
    { 
        -webkit-transform: rotateY(0deg); 
    } 
    to { 
        -webkit-transform: rotateY(-360deg); 
    } 
} /* all other browsers */ 
@keyframes spinner { 
    from { 
        -moz-transform: rotateY(0deg); 
        -ms-transform: rotateY(0deg); 
        transform: rotateY(0deg); 
    } 
    to 
    { 
        -moz-transform: rotateY(-360deg); 
        -ms-transform: rotateY(-360deg); 
        transform: rotateY(-360deg); 
    
    } 
}