:root {
	--bs-gray: #d9d9d9;
	--bs-primary: #0C404E;
	--bs-secondary: #81BA98;
	--bs-light: #f2f2f2;
	--bs-dark: #0C404E;
	--bs-tertiary: #887579;
	--bs-primary-rgb: 30, 38, 107;
	--bs-secondary-rgb: 186, 168, 100;
	--bs-light-rgb: 246, 246, 246;
	--bs-dark-rgb: 34, 45, 16;
	--bs-white-rgb: 255, 255, 255;
	--bs-black-rgb: 0, 0, 0;
	--bs-body-rgb: 129, 129, 129;
	--bs-font-sans-serif: "Open Sans", sans-serif;
	--bs-gradient: linear-gradient(135deg, #0e8989, #1b5757);
	--bs-body-font-family: var(--bs-font-sans-serif);
	--bs-body-font-size: 17px;
	--bs-body-font-weight: 400;
	--bs-body-line-height: 1.75;
	--bs-body-color: #2b3232;
	--bs-body-bg: #fff;
	--bs-border-radius: 0px;
	--byf-header-font: "Open Sans", sans-serif;
	--hcm-font-size: 18px;
	--hcm-font-weight: 500;
	--hcm-primary-dark: #1b5757;
	--hcm-secondary-dark: #d88f50;
	--hcm-pop: #f7c69f;
	--hcm-body-color: #1c1f1f;
  }
  
  body.hcm {
	--bs-primary: var(--hcm-primary-dark);
	--bs-secondary: var(--hcm-secondary-dark);
	--bs-tertiary: var(--hcm-pop);
	font-size: var(--hcm-font-size);
  }
  
  /*- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
	a11y Styles
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
.nav-item:last-of-type .nav-link:hover {
    background: #0b4e60;
    padding: 0.75rem 2.125rem;
    font-weight: 500;
    text-transform: uppercase;
    margin-left: 1rem;
    color: var(--bs-white);
}

.nav-link:focus, .nav-link:hover {
    color: #008a9b;
}
  
  #skip-navigation {
	  background: #fff;
	  color: #000;
	  left: 0;
	  padding: 0.5em;
	  position: absolute;
	  top: -1000px;
	  transition: all 0.3s ease;
	  z-index: 11;
  }
  
  a:not(.btn, .nav-link):focus-visible {
	  outline: 2px solid var(--bs-primary);
  }
  
  :is(#footer-top, #footer-bottom) a:not(.btn, .nav-link):focus-visible {
	  outline: 2px solid var(--bs-secondary);
  }
  
  :is(.btn-default, .btn-primary, .btn-secondary):focus-visible {
	  outline: 2px solid var(--bs-primary) !important;
	  outline-offset: 1px;
  }
  
  #hc-toggle {
	  align-items: center;
	  background: var(--bs-primary);
	  border: 2px solid #fff;
	  border-radius: 0rem;
	  bottom: 1rem;
	  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05), 0 2px 2px rgba(0, 0, 0, 0.05), 0 4px 4px rgba(0, 0, 0, 0.05), 0 8px 8px rgba(0, 0, 0, 0.05), 0 16px 16px rgba(0, 0, 0, 0.05);
	  color: #fff;
	  display: flex;
	  font-size: 1.75rem;
	  justify-content: center;
	  height: 3rem;
	  left: 1rem;
	  outline: 0;
	  position: fixed;
	  transition: all 0.3s ease;
	  width: 3rem;
	  cursor: pointer;
	  z-index: 999;
          transform: translateY(-140px);
  }
  
  #hc-toggle i {
	  font-size: 1.75rem;
  }
  
  #hc-toggle:is(:hover, :focus, :focus-visible) {
	  background: #fff;
	  border-color: var(--bs-secondary);
	  color: var(--bs-secondary);
  }
  
  .sr-only {
	  border: 0;
	  clip: rect(0 0 0 0);
	  height: 1px;
	  margin: -1px;
	  overflow: hidden;
	  padding: 0;
	  position: absolute;
	  width: 1px;
  }
  
  .hcm :is(p, a, ul, li):not(.btn, .btn-primary, .btn-secondary) {
	  font-weight: 500;
  }
  
  .hcm :is(a, a:active, a:focus, a:visited) {
	  font-weight: 600;
	  text-decoration: underline;
  }
  
  @media (max-width: 767px) {
	  .sr-only-sm {
		  border: 0;
		  clip: rect(0 0 0 0);
		  height: 1px;
		  margin: -1px;
		  overflow: hidden;
		  padding: 0;
		  position: absolute;
		  width: 1px;
	  }
  }

  /*=====================
	Carousel
	======================*/
.carousel-caption span {
    color: #d8f9f5 !important;
    font-weight: 100;
    font-size: 1.3rem;
}

 #services-overview .row {
  text-align: center;
}

#services-overview .col-md-3 {
  display: flex;
  justify-content: center;
}

#services-overview .service-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

a[href*="about"]:hover {
  background: var(--bs-dark) !important;
  color: #fff !important;
}

#inner-content {
    background: #f7f7f7;
    padding-bottom: 4rem;
    padding: 2rem;
}

