@media only screen and (min-width: 1600px) {
    .container-xxl {
        max-width: 80%;
    }
    .uk-child-width-1-2\@s>* {
        width: 26.95%;
        margin: 0 auto;
    }
    .uk-grid {
        margin-left: -10.8%;
    }
    .testimonial_bottom .uk-grid>* {
        padding-left: 64px;
    }
    .testimonial_bottom .uk-position-relative.uk-visible-toggle.uk-light {
        width: 94%;
        margin: 0 auto;
    }
    .uk-slider-container-offset {
        width: 82%;
        margin: 0 auto;
        padding-top: 0;
        padding-bottom: 140px;
    }
    .uk-grid>*{
        padding-left: 16px;
    }
    .uk-position-relative.uk-visible-toggle.uk-light {
        width: 88%;
        margin: 0 auto;
    }
    .journey_top{
        padding: 0 11em;
    }
    .start-journey {
       padding-top: 30px;
    }
    .journey-content p{
        font-size: 20px !important;
        line-height: 28px;
        color: #fbfbfb;
        font-family: "PT Sans", sans-serif !important;
        font-weight: 400 !important;
        padding: 27% 0;
    }
    .journey-content .application{
        padding: 10% 0 8%;
    }
    .uk-card.uk-card-default{
        height: 430px;
    }
    .journey-content .event-management{
        padding: 5% 0;
    }
    .journey-content .accoPOS{
        padding: 5% 0;
        font-size: 16px !important;
    }
    .journey-content .ecommerce{
        padding: 4% 0;
    }
    .journey-content .started-company, .journey-content .inventory-webapp{
        padding: 10% 0;
    }
    .journey-content .inventory-webapp{
        font-size: 20px !important;
        padding: 9% 0;
    }
    .journey-content .started-company{
        font-size: 28px !important;
    }
}

