.apollo-documents-carousel {
	margin-top: calc(var(--apollo-spacing-base) * 2);
}
.apollo-documents-carousel.with-first-feature {
	margin-top: 0;
}



.apollo-documents-carousel-item,
.apollo-documents-carousel-item:hover {
	display: block;
	text-decoration: none;
	margin: 5px auto;
	border-radius: var(--apollo-border-radius);
	background: var(--apollo-colour-white);
	overflow: hidden;
	max-width: 550px;
}


.apollo-documents-carousel-item span.image-container {
	display: block;
	width: 100%;
	height: auto;
	padding: 30% 0;
	border-top-left-radius: var(--apollo-border-radius);
	border-top-right-radius: var(--apollo-border-radius);
	background-color: var(--apollo-colour-gallery-bg);
	position: relative;
}
.apollo-documents-carousel-item span.image-container .image,
.apollo-documents-carousel-item span.image-container .overlay {
	display: block;
	position: absolute;
	top: 0;
	left: 5px;
	right: 5px;
	bottom: 0;
	background-size: contain;
	background-position: center center;
	background-repeat: no-repeat;
}

.apollo-documents-carousel-item span.image-container .overlay {
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	border-top-left-radius: var(--apollo-border-radius);
	border-top-right-radius: var(--apollo-border-radius);
	background: transparent;
}
.apollo-documents-carousel-item:hover span.image-container .overlay {
	background: rgba(255, 255, 255, 0.1)
}

.apollo-documents-carousel-item span.image-container .image.type-full {
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-size: cover;
}

.apollo-featured-doc-image {
	display: block;
	width: auto;
	height: auto;
	margin: 0 auto;
	max-height: 400px;
	aspect-ratio: auto;
}