#footer {
    padding: 1rem 0 2rem;
    background-image: url(/site_images/valley-background-1.webp);
}

a.btn-dark.btn-lg {
    color: #fff !important;
    text-decoration: none;
}

.carousel-caption a {
    text-decoration: none;
}

#carousel-wrapper {
    width: 100%;
    overflow: hidden;
    transform: translateY(60px);
}

#hero .container {
    max-width: 1920px;
    padding-right: 0rem !important;
    padding-left: 0rem !important;
    padding-top: 1rem;
}

#header-image img,
#carousel-wrapper {
	min-width: 100%;
	position:relative;
	bottom: 60px;
	z-index:1;
}



.carousel img {
    min-width: 100%;
    max-width: none;
    max-height: 500px;
}

.carousel-control {
	opacity: 1;
	width:5%;
}

/* Size and color of slider arrows */
.carousel-control .glyphicon-chevron-left,
.carousel-control .glyphicon-chevron-right {
	display:none;
	width: auto;
	height: 35px;
	font-size: 35px;
	color: #FFF;
}

#carousel-wrapper:hover .carousel-control .glyphicon-chevron-left,
#carousel-wrapper:hover .carousel-control .glyphicon-chevron-right {
	display:inline;
	z-index:100;
}

.carousel-control.left,
.carousel-control.right {
	background-image:none;
}

/* Slider arrow positioning */
.carousel-control .glyphicon-chevron-left {
	position:absolute;
	left: 80px;
}
.carousel-control .glyphicon-chevron-right {
	position:absolute;
	right: 80px;
}

.carousel-caption {
	left:50%;
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	transform: translateX(-50%);
}

a.carousel-button {
	font-family: 'Open Sans', sans-serif;
	font-weight:600;
	font-size:22px;
	color: #FFF;
	background: #00BBD3;
	padding: 16px 28px;
	text-shadow: none;
	-webkit-transition: background 0.3s linear;
	-moz-transition: background 0.3s linear;
	-ms-transition: background 0.3s linear;
	-o-transition: background 0.3s linear;
	transition: background 0.3s linear;
}

a.carousel-button:hover {
	color:#FFF;
	background:#01a3b8;
}

.carousel-caption a {
	animation-delay: .75s;
}

/* - - - - - END CAROUSEL - - - - - */

	.carousel-control .glyphicon-chevron-left,
	.carousel-control .glyphicon-chevron-right {
		width: auto;
		height: 45px;
		font-size: 35px;
	}

	.carousel-control .glyphicon-chevron-left {
		left: 35px;
	}

	.carousel-control .glyphicon-chevron-right {
		right: 35px;
	}



  #carousel-wrapper {
    width: 100%;
    overflow: hidden;
  }
  .carousel-caption {
    background: transparent;
    padding: 30px;
    border-radius: 0px;
  }


.carousel-caption h2 {
    font-size: 2.3rem;
    font-weight: 700;
    text-decoration: none !important;
    line-height: 2.3rem;
    margin-bottom: 0rem !important;
}

  .carousel-caption span {
    color: #007bff;
  }
  .carousel-caption p {
    margin-top: 10px;
    font-size: 1.1rem;
  }


  
  /*=====================
	TYPOGRAPHY/DEFAULT
	======================*/
nav.navbar.navbar-expand-lg.py-1 {
    padding-bottom: 0.7rem !important;
}

#inner-content h2 {
    font-size: 2rem;
}

#inner-content h1 {
    margin-bottom: 1rem;
    font-size: 2.8rem;
}

#footer ul {
    list-style-type: none !important;
}

#inner-content ul {
    list-style-type: "✔\1 \1 " !important;
}

.inner-header .image-container img {
    float: none !important;
    margin-left: 20px;
    width: 500px !important;
}

#hero p {
    margin-right: 2rem;
    margin-left: 2rem;
}

.dropdown-item.active, .dropdown-item:active {
    color: var(--bs-dropdown-link-active-color);
    text-decoration: none;
    background-color: #1d484a;
}

.inner-header .subheading h2 {
    font-size: 2.575rem;
}

#index a:is(:focus, :active) {
    color: var(--bs-primary);
}

  a, a:is(:focus, :active) {
    color: #1e7d83;
}

 a.topbar-link:hover {
    color: #81BA98;
}

  body {
	  overflow-x: hidden;
	  font-size: var(--bs-body-font-size);
  }
  
  h1,
  h2,
  h3,
  h4,
  h5,
  [class*="display-"] {
	  font-family: var(--byf-header-font);
	  font-weight: 500;
  }
  
  h1 {
	  font-size: 3rem;
  }
  
  h2 {
	  font-size: 2.5rem;
  }
  
  h3 {
	  font-size: 2rem;
  }
  
  h4 {
	  font-size: 1.75rem;
  }
  
  [class^="fs-"]:not([class^="fa-"]):not([class*="display-"]) {
	  font-family: var(--bs-font-sans-serif);
  }
  
  .container,
  .container-lg,
  .container-md,
  .container-sm,
  .container-xl,
  .container-xxl {
	  max-width: 1240px;
  }

