
/*
 * Frontend CSS for the Related plugin.
 * Also used for Related_du.
 */


/*
 * CSS for Simple View
 */


/* None */



/*
 * CSS for Extended View
 */

/* UL */
ul.related-posts.extended_view,
ul.related_du-posts.extended_view {
	margin: 0;
	padding: 0;
	list-style: none;
}

/* LI */
li.related-post.extended_view,
li.related_du-post.extended_view {
	position: relative;
	display: inline-block;
	float: left;
	list-style: none;
	width: 49%;
	min-height: 20px;
	margin:  0 1% 10px 0;
	padding: 0;
	cursor: pointer;
}

.single-post #posts-content .related-posts img {
    max-height: 125px !important;

}
.extended_view span.related-post-title, .extended_view span.related_du-post-title {
    height: 70px;
    width: 100% !important;
}

@media (max-width: 1023px) {


li.related-post.extended_view,
li.related_du-post.extended_view {
	position: relative;
	display: inline-block;
	float: left;
	list-style: none;
	width: 99%;
	min-height: 20px;
	margin:  0 1% 10px 0;
	padding: 0;
	cursor: pointer;
}
}


/* A */
.extended_view a.related-post-link,
.extended_view a.related_du-post-link {

}

/* IMG */
.extended_view img.related-posts-image,
.extended_view img.related_du-posts-image {
	width: 100%;
}

/* SPAN */
.extended_view span.related-post-title,
.extended_view span.related_du-post-title {
	font-size: 15px;
    position: relative;
    width: fit-content;
    overflow: hidden;
    background-color: #8c0303;
    color: #fff;
    text-align: center;
    /* margin: 0; */
    padding: 15px;
    bottom: 0;
    left: 0;
    /* height: 40px; */
    line-height: 20px;
    margin-top: 10px;
    margin-bottom: 10px;
    display: flex;

}
