$img-height: 185px;

.beauty-gallery {
	display: flex;
	flex-flow: row wrap;
	margin-left: -1px;
	position: relative;
	width: 100%; // FF bug fix https://proteusthemes.zendesk.com/agent/tickets/6258

	&__item {
		width: calc(50% - 1px);
		margin: 1px 0 0 1px;

		@include media-breakpoint-up(md) {
			width: calc(25% - 1px);

			&--bigger {
				position: absolute;
				top: 0;
				left: 0;
				width: calc(50% - 1px);

				img {
					height: #{2 * $img-height + 1px};
				}
			}
		}

		&--blank {
			display: none;

			@include media-breakpoint-up(md) {
				display: block;
			}
		}

		&.compat-object-fit {
			background-size: cover;
			background-position: center center;

			img {
				opacity: 0;
			}
		}
	}

	br {
		display: none;
	}

	img {
		width: 100%;
		height: $img-height;
		object-fit: cover;
	}
}

// override
.widget .beauty-gallery {
	img {
		height: $img-height;
	}

	&__item--bigger img {
		@include media-breakpoint-up(md) {
			height: #{2 * $img-height + 1px};
		}
	}
}
