@import "../../themes/ionic.globals";
@import "../../animations/zoom.scss";
@import "../../animations/fade.scss";

.vm-preview-image.preview-image {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: $z-index-overlay + $z-index-overlay-modal;
  display: block;
  background: #000;
  transition: all ease 300ms;
  
  .preview-image-inner {
    width: 100%;
    height: 100%;
    .slides {
      width: 100%;
      height: 100%;
      .slide {
        width: 100%;
        height: 100%;
      }
    }
    
    .slide {
      display: flex;
      align-items: center;
      justify-content: center;
      img {
        width: 100%;
      }
    }
    
    .info {
      position: fixed;
      bottom: 0;
      z-index: 10;
      width: 100%;
      padding: 20px 0;
      margin: 0;
      font-weight: bold;
      color: #fff;
      text-align: center;
      background: rgba(0, 0, 0, 0.7);
    }
  }
}