card-wizard.scss

.uic-wrapper{
  perspective: 500px;
  perspective-origin: 50% -30%;
  
  ul{
    li{
      .cards-wrapper{
        .card-front{
          position: relative;
          z-index: 3;
        }
        .card-middle{
          z-index: 2;
        }
        .card-back{
          z-index: 1;
        }
        .card-out{
          z-index: 0;
          opacity: 0;
        }
      }
    }
  }

  nav{
    position: relative;
    z-index: 4;

    .btn-back{
      top: 20px;
      left: 20px;
    }
    .btn-finish,
    .btn-next{
      position: absolute;
      bottom: 10px; left: 10px; right: 10px;
     
    }
  }

  .noBack{
    padding: 20px;
  }

  .toRight{
    transform: translate3d(0,0,100px);
    opacity: 0;
  }

  .toLeft{
    transform: none;
    opacity: 1;
  }

  &:hover{
    .card-middle{
      transform: translate3d(0, 0, -60px);
      opacity: .8;
    }
  
    .card-back{
      transform: translate3d(0, 0, -120px);
      opacity: .4;
    }
  }

}