/*
 * GLOBAL STYLES
 */

body {
	padding: 78px 0;
	color: #5a5a5a;
	overflow-y:scroll;
	font-family: 'Khula', sans-serif;
	background-color:#f7f7f7;
}

body>.container {
	/*padding:2rem 0px;*/
	background-color:#ffffff;
}

video::-internal-media-controls-download-button {
    display:none;
}

video::-webkit-media-controls-enclosure {
    overflow:hidden;
}

video::-webkit-media-controls-panel {
    width: calc(100% + 30px); /* Adjust as needed */
}

/*
 * Typography
 */

.nav-link, .featurette-heading, .navbar-light .navbar-brand, .navbar-light .navbar-nav .active>.nav-link {
    font-family: 'PT Serif', serif;
    color:#008080;
}

.navbar-light .navbar-brand {
	font-size:2.25rem
}

/*
 * Full Width Images
 */

.full-width-image {
	height: 400px;
	background-position: center 25%;
	background-repeat: no-repeat;
	background-size:cover;
}

.full-width-image .featurette-heading {
	margin: 0px;
	padding-top:15px;
	padding-right:15px;
}

/*
 * Featurettes
 */

h2.featurette-heading {
	font-size: 50px;
}

h3.featurette-heading {
	font-size: 40px;
}

.featurette-divider {
	margin: 2rem 0; /* Space out the Bootstrap <hr> more */
}

.pricing-divider {
	visibility:hidden;
}

.featurette-heading {
	font-weight: 300;
	line-height: 1;
	letter-spacing: -.05rem;
}

/*
 * Sticky Footer
 */

.footer {
	position: fixed;
	bottom: 0;
	width: 100%;
	/* Set the fixed height of the footer here */
	height: 60px;
	line-height: 60px; /* Vertically center the text there */
	background-color: #f5f5f5;
}

/*
 * CUSTOMIZE THE CAROUSEL
 */

.carousel {
  margin-bottom: 4rem;
}

.carousel-caption {
  z-index: 10;
  bottom: 3rem;
}

.carousel-item {
  height: 32rem;
  background-color: #777;
}
.carousel-item > img {
  position: absolute;
  top: 0;
  left: 0;
  min-width: 100%;
  height: 32rem;
}

.carousel-caption {
	text-shadow:2px 2px #000000;
}

/*
 * RESPONSIVE CSS
 */

@media (min-width: 40em) {
	.featurette-heading h2 {
		font-size: 50px;
	}
}

@media (min-width: 400px) {
	.carousel-item {
		height: 16rem;
	}
	.carousel-item > img {
		height: 23rem;
	}
}

@media (min-width: 992px) {
	.carousel-item {
		height: 32rem;
	}
	.carousel-item > img {
		height: 48rem;
	}
}

@media (min-width: 62em) {
	.featurette-heading {
		margin-top: 3rem;
	}
}

@media (max-width: 991px) {
	.navbar-toggleable-md>.container {
		margin-left:0;
		margin-right:0;
	}
}