@media only screen and (min-width: 1450px){
    .container-xl{
        max-width: 100%;
    }
    .logo_img img{
        width: 65%;
        transition: .5s;
    }
    nav li a, .contact_btn a{
        font-size: 16px;
    }
    .banner{
        width: 90%;
        margin: 0 auto;
    }
    .banner_overlay_header {
        font-size: 72px;
        line-height: 82px;
    }
    .banner_overlay_subhead {
        font-size: 20px;
        line-height: 32px;
    }
    nav > ul {
        width: 38% !important;
    }
    .welcome-container h1{
        font-size: 16px;
    }
    .banner_img{
        width: 600px;
        margin: 0 auto;
        margin-right: -14px;
    }
    .story_top{
        padding-bottom: 0;
    }
    .story_top h2 {
        font-size: 56px;
        line-height: 66px;
        padding-bottom: 120px;
    }
    .about_img{
        width: 580px;
        margin-left: 14rem;
    }
    .story_content:nth-child(2){
        padding-left: 0;
    }
    .story_content h4 {
        font-size: 40px;
    }
    .story_content .line_img {
        max-width: 14%;
    }
    .story_content p {
        width: 80%;
        font-size: 22px;
        line-height: 34px;
    }
    
    .about-details:nth-child(1) h5{
        margin: 0;
    }
    .about-details img{
        max-width: 40px;
        max-height: 40px;
    }
    .about-icons{
        grid-template-columns: repeat(auto-fit, minmax(150px, 20%));
        margin-left: -5rem;
    }
    /* whatWeDo_start */
    .uk-card-body {
        padding: 20px 30px 10px;
    }
    .accoPOS-para {
        padding: 27px 15px;
    }
    .whatWeDo-top p{
        width: 42%;
        font-size: 22px;
        line-height: 32px;
    }
    .whatWeDo-Card{
        width: 82%;
        grid-gap: 10px;
    }
    .card-details{
        padding: 40px 20px;
    }
    .modal-content h2{
        font-size: 40px;
        margin-top: 70px !important;
        padding-bottom: 4px;
    }
    .modal-content .popUp-line{
        width: 210px;
    }
    .popUp-details{
        padding-top: 50px;
    }
    .card-details:nth-child(8) p::after{
        left: 43%;
        bottom: -10px;
    }
    .card-details h2{
        font-size: 22px;
        line-height: 32px;
    }
    .modal-content{
        width: 40%;
        overflow: hidden;
    }
    .custom-modal a, .account-billing a, .expense-track a, .design-development a, 
    .app-development a, .hr-management a, .logistics a{
        max-width: 10%;
        font-size: 16px;
    }
    .popUp-content h4, .accountBilling-content h4, .expenseTrack-content h4, .webDevelopment-content h4, 
    .appDevelopment-content h4, .hrManagement-content h4, .logistics-content h4{
        font-size: 19px;
        padding-left: 10px;
    }
    .popUp-para ul{
        padding-left: 58px;
    }
    .popUp-para li{
        font-size: 1.2em;
        line-height: 27px;
    }
    .popUp-list{
        padding-bottom: 32px;
    }
    .custom-modal::before, .account-billing::before, .expense-track::before, .design-development::before, 
    .app-development::before, .hr-management::before, .logistics::before{
        width: 9px;
        bottom: 10%;
        left: 29.96%;
    }
    .custom-modal::after, .account-billing::after, .expense-track::after, .design-development::after, 
    .app-development::after, .hr-management::after, .logistics::after{
        display: block;
        right: 30.2%;
        top: 10%;
    }
    .popUp-bg{
        bottom: 0;
        left: -30%;
        margin-bottom: -200px;
    }
    .card-btn {
        max-width: 39%;
    }
    .popUp-bg{
        display: block;
        bottom: 4%;
    }
    .expense-track .popUp-bg{
        left: -40%;
        bottom: -8%;
    }
    .design-development .popUp-bg{
        width: 60vw;
        left: -28%;
        bottom: -12px;
    }
    .app-development .popUp-bg{
        bottom: -14px;
    }
    .hr-management .popUp-bg, .logistics .popUp-bg{
        width: 11vw;
        left: 34%;
        top: 0.2%;
    }
    .accountBilling-list{
        padding-bottom: 0;
    }
    button.close-btn{
        left: 65.5%;
        top: 2%;
    }
    /* whatWeDo_end */
    .card-details{
        padding: 40px 20px;
    }
    .card-details:nth-child(8) p::after{
        left: 44%;
        bottom: 0;
    }
    .card-details h2{
        font-size: 22px;
        line-height: 32px;
    }
    .card-details p{
        font-size: 18px;
        line-height: 28px;
    }
    .card-details a{
        font-size: 16px;
    }
    .card-details:nth-child(1) .card-img{
        max-width: 205px;
        padding-bottom: 8px;
    }
    .card-details:nth-child(2) .card-img{
        max-width: 205px;
    }
    .card-details:nth-child(3) .card-img{
        padding-bottom: 20px;
    }
    .card-details:nth-child(1) p{
        padding-bottom: 43px;
    }
    .card-details:nth-child(3) p{
        padding-bottom: 44px;
    }
    .card-details:nth-child(4) p{
        margin-bottom: -4px;
    }
    .card-details:nth-child(5) p{
        padding-bottom: 28px;
    }
    .card-details:nth-child(6) p{
        padding-bottom: 56px;
    }
    .card-details:nth-child(4) .card-img{
        padding-bottom: 34px;
    }
    .card-details:nth-child(5) .card-img{
        max-width: 170px;
    }
    .card-details:nth-child(6) .card-img{
        max-width: 180px;
        padding-bottom: 0;
        margin-top: -5px;
    }
    .card-details:nth-child(7) .card-img{
        padding-bottom: 30px;
    }
    .card-details:nth-child(7) .card-img{
        max-width: 200px;
    }
    .story_content p{
        width: 94%;
        padding-bottom: 54px;
    }
    .about-icons {
        width: 90%;
        grid-template-columns: repeat(4, 190px);
        margin-left: -5rem;
    }
    .about-details:nth-child(2), .about-details:nth-child(3), .about-details:nth-child(4){
        padding: 0 10px;
    }
    .about-details h2{
        font-size: 45px;
    }
    .about-details h5{
        font-size: 18px;
    }
    .journey_top h2 {
        font-size: 40px;
    }
    .journey_top .line_img {
        width: 78px;
        height: 30px;
    }
    .testimonial{
        padding-bottom: 10px;
    }
    .testimonial_top .line_img{
        max-width: 7%;
        margin-top: -10px;
    }
    .quotation {
        width: 100px;
        height: auto;
    }
    .testimonial_content p {
        width: 94%;
        font-size: 24px;
    }
    .testimonial_top h2{
        padding-top: 103px;
        padding-bottom: 8px;
    }
    .uk-slider-items {
        padding-top: 62px;
    }
    .uk-width-3-4 {
        width: 75%;
    }
    .footer_details:nth-child(1) h4 {
        padding-left: 40px;
    }
    .started-content p{
        width: 68%;
        padding: 14px 0;
        margin: 0 auto;
    }
    .shuttle-img {
        width: 70px;
        height: 70px;
    }
    .circle-banner{
        width: 98vh;
        height: 96vh;
        border: 7rem solid #45459f57;
        margin: -20px auto 0;
    }
    .circle-inside{
        width: 100%;
        height: 100%;
    }
    .circle-banner:nth-child(2) .circle-inside{
        padding: 24% 6vw;
    }
    .circle-content h2{
        font-size: 54px;
        line-height: 60px;
    }
    .banner-content{
        max-width: 10.5vw;
        padding: 10px 22px;
    }
    .circle-content h2{
        padding-bottom: 16px;
        margin-top: 12px;
    }
    .transfor-business{
        max-width: 13.2vw;
    }
    .client_top {
        padding-bottom: 49px;
    }
     /* text animation */
  
    @keyframes animated-text{
        from{width: 0;}
        to{width: 560px;}
    }
    .footer_details:nth-child(1) h4{
        padding-left: 0;
    }

    .uk-card-media-top:nth-child(4){
        margin-top: -10px;
    }

    .footer_details:nth-child(1) {
        padding-left: 2vw;
    }
    /* form-details_start */
    .form-banner{
        width: 1350px;
        height: 953px;
        right: -18%;
    }
    .form-para{
        width: 30%;
        top: -32.4%;
        right: 27%;
        padding: 50px 0 70px;
    }
    @keyframes slideIn {
        0% {
          transform: translateX(500px);
          top: 9%;
        }
        100% {
          transform: translateX(250px);
          top: 9%;
        }
      }
    .form-logo{
        width: 28%;
        padding: 11px 0 20px 0;
        margin-left: 18%;
    }
    .form-para h5{
        font-size: 16px;
        line-height: 26px;
        padding-bottom: 25px;
    }
    .inner-details{
        width: 64%;
        margin: 0 auto;
    }
    .form-para input, .form-para textarea{
        height: 50px;
    }
    .form-para textarea{
        height: 198px;
    }
    form button{
        width: 97%;
        margin-top: 11px;
        margin: 0 auto;
    }
    /* form-details_end */
    /* thankYou_start */
    .thankyou{
        max-width: 80%;
        height: 100%;
        text-align: center;
        margin: 14% auto;
    }
    .thankyou-image{
        width: 338px;
        height: auto;
    }
    .thankyou h2{
        font-size: 48px;
        font-family: "Sora", sans-serif;
        font-weight: 600;
        color: #141414;
        padding-bottom: 10px;
    }
    .thankyou h4{
        font-size: 24px;
        font-family: "Sora", sans-serif;
        font-weight: 400;
        color: #252525;
        padding-bottom: 40px;
    }
    .home-btn{
        width: 80%;
        margin: 20px auto 0;
    }
    .home-btn a{
        font-size: 15px;
        font-family: "PT Sans", sans-serif;
        font-weight: 600;
        letter-spacing: 1.4px;
        text-decoration: none;
        color: var(--white-color);
        background: linear-gradient(to right, #A606D1 10%, #E41D31 60%, #FF9000 100%);
        padding: 14px 50px;
        border-radius: 36px;
    }
    .home-btn a:hover{
        box-shadow: 4.0px 8.0px 8.0px rgb(0 0 0 / 18%);
    }
    .journey-content p{
        font-size: 20px !important;
        line-height: 28px;
        color: #fbfbfb;
        font-family: "PT Sans", sans-serif !important;
        font-weight: 400 !important;
        padding: 27% 0;
    }
    /* thankYou_end */
}

@media only screen and (min-width: 1919.991px) and (max-width: 2000px){
    .form-para{
        top: -30%;
    }
    .app-development .popUp-bg{
        bottom: 4%;
    }
}

@media only screen and (min-width: 1700px) and (max-width: 1919.99px){
    .circle-banner:nth-child(2) .circle-inside {
        padding: 24% 2vw;
    }
    .circle-content h2:nth-child(2){
        padding: 0 72px;
    }
    .form-para{
        top: -36%;
    }
}

@media only screen and (min-width: 1170px){
    .container-lg{
        max-width: 80%;
    }
    #whatsapp .whatsapp{
        font-size: 36px;
        width: 60px;
        height: 60px;
    }
    #whatsapp .whatsapp i{
        padding: 10px;
    }
}

