.credentials {
  margin-top: 8%;
}

.fixed {
  position: absolute;
  width: 30%;
}
.margin-left {
  margin-left: 50%;
}
.ba-logo {
  width: 110px;
  margin-bottom: 5%;
}
.ba-logo-home {
  width: 170px;
  margin-top: 18%;
}

textarea.form-control {
  min-height: calc(9em + 0.75rem + 2px);
}
.margin-top {
  margin-top: 5%;
}
.homeContainer {
  background-image: url(/imgs/home-bg3.jpg);
  background-repeat: no-repeat;
  background-position: center;
}
.align-container {
  display: flex;
  justify-content: center;
  width: 100%;
  height: 100vh;
}
.index-container {
  margin: auto;
  background-color: rgb(255, 255, 255, 0.9);
  border-radius: 15px;
}
.content {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.home-btns {
  display: flex;
  flex-direction: column;
  margin: 18% 0%;
}
.home-btns a {
  margin: 7px 40px;
  border-radius: 30px;
  padding: 13px 150px;
}
.project-type {
  display: flex;
}
.form-select {
  margin-top: 20px;
}
.mt-9 {
  margin-top: 13rem !important;
}
.mt-10 {
  margin-top: 20rem !important;
}
.referenceImg {
  width: 100%;
  height: 25%;
}

/* video-popup */
.video-popup {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.8);
  z-index: 1000;
}

.video-popup-content {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  max-width: 1200px;
  background: #fff;
  padding: 20px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.5);
  border-radius: 10px;
}

.close-btn {
  position: absolute;
  right: 10px;
  top: 5px;
  font-size: 24px;
  cursor: pointer;
  color: #fff;
}

/* phone media queries  */
@media screen and (max-width: 768px) {
  .mt-9 {
    margin-top: 7rem !important;
  }
  .mt-10 {
    margin-top: 17rem !important;
  }
  .fixed {
    position: static;
    width: 100%;
    padding: 20px 40px;
  }
  .margin-left {
    margin-left: 0;
  }

  .full-width.col-7.margin-left {
    width: 100%;
  }
  .mt-5 {
    margin-top: 1rem !important;
  }
  .row.mt-5.mobile {
    display: flex;
    flex-direction: column;
  }

  .mobile {
    width: 95%;
  }
  .row.mt-5.mobile {
    --bs-gutter-x: 0;
    margin: auto;
  }
  li.col-6.justify-content-between.mt-5.mobile-feed {
    width: 100%;
  }
  .home-btns a {
    padding: 13px 118px;
  }
}