/* Media Query Responsive */

@media only screen and (min-width: 1920px) {
    body,
    header,
    .main-hero-section,
    nav {
        max-width: 1920px;
        margin: 0 auto;
    }

    .about-details-section {
        padding-top: 50px;
    }
}

@media screen and (min-width: 1400px) {
    #expertiseCarousel .card {
        height: 270px;
        justify-content: center !important;
    }

    .portfolio-project-card figcaption {
        font-size: 4rem;
        text-align: center;
    }

    .contact-box .whychoose-item .whychoose-inner-item {
        height: 310px !important;
        justify-content: center !important;
    }
}

@media screen and (min-width: 1500px) {
    .newsletter__section {
        width: 65%;
        margin: auto;
    }

    .hero-form {
        margin-left: 40px;
    }
}

@media screen and (min-width: 1200px) {
    .sticky-col {
        position: sticky;
        top: 85px;
        height: 130vh;
    }
}

@media screen and (max-width: 1500px) {
    .gallary-section figure img,
    .gallary-section figure {
        height: auto;
    }

    .hiring-checks .bagdehire label,
    .hiring-checks .bagdehire span {
        font-size: 14px !important;
    }

    .footer__section {
        position: relative;
        margin-top: 100px;
        padding: 100px 16px 60px 16px;
        background-color: #ebebeb;
    }

    .work__section .work__card__section {
        display: grid;
        grid-template-columns: auto auto auto;
        gap: 20px;
    }

    .hero-form-img-content .hero-form {
        padding: 1rem !important;
    }

    .hiring-checks .bagdehire label,
    .hiring-checks .bagdehire span {
        font-size: 13px !important;
    }

    #expertiseCarousel .card {
        height: 300px;
        justify-content: center !important;
    }

    .h1-font-style,
    .hero-section .ai-gradient,
    .hero-section .ai-gradient::after {
        font-size: 60px !important;
    }

    .footer-section hr {
        margin: 25px auto !important;
    }
}

@media screen and (max-width: 1399px) {
    .mobile-hiden {
        display: none;
    }

    .mobile-help {
        display: block;
    }

    .help-item.three-item p,
    .help-item.five-item p {
        max-width: 100% !important;
    }

    .newsletter__section {
        left: 50px;
        right: 50px;
    }

    .newsletter__section .width-75 {
        width: 60%;
    }

    .footer__section .newsletter__section .footer-news-img {
        top: 140px;
        height: 300px;
    }

    .top-81,
    .top-45 {
        top: auto;
        position: relative;
    }

    .portfolio-preview {
        max-height: 307px;
        height: 307px;
        background-position: 100% 0;
        overflow-x: auto;
    }

    .mt-80px {
        margin-top: 100px;
    }

    .portfolio-preview::-webkit-scrollbar {
        height: 3px !important;
    }

    .portfolio-design {
        width: 100%;
        position: relative;
        min-width: 100%;
        height: 303px;
        transform: translate(0, 0);
    }

    .portfolio-project-card figcaption {
        font-size: 2rem;
        text-align: center;
    }

    .offer-arrow-img {
        height: 80px;
    }

    .face {
        font-size: 14px !important;
    }

    .hero__section {
        height: auto;
    }

    .video-company {
        display: flex !important;
        align-items: center !important;
    }

    .video-company .object-fit-cover {
        object-fit: contain !important;
        height: fit-content !important;
    }

    .section-title {
        font-size: 42px !important;
    }

    .contact-box .whychoose-item .whychoose-inner-item {
        height: 375px !important;
    }
}

