/******************************************************************************
** stream.css
*  Coppermine 1.6.x Plugin - stream. Created by KF for Photostream style thumbnail display 
*  Contains the CSS needed for the stream display mode
*  Version 1.0
*  @since  1.6.22
******************************************************************************/

.stream_class_thumb {
    position: relative; 
}

.stream_class_image_and_text {
    position: relative;
    text-align: left;
}
#stream_id_upl_title {
    text-align: left;
    vertical-align: middle;
    white-space: nowrap;
    left: 2px;
    display: inline-block;
    position:static;
    overflow: hidden;
    overflow-wrap: anywhere;
    text-overflow: ellipsis;    
}

#stream_id_image_and_text #stream_id_description { 
    text-align: left;
    bottom: 5px;
    left: 4px;
    color: #EFEFEF;   /* Force text color on the grounds of readability */
    background: rgba(10, 10, 10, .4); /* Black with low-ish opacity */
    visibility: hidden;
}

#stream_id_image_and_text:hover #stream_id_description { 
    visibility: visible;
}

#stream_id_image_missing {
    right: 4px;
    left: 4px;
    text-align: left;
}

.stream_class_image_holder {
    display: block;
    margin-left: 0px;
    margin-right: 0px;
}

/* This class is used when there's only one row of details displayed */
.stream_class_image_details_holder_one_row {
    position: relative;  /* This property is essential as it's the containing block for the pic information */
    height: 20px;       
    border-left-width: 1px;
    border-left-style: dotted;
    padding-left: 4px;
    right: 0px;
} 

/* This class is used when there's two rows of details displayed */
.stream_class_image_details_holder_two_rows {
    position: relative;  /* This property is essential as it's the containing block for the pic information */
    height: 38px;       
    border-left-width: 1px;
    border-left-style: dotted;
    padding-left: 4px;
} 

#stream_id_uploader {
    display: inline;
    position: static;
    top: 2px;
    left: 0px;
    padding-left: 2px;
    padding-right: 0px;
    padding-bottom: 0px;

}

#stream_id_title {
    display: inline;
    position: static;
    overflow: hidden;
    overflow-wrap: anywhere;
    text-overflow: ellipsis;
    top: 2px;
    padding-bottom: 0px;
    margin: 0px;
}

.stream_class_thumb .thumb_num_comments {
    text-align: right;
    white-space: nowrap;
    display: inline-block;
    padding: 0px;
    top: 1px;
    right: 3px;
    position:absolute;
}

.stream_class_comment_icon {
    vertical-align: top;
    opacity: 80%;
    max-height: 15px;
    display: inline-block;
} 

.stream_class_rating_views {
    display: inline-block;
    position: static;
}

.stream_class_rating {
    text-align: left;
    white-space: nowrap;
    left: 2px;
    bottom: 2px;
    display: inline-block;
    position:absolute;
    overflow: hidden;
    overflow-wrap: anywhere;
    text-overflow: ellipsis;
}

.stream_class_thumb #stream_id_views {
    text-align: right;
    white-space: nowrap;
    bottom: 3px; 
    top:auto;
    display: inline-block;
    position:absolute;
}

#stream_id_views {
    text-align: right;
    white-space: nowrap;
    right: 2px;
    bottom: 2px;
    display: inline-block;
    position:absolute;
}

.stream_class_rating_images{
    display: inline-block;
    vertical-align: middle;
    position:static;
}

.stream_class_rating_images img{
    padding-right: 2px;
}

#stream_id_description.thumb_caption {
    display: inline-block;
    position:absolute;
    bottom: 1px;
}
#stream_id_image_missing.thumb_caption {
    display: inline-block;
    position:absolute;
    top: 40%;
    rotate: -15deg;
}
#stream_id_votes.thumb_caption {
    display: inline-block;
    position:absolute;
    bottom: 1px;
}

.stream_class_image_details_right_edge_one_row{
    display: inline-block;
    position:absolute;
    border-right-width: 1px;
    border-right-style: dotted;
    height: 18px;
    width: 36px;   
    float: right;
    bottom: 1px;
}
.stream_class_image_details_right_edge_two_rows{
    display: inline-block;
    position: absolute;
    border-right-width: 1px;
    border-right-style: dotted;
    height: 36px;
    width: 32px;   
    float: right;
    bottom: 1px;
}

/* Alignment of the radio buttons */
#stream_id_choice_0{
    vertical-align: center;
    margin-top: 0px;
}

#stream_id_choice_1{
    vertical-align: center;
    margin-top: 0px;
}