body {background-color: #000 !important;
    font-family: 'Source Sans Pro',sans-serif;
    font-size: 16px;
    line-height: 26px;}

    body {
        cursor: none;
    }
    * {
      box-sizing: border-box;
      scroll-behavior: smooth;
    }
    a:hover{cursor: unset;}
    .theBall, .theBall-outer {
        mix-blend-mode: exclusion;
        width: 20px;
        height: 20px;
    }
    .theBall-outer {
        position: fixed;
        top: -20px;
        left: -20px;
        z-index: 5000;
        pointer-events: none!important;
    }
    .theBall {
        position: absolute;
        background-color: #fff;
        border-radius: 50%;
        -webkit-transition:  transform .2s cubic-bezier(.175,.885,.32,1.275);
        -moz-transition:  transform .2s cubic-bezier(.175,.885,.32,1.275);
        -ms-transition:  transform .2s cubic-bezier(.175,.885,.32,1.275);
        -o-transition:  transform .2s cubic-bezier(.175,.885,.32,1.275);
        transition:  transform .2s cubic-bezier(.175,.885,.32,1.275);
        transform-origin: center center;
    }
    .dark_page .theBall,
    .coloring .theBall {
        background-color: #5cffbb;
    }
    .zooming.theBall {
        -webkit-transform: scale(2);
        -moz-transform: scale(2);
        -ms-transform: scale(2);
        -o-transform: scale(2);
        transform: scale(2);
    }
    ::selection {
        background-color: #5cffbb;
        color: #fff;
    }

    .word {
        margin: auto;
        color: #5460f2;
        text-shadow: 1px 1px #222324, 1px 2px #222324, 3px 1px #222324;
      }



      .content12{position: relative;width: 100%;}
    .index-create .index-create__titles{width: 100%; float: left;margin-bottom: 7.3vw;}
    .content12 h2 {
      color: #fff;
      font-size: 1em;
      position: absolute;
      width: 100%;
      float: left;
      text-align: center;
    }
    
    .content12 h2:nth-child(1) {
      color: transparent;
      -webkit-text-stroke: 2px #03a9f4;
    }
    
    .content12 h2:nth-child(2) {
      color: #03a9f4;
      animation: animate 4s ease-in-out infinite;
    }
    
    @keyframes animate {
      0%,
      100% {
        clip-path: polygon(
          0% 45%,
          16% 44%,
          33% 50%,
          54% 60%,
          70% 61%,
          84% 59%,
          100% 52%,
          100% 100%,
          0% 100%
        );
      }
    
      50% {
        clip-path: polygon(
          0% 60%,
          15% 65%,
          34% 66%,
          51% 62%,
          67% 50%,
          84% 45%,
          100% 46%,
          100% 100%,
          0% 100%
        );
      }
    }
    
    /* .rotate_logo img{width: 235px;height: auto;animation: rotate 9s linear infinite;} */
    /* .rotate_logo {height: 20vh;} */
    /* @keyframes rotate {
      100% {
        transform: rotatey(360deg);
      }
    } */

    #loader{
      position: fixed;
      width: 100%;
      height: 100vh;
      z-index: 999;
  }
  #loader {text-align: center;height: 100vh;width: 100%;align-items: center;display: flex;justify-content: center;background: #000;}
  #loader h3{font-weight: 700; color: #fff;}
  .animation {
    height:50px;
    overflow:hidden;
    margin-left: 1rem;
    padding-top: 5px;
  }
  
  .animation > div > div {
    padding: 0.25rem 0.75rem;
    height:2.81rem;
    margin-bottom: 2.81rem;
    display:inline-block;
    color: #fff;
  }
  .second div{margin-top: 4px !important;}
  .animation div:first-child {
    animation: text-animation 8s infinite;
  }
  @keyframes text-animation {
    0% {margin-top: 0;}
    10% {margin-top: 0;}
    20% {margin-top: -5.62rem;}
    30% {margin-top: -5.62rem;}
    40% {margin-top: -11.24rem;}
    60% {margin-top: -11.24rem;}
    70% {margin-top: -5.62rem;}
    80% {margin-top: -5.62rem;}
    90% {margin-top: 0;}
    100% {margin-top: 0;}
  }
