/*Arun-changes*/

.container {

  padding-right: 15px;

  padding-left: 15px;

  max-width: 1280px;

  width: 100%;

  margin: 0 auto;

}

.x-icon-svg {

  width: 24px;

  height: 24px;

  fill: #000; /* Default black */

  transition: fill 0.3s ease;

}



.x-icon-svg:hover {

  fill: #ec7408; /* Blue on hover, optional */

}

h1,

h2,

h3,

h4,

h5 {

  text-transform: capitalize;

  font-weight: 500;

}

h4{
  text-transform: 
  none;
}


h2 {

  font-size: 36px;

  text-transform: 
  none;

}



.professional-web-design .row {

  display: flex;

}

.blog .first-blog ul{

  padding-left: 0px;

}

.blog .first-blog h3 li, .blog.inner-blog ul li {

  font-size: 26px;

  font-weight: 500;

  color: #000 !important;

  margin-bottom: 10px;

  margin-left: 20px;

}

.blog.inner-blog .first-blog h2 {

  color: #000;

}

.blog.inner-blog p {

  color: #000 !important;

}

.blog.inner-blog .img-blog img.img-responsive {

  width: 100%;

}

a.quick_connet {

  right: 190px !important;

}



.carousel-inner .bannerVideo video {

  width: 100%

}



section.web-service-importance .row {

  display: flex;

  margin: 0px;

}



.specialists .relatedBlog .wrap {

  position: relative;

}



.specialists .relatedBlog .wrap .readBtns {

  text-transform: capitalize;

  color: #ec7408;

  position: absolute;

  bottom: 0;

  left: 50%;

  transform: translate(-50%, 0px);

}



.e-commerce.left .e-commerce-table .e-commerce-table-cell:last-child {

  padding: 20px 60px;

}



.footerRating ul.list-unstyled.list-inline.follow li {

  transition: all 0.5s ease-in-out

}



.footerRating ul.list-unstyled.list-inline.follow li a.tw {

  transition: all 0.5s ease-in-out;

}



.footerRating ul.list-unstyled.list-inline.follow li a.tw .whiteT {

  display: none;

  border-radius: 0px;

}



.footerRating ul.list-unstyled.list-inline.follow li a.tw:hover .blackT {

  display: none;

  border-radius: 0px;

}



.footerRating ul.list-unstyled.list-inline.follow li a.tw:hover .whiteT {

  transition: all 0.5s ease-in-out;

  display: block;

  width: 100%;

  overflow: hidden;

  padding: 10px;

}



section.portfolio.portfolio_inner .owl-carousel {

  margin-top: 0px;

}



.footerRating ul.list-unstyled.list-inline.follow li:nth-child(3) a:hover {

  background-color: #d6189a;

}



ul.follow li a:hover.tw {

  background: #000;

}



.middl {

  display: flex;

  justify-content: center;

  align-items: center;

}



.aside.in {

  background: transparent;

  box-shadow: none;

}



.aside .aside-contents {

  background: #fafafa;

  overflow-y: scroll;

  padding-bottom: 80px;



}



.row.tabViewChange .col-md-8 {

  width: 65%;

}



.row.tabViewChange .col-md-4 {

  width: 35%;

}



.carousel.bs-slider.inner-top .heading-banner {

  color: #fff;

}



a.quick_connet {

  right: 190px

}



span.first_letter_chg {

  font-size: 16px !important;

  font-weight: 400 !important;

  text-transform: uppercase !important;

}



.web-service-importance:last-of-type {

  display: none;

}



article.container {

  padding: 30px 30px 10px;

}



section.professional-web-design article.container {

  padding: 0px 0 30px;

}

.height-150{
  height: 150px;
}
.client-section {
  
  border: 2px solid #187ac3;
  padding: 0 !important;
}
.client-heading {
  background-color:#187ac3;
  color: white;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: end;
  padding: 1.5rem;
padding-right: 35px;
  height: 100%;
}

.client-heading .making-left-align {
  height: 100%;
  
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: left;
}
.client-heading .making-left-align h5 {
  font-weight: bold;
  font-size: 25px;
  letter-spacing: 3.5px;
}
.client-logo {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
 
  border-left: 1px solid #187ac3;
}
.client-logo img {
  max-width: 100%;
  max-height: 100%;
}

@media (max-width: 1023px) {
  .height-150{
    height: auto !important;
  }
.client-logo{
  padding: 10px 0;
  border: 1px solid #187ac3;
}
.client-heading .making-left-align h5{
  letter-spacing: 1px;
}
.client-heading{
  align-items: center;
}
.client-heading .making-left-align{
  text-align: center;
}
}



@media (min-width: 768px) and (max-width: 991px) {

    .footerRating ul.list-unstyled.list-inline.follow {

        margin: 0 !important;

        display: flex;

        flex-wrap: nowrap !important;

        

    }

    article.container .page-header h1 {

        padding-left: 15px;

    }

    .e-commerce-wrap .digital_text{

        position: static;

        margin-top: 30px;

    }

  .boxLists li .wrap {

    margin-bottom: 0px;

  }

  .mar-top .row {

    padding: 0 20px;

}

  .boxLists {

    justify-content: space-between;

  }



  .boxLists li {

    width: 48% !important;

    margin-bottom: 70px;

    margin-right: 0 !important;

  }



  a.quick_connet {

    top: 12px;

  }

}





/* Faq css start here*/



.faq {

  background-color: white;

  border: 1px solid #ccc;

  margin-bottom: 24px;

  border-radius: 8px;

  overflow: hidden;

}



.faq-header {

  padding: 20px;

  cursor: pointer;

  font-weight: bold;

  font-size: 24px;

}



.faq-body {

  display: none;

  padding: 0px 23px 40px 23px;

  font-size: 16px;

  color: #333;

}



.faq-container {

  max-width: 1020px;

  width: 100%;

  margin: 0 auto 55px;

  padding: 0px 30px;

}



.faq-container h2 {

  text-align: center;

}



.faq-body p {

  margin: 0;

}



.faq.open span.arrow i {

  transform: rotate(90deg);

}



.arrow {

  float: right;

}



.open .faq-body {

  display: block;

}









/* faq css end here */

/* shiv_chnages start */

a.quick_connet {

  color: #ec7408;

  position: static;

}



#navbar .start-project {

  margin-left: 0px;

}



.logos .customTech h2.white_heading span {

  color: #fff !important;

}



/* shiv_changes end */

/* custom css start here @D */

.technology_main {

  padding: 80px 0;

}



.technology_main .heading_ {

  text-align: center;

  margin-bottom: 60px;

}



