.photo-frames {
	position: relative;
	width: 100%;
}

.photo-frames__frame {
	border: 3px solid #fff;
	border-radius: var(--border-radius-small);
	overflow: hidden;
	box-shadow: 0 0.25rem 1rem rgba(0, 0, 0, 0.35);
}

.photo-frames__image {
	display: block;
	width: 100%;
	height: auto;
}

/* Single image */
.photo-frames--single .photo-frames__frame {
	width: 100%;
}

/* Overlap layout */
.photo-frames--overlap {
	position: relative;
}

.photo-frames--overlap .photo-frames__main {
	width: 80%;
	position: relative;
	z-index: 1;
}

.photo-frames--overlap .photo-frames__secondary {
	width: 50%;
	position: absolute;
	bottom: -2rem;
	z-index: 2;
}

.photo-frames--overlap.photo-frames--offset-right .photo-frames__secondary {
	right: 0;
}

.photo-frames--overlap.photo-frames--offset-left .photo-frames__main {
	margin-left: 20%;
}

.photo-frames--overlap.photo-frames--offset-left .photo-frames__secondary {
	left: 0;
}

@media screen and (max-width: 768px) {
	.photo-frames--overlap .photo-frames__main {
		width: 85%;
	}

	.photo-frames--overlap .photo-frames__secondary {
		width: 40%;
	}

	.photo-frames--overlap.photo-frames--offset-left .photo-frames__main {
		margin-left: 15%;
	}

	.photo-frames--overlap .photo-frames__secondary {
		bottom: -0.5rem;
	}
}