.media .lightbox-view,
.media .lightbox-window {
  cursor: pointer;
}

.media {
  padding-top: 0;
  padding-left: 0;
  padding-right: 0;
  box-sizing: border-box;
  editor.focus {
    z-index: 221;
  }
  [contenteditable] {
    background: transparent;
    p,
    h1,
    h2,
    h3,
    h4,
    h5 {
      padding-left: 10px;
      padding-right: 10px;
    }
    p {
      margin-top: 9px;
      margin-bottom: 9px;
    }
    cursor: inherit !important;
  }

  i.close {
    position: absolute;
    right: 7px;
    top: 5px;
    background-size: 60%;
    z-index: 200;
  }
  .icons-view i.close {
    right: 11px;
  }
  img {
    width: 100%;
    max-height: 100%;
  }
  lightbox img {
    width: auto;
  }
  audio {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -150px;
    margin-top: -15px;
  }
  .media-wrapper {
    padding: 7px;
    min-height: 100%;
    position: relative;
    box-sizing: border-box;
    .media-container {
      min-height: 40px;
      position: relative;
      float: left;
      width: 100%;
    }
  }

  .image-container {
    max-height: 100%;
    overflow: hidden !important;
  }

  .text-wrapper {
    min-height: 100%;
    p,
    h1,
    h2,
    h3 {
      padding: 7px;
      margin: 0;
    }
  }

  .media-container {
    overflow: visible;
  }
}

.media sniplet {
  img {
    width: auto;
  }
}

.media.cell {
  background: transparent;
}

.media-container.pink {
  @include run-transition(background);
}
.media-container.purple {
  @include run-transition(background);
}
.media-container.orange {
  @include run-transition(background);
}
.media-container.white {
  @include run-transition(background);
}
.media-container.green {
  @include run-transition(background);
}
.media-container.blue {
  @include run-transition(background);
}
.media-container.black {
  @include run-transition(background);
}

.media.height-one,
.media.height-two,
.media.height-three,
.media.height-four,
.media.height-five,
.media.height-six,
.media.height-seven,
.media.height-eight,
.media.height-nine,
.media.height-ten,
.media.height-eleven,
.media.height-twelve {
  .media-wrapper {
    @include absolute;
    .media-container {
      overflow-y: auto;
      height: 100%;
      iframe {
        height: 100%;
        width: 100%;
        min-height: 0;
        position: absolute;
      }
    }
  }
}