#hero .btn:hover {
    background: var(--bs-dark) !important;
    color: var(--bs-light) !important;
    border: 0px;
}
  
  #main p,
  #footer p {
	  line-height: var(--bs-body-line-height);
	  font-weight: var(--bs-body-font-weight);
  }
  
  #main {
	  margin-top: -12rem;
	  position: relative;
	  z-index: 99;
  }
  
  #why-choose-us {
	  background: var(--bs-light);
	  padding: 7rem 0 6rem;
  }
  
#inner-content a, a:is(:focus, :active) {
    color: var(--bs-primary);
}

  .btn {
	  border-radius: var(--bs-border-radius);
	  border: 2px solid var(--bs-primary);
	  padding: 0.5rem 2.5rem;
	 }
  
  .bg-light {
	  background-color: var(--bs-light) !important;
  }
  
  .bg-primary {
	  background: var(--bs-primary) !important;
  }
  
  .bg-secondary {
	  background-color: var(--bs-secondary) !important;
  }
  
  .bg-accent {
	background-color: var(--bs-tertiary) !important;
  }
  
  .bg-dark .bg-dark,
  .bg-dark {
	  background-color: var(--bs-dark) !important;
  }
  
  .bg-gray {
	  background: var(--bs-gray) !important;
  }
  
  a,
  a:is(:focus, :active) {
	  color: var(--bs-primary);
  }
  
  a:hover {
	  color: #81BA98;
  }
  
  .text-primary {
	  color: var(--bs-primary) !important;
  }
  
  .text-secondary {
	  color: var(--bs-secondary) !important;
  }
  
  .btn-primary {
	  background: var(--bs-primary);
	color: #fff;
	  border-color: var(--bs-primary);
  }
  
  .btn-primary:hover {
	  color: var(--bs-dark);
	  background-color: transparent;
	  border-color: var(--bs-primary);
  }
  
  .btn-secondary {
	  background: var(--bs-secondary);
	  color: var(--bs-dark);
	  border-color: var(--bs-secondary);
  }
  
  .btn-secondary:hover {
	  background: transparent;
	  color: #fff;
	  border-color: var(--bs-secondary);
  }
  
  #pageContent a {
	  color: var(--bs-primary);
	  font-weight: 600;
	  text-decoration: underline;
  }
  
  #pageContent li {
	  font-weight: 300;
  }
  
  .btn-lg {
	  font-size: 1rem;
	  font-weight: 500;
	  padding: 0.875rem 2rem;
  }
  
  .btn-light {
	  background-color: var(--bs-light);
	  border-color: var(--bs-light);
	  color: var(--bs-dark);
  }
  
  .btn-dark {
	  background-color: var(--bs-dark);
	  border-color: var(--bs-dark);
	  color: var(--bs-light);
  }
  
  .visible-xs {
	  display: none;
  }
  
  .card {
	  display: block;
	  border: 0;
	  border-radius: 0px;
	  box-shadow: 0 4px 6px 0px rgb(0 0 0 / 20%);
  }
  
  .form-control {
	  border: 1px solid #d3d3d3;
	  border-radius: 0px;
	  color: #404040;
	  display: block;
	  font-size: 0.875rem;
	  margin: 5px 0 7px;
	  padding: 0.5rem 0.875rem;
  }
  
  .btn-accent {
	  background-color: var(--bs-tertiary);
	  color: var(--bs-dark);
  }
  
  .btn-accent:hover {
	  background-color: var(--bs-primary);
  }
  
  .btn-dark {
	  background-color: var(--bs-dark);
	  color: var(--bs-light);
  }
  
  .btn-dark:hover {
	  opacity: 0.85;
  }
  
  * .parallax-bg {
    background-position: center center !important;
  }

  .split-bg {
    min-height: 20rem;
    background-repeat: no-repeat;
    background-position: center center;
    -webkit-background-size: cover;
    background-size: cover;
  }

  /* ==================
  Header/Navbar
  =====================*/
.byf-credit {
    color: #fff;
}

#footer .footer-columns a, a:is(:focus, :active) {
    text-decoration: none;
}



#footer-bottom .footer-columns a, a:is(:focus, :active) {
    color: var(--bs-secondary);
}
  
  #topbar {
	  background: var(--bs-dark);
	  color: var(--bs-white);
  }
  
  #topbar ul {
	  display: flex;
	  justify-content: space-between;
	  margin: 0 0 0 auto;
	  align-items: center;
	  padding: 0.25rem 0;
	  flex-wrap: wrap;
	  list-style: none;
	  max-width: 50%;
  }
  
  #topbar li {
	padding-left: 10px;
	text-align: center;
  }
  
  .topbar-link {
	color: var(--bs-white);
	font-weight: 600;
	font-size: 0.9rem;
	text-decoration: none;
	padding-left: 15px;
  }
  
  .navbar-nav {
	align-items: center;
  }
  
  .nav-item {
	padding: 0 1rem 0 0;
  }
  
  .nav-item:last-of-type .nav-link {
	background: var(--bs-dark);
	padding: 0.75rem 2.125rem;
	font-weight: 500;
	text-transform: uppercase;
	margin-left: 1rem;
	color: var(--bs-white);
	}

