@media screen and (max-width: 1760px) {
  .about-section .el-white-circle.third {
    top: 62%;
    left: 40%;
  }
}

@media screen and (max-width: 1570px) {
  .about-section .el-white-circle.third {
    top: 64%;
    left: 41%;
    width: 43vw;
    height: 43vw;
  }
}

@media screen and (max-width: 1500px) {
  .about-section .el-white-circle.third {
    top: 65%;
    left: 42%;
    width: 45vw;
    height: 45vw;
  }
}

@media screen and (max-width: 1440px) {
  .about-section .el-white-circle {
    top: 65%;
  }

  #header-container .nav-ul-container li a {
    font-size: 2.9rem;
  }
}

@media screen and (max-width: 1400px) {
  html,
  body {
    font-size: 13px;
  }

  .cards-grid-container {
    grid-template-columns: repeat(2, minmax(200px, 1fr));
  }

  .card-item {
    min-height: auto;
  }

  .card-item:nth-child(1) {
    top: -5em;
  }

  .card-item:nth-child(2) {
    top: -3em;
  }

  .card-item:nth-child(3) {
    top: 2em;
  }

  .card-item:nth-child(4) {
    top: 3em;
  }

  .address-slider .swiper-slide {
    padding: 3em;
  }

  .el-circle-container {
    padding-bottom: 5em;
  }

  .el-circle-container .div-content {
    margin-top: 0;
  }

  .services-section {
    padding-top: 10em;
    padding-bottom: 10em;
  }

  .about-section h2 {
    color: white;
    margin-bottom: 0.5em;
  }

  .about-section .el-grad-container {
    opacity: 0.5;
  }

  .about-section .el-white-circle {
    display: none;
  }

  .tabs-container {
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 100%;
  }

  .tab-bar {
    width: fit-content;
    flex-direction: row;
    min-height: auto;
    justify-content: center;
    position: relative;
    top: 0;
    transform: none;
  }

  .tabs-container .tab-item-group {
    padding-left: 0;
    display: flex;
    justify-content: center;
    margin-left: 0;
    margin-bottom: 10em;
    z-index: 2;
  }

  .tabs-container .tab-item-group .tab-item .el-circle-2 {
    display: block;
  }

  .div-content h2 {
    padding-bottom: 1em;
  }

  .div-content .el-arrow {
    left: 0;
    width: 100%;
    height: 8em;
    position: relative;
  }
}

@media screen and (max-width: 1200px) {
  .blog-section .blog-item {
    padding-right: 1em;
  }

  .blog-section p {
    margin-right: 0;
  }

  .app-section,
  .app-section .pt-200 {
    padding-top: 5em;
  }

  .app-section,
  .app-section .pb-100 {
    padding-bottom: 0;
  }

  .el-app-container .el-app {
    width: 100%;
  }

  .el-app-container {
    z-index: 1;
    width: 100%;
    height: auto;
    display: flex;
    justify-content: auto;
  }

  .app-section .about-item {
    padding-left: 0;
  }

  .about-section h2 {
    font-size: var(--h3);
  }
}

@media screen and (max-width: 992px) {
  .el-logo-golden {
    max-width: 30em;
  }

  .el-arrow-base,
  .el-arrow-body {
    width: 80vw;
  }

  .el-arrow-point {
    width: 90vw;
  }

  .address-slider {
    height: 100%;
    max-height: 25em;
  }

  .address-slider .swiper-slide,
  .form-container form {
    flex-direction: column;
  }

  .footer-menu ul {
    flex-direction: column;
  }

  .services-header img,
  .about-btr img {
    border-radius: 3em;
    width: 80em;
    max-width: 90vw;
  }

  .services-content .dif-item {
    margin: 2em 0;
  }

  .el-truck-4 img {
    margin-left: 0;
    width: 100%;
  }

  .form-section ul {
    width: 100%;
  }

  .gallery-scroll {
    flex-direction: column;
  }

  .gallery-text-content {
    width: 83.33333333%;
  }

  .gallery-scroll .gallery-content {
    width: 100%;
    overflow-y: scroll;
  }

  .gallery-scroll .gallery-content .gallery-item {
    width: 30rem;
    height: 20rem;
  }

  .gallery-scroll .gallery-content .scroll-content {
    margin-left: 8.33333333%;
  }

  .about2-section .truck2-container h4 {
    font-size: calc(var(--h4) * 1.4);
  }

  .about2-section .truck2-container p {
    margin-right: 0;
  }

  .detail-item,
  .pass-box,
  .status-content table {
    width: 100%;
  }
}

@media screen and (max-width: 768px) {
  html,
  body {
    font-size: 13px;
  }

  #header-container .nav-logo {
    width: 12em;
  }

  .arrow-content {
    top: 25%;
    width: 60vw;
  }

  .form-section .form-item,
  .form-section .form-item .d-flex {
    flex-direction: column;
    align-items: start;
  }

  .form-section .form-item .crt {
    width: 100%;
  }

  .cards-grid-container {
    grid-template-columns: repeat(1, minmax(200px, 1fr));
  }

  .gallery-scroll .gallery-content .gallery-item {
    width: 25rem;
    height: 18rem;
  }
}

@media screen and (max-width: 560px) {
  html,
  body {
    font-size: 12px;
  }

  .header-section .dark-bg {
    height: 16em;
  }

  .blog-header .dark-bg {
    height: 5em;
  }

  .status-container .status-item .status-header {
    gap: 0.5em;
  }

  .tr-status {
    flex-direction: column;
    gap: 0.5em;
  }

  .status-content td:nth-child(2) {
    justify-content: start;
  }
}

@media screen and (max-width: 450px) {
  html,
  body {
    font-size: 11px;
  }
}