/* You can add global styles to this file, and also import other style files */
*{margin:0; padding:0; box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box; }
*:after,*:before{box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;}
table { border-collapse:collapse; border-spacing:0;}
fieldset,img{border:0;display: initial;}
address,caption,cite,code,dfn,em,strong,th,var {font-style:normal; font-weight:normal; }
ol,ul { list-style:none;}
caption,th {text-align:left;}
q:before,q:after {content:'';}
abbr,acronym { border:0;}
header,nav,section,article,aside,footer,hgroup,figure {display: block; }
/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button, input::-webkit-inner-spin-button {-webkit-appearance: none;margin: 0;}
.wrapper{overflow-x: hidden; overflow: hidden;}
/************Firefox*****************/
input[type=number] {-moz-appearance:textfield;}
button:focus, input:focus{outline: none ;box-shadow: none;outline-color: transparent;outline-width: 0;}
h1,h2,h3,h4,h5,h6,p,ul,ol,figure{margin-bottom: 0;}
html, body{max-width: 100%;/*overflow-x: hidden;*/}
.modal-content{border: 0;}
.custom-control-input:focus~.custom-control-label::before{box-shadow: none;}
a, a:hover{text-decoration: none;outline: 0;outline-color: transparent;outline-width: 0;-webkit-appearance: none;-moz-appearance: none;appearance: none;}
button{-webkit-appearance: none;-moz-appearance: none;appearance: none;}
.form-group{position: relative;}
.wrapper{overflow-x: hidden;}
body{
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}
body::-webkit-scrollbar {
    display: none;
  }
:root{
--black:#000000;
--white:#ffffff;
--black-fonts:#2D2E2E;
--darkgreen:#3A4F39;
--grey-input:#ABABAB;
--light-grey:#F6F6F6;
--light-green-bg:#EFF6F3;
--yellow:#F8D254;
--green:#A0CD9E;
}