@media screen and (max-width: 1199px) {
    .nav-item.dropdown:hover,
    .nav-item.dropdown:hover .dropdown-toggle::after {
        color: unset !important;
    }
    .navbar .btn-primary {
        width: 110px !important;
        height: 30px !important;
        font-size: 14px !important;
    }

    .navbar-brand .nav-logo:nth-of-type(1) {
        width: 185px !important;
    }

    .navbar-brand .nav-logo:nth-of-type(1) {
        display: block !important;
    }

    .nav-logo:nth-of-type(2) {
        display: none !important;
    }

    .nav-item.dropdown .dropdown-menu,
    .nav-item.dropdown:hover .dropdown-menu {
        display: none !important;
    }

    .nav-item.dropdown .dropdown-menu.show {
        display: block !important;
        position: relative;
        top: unset !important;
        right: unset;
        left: unset;
        width: 100% !important;
        padding: 10px !important;
    }

    .navbar-nav .dropdown-menu.show {
        position: absolute;
        display: block !important;
    }

    .navbar-nav .nav-item.has_submenu > .nav-link {
        padding: 0px !important;
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
    }

    .navbar-nav .nav-item .nav-link,
    .navbar-nav .nav-link.dropdown-toggle {
        justify-content: space-between !important;
    }

    .navbar-nav .nav-item .nav-link {
        justify-content: start !important;
    }

    .navbar-nav .dropdown-menu::-webkit-scrollbar {
        width: 1px !important;
    }

    .hero-section .hero-responsive {
        display: flex;
        margin-top: -30px;
        justify-content: center;
    }

    .hero-section .hero-design,
    .hero-section .watch-icon,
    .hero-section .hero-mobile,
    .hero-section .laptop-part {
        display: none;
    }

    .grid-template-2 {
        grid-template-columns: auto auto;
    }

    .clientlogo-section .owl-nav {
        position: relative;
        display: block !important;
        bottom: auto;
        right: auto;
        width: 100%;
        left: auto;
    }

    .footer__section .newsletter__section .footer-news-img {
        position: relative;
        top: unset;
        right: unset;
        width: 200px;
        height: 240px;
    }

    .newsletter__section {
        position: relative;
        right: unset;
        top: unset;
        left: unset;
        padding: 32px 24px !important;
        margin-bottom: 20px !important;
    }

    .newsletter__section .width-75 {
        width: 90%;
    }

    .about-details-section .title-desc {
        padding: 0px 10px;
    }

    .about-details-section .about-main-img {
        height: 400px;
        width: 100%;
    }

    .hero-bg-img {
        display: none !important;
    }

    .hero__section {
        height: 100%;
    }

    .w-85,
    .w-75,
    .w-50,
    .w-25 {
        width: 100% !important;
    }

    .mt-80px {
        margin-top: 0px;
    }

    .offer-img {
        height: auto;
        overflow: hidden;
    }

    .custom-development .text-shape {
        font-size: 60px !important;
    }

    .h-100vh-min {
        min-height: 100vh;
        height: max-content;
        overflow-y: auto;
    }

    .clientstestimonial-section .owl-nav.disabled {
        position: unset !important;
        width: 100% !important;
        justify-content: center !important;
    }

    .text-link:hover::before {
        display: none !important;
    }

    .section-150px {
        padding: 70px 0px;
    }

    .section {
        padding: 50px 0px;
    }

    .footer__section {
        padding: 14px 0px 30px !important;
        margin-top: 0px !important;
    }

    /* .fixed-top {
        position: relative;
    }*/

    header nav {
        min-height: 70px !important;
    }

    main {
        padding-top: 70px !important;
    }

    .client-testimonial-item {
        height: auto;
    }

    .client-testimonial-item {
        background: linear-gradient(-90deg, #b1f1ff 0.81%, #ffe5ad 100%);
    }

    .service-grid .text-justify {
        text-align: left;
    }

    .main-hero-inner-img {
        margin-top: 24px;
    }

    .main-hero-inner-img {
        display: flex;
        justify-content: center;
    }

    .gallary-grid-container .column {
        flex: 40%;
        flex-wrap: wrap;
        max-width: 50%;
    }

    .inner-services .grid-2 {
        align-items: start !important;
    }

    .bg-light-blue.grid-2 {
        width: max-content !important;
    }

    .bg-light-blue .small-gray-text {
        font-size: 10px !important;
    }

    .bg-light-blue strong {
        font-size: 14px !important;
    }

    .whychoose-list i {
        font-size: 3rem !important;
    }

    .dropdown:hover .outer-dropdown,
    .dropdown .dropdown-menu.show .outer-dropdown {
        position: relative !important;
        top: 0px !important;
    }

    .dropdown-box {
        padding: 0px !important;
    }

    .dropdown-content-box {
        padding: 10px !important;
    }

    .navbar-expand-xl .navbar-nav .dropdown-menu {
        top: unset;
    }

    .dropdown .outer-dropdown,
    .dropdown .dropdown-menu.show-menu .outer-dropdown {
        display: none !important;
        opacity: 0 !important;
        visibility: hidden !important;
    }

    .ul-nav .dropdown {
        width: 100% !important;
    }

    .dropdown .dropdown-menu.show .outer-dropdown,
    .dropdown .dropdown-menu.show-menu.show .outer-dropdown {
        display: grid !important;
        opacity: 1 !important;
        visibility: visible !important;
        width: 100% !important;
    }

    .nav-item.dropdown.change-hover .dropdown-toggle::after {
        rotate: 0deg !important;
        transition: none;
    }

    .nav-item.dropdown.change-hover .dropdown-toggle,
    .nav-item.dropdown.change-hover .dropdown-toggle::after {
        color: unset !important;
    }

    .nav-item.dropdown .dropdown-toggle.show::after {
        rotate: -180deg !important;
        transition: 0.2s all ease-in;
    }

    .nav-item.dropdown .dropdown-toggle.show,
    .nav-item.dropdown .dropdown-toggle.show::after {
        color: #108aff !important;
    }

    .nav-item.dropdown .dropdown-menu.show {
        height: auto !important;
        padding: 0px !important;
    }

    .dropdown-content-box {
        margin: 0px !important;
    }

    .ul-nav.hide {
        display: none !important;
    }

    .ul-nav {
        display: flex !important;
        width: 100% !important;
        position: relative;
        top: 15px !important;
    }

    .ul-nav ul {
        height: 100vh !important;
    }

    .ul-nav ul.link-box {
        height: auto !important;
        display: grid !important;
        grid-template-columns: 30% 30% 30% !important;
        gap: 0px 10px !important;
    }

    .navbar-nav .nav-link.active,
    .navbar-nav .nav-link.show {
        color: #108aff !important;
    }

    .navbar-nav .nav-item .nav-link.active,
    .navbar-nav .nav-link.dropdown-toggle.active,
    .navbar-nav .nav-item .nav-link:focus,
    .navbar-nav .nav-link.dropdown-toggle:focus {
        border-bottom: none !important;
    }

    .scroll-nav-header {
        border-radius: 0px !important;
        margin: 0px !important;
        min-width: 100vw !important;
        box-shadow: 0px 4px 34px 0px #0000001f !important;
    }

    .navbar .btn-primary {
        margin-right: 8px !important;
    }
    .navbar-nav .nav-item .dropdown-single-item .nav-link {
        font-size: 12px !important;
        margin-bottom: 10px !important;
    }

    .ul-nav #collapseQA .link-box li {
        margin-bottom: 0px !important;
    }

    .link-box li {
        display: flex !important;
        justify-content: flex-start !important;
    }

    .navbar-nav .nav-item .inner-services:last-child .nav-link:last-child,
    .ul-nav ul.link-box li:last-child {
        margin-bottom: 0px !important;
    }

    .dropdown-box {
        margin: 8px 0px 6px !important;
    }

    .dropdown-toggle::after {
        border-top: 0.44em solid !important;
        border-right: 0.44em solid transparent !important;
        border-bottom: 0 !important;
        border-left: 0.44em solid transparent !important;
    }

    .dropdown-box .grid-2,
    .dropdown-box .grid-4 {
        justify-content: space-between !important;
        border-radius: 6px !important;
    }

    .dropdown-box .bg-light-blue.grid-2,
    .navbar-nav .grid-4 {
        grid-template-columns: auto auto !important;
        flex-wrap: wrap !important;
    }

    .main-service-hero,
    .main-hero-right-img,
    .main-hero-right-img.h-400px.privacy-img {
        height: 300px !important;
    }

    .hero-form-img-content .hero-form {
        width: 100%;
    }

    .hire-common .feature-box {
        width: 80%;
        height: auto;
    }

    .hero-content .hero-form-img-content {
        position: relative;
        top: unset;
        right: unset;
    }

    .contact-box .whychoose-item .whychoose-inner-item {
        height: 315px !important;
    }

    .navbar-nav .nav-item .nav-link,
    .navbar-nav .nav-link.dropdown-toggle {
        padding: 0px !important;
    }

    .navbar-nav .nav-item .nav-link:hover,
    .navbar-nav .nav-link.dropdown-toggle:hover,
    .navbar-nav .nav-item .nav-link,
    .navbar-nav .nav-link.dropdown-toggle {
        border-bottom: none !important;
    }

    .ul-nav .nav-item,
    .mobile-accordion {
        padding: 8px 0px !important;
        border-bottom: 1px solid #d7d7d7 !important;
    }

    .ul-nav .nav-item:last-child {
        padding: 10px 0px 0px !important;
        border-bottom: none !important;
    }

    .accordion {
        margin: 10px 0px;
    }

    .navbar-nav .nav-item > .nav-link {
        height: auto !important;
        display: unset !important;
        align-items: unset !important;
    }

    .review-btn .star i {
        display: none !important;
    }

    .review-btn .star i:last-child {
        display: flex !important;
    }

    .video-element,
    .video-section {
        height: auto !important;
        width: 100% !important;
        object-fit: unset !important;
    }

    .small-text-service {
        font-size: 1.4rem !important;
        line-height: 2rem !important;
    }

    .h1-font-style.font-48 {
        font-size: 36px !important;
        display: flex !important;
        justify-content: center !important;
    }

    .small-logo{
        height: 30px !important;
    }
}

