.k1-modal-js {
  position: fixed;
  inset: 0;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 2rem;
  background-color: rgba(4, 46, 101, 0.95);
  opacity: 0;

  &.opened {
    display: flex;
    opacity: 1;
    z-index: 10150;

  }

  & .k1-modal-js__body {
    position: relative;
    background-color: #fff;
    color: #01173e;

    width: max-content;
    height: max-content;

    & img {
      display: block;
      height: 100%;
      max-height: calc(100vh - 8rem);
    }
  }

  & .k1-modal-js__link {
    margin: 0.5rem 0;
    color: #008dcc;
    text-align: center;
    text-decoration: underline;
    display: block;
  }

  & .k1-modal-js__close {
    position: absolute;
    top: 1rem;
    right: 1rem;
    width: 20px;
    height: 20px;
    transition: transform .3s linear;
    transform-origin: center;

    &:hover {
      cursor: pointer;
      transform: rotate(90deg);

      & span {
      }
    }

    & span {
      width: 20px;
      height: 2px;
      display: block;
      background-color: white;
      transform-origin: center;
      position: absolute;
      left: 0;
      top: calc(50% - 1px);
      transition: background-color .3s linear;

      &:first-child {
        transform: rotate(45deg)
      }

      &:last-child {
        transform: rotate(-45deg)
      }
    }
  }

}