/*

Captions Markup Pattern & Explanation

data-effeckt-type = 
"<quarter-appear | quarter-slide-up | quarter-slide-side | quarter-fall-in |
quarter-two-step | quarter-zoom | cover-fade | cover-push-right | revolving-door-left |
revolving-door-right | revolving-door-top | revolving-door-bottom | cover-slide-top |
offset | guillotine-reverse | half-slide | sqkwoosh | tunnel>"

<figure class="effeckt-caption" data-effeckt-type="">
  <img src="" alt="">
  <figcaption>
    <div class="effeckt-figcaption-wrap"></div>
  </figcaption>
</figure>

*/
.effeckt-caption {
  position: relative; }
  .effeckt-caption img {
    transition: 500ms; }
  .effeckt-caption figcaption {
    position: absolute;
    transition: 500ms;
    width: 100%; }
  .effeckt-caption[data-effeckt-type="quarter-appear"] figcaption {
    bottom: 0;
    left: 0;
    opacity: 0; }
  .effeckt-caption[data-effeckt-type="quarter-appear"]:hover figcaption, .effeckt-caption[data-effeckt-type="quarter-appear"]:active figcaption, .effeckt-caption[data-effeckt-type="quarter-appear"].active figcaption {
    opacity: 1; }
  .effeckt-caption[data-effeckt-type="quarter-slide-up"] figcaption {
    bottom: 0;
    left: 0;
    opacity: 0;
    -webkit-transform: translateY(100%);
        -ms-transform: translateY(100%);
            transform: translateY(100%); }
  .effeckt-caption[data-effeckt-type="quarter-slide-up"]:hover figcaption, .effeckt-caption[data-effeckt-type="quarter-slide-up"]:active figcaption, .effeckt-caption[data-effeckt-type="quarter-slide-up"].active figcaption {
    opacity: 1;
    -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
            transform: translateY(0); }
  .effeckt-caption[data-effeckt-type="sqkwoosh"] figcaption {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transition: none;
    z-index: 0; }
  .effeckt-caption[data-effeckt-type="sqkwoosh"] img {
    position: relative;
    z-index: 1;
    transition-delay: 0.25s; }
  .effeckt-caption[data-effeckt-type="sqkwoosh"] .effeckt-figcaption-wrap {
    position: absolute;
    bottom: 1rem;
    opacity: 0;
    transition: opacity 0.25s linear 0s; }
  .effeckt-caption[data-effeckt-type="sqkwoosh"]:hover .effeckt-figcaption-wrap, .effeckt-caption[data-effeckt-type="sqkwoosh"]:active .effeckt-figcaption-wrap, .effeckt-caption[data-effeckt-type="sqkwoosh"].active .effeckt-figcaption-wrap {
    opacity: 1;
    transition-delay: 0.25s; }
  .effeckt-caption[data-effeckt-type="sqkwoosh"]:hover img, .effeckt-caption[data-effeckt-type="sqkwoosh"]:active img, .effeckt-caption[data-effeckt-type="sqkwoosh"].active img {
    -webkit-transform: scale(0.5) translateY(-80px);
        -ms-transform: scale(0.5) translateY(-80px);
            transform: scale(0.5) translateY(-80px);
    transition-delay: 0; }
  .effeckt-caption[data-effeckt-type="quarter-slide-side"] figcaption {
    left: 0;
    bottom: 0;
    opacity: 0;
    -webkit-transform: translateX(100%);
        -ms-transform: translateX(100%);
            transform: translateX(100%); }
  .effeckt-caption[data-effeckt-type="quarter-slide-side"]:hover figcaption, .effeckt-caption[data-effeckt-type="quarter-slide-side"]:active figcaption, .effeckt-caption[data-effeckt-type="quarter-slide-side"].active figcaption {
    opacity: 1;
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0); }
  .effeckt-caption[data-effeckt-type="cover-fade"] figcaption {
    top: 0;
    left: 0;
    height: 100%;
    opacity: 0; }
  .effeckt-caption[data-effeckt-type="cover-fade"]:hover figcaption, .effeckt-caption[data-effeckt-type="cover-fade"]:active figcaption, .effeckt-caption[data-effeckt-type="cover-fade"].active figcaption {
    opacity: 1; }
  .effeckt-caption[data-effeckt-type="quarter-fall-in"] figcaption {
    top: 0;
    left: 0;
    -webkit-transform: translateX(100%) rotate(20deg);
        -ms-transform: translateX(100%) rotate(20deg);
            transform: translateX(100%) rotate(20deg);
    opacity: 0; }
  .effeckt-caption[data-effeckt-type="quarter-fall-in"]:hover figcaption, .effeckt-caption[data-effeckt-type="quarter-fall-in"]:active figcaption, .effeckt-caption[data-effeckt-type="quarter-fall-in"].active figcaption {
    -webkit-transform: translateX(0) rotate(0deg);
        -ms-transform: translateX(0) rotate(0deg);
            transform: translateX(0) rotate(0deg);
    opacity: 1; }
  .effeckt-caption[data-effeckt-type="quarter-two-step"] figcaption {
    top: 0;
    left: 0;
    -webkit-transform: translateX(-100%);
        -ms-transform: translateX(-100%);
            transform: translateX(-100%);
    opacity: 0;
    z-index: 2; }
  .effeckt-caption[data-effeckt-type="quarter-two-step"] .effeckt-figcaption-wrap {
    transition: 500ms 250ms;
    -webkit-transform: translateX(200%);
        -ms-transform: translateX(200%);
            transform: translateX(200%); }
  .effeckt-caption[data-effeckt-type="quarter-two-step"]:hover figcaption, .effeckt-caption[data-effeckt-type="quarter-two-step"]:active figcaption, .effeckt-caption[data-effeckt-type="quarter-two-step"].active figcaption {
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0);
    opacity: 1; }
  .effeckt-caption[data-effeckt-type="quarter-two-step"]:hover .effeckt-figcaption-wrap, .effeckt-caption[data-effeckt-type="quarter-two-step"]:active .effeckt-figcaption-wrap, .effeckt-caption[data-effeckt-type="quarter-two-step"].active .effeckt-figcaption-wrap {
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0); }
  .effeckt-caption[data-effeckt-type="cover-push-right"] figcaption {
    top: 0;
    left: 0;
    height: 100%;
    -webkit-transform: translateX(-100%);
        -ms-transform: translateX(-100%);
            transform: translateX(-100%);
    opacity: 0; }
  .effeckt-caption[data-effeckt-type="cover-push-right"] img {
    transition: 500ms;
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0); }
  .effeckt-caption[data-effeckt-type="cover-push-right"]:hover figcaption, .effeckt-caption[data-effeckt-type="cover-push-right"]:active figcaption, .effeckt-caption[data-effeckt-type="cover-push-right"].active figcaption {
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0);
    opacity: 1; }
  .effeckt-caption[data-effeckt-type="cover-push-right"]:hover img, .effeckt-caption[data-effeckt-type="cover-push-right"]:active img, .effeckt-caption[data-effeckt-type="cover-push-right"].active img {
    -webkit-transform: translateX(100%);
        -ms-transform: translateX(100%);
            transform: translateX(100%); }
  .effeckt-caption[data-effeckt-type="cover-slide-top"] figcaption {
    top: 0;
    left: 0;
    height: 100%;
    -webkit-transform: translateY(-100%);
        -ms-transform: translateY(-100%);
            transform: translateY(-100%);
    opacity: 0; }
  .effeckt-caption[data-effeckt-type="cover-slide-top"] img {
    transition: 500ms; }
  .effeckt-caption[data-effeckt-type="cover-slide-top"]:hover figcaption, .effeckt-caption[data-effeckt-type="cover-slide-top"]:active figcaption, .effeckt-caption[data-effeckt-type="cover-slide-top"].active figcaption {
    -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
            transform: translateY(0);
    opacity: 1; }
  .effeckt-caption[data-effeckt-type="quarter-zoom"] figcaption {
    top: 0;
    left: 0;
    -webkit-transform: scale(2);
        -ms-transform: scale(2);
            transform: scale(2);
    text-align: center;
    opacity: 0; }
  .effeckt-caption[data-effeckt-type="quarter-zoom"] img {
    transition: 500ms; }
  .effeckt-caption[data-effeckt-type="quarter-zoom"]:hover figcaption, .effeckt-caption[data-effeckt-type="quarter-zoom"]:active figcaption, .effeckt-caption[data-effeckt-type="quarter-zoom"].active figcaption {
    -webkit-transform: scale(1);
        -ms-transform: scale(1);
            transform: scale(1);
    opacity: 1; }
  .effeckt-caption[data-effeckt-type="quarter-zoom"]:hover img, .effeckt-caption[data-effeckt-type="quarter-zoom"]:active img, .effeckt-caption[data-effeckt-type="quarter-zoom"].active img {
    -webkit-transform: scale(1.1);
        -ms-transform: scale(1.1);
            transform: scale(1.1); }
  .effeckt-caption[data-effeckt-type="revolving-door-left"] {
    overflow: visible; }
    .effeckt-caption[data-effeckt-type="revolving-door-left"] figcaption {
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      -webkit-transform: perspective(1300px) rotateY(180deg);
              transform: perspective(1300px) rotateY(180deg);
      -webkit-backface-visibility: hidden;
              backface-visibility: hidden; }
    .effeckt-caption[data-effeckt-type="revolving-door-left"] img {
      -webkit-transform: perspective(1300px);
              transform: perspective(1300px);
      transition: 500ms; }
    .effeckt-caption[data-effeckt-type="revolving-door-left"]:hover figcaption, .effeckt-caption[data-effeckt-type="revolving-door-left"]:active figcaption, .effeckt-caption[data-effeckt-type="revolving-door-left"].active figcaption {
      -webkit-transform: perspective(1300px) rotateY(0deg);
              transform: perspective(1300px) rotateY(0deg); }
    .effeckt-caption[data-effeckt-type="revolving-door-left"]:hover img, .effeckt-caption[data-effeckt-type="revolving-door-left"]:active img, .effeckt-caption[data-effeckt-type="revolving-door-left"].active img {
      -webkit-transform: perspective(1300px) rotateY(-180deg);
              transform: perspective(1300px) rotateY(-180deg); }
  .effeckt-caption[data-effeckt-type="revolving-door-right"] {
    overflow: visible; }
    .effeckt-caption[data-effeckt-type="revolving-door-right"] figcaption {
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      -webkit-transform: perspective(1300px) rotateY(180deg);
              transform: perspective(1300px) rotateY(180deg);
      -webkit-backface-visibility: hidden;
              backface-visibility: hidden; }
    .effeckt-caption[data-effeckt-type="revolving-door-right"] img {
      -webkit-transform: perspective(1300px);
              transform: perspective(1300px);
      transition: 500ms; }
    .effeckt-caption[data-effeckt-type="revolving-door-right"]:hover figcaption, .effeckt-caption[data-effeckt-type="revolving-door-right"]:active figcaption, .effeckt-caption[data-effeckt-type="revolving-door-right"].active figcaption {
      -webkit-transform: perspective(1300px) rotateY(360deg);
              transform: perspective(1300px) rotateY(360deg); }
    .effeckt-caption[data-effeckt-type="revolving-door-right"]:hover img, .effeckt-caption[data-effeckt-type="revolving-door-right"]:active img, .effeckt-caption[data-effeckt-type="revolving-door-right"].active img {
      -webkit-transform: perspective(1300px) rotateY(180deg);
              transform: perspective(1300px) rotateY(180deg); }
  .effeckt-caption[data-effeckt-type="revolving-door-top"] {
    overflow: visible; }
    .effeckt-caption[data-effeckt-type="revolving-door-top"] figcaption {
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      -webkit-transform: perspective(1300px) rotateX(180deg);
              transform: perspective(1300px) rotateX(180deg);
      -webkit-backface-visibility: hidden;
              backface-visibility: hidden; }
    .effeckt-caption[data-effeckt-type="revolving-door-top"] img {
      -webkit-transform: perspective(1300px);
              transform: perspective(1300px);
      transition: 500ms; }
    .effeckt-caption[data-effeckt-type="revolving-door-top"]:hover figcaption, .effeckt-caption[data-effeckt-type="revolving-door-top"]:active figcaption, .effeckt-caption[data-effeckt-type="revolving-door-top"].active figcaption {
      -webkit-transform: perspective(1300px) rotateX(360deg);
              transform: perspective(1300px) rotateX(360deg); }
    .effeckt-caption[data-effeckt-type="revolving-door-top"]:hover img, .effeckt-caption[data-effeckt-type="revolving-door-top"]:active img, .effeckt-caption[data-effeckt-type="revolving-door-top"].active img {
      -webkit-transform: perspective(1300px) rotateX(180deg);
              transform: perspective(1300px) rotateX(180deg); }
  .effeckt-caption[data-effeckt-type="revolving-door-bottom"] {
    overflow: visible; }
    .effeckt-caption[data-effeckt-type="revolving-door-bottom"] figcaption {
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      -webkit-transform: perspective(1300px) rotateX(180deg);
              transform: perspective(1300px) rotateX(180deg);
      -webkit-backface-visibility: hidden;
              backface-visibility: hidden; }
    .effeckt-caption[data-effeckt-type="revolving-door-bottom"] img {
      -webkit-transform: perspective(1300px);
              transform: perspective(1300px);
      transition: 500ms; }
    .effeckt-caption[data-effeckt-type="revolving-door-bottom"]:hover figcaption, .effeckt-caption[data-effeckt-type="revolving-door-bottom"]:active figcaption, .effeckt-caption[data-effeckt-type="revolving-door-bottom"].active figcaption {
      -webkit-transform: perspective(1300px) rotateX(0deg);
              transform: perspective(1300px) rotateX(0deg); }
    .effeckt-caption[data-effeckt-type="revolving-door-bottom"]:hover img, .effeckt-caption[data-effeckt-type="revolving-door-bottom"]:active img, .effeckt-caption[data-effeckt-type="revolving-door-bottom"].active img {
      -webkit-transform: perspective(1300px) rotateX(-180deg);
              transform: perspective(1300px) rotateX(-180deg); }
  .effeckt-caption[data-effeckt-type="offset"] {
    overflow: visible; }
    .effeckt-caption[data-effeckt-type="offset"] figcaption {
      top: 0;
      left: 0;
      text-align: center;
      opacity: 0;
      height: 100%; }
    .effeckt-caption[data-effeckt-type="offset"] img {
      transition: 500ms; }
    .effeckt-caption[data-effeckt-type="offset"]:hover figcaption, .effeckt-caption[data-effeckt-type="offset"]:active figcaption, .effeckt-caption[data-effeckt-type="offset"].active figcaption {
      -webkit-transform: translate(15px, 15px);
          -ms-transform: translate(15px, 15px);
              transform: translate(15px, 15px);
      opacity: 1;
      z-index: 100;
      overflow: hidden; }
  .effeckt-caption[data-effeckt-type="guillotine-reverse"] {
    overflow: visible; }
    .effeckt-caption[data-effeckt-type="guillotine-reverse"] figcaption {
      top: 0;
      left: 0;
      text-align: center;
      height: 100%; }
    .effeckt-caption[data-effeckt-type="guillotine-reverse"] img {
      display: block;
      position: relative;
      z-index: 10;
      transition: 500ms; }
    .effeckt-caption[data-effeckt-type="guillotine-reverse"]:hover img, .effeckt-caption[data-effeckt-type="guillotine-reverse"]:active img, .effeckt-caption[data-effeckt-type="guillotine-reverse"].active img {
      -webkit-transform: translateY(-100%);
          -ms-transform: translateY(-100%);
              transform: translateY(-100%); }
  .effeckt-caption[data-effeckt-type="half-slide"] figcaption {
    top: 0;
    left: 0;
    text-align: center;
    height: 100%;
    -webkit-transform: translateY(100%);
        -ms-transform: translateY(100%);
            transform: translateY(100%); }
  .effeckt-caption[data-effeckt-type="half-slide"] img {
    display: block;
    position: relative;
    transition: 500ms; }
  .effeckt-caption[data-effeckt-type="half-slide"]:hover img, .effeckt-caption[data-effeckt-type="half-slide"]:active img, .effeckt-caption[data-effeckt-type="half-slide"].active img {
    -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
            transform: translateY(-50%); }
  .effeckt-caption[data-effeckt-type="half-slide"]:hover figcaption, .effeckt-caption[data-effeckt-type="half-slide"]:active figcaption, .effeckt-caption[data-effeckt-type="half-slide"].active figcaption {
    -webkit-transform: translateY(50%);
        -ms-transform: translateY(50%);
            transform: translateY(50%); }
  .effeckt-caption[data-effeckt-type="tunnel"] figcaption {
    top: 0;
    left: 0;
    text-align: center;
    height: 100%;
    opacity: 0;
    -webkit-transform: scale(0.7);
        -ms-transform: scale(0.7);
            transform: scale(0.7); }
  .effeckt-caption[data-effeckt-type="tunnel"] img {
    display: block;
    position: relative;
    z-index: 10;
    transition: 500ms; }
  .effeckt-caption[data-effeckt-type="tunnel"]:hover img, .effeckt-caption[data-effeckt-type="tunnel"]:active img, .effeckt-caption[data-effeckt-type="tunnel"].active img {
    -webkit-transform: scale(0.4);
        -ms-transform: scale(0.4);
            transform: scale(0.4); }
  .effeckt-caption[data-effeckt-type="tunnel"]:hover figcaption, .effeckt-caption[data-effeckt-type="tunnel"]:active figcaption, .effeckt-caption[data-effeckt-type="tunnel"].active figcaption {
    opacity: 1;
    -webkit-transform: scale(1);
        -ms-transform: scale(1);
            transform: scale(1); }