html {scroll-behavior: smooth;}
img{width: 100%;height: auto; padding: 0; margin: 0 ;}
a:focus, a:hover {text-decoration: none;outline: 0;color: var(--white);}
h1{font:normal 600 50px/auto 'Paytone One';  color: var(--orange);  }
h2 {font:normal 600 32px/auto 'Paytone One';color:var(--white)}
p{font:normal 400 12px/auto 'Poppins'; color: var(--black)}
h3 {font :normal 400  32px/normal 'poppins' ;}
h4{color: #000;font:normal 400 32px/54px 'Poppins';}
h5{color: #000;font:normal 500 40px/normal 'Poppins';}
h6{color:  #52525B;text-align: center;font:normal 400 18px/30px 'Poppins'; }
.nav-link {position: relative;text-transform: uppercase;}
.mt-20{margin-top: 20px;}
.nav-link.active:before{line-height: 10px; margin-top: 2px; padding-top: 2px; transition: width ;position: absolute;height: 7px;left:0%; width: 100%;bottom: 0px;/*left: 0%;*/left:50%; transform: translate(-50%, 0%);content: '';background: url(./img/export/root.png);background-repeat: no-repeat;/*visibility: hidden*/; animation: rotateAnimation-x 5s linear 1s infinite alternate-reverse;} 
/* .nav-link:before {position: absolute;height: 6px;width: 100%;bottom: 0px;left: 0%;left:50%; transform: translate(-50%, -50%);content: '';background: url(./img/export/root.png);background-repeat: no-repeat;visibility: hidden; animation: rotateAnimation-x 5s linear 1s infinite alternate;} */
@keyframes rotateAnimation-x{
  /* 25%,75%{transform: translateX(0%);}
  100%{transform: translateX(100%);} */
  0%{ width: 0%;visibility: visible;} 100%{width: 100%;}
}
.container.ff-text {margin: 10px auto -20px;}
/***********************marque css********************/
#maindiv{overflow:hidden;background:#fff;width:100%}
/* margin: 120px; */
#div1 {font: normal 400 96px/99px 'Poppins';color: #000;text-transform: capitalize;margin: 30px 0 -20px;letter-spacing: -3.75px;padding: 10px;width: 100%;animaaation: 15s linear .3s infinite marquee;/*white-space: nowrap;*/}
@keyframes marquee{from{transform:translateX(100%)}to{transform:translateX(-100%)}}
.blinking{color:#000;}
@keyframes blinkingText{0%,100%,49%{color:#333}60%,99%{color:#ccc;}}

/*******************marque css*************************/
.mt-20{margin-top: 20px;}
@keyframes rotateAnimation {
0% {transform: translate(-50%, -50%) rotateX(0deg);}
100% {transform: translate(-50%, -50%) rotateX(360deg);}}
.agency-figure img {border-radius: 32px ;/*filter:*/ box-shadow: 10px 20px 50px 0px rgba(0, 0, 0, 0.15);}
.agency-figure {position: relative;}
.agency-figure::after {position: absolute;right: -50px;content: '';z-index: -1;background: url(./img/export/tail.svg);background-repeat: no-repeat;height: 100%;width: 100%;animation: swing 10s linear 1s infinite forwards;top: 80%;bottom: 0px;right: 0;left: revert;}
/* .agency-figure::after{position: absolute;bottom: -5%;right: -50px;content: '';z-index: -1;background: url(./img/export/tail.svg);background-repeat: no-repeat; height: 100%;width: 100%;animation: swing 10s linear 1s infinite   forwards;} */
@keyframes swing{
  20% {
    -webkit-transform:  translateX(-150px) rotate3d(0, 0, 1, 15deg);
    transform: translateX(-150px) 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(+150px) rotate3d(0, 0, 1, 0deg);
    transform:translateZ(+150px) rotate3d(0, 0, 1, 0deg);
  }
}
.rolerx{max-width: 460px;width: 100%;}
.agency-mar br{margin-bottom: 60px;}
.bttn a:hover{color: #000;}
.data-sec{padding-top: 180px;}
.mt-40{margin-top: 40px !important;}
.mt-60{margin-top: 60px !important;}
.ml-60{margin-left:58px ;}
/* .nav-link.active:before{width: 100%;} */
.nav-item { margin: 0 10px;}
.nav-item a{color: #000;font: normal 600 15px/normal 'Nunito';}
.navbar-brand{overflow: hidden;color: #000;text-overflow: ellipsis;font:normal  400 48px/98% 'Goldman';letter-spacing: 0.96px;text-transform: uppercase;}  
.navbar-brand img{height: 56px;}
.social-links{display: flex;}
.social-links li{margin:auto 10px;padding: 5px 0;}
ul.social-links{display: flex;padding: auto;}
ul.social-links li a {color: #000;transition: all .3s ease;}
ul.social-links li a:hover, ul.social-links li a:focus, ul.social-links li a:active {color: #78838b;transition: all .3s ease;}
.navbar{padding-top:1px !important; padding-bottom: 1px!important;border-bottom: 1px solid #f3eded;}
#navbar_top .nav-link{color: #000;font:normal 400  15px/normal 'Nunito';}
#navbar_top .nav-link.active {font:normal 600  15px/normal 'Nunito';}
.navbar-toggler-icon {display: inline-block;/*box-shadow: 0px -1px 3px 0px;*/width: 1.5em;height: 1.5em;vertical-align: middle;background-repeat: no-repeat;background-position: center;background-size: 100%;}
.navbar-toggler:focus {text-decoration: none;outline: 0;}
.navbar-toggler:focus {text-decoration: none;outline: 0;box-shadow: 1px 1px 0 0rem;}
.scrolling-text{margin-top: 70px;}

/***************css for the overlapping ******************/
.poss-hero-section{position: relative;}
.overlapping{position: absolute;content: '';top: 0px ;z-index: -1; left: 0px;right: 0; height: 100%;width: 100%;}
#liquid {height: 100%;width: 100%;}

/*********css for the hero section **********/
.hero-section{background: var(--white);position: relative;}
.text-hero-section h1{font:normal 900 150px/130px 'Raleway';color:#2B2F31;text-transform:uppercase;}
.text-hero-section h1 span{display: block; color: rgb(13,132,229);
color: -moz-linear-gradient(90deg, rgba(13,132,229,1) 20%, rgba(0,165,165,1) 80%);
color: -webkit-linear-gradient(90deg, rgba(13,132,229,1) 20%, rgba(0,165,165,1) 80%);
color: linear-gradient(90deg, rgba(13,132,229,1) 20%, rgba(0,165,165,1) 80%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#0d84e5",endColorstr="#00a5a5",GradientType=1);
background: var(--pre, linear-gradient(180deg, #0D84E5 0%, rgba(0, 165, 165, 0.00) 100%));
background-clip: text;-webkit-background-clip: text;-webkit-text-fill-color: transparent;}
.text-hero-section{margin: 25px 0;max-width: 1226px;width: 100%;max-height: 447px;height:100%;}
@keyframes infinityShape {
  0% {transform: translateX(300px) rotate(0deg);}
  50% {transform: translateX(-300px) rotate(360deg);}
  100% {transform: translateX(300px) rotate(720deg);}}
.hero-section{z-index: 99;}
.text-hero-section h3 span {font-weight: 700;}
.business-btn {position: relative;color: #1C1C1C;font: normal 600 24px/normal 'Nunito';border-radius: 64px;border: 1px solid #0B0B0B;padding: 10px 20px;}
.business-btn::after {background: url(./img/export/arow.svg);background-repeat: repeat;background-repeat: no-repeat;  position: absolute;top: 50%;right: 0%;height: 53px ; width: 53px;content: '';display: inline-block; transform: translateY(-50%);transition: all 1s linear;}
.business-btn:hover::after {right: -20%;transition: all 1s ease;}
.business-btn:hover span{display: inline-block;animation: moveRight 1s linear;}
.bttn {border-radius: 64px;width: 30%;height: 60px;padding: 11px;margin: 44px 0; transition: all 1s ease;}
.f-section{position: relative;}
.ff-text h2{color: #000;font: normal 400 52px/99px 'Poppins';letter-spacing: -1.44px;}
p.inkmind span{color: #000;font:normal 600 250px/99px 'Poppins';letter-spacing: -3.75px;text-transform: capitalize;}
p.inkmind{color: #000;font:normal 400 250px/99px 'Poppins';letter-spacing: -3.75px;text-transform: capitalize;line-height: 50px;margin: 120px;}
 
/* *****css for reading text********** */
.h4{color: #000;font:normal 300 64px/74px 'Poppins';}
.f-text{white-space: nowrap;overflow: hidden;}
.img-contain{width: 560px;height: 500px;position: relative;margin: auto;}

/* ********agency section*******/ 
.scrolling-text h4{opacity: 1;}
.agency-sec{padding: 100px 50px;}
.agency-figure {position: relative;}
.seo-text p,.data-text p, .dev-text p, .ads-text p, .social-text p,.agency-text p{/*color: #565656;font:normal 400 16px/160% 'Poppins'*/color: #565656;font: normal 500 15px/160% 'Poppins';}
.agency-mar{margin: 60px 0 60px;}

/********third section********* */
.seo-sec{padding: 80px 0;}
.main-section-heading h5,.dev-sec .dev-text h5, .data-sec .data-text h5, .social-text h5,.agency-text h5,.projects-sec h5,.clients-sec h5, .ads-sec .ads-text h5, .seo-sec .seo-text h5{color: var(--base-02, #090914);font: normal 600 43px/54px 'Poppins';text-transform: capitalize;letter-spacing: 0px;}
.dev-text, .data-text , .ads-text, .social-text ,.agency-text,.seo-text{position: relative;max-width: 100%;width: 100%;}
.dev-text h5::before, .data-text h5::before, .ads-text h5::before,.social-text h5::before,.agency-text h5::before,.seo-text h5::before{position: absolute;content: '';top: -10px;left: -24px;height: 150px; width: 150px;background-color:  #EFF1FF;border-radius: 0px 0px 100px 0px;z-index: -1;}
.btn-center{text-align: start;display: flex;justify-content: flex-start;align-items: center;margin: 20px 0  ;}
a.dev-btn, a.data-btn, a.ads-btn, a.social-btn, a.seo-btn{position: relative; padding: 15px 30px 15px 30px; text-transform: capitalize;border-radius: 10px;background: #1287E4;border: none;color: #fff;color: #FFF;text-align: right;font:normal 400 18px/24px 'Poppins'; transition: all .5s ease;}
a.dev-btn:hover, a.data-btn:hover, a.ads-btn:hover, a.social-btn:hover, a.seo-btn:hover{background: #1c95fb; /*color: #444;*/}
a.dev-btn:hover::after, a.data-btn:hover::after, a.ads-btn:hover::after, a.social-btn:hover::after,a.agency-btn:hover::after,a.seo-btn:hover::after{top:62%;left: 50%; }
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-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%);}
.data-figure img, .dev-figure img, .ads-figure img, .social-figure img,.seo-figure img{transition: all 400ms cubic-bezier(.47, 1.64, .41, .8);}

/* .seo-figure{position: relative; background: #FFF;}
.seo-figure .img1{width: 326px;height: 440px;position: absolute;position: absolute;z-index: 1;left: -100px;top:70px; }
.seo-figure .img2{width: 601px;height: 367px;position: absolute;right:-60px;top:10px; }
.seo-figure:hover .img1{left: -50px;top: 60px;}
.seo-figure:hover .img2{top: 10px;right: -10px;} */
/* .seo-figure .img1{  position: absolute;top: 50px;right: 50px;height: 468px;width: 380px;z-index: 2;}
.seo-figure:hover .img1{}
.seo-figure .img2{position: absolute;right: -28px;top: 50px;height: 343px;z-index: 1;}
.seo-figure:hover .img2{  } */
.seo-figure .img1 {width: 326px;height: 440px;/* position: absolute; */position: absolute;z-index: 1;left: -50px;top: 60px;
}.seo-figure .img2 {width: 601px;height: 367px;position: absolute;right: -23px;top: 10px;
}.seo-figure:hover .img1 {left: -80px;top: 70px;}.seo-figure:hover .img2 {top: 10px;right: -43px;}

/* ************dev-sec****************/
.data-sec,.ads-sec,.agency-figure,.dev-sec{position: relative;padding: 80px 0; }
.dev-sec::before{background: url(./img/export/bglines.svg);background-position: right; background-repeat: no-repeat; height: 100%;width: 100%;position: absolute;content: " ";z-index: -1; top: 20%;left: 0; background-position: bottom;animation:  moveinx 60s linear 1s forwards infinite ,hide-scroll 1s ease-in-out;;}
/* .dev-figure{position: relative; border-radius: 20px;border: 1px solid #EBEBEB;background: #FFF;height: 500px;} */
.dev-figure::after{content: '';position: absolute;z-index: -1; background: url(./img/export/devbackground.svg);top: 0;left: 0;height: 458px;width: 558px;right: 0;}
.dev-figure .img1{width: 483px;height: 384px;position: absolute;right: 34px;top: 50px;}
.dev-figure .img2{width: 150px;height: 200px;top: 203px;left: -30px;position: absolute;z-index: 1;}
.dev-figure .img3{width: 80px;height: 140px;position: absolute;top: 249px;right: 350px;}
.dev-figure .img4{width: 320px;height: 192px;left: 47%;transform: translateY(200px);top: 10%;position: absolute;}
.dev-figure:hover .img1{top: 20px; }
.dev-figure:hover .img2{left: -50px;}
.dev-figure:hover .img3{right:60%; }
.dev-figure:hover .img4{left:52%; } 
.dev-figure  { 
    height: 458px;
    width: 558px;
}
    @keyframes moveinx{

  0% {
    transform: rotateX(45deg) scaleY(1);
  }
  50% {
    transform: rotateX(-45deg) scaleY(0.5);
  }
  /* 0%,50%,100% {transform: translateX(-2%) rotateX(1deg);}
 25%, 75% {transform: translateX(2%) rotateX(10deg);} */
}
@keyframes hide-scroll {
  from, to {
    overflow: hidden;
  }
}
/*.max{max-width: 450px;width: 100%;}
 .seo-figure::after {
  content: '';
  position: absolute;
  z-index: -1;
  background: url(./img/export/devbackground.svg);
  top: 0;
  left: 0;
  height: 458px;
  width: 558px;
  right: 0;
} */

/* *********data analytics********* */
.ads-figure, .social-figure,.dev-figure,.seo-figure,.data-figure{position: relative;width: 560px;height: 500px;position: relative;}
.ads-figure::before, .dev-figure::before,.seo-figure::before,.data-figure::before, .social-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: 50%;left: 50%;transform: translate(-50%,-50%);height: 10%;width: 96%;z-index: -1;}
.data-figure .img1{width: 600px;height: 367px;position: absolute;top: 10px;right: 13px;}
/* .data-figure .img2{width: 230px;  height: 169px;;position: absolute;right:0%;bottom: -154px;} */
.data-figure .img2 {width: 230px;height: 169px;position: absolute;right: 0px;bottom: 370px;}
.data-figure .img3{width: 320px;height: 238px; position: absolute; top: 132px;left: 0%;}
/* .data-figure:hover .img1 {right: 18px;} */
.data-figure:hover .img1 {/*right: 0;*/top: 0;}
.data-figure:hover .img2 {right: -20px;/*bottom: 380px;*/}
.data-figure:hover .img3{/*top: 152px;*/left: -3%;}


/* **********google ad section's**************/
/* .ads-figure .img1{width: 601px; height: 367px;;position: absolute;top:-25px;right: 0; } */
/* .ads-figure .img1 {width: 357px;height: 202px;position: absolute;top: 30px;right: 90px;} */
.ads-figure .img1 {width: 320px;height: 150px;position: absolute;top: 0px;right: 110px;}
.ads-figure .img2{width: 197px;  height: 176px;;position: absolute;right: 50px;bottom: 170px;}
.ads-figure .img3{width: 231px; height: 181px; position: absolute;top: 154px;left: 30px;}
/* .ads-figure:hover .img1 {top: -35px;right: 0px;} */

.ads-figure:hover .img1 {top: -25px;right: 110px;}
.ads-figure:hover .img2 {bottom: 150px;right: 30px;}
.ads-figure:hover .img3 {top: 180px;left: 0px;}

/************css for the projects clients ********/
.projects-sec .projects{max-width: 100%;margin:50px auto;width: 50%;}

/* **********css for the footer animation***** */

.header {  position:relative;text-align:center;background: linear-gradient(60deg, rgb(238, 238, 238) 0%, rgb(255, 255, 255) 100%);color:white;}
.logo {width:50px;fill:white;padding-right:15px;display:inline-block;vertical-align: middle;}
.inner-header {height:45vh;width:100%;margin: 0;padding: 0;}
.flex { /*Flexbox for containers*/display: flex;justify-content: center;align-items: center;text-align: center;}
.waves {position:relative;width: 100%;height:15vh;margin-bottom:-7px; /*Fix for safari gap*/min-height:100px;max-height:150px;}
.content {position:relative;/*height:20vh;*/text-align:center;background-color: white;padding: 20px 0;}
/* Animation */
.parallax > use {animation: move-forever 25s cubic-bezier(.55,.5,.45,.5) infinite;}
.parallax > use:nth-child(1) {animation-delay: -2s;animation-duration: 7s;}
.parallax > use:nth-child(2) {animation-delay: -3s;animation-duration: 10s;}
.parallax > use:nth-child(3) {animation-delay: -4s;animation-duration: 13s;}
.parallax > use:nth-child(4) {animation-delay: -5s;animation-duration: 20s;}
@keyframes move-forever {
  0% {transform: translate3d(-90px,0,0);}
  100% {transform: translate3d(85px,0,0); }
}
/*Shrinking for mobile*/
@media (max-width: 768px) {
  .waves {height:40px;min-height:40px;}
  .content {height:20vh;}
  h1 {font-size:24px;}
}

/* ********footer css ************ */
#footer {color: #fff; transition: all .3s ease;}
#footer:hover {color: #90bbdf}
.backblue{background: #111 !important;}
.footer-enquire-quick-btn {position: relative;text-transform: capitalize;border-radius: 10px;background: #1287E4;border: none;color: #FFF;text-align: right;font: normal 500 12px/24px 'Poppins';width: 100%;display: flex;justify-content: center;padding: 4px;transition: all .3s ease;}
.footer-enquire-quick-btn:hover{background-color: #5b99cc;}
.footer-form .form-control {outline: 0 !important;border: 1px solid var(--black-black-32, rgba(17, 17, 17, 0.32));border-radius: 8px;background: #fff;}
.footer-form .button-container {margin: 20px auto 0px;}
.form-group select.form-control{color: #11111191;}
.footer-address li{display: flex;}
.footer-address li i{float: left;}
.footer-section-head h2{color: var(--gray-900, #101828);font:normal 600 36px/44px 'Poppins';  letter-spacing: -0.72px;position: relative;margin-bottom: 16px;}
.footer-section-head h2::before {content: '';position: absolute;display: block;background: url(./img/export/ink.svg);background-repeat: no-repeat;top: -50%;left: 0;height: 50px;width: 50px;}
.footer-section-head p {font: normal 400 16px/182% 'Poppins';color: var(--black);}
.footer-section-head p a:hover{color: #3594e2;}
.footer-top .foot-label{margin-bottom: 20px;color: var(--gray-700, #344054);font:normal 500 14px/20px 'Poppins';}
.flot{float:right;width: 25%;}
.footer-form .natt::after {position: absolute;content: '';background: url(./img/export/polygon.svg);background-repeat: no-repeat;top: 50%;right: 0;transform: translate(-25px,10px);left: inherit;height: 10px;width: 13px;z-index: 1;float: right;/*margin-top: 17px;*/ transform: translate(-200%,150%); transition: .3s linear;}
.footer-form .natt:focus::after, .footer-form .natt:active::after,  .footer-form .natt:target::after, .footer-form .natt:focus-visible::after, .footer-form .natt:focus-within::after, .footer-form .natt:visited::after
{transform: translate(-50% ,-150%);rotate: -180deg;right: 10%;top: 50%;}
.marbtm{margin-bottom: 50px}
.footer-top{background: #F4F4F6;padding-top: 110px;padding-bottom: 20px;}
.footer-form a:focus,  .footer-form a:hover {text-decoration: none;outline: 0;color: #1287e4;}
.foot-num{display: flex;flex-direction: column;}

/**************social media section*********************/

.social-figure .img2 {width: 306px;height: 179px;position: absolute;top: 23%;left: 20%;}
.social-figure .img3 {width: 96px;height: 140px;position: absolute;top: 35%;left: 0%;}
.social-figure .img4 {width: 87px;height: 107px;position: absolute;top: -9%;left: 40%;}
.social-figure .img5 {width: 46px;height: 45px;position: absolute;top: 10%;left: 20%;}
.social-figure .img6 {width: 42px;height: 29px;position: absolute;top: 10%;right: 33%;}
.social-figure .img7 {width: 55px;height: 61px;position: absolute;top: 10%;right: 10%;}
.social-figure .img8 {width: 43px;height: 40px;position: absolute;top: 7%;right: 20%;}
.social-figure .img9 {width: 44px;height: 41px;position: absolute;top: -13px;right: 20%;}
.social-figure .img10 {width: 46px;height: 41px;position: absolute;top: 30%;right: 10%;}
.social-figure .img11 {width: 29px;height: 30px;position: absolute;top: 30%;right: 20%;}
.social-figure:hover .img2{top: 25%;left: 120px;}
.social-figure:hover .img3 {left: -1%;}
.social-figure:hover .img5 {top: 7%;}
.social-figure:hover .img4 {top: -15%;}
.social-figure:hover .img6 {top: 5%;}
.social-figure:hover .img8 {top: 5%;right: 17%;}
.social-figure:hover .img9 {top: -20px;/* right:21%;*/}
.social-figure:hover .img7 {top: 8%;right: 8%;}
.social-figure:hover .img11 {top: 32%;right: 18%;}
.social-figure:hover .img10 {top: 30%;right: 8%;}

/************************************************/
h6.mt-20{max-width: 660px ;width: 100%;text-align: center;margin: 0 auto;margin-top: 50px;}
.client-foot {text-align: center; }
 .clients-slider{margin-top: 80px;}
ul.clients-slider li {margin-top: 100px;position:relative;}
ul.clients-slider li::before {content: attr(data-text);position: absolute;top: -15%;left:20%;transform: translateY(-50%);margin-left: 44px;height: 42px;width: 151px;padding: 10px;border-radius: 10px;background: #000;color: #fff;text-align: center;display: none;}
ul.clients-slider li:hover:before {display:block;}
ul.clients-slider li::after {content: "";position:absolute;left:50%; margin-left:-5px; top:-5%;border:10px solid;transform:translateY(-50%);display: none;border-color:black transparent   transparent  transparent;;}
ul.clients-slider li:hover:after, .clients-slider li:hover:after {display:block;}

/*****************************************************/
.arrow-btn{margin: 20px 0;}
.business-btn:hover .bttn{width: 100%;}
.bus-arrow-btn{outline: none; position: relative;color: #1C1C1C;font: normal 600 24px/normal 'Nunito';border-radius: 64px;padding: 10px 60px 10px 20px;display: inline;border: 1px solid #957f7f;border-radius: 27px; transition: all 1s  ease;}
/* .bus-arrow-btn::after{background: url(./img/export/farrow.svg);background-repeat: repeat;background-repeat: no-repeat;  position: absolute;top: 50%;right: 0%;height: 50px ; width: 53px;content: '';display: inline-block; transform: translateY(-50%);transition: all 1s linear;} */

.bus-arrow-btn::after {background-image: url(./img/export/farrow.svg);height: 15px;width: 28px;background-repeat: repeat;background-repeat: no-repeat;position: absolute;
top: 50%;right: -2px;content: '';display: inline-block;transform: translate(-50% ,-50%);transition: all 1s linear;background-color: #000;border-radius: 50%; height: 35px;width: 35px;color: #fff;z-index: -1;padding: 3px; margin: auto;background-origin: content-box;background-position: center;font-size: 15px;}
.bus-arrow-btn::before{position: absolute;position: absolute;top: 14px;
right: 8px;height: 24px;width: 24px;content: '';border-radius: 9999px;background-color: rgb(13,132,229);opacity: 0;z-index: -1;pointer-events: none; animation: sonarWave 2s linear infinite;}
@keyframes sonarWave {
from {opacity: 0.5;}
to {transform: scale(3);opacity: 0;}}
.bus-arrow-btn:hover,.bus-arrow-btn:focus,.bus-arrow-btn:focus-within,.bus-arrow-btn:hover{color: #000;}
.bus-arrow-btn:hover span{ display: inline-block; }
.clients-slider li img{height: auto;width: 100%;}

/**************css for the popup form********************************/
.modal-header {border-bottom: 0px solid #dee2e6;}
.form-control:focus{outline: none;box-shadow: none;}
.form-control{border-radius: 15px;outline: 0 !important;
border: 1px solid var(--black-black-32, rgba(17, 17, 17, 0.32));
background: var(--white-white-100, #FFF);}
.form-control::placeholder{color: var(--black-black-32, rgba(17, 17, 17, 0.32));font:normal 500 14px/24px 'Poppins';}
.enquire-quick-btn{padding: 16px;border-radius: 47px;background: #1287E4;width: 100%;outline: none;border: none;}
.enquire-quick-btn span{color: #FFF;text-align: right;font:normal 400 16px/24px 'Poppins';}
 .natt{position: relative;}
 .natt::after{position: absolute; content: '';background: url(./img/export/polygon.svg);background-repeat: no-repeat; top: 50%;right: 0%;transform: translateY(-3px);left:inherit;height: 50px;width: 27px;z-index: 9; float:right;}
 .natt:focus::after,.natt:active::after,.natt:target::after,.natt:focus-visible::after,
 .natt:focus-within::after, .natt:visited::after {transition: 'background'; transform: translate(12px ,47px);rotate: -180deg;}
 .form-group select option{color:  #111111c4;font:normal 500 14px/24px 'poppins';text-transform: uppercase;}
.modal .modal-title {color: #090914;font: normal 600 36px/62px 'Poppins';letter-spacing: -2px;text-shadow: 0px 4px 4px  #00000040;}
.button-container { margin: 30px auto 0px;}
.modal-body{margin:0px  70px 70px 70px;}
.modal-title{margin-bottom: 20px;}
.modal-content{border-radius: 19px;background: #FFF;}
.modal-dialog{border-radius: 20px;background: rgba(0, 0, 0, 0.61);}

/**************************css for the thank you page***********************************/
.card-container{margin:80px auto; max-width:700px;width:100%; display: flex;justify-content: center;text-align: center;flex-direction: column;
  border-radius: 18px;background: linear-gradient(0deg, rgba(255, 255, 255, 0.20) 0%, rgba(255, 255, 255, 0.20) 100%), #FFF;
  box-shadow: 0px 4px 50px 0px rgba(13, 132, 229, 0.21);padding: 40px;}
  .card-container img{width:101px;height: 101px;}
  .card-container h1{display:inline;color: #000;font:normal 400 64px/92% 'Poppins';text-transform: uppercase;}
  .card-container h1 span{color: #0D84E5;font:normal 700 64px/92% 'Poppins';text-transform: uppercase;}
  .card-container h6{margin: 30px; color: #818181;text-align: center;font:normal 400 24px/127.5% 'poppins';}
  .card-container a{min-width: 436px;padding: 16px;border-radius: 47px;color: #FFF;text-transform:capitalize;
  text-align: right;font:normal 700 18px/24px  'Poppins';background: #1287E4;}
  .thankblock{display: block;}
  .thankblock {display: flex;justify-content: center; align-items: center;}

/**************css for the footer page ************************/
.foot{color: var(--black-black-30, #77808B);font-family: poppins;font-size: 14px;font-style: normal;font-weight: 400;line-height: 150%; /* 24px */}
.foooter span{color: var(--black-black-70, #283646);font:normal 400 16px/150% 'Poppins';}
.footer-points li a{color: var(--black-black-30, #77808B);  font:normal 400 14px/150% 'Poppins';}
.footer-points li {margin-bottom: 18px;}
  .footer-head {color: var(--blue-blue-70, #3A86FF);font-variant-numeric: lining-nums proportional-nums;text-transform: capitalize;font:normal 700 16px/22px 'Raleway';}
.footer-address li{ margin-bottom: 20px;}
.footer-address li .fa{ margin-right: 20px;}
.footer-address li a{color: var(--black-black-30, #77808B);font:normal 400 14px/150% 'poppins';}
.foot-img img{width: 193px;height: 52px;}
.footer-section .foot{margin-top: 33px;margin-bottom: 50px;}
.footer-address, .footer-form, .footer-points{margin-top: 26px;}
.social-media ul{display: flex;}
.social-media ul li {margin: 0 5px;padding: 0px;}
.social-media ul li .fa-brands {background-color: #000;color: #fff;border-radius: 50%;padding: 9px;}
.footer-section{position: relative;}
.footer-section .header{z-index: -1; content: '';position: absolute; height: 100%;width: 100%;top: 0;left: 0; right: 0;}
.footer-section{padding-top:50px;}
/****************css for the animation of fliping text**********************/


.animation {height:100px;overflow:hidden;margin-left: 1rem;}
.animation > div > div {padding: 0.25rem 0.75rem;/* height:2.81rem; */margin-bottom: 2.81rem;display:inline-block;}
.animation div:first-child {animation: text-animation 8s infinite;}
.second div {background-color:#CD921E;}
.third div {background-color:#c10528;}
@keyframes text-animation {
  0% {margin-top: 0;}
  10% {margin-top: 0;}
  20% {margin-top: -15.62rem;}
  30% {margin-top: -15.62rem;}
  40% {margin-top: -11.24rem;}
  60% {margin-top: -11.24rem;}
  70% {margin-top: -15.62rem;}
  80% {margin-top: -15.62rem;}
  90% {margin-top: 0;}
  100% {margin-top: 0;}
}

/*************changes in bannerpage***********/
.texts{margin-top: 10px;}
.texts li {color: #565656;font: normal 400 14px/25px 'Poppins';position: relative;margin-left: 25px;margin-bottom: 5px; padding-left: 11px;}
.texts li::after{  position: absolute;content: url(./img/export/click.svg);top: 3px;left: -25px;}
.agency-text p{font: normal 400 15px/170% 'Poppins';}
.fixed-top {position: fixed;top: 0;right: 0;left: 0;z-index: 1030;animation:fadeInDown 500ms linear 1;}
@keyframes fadeInDown{
0%{ opacity: 0;transform: translateY(-20px);}
100%{ opacity: 1;transform: translateY(0);}
}
.pr {max-width: 90%;width: 100%;}

/***********************css fliping*******************************/
body .dn {display: none;}
.flip {display: inline-block;-webkit-animation-duration: 500ms;-webkit-animation-iteration-count: 1;animation-duration: 500ms;animation-iteration-count: 1;}
.flipIn {-webkit-animation-name: flipIn;animation-name: flipIn;}
.flipOut {-webkit-animation-name: flipOut;animation-name: flipOut;}
@-webkit-keyframes flipOut {
  0% {
    -webkit-transform: rotateX(0deg);
    -moz-transform: rotateX(0deg);
    -o-transform: rotateX(0deg);
    transform: rotateX(0deg);
  }
  50% {
    -webkit-transform: rotateX(45deg);
    -moz-transform: rotateX(45deg);
    -o-transform: rotateX(45deg);
    transform: rotateX(45deg);
  }
  100% {
    -webkit-transform: rotateX(90deg);
    -moz-transform: rotateX(90deg);
    -o-transform: rotateX(90deg);
    transform: rotateX(90deg);
  }
}
/* Standard syntax */
@keyframes flipOut {
  0% {
    -webkit-transform: rotateX(0deg);
    -moz-transform: rotateX(0deg);
    -o-transform: rotateX(0deg);
    transform: rotateX(0deg);
  }
  50% {
    -webkit-transform: rotateX(45deg);
    -moz-transform: rotateX(45deg);
    -o-transform: rotateX(45deg);
    transform: rotateX(45deg);
  }
  100% {
    -webkit-transform: rotateX(90deg);
    -moz-transform: rotateX(90deg);
    -o-transform: rotateX(90deg);
    transform: rotateX(90deg);
  }
}
/* Chrome, Safari, Opera */
@-webkit-keyframes flipIn {
  0% {
    -webkit-transform: rotateX(-90deg);
    -moz-transform: rotateX(-90deg);
    -o-transform: rotateX(-90deg);
    transform: rotateX(-90deg);
  }
  50% {
    -webkit-transform: rotateX(-45deg);
    -moz-transform: rotateX(-45deg);
    -o-transform: rotateX(-45deg);
    transform: rotateX(-45deg);
  }
  100% {
    -webkit-transform: rotateX(0deg);
    -moz-transform: rotateX(0deg);
    -o-transform: rotateX(0deg);
    transform: rotateX(0deg);
  }
}
/* Standard syntax */
@keyframes flipIn {
  0% {
    -webkit-transform: rotateX(-90deg);
    -moz-transform: rotateX(-90deg);
    -o-transform: rotateX(-90deg);
    transform: rotateX(-90deg);
  }
  50% {
    -webkit-transform: rotateX(-45deg);
    -moz-transform: rotateX(-45deg);
    -o-transform: rotateX(-45deg);
    transform: rotateX(-45deg);
  }
  100% {
    -webkit-transform: rotateX(0deg);
    -moz-transform: rotateX(0deg);
    -o-transform: rotateX(0deg);
    transform: rotateX(0deg);
  }
}

/****************************************/
.rotating-text-wrapper {margin: 0px 0px 20px;height: 20vh;display: flex;flex-direction: column;align-items: start;justify-content: center;text-align: start;overflow: hidden;;}
.rotating-text-wrapper h2 {animation-duration: 6s;animation-iteration-count: infinite;opacity: 0;font: normal 400 96px/99px 'Poppins';color: #000;text-transform: uppercase;margin: 30px 0 -30px;letter-spacing: -3.75px;padding: 10px;width: 100%;}
.rotating-text-wrapper h2:nth-child(1) {animation-name: rotating-text-1;}
@keyframes rotating-text-1 {
  0% {
    transform: translateY(200%);
  }
  33% {
    transform: translateY(100%);
    opacity: 1;
  }
  34% {
    opacity: 0;
  }
}
.rotating-text-wrapper h2:nth-child(2) {animation-name: rotating-text-2;}
@keyframes rotating-text-2 {
  33% {
    transform: translateY(100%);
    opacity: 0;
  }
  66% {
    transform: translateY(0);
    opacity: 1;
  }
  67% {
    opacity: 0;
  }
}
.rotating-text-wrapper h2:nth-child(3) {animation-name: rotating-text-3;}
@keyframes rotating-text-3 {
  66% {
    transform: translateY(0);
    opacity: 0;
  }
  99% {
    transform: translateY(-100%);
    opacity: 1;
  }
  100% {
    transform: translateY(-100%);
    opacity: 0;
  }
}
@media screen and (max-width: 576px) {.rotating-text-wrapper {font-size: 0.7rem;}}

/*************** css for the second animation***************/

.content__container {
  overflow: hidden;
  height: 95px;
}

.content__container__list {
  margin-top: 0;
  padding-left: 0;
  text-align: left;
  list-style: none;
  animation-name: carousel;
  animation-duration: 6s;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out;
  animation-delay: 0s;
}

.content__container__list__item {
  line-height: 45px;
  font: normal 500 96px/99px 'Poppins';
  color: #0D84E5;
  margin: 0;
}

@keyframes carousel {
  0%, 25% {transform:translate3d(0,0,0);}
  25%, 50% {transform:translate3d(0,-25%,0);}
  50%, 75% {transform:translate3d(0,-50%,0);}
  75%, 100% {transform:translate3d(0,-75%,0);}
  /* 100% {transform: translate3d(0, -100%, 0);} */
 /* 0% {transform: translate3d(0, -100%, 0);} */

  /* 100% {transform: translate3d(0,-83.33%,0);} */
}
.content{display:flex ;}
h2.digi{font:normal 500 96px/100% 'Poppins';text-transform: uppercase; color: #101828;}
.digital{width: 35%;}
.content__container{width: 65%;}