.technology_main .heading_ h2 {

  text-transform: uppercase;

  font-size: 40px;

  margin-bottom: 15px;

}



.technology_main .heading_ p {

  font-size: 18px;

}



.technology_main figure {

  margin: 0;

  padding: 0;

}



.technology_main .row:last-of-type p {

  padding-left: 20px;

}



.technology_main.second {

  background-color: #f8f8f8;

}



.technology_main.second .heading_ h2 {

  text-transform: unset;

}



.technology_main ul {

  margin: 30px 0 0 0;

  column-count: 2;

  list-style: none;

}



.technology_main ul li {

  position: relative;

  padding-left: 30px;

  margin-bottom: 15px;

  font-size: 16px;

}



.technology_main ul li:before {

  content: "";

  position: absolute;

  left: 0;

  top: 7px;

  width: 15px;

  height: 15px;

  border-radius: 50%;

  background-color: #e37819;

}



.slide-text>h1.heading-banner {

  padding: 0;

  color: #ffffff;

  font-size: 65px;

  font-weight: 300;

  line-height: 84px;

  margin-bottom: 90px;

  margin-top: 0;

  letter-spacing: 1px;

  display: inline-block;

  -webkit-animation-delay: 0.7s;

  animation-delay: 0.7s;

  text-shadow: 2px 2px 1px #1b3043;

  position: relative;

}



.slide-text>h1.heading-banner:before {

  border: 12px solid rgba(255, 255, 255, 0.1);

  content: '';

  position: absolute;

  top: -62px;

  left: -48px;

  width: 316px;

  height: 192px;

}



.slide-text>h1.heading-banner:after {

  content: '';

  position: absolute;

  top: 0;

  left: 0px;

  width: 85px;

  height: 4px;

  background: #ec7408;

  box-shadow: 1px 1px 0px #091826;

}



.testimonial.inner h2 {

  color: #fff;

}



.testimonial h2.white_heading,

.testimonial .view-more,

.testimonial p {

  color: rgb(255 255 255) !IMPORTANT;

}



.orange {

  color: rgb(236 116 8) !IMPORTANT;

}



.office p,

.office a {

  color: #FFFF !IMPORTANT;

}



.sidenav-bottom p {

  margin: 0 0 0 0;

  line-height: 24px;

  color: rgb(255 255 255) !important;

}



.img-responsive {

  margin-bottom: 10px !important;

}



.trems_cond a:hover {

  color: rgb(236 116 8);

}



/* a.navbar-brand.js-scroll-trigger:hover::after {

  content: "SDS Website, Apps, SEO Specialists";

  position: absolute;

  top: 60px;

  left: 0px;

  background-color: rgb(47 47 47);

  color: #fff;

  font-size: 11px;

  font-weight: 100;

  font-family: sans-serif;

  padding: 5px 10px;

  box-shadow: 1px 1px 7px white;

  text-shadow: none;

  border-radius: 15px;

  text-align: center;

} */



#portfolio .section-box-six figure p {

  line-height: 1.4em;

}



.row.tabViewChange .col-md-4 h2 {

  margin: 30px 0px !important;

}



i.fa.fa-mobile {

  font-size: 20px;

}



.first-blog h4 {

  margin: 20px 0;

  font-size: 22px;

  color: rgb(102 102 102);

}



.bannerVideo video {

  width: 100%;

  height: 100%;

  object-fit: cover;

}



.homePortfolio .owl-nav {

  top: auto;

  left: 50%;

  transform: translateX(-50%);

  bottom: -10px;

}



.homePortfolio {

  padding-bottom: 60px;

}



h2.white_heading.colorWhite span {

  color: #fff !important;

}



.homePortfolio .innerLayer {

  position: absolute;

  left: 0;

  top: 0;

  width: 100%;

  padding: 20px;

  height: 100%;

  opacity: 0;

  visibility: hidden;

  transition: all 0.5s ease;

  z-index: 2;

  text-align: center;

  display: flex;

  flex-direction: column;

  justify-content: center;

}



.homePortfolio .innerLayer p,

.homePortfolio .innerLayer h3 {

  margin: 0 0 15px 0;

}



.homePortfolio .innerLayer h3,

.homePortfolio .innerLayer h3 a,

.homePortfolio .innerLayer p {

  color: white;

}



.homePortfolio .customBtns {

  background: #187ac3;

  align-self: center;

  padding: 6px 25px;

  color: #fff;

  border-radius: 20px;

  transition: all 0.35s ease;

  text-decoration: none;

}



.homePortfolio .customBtns:hover {

  border-radius: 0;

  color: #fff;

  text-decoration: none;

}



.homePortfolio .hover-grid-item:before {

  content: "";

  position: absolute;

  left: 0;

  top: 50%;

  transform: translateY(-50%);

  width: 100%;

  height: 0;

  background-color: rgba(0, 0, 0, 0.85);

  transition: all 0.25s ease;

  z-index: 1;

}



.homePortfolio .hover-grid-item:hover:before {

  height: 100%;

}



.homePortfolio .hover-grid-item:hover .innerLayer {

  opacity: 1;

  visibility: visible;

}



.homePortfolio .hover-grid-item {

  border: solid 1px #f1f1f1;

}



.homePortfolio .hover-grid-item img {

  transition: all 0.7s ease;

  transform: scale3d(1.0, 1.0, 1.0);

}



.homePortfolio .hover-grid-item:hover img {

  transform: scale3d(1.08, 1.04, 1.06);

}



/* new about page start here */

.aboutMain h2 {

  text-transform: uppercase;

  font-size: 36px;

  margin-bottom: 10px;

}



.aboutMain h4 {

  margin: 0 0 25px 0;

}



.aboutMain .leftRightSection {

  margin-top: 0;

}



.aboutMain p:first-of-type {

  margin-bottom: 0;

}



.leftRightSection {

  display: block;

  margin-top: 100px;

  list-style: none;

  padding: 0;

}



.leftRightSection li {

  list-style: none;

  display: flex;

  align-items: center;

  padding-bottom: 50px;

}



.leftRightSection figure {

  border-radius: 20px;

}



.leftRightSection img {

  border-radius: 20px;

}



.leftRightSection h2 {

  text-transform: uppercase;

  font-size: 36px;

  margin-bottom: 15px;

}



.leftRightSection li p {

  margin-bottom: 20px;

}



.leftRightSection li:first-of-type .col-right {

  padding-left: 70px;

}



.leftRightSection li:nth-of-type(2) .col-left {

  padding-right: 70px;

}



.boxLists {

  list-style: none;

  margin: 0;

  padding: 0;

  display: flex;

  flex-wrap: wrap;

}



