@import "colors"
@import "breakpoint-helpers"


.row

.top_buffer
  margin-bottom: 10px


.wide
  width: auto
  border-radius: 5px
  background-color: $colorblind-item
  position: relative
  background-clip: content-box

  .image
    border-color: $colorblind-button-active


.tall
  width: auto
  border-radius: 5px
  background-color: $colorblind-item
  background-clip: content-box


  .image
    border-color: $colorblind-button-active

  .description
    text-align: center



@include respond-above(md)
  .wide

    .image
      width: 75%
      float: left
      border-style: none solid none none


    .description
      margin-left: 76%
      text-align: left

  .tall

    .image
      border-style: none none solid

    .description
      text-align: center


@include respond-below(md)
  .wide

    .image
      border-style: none none solid

      img
        width: 100%
        height: auto

  .tall

    .image
      border-style: none none solid

    .description
      text-align: center