@media only screen and (min-width: 769px){
    .container-sm, .container-lg, .container-md, .container-xl, .container-xxl{
        width: 90%;
    }
    .container-md{
        max-width: 100%;
    }
    nav .logo {
        width: 35%;
    }
    nav > ul {
        width: 50%;
    }
    .logo_img {
        max-width: 38%;
    }
}

@media only screen and (max-width:768px){
    .container-sm {
        max-width: 650px;
        --bs-gutter-x: 0;
    }
    .button::before{
        background: #090d18;
    }
    .responsive-bar{
        display: block;
        width: 100%;
        background: #eff0f0;
        position: fixed;
        top: 0;
        left: 0;
        padding: 10px 20px;
        box-sizing: border-box;
        z-index: 1;
        overflow: hidden;
    }
    .responsive-bar .logo img{
        float: left;
    }
    .responsive-bar .logo {
        width: 420px;
    }
    .logo_img{
        width: 100%;
    }
    .responsive-bar .menu h4{
        float: right;
        margin: 0;
        padding: 0;
        line-height: 50px;
        cursor: pointer;
        text-transform: uppercase;
    }
    .welcome-container {
        margin-top: 45px;
        z-index: 1;
    }
    nav{
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 0;
    }
    nav, nav.black{
        background: #eff0f0f6;
        padding: 10px 0 20px;
    }
    nav .logo{
        display: none;
    }
    nav ul{
        position: absolute;
        width: 100%;
        top: 60px;
        left: 0;
        background: #010718ea;
        float: none;
        display: none;
    }
    nav ul.active{
        display: block;
        transition: 0.4s;
        /* padding-top: 20px; */
        padding: 50% 0;
        margin-top: 6px;
    }
    nav ul li{
        width: 100%;
    }
    nav ul li a{
        display: block;
        padding: 0;
        width: 100%;
        text-align: center;
        line-height: 30px !important;
        color: #f5f5f5; 
        transition: 0.6s; 
    }
    .button span{
        width: 100%;
        font-size: 14px;
        text-align: center;
    }
    nav > ul{
        width: 100%;
        display: none;
    }
    nav > ul > li{
        display: block;
        text-align: center;
        padding-bottom: 20px;
    }
    .active{
        display: block;
    }
    .button{
        width: 36%;
        padding: 10px 8px;
        margin: 0 auto 24px;
    }
    /* header_end */
    /* client_start */
    .client_top h2 {
        font-size: 26px;
    }
    /* client_end */
    /* banner_start */
    .circle-banner {
        width: 78vw;    
        height: 118vh;
        border-width: 6vw;
        margin-top: -16px;
    }
    .circle-banner:nth-child(2){
        width: 80vw;    
        height: 74vh;
    }
    .circle-inside{
        padding: 12% 1vw;
    }
    .slider-banner {
        height: 74vh;
    }
    .banner-content{
        width: 38%;
    }
    .transfor-business{
        width: 47.1%;
    }
    .banner-content span{
        font-size: 14px;
    }
    .circle-content h2:nth-child(2) {
        padding: 0 42px;
    }
    .circle-content h2{
        font-size: 40px;
        line-height: 50px;
    }
    .circle-content p {
        font-size: 16px;
        line-height: 26px;
    }
    /* banner_end*/

    /* story_start */
    .story_top {
        width: 100%;
    }
    .story_top h2 {
        font-size: 42px;
        line-height: 52px;
    }
    .story_top h2:nth-child(1){
        display: none;
    }
    .story_top h2:nth-child(2){
        display: block;
    }
    .story_bottom{
        row-gap: 60px;
    }
    .story_content p{
        width: 100%;
        font-size: 16px;
        line-height: 26px;
        margin-bottom: 30px;
    }
    .client_top .line_img {
        max-width: 18%;
    }
    .about_img {
        width: 100%;
    }
    .story_content {
        width: 95%;
        margin: 0 auto;
    }
    .story_content .line_img {
        max-width: 24%;
    }
    /* story_end */

    /* client_start */
    .client_top {
        padding-bottom: 2px;
    }
    /* client_end */

    /* journey_start */
    .uk-child-width-1-2\@s>* {
        width: 50%;
    }
    .uk-grid {
        margin-left: 0;
    }
    .uk-slider-container-offset {
        margin: 0 auto;
        padding: 0;
    }
    .uk-slider-items {
        padding-top: 65px;
    }
    .journey_top .line_img {
        width: 66px;
    }
    .uk-card-media-top{
        margin-top: 0;
    }
    .journey-content .application{
        padding: 6% 0;
    }
    .journey-content .application-para{
        padding: 8% 0;
    }
    .journey-content .started-company{
        padding: 11% 0;
    }
    .journey-content .first-web{
        padding: 22% 0;
    }
    .journey-content .inventory-webapp{
        padding: 8% 0;
    }
    .uk-card-media-top h2 {
        font-size: 46px;
        margin-top: -10px;
    }
    .uk-card.uk-card-default {
        height: 100%;
    }
    .started{
        padding-bottom: 22px;
    }
    button#myBtn, button#btnText {
        display: block;
        font-size: 15px;
        font-family: "PT Sans", sans-serif;
        border: 1px solid #5d6169;
        background-color: transparent;
        color: #eff0f0;
        padding: 6px 14px;
        cursor: pointer;
        margin: 18px auto 8px;
    }
    .uk-card-body{
        padding: 20px 18px;
    }
    .journey-content p{
        padding: 28% 0;
    }
    .mail_img{
        top: -13px;
        padding: 25px 20px;
    }
    .star_img{
        top: -14px;
        padding: 26px 18px;
    }
    .journey-content h4{
        padding-bottom: 10px;
    }
    .journey-content .accoPOS{
        font-size: 18px !important;
    }
    /* journey_end */

    /* whatWeDo_start */
    .whatWeDo-top p{
        width: 94%;
    }
    .whatWeDo-Card {
        width: 98%;
        grid-template-columns: repeat(2, 1fr);
        grid-gap: 20px;
        overflow: hidden;
    }    
    .card-details:nth-child(8){
        width: 100%;
    }
    .card-details:nth-child(8) h2{
        font-size: 30px;
        padding-bottom: 10px;   
    }
    .card-details:nth-child(8) p{
        font-size: 16px;
    }
    .card-details:nth-child(8) p::after {
        width: 32px;
        bottom: 8px;
        left: 38%;
    }
    .card-details:nth-child(1) p, .card-details:nth-child(2) p, .card-details:nth-child(3) p, .card-details:nth-child(4) p,
    .card-details:nth-child(5) p, .card-details:nth-child(6) p, .card-details:nth-child(7) p{
        padding-bottom: 21px;
    }
    /* whatWeDo_end */

    /* testimonial_start */
    .uk-width-3-4{
        width: 100%;
    }
    .uk-panel{
        flex-direction: column-reverse;
    }
    .testimonial-content{
        width: 100%;
    }
    .testimonial-image {
        width: 40%;
    }
    /* testimonial_end */

    /* arrow_start */
    .arrow{
        bottom: 12%;
        right: 4%;
    }
    .started-content a::after {
        width: 99%;
    }
    /* arrow_end */

    /* ready_start */
    .chain-img {
        max-width: 84%;
        height: auto;
        margin-right: -70px;
        margin-bottom: -340px;
        margin-top: -60px;
    }
    /* ready_end */

    .started-content {
        width: 100%;
    }
    .started-content h2 {
        font-size: 40px;
        line-height: 50px;
    }
    .started-content p{
        width: 90%;
        font-size: 16px;
        line-height: 26px;
        margin: 0 auto;
    }

    /* footer_start */
    footer {
        border-bottom: 0.2px solid #bababa2e;
    }
    .footer_logo, .footer_content, .footer_details {
        width: 100%;
        border: 0;
    }
    .footer_logo{
        padding-bottom: 40px;
    }
    .footer_img {
        width: 24%;
    }
    .footer_logo p{
        width: 74%;
    }
    .address_contact p{
        width: 50%;
    }
    .footer_details:nth-child(1) {
        border: 0;
        padding: 0;
    }
    .footer_details li{
        list-style-type: disclosure-closed;
        color: #A8A5E0;
    }
    .footer_details:nth-child(2) {
        width: 100%;
        padding: 0 10px;
    }
    .copyrights p{
        font-size: 10px;
        line-height: 20px;
        font-family: "PT Sans", sans-serif;
        font-weight: 500;
        color: #6d6d6d;
    }
    .footer_details:nth-child(1) h4 {
        padding-left: 0;
    }
    /* footer_end */

    /* form_start */
    .form-details{
        width: 100%;
        grid-template-columns: 100% 0;
        margin-left: 0;
    }
    .form-banner {
        width: 1000px;
        height: 590px;
        right: 0;
    }
    .form-para{
        width: 100%;
        left: -50%;
        top: -50%;
        transform: translate(50%, 50%);
        height: 100vh;
        padding: 19% 0;
    }
    .inner-details{
        max-width: 80%;
        text-align: center;
        overflow: hidden;
    }
    .form-para input, .form-para textarea, form .button{
        width: 350px;
        height: 50px;
        margin-bottom: 20px;
    }
    .form-para textarea{
        height: 170px;
    }
    form button {
        max-width: 60%;
        overflow: hidden;
    }
    .form-logo{
        margin: 0 auto 10px;
    }
    .form-para h5{
        padding-bottom: 30px;
    }
    /* form_end */
    /* thankYou_start */
    .thankyou{
        max-width: 98%;
        margin: 56% auto;
    }
    .thankyou-image{
        width: 172px;
        padding-bottom: 10px;
    }
    .thankyou h2, .thankyou .mobile-heading{
        display: none;
        font-size: 24px;
        padding-bottom: 10px;
        margin: 0 auto;
    }
    .thankyou .mobile-heading{
        display: block;
    }
    .thankyou h4{
        font-size: 16px;
        padding-bottom: 20px;
    }
    .home-btn{
        width: 60%;
        margin: 20px auto 0;
    }
    .home-btn a{
        font-size: 15px;
        font-family: "PT Sans", sans-serif;
        font-weight: 600;
        letter-spacing: 1.4px;
        text-decoration: none;
        color: var(--white-color);
        background: linear-gradient(to right, #A606D1 10%, #E41D31 60%, #FF9000 100%);
        padding: 14px 40px;
        border-radius: 36px;
    }
    .home-btn a:hover{
        box-shadow: 4.0px 8.0px 8.0px rgb(0 0 0 / 18%);
    }
    /* thankYou_end */
}

