.custom-link li {
  list-style: none;
}

.nav-item1::before {
  background-color: #6A18D2;
  height: 4px;
  width: 80px;
  content: '';
  display: block;
  margin-right: 16px;
  transform: scaleX(0);
  transition: transform 250ms ease-in;
}

.nav-item1:hover::before {
  transform: scaleX(1);
}

.nav-item1 {
  display: flex;
  align-items: center;
}

.social-icons-block {
  margin-top: 35px;
}

.navbar1 {
  position: fixed;
  padding: 20px 120px;
  z-index: 160;
  width: 100%;
  /*background-color: rgba(0,0,0,0.2);*/
}

.social-icons-block ul {
  display: flex;
  padding: 20px 96px;
  gap: 20px;
  position: absolute;
  bottom: 70px;
  /*align-items: center;*/
  /*justify-content: center;*/
}

.social-icons-block ul li a {
  background: #878787;
  width: 45px;
  height: 45px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff !important;
  border-radius: 50%;
  text-decoration: none;
}

.social-icons-block ul li a:hover {
  background-color: #6A18D2;
  color: #fff !important;
}

/* .custom-link {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 60px;
  margin-bottom: 0px;
  padding: 50px 0px;
} */

.hamburger-menu {
  cursor: pointer;
  z-index: 100;
}

.bar {
  display: block;
  width: 25px;
  height: 3px;
  margin: 5px auto;
  background: #ffffff;
  transition: all 0.3s ease-in-out;
}

.bar.active-bg {
  background: #6A18D2;
}

.overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.85);
  z-index: 150;
  display: none;
}

.overlay.active {
  display: block;
}

.hamburger-menu.active .bar:nth-child(2) {
  opacity: 0;
}

.hamburger-menu.active .bar:nth-child(1) {
  transform: translateY(8px) rotate(45deg);
  background: #000;
}

.hamburger-menu.active .bar:nth-child(3) {
  transform: translateY(-8px) rotate(-45deg);
  background: #000;
}

.custom-link {
  position: fixed;
  right: -100%;
  top: 0px;
  gap: 0;
  flex-direction: column;
  background: #fff;
  width: 50%;
  text-align: left;
  transition: 0.3s;
  padding: 200px 150px;
  height: 100vh;
  display: flex;
  gap: 30px;
}

.nav-item1 {
  margin: 16px 0px;
}

.custom-link.active {
  right: 0;
}

#counter {
  display: flex;
  align-items: center;
}

.plus {
  font-size: 56px;
  font-family: 'Red Hat Display', sans-serif;
  font-weight: 900;
  color: #6A18D2;
}

@media (max-width: 392px) {
  .plus {
    font-size: 35px !important;
  }
}

.nav-link1 {
  font-size: 32px;
  color: #000;
  text-decoration: none;
  font-family: 'Red Hat Display', sans-serif;
  font-weight: 900;
}

.flex-navbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.nav-link1:hover {
  color: #6A18D2;
}

.social-links {
  margin-top: 50px;
}

.social-links ul {
  display: flex;
  gap: 20px;
}

.inner-wrapper {
  margin-top: 20px;
}

.inner-wrapper ul {
  list-style: none;
  display: flex;
  gap: 20px;
  padding-left: 0px;
}

.inner-wrapper ul li a {
  background-color: #fff;
  height: 45px;
  width: 45px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  color: #6A18D2;
}

.inner-wrapper ul li a {
  font-size: 22px;
  text-decoration: none !important;
}

.inner-wrapper ul li a:hover {
  color: #fff;
  background-color: #6A18D2;
}

@media (max-width:1200px) {
  .navbar1 {
    padding: 20px 60px;
  }
}

@media (max-width:768px) {
  .nav-link1 {
    font-size: 20px;
  }
}

@media (max-width:360px) {
  .logo {
    width: 100px;
  }
}

@media (min-width: 992px) {
  .about-overlayimg1 {
  }
}

@media (max-width: 1920px) {
  .about-para {
    font-size: 18px !important;
  }
}

@media (max-width: 1920px) {
  .whatwedo-block {
    min-height: 360px !important;
  }
}

@media (max-width: 1920px) {
  .whatwedo-img {
    width: 360px !important;
    top: -116px !important;
  }
}

@media (max-width: 1920px) {
  .about-overlayimg1 {
    width: 400px !important;
    position: absolute !important;
    top: -190px !important;
    left: 63% !important;
  }
}

@media (max-width: 1920px) {
  .banner-section {
    padding-top: 280px !important;
  }
}

@media (max-width: 1920px) {
  .contactus-img {
    width: 45% !important;
    object-fit: cover !important;
  }
}

@media (max-width:1400px) {
  .custom-link {
    padding: 150px 100px;
  }
}

