.single-us_portfolio .bs-portfolio__body {
  & .bs-portfolio__data {
    & h3 {
      margin-bottom: 0;
      font-size: 1.2rem;
    }
    & div.w-text {
      margin-bottom: 1rem;
    }
  }
}

:root {
  --bs-portfolio__carousel-top-padding: 10rem;
  --bs-portfolio__carousel-bottom-padding: 10rem;
}

@media (min-width: 350px) {
  :root {
    --bs-portfolio__carousel-top-padding: 10rem;
    --bs-portfolio__carousel-bottom-padding: 14rem;
  }
}
@media (min-width: 401px) and (max-width: 600px) {
  :root {
    --bs-portfolio__carousel-top-padding: 14rem;
    --bs-portfolio__carousel-bottom-padding: 20rem;
  }
}

@media (min-width: 1475px) {
  :root {
    --bs-portfolio__carousel-top-padding: 8rem;
  }
}
.single-us_portfolio {
  & div:has(.bs-portfolio__carousel) {
    /* height: 300px; */
    /* display: flex;
    justify-content: center; */
  }
  & .bs-portfolio__carousel {
    padding-top: var(--bs-portfolio__carousel-top-padding);
    padding-bottom: var(--bs-portfolio__carousel-bottom-padding);
    max-width: 1330px;
    position: relative;
    left: 50%;
    transform: translateX(-50%);

    & .owl-nav {
      display: block !important;
    }

    & .bs-portfolio__mobile-frame {
      position: absolute;
      z-index: 10;
      pointer-events: none;
      width: 365px;
      height: 598px;
      top: -45px;
      left: 50%;
      transform: translateX(-50%);
      right: 495px;
      /* transform: translate(50%, -50%); */
    }
  }
}
@media (max-width: 350px) {
  .single-us_portfolio .bs-portfolio__carousel .bs-portfolio__mobile-frame {
    top: calc(var(--bs-portfolio__carousel-top-padding, 0px) - 100px);
  }
}

@media (min-width: 351px) and (max-width: 400px) {
  .single-us_portfolio .bs-portfolio__carousel .bs-portfolio__mobile-frame {
    top: calc(var(--bs-portfolio__carousel-top-padding, 0px) - 110px);
  }
}
@media (min-width: 401px) and (max-width: 600px) {
  .single-us_portfolio .bs-portfolio__carousel .bs-portfolio__mobile-frame {
    top: calc(var(--bs-portfolio__carousel-top-padding, 0px) - 130px);
  }
}
/* @media (min-width: 451px) and (max-width: 540px) {
  .single-us_portfolio .bs-portfolio__carousel .bs-portfolio__mobile-frame {
    top: calc(var(--bs-portfolio__carousel-top-padding, 0px) - 65px);
  }
} */
/* @media (min-width: 541px) and (max-width: 640px) {
  .single-us_portfolio .bs-portfolio__carousel .bs-portfolio__mobile-frame {
    top: calc(var(--bs-portfolio__carousel-top-padding, 0px) - 72px);
  }
} */
@media (min-width: 601px) and (max-width: 880px) {
  .single-us_portfolio .bs-portfolio__carousel .bs-portfolio__mobile-frame {
    top: calc(var(--bs-portfolio__carousel-top-padding, 0px) - 80px);
  }
}
@media (min-width: 881px) and (max-width: 974px) {
  .single-us_portfolio .bs-portfolio__carousel .bs-portfolio__mobile-frame {
    top: calc(var(--bs-portfolio__carousel-top-padding, 0px) - 120px);
  }
}
@media (min-width: 975px) and (max-width: 1270px) {
  .single-us_portfolio .bs-portfolio__carousel .bs-portfolio__mobile-frame {
    top: calc(var(--bs-portfolio__carousel-top-padding, 0px) - 110px);
  }
}
@media (min-width: 1271px) {
  .single-us_portfolio .bs-portfolio__carousel .bs-portfolio__mobile-frame {
    top: calc(var(--bs-portfolio__carousel-top-padding, 0px) - 125px);
  }
}

@media (max-width: 400px) {
  .single-us_portfolio .bs-portfolio__carousel {
    & .owl-prev,
    & .owl-next {
      top: calc(var(--bs-portfolio__carousel-top-padding, 0px) - 288px);
      left: 50px;
    }
    & .owl-next {
      left: unset !important;
      right: 50px;
    }
  }
}
@media (min-width: 401px) and (max-width: 600px) {
  .single-us_portfolio .bs-portfolio__carousel {
    & .owl-prev,
    & .owl-next {
      top: calc(var(--bs-portfolio__carousel-top-padding, 0px) - 370px);
      left: 50px;
    }
    & .owl-next {
      left: unset !important;
      right: 50px;
    }
  }
}

@media (min-width: 601px) and (max-width: 1475px) {
  .single-us_portfolio .bs-portfolio__carousel {
    & .owl-prev,
    & .owl-next {
      top: calc(var(--bs-portfolio__carousel-top-padding, 0px) - 350px);
      left: 50px;
    }
    & .owl-next {
      left: unset !important;
      right: 50px;
    }
  }
}

@media (max-width: 767px) {
  .single-us_portfolio .bs-portfolio__body {
    & .bs-portfolio__details {
      order: 1;
    }
  }
}

@media (min-width: 1024px) {
  .single-us_portfolio .bs-portfolio__body {
    & .bs-portfolio__data {
      & div.w-text {
        margin-bottom: 1.4rem;
      }
    }
  }
}