@media only screen and (max-width: 500px){
    .slider-banner{
        height: 100vh;
    }
    .slide-image{
        height: 100vh;
    }
    .circle-banner:nth-child(2){
        width: 130vw;
        height: 64vh;
        margin: 0 auto;
    }
    .circle-banner{
        top: 50%;
        left: -16%;
        border-width: 4.9rem;
        transform: translateX(-50%);
        transform: translateY(-50%);
    }
    .circle-banner .circle-content a{
        font-size: 16px;
    }
    .banner-content {
        width: 42%;
        padding: 8px 4px;
        border: 0;
    }
    .banner-content:nth-child(2){
        max-width: 90em;
        padding: 0;
    }
    .transfor-business{
        max-width: 100vw;
        border: 0;
        padding: 0 0 10px;
    }
    .transfor-business i{
        font-size: 12px;
    }
    .banner-content span{
        font-size: 14px;
    }
    .circle-content h2{
        margin-top: 0;
        color: #f5f5f5;
    }
    .circle-content .delivery-para{
        display: none;
    }
    .circle-content .mobile-para{
        display: block;
        font-size: 16px;
        line-height: 24px;
        padding: 0 42px 24px;
    }
    .circle-banner .circle-content a, .slide-image:nth-child(2) .circle-banner .circle-content a{
        padding: 18px 0 18px 30px;
    }
    .circle-content a span{
        width: 54px;
        height: 54px;
        padding: 16px 17px;
    }
    .circle-inside{
        padding: 17% 1vw;
    }
    /* story_start */
    .story_top{
        padding-bottom: 50px;
    }
    .story_content{
        width: 100%;
    }
    .story_top h2 {
        font-size: 36px;
        line-height: 46px;
        padding-top: 40px;
    }
    .story_content p{
        width: 97%;
        padding-bottom: 0;
    }
    .about-icons{
        width: 92%;
        grid-template-columns: repeat(2, 1fr);
        margin: 0 auto;
    }
    .about-details:nth-child(2){
        background-image: none;
    }
    .about-details:nth-child(1), .about-details:nth-child(2){
        background-color: #1b1f2a;
        background-image: none;
        padding: 10px;
        margin: 10px;
    }
    .about-details:nth-child(3), .about-details:nth-child(4){
        background-color: #1b1f2a;
        background-image: none;
        padding: 10px;
        margin: 10px;
    }
    /* story_end */
    /* journey_start */
    .journey{
        padding-top: 80px;
    }
    .uk-child-width-1-2\@s>* {
        width: 88%;
    }
    .journey-content p{
        padding-bottom: 10px;
    }
    .journey-text:nth-child(2){
        color: #f1f1f1;
    }
    .journey-bottom .uk-grid>*{
        padding-left: 20px !important;
    }
    .uk-child-width-1-2\@s>* {
        width: 86vw;
        margin: 10px;
    }
    .uk-grid {
        margin-left: 10px;
    }
    /* journey_end */
    .slide-image:nth-child(2) .circle-inside{
        padding: 18% 1vw;
    } 
    /* whatWeDo_start */
    .whatweDo{
        padding: 64px 0 34px;
    }
    .whatWeDo-Card{
        grid-template-columns: repeat(1, 1fr);
        overflow: hidden;
        grid-gap: 8px;
        padding-bottom: 30px;
    }
    .card-details .card-img, .card-details:nth-child(2) .card-img{
        max-width: 250px;
    }
    .card-details:nth-child(3) .card-img{
        max-width: 215px;
        padding-bottom: 10px;
    }
    .card-details:nth-child(4) .card-img{
        max-width: 230px;
    }
    .card-details:nth-child(5) .card-img{
        max-width: 235px;
        padding-bottom: 30px;
    }
    .card-details:nth-child(6) .card-img{
        max-width: 230px;
        padding-bottom: 0;
    }
    .card-details:nth-child(7) .card-img{
        max-width: 235px;
        padding-bottom: 20px;
    }
    .card-details:nth-child(8){
        padding: 54px 0 150px;
    }
    .card-details:nth-child(8) .card-img{
        max-width: 50px;
    }
    .card-details{
        padding: 38px 16px;
    }
    .card-details h2{
        font-size: 24px;
        line-height: 34px;
    }
    .card-details:nth-child(8) h2{
        font-size: 30px;
        padding-bottom: 6px;
    }
    .card-details:nth-child(8) p{
        position: relative;
    }
    .card-details a{
        font-size: 15px;
    }
    .card-details:nth-child(8) p::after {
        left: 42%;
    }
    /* whatWeDo_end */
    /* testimonial_start */
    .testimonial{
        background-color: #fff;
        padding-bottom: 60px;
        margin-top: 0;
    }
    .testimonial_top h2{
        width: 60%;
        font-size: 36px;
        padding-top: 20px;
        margin: 0 auto;
    }
    .testimonial_top .line_img{
        max-width: 100px;
        height: auto;
    }
    .testimonial-image{
        width: 86%;
        margin: 0 auto;
    }
    .uk-slider-items{
        padding-top: 35px;
    }
    .uk-grid>* {
        padding-left: 0;
    }
    .uk-width-3-4 {
        width: 90%;
    }
    .testimonial-content {
        margin: 0 auto;
        text-align: center;
    }
    .testimonial-content h2{
        width: 100%;
        font-size: 40px;
        line-height: 48px;
        margin: 0 auto;
    }
    .testimonial-para{
        display: none;
    }
    .mobile-testimonial{
        display: block;
    }
    .testimonial-content p{
        max-width: 100%;
        font-size: 18px;
        line-height: 26px;
        margin: 0 auto;
    }
    .testimonial-content p::after{
        left: 30%;
        transform: translateX(50%);
        width: 64px;
        height: 2px;
    }
    .reviewers-detail h5{
        display: none;
    }
    .testBrand1{
        display: none;
    }
    .testBrand2{
        max-width: 152px;
        display: block;
        margin: 0 auto;
        margin-top: -10px;
    }
    /* testimonial_end */

    /* form_start */
    .form{
        width: 100%;
        padding: 70px 0;
    }
    .chain-img {
        margin-bottom: -238px;
        margin-top: -52px;
    }
    .shuttle-img {
        width: 46px;
        height: 46px;
        margin-bottom: 0;
    }
    /* form_end */
    /* footer_start */
    .footer_img {
        width: 40%;
    }
    .footer_logo p {
        width: 100%;
    }
    .footer_logo {
        padding-bottom: 20px;
    }
    .address_contact p {
        width: 90%;
    }
    .footer_details:nth-child(2) {
        padding: 0;
    }
    footer a{
        font-size: 14px;
        font-family: "PT Sans", sans-serif;
    }
    #whatsapp .whatsapp{
        bottom: 4%;
        position: fixed;
    }
    .arrow{
        bottom: 4%;
    }
    /* footer_end */

    /* form_start */
    .form-para{
        width: 100%;
        height: 100vh;
        left: -50%;
        top: -60%;
        padding: 60px 0;
    }
    .form-logo{
        width: 42%;
        padding: 40px 0 10px;
        margin: 0 auto;
    }
    .formInner-bg{
        display: none;
    }
    .inner-details{
        width: 100%;
        text-align: center;
        margin: 0 auto;
    }
    .form-para h5{
        width: 78%;
        font-size: 16px;
        line-height: 24px;
        margin: 0 auto;
    }
    .form-para input, .form-para textarea {
        width: 320px;
        height: 50px;
    }
    .form-para textarea{
        height: 120px;
    }
    form button a{
        width: 320px;
        text-align: center;
        padding: 0 auto;
        margin: 0 auto;
        margin-top: 10px;
    }
    /* form_end */
    
}

