body {
  padding-bottom: 0rem;
}

.countdown {
	padding:.2em .5em .2em .5em;
	text-align:center;
}

/* Carousel base class */
.carousel {
  margin-bottom: 0rem;
}
.carousel-inner {
  /* added from https://stackoverflow.com/questions/33685259/stretch-and-fill-image-in-bootstrap-carousel */
  /* make sure your .items will get correct height */
  height: 100%;
}
/* Since positioning the image, we need to help out the caption */
.carousel-caption {
  bottom: -2.5rem;
  z-index: 10;
}
.carousel-caption p {
	border-radius: 5px;
	font-weight: bold;
	color: #01467F;
	background-color: rgba(255, 255, 255, 0.7); */
	/*background-color: rgba(94, 151, 51, 0.75); */
}
/* Declare heights because of positioning of img element */
.carousel-item {
  width: 100%;
 	height: 55vh;
	background-size: cover;
	background-position: 50% 50%;
	background-repeat: no-repeat;
}
.carousel-control-container {
	padding:1.35em .25em 1.25em .25em;
	background: black;
}
/* END OF Carousel base class */


.generic-heading {
	background-color: var(--primary);
	background-image: url("/lib2/images/hero_bg.png");
	background-size: 100% 100%;
}

.page-heading {
	color: var(--info);
  font-weight: bold;
}


@media (min-width: 40em) {
  .carousel-caption {
    bottom: 1rem;
  }

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

@media (min-width: 62em) {
  .page-heading {
    margin-top: 0rem;
  }
}