Message System LESS

#message-wrap{
    overflow: hidden;
}

#messagePage{
    background: lighten(#F2F2F2, 10%);
    border: 1px solid #ccc;
    height: 500px;
    margin-bottom: 80px;
    overflow: hidden;
    ul.collection{
        margin: 0 0 1rem;
        position: relative;
        li{
            background-color: #fff;
            border-bottom: 1px solid #e0e0e0;
            line-height: 1.5rem;
            margin: 0;
            padding: 10px 20px 10px 60px;
            position: relative;
            cursor: pointer;
            transition: 0.6s all;
            &:hover{
                background: #F6F6F7;
                transition: 0.3s all;
            }
            &.active{
                box-shadow: inset 5px 0 0 0 #26CAD3;
            }
            i{
                display: inline-block;
                height: 42px;
                left: 10px;
                overflow: hidden;
                position: absolute;
                text-align: center;
                top: 20px;
                vertical-align: middle;
                width: 42px;
            }
            span{
                display: block;
                font-size: 16px;
                font-weight: 500;
            }
            p{
                color: #9e9e9e;
                font-size: 0.8rem;
                display: block;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
            }
            time{
                font-size: 12px;
                position: absolute;
                right: 15px;
                top: 10px;
            }
        }
    }
    #message-list{
        border-right: 1px solid #ccc;
        display: inline;
        float: left;
        height: 500px;
        overflow: auto;
        width: 30%;
        ul{
            margin-bottom: 0px;
        }
    }
    #email-details{
        background: #fff none repeat scroll 0 0;
        display: inline;
        float: left;
        height: 500px;
        overflow: auto;
        padding: 15px;
        width: 70%;
        h3{
            font-size:1.2rem;
            display: block;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            margin: 10px 0 20px 0;
            span{

            }
        }
        .email-content-wrap{
            position: relative;
            .meta-message{
                background-color: #fff;
                border-radius: 2px;
                ul.collection{
                    li{
                        padding: 10px 20px 10px 80px;
                        cursor: auto;
                        &:hover{
                            background: none;
                        }
                    }
                    li.collection-item{
                        &.avatar{

                        }

                        img{
                            border-radius: 50%;
                            display: inline-block;
                            height: 42px;
                            left: 15px;
                            overflow: hidden;
                            position: absolute;
                            vertical-align: middle;
                            width: 42px;
                            color: #fff;
                            display: inline-block;
                            font-size: 1.5rem;
                            font-weight: 300;
                            height: 42px;
                            left: 15px;
                            overflow: hidden;
                            padding: 10px;
                            position: absolute;
                            text-align: center;
                            vertical-align: middle;
                            width: 42px;
                            padding: 0;
                        }
                        span.email-title{
                            line-height: 16px;
                        }
                        p{
                            color: #9e9e9e;
                            line-height: 1.5rem;
                            font-size: 0.8rem;
                            margin: 0;
                            padding: 0;
                        }
                    }
                }

            }
            .email-actions{
                position: absolute;
                right: 20px;
                a{
                    span{
                        i{

                        }
                    }
                }
            }
            .email-content{
                p{

                }
            }
        }
        .email-reply{
            textarea{
                padding: 5px;
                border: 1px solid #ccc;
                border-radius: 3px;
                margin:0 0 20px 0;
                height: 100px;
            }
            input[type="submit"]{
                background: #26cad3 none repeat scroll 0 0;
                border: medium none;
                border-radius: 3px;
                color: #fff;
                cursor: pointer;
                float: right;
                margin: 0 0 20px;
                padding: 5px 10px;
            }
        }
    }
}