.nav-link {
    color: var(--bs-dark);
}
  
 
  
  .topbar-link iconify-icon {
	color: var(--bs-white);
	margin-right: 5px;
	top: 3px;
	position: relative;
  }
  
  .branding {
	  font-weight: bold;
	  font-size: 1.2rem;
  }
  
  #top-nav a {
	  margin-left: 1rem;
	  text-decoration: none;
	  color: var(--byf-dark);
	  font-weight: 600;
	  transition: color 0.3s ease;
  }
  
  #top-nav a.button {
	  background: var(--byf-accent);
	  color: var(--byf-dark);
	  padding: 0.5rem 1rem;
	  border-radius: 0px;
  }
  
  #top-nav a:hover {
	  color: #d98047;
  }
  
  /* ==================
  Hero Section
  =====================*/
  
  #hero {
	  background: var(--bs-white);
	  padding: 0rem 0 0;
	color: #fcf0e7;
  }

  #hero .btn {
	background: #fff;
	color: var(--bs-dark);
        transition: background-color 0.1s ease-in-out, transform 0.1s ease-in-out;
  }
  
  #hero .heading {
	color: var(--bs-light);
  }
  
  #hero .heading .bold {
	font-weight: 600;
  }
  
  .hero-image {
	max-width: 100%;
  }

  #hero .hero-text {
	padding: 3rem 0 5rem;
  }

  #hero .hero-text h1 {
	font-size: 2.5rem;
	line-height: 1.25;
	margin-bottom: 1rem;
	}

  .hero-text h1 span {
	color: var(--bs-secondary);
	font-style: italic;
	display: block;
  }

  #hero .hero-testimonial {
	background: var(--bs-secondary);
  }

  #hero .carousel-item .col-md-8 {
	position: relative;
	padding: 0;
  }

  #hero .arrow-box {
    position: absolute;
    left: 0;
    bottom: 0;
    background: var(--bs-dark);
    z-index: 999;
    height: 100px;
    width: 70px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.carousel-control-next, .carousel-control-prev {
    top: 0;
    bottom: 0;
	position: relative;
    z-index: 1;
    align-items: center;
    justify-content: center;
	width: 100%;
    padding: 0;
    color: #fff;
    text-align: center;
    border: 0;
    opacity: 1;
}
.carousel-control-next-icon, .carousel-control-prev-icon {
    width: 21px;
    height: 32px;
    background-position: 50%;
    background-size: 100% 100%;
}

  /* ==================
 Services Section
  =====================*/
  
  #services-overview {
	padding: 2rem 0;
  }

  #services-overview .service-card {
	text-align: center;
	padding: 0 2rem;
	border-right: 1px solid var(--bs-dark);
  }

  #services-overview .col-md-3:last-child .service-card {
	border-right: none;
  }

  .service-card h3 {
	text-decoration: none;
	color: var(--bs-dark);
	font-size: 1.5rem;
  }

  .service-card iconify-icon {
	margin-bottom: 1rem;
  }

  .service-card a {
	text-decoration: none;
	text-align: center;
  }
  
  
  /* ==================
  Index Section
  =====================*/
  


#index h2 {
    color: var(--bs-primary) !important;
    font-size: 2rem !important;
    font-weight: 700;
    margin-bottom: 1rem;
}
  
#index .subtitle {
    font-size: 1.25rem;
    margin-bottom: 1rem;
    color: var(--bs-dark);
}

	#index .content {
		background: var(--bs-gray);
		padding: 4rem 7rem 5rem 5rem;
	}

    #index .split-bg {
        background-image: url('/site_images/Aaron--Tim-2.jpg');
    }

	#index .btn-primary {
		margin-top: 3rem;
	}

  /* ==================
  Industries Section
  =====================*/
  
  #industries .split-bg {
        background-image: url('/site_images/home2-1.png');
	}
  
	#industries .content {
		padding: 3rem 5rem;
		background: var(--bs-light);
	}

	#industries h2 {
		color: var(--bs-primary);
	}

	  
  #industries .subtitle {
	font-family: var(--byf-header-font);
	font-size: 1.25rem;
	margin-bottom: 1rem;
	color: var(--bs-dark);
	}

	.industry-list {
		list-style: none;
		margin: 2rem 0;
		padding-left: 0;
	}

	.industry-list li {
		padding: 1.5rem 0;
		font-size: 1.5rem;
		font-family: var(--byf-header-font);
		font-weight: 400;
		border-bottom: 2px solid var(--bs-dark);
	}

	.industry-list li:last-child {
		border-bottom: none;
	}
  /* ==================
  Inner Pages
  =====================*/
  
  #inner-hero {
	background: var(--bs-primary);
	color: #fefefe;
  }
  
  #inner-hero h1 {
	font-size: 3rem;
	color: var(--bs-light);
	padding-left: 0;
	}

  #inner-hero .hero-text {
	max-width: 1280px;
	margin: 0 auto;
	text-align: left;
	padding: 4rem 0;
	}

  #inner-content .inner-header {
	padding: 2rem 0 3rem;
  }



  #inner-content h3 {
	margin-bottom: 1rem;
  }



#inner-content ul {
    list-style: none;
    margin-top: 1rem;
    padding-left: 0;
    margin-left: 1.5rem;
}

  .inner-header .col-md-6:nth-child(1) {
	padding: 3rem 5rem 2rem 0;
	border-right: 2px solid var(--bs-dark);
  }
  


