@import "settings";

video {
  width: 100%;
}

.media-wrapper {
  position: relative;

  // Proper spacing between instances of .media
  margin-top: 15px;

  &:first-of-type {
    margin-top: 0;
  }

}

.media {
  display: flex;
  align-items: flex-start;
}

.media-body {
  flex: 1;
  min-width: 85px; // IE11 fix, if the block are in table
}

.media-object {
  display: block;
}

.media-right,
.media > .pull-right {
  padding-left: 8px;

  @include for-tablet-portrait-up {
    padding-left: 20px;
  }

}

.media-left,
.media > .pull-left {
  padding-right: 8px;

  @include for-tablet-portrait-up {
    padding-right: 20px;
  }

  [dir='rtl'] & {
    padding-right: 0;
    padding-left: 8px;

    @include for-tablet-portrait-up {
      padding-right: 0;
      padding-left: 20px;
    }
  }

}

// vertically centering the content
.media-middle {
  align-items: center;
}

// align the content vertically at bottom
.media-bottom {
  align-items: flex-end;
}

// Reset margins on headings for tighter default spacing
.media-heading {
  margin-top: 0;
  margin-bottom: 5px;

  // added padding for .btn-group
  padding-right: 40px;

  [dir='rtl'] & {
    padding-right: 0;
    padding-left: 40px;
  }

  p {
    margin: 0;
  }

}

// Media list variation
//
// Undo default ul/ol styles
.media-list {
  padding-left: 0;
  list-style: none;
}
