@media (max-width: 575.98px) {
    .text-span span {
        font-size: 14.6vw;
        line-height: 27vw;
    }

    .font-size-set {
        font-size: 16px;
    }

    .mob-next,
    .mob-prev {
        top: var(--swiper-navigation-top-offset, 38%) !important;
    }

    .gradientText {
        font-weight: 700;
        font-size: 1.8em;
    }

    .headingThree {
        font-size: 1.6rem;
        font-weight: 700;
    }

    .stats {
        width: 80%;
        height: auto;
    }

    .stats h4 {
        font-size: 26px;
        font-weight: 800;
    }

    .stats p {
        font-weight: 500;
        text-align: center;
    }

    .footer-option {
        font-weight: 600;
        color: var(--mobile-blue);
        padding-bottom: 20px;
    }

    .footer-nav-option a {
        padding-bottom: 18px;
    }
    .pin-spacer{
        height:315svh;
        padding: 0 !important;
    }

    .icon-box {
        height: 270px;
    }

    /* images icons */
    .youtube,
    .store,
    .Kooliya,
    .orangebox,
    .byju,
    .excel,
    .power-point,
    .brave,
    .insta,
    .n-img,
    .canva,
    .duolingo,
    .test-book,
    .bgmi,
    .pw,
    .freefire,
    .subwaysurfer,
    .ms-word,
    .file-manager,
    .rozgaar {
        width: 48px;
    }

    .insta {
        position: absolute;
        top: 7%;
        left: 36%;
    }

    .youtube {
        position: absolute;
        top: 22%;
        left: 59%;
    }

    .store {
        position: absolute;
        top: 33%;
        left: 40%;
    }

    .Kooliya {
        position: absolute;
        top: 0;
        left: 25%;
    }

    .orangebox {
        position: absolute;
        top: 18%;
        left: 15%;
    }

    .byju {
        position: absolute;
        top: 35%;
        left: 0;
    }

    .excel {
        position: absolute;
        top: 33%;
        left: 0%;
    }

    .power-point {
        position: absolute;
        top: 10%;
        right: 9%;
    }

    .brave {
        position: absolute;
        bottom: 32%;
        right: 37%;
    }

    .n-img {
        position: absolute;
        top: 35%;
        right: 7%;
    }

    .canva {
        position: absolute;
        top: 59%;
        right: 2%;
    }

    .duolingo {
        position: absolute;
        bottom: 19%;
        right: 10%;
    }

    .test-book {
        position: absolute;
        bottom: 0;
        right: 21%;
    }

    .bgmi {
        position: absolute;
        bottom: 10%;
        right: 35%;
    }

    .pw {
        position: absolute;
        left: 34%;
        bottom: 22%;
    }

    .freefire {
        position: absolute;
        bottom: 0;
        left: 43%;
    }

    .subwaysurfer {
        position: absolute;
        bottom: 4%;
        left: 25%;
    }

    .ms-word {
        position: absolute;
        bottom: 15%;
        left: 7%;
    }

    .file-manager {
        position: absolute;
        bottom: 0;
        left: 1%;
    }

    .rozgaar {
        position: absolute;
        left: 10%;
        bottom: 36%;
    }

    .content-show {
        height: 200px;
    }

    .headingTwo {
        font-size: 2.4rem;
    }

    .swiper-x-padding {
        padding: 0 !important;
    }

    .swiper-slide {
        padding: 0 20px;
    }

    .desktop-prev-btn,
    .desktop-next-btn {
        top: var(--swiper-navigation-top-offset, 87%) !important;
    }

    .desktop-next-btn {
        right: 70% !important;
    }

    .padding-for-mob {
        padding-bottom: 80px !important;
    }

    .cost-effect-box div svg {
        width: 60px;
        height: 60px;
    }

    .cost-effect-box h5 {
        font-size: 1.5rem;
    }

    .cost-effect-box p {
        padding-top: 7px;
        color: var(--text-gray);
    }

    .mob-size-font {
        font-size: 1.2rem;
    }

    .headingFive {
        font-size: 14px;
        font-weight: 500;
    }

    .primary-btn {
        text-align: center;
        padding: 8px 20px;
    }

    .service-title {
        font-size: 36px;
    }

    .customer-support p {
        text-align: start !important;
    }

    .social-icons a svg {
        width: 38px;
        height: 38px;
    }

    .hero-section {
        height: 90vh;
    }

    .image-change-box {
        width: 100%;
        bottom: 0;
        left: 50%;
        transform: translate(-50%, 0) scale(0);
        transform-origin: center;
    }

    .swiper-button-prev-second {
        left: 65% !important;
    }

    #gurkha-suv {
        width: 100%;
        height: 260px;
    }

    .width-set {
        width: 85%;
    }

    .heroDiv {
        overflow: hidden !important;
    }

    #pinnedsection {
        transform: translateY(200%);
    }

    #scrollImage {
        width: 100%;
    }

    .text-change {
        height: 100vh;
    }

    .mob-bg {
        background: var(--grayish-white);
    }

    .custom-service-mobile {
        background: var(--gray) !important;
    }

    .custom-service-mobile>h3 {
        color: var(--white) !important;
    }

    .service-title {
        color: var(--white);
    }

    .service-content {
        color: #ffffffba;
    }

    .laptopImg-1 {
        width: 120%;
        height:110%;
        transform: translateX(-65px);
    }

    .mobile_font .accordion-item h2>button{
       font-size:25px !important;
    }
    .tabcontent{
        height:170px;
    }
}

