.iconeMensagem.open:after {
    content: "";
    display: inline-block;
    vertical-align: middle;
    position: absolute;
    left: 12px;
    top: 40px;
    z-index: 99999;
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 10px solid #fff;
}

.iconeMensagem.open:before {
    content: "";
    display: inline-block;
    vertical-align: middle;
    position: absolute;
    left: 11px;
    top: 38px;
    z-index: 99999;
    width: 0;
    height: 0;
    border-left: 12px solid transparent;
    border-right: 12px solid transparent;
    border-bottom: 12px solid rgba(0, 0, 0, .15);
}

ul.listaMensagens .nenhumaMensagem{text-align:center; padding:10px;}
ul.listaMensagens{width: 400px; min-height: 200px; max-height: 450px; overflow: scroll; padding-bottom:40px;}
li.topoListaMensagem{}
li.topoListaMensagem,li.itemListaMensagem{padding:.7em;border-bottom: 1px solid #ddd;}
li.itemListaMensagem:last-of-type{border-bottom: none;}
li.itemListaMensagem{cursor:pointer; position:relative;}
li.itemListaMensagem:hover{background-color: #0992C2; color:#fff;}
li.itemListaMensagem:hover .fechar-itemListaMensagem,
li.itemListaMensagem:hover .glyphicon.glyphicon-send,
li.itemListaMensagem:hover .iconeAgenda:after,
li.itemListaMensagem:hover .iconeProjeto:after,
li.itemListaMensagem:hover .tagNameUser,
li.itemListaMensagem:hover .timeago{color:#fff;}
li.rodapeListaMensagens{
    background-color: #eee;
    bottom: 0;
    height: 40px;
    position: absolute;
    width: 100%;
    text-align: center;

    box-shadow: 0px 2px 6px 2px rgba(0,0,0,.3);
}
.fechar-itemListaMensagem{
    position: absolute;
    right: 0;
    top: 0;
    margin: .4em .6em 0 0;
    font-size: .8em;
    color:#0992c2;
}
.mensagemNaoLida{background-color:#eee;}
.mensagemNaoLida .statusMensagem,.mensagemLida .statusMensagem{ width:6px; height:6px; border-radius:6px; right:10px; position: absolute; top: 10px; display: block;  }

.mensagemNaoLida .statusMensagem{ background-color:#fff; box-shadow: 0px 0px 0px 1px #0992c2, 0px 0px 0px 2px #fff;}
.mensagemLida .statusMensagem{background-color:#0992C2; box-shadow: 0px 0px 0px 1px #fff, 0px 0px 0px 2px #0992c2;}
.img-itemListaMensagem img{background-color:#fff; float:left; margin-right:.7em;}
.msg-itemListaMensagem p, .interacao-mensagem .texto-mensagem{text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}

.conversacao .msg-itemListaMensagem p,
.conversacao .interacao-mensagem .texto-mensagem{
    text-overflow: initial;
    white-space: initial;
    overflow: auto;
    line-height:18px;
    text-align:justify;
}
.conversacao .interacao-mensagem .foto-miniatura {
    padding: 0 10px;
}

.interacao-mensagem{cursor:pointer;}
.interacao-mensagem:hover{background-color:#eee;}

.msg-itemListaMensagem p{font-size: .8em;}

.modal-body .msg-itemListaMensagem p{display:block;}
.msg-itemListaMensagem .titulo-itemListaMensagem{font-size:.9em;}
.tagNameUser{font-weight:bold; color:#000;}
li.rodapeListaMensagens a{
    color: #666;
    padding: 0;
    line-height: 40px;
    
    display:inline-block;
    width:100%
}

.mensagemNaoLida .statusMensagem:after{
    content: "Marcar como lida";
    padding: 2px 4px 4px 4px;
    position: absolute;
    top: -5px;
    display:none;
    right: 18px;
    width:100px;
    font-size: 11px;
    color: #fff;
    text-align: center;
    background-color: #000;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    -ms-border-radius: 2px;
    border-radius: 2px;
}
.mensagemNaoLida .statusMensagem:hover:after{
    display: block;
}

.mensagemLida .statusMensagem:after{
    content: "Lida";
    padding: 2px 4px 4px 4px;
    display: none;
    position: absolute;
    top: -5px;
    right: 18px;
    font-size: 11px;
    color: #fff;
    text-align: center;
    background-color: #000;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    -ms-border-radius: 2px;
    border-radius: 2px;
}
.statusMensagem:before{
    content: "";
    display: none;
    position: absolute;
    left: -13px;
    top: 0px;
    z-index: 99999;
    width: 0;
    height: 0;
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
    border-left: 6px solid #000;
}

.statusMensagem:hover:before {
    display: inline-block;
}

.mensagemLida .statusMensagem:hover:after{
    display: block;
}
li.itemListaMensagem .timeago{font-size:11px; color:#999; display:inline-block;}
.modal-body .timeago {
    font-size: 11px;
    color: #999;
}

.modal-body .dataMensagem{
    text-align:right;
    float: right;
    width:20%;
}

.modal-body .msg-itemListaMensagem{width:70%}
.modal-body .img-itemListaMensagem{width:10%;}
.modal-body .msg-itemListaMensagem,.modal-body .img-itemListaMensagem{float:left; display:block;}

.clearfix:after {
   content: ".";
   visibility: hidden;
   display: block;
   height: 0;
   clear: both;
}

.modal-body ..glyphicon.glyphicon-send {

}