.herobtnsec {
  display: flex;
  width: 420px;
  justify-content: space-between;
}

.ofimg img {
  border-radius: 10px;
}

h2 {
  font-size: 31px;
  line-height: 36px;
  color: #2d2d2d;
  font-weight: 500;
  margin: auto;
  margin-bottom: 25px;
  font-family: "Poppins";
}

:root {
  /* various fiddle bit - have a play */
  --content-card-scale: 2;
  --content-width: calc((100vh / var(--content-card-scale)) * 2 / 3);
  --content-height: calc(100vh / var(--content-card-scale));
  --font-size: calc(5px + 100vh / 50);
}

.gradient-text {
  background: linear-gradient(
    45deg,
    #f29f05,
    #f27405,
    #f24405,
    #a60303,
    #590202
  );

  /* Adjust the gradient colors and direction as needed */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  /* Optional: For browsers that support it */
}

.abcount {
  font-size: 21px;
  align-items: center;
  text-align: center;
  font-weight: 600;
  margin-bottom: 15px;
  background-image: linear-gradient(90deg, #ff7575, #ff6e6e);
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.teamhead {
  font-size: 15px;
  color: white;
  margin: 10px;
  margin-bottom: 0;
  text-align: center;
}

.teamdis {
  font-size: 15px;
  color: white;
  margin: 0 10px;
}

.teamsec {
  width: 200px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.vidcarhead {
  font-size: 26px;
  align-items: center;
  text-align: left;
  font-weight: 500;
  margin-bottom: 15px;
}

.leftbtn {
  background-image: linear-gradient(90deg, #ff7575, #ff6e6e);
  /* background-color: #016DB6 !important; */
  color: white !important;
  /* border: solid #016DB6; */
  display: flex;
  justify-content: center;
  align-items: center;
  width: auto;
}

.tabbtn {
  padding: 28px 20px;
  /* padding-right: 50px; */
  background-color: rgb(220 220 220);
  color: black;
  display: flex;
  justify-content: center;
  align-items: center;
  width: auto;
  font-weight: 400;
  font-size: 17px;
  border: none !important;
}

.tabbtn:active {
  padding: 15px 20px !important;
  background-color: #016db6 !important;
  color: white !important;
  display: flex;
  justify-content: center;
  align-items: center;
  width: auto;
  height: 60px;
  font-weight: 400;
  font-size: 17px;
  border: none !important;
}

.banner-button {
  border: #e6e7e8 solid;
  box-shadow: 1.7322px 0.8661px 2.5984px rgba(0, 0, 0, 0.55);
}

.underlineabt {
  width: 100px;
  height: 2px;
  background-color: #d52828;
  margin-top: -13px;
  margin-bottom: 15px;
  opacity: 0;
  width: 0%;
  transition: all 0.3s ease;
}

.videosec {
  width: 400px;
}

.videocon {
  display: flex;
  justify-content: center;
  column-gap: 20px;
  margin: 20px auto;
  margin-bottom: 60px;
}

/* coverfloe slider */

@-webkit-keyframes bounce {
  0% {
    margin-top: 0px;
  }

  50% {
    margin-top: -8px;
  }

  100% {
    margin-top: 0px;
  }
}

@keyframes bounce {
  0% {
    margin-top: 0px;
  }

  50% {
    margin-top: -8px;
  }

  100% {
    margin-top: 0px;
  }
}

.herobtnsec {
  display: flex;
  width: 420px;
  justify-content: space-between;
}

:root {
  /* various fiddle bit - have a play */
  --content-card-scale: 2;
  --content-width: calc((100vh / var(--content-card-scale)) * 2 / 3);
  --content-height: calc(100vh / var(--content-card-scale));
  --font-size: calc(5px + 100vh / 50);
}

.gradient-text {
  /* background: linear-gradient(45deg,
      #f29f05,
      #f27405,
      #f24405,
      #a60303,
      #590202); */
  background-image: linear-gradient(90deg, #ff7575, #ff6e6e);
  /* Adjust the gradient colors and direction as needed */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  /* Optional: For browsers that support it */
}

.biright,
.hfull {
  width: 1300px !important;
}

.typescontainer {
  width: 1300px;
  margin: 0px !important;
  justify-content: left !important;
  padding: 20px !important;
  overflow: hidden;
  flex-direction: column !important;
  border: solid 5px #016db6 !important;
}

.typesrow > .first {
  border-left: none;
}

.typesrow > .last {
  border-right: none;
}

.trow1 .typescard {
  border-top: none !important;
  width: 33%;
}

.trow2 .typescard {
  border-bottom: none !important;
  width: 33%;
}

.typescard {
  display: flex !important;
  flex-direction: column;
  border: solid 1px #dedede;
  padding: 20px;
}

.typesrow {
  display: flex !important;
}

.typescardp {
  font-size: 16px !important;
  line-height: 24px !important;
  text-align: left;
  margin-top: 10px;
}

.typescardhead {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center;
}

.typescardhead h5 {
  margin: 0;
  width: 70%;
}

.typescardhead img {
  width: 30%;
  height: 60px;
  /* border-radius: 100px; */
  /* border: solid 1px; */
}

.typesimgsec {
  border-radius: 100px;
  border: solid 1px;
  padding: 12px;
}

.slick-dots li button:before {
  font-family: "slick";
  font-size: 17px;
  line-height: 0;
  position: absolute;
  top: 0;
  left: 0;
  width: 0;
  height: 15px;
  content: "•";
  text-align: center;
  opacity: 0.25;
  color: #ffffff !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.success-story-sec .slick-dots li button:before {
  font-family: "slick";
  font-size: 17px;
  line-height: 0;
  position: absolute;
  top: 0;
  left: 0;
  width: 0;
  height: 15px;
  content: "•";
  text-align: center;
  opacity: 0.25;
  color: #ffffff !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.success-story-sec .slick-dots li.slick-active button:before {
  opacity: .75;
    color: #bbbbbb;
}
.slick-dots li.slick-active button:before {
  opacity: .75;
  color: #ff0000 !important;
}

.slick-dots li {
  margin: 0 5px !important;
}

.biright p {
  width: 1300px !important;
  max-width: 100%;
}

.biright h2 {
  width: 1300px !important;
  max-width: 100%;
}

.leftbtn {
  background-color: #016db6 !important;
  color: white !important;
  border: solid #016db6;
}

.formsecz {
  padding-bottom: 0 !important;
}

.headbtn {
  margin-right: 4px;
}

.banner-button {
  border: #e6e7e8 none;
  width: fit-content;
  box-shadow: 1.7322px 0.8661px 2.5984px rgba(0, 0, 0, 0.55);
}

/* coverfloe slider */

@-webkit-keyframes bounce {
  0% {
    margin-top: 0px;
  }

  50% {
    margin-top: -8px;
  }

  100% {
    margin-top: 0px;
  }
}

@keyframes bounce {
  0% {
    margin-top: 0px;
  }

  50% {
    margin-top: -8px;
  }

  100% {
    margin-top: 0px;
  }
}

.coverflow {
  height: 700px;
  width: 100%;
  perspective: 2000px;
  margin-bottom: 0px !important;
  overflow: hidden;
}

.coverflow .content {
  position: absolute;
  top: calc(50% - var(--content-height) / 2);
  left: calc(50% - var(--content-width) / 2);
  width: var(--content-width);
  height: var(--content-height);
  transform-style: preserve-3d;
  transition: all 300ms ease-in-out;
  outline: none;
  margin-top: 100px;
}

.fliphead h2 {
  margin: 0px !important;
  margin-bottom: 1px !important;
  margin-top: -50px !important;
  font-size: 31px;
  line-height: 36px;
  text-align: center;
  color: #2d2d2d;
  font-weight: 500;
  width: 841px;
  font-family: "Poppins";
}

.fliphead p {
  margin-top: 25px !important;
}

.coverflow .content:not(.current):hover .front {
  animation: bounce 250ms normal forwards ease-in-out;
  filter: grayscale(0%) brightness(100%);
}

.coverflow .content .front,
.coverflow .content .back {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 10px;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.coverflowz {
  background-image: url(../images/Home-Page-Bg.jpg) !important;
  background-position: top;
  background-size: cover;
  background-position-y: -70px;
  width: 100%;
  float: left;
}

.coverflow .content .back {
  top: calc((var(--content-height) - var(--content-width)) / 2);
  left: calc((var(--content-width) - var(--content-height)) / 2);
  height: var(--content-width);
  width: var(--content-height);
  background: radial-gradient(circle at center, navy 0%, black 100%);
  border: 3px solid whitesmoke;
  transform: rotateY(180deg) rotateZ(90deg);
}

.t_image img {
  height: 60px;
  width: 70px;
  border-radius: 100px;
}

.coverflow .content .back h2 {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  font-size: calc(1.2 * var(--font-size));
  width: 100%;
  margin: 0;
}

.featdev {
  display: flex;
  flex-direction: column;
  row-gap: 20px;
}

.coverflow .content .front img {
  vertical-align: middle;
  border-radius: 10px 0 0 10px;
  border: 3px groove whitesmoke;
  width: var(--content-width);
  height: var(--content-height);
  -o-object-fit: cover;
  object-fit: cover;
  cursor: pointer;
  filter: grayscale(60%) brightness(80%);
  width: 220px;
}

.featimg {
  width: 450px;
  height: 500px;
  margin-top: 50px !important;
  border-radius: 30px;
  overflow: hidden;
}

.featdis {
  font-size: 18px;
  width: 500px;
  margin-top: 10px;
}

.feathead {
  font-size: 25px !important;
}

.featsec {
  display: flex;
  align-items: center;
  justify-content: space-around;
}

.coverflow .content.current:not(.selected) .front img {
  filter: grayscale(0%) brightness(100%);
}

.coverflow .content .front .info {
  display: none;
  font-size: var(--font-size);
  width: calc(100% + 6px);
  white-space: nowrap;
  text-transform: uppercase;
  outline: none;
}

.coverflow .content.current:not(.selected) .front .info {
  display: block;
}

.flipcard {
  display: flex;
  width: 550px;
}

.cardtext {
  background-color: grey;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  padding: 20px;
  width: 180px;
  border-radius: 0 10px 10px 0;
}

.imgbox {
  box-shadow: 1.7322px 0.8661px 2.5984px rgba(0, 0, 0, 0.55);
  border-radius: 20px;
  /* background-color: rgb(212, 212, 212); */
  border: none;
  background-position: center;
  background-size: cover;
}

.imgsec {
  display: flex;
  justify-content: space-between;
  margin-top: 45px;
}

.box1 {
  height: 350px;
  /* margin-top: 50px; */
  width: 23%;
}

.box2 {
  height: 450px;
  width: 20%;
  display: flex;
  box-shadow: none;
  flex-direction: column;
  justify-content: space-between;
  background-color: transparent;
}

.box2-1 {
  height: 29%;
}

.box2-2 {
  height: 69%;
}

.box3 {
  height: 350px;
  width: 25%;
}

.box4 {
  height: 400px;
  width: 22%;
}

/* flip Animation */

/* test */

.cardz {
  perspective: 1000px;
}

.cardz-inner {
  width: 200px;
  height: 300px;
  position: relative;
  transform-style: preserve-3d;
  transition: transform 0.6s;
}

.cardz:hover .card-inner {
  transform: rotateY(180deg);
}

.cardz-front,
.cardz-back {
  position: absolute;
  width: 100%;
  height: 100%;
  backface-visibility: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 24px;
  color: white;
  font-weight: bold;
}

.cardz-front {
  background-color: #007bff;
}

.cardz-back {
  background-color: #28a745;
  transform: rotateY(180deg);
}

/* styles.css */

.card {
  perspective: 1000px;
  /* Gives depth to the 3D effect */
}

.card-inner {
  width: 500px;
  height: 300px;
  position: relative;
  transform-style: preserve-3d;
  /* Ensures children are transformed in 3D */
  transition: transform 0.6s;
  /* Smooth transition for the flip effect */
}

.card:hover .card-inner {
  transform: rotateY(180deg);
  /* Rotates the card when hovered */
}

.card-front,
.card-back {
  position: absolute;
  width: 100%;
  height: 100%;
  backface-visibility: hidden;
  /* Hides the back face when facing away */
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 24px;
  color: white;
  font-weight: bold;
}

.card-front {
  background-color: #007bff;
  /* Blue background for the front */
}

.card-back {
  background-color: #28a745;
  /* Green background for the back */
  transform: rotateY(180deg);
  /* Hide the back face initially */
}

.sectionClass {
  padding-top: 50px;
  padding-bottom: 0px;
  margin-top: 40px;
  border-radius: 25px;
  display: flex;
  justify-content: center;
}

.countsinner {
  display: flex;
  justify-content: space-between;
  width: 1000px;
  margin-top: -30px;
  margin-bottom: 20px;
}

.tabcontainer {
  display: flex;
  justify-content: space-around;
  flex-direction: row;
  align-self: center;
  margin: auto;
  box-shadow: 2px 3px 5px 2px #ddd;
  margin-top: 70px !important;
  margin-bottom: 50px !important;
  border-radius: 30px;
  /* width: 1100px; */
  padding: 20px 70px;
}

.countersec {
  background-image: linear-gradient(90deg, #ff7575, #ff6e6e);
}

.d__flex p,
i.fa fa-percent {
  color: white !important;
}

i.fa.fa-arrow-up {
  margin-right: 12px;
}

.sectionClass {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.countmg {
  margin: 0px;
}

.fliphead {
  padding: 50px 0;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.countmg h2 {
  margin: 0px;
}

.counterbtn {
  margin-bottom: 40px;
}

.counterbtn a {
  max-width: 130px;
}

.tabsec {
  background-color: white;
}

.tabli li {
  margin-bottom: 10px;
  color: #d52828 !important;
}

.underline {
  /* width: 140px; */
  /* background: #016DB6; */
  /* height: 2px; */
  /* margin-top: -5px; */
}

.casedis {
  font-size: 16px;
  line-height: 17px;
  font-weight: 300;
  color: #4a4747;
  margin: 20px 0px;
}

a {
  text-decoration: none;
}

.casebox {
  width: 345px;
  height: 340px;
  border-radius: 10px;
  border-bottom: 5px solid #a035a2 !important;
  box-shadow: 2px 3px 5px 2px #ddd;
  padding: 35px 27px;
  display: flex !important;
  flex-direction: column;
  justify-content: space-around;
}

.blogbox {
  width: 1100px;
  /* height: 340px ; */
  padding: 35px 27px;
  display: flex !important;
  justify-content: space-around;
}

.casebox span {
  margin-top: 10px !important;
}

.caseimg {
  background-color: rgb(226, 226, 226);
  width: 100%;
  height: 120px;
  border-radius: 10px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.caseimg img {
  width: 100%;
  height: 100%;
}

.casemar {
  margin: 0 20px !important;
}

.titlebg {
  background-color: black;
  padding: 30px 0 20px 20px;
  margin: auto;
  width: fit-content;
}

.titlebg h2 {
  color: white !important;
  font-size: 31px;
  line-height: 36px;
  text-align: center;
  color: #2d2d2d;
  font-weight: 500;
  width: 841px;
  margin: auto;
  margin-bottom: 25px;
  font-family: "Poppins";
}

.blogcon {
  width: 500px;
  height: 300px;
  background: rgb(239 239 239);
  display: flex;
  padding: 40px 30px;
  justify-content: center;
  flex-direction: column;
  margin-left: -200px;
  margin-right: 100px;
  /* border: solid blue; */
  margin-top: 70px;
  box-shadow: 6px 6px 16px rgba(0, 0, 0, 0.55) !important;
}

.blogimg {
  width: 500px;
  height: 300px;
  background: rgb(239 239 239);
  display: flex;
  justify-content: space-between;
  flex-direction: column;
  /* border: solid red; */
  margin-left: 100px;
}

.blogbtn {
  padding: 5px 10px !important;
  background-color: #1d4aff !important;
  color: white !important;
  width: fit-content !important;
  margin: 0 0 0 0px !important;
  border-radius: 7px;
}

.underlineblog {
  /* margin-top: 4px; */
  /* width: 315px; */
  /* background: #016DB6; */
  /* height: 2px; */
}

.blogsez {
  height: 500px !important;
}

.bloghead {
  font-weight: 700;
  font-size: 23px;
  line-height: 27px;
  font-weight: 500;
  color: #3e3e3e;
}

.quote-card {
  background-color: transparent;
  border-radius: 10px;
  padding: 20px;
  margin: 10px;
  width: 300px;
  padding-top: 50px;
}

.quote {
  font-size: 16px;
  line-height: 1.5;
}

.author {
  font-weight: bold;
  text-align: center;
  margin-top: 15px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.author-image {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  position: absolute;
  top: 15px;
  right: 15px;
}

.testibox {
  width: 356px;
  height: fit-content;
  background-position: center;
  background-size: contain;
  /* margin-bottom: 50px !important; */
}

.testimonial {
  text-align: center;

  /* max-width: 500px; */
}

.speech-bubble {
  background-color: #f7f7f7;
  padding: 20px;
  border-radius: 10px;
  border: 1px solid #f7f7f7;
  position: relative;
  margin-bottom: 20px;
  box-shadow: 2px 2px 48px #afafaf;
}

.speech-bubble:after {
  content: "";
  position: absolute;
  bottom: -18px;
  left: 15%;
  transform: translateX(-50%);
  border-width: 20px 20px 0;
  border-style: solid;
  border-color: #f7f7f7 transparent transparent;
  display: block;
  width: 0;
}

.speech-bubble p {
  font-size: 16px;
  line-height: 1.6;
  color: #333;
  margin: 0;
}

.author h4 {
  font-size: 18px;
  margin: 10px 0 5px;
  width: inline;
  width: 180px;
  margin: auto;
  text-align: left;
}

.author p {
  font-size: 14px;
  color: #777;
  margin: 0;
  width: 180px;
  margin: auto;
  text-align: left;
  font-size: 11px;
}

.tcontsec {
  width: 180px;
  margin-left: 10px !important;
}

.testisection {
  width: 33%;
  height: 600px;
  overflow: scroll;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.testiouter {
  display: flex;
}

.testisection::-webkit-scrollbar {
  display: none;
  /* Hide scrollbar */
}

/* Container for the columns */
.testiouter {
  display: flex;
  width: 100%;
}

.formsec {
  /* background: black; */
  height: auto;
  width: 100%;
  float: left;
  background-image: url("../../../admin/front_asset/images/success-story-background.jpg") !important;
  background-size: cover;
  background-repeat: no-repeat;
}

.formhead {
  width: 100%;
  margin: auto;
  color: #000;
  text-align: left;
  font-size: 31px !important;
}

.form-keep-in {
  width: 100%;
  margin: auto;
  margin-top: 50px;
}

/* .mt-686 {
  margin-top: 725px !important;
} */

.formright {
  width: 35%;
  float: left;
  /* height: 100vh; */
}

.formright img {
  width: 100%;
}

.formleft {
  width: 65%;
  padding: 70px;
  float: left;
}

/* .Enquiry-form-top {
  padding: 0px 220px !important;
  padding-left: 100px !important;
} */

.sub-title {
  /* position: relative; */
  margin: 50px 0 50px 0 !important;
}

.anchortags {
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  padding: 0px 150px;
  background-color: white;
  height: 100px;
  border-image: linear-gradient(to right, rgb(19 102 179), rgb(168 59 174)) 1;
  border-bottom: solid 4px !important;
}

.ancin {
  font-size: 18px;
  font-weight: 600;
  cursor: pointer;
}

.ancin:hover {
  font-size: 18px;
  font-weight: 600;
  border-bottom: solid #016db6;
}

.undertext {
  display: flex;
  margin-left: 10px;
  flex-direction: column;
  width: fit-content;
}

.abimg {
  /* width: 500px; */
  /* border: solid 2px; */
}

.caseabt {
  width: 700px !important;
}

.whybullt {
  display: flex;
  width: 300px;
  align-items: center;
}

.whybullticon {
  width: 60px;
  height: 60px;
  /* border: solid #016DB6; */
  box-shadow: 1.7322px 0.8661px 2.5984px #016db6;
  margin-right: 13px;
}

.whycont > .dis {
  font-size: 12px;
  line-height: 14px;
}

.whycont > .head {
  font-size: 21px;
  line-height: 21px;
  font-weight: 600;
}

.counter-box .d__flex .number {
  margin-top: 0;
}

.bullrow {
  display: flex;
  justify-content: space-around;
  margin-bottom: 30px;
}

.Whyusinner {
  display: flex;
  width: 100%;
  justify-content: center;
  column-gap: 30px;
  margin-top: 70px;
}

.whyright {
  width: 650px;
}

.sowb img {
  width: 12px;
  height: 12px;
  margin-right: 10px;
}

.sowb {
  display: flex;
  margin-top: 0px;
  height: 0;
}

.sowb p {
  font-size: 13px;
  margin-top: -2px;
}

.head-div:hover .sowb {
  margin-top: 10px !important;
  height: 100% !important;
}

.em-subdiv:hover .sowb {
  margin-top: 10px !important;
  height: 100% !important;
}

.whyright p {
  width: 615px;
}

.whyright h2 {
  width: 415px;
}

.ofcard {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: fit-content;
  width: 300px;
  margin-top: 40px;
}

.of {
  display: flex;
  align-self: center;
  justify-content: center;
  padding-bottom: 100px;
}

.ofimg {
  display: flex;
  width: 600px;
  /* padding: 30px 50px; */
  /* border: solid white; */
  margin: 20px;
  height: 350px;
}

.ofimg:hover .ofimg img {
  transform: scale(1.2);
}

.ofsec {
  width: 300px;
}

.ofcard p {
  font-size: 14px;
  padding: 0 10px;
  color: white;
}

.ofcard h6 {
  font-size: 19px;
  color: white;
  background-image: linear-gradient(90deg, #ff7575, #ff6e6e);
  border-radius: 10px;
  padding: 20px;
  width: 100%;
}

.Whyussec {
  margin: 40px !important;
}

.featurehead p {
  width: 1200px;
}

.featuresec {
  display: flex;
  margin-top: 50px;
  justify-content: center;
}

.card {
  perspective: 1000px;
  display: flex;
  justify-content: center;
  align-items: center;
  border: none;
  background-color: transparent;
}

.card-back {
  font-size: 18px !important;
  line-height: 24px !important;
  font-weight: 400 !important;
  padding: 20px;
  text-align: justify !important;
  background-color: #000000 !important;
}

/* .cardtext {
  background-color: grey;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  padding: 20px;
  width: 180px;
  border-radius: 0 10px 10px 0;
  height: 400px !important;
} */

.card-front {
  display: flex;
  flex-direction: column;
  justify-content: end;
  background-size: contain;
}

.featabs {
  display: flex;
  flex-direction: column;
  justify-content: space-evenly;
  height: 350px;
  margin-right: -40px;
  z-index: 1;
  margin-top: 12px;
}

.featurecontainer {
  width: 800px;
  margin: 0px !important;
  justify-content: left !important;
}

.fbtn {
  background-color: none !important;
  display: flex;
  justify-content: flex-start;
}

.fbtn span {
  background-color: transparent !important;
  color: white !important;
}

.whyp {
  width: 700px !important;
}

/* .sub-title h2 {
  font-size: 31px !important;
  line-height: 36px !important;
  text-align: center;
  color: #2d2d2d;
  font-weight: 500 !important;
  width: 841px;
  margin: auto;
  margin-bottom: 25px;
  font-family: "Poppins";
} */

.anchortags {
  /* position: sticky;
   */
  top: 0;
  /* Adjust this value if you want the anchor tags to stick at a different position */
  background: #fff;
  /* Optional: Add a background color to ensure the sticky section is visible */
  z-index: 00;
  border-bottom: solid 2px;
  /* Ensures the sticky menu stays on top of other content */
}

.ancin {
  padding: 10px;
  cursor: pointer;
  transition: background-color 0.3s;
}

.ancin.active {
  background-color: #f0f0f0;
  /* Change to your preferred active color */
  font-weight: bold;
  /* Optional: highlight the active item */
}

.rightArea p {
  font-size: 19px;
  line-height: 23px !important;
  width: 92%;
  font-weight: 300;
  margin: 20px 0;
  color: #000 !important;
}

/* .rightArea h1 {
  margin: 0 !important;
  font-size: 40px;
  line-height: 44px !important;
  color: white !important;
  margin-bottom: 7px !important;
} */

.herobtnsec {
  display: flex;
  width: auto !important;
  justify-content: space-between;
  margin: 20px 0 0 0px;
}

.col-md-5 {
  height: 100%;
}

.col-md-7 {
  padding: 0;
}

.topSliderArea {
  display: flex;
  justify-content: end;
  align-items: center;
  height: 700px;
  width: 100%;
  background-repeat: no-repeat;
  background-position: center left;
  background-size: cover;
  margin-top: 20px;
}

@media (min-width: 319px) and (max-width: 520px) {
  .button--size-s {
    font-size: 12px;
  }

  .rightareainnnercta {
    height: auto !important;
  }

  .clients_brands .c1 img {
    /* width: 65px !important; */
    margin: auto;
    /* height: 100%; */
    /* object-fit: cover; */
    filter: none;
  }

  .rightArea h1,
  .sub-title h2 {
    margin: 0;
    font-size: 25px !important;
    line-height: 32px !important;
    color: white;
    font-weight: 500 !important;
    margin-bottom: 7px;
  }

  .topSliderArea {
    display: block;
    height: 320px;
    width: 100%;
    background-position: center;
    background-size: cover;
    margin: 0 auto;
    /* margin-top: 125px; */
    /* deep  17june*/
  }

  .countsinner {
    flex-direction: column;
  }

  .sub-title h2,
  .titlebg h2,
  .sub-title p,
  .tabcontainer,
  .tabconimg,
  .tabcontext,
  .tabcontext p {
    width: fit-content;
  }

  .anchortags {
    padding: 1px !important;
  }

  .col-xxl-3 {
    width: 80% !important;
    margin: auto;
  }

  .countsinner {
    row-gap: 30px;
  }

  .formright {
    padding: 20px !important;
  }

  .tabcontext p {
    width: auto !important;
  }

  /* .tabconimg img {
    width: auto !important;
  } */

  .card-inner {
    width: 100% !important;
  }

  .card-front {
    background-size: cover !important;
  }

  .keep-in-right-col-6 {
    padding: 20px;
  }

  .coverflow {
    padding-top: 40px;
  }

  .Enquiry-form-top {
    padding: 20px !important;
    /* margin-top: 320px; */
  }

  .blogsec {
    display: none !important;
  }

  .rightArea p {
    width: 100% !important;
    text-align: left !important;
    font-size: 15px;
    line-height: 19px;
    font-weight: 300;
    margin: 0;
    padding: 0;
  }

  .rightsec {
    width: 90% !important;
    display: flex;
    justify-content: center;
    align-items: center;
    height: fit-content;
    margin: auto;
  }

  .slider_home {
    padding: 0;
  }

  .rightareainnner > div {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
  }

  .imgsec {
    justify-content: space-around;
    flex-direction: column;
    padding-top: 30px;
  }

  .imgbox {
    width: 68%;
    margin: auto;
    margin-bottom: 20px;
  }

  .tabconimg {
    height: fit-content;
    margin: 20px 0 !important;
  }

  .giantsec a {
    margin: 10px;
  }

  .fliphead {
    padding: 0 !important;
  }

  .sub-title {
    /* position: relative; */
    margin: 30px 0 !important;
  }

  .cardtext {
    width: 150px !important;
  }

  .coverflow .content .front img {
    width: 140px !important;
  }

  .flipcard {
    width: fit-content !important;
  }
}

/* banner design */
.sub-title h2 {
  font-size: 38px;
  line-height: 38px;
  text-align: center;
  color: #2d2d2d;
  font-weight: 500;
  width: 930px;
  margin: auto;
  margin-bottom: 25px;
  font-family: "Poppins";
}

.rightareainnner {
  display: flex;
  width: 630px;
  text-align: left;
  height: fit-content;

  flex-direction: column;
  justify-content: center;
  align-items: center;
  transition: ease-in-out 0.5s;
}

.rightArea p {
  font-size: 19px;
  color: #4a4747;
  line-height: 23px !important;
  width: 92%;
  font-weight: 300;
  margin: 20px 0;
  color: #000 !important;
}

.formright img {
  height: 100%;
  width: 100%;
}

.rightArea h1 {
  margin: 0;
  font-size: 40px;
  line-height: 50px;
  color: white;
  margin-bottom: 7px;
  background-image: linear-gradient(90deg, #d52828, #d52828);
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

@media (min-width: 1399px) {
  .counter-box .d__flex .number {
    margin-top: 15px;
  }

  .mt-5 {
    margin-top: 50px !important;
  }
}

@media (min-width: 1020px) and (max-width: 1399px) {
  .biright p {
    width: 1120px !important;
    max-width: 100%;
    font-size: 19px;
    line-height: 23px;
    font-weight: 300;
    font-family: "Poppins", sans-serif;
  }

  .mt-5 {
    margin-top: 50px !important;
  }

  .biright h2,
  .biright {
    width: 1120px !important;
  }

  .counter-box .d__flex .number {
    margin-top: 15px;
  }
}

.formright {
  width: 35%;
  /* padding: 100px; */
  color: white;
}

.dropdown-item {
  width: 97% !important;
}

.modrow {
  display: flex;
  justify-content: center;
  column-gap: 30px;
  overflow-x: auto;
  overflow-y: hidden;
}

.modu {
  display: flex;
  width: 300px;
  justify-content: center;
  /* border: solid 1px; */
  border-radius: 15px;
  align-items: center;
  column-gap: 20px;
  padding: 20px;
  /* position: relative; */
  border: 8px solid transparent;
  /* Border width, adjust as needed */
  /* Gradient border */
  transition: all 0.3s ease;
  /* Smooth transition on hover */

  border: 3px solid;
  border-image: linear-gradient(to right, rgb(19 102 179), rgb(168 59 174)) 1;
  height: 100%;
}

.modu:hover {
  box-shadow: rgb(0 0 0 / 18%) 0px 17px 20px -20px;
}

/* 
.moduz {
  display: flex;
  width: 300px;
  flex-direction: column;
  justify-content: center;
  border: solid 1px;
  border-radius: 15px;
  align-items: center;
  column-gap: 20px;
  padding: 20px;
  transition: all 0.3s ease;
  row-gap: 20px;
  background-color: white;
} */

.moduz {
  margin-top: 20px;
  display: flex;
  width: 250px;
  flex-direction: column;
  justify-content: center;
  /* border: solid 1px; */
  border-radius: 15px;
  align-items: center;
  column-gap: 20px;
  padding: 20px;
  transition: all 0.3s ease;
  row-gap: 20px;
  /* background-color: #2960b5; */
  background-image: linear-gradient(45deg, #54a4ff52, #f39af56b);
  border: 4px solid #1c64b538;
  box-shadow: 1px 0px 10px #eee;
  color: #000000;
}

.moduz h6 {
  text-align: center;
}

.modu h6 {
  margin: 0;
  width: 190px;
}

.modu:hover {
  /* border-right: solid 1px rgba(0, 0, 0, 0.3); */
  border-radius: 15px;
  border-color: #000000;
  border-image: linear-gradient(to right, black, black) 1;
}

.modu img {
  /* border: solid 1px;
  border-radius: 100px; */
  height: 50px;
  width: 50px;
}

.moduz img {
  /* border: solid 1px; */
  /* border-radius: 100px; */
  /* height: 70px; */
  width: 90px;
  width: 90px;
  background: #ffffff40;
  border-radius: 50px;
  padding: 6px;
  background-image: linear-gradient(105deg, #ffffff, #ffffff);
}

.moduz:hover {
  transform: scale(1.1);
}

.modsec {
  display: flex;
  flex-direction: column;
  column-gap: 30px;
  row-gap: 30px;
  /* margin-top: -30px; */
}

.modu p {
  margin-bottom: 0px;
  margin-top: 6px;
  line-height: 16px;
}

/* banner design */
.ctaheight {
  background-image: linear-gradient(90deg, #ff7575, #ff6e6e);
  background-repeat: no-repeat;
  background-size: cover;
}

@media (min-width: 320px) and (max-width: 767px) {
  .rightareainnner {
    width: 100% !important;
  }

  .topSliderArea {
    padding: 20px !important;
  }

  /* .rightareainnner>div {
    width: 100% !important;
  } */

  .rightArea h1 {
    font-size: 20px !important;
    line-height: 22px !important;
    text-align: center !important;
  }

  .em-subdiv-head {
    width: 100% !important;
  }

  .em-subdiv {
    margin-bottom: 20px !important;
  }

  .tabConSection .sub-title h2 {
    font-size: 20px !important;
    line-height: 22px !important;
  }

  .sub-title h2 {
    font-size: 20px !important;
    line-height: 22px !important;
  }

  .counter-box .d__flex .number {
    font-size: 50px !important;
  }

  .counter-box {
    margin-bottom: 20px !important;
  }

  .sub-title p {
    font-size: 14px !important;
    line-height: 17px !important;
    text-align: center !important;
  }

  .vidcarhead {
    font-size: 20px !important;
    line-height: 22px !important;
  }

  .video-box p {
    font-size: 14px !important;
    line-height: 17px !important;
  }

  .videosec {
    margin-bottom: 20px;
  }

  .rightsec {
    margin: inherit !important;
  }

  .countsinner .item {
    /* width: 50% !important; */
  }

  .tabConSection {
    padding: 20px 0 0px !important;
  }

  .tabConSectionin {
    display: block !important;
  }

  .scopeimg {
    width: 100% !important;
  }

  .tabConSection {
    float: left !important;
  }

  .moduz h6 {
    font-size: 14px;
  }

  .rightArea p {
    font-size: 16px !important;
    line-height: 20px !important;
    text-align: center !important;
  }

  .slider_home .rightArea h1 {
    font-size: 20px !important;
    line-height: 22px !important;
  }

  ul.menu li a.main-category-link {
    font-size: 14px !important;
  }

  .slider_home .slick-dots {
    margin-top: 0px !important;
  }

  .countsinner {
    row-gap: 0px !important;
  }

  .tabcontext h2 {
    font-size: 20px !important;
    line-height: 22px !important;
  }

  .tabcontext p {
    font-size: 14px !important;
    line-height: 17px !important;
  }

  .slihead {
    font-size: 20px !important;
    line-height: 22px !important;
  }

  .casedis {
    font-size: 14px !important;
    line-height: 17px !important;
  }

  .testi-comment p {
    line-height: 20px !important;
  }

  .testi-designation p {
    font-size: 14px !important;
    font-weight: 500 !important;
  }

  .formhead {
    font-size: 20px !important;
    line-height: 22px !important;
  }

  .f-link h4 {
    font-size: 20px !important;
    line-height: 22px !important;
  }

  .tabConSection {
    padding-bottom: 20px !important;
  }
}

@media (min-width: 768px) and (max-width: 1024px) {
  .vidcarhead {
    margin-top: 40px !important;
  }

  ul.menu li a.main-category-link {
    font-size: 14px !important;
    line-height: 17px !important;
  }

  .slider_home .rightArea h1 {
    line-height: 28px !important;
  }

  .slider_home {
    padding: 35px 0px !important;
  }

  .sub-title h2 {
    font-size: 26px !important;
    line-height: 28px !important;
    text-align: center !important;
  }

  .sub-title p {
    font-size: 20px !important;
    line-height: 22px !important;
    text-align: center !important;
  }

  .scopeimg {
    width: 100% !important;
  }

  .counter-box .d__flex .number {
    font-size: 60px !important;
  }

  .modu h6 {
    font-size: 20px !important;
  }

  .formhead {
    font-size: 26px !important;
    line-height: 28px !important;
  }

  .header .menu-icon {
    display: block !important;
  }

  .r-sec {
    display: block !important;
  }

  .rightArea h1 {
    font-size: 26px !important;
    line-height: 28px !important;
    text-align: center !important;
  }

  .modrow {
    flex-wrap: wrap;
  }

  .moduz {
    margin-bottom: 20px;
  }

  .tabcontext {
    width: 100% !important;
  }

  .tabconimg {
    width: 40% !important;
  }

  .footer .footerContent {
    gap: 20px;
  }

  .counter-box .d__flex .number {
    margin-top: 0px !important;
  }

  .rightArea p {
    text-align: center !important;
  }

  .herobtnsec {
    width: 100% !important;
  }
}

@media (min-width: 1025px) {
  .sub-title h2 {
    width: 100% !important;
  }

  .down-Arrow {
    margin-top: 3px !important;
  }

  .em-subdiv-head {
    width: 100% !important;
  }

  .em-subsection {
    width: 100% !important;
    margin-right: 0px !important;
  }

  .header .menu {
    max-height: inherit !important;
  }

  .rightArea h1 {
    width: 100% !important;
  }

  .rightsec {
    width: 100% !important;
  }

  .modrow {
    flex-wrap: wrap;
  }

  .moduz {
    margin-bottom: 20px;
  }

  .tabcontainer {
    gap: 20px;
  }
}