/*
 * ---------------------------------------
 * COMMON
 * ---------------------------------------
 */
:root {
  --color-white: #ffffff;
  --color-dark: #272727;
  --color-orange: #d89437;
}

html {
  scroll-behavior: smooth;
}

body {
  background-color: var(--color-dark);
  margin: 0;
}

.text-white {
  color: var(--color-white);
}

.text-dark {
  color: var(--color-dark);
}

.text-orange {
  color: var(--color-orange);
}

/*
 * ---------------------------------------
 * HEADER
 * ---------------------------------------
 */
.navbar-nav .nav-item {
  border-right: 1px solid var(--color-dark);
}

.navbar-nav .nav-item:last-child {
  border-right: 0px;
}

.navbar-collapse.show .navbar-nav .nav-item {
  border-right-color: transparent;
  border-bottom: 1px solid var(--color-dark);
}

.navbar-collapse.show .navbar-nav .nav-item:last-child {
  border-bottom: 0px;
}

.carousel-inner .description {
  width: 100%;
  z-index: 99;
  position: absolute;
  top: 50%;
  left: 2rem;
  transform: translateY(-50%);
}

.carousel-inner .description h1 {
  font-size: 6vw;
}

.carousel-inner .description p {
  font-size: 2.5vw;
}

.ingelegsa-slide-container {
  background-image: url("../img/INGELEGSA_BG_SLIDE.png");
  background-repeat: no-repeat;
  background-size: cover;
}

.ingelegsa-slide-container h2 {
  font-size: 2em;
}

.ingelegsa-slide-container img {
  margin: 1rem 0rem;
}

.ingelegsa-slide-container .ingelegsa-slide {
  text-align: center;
}

.ingelegsa-project p {
  font-size: 3vw;
}

@media only screen and (min-width: 768px) {
  .ingelegsa-slide-container h2 {
    font-size: 3.5vw;
  }
  .ingelegsa-slide-container .ingelegsa-slide {
    text-align: inherit;
  }
  .ingelegsa-slide-container .slide-top img:not(:first-child),
  .ingelegsa-slide-container .slide-bottom img:not(:first-child) {
    margin-left: -35px;
  }
}

.ingelegsa-services-container {
  background-image: url("../img/INGELEGSA_BG_SERVICES.png");
  background-repeat: no-repeat;
  background-size: cover;
}

.ingelegsa-services-container h2 {
  font-size: 2em;
}

.ingelegsa-services-container ul {
  border-left: 1px solid var(--color-orange);
}

.ingelegsa-services-container ul li {
  position: relative;
  list-style: none;
  margin-bottom: 1rem;
}

.ingelegsa-services-container ul li::before {
  content: '';
  position: absolute;
  top: 8px;
  left: -25px;
  width: 8px;
  height: 8px;
  background-color: var(--color-orange);
  border-radius: 50%;
}

@media only screen and (min-width: 768px) {
  .ingelegsa-services-container h2 {
    font-size: 3.5vw;
  }
}

.ingelegsa-brand-container {
  background-image: url("../img/INGELEGSA_BG_FOOTER.png");
  background-repeat: no-repeat;
  background-size: cover;
}

.ingelegsa-brand-container h2 {
  font-size: 1.75em;
}

.ingelegsa-brand-container h3 {
  font-size: 1.5em;
}

.ingelegsa-brand-container .ingelegsa-box {
  border-radius: 15px;
  padding: 1rem;
}

.ingelegsa-brand-container .ingelegsa-box--black {
  background-color: #00000040;
}

.ingelegsa-brand-container img {
  margin-bottom: 1rem;
}

.ingelegsa-brand-container .ingelegsa-line {
  height: 3px;
  /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#d69533+0,00c6ff+100 */
  background: linear-gradient(to right, #d69533 0%, #00c6ff 100%);
  /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}

.ingelegsa-brand-container footer .ingelegsa-icon {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0 0.5em;
}

.ingelegsa-brand-container footer .ingelegsa-icon img {
  margin: 0;
}

.ingelegsa-brand-container footer .ingelegsa-email,
.ingelegsa-brand-container footer .ingelegsa-location {
  font-size: 1em;
}

.ingelegsa-brand-container footer .ingelegsa-waze {
  font-size: 1em;
}

.ingelegsa-brand-container footer form .form-check-label {
  color: var(--color-black);
}

.ingelegsa-brand-container footer form .form-control {
  border: 0px;
  border: 1px solid var(--color-white);
  border-radius: 0px;
  color: var(--color-white);
  background-color: transparent;
  margin-bottom: 1rem;
}

.ingelegsa-brand-container footer form .form-control:hover, .ingelegsa-brand-container footer form .form-control:active, .ingelegsa-brand-container footer form .form-control:focus {
  box-shadow: none;
  outline: none;
}

.ingelegsa-brand-container footer form button {
  background-color: var(--color-orange);
  border: 0px;
  padding: 0.75em 1.75em;
  text-transform: uppercase;
  color: var(--color-dark);
}

@media only screen and (min-width: 768px) {
  .ingelegsa-brand-container h2 {
    font-size: 4vw;
  }
  .ingelegsa-brand-container h3 {
    font-size: 2.25vw;
  }
  .ingelegsa-brand-container footer .ingelegsa-email,
  .ingelegsa-brand-container footer .ingelegsa-location {
    font-size: 2vw;
  }
  .ingelegsa-brand-container footer .ingelegsa-waze {
    font-size: 1.25vw;
  }
  .ingelegsa-brand-container footer .contact-form {
    border-left: 1px solid var(--color-white);
    padding-left: 4rem;
  }
}

/* @include screen($lg) {

} */
