.navbar {
	background-color: #4f6d7a;
}

.navbar-brand, .nav-link {
	color: #eaeaea !important;
}

.navbar-brand:hover, .nav-link:hover {
	color: #c0d6df !important;
}

.carousel-caption h4, .carousel-caption p {
	color: #eaeaea;
}

.carousel-control-prev-icon, .carousel-control-next-icon {
	background-color: #dd6e42;
}

.bg-light {
	background-color: #e8dab2 !important;
}

.lead, .display-4, h1, h2, h3, h4, p, a {
	color: #4f6d7a;
}

section {
	background-color: #c0d6df;
}

.btn-primary {
	background-color: #dd6e42;
	border: none;
}

footer {
	background-color: #4f6d7a;
	color: #eaeaea;
}

footer p {
	margin: 0;
}

.form-control {
	background-color: #eaeaea;
	color: #4f6d7a;
	border: 1px solid #4f6d7a;
}

.jumbotron {
	background-color: #fbfaf9;
}

.carousel-caption h3 {
    font-weight: bold;
    font-size: 1.2em; /* small size since this is the default in Bootstrap */
    text-align: center;
}

.carousel-caption p {
    font-size: 1em; /* small size since this is the default in Bootstrap */
    text-align: center;
}
@media (min-width: 576px) { 
  .carousel-caption h4 { font-size: 1.3em;}
  .carousel-caption p {font-size: 1.1em;}
}
@media (min-width: 768px) {
  .carousel-caption h4 { font-size: 1.4em;}
  .carousel-caption p {font-size: 1.2em;}  
}
@media (min-width: 992px) { 
  .carousel-caption h4 { font-size: 1.5em;}
  .carousel-caption p {font-size: 1.3em;}  
}
@media (min-width: 1200px) { 
  .carousel-caption h4 { font-size: 1.6em;}
  .carousel-caption p {font-size: 1.4em;}  
}

.container {
	position: relative;
  }
  
  .anchor {
	position: absolute;
	top: -65px; /* given the fixed header is 50px tall, and you want 15px padding */
	left: 0px;
  }