.animated-images-cta {
	position: relative;
}

.animated-images-cta--copy {
	background: #004f6d;
	color: #fff;
}

.animated-images-cta--container {
	padding: 100px 30px;	
}

.animated-images-cta--title {
	margin-bottom: 60px;
}

.animated-images-cta--mosaic {
	display: flex;
	flex-direction: row;
	width: 100%;
	flex-wrap: wrap;
}

.animated-images-cta--image {
	position: relative;
	width: 33.3333%;
}

@media (min-width: 768px) {
	.animated-images-cta--image {
		width: 16.66666%;
	}
}

.animated-images-cta--image:before {
	content: "";
	display: block;
	padding-bottom: 125%;
}

.animated-images-cta--image img {
	position: absolute;
	top: 0;
	left: 0;
	object-fit: cover;
	height: 100%;
	width: 100%;
}

@media (min-width: 768px) {
	
	.animated-images-cta--mosaic {
		grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr; 
		grid-template-rows: 1fr 1fr 1fr; 
		grid-template-areas: 
		". . . . . . ."
		". . . . . . ."
		". . . . . . .";
	}
	
	.animated-images-cta--image:nth-child(n+22) {
		display: none;
	}	
}

.animated-images-cta--image img {
	transition: opacity 0s;
	animation-delay: -5s;
}

@keyframes mosaic22 {
	0% { opacity: 0; }
	30% { opacity: 0; }
	33% { opacity: 1; }
	66% { opacity: 1; }
	70% { opacity: 0; }
	100% { opacity: 0; }
}

@keyframes mosaic32 {
	0% { opacity: 0; }
	33% { opacity: 0; }
	63% { opacity: 0; }
	66% { opacity: 1; }
	97% { opacity: 1; }
	100% { opacity: 0; }
}

.animated-images-cta--image img:nth-child(2) {
	animation-name: mosaic22;
	animation-duration: 15s;
	animation-iteration-count: infinite;
}

.animated-images-cta--image img:nth-child(3) {
	animation-name: mosaic32;
	animation-duration: 15s;
	animation-iteration-count: infinite;
}

.animated-images-cta--image:nth-child(5n+1) img {animation-delay: 3.6s;}
.animated-images-cta--image:nth-child(5n+2) img {animation-delay: 1.3s;}
.animated-images-cta--image:nth-child(5n+3) img {animation-delay: 2.7s;}
.animated-images-cta--image:nth-child(5n+4) img {animation-delay: 1s;}
.animated-images-cta--image:nth-child(15) 	img {animation-delay: 4s;}
.animated-images-cta--image:nth-child(18) 	img {animation-delay: 4s;}
.animated-images-cta--image:nth-child(7) 	img {animation-delay: 2.5s;}

.animated-images-cta--divider-bottom,
.animated-images-cta--divider-top {
	position: absolute;
	z-index: 1;
	font-size: 2.5vw;
    background: #004f6d;
    height: 1em;
    width: 100%;
    clip-path: circle(500vw at 50% 500vw);
	margin-top: calc(-1em + 1px);
}