/* Sun Ads front end. Class names avoid ad-blocker keywords. */

/* Banner: sits above the featured image and fills the main column, so it is
   always exactly as wide as the featured image below it. */
.sp-banner {
	width: 100%;
	max-width: 100%;
	margin: 0 auto 14px;
}
.sp-banner.sp-wait { aspect-ratio: var(--sp-ar, 650/100); }
.sp-banner.sp-empty { display: none; }

.sp-banner-item img,
.sp-tile img {
	display: block;
	width: 100%;
	height: auto;
	margin: 0 auto;
	border: 0;
}
.sp-banner-item a,
.sp-tile a { display: block; }

/* Sidebar tiles */
.sp-side { width: 100%; }
.sp-side.sp-wait { aspect-ratio: var(--sp-ar, 300/300); }
.sp-side.sp-empty { display: none; }
.sp-side-top { margin: 0 0 20px; }
.sp-side-bottom { margin-top: 30px; }
.sp-tile { margin: 0 0 20px; }
.sp-tile:last-child { margin-bottom: 0; }

/* Both tile shapes share the sidebar column; each image keeps its own ratio. */
.sp-tile-tile_tall img { max-width: 100%; }
