/* CUSTOMIZE THE CAROUSEL
-------------------------------------------------- */

.carousel-bg {
	background-image: url('/assets/images/carousel_background.jpg');
	background-size: cover;
	border-radius: 0 0 20px 20px;
}

/* Carousel base class */
.carousel {
	margin-bottom: 4rem;
}

/* Since positioning the image, we need to help out the caption */
.carousel-caption {
	bottom: 3rem;
	z-index: 10;
}

.carousel-caption span {
	color: black;
	background-color: #e3f1e3;
	box-shadow: 10px 0 0px 0px #e3f1e3, -10px 0 0px 0px #e3f1e3;
}

/* Declare heights because of positioning of img element */
.carousel-item {
	height: 32rem;
}

.carousel-image {
	object-fit: cover;
}

.carousel-inner {
	border-radius: 20px;
}

.carousel .carousel-control-next-icon {
	height: 50px;
	width: 50px;
	background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-arrow-right-circle-fill" viewBox="0 0 16 16"><path d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0zM4.5 7.5a.5.5 0 0 0 0 1h5.793l-2.147 2.146a.5.5 0 0 0 .708.708l3-3a.5.5 0 0 0 0-.708l-3-3a.5.5 0 1 0-.708.708L10.293 7.5H4.5z"/></svg>');
}

.carousel .carousel-control-prev-icon {
	height: 50px;
	width: 50px;
	background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-arrow-left-circle-fill" viewBox="0 0 16 16"><path d="M8 0a8 8 0 1 0 0 16A8 8 0 0 0 8 0zm3.5 7.5a.5.5 0 0 1 0 1H5.707l2.147 2.146a.5.5 0 0 1-.708.708l-3-3a.5.5 0 0 1 0-.708l3-3a.5.5 0 1 1 .708.708L5.707 7.5H11.5z"/></svg>');
}

/* MARKETING CONTENT
-------------------------------------------------- */

/* Center align the text within the three columns below the carousel */
.marketing .col-lg-4 {
	margin-bottom: 1.5rem;
	text-align: center;
}

.marketing .col-lg-4 p {
	margin-right: .75rem;
	margin-left: 0.53rem;
}

.marketing .img-rounded {
	border-radius: 50%;
}

/* RESPONSIVE CSS
-------------------------------------------------- */

@media (min-width: 40em) {

	/* Bump up size of carousel content */
	.carousel-caption p {
		margin-bottom: 1.25rem;
		font-size: 1.25rem;
		line-height: 1.4;
	}
}

/* Card css */
.card {
	background-color: #e3f1e3;
}

.card img {
	height: 300px;
	width: 100%;
	object-fit: cover;
	object-position: 0px 0px;
}