* {
  margin: 0;
  padding: 0;
  box-sizing: border-box; }

body {
  font-family: 'Nunito', sans-serif;
  background-color: var(--bg-color); }

:root {
  --bg-color: #101216;
  --primary-color: #ffffff;
  --secondary-color: #9a9eba;
  --theme1: #ac189f;
  --theme2: #2c7dd9;
  --theme3: #e7e7e7;
  --theme4: #50e2c2;
  --btn-width: 170px;
  --btn-height: 50px;
  --border-radius: 15px;
  --border-thickness: 3px;
  --btn-width-2: 120px;
  --btn-height-2: 40px; }

.my-btn {
  border-radius: var(--border-radius);
  display: flex;
  justify-content: center;
  align-items: center;
  height: var(--btn-height);
  width: var(--btn-width);
  font-size: 20px;
  font-weight: 600;
  letter-spacing: 1.5px;
  color: var(--primary-color);
  border: none;
  background: linear-gradient(var(--theme1), var(--theme2));
  position: relative;
  z-index: 1;
  transition: 0.3s; }

.my-btn::before {
  content: "";
  display: block;
  background-color: var(--bg-color);
  position: absolute;
  border-radius: calc(var(--border-radius) - var(--border-thickness));
  height: calc(var(--btn-height) - var(--border-thickness) * 2);
  width: calc(var(--btn-width) - var(--border-thickness) * 2);
  z-index: -1;
  box-shadow: inset 3px 3px 10px #ac18a062, inset -3px -3px 10px #2c7dd980; }

.my-btn:hover {
  color: var(--theme4);
  animation: hue linear infinite 2s; }

::-webkit-scrollbar {
  width: 12px; }

::-webkit-scrollbar-thumb {
  background-color: var(--theme2);
  border-radius: 10px; }

::-webkit-scrollbar-track {
  background-color: var(--bg-color); }

.navbar {
  background-color: var(--bg-color); }
  .navbar .logo a {
    color: var(--primary-color);
    font-weight: 600;
    font-size: 25px; }
    .navbar .logo a b {
      font-family: 'Parisienne', cursive;
      text-transform: uppercase;
      font-size: 40px;
      font-weight: 600;
      padding-right: 3px;
      color: var(--theme1);
      text-shadow: 1px 1px 1px #2c7dd9; }
  .navbar ul li {
    margin: 0 5px; }
  .navbar ul a {
    color: var(--secondary-color);
    font-size: 18px;
    letter-spacing: 1.2px;
    font-weight: 600; }
    .navbar ul a:focus {
      color: var(--theme1); }
  .navbar ul li:hover a {
    color: var(--theme1); }
  .navbar .navbar-toggler {
    border: none;
    outline: none;
    box-shadow: none; }
    .navbar .navbar-toggler i {
      color: var(--primary-color);
      font-size: 35px; }
  .navbar .btn:focus {
    border: none;
    outline: none;
    box-shadow: none; }
  .navbar .modal {
    background-color: transparent; }
    .navbar .modal .modal-dialog {
      max-width: fit-content;
      background-color: transparent; }
    .navbar .modal .modal-content {
      background-color: transparent;
      height: 450px;
      width: fit-content;
      border: none; }
      .navbar .modal .modal-content .modal-header {
        max-width: 205px;
        padding: 40px 30px;
        background-color: var(--theme2);
        border-radius: 0;
        color: var(--primary-color);
        border: none;
        border-bottom-left-radius: 20px;
        border-top-left-radius: 20px; }
        .navbar .modal .modal-content .modal-header h5 {
          font-size: 22px;
          font-weight: 300;
          font-weight: 700; }
        .navbar .modal .modal-content .modal-header p {
          font-size: 17px;
          letter-spacing: 0.5px;
          font-weight: 600; }
      .navbar .modal .modal-content .form-floating > .form-control-plaintext ~ label,
      .navbar .modal .modal-content .form-floating > .form-control:focus ~ label,
      .navbar .modal .modal-content .form-floating > .form-control:not(:placeholder-shown) ~ label,
      .navbar .modal .modal-content .form-floating > .form-select ~ label {
        opacity: .65;
        transform: scale(0.85) translateY(-1.5rem); }
      .navbar .modal .modal-content .modal-body {
        flex: 0 0 auto;
        padding: 40px 30px;
        max-width: 333px;
        background-color: var(--primary-color);
        border-bottom-right-radius: 20px;
        border-top-right-radius: 20px; }
        .navbar .modal .modal-content .modal-body input {
          border: none;
          border-bottom: 1px solid black;
          border-radius: 0;
          padding: 8px 10px 2px 0;
          height: auto; }
          .navbar .modal .modal-content .modal-body input:focus {
            box-shadow: none;
            outline: none; }
        .navbar .modal .modal-content .modal-body label {
          padding: 0;
          height: auto;
          top: 8px; }
        .navbar .modal .modal-content .modal-body .terms-condition {
          font-size: 13px;
          letter-spacing: 0.5px;
          font-weight: 600; }
          .navbar .modal .modal-content .modal-body .terms-condition a {
            color: var(--theme1);
            font-weight: 700; }
        .navbar .modal .modal-content .modal-body button {
          border-radius: 0;
          background-color: var(--theme1); }
        .navbar .modal .modal-content .modal-body .other-info {
          font-size: 13px;
          letter-spacing: 0.5px;
          font-weight: 600; }
          .navbar .modal .modal-content .modal-body .other-info a {
            color: var(--theme1); }
      .navbar .modal .modal-content .modal-footer {
        border: none;
        display: block;
        padding-top: 7px; }
        .navbar .modal .modal-content .modal-footer button {
          color: var(--primary-color);
          background-color: transparent;
          border: none;
          font-size: 24px;
          line-height: 24px; }

.banner {
  background-color: var(--bg-color);
  width: 100%; }
  .banner .carousel {
    height: 720px; }
  .banner .carousel-indicators button {
    background-color: var(--theme2); }
  .banner .carousel-inner {
    height: 100%; }
    .banner .carousel-inner .carousel-item {
      height: 97%; }
      .banner .carousel-inner .carousel-item .carousel-img {
        max-width: 100%; }
      .banner .carousel-inner .carousel-item img {
        object-fit: cover;
        align-items: center;
        max-width: 1000px; }
      .banner .carousel-inner .carousel-item .carousel-caption {
        padding-top: 25px; }
        .banner .carousel-inner .carousel-item .carousel-caption h2 {
          font-size: 22px;
          font-weight: 300; }
        .banner .carousel-inner .carousel-item .carousel-caption h1 {
          font-size: calc(20px + 1.5vw);
          font-weight: 700;
          line-height: 48px;
          letter-spacing: 1px; }
        .banner .carousel-inner .carousel-item .carousel-caption p {
          word-spacing: 2px;
          line-height: 26px;
          font-size: 17px;
          font-weight: 200;
          letter-spacing: 1.5px; }
  .banner .carousel .carousel-control-prev,
  .banner .carousel .carousel-control-next {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background-color: var(--theme2);
    position: absolute;
    top: 50%; }
  .banner .carousel .carousel-control-prev {
    left: 20px; }
  .banner .carousel .carousel-control-next {
    right: 20px; }

.about {
  background: var(--bg-color);
  padding: 100px 0;
  overflow: hidden; }
  .about .about-title {
    color: var(--primary-color);
    padding-bottom: 70px; }
    .about .about-title h5 {
      font-size: 22px;
      font-weight: 300; }
    .about .about-title h3 {
      font-size: calc(20px + 1.5vw);
      font-weight: 700;
      line-height: 48px;
      letter-spacing: 1px; }
  .about .about-inner {
    color: var(--primary-color);
    padding: 0;
    box-shadow: -2px -2px 10px rgba(0, 0, 0, 0.534);
    border-radius: 40px; }
    .about .about-inner .col {
      padding: 0 7px;
      margin-top: 50px; }
      .about .about-inner .col .card {
        background-color: transparent;
        border: none;
        padding: 30px;
        transition: 0.3s; }
        .about .about-inner .col .card .card-img {
          padding: 20px 60px 20px; }
        .about .about-inner .col .card .card-body h5 {
          font-size: 23px;
          font-weight: 300;
          letter-spacing: 1.4px; }
        .about .about-inner .col .card .card-border {
          width: 270px;
          height: 330px;
          border: 3px solid var(--theme2);
          top: 40%;
          left: 50%;
          transform: translate(-50%, -50%);
          border-radius: 25px;
          z-index: 1;
          display: none;
          justify-content: center;
          align-items: center;
          box-shadow: inset 0px 0px 20px 3px #ac18a07a, inset 0px 0px 40px 7px #ac18a077;
          transition: 2s; }
        .about .about-inner .col .card:hover {
          scale: 1.05; }
        .about .about-inner .col .card:hover .card-border {
          display: flex; }

.service {
  background-color: var(--bg-color);
  color: var(--primary-color);
  overflow: hidden; }
  .service .service-title h2 {
    font-size: calc(20px + 1.5vw);
    font-weight: 700;
    line-height: 48px;
    letter-spacing: 1px; }
  .service .service-inner img {
    margin-right: 20px; }
  .service .service-inner p {
    letter-spacing: 1.5px;
    word-spacing: 2px;
    line-height: 26px;
    font-size: 17px; }
  .service .service-inner .boosting {
    position: relative;
    margin-left: 70px; }
    .service .service-inner .boosting::before {
      content: '01';
      position: absolute;
      top: 0;
      left: -70px;
      font-size: 100px;
      font-weight: 700;
      color: #ededed1a;
      animation-name: my-slide;
      animation-duration: 2s;
      text-shadow: 1px 1px 15px #50e2c223; }
  .service .service-inner .service-item:nth-child(2) .boosting::before {
    content: "02"; }
  .service .service-footer .circle-outer {
    width: 170px;
    height: 170px;
    border-radius: 50%;
    padding: 20px;
    margin: 20px 0; }
    .service .service-footer .circle-outer .circle-inner {
      border-radius: 50%;
      width: 130px;
      height: 130px; }
      .service .service-footer .circle-outer .circle-inner .inner-content {
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        width: 100%;
        height: 100%; }
        .service .service-footer .circle-outer .circle-inner .inner-content span {
          font-size: 32px;
          font-weight: 700;
          color: #50e2c2; }
    .service .service-footer .circle-outer svg {
      overflow: inherit;
      width: 170px;
      height: 170px;
      transform: rotateZ(-90deg); }
      .service .service-footer .circle-outer svg circle {
        fill: none;
        stroke: #50e2c2;
        stroke-width: 20px;
        stroke-dasharray: 348;
        stroke-dashoffset: 0; }
    .service .service-footer .circle-outer:first-child circle {
      animation: proccess-76 linear 2s;
      animation-delay: 2s; }
    .service .service-footer .circle-outer:nth-child(3) .inner-content span {
      color: #9013fd; }
    .service .service-footer .circle-outer:nth-child(3) circle {
      stroke: #9013fd;
      stroke-dasharray: 395;
      stroke-dashoffset: 0;
      animation: proccess-85 linear 2s;
      animation-delay: 2s; }
    .service .service-footer .circle-outer:nth-child(2) {
      margin: 20px 25px; }
      .service .service-footer .circle-outer:nth-child(2) svg {
        animation: rotate360 5s linear infinite; }
      .service .service-footer .circle-outer:nth-child(2) .inner-content p {
        color: #ffac42;
        margin: 0; }
        .service .service-footer .circle-outer:nth-child(2) .inner-content p span {
          animation: process linear infinite;
          animation-duration: 1.5s;
          animation-delay: 1s;
          color: #ffac42;
          opacity: 0; }
          .service .service-footer .circle-outer:nth-child(2) .inner-content p span:nth-child(2) {
            animation-delay: 1.3s; }
          .service .service-footer .circle-outer:nth-child(2) .inner-content p span:last-child {
            animation-delay: 1.6s; }
      .service .service-footer .circle-outer:nth-child(2) circle {
        stroke: #ffac42;
        stroke-dasharray: 47;
        stroke-dashoffset: 0; }

@-webkit-keyframes my-slide {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    transform: translateX(-2000px); }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0); } }
@keyframes my-slide {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    -ms-transform: translateX(-2000px);
    transform: translateX(-2000px); }
  100% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0); } }