.boxLists li {

  width: calc(33.33% - 10px);

  margin-right: 15px;

  border: 1px solid #edecec;

}



.boxLists li:nth-of-type(3n) {

  margin-right: 0;

}



.boxLists li:first-of-type,

.boxLists li:nth-of-type(2),

.boxLists li:nth-of-type(3) {

  margin-bottom: 70px;

}



.boxLists .wrap h2 {

  margin-top: 20px;

  margin-bottom: 15px;

}



.boxLists li .wrap {

  border: none !important;

}



.customTech h2.white_heading:before {

  border: 12px solid #126aab;

}



.customTech h2.white_heading {

  color: #fff;

  z-index: 9;

}



.customTech {

  padding: 50px 10px 10px;

  display: flex;

  flex-wrap: wrap;

  align-items: center;

}



.customTech .col-left {

  width: 40%;

}



.customTech .col-right {

  width: 60%;

  padding-left: 60px;

}



.customTech p {

  color: #fff !important;

}



.customTech ul {

  display: flex;

  flex-wrap: wrap;

  padding: 0;

  margin: 0;

  list-style: none;

}



.customTech li {

  width: calc(33.33% - 20px);

  margin-right: 30px;

  margin-bottom: 30px;

}



.customTech li:nth-of-type(3n) {

  margin-right: 0;

}



.serviceDrop {

  width: 310px;

}



.commanContentsNew h2 {

  margin-top: 25px;

}



.view-more img {

  transition: all 0.25s ease;

}



.view-more:hover img {

  margin-left: 10px;

}



.loadPortfolio,

.loadPortfolio-sec {

  text-align: center;

  padding-top: 40px;

}



.loadPortfolio a {

  cursor: pointer;

  background: #ec7408;

  border: solid 1px #ec7408;

  border-radius: 50px;

  padding: 10px 25px;

  color: #fff;

  transition: all 0.25s ease;

  text-decoration: none;

}



.loadPortfolio-sec a {

  cursor: pointer;

  background: #ec7408 !important;

  border: solid 1px #ec7408 !important;

  border-radius: 50px;

  padding: 10px 25px !important;

  color: #fff;

  transition: all 0.25s ease !important;

  text-decoration: none;

  width: auto !important;

  display: inline-block !important;

}



.loadPortfolio a:hover,

.loadPortfolio-sec a:hover {

  background: #fff !important;

  color: #ec7408 !important;

  text-decoration: none;

}



.slide-text>p.heading-banner {

  font-size: 45px;

  line-height: 1.2;

}



.project_completed {

  padding: 7.4% 6.1%;

}



.our_approach {

  padding: 30px 60px 2px;

}



textarea.form-control {

  height: 100px;

}



.textLimit3,

.textLimit2,

.textLimit {

  position: relative;

}



.textLimit3 textarea,

.textLimit2 textarea,

.textLimit textarea {

  padding-bottom: 20px !important;

}



.charNum {

  color: #fff;

  font-size: 14px;

  position: absolute;

  bottom: 3px;

  right: 20px;

}



.charNum2 {

  color: #555;

  font-size: 14px;

  margin-top: 5px;

  text-align: right;

}



.footerTop {

  margin-bottom: 15px;

}



.footerTop ul {

  padding: 0;

  margin: 0;

  margin-top: 30px;

}



.footerTop ul a {

  color: #fff;

  font-size: 16px;

  transition: all 0.25s ease;

}



.footerTop ul a:hover {

  color: #ed7b15;

  text-decoration: none;

}



.regOffice {

  margin-top: 25px;

}



.footerTop p a:hover {

  color: #ed7b15 !important;

  text-decoration: none;

}



.footerTop p {

  margin-bottom: 5px;

}



.footerTop p i {

  margin-right: 10px;

}



.footerRating ul.follow li a {

  margin-top: 0;

  width: 50px;

  height: 50px;

  line-height: 1em;

  display: flex;

  align-items: center;

  justify-content: center;

}



.footerRating ul.follow li a:hover {

  text-decoration: none;

}



.footerRating ul.list-unstyled.list-inline.follow {

  margin: 0 !important;

  display: flex;

  flex-wrap: wrap;

  justify-content: flex-end;

}



.footerRating {

  display: flex;

  align-items: center;

}



.footerRating h3 {

  text-align: center;

}



.middleMenu ul {

  display: flex;

  justify-content: flex-end;

  padding: 10px;

  border-top: solid 1px #fff;

  border-bottom: solid 1px #fff;

  margin: 25px 0px;

}



.middleMenu ul li {

  padding: 0 24px;

  border-right: solid 1px #fff;

}



.middleMenu ul li:last-of-type {

  padding-right: 0;

  border-right: 0;

}



.middleMenu ul li a {

  color: #fff;

  font-size: 16px;

  transition: all 0.25s ease;

}



.middleMenu ul li a:hover {

  color: #ed7b15;

  text-decoration: none;

}



.right-blog .sec-right ul.follow li a img.whiteT {

  width: 20px;

  margin-left: -15px;

  margin-right: 10px;

}



footer ul li {

  list-style: none;

}



.imp-image img,

.prof-image img,

.imp-image img {

  width: 100%;

  height: 100%;

  object-fit: cover;

}







/* responsive css start here@D */

@media (min-width:1400px) {

  a.quick_connet {

    right: 140px;

  }



  .ourApproach {

    display: flex;

    flex-wrap: wrap;

  }



  .ourApproach .our_approach {

    display: flex;

    flex-direction: column;

    height: 100%;

  }



  .aside .aside-contents {

    max-height: initial;

    min-height: auto;

  }

}



@media (min-width:1200px) and (max-width:1440px) {

  a.quick_connet {

    top: 25px;

    right: 100px !important;

  }



  h2 {

    font-size: 32px;

  }



  a.openNav {

    margin-top: 2px;

  }

}



@media (max-width:1199px) {

  #navbar .nav>li>a {

    padding: 10px 8px;

    text-align: center;

}

  .container {

    padding: 0 40px;

  }



  a.quick_connet {

    top: 68px;

    right: 102px !important;

  }

}



@media (max-width:1199px) {

  #navbar {

    margin-left: 0px !important;

  }



  .aside .aside-contents {

    max-height: initial;

    min-height: auto;

  }

}



@media (max-width:1080px) {

  .customTech li img {

    width: 100%;

  }



  .specialists .relatedBlog .wrap a img {

    width: 100%;

  }



  a.quick_connet {

    right: 85px;

  }



  .sticky__left {

    flex: 0 auto;

    width: calc(100% - 60%) !important;

  }



  h2 {

    font-size: 30px;

  }

}





