Viewer-3.scss

@import 'utils';

.viewer {
  height: 100%;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  img {
    display: block;
    width: auto;
    max-width: calc(100% - 10rem);
    max-height: calc(100% - 10rem);
    cursor: pointer;
    transition: all 0.3s ease-in;
    box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
    &:hover {
      box-shadow: 0 19px 38px rgba(0,0,0,0.30), 0 15px 12px rgba(0,0,0,0.22);
    }
  }
  iframe {
    background: black;
    box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
    width: calc(100% - 10rem);
    height: calc(100% - 10rem);
  }
}