.LP-ImageGrid{
	@include RV-FlexGrid(290px, 200px);
	@include RV-ElementList;
	@include RV-Spacing__Inner--small;

    &__Item {
		position: relative;
		@include RV-ContentCrop;

		&--add {
			.LP-Link {
				width: 100%;
				height: 100%;
				position: relative;	
				display: block;
				background: $-almost-white;

				.LP-Icon {
					width: $-spacing-large;
					height: $-spacing-large;

					position: absolute;
					top: 50%;
					left: 50%;
					transform: translate(-50%, -50%);
				}
			}

			&:hover .LP-Link{
				background-color: $-beige;
			}
		}
	}

	&__DeleteItem {
		opacity: 0.7;
		visibility: hidden;
		position: absolute;
		top: $-spacing-small;
		right: $-spacing-small;
		background-color: $-light-brown;
		border-radius: 50%;

		height: $-spacing-large;
		width: $-spacing-large;

		.LP-Link .LP-Icon{
			height: #{$-spacing-small * 2};
			width: #{$-spacing-small * 2};
			position:relative;
			left: #{($-spacing-large - $-spacing-small) / 3.2};
			top: #{($-spacing-large - $-spacing-small) / 3.2};
		}
	}
	
	&__Item>.LP-Link:hover + &__DeleteItem, &__DeleteItem:hover { 
		visibility: visible;
	}
}