@media (min-width:993px) and (max-width:1199px) {

  .icon_wrapper.row .openNav{

    position: static;

  }

  .navbar-nav>li:first-of-type>a {

    padding-left: 0;

  }



  .flex.navbar-container #navbar{

    width: auto;

  }



  .a.quick_connet {

    right: 104px;

    top: 70px;

  }



  /* .openNav {

    top: 63px;

    right: 40px;

  } */



  .slide-text {

    padding: 10px 25px;

  }



  .slide-text>p.heading-banner {

    margin-bottom: 30px;

  }



  .our_approach {

    padding: 30px 30px 2px;

  }



  .ourApproach {

    display: flex;

    flex-wrap: wrap;

  }



  .project_completed {

    padding: 42px;

    text-align: center;

  }



  a.view-more.pull-right {

    position: relative;

  }



  .our_approach.we p {

    min-height: auto;

    text-align: unset;

  }



  .box3 .our_approach.we .row {

    display: flex;

  }



  .box3 .our_approach.we .row .col-md-3 {

    display: flex;

    flex-wrap: wrap;

  }



  .box3 .our_approach.we .row .col-md-3 .view-more {

    margin-top: auto;

  }



  h2.white_heading {

    font-size: 42px;

  }



  .customTech h2.white_heading:before {

    height: 145px;

  }

}







@media (min-width: 768px) and (max-width: 992px) {

  .slide-text {

    padding: 10px 25px;

  }



  .slide-text>p.heading-banner {

    margin-bottom: 50px;

  }



 



  .client-testimonial {

    display: flex;

    flex-wrap: wrap;

    flex-direction: column-reverse;

  }



  .client-testimonial .col-md-8 {

    width: 100%;

  }



 



  .navbar-nav>li:first-of-type>a {

    padding-left: 0;

  }



  .start-project {

    padding: 15px 20px;
    background-color: #EC7408 !important ; 
    color:#fff !important ; 
    border: 2px solid #EC7408 !important ;

  }

  .start-project:hover {

    background-color: #fff !important; 
    color:#EC7408 !important; 
    border: 2px solid #EC7408 !important ;

  }

  .btn-default {
      background-color: #EC7408;
      color: white;
      border: 2px solid #EC7408;
      transition: all 0.3s ease;
    }

    .btn-default:hover {
      background-color: white !important;
      color: #EC7408 !important;
      border-color: #EC7408 !important;
    } 
  



  .our_approach.we p {

    min-height: auto;

  }



  .our_approach.we .col-md-3 {

    margin-bottom: 30px;

  }



  .our_approach.we .col-md-3:last-of-type {

    margin-bottom: 0;

  }



}



@media (max-width:991px) {

  .leftRightSection li:first-of-type .col-left {

    width: 40%;

  }



  .leftRightSection li:first-of-type .col-right {

    width: 60%;

  }



  .e-commerce.right .e-commerce-table .e-commerce-table-cell .e-commerce-h3 {

    margin-top: 15px;

  }



  .leftRightSection li:nth-of-type(2) .col-left {

    width: 60%;

  }



  .leftRightSection li:nth-of-type(2) .col-right {

    width: 40%;

  }



  .leftRightSection li {

    flex-wrap: wrap;

  }



  .leftRightSection li img {

    width: 100%;

  }



  .leftRightSection li {

    align-items: flex-start;

  }



  .leftRightSection li:nth-of-type(2) .col-left {

    padding-right: 30px;

  }



  .leftRightSection li:first-of-type .col-right {

    padding-left: 30px;

  }



  .footerTop p br {

    display: none;

  }

}







@media (max-width:767px) {







  h2 {

    font-size: 28px;

  }



  .boxLists {

    padding: 0 10px;

  }



  .boxLists li {

    margin-right: 0px;

    width: 100% !important;

    margin-bottom: 70px;

  }



  .boxLists li:first-of-type {

    margin-top: 70px;

  }



  .boxLists li .icons {

    margin: -60px auto 0;

  }



  .customTech .col-left {

    width: 100%;

    margin-bottom: 25px;

  }



  .customTech .col-right {

    width: 100%;

    padding-left: 0px;

  }



  .leftRightSection li:nth-of-type(2) .col-left {

    padding-right: 0px;

  }



  .leftRightSection li:first-of-type .col-right {

    padding-left: 0px;

  }



  .leftRightSection li:first-of-type .col-left {

    width: 100%;

    margin-bottom: 20px;

  }



  .leftRightSection li:first-of-type .col-right {

    width: 100%;

  }



  .leftRightSection li:nth-of-type(2) .col-left {

    width: 100%;

    margin-bottom: 50px;

  }



  .leftRightSection li:nth-of-type(2) .col-right {

    width: 100%;

    margin-top: 20px;

  }



  .leftRightSection li {

    flex-wrap: wrap;

    padding-bottom: 20px;

  }



  .slide-text>h1.heading-banner {

    font-size: 42px;

    margin-bottom: 0;

  }



 .pull-left {

    margin-right: 0;

    display: flex;

    justify-content: center;

}

.img-responsive{

    width: 100% !important;

}

  .slide-text>p.heading-banner {

    font-size: 28px;

  }



  .our_approach {

    padding: 15px;

  }



  .footerTop aside {

    margin-top: 30px;

  }



  .footerTop ul {

    margin-top: 20px;

  }



  .middleMenu ul {

    justify-content: center;

    margin: 20px 0px;

    flex-wrap: wrap;

  }



  .middleMenu ul li {

    margin-bottom: 10px;

  }



  .footerRating {

    flex-wrap: wrap;

  }



  .footerRating aside {

    width: 100%;

  }



  .footerRating ul.list-unstyled.list-inline.follow {

    justify-content: center;

  }



  .footerRating h3 {

    margin: 10px 0 20px;

  }



  .our_approach.we p {

    min-height: auto;

  }



  .our_approach.we .col-md-3 {

    margin-bottom: 30px;

  }



  .our_approach.we .col-md-3:last-of-type {

    margin-bottom: 0;

  }



  .openNav {

    position: absolute;

  }





  .slide-text>p {

    font-size: 13px;

    line-height: 16px;

    margin-top: 5px;
    margin-bottom:8px !important

  }



  .aside .aside-contents {

    max-height: 580px;

    min-height: 580px;

  }



  h2#mainCaptcha1 {

    text-align: left;

  }



  h2#mainCaptcha_con {

    text-align: left;

  }



  .relatedBlog {

    margin-top: 15px;

  }



  a.quick_connet {

    top: 3px;

    right: 60px !important;

  }

}