.contact-but {
  border: 0px !important;
}

.fom-div {
  width: 40%;
}

::placeholder {
  color: #c4c4c4 !important;
}

.contact-but {
  padding: 20px 30px !important;
}

@media (max-width: 1920px) {
  .testiimg-div {
    left: 20% !important;
    width: 38% !important;
    top: -125px !important;
  }
}

@media (max-width: 1920px) {
  .head-innerbg2 {
    width: 70px !important;
    left: 38% !important;
  }
}

@media (max-width: 1920px) {
  .testimonial-info {
    padding: 80px 250px 150px 80px !important;
  }
}

.testi-para {
  font-size: 22px;
}

.testi-overlayimg {
  position: absolute;
  top: -40%;
  right: 0;
  width: 350px;
}

.coding-imgblock {
  width: 50%;
}

.slider-content {
  width: 50%;
}

@media (max-width: 1920px) {
  .about-overlayimg2 {
    left: 42% !important;
    top: 45% !important;
  }
}

@media (max-width: 1920px) {
  .navbar1 {
    /*padding: 20px 19% !important;*/
  }
}

.project-div {
  /*border-top: 1px solid #B8B2BF;*/
}

.footer-link:hover {
  background: #6A18D2;
  /*color: #fff;*/
}

.footer-link:hover {
  background: #6A18D2;
  /*color: #fff;*/
}

.footer-link a:hover {
  /*color: #fff;*/
}

.footer-link a:hover {
  color: #fff;
  /*color: #fff;*/
}

.footer-link {
  width: 45px;
  height: 45px;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  /*color: red;*/
  border-radius: 50%;
}

@media (max-width: 1440px) {
  .navbar1 {
    padding: 20px 6% !important;
  }
}

@media (max-width: 1440px) {
  .testiimg-div {
    width: 50% !important;
    top: -95px !important;
    left: 10% !important;
  }
}

@media (max-width: 1440px) {
  .testi-head {
    font-size: 45px !important;
  }
}

.border-top {
  border-top: 1px solid #B8B2BF !important;
}

@media (max-width: 1280px) {
  .about-overlayimg1 {
    width: 330px !important;
  }
}

@media (max-width: 1280px) {
  .whatwedo-img {
    width: 300px !important;
  }
}

@media (max-width: 1280px) {
  .testi-overlayimg {
    width: 300px !important;
    top: -35% !important;
    right: 5% !important;
  }
}

@media (max-width: 1280px) {
  .custom-link {
    padding: 150px 100px;
  }
}

.testimonial-info {
  padding: 80px 150px 100px 80px !important;
}

@media (max-width: 1280px) {
  .fom-div {
    width: 50% !important;
  }
}

.head1 {
  /*font-size: 40px !important;*/
}

.project-counter {
  display: flex;
  justify-content: end;
  width: 165px;
}

.form-input:focus {
  color: #ffffff !important;
  /*font-size: 24px;*/
}

@media (max-width: 1024px) {
  .custom-container {
    width: 100% !important;
  }
}

div {
}

.head2 {
}

@media (max-width: 768px) {
  .banner-content {
    display: flex !important;
    flex-direction: column !important;
    align-items: start;
  }
}

@media (max-width: 768px) {
  .banner-innerimg {
    width: 96px !important;
  }
}

@media (max-width: 768px) {
  .head2 {
    font-size: 35px !important;
  }
}

@media (max-width: 768px) {
  .about-innerblock {
    min-height: 370px !important;
  }
}

@media (max-width: 768px) {
  .head3 {
    font-size: 24px !important;
  }
}

@media (max-width: 768px) {
  .project-block {
    padding: 20px 0px !important;
  }
}

@media (max-width: 768px) {
  .head4 {
    font-size: 24px !important;
  }
}

@media (max-width: 768px) {
  .project-content {
    width: 100% !important;
  }
}

@media (max-width: 768px) {
  .head5 {
    font-size: 40px !important;
  }
}

@media (max-width: 768px) {
  .about-block {
    padding-right: 0px !important;
  }
}

@media (max-width: 768px) {
  .slider-content {
    width: 100%;
  }
}

.head-innerbg.blue-arrow {
  left: 50% !important;
}

@media (max-width: 768px) {
  .outline-head {
    font-size: 85px !important;
  }
}

@media (max-width: 768px) {
  .coding-imgblock {
    width: 100%;
  }
}

@media (max-width: 768px) {
  .testi-overlayimg {
    width: 200px !important;
    top: -21% !important;
  }
}

@media (max-width: 768px) {
  .testiimg-div {
    width: 80% !important;
    height: 400px !important;
  }
}

@media (max-width: 768px) {
  .testi-head {
    font-size: 40px !important;
    line-height: 40px !important;
  }
}