@media (min-width: 576px) and (max-width: 767.98px) {
    .text-span span {
        font-size: 18vw;
        line-height: 27vw;
    }

    .font-size-set {
        font-size: 16px;
    }

    .text-change {
        height: 480px;
    }

    .gradientText {
        font-weight: 700;
        font-size: 1.8em;
    }

    .headingThree {
        font-size: 1.6rem;
        font-weight: 700;
    }

    .stats {
        width: 80%;
        height: auto;
    }

    .stats h4 {
        font-size: 26px;
        font-weight: 800;
    }

    .stats p {
        font-weight: 500;
        text-align: center;
    }

    .footer-option {
        font-weight: 600;
        color: var(--mobile-blue);
        padding-bottom: 20px;
    }

    .footer-nav-option a {
        padding-bottom: 18px;
    }

    .icon-box {
        height: 270px;
    }

    /* images icons */
    .youtube,
    .store,
    .Kooliya,
    .orangebox,
    .byju,
    .excel,
    .power-point,
    .brave,
    .insta,
    .n-img,
    .canva,
    .duolingo,
    .test-book,
    .bgmi,
    .pw,
    .freefire,
    .subwaysurfer,
    .ms-word,
    .file-manager,
    .rozgaar {
        width: 35px;
    }

    .youtube {
        position: absolute;
        top: 15%;
        left: 59%;
    }

    .store {
        position: absolute;
        top: 10%;
        left: 40%;
    }

    .Kooliya {
        position: absolute;
        top: 0;
        left: 25%;
    }

    .orangebox {
        position: absolute;
        top: 18%;
        left: 15%;
    }

    .byju {
        position: absolute;
        top: 35%;
        left: 0;
    }

    .excel {
        position: absolute;
        top: 33%;
        left: 0%;
    }

    .power-point {
        position: absolute;
        top: 3%;
        right: 9%;
    }

    .brave {
        position: absolute;
        bottom: 20%;
        right: 37%;
    }

    .insta {
        position: absolute;
        top: 30%;
        right: 0;
    }

    .n-img {
        position: absolute;
        top: 27%;
        right: 7%;
    }

    .canva {
        position: absolute;
        top: 52%;
        right: 2%;
    }

    .duolingo {
        position: absolute;
        bottom: 15%;
        right: 20%;
    }

    .test-book {
        position: absolute;
        bottom: 0;
        right: 21%;
    }

    .bgmi {
        position: absolute;
        bottom: 1%;
        right: 35%;
    }

    .pw {
        position: absolute;
        left: 34%;
        bottom: 22%;
    }

    .freefire {
        position: absolute;
        bottom: 0;
        left: 43%;
    }

    .subwaysurfer {
        position: absolute;
        bottom: 4%;
        left: 25%;
    }

    .ms-word {
        position: absolute;
        bottom: 5%;
        left: 18%;
    }

    .file-manager {
        position: absolute;
        bottom: 0;
        left: 1%;
    }

    .rozgaar {
        position: absolute;
        left: 5%;
        bottom: 28%;
    }

    .content-show {
        height: 200px;
    }

    .headingTwo {
        font-size: 2.4rem;
    }

    .swiper-x-padding {
        padding: 0 !important;
    }

    .swiper-slide {
        padding: 0 20px;
    }

    .desktop-prev-btn,
    .desktop-next-btn {
        top: var(--swiper-navigation-top-offset, 87%) !important;
    }

    .desktop-next-btn {
        right: 60% !important;
    }

    .padding-for-mob {
        padding-bottom: 80px !important;
    }

    .cost-effect-box div svg {
        width: 60px;
        height: 60px;
    }

    .cost-effect-box h5 {
        font-size: 1.5rem;
    }

    .cost-effect-box p {
        padding-top: 7px;
        color: var(--text-gray);
    }

    .mob-size-font {
        font-size: 1.2rem;
    }

    .headingFive {
        font-size: 14px;
        font-weight: 500;
    }

    .primary-btn {
        text-align: center;
        padding: 8px 20px;
    }

    .service-title {
        font-size: 36px;
    }

    .customer-support p {
        text-align: start !important;
    }

    .social-icons a svg {
        width: 38px;
        height: 38px;
    }

    .hero-section {
        height: 100vh;
    }

    .image-change-box {
        width: 100%;
    }

    .swiper-button-prev-second {
        left: 65% !important;
    }

    #scrollImage {
        width: 100%;
    }
}