@media (max-width: 1200px) {

  .right-blog .sec-right ul.follow li a span {

    font-size: 12px;

  }

}



@media (max-width: 992px) {

  footer h3 {

    min-height: 70px;

    display: flex;

    align-items: center;

    justify-content: center;

}

  .e-commerce.right .e-commerce-table .e-commerce-table-cell .e-commerce-h3 {

    padding-top: 20px;

  }



  .e-commerce-table-cell .btn-default.btn-default4,

  .btn-default.btn-default6,

  .btn-default.btn-default3 {

    margin-right: 12px;

  }



  .leftRightSection {

    margin-top: 50px;

  }

}



@media (max-width: 820px) {

  .row.tabViewChange {

    flex-wrap: wrap;

  }



  p.impact__heading__content {

    max-width: 100% !important;

    width: 100%;

  }



  .sticky__left {

    padding-right: 0px;

    text-align: center;

  }



  .cro__block {

    align-items: center;

  }



  .cro__block p.cro__p {

    text-align: center;

  }



  section.web-service-importance .row {

    display: flex;

    flex-wrap: wrap;

  }



  .right-blog {

    margin-bottom: 15px;

  }



  .professionals {

    display: flex;

    justify-content: space-between;

  }



  .prof-text {

    width: 100%;

  }



  .prof-image {

    width: 100%;

  }



  .prof-image img {

    width: 100%;

  }



  section.web-service-importance .row {

    display: flex;

    flex-wrap: wrap;

  }



  .service-section {

    flex-wrap: wrap;

  }



  .imp-image img,

  .prof-image img,

  .prof-image {

    text-align: center;

    width: 100% !important;

  }



  .experience .prof-text {

    padding-left: 0px;

  }



  .team-section {

    padding: 0px 20px !important;

  }



  .team-section h2 {

    font-size: 26px;

  }



  .service__sec {

    padding: 0px !important;

  }



  .row.tabViewChange .col-md-8 {

    width: 100%;

  }



  .professionals {

    flex-wrap: wrap;

  }



  .prof-text {

    width: 100% !important;

    padding-left: 0px;

    padding-top: 20px;

    text-align: center;

  }



  .sticky__left {

    width: 100% !important;

  }



  .cro__block {

    max-width: 100% !important;

    width: 100%;

  }



  .experience {

    flex-wrap: wrap;

  }

}





.right-blog .sec-right ul.follow li a {

  display: flex;

  justify-content: center;

  align-items: center;

  width: 100%;

}



/*.right-blog .sec-right ul.follow li a span{

  display : none;

 }*/

.a.quick_connet {

  right: 15px;

}



@media (max-width: 768px) {

  .e-commerce-wrap {

    min-height: 0px;

  }

}



@media (max-width: 570px) {
  .slide-text {
    padding: 0 40px !important;
    height: 100%;
}

  section.professional-web-design .row {

    flex-wrap: wrap;

}

section.professional-web-design .row .interchange {

  padding-right: 0px;

  padding-bottom: 20px;

}

article.container h2.white_heading {

  font-size: 32px !important;

}

section.professional-web-design.help.main-tp .raw {

  display: none;

}

section.professional-web-design.help.main-tp {

  padding: 0px;

}

ul.list-unstyled.list-inline.follow li.col-sm-6 {

  width: 100%;

}

section#portfolio .col-sm-9 {

  padding: 0px;

}

section.professional-web-design.help.main-tp .heading-content {

  margin: 0px;

}

section.professional-web-design .professionals {

  width: 100% !important;

}

section.professional-web-design .professionals .interchange{

  padding-right: 0px !important;

}

  h2.white_heading.why_cho, h2.white_heading.why_cho span {

    font-size: 36px !important;

    margin-bottom: 10px;

    font-weight: 600;

    line-height: 1.2;

}

.testimonial h2.white_heading {

    font-size: 36px !important;

}

  #mainNav .navbar-brand {

    font-size: 30px; 

}

.navbar-header:before {

  left: 100px;

}

a.quick_connet {

  top: 8px !important;

}

.flex.navbar-container div#navbar .top-services li {

  width: 100%;

}

.openNav {

  position: absolute;

  top: 6px;

  font-size: 25px !important;

  width: 40px;

}

.sidenav .closebtn {

  margin-right: 0;
right:7px;
  top: 5px;

}



  .web-service .raw .web-design-box.eightcommon {

    width: 100% !important;

    margin-right: 0px !important;

  }



  .web-service .web-design-box {

    width: 100% !important;

    margin-right: 0px !important;

  }



  .web-service .web-design-box::nth-child(2n) {

    margin-right: 0px !important;

  }



  .customTech li {

    width: calc(50% - 15px);

    margin-right: 30px;

  }



  .customTech li:nth-of-type(2n) {

    margin-right: 0;

  }

  .col-sm-12.first-blog h1 {

    font-size: 25px;

}



.aboutMain h2 {

  font-size: 25px;

  font-weight: 600;

}

  h2 {

    font-size: 20px !important;

    line-height: 1.5;

}



  h2.intro__h2__tiny {

    margin-top: 15px;

  }



  .enquirynowbutton {

    max-width: 160px !important;

    padding: 12px 20px !important;

    font-size: 14px;

  }



  .web-service .eightcommon {

    width: 100% !important;

    margin-right: 0px !important;

  }



  .carousel.bs-slider.inner-top .heading-banner {

    font-size: 26px;

    line-height: 1.5;
  text-align: center;
  }



  article.container .row .col-md-12 h1 {

    font-size: 24px;

}

  .openNav {

    right: 10px;

  }



  .professionals .prof-text h2 {

    padding-top: 0px !important;

  }



  .carousel.bs-slider.inner-top .slide-text {

    padding: 10px !important;

  }

}



/* new css  */

.professional-web-design {

  width: 100%;

  padding: 0px 0 20px;

}



.web-service h2 {

  text-align: center;

}



.professionals {

  display: flex;

  justify-content: space-between;

}



section.professional-web-design.help .professionals {

  width: 50%;

}



.prof-text {

  width: 50%;

}



.prof-text h3 {

  line-height: 50px;

}



.prof-text p {

  width: 90%;

}



.prof-image {

  width: 50%;

  padding-top: 10px;

}



.row.tabViewChange .container {

  display: flex;

}



.web-service {

  width: 100%;

  padding-bottom: 0px;

}



.main-tp {

  padding-top: 50px;

}



.faq-container h2 {

  text-align: center;

  margin: 0px;

  padding-bottom: 48px;

}



