/* content pesan */
.box-msg-read{
    border-top: 1px solid #888;
    padding : 5px 0px;
}

.box-msg-read:first-child{
    border-top: none;
}
.box-msg-read .image{
    display: inline-block;
    float: left;
    padding: 4px; 
}

.box-msg-read  .image  img{
    border-radius: 50%;
    width: 36px;
}


.box-msg-read  .content{
    width: 480px;
    display: inline-block;
    padding-left: 5px;
}

.box-msg-read  .content .header  .name{
    font-weight : normal;

}
.box-msg-read  .content .header  .time{
    margin-top: -24px;
    color : #ccc;
}

.box-msg-read  .content   .msg-content{
    text-align : left;
}

.box-msg-read  .content   .msg-content p{
    color : #555;
}


/* end content*/


/* end reply form*/

.top-message{
     background:  #70C3EF  none repeat scroll 0 0;  
  /*    background:   rgba(252, 105, 87, 0.2) none repeat scroll 0 0; */  
    padding: 10px;
    height: 55px;
    margin-bottom: 10px;
}

div.top-message{
height: 55px;
    
}

.body-message  {  height: 500px; }
.body-message  .img-user{
    width: 40px;
    height: 40px;
    padding :1px;
}
.body-message    .message-data{
    padding-bottom: 15px;
    padding-right: 15px;
}
.body-message    .message-data.bordering{
    border-bottom: 1px solid gainsboro;
}


.body-message   .detail-message{
    margin-top: 15px;
}

.body-message   .read-message{
    height: 400px;
    overflow-y: auto;
    padding-right: 15px;
}



.body-message-top{
    background: #2BA4ED;
    padding: 10px;
    height: 40px;
    color: white;
}
.left-side-message{
    height : 460px;
    overflow: auto;
}

.remove-message{
    cursor : pointer;
    margin : 0 3px;
    font-size: 18px;
    display : none;
}
.remove-message:hover{
    color : red;
}

.create-message{
    cursor : pointer;
    margin : 0 3px;
    font-size: 18px;
}
.create-message:hover{
    color : rgb(93, 252, 184);
}

a.outbox-link-message{
    color: white;
}
a.outbox-link-message:hover{
    color : rgb(93, 252, 184);
}

.inbox-box{
    height: 100%;
    border-right: 1px solid gainsboro;
}

.inbox-box   .empty{
    padding : 10px;
}
.inbox-box   .inbox-item{
    cursor : pointer;
    border-bottom: 1px solid gainsboro;  
    padding : 5px;
}
.inbox-box   .inbox-item:hover{
    background: rgba(220, 220, 220, 0.23);
}
.inbox-box   .inbox-item.unread{
    background: rgba(220, 220, 220, 0.46);
}
.inbox-box   .inbox-item.unread:hover{
    background: rgba(220, 220, 220, 0.23);
}

.inbox-box   .inbox-item .user-foto{
    width: 35px;
    height: 35px;
    padding: 1px;
}
.inbox-box   .inbox-item  .checkbox{
    margin-top: -8px;
    margin-left: 5px;
}
.inbox-box   .inbox-item .tanggal-message{
    font-size: 10px;
    color : gainsboro;
}
.inbox-box   .inbox-item .text-inbox{
    max-height: 55px;
}

.inbox-box   .inbox-item .text-inbox     h4 , 
.inbox-box   .inbox-item .text-inbox small{
    padding-left : 0px;
}


.empty-selected-message{
    padding-top: 180px;
    color : gainsboro;
}

.compose-message{
    display:none;

}
.top-compose{
    border-bottom: 1px solid gainsboro;
}

//type head search
.typeahead_wrapper { display: block; height: 30px; }
.typeahead_photo { float: left; width: 30px; height: 30px; margin-right: 5px; border-radius: 50%;}
.typeahead_labels { float: left; height: 30px; }
.typeahead_primary { font-weight: bold; }
.typeahead_secondary { font-size: .8em; margin-top: -5px; }


.typeahead.dropdown-menu{
    width: 90%;
}

.typeahead  .active a{
    color : white;
}

.typeahead  a{
    color :black;
    height: 35px;
}

.typeahead  a:hover{
    color: white;
}