@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;300;400;500;600;700;800;900&amp;display=swap');

:root {
  --pink:#EF3C89;
  --black:#000;
  --white:#fff;
  --grey:#666;
  --border-radius: 1rem;
  --box-shadow: 0rem 0.5rem 1rem rgba(0, 0, 0, 0.1);
}

*{
  font-family: 'Poppins', sans-serif; font-size:15px;
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  outline: none;
  border: none;
  -webkit-transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
  transition: all 0.2s linear;
  text-decoration: none;
}

html {
  font-size: 62.6%;
  overflow-x: hidden;
  scroll-padding-top: 7rem;
  scroll-behavior: smooth;
}

html::-webkit-scrollbar {
  width: 0.8rem;
}

html::-webkit-scrollbar-track {
  background: var(--pink);
}

html::-webkit-scrollbar-thumb {
  background: var(--black);
  border-radius: 0.5rem;
}
a:focus, a:hover{text-decoration:none}
p{line-height:25px}
section {
  padding: 2rem 5%;
}

.swiper-pagination-bullet{
  height: 1rem;
  width: 1rem;
  border-radius: 50rem;
  background-color: var(--grey);
}

.swiper-pagination-bullet-active{
  background-color: var(--pink);
}
.mt30{margin-top:30px}
.mb30{margin-bottom:30px}
/*--------------------- 0- Global CSS (End) ---------------------*/



/*--------------------- 1- Heading CSS (Start) ---------------------*/
.heading h2{
  color: var(--black);
  text-align: center;
  padding-bottom: 2rem;
  text-transform: uppercase;
  font-size: 4rem;
  font-weight: bold;
}

.heading span {
  color: var(--pink);
  text-transform: uppercase;
}

/*--------------------- 1- Heading CSS (End) ---------------------*/



