/* kdc custom styles */

/* common */

/*
colors
light blue:	#e3eef1 | #e6f2f5 (PMS 7457 35%)
gold: 		#af8d67 | #8c704e (PMS 874)
nav blue: 	#5c6475 | #244b5a (PMS 7477)
dark blue: 	#06262d | #06262d (PMS 5463)
 */

header {
  margin-top: 1rem;
}

.button-desc {
  color: #000;
}

/* override theme styles */

.navbar-brand { 
	margin-bottom: 0.4rem;
}

.navbar-brand-logo {
  max-width: 16em !important;
}

.navbar-light .navbar-nav .nav-link.active,
.navbar-light .navbar-nav .nav-link:focus,
.navbar-light .navbar-nav {
  color: #244b5a; /* #5c6475; */ /* #008060 */
}

  .navbar-light .navbar-nav .nav-link:hover,
  .nav-link:hover,
  .nav-link.text-muted:hover {
	color: #8c704e !important;
	/*font-weight: 500;*/
  }

.nav {
  --bs-nav-link-padding-x: 1rem;
  --bs-nav-link-padding-y: 0.5rem;
  --bs-nav-link-font-weight:;
  --bs-nav-link-color: #244b5a;
  --bs-nav-link-hover-color: #8c704e;
  --bs-nav-link-disabled-color: #000;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  padding-left: 0;
  margin-bottom: 0;
  list-style: none;
}

.nav-item .btn {
  margin: 0.5rem 0;
}

/* higlights */
.list-checked-item {
  color: #000; /* #244b5a */
}

.list-checked-primary .list-checked-item::before {
  background-image: url("data:image/svg+xml,%3csvg width='18' height='18' viewBox='0 0 18 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M13.3035 4.76425C13.5718 4.44865 14.0451 4.41027 14.3607 4.67853C14.6763 4.9468 14.7147 5.42012 14.4464 5.73572L8.07144 13.2357C7.79896 13.5563 7.31616 13.5901 7.00171 13.3105L3.62671 10.3105C3.31713 10.0354 3.28924 9.5613 3.56443 9.25172C3.83962 8.94213 4.31367 8.91424 4.62326 9.18943L7.42515 11.68L13.3035 4.76425Z' fill='%23af8d67'/%3e%3c/svg%3e");
}

.highlights-intro {
  font-size: 1.15rem;
}

/* headings */

h6, .h6, h5, .h5, h4, .h4, h3, .h3, h2, .h2, h1, .h1 {
  color: #8c704e !important;
}

h5,
h5.text-primary {
	color: #8c704e !important;
}

a {
	color: #8c704e;
	text-decoration: none;
}

a:hover {
	color: #8c704e;
}

p a:hover { 
	text-decoration: underline;
}

/* widths */

.w-30-pct {
	width: 30% !important;
}

.w-40-pct {
	width: 40% !important;
}

.w-50-pct {
  width: 50% !important;
}

.w-60-pct {
  width: 60% !important;
}

/* cta */

.btn-cta {
  font-weight: 500 !important;
}

/* footer */
footer {
  color: #244b5a;
}

  footer .navbar-brand-logo {
	width: 100%;
	min-width: 12rem;
	max-width: 12rem;
  }

/* buttons */

.bg-primary-blue {
  --bs-bg-opacity: 1;
  background-color: #e6f2f5 !important;
}

.text-primary-light {
  --bs-text-opacity: 1;
  color: #000 !important;
}

.text-muted {
  --bs-text-opacity: 1;
  color: #333 !important;
}

.btn {
  --bs-btn-padding-x: 1rem;
  --bs-btn-padding-y: 0.6125rem;
  --bs-btn-font-size: 1rem;
  --bs-btn-font-weight: 400;
  --bs-btn-line-height: 1.5;
  --bs-btn-color: #e6f2f5;
  --bs-btn-bg: transparent;
  --bs-btn-border-width: 0.0625rem;
  --bs-btn-border-color: transparent;
  --bs-btn-border-radius: 0.3125rem;
  --bs-btn-hover-border-color: transparent;
  --bs-btn-box-shadow: none !important; /*inset 0 1px 0 rgba(204, 204, 204, 0.15),0 1px 1px rgba(0, 0, 0, 0.075);*/
  --bs-btn-disabled-opacity: 0.65;
  --bs-btn-focus-box-shadow: none !important; /*0 0 0 0 rgba(var(--bs-btn-focus-shadow-rgb), .5);*/
  display: inline-block;
  padding: var(--bs-btn-padding-y) var(--bs-btn-padding-x);
  font-family: var(--bs-btn-font-family);
  font-size: var(--bs-btn-font-size);
  font-weight: var(--bs-btn-font-weight);
  line-height: var(--bs-btn-line-height);
  color: var(--bs-btn-color);
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  border: var(--bs-btn-border-width) solid var(--bs-btn-border-color);
  border-radius: var(--bs-btn-border-radius);
  background-color: var(--bs-btn-bg);
  transition: all .2s ease-in-out;
}