@media (max-width: 768px) {
  .testi-bg {
    min-height: 245px !important;
  }
}

@media (max-width: 768px) {
  .testi-para {
    font-size: 20px !important;
  }
}

@media (max-width: 768px) {
  .contactus-section {
    padding-top: 150px !important;
  }
}

.contactus-img {
}

@media (max-width: 768px) {
  .head6 {
    font-size: 30px !important;
  }
}

.fom-div {
  /*width: 100% !important;*/
}

@media (max-width: 768px) {
  .form-inner {
    width: 72% !important;
  }
}

.contact-but {
  display: block;
}

@media (max-width: 768px) {
  .contact-but {
    display: block;
    margin: 0 auto;
    font-size: 18px !important;
  }
}

@media (max-width: 576px) {
  .head-innerbg {
    width: 50px !important;
    top: -40px !important;
  }
}

.project-img {
  width: 100% !important;
}

.whatwedo-block {
  /*width: 65% !important;*/
}

@media (max-width: 576px) {
  .head5 {
    margin-top: 45px !important;
    font-size: 38px !important;
  }
}

@media (max-width: 576px) {
  .testi-head {
    font-size: 35px !important;
  }
}

@media (max-width: 576px) {
  .head-innerbg2 {
    width: 50px !important;
    left: 60% !important;
  }
}

.fom-div {
}

@media (max-width: 390px) {
  .project-count {
    font-size: 30px !important;
  }
}

@media (max-width: 391px) {
  .about-innerblock {
    width: 80% !important;
  }
}

@media (max-width: 392px) {
  .project-div {
    margin-left: 0px !important;
  }
}

@media (max-width: 392px) {
  .form-inner {
    width: 100% !important;
  }
}

@media (max-width: 392px) {
  .contactus-section {
    padding-top: 100px !important;
  }
}

@media (max-width: 576px) {
  .project-counter {
    justify-content: start;
  }
}

@media (max-width: 392px) {
  .project-counter {
    display: flex;
    justify-content: start;
    width: 165px;
  }
}

.contact-but:hover {
  background-color: #000 !important;
  color: #fff !important;
}

@media (max-width: 768px) {
  .footer-about {
    width: 100% !important;
  }
}

@media (max-width: 768px) {
  .project-counter {
    justify-content: start !important;
  }
}

@media (max-width: 768px) {
  .project-div {
    margin-left: 0px !important;
  }
}

@media (max-width:768px) {
  .custom-link {
    width: 100%;
  }
}

@media (max-width:768px) {
  .nav-item1::before {
    display: none;
  }
}

@media (max-width:768px) {
  .social-icons-block ul {
    padding: 0px !important;
  }
}

@media (max-width:768px) {
  .nav-item1 {
    align-items: center;
    justify-content: center;
  }
}

@media (max-width:768px) {
  .social-icons-block ul {
    justify-content: center;
    position: relative;
    bottom: -100px;
  }
}

@media (max-width:576px) {
  .custom-link {
    padding: 150px 50px;
  }
}

@media (max-width: 576px) {
  .project-block {
    padding: 25px 30px !important;
  }
}

@media (max-width: 576px) {
  .form-inner {
    width: 100% !important;
  }
}

.scroll-wrapper {
  width: 45px;
  background: #EEE7F1;
  height: 75px;
  border-radius: 80px;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  bottom: -22px;
  z-index: 100;
  transform: scale(0.8);
}

.scroll-dot {
  background: #000;
  width: 10px;
  height: 10px;
  border-radius: 50%;
}

@media (max-width: 992px) {
  .project-counter {
    justify-content: start;
  }
}

.whatwedo-block {
  /*width: 300px !important;*/
}

@media (max-width: 992px) {
  .slider-content {
    width: 100% !important;
  }
}

.testimonial-section {
  /*margin-top: 300px !important;*/
}

@media (max-width: 392px) {
  .scroll-inner {
    width: 35px !important;
    height: 55px !important;
  }
}

@media (max-width: 576px) {
  .scroll-wrapper {
    left: 5%;
  }
}

.bg-blur {
  width: 100%;
  height: 100%;
  display: block;
  background-color: #000 !important;
  overflow: auto;
  position: fixed;
  left: 0;
  top: 0;
}

body {
  position: relative;
}

.overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.85);
  z-index: 150;
}

@media (max-width: 768px) {
  .banner-section {
    padding-top: 290px !important;
  }
}

@media (max-width: 768px) {
  .about-section {
    background-position: 90% 5% !important;
  }
}

@media (max-width: 576px) {
  .about-section {
    background-position: 76% 0% !important;
  }
}

@media (max-width: 392px) {
  .about-section {
    background-position: 56% 0% !important;
  }
}

input {
  color: #fff !important;
  /*font-size: 22px !important;*/
}