@media (min-width: 768px) and (max-width: 991.98px) {
    .text-span span {
        font-size: 7.4vh;
        line-height: 12vh;
    }
    .heroDiv {
    overflow: hidden !important;
    }


    .font-size-set {
        font-size: 20px;
    }

    .text-change {
        height: 50vh;
    }

    .headingThree {
        font-size: 2rem;
    }

    .gradientText {
        font-weight: 700;
        font-size: 4.6em;
        white-space: nowrap;
    }

    .stats {
        width: 180px;
        height: 180px;
    }

    .icon-box {
        height: 550px;
    }

    /* images icons */
    .youtube,
    .store,
    .Kooliya,
    .orangebox,
    .byju,
    .excel,
    .power-point,
    .brave,
    .insta,
    .n-img,
    .canva,
    .duolingo,
    .test-book,
    .bgmi,
    .pw,
    .freefire,
    .subwaysurfer,
    .ms-word,
    .file-manager,
    .rozgaar {
        width: 5vh;
    }

    .youtube {
        position: absolute;
        top: 4%;
        left: 54%;
    }

    .store {
        position: absolute;
        top: -10%;
        left: 40%;
    }

    .Kooliya {
        position: absolute;
        top: -3%;
        left: 12%;
    }

    .orangebox {
        position: absolute;
        top: 10%;
        left: 13%;
    }

    .byju {
        position: absolute;
        top: 35%;
        left: 0;
    }

    .excel {
        position: absolute;
        top: 30%;
        left: 22%;
    }

    .power-point {
        position: absolute;
        top: 19%;
        right: 38%;
    }

    .brave {
        position: absolute;
        top: 0;
        right: 5%;
    }

    .insta {
        position: absolute;
        top: 20%;
        right: 0;
    }

    .n-img {
        position: absolute;
        top: 35%;
        right: 23%;
    }

    .canva {
        position: absolute;
        top: 49%;
        right: 4%;
    }

    .duolingo {
        position: absolute;
        bottom: 30%;
        right: 20%;
    }

    .test-book {
        position: absolute;
        bottom: 7%;
        right: 8%;
    }

    .bgmi {
        position: absolute;
        bottom: 18%;
        right: 30%;
    }

    .pw {
        position: absolute;
        left: 40%;
        bottom: 32%;
    }

    .freefire {
        position: absolute;
        bottom: 0;
        left: 43%;
    }

    .subwaysurfer {
        position: absolute;
        bottom: 4%;
        left: 15%;
    }

    .ms-word {
        position: absolute;
        bottom: 21%;
        left: 28%;
    }

    .file-manager {
        position: absolute;
        bottom: 23%;
        left: 1%;
    }

    .rozgaar {
        position: absolute;
        left: 8%;
        bottom: 39%;
    }

    .content-show {
        height: 440px;
    }

    .headingTwo {
        font-size: 2.8rem;
    }

    .stats h4 {
        font-size: 26px;
        font-weight: 600;
    }

    .swiper-x-padding {
        padding: 0 30px !important;
    }

    .swiper-slide {
        padding: 0 35px;
    }

    .hero-section {
        height: 90vh;
    }

    .image-change-box {
        width: 130%;
    }

    .swiper-button-prev-second {
        left: 85% !important;
    }

    .service-title {
        font-size: 32px;
    }

    #scrollImage {
        width: 50vh;
    }

    #pinnedsection {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        transform: translateY(200%);
    }

    .text-change {
        height: 100vh;
    }
}

