.entity-attribute.entity-attribute-on-off
  //+flex(flex-start, center)
  max-width: 500px

  label
    position: relative
    margin-right: 60px

  input
    display: none

  .placeholder
    padding: 20px 0

  .explanation
    margin-top: 10px
    margin-left: 0
    padding-bottom: 0

  .on-off-switch
    position: relative
    display: block
    width: 35px
    height: 20px
    margin-left: 45px
    border-radius: 20px
    background-color: $lightest-gray
    //background-color: $neonRed
    cursor: pointer
    transition: background 0.4s

    &:after
      content: ''
      position: absolute
      display: block
      left: 2px
      top: 2px
      height: 16px
      width: 16px
      border-radius: 100%
      background-color: white
      transform: translate3d(0,0,0)
      transition: transform 0.4s

    &.on
      background-color: $neonGreen

      &:after
        transform: translate3d(15px, 0, 0)