#small-chat
  position: fixed
  bottom: 20px
  right: 20px
  z-index: 100


#small-chat .badge
  position: absolute
  top: -3px
  right: -4px


.open-small-chat
  height: 38px
  width: 38px
  display: block
  background: #1ab394
  padding: 9px 8px
  text-align: center
  color: #fff
  border-radius: 50%


.open-small-chat:hover
  color: white
  background: #1ab394


.small-chat-box
  display: none
  position: fixed
  bottom: 20px
  right: 75px
  background: #fff
  border: 1px solid $border-color
  width: 230px
  height: 320px
  border-radius: 4px


.small-chat-box.ng-small-chat
  display: block


.body-small
  .small-chat-box
    bottom: 70px
    right: 20px



.small-chat-box.active
  display: block


.small-chat-box

  .heading
    background: $nav-bg
    padding: 8px 15px
    font-weight: bold
    color: #fff


  .chat-date
    opacity: 0.6
    font-size: 10px
    font-weight: normal


  .content
    padding: 15px 15px

    .author-name
      font-weight: bold
      margin-bottom: 3px
      font-size: 11px


    > div
      padding-bottom: 20px


    .chat-message
      padding: 5px 10px
      border-radius: 6px
      font-size: 11px
      line-height: 14px
      max-width: 80%
      background: #f3f3f4
      margin-bottom: 10px


    .chat-message.active
      background: #1ab394
      color: #fff


    .left
      text-align: left
      clear: both

      .chat-message
        float: left



    .right
      text-align: right
      clear: both

      .chat-message
        float: right






  .form-chat
    padding: 10px 10px