#inner-cta {
    text-align: center;
    background-image: url(/site_images/Untitled-2-1.png);
    padding: 4rem 0;
    background-size: cover;

}

  #inner-cta .container {
	max-width: 975px;
  }
  
  #inner-cta h2 {
	font-size: 3.25rem;
	margin-bottom: 1.5rem;
	font-weight: 400;
	color: var(--bs-light);
	}

	#inner-cta p {
		color: #fefefe;
	}
  
  
  /* ==================
  About Section
  =====================*/
  
  #about .subtitle {
	 font-size: 1.5rem;
	 color: var(--bs-light);
	 text-transform: uppercase;
	 margin-bottom: 0.5rem;
  }
  
  #about p {
	color: var(--bs-light);
	font-size: 1.05rem;
  }
  
  #about h2 {
	margin-bottom: 1.5rem;
	font-weight: 500;
  }
  
  #about img {
	border-radius: 0px;
	box-shadow: 4px 4px 0 #212121;
	width: 100%;
  }
  
  /* ==================
  Services Section
  =====================*/
  
  #services .card {
	background: rgba(var(--bs-primary-rgb), 0.2);
	color: var(--bs-primary);
	text-align: center;
	padding: 1rem 1.25rem;
	margin: 1rem 0;
  }
  
  #services .subtitle {
	color: var(--bs-primary);
	font-size: 1.25rem;
	text-transform: uppercase;
	text-align: center;
  }
  
  #services .card iconify-icon {
	margin: 1rem auto;
  }
  
  #services .card h3 {
	font-size: 1.25rem;
  }
  
  /* ==================
  CTA
  =====================*/
  
#cta {
    text-align: center;
    background-image: url(/site_images/Untitled-2-1.png);
    padding: 4rem 0;
    background-size: cover;

}



  #cta .container {
	max-width: 975px;
  }

  #cta h2 {
	font-size: 3.25rem;
	margin-bottom: 3rem;
  }

  #cta p {
	font-size: 1.1rem;
	margin-bottom: 3rem;
  }

  /* ==================
  FAQS
  =====================*/
  
#faqs {
	background: var(--bs-secondary);
	padding: 3rem 0 5rem;
	text-align: center;
}

#faqs h2 {
	font-size: 3.25rem;
	color: #fff;
	margin-bottom: 2rem;
}

#faqs .accordion-item {
	margin: 0.75rem 0;
}
  
  /* ==================
  Pricing Packages
  =====================*/
  
  #pricing {
	background: var(--bs-light);
	padding: 3rem 0;
	text-align: center;
	}
  
  #pricing .subtitle {
	text-transform: uppercase;
	color: var(--bs-primary);
	font-size: 1.5rem;
  }
  
  #pricing h2 {
	margin-bottom: 2rem;
  }
  
  .pricing-tiers {
	  display: flex;
	  flex-wrap: wrap;
	  justify-content: center;
	 }

  .pricing-tiers .bronze{
	background: rgba(var(--bs-secondary-rgb), 0.5);
  }

    .pricing-tiers .silver {
background: var(--bs-gray);
	}
  
  .tier .body {
	padding: 0 2rem;
  }
  
  .tier p {
	line-height: 1.85;
  }
  
  .tier .btn {
	position: relative;
	display: inline-block;
	margin: 0 auto;
	width: 235px;
	text-align: center;
	}
  
  .tier {
	background: var(--bs-secondary);
	position: relative;
	min-height: 450px;
	width: 90%;
	box-shadow: 0px 2px 17px -10px #212121;
}
  
  .tier ul {
	margin: 2.5rem 0 5rem;
	text-align: left;
	}
  
  .tier h3 {
	  margin-bottom: 0.75rem;
	  text-align: center;
	  font-size: 1.75rem;
	  font-weight: 400;
	  background: var(--bs-primary);
	  color: #ededed;
	  padding: 1.35rem 0;
	 }

/* ==================
Affiliates
=====================*/


	 #affiliates .carousel-item {
		text-align: center;
	 }

	 #affiliates .affiliate {
		max-width: 200px;
		margin: 1rem 2rem;
	 }
  
	 #affiliates {
		padding: 1rem 0;
	 }


/* ==================
  Testimonials
  =====================*/

  #testimonials {
	background: var(--bs-gray);
	padding: 5rem 0 6rem;
	text-align: center;
  }

  #testimonials .subtitle {
	font-family: var(--byf-header-font);
  }

  #testimonials .container {
	max-width: 975px;
  }

  #testimonials h2 {
	font-size: 3.25rem;
	color: var(--bs-primary);
	margin-bottom: 3rem;
  }

  #testimonials p {
	font-size: 1.1rem;
  }


  /* ==================
  Blog Feed
  =====================*/

  #blog-feed {
	padding: 6rem 0 7rem;
  }

  #blog-feed h2 {
	text-align: center;
	margin-bottom: 2rem;
  }

  #blog-feed h3 {
    font-size: 1.5rem;
    color: var(--bs-dark);
    margin: 2rem 0;
  }

  .blog-post .excerpt {
	border-top: 3px solid var(--bs-dark);
	padding: 2rem 0;
  }

  .blog-post .post-img {
	max-height: 200px;
	overflow: hidden;
  }

  .post-img img {
	width: 100%;
  }

  .excerpt {
	max-height: 400px;
	text-overflow: ellipsis;
  }

  /* ==================
  Footer
  =====================*/
  
  #footer {
	padding: 1rem 0 2rem;
  }

  #footer::before {
	content: "";
	width: 50rem;
	height: 1px;
	background: #ededed;
	display: block;
	margin: 1rem auto 3rem;
	text-align: center;
	}

  #footer h4 {
	font-size: 1.15rem;
	font-weight: 800;
	margin-bottom: 1.25rem;
  }



