.banner { background-color:#E0E0E0; min-height: 680px; height: fit-content; }
.banner .background { position: absolute; bottom: 0; right: 0; height: 100%; width: 100%; z-index: 0; }
.banner .background img { height: 100%; width: 100%; object-fit: cover; object-position: 50% 50%; }

.banner p, .banner li, .banner p a, .banner span, .banner h2, .banner h3, .banner h4, .banner h5, .banner h6  { color: var(--white); }

.banner .primary-cta { color: var(--white); }
.banner .link-cta.primary-cta::after { background: var(--arrow-white-right) !important; background-repeat: no-repeat !important; background-position: 50% 50%; background-size: contain !important; display: inline-block; height: 13px; width: 15px; margin-right: 0; margin-left: 10px; transition: 0.3s;}
.banner .link-cta.primary-cta:hover::after, .banner .link-cta.primary-cta:focus::after, .banner .link-cta.primary-cta:active::after { margin-left: 15px; }

.banner .list { list-style: none; padding: 0; }
.banner .list li { padding-left: 20px; position: relative; }
.banner .list li::before { content: ""; position: absolute; top: 0; left: 0; height: 100%; width: 1px; background-color: #C09960; }

.banner .side-img { width: 100%; display: block; aspect-ratio: 8/5; position: relative; }
.banner .side-img img { height: 100%; width: 100%; object-fit: cover; object-position: 50% 50%; }


@media (min-width: 768px) {
	.banner .side-img { height: 100%; width: 50%; position: absolute; top: 0; right: 0; z-index: 10; }
}

@media (max-width: 767px) {
	.banner > .h-100 { height: fit-content !important; }
}

@media (max-width: 470px) { 
	.banner .side-img { aspect-ratio: 6/5; }
}