@media(max-width:767px) {
    .btn-warning {
        font-size: 16px;
        padding-top: 2px;
        padding-bottom: 2px
    }

    .banner {
        margin-top: 0;
        background-color: #0f2f65;
        padding-bottom: 300px;
        background-position: left bottom;
        background-size: contain
    }

    .carousel-item.owl-carousel .owl-nav button.owl-next, .carousel-item.owl-carousel .owl-nav button.owl-prev {
        display: none
    }

    .whiteimage {
        bottom: -68px;
        transform: skewY(-7deg)
    }

    .has-top-margin {
        margin-top: 55px
    }

    .logo {
        max-width: 75px;
        position: relative
    }

    .navbar.scrolled .nav-link {
        font-weight: 500
    }

    .navbar.scrolled .lang-btn {
        color: #fff
    }

    .yellowball > img {
        width: 195px
    }

    .bannerAnimation .yellowball {
        width: 175px
    }

    #asideclose-btn {
        cursor: pointer
    }

    .footer_sec {
        padding: 44px 0
    }

        .footer_sec h2 {
            font-size: 28px
        }

    .project {
        padding-bottom: 0;
        background-size: 100%;
        background-position: 46vw 5vh
    }

        .about-col h5, .process-col h5, .project h5 {
            font-size: 22px
        }

    .process-step span {
        font-size: 80px
    }

    .about-col h3 {
        font-size: 24px
    }

    .about-col p, .process-col p {
        font-size: 18px
    }

    .aboutrow {
        padding-top: 0;
        background: 0 0;
        padding-bottom: 40px
    }

    .process-step {
        min-height: auto
    }

    .stepthree span, .steptwo span {
        right: -8px
    }

    .portfolio-framebox h4 {
        font-size: 20px
    }

    .portfolio-banner {
        padding-bottom: 28% !important
    }

        .portfolio-banner.adjust-project-banner {
            padding-bottom: 75px !important
        }

        .portfolio-banner h1 {
            font-size: 30px
        }

    .portfolio-banner-img {
        margin-top: -20%;
        margin-bottom: 20px
    }

    .portfolio-banner h6 {
        font-size: 18px
    }

    .portfolio-application h3, .portfolio-palette p, .technology-col h5 {
        font-size: 16px
    }

    .portfolio-application h6, .portfolio-palette h3, .portfolio-palette h4 {
        font-size: 22px
    }

    .portfolio-application ul li a {
        font-size: 18px
    }

    .technology-col h6 {
        font-size: 16px
    }

    .next-box .nextbtn {
        font-size: 24px
    }

    .middlenav ul a {
        padding: 16px 10px;
        font-size: 18px;
        margin: 0
    }

        .middlenav ul a:hover {
            color: #fff
        }

    .imprint-heading1 {
        font-size: 30px
    }

    .imprint-heading3 {
        font-size: 20px
    }

    .imprint-address, .imprint-address a, .imprintcol p {
        font-size: 18px
    }

    .devlopment-list .media h5, .wevdev h2, .wevdev h4 {
        font-size: 22px
    }

    .devlopment-list .media {
        flex-direction: column
    }

        .devlopment-list .media div > img {
            max-width: 80px;
            margin-top: 0
        }

        .devlopment-list .media .media-body, .wevdev p {
            line-height: 1.7
        }

    .skill-box img {
        max-width: 80px
    }

    .skill-box h6 {
        font-size: 16px
    }

    .btn-link {
        font-size: 18px
    }

    .portfolio-banner h1 {
        font-size: 22px
    }

    .imprintsection {
        background-position: 40vw -200px
    }

    .imprint-box .imprint-title {
        font-size: 30px
    }

    .imprint-box address, .imprint-box p, .imprint-box ul li {
        font-size: 18px
    }

    .home-services {
        background-size: 100%;
        background-position: 0 120%
    }

    .bt-content-info p {
        font-size: 16px
    }

    .roadmap-sec {
        background-image: none;
        padding-bottom: 30px;
        padding-top: 45px
    }

    .roadmap-innerbox1 > div {
        border-left: 1px solid #fff;
        margin-left: 20px;
        position: relative
    }

        .roadmap-innerbox1 > div:last-child {
            border-left: none;
            margin-top: -15px
        }

        .roadmap-innerbox1 > div::after {
            content: "";
            display: block;
            width: 10px;
            height: 10px;
            border-radius: 50%;
            background: #fff;
            position: absolute;
            left: -5px;
            top: 10px
        }

        .roadmap-innerbox1 > div:nth-child(1)::after {
            top: 0
        }

        .roadmap-innerbox1 > div:nth-child(1) .roadmap-col {
            margin-top: -6px
        }

    .roadmap-innerbox1 {
        margin-bottom: 0
    }

    .home-technology-section {
        background-image: none
    }

    .aboutrow-col .bt-products img, .home-technology .tech-box img {
        width: 64px
    }

    .bt-products .products-body .card-title {
        font-size: 20px
    }

    .bt-products .products-body .card-text {
        font-size: 16px
    }

    .bt-content-info p.font20 {
        font-size: 16px
    }

    .project-card-info h6 {
        font-size: 16px
    }

    .project-card-info h2 {
        font-size: 22px
    }

    .project-card-info p {
        font-size: 16px;
        line-height: 24px
    }

    .aboutrow .aboutrow-col {
        background-position: -25vw -2vh;
        background-size: 90%;
        padding-top: 40px
    }

    .process-one {
        padding-top: 52px;
        overflow: hidden
    }

    .process-two {
        padding-top: 52px;
        padding-bottom: 320px;
        margin-bottom: 50px;
        background: url(../images/home/bottom-line-mobile.png) left bottom no-repeat;
        background-size: contain
    }

    .polygon1 i, .polygon2 i {
        background-size: 75%
    }

    .process-two .polygon1, .process-two .polygon2 {
        top: auto
    }

    .process-one .polygon1 {
        top: 25%;
        right: -27px
    }

    .process-one .polygon2 {
        top: 32%;
        right: 21%
    }

    .process-two .polygon1 {
        bottom: 200px;
        right: 50%
    }

    .process-two .polygon2 {
        bottom: 155px;
        right: 27%
    }

    .bannerline {
        bottom: 40px;
        background: url(/images/home/header-line-mobile.png) left bottom no-repeat;
        background-position: right 0 bottom 0;
        background-size: 100%
    }

    .banner .polygon_b {
        bottom: 79px;
        background-size: 65%
    }

    .banner .polygon_a {
        right: 12%;
        background-size: 65%
    }

    .bannerAnimation.banner .polygon_a {
        right: 15%
    }

    .roadmap-sec .polygon1 {
        top: 31%
    }

    .roadmap-sec .polygon2 {
        top: 48%
    }

    .project .doc-card {
        display: inline-block
    }

    .tech-box h6 {
        padding: 20px 0 0
    }

    .pagenot-found h1 {
        font-size: 26px;
        line-height: 1.3
    }

    .pagenot-found h6 {
        font-size: 20px
    }

    .footer-media .media-body {
        font-size: 16px
    }

    .apps-tab .nav-link {
        padding: 15px 10px;
        font-size: 16px;
        margin: 0
    }

    .interface-section {
        background-size: 70%
    }

    .expolore-link {
        font-size: 16px
    }

    .guideline-banner-info {
        padding-top: 60px
    }

        .guideline-banner-info h1 {
            font-size: 36px;
            line-height: 1.6
        }

    .guideline-banner {
        height: 400px;
        background-position: 100% 85%;
        background-size: 390%
    }

    .guideline-cover {
        margin-top: -40px
    }

    .guideline-overview-section {
        background-position: -20% 59px,80% 30px,63% 90%;
        background-size: 39%,40px,50px
    }

    .guideline-overview-section-inner {
        padding-bottom: 175px
    }

    .guideline-heading-info p, .guideline-heading-row span {
        font-size: 18px
    }

    .guideline-heading-row h3, .guideline-heading-row h4 {
        font-size: 32px
    }

    .guideline-heading-row h5 {
        font-size: 28px
    }

    .guideline-logotype {
        max-width: 400px;
        margin: 0 auto
    }

    .guideline-logo-section {
        background-image: none
    }

    .guideline-logo-section-inner {
        padding-bottom: 0;
        background-image: none
    }

    .guideline-safe-section {
        margin-bottom: 50px;
        background-image: none
    }

    .guideline-safe-section-inner {
        padding-bottom: 40px;
        background-position: 80% 100%
    }

    .guideline-mark-section h3 {
        font-size: 28px
    }

    .guideline-color-section {
        background-size: 36%,50px;
        background-position: -15% 84px,80% 60px
    }

    .guideline-color-section-inner h3 {
        font-size: 28px
    }

    .guideline-color-section-inner {
        background-size: contain;
        padding-bottom: 10px
    }

    .guideline-typography-list li {
        font-size: 18px;
        width: 60px;
        height: 60px
    }

    .guideline-typography-section {
        background-image: none
    }

    .guideline-typography-section-inner {
        background-size: contain;
        padding-bottom: 80px
    }

    .guideline-photography-section {
        background-position: -15% 19px,87% 33px;
        background-size: 36%,40px
    }

    .guideline-thanks-heading {
        font-size: 26px
    }

    .des-client-mobile {
        position: relative;
        left: 50%;
        transform: translateX(-50%)
    }

    .webdesign-banner-bg {
        padding-top: 40px;
        padding-bottom: 80px
    }

    .process-banner {
        padding-top: 80px
    }

    .hire-miancontent {
        padding: 40px 0
    }

    .vego-brand-gallery img, .vego-section-gallery img {
        border-radius: 10px
    }

    .aside-contact-form .h-30 {
        font-size: 18px
    }

    .quote-item {
        padding-left: 60px
    }

        .quote-item::before {
            left: 16px
        }
}