#footer :is(li, p, a) {
    font-size: 0.925rem;
    margin: 0.25rem 0;
    color: #efefef;
    text-decoration: none;
}

  #footer .footer-columns {
	display: flex;
	padding-bottom: 2rem;
	border-bottom: none;
	}

  #footer .footer-column {
	flex-basis: 20%;
	color: #efefef;
	padding-right: 1.5rem;
	padding-left: 1.5rem;
	}

  
  #footer {
	position: relative;
  }
  
  #footer ul {
	list-style: none;
	padding-left: 0;
	justify-content: space-between;
	}
  
	.footer-bottom {
		padding: 2rem 0 0;
		text-align: center;
	}

	.copyright {
		color: #efefef;
		margin-bottom: 0;
	}

  .footer-menu a {
	text-decoration: none;
	font-weight: 500;
  }

  .social-media a {
	font-weight: 500;
	text-transform: uppercase;
	padding-bottom: 0.25rem;
	text-decoration: none;
	border-bottom: 1px solid var(--bs-primary);
  }
  
  /* ==================
  Media Queries
  =====================*/
  
  @media (max-width: 1024px) {
	  .top-bar {
		  flex-direction: column;
		  align-items: flex-start;
	  }
  
	  .top-nav {
		  display: flex;
		  flex-wrap: wrap;
		  gap: 0.5rem;
	  }
  }
  
  @media (max-width: 768px) {
	  .services-overview,
	  .pricing-tiers,
	  .about,
	  .footer-columns {
		  flex-direction: column;
		  align-items: center;
	  }
  
	  .service-card,
	  .tier {
		  width: 90%;
	  }
  
	  .hero {
		  padding: 2rem 1rem;
	  }
  
	  .about .image,
	  .about .content {
		  width: 100%;
	  }
  
	  .top-nav a {
		  margin-left: 0;
	  }
  }
  
  @media (max-width: 480px) {
	  body {
		  font-size: 15px;
	  }
  
	  h1 {
		  font-size: 1.75rem;
	  }
  
	  .btn {
		  padding: 0.5rem;
		  font-size: 0.9rem;
	  }
  }


  /* ==================
   Mobile Overrides
  =====================*/
body {
  overflow-x: hidden !important;
}

.container-fluid {
  overflow-x: hidden !important;
}

#topbar ul {
  max-width: none !important;
  gap: 0.5rem;
}

@media (max-width: 576px) {
  #topbar ul {
    justify-content: center !important;
    font-size: 0.85rem;
  }
  
  #topbar li {
    padding-left: 5px;
  }
  
  .topbar-link {
    font-size: 0.8rem;
  }
}

.navbar {
  background: white !important;
}

.navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%280, 0, 0, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !important;
}

@media (max-width: 991px) {
  .navbar-brand img {
    max-width: 160px !important;
  }
  
  #topbar ul {
    justify-content: center !important;
  }
}

#carousel-wrapper {
  transform: none !important;
  bottom: auto !important;
  position: relative !important;
}

#header-image img,
#carousel-wrapper {
  bottom: auto !important;
  position: relative !important;
}

.carousel img,
.carousel-item img {
  width: 100% !important;
  height: auto !important;
  min-height: 300px !important;
  max-height: 500px !important;
  object-fit: cover !important;
  object-position: center !important;
  min-width: 100% !important;
  max-width: none !important;
}

@media (max-width: 768px) {
  .carousel img,
  .carousel-item img {
    min-height: 250px !important;
    max-height: 400px !important;
  }
}

@media (max-width: 576px) {
  .carousel img,
  .carousel-item img {
    min-height: 200px !important;
    max-height: 350px !important;
  }
}

.carousel-control-prev,
.carousel-control-next {
  width: 60px !important;
  position: absolute !important;
  opacity: 0.8 !important;
}

.carousel-control .glyphicon-chevron-left,
.carousel-control .glyphicon-chevron-right,
.carousel-control.left,
.carousel-control.right {
  display: none !important;
}

.carousel-caption {
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  top: 50% !important;
  right: auto !important;
  bottom: auto !important;
  width: 90% !important;
  max-width: 700px !important;
}

@media (max-width: 768px) {
  .carousel-caption h2 {
    font-size: 1.75rem !important;
    line-height: 1.9rem !important;
  }
  
  .carousel-caption p {
    font-size: 1rem !important;
  }
  
  .carousel-caption > div,
  .carousel-caption [style*="padding"] {
    padding: 25px 20px !important;
  }
}

