@font-face {
  font-family: mechodal;
  src: url(../font/Montserrat.ttf);
}

* {
  margin: 0;
  padding: 0;
  outline: none;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  scroll-padding-top: 100px;
}

html,
body {
  margin: 0;
  padding: 0;
  height: auto !important;
  background: #f7fff3 !important;
  font-family: mechodal !important;
  scroll-behavior: smooth !important;
  scroll-snap-type: y mandatory !important;
  overflow-x: clip !important;
}

.support-btn a {
  z-index: 9999999;
  right: 30px;
  bottom: 100px;
  position: fixed;
  text-align: end;
  transition: transform 0.3s ease;
}

.support-btn a:hover {
  transform: scale(1.1);
}

.support-btn a img {
  width: 64px;
  filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.3));
}

.support-btn a:after {
  position: absolute;
  z-index: -1;
  content: "";
  top: 100%;
  left: 5%;
  height: 10px;
  width: 90%;
  opacity: 1;
  background: -webkit-radial-gradient(center,
      ellipse,
      rgba(0, 0, 0, 0.25) 0%,
      rgba(0, 0, 0, 0) 80%);
  background: -webkit-radial-gradient(center ellipse,
      rgba(0, 0, 0, 0.25) 0%,
      rgba(0, 0, 0, 0) 80%);
  background: radial-gradient(ellipse at center,
      rgba(0, 0, 0, 0.25) 0%,
      rgba(0, 0, 0, 0) 80%);
}


body h1 {
  font-weight: 700;
  font-size: 60px;
}

.home-we-build h1 {
  font-weight: 700;
  font-size: 90px;
  padding: 0 0rem;
}

.home-we-build h1 span {
  color: #7cd755;
}

body h6 {
  font-weight: 700;
  font-size: 60px;
}

body h2 {
  font-weight: 700;
  font-size: 32px;
}

body h3 {
  font-weight: 700;
  font-size: 28px;
}

a:hover {
  color: #5bb535;
}

hr {
  margin: 1rem 0 !important;
  color: inherit !important;
  background-color: #ed8b00 !important;
  border: 0 !important;
  opacity: 1 !important;
  width: 40px !important;
  height: 2px !important;
}

.page-link:focus {
  z-index: 3;
  color: #0a58ca;
  background-color: #ffffff;
  outline: 0;
  box-shadow: 0 0 0 0.25rem rgb(255 255 255 / 25%) !important;
}

.navbar-light .navbar-nav .nav-link {
  color: #000 !important;
  font-weight: 400 !important;
  /* font-size: 16px !important; */
}

a.faq-mail {
  color: #5bb535;
}

a.faq-mail:hover {
  color: #3b3c3d;
}

.nav-shad {
  /*box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.1);*/
}

.section-one1 h1,
.section-one1 p {
  color: white !important;
}

.section-one h1 {
  margin-bottom: 20px;
  color: #222;
}

.section-one h6 {
  margin-bottom: 50px;
}

.section-one p {
  font-weight: 400;
  font-size: 16px;
  margin-bottom: 45px;
  color: #222;
}

.text-succes {
  color: #7cd755;
}

.bg-black {
  background-color: #161815 !important;
}

.section-one-padding {
  padding-top: 120px;
  padding-bottom: 120px;
}

.service-section-one h1 {
  margin-bottom: 15px;
  color: #fff;
}

.service-section-one h6 {
  margin-bottom: 15px;
  color: #fff;
}

.service-section-one p {
  margin-bottom: 45px;
  /* font-style: italic; */
  font-weight: 400;
  font-size: 18px;
  line-height: 25px;
  color: #ffffff;
}

.service-section-one-padding {
  padding-top: 85px;
  padding-bottom: 85px;
}

.section-tow-padding {
  padding-bottom: 100px;
}

.section-technologies-padding {
  padding-bottom: 100px;
  padding-top: 100px;
}

.btn-primary {
  color: #161815 !important;
  background-color: #7cd755 !important;
  border: 2px solid #7cd755 !important;
  font-weight: 600 !important;
  font-size: 16px !important;
  padding: 13px 35px !important;
  border-radius: 5.4px !important;
  width: fit-content !important;
}

/*.btn{*/
/*    width: -webkit-fill-available !important;*/
/*}*/

.btn.btn-primary:hover {
  color: #7cd755 !important;
  background: transparent !important;
  box-shadow: rgb(255, 255, 255) 4px 4px 0px 0px;
}



.career-button a {
  color: #161815;
  background-color: #7cd755;
  font-weight: 600;
  font-size: 18px;
  padding: 10px 45px;
  border-radius: 40px;
  border-color: 3px solid #7cd755;
}

.btn-dark {
  background-color: #222222 !important;
  border: 2px solid #222222 !important;
  font-weight: 600 !important;
  font-size: 16px !important;
  padding: 13px 35px !important;
  border-radius: 5.4px !important;
}

.btn-white {
  background-color: #fff !important;
  border: 2px solid #fff !important;
  font-weight: 600 !important;
  font-size: 16px !important;
  padding: 13px 35px !important;
  border-radius: 5.4px !important;
}

.btn-white-1 i {
  transform: rotate(-45deg);
}

.btn.btn-footer {
  background-color: #222222 !important;
  border: 2px solid #222222 !important;
  font-weight: 600;
  font-size: 16px;
  line-height: 32px;
  color: #ffffff !important;
  padding: 13px 35px;
  border-radius: 5.4px;
}

.btn-mechodal {
  color: #ffffff !important;
  background-color: #222222 !important;
  font-weight: 600 !important;
  font-size: 16px !important;
  padding: 8px 30px !important;
  border-radius: 10px !important;
  box-shadow: -1.5px -1.5px 0px #fcb401, -3px -3px 0px #19befd,
    -5px -5px 0px #f82b60;
  margin-left: 1rem;
  margin-top: 4px;
}

.btn.btn-mechodal:hover {
  color: #222 !important;
  background: transparent !important;
  border: 1px solid #222 !important;
}

.btn-mechodal1 {
  color: #ffffff !important;
  background-color: #5BB535 !important;
  font-weight: 600 !important;
  font-size: 16px !important;
  padding: 8px 30px !important;
  border-radius: 10px !important;
  margin-left: 1rem;
  margin-top: 4px;
}

.btn.btn-mechodal1:hover {
  color: #5BB535 !important;
  background: transparent !important;
  border: 1px solid #5BB535 !important;
}

.btn-light {
  color: #161815 !important;
  background-color: transparent !important;
  border: 2px solid #7cd755 !important;
  font-weight: 600 !important;
  font-size: 16px !important;
  padding: 6px 35px !important;
  border-radius: 5.4px !important;
  transition: 0.4s;
}

.btn.btn-light:hover {
  background-color: #7cd755 !important;
}

.btn.btn-blur {
  color: #161815 !important;
  background: #ffffff !important;
  opacity: 0.4 !important;
  font-weight: 600 !important;
  font-size: 16px !important;
  padding: 6px 35px !important;
  border-radius: 5.4px !important;
  border: 2px solid #222222;
}

.section-tow hr {
  margin-bottom: 20px !important;
}

.service-section-tow hr {
  margin-bottom: 20px !important;
}

.section-teb hr {
  margin-bottom: 20px !important;
}

.section-teb p {
  font-weight: 400;
  font-size: 18px;
  margin-bottom: 30px;
}

.owl-carousel .owl-stage {
  display: flex !important;
  align-items: center !important;
}

.side-div {
  background-color: #161815;
  padding: 30px 0px;
  box-shadow: 0px 2px 37px rgba(0, 0, 0, 0.4);
}

.nav-pills .nav-link.active,
.nav-pills .show>.nav-link {
  color: #fff !important;
  background-color: #7cd755 !important;
  border-radius: 0 !important;
  font-size: 18px !important;
  font-weight: 600 !important;
}

.nav-link {
  color: #fff !important;
  padding: 13px 1rem !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  text-align: start !important;
}

.tab-box {
  background: #ffffff;
  box-shadow: 0px 2px 37px rgba(0, 0, 0, 0.1);
}

#v-pills-tabContent {
  padding-left: 50px !important;
  padding-right: 50px !important;
  padding-top: 40px !important;
  padding-bottom: 40px !important;
}

ul.b {
  list-style-type: disc;
  margin-bottom: 0;
}

li::marker {
  color: #fff;
}

.b li {
  font-weight: 600;
  font-size: 18px;
  color: #333333;
  margin-bottom: 5px;
  list-style-type: disc;
}

.b li::marker {
  color: #fff;
}

.section-teb a {
  display: flex;
  justify-content: end;
  text-transform: uppercase;
  font-weight: 600;
  font-size: 14px;
  text-decoration: none;
  color: #5bb535;
  margin-top: 80px;
  margin-bottom: 25px;
}

.section-teb a:hover {
  color: #161815;
}

.customer-section {
  padding: 0px 100px;
}

.nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link.active {
  border-bottom: 2px solid #7cd755 !important;
  border-color: #fff #fff #7cd755 #fff !important;
  background-color: transparent !important;
}

.nav-tabs {
  background-color: #fff;
  border-bottom: 0px !important;
}

.customer-img {
  background-color: #fff;
  margin: 0;
  padding: 1rem 1rem;
}

.nav-tabs .nav-link:focus,
.nav-tabs .nav-link:hover {
  border-bottom: 2px solid #7cd755 !important;
  border-color: transparent transparent #7cd755 transparent !important;
  isolation: isolate;
}

.customer-details {
  padding: 50px 40px;
}

.customer-details h3 {
  margin-bottom: 12px;
  font-weight: 600;
  font-size: 24px;
  color: #323232;
}

.customer-details p {
  font-weight: 100;
  font-size: 16px;
  line-height: 25px;
  color: #323232;
}

.solutions-tow hr {
  margin-bottom: 16px !important;
}

.solution-section {
  padding: 100px 0 0 0;
  background-color: #222;
}

.happy-section {
  padding: 58px 0 58px 0;
  background-color: #161815;
}

.hire-section {
  padding: 45px 0 130px;
  background-color: #161815;
}

.solutions-tow h2 {
  color: #fff;
}

.solutions-tow p {
  color: #fff;
  font-weight: 400;
  font-size: 16px;
  margin-bottom: 24px;
}

.solution-box p {
  font-weight: 700;
  font-size: 18px;
  color: #222222;
  background-color: #fff;
  padding: 25px 20px;
  text-align: center;
  margin-bottom: 0;
  height: 102px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 10px;
  background: #fff;
  box-shadow: 4px 4px 0px 0px #7cd755;
}

.case-study-box p {
  color: #222;
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 14px;
}

.case-study-box {
  border-radius: 10px;
  background: #fff;
  box-shadow: 4px 4px 0px 0px #5bb535;
  padding: 20px;
}

.solution-box {
  margin-bottom: 26px;
}

.technologies-side-div {
  box-shadow: 4px 0px 9px -6px rgba(50, 50, 50, 0.25);
  background: #ffffff;
  border-right: 1px solid #dadfe3;
  padding: 0 !important;
}

.tech-link {
  color: #3b3c3d !important;
}

.nav-pills .tech-link.active,
.nav-pills .show>.tech-link {
  color: #7cd755 !important;
  background-color: #fafafa !important;
  border-radius: 0 !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  border-left: 3px solid #7cd755;
}

.technologies-box {
  background: #fafafa;
  border: 1px solid #dadfe3;
}

.technologies-padding {
  padding: 30px !important;
}

.back-end-img img {
  margin-right: 10px;
  margin-bottom: 10px;
}

.back-end-img {
  margin-bottom: 10px;
}

.hire-one h4 {
  font-weight: 400;
  font-size: 30px;
  line-height: 34px;
  color: #ffffff;
  margin-bottom: 13px;
}

.hire-one p {
  font-weight: 400;
  font-size: 18px;
  line-height: 22px;
  color: #ddd;
  margin-bottom: 0;
}

.hire-tow a {
  font-weight: 600 !important;
  font-size: 15px !important;
  text-transform: uppercase;
  color: #ffffff !important;
}

.hire {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 30px;
}

.hire-mechincal-img img {
  margin-right: 18px;
  margin-bottom: 5px;
  margin-top: 5px;
}

.hire-mechincal {
  background-color: #fff;
  padding: 18px 29px;
  height: 100%;
  border-radius: 5.4px;
}

.hire-mechincal h5 {
  font-weight: 400;
  font-size: 24px;
  color: #0b2e58;
  margin-bottom: 19px;
}

.hire-mechincal p {
  font-weight: 400;
  font-size: 16px;
  line-height: 25px;
  color: #333333;
  margin-bottom: 15px;
}

.section-top {
  margin-top: -138px !important;
}

.why-us-box {
  padding: 28px 28px 24px 28px;
  background: #ffffff;
  border-width: 1px;
  border-style: solid;
  border-color: #e1e1e1;
  /* border-top: 4px solid #7cd755; */
  text-align: start;
  height: 100%;
  border-radius: 20px;
}

.why-us-box:hover {
  transition: box-shadow 0.3s ease;
}

.why-box-margin:nth-child(1) .why-us-box:hover {
  box-shadow: 4px 4px 0px 0px #7cd755;
}

.why-box-margin:nth-child(2) .why-us-box:hover {
  box-shadow: 4px 4px 0px 0px #fdb400;
}

.why-box-margin:nth-child(3) .why-us-box:hover {
  box-shadow: 4px 4px 0px 0px #19befd;
}

.why-box-margin:nth-child(4) .why-us-box:hover {
  box-shadow: 4px 4px 0px 0px #f82b60;
}

.why-box-margin:nth-child(5) .why-us-box:hover {
  box-shadow: 4px 4px 0px 0px #fdb400;
}

.why-box-margin:nth-child(6) .why-us-box:hover {
  box-shadow: 4px 4px 0px 0px #19befd;
}

.why-box-margin:nth-child(7) .why-us-box:hover {
  box-shadow: 4px 4px 0px 0px #f82b60;
}

.why-box-margin:nth-child(8) .why-us-box:hover {
  box-shadow: 4px 4px 0px 0px #7cd755;
}

.why-box-margin:nth-child(9) .why-us-box:hover {
  box-shadow: 4px 4px 0px 0px #7cd755;
}

.why-box-margin:nth-child(10) .why-us-box:hover {
  box-shadow: 4px 4px 0px 0px #fdb400;
}

.why-box-margin:nth-child(11) .why-us-box:hover {
  box-shadow: 4px 4px 0px 0px #19befd;
}

.why-box-margin:nth-child(12) .why-us-box:hover {
  box-shadow: 4px 4px 0px 0px #f82b60;
}

.why-us-box img {
  margin-bottom: 14px;
}

.career-want {
  padding: 28px 28px 24px 28px;
  border-width: 0px 1px 1px 1px;
  border-style: solid;
  border-color: #e1e1e1;
  border-top: 4px solid #7cd755;
  text-align: center;
  height: 100%;
  background: #ffffff;
  box-shadow: 2px 18px 46px rgba(0, 0, 0, 0.15);
  border-radius: 20px;
}

.why-us-box,
.career-want h4 {
  font-weight: 500;
  font-size: 24px;
  line-height: 31px;
  letter-spacing: -0.2px;
  color: #222222;
  margin-top: 19px;
  margin-bottom: 13px;
}

.why-us-box h4 {
  color: #212529;
  font-weight: 700;
}

.why-us-box p {
  margin-bottom: -15px !important;
}

.why-us-box,
.career-want p {
  font-weight: 400;
  font-size: 16px;
  line-height: 26px;
  color: #333333;
  margin-bottom: 0;
}

.dedicat-why-us-box {
  padding: 28px 20px 28px 20px;
  background: #ffffff;
  border-width: 0px 1px 1px 1px;
  border-style: solid;
  border-color: transparent;
  border-top: 4px solid #7cd755;
  text-align: center;
  height: 100%;
}

.dedicat-why-us-box h4 {
  font-weight: 400;
  font-size: 24px;
  line-height: 31px;
  letter-spacing: -0.2px;
  color: #222222;
  margin-top: 19px;
  margin-bottom: 13px;
}

.dedicat-why-us-box p {
  font-weight: 400;
  font-size: 16px;
  line-height: 26px;
  color: #333333;
  margin-bottom: 0;
}

