
.x-editing .parent-section-one { margin-top: 60px; position: relative; }
.x-editing .parent-section-one:after { content: 'Section one'; position: absolute; top: -55px; left: 0; right: 0; padding: 20px; background: #0D2D60; color: #FFFFFF; font-size: 20px;  } 
.x-editing .parent-section-two { margin-top: 60px; position: relative; }
.x-editing .parent-section-two:after { content: 'Section two'; position: absolute; top: -55px; left: 0; right: 0; padding: 20px; background: #0D2D60; color: #FFFFFF; font-size: 20px;  } 
.x-editing .parent-section-three { margin-top: 60px; position: relative; }
.x-editing .parent-section-three:after { content: 'Section three'; position: absolute; top: -55px; left: 0; right: 0; padding: 20px; background: #0D2D60; color: #FFFFFF; font-size: 20px;  } 
.x-editing .items-wrap .repeating:nth-child(3n + 1) { margin-left:0px; }
.x-editing .items-wrap .repeating { float: left; margin-left: 20px; }

.x-editing .parent .flip-item .front-flip, .x-editing .parent .flip-item .back-flip {
  position: relative;
}
.x-editing .parent .repeating { height: 440px; }
.x-editing .parent .flip-item {
  height: 440px !important;
  cursor: default;
}
.x-editing .parent .flip-item {
  height: 440px !important;
}
.x-editing .parent .flip-item .back-flip {
  transform: rotateY(0deg);
  -webkit-transform: rotateY(0deg);
}
.x-editing .parent .repeating:hover .flip-item {
  transform: rotateY(0deg);
  -webkit-transform: rotateY(0deg);
}
.x-editing .parent .repeating:hover .flip-item .front-flip {
  opacity: 1.0;
  transition: 0.6s;
}





/*.items-wrap .repeating:nth-child(3n + 1) { margin-left:0px; }*/
.items-wrap .repeating { /*float: left; margin-left: 20px;*/ width: 300px; height: 220px; overflow: hidden;  }
.items-wrap .repeating .front-flip { width: 300px; height: 220px; overflow: hidden; }
.items-wrap .repeating .back-flip { width: 300px; height: 220px; overflow: hidden; padding: 20px 20px 5px 20px; }

.items-wrap {
  position: relative;
  -webkit-perspective: 1000;
  -moz-perspective: 1000;
  perspective: 1000;
}
.items-wrap .flip-item {
  width: 300px;
  height: 220px;
  cursor: pointer;
  
  -webkit-transition: 0.6s;
      -webkit-transform-style: preserve-3d;

      -moz-transition: 0.6s;
      -moz-transform-style: preserve-3d;

      transition: 0.6s;
      transform-style: preserve-3d;

      position: relative;
}
.items-wrap .flip-item .front-flip, .items-wrap .flip-item .back-flip {
  -webkit-backface-visibility: hidden;
      -moz-backface-visibility: hidden;
      backface-visibility: hidden;

      position: absolute;
      top: 0;
      left: 0;
}
.items-wrap .flip-item .front-flip {
  z-index: 2;
  transition: 0.6s;
}
.items-wrap .flip-item .back-flip {
  -webkit-transform: rotateY(180deg);
        -moz-transform: rotateY(180deg);
        transform: rotateY(180deg);
        filter: FlipH;
          -ms-filter: "FlipH";
  
}

.hover-flip {
  transform: rotateY(180deg);
  -webkit-transform: rotateY(180deg);
}
.hover-flip-opacity {
  opacity: 0.0;
  transition: 0.6s;
}
/*.items-wrap .repeating:hover .flip-item {
  transform: rotateY(180deg);
  -webkit-transform: rotateY(180deg);
}*/
/*.items-wrap .repeating:hover .flip-item .front-flip {*/
/*  opacity: 0.0;*/
/*  transition: 0.6s;*/
/*}*/

/* isotope css */
.isotope-item {
  z-index: 2;
}
.isotope-hidden.isotope-item {
  pointer-events: none;
  z-index: 1;
}

/* MEDIA QUERY */
@media handheld, only screen and (max-width:767px) {
  .items-wrap {
    max-width: 320px;
    float: none;
    margin: 0 auto;
  }
}
/*ISOTOP ANIMATION*/
.isotope,
.isotope .isotope-item {
  /* change duration value to whatever you like */
  -webkit-transition-duration: 0.8s;
     -moz-transition-duration: 0.8s;
      -ms-transition-duration: 0.8s;
       -o-transition-duration: 0.8s;
          transition-duration: 0.8s;
}

.isotope {
  -webkit-transition-property: height, width;
     -moz-transition-property: height, width;
      -ms-transition-property: height, width;
       -o-transition-property: height, width;
          transition-property: height, width;
}

.isotope .isotope-item {
  -webkit-transition-property: -webkit-transform, opacity;
     -moz-transition-property:    -moz-transform, opacity;
      -ms-transition-property:     -ms-transform, opacity;
       -o-transition-property:      -o-transform, opacity;
          transition-property:         transform, opacity;
}
