

/**
 *	Catalog Products Grid
 */
.catalog-products-grid {
	padding-top: 40px;
}

.catalog-products-grid .catalog-grid-entry-wrapper {
	position: relative;
}

.catalog-products-grid .catalog-grid-entry-wrapper .simplefavorite-button {
	position: absolute;
	right: 2px;
	top: 5px;
	background: transparent;
	border: 0;
}

/**
 * 	Make images have the same aspect ratio
 */
.catalog-products-grid .catalog-grid-entry-wrapper .image-wrapper{
	padding-bottom: 148%;
	position: relative;
	overflow: hidden;
	background-size: cover;
}

.catalog-products-grid .catalog-grid-entry-wrapper .image-wrapper img {
	position: absolute;
}


/**
 *	Catalog Products Grid - image hover logic
 */
.catalog-products-grid .catalog-grid-entry-wrapper .image-wrapper:hover{
	background-size: cover;
}

.catalog-products-grid .catalog-grid-entry-wrapper:hover {
	cursor: pointer;
}

.catalog-products-grid .catalog-grid-entry-wrapper .inner-wrapper {
	padding-bottom: 30px;
}



/**
 * Catalog Products Grid - mobile and tablet touch behavior
 */
@media screen and (max-width: 1024px) {
	/* Tap for alternate view - on slide */
	.catalog-products-grid .mobile-info-tap-alternate-view {
		font-size: 12px;
		position: absolute;
		padding-left: 12px;
		letter-spacing: 0.2px;
		z-index: 0;
		width: 100%;
		left: 0;
		height: 100%;
	}

	.catalog-products-grid .mobile-info-tap-alternate-view:before {
		width: 20px;
		height: 20px;
		display: inline-block;
		position: relative;
		content: '';
		background-image: url('../img/tap-icon.svg');
		background-repeat: no-repeat;
		background-size: auto 100%;
		bottom: -6px;
	}

	.catalog-products-grid .grid-alternate-img {
		opacity: 0; /* Class that hides the image in front when a "tap to view alternate image" happens */
	}

}


/**
 * Catalog Products Grid - Tablet and above
 */
@media screen and (min-width: 769px) {
	.catalog-products-grid {
		display: flex;
		flex-wrap: wrap;
	}

	.catalog-products-grid .catalog-grid-entry-wrapper {
		width: 33.33%;
	}

	.catalog-products-grid .catalog-grid-entry-wrapper .inner-wrapper {
		padding-left: 30px;
		padding-right: 30px;
	}

	.catalog-products-grid .catalog-grid-entry-wrapper .inner-wrapper .rrp .rrp-heading {
		display: inline-block;
		width: 100%;
	}

	.catalog-products-grid-buttons-container .catalog-products-button {
		width: 220px; 	/* Make the buttons use the same min-width */

	}
}

/**
 * Catalog Products Grid - Landscape tablet and above
 */
@media screen and (min-width: 1025px) {
	.mobile-info-tap-alternate-view {
		display: none; /* hies "Tap for alternate view" - on laptops */
	}

	.catalog-products-grid .catalog-grid-entry-wrapper {
		width: 25%;
	}
}

/**
 * Catalog Products Grid - Laptop
 */
 @media screen and (min-width: 1366px) {
	.catalog-products-grid .catalog-grid-entry-wrapper {
		width: 20%;
	}
}

/**
 *	Catalog Products Grid Buttons
 */
 .catalog-products-grid-buttons-container {
	text-align: center;
	background-color: #f6f6f8;
	position: fixed;
	bottom: 0;
	width: 100%;
	z-index: 999;
	left: 0;
	padding-top: 10px;
	padding-bottom: 10px;
}

.catalog-products-grid-buttons-container .catalog-products-button {
	border: 1px solid #000;
	display: inline-block;
	text-transform: uppercase;
	padding: 5px 19px;
	margin: 10px 10px;
}

.catalog-products-grid-buttons-container-wrapper {
	z-index: 11; /* To keep the fixed bottom bar on top of the footer */
}


body.logged-in .catalog-products-grid-buttons-container .lrm-login {
	display: none;
}

@media screen and (max-width: 768px) {
	.catalog-products-grid-buttons-container .catalog-products-button {
		font-size: 12px;
		line-height: 1.2em;
		padding: 5px 5px;
		width: 44%; /* Make the buttons use the same min-width */
		margin: 5px 2%;
	}
}