@media only screen and (max-width: 450px){
    /* whatWeDo_start */
    .modal-content {
        max-width: 94%;
        height: 88%;
        padding: 0 14px 20px;
        margin-top: 14px;
    }
    .custom-modal a, .account-billing a, .expense-track a, .design-development a, 
    .app-development a, .hr-management a, .logistics a{
        max-width: 42%;
        top: 4%;
    }
    button.close-btn{
        width: 6%;
        left: 80%;
        top: 5%;
    }
    .close-button{
        font-size: 3.5em;
    }
    .custom-modal::before, .account-billing::before, .expense-track::before, .design-development::before, 
    .app-development::before, .hr-management::before, .logistics::before{
        left: 2.8%;
        bottom: 32%;
        height: 300px;
    }
    .custom-modal::after, .account-billing::after, .expense-track::after, .design-development::after, 
    .app-development::after, .hr-management::after, .logistics::after{
        right: 3.9%;
        top: 13%;
        height: 300px;
    }
    .account-billing::after{
        top: 16%;
    }
    .expense-track::after{
        top: 23%;
    }
    .design-development::after{
        top: 23%;
    }
    .app-development::after, .hr-management::after{
        top: 20%;
    }
    .logistics::after{
        top: 16%;
    }
    .modal-content h2{
        font-size: 24px;
        line-height: 34px;
        padding: 0;
    }
    .popUp-details{
        padding-top: 25px;
    }
    .modal-content .popUp-line{
        width: 130px;
    }
    .appDevelopment-content{
        padding-bottom: 6px;
    }
    .popUp-content h4, .accountBilling-content h4, .expenseTrack-content h4, .webDevelopment-content h4, 
    .appDevelopment-content h4, .hrManagement-content h4, .logistics-content h4{
        font-size: 18px;
    }
    .appDevelopment-content h4{
        font-size: 17px;
        line-height: 27px;
        text-align: left;
    }
    .app-development .popUp-para ul, .hr-management .popUp-para ul, .logistics-content .popUp-para ul{
        padding-left: 50px;
    }
    .popUp-para li{
        font-size: 1.1em;
        line-height: 23px;
    }
    .account-billing .popUp-para li, .expense-track .popUp-para li, .design-development .popUp-para li, 
    .app-development .popUp-para li, .hr-management .popUp-para li, .logistics-content .popUp-para li{
        font-size: 1.1em;
    }
    .design-development .popUp-para li{
        line-height: 24px;
    }
    .popUp-list{
        width: 94%;
        padding-bottom: 7px;
    }
    .product-image.icon-17{
        width: 28px;
    }
    .product-image.icon-18, .product-image.icon-19, .product-image.icon-20, pro{
        width: 24px;
    }
    .hr-management.product-image.icon-1, .hr-management.product-image.icon-2, .hr-management.product-image.icon-3, .hr-management.product-image.icon-4{
        width: 23px;
    }
    .card-details:nth-child(8) .card-img{
        padding-top: 80px;
    }
    .popUp-bg{
        width: 134vw;
        left: -20%;
    }
    .app-development .popUp-bg{
       top: -12px;
    }
    .hr-management .popUp-bg{
        width: 50vw;
        left: 20%;
    }
    .logistics .popUp-bg{
        width: 50vw;
        left: 20%;
    }
    .hr-management .popUp-para ul{
        padding-left: 40px;
    }
    /* whatWeDo_end */
    /* form_start */
    .form-para{
        width: 100%;
        height: 100vh;
        left: -50%;
        top: -60%;
        padding: 60px 0;
    }
    .form-logo{
        width: 42%;
        padding: 40px 0 10px;
        margin: 0 auto;
    }
    .formInner-bg{
        display: none;
    }
    .inner-details{
        max-width: 100%;
        text-align: center;
        margin: 0 auto;
    }
    .form-para h5{
        width: 90%;
        font-size: 16px;
        line-height: 24px;
        margin: 0 auto;
    }
    .form-para input, .form-para textarea {
        width: 390px;
        height: 60px;
        font-size: 17px;
    }
    .form-para textarea{
        height: 180px;
    }
    form button a{
        width: 390px;
        height: 60px;
        font-size: 18px;
        text-align: center;
        padding: 0 auto;
        margin: 0 auto;
        margin-top: 10px;
    }
    .started-content h2{
        width: 80%;
        margin: 0 auto;
    }
    form button{
        max-width: 390px;
    }
    form button a{
        width: 320px;
        text-align: center;
        padding: 0 auto;
        margin: 0 auto;
        margin-top: 10px;
    }
    /* form_end */
}