.img-right-rds {

  border-top-right-radius: 30px;

  border-bottom-right-radius: 30px;

}



.img-left-rds {

  border-top-left-radius: 30px;

  border-bottom-left-radius: 30px;

}



.web-service .descp {

  width: 100%;

  margin: 0 auto;

  text-align: center;

  padding-bottom: 30px;

}



.web-service-importance h2 br {

  display: none;

}



.web-service .raw {

  display: flex;

  width: 100%;

  flex-wrap: wrap;

}



a.view-more.view-more2.pull-left {
    background-color: #EC7408;

    color: #fff;
    
    font-size: 20px;
    
    padding: 10px 20px;
    
    border-radius: 30px;
    
    border: 2px solid transparent; 
}

a.view-more.view-more2.pull-left:hover {
    border: 2px solid #EC7408 !important;
    background-color: #fff !important;
    color: #EC7408 !important;
}



a.view-more.view-more2.pull-left img {

  display: none;

}



.web-service .web-design-box {

  text-align: center;

  width: 30%;

  border-radius: 30px;

  padding: 40px 0px;

  border: 1px solid #D2D2D2

}



.web-service .eightcommon {

  width: calc(25% - 15px);

  margin: 0px 20px 20px 0px;

  text-align: center;

}



.web-service .web-design-box {

  text-align: center;

  width: calc(100%/3 - 20px);

  border-radius: 30px;

  padding: 40px 0px;

  border: 1px solid #D2D2D2;

  margin: 0px 20px 20px 0px;

}



.web-service .web-design-box.eightcommon {

  width: calc(100%/4 - 12px);

  margin-right: 15px !important;

}



.web-service .eightcommon:nth-child(4n) {

  margin-right: 0px !important;

}



/* .web-service .web-design-box:nth-child(3n) {

  margin-right: 0;

} */

.web-service .web-design-box.eightcommon:nth-child(4n) {

  margin-right: 0px;

}



.web-design-box br {

  display: none !important;

}



.row.tabViewChange h3 {

  font-size: 30px;
  text-transform: none;
}

h1,strong{
  text-transform: none;
}





.web-service-importance .imp-image ul {

  text-align: start;

}



.web-service .web-design-box p {

  text-align: center;

  font-weight: 600;

  line-height: 33px;

  padding: 20px 15px 10px 15px;

  color: #187AC3;

  text-align: center;

  font-size: 22px;

}



.web-service .web-design-box .description {

  text-align: center;

  font-size: 16px;

  font-weight: 400;

  line-height: 30px;

  text-align: center;

  color: #666666;

  padding: 0px 20px;



}



.web-service-importance {

  width: 100%;

  float: none;

  background: #FDFDFD;

  padding: 30px 0;

}



.choose .imp-image {

  text-align: end;

}



.portfolio_inner {

  padding: 30px 0;

}



.web-service-importance .imp-image {

  width: 50%;

}



/* .web-service-importance .imp-image img{

  width: 100%;

} */

.web-service .web-design-box img {

  text-align: center;

  width: 65px;

}



.web-service-importance .imp-text {

  width: 50%;

  padding-left: 60px;

}



.web-service-importance .imp-text h2 {

  margin-bottom: 15px;

}



section.web-service-importance.choose .imp-text {

  padding: 0px 50px 20px 0px !important;

}



.web-service-importance ul {

  padding: 0px 20px 0px 0px;

}



.web-service-importance ul li {

  list-style-type: none;



}



.web-service-importance .imp-text li {

  padding-bottom: 6px;

  line-height: 1.8;

}



.web-service-importance ul li span {

  font-size: 20px;

  font-weight: 600;

  color: #666666;



}



.web-service-importance .imp-bottom-text {

  float: left;

  width: 100%;

  display: flex;

}



.web-service-importance .imp-bottom-text ul {

  display: flex;

  flex-wrap: wrap;

  gap: 20px;

}



.choose {

  background-color: #FFFFFF;

  padding: 35px 0 0px;

}



section.web-service-importance.choose>.container {

  border-bottom: solid 1px #D9D9D9;

  padding-bottom: 55px;

}



.choose .imp-text {

  padding-top: 0px !important;

}





.web-service-importance .imp-bottom-text li {

  width: 49%;

  float: left;

}



.imp-bottom-text-ul {

  width: 49%;

  float: left;

}



.imp-bottom-text-ul li {

  width: 100% !important;

  padding: 30px 10px 20px 20px !important;

}



.second {

  margin-top: -30px;



}



.second li {

  padding: 20px 10px 20px 20px !important;

}



.chooseheading ul li {

  padding: 10px 10px 20px 0px;

}



.service__sec {

  width: 100%;

  float: left;

}

.we_serve_wrapper .service__sec {

  width: 100%;

  text-align: center;

}



.service-section {

  justify-content: space-between;

  margin-left: auto;

  margin-right: auto;

  padding-top: 20px;

  padding-bottom: 20px;

  display: flex;

}



.sticky__left {

  flex: 0 auto;

  width: calc(100% - 530px);

  padding-right: 80px;

}



p.impact__heading__content {

  max-width: 420px;

  width: 100%;

}



p {

  margin: 0 0 10px;

  line-height: 28px;

}



.sticky__wrap {

  position: sticky;

  top: 148px;

}



.cro__right {

  flex-flow: wrap;

  flex: 1;

  justify-content: space-between;

  display: flex;

  position: relative;

}



.cro__block {

  color: #191919;

  border: 1px solid #D2D2D2;

  border-radius: 30px;

  flex-direction: column;

  flex: 0 auto;

  margin-bottom: 40px;

  padding: 35px;

  text-decoration: none;

  transition: all .2s cubic-bezier(.165, .84, .44, 1);

  display: flex;

  position: relative;

  max-width: 100%;

}



.cro__block img {

  width: 64px;

  height: 64px;



}



.service__h2 {

  color: #187AC3;

  text-align: left;

  padding: 20px 0px;

  font-size: 24px;

  margin: 0px;

  font-weight: 700;

}



.dotted__cro {

  /* border: 1px dashed #1919194d;

    width: 58px;

    height: 1px;

    position: absolute;

    inset: 50% auto auto -58px; */

  display: none;

}



.heading-content {

  /* max-width: 1030px; */

  width: 100%;

  text-align: center;

  /* margin: 0 auto 50px; */

}



.section.service__sec {

  padding-top: 0px;

}



.heading-content h2 {

  margin-bottom: 30px;

}



.web-service-importance .heading-content h2 {

  margin-bottom: 35px;

}



.professionals .prof-text h2 {

  padding-top: 25px;

}



