@media #{$D7} {
  .send-message-area {
    position:fixed;
    bottom:0;
    background-color:whitesmoke;
    box-sizing: border-box;
    float:left;
    padding:16px;
    width:100%;
    border-top:1px solid lightgray;
    right:0;
    .send-message {
      outline:0;
      border:0;
      width:100%;
      padding:0;
      resize:auto;
    }
  }

  .message-composer {
    vertical-align: top;
    position:relative;
    background-color:white;
    margin-bottom:20px;
    padding:8px;
    border:1px solid lightgray;
    font-size:14px;
    color:gray;
    padding-bottom:80px;
    .attachments {
      position:absolute;
      bottom:0;
      color:lightgray;
      width:64px;
      text-align: center;
      padding:6px 4px 0 4px;
      margin-bottom:10px;
      border-top:1px solid lightgray;
    }
  }

  .extension-details {
    font-size:11px;
    color:darken(lightgray, 10%);
    a {
      color:gray;
      text-decoration: none;
    }
    ul {
      padding:0;
    }
    li {
      display:inline-block;
      &:after {
        content:" • ";
        color:lightgray;
      }
      &:last-of-type:after {
        content:none;
      }
    }
  }
}

@media #{$D6} {
  .send-message-area {
    padding-left:258px;
  }
}

@media #{$D5} {
  .send-message-area {
    padding-right:258px;
  }

}