@media (max-width: 576px) {
  .carousel-caption h2 {
    font-size: 1.4rem !important;
    line-height: 1.6rem !important;
    margin-bottom: 0.5rem !important;
  }
  
  .carousel-caption p {
    font-size: 0.9rem !important;
    margin-bottom: 15px !important;
  }
  
  .carousel-caption > div,
  .carousel-caption [style*="padding"] {
    padding: 20px 15px !important;
  }
  
  .carousel-caption a {
    font-size: 0.9rem !important;
    padding: 8px 18px !important;
  }
}

@media (max-width: 767px) {
  #services-overview .service-card {
    border-right: none !important;
    border-bottom: 1px solid var(--bs-gray) !important;
    padding: 1.5rem 0 !important;
  }
  
  #services-overview .col-sm-12:last-child .service-card,
  #services-overview .col-md-3:last-child .service-card {
    border-bottom: none !important;
  }
  
  .service-card h5 {
    font-size: 1.1rem;
  }
}

@media (max-width: 991px) {
  #index .content {
    padding: 3rem 2rem !important;
    text-align: center !important;
  }
}

@media (max-width: 767px) {
  #index .content {
    padding: 2rem 1.25rem !important;
    text-align: center !important;
  }
  
  #index h1 {
    font-size: 2rem !important;
  }
  
  #index h2 {
    font-size: 1.75rem !important;
  }
  
  #index .split-bg {
    min-height: 15rem !important;
  }
}

@media (max-width: 576px) {
  #index .content {
    padding: 1.5rem 1rem !important;
    text-align: center !important;
  }
  
  #index h1 {
    font-size: 1.75rem !important;
  }
  
  #index h2 {
    font-size: 1.5rem !important;
  }
}

@media (max-width: 991px) {
  #cta {
    text-align: center !important;
  }
  
  #inner-cta {
    text-align: center !important;
  }
  
  .lead-magnet,
  #cta .lead-magnet,
  [style*="padding: 4rem 6rem"] {
    padding: 3rem 2rem !important;
    text-align: center !important;
  }
}

@media (max-width: 767px) {
  #cta {
    text-align: center !important;
  }
  
  .lead-magnet,
  #cta .lead-magnet,
  [style*="padding: 4rem 6rem"] {
    padding: 2.5rem 1.5rem !important;
    text-align: center !important;
  }
  
  .lead-text {
    margin-right: 0 !important;
    text-align: center !important;
  }
}

@media (max-width: 576px) {
  #cta {
    text-align: center !important;
  }
  
  .lead-magnet,
  #cta .lead-magnet,
  [style*="padding: 4rem 6rem"] {
    padding: 2rem 1.25rem !important;
    text-align: center !important;
  }
  
  .lead-magnet h2 {
    font-size: 1.75rem !important;
  }
  
  .lead-magnet p {
    font-size: 1rem !important;
  }
  

}

@media (max-width: 991px) {
  #pricing [style*="transform: scale"] {
    transform: none !important;
  }
}

@media (max-width: 767px) {
  #pricing [style*="display: flex"][style*="flex-wrap: wrap"] {
    gap: 20px !important;
  }
  
  #pricing [style*="flex: 1"],
  #pricing [style*="min-width: 280px"],
  #pricing [style*="min-width: 300px"] {
    flex: 1 1 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }
}

@media (max-width: 576px) {
  #pricing [style*="display: flex"][style*="flex-wrap: wrap"] {
    gap: 16px !important;
    padding: 0 10px;
  }
  
  #pricing h1 {
    font-size: 2rem !important;
  }
  
  #pricing h3 {
    font-size: 1.25rem !important;
  }
}

@media (max-width: 767px) {
  #testimonials h1 {
    font-size: 2.5rem !important;
  }
  
  #testimonials [style*="grid-template-columns"] {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 576px) {
  #testimonials h1 {
    font-size: 2rem !important;
  }
}

@media (max-width: 767px) {
  #inner-content .inner-header .col-md-6:nth-child(1) {
    padding: 2rem 1rem !important;
    border-right: none !important;
    border-bottom: 2px solid var(--bs-dark) !important;
  }
  
  #inner-hero h1 {
    font-size: 2.25rem !important;
  }
  
  #inner-hero .hero-text {
    padding: 2rem 0 !important;
  }
  
  #inner-cta {
    text-align: center !important;
  }
  
  #inner-cta h2 {
    font-size: 2.25rem !important;
  }
}

@media (max-width: 576px) {
  #inner-content h1 {
    font-size: 2rem !important;
  }
  
  #inner-content h2 {
    font-size: 1.5rem !important;
  }
  
  #inner-hero h1 {
    font-size: 1.85rem !important;
  }
  
  #inner-cta {
    text-align: center !important;
  }
  
  #inner-cta h2 {
    font-size: 1.85rem !important;
  }
}

@media (max-width: 991px) {
  #footer .footer-columns {
    flex-direction: column;
  }
  
  #footer .footer-column {
    flex: 1 1 100% !important;
    max-width: 100% !important;
    margin-bottom: 1.5rem;
    text-align: center !important;
  }
}

