.image-name-input
  font-size: 16px
  padding: 10px 15px
  display: inline-block
  margin-bottom: 10px
  border: 1px solid $border
  outline: none
  width: 100%
  color: $color
  margin: 5px 0 10px 0
  background: $white
  border-radius: 4px

.images-buttons-container
  margin: 10px 0 0 0
  display: inline-block
  width: 100%

  .w300
    width: 300px
    float: right

.image-build-log
  background: $black
  color: #f8f8f2
  font-size: 12px
  margin: 0
  border-radius: 4px
  height: 600px

.remove-image
  position: relative

  .ionicon
    position: absolute
    top: 0px
    right: 0px

.image-builder-box
  background: transparent
  border: none
  padding: 10px

  p
    margin: 0 0 20px 0

  h1
    margin-bottom: 20px
    font-weight: $weight-semibold

  h2
    color: $black
    font-size: 15px

  .image-builder-box-header
    padding: 15px 20px
    border-bottom: 1px solid $border

    h2
      color: $color-secondary
      font-size: 18px

  .image-item
    display: inline-block
    width: 100%
    height: 410px
    padding: 10px
    background: $white
    border: 1px solid $border

    h2
      font-size: 20px
      font-weight: $weight-semibold
      text-align: center

    span
      width: 100%
      height: 30px
      font-size: 14px
      display: flex
      align-items: center
      justify-content: center

      &.time
        color: $color-secondary

      &.size
        font-weight: $weight-semibold

    .docker-img
      display: block
      width: 260px
      margin: 15px auto

    .button
      margin: 10px 0

  .base-image-item
    display: inline-block
    width: 100%
    height: 230px
    padding: 7px
    background: $white
    border: 1px solid $border

    h2
      font-size: 16px
      font-weight: $weight-semibold
      text-align: center

    span
      width: 100%
      height: 20px
      font-size: 12px
      display: flex
      align-items: center
      justify-content: center

      &.time
        color: $color-secondary

      &.size
        font-weight: $weight-semibold

    .docker-img
      fill: red !important
      display: block
      width: 130px
      margin: 10px auto

    .button
      margin: 3px auto

.content-box
  padding: 30px
  background: $white
  border: 1px solid $border
  border-radius: 4px
  width: 100%
  min-height: 50px
  margin-bottom: 30px

  .content-box-header
    display: flex
    align-items: center
    justify-content: space-between
    margin-bottom: 10px

    h2
      padding: 0
      margin: 0
      display: inline

    h3
      display: inline
      text-transform: none
      padding: 0
      margin: 0

  .approve
    display: flex
    align-items: center
    justify-content: center
    text-align: center

.error-item
  margin: 10px 0px
  font-size: 14px
  border: 1px solid $red
  background: rgba($red-secondary, 0.4)
  font-weight: $weight-semibold
  color: darken($red, 10)
  align-items: center
  justify-content: center
  text-align: center