a{color: #fff !important; text-decoration: none !important;}
/* header */
.header-btn{color: #fff;font-size: 17px;font-weight: 600;}
.header-btn__burger {position: relative;width: 18px;height: 16px;}
.header-btn__burger span:nth-child(1){top: 0;width: 18px;}
.header-btn__burger span:nth-child(2){width: 12px;top: 7px;}
.header-btn__burger span:nth-child(3){width: 6px;bottom: 0;}
.header-btn__burger span {position: absolute;right: 0;background: #fff;height: 2px;border-radius: 1px;transition: .25s ease;}
.menu{display: flex;}
.menu .header-btn__text{margin-right: 1em;}
.menu_drop{display: none; width: 100%;background: #000; height: 410px; width: 100%;transform: translateY(0);}
.menu_drop ul li{display: block;width: 50%;float: left;font-size: 50px;color: #fff;text-align: center;}
.menu .header-btn__text .header-btn:nth-child(2){display: none;} 
.btn_burger_1{transform: rotate(225deg);margin-top: 7px}
.header-btn__burger span:nth-child(2){display: block;}
.btn_burger_2{transform: rotate(135deg);margin-bottom: 7px; width: 100% !important;}

.header .header_contant .logo a img{width: 100px;}
.header {padding-top: 2.2vw;padding-bottom: 2.2em;transition: padding 1s ease;position: fixed;top: 0;right: 0;left: 0;z-index: 300;}
.middle_header a {background: #5460f2;color: #fff;border-radius: 1.25em;padding: 1em 1.5em; font-weight: 600;font-size: 17px;text-decoration: none;}
.index-hero {margin-bottom: 7vw;padding-top: 11.7vw;}
.index-hero .index-hero__title h1 {font-size: 58px;font-weight: 400; color: #fff;padding-bottom: 35px;padding-left: 35px;}
.index-hero__video video {width: 100%;display: block;margin-left: auto;margin-right: auto;}
.index-create .index-create__titles{width: 100%; float: left;margin-bottom: 62px;font-size: 5.27vw;display: flex;justify-content: center;color: #fff;font-weight: 600;}
.index-create .index-create__description{font-size: 20px;width: 30vw;margin: auto;text-align: center;color: rgba(255,255,255,.8);line-height: 140%;z-index: 2;padding-bottom: 25px;}
.index-create__video{width: 100%;}
.index-create__video video{width: 100%;display: block;}
.index-wedo {padding-top: 9.1vw;padding-bottom: 9.1vw;}
.index-wedo__header {display: flex;justify-content: space-between;align-items: center;margin-bottom: 30px;}
.index-wedo__header h2{font-size: 65px; color: #fff;}
.index-wedo__more .more__text {font-size: 2.2vw;}
.index-wedo__list{display: flex;border-bottom: 1px solid rgba(255,255,255,.5);border-top: 1px solid rgba(255,255,255,.5);}
.index-wedo__list-item {flex: 25% 0 0;border-left: 1px solid rgba(255,255,255,.5); text-decoration: none;position: relative;min-height: 420px;}
.index-wedo__list-item:first-child {border-left: none;}
.index-wedo__list-item .index-wedo__list-content .index-wedo__list-title span{display: block;will-change: transform;transform: rotate(-90deg) translate3d(50%,0,0);transition: transform .35s ease,-webkit-transform .35s ease;transform-origin: center center;white-space: nowrap;width: 100%;}
.index-wedo__list-content {display: flex;flex-direction: column;width: 100%;padding: 17.4vw 0 0 0;}
.index-wedo__list-content {text-decoration: none; font-size: 20px;color: #fff;line-height: 135%;}
.index-wedo__list-arrow .fa-arrow-right{transition: .35s ease;}
.index-wedo__list-info{position: absolute;
    width: 100%;
    top: 0;color: #fff;font-weight: 500;opacity: 0;transition: opacity .35s ease;background-color: #5460f2;line-height: 135%;font-size: 20px;padding: 6.4vw 0 0 0;height: 100%; }
.index-wedo__list-arrow{text-align: center;padding-bottom: 6.3vw;margin-top: 4.1vw;z-index: 2;}
.index-wedo__list-caption{font-size: 24px;line-height: 133%;margin-bottom: 1em;text-align: center;}
.index-wedo__list-desc {font-size: 14px;}
.index-wedo__list-cta{text-align: center;display: none;}
.index-wedo__list-cta .btn.btn--blue{background-color: #fff;}
.greetings__text{color: #5460f2;}
.margin_arro{margin-top: 6.1vw !important;}

.slider_content {position: relative;}
.slick-prev{position: absolute;top: 50%;left: 50px;z-index: 999;background: transparent; border: none;}
.slick-next{position: absolute;top: 50%; right: 50px;z-index: 999;background: transparent; border: none;}
.fa-long-arrow-right::before, .fa-long-arrow-left::before{font-size: 30px;color: #fff;}
.slick_con {position: relative;}
.featured-projects__slider-slide-info{position: absolute;left: 4%;color: white;font-size: 46px;transition: all 300ms ease;padding: 2.7vw 2.8vw;transition: all 0.5s ease 0s;bottom: 7%;}
.featured-projects__slider-slide-desc{display: none; font-size: 20px; }
.featured-projects__slider-slide-title {transition: .3s ease;}
.text_slide_up{bottom:10%;}
.featured-projects{background-color: rgb(34, 34, 39);padding-top: 5vw;padding-bottom: 5vw;}
.featured-projects h2.featured-projects__title{font-size: 5.27vw;margin-bottom: 2.2vw;color: #ffF;}
.slick_con.slick-slide img{width: 100%; padding: 40px;}

.reviews_item img{width: 100%;height: 100%;}
.reviews_item{display: flex !important;}
.review_dflex{display: flex; align-items: center; color: #fff;}
.reviews{padding: 120px 0;background: #222227;}
.achievements {padding-bottom: 9vw;background: #222227;}
.achievements__title {margin-bottom: 3em;color: #fff;}
.reviews__description {font-size: 2.22vw;margin-bottom: 1em; color: #fff;}
.reviews .h2{font-size: 3.33vw;margin-bottom: .2em;}
.reviews .h2 a{color: #5460f2 !important ;}

.index-create__scroller{background-image: url('https://shoperarea.in/image/codex/footer.jpg');background-size: cover;background-position: center;}

.h1.index-idea__title {position: absolute;top: 0;right: 0;bottom: 0;left: 0;display: flex;align-items: center;padding-left: 4vw;font-size: 95px;}
.index-idea__box {position: relative;color: #fff;}
.index-idea__bg{overflow: hidden;}

.footer{padding-top: 70px;width: 100%;float: left;}
.footer__logo video{max-width: 60%;margin-left: auto;margin-right: auto;}
.footer__menu-item {color: #fff;padding: 16px 32px 16px 0;border-bottom: 1px solid rgba(255,255,255,.2);text-decoration: none;width: 100%;display: block;}
.footer__address{line-height: 200%;padding-left: 20px; margin-bottom: 30px;color: #fff;}
.footer__copyright {color: #fff; margin-top: 8px;font-size: 14px;}
.footer__links a {color: currentColor;margin-right: 1em;font-size: 14px;}
.footer__menu-item:hover {border-bottom-color: #fff;}
.footer__logo img{width: 300px;float: left;}
.footer .footer__links{margin-bottom: 65px;}
/* contactus page */
.contacts-page{background: rgba(34,34,39,.94);padding-top: 16vw;    width: 100%;float: left;}
.contacts__header {margin-bottom: 30px;}
.form__row {margin-bottom: 10px;}
.contacts__header .h2 {font-size: 15px;font-weight: 500;color: #fff;}
.form__caption {margin-bottom: 10px;line-height: 140%;color: #fff;}
.form__row .input{background: 0 0; width: 100%; transition: .3s ease; color: #fff;  box-shadow: none; padding: 0.6em 10px;border-bottom: 1px solid rgba(255,255,255,.8) !important;border: none;font-size: calc(.005952381 * 100vw + 11.4285714286px);}
.contacts__address-label {color: rgba(255,255,255,.8);margin-bottom: -2px;}
.contacts__address-data {font-size: 16px;line-height: 140%; color: #fff;}
.contacts__address-row {margin-bottom: 30px;display: flex;justify-content:space-between;align-items: center;}
.contacts__address {background: rgba(255,255,255,.1);border-top: 1px solid rgba(255,255,255,.4); border-bottom: 1px solid rgba(255,255,255,.4);  padding: 10px 20px;font-size: 16px;}
.form__footer {margin-top: 30px;width: 100%;float: left;}
.submit_btn {padding: .9em 1.4em;background: #4fb25e;color: #fff;font-weight: 700; border-color: #fff;border: none;border-radius: 0px;}
.contacts__tab{padding-bottom: 20px;}
.contacts__form{margin-bottom: 90px;width: 100%;float: left;}
.form__row {margin-bottom: 10px;width: 100%;
    float: left;
    background: #37373a;
    border-radius: 6px 6px 0px 0px;}
.contacts__form-list .form__row:nth-child(5) {width: 100%;}
.contacts-page h1{color: #fff; font-size: 1.5rem;text-align: center;}
.contacts-page .btn_cont{
  margin-bottom: 0px;
  display: flex;
  width: 100%;
  padding-bottom: 20px;
  justify-content: center;
}
.continue_btn{
  padding: 7px 10px;
  background: #99a0f4;
  border-radius: 5px;
}
/* submit btn */
.submit_btn:hover {
  background: #5cdb95; color:#000000;
  border-radius: 5px;
  box-shadow: 0 0 5px #5cdb95,
  0 0 25px #5cdb95,
  0 0 50px #5cdb95,
  0 0 100px #5cdb95;}
  .submit_btn{display: block;
  position: relative;
  width: 140px;
  height: 63px;
  overflow: hidden;
  transition: all .5s;}
  .submit_btn span {
  position: absolute;
  display: block;}
  .submit_btn span:nth-child(1) {
  top: 0;
  left: -100%;
  width: 100%;
  height: 2px;
  background: linear-gradient(90deg, transparent, #6eff61);
  animation: span1 2s linear infinite;
  animation-delay: 1s;}

@keyframes span1{
  0%{
      left:-200px
  }
  100%{
      left:200px;
  }
}
.submit_btn span:nth-child(2){
  height: 70px;
  width: 3px;
  top:-70px;
  right:0px;
  background: linear-gradient(to bottom, rgba(0,0,0,0), #6eff61);
  border-bottom-left-radius: 1px;
  border-bottom-right-radius: 1px;
  animation: span2 2s linear infinite;
  animation-delay: 2s;
}
@keyframes span2{
  0%{
      top:-70px;
  }
  100%{
      top:70px;
  }
}
.submit_btn span:nth-child(3){
  height:3px;
  width:200px;
  right:-200px;
  bottom: 0px;
  background: linear-gradient(to left, rgba(0,0,0,0), #6eff61);
  border-top-left-radius: 1px;
  border-bottom-left-radius: 1px;
  animation: span3 2s linear infinite;
  animation-delay: 3s;
}
@keyframes span3{
  0%{
      right:-200px;
  }
  100%{
      right: 200px;
  }
}

.submit_btn span:nth-child(4){
  height:70px;
  width:3px;
  bottom:-70px;
  left:0px;
  background: linear-gradient(to top, rgba(0,0,0,0), #6eff61);
  border-top-right-radius: 1px;
  border-top-left-radius: 1px;
  animation: span4 2s linear infinite;
  animation-delay: 4s;
}
@keyframes span4{
  0%{
      bottom: -70px;
  }
  100%{
      bottom:70px;
  }
}
/* service */
.service-cont-img{position: relative;}
.service-cont-img img{width: 100%;height: 100%;object-fit: cover;padding: 31px;}
.app-head-cont{position: absolute; top: 50px;}
.app-head-cont .h2{font-size: 67px; color: #ffF;}
.service .services_content-list .services_list_option{color: #ffF;font-size: 20px;}
.service .service-side-text {display: flex; align-items: center;}
.service{margin-top: 16vw;}
.service .service_list_Content {overflow-y: hidden}
.contentItem {width: 100%;}
.tabItem{color: #ffF; font-size: 1.3vw;text-align: center;}
.tabItem.slick-current {color: #5460f2;font-size: 1.3vw;}

.service .services__list-option{color: #ffF;font-size: 20px;}
.services__list-more-inner .more__text{color: #0d6efd;font-size: 20px;margin-top: 10px;font-weight: 600;}
.services-bg{position: absolute;top: 0;right: 0;z-index: -1;}
.services-hero__title h2{font-size: 3.05vw;color: #fff;}
.services-hero__description{font-size: 1.38vw;color: rgba(255,255,255,.72);max-width: 56%;}
.services-hero{margin-bottom: 25px;}
/* service-design-branding */
.db-description{margin-top: 40px;}
.design-branding h3, .db-content p, .db-description .desc-content h3, .db-description .desc-content p{color: #eee;}
.design-branding h3, .db-description .desc-content h3 {margin-top: 20px;margin-bottom: 15px;padding-bottom: 10px;border-bottom: 1px solid #5b5b5b;}
.db-description .desc-content span{color: #fff;font-weight: 700;}
.design-branding .db-img img{width: 100%;border-radius: 5px;}
.design-branding .db-revers{flex-direction: row-reverse;}
/* service-app devlopment */
.service-app-img{position: relative;}
.service-app-img img{width: 100%;height: 100%;object-fit: cover;padding: 31px;}
.app-head{position: absolute; top: 50px;}
.app-head .h2{font-size: 65px; color: #ffF;}
.service-appdevlopment-page .services__list-list .services__list-option{color: #ffF;font-size: 20px;}
.service-appdevlopment-page .service-side-text {display: flex; align-items: center;}
.service-appdevlopment-page{margin-top: 12vw;}

/* overteam */
.ourteam .team img{width: 300px;
    height: auto}
.ourteam .team .img_team:hover{opacity: 1;}
.ourteam{margin-top: 16vw;}
.ourteam .team{margin-bottom: 11px;}
.team ul li {width: 33%; float: left;}
.ourteam .team span{color: #fff;width: 100%;float: left;}
.ourteam .team .img_team{border: 2px solid #4d4d4d;text-align: center;border-radius: 7px;padding: 0;transition: opacity .5s ease;opacity: 0.6;}
.ourteam .team .col-md-4{    width: 32.333%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;}
.ourteam .team .col-md-4:nth-child(2){margin: 0 11px;}
.team_name {font-size: 22px;font-weight: 600;}
.teamnames{background: #121212;text-align: center;padding: 0em 0.5em 0.4em;width: 100%;float: left;}
.teamnames span:nth-child(2){padding: 3px 0;}
.teamnames span:nth-child(1){padding: 10px 0;}

.about_img h1{color: #fff;text-align: center;border-bottom: 1px solid #7f7f7f;padding-bottom: 5px;}
/* menu css */
#menu {
  z-index: 2;
}
.menu{flex-direction: row-reverse;}
#menu-bar {
  width: 45px;
  height: 40px;
  margin: 5px 0 0px 0px;
 
}

.bar {
  height: 5px;
  width: 100%;
  background-color: #fff;
  display: block;
  border-radius: 5px;
  transition: 0.3s ease;
}

#bar1 {
  transform: translateY(-4px);
}

#bar3 {
  transform: translateY(4px);
}

.nav {
  transition: 0.3s ease;
  display: none !important;
  width: 100px;
}

.nav ul {
  padding: 0 6px;
}

.nav li {
  list-style: none;
  padding: 7px 0;
}

.nav li a {
  color: white;
  font-size: 20px;
  text-decoration: none;
}

.nav li a:hover {
  font-weight: bold;
  color: #000 !important;
}

    /* .menu-bg, #menu {
    top: 0;
    right: 0;
    position: absolute;
    } */

.menu-bg {
  z-index: 1;
  width: 0;
  height: 0;
  margin: 30px 0 20px 20px;
  background: radial-gradient(circle, #2105dc, #05dccd);
  border-radius: 50%;
  transition: 1.0s ease;
  position: absolute;
  right: 0;
}

.change {
  display: block !important;
}

.change .bar {
  background-color: white;
}

.change #bar1 {
  transform: translateY(4px) rotateZ(-45deg);
}

.change #bar2 {
  opacity: 0;
}

.change #bar3 {
  transform: translateY(-6px) rotateZ(45deg);
}

.change-bg {
  width: 520px;
  height: 460px;
  transform: translate(152%,-22%);
}
/* end */
/* for smoth scroll efect */
.reveal {
  position: relative;
  opacity: 0;
}
.reveal.active {
  opacity: 1;
}
.active.fade-bottom {
  animation: fade-bottom 0.5s ease-in;
}
.active.fade-left {
  animation: fade-left 0.5s ease-in;
}
.active.fade-right {
  animation: fade-right 0.5s ease-in;
}
@keyframes fade-bottom {
  0% {
    transform: translateY(50px);
    opacity: 0;
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}
@keyframes fade-left {
  0% {
    transform: translateY(-50px);
    opacity: 0;
  }
  100% {
    transform: translateX(0);
    opacity: 1;
  }
}
@keyframes fade-right {
  0% {
    transform: translateY(50px);
    opacity: 0;
  }
  100% {
    transform: translateX(0);
    opacity: 1;
  }
}
/* end */
p.slogan {
  position: relative;
  font-family: sans-serif;
  text-transform: uppercase;
  font-size: 28px;
  letter-spacing: 4px;
  overflow: hidden;
  background: linear-gradient(0deg, #000, #fff, #000);
  background-size: 100%;
  text-align: center;

}
/* about-us */
.about_img {padding-top: 80px;}
.about_img img{width: 100%;}
.about_containt{color: #fff;margin-top: 20px;}
.border_b{border-bottom: 1px solid #3f3f3f;margin-bottom: 10px;}
.border_b span{font-weight: 700;color: #b3eefc;}



/* end */
/* social */
.footer__address{padding-top: 35px;}
.footer__socials{position: relative;margin-top: 40px;}
.socials .socials__item{width: 100%;float: left;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);margin: 0;padding: 0;display: flex;}
.socials .socials__item li{list-style: none;}
.socials .socials__item li a{position: relative;width: 35px;height: 35px;display: block;text-align: center;margin: 0 10px;border-radius: 50%;padding: 6px;box-sizing: border-box;text-decoration: none;box-shadow: 0 10px 15px rgba(0,0,0,0.3);background: linear-gradient(0deg, #ddd, #fff);transition: .5s;}
.socials .socials__item li a i{height: 100%;display: block;background: linear-gradient(0deg, #fff, #ddd);border-radius: 50%;line-height: calc(35px - 12px);font-size: 15px;color: #262626;transition: .5s;}
.socials .socials__item li a:hover{box-shadow: 0 2px 5px rgba(0,0,0,0.3);text-decoration: none;}
.socials .socials__item li:nth-child(1) a:hover i{color: #3b5998;}
.socials .socials__item li:nth-child(2) a:hover i{color: #00aced;}
.socials .socials__item li:nth-child(3) a:hover i{color: #007bb6;}
.socials .socials__item li:nth-child(4) a:hover i{color: #e4405f;}
/* privacy-policy */
.privacy-policy{padding-top: 100px;}
  .main-policy h3{color: #fff;}
  .main-policy,  .marketing{color: #ddd;}
  .policy-content h4{font-size: 17px;color: #fff;}
  .policy-content ul li {font-size: 15px;}
  .policy-content ul li ul li {list-style-type: decimal;}
  .policy-content ul li a{color: #04f75c !important;text-decoration: underline !important;text-underline-offset: 5px;}
  .policy-content ul li a:hover {color: #fff !important;}
  .design-branding .db-content{align-items: center;display: flex;}
/* markting */
  .content_marketing h4, .web-design h4{color: #fff;}
  .content_marketing img {width: 100%;border-radius: 5px;}
  .marketing p {font-size: 15px;}
  .marketing-import {margin-top: 25px;}
  .marketing-import ul li{list-style: decimal;}

  .web-design{color: #ddd;}
  .web-design img{width: 100%;border-radius: 5px;}
  .web-design p{font-size: 15px;}
  .app-devlopment {color: #ddd;}
  .content_app img {width: 100%;border-radius: 5px;}
  .app-devlopment p {font-size: 15px;}
  .content_app h4{margin-top: 10px;}
/* mwnu */
.r-button {
  --uirButtonBackgroundColor: var(--rButtonBackgroundColor, transparent);
  --uirButtonPadding: var(--rButtonPadding, var(--rButtonPaddingTop, 0) var(--rButtonPaddingRight, 0) var(--rButtonPaddingBottom, 0) var(--rButtonPaddingLeft, 0));
  --uirButtonBorderWidth: var(--rButtonBorderWidth, 0);
  --uirButtonBorderStyle: var(--rButtonBorderStyle, solid);
  --uirButtonBorderColor: var(--rButtonBorderColor, currentColor);
  --uirButtonFontFamily: var(--rButtonFontFamily, inherit);
  --uirButtonFontSize: var(--rButtonFontSize, inherit);
  --uirButtonColor: var(--rButtonColor);
  background-color: var(--uirButtonBackgroundColor);
  /* padding: var(--uirButtonPadding); */
  border-width: var(--uirButtonBorderWidth);
  border-style: var(--uirButtonBorderStyle);
  border-color: var(--uirButtonBorderColor);
  cursor: unset;
  font-family: var(--uirButtonFontFamily);
  font-size: var(--uirButtonFontSize);
}
[type=button]:not(:disabled){cursor: unset !important;}
.r-button::-moz-focus-inner,
.r-button[type="button"]::-moz-focus-inner,
.r-button[type="reset"]::-moz-focus-inner,
.r-button[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}
.r-link {
  --uirLinkDisplay: var(--rLinkDisplay, inline-flex);
  --uirLinkTextColor: var(--rLinkTextColor);
  --uirLinkTextDecoration: var(--rLinkTextDecoration, none);
  display: var(--uirLinkDisplay) !important;
  color: var(--uirLinkTextColor) !important;
  text-decoration: var(--uirLinkTextDecoration) !important;
}
.r-list {
  --uirListPaddingLeft: var(--rListPaddingLeft, 0);
  --uirListMarginTop: var(--rListMarginTop, 0);
  --uirListMarginBottom: var(--rListMarginBottom, 0);
  --uirListListStyle: var(--rListListStyle, none);
  padding-left: var(--uirListPaddingLeft) !important;
  margin-top: var(--uirListMarginTop) !important;
  margin-bottom: var(--uirListMarginBottom) !important;
  list-style: var(--uirListListStyle) !important;
}
.m-hamburger {
  --uiHamburgerThickness: var(--hamburgerThickness, 4px);

  display: var(--hamburgerDisplay, inline-flex);
  width: var(--hamburgerWidth, 28px);
  height: var(--hamburgerHeight, 20px);

  position: relative;
  z-index: 9999;
}
.m-hamburger::before,
.m-hamburger::after,
.m-hamburger__label {
  width: 100%;
  height: var(--uiHamburgerThickness);
  border-radius: var(--hamburgerBorderRadius, 5px);
  background-color: var(--hamburgerBackgroundColor, currentColor);

  position: absolute;
  left: 0;
}
.m-hamburger::before,
.m-hamburger::after {
  content: "";
}
.m-hamburger::before {
  top: 0;
}
.m-hamburger::after {
  bottom: 0;
}
.m-hamburger__label {

  top: calc(50% - calc(var(--uiHamburgerThickness) / 2));
}
.screen-reader {
  width: var(--screenReaderWidth, 1px) !important;
  height: var(--screenReaderHeight, 1px) !important;
  padding: var(--screenReaderPadding, 0) !important;
  border: var(--screenReaderBorder, none) !important;

  position: var(--screenReaderPosition, absolute) !important;
  clip: var(--screenReaderClip, rect(1px, 1px, 1px, 1px)) !important;
  overflow: var(--screenReaderOverflow, hidden) !important;
}
.menu_c_ {
  --uimenu_c_CircleSize: var(--menu_c_CircleSize, 6.25rem);
  --uimenu_c_CircleOffset: var(--menu_c_CircleOffset, 1rem);
  --uimenu_c_CircleHeight: calc(var(--uimenu_c_CircleSize) / 2);
  --uimenu_c_CircleBackgroundColor: var(--menu_c_CircleBackgroundColor, currentColor);
  --uimenu_c_HamburgerWidth: var(--menu_c_HamburgerWidth, 1.75rem);
  --uimenu_c_HamburgerHeight: var(--menu_c_HamburgerHeight, 1.25rem);
  --rButtonPaddingTop: calc(var(--uimenu_c_CircleHeight) - var(--uimenu_c_HamburgerHeight) - var(--uimenu_c_CircleOffset));
  --hamburgerWidth: var(--uimenu_c_HamburgerWidth);
  --hamburgerHeight: var(--uimenu_c_HamburgerHeight);
  --hamburgerBackgroundColor: var(--menu_c_HamburgerBackgroundColor, #fff);
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  /* position: fixed; */
  bottom: 0;
  left: 0;
  z-index: var(--menu_c_Zindex, 9998);
}
.menu_c__activated .menu_c___nav{ width: 100% !important;padding-top: 140px;overflow-y: auto;height: 100vh;}
.menu_c___nav {box-sizing: border-box;width: 100%;height: 0;position: fixed;left: 0;top: 0;transition: opacity .2s ease-out;opacity: 0;/* display: flex;  */align-items: flex-end;z-index: 2;}
.menu_c___list {
  width: 100%;
  max-height: 100%;
  /* overflow-y: auto; */
  -webkit-overflow-scrolling: touch;
}
.menu_c___toggle {
  box-sizing: border-box;
  flex: none;
  position: relative;
}
.menu_c___toggle::before {
  content: "";
  width: 0em;
  height: 1em;
  font-size: var(--uimenu_c_CircleSize);
  /* 1 */
  background-color: var(--uimenu_c_CircleBackgroundColor);
  border-radius: 50%;
  position: absolute;
  bottom: -.5em;
  /* 2 */
  left: calc(50% - .5em);
  z-index: -1;
  will-change: width, height;
  transition: transform .25s cubic-bezier(0.04, -0.1, 0.29, 0.98),
    width .25s cubic-bezier(0.04, -0.1, 0.29, 0.98),
    height .25s cubic-bezier(0.04, -0.1, 0.29, 0.98);
    background: transparent;
}
.m-hamburger::before,
.m-hamburger::after,
.m-hamburger__label {
  transition-timing-function: ease;
  transition-duration: .15s;
}
.m-hamburger::before,
.m-hamburger::after {
  transition-property: transform;
}
.m-hamburger__label {
  transition-property: transform, opacity;
}
.menu_c___toggle:focus {
  outline: var(--menu_c_HaburgerOutlineOWidth, 2px) solid var(--menu_c_HaburgerOutlineColor);
  outline-offset: var(--menu_c_HaburgerOutlineOffset, 5px);
}
.menu_c__activated {
  height: 100%;
}
.menu_c__activated .menu_c___nav {
  flex-grow: 1;
  opacity: 1;

  will-change: opacity;
  transition-duration: .2s;
  transition-delay: .3s;
}
.menu_c__activated .menu_c___toggle::before {
  width: 100vmax;
  height: 100vmax;
  transform: translate3d(-50vh, -50vh, 0) scale(5);
  transition-duration: 1s;
}
.menu_c_:not(.menu_c__activated) .menu_c___list {
  display: none;
}
.menu_c__activated .m-hamburger::before {
  top: 50%;
  transform: translate3d(0, -50%, 0) rotate(45deg);
}
.menu_c__activated .m-hamburger::after {
  transform: translate3d(0, -50%, 0) rotate(135deg);
  top: 50%;
}
.menu_c__activated .m-hamburger__label {
  transform: rotate(-45deg) translate3d(-.285em, -.3em, 0);
  opacity: 0;
}
.menu_c___nav{background: #000 !important;}
.r-link{color: #fff !important;    font-size: 50px;    font-weight: 400;position: relative;}
.menu_c__activated {
  --menu_c_HaburgerOutlineColor: var(--colorWhite);
}
.menu_c___link.r-link img{position: absolute;transition: .5s ease;pointer-events: none;opacity: 0;left: 75px;bottom: 0;width: 20.625vw;z-index: -1;}
.menu_c___link.r-link:hover img{opacity: 1;transform: translate(15px,-15px);}	
.menu_c___link.r-link:hover span{color: #5460f2;transform: translateY(0);transition-duration: .6s;}
.menu_c___group {    text-align: center;
  --rLinkTextColor: var(--colorWhite);
  width: 50%;
float: left;
  padding: 1.3rem 3rem;
  font-size: 2rem;
  font-weight: 700;
  text-transform: uppercase;
}
.linktr {
  order: -1;
  padding: 1.75rem;
  text-align: center;
}
.linktr__goal {
  background-color: rgb(209, 246, 255);
  color: rgb(8, 49, 112);
  box-shadow: rgb(8 49 112 / 24%) 0px 2px 8px 0px;
  border-radius: 2rem;
  padding: .5rem 1.25rem;
}
/* slogan */
#glitch-title {
  background: #000;
  margin: 0;
  padding: 0;
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background-size: cover;
  background-position: center;
}
#wrapper {
  text-align: center;
}
.sub {
  color: #ff4a54;
  letter-spacing: 1em;
}
.glitch-t {
  position: relative;
  color: #fff;
  font-size: 28px;
  letter-spacing: 4px;
  animation: glitch-t-skew 1s infinite linear alternate-reverse;
}
.glitch-t::before {
  content: attr(data-text);
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  left: 2px;
  text-shadow: -2px 0 #ff00c1;
  clip: rect(44px, 450px, 56px, 0);
  animation: glitch-t-anim 5s infinite linear alternate-reverse;
}
.glitch-t::after {
  content: attr(data-text);
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  left: -2px;
  text-shadow: -2px 0 #ff00c1, 2px 2px #ff00c1;
  clip: rect(44px, 450px, 56px, 0);
  animation: glitch-t-anim2 5s infinite linear alternate-reverse;
}
@keyframes glitch-t-anim {
  0% {
    clip: rect(16px, 9999px, 82px, 0);
    transform: skew(0.85deg);
 }
  5% {
    clip: rect(98px, 9999px, 13px, 0);
    transform: skew(0.13deg);
 }
  10% {
    clip: rect(37px, 9999px, 43px, 0);
    transform: skew(0.18deg);
 }
  15% {
    clip: rect(94px, 9999px, 19px, 0);
    transform: skew(0.35deg);
 }
  20% {
    clip: rect(33px, 9999px, 22px, 0);
    transform: skew(0.73deg);
 }
  25% {
    clip: rect(1px, 9999px, 37px, 0);
    transform: skew(0.67deg);
 }
  30% {
    clip: rect(11px, 9999px, 76px, 0);
    transform: skew(0.04deg);
 }
  35% {
    clip: rect(42px, 9999px, 3px, 0);
    transform: skew(0.8deg);
 }
  40% {
    clip: rect(86px, 9999px, 39px, 0);
    transform: skew(0.11deg);
 }
  45% {
    clip: rect(25px, 9999px, 34px, 0);
    transform: skew(0.29deg);
 }
  50% {
    clip: rect(49px, 9999px, 33px, 0);
    transform: skew(0.86deg);
 }
  55% {
    clip: rect(65px, 9999px, 46px, 0);
    transform: skew(0.94deg);
 }
  60% {
    clip: rect(62px, 9999px, 48px, 0);
    transform: skew(0.61deg);
 }
  65% {
    clip: rect(100px, 9999px, 64px, 0);
    transform: skew(0.66deg);
 }
  70% {
    clip: rect(17px, 9999px, 46px, 0);
    transform: skew(0.55deg);
 }
  75% {
    clip: rect(89px, 9999px, 5px, 0);
    transform: skew(0.62deg);
 }
  80% {
    clip: rect(78px, 9999px, 16px, 0);
    transform: skew(0.6deg);
 }
  85% {
    clip: rect(93px, 9999px, 1px, 0);
    transform: skew(0.84deg);
 }
  90% {
    clip: rect(60px, 9999px, 4px, 0);
    transform: skew(0.34deg);
 }
  95% {
    clip: rect(37px, 9999px, 56px, 0);
    transform: skew(0.68deg);
 }
}
@keyframes glitch-t-anim2 {
  0% {
    clip: rect(22px, 9999px, 95px, 0);
    transform: skew(0.59deg);
 }
  5% {
    clip: rect(38px, 9999px, 16px, 0);
    transform: skew(0.21deg);
 }
  10% {
    clip: rect(17px, 9999px, 99px, 0);
    transform: skew(0.86deg);
 }
  15% {
    clip: rect(7px, 9999px, 63px, 0);
    transform: skew(0.7deg);
 }
  20% {
    clip: rect(95px, 9999px, 77px, 0);
    transform: skew(0.18deg);
 }
  25% {
    clip: rect(23px, 9999px, 20px, 0);
    transform: skew(0.9deg);
 }
  30% {
    clip: rect(77px, 9999px, 35px, 0);
    transform: skew(0.19deg);
 }
  35% {
    clip: rect(51px, 9999px, 39px, 0);
    transform: skew(0.08deg);
 }
  40% {
    clip: rect(28px, 9999px, 7px, 0);
    transform: skew(0.39deg);
 }
  45% {
    clip: rect(3px, 9999px, 60px, 0);
    transform: skew(0.6deg);
 }
  50% {
    clip: rect(69px, 9999px, 12px, 0);
    transform: skew(0.77deg);
 }
  55% {
    clip: rect(53px, 9999px, 83px, 0);
    transform: skew(0.27deg);
 }
  60% {
    clip: rect(32px, 9999px, 50px, 0);
    transform: skew(0.37deg);
 }
  65% {
    clip: rect(57px, 9999px, 84px, 0);
    transform: skew(0.94deg);
 }
  70% {
    clip: rect(86px, 9999px, 93px, 0);
    transform: skew(0.88deg);
 }
  75% {
    clip: rect(100px, 9999px, 85px, 0);
    transform: skew(0.17deg);
 }
  80% {
    clip: rect(16px, 9999px, 8px, 0);
    transform: skew(0.64deg);
 }
  85% {
    clip: rect(39px, 9999px, 80px, 0);
    transform: skew(0.33deg);
 }
  90% {
    clip: rect(74px, 9999px, 67px, 0);
    transform: skew(0.6deg);
 }
  95% {
    clip: rect(23px, 9999px, 44px, 0);
    transform: skew(0.95deg);
 }
}
@keyframes glitch-t-skew {
  0% {
    transform: skew(0deg);
 }
  10% {
    transform: skew(3deg);
 }
  20% {
    transform: skew(0deg);
 }
  30% {
    transform: skew(5deg);
 }
  40% {
    transform: skew(3deg);
 }
  50% {
    transform: skew(-2deg);
 }
  60% {
    transform: skew(-1deg);
 }
  70% {
    transform: skew(3deg);
 }
  80% {
    transform: skew(5deg);
 }
  90% {
    transform: skew(5deg);
 }
}
/* end */
/* blog */
.blogs{padding-top: 125px;}
      .blog-con{display: flex;align-items: center;margin-bottom: 35px;}
      .blog-con .blog-img{flex: 57.2% 0 0;position: relative;overflow: hidden;border-radius: 5px;}
      .blog-img::after{content: "";padding-bottom: 56.25%;display: block;}
      .blog-con .blog-img img{border-radius: 5px;display: block;width: 100%;height: 100%;-o-object-fit: cover;object-fit: cover;position: absolute;}
    .blog-list__item:hover img{transform: scale(1.1);}
    .blog-img img{transition: 1s ease;}
    .blog-con-right{color: #fff;}
    .blog-list__title{font-size: calc(.0071428571 * 100vw + 21.7142857143px);line-height: 110%;color: #979efd;margin-bottom: .65em;}
    .blog-list__announce{font-size: calc(.0017857143 * 100vw + 13.4285714286px);line-height: 140%;}
    .blog-list__data{text-transform: uppercase;list-style: none;padding: 0;margin: 0 0 .75em;font-weight: 500;font-size: 10px;display: flex;flex-wrap: wrap;}
    .blog-list__data li{display: flex;align-items: center;margin-right: 1em;margin-bottom: .5em;flex-wrap: wrap;}
    a.blog-list__item:nth-child(even) .blog-con{flex-direction:row-reverse;}
    a.blog-list__item:nth-child(even) .blog-con .blog-img{margin-left: 30px;}
    a.blog-list__item:nth-child(odd) .blog-con .blog-img{margin-right: 30px;}

    .blog-contant-inner{color: #fff;margin-top: 10%;}
    .blog-contant-inner .blog-list__title{font-size: 30px;font-weight: 500;}
    .blog-inner-img {position: relative;margin: 10px 0px;}
    .blog-inner-img img{border-radius: 5px;display: block;width: 100%;height: 100%;object-fit: cover;position: absolute;}
    .blog-inner-img::after {content: "";padding-bottom: 38.25%;display: block;}
    .blog-list__data{text-transform: uppercase;list-style: none;padding: 0;margin: 0 0 .75em;font-weight: 500;font-size: 10px;display: flex;flex-wrap: wrap;}
    .blog-list__data li{display: flex;align-items: center;margin-right: 1em;margin-bottom: .5em;flex-wrap: wrap;}
    .blog-con-inner span{font-size: 15px;}
    .blog-con-inner h3{font-size: 20px;}
    .blog-footer span {font-size: 16px;font-weight: 500;}
    .blog-footer ul{list-style: none;display: block;float: left;padding: 0;}
    .blog-footer a{color: #5460f2 !important;font-size: 18px;}
    .blog-footer{width: 100%;float: left;}
    .lt-img{float: left;width: 50%;margin-right: 15px;}
    .rt-img{float: right;width: 50%;margin-left: 15px;}
/* blo end */
@media (min-width: 1024px) {
  .linktr {position: absolute;right: 1rem;bottom: 1rem;}
}

/* end menu */
@media screen and  (max-width:768px) {
  .blog-contant-inner .blog-list__title{font-size: 25px;font-weight: 500;line-height: 1;}
        .blog-con-inner span{font-size: 13px;}
    .blog-con-inner h3{font-size: 18px;}
    .blog-footer span {font-size: 14px;font-weight: 500;}
    .blog-footer a{font-size: 14px;width: 100%;float: left;}
    .lt-img, .rt-img{float: unset;width: 100%;margin-left: 0;margin-right: 0;}
  .blog-con, a.blog-list__item:nth-child(even) .blog-con{flex-direction: column;}
    .blog-con .blog-img{width: 100%;}
    a.blog-list__item:nth-child(even) .blog-con .blog-img{margin-left:0;}
    a.blog-list__item:nth-child(odd) .blog-con .blog-img{margin-right: 0;}
  .menu_c___group{width: 100%;padding: 0 1rem;text-align: left;}
        .r-link{font-size: 22px;}
        .menu_c__activated .menu_c___nav {padding-top: 65px;}
  .content_marketing h4, .db-content{margin-top: 10px !important;}
    .h1.index-idea__title{font-size: 44px;}
    .form__row{width: 100%;}
    .fa-3x{font-size: 2em;}
    .contacts__address-data{font-size: 14px;}
    .featured-projects__slider-slide-info{position: unset;}
    .ourteam .team .col-md-4 {width: 85%;margin: 0 auto 10px auto !important;}
    .ourteam .team .col-md-4:nth-child(2){margin:0px;}
    .team ul li {width: 50%; float: left;}
    .middle_header{display: block !important;position: fixed;bottom: 15px;left: 0px;}
    .index-hero{padding-top: 20.7vw;}
    .index-hero .index-hero__title h1{font-size: 8vw;}
    .index-hero .index-hero__title h1{font-size: 7vw;}
    .index-wedo__list{flex-direction: column;}
    .index-wedo__list-item{border-bottom: 1px solid #fff;min-height: auto;}
    .index-wedo__list-content{flex-direction: unset;justify-content: space-around;padding: 11.4vw 0 11.4vw 0;}
    .index-wedo__list-item .index-wedo__list-content .index-wedo__list-title span{transform: none;}
    .index-create .index-create__titles{font-size: 6.27vw;}
    .content12 h2:nth-child(1) {color: transparent;-webkit-text-stroke: 1px #03a9f4;}
    .index-create .index-create__description{font-size: 4.39vw; width: auto;}
    .index-wedo__header h2{font-size: 7.27vw;}
    .index-wedo__more .more__text{font-size: 4.2vw;}
    .menu_drop ul li{width: 100%;font-size: 25px;}
    .reviews .h2 a{font-size: 30px;}
    .reviews__description{font-size: 3vw;}
    .slick_con.slick-slide img{ padding: 5px;}
    .featured-projects__slider-slide-title{font-size: 15px;}
    .featured-projects__slider-slide-desc{font-size: 10px; display: none !important;}
    .contacts__form-address {margin-top: 20px;}
    .submit_btn{padding: .4em 1em;}
    .service-app-img img{opacity: 0.6;padding: unset;}
    .app-head{position: absolute;top: 35px;}
    .app-head .h2{font-size: 8.27vw;}
    .service-appdevlopment-page .service-side-text{position: absolute;top: 25%;}
    .service-appdevlopment-page .services__list-list .services__list-option{font-size: 17px;}
    .service-appdevlopment-page{position: relative;   margin-bottom: 25px;}
    .contacts__form{margin: auto !important;}
    .service .services__list-option{font-size: 14px;}
    .services__list-more-inner .more__text{font-size: 16px;}
    .service-cont-img img{opacity: 0.6;padding: unset;}
    .app-head-cont{position: absolute;top: 10px;}
    .app-head-cont .h2{font-size: 6.27vw;}
    .service .services_content-list .services_list_option{font-size: 14px;}
    .service .service-side-text {position: absolute;top: 18%;width: 100%;}
    .service .service-side-text ul.services_content-list{overflow: scroll;height: 197px;}
    .service{  margin-bottom: 25px;}
    .tabItem.slick-current, .tabItem {font-size: 3.3vw !important;}
    .services-hero__title h2{font-size: calc(.01375 * 100vw + 19.6px);}
    .services-hero__description{font-size: 3.38vw;max-width: 100%;}
    .contacts__address .contacts__address-row .fa-3x{font-size: 2rem;}

}
@media (max-width: 480px){
    .service-appdevlopment-page .service-side-text{top: 20%;}
    .app-head{top: 15px;}
    .service-appdevlopment-page .services__list-list .services__list-option{font-size: 13px;}
    .w_small{top: 27% !important;}
    .change-bg{width: 380px;height: 445px;}
}
@media (min-width: 480px){
.header_contant {padding-left:8.11%;padding-right: 8.11%;transition: 1s ease;}
.middle_header{transition: 1s ease;}
}
@media (max-width: 400px){
    .middle_header{display: none;}
    .footer__logo img{width: 270px;}

}
@media (max-width: 325px){
  .app_w{overflow: scroll !important;height: 200px !important;}
}
@media (max-width: 365px){
  .ourteam .team img{width: 255px;}
}
@media (max-width: 1024px) and (min-width: 768px){
  .contacts__address{display: inline-block;}
  .fa-2x{margin-right: 8px;}
  .footer__logo img{width: 216px;}
}
@media (min-width: 200px) {
  .change-bg {transform: translate(45%,-35%);}
}
@media (max-width: 744px) and (min-width: 613px){
  .index-hero .index-hero__title h1{font-size: 6vw;}
}