/*********css for the mobile device*********** */
@media (min-width: 100px) and (max-width: 996px)
 { #navbar_top li.nav-item {width: 30%;}
  .text-hero-section h1 {font: normal 900 54px/70px 'Raleway';}
 .text-hero-section {margin: 50px 0;/*text-align: center;*/margin-top: 15%;}
 .rotating-text-wrapper {margin: -20px 0px 20px;height: 14vh;}
h3 {font: normal 400 24px/1.8 'poppins';}
.imgheight{height: 400px;}
.bus-arrow-btn::before {position: absolute;top: 0%;right: 0%;height: 53px;width: 53px;content: '';border-radius: 9999px;background-color: rgb(13,132,229);opacity: 0;z-index: -1;pointer-events: none;animation: none;}
.navbar-brand {font: normal 400 45px/100% 'Goldman';}
.business-btn {font: normal 600 20px/normal 'Nunito';padding: 14px 25px;display: inline;vertical-align: middle;}
.client-foot h3 {font-size: 15px;line-height: 25px;}
.bttn {border-radius: 64px;width: 100%;height: 60px;vertical-align: middle;display: inline;margin: 7px auto;}
.ff-text {margin: 20px 0;}
.bus-arrow-btn {font: normal 600 16px/normal 'Nunito';}

.ff-text h2 {font: normal 400 34px/70px 'Poppins';}
p.inkmind span {font: normal 600 150px/100px 'Poppins';}
p.inkmind {color: #000;font: normal 400 80px/50px 'Poppins';letter-spacing: -2.75px;text-transform: capitalize;margin: 20px;}
/* .agency-sec .agency-text h5,.dev-sec .dev-text h5, .data-sec .data-text h5, .social-text h5, .clients-sec h5, .ads-sec .ads-text h5, .seo-sec .seo-text h5 {font: normal 600 35px/50px 'Poppins'; letter-spacing: 0px;} */
.agency-text::before, .dev-text::before, .data-text::before, .ads-text::before, .social-text::before, .seo-text::before {top: -10px;left: -10px;height: 100px;width: 100px;}
/* .scrolling-text {margin-top: 30px;} */
.scrolling-text {margin-top: 50px;}
h6 {font: normal 400 16px/25px 'Poppins';}
.seo-text, .dev-text {margin-top: 40px;}
h4 {font: normal 400 20px/28px 'Poppins';}
.agency-sec {padding: 80px 0px;}
.ml-60, .mbl {margin-left: 10px!important}
.agency-text h5 {color: #000;font: normal 500 28px/normal 'Poppins';}
.seo-text p, .data-text p, .dev-text p, .ads-text p, .agency-text p ,.social-text p {font: normal 400 14px/150% 'Poppins';padding: 0 0 20px 0;text-align: start;letter-spacing: .5px;}
.seo-sec {padding: 0px 0;}
.agency-sec .agency-text h5,
.projects-sec h5,.social-text h5, .dev-sec .dev-text h5, .data-sec .data-text h5, .clients-sec h5, .ads-sec .ads-text h5, .seo-sec .seo-text h5 {color: var(--base-02, #090914);font: normal 600 24px/30px 'Poppins';letter-spacing: 1px;}
/* .mt-60 {margin-top: 40px !important;margin-bottom: 60px;width: 95%;} */
.mt-60 {
  margin-top: 10px !important;
  margin-bottom: 10px;
  width: 95%;
}
.seo-figure {height: 400px;}
/* .f-section {padding: 30px 0;} */
.f-section {padding: 0px 0;}
.seo-figure .img2 {width: 336px;height: 240px;}
.seo-figure .img1 {width: 260px;height: 330px;}
.dev-figure .img1 {width: 254px;height: 242px;}
.dev-figure .img2 {width: 71px;height: 102px;}
.dev-figure .img3 {width: 74px;height: 74px;}
.dev-figure .img4 {width: 195px;height: 85px;}
.data-figure {position: relative;height: 350px;}
.dev-figure {height: 359px;}
.dev-text {margin: 50px 0;}
.data-figure:hover .img2 {bottom: 300px;right: -0px;}
.data-figure .img2 {width: 173px;height: 130px;position: absolute;right: 0%;bottom: 80%;}
/* .data-figure .img1 {width: 336px;height: 300px;position: absolute;top: -15px; right: 30%;} */
.data-figure .img1 {width: 336px;height: 300px;position: absolute;top: -15px;right: -10px;}
.data-figure .img3 {width: 213px;height: 159px;position: absolute;top: 132px;left: 0%;}
.ads-figure {position: relative;height: 451px;}
/* .ads-figure .img1 {width: 345px;height: 323px;position: absolute;top: 10%;right: -6%;} */
.ads-figure .img1 {width: 256px;height: 172px;position: absolute;top: 70px;right: 44px;}
.ads-figure .img2 {width: 118px;height: 125px;position: absolute;right: 10px;bottom: 60px;}
.ads-figure .img3 {width: 131px;height: 97px;position: absolute;top: 54%;left: 0%;}
.ads-figure:hover .img1 {top: 26px;right: 45px;}
.ads-figure:hover .img2 {bottom: 80px;right: 0px;}
.ads-figure:hover .img3 {top: 49%;left: 0%;}
.dev-sec::after {background-repeat: round;}
.clients-sec .projects {width: 100%;}
/* .social-figure .img2 {width: 236px;height: 143px;left: 16%;} */
.social-figure .img2 {width: 200px;height: 112px;left: 50px;}
.social-figure:hover .img2 {top: 25%;left: 61px;}
.social-figure .img3 {width: 48px;height: 76px;}
.social-figure .img4 {width: 63px;height: 70px;left: 33%;}
.social-figure .img5 {width: 30px;height: 30px;top: 10%;left: 20%;}
.social-figure .img6 {width: 33px;height: 21px;}
.social-figure .img7 {width: 32px;height: 35px;}
.social-figure .img8 {width: 25px;height: 24px;}
.social-figure .img10 {width: 33px;height: 26px;}
.social-figure .img11 {width: 18px;height: 16px;}
.social-figure .img9 {width: 32px;height: 26px;}
.mtmob {margin-top: 50px;}
.data-sec, .ads-sec, .agency-figure, .projects-sec, .dev-sec {position: relative;padding: 30px 0;}
.dev-sec {padding: 20px 0;}
.ads-figure::before, .dev-figure::before, .seo-figure::before, .data-figure::before {height: 31%;width: 29%;}
.agency-sec {padding: 20px 0px;}
/* #div1 {font: normal 400 70px/80px 'Poppins';animation: 10s linear .3s infinite marquee;} */
#div1 { font: normal 400 24px/80px 'Poppins';animation: 10s linear .3s infinite marquee;font: normal 400 24px/37px 'Poppins';letter-spacing: 1px;margin: 0;}
.projects-sec .projects {margin: 30px auto;width: 100%;}
h6.mt-20 {  margin-top: 20px;width: 95%;}
a.dev-btn::after, a.data-btn::after, a.ads-btn::after, a.seo-btn::after, a.social-btn::after {height: 192%;width: 150%;}
.navbar-collapse {position: absolute; height: auto;width: 100%;z-index: 999;right: 0px;top: 59px;background: #ffffff;padding: 0px 0px 5px;border: none;text-align: left;border-radius: 8px;}
.navbar-toggler {padding: .25rem .75rem;font-size: 1.25rem;background-color: transparent;border: 1px solid transparent;border-radius: .25rem;transition: box-shadow .15s ease-in-out;position: absolute;right: 20px;top: 10px;}
.modal-body {margin: 0px 5px 40px 5px;}
.card-container {margin: 30px 10px;padding: 40px 10px;}
.card-container h1 {font: normal 400 50px/70% 'Poppins';}
.card-container h6 {margin: 30px;font: normal 400 16px/125.5% 'poppins';}
.inner-header {height: 118vh;}
.footer-head{margin-top: 40px;}
h5.mt-20{font: normal 600 34px/52px 'Poppins';}
figure.social-figure,
figure.data-figure{margin-top: 80px;}
.social-text.d-block.d-sm-none,
.data-text.d-block.d-sm-none {margin-bottom: 105px;}
.footer-section .foot {margin-top: 25px;margin-bottom: 30px;}
.footer-points li {margin-bottom: 6px;}
.agency-text p b{font-weight: 600;}
.seo-figure{ margin-top: 20px;}
a.dev-btn, a.data-btn, a.ads-btn, a.social-btn, a.seo-btn {padding: 10px 30px;font: normal 400 14px/24px 'Poppins';}
.arrow-btn {margin: 30px 0 30px;}
.dev-text h5::before, .data-text h5::before, .ads-text h5::before, .social-text h5::before, .agency-text h5::before, .seo-text h5::before {top: -10px;left: -9px;height: 83px;width: 99px;}
.text-hero-section .mt-20 {margin-top: 30px;}
.pr{padding-right: 20px !important;}
.rotating-text-wrapper h2 {font: normal 400 50px/55px 'Poppins';
}.agency-figure::after {position: absolute;right: -50px;content: '';z-index: -1;background: url(./img/export/mob-tail.svg);background-repeat: repeat;background-repeat: no-repeat;height: 100%;width: 100%;animation: swiing 10s linear 1s infinite backwards alternate;top: inherit;bottom: -100%;right: 0;left: inherit;
}@keyframes swiing{
  20% {
    -webkit-transform:  translateX(-50px) rotate3d(0, 0, 1, 15deg);
    transform: translateX(-50px) rotate3d(0, 0, 1, 15deg);
  }
  /* 40% {
    -webkit-transform: rotate3d(0, 0, 1, -10deg);
    transform: rotate3d(0, 0, 1, -10deg);
  } */
  60% {
    -webkit-transform:translateX(0) rotate3d(0, 0, 1, 50deg);
    transform:translateX(0) rotate3d(0, 0, 1, 50deg);
  }
  /* 80% {
    -webkit-transform: rotate3d(0, 0, 1, -5deg);
    transform: rotate3d(0, 0, 1, -5deg);
  } */
  100% {
    -webkit-transform:translateZ(+50px) rotate3d(0, 0, 1, 0deg);
    transform:translateZ(+50px) rotate3d(0, 0, 1, 0deg);
  }
}
.seo-figure .img1 {position: absolute;z-index: 1;left: -45px;top: 70px;}
.seo-figure .img2 {position: absolute;right: -28px;top: 10px;}
.dev-figure::after {position: absolute; height: 236px;width: 287px; background-size: contain;left: 25px;}
.dev-figure .img3 {position: absolute;top: 150px;right: 130px;}
.dev-figure .img2 {top: 118px;left: 0px;position: absolute;z-index: 1;}
.dev-figure .img1 {position: absolute;right: 34px;top: 0px;}
.dev-figure .img4 {left: 47%;transform: translateY(200px);top: -65px;position: absolute;}
.dev-figure:hover .img1 {top: -10px;}
.dev-figure:hover .img3 {right: 160px;}
.mtb-60{margin-top: 80px !important;}
.backblue{max-height: 180px;}
.mar-0{margin: 0 !important;}
.btn-center.mt-60 {margin-bottom: 80px;}
.dev-sec::before {background: url(./img/export/bglines.svg); top: 20%;background-repeat: no-repeat;}

a.dev-btn::after, a.data-btn::after, a.ads-btn::after, a.seo-btn::after, a.social-btn::after {
  display: block;
  position: absolute;
  content: '';
  background: url(./img/export/shadow.svg);
    background-repeat: repeat;
    background-size: auto;
  background-repeat: repeat;
  background-size: auto;
  background-size: cover;
  height: 100px;
  width: 180px;
  top: 70%;
  left: 50%;
  transition: all .5s ease;
  z-index: -1;
  background-repeat: no-repeat;
  transform: translate(-50% ,-50%);
}

.dev-figure .img1{position: absolute;left: 40px;top: -1px;}
.dev-figure .img2{top: 118px;left: 10px;position: absolute;z-index: 1;}
.dev-figure .img3{position: absolute;top: 140px;left: 80px;}
.dev-figure .img4{left: 120px;top: -65px;position: absolute;}
.dev-figure:hover .img1{left: 15px;top: -1px;}
.dev-figure:hover .img2{top: 118px;left: 10px;}
.dev-figure:hover .img3{top: 140px;left: 80px;}
.dev-figure:hover .img4{left: 120px;top: -65px;} 
.dev-figure::before {position: absolute;background: var(--linear, linear-gradient(90deg, #44FF9A 0%, #44B0FF 23.44%, #8B44FF 48.96%, #F64 73.96%, #EBFF70 100%));filter: blur(35px);content: '';top: 80px;left: 80px;transform: translate(-50px,-50px);height: 200px;width: 250px;z-index: -1;}
.ads-figure, .social-figure, .dev-figure, .seo-figure, .data-figure {position: relative;height: 400px;min-width: 325px;width: 350px;margin:0 auto;    z-index: 1; }

/*********css for the fliping animation***********/
.content{display:grid ;}
.content {height: 8vh;}
.digital{width: 100%;display: block;}
.content__container{width: 100%;display: block;}
h2.digi {
  font: normal 500 30px/100% 'Poppins';
  text-transform: uppercase;
  color: #101828;
  text-align: start;
  margin-left: 0px;
}
.content__container {
  overflow: hidden;
  height: 35px;
}.content__container__list__item {

  font: normal 700 30px/100% 'Poppins';
  color: #0D84E5;
  margin-left: 0px;
  margin-top: 5px;
}

 }