@keyframes process {
  0% {
    opacity: 1; }
  100% {
    opacity: 0; } }
@keyframes rotate360 {
  0% {
    transform: rotateZ(0deg); }
  100% {
    transform: rotateZ(360deg); } }
@keyframes proccess-85 {
  0% {
    stroke-dasharray: 395;
    stroke-dashoffset: 320; }
  100% {
    stroke-dasharray: 395;
    stroke-dashoffset: 0; } }
@keyframes proccess-76 {
  0% {
    stroke-dasharray: 348;
    stroke-dashoffset: 225; }
  100% {
    stroke-dasharray: 348;
    stroke-dashoffset: 0; } }
.our-team {
  background-color: var(--bg-color);
  padding: 100px 0;
  overflow: hidden; }
  .our-team .our-team-title {
    color: var(--primary-color); }
    .our-team .our-team-title h5 {
      font-size: 22px;
      font-weight: 300; }
    .our-team .our-team-title h3 {
      font-size: calc(20px + 1.5vw);
      font-weight: 700;
      line-height: 48px;
      letter-spacing: 1px; }
  .our-team .col {
    margin-top: 35px;
    padding: 0 10px; }
  .our-team .card {
    padding: 40px 65px 21px;
    background-color: #9a9eba49;
    color: var(--primary-color);
    border-radius: 15px; }
    .our-team .card img {
      margin-bottom: 35px; }
    .our-team .card .card-body h5 {
      font-size: 22px;
      font-weight: 300;
      font-weight: 700;
      font-size: 24px; }
    .our-team .card .card-body p {
      word-spacing: 2px;
      line-height: 26px;
      font-size: 17px;
      font-weight: 200;
      letter-spacing: 1.5px;
      font-size: 14px;
      font-weight: 500; }
    .our-team .card .card-footer {
      border: none;
      background-color: transparent; }
      .our-team .card .card-footer i {
        width: 50px;
        height: 50px;
        border: 1px solid var(--theme2);
        border-radius: 50%;
        font-size: 22px;
        transition: 0.3s; }
        .our-team .card .card-footer i::before {
          color: var(--theme2); }
        .our-team .card .card-footer i:hover {
          background-color: var(--theme2); }
        .our-team .card .card-footer i:hover::before {
          color: var(--primary-color); }
  .our-team .card-container:hover .card {
    opacity: 0.5;
    filter: blur(3px); }
  .our-team .card-container .card:hover {
    opacity: 1;
    filter: blur(0px);
    cursor: pointer; }

