.bg-black-2 {
  background-color: rgba(0, 0, 0, 0.9);
}
.nav-item a {
  color: white;
}

.Home {
  background-image: url(../images/hero-bg.jpg);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
}
.Home-1 {
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
}
.Home-1 h1,
.Home h2 {
  color: #ffffff;
  font-size: 2.5rem;
}
.Home h2::after {
  content: "|";

  animation: animation 8s infinite;
}
@keyframes animation {
  0% {
    content: "D |";
  }
  1% {
    content: "De |";
  }
  2% {
    content: "Des |";
  }
  3% {
    content: "Desi |";
  }
  4% {
    content: "Desig |";
  }
  5% {
    content: "Design |";
  }
  6% {
    content: "Designe |";
  }
  7% {
    content: "Designer |";
  }
  8% {
    content: "Designe |";
  }
  9% {
    content: "Design |";
  }
  10% {
    content: "Desig |";
  }
  11% {
    content: "Desi |";
  }
  12% {
    content: "Des |";
  }
  13% {
    content: "De |";
  }
  14% {
    content: "D |";
  }
  21% {
    content: "|";
  }
  22% {
    content: "D |";
  }
  23% {
    content: "De |";
  }
  24% {
    content: "Dev |";
  }
  25% {
    content: "Deve |";
  }
  26% {
    content: "Devel |";
  }
  27% {
    content: "Develo |";
  }
  28% {
    content: "Develop |";
  }
  29% {
    content: "Develope |";
  }
  30% {
    content: "Developer |";
  }
  31% {
    content: "Develope |";
  }
  32% {
    content: "Develop |";
  }
  33% {
    content: "Develo |";
  }
  34% {
    content: "Devel |";
  }
  35% {
    content: "Deve |";
  }
  36% {
    content: "Dev |";
  }
  37% {
    content: "De |";
  }
  38% {
    content: "D |";
  }
  43% {
    content: "|";
  }
  44% {
    content: "F |";
  }
  45% {
    content: "Fr |";
  }
  46% {
    content: "Fre |";
  }
  47% {
    content: "Free |";
  }
  48% {
    content: "Freel |";
  }
  49% {
    content: "Freela |";
  }
  50% {
    content: "Freelan |";
  }
  51% {
    content: "Freelanc |";
  }
  52% {
    content: "Freelance |";
  }
  53% {
    content: "Freelancer |";
  }
  54% {
    content: "Freelance |";
  }
  55% {
    content: "Freelanc |";
  }
  56% {
    content: "Freelan |";
  }
  57% {
    content: "Freela |";
  }
  58% {
    content: "Freel |";
  }
  59% {
    content: "Free |";
  }
  60% {
    content: "Fre |";
  }
  61% {
    content: "Fr |";
  }
  62% {
    content: "F |";
  }
  68% {
    content: " |";
  }
  69% {
    content: "P |";
  }
  70% {
    content: "Ph |";
  }
  71% {
    content: "Pht |";
  }
  72% {
    content: "Phot |";
  }
  73% {
    content: "Photo |";
  }
  74% {
    content: "Photog |";
  }
  75% {
    content: "Photogr |";
  }
  76% {
    content: "Photogra |";
  }
  77% {
    content: "Photograp |";
  }
  78% {
    content: "Photograph |";
  }
  79% {
    content: "Photographe |";
  }
  80% {
    content: "Photographer |";
  }
  81% {
    content: "Photographe |";
  }
  82% {
    content: "Photograph |";
  }
  83% {
    content: "Photograp |";
  }
  84% {
    content: "Photogra |";
  }
  85% {
    content: "Photogr |";
  }
  86% {
    content: "Photog |";
  }
  87% {
    content: "Photo |";
  }
  88% {
    content: "Phot |";
  }
  89% {
    content: "Pho |";
  }
  90% {
    content: "Ph |";
  }
  91% {
    content: "P |";
  }
  93% {
    content: " |";
  }
}
body {
  background-color: #f5f5f5;
}
.About-1 {
  width: 90%;
}
.About-1 h5 {
  font-size: 1.08rem;
  color: #4e4e4e;
}
.About-1 span {
  color: black;
}
.line-mf {
  width: 40px;
  height: 5px;
  background-color: #0078ff;
  margin: 0 auto;
}
.service-ico {
  border: 0.6rem solid #0078ff;
  width: 7rem;
  height: 7rem;
  border-radius: 50%;
}
.card-body p {
  color: #4e4e4e;
}
.card .service-ico {
  transition-duration: 0.5s;
}
.card:hover .service-ico {
  background-color: #0078ff;
  border: 0.6rem solid rgba(255, 255, 255, 0.7);
}
.card:hover .service-ico i{
  color: white;
}
.background {
  background-image: url(../images/counters-bg.jpg);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  min-height: 65vh;
}
.ovrlay {
  background-color: rgb(0, 120, 255, 0.7);
  height: 65%;
}
.item-ico {
  border: 0.6rem solid #ffffff;
  width: 7rem;
  height: 7rem;
  border-radius: 50%;
}
.item-ico i {
  color: #ffffff;
}
.background .card {
  background-color: rgba(0, 0, 0, 0);
}
.background h3,
.background p {
  margin-top: 1.1rem;
  color: white;
}
.services-header h2 {
  font-size: 2.8rem;
}
.Work span {
  color: #0078ff;
}
.card-img {
  overflow: hidden;
}
.card-img-top {
  transition-duration: 1.1s;
  overflow: hidden;
}
.Work .card:hover img {
  transform: scale(1.3);
}
.background-2 {
  background-image: url(../images/overlay-bg.jpg);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  min-height: 90vh;
}
.overlay-2 {
  background-color: rgb(0, 120, 255, 0.7);
  height: 90%;
}
.badge {
  margin-top: 67%;
}
.img-card {
  width: 13%;
}
.card-footer img {
  width: 100%;
}

.carousel-indicators [data-bs-target] {
  height: 15px;
  width: 15px;
  border-radius: 50%;
  text-indent: 0px;
  overflow: hidden;
}

.contact {
  background-image: url(../images/overlay-bg.jpg);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  min-height: 100vh;
}
.overlay-3 {
  background-color: rgb(0, 120, 255, 0.7);
  min-height: 100%;
}
.contact button {
  border-radius: 28px;
}
.contact ul {
  list-style-type: none;
}
.ico-circle {
  border: 0.4rem solid #0078ff;
  width: 5rem;
  height: 5rem;
  border-radius: 50%;
  transition-duration: 0.5s;
}
.ico-circle:hover {
  background-color: #0078ff;
  border: 0.4rem solid rgba(255, 255, 255, 0.7);
  color: #ffffff;
}
.socials a {
  color: black;
}
.title-left::before {
  content: "";
  position: absolute;
  height: 3px;
  background-color: #0078ff;
  width: 100px;
  bottom: -12px;
}
.text-about::before {
  content: "";
  position: absolute;
  height: 3px;
  background-color: #0078ff;
  width: 100px;
  bottom: -12px;
}

.copyright-box {
  min-height: 18vh;
  background-color: #0062d3;
}

.blog a{
  text-decoration: none;
  color: black;
  transition-duration: .5s;
}
.blog a:hover{
  color: #0078ff;
}