@media only screen and (min-width: 1023px) and (max-width: 1200px) {
    .timeline > .timeline-item .timeline-step-data .circle span {
        border-radius: 50%;
        width: 50px;
        height: 50px;
        float: left;
        color: #fff;
        text-align: center;
        font-size: 20px !important;
        line-height: 50px !important;
    }
}

@media only screen and (max-width: 1024px) {
    .timeline > .timeline-item .timeline-step-data .circle {
        width: 20%;
        float: left;
    }

    .timeline > .timeline-item .timeline-step-data .circle span {
        border-radius: 50%;
        width: 40px;
        height: 40px;
        float: left;
        color: #fff;
        text-align: center;
        font-size: 16px !important;
        line-height: 40px !important;
    }

    .timeline > .timeline-item .timeline-step-pic img {
        position: relative;
        z-index: 10;
    }

    .navbar-nav .nav-item .dropdown-menu.hire-resource {
        grid-template-columns: auto;
        max-height: 250px;
        max-width: 280px;
        overflow-y: auto;
        overflow-x: hidden;
    }

    .offer-card {
        height: 500px;
    }

    .benefit__section .benefit__card__section {
        display: grid;
        grid-template-columns: 100%;
        gap: 20px;
    }

    .portfolio-project-card img {
        aspect-ratio: 16/9;
    }

    .portfolio-card-section {
        padding: 0px !important;
    }

    .small-text.text-black {
        font-size: 14px !important;
    }

    .service-grid .smallest-text-400 {
        font-size: 16px !important;
    }

    .service-grid .small-gray-text.font-14 {
        font-size: 12px !important;
    }

    .hero-bg-img {
        display: none !important;
    }

    .calendly-inline-widget {
        height: 1060px !important;
    }

    #serviceDescBox {
        display: none !important;
    }

    /* .marquee-track {
        animation: scroll-left 18s linear infinite;
    } */
    .team-marquee .marquee-loop {
        animation: marquee-loop-wise 30s linear infinite;
    }

    .ai-content-box {
        grid-template-columns: 40% auto !important;
    }

    .get-touch-section h2 {
        font-size: 32px !important;
        line-height: 50px !important;
    }

    .get-touch-section .btn-secondary {
        padding: 10px 15px !important;
        font-size: 1rem !important;
        line-height: 1.6rem !important;
    }

    .review-card-section .card {
        padding: 8px !important;
    }

    .review-card-section .card .card-desc {
        font-size: 13px !important;
        line-height: 13px !important;
    }

    .review-card-section .card .card-title {
        font-size: 32px !important;
        line-height: 48px !important;
    }

    .review-btn.gf-btn {
        box-shadow: none !important;
    }

    .review-btn i,
    .review-btn i:last-child {
        font-size: 20px !important;
        line-height: 24px !important;
    }

    .review-btn.gf-btn i:last-child,
    .review-btn.cl-btn i:last-child {
        font-size: 24px !important;
        line-height: 24px !important;
    }

    .review-btn.gf-btn img,
    .review-btn.cl-btn img {
        width: 24px !important;
        height: 24px !important;
    }
}

