/*homepage*/
.main-banner{ padding: 30px 0px;}
.main-banner .btn-white:hover{ background: #fff; color: #000;}
.home-banner{ background: url(../images/home/home-banner-bg.jpg) no-repeat center center; background-size: cover;}

@media (min-width: 768px) {
    .main-banner{ padding: 50px 0px;}
    .main-banner .main-ban-txt p.para{max-width: 580px;}
}

@media (min-width: 992px) {
    .main-banner{ padding: 90px 0px;}
}

.trusted-org h2{ margin-bottom: 30px; text-align: center;}
.trusted-org-logos{ display: grid; grid-template-columns: auto auto; justify-content: center; grid-column-gap: 10px;}
.trusted-org-logos img{ margin: 0px 5px 10px;}

@media (min-width: 768px) {
    .trusted-org-logos{ display: grid; grid-template-columns: auto auto auto auto;}
    .trusted-org-logos img{ margin: 0px 10px 0;}
}

@media (min-width: 1200px) {
    .trusted-org h2{ text-align: left; margin-bottom: unset;}
}

.home-dm-technique h2 span{
    background: -webkit-linear-gradient(99.64deg, #B064F3 0.61%, #FDA342 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.subhead-with-border{ position: relative;}
.subhead-with-border:after{ content: ""; background: #CACACA; height: 1px; width: 100%; position: absolute; right: 0; top: 30px;}
.subhead-with-border h2 { background: #fff; display: inline-block; position: relative; z-index: 3; padding-right: 20px;}
@media (max-width: 576px) {
    .home-dm-technique h2 br{ display: none;}
}

/*vertical tabs*/
.sptab-links .nav-tabs .nav-link {margin-bottom: -1px; border: 0px}
.sptab-links .nav-link{ color: rgba(0,0,0,0.3);}
.sptab-links .nav-tabs .nav-link.active{color: #000; font-family: var(--font-medium); background: transparent;}
.process-txt-row{ display: flex; flex-direction: column; background: #fff;}
.process-tabs-txt{ font-size: 14px;}
.process-tabs-txt p:nth-last-of-type(1){ margin-bottom: 0;}
.process-tabs-img{ margin-bottom: 20px;}
.sprocess-tabs .tab-content{ background: #fff;}
.process-tabs-txt .btn{ font-size: 15px; padding: 10px 30px;}

@media (max-width: 767px) {
    .best-img{ margin-bottom: 20px;}
    .best-section .row{ flex-direction: column-reverse;}
    .best-section.best-section2 .row{ flex-direction: column;}
    .sprocess-tabs-sec{ margin-top: 20px;}
    .sptab-links .nav-tabs {border-bottom: 0px; display: flex; flex-direction: row; flex-wrap: nowrap; width: 100%; overflow-x: auto; margin-bottom: 20px; padding-bottom: 20px;}
    .sptab-links .nav-link {white-space: nowrap; font-size: 13px;}
    .sptab-links .nav-tabs .nav-link.active{color: #fff; background: #FF800B; border-radius: 30px;}
    .pmhb .pm-helps-box h4{ font-size: 14px; line-height: 18px;}
}
@media (max-width: 1199px) {
    .process-tabs-img img{ width: 100%; height: 200px; object-fit: cover;}
}

@media (min-width: 768px) {
.sprocess-tabs-sec{padding-top: 50px;}
.sprocess-tabs{ display: flex;}
.sprocess-tabs .sptab-links{ flex-basis: 25%; margin-right: 30px;}
.sprocess-tabs .tab-content{ flex-basis: 75%; margin-top: 10px;}
.sptab-links .nav-tabs{ display: flex; flex-direction: column; border: 0;}
.sptab-links .nav-tabs .nav-link {margin-bottom: 10px; padding:10px 0px 20px 25px; text-align: left; width: 100%; border-bottom: 1px solid rgba(0, 0, 0, 0.03); position: relative;}
.sptab-links .nav-link:before{ content: ""; background: #FFDEDD; width: 8px; height: 8px; border-radius: 100%; position: absolute; left: 0;
    top:18px;}
.sptab-links .nav-tabs .nav-link.active:before{background: #FF8987;}   
.sptab-links .nav-tabs .nav-item:nth-last-of-type(1) .nav-link { border-bottom: 0;}
}

@media (min-width: 1200px) {
    .process-txt-row{ display: flex; flex-direction: row;}
    .process-tabs-img{ padding-right: 40px; margin-top: 0; flex-shrink: 0;}
    .process-tabs-img img{ max-width: 350px;}
    .sptab-links .nav-link:before{width: 12px; height: 12px; top:15px;}
}

@media (min-width: 1366px) {
    .sprocess-tabs .sptab-links{ margin-right: 50px;}
    .sptab-links .nav-tabs .nav-link{ font-size: 20px; line-height: 24px; padding:10px 0px 20px 30px;}
}
/*vertical tabs*/

.know-the-process{ background: url(../images/home/ktp-bg.jpg) no-repeat center bottom; background-size: cover; color: #fff; padding: 30px 0px;}
.ktp-icon-row{ padding: 30px 0px;}
.ktp-icon{ margin-bottom: 20px; text-align: center;}
.ktp-text{ text-align: center;}

@media (min-width: 767px) {
    .ktp-text{ text-align: unset;}
    .know-the-process{ padding: 100px 0px; background-position: center center;}
    .ktpicon1, .ktpicon4{ margin-top: 20%;}
    .ktpicon2, .ktpicon3{ margin-top: -25%;}
    .ktp-icon-row{ padding: 80px 0px 0px;}
    .ktp-icon{ margin-bottom: unset;}
}

.our-client-logos{ display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
.our-client-logos img{ margin: 0px 10px 20px; flex-shrink: 0;} 
@media (max-width: 576px) {
    .our-client-logos img{ width: 140px; margin: 0px 5px 20px;}
}

/*Customer Stories*/
.customer--stories{ background: #000;}
.customer--stories .btng{background: linear-gradient(92.97deg, #0085FF 0%, #6AD7C3 104.75%); border: 0; color: #fff; 
    font-family: var(--font-medium);}
.hcs-slide-lft{ flex-shrink: 0;}
.hcs-logo{ background: #fff; padding: 20px; text-align: center; max-width: 300px; box-shadow: -8px 8px 0px 0px rgba(255,113,118,1); 
    margin-left: 10px; margin-bottom: 10px;}
.hcs-story-desc{ font-size: 16px; line-height: 24px; padding-top: 20px;}   
.hcs-story-name{font-size: 16px; line-height: 24px; position: relative; padding-top: 10px; margin-top: 20px;}   
.hcs-story-name:before{ content:""; background: #fff; width: 30px; height: 1px; position: absolute; left: 0; top: 0px; z-index: -1;}

@media (min-width: 767px) {
    .hcs-slide-lft{ border-right: 1px solid rgba(255,255,255, 0.1); margin-right: 20px; padding-right: 20px;}
    .hcs-slide{ display: flex; align-items: center; justify-content: space-between;}
    .hcs-logo{ padding: 20px; width: 267px; height: 267px; border-radius: 0px 54px 0px 0px; display: flex; align-items: center; 
        justify-content: center; position: relative; z-index: 3; box-shadow: -16px 16px 0px 0px rgba(255,113,118,1); margin-left: 16px; margin-bottom: unset;}  
}

@media (min-width: 1200px) {
    .hcs-logo{ padding: 20px; width: 267px; height: 267px; border-radius: 0px 54px 0px 0px;}
    .hcs-slide-lft{margin-right: 60px; padding-right: 60px; }
    .hcs-story-desc{ font-size: 18px; line-height: 26px;}   
    .hcs-story-name{font-size: 18px; line-height: 26px;}   
}

.hcs--slider.site--slider .swiper-pagination-bullet {background: rgba(255,255,255, 0.2); opacity: 1; width: 8px; height: 8px;} 
.hcs--slider.site--slider .swiper-pagination-bullet-active{background: #fff;}
.hcs--slider.site--slider .swiper-pagination-bullets.swiper-pagination-horizontal{ bottom:0}

.hcs--slider.site--slider .fw-pagi .swiper-pagination-bullet-active, 
.hcs--slider.site--slider .ods-pagi .swiper-pagination-bullet-active{
    background: #2E63D8;
}

.hcs--slider.site--slider .swiper-button-next, .hcs--slider.site--slider .swiper-button-prev{font-family: unset; top: unset; bottom: -5px; z-index: 999;}
.hcs--slider.site--slider .swiper-button-next::after{ content: url(../images/customer-stories/cs-arrow-rht-sm.svg);}
.hcs--slider.site--slider .swiper-button-prev::after{ content: url(../images/customer-stories/cs-arrow-lft-sm.svg);}
.hcs--slider.site--slider-nav{ max-width: 500px; margin: auto;}
.hcs--slider.site--slider .swiper-button-next{ right: 20%;}
.hcs--slider.site--slider .swiper-button-prev{ left: 20%;}

@media (min-width: 768px) {
    .hcs--slider.site--slider .swiper-button-next{ right: 40%;}
    .hcs--slider.site--slider .swiper-button-prev{ left: 40%;}
}
@media (min-width: 1200px) {
    .hcs--slider.site--slider .swiper {width: 90%; height: 100%;}
    .hcs--slider.site--slider .swiper-button-next::after{ content: url(../images/customer-stories/cs-arrow-rht.svg);}
    .hcs--slider.site--slider .swiper-button-prev::after{ content: url(../images/customer-stories/cs-arrow-lft.svg);}
    .hcs--slider.site--slider .swiper-button-next{top: unset; bottom: 30%; z-index: 999;}
    .hcs--slider.site--slider .swiper-button-prev{ top: 30%; bottom: unset; z-index: 999;}
    .hcs--slider.site--slider .swiper-pagination-bullets.swiper-pagination-horizontal {bottom: unset; top: 41%; right: 11px; left: unset;
  width: auto; }
    .hcs--slider.site--slider .swiper-button-next{ right: 0;}
    .hcs--slider.site--slider .swiper-button-prev{ left: unset; right: 0;}
    .hcs-pagi .swiper-pagination-bullet{ display: block; margin: 0px 0px 10px !important;}
}
/*Customer Stories End*/

/*Industries we worked slider*/
.hind-box{ padding: 20px; border-radius: 20px; color: #000; width: 100%;}
.hind-box h4{ position: relative;} 
.hind-box h4:after{ content: url(../images/arrow3.svg); position: absolute; right: 0; top: 0;}
.h-ind--slider a{ color: #000;}
@media (min-width: 1200px) {
    .hind-box p{ font-size: 18px; line-height: 24px;}
}

.work--slider .swiper-pagination-horizontal{ bottom: 0; top: unset !important;}
.work--slider .swiper-pagination-progressbar {background: #EDEDED; border-radius: 10px !important; overflow: hidden;}
.work--slider .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background: #464646; border-radius: 10px !important;}
@media (min-width: 1200px) {
    .hind-box p{ font-size: 18px; line-height: 24px;}
    .work--slider .swiper-pagination-horizontal{height: 6px !important;}
}

/*Branding page*/
.branding-banner{ background: url(../images/branding/branding-banner-bg.jpg) no-repeat center center; background-size: cover;}
.we--offer{ text-align: center;}

@media (min-width: 768px) {
.we--offer{ text-align: unset;}
}
@media (min-width: 1200px) {
	.we--offer h2{ font-size: 36px;}
}

.bgbBox{ padding:30px 20px 30px; border-radius: 25px;}
.bgb-accord.site-accord .accordion-button{ padding:10px 40px 10px 0px; border: 0; font-size: 18px;}
.bgb-accord.site-accord .accordion-body{ padding: 10px 0px 10px; border: 0;}
.bgb-accord.site-accord .accordion-item { border-bottom: 2px solid rgba(0, 0, 0, 0.2); margin-bottom: 5px; padding-bottom: 5px;}
.bgb-accord.site-accord .accordion-button::after {top: 10px; right: 15px;}
.bgb-accord.site-accord .accordion-item:nth-of-type(1){ border-bottom-color: #656EF8; border-top: 2px solid #FF7176; border-radius: 0; padding-top: 5px;}
.bgb-accord.site-accord .accordion-item:nth-of-type(2){ border-bottom-color: #6AD7C3;}
.bgb-accord.site-accord .accordion-item:nth-of-type(3){ border-bottom-color: #FF800B;}
.bgb-accord.site-accord .accordion-item:nth-of-type(4){ border-bottom-color: #C459D5;}

@media (min-width: 768px) {
    .bgbBox{ padding:50px 30px 50px; border-radius: 25px;}
    .bgb-accord.site-accord .accordion-button {font-size: 18px;}
}
@media (min-width: 1200px) {
    .bgb-accord.site-accord .accordion-button {font-size: 20px;}
}

@media (min-width: 1366px) {
    .bgb-accord.site-accord .accordion-button {font-size: 24px;}
    .bgb-accord.site-accord .accordion-button::after {top: 10px; }
}


.wfob{background: #FFFFFF; box-shadow: 0px 0px 25px rgba(175, 173, 255, 0.1); border-radius: 20px; padding: 20px;  margin-bottom: 30px; 
    width: 100%; text-align: center;}
.wfob-icon{ margin-bottom: 10px;}
.wfob-txt h4{ margin-bottom: 20px;}
.wfob-txt p{ font-size: 16px; line-height: 24px;}

@media (min-width: 992px) {
    .wfob{padding: 30px; display: flex; height: auto; align-items: center; margin-bottom: 30px; width: 100%; text-align: unset; margin-bottom: 50px;}
    .wfob-txt {border-left: 1px solid rgba(0, 0, 0, 0.3); margin-left: 20px; padding-left: 30px;}
    .wfob-icon{ flex-shrink: 0; margin-bottom: unset;}
}


/*Horizontal tabs Dark*/
.tabs-black{ background: #000;}
.black-tab-links .nav-tabs .nav-link {margin-bottom: -1px; border: 0px}
.black-tab-links .nav-link{ color: rgba(255, 255, 255, 0.4); font-family: var(--font-medium);}
.black-tab-links .nav-tabs .nav-link.active{ color: rgba(255, 255, 255, 1);  background: transparent;}
.black-tabs .tab-content{ color: #fff; margin-top: 20px;}
.black-tabs-txt .btn{ font-size: 15px; padding: 10px 30px;}
.tabs-black .tab-content h4{margin-bottom: 20px;} 

@media (max-width: 767px) {
    .black-tabs-sec{ margin-top: 20px;}
    .black-tab-links .nav-tabs {border-bottom: 0px; display: flex; flex-direction: row; flex-wrap: nowrap; width: 100%; overflow-x: auto; margin-bottom: 20px; padding-bottom: 20px;}
    .black-tab-links .nav-link {white-space: nowrap; font-size: 13px;}
    .black-tab-links .nav-tabs .nav-link.active{color: #fff; background: #FF800B; border-radius: 30px;}
}

@media (min-width: 768px) {
.black-tab-links .nav-tabs{ display: flex; flex-direction: row; border: 0; justify-content: space-between;}
.black-tab-links .nav-tabs .nav-link {margin-bottom: 10px; padding:10px 0px 20px 0px; text-align: left; width: 100%;}
.black-tab-links .nav-link{ position: relative;}
.black-tab-links .nav-link:before{ content: ""; background: #000; width: 70%; height: 4px;  position: absolute; left: 0;
    bottom:0; right: 0; margin: auto; text-align: center;}
.black-tab-links .nav-tabs .nav-link.active:before{background: #fff;}
.tabs-black .tab-content h4{ margin-bottom: 30px; max-width: 560px;} 
.black-tabs .tab-content{ color: #fff; margin-top: 50px;}
}

@media (min-width: 1366px) {
    .black-tab-links .nav-tabs .nav-link{ font-size: 20px; line-height: 24px;}
    .tabs-black .tab-content h4{ font-size: 28px; line-height: 38px; margin-bottom: 40px;} 
}
/*vertical tabs*/

/* Seo pages process slider */
.seopro--slider{ position: relative;}
.seopro--slider .swiper { width: 100%; height: 100%; overflow: hidden;}
.seopro--slider .swiper-slide {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: stretch;
    height: auto;
    margin-top: 40px;
  }
.seopro-box {border: 1px solid #FFFFFF; border-radius: 20px; padding: 30px; text-align: center; color: #fff;}
.seopro-box .seopro-box-no{ font-size: 24px; font-family: var(--font-bold); background: rgba(255, 255, 255, 0.1); width: 52px; height: 52px; border-radius: 100%; display: flex; align-items: center; justify-content: center; margin: 0px auto 20px;}
.seopro--slider .swiper-slide-next .seopro-box{border: 1px solid #CBFFE6; background: #CBFFE6; color: #000;}
.seopro--slider .swiper-slide-next .seopro-box .seopro-box-no{background: rgba(0, 0, 0, 0.1);}

@media (min-width: 768px) {
    .seopro--slider .swiper-slide { margin-top: unset;}
    .seo-pro-sec .container{ width: 100%; max-width: 1440px;}
    .seopro--slider .swiper-slide-active, .seopro--slider .swiper-slide-next{ margin-right: 10%;}
    .seopro--slider .swiper-slide-active{ margin-left: -10%;}
}
.seopro--slider .swiper-button-next, .seopro--slider .swiper-button-prev{font-family: unset; top: 0; z-index: 999;}
.seopro--slider .swiper-button-next::after{ content: url(../images/seo-arr-nxt.svg);}
.seopro--slider .swiper-button-prev::after{ content: url(../images/seo-arr-prev.svg);}

@media (min-width: 768px) {
    .seopro--slider .swiper-button-next, .seopro--slider .swiper-button-prev{font-family: unset; top: 50%; bottom: unset; z-index: 999;}
    .seopro--slider .swiper-button-next{ right: 27%;}
    .seopro--slider .swiper-button-prev{ left: 27%;}
}
@media (min-width: 1366px) {
    .seopro--slider .swiper-button-next{ right: 27%;}
    .seopro--slider .swiper-button-prev{ left: 27%;}
}

/*Marketing Collateral page*/
.marketingc-banner{ background: url(../images/mc/mc-banner-bg.jpg) no-repeat center center; background-size: cover;}
.mc-slide-desc h4{ margin-bottom: 10px; margin-top: 10px;}
.mc-slide-desc ul{ padding: 0px 0px 0px 0px;}
.mc-slide-desc li{ list-style-type: none; position: relative; padding-left: 30px; color: #000; padding-bottom: 10px;}
.mc-desc-lft{ text-align: center;}
.mc-slide-desc li:after{ content: url(../images/mc/mc-tick.svg); position: absolute; left: 0; top: 4px;} 

.mc-explore{ background: url(../images/mc/mc-explore-bg.jpg) no-repeat; background-size: cover; padding: 100px 0px;}
.mc-explore-box{background: url(../images/mc/explore-box-bg.png) no-repeat center top #000; background-size: cover; padding: 30px; text-align: center;}

@media (min-width: 768px) {
    .mc-explore{padding: 200px 0px;}
    .mc-explore-box{padding: 50px;}
}

@media (min-width: 1200px) {
        .mc-slide-desc li:after{left: 0; top: 3;} 
        .mc-slide-desc li{ font-size: 18px;}
}

@media (min-width: 1600px) {
    .mc-explore{padding: 300px 0px;}
}

/*Mobile App page*/
.mob-app-banner{ background: url(../images/ui-ux/mobile/mob-banner-bg.jpg) no-repeat center center; background-size: cover;}
.mobile-app-types{ background: #000; color: #fff;  padding: 50px 0px;}
.mobile-app-types ul{ padding: 0px 0px 0px 0px;}
.mobile-app-types li{ list-style-type: none; position: relative; padding-left: 30px; padding-bottom: 10px;}
.mobile-app-types li:after{ content: url(../images/ui-ux/mobile/tick.svg); position: absolute; left: 0; top: 3px;}
.mobile-app-types h5{ margin-bottom: 20px;}

@media (min-width: 1200px) {
    .mobile-app-types{ padding: 80px 0px;}
    .mobile-app-types li, .mobile-app-types p{ font-size: 18px; line-height: 28px;}
    .mobile-app-types h5{ font-size: 20px;}
    .mobile-app-types h5{ margin-top: 24px; margin-bottom: 20px;}
}

/*UI UX Web page*/
.ui-ux-web-banner{ background: url(../images/ui-ux/web/web-banner-bg.jpg) no-repeat center center; background-size: cover;}
.odtp--box{ margin-bottom: 30px;}
@media (min-width: 992px) {
    .odtp--box{ margin-bottom: 50px;}
}

/* website page*/
.website-banner{background: url(../images/development/website/website-banner-bg.jpg) no-repeat center center; background-size: cover;}
.our--tools h2{ margin-bottom: 30px; text-align: center;}
.our-tools{ display: grid; grid-template-columns: auto auto; justify-content: center; grid-column-gap: 5px;}
.our-tools img{ margin: 0px 5px 10px;}

@media (min-width: 768px) {
    .our-tools{ display: grid; grid-template-columns: auto auto auto auto auto;}
    .our-tools img{ margin: 0px 10px 0;}
}

@media (min-width: 1200px) {
    .our--tools.sp-50{ padding-top: 70px; padding-bottom: 70px;}
    .our--tools h2{ text-align: left; margin-bottom: unset;}
}

.wop--box {border-radius: 8px; box-shadow: 0px 0px 10px 4px rgba(0,0,0,0.04);  padding: 30px 30px 50px; position: relative; z-index: 9;}
.wop--box hr{ height: 2px;}
.wopbox{ position: relative; padding-top: 50px; padding-bottom: 30px;}
.wopbox:before{content: ""; width: 50px; height: 50px; border-radius: 100%; position: absolute; left: 20px; bottom: 10px;}
.wopbox:after{content: ""; width: 50px; height: 50px; border-radius: 8px; position: absolute; right: 20px; top: 20px;}
.wopbox.wopbox1:before, .wopbox.wopbox1:after{background: #FFD3BA;}
.wopbox.wopbox2:before, .wopbox.wopbox2:after{background: #CBFFE6;} 
.wopbox.wopbox3:before, .wopbox.wopbox3:after{background: #FFDBAA;} 
.wopbox.wopbox4:before, .wopbox.wopbox4:after{background: #D9B6FF;} 
.wopbox.wopbox5:before, .wopbox.wopbox5:after{background: #FDABAE;} 
.wopbox.wopbox6:before, .wopbox.wopbox6:after{background: #A8DFFF;}  

.website--slider.site--slider .swiper-slide{ margin-bottom: 0;}
.website--slider.site--slider .swiper-button-next, .website--slider.site--slider .swiper-button-prev{font-family: unset; top: unset; bottom: 40px; z-index: 999;}
.website--slider.site--slider .swiper-button-next::after{ content: url(../images/w-arrow-rht.svg);}
.website--slider.site--slider .swiper-button-prev::after{ content: url(../images/w-arrow-lft.svg);}
.website--slider.site--slider .swiper-button-prev{ left: 100px;}
.website--slider.site--slider .swiper-button-next{ left: 200px;}

@media (min-width: 768px) {
    .website--slider.site--slider .swiper-button-prev{ left: 100px;}
    .website--slider.site--slider .swiper-button-next{ left: 200px;}
}
@media (min-width: 992px) {
    .wop--box p{ font-size: 18px; line-height: 26px;}
} 

@media (min-width: 1200px) {
    .wop--box {padding: 30px 30px 70px; max-width: 500px;}
    .wopbox{ position: relative; padding-top: 50px; padding-bottom: unset;}
    .wopbox:before{content: ""; width: 90px; height: 90px; border-radius: 100%; position: absolute; left: -40px; bottom: 20px;}
    .wopbox:after{content: ""; width: 90px; height: 90px; border-radius: 8px; position: absolute; right: -25px; top: 20px;}
    .website--slider.site--slider .swiper-button-next, .website--slider.site--slider .swiper-button-prev{top: unset; bottom: 20px;}
}

@media (min-width: 1366px) {
    .wop--box {padding: 30px 30px 70px; max-width: 550px;}
    .wopbox:before{content: ""; width: 114px; height: 114px; border-radius: 100%; position: absolute; left: -50px; bottom: 20px;}
    .wopbox:after{content: ""; width: 114px; height: 114px; border-radius: 8px; position: absolute; right: -35px; top: 15px;}
}
@media (min-width: 1440px) {
    .wop--box {padding: 30px 30px 70px; max-width: 600px;}
}

@media (min-width: 1600px) {
    .wop--box {padding: 30px 30px 70px; max-width: 690px;}
}

/*Digital Seo Page*/
.digital-seo-banner{background: url(../images/digital/seo/seo-banner-bg.jpg) no-repeat center center; background-size: cover;}
.seo-cs-box{ background: #A8DFFF; padding: 20px; margin-bottom: 30px; border-radius: 20px;}
.seo-cs-box .btn-white:hover{ background: #fff; color: #000;}
.seo--wcu .odtp--box{ text-align: center; margin-bottom: 30px;}

@media (max-width: 767px) {
    .seo--wcu .odtp--box h4.mt-3, .seo--wcu .odtp--box p.mt-3{ margin-top: 10px !important;}
}

@media (min-width: 768px) {
    .seo--wcu .odtp--box{ text-align: unset; margin-bottom: 50px;}
}
@media (min-width: 992px) {
    .seo-cs-box{padding: 30px;}
}
@media (min-width: 1366px) {
    .seo-cs-box p.para { line-height: 38px; min-height: 120px;}
}

.site--modal .modal-content{ border-radius: 10px; border: 0; padding: 0px 20px 10px;}
.site--modal .modal-header {padding: 30px 20px 20px; border: 0; color: #000; border-radius: 0; display: block; 
    position: relative;}
.site--modal .btn-close {color: #000; position: absolute; top: 20px; right: 0px; padding: 0; margin: 0;}

.ctra-box{ margin-bottom: 30px;}
.ctra-box hr{ height: 2px; opacity: 1;}

.dseo-benefits h2{ margin-bottom: 30px;}
.benefits--list{ border-bottom: 1px solid rgba(0, 0, 0, 0.3); padding-bottom: 20px; margin-bottom: 20px;}
.benefits--list{ counter-increment: step-counter; position: relative; padding-left: 40px;}
.benefits--list::before {content: "0"counter(step-counter); counter-reset: "10"; position: absolute; left: 0; top: 0; color: rgba(0, 0, 0, 0.15); 
    font-size: 24px; line-height: 30px;  font-family: var(--font-bold);}
#txtExpand .benefits--list:nth-child(n+3):before {content: "" counter(step-counter);}    
.dseo-benefits .rdbtn{ background: transparent; border: 0; padding: 0; color: #000; font-size: 20px; font-family: var(--font-bold);}
.dseo-benefits .rdbtn:after{ content: url(../images/digital/seo/poly.svg); margin-left: 10px;}
.dseo-benefits .rdbtn:not(.collapsed)::after {content: url(../images/digital/seo/poly-up.svg);}

@media (min-width: 768px) {
    .ctra-box{ margin-bottom: unset;}
    .dseo-benefits h2{ margin-bottom: unset;}
    .benefits--list{ display: flex; padding-left: 60px;}
    .benefits--list h4{ flex-basis: 48%; margin-right: 2%;}
    .benefits--list p{flex-basis: 50%; font-family: var(--font-medium);}
    .benefits--list::before {font-size: 36px; line-height: 30px;}
}

@media (min-width: 1200px) {
    .benefits--list p{ font-size: 18px; line-height: 29px;}
}

/* Digital SMM page*/
.digital-smm-banner{background: url(../images/digital/smm/smm-banner-bg.jpg) no-repeat center center; background-size: cover;}
.smm-steps .step_lft h3{ margin-top: 10px; margin-bottom: 10px;}
.smm-steps .step_rht ul{ padding: 0px 0px 0px 0px; }
.smm-steps .step_rht ul li {list-style-type: none;}
.smm-steps .step_rht ul li span{ border: 1px solid #ccc; padding:5px 20px; border-radius: 4px; margin-bottom: 5px; font-size: 16px; 
    font-family: var(--font-medium);}
.smm-steps .step_rht .btn{ padding: 5px 25px; font-size: 16px;}  
.tlpr-sec{ color: #fff;}

@media (max-width: 767px) {
    .smm-steps .step_rht ul li {margin-bottom: 16px; display: inline-block;}
}

@media (min-width: 768px) {
    .smm-steps .row{ align-items: flex-end;}
    .step_lft{ border-right: 1px solid rgba(0, 0, 0, 0.3); padding-right: 20px;}
    .smm-steps .step_rht ul li {margin-bottom: 16px;}
} 

@media (min-width: 1200px) {
    .step_lft{padding-right: 40px;}
    .smm-steps .step_rht ul li {margin-bottom: 8px;}
    .smm-steps .step_lft h3{ margin-top: 20px; margin-bottom: 10px;}
}

/* Digital Google Marketing page*/
.digital-gm-banner{background: url(../images/digital/gm/gm-banner-bg.jpg) no-repeat center center; background-size: cover;}
.v--box{ margin: 0px 0 30px; box-shadow: 0px 0px 25px rgba(175, 173, 255, 0.1); border-radius: 20px; padding: 30px 20px 20px; text-align: center;}
.v--box .v--box-icon{ flex-shrink: 0; margin-bottom: 5px;}

@media (min-width: 768px) {
    .v--box{ display: flex; text-align: unset;}
    .v--box .v--box-icon{ flex-shrink: 0; margin-right: 50px; margin-bottom: unset;}
}

@media (min-width: 1366px) {
    .v--box{ margin: 0px 0 30px;  padding: 30px 36px 20px;}
}

/*contact us page*/
.contact-us-banner{background: url(../images/contact-banner-bg.jpg) no-repeat center center; background-size: cover;}
.contact-us-banner h4{ position: relative;}
.contact-us-banner h4 a{ color: #fff; font-family: var(--font-bold);}
.cphone::before{ content: url(../images/ctele.svg); margin-right: 10px; position: relative; top: 8px;}
.cemail::before{ content: url(../images/cmail.svg); margin-right: 10px; position: relative; top: 8px;}

.page-contact-form{ background: #FFFFFF; box-shadow: 0px 0px 25px rgba(0, 0, 0, 0.15); border-radius: 10px; padding: 30px 15px; margin-top: 50px;}
.contact-page-form label{ font-family: var(--font-bold); margin-bottom: 5px;}
.cp-form-section{background: #111D30;}
.cp--txt-lft{ color: #fff; padding-top: 30px;}
.cp--txtbox{ margin-bottom: 30px;}
.contact-page-form textarea.form-control{ height: 80px;}

.gdpr-content .btn-white{ background: transparent; border: 0; color: #2E63D8;}

.thank--you{background: url(../images/contact-banner-bg.jpg) no-repeat center center; background-size: cover; padding: 50px 0px;}
.thank-box{background: #FFFFFF; box-shadow: 0px 0px 25px rgba(0, 0, 0, 0.15); border-radius: 10px; padding: 30px;}
.form-hr{ opacity: 0.1;}

@media (min-width: 768px) {
    .main-banner.contact-us-banner{ padding: 20px 0px 0px;}
    .page-contact-form{padding: 30px; margin-top: -50px;}
    .cp-form-section {background: linear-gradient(to bottom, #111d30 0%,#111d30 85%,#1b1b1b 85%,#1b1b1b 100%);}
    .cp--txt-lft{ padding-top: 80px; padding-right: 10%;}
}

@media (min-width: 1200px) {
    .contact-page-form .form-control, .contact-page-form .form-select{ height: 50px;}
    .contact-page-form textarea.form-control{ height: 130px;}
    .contact-page-form label{ margin-bottom: 10px;}
    .cp--txtbox p{ font-size: 16px;}
    .thank--you{ padding: 100px 0px;}
}

.error-sec{background: url(../images/contact-banner-bg.jpg) no-repeat center center; background-size: cover; padding: 50px 0px;}
.error-box{ background: #fff; padding: 30px; max-width: 600px; margin: auto; border-radius: 10px;}

@media (min-width: 768px) {
    .error-sec{padding: 100px 0px;}
}

.br-25{border-radius: 25px;}
.font-16, .font-16 p, .font-16 li, .font-16 a{ font-size: 16px;}
.font-16, .font-16 p{ line-height: 24px;}
.font-18, .font-18 p, .font-18 li, .font-18 a{ font-size: 18px;}
.font-18, .font-18 p{ line-height: 26px;}
ul.seo-content-list { padding: 10px 0px 0px; margin: 0;}
.seo-content-list li{ list-style-type: none; position: relative; margin-bottom: 5px; padding-left: 30px;}
.seo-content-list.list-icon-green li:before{ content: url(../images/seo/tick-green.svg); position: absolute; left: 0; top: 3px;}
.seo-content-list.list-icon-blue li:before{ content: url(../images/seo/tick-blue.svg); position: absolute; left: 0; top: 3px;}  
.other--locations .ol-seo-inner{ padding: 30px 30px;}
.other--locations .seo-content-list li a{ color: #000; font-size: 16px;}
.other--locations .seo-content-list li a:hover{ text-decoration: underline;}

@media (min-width: 992px) {
.seo-img-half-bg{ position: relative;}
.seo-img-half-bg img{ position: relative; z-index: 9; padding: 20px 0px;}
.seo-img-half-bg:after{ content: "";  background: #FFF0A0; width: 270px; height: 100%; border-radius: 0px 30px 30px 0px; position: absolute;
right: -20px; top: 0px;}
.other--locations .seo-content-list li{ margin-bottom: 20px;}
.other--locations .seo-content-list{ display: grid; grid-template-columns: auto auto; justify-content: space-between;}
.other--locations .ol-seo-inner{ padding: 50px 30px;}
.other--locations .seo-content-list li a{ font-size: 14px;}
}

@media (min-width: 1200px) {
    .other--locations .seo-content-list li a{ color: #000; font-size: 16px;}
}

@media (min-width: 1366px) {
    .seo-img-half-bg:after{right: -20px; top: 0px;}
    .seo-img-half-bg img{ padding: 30px 0px;}
    .other--locations .ol-seo-inner{ padding: 50px;}
    }
 
 .banner-bg-yellow{ background: url(../images/seo/banner-bg/banner-bg-yellow.jpg) no-repeat; background-size: cover;}   
.sf-durham h4{ margin: 15px 0px;}    
.planning-sec-inner{ background: url(../images/star1.png) no-repeat top 10px right -10px #111D30; border-radius: 21px;}
.planning-sec-inner-row{background: url(../images/star2.png) no-repeat bottom -10px right -10px; padding:30px 20px; color: #fff;}
.planning-sec span{
    background: -webkit-linear-gradient(99.64deg, #B064F3 0.61%, #FDA342 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.planning-sec-btm p{ font-family: var(--font-bold);}
.planning-sec-btm a{ font-family: var(--font-main); color: #fff;}
.planning-sec-btm{ margin-top: 20px;}

.ui-ux-man-ser .uumx-box{ margin-bottom: 30px;}
.uumx-box .btn{ padding: 5px 20px;}

@media (min-width: 768px) {
    .planning-sec-inner{background-position: top 10px right 10px;}
    .planning-sec-inner-row{ background-position: bottom -10px right 10px;}
    .planning-sec-inner-row{padding: 30px;}
    .planning-sec-btm{ margin-top: 30px; text-align: right; padding-right: 70px;}
}

@media (min-width: 1200px) {
    .planning-sec h2{ font-size: 36px;}
    .planning-sec-inner-row{padding: 30px 30px 30px 50px;}
    .ui-ux-man-ser .uumx-box{ margin-bottom: 50px;}
	.serv-section .small-para{ font-size:18px; line-height: 26px; margin-top: 10px}
}