h1, h2, h3, h4, h5 {
  color: var(--bs-primary);
}

a {
  text-decoration: none;
}

.form-label {
  margin: 0;
  border: 0;
}

:root {
  --bar-width: 25px;
  --bar-height: 2px;
  --hamburger-gap: 8px;
  --foreground: var(--bs-primary);
  --background: var(--bs-primary);
  --hamburger-margin: 8px;
  --animation-timing: 200ms ease-in-out;
  --hamburger-height: calc((var(--bar-height) * 3) + (var(--hamburger-gap) * 2));
}

.hamburger-menu {
  --x-width: calc(var(--hamburger-height)*(sqrt(2)));
  display: flex;
  flex-direction: column;
  gap: var(--hamburger-gap);
  width: max-content;
  top: var(--hamburger-margin);
  left: var(--hamburger-margin);
  z-index: 2;
  cursor: pointer;
}

.hamburger-menu:has(input:checked) {
  --foreground: var(--bs-primary);
  --background: var(--bs-primary);
}

.hamburger-menu:has(input:focus-visible)::before, .hamburger-menu:has(input:focus-visible)::after, .hamburger-menu input:focus-visible {
  border: 1px solid var(--background);
  box-shadow: 0 0 0 1px var(--foreground);
}

.hamburger-menu::before, .hamburger-menu::after, .hamburger-menu input {
  content: "";
  width: var(--bar-width);
  height: var(--bar-height);
  background-color: var(--foreground);
  border-radius: 999px;
  transform-origin: left center;
  transition: opacity var(--animation-timing), width var(--animation-timing), rotate var(--animation-timing), translate var(--animation-timing), background-color var(--animation-timing);
}

.hamburger-menu input {
  appearance: none;
  padding: 0;
  margin: 0;
  outline: none;
  pointer-events: none;
}

.hamburger-menu:has(input:checked)::before {
  rotate: 45deg;
  width: var(--x-width);
  translate: 0 calc(var(--bar-height) / -2);
}

.hamburger-menu:has(input:checked)::after {
  rotate: -45deg;
  width: var(--x-width);
  translate: 0 calc(var(--bar-height) / 2);
}

.hamburger-menu input:checked {
  opacity: 0;
  width: 0;
}

@media (max-width: 767px) {
  #navcol-2 {
    position: absolute;
    top: 75px;
    /*height: calc(100vh - 75px);*/
    left: 0;
    width: 100vw;
    background-color: #f0f0f0;
    text-align: center;
    padding-block: 2rem;
    z-index: 300;
  }
}

.navbar {
  height: 75px;
}

.navbar .nav-link {
  color: var(--bs-primary);
  font-weight: 500;
}

#carousel-1 {
  aspect-ratio: 6 / 4;
  max-height: 500px;
  width: 100%;
}

.div-carousel-j1 {
  position: absolute;
  z-index: 100;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
}

.carousel-item::after {
  content: "";
  height: 100%;
  width: 100%;
  position: absolute;
  background-color: rgba(0,0,0,0.5);
}

.fit-cover {
  object-fit: cover;
}

.fit-contain {
  object-fit: contain;
}

.row-projects-j1 > .col {
  aspect-ratio: 6 / 4;
}

.row-projects-j1 img {
  object-fit: cover;
  aspect-ratio: 6 / 4;
  width: 100%;
  height: 100%;
}

.row-projects-j1 h2 {
  font-size: 1.25rem;
}

@media (max-width: 575px) {
  .row-projects-j1 h2 {
    font-size: 0.85rem;
  }
}

.row-projects-j1 p {
  margin-bottom: 0;
}

@media (max-width: 575px) {
  .row-projects-j1 p {
    font-size: 0.85rem;
  }
}

.con-img-j1 img {
  /*aspect-ratio: 5 / 3;*/
  object-fit: cover;
  width: 100%;
  height: 100%;
  margin-bottom: 5px;
}

.process-sec-j1 li {
  font-size: 0.875rem;
  padding-bottom: 6px;
}

.icon-process-j1 {
  fill: white;
  margin: 20px 0;
  height: 75px;
  width: 75px;
}

.hero-title-j1 {
  letter-spacing: 2px;
}