@media screen and (max-width: 991px) {
    .h1-font-style,
    .hero-section .ai-gradient,
    .hero-section .ai-gradient::after {
        font-size: 48px !important;
    }

    .h1-font-style.font-48 {
        font-size: 30px !important;
    }

    .hero_description {
        font-size: 16px !important;
    }

    .section-title {
        font-size: 38px !important;
    }

    .ai-content-box {
        gap: 24px;
    }

    .services-section .service-cards .row {
        justify-content: center;
    }

    .services-section .mb-90 {
        margin-bottom: 52px;
    }

    .services-section .service-card .face {
        transform: translateY(0px);
    }

    .services-section .service-card:hover .face {
        height: auto !important;
    }

    .services-section .service-card .card-info {
        display: block;
        transition: 0.5s;
    }

    .grid-template-2 {
        grid-template-columns: auto;
        gap: 15px;
    }

    .casestudies-section {
        padding: 46px 0;
    }

    .timeline > .timeline-item .timeline-step-data {
        padding: 15px;
    }

    .timeline-dashed-right,
    .timeline-dashed-left {
        display: none !important;
    }

    .about-details-section .about-main-img {
        width: 90% !important;
        margin: auto !important;
    }

    .timeline > .timeline-item > .row > .right-box,
    .timeline > .timeline-item > .row > .left-box {
        padding: 0px !important;
    }

    .timeline > .timeline-item > .timeline-step-line.last-line-arrow:after {
        bottom: -60px !important;
    }

    .scrollToTop {
        bottom: 90px;
        right: 20px;
        left: auto;
        opacity: 0.6;
    }

    .team-card .team-content {
        padding: 12px 10px !important;
    }

    .small-gray-text {
        font-size: 12px !important;
    }

    .content-main-title {
        font-size: 18px !important;
    }

    .face {
        position: relative !important;
    }

    .team-card {
        margin-bottom: 24px !important;
    }

    .team-card img {
        border-radius: 20px 20px 0px 0px;
        margin-bottom: 0px;
        filter: none;
    }

    .team-card .team-content {
        position: relative;
        width: 100%;
        margin: auto;
        transform: none;
        border-radius: 0px 0px 20px 20px;
        filter: none;
    }

    .benifits-img img {
        height: 500px;
        min-width: 200px;
    }

    .gallary-section {
        grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    }

    .gallary-section figure img {
        filter: grayscale(0);
    }

    .offer-section .owl-theme .owl-nav [class*="owl-"] {
        display: none !important;
    }

    #owl-logo .owl-nav .owl-prev,
    #owl-logo .owl-nav .owl-next {
        display: none !important;
    }

    .timeline > .timeline-item > .timeline-step-line.last-line-arrow:after {
        display: none;
    }

    #expertiseCarousel .card {
        height: 300px;
    }

    .offer-section {
        padding-top: 50px !important;
        padding-bottom: 30px !important;
    }

    .owl-theme .owl-nav.disabled + .owl-dots {
        margin-top: 27px !important;
    }

    .main-hero-right-img.h-400px {
        height: 400px !important;
        margin-top: 30px;
    }

    .main-hero-right-img.h-400px.privacy-img {
        height: auto !important;
        margin-top: 30px;
    }

    .offer-arrow-img {
        height: 40px;
    }

    .testimonial-view .owl-item.active.center .testimonial-box {
        transform: scale(1) !important;
        box-shadow: none !important;
        border: 1px solid #00000022;
    }

    .testimonial-box {
        margin-bottom: 0px !important;
    }

    .star-section .card {
        padding: 1rem !important;
    }

    .star-section .card small,
    .star-section .card i,
    .star-section .card .rating-container {
        font-size: 12px !important;
    }

    #testimonial-carousel .owl-dots {
        padding: 0px 0px;
    }

    .star-section {
        padding: 30px 0px;
    }

    .goodfirm-widget .stamp-widget_rating {
        font-size: 14px;
    }

    /* .certificate-icon {
        order: 2;
    } */

    .goodfirm-widget {
        height: auto;
    }

    .footer-section .goodfirm-widget {
        height: max-content;
    }

    .goodfirm-widget .font-18 {
        font-size: 12px !important;
    }

    .goodfirm-widget .stamp-widget_top {
        padding: 4px 10px;
    }

    .follow__us,
    .contact__us .icon,
    .footer__section .list__text li,
    .footer__section .list__text {
        font-size: 14px !important;
    }

    .contact__us .icon,
    .follow__us .icon {
        font-size: 14px !important;
    }

    .footer__section .small-gray-text {
        font-size: 12px !important;
    }

    .footer__section .card-contact {
        width: 100% !important;
    }

    .footer__section .card-contact img {
        width: 50px !important;
        height: 30px !important;
    }

    .social__link {
        line-height: 20px !important;
    }

    .social__link i {
        color: #000 !important;
        font-size: 20px !important;
    }

    footer .copyright__section p {
        font-size: 12px !important;
        line-height: 1.5 !important;
    }

    .scrollToTop {
        bottom: 80px;
        left: auto;
        opacity: 1 !important;
        width: 30px;
        height: 30px;
        border: 2px solid #ffffff;
    }

    .copyright__section img:first-child {
        width: 100px !important;
    }

    .copyright__section img:nth-child(2) {
        width: 100px !important;
    }

    .copyright__section .font-md-small {
        font-size: 12px !important;
        padding: 0px !important;
    }

    .navbar > .container,
    .navbar > .container-fluid,
    .navbar > .container-lg,
    .navbar > .container-md,
    .navbar > .container-sm,
    .navbar > .container-xl,
    .navbar > .container-xxl {
        justify-content: space-between !important;
    }

    .services-section .service-card {
        padding-bottom: 30px;
    }

    .services-section .service-card {
        height: 380px;
        margin: 0px !important;
        max-width: 100%;
    }

    .box-shadow-lg {
        box-shadow: none !important;
        border-radius: 0px !important;
    }

    .timeline > .timeline-item > .timeline-step-dot {
        top: 0px !important;
    }

    .timeline > .timeline-item > .timeline-step-line {
        margin-left: 0px !important;
    }

    .grid-small-2 {
        grid-template-columns: 60% 50% !important;
        gap: 0px 10px !important;
    }

    .top-60px {
        margin-top: 10px !important;
    }

    .tech-img {
        height: 400px;
    }

    .contact-box .whychoose-item .whychoose-inner-item {
        height: 275px !important;
    }

    .marquee-inner {
        animation: scroll-marquee 15s linear infinite;
    }

    .marquee {
        padding: 1vh 0 !important;
    }

    .marquee-inner figure {
        width: 220px;
    }

    .marquee-inner figure img {
        width: 220px;
        height: 250px;
    }

    .tech-card .tech-img {
        width: 90px !important;
    }

    .technologies-section .nav-tabs .nav-link {
        width: 100px !important;
        height: 100px !important;
        padding: 0px 10px !important;
    }

    .home-hero-img {
        height: 300px !important;
    }

    .mobile-accordion .nav-link {
        font-size: 12px !important;
    }

    .marquee-tech,
    .video-bg,
    .video-ai-bg {
        background-size: contain !important;
    }

    .faq-section .accordion-button.collapsed::after {
        align-self: center !important;
    }

    .faq-section .faq-title .accordion-button {
        font-size: 0.875rem !important;
    }

    .ai-nav-tabs .ai-nav-tab {
        font-size: 0.875rem !important;
        line-height: 1rem !important;
    }

    .review-btn .star i {
        display: flex !important;
    }

    .hero-section .logo-img {
        height: 40px !important;
    }

    .review-btn.gf-btn i,
    .review-btn.gf-btn i:last-child,
    .review-btn.cl-btn i,
    .review-btn.cl-btn i:last-child {
        font-size: 20px !important;
        line-height: 20px !important;
    }

    .review-btn.gf-btn .star,
    .review-btn.cl-btn .star {
        margin-left: 15px !important;
    }
}

