/*Chatbox*/
.messagecontainer {
    margin   : 20px 0 10px 0;
    position : relative;
    }
.messagecontainer.left {
    clear    : right;
    float    : left;
    position : relative;
    width    : 50%;
    }
.messagecontainer.left .avatar {
    border-radius   : 100px !important;
    bottom          : 0;
    box-shadow      : 0 2px 2px 0 rgba(0, 0, 0, 0.35);
    height          : 40px;
    image-rendering : crisp-edges;
    left            : 6px;
    position        : absolute;
    width           : 40px;
    }
.messagecontainer.left .avatar img {
    border-radius : 100px !important;
    height        : 40px;
    width         : 40px;
    }
.messagecontainer.left .inhaltmessage {
    border-radius : 8px 30px 30px 8px;
    color         : #222;
    left          : 60px;
    position      : relative;
    text-align    : center;
    text-shadow   : 0 1px 1px white;
    word-wrap     : break-word;
    }
.messagecontainer.left .inhaltmessage.archiv {
    color       : #222;
    text-shadow : 0 0 0;
    }
.messagecontainer.left .inhaltmessage .message {
    background    : #eee;
    border-radius : 8px 30px 30px 8px;
    border-top    : 2px solid #ddd;
    overflow      : hidden;
    padding       : 10px;
    }
.messagecontainer.left .inhaltmessage:before {
    border-bottom : 4px solid transparent;
    border-left   : 8px solid transparent;
    border-right  : 10px solid #eee;
    border-top    : 12px solid transparent;
    bottom        : 6px;
    content       : '';
    height        : 0;
    left          : -18px;
    position      : absolute;
    width         : 0;
    }
.messagecontainer.left .inhaltmessage .timeautor {
    background    : #eee;
    border-radius : 6px 6px 0 0;
    font-size     : 11px;
    height        : 18px;
    left          : 5px;
    line-height   : 18px;
    max-width     : 295px;
    overflow      : hidden;
    padding       : 0 5px 0 5px;
    position      : absolute;
    top           : -18px;
    }
.messagecontainer.right {
    clear      : left;
    float      : right;
    text-align : right;
    width      : 50%;
    }
.messagecontainer.right .avatar {
    border-radius   : 100px !important;
    bottom          : 0;
    box-shadow      : 0 2px 2px 0 rgba(0, 0, 0, 0.35);
    height          : 40px;
    image-rendering : crisp-edges;
    position        : absolute;
    right           : 6px;
    width           : 40px;
    }
.messagecontainer.right .avatar img {
    border-radius : 100px !important;
    height        : 40px;
    width         : 40px;
    }
.messagecontainer.right .inhaltmessage {
    border-radius  : 30px 8px 8px 30px;
    color          : #222;
    position       : relative;
    right          : 60px;
    text-align     : center;
    text-shadow    : 0 1px 1px white;
    vertical-align : top;
    word-wrap      : break-word;
    }
.messagecontainer.right .inhaltmessage.archiv {
    color       : #222;
    text-shadow : 0 0 0;
    }
.messagecontainer.right .inhaltmessage .message {
    background    : #eee;
    border-radius : 30px 8px 8px 30px;
    border-top    : 2px solid #ddd;
    overflow      : hidden;
    padding       : 10px;
    }
.messagecontainer.right .inhaltmessage:before {
    border-bottom : 4px solid transparent;
    border-left   : 10px solid #eee;
    border-right  : 8px solid transparent;
    border-top    : 12px solid transparent;
    bottom        : 6px;
    content       : '';
    height        : 0;
    position      : absolute;
    right         : -18px;
    width         : 0;
    }
.messagecontainer.right .inhaltmessage .timeautor {
    background    : #eee;
    border-radius : 6px 6px 0 0;
    font-size     : 11px;
    height        : 18px;
    line-height   : 18px;
    max-width     : 295px;
    overflow      : hidden;
    padding       : 0 5px 0 5px;
    position      : absolute;
    right         : 5px;
    top           : -18px;
    }
.messagecontainer .inhaltmessage .message.select {
    background : #e8f7da !important;
    }