:root {
  --bs-primary: #13678a !important;
  --bs-secondary: #0dfdff !important;
  /* --bs-tertiary: #012030 !important; */
  --bs-tertiary: #000a26 !important;
  --bs-accent-white: #f2f2f2;
  --bs-accent-blue: #01238d;
}

.bg-primary {
  background-color: var(--bs-primary) !important;
}
.bg-secondary {
  background-color: var(--bs-secondary) !important;
}
.bg-tertiary {
  background-color: var(--bs-tertiary) !important;
}
.bs-tertiary {
  color: var(--bs-tertiary) !important;
}
.text-primary {
  color: var(--bs-primary) !important;
}
.text-secondary {
  color: var(--bs-secondary) !important;
}
.text-tertiary {
  color: var(--bs-tertiary) !important;
}
.btn-secondary {
  color: var(--bs-tertiary) !important;
  background-color: var(--bs-secondary) !important;
  border-color: var(--bs-secondary) !important;
}
.btn-secondary:hover {
  background-color: var(--bs-accent-white) !important;
  border-color: var(--bs-accent-white) !important;
}
.btn-secondary:focus {
  color: #000;
  box-shadow: 0 0 0 0.25rem rgba(13, 253, 255, 0.3);
}
.btn-primary {
  color: var(--bs-accent-white) !important;
  background-color: var(--bs-primary) !important;
  border-color: var(--bs-primary) !important;
}
.btn-primary:hover {
  color: var(--bs-tertiary) !important;
  background-color: var(--bs-accent-white) !important;
  border-color: var(--bs-accent-white) !important;
}
.btn-primary:focus {
  box-shadow: 0 0 0 0.25rem rgba(12, 56, 232, 0.6);
}
.project-content a.text-center {
    cursor: auto;
}
.navbar-brand {
  width: 285px;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.top-link {
  display: flex;
  gap: 10px;
}

ol.carousel-indicators {
  display: none;
}

.carousel-inner {
  height: calc(100vh - 79px);
}

.dd-none {
  display: none !important;
}

.text-min-h {
  min-height: 95px;
}

.services-item.bg-light:hover h4.mb-3 {
  color: #fff !important;
}

.service-icon-wrapper {
  margin-bottom: 20px;
}

.service-icon-wrapper svg {
  max-width: 112px;
}

.service-icon-wrapper svg {
  fill: #0a2c89;
}

.services-item.bg-light:hover .service-icon-wrapper svg {
  fill: var(--bs-secondary);
}

img.footer-logo {
  width: 150px;
}

.services-content::after {
  background: var(--bs-primary) !important;
}

.page-header.about {
  background: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)),
    url(../img/banners/about.jpg) center center no-repeat;
  background-size: cover;
}

.my-5.about-sp {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.d-flex.counter {
  align-items: center;
}

.d-flex.counter h1.me-3.text-secondary.counter-value {
  margin-bottom: 0;
}

.contact-form {
  background-color: var(--bs-tertiary) !important;
}

@media screen and (max-width: 1224px) {
  .carousel-inner {
    height: auto !important;
  }
}

@media screen and (max-width: 500px) {
    div#navbarCollapse .navbar-nav.ms-auto.ms-xl-auto.p-0.gap-2.gap-md-5 {
        padding: 1.5rem 0 !important;!i;!;
        align-items: center;!;
    }
    .contact-detail .flex-shrink-0.btn-square.bg-secondary.rounded-circle {
        display: none;
    }
    .container-fluid.footer.bg-dark.wow.fadeIn a.py-3.text-light.border-bottom.border-primary {
        border-bottom: 0 !important;
    }
    .back-to-top {
        bottom: 80px;
    }
    .project-item .project-img::before, .project-item .project-img::after {
        opacity: 1;
    }
    .project-item .project-content {
        opacity: 1;
        transition: .5s;
    }
}

@media screen and (max-width: 441px) {
  .container.carousel-content a.me-2.btn-left {
    margin-right: 0 !important;
  }
  .container.carousel-content a.me-2.btn-left button {
    margin-bottom: 0.5rem !important;
  }
  .container.carousel-content a.ms-2 {
    margin-left: 0 !important;
  }
  a.h5.contact-email {
    word-break: break-all;
  }
  .contact-detail.position-relative.p-5 {
    padding: 1rem !important;
  }
  .p-5.rounded.contact-form {
    padding: 1rem !important;
  }
  .p-5.rounded.contact-form .mb-4 {
    margin-bottom: 0.75rem !important;
  }
  .p-5.rounded.contact-form button.btn.bg-primary.text-white.py-3.px-5 {
    width: 100%;
  }
  .carousel-control-prev,
  .carousel-control-next {
    width: 60px !important;
  }
}