/*--------------------- 2- Button CSS (Start) ---------------------*/
.btn,.contbx .wpcf7-submit {
  display: inline-block;
  color:#fff;
  background:linear-gradient(89deg, #EF3C89 0%, #CB41AB 100%);
  text-decoration: none;
  padding:5px 18px;font-weight: 700;
}

.btn:hover,.servicbx .btn:hover,.contbx .wpcf7-submit:hover{
  cursor:pointer;color:#fff;background:linear-gradient(180deg, #CB41AB 0%, #EF3C89 89%);
}
/*--------------------- 2- Button CSS (End) ---------------------*/



/*--------------------- 3- Header Area CSS (Start) ---------------------*/
.header{position:fixed;z-index:1100;background:#fff;width:100%}
.header.sticky{box-shadow:0 1rem 2rem rgb(0 0 0 / .2)}
.logo{float:left;width:30%;padding:5px 0}
.hedmenu{float:left;width:60%}
.hedbtn{float:left;width:10%;text-align:right;padding:9px 0}
.logo img{width:200px}
.navbar{margin:0;min-height:0}
.navbar li{float:left;display:block}
.navbar a{display:inline-block;font-size:16px;color:#222;margin:0 10px;text-transform:uppercase;font-weight:500;padding:12px 0 !important;}
.navbar a:hover,.navbar a.active{border-bottom:2px solid #C542B1;padding-bottom:2px}
.menu-item-has-children:hover .sub-menu{display:block}
.sub-menu{display:none;position:absolute;background:#f9f9f9;padding:5px 3px 10px;box-shadow:0 8px 16px 0 rgb(0 0 0 / .2);z-index:1}
.sub-menu li{float:none;padding:3px 0}
.sub-menu li a{font-size:14px;text-transform:capitalize;font-weight:400;padding:0 !important}
#menu-btn{font-size:3rem;color:#000;-webkit-transition:all 0.5s;-moz-transition:all 0.5s;-o-transition:all 0.5s;transition:all 0.5s;display:none}
#menu-btn:hover{cursor:pointer}
/*--------------------- 3- Header Area CSS (End) ---------------------*/



/*--------------------- 4- Home Area CSS (Start) ---------------------*/
.home{
  width: 100%;
  padding: 0;
}

.home-slider .swiper-pagination-bullet{
  height: 1.5rem;
  width: 1.5rem;
  background:#fff;
}

.home-slider .swiper-pagination-bullet-active{
  background-color: var(--pink);
}

.home-item img{
  height: 100%;
  width: 100%;
  object-fit: cover;
}
.swiparrow::after{font-size:14px;background:#fff;color:#000;font-weight:700;text-align:center;border-radius:50%;padding:5px 13px 5px 11px}

/*--------------------- 4- Home Area CSS (End) ---------------------*/



/*--------------------- 5- About Area CSS (Start) ---------------------*/
.about .box-container{
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 2rem;
}

.about .image{
  -webkit-box-flex: 1;
  -ms-flex: 1 1 40rem;
      flex: 1 1 40rem;
  height: 50rem;
  border-radius: var(--border-radius);
  overflow: hidden;
}

.about .image img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.about .content{
  -webkit-box-flex: 1;
  -ms-flex: 1 1 40rem;
      flex: 1 1 40rem;
}

.about .content h1{
  font-size: 3.5rem;
  color: var(--pink);
  padding-bottom: 1.5rem;
}

.about .content p{
  font-size: 1.6rem;
  color: var(--grey);
  line-height: 1.6;
  padding-bottom: 1.5rem;
}

.about .content .btn {
  padding-top: 1rem;
}

.about-info{
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 1rem;
  padding-top: 3rem;
}

.about-info .info-box{
  -webkit-box-flex: 1;
  -ms-flex: 1 1 15rem;
      flex: 1 1 15rem;
  background-color: var(--pink);
  border-radius: var(--border-radius);
  text-align: center;
  padding: 1.5rem;
}

.about-info .info-box i{
  font-size: 4rem;
  color: var(--white);
}

.about-info .info-box .count{
  color: var(--white);
  font-size: 3rem;
  padding: 1rem 0;
}

.about-info .info-box h5{
  font-size: 1.8rem;
  font-weight: 500;
  color: var(--white);
}

/*--------------------- 5- About Area CSS (End) ---------------------*/



/*--------------------- 6- Services Area CSS (Start) ---------------------*/
.services .box-container{
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 1.5rem;
}

.service-item{
  -webkit-box-flex: 1;
  -ms-flex: 1 1 33rem;
      flex: 1 1 33rem;
  text-align: center;
  padding: 2rem;
  border-radius: var(--border-radius);
}

.service-item:hover{
  -webkit-box-shadow: var(--box-shadow);
          box-shadow: var(--box-shadow);
}

.service-item .icon{
  display: inline-block;
  font-size: 2rem;
  border: 0.1rem solid rgba(0, 0, 0, 0.2);
  border-radius: 50%;
  color: var(--white);
  margin: 0rem auto;
}

.service-item i{
  height: 5rem;
  width: 5rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  border-radius: 50%;
  margin: 0.5rem;
  background-color: var(--pink);
}

.service-item h3{
  font-size: 2rem;
  color: var(--black);
  padding: 1rem 0;
}

.service-item p{
  color: var(--grey);
  font-size: 1.6rem;
  line-height: 1.6;
}

/*--------------------- 6- Services Area CSS (End) ---------------------*/



/*--------------------- 7- Destinations Area CSS (Start) ---------------------*/
.destination-slider{
  position: relative;
  padding-bottom: 4rem;
  overflow: hidden;
}

/*--------------------- 7- Destinations Area Area CSS (End) ---------------------*/


/*--------------------- 11- Blog Area CSS (Start) ---------------------*/
.blogs .box-container{
  display: -ms-grid;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(33rem, 1fr));
  gap: 2rem;
}

.blog-item{
  -webkit-box-shadow: var(--box-shadow);
          box-shadow: var(--box-shadow);
  background-color: var(--white);
  border-radius: var(--border-radius);
  position: relative;
  overflow: hidden;
}

.blog-item .title{
  position: absolute;
  top: 1rem;
  left: 0;
  color: var(--white);
  background-color: var(--black);
  opacity: 0.8;
  font-size: 1.7rem;
  line-height: 1.6;
  padding: 0.5rem 1rem;
  width: 10rem;
  text-align: center;
}

.blog-item .image{
  height: 25rem;
}

.blog-item .image img{
  height: 100%;
  width: 100%;
  object-fit: cover;
}

.blog-item .content{
  padding: 2rem 1rem;
}

.blog-item .content .main-heading{
  display: inline-block;
  font-size: 2.5rem;
  font-weight: bold;
  color: var(--black);
}

.blog-item .main-heading:hover{
  color: var(--pink);
}

.blog-item .content p{
  padding: 1.5rem 0;
  font-size: 1.5rem;
  color: #666;
  line-height: 1.5;
}

/*--------------------- 11- Blog Area CSS (End) ---------------------*/



/*--------------------- 12- Contact Area CSS (Start) ---------------------*/
.contact iframe{
  height: 30rem;
  border-radius: var(--border-radius);
  width: 100%;
}

.contact .box-container{
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 1rem;
  margin-top: 1rem;
}

.contact-info{
  background-color: var(--white);
  -webkit-box-flex: 1;
  -ms-flex: 1 1 40rem;
      flex: 1 1 40rem;
  -webkit-box-shadow: var(--box-shadow);
          box-shadow: var(--box-shadow);
  border-radius: var(--border-radius);
  padding: 1.5rem;
}

.contact-info h3{
  font-size: 3rem;
  color: var(--black);
}

.contact-info > p{
  font-size: 1.6rem;
  color: var(--grey);
  padding: 0.5rem 0;
}

.contact-info .info-item{
  padding: 1rem 0;
}

.contact-info .info-item .gmail{
  text-transform: none;
}

.contact-info .info-item h4{
  font-size: 2rem;
  color: var(--black);
}

.contact-info .info-item .detail{
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.contact-info .info-item .detail .icon{
  color: var(--pink);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  font-size: 1.5rem;
}

.contact-info .info-item .detail p{
  font-size: 1.8rem;
  color: var(--grey);
  line-height: 1.6;
  padding-left: 1rem;
}

.contact .form{
  -webkit-box-flex: 1;
  -ms-flex: 1 1 40rem;
      flex: 1 1 40rem;
  background-color: var(--white);
  -webkit-box-shadow: var(--box-shadow);
          box-shadow: var(--box-shadow);
  border-radius: var(--border-radius);
  padding: 2rem;
  text-align: center;
}

.contact .form h2{
  font-size: 2.5rem;
  color: var(--black);
  text-transform: uppercase;
  text-align: center;
  padding-bottom: 1.5rem;
}

.contact .form .box{
  width: 100%;
  background: transparent;
  border: 0.1rem solid var(--black);
  padding: 1.5rem;
  margin-bottom: 1rem;
  font-size: 1.8rem;
  color: var(--black);
  text-transform: none;
}

.contact .form .box::placeholder{
  color: var(--grey);
  text-transform: capitalize;
}

.contact .form .box:focus {
  background: transparent;
  border-color: var(--pink);
}

.contact .form textarea {
  height: 20rem;
  resize: none;
}

.contact .alert{
  font-size: 2rem;
  color: var(--pink);
  padding-left: 1rem;
}

/*--------------------- 12- Contact Area CSS (End) ---------------------*/



/*--------------------- 13- Footer Area CSS (Start) ---------------------*/
footer{background:#222;padding:30px 0 0}
footer .abt{margin-top:10px;padding-right:51px;font-size:14.5px}
footer h2 {
  color: #fff;
  font-size: 19px;
  font-weight: 600;
  margin: 6px 0 25px;
}
footer h2::after {
  content: '';
  position: absolute;
  width: 100px;
  height: 2px;
  border-radius: 4px;
  top: 35px;
  left: 15px;
  background: linear-gradient(80deg,#EF3C89 0%, #CB41AB 89%);
  z-index: 11;
}
footer p{
  color:#EAEAEA;
}
footer .social{
    margin: 1rem 0;
}
footer .social a i{
    color:#fff;
    font-size:30px;margin: 10px 10px 0 0;
}
footer .links li{color:#aeaeae}
footer .info p,footer .links a{
  display: block;
  color: #EAEAEA;
  margin-bottom: 7px;font-size: 14px;
}
footer a:hover {
  color: #fff;
  font-weight: 500;
}
footer .col-md-12{
    text-align: center;
    padding: 2rem 0;
    border-top: 0.2rem solid #fff;
}
footer .col-md-12 p{
    color:#EAEAEA	;
}
/*--------------------- 13- Footer Area CSS (End) ---------------------*/



.full{float:left;width:100%}
.half{float:left;width:50%}
.mt30{margin-top:30px}
.mainhead::after,.servicbx h3::after,.bannerbx h2::after{content:'';position:absolute;width:100px;height:3px;border-radius:4px;background:linear-gradient(80deg,#EF3C89 0%,#CB41AB 89%);z-index:11}
.pl30{padding-left:30px}
.pr30{padding-right:30px}
.mb70{margin-bottom:70px!important}
.bgGrey{background:#f5f5f5}
.counterbx .col-md-3{border-right:2px solid #444;padding:0 0 0 35px}
.counterbx .col-md-3:last-child{border:none}
.counterbx img{float:left;margin-right:10px}
.counterbx h4{font-size:35px;margin:0;color:#000}
.counterbx h5{font-size:16px;margin:5px 0 0}
.mainhead{position:relative;text-align:center;margin:50px 0}
.mainhead h2{font-size:40px}
.mainhead::after{bottom:-20px;left:45%}
.servicbx{margin:0 0 70px}
.servicbx:last-child{margin-bottom:30px}
.servicbx h3{font-size:30px;margin:0 0 25px;}
.servicbx h3::after{top:40px;left:15px}
.servicbx .twenty20 img,.outgridbx .twenty20 img{border-radius:10px}
.servicbx ul{padding-left:15px}
.servicbx li{font-size:16px}
.servicbx li::marker{font-size:1.2em;color:#ed3c8b}
.servicbx .btn{background:transparent;color:#222;border:1px solid #EF3C89;font-weight:500;letter-spacing:1px;border-radius:0;margin-top:10px}
.servicbx .btn i{margin-left:7px}
.indusbx{margin-top:-70px}
.bx7{float:left;width:14.28%;text-align:center;padding:0 20px}
.bx7 img,.clientbx img,.brandbx img{width:100%}
.bx7 h4{font-size:15px;line-height:20px;color:#000}
.ctatxtbx{padding:50px 0;text-align:center}
.ctatxtbx h2{font-size:45px;margin:0 0 10px;color:#000}
.ctatxtbx p{font-size:16px}
.ctatxtbx .btn{padding:8px 40px;font-size:16px;margin-top:10px;text-transform:uppercase}
.testimonial-slider,.client-slider{padding-bottom:50px}
.testibx .swiper-slide{background:#fff;padding:20px;border-radius:10px}
.testibx p{margin:20px 0}
.testibx h4{color:#000}
.clientbx .swiper-slide{padding:10px;border:1px solid #ddd}
.portbtns{text-align:center}
.portbtn{color:#828282;background:#fff;padding:4px 10px;border:1px solid #aaa;border-radius:3px;font-size:13px;font-weight:600;margin-right:5px}
.portbtn.active,.portbtn:hover{color:#fff;background:var(--pink);cursor:pointer}
.portimg{display:none}
.portimg.active{display:-ms-grid;display:grid;grid-template-columns:repeat(auto-fit,minmax(25rem,1fr));gap:20px;margin-top:40px}
.gallery{grid-template-columns:repeat(auto-fit,minmax(25rem,1fr));gap:20px}
.galimg{position:relative}
.galimg img{height:100%;width:100%;object-fit:cover;border:1px solid #ddd;border-radius:10px}
.galimg:hover img{filter:blur(2px)}
.galimg .view{position:absolute;opacity:0;top:0;left:0;height:100%;width:100%;display:flex;justify-content:center;align-items:center}
.galimg .view a{height:40px;width:40px;display:flex;justify-content:center;align-items:center;background-color:#fff;border-radius:50%;color:#000;font-size:16px}
.galimg:hover .view,.mfp-close{opacity:1}
.mfp-close{cursor:pointer!important}
.bannerbx{position:relative;padding:120px 0 100px;text-align:center;background-position:center!important;background-size:cover!important}
.bannerbx h2{font-size:42px;}
.bannerbx h2::after{bottom:100px;left:46%}
.brandbx h2{text-align:center}
.brandbx .client-slider{padding-bottom:0}
.brandbx img{padding:0 10px}
.ediortxtbx{text-align:center;padding:30px 0}
.ediortxtbx p{font-size:14px}
.contbx h2{margin-bottom:40px}
.contbx .half{width:48%!important;margin-right:4%}
.contbx .half:nth-child(2n){margin-right:0}
.contbx label{font-size:14px;font-weight:500}
.contbx input,.contbx select,.contbx textarea{border:1px solid #aaa;width:100%;padding:0 10px;border-radius:4px;height:45px;background:#fff}
.contbx textarea{height:160px}
.contbx input[type="file"]{padding:0;border:none}
.contbx .wpcf7-submit{width:150px;font-weight:600;border:0}
.contbx iframe{width:90%;height:350px;border-radius:10px;margin-top:20px}
.contbx p{color:#777}
.contbx i{margin-right:10px;font-size:20px;color:#777}
.contbx ul{list-style:none}
.contbx b{font-weight:500;color:#000}
.howbx{color:#000;text-align:center}
.howbx p{color:#444;line-height:23px}
.howwok4{float:left;width:20%}
.howwok4 h3{margin:10px 0 5px;font-size:20px}
.midicon{float:left;width:6.66%;padding:50px 0 0}
.perftbx{text-align:center;color:#000}
.perftbx h2{margin:30px 0 70px}
.perftbx img{width:100px}
.perftbx .col-md-4,.outgridbx .col-md-4{margin-bottom:30px}
.abtbx img{margin-top:25px;width:100%}
.abtvalubx{padding-top:50px;text-align:center;margin-top:30px}
.abtvalubx h3{margin:10px 0}
.benefitbx .mainhead{text-align:left}
.benefitbx .mainhead::after{left:0}
.benefitbx img{width:90%;margin:20px 0 30px 10%}
.benefitbx .col-md-6 div{padding:5px 0;border-top:2px solid #000}
.benefitbx h3{font-size:20px;font-weight:600;margin:10px 0 5px}
.benefitbx .col-md-6 p{font-size:14px;line-height:22px}
.casebx .col-md-4 div{text-align:center;border:1px solid #ddd;border-radius:10px;margin-bottom:30px;padding:10px 10px 0}
.casebx img{border-radius:10px;width:100%}
.casebx p{margin:10px 0}
.carlst{padding:30px 0;box-shadow:0 10px 30px 0 rgb(0 0 0 / .1);margin-bottom:30px}
.carlst h2{font-size:25px;margin:0 0 10px}
.carlst h3,.carlst h4,.carlst h5{margin:20px 0}
.carlst bdo{font-size:14px;margin:10px 15px 0 0;float:right;color:#555}
.carlst bdo i{font-size:18px;margin-right:5px;color:#000}
.carlst ul{padding-left:30px}
.outgridbx{text-align:center}
.outgridbx h3{margin-bottom:50px}
.outgridbx .twenty20 img{object-fit:cover;height:300px}
.outgridbx h4{color:#000;font-size:20px}
.pricingbx{padding-bottom:50px}
.pricebx{background:#fff;text-align:center;border-radius:20px}
.pricebx h3{background:linear-gradient(171deg,#F73B81 0%,#C542B1 89%);margin:0;color:#fff;font-size:20px;font-weight:600;padding:15px;height:100px;border-radius:20px 20px 50px 50px}
.pricebx h3 b{width:100%;float:left;font-size:17px;font-weight:600;margin-bottom:5px}
.pricebx p{padding:15px 5px 3px;line-height:25px}
.pricebx ul{list-style:none;margin:0;padding:0}
.pricebx li{border-top:1px solid #ddd;padding:15px 10px;font-weight:500}
.pricebx a{margin:10px 0 20px}
.Whybx .col-md-4 div{text-align:center;border:1px solid #ddd;border-radius:20px;padding:15px 10px;height:370px;margin-bottom:30px}
.Whybx .col-md-4 p{font-size:14px}
.acordibx{border:2px solid #efefef;padding:15px 20px;font-size:16px;font-weight:600;cursor:pointer;border-radius:15px;margin-bottom:15px}
.faqdesc{font-weight:400;padding:15px 0 0}
.pnico i{font-size:17px;float:right}
.servicbanbx img,.Stepbx img{width:100%}
.servbx1 h4{text-align:center;font-size:25px;margin-bottom:30px}
.Whoneedbx,.Sgrid{text-align:center}
.Whoneedbx h2{font-size:40px}
.Whoneedbx .col-md-3,.Whoneedbx .col-md-2{margin-top:30px}
.Whoneedbx .col-md-2{width:20%}
.Whoneedbx h3{font-size:18px}
.Whoneedbx .col-md-2 h3{font-size:16px}
.Outsourcbx{padding:100px 0 80px}
.Outsourcbx h2{color:#fff;font-weight:600;font-size:37px;margin:0 0 15px;}
.Outsourcbx .col-md-3{padding-right:0}
.Outsourcbx .col-md-3 div{background:#f9f8f8;height:150px;border-radius:10px;text-align:center;padding:20px 5px}
.Outsourcbx p{font-weight:500;line-height:19px;color:#555}
.Outsourcbx h3{font-size:33px;margin:0}
.Stepbx{text-align:center;margin-bottom:30px}
.Stepbx h2{font-size:40px;margin-bottom:5px}
.stepbr{width:70%!important;margin:30px 0 15px}
.Stepbx .col-md-4 div,.Sgrid{border:1px solid #ddd;border-radius:20px;padding:15px 10px 5px;}.Stepbx h3{font-size:20px;font-weight:600}
.Stepbx h3 b{color:#ba499a;font-size:20px;margin-right:5px}
.Stepbx .col-md-4 p{color:#666;line-height:21px;font-size:16px}
.Sgrid{margin-bottom:20px}
.Sgrid img{border-radius:10px;height:320px}
.mobItem{display:none}
.mfp-counter{display:none}
@media screen and (max-width:981px){
.destItem{display:none}
.mobItem{display:block}
section{padding:0}
.container{width:100%}
.logo{width:24%}
.logo img{width:85%}
.hedmenu{width:63%}
.hedbtn{width:12%}
.navbar a{font-size:14px;margin:0 5px}
.home-item img{height:350px}
.home{padding:50px 0 0}
.counterbx{padding:0 2%}
.counterbx .container{padding:0}
.counterbx .col-md-3{width:25%;float:left;padding:10px 0 10px 10px}
.counterbx img{width:50px}
.mainhead h2,.ctatxtbx h2{font-size:30px}
.counterbx h4,.servicbx h3{font-size:27px}
.counterbx h5,.mainhead p{font-size:13px}
.mainhead{margin:0 0 50px !important;}
.servicbx{margin:0 0 30px}
.portbtn{margin-bottom:10px}
.indusbx{display:none}
}
@media screen and (max-width:786px){
.hedbtn .btn{display:none}
.hedbtn{width:75%}
.howwok4{width:45%}
.midicon{width:10%}
.navbar li,.logo img,.outfst3{width:100% !important}
.carlst .col-md-4{float:left;width:100%}
.perftbx .col-md-4{float:left;width:33.33%}
.Whoneedbx .col-md-3,.Outsourcbx .col-md-3,.SGridbx .col-md-6,.outgridbx .col-md-4,.pricingbx .col-md-3,.Whybx .col-md-4{float:left;width:50%}
.Sgrid img,.outgridbx .twenty20 img{height:230px}
#menu-btn{display:inline-block}
.hedmenu .navbar{width:30rem;position:absolute;left:0;top:100%;padding:0 15px;background:#f7f7f7;border:1px solid #ddd;-webkit-transition:0.2s linear;-moz-transition:0.2s linear;-o-transition:0.2s linear;transition:0.2s linear;-webkit-transform:translateX(-100%);transform:translateX(-100%);height:calc(100vh - 6rem);overflow-y:auto}
.header .navbar.active{-webkit-transform:translateX(0);transform:translateX(0)}
.navbar::-webkit-scrollbar{width:.8rem}
.navbar::-webkit-scrollbar-thumb{border-radius:1rem;background-color:#0a0903}
.navbar::-webkit-scrollbar-track{background:#fff0}
.navbar a{padding:5px 0 !important}
.sub-menu{padding:0 0 5px 10px;position:relative;background:none;box-shadow:none;}
.Whoneedbx h2,.outfst3 h2,.Stepbx h2{font-size:30px}
.contbx h2,.carlst h2,.howbx h2,.perftbx h2{font-size:23px}
.Whybx h3{font-size:21px}
.Stepbx h3{font-size:17px}
.sub-menu li a,.Whoneedbx h3,.perftbx h4,.contbx i{font-size:15px}
.Stepbx .col-md-4 p,.contbx li{font-size:14px}
section{padding:0 10px}
.home-item img{height:320px}
.counterbx .container{padding:0 5px}
.counterbx .col-md-3{width:50%;border:none}
.counterbx img{width:45px;margin:0 5px 0 0}
.mainhead::after{bottom:-15px;left:40%}
footer .links li{margin-left:15px}
.bannerbx{padding:80px 0 50px}
.bannerbx h2::after{bottom:50px;left:42%}
.ediortxtbx{padding:30px 0 0}
.contbx h2,.Stepbx .col-md-4,.pricingbx .col-md-3{margin-bottom:20px}
.contbx li{margin-bottom:10px}
.contbx iframe{width:100%;height:300px}
.carlst h2{margin:0}
.carlst bdo{float:left;margin:10px 10px 10px 0}
.servicbanbx{padding-top:50px}
.Whoneedbx{padding:10px 0 30px}
.Whoneedbx h3{margin:5px 0}
.Outsourcbx{padding:50px 0 30px}
.outfst3{text-align:center;margin-bottom:20px}
.Outsourcbx .col-md-3 div{height:auto;margin-bottom:20px}
.stepbr{width:90%!important;margin:20px 0}
.Stepbx h3{margin:10px 0 5px}
.testibx br,.howbx br{float:left}
.perftbx h2{margin:30px 0}
.contbx i{margin-right:5px}
.faqbx img{width:60%;margin:0 20% 20px}
}
@media screen and (max-width:560px){
.howwok4,.contbx .half,.SGridbx .col-md-6,.outgridbx .col-md-4,.pricingbx .col-md-3,.Whybx .col-md-4{width:100%!important}
.perftbx .col-md-4{width:50%!important}
.midicon{display:none}
.header.sticky{padding:3px 0 0}
.logo{width:80%}.logo img{width:180px!important}
.hedmenu{width:10%}
.hedbtn{width:20%}
.home-item img{height:280px}
.mainhead::after{left:35%}
.servicbx h3::after{top:25px}
.servicbx h3,.servbx1 h4{font-size:16px;font-weight:600}
.counterbx{padding:5px 2%;margin-bottom:10px}
.counterbx img{width:38px;margin:0 10px 0 0}
.bannerbx h2{font-size:27px}
.abtbx h2,.brandbx h2,{font-size:23px}
.mainhead h2,.ctatxtbx h2,.Whoneedbx h2,.outfst3 h2,.Stepbx h2{font-size:22px}
.counterbx h4,.abtvalubx h3,.benefitbx h2,.benefitbx h3,.carlst h2,.Sgrid h3{font-size:21px}
.sub-menu li a,.carlst p,.carlst bdo i,.servicbx p,.servicbx li,.abtbx p,.abtvalubx p,.carlst li,.Whoneedbx p,.Sgrid p{font-size:14px}
.counterbx h5{font-size:12px}
.servicbx p,.servicbx li,.abtbx p,.abtvalubx p,.carlst li,.Whoneedbx p,.Sgrid p{line-height:23px}
.bannerbx h2::after{left:37%}
.abtvalubx{padding:10px 0;margin-top:15px}
.abtbx .col-md-6,.benefitbx .col-md-9,.benefitbx .col-md-6,.testibx .container,.clientbx .container,.portbx .container,.contbx .container,.servbx1 .container,.howbx .container{padding:0 3px}
.carlst li{margin-bottom:10px}
.faqbx img{width:90%;margin:0 5% 20px}
}  