.testimonial {
  background-color: var(--bg-color);
  color: var(--primary-color);
  padding: 0 0 100px; }
  .testimonial .testimonial-title h5 {
    font-size: 22px;
    font-weight: 300; }
  .testimonial .testimonial-title h3 {
    font-size: calc(20px + 1.5vw);
    font-weight: 700;
    line-height: 48px;
    letter-spacing: 1px; }
  .testimonial .testimonial-items .carousel-item .reveiw {
    margin: 0 auto; }
    .testimonial .testimonial-items .carousel-item .reveiw p {
      word-spacing: 2px;
      line-height: 26px;
      font-size: 17px;
      font-weight: 200;
      letter-spacing: 1.5px;
      font-size: 20px; }
  .testimonial .testimonial-items .carousel-item img {
    border-radius: 50%; }
  .testimonial .testimonial-items .carousel-item h3 {
    font-size: 24px; }

footer {
  background-color: var(--bg-color);
  color: var(--primary-color); }
  footer .footer-title {
    border-bottom: 1px solid var(--primary-color); }
    footer .footer-title .logo a {
      color: var(--primary-color);
      font-weight: 600;
      font-size: 25px; }
      footer .footer-title .logo a b {
        font-family: 'Parisienne', cursive;
        text-transform: uppercase;
        font-size: 40px;
        font-weight: 600;
        padding-right: 3px;
        color: var(--theme1);
        text-shadow: 1px 1px 1px #2c7dd9; }
    footer .footer-title .title-inner p {
      word-spacing: 2px;
      line-height: 26px;
      font-size: 17px;
      font-weight: 200;
      letter-spacing: 1.5px;
      font-size: 17px;
      font-weight: 500; }
    footer .footer-title .title-inner i {
      color: var(--theme1);
      text-shadow: 1px 1px 1px #2c7dd9; }
  footer .footer-items .footer-content h5 {
    font-size: 22px;
    font-weight: 300; }
    footer .footer-items .footer-content h5:hover {
      color: var(--theme4); }
  footer .footer-items .footer-content li {
    line-height: 23px; }
    footer .footer-items .footer-content li a {
      color: var(--primary-color); }
      footer .footer-items .footer-content li a::before {
        content: '\F5D4';
        font-family: bootstrap-icons !important;
        padding-right: 7px;
        font-size: 19px;
        color: var(--primary-color);
        vertical-align: text-top; }
      footer .footer-items .footer-content li a:hover {
        color: var(--theme1); }
        footer .footer-items .footer-content li a:hover::before {
          color: var(--theme2); }
  footer .footer-items .footer-content .footer-inner p {
    line-height: 23px; }
  footer .footer-items .footer-content .footer-inner span {
    color: var(--theme2); }
    footer .footer-items .footer-content .footer-inner span::before {
      content: '\F214';
      font-family: bootstrap-icons !important;
      padding-right: 10px;
      font-size: 15px;
      color: var(--theme2);
      vertical-align: middle; }
    footer .footer-items .footer-content .footer-inner span:hover {
      color: var(--theme1); }
      footer .footer-items .footer-content .footer-inner span:hover::before {
        color: var(--theme1); }

.footer-content form input:focus {
  box-shadow: 2px 2px 15px var(--theme1), -2px -2px 15px var(--theme1);
  border: 1px solid white;
  outline: none; }

.footer-content form textarea:focus {
  box-shadow: 2px 2px 15px var(--theme1), -2px -2px 15px var(--theme2);
  border: 1px solid white;
  outline: none; }

/*# sourceMappingURL=style.css.map */