@media only screen and (max-width: 370px){
    .banner-content {
        width: 44.5%;
        border: 0;
        padding: 8px 0;
        margin: 0 auto;
        text-align: center;
    }
    .banner-content i{
        font-size: 12px;
    }
    .banner-content span{
        font-size: 13px;
        letter-spacing: 2px;
    }
    .circle-content h2:nth-child(2){
        padding: 0 10px;
    }
    .transfor-business{
        width: 100vw;
        margin: 0 auto;
        margin-left: 22%;
    }
    .circle-content h2{
        font-size: 34px;
        line-height: 44px;
        color: #f8f8f8;
        margin-top: 0px;
    }
    .circle-content .delivery-para{
        display: none;
    }
    .circle-content .mobile-para{
        font-size: 14px;
        line-height: 22px;
        padding: 0 42px 24px;
        display: block;
    }
    .circle-banner:nth-child(2) p{
        width: 100%;
        padding-bottom: 24px;
    }
    .circle-banner .circle-content a{
        font-size: 14px;
        padding: 18px 0 18px 24px;
    }
    .circle-inside{
        padding: 14% 1vw;;
    }
    .circle-content a span{
        width: 57px;
        height: 57px;
    }
    .transfor-business span{
        font-size: 13px;
        letter-spacing: 2px;
    }
    .circle-content .fa-arrow-right{
        font-size: 22px;
    }
    .banner_overlay_header {
        font-size: 39px;
    }
    .banner_overlay_header:nth-child(2){
        margin-top: 0;
    }
    /* client_start */
    .client{
        padding: 10px 0;
    }
    .client_top{
        padding-bottom: 0;
        margin-bottom: -4px;
    }
    /* client_end */
    /* story_start */
    .story_top{
        padding-bottom: 50px;
    }
    .story_content{
        width: 100%;
    }
    .story_top h2 {
        font-size: 36px;
        line-height: 46px;
        padding-top: 40px;
    }
    .story_content p{
        width: 97%;
        padding-bottom: 0;
    }
    .about-icons{
        width: 92%;
        grid-template-columns: repeat(2, 1fr);
        margin: 0 auto;
    }
    .about-details:nth-child(2){
        background-image: none;
    }
    .about-details:nth-child(1), .about-details:nth-child(2){
        background-color: #1b1f2a;
        background-image: none;
        padding: 10px;
        margin: 10px;
    }
    .about-details:nth-child(3), .about-details:nth-child(4){
        background-color: #1b1f2a;
        background-image: none;
        padding: 10px;
        margin: 10px;
    }
    .story_content h4 {
        font-size: 26px;
    }
    /* story_end */
    /* journey_start */
    .journey_top h2 {
        font-size: 32px;
    }
    .uk-child-width-1-2\@s>* {
        width: 80vw;
        margin-left: 0;
        margin: 10px;
    }
    .container-content{
        transition: all .2s linear;
        margin: 2rem 0;
    }
    .uk-card.uk-card-default{
        height: 350px;
    }
    .uk-card-body{
        padding: 0 18px 20px;
    }
    .journey-content p {
        padding: 24% 0;
    }
    .journey-content .accodist{
        padding: 22% 0;
    }
    .journey-content .application {
        padding: 0 0 8%;
    }
    .journey-content .application.accoPOS, .journey-content .accoPOS.accoPOS-content{
        font-size: 16px !important;
        line-height: 26px;
        padding: 3% 0;
    }
    .uk-card-media-top .accopack{
        padding-bottom: 16px;
    }
    .journey-content .started-company{
        padding: 10% 0;
    }
    .journey-content .inventory-webapp{
        padding: 2% 0;
    }
    .journey-content .application.accovisit-para{
        padding: 7% 0;
    }
    /* journey_end */
    /* whatWeDo_start */
    .whatWeDo-top h2 {
        font-size: 36px;
    }
    .whatWeDo-top p{
        font-size: 18px;
        line-height: 28px;
    }
    .card-details .card-img{
        max-width: 240px;
    }
    .card-details{
        padding: 38px 10px;
    }
    .card-details h2{
        font-size: 22px;
        line-height: 30px;
    }
    .modal-content{
        max-width: 94%;
        height: 94%;
        padding: 0 10px 10px;
        margin-top: 10px;
    }
    .custom-modal a, .account-billing a, .expense-track a, .design-development a, 
    .app-development a, .hr-management a, .logistics a{
        width: 46%;
        top: 1%;
        font-size: 13px;
        letter-spacing: 1px;
        padding: 6px 14px 8px;
    }
    button.close-btn{
        width: 6%;
        left: 78%;
        top: 2%;
        margin: 10px auto 12px;
        margin-right: -94%;
    }
    .custom-modal::before, .account-billing::before, .expense-track::before, .design-development::before, 
    .app-development::before, .hr-management::before, .logistics::before{
        bottom: 30%;
        left: 2.7%;
        width: 6px;
        height: 200px;
    }
    .custom-modal::after, .account-billing::after, .expense-track::after, .design-development::after, 
    .app-development::after, .hr-management::after, .logistics::after{
        top: 18%;
        right: 3.7%;
        width: 6px;
        height: 200px;
    }
    .custom-modal::after{
        top: 10%;
    }
    .expense-track::after{
        top: 22%;
    }
    .modal-content h2{
        font-size: 1.4em;
        line-height: 18px;
    }
    .popUp-details{
        padding-top: 16px;
    }
    .app-development .popUp-details{
        padding-top: 20px;
    }
    .modal-content .popUp-line{
        width: 130px;
    }
    .popUp-content h4, .accountBilling-content h4, .expenseTrack-content h4, .webDevelopment-content h4, 
    .appDevelopment-content h4, .hrManagement-content h4, .logistics-content h4{
        font-size: 1em;
    }
    .appDevelopment-content h4{
        line-height: 20px;
        padding-left: 8px;
    }
    .popUp-content, .accountBilling-content, .expenseTrack-content, .webDevelopment-content, 
    .appDevelopment-content, .hrManagement-content, .logistics-content{
        padding-bottom: 6px;
    }
    .popUp-para ul{
        margin-bottom: 8px;
    }
    .popUp-para li{
        font-size: 0.9em;
        line-height: 19px;
    }
    .account-billing .popUp-para li, .expense-track .popUp-para li{
        font-size: 0.95em;;
    }
    .expense-track .popUp-para li{
        line-height: 20px;
    }
    .account-billing .popUp-para li, .expense-track .popUp-para li{
        font-size: 0.95em;;
    }
    .design-development .popUp-para li{
        font-size: 0.95em;
    }
    .app-development .popUp-para li, .hr-management .popUp-para li, .logistics-content .popUp-para li{
        font-size: 0.95em;
        line-height: 20px;
    }
    .hr-management .popUp-para li{
        line-height: 23px;
    }
    .popUp-list{
        width: 95%;
        padding-bottom: 10px;
    }
    .popUp-para ul {
        padding-left: 40px;
    }
    .product-image.icon-17, .product-image.icon-19{
        width: 20px;
    }
    .product-image.icon-18, .product-image.icon-20{
        width: 18px;
    }
    .product-image.icon-25, .product-image.icon-26, .product-image.icon-28{
        width: 22px;
    }
    .product-image.icon-27{
        width: 20px;
    }
    .app-development .popUp-para ul{
        padding-left: 40px;
    }
    .card-details:nth-child(8) p::after {
        left: 40%;
    }
    .card-btn {
        max-width: 46%;
        padding: 10px;
    }
    /* whatWeDo_end */
    /* form_start */
    .chain-img {
        margin-bottom: -194px;
        margin-top: -25px;
    }
    #whatsapp .whatsapp{
        bottom: 4%;
        position: fixed;
    }
    .arrow{
        bottom: 4%;
    }
    /* form_end */

     /* form_start */
     .form-para{
        width: 100%;
        height: 100vh;
        left: -50%;
        top: -60%;
        padding: 60px 0;
    }
    .form-logo{
        width: 42%;
        padding: 40px 0 10px;
        margin: 0 auto;
    }
    .formInner-bg{
        display: none;
    }
    .inner-details{
        width: 100%;
        text-align: center;
        margin: 0 auto;
    }
    .form-para h5{
        width: 78%;
        font-size: 16px;
        line-height: 24px;
        margin: 0 auto;
    }
    .form-para input, .form-para textarea {
        width: 320px;
        height: 50px;
        font-size: 16px;
    }
    .form-para textarea{
        height: 120px;
    }
    form button{
        max-width: 320px;
    }
    form button a{
        width: 320px;
        height: 50px;
        font-size: 16px;
        text-align: center;
        padding: 0 auto;
        margin: 0 auto;
        margin-top: 10px;
    }
    .started-content h2{
        width: 80%;
        margin: 0 auto;
    }
    /* form_end */
}