/* Product Rating */

.view-grid .rating-box {
	position: absolute;
	right: 10px;
	opacity: 0;

	-webkit-transition: all 0.4s ease 0s;
			transition: all 0.4s ease 0s;
}

.view-list .rating-box { display: inline-block; }

.view-grid .product-frame:hover .rating-box { opacity: 1; }

	.rating-box .rating {
		display: inline-block;
		width: auto !important;
		font-size: 5px;

		-webkit-transition: all 0.4s ease 0s;
				transition: all 0.4s ease 0s;
	}

	.view-grid-center .rating-box .rating.readonly-rating {
		display: block;
		float: none;
		margin-bottom: 8px;
		margin-left: auto;
		margin-right: auto;
		text-align: center;
		opacity: 1;
	}

		.view-grid .rating-box > span,
		.view-grid-center .rating-box > span { display: none; }

		.view-list .rating-box > span,
		.single-product-summary .rating-box > span {
			display: inline-block;
			margin-left: 10px;
			color: #696e6e;
			font-size: 12px;
			}

			.single-product-summary .rating-box > span a 		{ color: #292f38; }
			.single-product-summary .rating-box > span a:hover  { color: #e74c3c; }

/* Post Content Rating */

.post-content .rating-box {
	margin-bottom: 15px;
	padding: 7px 0;
	border-top: 1px solid #eee;
	border-bottom: 1px solid #eee;
	line-height: 1em;
}

.post-area .entry-blog-big .rating-box {
	text-align: right;
}

	.post-area .rating.readonly-rating {
		display: inline-block;
		margin-right: 5px;
		width: auto !important;
		vertical-align: middle;

		-webkit-transition: all 0.4s ease;
				transition: all 0.4s ease;
	}

		.rate-desc {
			display: inline-block;
			vertical-align: middle;
			font-size: 12px;
		}

		.col-sm-4 .rate-desc {
			display: block;
			text-align: right;
		}

		.post-area .rating-box span {
			vertical-align: middle;
			font-size: 12px;
		}

		.post-area .rating-box span.average,
		.post-area .rating-box span.best { display: none; }

.ratings {
	margin: 5px 0;
}

.ratings:after{
	content:'.';
	display:block;
	clear:both;
	visibility:hidden;
	line-height:0;
	height:0;
}

	.ratings .item {
		display: none;
	}

.ratings ul,
.ratings a:hover,
.ratings .rating { background: transparent url(star.png) repeat-x; }

/* !important because some bad themes override our rules :( */
.ratings ul,
.ratings li {
	list-style-type: none !important;
	margin: 0 !important;
	padding: 0 !important;
}

.ratings ul {
	display: inline-block;
	height: 16px;
	vertical-align: middle;
}

	.ratings li {
		position: relative;
		display: block;
	}

		.ratings ul li a {
			position: absolute;
			cursor: pointer;
			left: 0;
			top: 0;
			display: block;
			width:16px;
			height: 16px;
			text-decoration: none;
			text-indent: -500px;
			z-index: 10;
		}

		.ratings ul li a:hover {
			background-position: left bottom;
			z-index: 5;
			left: 0 !important;
		}

		.ratings .s2 a		 { left:  15px; }
		.ratings .s2 a:hover { width: 30px; }

		.ratings .s3 a		 { left:  30px; }
		.ratings .s3 a:hover { width: 45px; }

		.ratings .s4 a		 { left:  45px; }
		.ratings .s4 a:hover { width: 60px; }

		.ratings .s5 a		 { left:  60px; }
		.ratings .s5 a:hover { width: 75px; }

		.ratings .s6 a		 { left:  75px; }
		.ratings .s6 a:hover { width: 90px; }

		.ratings .s7 a		 { left:  90px; }
		.ratings .s7 a:hover { width: 105px;}

		.ratings .s8 a		 { left:  105px; }
		.ratings .s8 a:hover { width: 120px; }

		.ratings .s9 a		 { left: 120px; }
		.ratings .s9 a:hover { width: 135px; }

		.ratings .s10 a		 { left: 135px; }
		.ratings .s10 a:hover{ width: 150px; }

.ratings .rating {
	position: absolute;
	z-index: 1;
	display: block;
	height: 16px;
	background-position: left center;
	text-indent: -9999px;
}

.ratings .meta {
	display: inline-block;
	vertical-align: middle;
}

	.ratings.error .meta {
	  	display: inline-block;
		vertical-align: middle;
		color: #ff0000;
	}