.web-service-importance .imp-image img {

  width: 100%;

}



.line {

  display: none;

}



.we_team {

  width: 100%;

  display: flex;

  background: #187AC3;

  border-radius: 100px 100px 0px 0px;

  /* height:200px; */

}



.team-section {

  width: 100%;

  padding: 0px 100px;

  text-align: center;

}



.team-section h2 {

  color: #FFFFFF;

  text-align: center;

  font-size: 40px;

}



.portfolio_inner .owl-nav {

  display: none;

}



.portfolio_inner .homePortfolio {

  padding-bottom: 0px;

}



.team-section p {

  max-width: 1020px;

  width: 100%;

  margin: 0 auto;

  padding: 0px 10px 20px;

  color: #FFFFFF;

  text-align: center;

}



.experience {

  padding: 55px 0px 0px 0px;

  display: flex;

  align-items: center;

}



.experience .prof-text {

  padding-left: 60px;

}



.bottom-text {

  width: 100%;

  float: left;

  padding-top: 80px;

}



.yearstext {

  width: 70%;

  float: left;

}





.yearstext button {

  display: inline;

  margin: left;

}



.choose .imp-bottom-text ul {

  margin-top: 0px;

  padding-top: 0px;

}



.webdesignportfolio {

  padding-bottom: 0px !important;

}



.interchange {

  padding: 0px 25px 0 0px;

  width: 100%;

}



.sheffield {

  padding-top: 100px;

}



.choose h2.chooseheading,

.service-section h2.intro__h2__tiny,

.we_team .team-section h2 {

  text-transform: uppercase;

}



.help ul li {

  list-style-type: none;

  font-family: 'proxima_nova_rgbold', Helvetica, Arial, sans-serif;

  font-size: 20px;

  font-weight: 400;

  line-height: 28px;

  text-align: left;

}



.imp-bottom-text-p {

  width: 100%;

  float: left;

  padding: 40px 60px 0px 60px;

}



.imp-bottom-text-p p {

  text-align: center;

}



.enquirynowbutton {

  display: block;

  margin: 0 auto;

  max-width: 240px;

  width: 100%;

  padding: 21px 60px;

  border-radius: 60px;

  display: flex;

  justify-content: center;

}



.row.tabViewChange {

  margin: 0px;

}

@media (min-width:992px) and (max-width:1024px) {

  #mainNav {

    position: relative;

    margin-bottom: 0;

}

}



@media (min-width:300px) and (max-width:1024px) {

  .prof-text p {

    width: 100%;

  }



  .col-md-4.des-display {

    width: 100% !important;

    padding-left: 10px;

  }



  .experience {

    align-items: start;

  }



  .professionals.experience h2 {

    margin-bottom: 10px;

  }



  .professionals.experience .prof-image {

    padding-top: 0px;

  }



  .web-service-importance .imp-text {

    padding-left: 0px;

  }



  .web-service-importance .imp-text {

    padding-left: 20px;

  }



  .web-design-box p {

    text-align: center;

    font-size: 22px;

  }



  .web-service-importance .imp-image {

    width: 100%;

  }



  .web-service-importance .imp-text {

    width: 100%;

    text-align: -webkit-auto;

  }



  .web-service-importance .imp-bottom-text li {

    width: 100%;

    float: left;

  }



  .web-service-importance .imp-bottom-text {

    width: 100%;

  }



  .web-service-importance .imp-text h2 {



    font-size: 32px;

  }

}







@media (max-width:1024px) {

  div#navbar .start-project {

    margin: 0 auto;

    max-width: 200px;

    width: 100%;

    display: flex;

 justify-content: center;
}

  .middleMenu ul {

    justify-content: center;

}

  #mainNav {

    background-color: #424242;

}

  a.quick_connet {

    top: 3px;

    right: 56px !important;

    position: absolute;

  }

  .navbar-header, .navbar-nav {

    float: unset !important;

}

  .openNav {

    position: absolute;

  }

  .desk {

    display: none;

}

  .navbar-header .mobile_menu {

    display: block !important;

}

  .flex.navbar-container {

    display: flow !important;

   

}

div#navbar ul.nav.navbar-nav.top-services {

  display: flex;

  flex-wrap: wrap;

  margin: 25px 0px;

}

.navbar-nav>li>.dropdown-menu li {

  width: 100% !important;

}



div#navbar .start-project {

  margin: 0;

}

div#navbar .icon_wrapper.row {

  justify-content: center;

}

div#navbar .top-services li {

  display: block;

  width: 50%;

  border: 1px solid #202020;

}

.flex.navbar-container #navbar{

  width: 100%;

}

  .web-service .web-design-box.eightcommon {

    width: calc(50% - 10px);

    margin-right: 20px !important;

  }



  .web-service .web-design-box.eightcommon:nth-child(2n) {

    margin-right: 0px !important;

  }



  .web-service-importance ul {

    padding: 0px 10px 0px 10px;

    text-align: -webkit-auto;

  }



  .web-service .web-design-box {

    text-align: center;

    width: calc(50% - 10px);

    margin: 0px 20px 20px 0px;

  }



  .web-service .web-design-box:nth-child(2n) {

    text-align: center;

    margin-right: 0px;

  }



  .prof-text {

    padding-right: 30px;

  }



  section.web-service-importance.choose .imp-text {

    padding-right: 20px !important;

  }



}





@media (max-width:767px) {



  .we-are-creative .row{

   margin: 0px !important;

  }



  .intro__h2__tiny {

    margin: 15px 0;

  }



  .sticky__wrap {

    position: sticky;

    top: 148px;

    margin: 15px 0;

  }



  .heading-content h2 {

    margin: 20px 0;

  }



  .prof-text {

    padding-right: 0px;

  }



  .web-service-importance .imp-text li {

    text-align: center;

  }



  .web-service-importance ul {

    padding: 0px;

  }



  .testimonial .row,

  .logos .row {

    margin: 0px !important;

  }



  .customTech {

    padding: 50px 20px 20px;

    display: flex;

    flex-wrap: wrap;

    align-items: center;

  }



  section.web-service-importance.choose>.container {



    padding-bottom: 30px;

  }



  section.web-service-importance.choose .imp-text {

    padding-right: 0px !important;

  }



  .container {

    padding: 0 20px !important;

  }



  .faq-header {

    font-size: 18px;

  }



  .experience .prof-text {

    padding-left: 0px;

  }



  .we_team {

    border-radius: 50px 50px 0px 0px;

  }



  .main-tp {

    padding-top: 30px;

  }



  .prof-text p {

    width: 100%;

  }



  .web-service .descp {

    width: 100%;

  }



  .cro__right .service__h2 {

    text-align: center;

    font-size: 20px;

  }



  .cro__block {

    align-items: center;

  }



  .team-section h2 {

    font-size: 30px;

  }



  .faq-container h2 {

    padding-bottom: 30px;

  }



  .row.tabViewChange .container {

    display: flex;

    flex-wrap: wrap;

  }



  .row.tabViewChange .col-md-4 {

    width: 100%;

  }



  .choose {

    padding: 0px 0 0px;

  }



  .web-service-importance .imp-text {

    padding-top: 20px;

    padding-left: 0px;

  }



  .heading-content {

    margin: 0 auto 20px;

  }



  .web-service-importance .imp-image {

    margin-bottom: 20px;

  }



  .sticky__left {

    padding-right: 0px;

  }



  p.impact__heading__content {

    max-width: 100%;

    width: 100%;

  }



  a.view-more.view-more2.pull-left {

    max-width: 200px;

    margin: 20px auto 0;

  }





}