@media (min-width:992px) and (max-width: 1199px) {
    .text-span span {
        font-size: 30vh;
        line-height: 25vh;
    }

    .font-size-set {
        font-size: 20px;
    }

    .text-change {
        height: 100vh;
    }

    .headingThree {
        font-size: 2rem;
    }

    .gradientText {
        font-weight: 700;
        font-size: 6.6em;
    }

    .stats {
        width: 180px;
        height: 180px;
    }

    .icon-box {
        height: 550px;
    }

    /* images icons */
    .youtube,
    .store,
    .Kooliya,
    .orangebox,
    .byju,
    .excel,
    .power-point,
    .brave,
    .insta,
    .n-img,
    .canva,
    .duolingo,
    .test-book,
    .bgmi,
    .pw,
    .freefire,
    .subwaysurfer,
    .ms-word,
    .file-manager,
    .rozgaar {
        width: 9vh;
    }

    .youtube {
        position: absolute;
        top: 0;
        left: 54%;
    }

    .store {
        position: absolute;
        top: 0;
        left: 40%;
    }

    .Kooliya {
        position: absolute;
        top: 0;
        left: 25%;
    }

    .orangebox {
        position: absolute;
        top: 10%;
        left: 10%;
    }

    .byju {
        position: absolute;
        top: 35%;
        left: 0;
    }

    .excel {
        position: absolute;
        top: 30%;
        left: 22%;
    }

    .power-point {
        position: absolute;
        top: 10%;
        right: 27%;
    }

    .brave {
        position: absolute;
        top: 0;
        right: 10%;
    }

    .insta {
        position: absolute;
        top: 30%;
        right: 0;
    }

    .n-img {
        position: absolute;
        top: 35%;
        right: 23%;
    }

    .canva {
        position: absolute;
        top: 44%;
        right: 10%;
    }

    .duolingo {
        position: absolute;
        bottom: 25%;
        right: 20%;
    }

    .test-book {
        position: absolute;
        bottom: 0;
        right: 21%;
    }

    .bgmi {
        position: absolute;
        bottom: 12%;
        right: 35%;
    }

    .pw {
        position: absolute;
        left: 40%;
        bottom: 22%;
    }

    .freefire {
        position: absolute;
        bottom: 0;
        left: 43%;
    }

    .subwaysurfer {
        position: absolute;
        bottom: 4%;
        left: 25%;
    }

    .ms-word {
        position: absolute;
        bottom: 28%;
        left: 28%;
    }

    .file-manager {
        position: absolute;
        bottom: 0;
        left: 1%;
    }

    .rozgaar {
        position: absolute;
        left: 11%;
        bottom: 28%;
    }

    .content-show {
        height: 440px;
    }

    .headingTwo {
        font-size: 2.8rem;
    }

    .stats h4 {
        font-size: 26px;
        font-weight: 600;
    }

    .swiper-x-padding {
        padding: 0 30px !important;
    }

    .swiper-slide {
        padding: 0 35px;
    }

    .swiper-button-prev-second {
        left: 90% !important;
    }

    .video-fluid {
        transform: translateY(-37px);
    }
}