.btn-primary {
  --bs-btn-color: #244b5a;
  --bs-btn-bg: #e6f2f5;
  --bs-btn-border-color: #e6f2f5;
  --bs-btn-hover-color: #244b5a;
  --bs-btn-hover-bg: #e6f2f5;
  --bs-btn-hover-border-color: #e6f2f5;
  --bs-btn-focus-shadow-rgb: none !important; /*204,204,204;*/
  --bs-btn-active-color: #244b5a;
  --bs-btn-active-bg: #e6f2f5;
  --bs-btn-active-border-color: #e6f2f5;
  --bs-btn-active-shadow: none !important; /*inset 0 3px 5px rgba(204, 204, 204, 0.125);*/
  --bs-btn-disabled-color: #244b5a;
  --bs-btn-disabled-bg: #e6f2f5;
  --bs-btn-disabled-border-color: #e6f2f5;
}

.btn-primary {
  font-weight: 500;
}

  .btn-check:focus + .btn-primary, .btn-primary:hover, .btn-primary:focus {
	box-shadow: none; /*0 4px 11px rgba(0, 128, 96, 0.35);*/
  }

.nav-item .btn-primary {
  font-weight: 400;
  min-width: 100px;
}

  .nav-item .btn-primary:hover {
	font-weight: 500;
  }

.btn-secondary {
  --bs-btn-color: #fff;
  --bs-btn-bg: #51596C;
  --bs-btn-border-color: #51596C;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #454c5c;
  --bs-btn-hover-border-color: #414756;
  --bs-btn-focus-shadow-rgb: none !important; /*107,114,130;*/
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #414756;
  --bs-btn-active-border-color: #3d4351;
  --bs-btn-active-shadow: none !important; /*inset 0 3px 5px rgba(0, 0, 0, 0.125);*/
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: #51596C;
  --bs-btn-disabled-border-color: #51596C;
}

/* home feature - essential tool */