@media screen and (max-width: 876px) {
    #expertiseCarousel .card {
        height: 320px;
    }
}

@media screen and (max-width: 769px) {
    .tech-stack__section .card .grid-3,
    .tech-stack__section .card .grid-2 {
        display: flex;
        flex-wrap: wrap;
        column-gap: 40px;
        row-gap: 10px;
    }
}

@media screen and (max-width: 767px) {
    .hero_description {
        font-size: 16px !important;
    }

    .section-description {
        font-size: 14px !important;
        margin-top: 20px !important;
    }

    .about-details-section {
        padding: 20px 0px;
    }

    .ai-content-box {
        grid-template-columns: 100% !important;
        gap: 16px;
    }

    .offer-dots img {
        max-width: 70px;
    }

    .offer-cricle img {
        max-width: 60px;
    }

    .offer-arrow {
        right: 20px;
    }

    .offer-arrow img {
        max-width: 120px;
    }

    .technologies-item {
        width: 100%;
        max-width: 100%;
    }

    .hero-bg-img {
        display: block !important;
        position: relative;
        right: unset;
        left: 30% !important;
        top: 20px !important;
    }

    .technologies-section .nav-tabs .nav-link {
        font-size: 20px !important;
        line-height: 1.5 !important;
    }

    .ai-plateform-list {
        gap: 0px !important;
    }

    .text-link {
        font-size: 18px !important;
    }

    .ul-nav ul.link-box {
        height: auto !important;
        display: grid !important;
        grid-template-columns: 45% 45% !important;
        gap: 0px 10px !important;
    }

    .video-company .object-fit-cover {
        height: auto !important;
        object-fit: fill !important;
    }

    .video-company {
        display: block !important;
    }

    .h-300px {
        height: 340px !important;
        width: 85% !important;
    }

    .service-card .shape {
        background-size: cover;
        background-repeat: repeat;
    }

    .help-section .help-blue,
    .help-section .help-yellow,
    .help-section .small-circle {
        display: none;
    }

    .client-design-right img {
        max-width: 80px;
    }

    .client-design-left img {
        max-width: 80px;
    }

    .accordion-button {
        padding: 16px 20px !important;
        line-height: 1.5 !important;
    }

    .accordion-body {
        padding: 10px 20px 20px;
    }

    .navbar-nav .accordion-body {
        padding: 15px 10px !important;
    }

    .casestudies-item h3,
    .casestudies-item p {
        padding: 16px;
    }

    .tech-stack__section .card .grid-2,
    .tech-stack__section .card .grid-3,
    .work__section .work__card__section {
        display: grid;
        grid-template-columns: 48% 48%;
        gap: 10px;
    }

    .font-54 {
        font-size: 32px !important;
    }

    .team-card .team-content {
        width: 100%;
    }

    .content-main-title.font-medium {
        font-size: 24px !important;
        font-weight: 600 !important;
    }

    .offer-dots img {
        max-width: 70px;
    }

    .offer-cricle img {
        max-width: 60px;
    }

    .offer-arrow img {
        max-width: 120px;
    }

    .offer-dots {
        top: 0;
    }

    .offer-section .owl-carousel {
        max-width: 85%;
        margin: 0 auto;
    }

    .offer-section .owl-nav .disabled {
        display: none;
    }

    .benifits-img {
        order: -1;
        display: flex;
        justify-content: center;
    }

    .step::before {
        left: 16px;
    }

    .step img {
        left: 1.5rem;
    }

    .step::after {
        left: 40px;
    }

    .enquiry-section {
        margin-bottom: 0px !important;
    }

    .h-200px {
        height: 100px;
        width: 160px;
    }

    .scrollToTop svg {
        width: 14px;
    }

    #expertiseCarousel .card {
        height: 360px;
    }

    .w-90 {
        width: 90%;
    }

    .services-section .service-card {
        max-width: 100%;
    }

    .blue-bg .grid-3 {
        display: grid;
        grid-template-columns: 100%;
        gap: 0px;
    }

    .blue-bg .grid-3 {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
    }

    .benifits-img img {
        height: 90%;
        min-width: 130px;
        margin-bottom: 0px;
    }

    .enquiry-section.view-project {
        margin-bottom: 0px !important;
        background-attachment: unset;
    }

    .section-150px.md-pt-0 {
        padding: 0px 0px 50px !important;
    }

    .footer__section {
        margin: 0;
        padding: 30px 0px 30px !important;
    }

    .content-desc {
        font-size: 12px !important;
    }

    .clientstestimonial-section {
        margin-top: 30px;
    }

    .benifits-img {
        height: 300px;
    }

    .section-40 {
        padding: 20px 0px !important;
    }

    .section-40.px-4 {
        padding: 20px 12px !important;
    }

    .offer-section {
        padding-top: 20px !important;
    }

    .offer-circle {
        top: 30px !important;
    }

    .circle-group-image {
        right: 0px !important;
        width: auto !important;
        top: 30% !important;
    }

    .offer-circle img,
    .circle-group-image img {
        height: 200px !important;
    }

    .faq-bannerimg {
        height: auto;
    }

    .portfolio-project-card img {
        aspect-ratio: unset !important;
        width: 100% !important;
    }

    .portfolio-project-card {
        margin-bottom: 0px !important;
    }

    .portfolio-client {
        gap: 10px !important;
    }

    .hero-bg-img {
        display: none;
    }

    .expertise__section .card {
        padding: 1rem 0.6rem !important;
    }

    .section {
        padding: 30px 0px;
    }

    .hiring-checks .bagdehire label,
    .hiring-checks .bagdehire span,
    .tags .badge {
        font-size: 14px !important;
        padding: 6px 16px;
    }

    #expertiseCarousel .card {
        height: 260px;
    }

    .plane-img {
        height: 50px;
    }

    .portfolio-hero {
        height: 260px;
    }

    .portfolio-card img {
        height: 310px;
    }

    .hero-section .btn-primary,
    .main-hero-section .btn-secondary,
    .technologies-action a {
        min-width: 156px;
        padding: 8px 0px !important;
    }

    .benefit__section .benefit__card__section {
        padding-top: 10px;
    }

    .footer__section .newsletter__section .footer-news-img {
        width: 200px;
        height: 180px;
    }

    .testimonial-box {
        margin-bottom: 10px !important;
        font-size: 12px !important;
    }

    .portfolio-project-card.show {
        display: block;
    }

    .star-section .card .rating-container,
    .star-section .card small {
        font-size: 10px !important;
    }

    /* .footer__section .bg-white{
        background-color: #108aff !important;
    }

    .footer__section .bg-white span{
        color: #ffffff !important;
    } */

    .footer__section .bg-white .btn {
        font-size: 14px !important;
    }

    .enquiry-section {
        background-size: 100% 100%;
    }

    .menu-text-box .font-18 {
        font-size: 14px !important;
    }

    .menu-content .cta-button .btn-primary {
        font-size: 14px !important;
        padding: 5px 10px !important;
    }

    .menu-content {
        padding: 10px 0px 20px !important;
    }

    .testimonial-box {
        margin-top: 20px !important;
    }

    .goodfirm-widget {
        margin: 10px 0px 0px 0px;
    }

    .footer-section .goodfirm-widget {
        margin: 0px 0px 0px;
    }

    .certificate-icon {
        margin-bottom: 5px;
    }

    .whychoose-list i {
        font-size: 2rem !important;
    }

    .content-img {
        height: 70px;
        width: 70px;
    }

    .inner-services .nav-link img {
        width: 15px !important;
        height: 15px !important;
    }

    .dropdown-box .bold-text {
        display: none !important;
    }

    .table-bordered tr td,
    .table-bordered tr th {
        font-size: 14px !important;
        padding: 3px 6px !important;
    }

    .hero-content .hiring-content,
    .hero-content .hero-form-img-content {
        position: relative;
        width: 100%;
    }

    .hero-content .hero-form-img-content {
        right: unset;
        top: unset;
    }

    .services-section .service-card {
        height: auto !important;
        max-width: 100% !important;
        padding-bottom: 5px !important;
    }

    .services-section .service-card .card-info {
        padding-bottom: 14px !important;
    }

    .blue-bg .grid-3 {
        display: grid;
        grid-template-columns: auto;
        gap: 20px;
    }

    .about-details-section .about-main-img {
        width: 100% !important;
        margin: auto !important;
    }

    .section-title {
        font-size: 32px !important;
    }

    .smallest-text-400 {
        font-size: 14px !important;
    }

    .object-fit-cover.h-100 {
        height: auto !important;
    }

    .grid-small-2 {
        grid-template-columns: auto !important;
        gap: 0px 10px !important;
    }

    .content-desc.text-justify {
        text-align: justify !important;
        font-size: 11px !important;
    }

    .contact-box .whychoose-item .whychoose-inner-item {
        height: auto !important;
    }

    .tech-pill img {
        width: 22px;
        height: 22px;
    }

    .tech-pill {
        padding: 6px 10px !important;
    }

    .tech-pill .pill-content {
        font-size: 0.875rem !important;
        line-height: 20px !important;
    }

    .marquee-track {
        gap: 5px 10px !important;
        padding: 10px !important;
        /* animation: scroll-left 40s linear infinite; */
    }

    .project-desc {
        font-size: 0.875rem !important;
        line-height: 1.4rem !important;
    }

    /* .marquee-tech:nth-child(odd) .marquee-track {
        animation: scroll-left 20s linear infinite !important;
      }
      
    .marquee-tech:nth-child(even) .marquee-track {
        animation: scroll-right 20s linear infinite !important;
      } */

    .tech-pill:hover {
        transform: none !important;
        background-color: #f0f0f0;
        border: 1px dashed #f9ad61;
    }

    .tech-section {
        padding: 10px 0px 0px !important;
    }

    .tech-section p {
        font-size: 1rem !important;
    }

    .marquee-tech {
        padding: 0px !important;
    }

    /* @keyframes scroll-left {
        0% {
          transform: translateX(0%);
        }
        100% {
          transform: translateX(-330%);
        }
      }

      @keyframes scroll-right {
        100% {
          transform: translateX(0%);
        }
        0% {
          transform: translateX(-330%);
        }
      } */

    .marquee-track .smallest-text-400 {
        font-size: 12px !important;
    }

    .marquee-track::-webkit-scrollbar {
        display: none !important;
    }

    .technologies-section .small-text {
        font-size: 14px !important;
    }

    .bg-white-50 {
        padding: 20px 0px;
        height: auto !important;
    }

    .hero-section .ai-gradient,
    .hero-section .ai-gradient::after {
        font-size: 2.5rem;
    }

    .owl-carousel .owl-item .clients-logo img {
        height: auto !important;
    }

    .owl-carousel .owl-item:nth-child(8) .clients-logo img {
        height: 120px !important;
    }

    .flip-card img {
        width: 100% !important;
        height: 100% !important;
    }

    .flip-card-back .small-text {
        font-size: 14px !important;
    }

    .number-section.level {
        padding: 0px 0px 10px !important;
    }

    .box-white-50 {
        padding: 20px 12px !important;
    }

    .ai-nav-tabs .ai-nav-tab {
        font-size: 0.625rem !important;
        line-height: 1.3rem !important;
        display: grid;
        text-align: center;
    }

    .ai-content-box .nav-content .nav-title {
        font-size: 1.2rem !important;
        line-height: 1.8rem !important;
        margin-bottom: 8px !important;
    }

    .ai-nav-tabs .ai-nav-tab.active {
        box-shadow: inset 3px 3px 4px #bdbdbd2c !important;
    }

    .team-marquee .marquee-loop .h-100px {
        height: 60px !important;
    }

    .ai-content-box .nav-content .nav-description,
    .ai-content-box .nav-content ul li {
        font-size: 14px !important;
        line-height: 1.2rem !important;
    }

    .bg-nav-box {
        padding: 12px 15px !important;
    }

    .bg-nav-box.blackdrop {
        /* box-shadow: 1px -1px 5px #0000001a !important; */
        padding: 12px 15px !important;
    }

    .ai-nav-tabs {
        justify-content: space-between !important;
    }

    .ai-nav-tabs .ai-nav-tab img {
        width: 30px !important;
        height: 30px !important;
        margin: auto !important;
    }

    .ai-content-box .nav-content ul {
        padding-top: 12px !important;
    }

    .footer-section hr {
        width: 100% !important;
        margin: 0px auto 24px !important;
    }

    .footer-brand img {
        height: 30px !important;
    }

    .review-btn.gf-btn,
    .review-btn.cl-btn {
        padding: 7px 14px !important;
        margin-top: 8px !important;
    }

    .review-btn.btn-1,
    .review-btn.btn-2 {
        padding: 8px 12px !important;
    }

    .review-btn .btn-title {
        font-size: 18px !important;
        line-height: 1.4rem !important;
    }

    .review-card-section .card.card-3 .card-title {
        font-size: 1.4rem !important;
        line-height: 2rem !important;
    }

    .review-card-section .card.card-3 {
        gap: 10px !important;
    }

    .small-text-service {
        font-size: 1.2rem !important;
        line-height: 1.5rem !important;
    }

    .review-btn.gf-btn .star,
    .review-btn.cl-btn .star {
        margin-left: 10px !important;
    }

    .sm-h-100 {
        width: 100px !important;
    }

    @keyframes scroll-marquee {
        0% {
            transform: translateX(0);
        }
        100% {
            transform: translateX(-830%);
        }
    }
}