@media (max-width: 576px) {
  #footer {
    padding: 2rem 0 1rem !important;
    text-align: center !important;
  }
  
  #footer h4 {
    font-size: 1rem !important;
  }
  
  #footer p,
  #footer li,
  #footer a {
    font-size: 0.875rem !important;
  }
  
  #footer ul {
    padding-left: 0 !important;
  }
  
  .footer-bottom {
    flex-direction: column !important;
    text-align: center !important;
  }
  
  .byf-credit,
  .byf-link {
    margin-left: 0 !important;
    margin-top: 0.5rem;
  }
}

@media (max-width: 576px) {
  .btn,
  .btn-primary,
  .btn-secondary,
  .btn-lg {
    padding: 0.625rem 1.5rem !important;
    font-size: 0.95rem !important;
  }
}

@media (max-width: 576px) {
  body {
    font-size: 16px !important;
  }
  
  h1 {
    font-size: 2rem !important;
  }
  
  h2 {
    font-size: 1.75rem !important;
  }
  
  h3 {
    font-size: 1.5rem !important;
  }
  
  h4 {
    font-size: 1.25rem !important;
  }
  
  p {
    font-size: 1rem !important;
  }
}

@media (max-width: 767px) {
  section,
  .container,
  .container-fluid,
  .row {
    overflow-x: hidden !important;
  }
}

  /* ==================
   Carousel
  =====================*/
 /* Base styles */
#carousel-wrapper {
  width: 100%;
  overflow: hidden;
}

.carousel-item img {
  height: 600px;
  object-fit: cover;
}

/* Mobile Responsive Styles */
@media (max-width: 768px) {
  .carousel-item img {
    height: 300px;
  }

  .carousel-caption {
    max-width: 95% !important;
    width: 95% !important;
  }

  .carousel-caption > div {
    padding: 20px 15px !important;
  }

  .carousel-caption h2 {
    font-size: 1.3rem !important;
    margin-bottom: 5px !important;
    line-height: 1.3;
  }

  .carousel-caption p {
    font-size: 0.85rem !important;
    margin-bottom: 12px !important;
    line-height: 1.4;
  }

  .carousel-caption a {
    padding: 8px 18px !important;
    font-size: 0.85rem !important;
  }

  .carousel-control-prev,
  .carousel-control-next {
    width: 35px !important;
    height: 35px !important;
  }

  .carousel-control-prev {
    left: 5px !important;
  }

  .carousel-control-next {
    right: 5px !important;
  }

  .carousel-control-prev-icon,
  .carousel-control-next-icon {
    width: 20px;
    height: 20px;
    background-size: 100% !important;
  }
}

@media (max-width: 480px) {
  .carousel-item img {
    height: 280px;
  }

  .carousel-caption > div {
    padding: 15px 12px !important;
    backdrop-filter: blur(6px) !important;
    -webkit-backdrop-filter: blur(6px) !important;
  }

  .carousel-caption h2 {
    font-size: 1.1rem !important;
    margin-bottom: 3px !important;
    letter-spacing: 0.5px !important;
    line-height: 1.2;
  }

  .carousel-caption p {
    font-size: 0.75rem !important;
    margin-bottom: 10px !important;
    line-height: 1.3;
  }

  .carousel-caption a {
    padding: 7px 16px !important;
    font-size: 0.8rem !important;
  }
}



/* Base layout */
#services-overview .row {
  text-align: center;
}

#services-overview .col-md-3 {
  display: flex;
  justify-content: center;
  align-items: stretch;
  position: relative; /* needed for pseudo border */
  padding: 0 2rem;
}

/* Remove border from the card entirely */
#services-overview .service-card {
  text-align: center;
  border: none !important;
  padding: 0;
}

/* DESKTOP: vertical border on the column itself */
@media (min-width: 768px) {
  #services-overview .col-md-3:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 15%;
    bottom: 15%;
    right: 0;
    width: 1px;
    background-color: var(--bs-gray);
  }
}

/* MOBILE: bottom border between stacked items */
@media (max-width: 767.98px) {
  #services-overview .col-md-3::after {
    content: "";
    position: absolute;
    left: 10%;
    right: 10%;
    bottom: 0;
    height: 1px;
    background-color: var(--bs-gray);
  }

  #services-overview .col-md-3:last-child::after {
    display: none;
  }

  #services-overview .col-md-3 {
    padding: 1.25rem 0;
  }
}

@media (max-width: 768px) {
  .page-content img[style*="float: left"],
  #inner-content img[style*="float: left"] {
    float: none !important;
    display: block;
    margin: 0 auto 1rem !important; 
    width: min(100%, 360px) !important; 
  }
}

@media (max-width: 576px) {
  #inner-cta .lead-magnet {
    padding: 1.5rem 1.25rem !important;
  }
  #inner-cta .lead-magnet h2 {
    font-size: 1.75rem !important;
  }
  #inner-cta .lead-magnet p {
    font-size: 1rem !important;
  }

  .navbar-toggler {
    transform: translateX(8rem);
  }
  #hero .btn {
      margin-bottom: 3rem;
  }
}


#hero .btn {
    background: #fff;
    color: var(--bs-dark);
    transition: background-color 0.1s 
ease-in-out, transform 0.1s 
ease-in-out;
    margin-bottom: 3rem;
}