// alter file form group
.upload.upload-images {
  // alter row heights
  > div {
    height : ($spacer * 10);

    // set height of card
    > .card {
      height   : 100%;
      position : relative;

      // set background position
      background-size     : contain;
      background-repeat   : no-repeat;
      background-position : center;

      // alter remove
      .btn.btn-danger {
        top      : ($spacer / 2);
        right    : ($spacer / 2);
        padding  : ($spacer / 2);
        position : absolute;
      }

      // alter remove
      .btn-group {
        top      : ($spacer / 2);
        left     : ($spacer / 2);
        padding  : ($spacer / 2);
        position : absolute;
      }

      // alter input
      .file-input {
        top      : 0;
        left     : 0;
        width    : 100%;
        height   : 100%;
        opacity  : 0;
        position : absolute;
      }

      // alter icon
      .fa {
        display : block;
      }

      // alter div
      > div:not(.progress) {
        width  : 100%;
        height : 100%;

        // alter inner div (vertical center aligned)
        > div {
          width      : 100%;
          text-align : center;
        }
      }

      // alter img
      img {
        width      : auto;
        height     : auto;
        max-width  : 100%;
        max-height : 100%;
      }

      // alter grayscale (for uploading)
      .progress {
        left     : ($spacer / 2);
        right    : ($spacer / 2);
        bottom   : ($spacer / 2);
        position : absolute;
      }
    }
  }

  .name {
    left       : $spacer;
    right      : $spacer;
    bottom     : $spacer;
    display    : block;
    position   : absolute;
    text-align : center;
  }
}