.msa-photo-credit--inline {
	display: block;
	width: fit-content;
	max-width: 100%;
	margin: 6px 0 0;
	color: #5c6770;
	font-size: 13px;
	line-height: 1.4;
	font-style: normal;
	font-weight: 400;
	text-align: start;
	white-space: pre-line;
}

.msa-photo-credit--inline a {
	color: inherit;
	text-decoration: underline;
	text-underline-offset: 2px;
}

.msa-photo-credit a:hover,
.msa-photo-credit a:focus {
	text-decoration-thickness: 2px;
}

/* Banner backgrounds have no <img>, so the credit sits just underneath the section. */
.msa-has-photo-credit > .msa-photo-credit--inline {
	position: absolute;
	top: calc(100% + 4px);
	inset-inline-start: 16px;
	z-index: 2;
	margin-top: 0;
}

.e-loop-item .msa-photo-credit--inline,
.premium-banner .msa-photo-credit--inline {
	font-size: 12px;
	margin-top: 4px;
}

@media (max-width: 767px) {
	.msa-has-photo-credit > .msa-photo-credit--inline {
		inset-inline-start: 10px;
		font-size: 12px;
	}
}