.banner-start::after {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  display: block;
  /*background: linear-gradient(to left, rgba(255, 255, 255, 0) 22%, rgba(0, 189, 142, 0.1) 22%);*/
  background: linear-gradient(to left, #ffffff 22%, #e6f2f5 22%);
  content: "";
}

.banner-end::after {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  display: block;
  /*background: linear-gradient(to right, rgba(255, 255, 255, 0) 22%, rgba(0, 189, 142, 0.1) 22%);*/
  background: linear-gradient(to right, #ffffff 22%, #e6f2f5 22%);
  content: "";
}

/* home - cta - support */

.cta-cf-logo {
  margin-top: 0.85rem;
  width: 215px;
}

/* home lead cta */
.home-lead-cta .btn-primary {
  min-width: 170px;
}

/* carousel - testimonials */

.carousel {
  padding-left: 0; /*130px;*/
  padding-right: 0; /*130px;*/
}

.carousel-inner {
  min-height: 270px;
  background-color: #fff;
  border-radius: 30px;
}

.carousel-caption {
  color: #fff;
  font-size: 110%;
  text-align: left;
  position: absolute;
  top: 50%;
  left: 5%;
  right: 5%;
  bottom: 1.25rem;
  padding-top: 1.25rem;
  padding-bottom: 1.25rem;
}

.testimonial-name {
  font-size: 100%;
  font-weight: 500;
}

.carousel-control-prev {
  left: -120px;
}

.carousel-control-next {
  right: -120px;
}

.feature-essential-tool .btn-primary {
  min-width: 150px;
}

p.footer-copyright {
  color: #333;
  font-size: 90%;
}

@media (max-width: 767.98px) {
  .banner-start::after {
	background: linear-gradient(to right, #fff 0%, #e6f2f5 0%);
  }
}

@media (max-width: 767px) {
  .navbar-brand-logo {
	width: 10em;
  }

  footer .navbar-brand-logo {
	width: 100%;
	min-width: 10rem;
	max-width: 10rem;
  }

  .footer-logo {
	margin-bottom: 0 !important;
  }

  p.footer-copyright {
	padding-left: 34px;
	font-size: 90%;
  }

  .banner-start::after {
	/*linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(0, 189, 142, 0.1) 0%);*/
	/*linear-gradient(to left, #fff 22%, #e6f2f5 0%);*/
  }

  .carousel-control-prev {
	left: -85px;
  }

  .carousel-control-next {
	right: -85px;
  }

  footer ul.nav li.nav-item {
	display: block;
	width: 100%;
	text-align: left;
	padding-left: 34px;
  }
		
}

@media (max-width: 1199px) {
	h1,
	h1.display-3 {
		font-size: 2.4rem !important;
		font-weight: 500;
	}
}

@media (min-width: 1200px) {
  h3, .h3 {
	font-size: 1.90rem;
  }
}

@media (min-width: 1200px) {
  /* main heading */
  .display-3 {
	color: #8c704e;
	font-size: 2.75rem;
	font-weight: 500;
  }
}

@media (min-width: 1200px) {
  .lead {
	color: #000; /*244b5a*/
	font-size: 1.25rem;
  }
}

@media (min-width: 1200px) {
  .display-3 {
	color: #8c704e;
	font-size: 2.65rem;
  }
}

.icon-test {
  width: 32px;
}

/* charlie foundation logo */
.sponsors-cf-logo {
	max-width: 100%;
}

/* slideshow container */
.slideshow-container {
	position: relative;
	background: #fff; /* #f1f1f1f1 */
}

  /* slides */
  .slideshow-container .mySlides {
	display: none;
	padding: 80px;
	text-align: left;
  }

  /* next and previous buttons */
  .slideshow-container .prev,
  .slideshow-container .next {
	cursor: pointer;
	position: absolute;
	top: 45%; /* 50% */
	width: auto;
	margin-top: -30px;
	padding: 16px;
	color: #8c704e; /* #888; */
	font-weight: 500;
	font-size: 20px;
	border-radius: 0 3px 3px 0;
	user-select: none;
  }
		
	.carousel-control-next-icon,
	.carousel-control-prev-icon {
		filter: invert(1);
		/* gold #8c704e */
	}

  /* position the 'next button' to the right */
  .slideshow-container .next {
	position: absolute;
	right: 0;
	border-radius: 3px 0 0 3px;
  }
		
  .slideshow-container .prev {
	position: absolute;
	left: 0;
	border-radius: 3px 0 0 3px;
  }

	/* on hover, add a black background color with a little bit see-through */
	.slideshow-container .prev:hover,
	.slideshow-container .next:hover {
	  /* background-color: rgba(0,0,0,0.8); */
	  /* color: white; */
	}

		@media (max-width: 992px) { 
			/* reduce size of testimonials arrows */
			.bi-chevron-left,
			.bi-chevron-right {
				width: 30px;
				height: 30px;
			}
		}

		@media (max-width: 767px) { 
			.slideshow-container .mySlides {
				padding: 40px 60px;
			}
		}

		@media (min-width: 992px) {
			.slideshow-container .prev {
				margin-left: -80px; /* -40px */
			}
			
			.slideshow-container .next { 
				margin-right: -80px; /* -40px */
			}
		}

  /* dot/bullet/indicator container */
  .slideshow-container .dot-container {
	display: none;
	text-align: center;
	padding: 20px;
	background: #ddd;
  }

  /* dots/bullets/indicators */
  .slideshow-container .dot {
	cursor: pointer;
	height: 15px;
	width: 15px;
	margin: 0 2px;
	background-color: #bbb;
	border-radius: 50%;
	display: inline-block;
	transition: background-color 0.6s ease;
  }

	/* active dot/circle */
	.slideshow-container .active,
	.slideshow-container .dot:hover {
	  background-color: #717171;
	}

  .slideshow-container q {
	font-style: normal;
  }

  .slideshow-container .author {
	color: #000;
	font-weight: 600;
	margin-top: 0.5rem;
  }