@media (min-width: 1200px) {
    .text-span span {
        font-size: 30vh;
        line-height: 25vh;
    }

    .font-size-set {
        font-size: 20px;
    }

    .text-change {
        height: 100dvh;
    }

    .headingThree {
        font-size: 2rem;
    }

    .gradientText {
        font-weight: 700;
        font-size: 6.6em;
    }

    .stats {
        width: 180px;
        height: 180px;
    }

    .icon-box {
        height: 550px;
    }

    /* images icons */
    .youtube,
    .store,
    .Kooliya,
    .orangebox,
    .byju,
    .excel,
    .power-point,
    .brave,
    .insta,
    .n-img,
    .canva,
    .duolingo,
    .test-book,
    .bgmi,
    .pw,
    .freefire,
    .subwaysurfer,
    .ms-word,
    .file-manager,
    .rozgaar {
        width: 9vh;
    }

    .youtube {
        position: absolute;
        top: 0;
        left: 54%;
    }

    .store {
        position: absolute;
        top: 0;
        left: 40%;
    }

    .Kooliya {
        position: absolute;
        top: 0;
        left: 25%;
    }

    .orangebox {
        position: absolute;
        top: 10%;
        left: 10%;
    }

    .byju {
        position: absolute;
        top: 35%;
        left: 0;
    }

    .excel {
        position: absolute;
        top: 30%;
        left: 22%;
    }

    .power-point {
        position: absolute;
        top: 10%;
        right: 27%;
    }

    .brave {
        position: absolute;
        top: 0;
        right: 10%;
    }

    .insta {
        position: absolute;
        top: 30%;
        right: 0;
    }

    .n-img {
        position: absolute;
        top: 35%;
        right: 23%;
    }

    .canva {
        position: absolute;
        top: 44%;
        right: 10%;
    }

    .duolingo {
        position: absolute;
        bottom: 25%;
        right: 20%;
    }

    .test-book {
        position: absolute;
        bottom: 0;
        right: 21%;
    }

    .bgmi {
        position: absolute;
        bottom: 12%;
        right: 35%;
    }

    .pw {
        position: absolute;
        left: 40%;
        bottom: 22%;
    }

    .freefire {
        position: absolute;
        bottom: 0;
        left: 43%;
    }

    .subwaysurfer {
        position: absolute;
        bottom: 4%;
        left: 25%;
    }

    .ms-word {
        position: absolute;
        bottom: 28%;
        left: 28%;
    }

    .file-manager {
        position: absolute;
        bottom: 0;
        left: 1%;
    }

    .rozgaar {
        position: absolute;
        left: 11%;
        bottom: 28%;
    }

    .content-show {
        height: 440px;
    }

    .headingTwo {
        font-size: 2.8rem;
    }

    .stats h4 {
        font-size: 26px;
        font-weight: 600;
    }

    .swiper-x-padding {
        padding: 0 30px !important;
    }

    .swiper-slide {
        padding: 0 35px;
    }

    .swiper-button-prev-second {
        left: 90% !important;
    }

    .video-fluid {
        transform: translateY(-37px);
    }

}

@media (min-width:1700px) {
    #scrollImage {
        width: 120vh;
    }
}