@media screen and (max-width: 600px) {
    .gallary-grid-container .column {
        flex: 50%;
        width: 140px;
    }

    .gallary-grid-container {
        display: flex;
        flex-wrap: wrap;
    }

    .max-content {
        width: 200px !important;
    }

    .blog-item:hover img {
        transform: scale(1);
    }

    .technologies-section .technologies-inner-item {
        padding: 0px 20px 15px !important;
        justify-self: center !important;
    }
}

@media screen and (max-width: 650px) {
    .calendly-inline-widget {
        height: 970px !important;
    }

    .dropdown-box .grid-2,
    .dropdown-box .grid-4 {
        justify-content: start !important;
    }

    .ai-nav-tabs {
        width: 100% !important;
        overflow-x: auto !important;
    }

    .ai-nav-tabs::-webkit-scrollbar {
        display: none !important;
    }

    .ai-nav-tabs .ai-nav-tab {
        white-space: nowrap;
    }
}

@media screen and (max-width: 576px) {
    .container {
        padding: 0px 10px !important;
    }

    .container.px-3 {
        padding: 0px 16px !important;
    }

    .container.pt-4 {
        padding-top: 24px !important;
    }

    .container.pb-4 {
        padding-bottom: 24px !important;
    }

    .h1-font-style,
    .hero-section .ai-gradient,
    .hero-section .ai-gradient::after {
        font-size: 32px !important;
    }

    .h1-font-style.font-48 {
        font-size: 24px !important;
    }

    .section-title {
        font-size: 24px !important;
    }

    .content-main-title {
        font-size: 20px !important;
    }

    .privacy-page .content-main-title {
        font-size: 16px !important;
    }

    .privacy-page .card-title-26 {
        font-size: 16px !important;
    }

    .content-main-title.font-18 {
        font-size: 18px !important;
    }

    .timeline > .timeline-item .InRight {
        margin-bottom: 0px !important;
    }

    .timeline > .timeline-item p {
        font-size: 12px !important;
        line-height: 1.5 !important;
    }

    .counters {
        font-size: 30px !important;
    }

    .small-text,
    .smallest-text-400 {
        font-size: 12px !important;
    }

    .technologies-item {
        max-width: 100%;
        margin: 0px;
    }

    .about-details-section .about-main-img {
        height: 300px;
    }

    .btn-secondary.radius-11 {
        width: auto !important;
    }

    .service__section .expertise_tab .bg-pink,
    .service__section .expertise_tab {
        height: 96px;
        width: unset;
    }

    li.font-18,
    .hire__section .content-main-title,
    .expertise__section i {
        font-size: 16px !important;
        line-height: 24px !important;
    }

    .work__section .small-text.text-left {
        text-align: center !important;
    }

    .tag_step {
        font-size: 14px !important;
    }

    .card-title-26 {
        font-size: 18px !important;
    }

    .step img {
        width: 24px;
        height: 24px;
    }

    .step::before {
        width: 40px;
        height: 40px;
    }

    .step::after {
        left: 35px;
    }

    .work__card__section .work__card .card_details h3 {
        font-size: 34px !important;
        line-height: 30px;
    }

    .footer__section .link__list li a {
        font-size: 14px !important;
    }

    .scrollToTop {
        right: 10px;
        opacity: 0.6 !important;
    }

    .benefit__section .benefit__card .benefit-img {
        padding: 5px;
        height: auto;
        width: auto;
    }

    .benefit__section .benefit__card .benefit-img img {
        height: 20px;
    }

    .benefit__section .benefit__card .content-main-title {
        font-size: 18px !important;
    }

    .service__section .expertise_tab .pink-bg span {
        font-size: 14px !important;
    }

    .offer-card {
        height: 390px;
    }

    .tech-stack__section .third-grid .grid-2 {
        grid-template-columns: auto !important;
    }

    .section-title.text-yellow {
        font-size: 24px !important;
    }

    .section-description {
        font-size: 12px !important;
        margin-top: 15px !important;
    }

    .small-gray-text.font-14 {
        font-size: 10px !important;
    }

    .greatplace-icon {
        width: 100px;
        height: 130px;
    }

    .clientstestimonial-section {
        margin-top: 10px;
    }

    .services-section .service-card {
        width: 100%;
        padding-bottom: 10px;
    }

    .sm-h-auto {
        height: 20px !important;
        width: 20px !important;
    }

    .team-card {
        width: fit-content;
        margin: 12px auto !important;
    }

    .content-main-title.team-title {
        font-size: 14px !important;
    }

    .small-gray-text.desc-team {
        font-size: 10px !important;
        height: 28px !important;
    }

    .team-card .team-content a i {
        font-size: 20px !important;
    }

    .team-card .team-content .social__link {
        line-height: 14px !important;
    }

    .gallary-section {
        padding: 12px 8px !important;
        grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
        gap: 10px !important;
    }

    .gallary-section figure {
        padding: 5px !important;
    }

    .gallary-section figure:after {
        width: 14px !important;
        height: 14px !important;
    }

    .h-400px {
        margin-top: 16px;
    }

    .footer__section {
        padding-top: 30px !important;
    }

    .newsletter__section {
        padding: 24px 12px !important;
    }

    .bg-blue .hero_description.text-white {
        font-size: 14px !important;
    }

    .main-descriptions .benifits-img img {
        font-size: 24px !important;
    }

    .about-details-section.company-section {
        padding: 0px !important;
    }

    .light-black {
        margin: 5px auto 10px !important;
    }

    .work__section .work__card__section {
        grid-template-columns: auto;
    }

    .service__section .expertise_tab .content-main-title {
        font-size: 20px !important;
    }

    .service__section .expertise_tab .bg-pink,
    .service__section .expertise_tab,
    .service__section .expertise_tab.mobile-bg,
    .service__section .expertise_tab.backend-bg,
    .service__section .expertise_tab.bg-qa {
        height: 80px;
    }

    .filter-container {
        padding: 0px;
    }

    .filter-container span {
        font-size: 14px;
        margin: 0px;
    }

    .h-auto-min {
        width: 60px !important;
        height: 50px !important;
    }

    .h-auto-min.app-firm {
        width: 68px !important;
    }

    #testimonial-carousel .content-main-title strong {
        font-size: 16px !important;
    }

    #testimonial-carousel .testimonial-box .small-gray-text {
        font-size: 12px !important;
    }

    .schedule-call-card i {
        font-size: 30px !important;
        line-height: 1.4 !important;
    }

    .schedule-call-card .content-main-title {
        font-weight: 400 !important;
        font-size: 12px !important;
        margin-bottom: 0px !important;
    }

    li.font-18 {
        font-size: 12px !important;
    }

    .table-bordered tr td,
    .table-bordered tr th,
    code {
        font-size: 12px !important;
        padding: 3px 6px !important;
    }

    .main-service-hero,
    .main-hero-right-img,
    .main-hero-right-img.h-400px.privacy-img,
    .h-300px {
        height: auto !important;
        width: 80% !important;
    }

    .calendly-inline-widget {
        height: 940px !important;
    }

    .hire-common .feature-box {
        width: 75%;
    }

    .md-w-100 {
        width: 100%;
    }

    #expertiseCarousel .card {
        height: 280px;
    }

    .tech-img {
        height: auto;
    }

    .btn-secondary.radius-11 {
        padding: 8px 16px !important;
        font-size: 14px !important;
    }

    .filter-container {
        margin-bottom: 10px !important;
    }

    .service-last-img {
        height: auto !important;
        width: 90% !important;
    }

    .ul-nav ul.link-box.grid-2 {
        display: grid !important;
        grid-template-columns: 50% 50% !important;
    }

    .ul-nav ul.link-box {
        font-size: 12px !important;
        display: flex !important;
        flex-direction: column !important;
    }

    .social-link-box {
        display: none !important;
    }

    nav .navbar-brand {
        width: 140px !important;
    }

    .navbar .btn-primary {
        width: 120px !important;
        height: 33px !important;
        font-size: 14px !important;
    }

    .navbar-brand .nav-logo:nth-of-type(1) {
        width: 140px !important;
    }

    .team-card img {
        height: auto !important;
    }

    .flip-card-back .small-text {
        font-size: 10px !important;
    }

    .flip-card,
    .flip-card img {
        height: 200px !important;
    }

    hr {
        margin-bottom: 0px !important;
    }

    .yellow-bg-short::after {
        display: none !important;
    }

    .mobile-accordion .nav-link {
        font-size: 14px !important;
    }

    .review-btn .star i {
        display: none !important;
    }

    .review-btn .star i:last-child {
        display: flex !important;
    }

    .footer-section .link-title {
        font-size: 14px !important;
        line-height: 20px !important;
    }

    .footer-section .link-section a {
        font-size: 12px !important;
    }

    .footer-section .link-section i {
        font-size: 14px !important;
    }

    .footer-social-link {
        width: 30px !important;
        height: 30px !important;
        border: 1px solid #d9d9d9 !important;
    }

    .footer-social-link img {
        width: 15px !important;
        height: 15px !important;
    }

    .card-3 .review-btn i:nth-child(2) {
        margin-left: 10px !important;
    }

    .review-btn.gf-btn,
    .review-btn.cl-btn {
        width: 100% !important;
        margin: 10px auto 0px !important;
    }

    .review-btn.gf-btn {
        margin: 0px auto 0px !important;
    }
}