#refresh {

  left: 240px !important;

  bottom: 40px !important;

}

.capt input#txtInput_con {

  max-width: 270px;

  padding: 20px;

}



.we_serve_wrapper .container.center.area {

  margin-top: 15px;

  margin-bottom: 40px;

}

.we_serve_wrapper .area__button {

  background-color: #eb3d08;

  color: #fff;

  letter-spacing: .5px;

  text-transform: none;

  border-radius: 5px;

  margin-left: 16px;

  margin-right: 16px;

  padding: 20px 40px 14px;

  font-size: 20px;

  font-weight: 500;

  display: inline-block;

}



.we_serve_wrapper h2{

  color: #1c098f;

  margin-top: 0;

  margin-bottom: 24px;

  font-size: 32px;

  font-weight: 700;

  line-height: 1.3;

}



.we_serve_wrapper .w-inline-block {

  max-width: 100%;

  display: inline-block;

}

.profile-buttons-wrapper button.btn.btn-success {

  padding: 8px 32px !important;

} 

.specialists .relatedBlog .wrap h3 {

  min-height: 80px;

}

.specialists .relatedBlog .wrap p {

  min-height: 110px;

}

.specialists .relatedBlog .wrap .readBtns{

  padding-bottom: 10px;

}



.contact_btn {
  background-color: #187ac3 !important;
  border: 2px solid #187ac3 !important;
   color: #fff !important;
   transition: color 0.3s ease;
}

.contact_btn:hover {
  background-color: #fff !important;
  color: #187ac3 !important;
  border: 2px solid #187ac3 !important;
}


.icon_wrapper.row {

  display: flex;

  align-items: center;

  gap: 10px;

}

.row{

  margin-left: 0px !important;

  margin-right: 0px !important;

}

.des-display {

  padding: 0px;

  margin: 0px;

}

h2.white_heading {

  font-size: 55px !important;

}

.flex.navbar-container {

  display: flex;

  justify-content: space-between;

  padding-top: 10px;

}

.flex.navbar-container #navbar{

  margin-left: 0px;

}



.navbar-header .mobile_menu {

  display: none;

}

a.x-icon:hover {

  background: #d8d9d8 !important;

}

h2#mainCaptcha_con, h2#mainCaptcha_start,  h2#mainCaptcha1{

  background-image: url('/images/captcha.avif');

  background-size: cover;

  background-repeat: no-repeat;

  background-position: center;

  max-width: 240px;

  padding: 10px;

  color: #fff !important;

  position: relative;

  user-select: none;

}

.specialists .relatedBlog .wrap a img {

  width: 100%;

  padding-top: 5px;

}

@media (max-width: 1280px){

  .icon_wrapper.row .btn{

    padding: 15px 15px;

    font-size: 15px;

  }

  

}


@media (max-width: 480px){
  .slide-text>p.heading-banner{
    font-size:26px;

  }

  .slide-text>p{
    font-size:12px;
    line-height: 12px;
  }

}


.whatsapp-float {
  position: fixed;
  width: 60px;
  height: 60px;
  bottom: 130px;
  right: 25px;
 
  color: #fff;
  border-radius: 50px;
  text-align: center;
  box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.3);
  z-index: 999;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.2s;
}
.whatsapp-float:hover {
  transform: scale(1.1);
}
.whatsapp-float img {
  width: 100%;
  height: 100%;
}


/* .project_completed2 {
  text-align: center;
}

.circular-chart {
  max-width: 120px;
  display: block;
  margin: 0 auto;
}

.circle-bg {
  fill: none;
  stroke: #eee;
  stroke-width: 3.8;
}

.circle {
  fill: none;
  stroke-width: 3.8;
  stroke: #00acc1;
  stroke-linecap: round;
  animation: progress 1s ease-out forwards;
}

.percentage {
  fill: #333;
  font-size: 0.5em;
  text-anchor: middle;
}

@keyframes progress {
  0% {
      stroke-dasharray: 0, 100;
  }
}

.project_completed {
  text-align: center;
}

.circular-chart {
  max-width: 120px;
  display: block;
  margin: 0 auto;
  transform: rotate(-90deg); 
}

.circle-bg {
  fill: none;
  stroke: #eee;
  stroke-width: 3.8;
}

.circle {
  fill: none;
  stroke-width: 3.8;
  stroke: #4caf50;
  stroke-linecap: round;
  transition: stroke-dasharray 1s ease-out;
}

.percentage {
  fill: #333;
  font-size: 0.5em;
  text-anchor: middle;
  dominant-baseline: middle;
  transform: rotate(90deg); 
  transform-origin: center;
} */

/* .box2 {
  display: flex;
  gap: 40px;
  justify-content: center;
  flex-wrap: wrap;
} */

.project_completed {
  text-align: center;
}

.circular-chart {
  width: 120px;
  height: 120px;
  transform: rotate(-90deg);
}

.circle-bg {
  fill: none;
  stroke: #eee;
  stroke-width: 3.8;
}

.circle {
  fill: none;
  stroke-width: 3.8;
  stroke-linecap: round;
  transition: stroke-dasharray 1s ease-out;
}

/* Unique style for PROJECTS COMPLETED */
.circular-chart.full .circle {
  stroke: #4caf50; /* green */
}

/* Unique style for RETURNING CLIENTS */
.circular-chart.returning .circle {
  stroke: #00acc1; /* blue */
}

.percentage {
  fill: #333;
  font-size: 0.5em;
  text-anchor: middle;
  dominant-baseline: middle;
  transform: rotate(90deg);
  transform-origin: center;
}