/*
Wordpress Popular Posts plugin stylesheet
Developed by Hector Cabrera
cabrerahector.com | @cabrerahector

Use the following classes to style your popular posts list as you like.
*/

/* Styles the "Sorry, no data so far" message */
.wpp-no-data {
}

/* UL - Popular Posts container styles */

	/* LI - Post container styles */
	.wpp-list li {
		overflow:hidden;
		float:none;
		clear:both;
	}
	
	/* Styles for the popular post in view */
	.wpp-list li.current {
	}
	
		/* Thumbnail styles */
		.wpp-thumbnail {
			display:inline;
			float:left;
			margin:0 5px 0 0;
			border:none;
		}

		/* Title styles */
		.wpp-post-title {
		}
		
		/* Excerpt styles */
		.wpp-excerpt {
		}
		
		/* Stats tag styles */
		.post-stats {
			display:block;
			font-size:9px;
			font-weight:bold;
		}
			
			/* Comments count styles */
			.wpp-comments {
			}
			
			/* Views count styles */
			.wpp-views {
			}
			
			/* Author styles */
			.wpp-author {
			}
			
			/* Post date styles */
			.wpp-date {
			}
			
			/* Post category styles */
			.wpp-category {
			}
		
		/* WP-PostRatings styles */
		.wpp-rating {
		}

.wpp-list {
  margin-left:-30px;
  counter-reset: ranking;
  list-style-type: none;
}
.wpp-list li {
  clear: both;
  position: relative;
  overflow: hidden;
  margin-top: 10px;
  margin-bottom: 10px;
  font-size: 0.75rem;
  font-weight: bold;
}
.wpp-list li::before {
  counter-increment: ranking;
  content: counter(ranking);
  position: absolute;
  top: 0;
  left: 0;
  background-color: rgba(0,0,0,0.6);
  text-align: center;
  width: 1.5em;
  height: 1.5em;
  color: #fff;
  line-height: 1.5em;
  font-size: 14px;
}
.wpp-thumbnail {
  display: inline;
  float: left;
  margin: 0 10px 0 0;
}

.wpp-list li:nth-child(1)::before {
  background-color: rgba(230,180,34,0.8);
}
.wpp-list li:nth-child(2)::before {
  background-color: rgba(192,192,192,0.8);
}
.wpp-list li:nth-child(3)::before {
  background-color: rgba(196,112,34,0.8);
}