@media screen and (max-width: 430px) {
    .main-service-hero,
    .main-hero-right-img,
    .main-hero-right-img.h-400px.privacy-img,
    .h-300px {
        height: 200px !important;
        width: 80% !important;
    }
}

@media screen and (max-width: 435px) {
    .dropdown-single-item.gap-3 {
        gap: 5px !important;
    }

    .small-text,
    .smallest-text-400 {
        font-size: 10px !important;
    }
}

@media screen and (max-width: 400px) {
    .work__section .work__card__section {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .main-service-hero,
    .main-hero-right-img,
    .main-hero-right-img.h-400px.privacy-img,
    .h-300px {
        height: auto !important;
        width: 95% !important;
    }

    li.font-18 {
        font-size: 10px !important;
    }

    .work__card__section .content-main-title {
        font-size: 20px !important;
    }

    .hire-common .feature-box {
        width: 90%;
    }

    .bg-light-blue .social-details strong {
        font-size: 10px !important;
    }

    .social-link-box .bg-light-blue.grid-2 {
        width: auto !important;
        overflow-wrap: anywhere !important;
    }

    .bg-light-blue.grid-2 .social-details img {
        display: none !important;
    }

    .dropdown-box .grid-2,
    .dropdown-box .grid-4 {
        justify-content: space-between !important;
    }

    .navbar .btn-primary {
        width: 100px !important;
        font-size: 12px !important;
    }
    .flip-card,
    .flip-card img {
        height: 170px !important;
    }

    .card-3 .review-btn {
        width: 100% !important;
    }
}

@media only screen and (max-width: 319px) {
    body,
    header,
    .main-hero-section,
    nav {
        min-width: 320px;
        margin: 0 auto;
    }
}