//
// Media-Object
// --------------------------------------------------
.media-list {
    li {
        padding: 10px;
        border-bottom: 1px solid #eee;
        position: relative;
        border-left: 3px solid white;
        font-size: 12px;

        a {
            color: @text-color-main;
        }
    }

    .badge-space-type {
        background-color: @background-color-secondary;
        border: 1px solid @background3;
        color: @background4;
        padding: 3px 3px 2px 3px;
    }

    li.new {
        border-left: 3px solid @info;
        background-color: lighten(@info, 45%);
    }

    li:hover,
    li.selected {
        background-color: @background-color-secondary;
        border-left: 3px solid @info;
    }
}

.media-list li.placeholder {
    font-size: 14px !important;
    border-bottom: none;
}

.media-list li.placeholder:hover {
    background: none !important;
    border-left: 3px solid white;
}

.media-left,
.media > .pull-left {
    padding-right: 0;
    margin-right: 10px;
}

.media:after {
    content: '';
    clear: both;
    display: block;
}

.media {
    .time {
        font-size: 11px;
        color: @text-color-soft;
    }

    .img-space {
        position: absolute;
        top: 35px;
        left: 35px;
    }

    .media-body {
        overflow: hidden !important;
        font-size: 13px;
        white-space: normal;
        .text-break();

        h4.media-heading {
            font-size: 14px;
            font-weight: 500;
            color: @text-color-highlight;

            a {
                color: @text-color-highlight;
            }

            small,
            small a {
                font-size: 11px;
                color: @text-color-soft;
            }

            .content {
                margin-right: 35px;
            }
        }

        .content a {
            word-break: break-all;
        }

        strong {
            color: @text-color-highlight;
        }

        h5 {
            color: @text-color-soft2;
            font-weight: 300;
            margin-top: 5px;
            margin-bottom: 5px;
            min-height: 15px;
        }

        .module-controls {
            font-size: 85%;

            a {
                color: @link;
            }
        }
    }

    .content {
        a {
            color: @link;
        }
    }

    .content .files a {
        color: @text-color-highlight;
    }
}

.content span {
    .text-break;
}

#blueimp-gallery {
    .slide {
        img {
            max-height: 80%;
        }
    }
}


audio, canvas, progress, video {
    display: inline-block;
    vertical-align: baseline;
    max-width: 100%;
    height: auto;
}

img {
    image-orientation: from-image;
}