.woocommerce-results-wrapper {
	
	margin-bottom: 30px;
	display: flex;
	align-items: center;

	.woocommerce-result-count {
		float: left;
		margin: 0;
	}
	.woocommerce-ordering {
		float: right;
		text-align: right;
	}

	.woocommerce-result-count,
	.woocommerce-ordering {
		width: 50%;
	}
}
ul.products {
	margin: 0;
	padding: 0;

	&:before,
	&:after {
		content: " ";
		display: table;
	}
	
	&:after {
		clear: both;
	}	

	li.product {
		list-style: none;
		position: relative;
		margin-bottom: 45px;

		.woocommerce-loop-product__title {
			@include font-size(16);
			font-weight: 400;
			margin: 16px 0;
		}		

		img {
			display: block;
		}

		.star-rating {
			margin-bottom: 5px;
		}

		.loop-thumb-wrapper {

			position: relative;
			overflow: hidden;

			.button-wrapper {
				opacity: 0;
				position: absolute;
				bottom: -70px;
				width: 100%;
				left: 0;
				text-align: center;
				transition: all 0.3s;

				.button {
					padding: 8px 18px;
				}

				.added_to_cart {
					background: $color__text-main;
					color: #fff;
					display: inline-block;
					padding: 8px 18px;
				}
			}
		}

		&:hover {
			.button-wrapper {
				bottom: 15px;
				opacity: 1;
			}
		}
	}

	.loop-product-cats {
		margin-top: 15px;

		a {
			color: #716f6f;
			@include font-size(14);

			&:hover {
				color: $color__accent;
			}
		}
	}

	.button {
		margin-top: 15px;
	}

}

span.onsale {
    position: absolute;
    top: 15px;
    right: 15px;
    background-color: $color__accent;
    font-size: 14px;
    text-transform: uppercase;
    padding: 5px;
    line-height: 1;
    color: #fff;
}

@media screen and (max-width: 767px) {
	ul.products {

		li.product {

			width: 47%;
			float: left;
			margin-right: $columns__margin;

			&:nth-of-type(2n) {
				margin-right: 0;
			}
		}
	}

}

@media screen and (min-width: 768px) {

	ul.products {

		li.product {
	
			float: left;
			margin-right: $columns__margin;
	
			&.first {
				clear: both;
			}

			&.last {
				margin-right: 0;
			}
		}
	}	

	@for $i from 2 through 6 {

		ul.products.columns-#{$i} {

			li.product {

				@include column-width( $i );
			}

		}
	}
}

.price {
	
	color: $color__text-main;
	font-weight: 600;
	display: block;

	del {
		color: #716f6f;
	}

	ins {
		background: transparent;
	}

	.single-product-top & {
		@include font-size(22);
	}
}