.dedicat-why-green {
  background: linear-gradient(180deg, #7cd755 0%, #5bb535 100%);
  padding: 28px 20px 28px 20px;
  text-align: center;
  height: 100%;
}

.dedicat-why-green a {
  margin-top: 19px;
}

.why-box-margin {
  margin-bottom: 20px;
}

.accordion-button:focus {
  z-index: 3 !important;
  border-color: #7cd755 !important;
  outline: 0 !important;
  box-shadow: none !important;
}

.accordion-button {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  padding: 25px !important;
  font-size: 21px !important;
  color: #222222 !important;
  text-align: left !important;
  border: 0 !important;
  border-radius: 0 !important;
  overflow-anchor: none !important;
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out,
    border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out,
    border-radius 0.15s ease;
  font-weight: 400;
  letter-spacing: -0.2px !important;
}

.accordion-button:not(.collapsed) {
  background-color: rgb(124 215 85 / 20%) !important;
  box-shadow: rgba(0, 0, 0, 0.125) 0px -1px 0px inset !important;
}

.happy-border {
  border-left: 1px solid;
  border-right: 1px solid;
  padding-bottom: 10px;
}

.happy-box {
  text-align: center;
}

.happy-box h4 {
  font-weight: 700;
  font-size: 31.5px;
  padding-bottom: 10px;
  margin-bottom: 10px;
  color: #5bb535;
  border-bottom: 1px solid rgba(141, 153, 167, 0.25) !important;
}

.happy-box p {
  font-weight: 700;
  font-size: 13.5px;
  letter-spacing: 2px;
  color: #888888;
  margin-bottom: 0;
}

.header-tow {
  padding: 13px 0;
}

.header-tow a {
  font-weight: 400;
  font-size: 14px;
  color: #323232;
  text-decoration: none;
}

.header-tow p {
  font-weight: 400;
  font-size: 14px;
  color: #5bb535;
  margin-bottom: 0;
}

.header-tow span {
  padding: 0 10px;
}

.header-three {
  padding: 18px 0;
  overflow-x: scroll;
  white-space: nowrap;
  scrollbar-width: none;
}

.header-three a {
  margin-right: 35px;
  font-weight: 600;
  font-size: 16px;
  color: #323232;
  text-decoration: none;
}

.header-three a:hover {
  color: #5bb535;
}

.header-three a:focus {
  color: #5bb535;
}

.software {
  background-color: #fff;
}

.bg-software-home {
  background-image: url(../image/background/bg.svg);
  background-size: cover;
  background-repeat: no-repeat;
}

.bg-dedicated-home {
  background-image: url(../image/background/bg-dark.svg);
  background-size: cover;
  background-repeat: no-repeat;
}

.bg-career-home {
  background-image: url(../image/background/career.png);
  background-size: cover;
  background-repeat: no-repeat;
}

.bg-about-home {
  background-image: url(../image/background/bg-dark.svg);
  background-position: bottom;
  background-repeat: no-repeat;
  background-size: cover;
}

.bg-blog {
  background-image: url(../image/background/bg-blog.png);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.bg-tow-software-home {
  background-image: url(../image/background/bg-two.svg);
  background-size: cover;
  background-repeat: no-repeat;
}

.service-section-tow-padding {
  padding-top: 80px;
}

.py-75 {
  padding-top: 75px;
  padding-bottom: 75px;
}

.decades-long h3 {
  margin-bottom: 21px;
  font-weight: 700;
  font-size: 24px;
  color: #222222;
}

.decades-long-point ul li {
  font-weight: 400;
  font-size: 18px;
  color: #3b3c3d;
  text-decoration: none;
  margin-bottom: 10px;
}

.decades-long-point li::marker {
  color: #3b3c3d;
}

.decades-long {
  margin-bottom: 30px;
}

.software-service-section {
  padding-top: 100px;
}

.hire-service {
  margin-top: 120px;
}

.custom-software-box {
  background: #ffffff;
  border: 1px solid #222;
  border-radius: 20px;
  padding: 40px 20px;
  height: 100%;
}

.custom-software-box:hover {
  transition: box-shadow 0.3s ease;
}

.custom-main-box:nth-child(1) .custom-software-box:hover {
  box-shadow: 4px 4px 0px 0px #7cd755;
}

.custom-main-box:nth-child(2) .custom-software-box:hover {
  box-shadow: 4px 4px 0px 0px #fdb400;
}

.custom-main-box:nth-child(3) .custom-software-box:hover {
  box-shadow: 4px 4px 0px 0px #19befd;
}

.custom-main-box:nth-child(4) .custom-software-box:hover {
  box-shadow: 4px 4px 0px 0px #f82b60;
}

.custom-main-box:nth-child(5) .custom-software-box:hover {
  box-shadow: 4px 4px 0px 0px #fdb400;
}

.custom-main-box:nth-child(6) .custom-software-box:hover {
  box-shadow: 4px 4px 0px 0px #19befd;
}

.custom-main-box:nth-child(7) .custom-software-box:hover {
  box-shadow: 4px 4px 0px 0px #f82b60;
}

.custom-main-box:nth-child(8) .custom-software-box:hover {
  box-shadow: 4px 4px 0px 0px #7cd755;
}

.custom-main-box:nth-child(9) .custom-software-box:hover {
  box-shadow: 4px 4px 0px 0px #7cd755;
}

.custom-main-box:nth-child(10) .custom-software-box:hover {
  box-shadow: 4px 4px 0px 0px #fdb400;
}

.custom-main-box:nth-child(11) .custom-software-box:hover {
  box-shadow: 4px 4px 0px 0px #19befd;
}

.custom-main-box:nth-child(12) .custom-software-box:hover {
  box-shadow: 4px 4px 0px 0px #f82b60;
}

.custom-software-box img {
  margin-bottom: 30px;
}

.custom-software-box h4 {
  margin-bottom: 0;
  padding-bottom: 15px;
  font-weight: 600;
  font-size: 24px;
  /*text-decoration-line: underline;*/
  color: #3b3c3d;
}

.custom-software-box p {
  font-weight: 400;
  font-size: 16px;
  line-height: 21px;
  color: #3b3c3d;
  text-decoration: none;
  margin-bottom: 0;
}

/* .custom-software-box:hover {
  box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.25);
} */
.custom-main-box a {
  text-align: center;
  text-decoration: none;
}

.custom-main-box a:hover h4 {
  color: #5bb535;
}

.software-customer {
  padding-top: 100px;
}

.software-why {
  padding-top: 120px;
}

.decades-long-point ul li span {
  font-weight: 700;
  font-size: 18px;
  color: #5bb535;
}

.software-types {
  padding: 32px 30px 32px 30px;
  border-style: solid;
  background: #ffffff;
  border: 1px solid #dadfe3;
  text-align: center;
  height: 100%;
}

.software-types h4 {
  margin-top: 19px;
  margin-bottom: 13px;
  font-weight: 600;
  font-size: 24px;
  line-height: 33px;
  color: #3b3c3d;
}

.software-types p {
  font-weight: 400;
  font-size: 16px;
  line-height: 26px;
  color: #333333;
  margin-bottom: 0;
}

.industrial-software ul li {
  font-weight: 700;
  font-size: 16px;
  line-height: 21px;
  color: #3b3c3d;
  text-decoration: none;
  margin-top: 11px;
  margin-bottom: 15px;
}

.industrial-software ul li span {
  font-weight: 400;
  font-size: 16px;
  line-height: 21px;
  color: #3b3c3d;
  text-decoration: underline;
}

.software-types a {
  font-weight: 400;
  font-size: 16px;
  line-height: 22px;
  text-decoration: none;
  color: #5bb535;
}

.software-types a:hover {
  color: #3b3c3d;
}

.softeare-project {
  background: #ffffff;
}

.softeare-project-one {
  background: #161815;
  box-shadow: 0px 2px 37px rgba(0, 0, 0, 0.4);
  display: flex;
  align-items: center;
  padding: 2rem 1rem;
}

.service-section-one h2 {
  color: #fff;
}

.sticky-top {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 1020;
}

.software.sticky-top.sticky-top2 {
  top: 67px !important;
}

.top-header {
  top: 67px !important;
}

.about-text p {
  font-weight: 400;
  font-size: 18px;
  line-height: 26px;
  color: #3b3c3d;
  margin-bottom: 5px;
}

.award-image img {
  padding: 0 1rem;
}

.explore-ecomm {
  padding-top: 70px;
}

.ecom-side-div {
  background-color: #ffffff;
  padding: 30px 0px;
  box-shadow: 0px 2px 37px rgba(0, 0, 0, 0.4);
}

.ecom-explore-link.nav-link {
  color: #222222 !important;
  padding: 13px 2rem !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  text-align: start !important;
  transition: 0.5s;
}

.nav-pills .ecom-explore-link.nav-link.active,
.nav-pills .show>.nav-link {
  color: #fff !important;
  background-color: #7cd755 !important;
  border-radius: 0 !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  padding: 13px 1rem !important;
}

.nav-pills .home-explore-link.nav-link.active,
.nav-pills .show>.nav-link {
  color: #fff !important;
  background-color: #7cd755 !important;
  border-radius: 0 !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  padding: 13px 1rem !important;
}

.home-explore-link.nav-link {
  color: #fff !important;
  padding: 13px 2rem !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  text-align: start !important;
  transition: 0.5s;
}

.platform-teb p {
  font-weight: 400;
  font-size: 18px;
  margin-top: 15px;
  margin-bottom: 30px;
}

.platform-teb p a {
  color: #5bb535;
  font-weight: 700;
}

.btob-img img {
  width: 100%;
}

.point-need {
  background-color: #161815;
  padding-bottom: 80px;
}

.point-need h3 {
  color: #ffffff;
}

.point-need h2 {
  color: #7cd755;
}

.ecomm-point ul li {
  font-weight: 600;
  font-size: 18px;
  color: #ffffff;
  text-decoration: none;
  margin-bottom: 0px;
}

.ecomm-point ul p {
  font-weight: 300;
  font-size: 18px;
  color: #ffffff;
}

.ecomm-point ul h5 {
  color: #5bb535;
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 0;
  padding-top: 10px;
}

.ecomm-point ul li span {
  font-weight: 400;
  font-size: 18px;
  color: #5bb535;
}

.ecomm-talk {
  padding: 50px 15px 50px 15px;
}

.ecomm-talk-bg {
  background-image: url(../image/background/bg.svg);
  background-size: cover;
  background-repeat: no-repeat;
  /* border-radius: 15px; */
}

.eccom-talk-text p {
  margin-bottom: 0px;
  font-style: normal;
  font-weight: 400;
  font-size: 18px;
  line-height: 25px;
  color: #ffffff;
}

.talk-with-padding {
  padding: 0px 50px;
  align-items: center;
  justify-content: space-between;
}

.ecomm-tech-age {
  margin-top: 100px;
}

.ecomm-operational {
  padding: 30px 10px 30px 10px;
  background: #ffffff;
  border: 1px solid #dadfe3;
  text-align: center;
  border-radius: 20px;
  height: 100%;
}

.why-box-margin:nth-child(1) .ecomm-operational:hover {
  box-shadow: 4px 4px 0px 0px #7cd755;
}

.why-box-margin:nth-child(2) .ecomm-operational:hover {
  box-shadow: 4px 4px 0px 0px #fdb400;
}

.why-box-margin:nth-child(3) .ecomm-operational:hover {
  box-shadow: 4px 4px 0px 0px #19befd;
}

.why-box-margin:nth-child(4) .ecomm-operational:hover {
  box-shadow: 4px 4px 0px 0px #f82b60;
}

.why-box-margin:nth-child(6) .ecomm-operational:hover {
  box-shadow: 4px 4px 0px 0px #fdb400;
}

.why-box-margin:nth-child(7) .ecomm-operational:hover {
  box-shadow: 4px 4px 0px 0px #19befd;
}

.why-box-margin:nth-child(8) .ecomm-operational:hover {
  box-shadow: 4px 4px 0px 0px #f82b60;
}

.why-box-margin:nth-child(5) .ecomm-operational:hover {
  box-shadow: 4px 4px 0px 0px #7cd755;
}

.why-box-margin:nth-child(9) .ecomm-operational:hover {
  box-shadow: 4px 4px 0px 0px #7cd755;
}

.why-box-margin:nth-child(10) .ecomm-operational:hover {
  box-shadow: 4px 4px 0px 0px #fdb400;
}

.why-box-margin:nth-child(11) .ecomm-operational:hover {
  box-shadow: 4px 4px 0px 0px #19befd;
}

.why-box-margin:nth-child(12) .ecomm-operational:hover {
  box-shadow: 4px 4px 0px 0px #f82b60;
}

.ecomm-operational h4 {
  margin-top: 19px;
  margin-bottom: 0;
  font-weight: 600;
  font-size: 24px;
  line-height: 33px;
  color: #3b3c3d;
}

.ecomm-operational img {
  height: 50px;
  width: 50px;
}

.ecomm-project {
  background-color: #ffffff;
  padding: 40px 30px;
}

.ecomm-show-hide {
  background-color: #ffffff;
  padding: 40px 30px;
  border: 1px solid #dadfe3;
  display: flex;
}

.ecomm-show-hide:hover {
  transition: box-shadow 0.3s ease;
  box-shadow: 4px 4px 0px 0px #7cd755;
}

.work-with-icon img {
  padding-top: 10px;
}

.solution-section-ecomm {
  padding: 100px 0 0 0;
  background-color: #161815;
  margin-top: 65px;
}

.e-comm-cost h2 {
  color: #ffffff;
}

.e-comm-cost p {
  font-weight: 400;
  font-size: 18px;
  line-height: 32px;
  color: #ffffff;
}

.e-comm-cost a {
  text-transform: uppercase;
  color: #ffffff !important;
}

.ecomm-solution {
  display: flex;
  align-items: center;
  padding: 40px;
}

.memorable-padding {
  padding: 0 0 40px 0;
}

.softeare-project-ecomm {
  background-color: #ffffff;
  margin: 75px 0;
}

.ecomm-happy {
  margin-bottom: 80px;
}

.ecomm-show-more h3 {
  margin-bottom: 12px;
  font-weight: 600;
  font-size: 24px;
  color: #222222;
}

.ecomm-show-more span {
  font-weight: 400;
  font-size: 18px;
  line-height: 32px;
  color: #3b3c3d;
}

.scrum-development button {
  color: #5bb535;
  font-weight: 400;
  font-size: 16px;
  line-height: 22px;
  background: none;
  border: 0;
  text-align: end;
}

.scrum-development {
  text-align: end;
}

.dropdown-menu {
  z-index: 99999 !important;
}

.section-tow p {
  margin: 15px 0 35px 0;
}

.hr-bottom hr {
  margin-bottom: 0 !important;
}

.btn-check:focus+.btn-dark,
.btn-dark:focus {
  color: #fff;
  background-color: #1c1f23;
  border-color: #1a1e21;
  box-shadow: 0 0 0 0.25rem transparent !important;
}

.btn-check:focus+.btn-primary,
.btn-primary:focus {
  color: #fff;
  background-color: #0b5ed7;
  border-color: #0a58ca;
  box-shadow: 0 0 0 0.25rem transparent !important;
}

.btn-check:focus+.btn-footer,
.btn-footer:focus {
  color: #fff;
  background-color: #0b5ed7;
  border-color: #0a58ca;
  box-shadow: 0 0 0 0.25rem transparent !important;
}

.btn-check:focus+.btn-mechodal,
.btn-mechodal:focus {
  color: #fff;
  background-color: #0b5ed7;
  border-color: #0a58ca;
  box-shadow: 0 0 0 0.25rem transparent !important;
}

.btn-check:focus+.btn-light,
.btn-light:focus {
  color: #000;
  background-color: #f9fafb;
  border-color: #f9fafb;
  box-shadow: 0 0 0 0.25rem transparent !important;
}

.text-green {
  color: #5bb535;
}

h1.text-green {
  color: #5bb535;
}

h6.text-green {
  color: #5bb535;
}

h4.text-green {
  color: #5bb535;
}

p.text-green {
  color: #5bb535;
}

h2.text-green {
  color: #5bb535 !important;
}

.software-industrial ul li {
  margin-top: 11px;
  margin-bottom: 0;
  text-decoration: none;
  font-weight: 400;
  font-size: 16px;
  color: #3b3c3d;
}

.website-solution {
  margin-top: 100px;
}

.dedicated-btn a {
  color: #ffffff !important;
}

.dedicated-btn {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.main-about h1 {
  margin-bottom: 0;
  text-align: center;
}

.main-about h6 {
  margin-bottom: 0;
  text-align: center;
}

.about-sec-padding {
  padding: 115px;
}

.mechodal-s {
  padding-bottom: 48px;
}

.team-box {
  padding: 28px 28px 24px 28px;
  background: #ffffff;
  border-width: 1px;
  border-style: solid;
  border-color: #e1e1e1;
  text-align: center;
  height: 100%;
  border-radius: 0 0 15px 15px;
}

.team-box:hover {
  box-shadow: 0px 4px 0px 0px #7cd755;
  transition: box-shadow 0.3s ease;
}

.team-box img {
  mix-blend-mode: luminosity;
}

.team-box:hover img {
  mix-blend-mode: inherit;
}

.team-box h4 {
  font-weight: 600;
  font-size: 22px;
  letter-spacing: -0.2px;
  color: #222222;
  margin-top: 19px;
  margin-bottom: 13px;
}

.team-box p {
  font-weight: 400;
  font-size: 15px;
  color: #5bb535;
}

.owl-theme .owl-dots .owl-dot span {
  margin: 5px !important;
  display: block;
  -webkit-backface-visibility: visible;
  transition: opacity 0.2s ease;
  width: 18px !important;
  height: 2px !important;
  background: rgba(156, 156, 156, 0.3) !important;
}

.owl-theme .owl-dots .owl-dot.active span,
.owl-theme .owl-dots .owl-dot:hover span {
  background: #7cd755 !important;
}

.owl-carousel.owl-carouselll .owl-item img {
  display: block;
  width: auto;
}

.owl-item {
  height: 100%;
}

.item,
.work-portfolio-cart {
  height: 100%;
}

.navbar-light .navbar-toggler {
  color: rgb(255 255 255 / 55%) !important;
}

.accordion-button:not(.collapsed)::after {
  background-image: url(../image/why-us/faq.svg) !important;
  transform: rotate(-180deg);
}

.service-section-one h2 {
  color: #fff;
  margin-bottom: 14px;
}

.footer-section {
  background: #101211;
  border-radius: 5.4px;
  margin-bottom: 22px;
  height: 226px;
}

.social-icon {
  padding-bottom: 38px;
}

.instagram a {
  width: 57px;
  height: 57px;
  background: #222222;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
}

.instagram a i {
  font-size: 20px;
  color: #ffffff;
}

.instagram a i:hover {
  font-size: 20px;
  color: #7cd755;
}

.footer-about {
  padding: 35px 25px;
  border-top: 1px solid #7cd755;
}

.footer-about h5 {
  font-weight: 700;
  font-size: 20px;
  line-height: 28px;
  color: #7cd755;
}

.footer-link ul li a {
  color: #ffffff;
  font-weight: 400;
  font-size: 16px;
}

.footer-link ul li a:hover {
  color: #7cd755;
}

.footer-location h4 {
  font-weight: 700;
  font-size: 20px;
  line-height: 28px;
  color: #7cd755;
}

.footer-about p {
  font-weight: 400;
  font-size: 16px;
  color: #ffffff;
  margin-bottom: 0;
}

.footer-about p a {
  font-weight: 400;
  font-size: 16px;
  line-height: 28px;
  color: #ffffff;
  text-decoration: none;
}

.footer-about p a:hover {
  color: #7cd755;
}

.instagram {
  text-align: center;
}

.about-sec-tow {
  text-align: center;
  margin-top: 65px;
}

.about-sec-tow hr {
  margin: 1rem auto 60px !important;
}

.about-sec-tow1 hr {
  margin: 13px 0 20px 0 !important;
}

.journey h3 {
  margin: 0 30px 18px 30px;
}

.journey h3.disabled {
  color: rgba(255, 255, 255, 0.26);
}

.contact-chet {
  padding: 28px 28px 24px 28px;
  background: #ffffff;
  border-width: 0px 1px 1px 1px;
  border-style: solid;
  border-color: #e1e1e1;
  border-top: 4px solid #7cd755;
  text-align: center;
  height: 100%;
  display: flex;
  align-items: center;
}

.contact-chet h4 {
  font-weight: 600;
  line-height: 31px;
  font-size: 24px;
  letter-spacing: -0.2px;
  color: #222222;
  margin-bottom: 20px;
}

.sms-text {
  text-align: start;
  margin: 0 0 0 20px;
}

.sms-icon {
  margin: 0 20px 0 0;
}

.contact-side {
  background: url(../image/background/contact.svg);
  background-position: bottom right;
  background-repeat: no-repeat;
  padding: 70px 45px;
  border-radius: 5px;
}

.home-background {
  background: url(../image/background/home-bg1.svg);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: auto;
  height: 93vh;
}

.home-background1 {
  display: flex;
  align-items: center;
  justify-content: center;
}

.contact-side h4 {
  font-weight: 600;
  font-size: 28px;
  line-height: 32px;
  color: #ffffff;
}

.contact-side p {
  font-weight: 400;
  font-size: 16px;
  color: #ffffff;
  margin-bottom: 0;
}

.contact-side p span {
  color: #5bb535;
}

.contact-form {
  padding: 40px 35px;
}

.main-form {
  height: 100%;
}

input.form-control {
  display: block;
  width: 100%;
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #212529;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid #e9eef1;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border-radius: 0.25rem;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

input.form-control:focus {
  color: #212529;
  background-color: #fff;
  border-color: #7cd755 !important;
  outline: 0;
  box-shadow: 0 0 0 0.25rem rgba(255, 255, 255, 0.25);
}

.form-select {
  display: block;
  width: 100%;
  padding: 0.375rem 2.25rem 0.375rem 0.75rem;
  -moz-padding-start: calc(0.75rem - 3px);
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #212529;
  background-color: #fff;
  background-repeat: no-repeat;
  background-position: right 0.75rem center;
  background-size: 16px 12px;
  border: 1px solid #e9eef1 !important;
  border-radius: 0.25rem;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

select.form-select:focus {
  border-color: #7cd755 !important;
  outline: 0;
  box-shadow: 0 0 0 0.25rem rgba(255, 255, 255, 0.25);
}

input.form-check-input:checked {
  background-color: #7cd755;
  border-color: #7cd755;
}

input.form-check-input {
  border-color: #cccccc;
}

input.form-check-input:focus {
  border-color: #7cd755;
  outline: 0px;
  box-shadow: rgba(255, 255, 255, 0.25) 0px 0px 0px 0.25rem;
}

label.form-label {
  font-weight: 600;
  font-size: 13px;
  color: #4f5c65;
}

p.text-info {
  color: #105cb5 !important;
}

p.text-danger {
  color: #ea4335 !important;
}

.main-contact-box {
  background: #ffffff;
  box-shadow: 1px 1px 20px rgba(0, 0, 0, 0.05);
  border-radius: 5px;
  margin-top: 10px;
  margin-bottom: 50px;
  padding: 12px;
}

.notify-main {
  display: flex;
  align-items: center;
}

.notification p {
  margin: 0 16px;
}

.owl-carousel .owl-stage {
  display: flex !important;
  align-items: stretch !important;
}

.customer-details h5 {
  font-size: 14px;
  font-weight: 400;
  margin-bottom: 20px;
}

.owl-carousel.align-center .owl-stage-outer .owl-stage {
  align-items: center !important;
}

.journey li button {
  background: none !important;
  font-weight: 600 !important;
  font-size: 24px !important;
  color: rgba(255, 255, 255, 0.26) !important;
}

.journey li button.nav-link.active {
  background: none !important;
  font-weight: 600 !important;
  font-size: 24px !important;
  color: #ffffff !important;
}

.btob-text {
  background: #222222;
  border-radius: 10px;
  padding: 60px;
}

.btob-text p {
  margin: 0 0 15px 0;
  font-weight: 600;
  font-size: 18px;
  line-height: 32px;
  color: #ffffff;
}

.comma {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.review-text span {
  font-weight: 600;
  font-size: 15px;
  text-align: right;
  color: #7cd755;
}

.review-text p {
  font-weight: 600;
  font-size: 15px;
  text-align: right;
  color: #ffffff;
  margin: 0;
}

.review-text {
  text-align: right;
}

.comma img {
  width: auto !important;
}

.mech-expertise img {
  margin-right: 10px;
  margin-bottom: 10px;
}

.festival-one {
  border: 2px solid #14191d;
  text-align: center;
}

.festival-one p {
  font-weight: 500;
  font-size: 20px;
  letter-spacing: -0.2px;
  color: #5bb535;
  margin-bottom: 0;
  margin-top: 11px;
}

.memorable .festivals .festival-one img {
  width: 128rem;
  margin: auto;
}

.memorable {
  margin: 14px 0;
}

.festivals {
  display: flex;
}

.career-second {
  display: flex;
  align-items: start;
  background-color: #ffffff;
  padding: 30px 30px;
  border: 1px solid #dadfe3;
  height: 100%;
}

.career-second img {
  width: 100px;
  margin-right: 20px;
}

.career-show-more h3 {
  margin-bottom: 12px;
  font-weight: 600;
  font-size: 24px;
  color: #222222;
}

.career-show-more span {
  font-weight: 400;
  font-size: 14px;
  color: #3b3c3d;
}

.client-testimonials iframe {
  width: 100%;
  height: 15rem;
}

.cards .card {
  background: #ffffff;
  box-shadow: 2px 18px 46px rgba(0, 0, 0, 0.15);
  border-radius: 10px;
}

.card-image img {
  background: #f7fff3;
  border-radius: 5px;
  padding: 15px;
}

.steps .step-number {
  position: relative;
}

.steps .step-count .step-number span {
  background: #ffffff;
  border: 1px solid #ffffff;
  box-shadow: inset -4px 4px 30px rgba(255, 255, 255, 0.5),
    inset 4px 4px 30px #d1d9e6;
  border-radius: 15px 15px 15px 0;
  width: 70px;
  height: 70px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 34px;
  margin: 0 auto;
}

.steps .step-count .step-number img {
  position: absolute;
  left: 70%;
  top: 10%;
}

.steps .step-count .step-number img.rotate {
  transform: rotateX(180deg);
  top: 50%;
}

.steps .step-count .step-detail {
  color: #5bb535;
  font-size: 18px;
  margin: 20px 0 16px;
  text-transform: capitalize;
}

.steps .step-description {
  font-size: 16px;
  color: #3b3c3d;
}

.steps .step-description .step-link {
  color: #006496;
  font-size: 16px;
  text-decoration: none;
  text-transform: capitalize;
}

.list-style-rectangle li::marker {
  color: #333;
}

.customer-details .darft-service li {
  margin-bottom: 12px;
}

.image-with-bg img {
  position: relative;
  margin-bottom: 2rem;
}

.img-with-bg h3 {
  margin-top: 3rem;
  text-wrap: nowrap;
}

.img-with-bg {
  position: absolute;
  z-index: 9;
  transform: translateX(-50%) !important;
  left: 50% !important;
}

.quick-turnaround-time {
  display: flex;
  align-items: center;
  margin-right: 18px;
  margin-bottom: 6px;
}

.quick-turnaround-time img {
  margin-right: 6px;
}

.quick-turnaround-time p {
  color: #fff;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  margin-bottom: 0 !important;
}

.sub-icon {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  margin-bottom: 20px;
  justify-content: center;
}

/* ------------11/05--------------- */
.decades-long h3 span {
  background-color: #222222;
  color: #ffffff;
  padding: 10px 20px;
  border-radius: 10px;
  margin-right: 15px;
}

.together-main-sec {
  background: #ffffff;
  padding: 46px 0 46px;
}

.together-main-sec h3 {
  text-align: center;
  letter-spacing: -0.1px;
  color: #222222;
  font-weight: 600;
  font-size: 18px;
  line-height: 30px;
}

.software-dev-sec {
  margin: 30px 0px 10px;
}

.software-dev-sec ul {
  background: #222222;
  border-radius: 10px;
  display: flex;
  justify-content: space-evenly;
}

.software-dev-sec ul li {
  padding: 12px 0;
}

.software-second-sec {
  background: #ffffff;
  padding: 80px 0;
  margin: 10px 0;
}

.fintech-start-sec p {
  margin-bottom: 16px;
  letter-spacing: -0.2px;
  font-weight: 400;
  font-size: 18px;
  color: #030303;
}

.fintech-start-sec h5 {
  margin-bottom: 16px;
  letter-spacing: -0.1px;
  font-weight: 600;
  font-size: 18px;
  color: #7cd755 !important;
}

.soft-pagination {
  margin: 40px 0 0;
  display: flex;
  justify-content: center;
}

.soft-pagination ul {
  margin-bottom: 0px;
}

.page-link {
  color: #212529 !important;
  padding: 12px 18px !important;
  margin: 5px;
}

.page-link {
  background: #ffffff;
  border: 3px solid #eff0f1;
  border-radius: 5px;
}

.soft-pagination li a {
  font-size: 16px;
}

.journeyy li button {
  background: none !important;
  font-weight: 600 !important;
  font-size: 24px !important;
  color: rgba(255, 255, 255, 0.26) !important;
}

.journeyy li button.nav-link.active {
  background: none !important;
  font-weight: 600 !important;
  font-size: 24px !important;
  color: #ffffff !important;
}

.btn.btn-disabled {
  opacity: 0.4;
  pointer-events: none;
}

.btn-icon i {
  transform: rotate(-45deg);
}

.testi-main-sec {
  padding: 40px 100px;
  background: #ffffff;
  box-shadow: 2px 18px 46px rgba(0, 0, 0, 0.15);
}

.testi-main-sec p {
  color: #222222;
}

.testi-tex p {
  color: #222222;
}

.your-needs {
  display: flex;
  align-items: center;
}

.your-needs p {
  color: #5bb535;
  font-size: 18px;
  font-weight: 600;
  margin: 0;
}

.your-needs img {
  margin-left: 35px;
  margin-right: 10px;
}

/*04/07*/
.page-item.active .page-link {
  background-color: #7cd755 !important;
  border-color: #7cd755 !important;
}

.content-item {
  display: none;
}

.content-item.active {
  display: block;
}

button.routbtn {
  border-radius: 6px;
  margin: 5px;
  background-color: #fff;
  border: 1px solid #dee2e6;
  color: #212529;
  padding: 12px 18px;
}

.camera-icon {
  text-align: center;
}

.unlimited-part-one {
  padding: 40px;
  border-bottom: 1px solid #e9e2d6;
}

.unlimited-part-one img {
  margin-bottom: 30px;
}

.unlimited-part-one h5 {
  color: #040404;
  font-size: 24px;
  font-weight: 400;
  margin-bottom: 0;
}

.unlimited-part-two {
  padding: 40px;
}

.memberships-part-one {
  padding: 27px;
  border-bottom: 1px solid #e9e2d6;
  position: relative;
}

.memberships-part-two {
  padding: 27px;
}

.unlimited-border:nth-child(1) {
  border-right: 1px solid #e9e2d6;
}

.unlimited-border:nth-child(2) {
  border-right: 1px solid #e9e2d6;
}

.unlimited-part-two p {
  color: #8d8579;
  font-size: 16px;
  font-weight: 400;
  margin-bottom: 0;
  line-height: 29.92px;
}

.bg-unlimited {
  border: 1px solid #fff;
  background-color: #fff;
}

.bg-memberships {
  border-radius: 0;
  background-color: #fff;
}

.right-for-now-section {
  border-radius: 20px;
  border: 1px solid #eff1f6;
  background: #fff;
  box-shadow: 0px 2px 8px 0px rgba(33, 57, 90, 0.08), 0px 0px 0px 10px #f7fafc;
  padding: 30px;
}

.memberships-part-one h3 {
  color: #212529;
  font-size: 26px;
  font-weight: 700;
}

.unlimited-design {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 15px;
}

.unlimited-design p {
  color: #040404;
  font-size: 16px;
  font-weight: 400;
  margin-bottom: 0;
}

.right-for-now-section img {
  width: 100%;
  padding: 50px;
  margin-bottom: 32px;
}

.right-for-now-section h5 {
  color: #130104;
  font-size: 32px;
  font-weight: 500;
  margin-bottom: 8px;
}

.right-for-now-section p {
  color: #525252;
  margin-bottom: 0;
  font-size: 17.6px;
  font-weight: 400;
}

.worry-free p {
  margin-bottom: 50px;
}

.unlimited-content {
  display: flex;
  align-items: center;
  margin-bottom: 26px;
}

.unlimited-content i {
  margin-right: 15px;
}

.unlimited-content p {
  margin-bottom: 0px;
  color: #8d8579;
  font-size: 18px;
  font-weight: 400;
}

.memberships-part-one span {
  color: #212529;
  font-size: 12px;
  font-weight: 400;
  border-radius: 9px;
  background: #ffcf4e;
  padding: 8px 20px;
  position: absolute;
  bottom: -12%;
}

.have-any-question {
  background-color: #161815;
  padding: 27px;
}

.have-any-question h4 {
  color: #fff;
  font-size: 30px;
  font-weight: 400;
  margin-bottom: 30px;
  line-height: 51.9px;
  width: 200px;
}

.unlimited-dev img {
  width: 34px;
  height: 34px;
}

.android-web-desk-ios {
  padding: 40px;
  border-radius: 5.4px;
  background: #fff;
}

.android-web-desk-ios:hover {
  box-shadow: 4px 4px 0px 0px #7cd755;
}

.android-web-desk-ios p {
  color: #3b3c3d;
  text-align: center;
  font-size: 16px;
  font-weight: 400;
  margin-bottom: 24px;
}

.four-app {
  justify-content: center;
  display: flex;
  flex-wrap: wrap;
}

.four-app h4 {
  color: #3b3c3d;
  font-size: 24px;
  font-weight: 600;
  margin: 0 10px 10px;
}

.four-app img {
  margin-bottom: 22px;
}

.four-app div {
  text-align: center;
  margin-bottom: 10px;
}

.btn.btn-primary.btn-orange {
  background: #ea4335 !important;
  color: #fff !important;
  border: 2px solid #ea4335 !important;
  text-transform: uppercase;
  border-radius: 5.4px !important;
  box-shadow: 4px 4px 0px 0px #222;
  width: fit-content;
}

.btn.btn-primary.btn-orange:hover {
  background: transparent !important;
  box-shadow: 9px 11px 18.8px 0px rgba(0, 0, 0, 0.25);
  color: #ea4335 !important;
  border: 2px solid #ea4335 !important;
  /* transition: 0.6s; */
}

/* 29/5*/
.sales-mail a {
  color: #7cd755 !important;
  text-transform: none;
}

/**special poup css start**/
.modal-content-bg {
  background: #222 !important;
  color: #fff !important;
  box-shadow: -2.5px 0px 0px #fcb401, -5px 0px 0px #19befd, -8px 0px 0px #f82b60;
  border-radius: 0% !important;
}

.modal-header-spl {
  border-bottom: 0px solid #dee2e6 !important;
}

.close-modal {
  position: absolute;
  right: 10px;
  padding: 6px;
  top: 10px;
  display: flex;
  z-index: 99;
}

.spl-img-modal {
  width: 20rem;
  display: flex;
  align-items: center;
  text-align: center;
  justify-content: center;
}

.modal-footer-spl {
  border: none !important;
}

.form-control-spl:focus {
  color: #fff !important;
  background-color: #000 !important;

  outline: 0;
  border: 1px solid #5bb535 !important;
  box-shadow: 0 0 0 0rem rgba(13, 110, 253, 0.25) !important;
}

.form-control-spl {
  display: block;
  width: 100%;
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #fff !important;
  background-color: #000 !important;
  background-clip: padding-box;
  border: 1px solid #000 !important;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border-radius: 0.25rem;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

/**special poup css end**/

.who-we-are {}

.videoCoverImage {
  position: relative;
  display: inline-block;
}

.video-play-btn {
  position: relative;
  cursor: pointer;
}

.who-we-are {
  width: -webkit-fill-available !important;
  display: none;
  height: auto;
  border-radius: 16px;
}

/* New DP  */
.collaborator-running-box {
  display: flex;
}

.collaborator-box {
  display: flex;
  flex-wrap: wrap;
  gap: 20px 16px;
}

.collaborator-one-box {
  border-radius: 20px;
  border: 1px solid #5bb535;
  background: #222;
  padding: 25px 30px;
  width: fit-content;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.collaborator-one-box:hover {
  border-radius: 20px;
  box-shadow: 4px 4px 0px 0px #5bb535;
}

.running-box {
  display: flex;
}

.collaborator-one-box h3 {
  color: #fff;
  font-size: 32px;
  font-weight: 600;
  margin-bottom: 5px;
}

.collaborator-one-box p {
  color: #fff;
  font-size: 16px;
  font-weight: 400;
  margin-bottom: 0;
}

.running-box .collaborator-one-box p {
  margin-bottom: 8px;
}

.collaborator-one-box a {
  color: #18c0ff;
  font-size: 18px;
  font-weight: 600;
  text-decoration-line: underline;
}

.collaborator-one-box a:hover {
  color: #fff;
  text-decoration: none;
}

.collaborator-one-box a i {
  transform: rotate(45deg);
  margin-left: 6px;
}

.col-boxx p {
  color: #5bb535;
  font-size: 18px;
  font-weight: 400;
  margin-right: 35px;
  margin-bottom: 0;
}

.w-fit-content {
  width: fit-content;
}

.app-video-box {
  display: flex;
  gap: 15px;
  flex-wrap: wrap;
  margin-bottom: 20px;
}

.top-app-video-thum-width {
  position: relative;
}

.top-app-video-thum-width img {
  height: 170px;
  width: 307px;
  border-radius: 25px;
  border: 1px solid #222;
  object-fit: cover;
}

.top-app-video-thum-width img:hover {
  transition: 0.5s;
  box-shadow: 4px 4px 0px 0px #5bb535;
  border-radius: 25px;
}

.top-app-width img:hover {
  transition: 0.5s;
  box-shadow: 4px 4px 0px 0px #5bb535;
  border-radius: 25px;
}

.top-app-width img {
  height: 170px;
  width: 180px;
  border: 1px solid #222;
  object-fit: cover;
  border-radius: 25px;
}

.top-app-video-thum-width button img {
  width: 40px;
  border: none;
  background-color: transparent;
  height: auto;
  width: auto;
}

.top-app-video-thum-width button {
  border: none;
  background-color: transparent;
  transform: translate(-50%, -50%) !important;
  left: 50% !important;
  top: 50% !important;
  position: absolute !important;
}

.how-we-are-app-dev {
  border-radius: 20px;
  background: #fff;
  padding: 40px 50px;
  margin-bottom: 0;
  border: 1px solid #222;
}

.how-we-are-app-dev:hover {
  box-shadow: 4px 4px 0px 0px #7cd755;
}

.how-app-dev-box-one img {
  margin-bottom: 13px;
}

.how-app-dev-box-one p {
  color: #222;
  font-size: 16px;
  font-weight: 400;
  margin-bottom: 0;
}

.how-app-dev-box {
  align-items: start;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 20px;
}

.core-features {
  border-radius: 20px;
  border: 1px solid #222;
  background: #fff;
}

.core-features:hover {
  box-shadow: 4px 4px 0px 0px #7cd755;
}

.yellow-border {
  background: #7cd755;
  box-shadow: 4px 4px 0px 0px #ed8b00;
}

.case-study-box p {
  color: #222;
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 14px;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.case-study-box img {
  border-radius: 10px;
  height: 165px;
  margin-bottom: 14px;
  object-fit: cover;
  border: 1px solid #5bb535;
  width: 100%;
}

.case-study-box {
  border-radius: 10px;
  background: #fff;
  box-shadow: 4px 4px 0px 0px #5bb535;
  padding: 20px;
  margin-bottom: 24px;
}

.case-study-box:hover {
  transition: 0.6s;
  box-shadow: 4px 4px 0px 0px #ed8b00;
}

.case-study-box:hover img {
  transition: 0.6s;
  transform: scale(1.05);
  border: 1px solid #ed8b00;
}

a.btn.case-study-btn {
  border-radius: 8px;
  background: #222;
  border: 2px solid #222;
  padding: 12px 30px;
  color: #fff;
  font-size: 16px;
  font-weight: 600;
}

a.btn.case-study-btn:hover {
  background: #fff;
  transition: 0.6s;
  border: 2px solid #222;
  color: #222;
  box-shadow: 4px 4px 0px 0px #ed8b00;
}

.founded-container {
  margin-bottom: 45px;
  align-items: start;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 20px;
}

.founded-box h2 {
  color: #fff;
  margin-bottom: 0;
}

.founded-box p {
  color: #7cd755;
  font-size: 16px;
  font-weight: 400;
  margin-bottom: 0;
}

h2.plus-sign::after {
  content: " +";
  display: inline-block;
}

h2.pr-sign::after {
  content: " %";
  display: inline-block;
}

.green-border:hover {
  border-radius: 10px;
  transition: 0.5s;
  box-shadow: 4px 4px 0px 0px #5bb535;
}

.team-three-img img {
  border-radius: 10px;
}

.client-img video {
  height: 250px;
  /* object-fit: cover; */
  border-radius: 30px;
}

.client-img video:hover {
  border-radius: 30px;
  box-shadow: 4px 4px 0px 0px #5bb535;
}

.client-img1 {
  position: relative;
}

.client-img1 video {
  border-radius: 30px;
}

.client-img1 video:hover {
  border-radius: 30px;
  box-shadow: 4px 4px 0px 0px #5bb535;
}

.play-client-icon {
  transform: translate(-50%, -50%) !important;
  top: 50% !important;
  left: 50% !important;
  position: absolute !important;
  z-index: 9999;
}

.play-client-icon i {
  color: #5bb535;
  font-size: 45px;
  cursor: pointer;
}

.play-client-icon.hide {
  display: none;
}

.foot-first {
  display: grid;
  gap: 24px;
  grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
}

.round-footer-img a img,
.round-footer-img button img {
  border-radius: 25px;
}

.shad-orange a img:hover {
  box-shadow: 4px 4px 0px 0px #fdb400;
  transition: 0.5s;
}

.shad-green a img:hover {
  box-shadow: 4px 4px 0px 0px #19befd;
  transition: 0.5s;
}

.shad-blue a img:hover {
  box-shadow: 4px 4px 0px 0px #f82b60;
  transition: 0.5s;
}

.shad-white a img:hover,
.shad-white button img:hover {
  box-shadow: 4px 4px 0px 0px #fff;
  transition: 0.5s;
}

.copyright-footer h2 a {
  color: #fff;
}

.copyright-footer h2 a:hover {
  color: #5bb535;
}

.social-media-image {
  display: grid;
  gap: 20px;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
}

/*.positon-dot{*/
/*  position: relative;*/
/*    text-align: center;*/
/*}*/
/*.dot-design{*/
/*    position:relative;*/
/*        display: inline-block;*/

/*}*/
.section-twoo {
  position: relative;
}

.positon-dot {
  display: flex;
  justify-content: space-around;
  flex-direction: column;
  /* height: 100%; */
  position: absolute;
  right: 0;
  left: 0;
  top: 0;
  bottom: 0;
}

.dot-one {
  display: flex;
  justify-content: space-between;
  margin: 0 100px;
}

.dot-two {
  display: flex;
  justify-content: space-between;
  /*margin: 0 100px;*/
}

.dot-three {
  display: flex;
  justify-content: space-between;
  margin: 0 100px;
}

/*.dot{*/
/*    border-radius:50%;*/
/*    width:25px;*/
/*    border:1px solid #000;*/
/*    height:25px;*/
/*    filter: drop-shadow(4px 4px 0px rgba(0, 0, 0, 0.25));*/
/*}*/
.yellow {
  background: #fdb400;
}

.pink {
  background: #f72b60;
}

.red {
  background: #f72b60;
}

.blue {
  background: #18c0ff;
}

.dot.yellow {
  top: -30px;
  left: calc(50% - 10px);
}

.dot.blue.top-left {
  top: 50px;
  left: -40px;
}

.dot.pink {
  bottom: -30px;
  left: calc(50% - 10px);
}

.dot.yellow.top-right {
  top: -30px;
  right: -40px;
}

.dot.blue {
  bottom: 50px;
  right: -40px;
}

.dot.pink.bottom-right {
  bottom: -30px;
  right: calc(50% - 10px);
}

@media only screen and (max-width: 1280px) {
  .fintech-start-sec p {
    font-size: 16px;
  }

  .fintech-start-sec h5 {
    margin-bottom: 10px;
    font-size: 16px;
  }

  .fintech-start-sec button {
    padding: 10px 20px;
  }

  button.routbtn {
    margin: 5px 5px 0 0;
    padding: 8px 13px;
  }
}

@media only screen and (max-width: 992px) {
  .journeyy li button.nav-link.active {
    font-size: 18px !important;
  }

  .journeyy li button {
    font-size: 18px !important;
  }

  /*.dot {*/
  /*    margin-bottom: 3rem;*/
  /*}*/

  .software-second-sec {
    padding: 60px 0;
  }

  .fintech-start-sec p {
    font-size: 14px;
  }

  .fintech-start-sec h5 {
    margin-bottom: 5px;
    font-size: 14px;
  }

  .fintech-start-sec button {
    font-size: 14px;
  }

  .page-link {
    padding: 8px 14px !important;
  }
}

@media only screen and (max-width: 767px) {
  .together-main-sec h3 {
    font-size: 16px;
  }

  /*.dot {*/
  /*    width: 15px;*/
  /*    height: 15px;*/
  /*    filter: drop-shadow(2px 2px 0px rgba(0, 0, 0, 0.25));*/
  /*    margin-bottom: 3rem;*/
  /*}*/
  .software-dev-sec ul li {
    padding: 0px 0;
  }

  .decades-long h3 span {
    padding: 10px 17px;
  }
}

@media only screen and (max-width: 575px) {
  .testi-text span {
    font-size: 14px;
  }

  .positon-dot {
    padding: 0 1rem;
  }
}

@media only screen and (max-width: 524px) {
  .software-second-sec {
    padding: 38px 0;
  }
}

@media only screen and (max-width: 424px) {
  .page-link {
    padding: 4px 12px !important;
  }

  .soft-pagination li a {
    font-size: 14px;
  }

  .together-main-sec {
    padding: 40px 0 40px;
  }

  .software-second-sec {
    padding: 26px 0;
  }

  .together-main-sec h3 {
    font-size: 14px;
  }
}

/* megamenu */

.megamenu-design {
  background: #ffffff !important;
  border-top: 2px solid #7cd755 !important;
  box-shadow: 0px 2px 37px rgba(0, 0, 0, 0.1) !important;
  border-radius: 10px !important;
  padding-top: 30px !important;
  padding-bottom: 30px !important;
}

.dropdown-menu.megamenu.megamenu-design.show {
  margin-top: -8px;
  box-shadow: 0px 2px 37px rgba(0, 0, 0, 0.1) !important;
}

@media only screen and (min-width: 992px) {
  .dropdown:hover .dropdown-menu {
    display: block;
  }

  .dropdown-menu.show {
    display: flex;
    justify-content: space-between;
  }
}

.navbar .megamenu {
  padding: 1rem;
}

@media all and (min-width: 992px) {
  .navbar .has-megamenu {
    position: static !important;
  }

  .navbar .megamenu {
    left: 0;
    right: 0;
    width: 100%;
    margin-top: 0;
  }
}

@media (max-width: 991px) {

  .navbar.fixed-top .navbar-collapse,
  .navbar.sticky-top .navbar-collapse {
    overflow-y: auto;
    max-height: 90vh;
    margin-top: 10px;
  }
}

.list-unstyled li.square {
  list-style: square;
}

.col-megamenu ul li h6 {
  font-weight: 600;
  font-size: 18px;
  color: #333333;
  margin-bottom: 0;
}

.col-megamenu ul li a {
  font-weight: 400;
  font-size: 16px;
  color: #333333;
  text-decoration: none;
}

.col-megamenu ul li h3 {
  font-weight: 600;
  font-size: 18px;
  color: #333333;
}

.col-megamenu ul li {
  margin-bottom: 15px;
}

.secound-footer {
  padding-top: 10px;
  padding-bottom: 10px;
  background: #101211;
}

.secound-footer p {
  font-weight: 400;
  font-size: 16px;
  color: #ffffff;
  margin-bottom: 0;
  text-align: center;
}

.secound-footer p a {
  color: #7cd755;
  text-decoration: none;
}

/* pill tab css start */
.ecom-side-div ul {
  margin: 0;
  padding: 0 0 1em 0;
  font-weight: bold;
}

.ecom-side-div ul li a {
  padding: 0.5em 1em;
}

.ecom-side-div ul li a:hover,
.tabs ul li a.active {
  background: #7cd755;
  color: #fff !important;
  border-radius: 0;
}

.tabbed-content .item::before {
  cursor: pointer;
  /*font-weight: bold;*/
  background: #00000010;
  padding: 0.5em;
  display: block;
  margin-bottom: 5px;
}

.tabbed-content .item.active::before {
  background: #7cd755;
  color: #fff;
}

@media all and (min-width: 767px) {
  .tabbed-content .item.active .item-content {
    padding-top: 0;
  }

  .tabs-side .tabs li {
    margin-bottom: 2px;
  }
}

/* The project specific CSS starts here This is the minimum CSS that you will need in order for this to work */
.tabbed-content .tabs {
  display: none;
}

.tabbed-content .item {
  min-height: 2em;
}

.tabbed-content .item::before {
  content: attr(data-title);
}

.tabbed-content .item .item-content {
  opacity: 0;
  visibility: hidden;
  height: 0;
}

.tabbed-content .item.active .item-content {
  opacity: 1;
  visibility: visible;
  height: auto;
}

@media all and (min-width: 767px) {
  .tabbed-content .tabs {
    display: block;
  }

  .tabbed-content .tabs li {
    display: inline-block;
  }

  .tabbed-content .tabs li a {
    display: block;
  }

  .tabbed-content .item {
    min-height: 0;
  }

  .tabbed-content .item::before {
    display: none;
  }

  .tabbed-content.tabs-side .tabs {
    /* width: 150px; */
    float: left;
  }

  .tabbed-content.tabs-side .tabs li {
    display: block;
  }

  .tabbed-content.tabs-side .item {
    /* margin-left: 150px; */
  }
}

/* pill tab css end */
/*scroll top button */

/* #scroll {
  position:fixed;
  right:38px;
  bottom:100px;
  cursor:pointer;
  width:50px;
  height:50px;
  background-color:#000000;
  text-indent:-9999px;
  display:none;
  -webkit-border-radius:60px;
  -moz-border-radius:60px;
  border-radius:60px
}
#scroll span {
  position:absolute;
  top:50%;
  left:50%;
  margin-left:-8px;
  margin-top:-12px;
  height:0;
  width:0;
  border:8px solid transparent;
  border-bottom-color:#ffffff;
}
#scroll:hover {
  background-color:#7cd755 !important;
  opacity:1;
  filter:"alpha(opacity=100)";
  -ms-filter:"alpha(opacity=100)";
} */

/*scroll top button end*/

/**active color value for id to direct **/
/* Define the default link color */
.sticky-top .container .header-three a {
  color: #000;
}

/* Define the link color when clicked or focused */
.sticky-top .container .header-three a.clicked {
  color: #5bb535;
  border-bottom: 2px solid;
  border-radius: 0%;
  /* Set your desired click/focus color */
}

/*hightlight scroll to change active id color on page scroll*/
.sticky-top .container .header-three a nav .container ul li {
  display: inline-block;
}

.sticky-top1 {
  z-index: 100000000 !important;
}

nav .container ul li a {
  display: inline-block;
  text-decoration: none;
  /*padding: 10px 20px;*/
  color: black;
}

nav .container ul li a span {
  border-radius: 6px;
  background: #5bb535;
  box-shadow: 1px 1px 0px 0px #ed8b00;
  padding: 4px 6px;
  text-align: center;
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  margin-left: 10px;
  text-transform: uppercase;
}

nav .container ul li.active {
  background-color: crimson;
  transition: 0.3s ease background-color;
}

nav .container ul li.active a {
  color: rgb(255, 255, 255);
}

/*hightlight scroll to change active id color on page scroll endddd*/

.home-first-heading h1 {
  color: #fff;
}

.spl-btn-work-pro {
  display: flex;
  flex-wrap: wrap;
  margin-top: 10px;
}

.spl-btn-work-pro h4 {
  padding: 8px 12px;
  margin-right: 5px;
  border-radius: 6px;
  color: #030303;
  text-align: center;
  font-size: 14px;
  font-weight: 500;
}

.text-bg-red {
  border: 1px solid #f72b60;
  background: #ffe2ea;
}

.text-bg-orange {
  border: 1px solid #ed8b00;
  background: #ffebce;
}

.text-bg-blue {
  border: 1px solid #177fdd;
  background: #eef7ff;
}

.text-bg-green {
  border: 1px solid #7cd755;
  background: #cfffbb;
}

.bg-green {
  background-color: #5bb535;
}

.hire-one {
  width: 80%;
}

/* Blog section  */
.py-44 {
  margin-top: 44px;
  margin-bottom: 44px;
}

.pt-40 {
  padding-top: 40px;
}


.blog-one-bg {
  background: #161815;
}

.blog-two-bg {
  background: #fff;
}

.blog-section {
  border-radius: 50px;
  padding: 80px;
  margin-bottom: 15px;
}

.by-date {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}

.blog-read-more {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}

.date-time-blog p {
  color: #fff;
  text-shadow: 0px -1px 1px rgba(255, 255, 255, 0.01);
  font-size: 16px;
  font-weight: 400;
  margin-bottom: 10px;
  margin-top: 10px;
}

.date-time-blog p a {
  color: #fff;
  text-shadow: 0px -1px 1px rgba(255, 255, 255, 0.01);
  font-size: 16px;
  font-weight: 400;
  margin-bottom: 10px;
  margin-top: 10px;
  text-decoration: none;
}

.date-time-blog p a:hover {
  color: #5bb535;
}

.date-time-blog {
  margin-right: 40px;
}

.date-time-blog p i {
  margin-right: 4px;
}

.date-time-blog p span {
  font-weight: 700;
}

.read-more-btn a {
  text-decoration: underline;
}

.four-dot span {
  width: 15px;
  height: 15px;
  border-radius: 50%;
  margin-right: 2px;
  display: inline-block;
}

span.blog-dot-one {
  background-color: #222222;
}

span.blog-dot-two {
  background-color: #f72b60;
}

span.blog-dot-three {
  background-color: #18c0ff;
}

span.blog-dot-four {
  background-color: #fdb400;
}

.read-more-btn a i {
  margin-left: 6px;
}

.blog-two-color h1 {
  color: #222;
}

.blog-two-color p a {
  color: #222;
}

.blog-two-color p {
  color: #222;
}

.blog-detail-section {
  box-shadow: 10px 10px 0px 0px #5bb535;
}

.blog-detail-img {
  margin-bottom: 35px;
}

.blog-detail-text h5 {
  color: #5bb535;
  font-size: 18px;
  font-weight: 700;
  text-decoration-line: underline;
  margin-bottom: 10px;
}

.section-teb p span a {
  color: #5bb535;
  font-size: 18px;
  font-weight: 600;
  line-height: 32.04px;
  text-decoration-line: underline;
  text-transform: none;
  display: inline;
  margin-bottom: 0;
  margin-top: 0;
}

.blog-detail-text p {
  text-decoration: underline;
}

.read-top-right {
  display: flex;
  align-items: center;
  margin-top: 5px;
  margin-bottom: 5px;
}

.read-top-left {
  display: flex;
  align-items: center;
  justify-content: end;
  margin-top: 5px;
  margin-bottom: 5px;
}

.read-top-arrow {
  border-radius: 10px;
  background: #222;
  width: 100%;
  max-width: 70px;
  height: 70px;
  color: #7cd755;
  font-size: 20px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-right: 14px;
  text-decoration: none;
}

.read-top-arrow-left {
  border-radius: 10px;
  background: #222;
  width: 100%;
  max-width: 70px;
  height: 70px;
  color: #7cd755;
  font-size: 20px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-left: 14px;
  text-decoration: none;
}

.read-top-arrow:hover {
  color: #fff;
}

.read-top-arrow-left:hover {
  color: #fff;
}

.read-top-right p {
  color: #fff;
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 0;
}

.read-top-left p {
  color: #fff;
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 0;
  text-align: end;
}

.company-in-india {
  border-radius: 15px;
  border: 1px solid #7cd755;
  background: #000;
  padding: 45px 35px;
}

.in-this-article {
  background-color: #fff;
  border-radius: 10px;
  padding: 25px;
  box-shadow: 0px -2px 0px #fcb401, 0px -4px 0px #19befd, 0px -6px 0px #f82b60;
  position: sticky;
  top: 100px;
}

.in-this-article h4 {
  color: #ddd;
  font-size: 18px;
  font-weight: 600;
}

.in-this-article hr {
  background-color: #dddddd !important;
  margin-top: 0 !important;
}

.article-link ol {
  padding-left: 0rem;
  margin-bottom: 0;
}

.article-link ol li {
  margin-bottom: 10px;
  list-style: none;
}

.article-link ol li::marker {
  color: rgba(59, 60, 61, 0.8);
  font-size: 18px;
  font-weight: 700;
}

.article-link ol li a {
  color: rgba(59, 60, 61, 0.8);
  font-size: 18px;
  font-weight: 700;
  text-decoration: none;
}

.article-link ol li a:hover {
  color: #5bb535;
}

.all-article-text p a {
  display: inline;
  color: #5bb535;
  margin: 0;
  text-transform: none;
  text-decoration-line: underline;
  font-size: 18px;
}

.all-article-text h3 {
  color: #105cb5;
  font-size: 20px;
  font-weight: 700;
}

.all-article-text h5 {
  color: #222;
  font-size: 28px;
  font-weight: 400;
  border-radius: 10px;
  background: #e8ffde;
  padding: 40px;
  margin-bottom: 20px;
}

.green-army p {
  color: #fff;
  font-size: 20px;
  font-weight: 600;
}

.green-army p img {
  width: 30px;
}

.lets-help-blog {
  border-radius: 20px;
  background: #fff;
  padding: 70px 100px;
  text-align: center !important;
}

.lets-help-blog h2.new-size {
  text-align: center !important;
}

.lets-btn a.btn.btn-call {
  color: #177fdd;
  font-size: 15px;
  font-weight: 500;
  border-radius: 4px;
  border: 1px solid #177fdd;
  background: #fff;
  padding: 13px;
  letter-spacing: 0.5px;
}

.lets-btn a.btn.btn-call:hover {
  color: #fff;
  border: 1px solid #177fdd;
  background: #177fdd;
  box-shadow: 4px 4px 0px 0px #000;
}

.btn-check:focus+.btn,
.btn:focus {
  outline: 0;
  box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0) !important;
}

.lets-btn a.btn.btn-share {
  color: #5bb535;
  font-size: 15px;
  font-weight: 500;
  border-radius: 4px;
  border: 1px solid #5bb535;
  background: #fff;
  padding: 13px;
  letter-spacing: 0.5px;
}

.lets-btn a.btn.btn-share:hover {
  color: #fff;
  border: 1px solid #5bb535;
  background: #5bb535;
  box-shadow: 4px 4px 0px 0px #000;
}

.all-article-text hr {
  margin-bottom: 20px !important;
}

.mechodal-pill {
  display: flex;
  justify-content: center;
}

.mech-pills .nav-link {
  padding: 10px 30px 10px 30px !important;
  color: #797a7d !important;
  background-color: #ffffff !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  border-style: solid !important;
  border-width: 1px 1px 1px 1px !important;
  border-color: #ffffff !important;
  border-radius: 10px 10px 10px 10px !important;
}

.mech-pills .nav-link:hover {
  box-shadow: 4px 4px 0px 0px #7cd755 !important;
  border: 1px solid #000 !important;
}

.mech-pills .nav-link.active,
.mech-pills .show>.nav-link {
  border-radius: 10px !important;
  color: #797a7d !important;
  border: 1px solid #000 !important;
  background: #fff !important;
  box-shadow: 4px 4px 0px 0px #7cd755 !important;
}

.scroll-to-exp h3 {
  color: #7cd755;
  text-align: center;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  margin-bottom: 0%;
}

.ifrem-height {
  height: 540px !important;
  border-radius: 20px;
}

.video-play-btn {
  position: relative;
}

.wrapper {
  display: inline-block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 9;
}

.video-main {
  position: relative;
  display: inline-block;
}

@keyframes waves {
  0% {
    -webkit-transform: scale(0.2, 0.2);
    transform: scale(0.2, 0.2);
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  }

  50% {
    opacity: 0.9;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
  }

  100% {
    -webkit-transform: scale(0.9, 0.9);
    transform: scale(0.9, 0.9);
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  }
}

.fa-play:before {
  content: "\f04b";
}

.video {
  height: 50px;
  width: 50px;
  line-height: 50px;
  text-align: center;
  border-radius: 100%;
  background: transparent;
  color: #232325;
  background: #7cd755;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
}

.waves {
  position: absolute;
  width: 150px;
  height: 150px;
  background: #7cd755;
  opacity: 0;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  border-radius: 100%;
  right: -50px;
  bottom: -50px;
  z-index: -1;
  -webkit-animation: waves 3s ease-in-out infinite;
  animation: waves 3s ease-in-out infinite;
}

.video:hover {
  color: #fff;
}

.wave-1 {
  -webkit-animation-delay: 0s;
  animation-delay: 0s;
}

.wave-2 {
  -webkit-animation-delay: 1s;
  animation-delay: 1s;
}

.wave-3 {
  -webkit-animation-delay: 2s;
  animation-delay: 2s;
}

.videoCoverImage {
  border-right: 9px solid #7cd755;
  border-bottom: 9px solid #7cd755;
  border-radius: 20px;
  width: -webkit-fill-available;
}

img.thumb.img-fluid {
  /*border-right: 9px solid #FFCD02;*/
  /*border-bottom: 9px solid #FFCD02;*/
  border-radius: 14px;
  width: fit-content;
  height: 475px;
}

span.bg-small {
  background: rgba(118, 200, 237, 0.2) !important;
}

.award-image-to img {
  height: 85px;
  margin-top: 50px !important;
}

.award-image img:hover {
  border-right: 5px solid #7cd755;
  border-bottom: 5px solid #7cd755;
  border-radius: 10px;
}

.section-too h2 {
  color: #212529;
  text-align: center;
  font-size: 18px;
  font-weight: 400;
}

.all-in-one {
  border-radius: 20px;
  border: 1px solid #7cd755;
  background: #fff;
  padding: 32px;
  height: 100%;
}

a {
  text-decoration: none !important;
}

.all-in-one:hover {
  border-radius: 20px;
  box-shadow: 4px 4px 0px 0px #5bb535;
}

.all-in-one:hover .custome-heading h3 {
  text-decoration: underline;
  color: #5bb535;
}

.all-in-one:hover .custome-heading h3 i {
  visibility: visible;
}

.custome-heading h3 {
  color: #130104;
  font-weight: 600;
  margin-bottom: 10px;
  text-decoration: none;
}

.custome-heading h3 i {
  transform: rotate(-45deg);
  visibility: hidden;
  margin-left: 10px;
}

.custome-heading p {
  color: #525252;
  font-size: 16px;
  font-weight: 400;
}

.all-in-two {
  border: 1px solid #fdb400;
}

.all-in-two:hover {
  border-radius: 20px;
  box-shadow: 4px 4px 0px 0px #fdb400;
}

.all-in-two:hover .custome-heading h3 {
  text-decoration: underline;
  color: #fdb400;
}

.all-in-three {
  border: 1px solid #19befd;
}

.all-in-three:hover {
  border-radius: 20px;
  box-shadow: 4px 4px 0px 0px #19befd;
}

.all-in-three:hover .custome-heading h3 {
  text-decoration: underline;
  color: #19befd;
}

.all-in-four {
  border: 1px solid #f82b60;
}

.all-in-four:hover {
  border-radius: 20px;
  box-shadow: 4px 4px 0px 0px #f82b60;
}

.all-in-four:hover .custome-heading h3 {
  text-decoration: underline;
  color: #f82b60;
}

.mechodal-main {
  background-color: #fff;
  border: 1px solid #cccccc;
  border-radius: 14px;
}

.mechodal-img {
  padding: 20px;
  display: flex;
  justify-content: space-between;
}

.custome-heading {
  padding: 20px;
}

.all0in-oo {
  border-radius: 20px;
  border: 1px solid #7cd755;
  background: #fff;
  padding: 30px;
}

.all0in-oo:hover {
  border-radius: 20px;
  box-shadow: 4px 4px 0px 0px #5bb535;
}

.all0in-oo:hover .custome-heading h3 {
  text-decoration: underline;
  color: #5bb535;
}

.all0in-oo:hover .custome-heading h3 i {
  visibility: visible;
}

.custome-heading h4 {
  border-radius: 10px;
  border: 0.5px solid #caffb4;
  background: #f7fff3;
  padding: 6px 30px;
  color: #525252;
  font-size: 16px;
  font-weight: 400;
  margin-right: 10px;
}

.owl-item .item {
  transform: translate3d(0, 0, 0);
  /* DO NOT REMEMBER WHERE TU PUT THIS, SEARCH FOR 3D ACCELERATION */
}

.screenshot_slider {
  display: flex;
}

/* .screenshot_slider .owl-item .item img {
   -webkit-transition: 0.3s;
   -webkit-box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.1);
   box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.1);
   -o-transition: 0.3s;
   transition: 0.3s;
   -webkit-transform: scale(0.80);
   -ms-transform: scale(0.80);
   transform: scale(0.80);
}

.screenshot_slider .owl-item.center .item img {
   -webkit-transform: scale(1.15);
   -ms-transform: scale(1.15);
   transform: scale(1.15);
}

.screenshot_slider .owl-nav {
   text-align: center;
}

.screenshot_slider .owl-nav button {
  font-size: 24px !important;
  margin: 10px;
  color: #033aff !important;
} */
.btn.btn-talking:focus {
  box-shadow: none;
}

.btn.btn-talking:hover {
  color: #000000;
  background: #fff;
  box-shadow: 4px 4px 0px 0px #5bb535;
}

.btn.btn-talking {
  margin-top: 35px;
  border-radius: 8px;
  background: #5bb535;
  color: #fff;
  box-shadow: 4px 4px 0px 0px #000;
  padding: 12px 30px;
  text-align: center;
  font-size: 16px;
  width: max-content;
  font-style: normal;
  font-weight: 600;
}

.btn.btn-talking-tow:focus {
  box-shadow: none;
}

.btn.btn-talking-tow:hover {
  color: #fff;
  background: #5bb535;
  box-shadow: 4px 4px 0px 0px #fff;
}

.btn.btn-talking-tow {
  margin-top: 35px;
  border-radius: 8px;
  background: #fff;
  box-shadow: 4px 4px 0px 0px #000;
  padding: 12px 30px;
  color: #000;
  text-align: center;
  font-size: 16px;
  width: max-content;
  font-style: normal;
  font-weight: 600;
}

.btn-talking-tow i {
  transform: rotate(45deg);
}

.btn-talking-tow1 i {
  transform: rotate(0deg);
}

.fa-arrow-icon i {
  transform: rotate(45deg);
}

.solution-boxx img {
  margin-bottom: 10px;
}

.solution-boxx p {
  color: #fff;
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 10px;
}

.solution-boxx h3 {
  color: #fff;
  font-size: 16px;
  font-weight: 400;
  margin-bottom: 50px;
}

.solution-boxx h3 a {
  color: #7cd755;
  border-bottom: 1px solid #5bb535;
}

.e-learn-g {
  padding: 40px;
  height: 100%;
}

.oragnge-mech {
  border-radius: 20px;
  border: 1px solid #222;
  background: #fff;
}

.blue-mech {
  border-radius: 20px;
  border: 1px solid #222;
  background: #fff;
}

.pink-mech {
  border-radius: 20px;
  border: 1px solid #222;
  background: #fff;
}

.green-mech {
  border-radius: 20px;
  border: 1px solid #222;
  background: #fff;
}

.oragnge-mech:hover {
  box-shadow: 4px 4px 0px 0px #fdb400;
}

.blue-mech:hover {
  border-radius: 20px;
  border: 1px solid #222;
  background: #fff;
  box-shadow: 4px 4px 0px 0px #19befd;
}

.blue-mech:hover {
  border-radius: 20px;
  border: 1px solid #222;
  background: #fff;
  box-shadow: 4px 4px 0px 0px #19befd;
}

.blue-mech:hover {
  border-radius: 20px;
  border: 1px solid #222;
  background: #fff;
  box-shadow: 4px 4px 0px 0px #19befd;
}

.blue-mech:hover {
  border-radius: 20px;
  border: 1px solid #222;
  background: #fff;
  box-shadow: 4px 4px 0px 0px #19befd;
}

.pink-mech:hover {
  border-radius: 20px;
  border: 1px solid #222;
  background: #fff;
  box-shadow: 4px 4px 0px 0px #e6a19b;
}

.pink-mech:hover {
  border-radius: 20px;
  border: 1px solid #222;
  background: #fff;
  box-shadow: 4px 4px 0px 0px #e6a19b;
}

.pink-mech:hover {
  border-radius: 20px;
  border: 1px solid #222;
  background: #fff;
  box-shadow: 4px 4px 0px 0px #e6a19b;
}

.pink-mech:hover {
  border-radius: 20px;
  border: 1px solid #222;
  background: #fff;
  box-shadow: 4px 4px 0px 0px #e6a19b;
}

.green-mech:hover {
  border-radius: 20px;
  border: 1px solid #222;
  background: #fff;
  box-shadow: 4px 4px 0px 0px #7cd755;
}

.green-mech:hover {
  border-radius: 20px;
  border: 1px solid #222;
  background: #fff;
  box-shadow: 4px 4px 0px 0px #7cd755;
}

.green-mech:hover {
  border-radius: 20px;
  border: 1px solid #222;
  background: #fff;
  box-shadow: 4px 4px 0px 0px #7cd755;
}

.green-mech:hover {
  border-radius: 20px;
  border: 1px solid #222;
  background: #fff;
  box-shadow: 4px 4px 0px 0px #7cd755;
}

.view-all-content a {
  color: #222;
  font-size: 18px;
  font-style: normal;
  font-weight: 600;
  text-decoration-line: underline;
}

.view-all-content a:hover {
  color: #222;
}

.col-boxx {
  border-radius: 20px;
  border: 1px solid #5bb535;
  background: #fff;
  padding: 35px;
  margin-bottom: 15px;
  display: flex;
  align-items: center;
}

.col-boxx:hover {
  box-shadow: 4px 4px 0px 0px #7cd755;
}

.col-boxx h3 {
  color: #130104;
  font-size: 22px;
  font-style: normal;
  font-weight: 600;
  margin-bottom: 0%;
}

.let-us-help {
  border-radius: 20px;
  background: #fff;
  padding: 76px;
  margin-bottom: 50px;
}

.let-us-help h3 {
  color: #202124;
  text-align: center;
  font-size: 60px;
  font-weight: 600;
  margin-bottom: 12px;
}

.let-us-help p {
  color: #202124;
  text-align: center;
  font-size: 18px;
  font-weight: 400;
}

.btn.btn-number {
  border-radius: 4px;
  border: 1px solid #177fdd;
  background: #fff;
  color: #177fdd;
  text-align: center;
  font-size: 14.875px;
  font-style: normal;
  font-weight: 600;
  letter-spacing: 0.5px;
}

.greemt {
  border: 1px solid #5bb535 !important;
  color: #5bb535 !important;
}

.social-media-links h3 {
  color: #222;
  text-align: center;
  font-size: 16px;
  font-weight: 400;
  margin-bottom: 20px;
}

.social-media-links a {
  color: #888888;
  text-align: center;
  font-size: 32px;
  padding: 10px;
  font-style: normal;
  font-weight: 700;
  text-decoration: none;
  transition: all 0.4s ease;
  display: inline-block;
}

.social-media-links a:nth-child(1) {
  color: #888888;
}

.social-media-links a:nth-child(2) {
  color: #888888;
}

.social-media-links a:nth-child(3) {
  color: #888888;
}

.social-media-links a:nth-child(4) {
  color: #888888;
}

.social-media-links a:nth-child(5) {
  color: #888888;
}

.social-media-links a:nth-child(1):hover {
  color: #105cb5;
  transform: scale(1.15);
}

.social-media-links a:nth-child(2):hover {
  background: linear-gradient(90deg,
      #6e10ff 0%,
      #ff00df 28.5%,
      #ff1029 56%,
      #ff7300 81.5%,
      #f00 100%) !important;
  background-clip: text !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  transform: scale(1.15);
}

.social-media-links a:nth-child(3):hover {
  color: #4285f4;
  transform: scale(1.15);
}

.social-media-links a:nth-child(4):hover {
  color: #ff4f32;
  transform: scale(1.15);
}

.social-media-links a:nth-child(5):hover {
  color: #0033a1;
  transform: scale(1.15);
}

.bg-footer {
  background: #161815;
  padding-top: 35px;
}

.footer-black-box {
  border-radius: 6px;
  background: #101211;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
}

.ex-footer {
  border-radius: 10px 10px 0px 0px;
  background: #101211;
  display: flex;
  align-items: start;
  padding: 30px;
  height: 100%;
}

.ex-footer h5,
.solutions-tow h5 {
  color: #5bb535;
  font-size: 18px;
  font-style: normal;
  font-weight: 600;
  line-height: 24.96px;
  /* 138.667% */
}

.location-set iframe {
  border-radius: 10px;
}

.footer-all-link {
  border-radius: 6px;
  padding: 45px;
  background: #101211;
}

.link-design {
  display: flex;
  flex-direction: column;
}

.link-design a {
  color: #fff;
  font-size: 16px;
  font-weight: 400;
  text-decoration: none;
  margin-bottom: 12px;
  border-bottom: 1px solid transparent;
}

.link-design a:hover {
  color: #7cd755;
  border-bottom: 1px solid #5bb535;
  width: fit-content;
}

.link-design a span {
  border-radius: 6px;
  background: #5bb535;
  box-shadow: 1px 1px 0px 0px #ed8b00;
  padding: 4px 6px;
  text-align: center;
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  margin-left: 10px;
  text-transform: uppercase;
}

.copyright-footer {
  padding: 40px 0px;
  border-bottom: 5px solid #7cd755;
}

.copyright-footer {
  background-image: url(../image/footer-end.svg);
  background-repeat: no-repeat;
  background-position: right bottom;
}

.copyright-footer h2 {
  color: #fff;
  font-size: 28px;
  font-weight: 600;
  margin-bottom: 0%;
}

.img.thumbb.img-fluid {
  height: 260px !important;
}

h2.new-size {
  font-size: 60px;
}

h3.new-size {
  font-size: 32px;
}

ul.hover-link li a:hover {
  background-color: #f7fff3;
}

.col-megamenu ul li .header-about-link a {
  font-size: 18px;
  font-weight: 600;
  color: #5bb535;
  border-bottom: 2px solid #fff;
}

.col-megamenu ul li .header-about-link a:hover {
  border-bottom: 2px solid #5bb535;
}

.col-megamenu ul li .header-about-link a i {
  transform: rotate(-45deg);
  visibility: hidden;
  margin-left: 5px;
}

.col-megamenu ul li .header-about-link a:hover i {
  visibility: visible;
}

.col-megamenu ul li .header-contact-link a {
  font-size: 18px;
  font-weight: 600;
  color: #fdb400;
  border-bottom: 2px solid #fff;
}

.col-megamenu ul li .header-contact-link a:hover {
  border-bottom: 2px solid #fdb400;
}

.col-megamenu ul li .header-contact-link a i {
  transform: rotate(-45deg);
  visibility: hidden;
  margin-left: 5px;
}

.col-megamenu ul li .header-contact-link a:hover i {
  visibility: visible;
}

.col-megamenu ul li .header-contact-blue-link a,
.col-megamenu ul li .header-contact-blue-link button {
  font-size: 18px;
  font-weight: 600;
  color: #19befd;
  border-bottom: 2px solid #fff;
}

.col-megamenu ul li .header-contact-blue-link a:hover,
.col-megamenu ul li .header-contact-blue-link button:hover {
  border-bottom: 2px solid #19befd;
}

.col-megamenu ul li .header-contact-blue-link a i,
.col-megamenu ul li .header-contact-blue-link button i {
  transform: rotate(-45deg);
  visibility: hidden;
  margin-left: 5px;
}

.col-megamenu ul li .header-contact-blue-link a:hover i,
.col-megamenu ul li .header-contact-blue-link button:hover i {
  visibility: visible;
}

.col-megamenu ul li .header-contact-red-link a,
.col-megamenu ul li .header-contact-red-link button {
  font-size: 18px;
  font-weight: 600;
  color: #f82b60;
  border-bottom: 2px solid #fff;
}

.col-megamenu ul li .header-contact-red-link a:hover,
.col-megamenu ul li .header-contact-red-link button:hover {
  border-bottom: 2px solid #f82b60;
}

.col-megamenu ul li .header-contact-red-link a i,
.col-megamenu ul li .header-contact-red-link button i {
  transform: rotate(-45deg);
  visibility: hidden;
  margin-left: 5px;
}

.col-megamenu ul li .header-contact-red-link a:hover i,
.col-megamenu ul li .header-contact-red-link button:hover i {
  visibility: visible;
}

.apply-mech-to.btn i {
  line-height: none;
}

.apply-mech-to.btn {
  border-radius: 6px;
  align-items: center;
  margin-top: 30px;
  background: #fdb400;
  box-shadow: 4px 4px 0px 0px #222;
  color: #222;
  padding: 12px 30px;
  text-align: center;
  font-size: 16px;
  font-weight: 600;
  width: fit-content !important;
  display: flex;
  justify-content: start;
}

.apply-mech-to.btn:hover {
  background: #222;
  box-shadow: 4px 4px 0px 0px #fdb400;
  color: #fff;
  transition: 0.3s;
}

.hiring-text p {
  color: #212529;
}

.w-400 ul li {
  font-weight: 400 !important;
}

.work-portfolio-heading h1 {
  color: white;
  font-size: 45px;
  font-weight: 700;
}

.portfolio-header-icon {
  text-align: center;
  display: flex;
  justify-self: center;
  margin-top: 70px;
}

.portfolio-header-icon i {
  color: #7cd755;
  font-size: 20px;
}

.portfolio-pills .nav-link {
  padding: 10px 30px 10px 30px !important;
  color: #797a7d !important;
  /* background-color: #ffffff !important; */
  font-size: 18px !important;
  font-weight: 600 !important;
  border-style: solid !important;
  border-width: 1px 1px 1px 1px !important;
  border-color: #000 !important;
  border-radius: 10px 10px 10px 10px !important;
  background: #fff !important;
  box-shadow: 4px 4px 0px 0px #7cd755 !important;
  margin-bottom: 20px;
}

.portfolio-pills .nav-link:hover {
  border-radius: 10px !important;
  color: #fff !important;
  border: 1px solid #000 !important;
  background: #000 !important;
  box-shadow: 4px 4px 0px 0px #7cd755 !important;
}

.portfolio-pills .nav-link.active,
.portfolio-pills .show>.nav-link {
  border-radius: 10px !important;
  color: #fff !important;
  border: 1px solid #000 !important;
  background: #000 !important;
  box-shadow: 4px 4px 0px 0px #7cd755 !important;
}

.work-portfolio-img img {
  border-radius: 10px 10px 0 0;
}

.portfolio-laug-button {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}

.portfolio-laug-button span:first-child {
  color: white;
  font-size: 14px;
  font-weight: 600;
  background: #5bb535;
  display: block;
  padding: 4px 20px;
  border-radius: 5px;
  border: 1px solid #5bb535;
}

.portfolio-laug-button span:nth-child(2),
.portfolio-laug-button span:nth-child(3) {
  color: #000;
  font-size: 14px;
  font-weight: 600;
  background: transparent;
  display: block;
  padding: 4px 15px;
  border-radius: 5px;
  border: 1px solid #5bb535;
}

.portfolio-laug-button span:hover {
  color: white;
  background: #5bb535;
  cursor: pointer;
}

.portfolio-padding-content {
  padding: 20px 20px;
}

.portfolio-content h2 {
  color: #030303;
  font-size: 20px;
  font-weight: 700;
  margin-bottom: 10px;
}

.portfolio-content p {
  color: #030303;
  font-size: 16px;
  font-weight: 400;
  margin-bottom: 10px;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.portfolio-content a {
  color: #5bb535;
  font-size: 16px;
  font-weight: 500;
}

.portfolio-content a:hover {
  color: #5bb535;
}

.work-portfolio-cart {
  border-radius: 10px;
  background: white;
  box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.05);
  height: 100%;
}

.big-project-cart {
  background: white;
  box-shadow: 3px 4px 0px #7cd755;
  overflow: hidden;
  border-radius: 10px;
  outline: 1px black solid;
  outline-offset: -1px;
  height: 100%;
  padding: 40px;
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: center;
  text-align: center;
}

.big-project-cart h4 {
  color: black;
  font-size: 25px;
  font-weight: 600;
  margin-bottom: 10px;
  text-shadow: 5px 4px 4px rgba(255, 255, 255, 0.1);
  line-height: 37.5px;
}

.big-project-cart span {
  color: #5bb535;
}

.big-project-cart a {
  color: #5bb535;
  font-size: 18px;
  font-weight: 500;
  text-decoration: underline !important;
  word-wrap: break-word;
}

.big-project-cart a:hover {
  color: #5bb535;
}

/* --------------------------------- work - portfolio - Details section --------------------------------- */
.py-60 {
  padding-top: 60px;
  padding-bottom: 60px;
}

.bg-link-details {
  background: #ffffff;
  padding: 30px 0;
}

.link-details a {
  color: #323232;
  font-size: 16px;
  font-weight: 400;
}

.link-details a:hover {
  color: #323232;
}

.link-details span {
  color: #5bb535;
  font-size: 16px;
  font-weight: 500;
}

.portfolio-details h2 {
  color: #222222;
  font-size: 57px;
  font-weight: 700;
  line-height: 66px;
  margin-bottom: 40px;
}

.portfolio-details h2 span {
  color: #5bb535;
}

.portfolio-details a {
  color: white;
  font-size: 18px;
  font-weight: 400;
  background-color: #222222;
  padding: 10px 20px;
  border-radius: 8px;
  border: 1px solid #222222;
}

.portfolio-details a i {
  margin-left: 5px;
  transform: rotate(-40deg);
}

.portfolio-details a:hover {
  background-color: transparent;
  color: #000;
  transition: 0.3s;
  border: 1px solid #222222;
}

.bg-about-roomdo {
  background: #fff;
}

.portfolio-details-content h3 {
  color: #222222;
  font-size: 32px;
  font-weight: 700;
  margin-bottom: 2px;
}

.portfolio-details-content p {
  color: #222222;
  font-size: 16px;
  font-weight: 400;
  margin-bottom: 15px;
  line-height: 26.46px;
}

.border-overview {
  width: 40px;
  height: 3px;
  background: #ed8b00;
  margin-bottom: 20px;
}

.border-overview1 {
  width: 40px;
  height: 3px;
  background: #ed8b00;
  margin-bottom: 20px;
  display: flex;
  justify-content: center;
}

.roomdo-content {
  display: flex;
  align-items: center;
  flex-direction: column;
  gap: 10px;
}

.portfolio-challenges-content p {
  color: #3b3c3d;
  font-size: 16px;
  font-weight: 400;
  line-height: 20px;
}

.portfolio-challenges-content ul {
  list-style-type: none;
  padding: 0;
  margin-top: 20px;
}

.portfolio-challenges-content ul h4 {
  color: #3b3c3d;
  font-size: 16px;
  font-weight: 700;
  line-height: 26.46px;
  margin-bottom: 5px;
}

.portfolio-challenges-content ul li p {
  color: #3b3c3d;
  font-size: 16px;
  font-weight: 400;
  margin-bottom: 15px !important;
}

.Expertise-icon {
  width: 100px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fafafa;
  padding: 10px 0;
  border-radius: 8px;
}

.Expertise-icon img {
  height: 35px;
  width: auto;
}

.Expertise-icon-flex {
  display: flex;
  align-items: center;
  gap: 15px;
  margin-top: 20px;
  flex-wrap: wrap;
}

.bg-director-words {
  background: #222222;
}

.portfolio-director-content h3 {
  color: #ffffff;
}

.director-img img {
  border-radius: 10px;
  height: 300px;
}

.director-content h3 {
  color: white;
  font-size: 28px;
  font-weight: 700;
  margin-bottom: 20px;
}

.client-img {
  height: 60px;
  width: 60px;
  background-color: #d9d9d9;
  border-radius: 100%;
  padding: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.client-img img {
  height: 40px;
  width: 40px;
  /* border-radius: 100%; */
}

.director-name h5 {
  color: #5bb535;
  font-size: 18px;
  font-weight: 600;
  line-height: 24.96px;
  margin-bottom: 0px;
}

.director-name p {
  color: white;
  font-size: 16px;
  font-weight: 400;
  margin-bottom: 0;
}

.client-flex {
  display: flex;
  align-items: center;
  gap: 15px;
  margin-bottom: 20px;
}

.client-flex1 {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 20px;
  flex-direction: column;
}

.client-logo img {
  height: 50px;
  width: auto;
}

.work-showcase-carousel .item {
  margin-right: 10px;
}

.work-showcase-carousel .item img {
  width: auto;
  height: auto;
  border-radius: 15px !important;
  border: 1px solid #222222;
}

.portfolio-details-content p:last-child {
  margin-bottom: 0;
}

.owl-carousel .owl-stage-outer {
  padding: 0 10px;
}

.romdo-app-img img {
  height: 400px;
}

.baner-flex {
  display: flex;
  align-items: center;
}

.col-megamenu1 {
  display: flex;
  align-items: center;
  gap: 30px;
  flex-wrap: wrap;
}

.btn-home-consultation {
  background: #5bb535;
  box-shadow: 4px 4px 0px black;
  border-radius: 8px;
  outline: 1px rgba(0, 0, 0, 0) solid;
  outline-offset: -1px;
  color: white;
  font-size: 16px;
  /* font-family: Montserrat; */
  font-weight: 600;
  line-height: 24px;
  padding: 14px;
  border: transparent;
}

.btn-home-consultation:hover {
  background: transparent;
  box-shadow: 4px 4px 0px #5bb535;
  outline: 1px #5bb535 solid;
  color: #5bb535;
}

.btn-home-Services {
  background: #fff;
  box-shadow: 4px 4px 0px black;
  border-radius: 8px;
  outline: 1px black solid;
  outline-offset: -1px;
  color: black;
  font-size: 16px;
  /* font-family: Montserrat; */
  font-weight: 600;
  line-height: 24px;
  padding: 14px;
  border: transparent;
}

.btn-home-Services:hover {
  background: transparent;
  box-shadow: 4px 4px 0px #5bb535;
  outline: 1px #5bb535 solid;
  color: #5bb535;
}

.typed-cursor {
  display: none;
}

.typed-wrapper {
  display: inline-block;
  position: relative;
}

#type-rotate {
  display: inline-block;
  white-space: nowrap;
  width: 300px;
  text-align: start;
}

.fixed-text {
  display: inline-block;
  white-space: nowrap;
  margin-left: 5px;
  /* small space */
}

.btn-home-Services i {
  transform: rotate(-40deg);
  margin-left: 5px;
}

.home-setion-1-btn {
  display: flex;
  align-items: center;
  gap: 20px;
  justify-content: center;
  margin-bottom: 35px;
}

.heading-auto-text h3 {
  color: white;
  font-size: 32px;
  /* font-family: Montserrat; */
  font-weight: 700;
  line-height: 38.4px;
  margin-bottom: 0;
  text-align: center;
}

.py-20 {
  padding-top: 20px;
  padding-bottom: 20px;
}

.py-50 {
  margin-top: 50px;
  margin-bottom: 50px;
}

.heading-auto-text-bg {
  background-color: #161815;
}

.new-size-p {
  color: #212529;
  font-size: 18px;
  /* font-family: Montserrat; */
  font-weight: 400;
  line-height: 25.2px;
  margin-bottom: 0;
}

.service-home-text h5 {
  color: white;
  font-size: 16px;
  font-weight: 700;
  line-height: 24px;
  margin-bottom: 10px;
}

.service-home-text ul {
  color: white;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  padding-left: 15px;
  margin-bottom: 30px;
}

.btn-free-consultation {
  background: #5bb535;
  box-shadow: 4px 4px 0px white;
  border-radius: 8px;
  outline: 1px white solid;
  outline-offset: -1px;
  color: #fff;
  font-size: 16px;
  /* font-family: Montserrat; */
  font-weight: 600;
  line-height: 24px;
  padding: 14px;
  border: transparent;
}

.btn-free-consultation:hover {
  background: transparent;
  box-shadow: 4px 4px 0px #5bb535;
  outline: 1px #5bb535 solid;
  color: #5bb535;
}

.img-ai-implementation img {
  border-radius: 10px;
}

.img-ai-implementation {
  position: relative;
  overflow: hidden;
  display: inline-block;
}

.img-ai-implementation img {
  width: 100%;
  display: block;
  object-fit: cover;
  filter: grayscale(100%);
  transition: filter 0.4s ease, transform 0.4s ease;
  border-radius: 15px !important;
}

/* Color Overlay */
.img-ai-implementation::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  opacity: 0.4;
  transition: 0.4s ease-in-out;
  mix-blend-mode: overlay;
}

/* Hover effect - Remove filter & overlay */
.img-ai-implementation:hover img {
  filter: none;
}

.img-ai-implementation:hover::before {
  opacity: 0;
}

.about-home-tems {
  color: #212529;
  font-size: 18px;
  font-weight: 700;
  line-height: 25.2px;
  margin-bottom: 5px;
}

.stats-collage {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  grid-auto-rows: 110px;
  gap: 18px;
}

/* BOX STYLE */
.box {
  background: #fff;
  border: 1px solid #c9e6c1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  color: #222222;
  font-size: 32px;
  font-weight: 400;
  line-height: 30px;
  width: 100%;
}

.box span {
  color: #222222;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  margin-top: 6px;
}

/* DARK LEFT BOX */
.dark {
  background: #1c1c1c;
  color: #fff;
  border: none;
}

.dark h2 {
  font-size: 32px;
  font-weight: 500;
  line-height: 30px;
  margin-bottom: 10px;
}

.dark p {
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  margin-bottom: 25px;
}

.logo {
  width: 120px;
}

/* DESKTOP POSITIONS (same as image) */
.s1 {
  grid-column: 1 / span 2;
  grid-row: 1 / span 2;
}

.s2 {
  grid-column: 3 / span 2;
  grid-row: 1 / span 1;
}

.s3 {
  grid-column: 3 / span 2;
  grid-row: 2 / span 1;
}

.s4 {
  grid-column: 5 / span 1;
  grid-row: 2 / span 1;
}

.s5 {
  grid-column: 1 / span 2;
  grid-row: 3 / span 1;
}

.s6 {
  grid-column: 3 / span 2;
  grid-row: 3 / span 1;
}

.s7 {
  grid-column: 5 / span 2;
  grid-row: 3 / span 1;
}

.s8 {
  grid-column: 1 / span 2;
  grid-row: 4 / span 1;
}

.s9 {
  grid-column: 3 / span 2;
  grid-row: 4 / span 1;
}

.s10 {
  grid-column: 5 / span 2;
  grid-row: 4 / span 1;
}

/* .s1 { grid-column: 1 / span 2; grid-row: 1 / span 2; }

.s2 { grid-column: 3 / span 2; grid-row: 1 / span 1; }
.s3 { grid-column: 5 / span 2; grid-row: 1 / span 1; }

.s4 { grid-column: 3 / span 2; grid-row: 2 / span 1; }
.s5 { grid-column: 5 / span 2; grid-row: 2 / span 1; }

.s6 { grid-column: 1 / span 3; grid-row: 3 / span 1; }
.s7 { grid-column: 4 / span 3; grid-row: 3 / span 1; }

.s8 { grid-column: 1 / span 3; grid-row: 4 / span 1; }
.s9 { grid-column: 4 / span 3; grid-row: 4 / span 1; } */




.our-journey-bg {
  background: #222222;
  overflow: hidden;
  border-radius: 20px;
  outline: 1px #5bb535 solid;
  outline-offset: -1px;
  padding: 25px;
}

.team-name {
  text-align: start;
}

.team-flex {
  display: flex;
  align-items: baseline;
}

.team-name-rotate1 {
  transform: rotate(-90deg);
  transform-origin: 20% -40%;
}

.team-name-rotate2 {
  transform: rotate(-90deg);
  transform-origin: 30% -90%;
  margin-right: 25px;
}

.team-name-rotate3 {
  transform: rotate(-90deg);
  transform-origin: 15% -8%;
}

.team-name-rotate4 {
  transform: rotate(-90deg);
  transform-origin: 30% -55%;
  margin-right: 45px;
}

.team-name-rotate5 {
  transform: rotate(-90deg);
  transform-origin: 23% -35%;
  margin-right: 25px;
}

.team-name-rotate6 {
  transform: rotate(-90deg);
  transform-origin: 15% -5%;
}

.team-name h3 {
  color: #222222;
  font-size: 18px;
  font-weight: 700;
  line-height: 18px;
  margin-bottom: -6px;
}

.team-name p {
  color: #222222;
  font-size: 18px;
  font-weight: 400;
  line-height: 18px;
  margin: 0;
  margin-bottom: 20px !important;
  margin-top: -5px !important;
}

/* .team-name-rotate {
  margin-right: -65px;
  margin-bottom: -100px;
} */
.team-name-rotate1 p,
.team-name-rotate2 p,
.team-name-rotate3 p {
  margin-bottom: 0px !important;
  white-space: nowrap;
}

.img-ai-implementation {
  position: relative;
  overflow: hidden;
  display: inline-block;
}

.tems-images img {
  display: block;
  object-fit: cover;
  filter: grayscale(100%);
  transition: filter 0.4s ease, transform 0.4s ease;
  margin-bottom: 30px;
}

.tems-images1 img {
  margin-bottom: 0px;
  width: fit-content;
  margin-left: -50px;
  height: 270px;
}

/* Color Overlay */
/* .tems-images::before {
  opacity: 0.4;
  transition: 0.4s ease-in-out;
  mix-blend-mode: overlay;
} */

/* Hover effect - Remove filter & overlay */
.tems-images:hover img {
  filter: none;
}

.tems-images:hover::before {
  opacity: 0;
}

.tems-bg-about {
  background-color: #FFFFFF;
  padding: 30px;
}

.tems-flex {
  display: flex;
  align-items: center;
  justify-content: center;
}

.btn.btn-partnership:focus {
  box-shadow: none;
}

.btn.btn-partnership:hover {
  color: #000000;
  background: #fff;
  box-shadow: 4px 4px 0px 0px #5bb535;
}

.btn.btn-partnership {
  margin-top: 35px;
  border-radius: 8px;
  background: #5bb535;
  color: #fff;
  box-shadow: 4px 4px 0px 0px #fff;
  padding: 12px 30px;
  text-align: center;
  font-size: 16px;
  width: max-content;
  font-style: normal;
  font-weight: 600;
}

.Partner-text h4 {
  color: #212529;
  font-size: 24px;
  font-weight: 700;
  line-height: 35px;
  margin-bottom: 5px;
}

.Partner-text p {
  color: #212529;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  margin-bottom: 0;
}

.Partner-box {
  height: 100%;
}

.Partner-text1 {
  background: white;
  border-radius: 20px;
  outline: 1px #E1E1E1 solid;
  outline-offset: -1px;
  padding: 20px 25px;
  height: 100% !important;
}

.Partner-text1:hover {
  box-shadow: 4px 4px 0px 0px #5bb535;
}

.ideas-text {
  margin-bottom: 25px;
}

.ideas-text h3 {
  color: #222222;
  font-size: 24px;
  font-weight: 700;
  margin-bottom: 2px;
}

.ideas-text p span {
  background-color: #5BB535;
  height: 6px;
  width: 6px;
  display: inline-block;
  margin-right: 5px;
}

.ideas-text p {
  color: #3B3C3D;
  font-size: 18px;
  font-weight: 400;
  line-height: 30px;
  margin-bottom: 0;
}

.ideas-bg {
  background-color: white;
  padding: 30px;
}

.looking-partner {
  display: flex;
  align-items: start;
  gap: 20px;
  background: white;
  border-radius: 20px;
  outline: 1px #5BB535 solid;
  outline-offset: -1px;
  padding: 25px;
}

.looking-partner h4 {
  color: #5BB535;
  font-size: 20px;
  font-weight: 400;
  margin-bottom: 0;
  margin-top: 5px;
}

.looking-partner h3 {
  color: #130104;
  font-size: 28px;
  font-weight: 600;
  margin-bottom: 0;
}

.blog-pills .nav {
  flex-wrap: nowrap;
  white-space: nowrap;
  overflow-x: scroll;
  scrollbar-width: none;
}

.blog-img-user img {
  height: 50px;
  width: 50px;
  border-radius: 100%;
  border: 2px solid #7cd755;
}

.blog-img-user span {
  font-size: 16px;
  font-weight: 400;
  color: #2D3350;
}

.blog-img-user h4 {
  font-size: 16px;
  font-weight: 500;
  margin-bottom: 0;
  color: #1F2937;
}

.blog-img-user i {
  font-size: 7px;
  color: #9CA3AF;
  margin-left: 5px;
  margin-right: 5px;
}

.blog-img-user {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.blog-img-user1 {
  justify-content: center;
  margin-bottom: 15px;
}

.min-read {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}

.blog-content-heading a,
.blog-content-heading h3 {
  color: #2D3350;
  font-size: 32px;
  font-weight: 600;
  line-height: 48px;
  margin-bottom: 15px;
  transition: 0.3s ease-in-out;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.blog-content-heading a:hover,
.blog-content-heading:hover .blog-title {
  color: #7cd755;
  cursor: pointer;
}

.blog-content-heading p {
  color: #2D3350;
  font-size: 16px;
  font-weight: 400;
  line-height: 32px;
  letter-spacing: 0.32px;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

.blog-content-heading {
  background-color: #fff;
  border: 1px solid rgb(238, 238, 238);
  padding: 30px;
  border-radius: 30px;
  transition: 0.3s ease-in-out;
  height: 100%;
}

.blog-content-heading:hover {
  border: 1px solid #7cd755;
}

.bg-blog-detail {
  background-color: #fff;
}

.blog-detail-heading h1 {
  color: #222222 !important;
  text-align: start;
  font-size: 60px;
  font-weight: 700;
  margin-bottom: 20px;
}

.blog-detail-heading p {
  color: #222222 !important;
  text-align: start;
  font-size: 18px;
  font-style: italic;
  font-weight: 400;
  margin-bottom: 25px;
}

.blog-upadet i {
  color: #222222;
  font-size: 16px;
}

.blog-upadet h5 {
  color: #222222;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  word-wrap: break-word;
  text-shadow: 0px -1px 1px rgba(255, 255, 255, 0.01);
  margin-bottom: 0;
}

.blog-upadet {
  display: flex;
  align-items: center;
  gap: 10px;
}

.blog-upadet-flex {
  display: flex;
  align-items: center;
  gap: 20px;
  flex-wrap: wrap;
}

.side-article-heading h4 {
  color: #DDDDDD;
  font-size: 18px;
  font-weight: 600;
  line-height: 32.04px;
  margin-bottom: 0;
}

.hr-article {
  background-color: #DDDDDD !important;
  width: 50px;
  margin-top: 5px !important;

}

/* Ensure parent container allows sticky */
.blog-detail-fix {
  overflow: visible !important;
}

.side-article-bg {
  background-color: white;
  padding: 25px;
  position: -webkit-sticky;
  position: sticky;
  top: 140px;
  z-index: 99;
  height: fit-content;
}

.side-article-tab-a a {
  color: rgba(59, 60, 61, 0.80);
  font-size: 17px;
  font-weight: 700;
  line-height: 32.04px;
}

.side-article-tab-a a:hover {
  color: rgba(59, 60, 61, 0.80);
}

.side-article-ul ul {
  padding-left: 25px;
  margin-bottom: 0;
}

.side-article-ul ul li {
  list-style: disc;
  margin-bottom: 6px;
}

.side-article-ul ul li::marker {
  color: rgba(59, 60, 61, 0.80);
  ;
  height: 20px;
  width: 20px;
}

.side-article-ul1 ul li {
  list-style: decimal;
  font-weight: 700;
}

.side-article-ul1 ul li::marker {
  color: rgba(59, 60, 61, 0.80);
  ;
  height: 20px;
  width: 20px;
  list-style: decimal;
}

.side-article-ul2 ul {
  padding-left: auto;
}

.topic-content p {
  color: #3B3C3D;
  font-size: 18px;
  font-weight: 400;
  line-height: 32.04px;
  margin-bottom: 5px;
}

.topic-content p a {
  color: #5BB535;
}

.blog-content-img img,
.blog-content-img video {
  border-radius: 10px;
  margin-top: 10px;
}

.margin-blog-left {
  padding-left: 30px !important;
}

.blog-main-heading h4 {
  color: #222222;
  font-size: 60px;
  font-weight: 700;
  margin-bottom: 20px;
}

.build-p-tag p {
  color: white;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  margin-bottom: -10px;
  margin-top: 20px;
}

/* Navbar Scroll Behavior */
.navbar {
  background-color: #161815 !important;
  box-shadow: none !important;
  transition: all 0.3s ease;
}

.navbar .nav-link {
  color: #fff !important;
}

.navbar.hactive {
  background-color: #fff !important;
  /* box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.1) !important; */
}

.navbar.hactive .nav-link,
.navbar.hactive.navbar-light .navbar-nav .nav-link {
  color: #000 !important;
}

.navbar-dark .navbar-nav .nav-link {
  color: #ffffff !important;
  font-weight: 400 !important;
}

.team-card-new {
  position: relative;
  background: #fff;
  padding: 10px 30px 15px 90px;
  max-width: 320px;
  margin: auto;
  display: flex;
  justify-content: center;
  align-items: flex-end;
}

/* ===== ROTATED TEXT ===== */
.team-rotate-text {
  position: absolute;
  left: 70px;
  bottom: 15px;
  transform: rotate(-90deg);
  transform-origin: left bottom;
  white-space: nowrap;
}

.team-rotate-text h4 {
  font-size: 18px;
  font-weight: 700;
  color: #222;
  margin: 0;
  line-height: 1.2;
  text-align: start;
}

.team-rotate-text span {
  font-size: 16px;
  font-weight: 400;
  color: #222;
  display: block;
}

.team-rotate-text span::before {
  content: "";
  display: block;
  width: 36px;
  height: 2px;
  background-color: #ED8B00;
  margin: 6px 0;
}

/* ===== IMAGE ===== */
.team-img img {
  max-width: max-content;
  height: 290px;
  display: block;
}

/* ===== DEFAULT (NO HOVER) ===== */
.team-card-new .team-img img {
  filter: grayscale(100%);
  transition: filter 0.4s ease, transform 0.4s ease;
}

/* ===== ON HOVER ===== */
.team-card-new:hover .team-img img {
  filter: grayscale(0%);
  transform: scale(1.03);
}

.calendly-overlay {
  z-index: 999999999;
}

/* 25-12-2025  */

.service-section-one-tow p {
  margin-bottom: 15px;
}

a.btn-white-service {
  color: #222 !important;
  background-color: #FFF !important;
  border: 2px solid #FFF !important;
  font-weight: 600 !important;
  font-size: 16px !important;
  padding: 13px 35px !important;
  border-radius: 5.4px !important;
  width: fit-content !important;
}

.btn-white-service:hover {
  color: #7cd755 !important;
  background: transparent !important;
  box-shadow: rgb(255, 255, 255) 4px 4px 0px 0px;
}

/* media query */
/* 1920 */
@media (max-width: 2560px) {
  h2.new-size {
    font-size: 50px;
    text-align: start;
  }
}

/* 1680 */
@media (max-width: 1700px) {
  h2.new-size {
    font-size: 50px;
    text-align: start;
  }
}

/* 1500 */
@media (max-width: 1679px) {
  h2.new-size {
    font-size: 50px;
    text-align: start;
  }
}

/* 1440 */
@media (max-width: 1499px) {
  h2.new-size {
    font-size: 50px;
    text-align: start;
  }
}

/* 1280 */
@media (max-width: 1439px) {
  body h1 {
    font-size: 50px;
  }

  .all-in-one {
    border-radius: 20px;
    padding: 30px;
  }

  body h6 {
    font-size: 50px;
    margin-bottom: 0px !important;
  }

  body h2 {
    font-weight: 700;
    font-size: 26px;
  }

  .service-section-one p {
    margin-bottom: 25px;
    font-size: 16px;
    line-height: 24px;
  }

  .btn-dark {
    font-size: 16px !important;
  }

  .contact-chet h4 {
    font-size: 22px;
  }

  .notification {
    width: 100%;
    max-width: 300px;
  }

  .hire-mechincal-img img {
    margin-right: 15px;
  }

  .hire-mechincal-img img {
    width: 34px;
    height: 34px;
  }

  .custom-software-box h4 {
    padding-bottom: 10px;
    font-size: 20px;
  }

  .four-app h4 {
    font-size: 20px;
  }

  .dedicat-why-us-box h4 {
    font-size: 18px;
  }

  .right-for-now-section h5 {
    font-size: 28px;
  }

  .copyright-footer h2 {
    font-size: 24px;
  }

  .foot-first {
    gap: 24px;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  }

  .ex-footer {
    border-radius: 10px 10px 0px 0px;
    padding: 25px;
  }

  .footer-all-link {
    border-radius: 6px;
    padding: 25px;
  }

  h2.new-size {
    font-size: 50px;
    text-align: start;
  }

  h3.new-size {
    font-size: 28px;
  }

  .solution-boxx p {
    color: #fff;
    font-size: 17px;
    font-weight: 600;
    margin-bottom: 10px;
  }

  .client-img video {
    /* height: 215px; */
    border-radius: 25px;
  }

  .client-img video:hover {
    border-radius: 25px;
  }

  .collaborator-one-box {
    border-radius: 20px;
    padding: 22px 22px;
  }

  .portfolio-details h2 {
    font-size: 54px;
    line-height: 62px;
  }

  .portfolio-details-content h3 {
    font-size: 30px;
    margin-bottom: 0px;
  }

  .py-60 {
    padding-top: 55px;
    padding-bottom: 55px;
  }

  .work-showcase-carousel .item img {
    height: auto;
  }

  .bg-link-details {
    background: #ffffff;
    padding: 20px 0;
  }

  .director-content h3 {
    font-size: 25px;
  }
}

/* 992 */
@media (max-width: 1279px) {
  .customer-section {
    padding-right: var(--bs-gutter-x, 0.75rem);
    padding-left: var(--bs-gutter-x, 0.75rem);
  }

  .instagram a {
    width: 51px;
    height: 51px;
  }

  .in-this-article {
    padding: 20px;
  }

  .article-link ol li a {
    font-size: 16px;
  }

  .all-article-text h3 {
    font-size: 18px;
  }

  .all-article-text h5 {
    font-size: 20px;
    padding: 30px;
    margin-bottom: 20px;
  }

  .lets-help-blog {
    padding: 50px 100px;
    text-align: center;
  }

  .all-article-text p {
    margin: 5px 0 5px 0;
  }

  .blog-content-heading a .blog-content-heading h3 {
    font-size: 29px;
    line-height: 35px;
  }

  .blog-main-heading h4 {
    font-size: 59px;
  }

  .service-section-one p {
    margin-bottom: 15px;

  }

  .team-img img {
    max-width: max-content;
    height: 250px;
    display: block;
  }

  .team-rotate-text h4 {
    font-size: 17px;
  }

  .team-rotate-text span {
    font-size: 15px;
  }
}

/* 992 */
@media (max-width: 1279px) {
  .hire-mechincal {
    padding: 18px 18px;
  }

  .hire-mechincal-img img {
    margin-right: 16px;
  }

  .btn-primary,
  a.btn-white-service,
  .btn-dark {
    padding: 10px 20px !important;
    width: max-content;
  }

  .customer-sec-faq {
    padding: 0 !important;
  }

  body h1 {
    font-size: 42px;
  }

  body h6 {
    font-size: 36px;
    margin-bottom: 4px;
  }

  body h2 {
    font-size: 28px;
  }

  .e-comm-cost p {
    font-size: 16px;
    line-height: 30px;
  }

  .green-army p {
    font-size: 18px;
  }

  .green-army p img {
    width: 26px;
  }

  .header-three a {
    font-size: 14px;
  }

  .service-section-tow-padding {
    padding-top: 60px;
  }

  .py-75 {
    padding-top: 55px;
    padding-bottom: 55px;
  }

  .service-section-one-padding {
    padding-top: 80px;
    padding-bottom: 80px;
  }

  .ecom-explore-link.nav-link {
    padding: 10px 1.5rem !important;
    font-size: 16px !important;
  }

  .platform-teb p {
    font-size: 16px;
  }

  .nav-pills .ecom-explore-link.nav-link.active,
  .nav-pills .show>.nav-link {
    font-size: 16px !important;
    padding: 10px 0.8rem !important;
  }

  body h3 {
    font-size: 24px;
  }

  .software-service-section,
  .software-customer {
    padding-top: 80px;
  }

  .hire-service {
    margin-top: 80px;
  }

  .ecomm-tech-age {
    margin-top: 80px;
  }

  .career-want h4 {
    font-size: 23px;
  }

  .section-technologies-padding {
    padding-bottom: 80px;
    padding-top: 80px;
  }

  .section-tow hr {
    margin-bottom: 20px !important;
  }

  .all-article-text hr {
    margin-bottom: 20px !important;
  }

  .instagram a {
    width: 32px;
    height: 32px;
    border-radius: 4px;
  }

  .instagram a i {
    font-size: 14px;
    color: #ffffff;
  }

  .btn.btn-footer {
    font-size: 13px;
    padding: 0px 15px;
    border-radius: 5.4px;
  }

  .footer-section {
    height: 200px;
  }

  .contact-chet h4 {
    line-height: 25px;
    font-size: 18px;
    margin-bottom: 10px;
  }

  .contact-chet {
    padding: 20px 15px 20px 15px;
  }

  .sms-icon {
    margin: 0 15px 0 0;
  }

  .contact-side h4 {
    font-size: 23px;
    line-height: 30px;
  }

  .contact-side {
    padding: 60px 20px;
  }

  .contact-side p {
    font-weight: 400;
    font-size: 15px;
    color: #ffffff;
  }

  .custom-software-box h4 {
    font-size: 19px;
  }

  .software-types h4 {
    font-size: 20px;
  }

  .header-three {
    padding: 18px 0;
    overflow-x: scroll;
    white-space: nowrap;
  }

  .custom-software-box {
    padding: 25px 15px;
  }

  .hire-mechincal-img img {
    margin-right: 13px;
  }

  .hire-mechincal-img img {
    width: 30px;
    height: 30px;
  }

  .hire-mechincal h5 {
    font-size: 20px;
    margin-bottom: 6px;
  }

  .hire-mechincal p {
    font-size: 16px;
    line-height: 21px;
  }

  .dedicat-why-us-box {
    padding: 28px 10px 28px 10px;
  }

  .dedicat-why-us-box h4 {
    font-size: 16px;
  }

  .your-needs img {
    margin-left: 5px;
    margin-right: 5px;
  }

  .your-needs p {
    font-size: 15px;
  }

  .unlimited-part-one h5 {
    font-size: 22px;
  }

  .right-for-now-section h5 {
    font-size: 26px;
  }

  .blog-section {
    border-radius: 50px;
    padding: 45px;
  }

  .company-in-india {
    border-radius: 15px;
    padding: 45px 35px;
    margin-top: 25px;
  }

  .decades-long-point ul li {
    font-size: 16px;
  }

  .about-text p {
    font-size: 16px;
    line-height: 24px;
  }

  .how-app-dev-box {
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 20px;
  }

  .android-web-desk-ios {
    padding: 20px 15px;
    border-radius: 5.4px;
  }

  .why-us-box h4 {
    font-size: 18px;
  }

  .foot-first {
    gap: 24px;
    grid-template-columns: repeat(auto-fit, minmax(165px, 1fr));
  }

  .ex-footer {
    border-radius: 10px 10px 0px 0px;
    padding: 20px;
  }

  .solutions-tow p {
    font-size: 14px;
  }

  .footer-all-link {
    border-radius: 6px;
    padding: 20px;
  }

  .link-design a {
    font-size: 14px;
    margin-bottom: 12px;
  }

  .copyright-footer h2 {
    font-size: 20px;
  }

  .round-footer-img a img {
    border-radius: 20px;
  }

  .home-we-build h1 {
    font-size: 70px;
    padding: 0 5rem;
  }

  img.thumb.img-fluid {
    border-radius: 14px;
    height: 360px;
  }

  .videoCoverImage {
    border-right: 6px solid #7cd755;
    border-bottom: 6px solid #7cd755;
    border-radius: 20px;
  }

  h2.new-size {
    font-size: 40px;
    text-align: start;
  }

  h3.new-size {
    font-size: 26px;
  }

  .all-in-one {
    border-radius: 20px;
    padding: 20px;
  }

  .client-img video {
    /* height: 178px; */
    border-radius: 15px;
  }

  .client-img video:hover {
    border-radius: 15px;
  }

  .collaborator-running-box {
    display: flex;
    flex-direction: column;
  }

  .collaborator-box {
    gap: 20px 16px;
    margin-bottom: 20px;
  }

  .e-learn-g {
    padding: 25px;
    height: 100%;
  }

  .col-boxx {
    padding: 25px;
    margin-bottom: 15px;
  }

  .col-boxx p {
    font-size: 18px;
    margin-right: 25px;
  }

  .social-media-image {
    gap: 20px;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  }

  .social-media-links a {
    font-size: 26px;
    padding: 10px;
  }

  .portfolio-details h2 {
    font-size: 47px;
    line-height: 50px;
  }

  .portfolio-details-content h3 {
    font-size: 28px;
  }

  .portfolio-challenges-content ul {
    margin-top: 5px;
  }

  .director-content h3 {
    font-size: 21px;
  }

  .director-img img {
    height: 240px;
  }

  .director-name h5 {
    font-size: 16px;
  }

  .client-img img {
    height: 40px;
    width: 40px;
  }

  .portfolio-content h2 {
    font-size: 18px;
  }

  .romdo-app-img img {
    height: 310px;
  }
}

/* 768 */
@media (max-width: 991px) {
  .section-one-padding {
    padding-top: 80px;
    padding-bottom: 80px;
  }

  .ecomm-img img {
    margin-top: 15px;
  }

  .top-app-width img {
    height: 155px;
    width: 160px;
    border-radius: 25px;
  }

  .top-app-video-thum-width img {
    height: 155px;
    width: 270px;
    border-radius: 25px;
  }

  .py-44 {
    margin-top: 35px;
    margin-bottom: 35px;
  }

  .date-time-blog p {
    margin-top: 0;
  }

  .hire-one {
    width: 100%;
  }

  .android-web-desk-ios {
    padding: 35px;
  }

  .four-app h4 {
    font-size: 19px;
  }

  body h1 {
    font-size: 50px;
  }

  body h6 {
    font-size: 50px;
  }

  .section-one h1 {
    margin-bottom: 40px;
  }

  .section-one h6 {
    margin-bottom: 40px;
  }

  .section-one p {
    margin-bottom: 35px;
  }

  body h2 {
    font-size: 26px;
  }

  body h3 {
    font-size: 24px;
  }

  .home-explore-link.nav-link {
    padding: 12px 1rem !important;
    font-size: 17px !important;
  }

  .nav-pills .home-explore-link.nav-link.active,
  .nav-pills .show>.nav-link {
    font-size: 17px !important;
    padding: 10px 1rem !important;
  }

  .side-div {
    padding: 20px 0px;
  }

  #v-pills-tabContent {
    padding-left: 30px !important;
    padding-right: 30px !important;
    padding-top: 30px !important;
    padding-bottom: 30px !important;
  }

  .section-teb p {
    font-size: 16px;
    margin-bottom: 10px;
  }

  .all-article-text p a {
    font-size: 16px;
  }

  .section-teb p span a {
    font-size: 16px;
  }

  .blog-detail-text h5 {
    font-size: 16px;
  }

  .b li {
    font-size: 16px;
    margin-bottom: 5px;
  }

  .section-teb a {
    margin-top: 30px;
    margin-bottom: 20px;
  }

  .btn-light {
    padding: 10px 20px !important;
  }

  .section-tow-padding {
    padding-bottom: 80px;
  }

  .section-tow hr {
    margin-bottom: 20px !important;
  }

  .all-article-text hr {
    margin-bottom: 20px !important;
  }

  .customer-details {
    padding: 26px 24px;
  }

  .solution-section {
    padding: 80px 0 0 0;
    background-color: #222;
  }

  .section-technologies-padding {
    padding-bottom: 70px;
    padding-top: 70px;
  }

  .nav-link {
    padding: 10px 1rem !important;
  }

  .technologies-padding {
    padding: 25px !important;
  }

  .hire-one h4 {
    font-size: 30px;
    line-height: 25px;
  }

  .hire-one p {
    font-size: 17px;
  }

  .hire-mechincal {
    padding: 18px 18px;
  }

  .hire-mechincal-img img {
    margin-right: 10px;
    margin-bottom: 5px;
    margin-top: 5px;
  }

  .hire-mechincal h5 {
    margin-bottom: 7px;
  }

  .accordion-button {
    padding: 18px !important;
    font-size: 18px !important;
    line-height: 28px;
  }

  .happy-border {
    margin: 16px 0px;
  }

  .megamenu-design {
    padding-top: 20px !important;
    padding-bottom: 5px !important;
  }

  .col-megamenu ul li {
    margin-bottom: 10px;
  }

  .col-megamenu ul li h6 {
    margin-bottom: 0;
  }

  .ecom-side-div {
    padding: 0px 0px;
  }

  .ecomm-operational h4 {
    font-size: 20px;
    line-height: 25px;
  }

  .ecomm-project {
    padding: 20px 20px;
  }

  .solution-section-ecomm {
    padding: 80px 0 0 0;
  }

  .work-with-icon img {
    padding-top: 0px;
  }

  .ecomm-show-hide {
    padding: 20px 15px;
  }

  .decades-long-point ul li {
    font-size: 16px;
  }

  .ecomm-show-more span {
    font-size: 16px;
    line-height: 25px;
  }

  .ecomm-show-more h3,
  .career-show-more h3 {
    margin-bottom: 8px;
  }

  .ecomm-solution {
    padding: 15px;
  }

  .memorable-padding {
    padding: 0 0 15px 0;
  }

  .footer-about {
    padding: 20px 20px;
  }

  .footer-section {
    height: 180px;
  }

  .instagram a {
    width: 36px;
    height: 36px;
    border-radius: 6px;
  }

  .instagram a i {
    font-size: 18px;
  }

  .footer-about h5 {
    font-size: 18px;
    line-height: 20px;
  }

  .software-service-section,
  .software-customer {
    padding-top: 60px;
  }

  .hire-service {
    margin-top: 60px;
  }

  .about-sec-tow {
    margin-top: 35px;
  }

  .contact-side {
    background-position: bottom;
    background-repeat: no-repeat;
    padding: 30px 30px;
    background-size: cover;
  }

  .contact-form {
    padding: 30px 30px;
  }

  .about-sec-padding {
    padding: 90px;
  }

  .btob-text,
  .testi-main-sec {
    padding: 20px;
  }

  .btob-text p {
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
  }

  .mech-expertise img {
    width: 130px;
  }

  .btn-primary,
  a.btn-white-service,
  .btn-dark {
    font-size: 14px !important;
    padding: 10px 20px !important;
  }

  .software-industrial ul li {
    font-size: 15px;
  }

  .why-us-box h4 {
    font-size: 20px;
  }

  .right-for-now-section h5 {
    font-size: 24px;
  }

  .right-for-now-section {
    padding: 20px;
  }

  .worry-free p {
    margin-bottom: 30px;
  }

  .right-for-now-section p {
    font-size: 15px;
  }

  .unlimited-border:nth-child(2) {
    border-right: none;
  }

  .unlimited-border:nth-child(3) {
    border-right: 1px solid #e9e2d6;
  }

  .unlimited-part-two {
    border-bottom: 1px solid #e9e2d6;
  }

  .memberships-part-two {
    padding: 27px;
    border-bottom: 1px solid #e9e2d6;
  }

  .have-any-question h4 {
    font-size: 26px;
    margin-bottom: 20px;
    line-height: 51.9px;
    width: 100%;
  }

  .your-needs {
    display: flex;
    align-items: center;
    flex-direction: column;
  }

  .your-needs img {
    margin-left: 5px;
    margin-right: 5px;
    transform: rotate(123deg);
  }

  .blog-section {
    border-radius: 25px;
    padding: 30px;
  }

  .company-in-india {
    border-radius: 15px;
    padding: 30px 20px;
    margin-top: 25px;
  }

  .read-top-right p {
    font-size: 16px;
  }

  .read-top-left p {
    font-size: 16px;
  }

  .all-article-text h5 {
    font-size: 18px;
    padding: 20px;
    margin-bottom: 20px;
  }

  .lets-help-blog {
    padding: 50px 50px;
  }

  .how-app-dev-box {
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 20px;
  }

  .how-we-are-app-dev {
    border-radius: 20px;
    padding: 30px 30px;
  }

  .team-box h4 {
    font-size: 20px;
    margin-top: 19px;
    margin-bottom: 13px;
  }

  body h6 {
    font-size: 38px;
  }

  .ecomm-talk {
    padding: 35px 15px 35px 15px;
  }

  .footer-black-box {
    padding: 15px;
  }

  .foot-first {
    gap: 24px;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  }

  .copyright-footer h2 {
    font-size: 18px;
  }

  .home-we-build h1 {
    font-size: 60px;
    padding: 0 0rem;
  }

  .section-one p {
    margin-bottom: 20px;
  }

  img.thumb.img-fluid {
    border-radius: 14px;
    height: 255px;
  }

  .award-image-to img {
    height: 85px;
    margin-top: 25px !important;
  }

  h2.new-size {
    font-size: 36px;
    text-align: start;
  }

  h3.new-size {
    font-size: 24px;
  }

  .mechanical-img {
    text-align: center;
  }

  .client-img img {
    /* height: 202px; */
    border-radius: 15px;
  }

  .collaborator-one-box h3 {
    font-size: 28px;
  }

  .green-army h3 img {
    width: 35px;
  }

  .lets-help-blog {
    padding: 30px 50px;
  }

  .work-portfolio-heading h1 br {
    display: none;
  }

  .work-portfolio-heading h1 {
    font-size: 35px;
  }

  .portfolio-pills .nav-link {
    padding: 7px 20px 7px 20px !important;
  }

  .portfolio-content h2 {
    font-size: 19px;
  }

  .director-content h3 {
    font-size: 19px;
  }

  .client-logo img {
    height: 45px;
  }

  .py-60 {
    padding-top: 50px;
    padding-bottom: 50px;
  }

  .portfolio-details h2 {
    font-size: 45px;
    line-height: 54px;
    text-align: center;
  }

  .portfolio-details {
    text-align: center;
    margin-bottom: 30px;
  }

  .portfolio-details a {
    font-size: 17px;
  }

  .romdo-app-img {
    text-align: center;
  }

  .romdo-app-img img {
    height: 320px;
  }

  .portfolio-details-content h3 {
    font-size: 27px;
  }

  .img-ai-implementation img {
    height: 550px;
  }

  .looking-partner h3 {
    font-size: 22px;
  }

  .ideas-text h3 {
    font-size: 22px;
  }

  .blog-content-heading a,
  .blog-content-heading h3,
  .blog-content-heading p {
    text-align: start !important;
  }

  .blog-img-user1 {
    justify-content: start;
  }

  .blog-content-heading a,
  .blog-content-heading h3 {
    font-size: 27px;
    line-height: 30px;
  }

  .blog-main-heading h4 {
    font-size: 44px;
  }

  .topic-content p {
    font-size: 17px;
    line-height: 26px;
  }

  .margin-blog-left {
    padding-left: calc(var(--bs-gutter-x) * .5) !important;
  }

  .side-article-bg {
    display: none;
  }

  .home-background {
    height: 100vh;
  }
}

/* 576 */
@media (max-width: 767px) {
  body h1 {
    font-size: 36px;
  }

  body h6 {
    font-size: 36px;
  }

  .section-one h1 {
    margin-bottom: 25px;
  }

  .section-one h6 {
    margin-bottom: 25px;
  }

  .btn-primary,
  a.btn-white-service,
  .btn-dark {
    font-size: 16px !important;
    padding: 8px 30px !important;
  }

  .btn-light {
    font-size: 16px !important;
    padding: 8px 20px !important;
  }

  body h2 {
    font-size: 26px;
  }

  .section-tow-padding {
    padding-bottom: 70px;
  }

  .side-div {
    padding: 20px 0px;
    display: none !important;
  }

  .section-teb {
    margin-bottom: 1rem;
  }

  .section-teb a {
    margin-top: 25px;
    margin-bottom: 25px;
  }

  #v-pills-tabContent {
    padding-left: 25px !important;
    padding-right: 25px !important;
    padding-top: 25px !important;
    padding-bottom: 25px !important;
  }

  .section-tow hr {
    margin-bottom: 20px !important;
  }

  .all-article-text hr {
    margin-bottom: 20px !important;
  }

  .customer-details {
    padding: 20px 20px;
  }

  .solution-section {
    padding: 70px 0 0 0;
  }

  .section-technologies-padding {
    padding-bottom: 70px;
    padding-top: 70px;
  }

  .career-want h4 {
    font-size: 22px;
    line-height: 30px;
    margin-bottom: 6px;
  }

  .happy-section {
    padding: 45px 0 45px 0;
  }

  .hire-one h4 {
    font-size: 28px;
  }

  .hire-one h4 {
    margin-bottom: 16px;
  }

  .hire-mechincal {
    padding: 25px 25px;
  }

  .service-section-one-padding {
    padding-top: 50px;
    padding-bottom: 50px;
  }

  .service-section-one p {
    margin-bottom: 25px;
  }

  .decades-long h3 {
    margin-bottom: 10px;
    font-size: 20px;
  }

  .service-section-tow hr {
    margin-bottom: 20px !important;
  }

  .ecomm-point ul li,
  .ecomm-point ul p,
  .ecomm-point ul h5 {
    font-size: 14px;
  }

  .ecomm-point ul h5 {
    padding-top: 5px;
  }

  .ecomm-point ul li span {
    font-size: 15px;
  }

  body h3 {
    font-size: 22px;
  }

  .point-need {
    padding-bottom: 60px;
  }

  .software-service-section,
  .software-customer {
    padding-top: 60px;
  }

  .hire-service {
    margin-top: 60px;
  }

  .ecomm-tech-age {
    margin-top: 70px;
  }

  .talk-with-padding {
    padding: 0px 15px;
  }

  .ecomm-talk {
    padding: 40px 15px 40px 15px;
  }

  .ecomm-operational {
    padding: 25px 10px 25px 10px;
  }

  .why-us-box,
  .career-want {
    padding: 25px 25px 25px 25px;
  }

  .decades-long-point ul li span {
    font-size: 15px;
  }

  .decades-long {
    margin-bottom: 20px;
  }

  .solution-section-ecomm {
    padding: 70px 0 0 0;
  }

  .section-tow-padding {
    padding-bottom: 60px;
  }

  .ecomm-show-more h3,
  .career-show-more h3 {
    font-size: 22px;
  }

  .e-comm-cost p {
    font-size: 16px;
    line-height: 24px;
  }

  .ecomm-happy {
    margin-bottom: 70px;
  }

  .instagram a {
    width: 50px;
    height: 50px;
    border-radius: 10px;
  }

  .instagram a i {
    font-size: 24px;
  }

  .footer-section {
    height: auto;
  }

  .social-icon {
    padding-bottom: 20px;
  }

  .footer-about {
    padding: 25px 20px;
  }

  .about-sec-tow {
    margin-top: 60px;
  }

  .website-solution {
    margin-top: 60px;
  }

  .team-box h4 {
    font-size: 17px;
    margin-bottom: 4px;
  }

  .softeare-project-ecomm {
    margin: 60px 0;
  }

  .contact-chet {
    display: block;
  }

  .sms-icon {
    margin: 0 0 15px 0;
  }

  .sms-text {
    margin: 0 0 0 0;
    text-align: center;
  }

  .sms-icon img {
    width: 55px;
  }

  .notification p {
    font-size: 14px;
  }

  .form-check label {
    font-size: 14px;
  }

  .owl-stage-outer {
    padding: 4px !important;
  }

  .back-end-img img {
    width: 64px;
  }

  .mech-expertise img {
    width: 100px;
  }

  .img-with-bg h3 {
    margin-top: 1rem;
    text-wrap: nowrap;
  }

  .image-with-bg img {
    position: relative;
    margin-bottom: 1rem;
  }

  .right-for-now-section img {
    width: 100%;
    padding: 30px;
    margin-bottom: 20px;
  }

  .unlimited-part-one {
    padding: 30px;
    border-bottom: 1px solid #e9e2d6;
  }

  .unlimited-part-one img {
    margin-bottom: 20px;
  }

  .unlimited-part-two {
    padding: 30px;
  }

  .unlimited-content {
    margin-bottom: 15px;
  }

  .your-needs p {
    font-size: 16px;
    margin-bottom: 10px;
  }

  .unlimited-border:nth-child(1) {
    border-right: none;
  }

  .unlimited-border:nth-child(3) {
    border-right: none;
  }

  .four-dot span {
    width: 10px;
    height: 10px;
    margin-right: 0px;
  }

  .company-in-india {
    border-radius: 15px;
    padding: 30px 20px;
    margin-top: 25px;
  }

  .in-this-article {
    padding: 25px;
    margin-bottom: 30px;
    position: initial;
  }

  .lets-help-blog {
    padding: 30px;
  }

  .foot-first {
    gap: 16px;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  }

  .copyright-footer h2 {
    font-size: 16px;
  }

  .copyright-footer {
    padding: 30px 0px 40px;
    border-bottom: 5px solid #7cd755;
  }

  .foot-first {
    gap: 16px;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  }

  .home-we-build h1 {
    font-size: 50px;
  }

  img.thumb.img-fluid {
    border-radius: 14px;
    height: 285px;
  }

  h2.new-size {
    font-size: 30px;
    text-align: start;
  }

  h3.new-size {
    font-size: 22px;
  }

  .mechodal-main {
    margin-bottom: 15px;
  }

  .solution-boxx p {
    font-size: 15px;
  }

  .solution-boxx h3 {
    font-size: 14px;
  }

  .client-img img {
    /* height: 145px; */
    border-radius: 15px;
  }

  .collaborator-one-box {
    border-radius: 15px;
    padding: 15px 15px;
  }

  .collaborator-one-box:hover {
    border-radius: 15px;
  }

  .green-army h3 img {
    width: 30px;
  }

  .social-media-image {
    gap: 15px;
    grid-template-columns: repeat(auto-fit, minmax(155px, 1fr));
  }

  .waves {
    width: 140px;
    height: 140px;
    right: -50px;
    bottom: -50px;
  }

  .video {
    height: 40px;
    width: 40px;
    line-height: 40px;
  }

  .case-study-box {
    padding: 15px;
    margin-bottom: 24px;
  }

  .case-study-box p {
    font-size: 16px;
  }

  a.btn.case-study-btn {
    border-radius: 8px;
    padding: 10px 20px;
    font-size: 14px;
  }

  .case-study-box img {
    height: 140px;
  }

  .ecomm-operational h4 {
    margin-top: 15px;
  }

  .portfolio-pill .nav {
    display: flex;
    flex-wrap: nowrap;
    padding-left: 0;
    margin-bottom: 0;
    list-style: none;
    white-space: nowrap;
    scrollbar-width: none;
    overflow-x: scroll;
  }

  .portfolio-details h2 {
    font-size: 40px;
    line-height: 50px;
    margin-bottom: 30px;
  }

  .director-img img {
    height: auto;
  }

  .director-img {
    margin-bottom: 25px;
  }

  .s1 {
    grid-column: 1 / span 4;
    grid-row: 1 / span 2;
  }

  .s2 {
    grid-column: 5 / span 2;
    grid-row: 1 / span 1;
  }

  .s3 {
    grid-column: 5 / span 2;
    grid-row: 2 / span 1;
  }

  .s4 {
    grid-column: 1 / span 3;
    grid-row: 3 / span 1;
  }

  .s5 {
    grid-column: 4 / span 3;
    grid-row: 3 / span 1;
  }

  .s6 {
    grid-column: 1 / span 3;
    grid-row: 4 / span 1;
  }

  .s7 {
    grid-column: 4 / span 3;
    grid-row: 4 / span 1;
  }

  .s8 {
    grid-column: 1 / span 3;
    grid-row: 5 / span 1;
  }

  .s9 {
    grid-column: 4 / span 3;
    grid-row: 5 / span 1;
  }

  .s10 {
    grid-column: 1 / span 6;
    grid-row: 6 / span 1;
  }

  .Partner-text h4 {
    font-size: 21px;
    margin-bottom: 2px;
  }

  .Partner-text p {
    font-size: 15px;
    line-height: 20px;
  }

  .ideas-text h3 {
    font-size: 21px;
    margin-bottom: 5px;
  }

  .ideas-text p {
    font-size: 17px;
    line-height: 24px;
  }

  .looking-partner h3 {
    font-size: 20px;
  }

  .blog-content-heading {
    padding: 20px;
    border-radius: 20px;
  }

  .blog-img-user1 {
    margin-bottom: 10px;
  }

  .blog-img-user {
    gap: 6px;
  }

  .blog-main-heading h4 {
    font-size: 36px;
  }

  .side-article-tab-a a {
    font-size: 15px;
    line-height: 30px;
  }

  .team-img img {
    height: 230px;
  }

  .team-rotate-text {
    left: 55px;
  }
}

/* 525 */
@media (max-width: 575px) {
  .solution-box p {
    padding: 10px 14px;
    height: 70px;
    font-size: 13px;
  }

  .case-study-box p {
    font-size: 14px;
  }

  .solution-box {
    margin-bottom: 16px;
  }

  .solution-section {
    padding: 60px 0 0 0;
  }

  .section-technologies-padding {
    padding-bottom: 60px;
    padding-top: 60px;
  }

  .section-tow-padding {
    padding-bottom: 60px;
  }

  .happy-section {
    padding: 40px 0 15px 0;
  }

  .service-section-one p {
    margin-bottom: 22px;
  }

  .service-section-one p {
    font-size: 16px;
    line-height: 22px;
  }

  .about-text p {
    font-size: 15px;
    line-height: 24px;
  }

  body h2 {
    font-size: 24px;
  }

  body h3 {
    font-size: 20px;
  }

  .platform-teb p {
    font-size: 14px;
  }

  .review-text span {
    font-size: 14px;
  }

  .software-service-section,
  .software-customer {
    padding-top: 60px;
  }

  .hire-service {
    margin-top: 60px;
  }

  .btob-text p {
    line-height: 22px;
  }

  .ecomm-tech-age {
    margin-top: 60px;
  }

  .why-us-box,
  .career-want h4 {
    margin-top: 10px;
  }

  .service-section-tow-padding {
    padding-top: 50px;
  }

  .py-75 {
    padding-top: 45px;
    padding-bottom: 45px;
  }

  .solution-section-ecomm {
    padding: 60px 0 0 0;
  }

  .solution-section-ecomm {
    margin-top: 60px;
  }

  .softeare-project-ecomm {
    margin: 60px 0;
  }

  .ecomm-solution {
    padding: 20px 15px 15px 15px;
  }

  .memorable-padding {
    padding: 0 0 30px 0;
  }

  .ecomm-happy {
    margin-bottom: 60px;
  }

  .have-any-question {
    padding: 27px 27px 10px;
  }

  .right-for-now-section h5 {
    font-size: 22px;
  }

  .blog-detail-section {
    box-shadow: 6px 6px 0px 0px #5bb535;
  }

  .company-in-india {
    border-radius: 15px;
    padding: 20px 20px;
    margin-top: 25px;
  }

  .read-top-arrow {
    max-width: 60px;
    height: 60px;
  }

  .read-top-arrow-left {
    max-width: 60px;
    height: 60px;
  }

  img.thumb.img-fluid {
    border-radius: 14px;
    height: 280px;
  }

  .home-we-build h1 {
    font-size: 45px;
  }

  .section-one h1 {
    margin-bottom: 20px;
  }

  .section-one-padding {
    padding-bottom: 50px;
  }

  h3.new-size {
    font-size: 23px;
  }

  .section-tow hr {
    margin-bottom: 20px !important;
  }

  .btn.btn-talking {
    margin-top: 30px;
    box-shadow: 4px 4px 0px 0px #000;
    padding: 12px 30px;
    font-size: 16px;
  }

  .client-img img {
    /* height: 310px; */
    border-radius: 15px;
  }

  .btn.btn-talking-tow {
    margin-top: 30px;
    box-shadow: 4px 4px 0px 0px #000;
    padding: 12px 30px;
    font-size: 16px;
  }

  .case-study-box {
    padding: 20px;
    margin-bottom: 24px;
  }

  .case-study-box p {
    font-size: 18px;
  }

  a.btn.case-study-btn {
    border-radius: 8px;
    padding: 12px 28px;
  }

  .case-study-box img {
    height: 250px;
  }

  .work-portfolio-heading h1 {
    font-size: 30px;
  }

  .py-60 {
    padding-top: 45px;
    padding-bottom: 45px;
  }

  .romdo-app-img img {
    height: 290px;
  }

  .border-overview {
    margin-bottom: 15px;
  }

  .portfolio-challenges-content ul li p {
    line-height: 20px;
  }

  .portfolio-challenges-content ul h4 {
    margin-bottom: 3px;
    margin-top: 4px;
  }

  #type-rotate {
    width: 200px;
  }

  .heading-auto-text h3 {
    font-size: 24px;
    line-height: 35px;
  }

  .img-ai-implementation img {
    height: 450px;
  }

  .section-one-padding.pb-3 {
    padding-bottom: 0rem !important;
  }

  .section-one-padding {
    padding-top: 50px;
    padding-bottom: 50px;
  }

  /* .tems-images img {
    height: 160px;
} */
  .team-name h3 {
    font-size: 16px;
  }

  .team-name p {
    font-size: 16px;
    margin-top: -8px !important;
  }

  .blog-content-heading p {
    line-height: 25px;
  }

  .blog-img-user {
    gap: 5px;
  }

  .min-read {
    gap: 6px;
  }

  .side-article-heading h4 {
    font-size: 17px;
    line-height: 25px;
  }

  .topic-content p {
    font-size: 16px;
    line-height: 24px;
  }

  .team-rotate-text {
    left: 95px;
  }
}

/* 480 */
@media (max-width: 524px) {
  .section-one-padding {
    padding-top: 60px;
    padding-bottom: 45px;
  }

  /*.dot {*/
  /*    margin-bottom: 4rem;*/
  /*}*/
  .dot-three,
  .dot-one {
    margin: 0px 45px;
  }

  .copyright-footer img {
    margin-bottom: 10px;
  }

  .android-web-desk-ios p {
    font-size: 15px;
    margin-bottom: 12px;
  }

  .section-one h1 {
    margin-bottom: 15px;
  }

  .section-one h6 {
    margin-bottom: 15px;
  }

  .section-one p {
    margin-bottom: 25px;
  }

  body h2 {
    font-size: 26px;
  }

  .hire-one h4 {
    font-size: 26px;
  }

  .hire-one h4 {
    margin-bottom: 12px;
  }

  .talk-with-padding {
    padding: 0px 30px;
  }

  .section-technologies-padding {
    padding-bottom: 40px;
  }

  .service-section-tow-padding {
    padding-top: 40px;
  }

  .py-75 {
    padding-top: 35px;
    padding-bottom: 35px;
  }

  .decades-long-point ul li {
    font-size: 14px;
  }

  .ecomm-talk {
    padding: 30px 15px 30px 15px;
  }

  .talk-with-padding {
    padding: 0px 20px;
  }

  body h1 {
    font-size: 32px;
  }

  body h6 {
    font-size: 32px;
  }

  .service-section-one p {
    font-size: 15px;
    line-height: 20px;
  }

  .btn.btn-blur {
    font-size: 14px !important;
    padding: 9px 20px !important;
  }

  .team-box {
    padding: 15px;
  }

  .btob-text {
    background: #222222;
    border-radius: 6px;
    padding: 15px;
  }

  .testi-main-sec {
    background: #ffffff;
  }

  .mech-expertise img {
    width: 85px;
  }

  .software-industrial ul li {
    font-size: 15px;
  }

  .why-us-box h4 {
    font-size: 18px;
  }

  .image-with-bg img {
    position: relative;
    margin-bottom: 0rem;
  }

  .lets-btn a.btn.btn-call {
    margin-bottom: 10px;
  }

  img.thumb.img-fluid {
    border-radius: 14px;
    height: 255px;
  }

  h2.new-size {
    font-size: 28px;
    text-align: start;
  }

  h3.new-size {
    font-size: 20px;
  }

  .client-img img {
    /* height: 268px; */
    border-radius: 15px;
  }

  .green-army h3 {
    font-size: 16px;
  }

  .green-army h3 img {
    width: 24px;
  }

  .lets-btn a {
    margin-right: 0 !important;
  }

  .how-app-dev-box {
    grid-template-columns: repeat(auto-fit, minmax(186px, 1fr));
    gap: 15px;
  }

  .how-app-dev-box-one img {
    margin-bottom: 13px;
    width: 65px;
  }

  .how-app-dev-box-one p {
    font-size: 15px;
  }

  .case-study-box img {
    height: 235px;
  }

  .bg-link-details {
    background: #ffffff;
    padding: 15px 0;
  }

  .portfolio-challenges-content ul li p {
    font-size: 15px;
  }

  .director-content h3 {
    font-size: 18px;
  }

  .blog-content-heading a,
  .blog-content-heading h3 {
    font-size: 26px;
    line-height: 30px;
  }

  .blog-main-heading h4 {
    font-size: 30px;
  }

  .side-article-tab-a a {
    font-size: 14px;
    line-height: 25px;
  }

  .home-setion-1-btn {
    margin-bottom: 35px;
    flex-direction: column;
  }

  .team-img img {
    height: 260px;
  }
}

/* 425 */
@media (max-width: 479px) {
  .customer-img {
    padding: 0.6rem 0.1rem;
  }

  .copyright-footer img {
    margin-bottom: 10px;
  }

  .four-app h4 {
    font-size: 18px;
  }

  .four-app {
    justify-content: center;
  }

  .owl-carousel.owl-carouselll .owl-item img {
    display: block;
    width: 22%;
  }

  .ecomm-operational h4 {
    font-size: 15px;
    line-height: 20px;
  }

  body h2 {
    font-size: 24px;
  }

  .customer-details h3 {
    margin-bottom: 6px;
    font-size: 22px;
  }

  .decades-long h3 {
    margin-bottom: 10px;
    font-size: 18px;
  }

  .solutions-tow p {
    font-size: 15px;
    margin-bottom: 20px;
  }

  .ecomm-show-more h3,
  .career-show-more h3 {
    font-size: 20px;
  }

  .ecomm-show-more span {
    font-size: 14px;
    line-height: 20px;
  }

  .scrum-development button {
    font-size: 13px;
  }

  .end-to-end {
    padding: 10px !important;
  }

  .accordion-button {
    padding: 16px !important;
    font-size: 16px !important;
    line-height: 25px;
  }

  .btn-primary,
  a.btn-white-service,
  .btn-dark {
    font-size: 16px !important;
    padding: 10px 25px !important;
  }

  .ecomm-happy {
    margin-bottom: 40px;
  }

  .section-tow-padding {
    padding-bottom: 40px;
  }

  .solution-section-ecomm {
    margin-top: 50px;
  }

  .solution-section-ecomm {
    padding: 50px 0 0 0;
  }

  .point-need {
    padding-bottom: 40px;
  }

  .team-box h4 {
    font-size: 16px;
  }

  .contact-side h4 {
    font-size: 21px;
    line-height: 20px;
  }

  .contact-side p {
    font-size: 14px;
  }

  .notification {
    width: 100%;
    max-width: 100%;
  }

  .notification p {
    font-size: 12px;
  }

  .journey li button {
    font-size: 20px !important;
  }

  .journey li button.nav-link.active {
    font-size: 20px !important;
  }

  .software-types {
    padding: 25px;
  }

  .software-types {
    padding: 15px 10px 15px 0px;
  }

  .festival-one p {
    font-weight: 500;
    font-size: 16px;
  }

  .career-second {
    display: block;
    align-items: start;
    background-color: #ffffff;
    padding: 22px;
  }

  .career-second img {
    width: 70px;
    margin-bottom: 12px;
  }

  .client-testimonials iframe {
    width: 100%;
    height: 14rem;
  }

  .custom-software-box img {
    margin-bottom: 15px;
  }

  .custom-software-box h4 {
    font-size: 18px;
  }

  .custom-software-box p {
    font-size: 14px;
    line-height: 18px;
  }

  .hire-mechincal {
    padding: 20px;
  }

  .your-needs p {
    font-size: 16px;
    margin-bottom: 0;
  }

  .have-any-question h4 {
    font-size: 20px;
    margin-bottom: 10px;
  }

  .memberships-part-one h3 {
    font-size: 24px;
  }

  .unlimited-content p {
    font-size: 16px;
  }

  .unlimited-part-two {
    padding: 20px;
  }

  .unlimited-part-one {
    padding: 20px;
  }

  .blog-detail-section {
    box-shadow: 5px 5px 0px 0px #5bb535;
  }

  .lets-help-blog {
    padding: 30px;
  }

  .home-we-build h1 {
    font-size: 40px;
  }

  .section-one p {
    margin-bottom: 20px;
  }

  img.thumb.img-fluid {
    border-radius: 14px;
    height: 222px;
  }

  h2.new-size {
    font-size: 26px;
    text-align: start;
  }

  .client-img img {
    /* height: 234px; */
    border-radius: 15px;
  }

  .collaborator-one-box p {
    font-size: 14px;
  }

  .collaborator-one-box h3 {
    font-size: 26px;
  }

  .collaborator-one-box a {
    font-size: 16px;
  }

  .btn.btn-talking-tow,
  .btn.btn-talking {
    margin-top: 25px;
    padding: 12px 20px;
    font-size: 16px;
  }

  .e-learn-g {
    padding: 20px;
  }

  .section-tow p {
    margin: 15px 0 25px 0;
  }

  .col-boxx {
    padding: 20px;
    margin-bottom: 15px;
  }

  .col-boxx p {
    font-size: 18px;
    margin-right: 20px;
  }

  .green-army h3 img {
    width: 22px;
  }

  .lets-help-blog {
    padding: 25px;
  }

  .social-media-links a {
    font-size: 24px;
    padding: 10px;
  }

  .how-app-dev-box-one p {
    font-size: 16px;
  }

  .founded-container {
    margin-bottom: 25px;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 20px;
  }

  body h6 {
    font-size: 30px;
  }

  .case-study-box img {
    height: 200px;
  }

  .case-study-box p {
    font-size: 16px;
  }

  a.btn.case-study-btn {
    border-radius: 8px;
    padding: 10px 22px;
  }

  .portfolio-laug-button {
    gap: 8px;
  }

  .link-details span,
  .link-details a {
    font-size: 15px;
  }

  .portfolio-details h2 {
    font-size: 36px;
    line-height: 44px;
  }

  .Expertise-icon {
    width: 90px;
  }

  .Expertise-icon-flex {
    gap: 10px;
  }

  .work-showcase-carousel {
    margin-top: -20px;
  }

  .work-showcase-carousel .item img {
    height: auto;
  }

  .home-setion-1-btn {
    flex-wrap: wrap;
  }

  .build-powewd {
    gap: 10px !important;
  }

  .img-ai-implementation img {
    height: auto;
  }

  .s1 {
    grid-column: 1 / span 6;
    grid-row: 1 / span 2;
  }

  .s2 {
    grid-column: 1 / span 3;
    grid-row: 3 / span 1;
  }

  .s3 {
    grid-column: 4 / span 3;
    grid-row: 3 / span 1;
  }

  .s4 {
    grid-column: 1 / span 3;
    grid-row: 4 / span 1;
  }

  .s5 {
    grid-column: 4 / span 3;
    grid-row: 4 / span 1;
  }

  .s6 {
    grid-column: 1 / span 3;
    grid-row: 5 / span 1;
  }

  .s7 {
    grid-column: 4 / span 3;
    grid-row: 5 / span 1;
  }

  .s8 {
    grid-column: 1 / span 3;
    grid-row: 6 / span 1;
  }

  .s9 {
    grid-column: 4 / span 3;
    grid-row: 6 / span 1;
  }

  .s10 {
    grid-column: 1 / span 6;
    grid-row: 7 / span 1;
  }

  .tems-images img {
    /* height: 120px; */
    margin-bottom: 14px;
    margin-top: -20px;
  }

  .py-50 {
    margin-top: 35px;
    margin-bottom: 35px;
  }

  .btn.btn-partnership {
    padding: 8px 20px;
    font-size: 15px;
  }

  .blog-content-heading a,
  .blog-content-heading h3 {
    font-size: 24px;
    line-height: 30px;
  }

  .blog-img-user img {
    height: 40px;
    width: 40px;
  }

  .blog-img-user h4 {
    font-size: 14px;
  }

  .blog-img-user span {
    font-size: 14px;
    font-weight: 400;
    color: #2D3350;
  }

  .blog-img-user i {
    font-size: 7px;
    color: #9CA3AF;
    margin-left: 2px;
    margin-right: 2px;
  }

  .blog-img-user1 {
    justify-content: start;
  }

  .blog-content-heading p {
    line-height: 22px;
    font-size: 15px;
  }

  .side-article-bg {
    padding: 20px
  }

  .blog-main-heading h4 {
    font-size: 25px;
  }

  .service-section-one p {
    font-size: 14px;
    line-height: 19px;
  }

  .blog-upadet h5 {
    font-size: 14px;
  }

  .blog-upadet i {
    font-size: 15px;
  }

  .dedicated-btn {
    display: flex;
    gap: 10px;
    justify-content: center;
    flex-wrap: wrap;
  }

  .dedicated-btn a,
  a.btn-white-service {
    width: 100% !important;
    text-align: center;
    margin-right: 0 !important;
  }
}

/* 375 */
@media (max-width: 424px) {

  .btn-primary,
  a.btn-white-service,
  .btn-dark {
    font-size: 15px !important;
    padding: 8px 18px !important;
  }

  .android-web-desk-ios {
    padding: 20px;
  }

  .why-us-box,
  .career-want {
    padding: 28px 20px 24px 20px;
  }

  .accordion-button {
    padding: 14px !important;
    font-size: 15px !important;
    line-height: 21px;
  }

  .accordion-body {
    padding: 0.5rem 0.85rem !important;
  }

  .happy-section {
    padding: 30px 0 10px 0;
  }

  .happy-box h4 {
    font-size: 26px;
  }

  .back-end-img img {
    margin-right: 8px;
    margin-bottom: 6px;
  }

  body h1 {
    font-size: 28px;
  }

  body h6 {
    font-size: 28px;
  }

  body h2 {
    font-weight: 700;
    font-size: 22px;
  }

  .service-section-one p {
    font-size: 14px;
    line-height: 19px;
  }

  .service-section-one h1 {
    margin-bottom: 10px;
  }

  .service-section-one h6 {
    margin-bottom: 10px;
  }

  .service-section-one h2 {
    margin-bottom: 10px;
  }

  .about-text p {
    font-size: 14px;
    line-height: 22px;
  }

  .header-three a {
    margin-right: 32px;
  }

  body h3 {
    font-size: 19px;
  }

  .ecomm-talk {
    padding: 13px;
  }

  .talk-with-padding {
    padding: 0px 15px;
  }

  .software-service-section,
  .software-customer {
    padding-top: 45px;
  }

  .hire-service {
    margin-top: 45px;
  }

  .ecomm-tech-age {
    margin-top: 45px;
  }

  .why-us-box,
  .career-want {
    padding: 24px 15px 24px 15px;
  }

  .why-us-box,
  .career-want p {
    font-size: 14px;
    line-height: 22px;
  }

  .career-want h4 {
    font-size: 20px;
  }

  .section-technologies-padding {
    padding-bottom: 60px;
    padding-top: 30px;
  }

  .section-technologies-padding {
    padding-bottom: 30px;
  }

  .section-tow hr {
    margin-bottom: 20px !important;
  }

  .all-article-text hr {
    margin-bottom: 20px !important;
  }

  .customer-details {
    padding: 15px 15px;
  }

  .customer-details h3 {
    font-size: 20px;
  }

  .customer-details p {
    font-size: 14px;
    line-height: 22px;
  }

  .ecomm-project {
    padding: 15px 15px;
  }

  .ecomm-show-hide {
    padding: 15px 15px;
  }

  .col-megamenu ul li a {
    font-size: 15px;
  }

  .col-megamenu ul li {
    margin-bottom: 8px;
  }

  .instagram a {
    width: 38px;
    height: 38px;
    border-radius: 4px;
    margin: auto;
  }

  .instagram a i {
    font-size: 18px;
  }

  .team-box h4 {
    font-size: 15px;
  }

  .about-sec-padding {
    padding: 60px;
  }

  .about-sec-tow {
    margin-top: 50px;
  }

  .website-solution {
    margin-top: 50px;
  }

  .softeare-project-ecomm {
    margin: 40px 0;
  }

  .software-service-section,
  .software-customer {
    padding-top: 40px;
  }

  .hire-service {
    margin-top: 40px;
  }

  .about-sec-tow {
    margin-top: 35px;
  }

  .contact-side h4 {
    font-size: 20px;
    line-height: 20px;
  }

  .contact-form {
    padding: 20px 13px;
  }

  .contact-side {
    padding: 25px 15px;
  }

  .notify-main {
    display: block;
  }

  .notification p {
    margin: 10px 0px;
  }

  .form-check label {
    font-size: 12px;
  }

  .hire-one p {
    font-size: 15px;
  }

  .hire-one h4 {
    margin-bottom: 10px;
    font-size: 20px;
  }

  .team-box p {
    font-size: 12px;
    margin-bottom: 0;
  }

  .software-industrial ul li {
    margin-top: 5px;
  }

  .software-types h4 {
    margin-top: 15px;
    margin-bottom: 6px;
  }

  .right-for-now-section h5 {
    font-size: 20px;
  }

  .worry-free p {
    margin-bottom: 25px;
  }

  .have-any-question h4 {
    line-height: 30px;
    margin-bottom: 20px;
  }

  .unlimited-part-one h5 {
    font-size: 20px;
  }

  .blog-section {
    border-radius: 10px;
    padding: 20px;
  }

  .date-time-blog p {
    font-size: 14px;
  }

  .read-top-right p {
    font-size: 15px;
  }

  .read-top-left p {
    font-size: 15px;
  }

  .blog-detail-img {
    margin-bottom: 25px;
  }

  .lets-help-blog {
    padding: 20px;
  }

  .all-article-text h5 {
    font-size: 16px;
    padding: 20px;
    margin-bottom: 20px;
  }

  .home-we-build h1 {
    font-size: 35px;
  }

  img.thumb.img-fluid {
    border-radius: 14px;
    height: 200px;
  }

  .client-img img {
    /* height: 200px; */
    border-radius: 15px;
  }

  .collaborator-one-box {
    border-radius: 15px;
    padding: 15px 15px;
    width: 100%;
  }

  /*.btn.btn-talking-tow{*/
  /*  margin-top: 15px;*/
  /*}*/
  .col-boxx h3 {
    font-size: 16px;
  }

  .copyright-footer h2 {
    font-size: 15px;
  }

  .copyright-footer {
    padding: 20px 0px 40px;
  }

  h2.new-size {
    font-size: 24px;
    text-align: start;
  }

  .founded-container {
    margin-bottom: 25px;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 15px;
  }

  .founded-box p {
    color: #7cd755;
    font-size: 14px;
    font-weight: 400;
    margin-bottom: 0;
  }

  .portfolio-content h2 {
    font-size: 17px;
  }

  .portfolio-content p {
    font-size: 15px;
  }

  .work-portfolio-heading h1 {
    font-size: 25px;
  }

  .py-60 {
    padding-top: 40px;
    padding-bottom: 40px;
  }

  .portfolio-details h2 {
    font-size: 34px;
    line-height: 40px;
  }

  .portfolio-details a {
    font-size: 16px;
  }

  .portfolio-challenges-content p {
    font-size: 15px;
    line-height: 20px;
  }

  .portfolio-challenges-content ul h4 {
    font-size: 15px;
  }

  .portfolio-challenges-content ul li p {
    font-size: 15px;
  }

  .portfolio-details-content h3 {
    font-size: 25px;
  }

  .work-showcase-carousel .item img {
    height: auto;
  }

  .director-content h3 {
    font-size: 15px;
    margin-bottom: 15px;
  }

  .client-logo img {
    height: 40px;
  }

  .director-name h5,
  .director-name p {
    font-size: 14px;
    line-height: 16.96px;
  }

  .s2 {
    grid-column: 1 / span 6;
    grid-row: 3 / span 1;
  }

  .s3 {
    grid-column: 1 / span 6;
    grid-row: 4 / span 1;
  }

  .s4 {
    grid-column: 1 / span 6;
    grid-row: 5 / span 1;
  }

  .s5 {
    grid-column: 1 / span 6;
    grid-row: 6 / span 1;
  }

  .s6 {
    grid-column: 1 / span 6;
    grid-row: 7 / span 1;
  }

  .s7 {
    grid-column: 1 / span 6;
    grid-row: 8 / span 1;
  }

  .s8 {
    grid-column: 1 / span 6;
    grid-row: 9 / span 1;
  }

  .s9 {
    grid-column: 1 / span 6;
    grid-row: 10 / span 1;
  }

  .s10 {
    grid-column: 1 / span 6;
    grid-row: 11 / span 1;
  }

  .box {
    font-size: 28px;
    line-height: 24px;
  }

  .build-powewd {
    gap: 10px !important;
  }

  #type-rotate {
    width: 155px;
  }

  .section-one-padding {
    padding-top: 45px;
    padding-bottom: 45px;
  }

  .team-name h3 {
    font-size: 14px;
  }

  .team-name p {
    font-size: 14px;
    margin-top: -10px !important;
  }

  .Partner-text1 {
    border-radius: 15px;
    padding: 15px 19px;
  }

  .Partner-text h4 {
    font-size: 18px;
    margin-bottom: 0px;
  }

  .Partner-text p {
    font-size: 14px;
    line-height: 20px;
  }

  .ideas-text h3 {
    font-size: 19px;
    margin-bottom: 5px;
  }

  .ideas-text p {
    font-size: 15px;
    line-height: 23px;
  }

  .ideas-bg {
    padding: 18px;
  }

  .looking-partner h3 {
    font-size: 16px;
  }

  .looking-partner {
    border-radius: 15px;
    padding: 20px;
    gap: 10px;
  }

  .looking-partner h4 {
    margin-top: 0;
  }

  .blog-content-heading a {
    font-size: 21px;
    line-height: 30px;
  }

  .blog-main-heading h4 {
    font-size: 23px;
    margin-bottom: 15px;
  }

  .topic-content p {
    font-size: 14px;
    line-height: 24px;
  }

  .home-background {
    height: 85vh;
  }

  .team-rotate-text {
    left: 85px;
  }
}

/* 320 */
@media (max-width: 374px) {
  .section-one h1 {
    margin-bottom: 12px;
  }

  .section-one h6 {
    margin-bottom: 12px;
  }

  .section-one p {
    font-size: 15px;
    margin-bottom: 26px;
  }

  .btn-primary,
  .btn-dark,
  .btn-light {
    font-size: 15px !important;
    padding: 6px 12px !important;
  }

  body h2 {
    font-size: 22px;
  }

  #v-pills-tabContent {
    padding-left: 15px !important;
    padding-right: 15px !important;
    padding-top: 15px !important;
    padding-bottom: 15px !important;
  }

  body h3 {
    font-size: 20px;
  }

  .section-tow hr {
    margin-bottom: 20px !important;
  }

  .all-article-text hr {
    margin-bottom: 20px !important;
  }

  .section-teb p {
    font-size: 15px;
  }

  .all-article-text p a {
    font-size: 15px;
  }

  .section-teb p span a {
    font-size: 15px;
  }

  .blog-detail-text h5 {
    font-size: 15px;
  }

  .b li {
    font-size: 15px;
  }

  .section-teb a {
    margin-top: 20px;
    margin-bottom: 20px;
  }

  .customer-details h3 {
    margin-bottom: 8px;
    font-size: 20px;
  }

  .customer-details p {
    font-size: 14px;
    line-height: 22px;
  }

  .solutions-tow p {
    font-size: 14px;
    margin-bottom: 24px;
  }

  .technologies-padding {
    padding: 15px !important;
  }

  .back-end-img {
    margin-bottom: 10px;
  }

  .hire-one p {
    font-size: 14px;
  }

  .hire-one h4 {
    font-size: 24px;
  }

  .hire-tow a {
    font-size: 14px !important;
  }

  .hire-mechincal {
    padding: 15px 15px;
  }

  .hire-mechincal h5 {
    font-size: 21px;
    margin-bottom: 8px;
  }

  .hire-mechincal p {
    font-size: 14px;
    line-height: 20px;
    margin-bottom: 8px;
  }

  .hire-mechincal-img img {
    width: 30px;
    height: 30px;
  }

  .why-us-box,
  .career-want {
    padding: 24px 18px 24px 18px;
  }

  .why-us-box,
  .career-want p {
    font-size: 14px;
    line-height: 20px;
  }

  .career-want h4 {
    font-size: 20px;
    margin-bottom: 4px;
  }

  body h1 {
    font-size: 25px;
  }

  body h6 {
    font-size: 25px;
  }

  body h2 {
    font-size: 18px;
  }

  .service-section-one p {
    margin-bottom: 20px;
  }

  .service-section-one-padding {
    padding-top: 40px;
    padding-bottom: 40px;
  }

  .explore-ecomm {
    padding-top: 40px;
  }

  body h3 {
    font-size: 16px;
  }

  .talk-with-padding {
    padding: 0px 10px;
  }

  .career-want h4 {
    font-size: 18px;
  }

  .ecomm-operational {
    padding: 15px 10px 15px 10px;
  }

  .ecomm-operational h4 {
    font-size: 13px;
  }

  .why-box-margin {
    margin-bottom: 15px;
  }

  .decades-long h3 {
    font-size: 16px;
  }

  .solution-section-ecomm {
    padding: 40px 0 0 0;
  }

  .solution-section-ecomm {
    margin-top: 40px;
  }

  .ecomm-show-more h3,
  .career-show-more h3 {
    font-size: 20px;
    margin-bottom: 4px;
  }

  .softeare-project-ecomm {
    margin: 45px 0;
  }

  .e-comm-cost p {
    font-size: 14px;
    line-height: 20px;
  }

  .softeare-project-one {
    padding: 1rem 1rem;
  }

  .instagram a {
    width: 33px;
    height: 33px;
  }

  .instagram a i {
    font-size: 15px;
  }

  .footer-about p {
    font-size: 14px;
  }

  .footer-link ul li a {
    font-size: 14px;
  }

  .footer-about h5 {
    font-size: 16px;
    line-height: 12px;
  }

  .footer-location h4 {
    font-size: 18px;
    line-height: 16px;
  }

  .footer-about {
    padding: 20px 15px;
  }

  .team-box {
    padding: 13px 10px;
  }

  .team-box h4 {
    font-size: 13px;
    margin-top: 15px;
  }

  .section-tow p {
    margin: 10px 0 20px 0;
  }

  .contact-side h4 {
    font-size: 18px;
    line-height: 25px;
  }

  .about-sec-tow p {
    font-size: 14px;
  }

  button.routbtn {
    margin: 5px 5px 0 0;
    padding: 1px 8px;
    font-size: 14px;
  }

  .secound-footer p {
    font-size: 14px;
  }

  .article-link ol li a {
    font-size: 15px;
  }

  .all-article-text h3 {
    font-size: 16px;
  }

  .lets-help-blog p {
    font-size: 10px;
  }

  .social-media-image {
    gap: 15px 10px;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  }

  .copyright-footer h2 {
    font-size: 14px;
  }

  .social-media-links a {
    font-size: 24px;
    padding: 0px;
  }

  .client-img img {
    /* height: 168px; */
    border-radius: 15px;
  }

  .home-we-build h1 {
    font-size: 32px;
  }

  .section-one p {
    font-size: 14px;
    margin-bottom: 14px;
  }

  .top-app-width img {
    height: 125px;
    width: 130px;
    border-radius: 25px;
  }

  .how-we-are-app-dev {
    border-radius: 20px;
    padding: 25px 20px;
  }

  .btn.btn-primary.btn-orange {
    font-size: 13px !important;
  }

  .case-study-box img {
    height: 150px;
  }

  .link-details span,
  .link-details a {
    font-size: 14px;
  }

  .portfolio-details h2 {
    font-size: 31px;
    line-height: 35px;
  }

  .romdo-app-img img {
    height: 230px;
  }
}

/* 280 */
@media (max-width: 319px) {}

/* ================================
   Blog Pagination Styles
   ================================ */
.blog-pagination {
  display: flex;
  justify-content: center;
  margin-top: 50px;
  margin-bottom: 30px;
}

.pagination-list {
  display: flex;
  align-items: center;
  gap: 8px;
  list-style: none;
  padding: 0;
  margin: 0;
}

.pagination-item {
  display: flex;
  align-items: center;
  justify-content: center;
}

.pagination-link {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 45px;
  height: 45px;
  padding: 0 12px;
  border-radius: 10px;
  background: #ffffff;
  border: 2px solid #e1e1e1;
  color: #222222;
  font-size: 16px;
  font-weight: 600;
  text-decoration: none;
  transition: all 0.3s ease;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

.pagination-link:hover {
  background: linear-gradient(135deg, #7cd755 0%, #5bb535 100%);
  border-color: #5bb535;
  color: #ffffff;
  transform: translateY(-2px);
  box-shadow: 0 4px 15px rgba(91, 181, 53, 0.3);
}

.pagination-link.active {
  background: linear-gradient(135deg, #7cd755 0%, #5bb535 100%);
  border-color: #5bb535;
  color: #ffffff;
  box-shadow: 0 4px 15px rgba(91, 181, 53, 0.3);
}

.pagination-prev,
.pagination-next {
  background: #222222;
  border-color: #222222;
  color: #ffffff;
}

.pagination-prev:hover,
.pagination-next:hover {
  background: linear-gradient(135deg, #7cd755 0%, #5bb535 100%);
  border-color: #5bb535;
  color: #ffffff;
}

.pagination-prev i,
.pagination-next i {
  font-size: 14px;
}

.pagination-dots span {
  color: #666666;
  font-size: 18px;
  font-weight: 600;
  padding: 0 5px;
}

/* Responsive Pagination */
@media (max-width: 768px) {
  .pagination-list {
    gap: 5px;
  }

  .pagination-link {
    min-width: 38px;
    height: 38px;
    font-size: 14px;
    padding: 0 10px;
    border-radius: 8px;
  }

  .pagination-prev i,
  .pagination-next i {
    font-size: 12px;
  }

  .blog-pagination {
    margin-top: 35px;
    margin-bottom: 20px;
  }
}

@media (max-width: 480px) {
  .pagination-list {
    gap: 4px;
  }

  .pagination-link {
    min-width: 35px;
    height: 35px;
    font-size: 13px;
    padding: 0 8px;
  }

  .pagination-item.pagination-dots {
    display: none;
  }
}

#header {
  position: sticky;
  top: 0;
  z-index: 100000000;
  z-index: 100000000;
  width: 100%;
}

@media (min-width: 768px) {
  .navbar-expand-md .navbar-nav .has-megamenu {
    position: static !important;
    display: flex;
    align-items: center;
  }

  .navbar-expand-md .navbar-nav .megamenu {
    position: absolute;
    left: 0;
    right: 0;
    width: 100%;
    margin-top: 0;
  }
}



/* Custom Added for Equal Height Cards */
.work-portfolio-cart {
  height: 100%;
  display: flex;
  flex-direction: column;
}

.portfolio-padding-content {
  flex: 1;
  display: flex;
  flex-direction: column;
}

.portfolio-content {
  flex: 1;
  display: flex;
  flex-direction: column;
}

.portfolio-content a {
  margin-top: auto;
}

/* Equal Height Fix for Mobile Slider */
.owl-carousel.mobile-slider .owl-stage {
  display: flex !important;
  align-items: stretch !important;
}

.owl-carousel.mobile-slider .owl-item {
  display: flex !important;
  height: auto !important;
}

.owl-carousel.mobile-slider .item {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.owl-carousel.mobile-slider .work-portfolio-cart {
  display: flex;
  flex-direction: column;
  height: 100%;
  flex: 1;
}

.owl-carousel.mobile-slider .portfolio-padding-content {
  display: flex;
  flex-direction: column;
  flex: 1;
}

.owl-carousel.mobile-slider .portfolio-content {
  display: flex;
  flex-direction: column;
  flex: 1;
}


.owl-carousel.mobile-slider .portfolio-content a {
  margin-top: auto;
}

/* Creative Services Page Styles */

/* Video Editor UI Mockup */
.editor-ui-container {
  position: relative;
  width: 100%;
  background: #000;
  /* border-radius: px; */
  display: flex;
  justify-content: center;
  align-items: center;
  aspect-ratio: 16 / 9;
  box-shadow: 0 40px 80px rgba(0, 0, 0, 0.25);
  border: 1px solid rgba(255, 255, 255, 0.1);
}

.editor-corner {
  position: absolute;
  width: 50px;
  height: 50px;
  z-index: 25;
  pointer-events: none;
}

.corner-tl {
  top: -4px;
  left: -4px;
  border-top: 5px solid #7cd755;
  border-left: 5px solid #7cd755;
}

.corner-br {
  bottom: -4px;
  right: -4px;
  border-bottom: 5px solid #ffffff;
  border-right: 5px solid #ffffff;
}

.editor-main-viewport {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  overflow: hidden;
}

.editor-main-viewport::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 5;
  background: transparent;
}

.editor-main-viewport iframe {
  position: absolute;
  width: 100%;
  height: 125%;
  top: -12.5%;
  border: none;
  z-index: 1;
}

/* Video Project Cards (Vertical/Reels style) */
.video-project-card {
  position: relative;
  width: 100%;
  aspect-ratio: 7 / 11;
  background: #000;
  border-radius: 12px;
  overflow: hidden;
  cursor: pointer;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  margin-bottom: 24px;
  border: 2px solid #000;
}

.video-project-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 15px 30px rgba(0, 0, 0, 0.4);
}

.video-project-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0.9;
  transition: opacity 0.3s ease;
}

.video-project-card:hover img {
  opacity: 1;
}

.video-project-card .play-btn-overlay {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 54px;
  height: 54px;
  background: rgba(255, 255, 255, 0.95);
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
  z-index: 5;
  transition: transform 0.3s ease, background 0.3s ease;
}

.video-project-card:hover .play-btn-overlay {
  transform: translate(-50%, -50%) scale(1.1);
  background: #fff;
}

.video-project-card .play-btn-overlay i {
  color: #000;
  font-size: 18px;
  margin-left: 4px;
}

/* Gradient bottom to show text better */
.video-project-card::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 30%;
  background: linear-gradient(transparent, rgba(0, 0, 0, 0.8));
  pointer-events: none;
}

/* Creative Design Masonry Grid */
.creative-design-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-auto-rows: 250px;
  gap: 20px;
  margin-top: 40px;
}

.design-placeholder {
  background-color: #ccd2c9;
  border-radius: 15px;
  transition: all 0.3s ease;
  cursor: pointer;
  overflow: hidden;
  position: relative;
}

.design-placeholder img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s ease;
}

.design-placeholder:hover {
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.15);
}

.design-placeholder:hover img {
  transform: scale(1.08);
}

.design-item-v {
  grid-row: span 2;
}

.design-item-full {
  grid-column: span 3;
  grid-row: span 2;
  height: 100%;
  min-height: 400px;
}

/* Responsive Grid */
@media (max-width: 1200px) {
  .creative-design-grid {
    grid-auto-rows: 200px;
  }

  .design-item-full {
    min-height: 300px;
  }
}

@media (max-width: 991px) {
  .creative-design-grid {
    grid-template-columns: repeat(2, 1fr);
    grid-auto-rows: 220px;
  }

  .design-item-full {
    grid-column: span 2;
    min-height: 300px;
  }

  .design-item-v {
    grid-row: span 2;
  }

  .editor-ui-container {
    margin-top: 40px;
  }
}

@media (max-width: 767px) {
  .creative-design-grid {
    grid-auto-rows: 180px;
    gap: 15px;
  }
}

@media (max-width: 575px) {
  .creative-design-grid {
    grid-template-columns: 1fr;
    grid-auto-rows: auto;
    gap: 20px;
  }

  .design-placeholder {
    aspect-ratio: 16 / 9;
  }

  .design-item-v,
  .design-item-full {
    grid-column: span 1;
    grid-row: span 1;
    height: auto;
    min-height: 200px;
  }

  .design-item-v {
    aspect-ratio: 4 / 5;
  }
}

.editor-play-btn {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 80px;
  height: 80px;
  background: rgba(255, 255, 255, 0.2);
  backdrop-filter: blur(10px);
  border: 2px solid #fff;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 20;
  cursor: pointer;
  pointer-events: auto;
  transition: all 0.3s ease;
}

.editor-play-btn:hover {
  transform: translate(-50%, -50%) scale(1.1);
  background: rgba(255, 255, 255, 0.3);
}

.editor-play-btn i {
  color: #fff;
  font-size: 32px;
  margin-left: 5px;
}