.hide-xs {
    display: block;
}

.hide-desktop {
    display: none;
}

.portfoliossec {
    padding-top: 17vh;
}

#portfolio-new .portfolio-title {
    font-size: 51px;
    font-weight: 400;
    line-height: 72px;
    color: #070a1d;
    font-family: CircularStdBold !important;
}

#portfolio-new .txt h2 {
    font-size: 40px;
    font-weight: 400;
    line-height: 46px;
    font-family: CircularStdBold !important;
}

#portfolio-new .txt p {
    font-size: 18px !important;
    font-family: CircularStdMedium !important;
}

p,
h2,
h1 {
    font-family: CircularStdMedium !important;
}

/* web dev css */

.scroll-section {
    padding-top: 50px;
    padding-bottom: 50px
}

.scroll-section .scroll-contents {
    width: 100%;
    height: 240px;
    overflow: auto;
    padding: 0 15px
}

.scroll-section .scroll-contents a {
    text-decoration: none;
    color: #2e3341
}

.web-txt p {
    font-size: 21px;
    line-height: 30px
}

.web-development-banner h1 {
    line-height: 60px !important
}

.web-development-banner .agile-developement p {
    font-size: 22px;
    line-height: 35px
}

.sticky .navbar-nav .nav-link {
    color: #000
}

.navbar-light .navbar-nav .nav-link {
    color: #fff
}

.logo-normal {
    display: block !important
}

.sticky-header.sticky .logo-normal {
    display: none !important
}

.logo-stikcy {
    display: none !important
}

.sticky-header.sticky .logo-stikcy {
    display: block !important
}

section {
    overflow-x: unset !important;
    overflow-y: unset !important
}

.navbar-light .navbar-nav .nav-link {
    color: #fff
}

.lines span {
    background-color: #fff
}

.sticky-header.sticky .lines span {
    background: #000
}

.nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link.active {
    color: #fff;
    background-color: #f77d33;
    border-color: #dee2e6 #dee2e6 #fff;
    border-radius: 40px
}

.navbar-light .navbar-nav .nav-link:focus,
.navbar-light .navbar-nav .nav-link:hover {
    color: #fff;
    transition: 0 !important
}

#myTab .nav-link:hover {
    color: #000
}

.sticky-header.sticky .nav-link {
    color: #000
}

.sticky-header.sticky .nav-link:hover {
    color: #000
}

.fa,
.far,
.fas {
    font-family: "Font Awesome 5 Free" !important
}

.new-web-banner .new-ios-banner h1 {
    font-family: 'avenir-bold' !important;
    font-style: normal;
    font-weight: 700 !important;
    font-size: 75px;
    line-height: 83px;
    text-align: center;
    color: #fff
}

.ios-top-brands .col-lg-2.col-md-2.col-4 {
    padding: 0 20px
}

.new-web-banner .new-ios-banner h1 b {
    font-weight: 700 !important
}

.new-web-banner .new-ios-banner h1 .first {
    text-shadow: 0 0 0 #161c2000, 3px 5px 0 #343b3d, 4px 6px 0 #626262, 3px 7px 0 #8c8f9117, 3px 4px 0 #8c8f9117;
    color: #fff !important
}

.new-web-banner .new-ios-banner h1 .second {
    text-shadow: 0 0 0 #ffffff40, 3px 5px 0 #343b3d, 4px 6px 0 #62626200, 3px 6px 0 #ffffff40, 3px 4px 0 #ffffff40;
    color: #fff !important
}

.new-web-banner .new-ios-banner {
    background-image: url(/images/webdevelopemnt/web-development-services.webp);
    width: 100%;
    image-rendering: -webkit-optimize-contrast
}

.new-web-banner .new-ios-banner .banner-heading p {
    color: #b1b1b1;
    padding-top: 47px;
    width: 100%;
    padding-bottom: 49px;
    font-family: 'Avenir' !important;
    font-weight: 400;
    font-size: 21px
}

.new-web-banner .new-ios-banner .banner-heading .banner-strip {
    width: auto;
    text-align: center;
    background: #f7b500;
    padding: 10px 4px;
    font-weight: 900;
    font-size: 25px;
    line-height: 34px;
    color: #000;
    margin-left: 0;
    font-family: 'avenir-bold' !important;
    font-weight: 900
}

.new-web-banner .new-ios-banner .banner-heading .tag {
    font-size: 28px;
    line-height: 30px;
    color: #fff;
    font-family: 'Avenir' !important;
    font-weight: 400
}

.new-web-section1 .ios-detail h2 {
    font-style: normal;
    font-weight: 400;
    font-size: 42px;
    line-height: 62px;
    color: #000
}

.new-web-section1 .ios-detail {
    padding-top: 100px;
    padding-bottom: 100px
}

@media(min-width:1199px) and (max-width:1399px) {
    .new-web-banner .new-ios-banner h1 {
        font-size: 63px !important
    }
}

.new-web-section1 .my-yellow-border span hr {
    position: absolute;
    background-color: #f7b500;
    width: 30%;
    height: 11px;
    bottom: 58px;
    z-index: -1;
    left: 0
}

.new-web-section1 .ios-detail .txt p:first-child {
    font-weight: 500;
    font-size: 19px;
    line-height: 33px;
    color: #373d47
}

.new-web-section1 .ios-detail .txt p {
    font-weight: 300;
    font-size: 17px;
    line-height: 30px;
    color: #7d8799
}

.new-web-section1 .my-border .strips {
    position: absolute;
    width: 260px;
    height: 3px;
    background-color: #f04c1f;
    animation: border_anim 5s linear forwards infinite;
    animation-direction: alternate;
    background: linear-gradient(90deg, #d42654 65%, #5624a0 35%) top/100% 3px no-repeat
}

.new-web-section1 .ios-heading {
    margin-top: 0
}

.new-web-section2 p {
    font-style: normal;
    font-weight: 500;
    font-size: 17px;
    line-height: 29px
}

.new-web-section2 .box1 p {
    color: #a777b0
}

.new-web-section2 .box1 {
    background: #fdf2ff
}

.new-web-section2 .box1 h3 {
    color: #af53be
}

.new-web-section2 .box2 {
    background: #fff5e1
}

.new-web-section2 .box2 h3 {
    color: #be9a53
}

.new-web-section2 .box2 p {
    color: #be9a53
}

.new-web-section2 .box3 {
    background: #e3fffa
}

.new-web-section2 .box3 h3 {
    color: #35a994
}

.new-web-section2 .box3 p {
    color: #35a994
}

.new-web-section2 .box4 {
    background: #fff5fa
}

.new-web-section2 .box4 h3 {
    color: #ac7c94
}

.new-web-section2 .box4 p {
    color: #9e7087
}

.new-web-section2 .box5 {
    background: #f7ffee
}

.new-web-section2 .box5 h3 {
    color: #9aa989
}

.new-web-section2 .box5 p {
    color: #93a086
}

.new-web-section2 .box6 {
    background: #fff7da
}

.new-web-section2 .ios-slider-section .boxColor {
    height: 661px
}

.new-web-section2 .box6 h3 {
    color: #bcb28b
}

.new-web-section2 .box6 p {
    color: #b1a472
}

.new-web-section2 .box7 {
    background: #edfaff
}

.new-web-section2 .box7 h3 {
    color: #85bed4
}

.new-web-section2 .box7 p {
    color: #82acba
}

.new-web-section2 .box8 {
    background: #f5f8f0
}

.new-web-section2 .box8 h3 {
    color: #b5baac
}

.new-web-section2 .box8 p {
    color: #a4ae93
}

.new-web-section2 .ios-slider-section .owl-carousel .owl-item img {
    width: 102px !important;
    height: auto;
    position: relative;
    top: 0;
    padding-top: 20px;
    margin-left: auto;
    margin-right: -32px;
    margin-bottom: 15px
}

.new-web-section2 .ios-slider-section h3 {
    font-style: normal;
    font-weight: 600;
    font-size: 32px;
    line-height: 48px
}

.new-web-section3 .ios-cta .ctabg {
    background-color: #212529;
    background-size: cover;
    background-position: right;
    width: 100%;
    height: auto;
    padding: 54px 0 0 72px;
    image-rendering: -webkit-optimize-contrast
}

.new-web-section3 .ios-cta .ctaBtn a {
    color: #000;
    border-radius: 8px;
    background-color: #fff;
    padding: 12px 17px;
    font-size: 16px;
    line-height: 24px;
    cursor: pointer;
    position: relative
}

.new-web-section3 .ios-cta .ctaBtn a:hover:before {
    background: rgba(118, 49, 230, 0.384);
    left: 60%;
    right: 60%
}

.new-web-section3 .ios-cta .ctaBtn a:hover:after {
    background: rgba(118, 49, 230, 0.384);
    left: 60%;
    right: 60%
}

.ctaBtn a:after,
.ctaBtn a:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    transition: .5s
}

.authority {
    margin-top: -17px
}

.new-web-section3 .ios-cta .ctaBtn a:hover .onhover-visible {
    display: inline;
    transition: 2s
}

.new-web-section3 .ios-cta .ctaBtn a:hover .visible {
    display: none
}

.new-web-section3 .onhover-visible {
    display: none
}

.new-web-section3 .ios-cta h2 {
    font-style: normal;
    font-weight: 500;
    font-size: 28px;
    line-height: 39px;
    color: #fff
}

.new-web-section4 .ios-detail h2 {
    font-style: normal;
    font-weight: 400;
    font-size: 42px;
    line-height: 63px;
    color: #000
}

.new-web-section4 .my-yellow-border span hr {
    position: absolute;
    background-color: #f7b500;
    width: 31%;
    height: 11px;
    bottom: 58px;
    z-index: -1;
    left: 0
}

.new-web-section4 .ios-heading {
    margin-top: 35px
}

.new-web-section5 .ios-slider-section .owl-carousel .owl-item img {
    width: 102px !important;
    height: 134px;
    position: relative;
    top: 0;
    padding-top: 10px;
    margin-left: auto;
    margin-right: -32px;
    margin-bottom: 0
}

.new-web-section5 .ios-slider-section h3 {
    font-style: normal;
    font-weight: 600;
    font-size: 32px;
    line-height: 48px;
    color: #cbb3a1;
    margin-bottom: 13px
}

.new-web-section5 .ios-slider-section p {
    font-style: normal;
    font-weight: 500;
    font-size: 17px;
    line-height: 29px;
    color: #957166
}

@media(min-width:1199px) and (max-width:1399px) {
    .new-web-section5 .ios-slider-section h3 {
        font-size: 27px
    }
    .new-web-section16 .adslide81 h2 {
        font-size: 43px !important
    }
    .new-web-section7 .ios-detail h2 {
        font-size: 46px !important
    }
    .new-web-section10 .ios-cta-banner .bann {
        padding-top: 49px !important
    }
    .new-web-section13 .my-yellow-border span hr {
        width: 58% !important
    }
    .new-web-section11 .my-yellow-border span hr {
        width: 53% !important
    }
    .new-web-section9 .my-yellow-border span hr {
        width: 60% !important
    }
    .new-web-section7 .my-yellow-border span hr {
        width: 54% !important
    }
    .new-web-section4 .my-yellow-border span hr {
        width: 38% !important
    }
    .new-web-section1 .my-yellow-border span hr {
        width: 36% !important
    }
    .new-web-section1 .ios-heading {
        margin-top: 35px !important
    }
}

.new-web-section5 .ios-slider-section .owl-carousel .owl-nav i {
    background: #f3f3f3;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    color: #000;
    display: block;
    text-align: center;
    padding: 12px 0;
    box-shadow: 0 2px 2px #fff2f1;
    text-shadow: 0 0 0 #7e7675, 1px 1px 0 #7e76756b
}

.new-web-section5 .ios-slider-section .owl-carousel .owl-nav i:hover {
    background-color: #ffc72c;
    color: #fff
}

.new-web-section5 .ios-slider-section .boxColor {
    height: 684px
}

.new-web-section7 .ios-detail h2 {
    font-style: normal;
    font-weight: 400;
    font-size: 48px;
    line-height: 72px;
    color: #000
}

.new-web-section7 .ios-heading {
    margin-left: 25px;
    margin-top: -31px
}

.new-web-section7 .offerSection .txt p {
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    line-height: 33px;
    color: #373d47
}

.new-web-section7 .my-yellow-border span hr {
    position: absolute;
    background-color: #f7b500;
    width: 47%;
    height: 11px;
    bottom: 69px;
    z-index: -1
}

.new-web-section8 .featuredSlider .festures-txt p {
    font-weight: 500;
    font-size: 18px;
    line-height: 21px;
    font-family: 'Avenir' !important;
    margin-bottom: 0
}

.new-web-section8 .featuredSlider .overTxt h3 {
    font-style: normal;
    font-weight: 600;
    font-size: 63px;
    line-height: 94px;
    color: #000
}

.new-web-section8 .lg-slider .owl-carousel .owl-nav i {
    background: #f1f3f8;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    color: #000;
    display: block;
    text-align: center;
    padding: 12px 0;
    font-size: 17px
}

.new-web-section8 .lg-slider .owl-carousel .owl-nav i:hover {
    background-color: #ffc72c;
    transition: 1s;
    color: #fff
}

.new-web-section9 .specific-sec .txt p {
    font-style: normal;
    font-weight: 500;
    font-size: 19px;
    line-height: 33px;
    color: #373d47
}

.new-web-section9 .specific-sec h2 {
    margin-bottom: 24px;
    font-style: normal;
    font-size: 60px;
    line-height: 84px;
    color: #000
}

.new-web-section9 .my-yellow-border span hr {
    position: absolute;
    background-color: #f7b500;
    width: 50%;
    height: 11px;
    bottom: 85px;
    z-index: -1;
    left: 0
}

.my-border .strips {
    position: absolute;
    width: 260px;
    height: 3px;
    background-color: #f04c1f;
    animation: border_anim 5s linear forwards infinite;
    animation-direction: alternate;
    background: linear-gradient(90deg, #d42654 65%, #5624a0 35%) top/100% 3px no-repeat
}

.new-web-section10 .ios-cta-banner .bann {
    background-image: url(/images/webdevelopemnt/cta1.webp);
    background-size: contain;
    background-position: bottom;
    width: 100%;
    background-repeat: no-repeat;
    height: 230px;
    image-rendering: -webkit-optimize-contrast
}

.new-web-section10 .ios-cta-banner .bann h2 {
    font-family: 'Avenir' !important;
    font-style: normal;
    font-weight: 600;
    font-size: 28px;
    line-height: 39px;
    text-align: center;
    color: #fffbfb
}

.new-web-section10 .ios-cta-banner .bann a {
    font-family: 'Avenir' !important;
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 20px;
    color: #000
}

.new-web-section10 .ios-cta-banner .bann a img {
    margin-left: 6px;
    width: 24px
}

.new-web-section10 .ios-cta-banner .bann a {
    padding: 12px 17px;
    font-size: 16px;
    line-height: 24px;
    cursor: pointer;
    position: relative
}

.new-web-section10 .ios-cta-banner .bann a:hover:after {
    background: #f3f3f3;
    left: 60%;
    right: 60%
}

.new-web-section10 .ios-cta-banner .bann a:hover:before {
    background: #f3f3f3;
    left: 60%;
    right: 60%
}

.bann a:after,
.bann a:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    transition: .5s
}

.new-web-section10 .ios-cta-banner .bann a:hover .onhover-visible {
    display: inline;
    transition: 2s
}

.new-web-section10 .ios-cta-banner .bann a:hover .visible {
    display: none
}

.new-web-section10 .onhover-visible {
    display: none
}

.new-web-section11 .frameworkSec h2 {
    font-style: normal;
    font-size: 52px;
    line-height: 90px;
    padding-left: 38px;
    color: #000
}

.new-web-section11 .my-yellow-border span hr {
    position: absolute;
    background-color: #f7b500;
    width: 45%;
    height: 11px;
    bottom: 94px;
    z-index: -1;
    left: 39px
}

.new-web-section11 .framework-names ul li p {
    font-style: normal;
    font-weight: 500;
    margin-bottom: 28px;
    color: #000
}

.new-web-section12 .ios-faq h2 {
    font-style: normal;
    font-weight: 500;
    font-size: 60px;
    line-height: 51px;
    text-align: center;
    color: #000;
    padding-bottom: 20px
}

.new-web-section12 .my-border .strips {
    position: absolute;
    width: 360px;
    height: 3px;
    left: 0;
    background-color: #f04c1f;
    animation: border_anim 5s linear forwards infinite;
    animation-direction: alternate;
    background: linear-gradient(90deg, #d42654 65%, #5624a0 35%) top/100% 3px no-repeat;
    margin-bottom: 50px
}

.new-web-section12 .my-border {
    padding-bottom: 90px;
    left: 35%
}

.new-web-section12 .ios-faq .accordion_body p {
    padding-left: 0;
    font-style: normal;
    font-weight: 400;
    font-size: 15px;
    line-height: 33px;
    color: #7b879a
}

.new-web-section12 .ios-faq .accordion_head h3 {
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 20px;
    color: #363d48
}

.new-web-section13 .blog-detail p img {
    height: auto;
    object-fit: none;
    margin-left: 10px
}

.new-web-section13 .blog-detail h5 {
    font-style: normal;
    font-weight: 500;
    font-size: 25px;
    line-height: 41px;
    color: #232d39
}

.new-web-section13 .blog-detail p {
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 25px;
    color: #768597
}

.new-web-section13 .blog-detail .read-more {
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #ff9f0a
}

.new-web-section13 .blog-detail .read-more:hover {
    color: #000;
    text-decoration: none !important
}

.new-web-section13 .see-all-blog:hover {
    text-decoration: none !important
}

.new-web-section13 .see-all-blog:hover .on-hover-visible {
    display: inline;
    transition: 2s
}

.new-web-section13 .see-all-blog:hover .visible {
    display: none
}

.new-web-section13 .see-all-blog .on-hover-visible {
    display: none
}

.new-web-section13 .see-all-blog {
    display: block;
    margin-bottom: 30px;
    font-style: normal;
    font-weight: 500;
    font-size: 20px;
    line-height: 30px;
    color: #0a7aff;
    float: right
}

.new-web-section13 .blog-p p {
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 30px;
    color: #4e5b6b
}

.new-web-section13 .key-element-h2 h2 {
    font-style: normal;
    font-weight: 400;
    font-size: 42px;
    line-height: 64px;
    color: #232d39
}

.new-web-section13 .my-yellow-border span hr {
    position: absolute;
    background-color: #f7b500;
    width: 49%;
    height: 11px;
    bottom: -1px;
    z-index: -1;
    left: 130px
}

.new-web-section13 .heading-text h2>span {
    color: #232d39
}

.portfoliobg {
    background: url('/images/about-new/portfolio-bg.webp');
    background-size: cover;
    background-repeat: no-repeat;
    padding: 62px 167px;
    text-align: center
}

.portfoliobg p {
    font-style: normal;
    font-weight: 600;
    font-size: 28px;
    line-height: 143%;
    text-align: center;
    letter-spacing: -0.01em;
    margin-bottom: 70px;
    color: #fff;
    margin-bottom: 30px
}

.portfoliobg p span {
    font-style: normal;
    font-weight: 600;
    font-size: 28px;
    line-height: 143%;
    text-align: center;
    letter-spacing: -0.01em;
    color: #f7b500
}

.portfoliobg a:hover span {
    color: #f7b500
}

.portfoliobg a span {
    font-style: normal;
    font-weight: 600;
    font-size: 20px;
    line-height: 143%;
    letter-spacing: -0.01em;
    color: #fff;
    border-bottom: 2px solid #ffac33
}

.portfoliobg a img {
    margin-left: 10px
}

.portfolio-bg {
    padding-bottom: 0;
    padding-top: 75px
}

@media(max-width:767px) {
    .portfoliobg {
        background: url('/images/about-new/portfolio-bg-mobile.webp');
        background-size: cover;
        background-repeat: no-repeat;
        padding: 70px 10px;
        text-align: center
    }
    .portfoliobg p {
        font-size: 26.8303px !important;
        line-height: 143% !important;
        font-style: normal;
        font-weight: 500 !important;
        text-align: center;
        letter-spacing: -0.01em;
        margin-bottom: 70px
    }
    .portfoliobg a span {
        font-size: 20px !important
    }
    .portfoliobg a img {
        margin-left: 5px !important
    }
    .new-web-banner .new-ios-banner {
        background-image: url(/images/webdevelopemnt/web-development-services-mobile.webp) !important
    }
    .new-web-banner .new-ios-banner .banner-heading {
        padding-top: 0 !important
    }
    .new-web-banner .new-ios-banner h1 {
        font-size: 27px !important;
        line-height: 43px !important;
        text-shadow: none !important
    }
    .new-web-banner .new-ios-banner .banner-heading .banner-strip {
        font-size: 14px !important
    }
    .new-web-banner .new-ios-banner .banner-heading .tag {
        font-size: 14px !important
    }
    .new-web-banner .new-ios-banner .banner-heading p {
        font-size: 15px !important;
        padding-bottom: 10px !important;
        line-height: 26px !important
    }
    .ios-top-brands {
        padding: 0 20px !important;
        padding-top: 26px !important
    }
    .new-web-section1 .ios-detail h2 {
        font-size: 32px !important;
        line-height: 44px !important;
        padding-bottom: 14px
    }
    .new-web-section1 .my-yellow-border span hr {
        display: none !important
    }
    .new-web-section1 .ios-detail .txt p:first-child {
        font-size: 14px !important;
        line-height: 33px !important
    }
    .new-web-section1 .ios-detail .txt p {
        font-size: 14px !important;
        line-height: 30px !important
    }
    .new-web-section2 .ios-slider-section .boxColor {
        height: 690px !important
    }
    .ios-slider-section .owl-carousel .owl-nav i {
        width: 47px !important;
        height: 47px !important;
        padding: 15px 0 !important
    }
    .ios-slider-section .owl-carousel .owl-nav .owl-next {
        float: left !important;
        left: 27px !important;
        position: relative !important;
        bottom: -17px !important
    }
    .ios-slider-section .owl-carousel .owl-nav .owl-prev {
        left: 20px !important;
        position: relative !important;
        bottom: -17px !important;
        float: left !important
    }
    .ios-top-brands .brandslogo img {
        margin-bottom: 10px
    }
    .ios-top-brands .brandslogo img {
        width: 100%;
        transform: translate(44px)
    }
    .new-web-section2 .ios-slider-section .owl-carousel .owl-dots {
        display: none !important
    }
    .new-web-section2 .ios-slider-section .owl-carousel .owl-nav {
        display: block !important
    }
    .new-web-section3 .ios-cta .ctabg {
        background-image: url(/images/webdevelopemnt/cta_mobile.webp);
        background-size: cover;
        background-position: bottom;
        width: 100%;
        background-repeat: no-repeat;
        height: 358px;
        padding: 30px 0 0 16px
    }
    .new-web-section3 .ios-cta h2 {
        font-size: 26px !important;
        margin-bottom: 20px !important
    }
    .new-web-section3 .ios-cta .ctaBtn a {
        border-radius: 0 !important;
        font-size: 14px !important;
        line-height: 21px !important
    }
    .new-web-section3 .ios-cta br {
        display: block !important
    }
    .new-web-section4 .ios-detail h2 {
        font-size: 32px !important;
        line-height: 46px !important
    }
    .new-web-section5 .ios-slider-section h3 {
        font-size: 25.6725px !important;
        line-height: 39px !important
    }
    .new-web-section5 .ios-slider-section h3 br {
        display: none
    }
    .ios-slider-section h3 {
        width: 100%
    }
    .ios-slider-section .owl-carousel .owl-dots {
        display: none !important
    }
    .ios-slider-section .owl-carousel .owl-nav {
        display: block !important
    }
    .new-web-section5 .ios-slider-section .owl-carousel .owl-nav i:hover {
        background-color: #ffc72c
    }
    .new-web-section16 .portfolio-ad-section .container-fluid {
        margin-left: 0 !important
    }
    .new-web-section16 .ios-riyadhBanner .txt p {
        width: 95% !important;
        font-size: 15px !important;
        line-height: 25px !important
    }
    .new-web-section16 .ios-riyadhBanner .txt {
        top: 0 !important
    }
    .new-web-section16 .ios-riyadhBanner h2 {
        font-size: 36px !important;
        line-height: 54px !important
    }
    .new-web-section16 .ios-riyadhBanner .txt {
        padding-left: 21px !important;
        padding-top: 37px !important
    }
    .new-web-section16 .ios-riyadhBanner {
        width: 100% !important;
        height: 810px !important
    }
    .new-web-section16 .adPortfolio1 .owl-nav button i {
        width: 42px !important;
        height: 42px !important
    }
    .new-web-section7 .ios-detail h2 {
        font-size: 31px !important;
        line-height: 44px !important
    }
    .new-web-section7 .offerSection .txt p {
        font-size: 14px !important;
        line-height: 33px !important
    }
    .new-web-section7 .ios-heading {
        margin-left: 2px !important
    }
    .new-web-section8 .slider-padding {
        padding-left: 20px !important
    }
    .new-web-section8 .featuredSlider .overTxt h3 {
        font-size: 55.944px;
        line-height: 84px
    }
    .featuredSlider .overTxt h2 {
        font-size: 36px !important;
        line-height: 44px !important
    }
    .new-web-section8 .featuredSlider .festures-txt p {
        font-size: 12px;
        line-height: 15px;
        display: flex
    }
    .featuredSlider .overTxt {
        bottom: 42px !important
    }
    .new-web-section9 .specific-sec h2 {
        font-size: 36px !important;
        line-height: 54px !important
    }
    .new-web-section9 .specific-sec .txt p {
        font-size: 14px !important;
        line-height: 33px !important
    }
    .ios-grid-slider .owl-dots {
        display: none !important
    }
    .ios-grid-slider .owl-nav {
        display: block !important;
        text-align: left
    }
    .owl-theme .owl-nav [class*='owl-']:hover {
        background: 0
    }
    .ios-grid-slider .owl-nav button i {
        background: #f1f3f8 !important;
        width: 47px !important;
        height: 47px !important;
        border-radius: 50% !important;
        color: #000 !important;
        display: block !important;
        text-align: center !important;
        padding: 13px 0 !important;
        font-size: 17px !important;
        border: 0
    }
    .ios-grid-slider .owl-nav button i:hover {
        background: #ffc72c !important;
        color: #fff !important
    }
    .new-web-section10 .ios-cta-banner .bann {
        background: #eb4d4b;
        height: 256px
    }
    .new-web-section10 .ios-cta-banner .bann h2 {
        font-size: 20px !important;
        line-height: 29px !important
    }
    .new-web-section10 .ios-cta-banner .bann a {
        font-size: 16px !important;
        font-weight: 500;
        line-height: 23px !important;
        background: #fff;
        width: 84%;
        display: block;
        text-align: center;
        margin-left: 9%
    }
    .new-web-section10 .ios-cta-banner .bann a img {
        margin-top: -33px !important;
        margin-left: 7px !important;
        margin-right: -24px !important
    }
    .new-web-section11 .frameworkSec h2 {
        font-size: 28px !important;
        line-height: 46px !important;
        padding-left: 0
    }
    .new-web-section11 .framework-names .col-md-6 {
        width: 50%
    }
    .new-web-section11 .ios-detail .frameworkSec {
        padding-bottom: 0 !important
    }
    .new-web-section12 .ios-faq h2 {
        font-size: 30px;
        line-height: 45px;
        font-family: 'Poppins' !important
    }
    .new-web-section12 .my-border {
        display: none !important
    }
    .new-web-section12 .ios-faq .accordion_head h3 {
        font-weight: 500 !important;
        font-size: 16px !important;
        line-height: 27px !important
    }
    .new-web-section12 .ios-faq .accordion_body p {
        font-style: normal !important;
        font-weight: 400 !important;
        font-size: 13px !important;
        line-height: 27px !important;
        color: #7b879a !important
    }
    .new-web-section13 .key-element-h2 h2 {
        font-size: 32px !important;
        line-height: 45px !important;
        margin-bottom: 20px
    }
    .new-ios-banner .project-btn .hvr-float-shadow.all_btns a {
        width: 95%
    }
    .new-ios-banner .project-btn .hvr-float-shadow.all_btns a {
        font-size: 15px !important
    }
    .new-web-section13 .see-all-blog {
        display: none !important
    }
    .new-web-section13 .blog-p p {
        padding-top: 20px !important;
        padding-right: 0 !important;
        font-size: 15px !important;
        line-height: 30px !important
    }
    .new-web-section13 .blog-p p br {
        display: none
    }
    .new-web-section13 .hvr-float-shadow.all_btns a {
        text-align: center;
        display: block;
        width: 100%;
        background: #ffc72c;
        padding: 15px 10px 15px;
        font-style: normal;
        font-weight: 500;
        font-size: 20px;
        line-height: 30px
    }
    .new-web-section15 .card-link-sec h2 {
        font-style: normal;
        font-weight: 300 !important;
        font-size: 32px !important;
        line-height: 38px !important;
        color: #000 !important
    }
    .new-web-section15 .card-link-sec p {
        font-size: 14px !important;
        line-height: 25px !important;
        height: auto !important
    }
    .new-web-section15 .card-link-sec .card-box {
        padding: 30px 25px !important;
        width: 100% !important;
        height: 415px !important;
        border-radius: 8px !important;
        margin-bottom: 35px !important;
        text-align: left !important
    }
    .new-web-section15 .card-link-sec .img1 {
        width: 64px !important
    }
    .new-web-section15 .card-link-sec .img2 {
        float: left !important;
        margin-left: 0;
        margin-bottom: 20px
    }
    .new-web-section16 .adPortfolio1 .owl-nav {
        text-align: left;
        padding-left: 20px !important
    }
    .new-web-section16 {
        padding-bottom: 60px
    }
    .new-web-section2 p {
        font-size: 15px !important;
        line-height: 27px !important
    }
    .new-web-section5 .ios-slider-section p {
        font-size: 15px !important;
        line-height: 27px !important
    }
}

.new-web-section2 .box4,
.new-web-section2 .box2,
.new-web-section2 .box1,
.new-web-section2 .box3,
.new-web-section2 .box5,
.new-web-section2 .box6,
.new-web-section2 .box7,
.new-web-section2 .box8 {
    margin: 0 !important
}

.new-web-section2 .box3 {
    padding: 0 32px 32px 22px !important;
    width: 95% !important
}

@media(max-width:375px) {
    .new-web-section10 .ios-cta-banner .bann a {
        font-size: 15px !important
    }
    .ios-top-brands .brandslogo img {
        transform: translate(14px) !important
    }
}

@media only screen and (min-width:768px) and (max-width:990px) {
    .new-web-banner .new-ios-banner h1 .first {
        font-size: 36px !important
    }
    .new-web-banner .new-ios-banner h1 .second {
        font-size: 36px !important
    }
    .new-web-section2 .ios-slider-section h3 {
        font-size: 30px !important
    }
    .new-web-section2 .ios-slider-section h3 br {
        display: none
    }
    .new-web-banner .container,
    .container-md,
    .container-sm {
        max-width: 780px !important
    }
    .new-web-banner .new-ios-banner .banner-heading .tag {
        font-size: 19px !important
    }
    .new-web-banner .new-ios-banner .banner-heading .banner-strip {
        font-size: 18px !important
    }
    .new-web-banner .new-ios-banner .banner-heading p {
        padding: 0 58px;
        font-size: 16px !important;
        padding-top: 10px !important;
        padding-bottom: 15px !important
    }
    .new-web-section1 .ios-detail h2 br {
        display: none
    }
    .new-web-section1 .ios-detail h2 {
        font-size: 26px !important;
        margin-top: 114px;
        line-height: 46px
    }
    .new-web-section8 .featuredSlider .festures-txt p {
        display: flex !important
    }
    .new-web-section1 .ios-detail .txt p:first-child {
        font-size: 17px !important;
        line-height: 30px !important
    }
    .new-web-section1 .ios-detail .txt p {
        font-size: 16px !important;
        line-height: 30px !important
    }
    .new-web-section1 .my-yellow-border span hr {
        width: 36% !important;
        bottom: 37px !important
    }
    .new-web-section2 .ios-slider-section .owl-carousel .owl-item img {
        height: 134px !important
    }
    .new-web-section2 .ios-slider-section h3 {
        width: 100% !important
    }
    .ios-slider-section .owl-carousel .owl-nav .owl-next {
        bottom: -15px !important;
        float: left !important;
        left: 67px !important;
        position: relative
    }
    .ios-slider-section .owl-carousel .owl-nav .owl-prev {
        left: -26px !important;
        bottom: -14px !important
    }
    .ios-slider-section .owl-carousel .owl-dots {
        display: none !important
    }
    .ios-slider-section .owl-carousel .owl-nav {
        display: block !important
    }
    .ios-slider-section .boxColor {
        height: 685px !important;
        width: 95% !important;
        margin-top: 0 !important
    }
    .new-web-section3 .ios-cta .ctabg {
        background-color: #5624a1;
        background-image: url(/images/webdevelopemnt/cta.webp);
        background-size: contain;
        background-position: bottom;
        background-repeat: no-repeat;
        height: 148px;
        padding: 15px 0 0 36px;
        image-rendering: -webkit-optimize-contrast
    }
    .new-web-section3 .ios-cta h2 {
        font-size: 25px !important
    }
    .new-web-section4 .my-yellow-border span hr {
        width: 38% !important;
        bottom: 38px !important
    }
    .new-web-section4 .ios-detail h2 {
        font-size: 26px !important;
        margin-top: 114px !important;
        line-height: 46px !important
    }
    .new-web-section5 .ios-slider-section h3 {
        font-size: 30px !important;
        width: 100%
    }
    .new-web-section5 .ios-slider-section h3 br {
        display: none
    }
    .new-web-section5 .ios-slider-section .boxColor {
        height: 743px !important
    }
    .new-web-section16 .ios-riyadhBanner .txt {
        padding-top: 35px !important;
        padding-left: 15px !important
    }
    .new-web-section16 .ios-riyadhBanner {
        height: 374px !important
    }
    .new-web-section16 .ios-riyadhBanner h2 {
        font-size: 33px !important;
        line-height: 81% !important
    }
    .new-web-section16 .ios-riyadhBanner .txt p {
        font-size: 14px !important;
        line-height: 23px !important;
        width: 78% !important
    }
    .new-web-section16 .adPortfolio1 .owl-nav button i {
        width: 42px !important;
        height: 42px !important
    }
    .new-web-section16 .portfolio-ad-section .container-fluid {
        margin-left: 20px !important
    }
    .new-web-section7 .ios-detail h2 {
        font-size: 27px !important;
        line-height: 60px !important;
        margin-top: 59px !important
    }
    .new-web-section7 .my-yellow-border span hr {
        width: 52% !important;
        bottom: 60px !important
    }
    .new-web-section8 .featuredSlider .festures-txt p {
        font-size: 15px !important;
        line-height: 21px !important
    }
    .new-web-section8 .festures-txt {
        margin-bottom: 20px !important
    }
    .featuredSlider .overTxt h2 {
        font-size: 36px !important;
        line-height: 46px !important
    }
    .featuredSlider .festures-txt .fbox img {
        width: 28px !important
    }
    .new-web-section9 .specific-sec h2 {
        font-size: 43px !important
    }
    .new-web-section9 .my-border {
        margin-bottom: 48px !important
    }
    .new-web-section9 .my-yellow-border span hr {
        width: 68% !important;
        bottom: 91px !important
    }
    .new-web-section10 .ios-cta-banner .bann {
        background-image: url(/images/webdevelopemnt/cta1.webp);
        background-size: contain !important;
        background-position: unset;
        height: 219px !important;
        margin-top: -18px
    }
    .new-web-section10 .ios-cta-banner .bann h2 {
        font-size: 22px !important;
        line-height: 31px !important;
        padding-top: 5px !important;
        margin: 0 !important
    }
    .new-web-section10 .bannerBtn {
        background: #eb4d4b !important;
        padding: 21px 0 !important
    }
    .new-web-section11 .frameworkSec h2 {
        font-size: 33px !important;
        line-height: 51px
    }
    .new-web-section11 .my-yellow-border span hr {
        width: 55% !important;
        bottom: 46px
    }
    .new-web-section12 .my-border .strips {
        left: 92% !important
    }
    .new-web-section13 .key-element-h2 h2 {
        font-size: 38px !important
    }
    .new-web-section13 .my-yellow-border span hr {
        width: 81% !important;
        left: 74px !important;
        bottom: -16px !important
    }
    .new-web-section13 .blog-detail h5 {
        font-size: 22px !important;
        line-height: 38px !important
    }
    .portfoliobg {
        padding: 62px 25px !important
    }
    .portfoliobg p br {
        display: none
    }
    .new-web-section15 .card-link-sec a {
        margin-top: 25px !important
    }
    .new-web-section15 .card-link-sec h2 {
        font-size: 27px !important
    }
    .new-web-section15 .card-link-sec .card-box {
        padding: 20px !important;
        height: 361px !important
    }
    .new-web-section15 .card-link-sec a img {
        margin-left: 5px !important
    }
}

@media(min-width:410px) and (max-width:430px) {
    .new-ios-banner .project-btn .hvr-float-shadow a img {
        float: none !important;
        padding-top: 0 !important;
        padding-left: 10px !important;
        display: inline !important
    }
}

@media(max-width:375px) {
    .new-web-banner .new-ios-banner .banner-heading .tag,
    .new-web-banner .new-ios-banner .banner-heading .banner-strip {
        font-size: 13px !important
    }
    .new-web-section16 .adslide81 h2 {
        font-size: 28px !important;
        line-height: 46px !important
    }
}

@media(max-width:320px) {
    .new-web-section1 .ios-detail h2 br {
        display: none
    }
    .new-web-section3 .ios-cta h2 br {
        display: none
    }
    .new-web-section7 .ios-detail h2 br {
        display: none
    }
    .new-web-section9 .specific-sec h2 br {
        display: none
    }
    .new-web-section11 .frameworkSec h2 br {
        display: none
    }
    .new-web-section3 .ios-cta .ctabg {
        background-image: url(/images/webdevelopemnt/cta_mobile.webp);
        background-size: contain;
        background-position: top;
        width: 100%;
        background-repeat: no-repeat;
        height: 357px;
        padding: 10px 0 0 12px
    }
    .new-web-banner .new-ios-banner .project-btn .hvr-float-shadow a img {
        padding-left: 0 !important;
        transform: translate(7px) !important
    }
    .new-web-section10 .ios-cta-banner .bann a {
        padding: 11px 23px !important
    }
    .new-web-section10 .ios-cta-banner .bann a {
        font-size: 14px !important;
        display: flex !important
    }
    .new-web-section15 .card-link-sec h2 {
        font-size: 27px !important
    }
    .new-web-section10 .ios-cta-banner .bann a {
        font-size: 14px !important
    }
    .new-web-section10 .ios-cta-banner .bann a img {
        margin-top: 0 !important;
        float: right !important;
        margin-right: -14px !important
    }
    .new-web-section3 .ios-cta h2 {
        font-size: 24px !important;
        line-height: 36px !important
    }
    .new-web-section3 .ios-cta .ctaBtn a {
        border-radius: 0 !important;
        font-size: 13px !important
    }
    .new-web-section5 .ios-slider-section .boxColor {
        height: 733px !important
    }
    .new-web-section8 .featuredSlider .festures-txt p {
        font-size: 9px;
        display: flex
    }
    .new-web-section11 .framework-names ul li p {
        font-size: 15px !important
    }
}

.new-web-section8 .owl-carousel .owl-item .visible-xs {
    display: none
}

.new-web-section2 .ios-slider-section .owl-carousel .owl-nav i {
    background: #f2f2f2;
    width: 42px;
    height: 42px;
    color: #000
}

.new-web-section2 .ios-slider-section .owl-carousel .owl-nav i:hover {
    background-color: #ffc72c;
    color: #fff
}

.portfolio-bg .container,
.container-lg,
.container-md,
.container-sm,
.container-xl {
    max-width: 1284px
}

.new-web-section15 .card-link-sec h2 {
    font-style: normal;
    font-weight: 500;
    font-size: 32px;
    line-height: 38px;
    color: #000;
    margin-bottom: 13px;
    padding-left: 0 !important
}

.new-web-section15 .card-link-sec .card-box {
    padding: 42px 50px 37px 50px;
    width: 100%;
    height: 321px
}

.new-web-section15 .card-link-sec p {
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #485463;
    height: 132px
}

.new-web-section15 .card-link-sec a {
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    color: #232d39
}

.new-web-section15 .card-link-sec a:hover .on-hover-visible {
    display: inline;
    transition: 2s
}

.new-web-section15 .card-link-sec a:hover .visible {
    display: none
}

.new-web-section15 .card-link-sec a .on-hover-visible {
    display: none
}

.new-web-section15 .card-link-sec a img {
    margin-left: 8px
}

.new-web-section16 .ios-riyadhBanner .txt {
    padding-top: 130px
}

.new-web-section16 h2 {
    font-style: normal;
    font-weight: 400;
    font-size: 42px;
    line-height: 63px;
    color: #000
}

.new-web-section16 .my-border {
    margin-bottom: 50px
}

.new-web-section16 .ios-riyadhBanner .txt p {
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    width: 453px
}

.new-web-section16 .ios-riyadhBanner .txt {
    position: relative;
    z-index: 2;
    padding-left: 49px;
    top: 7%
}

.new-web-section16 .adslide1 .txt,
.new-web-section16 .adslide9 .txt {
    top: 10%
}

.new-web-section16 .adslide9 .txt p {
    width: 411px
}

.new-web-section16 .ios-riyadhBanner h2 {
    font-style: normal;
    font-weight: 600;
    font-size: 45px;
    line-height: 126%;
    display: flex;
    align-items: flex-end;
    letter-spacing: -0.690708px;
    color: #fff
}

.new-web-section16 .portfolio-ad-section {
    padding-bottom: 0
}

.new-web-section16 .portfolio-head h2 {
    font-size: 56px;
    line-height: 66px;
    color: #000;
    margin-bottom: 55px
}

.new-web-section16 .portfolio-head h2 span {
    display: inline-block;
    line-height: 57px
}

.new-web-section16 .portfolio-ad-section .owl-dots {
    display: none
}

.new-web-section16 .portfolio-ad-section .container-fluid {
    margin-left: 67px;
    padding: 0
}

.portfolio-ad-section .adslide11 {
    background-image: url('/images/webdevelopemnt/portfolio/ideal-protein.webp')
}

.new-web-section16 .adslide21 {
    background-image: url('/images/webdevelopemnt/portfolio/jedda-season.webp')
}

.new-web-section16 .adslide31 {
    background-image: url('/images/webdevelopemnt/portfolio/maxsold.webp')
}

.new-web-section16 .adslide41 {
    background-image: url('/images/webdevelopemnt/portfolio/alpha-match.webp')
}

.new-web-section16 .adslide51 {
    background-image: url('/images/webdevelopemnt/portfolio/catapult.webp')
}

.new-web-section16 .adslide61 {
    background-image: url('/images/webdevelopemnt/portfolio/wsps.webp')
}

.new-web-section16 .adslide71 {
    background-image: url('/images/webdevelopemnt/portfolio/thats-game.webp')
}

.new-web-section16 .adslide81 {
    background-image: url('/images/webdevelopemnt/portfolio/ontario.webp')
}

.new-web-section16 .adslide91 {
    background-image: url('/images/webdevelopemnt/portfolio/jane.webp')
}

.new-web-section16 .adslide101 {
    background-image: url('/images/webdevelopemnt/portfolio/cardea.webp')
}

.new-web-section16 .adslide111 {
    background-image: url('/images/webdevelopemnt/portfolio/simply.webp')
}

.new-web-section16 .portfolio-ad-section .owl-carousel .owl-nav img {
    width: 44px;
    height: auto
}

.new-web-section16 .portfolio-ad-section .owl-carousel .owl-nav [class*=owl-]:hover {
    background-color: transparent
}

.new-web-section16 .adPortfolio1 .owl-nav {
    text-align: left
}

.new-web-section16 .adPortfolio1 .owl-nav button i {
    width: 42px;
    height: 42px;
    background: #e5e5e5;
    color: #000;
    display: block;
    text-align: center;
    padding: 12px 0;
    font-size: 19px;
    border-radius: 50%
}

.new-web-section16 .adPortfolio1 .owl-nav button i:hover {
    background: #1c81ff;
    transition: 1s;
    color: #fff
}

.new-web-section16 .adPortfolio1 .owl-nav .owl-prev {
    margin-left: 0
}

.new-web-section16 .adPortfolio1 .owl-nav {
    text-align: left
}

.new-web-section16 .ios-riyadhBanner {
    width: 100%;
    height: 620px;
    background-size: contain;
    image-rendering: -webkit-optimize-contrast;
    margin-bottom: 0
}

@media screen and (min-width:2049px) {
    .new-web-section16 .ios-riyadhBanner {
        height: 922px
    }
}

@media screen and (min-width:1821px) {
    .new-web-section16 .ios-riyadhBanner {
        height: 793px !important
    }
    .new-web-section16 .adslide11 .txt {
        top: 25% !important
    }
    .new-web-section16 .adslide91 .txt {
        top: 15% !important
    }
    .new-web-section16 .adslide91 .txt p {
        width: 441px !important
    }
    .new-web-section16 .ios-riyadhBanner .txt {
        top: 35%;
        padding-left: 52px
    }
    .new-web-section16 .ios-riyadhBanner .txt p {
        font-size: 18px;
        line-height: 31px
    }
}

@media screen and (min-width:1690px) {
    .new-web-section16 .ios-riyadhBanner {
        height: 667px
    }
    .new-web-section16 .adslide11 .txt {
        top: 5% !important
    }
    .new-web-section16 .adslide91 .txt {
        top: 0 !important
    }
    .new-web-section16 .adslide91 .txt p {
        width: 441px !important
    }
    .new-web-section16 .ios-riyadhBanner .txt {
        top: 6%;
        padding-left: 52px
    }
    .new-web-section16 .ios-riyadhBanner .txt p {
        font-size: 18px;
        line-height: 31px
    }
}

@media(max-width:1366px) {
    .new-web-section16 .ios-riyadhBanner {
        height: 80vh
    }
    .new-web-section16 .adslide11 .txt {
        top: -3% !important
    }
    .new-web-section16 .adslide91 .txt {
        top: -7% !important
    }
    .new-web-section16 .ios-riyadhBanner .txt {
        top: 6%;
        padding-left: 48px
    }
    .new-web-section16 .adslide81 .txt {
        padding-left: 27px !important
    }
    .new-web-section16 .adslide71 .txt {
        top: 7% !important
    }
    .new-web-section16 .ios-riyadhBanner .txt p {
        width: 363px
    }
    .new-web-section16 .adslide91 .txt p {
        width: 362px !important
    }
}

@media only screen and (max-width:767px) {
    .new-web-section16 .adslide91 .txt p {
        width: 90% !important
    }
    .new-web-section16 .ios-riyadhBanner {
        background-size: cover
    }
    .portfolio-ad-section .my-border {
        left: 8px !important
    }
    .portfolio-ad-section .adslide11 {
        background-image: url('/images/webdevelopemnt/portfolio/ideal-protein-mobile.webp') !important
    }
    .portfolio-ad-section .adslide21 {
        background-image: url('/images/webdevelopemnt/portfolio/jedda-season-mobile.webp')
    }
    .portfolio-ad-section .adslide31 {
        background-image: url('/images/webdevelopemnt/portfolio/maxsold-mobile.webp')
    }
    .portfolio-ad-section .adslide41 {
        background-image: url('/images/webdevelopemnt/portfolio/alpha-match-mobile.webp')
    }
    .portfolio-ad-section .adslide41 .txt {
        padding-top: 87px !important
    }
    .portfolio-ad-section .adslide51 {
        background-image: url('/images/webdevelopemnt/portfolio/catapult-mobile.webp')
    }
    .portfolio-ad-section .adslide61 {
        background-image: url('/images/webdevelopemnt/portfolio/wsps-mobile.webp')
    }
    .portfolio-ad-section .adslide71 {
        background-image: url('/images/webdevelopemnt/portfolio/thats-game-mobile.webp')
    }
    .portfolio-ad-section .adslide81 {
        background-image: url('/images/webdevelopemnt/portfolio/ontario-mobile.webp')
    }
    .portfolio-ad-section .adslide91 {
        background-image: url('/images/webdevelopemnt/portfolio/jane-mobile.webp')
    }
    .hidden-xs {
        display: none !important
    }
    .visible-xs {
        display: block !important
    }
    .new-web-banner .new-ios-banner .project-btn .hvr-float-shadow a img {
        display: inline !important;
        float: none;
        padding-left: 13px;
        padding-top: 0;
        transform: translate(0)
    }
}

.hidden-xs {
    display: block
}

.visible-xs {
    display: none
}

.ios-facilities {
    padding-bottom: 100px
}

.featuredSlider .overTxt h2 {
    font-size: 66px
}

@media(max-width:1199px) and (min-width:900px) {
    .new-web-banner .new-ios-banner h1 {
        font-size: 50px !important;
        line-height: 76px !important
    }
    .featuredSlider .overTxt h2 {
        font-size: 70px
    }
    .new-web-section1 .ios-detail h2 {
        font-size: 35px !important;
        line-height: 58px !important;
        margin-top: 79px !important
    }
    .new-web-section1 .ios-detail .txt p:first-child,
    .new-web-section1 .ios-detail .txt p {
        font-size: 17px !important;
        line-height: 30px !important
    }
    .new-web-section1 .my-yellow-border span hr {
        width: 36% !important;
        bottom: 50px !important
    }
    .ios-slider-section .owl-carousel .owl-nav .owl-next {
        bottom: -15px !important;
        float: left !important;
        left: 67px !important;
        position: relative
    }
    .ios-slider-section .owl-carousel .owl-nav .owl-prev {
        left: -26px !important;
        bottom: -14px !important
    }
    .new-web-section2 .ios-slider-section h3 {
        font-size: 27px !important
    }
    .ios-slider-section .boxColor {
        height: 806px !important
    }
    .new-web-section3 .ios-cta .ctaBtn {
        margin-bottom: 17px !important
    }
    .new-web-section4 .ios-detail h2 {
        font-size: 35px !important;
        line-height: 58px !important;
        margin-top: 79px !important
    }
    .new-web-section4 .ios-detail .txt p:first-child,
    .new-web-section4 .ios-detail .txt p {
        font-size: 17px !important;
        line-height: 30px !important
    }
    .new-web-section4 .my-yellow-border span hr {
        width: 39% !important;
        bottom: 55px !important
    }
    .new-web-section5 .ios-slider-section h3 {
        font-size: 26px !important;
        width: 100% !important
    }
    .new-web-section5 .ios-slider-section h3 br {
        display: none
    }
    .new-web-section7 .ios-detail h2 {
        font-size: 38px !important
    }
    .new-web-section7 .offerSection .txt p {
        width: 100%
    }
    .new-web-section8 .featuredSlider .festures-txt p {
        display: flex !important
    }
    .new-web-section7 .my-yellow-border span hr {
        width: 54% !important;
        bottom: 73px !important
    }
    .new-web-section9 .my-yellow-border span hr {
        width: 67% !important
    }
    .new-web-section10 .ios-cta-banner .bann h2 {
        font-size: 25px !important;
        line-height: 37px !important
    }
    .new-web-section10 .ios-cta-banner .bann {
        padding-top: 58px !important
    }
    .new-web-section11 .frameworkSec h2 {
        font-size: 46px !important
    }
    .new-web-section11 .my-yellow-border span hr {
        width: 56% !important
    }
    .new-web-section13 .my-yellow-border span hr {
        width: 69% !important
    }
    .portfoliobg {
        padding: 62px 148px !important
    }
    .portfoliobg p br {
        display: none !important
    }
    .portfoliobg p {
        font-size: 28px !important
    }
    .new-web-section15 .card-link-sec a img {
        margin-left: 0
    }
    .new-web-section15 .card-link-sec p {
        height: 201px !important
    }
    .new-web-section15 .card-link-sec .hidden-xs img {
        margin-left: 6px
    }
}

@media(max-width:1366px) {
    .new-web-section8 .lg-slider .owl-carousel .owl-item .simg {
        width: 100% !important;
        height: 597px;
        object-fit: cover
    }
}

@-moz-document url-prefix() {
    .ios-slider-section .boxColor {
        height: 660px !important
    }
    @media(min-width:1199px) and (max-width:1399px) {
        .new-web-banner .new-ios-banner h1 {
            font-size: 60px !important
        }
        .new-web-section7 .ios-detail h2 {
            font-size: 45px !important
        }
        .new-web-section5 .ios-slider-section h3 {
            font-size: 26px
        }
    }
    button {
        outline: none !important
    }
}

.new-web-section11 .framework-names {
    background-image: url(/images/new-ios/mapp.webp);
    width: 96%;
    height: 310px;
    background-size: contain;
    margin: auto;
    margin-top: 53px
}

.new-web-banner .arrowdown img {
    text-align: center;
    left: 48%;
    width: 85px !important;
    height: 85px !important;
    top: 90%;
    border-radius: 25px;
    margin-bottom: 100;
    font-size: 18px;
    vertical-align: middle;
    position: absolute;
    padding: 15px 10px
}

@media(min-width:1199px) and (max-width:1399px) {
    .new-web-banner .new-ios-banner .banner-heading p {
        margin-bottom: 0 !important
    }
    .new-ios-banner .banner-heading {
        padding-top: 86px !important
    }
}

@media(max-width:767px) {
    .new-web-banner .arrowdown img {
        left: 36% !important;
        top: 89% !important;
        display: none
    }
    .new-web-section8 .lg-slider .owl-carousel .owl-item .simg {
        width: 100% !important;
        height: 750px !important
    }
}

@supports(-webkit-touch-callout:none) {
    @media(max-width: 767px) {
        .ios-grid-slider .owl-nav button i {
            background:#f1f3f8 !important;
            width: 47px !important;
            height: 47px !important;
            border-radius: 50% !important;
            color: #000 !important;
            display: block !important;
            text-align: center !important;
            padding: 13px 0 !important;
            font-size: 17px !important;
            border: 0;
            margin-left: 0 !important
        }
        .ios-grid-slider .owl-carousel .owl-nav button.owl-next,
        .ios-grid-slider .owl-carousel .owl-nav button.owl-prev {
            width: 47px !important;
            height: 47px !important
        }
        .new-web-section2 .ios-slider-section .owl-carousel .owl-nav .owl-next {
            width: 50%
        }
        .new-web-section2 .ios-slider-section .owl-carousel .owl-nav .owl-next i {
            margin-left: 15px
        }
        .new-web-section16 .adPortfolio1 .owl-nav button i {
            width: 47px !important;
            height: 47px !important
        }
    }
}

button {}

.sliddr-desk .boxColor {
    width: 100% !important;
    padding: 50px 20px 40px 23px !important;
    margin-bottom: 41px !important
}

.sliddr-desk .boxColor img {
    width: 90px !important;
    height: auto;
    position: relative;
    top: -50px;
    left: 236px;
    margin-left: auto;
    margin-right: -38px;
    margin-bottom: -41px
}

.slide-part2 .p1 {
    height: auto
}

.sliddr-desk .boxColor {
    height: 729px
}

.slide-part2.boxColor {
    height: 716px !important
}

@media(min-width:1600px) and (max-width:1700px) {
    .sliddr-desk .boxColor {
        height: 652px
    }
}

.new-web-section16 .portfolio-ad-section .container-fluid {
    margin-left: 122px
}

@media only screen and (min-width :1000px) {
    .adPortfolio1 .port .custom-nav {
        position: absolute;
        top: 20%;
        left: 0;
        right: 0
    }
    .adPortfolio1 .owl-nav .owl-prev {
        top: 40%;
        position: absolute;
        margin: auto;
        left: 57px
    }
    .adPortfolio1 .owl-nav .owl-next {
        top: 40%;
        position: absolute;
        margin: auto;
        right: 57px;
        float: right
    }
    .new-web-section16 .ios-riyadhBanner {
        height: 96vh
    }
    .adPortfolio1 .owl-nav .disabled {
        display: none
    }
    .adPortfolio1 {
        transform: translate(-120px)
    }
    .card-2 {
        margin-left: 13vw
    }
}

@media(min-width:1000px) and (max-width:1029px) {
    .sliddr-desk .boxColor img {
        left: 174px
    }
    .new-web-section16 .ios-riyadhBanner {
        height: 61vh
    }
    .new-web-section16 .portfolio-ad-section .container-fluid {
        margin-left: 88px
    }
    .adPortfolio1 {
        transform: translate(-92px)
    }
    .adPortfolio1 .owl-nav .owl-prev {
        left: 38px
    }
    .adPortfolio1 .owl-nav .owl-next {
        right: 41px
    }
}

.hvr-float-shadow.all_btns .consult-btn {
    border-bottom: 3px solid #979797
}

.hvr-float-shadow.all_btns .consult-btn:hover:before {
    background: rgba(166, 162, 240, 0.7);
    left: 60%;
    right: 60%
}

.hvr-float-shadow.all_btns .consult-btn:hover:after {
    background: rgba(166, 162, 240, 0.7);
    top: 60%;
    bottom: 60%
}

.new-ios-banner .project-btn .hvr-float-shadow.all_btns a {
    background: #fff;
    border-radius: 7px;
    color: #000
}

.new-ios-banner .project-btn .hvr-float-shadow.all_btns .portf-btn {
    background: #ffc72c;
    color: #fff;
    border-bottom: 3px solid #1464a1
}

.ios-top-brands .brandslogo img {
    height: auto
}

.adPortfolio1 .owl-stage .active {
    overflow: hidden;
    position: relative;
    transform-origin: center;
    transition: all .6s ease-in-out;
    transition-delay: 0
}

.adPortfolio1 .owl-stage .active .ios-riyadhBanner {
    animation: 1.5s ease-in-out 0 normal none running zoomeff
}

@keyframes zoomeff {
    0% {
        transform: scale(1.1);
    }
    100% {
        transform: scale(1);
    }
}

.adPortfolio1 .owl-stage .active .ios-riyadhBanner .animatecont {
    animation: 1s ease-in-out 0s normal none running zoomeff1;
}

@keyframes zoomeff1 {
    0% {
        transform: translate(0px, 66px);
    }
    100% {
        transform: translate(0px, 0px);
    }
}

.adPortfolio1 .owl-carousel .owl-item {
    overflow: hidden;
}

.lg-slider .owl-carousel .owl-item .simg {
    height: 96vh;
}

@media(max-width: 767px) {
    .no-gutters {
        text-align: initial;
    }
    .new-web-section16 .adslide101 {
        background-image: url('/images/webdevelopemnt/portfolio/cardea-mini.webp');
    }
    .new-web-section16 .adslide111 {
        background-image: url('/images/webdevelopemnt/portfolio/simply-mini.webp');
    }
    .hvr-float-shadow.all_btns .portf-btn:hover:after {
        background: initial;
        top: 0%;
        bottom: 0%;
    }
    .hvr-float-shadow.all_btns .portf-btn:hover:before {
        background: initial;
        top: 0%;
        bottom: 0%;
    }
    .new-web-section13 .hvr-float-shadow.all_btns a:hover {
        color: #fff !important;
    }
    .skills-slide h2 br {
        display: block !important;
    }
}

@media(max-width: 391px) {
    .ios-top-brands .brandslogo img {
        width: 100%;
        transform: translate(27px);
    }
}

@media screen and (min-width: 1000px) and (max-width: 2300px) {
    .adPortfolio1 .owl-stage {
        transition: all 2.5s ease 0s !important;
    }
}

.ios-top-brands {
    background: #F7FCFF;
    padding-top: 63px !important;
    padding-bottom: 56px !important;
}

@media only screen and (min-width :1500px) {
    .adPortfolio1 {
        transform: translate(-144px);
    }
    .card-2 {
        margin-left: 13vw;
    }
    .new-web-section1 .ios-detail {
        padding-top: 148px;
        padding-bottom: 100px;
    }
    .sliddr-desk .boxColor img {
        left: 306px;
    }
    .lg-slider .owl-carousel .owl-item .simg {
        height: 683px;
    }
}

/* portfolio css */

/* @font-face {
	font-family: poppins;
	font-display: swap;
	src: url(../assets/fonts/Poppins/Poppins-Regular.ttf)
}

@font-face {
	font-family: poppins-semi-bold;
	font-display: swap;
	src: url(../assets/fonts/Poppins/Poppins-SemiBold.ttf)
}

@font-face {
	font-family: poppins-bold;
	font-display: swap;
	src: url(../assets/fonts/Poppins/Poppins-Bold.ttf)
} */

.hidden-xs {
    display: block;
}

.visible-xs {
    display: none;
}

.portfolio-banner .bannerimg {
    width: 638.52px;
    height: 660.18px;
    margin-left: -140px;
    margin-top: 76px;
}

.portfolio-banner .mt-5,
.my-5 {
    margin-top: 6rem !important;
}

.portfolio-banner .banner-heading h1 {
    font-style: normal;
    font-weight: 700;
    font-size: 51px;
    line-height: 71px;
    letter-spacing: -1px;
    color: #000000;
}

p {
    margin-bottom: 0.7rem;
}

.portfolio-banner .banner-heading p {
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 33px;
    color: #737373;
}

.portfolio-banner .banner-heading h1>span {
    color: #ffcd43 !important;
}

.new-web-section16 .ios-riyadhBanner {
    margin-bottom: 70px !important;
}

.portfolio-ad-section .portfolio1 {
    background: url('/images/ampcb-1.webp');
}

.portfolio-ad-section .portfolio2 {
    background: url('/images/guru-1.webp');
}

.portfolio-ad-section .portfolio3 {
    background: url('/images/newportfolio/settlyte.webp');
}

.portfolio-ad-section .portfolio4 {
    background: url('/images/bipm-1.webp');
}

.portfolio-ad-section .portfolio5 {
    background: url('/images/newportfolio/skills.webp');
}

.portfolio-ad-section .portfolio6 {
    background: url('/images/newportfolio/frenzy.webp');
}

.portfolio-ad-section .portfolio7 {
    background: url('/images/newportfolio/ecao.webp');
}

.portfolio-ad-section .portfolio8 {
    background: url('/images/newportfolio/simply-signs.webp');
}

.portfolio-ad-section .portfolio9 {
    background: url('/images/newportfolio/alpha-match.webp');
}

.portfolio-ad-section .portfolio10 {
    background: url('/images/newportfolio/wsps.webp');
}

.portfolio-ad-section .portfolio11 {
    background: url('/images/newportfolio/taxvolt.webp');
}

.portfolio-ad-section .portfolio12 {
    background: url('/images/bipm-1.webp');
}

.portfolio-ad-section .portfolio13 {
    background: url('/images/newportfolio/alpha-matcha-web.webp');
}

.portfolio-ad-section .portfolio14 {
    background: url('/images/newportfolio/yello.webp');
}

.portfolio-ad-section .portfolio15 {
    background: url('/images/newportfolio/rehvup.webp');
}

.portfolio-ad-section .portfolio16 {
    background: url('/images/newportfolio/bungie-foundation.webp');
}

.portfolio-ad-section .portfolio17 {
    background: url('/images/newportfolio/maxsold.webp');
}

#portfolio-new .adslide91 {
    background-image: url('/images/newportfolio/jane.webp');
}

.portfolio-ad-section .portfolio18 {
    background: url('/images/newportfolio/catapult.webp');
}

.portfolio-ad-section .portfolio19 {
    background: url('/images/newportfolio/jedda-season.webp');
}

.portfolio-ad-section .portfolio20 {
    background: url('/images/newportfolio/amy-macedo.webp');
}

.portfolio-ad-section .portfolio21 {
    background: url('/images/newportfolio/public-services.webp');
}

.portfolio-ad-section .portfolio22 {
    background: url('/images/newportfolio/basf.webp');
}

.portfolio-ad-section .portfolio23 {
    background: url('/images/newportfolio/quickcue.webp');
}

.portfolio-ad-section .portfolio24 {
    background: url('/images/newportfolio/viewgem.webp');
}

.portfolio-ad-section .portfolio25 {
    background: url('/images/newportfolio/ideal-protein-app.webp');
}

.portfolio-ad-section .portfolio26 {
    background: url('/images/newportfolio/haven.webp');
}

.portfolio-ad-section .portfolio27 {
    background: url('/images/newportfolio/ableopps.webp');
}

.portfolio-ad-section .portfolio28 {
    background: url('/images/newportfolio/frenzy-web.webp');
}

.portfolio-ad-section .portfolio29 {
    background: url('/images/newportfolio/jane-mobile.webp');
}

.portfolio-ad-section .portfolio30 {
    background: url('/images/newportfolio/cardea-health.webp');
}

.portfolio-ad-section .portfolio31 {
    background: url('/images/newportfolio/smart-bisto-chef.webp');
}

.portfolio-ad-section .portfolio32 {
    background: url('/images/newportfolio/ca-health.webp');
}

.portfolio-ad-section .portfolio33 {
    background: url('/images/newportfolio/cloudicide.webp');
}

.portfolio-ad-section .portfolio34 {
    background: url('/images/newportfolio/goyasso.webp');
}

.portfolio-ad-section .portfolio35 {
    background: url('/images/newportfolio/ballgod.webp');
}

.portfolio-ad-section .portfolio36 {
    background: url('/images/newportfolio/we-care.webp');
}

.portfolio-ad-section .portfolio37 {
    background: url('/images/newportfolio/health-care.webp');
}

.portfolio-ad-section .portfolio38 {
    background: url('/images/newportfolio/covid-19.webp');
}

.portfolio-ad-section .portfolio39 {
    background: url('/images/newportfolio/buzzwork.webp');
}

.portfolio-ad-section #mindset-app {
    background-image: url(/images/ampcb2.webp);
}

.portfolio-ad-section #riyadh-app {
    background-image: url(/images/guru2.webp);
}

.portfolio-ad-section #settlyt-app {
    background-image: url(/images/bipm2.webp);
}

.portfolio-ad-section #frenzy-app {
    background-image: url(/images/newportfolio/frenzy-app.webp);
}

.portfolio-ad-section #wsps-app {
    background-image: url(/images/newportfolio/wsps-app.webp);
}

.portfolio-ad-section #ideal-app {
    background-image: url(/images/bipm2.webp);
}

.portfolio-ad-section #alpha-app {
    background-image: url(/images/newportfolio/aplha-app.webp);
}

.portfolio-ad-section #yello-app {
    background-image: url(/images/newportfolio/yello-app.webp);
}

.portfolio-ad-section #amy-app {
    background-image: url(/images/newportfolio/amy-app.webp);
}

.portfolio-ad-section #jane-app {
    background-image: url(/images/newportfolio/jane-mobile-app.webp);
}

.portfolio-ad-section .portfolio-app {
    background-size: contain;
    background-position: bottom;
    background-repeat: no-repeat;
    height: 80vh;
    text-align: center;
    padding-top: 20px;
}

#portfolio-new .col-md-9 {
    flex: 0 0 80%;
    max-width: 80%;
}

#portfolio-new .col-md-3 {
    flex: 0 0 20%;
    max-width: 20%;
}

.exploren {
    margin-left: -6px;
}

.case-link {
    font-style: normal;
    font-weight: 600;
    font-size: 14px;
    line-height: 21px;
    letter-spacing: 0.8px;
    color: #FFFFFF !important;
}

.case-border {
    position: absolute;
    width: 118px;
    margin-left: 3px;
    margin-top: 24px;
    background: #fff;
    height: 2px;
    left: 46px;
}

.downloadtxt {
    font-style: normal;
    font-weight: 600 !important;
    font-size: 13px !important;
    line-height: 22px !important;
    color: #FFFFFF !important;
    display: block;
    padding-left: 5px;
    padding-bottom: 7px;
    letter-spacing: 0.5px
}

#portfolio-new .bannerBtn {}

.portfolio1 .bannerBtn {
    padding-top: 10%;
}

.portfolio2 .bannerBtn {
    padding-top: 10%;
}

.portfolio5 .bannerBtn {
    padding-top: 10%;
}

.portfolio3 .bannerBtn {
    padding-top: 10%;
}

.portfolio6 .bannerBtn {
    padding-top: 23%;
}

.portfolio8 .bannerBtn {
    padding-top: 10%;
}

#portfolio-new .txt {
    padding-top: 78px;
    position: unset;
}

#portfolio-new .txt p {
    font-style: normal;
    font-weight: 400;
    font-size: 15px;
    line-height: 25px;
    color: #FFFFFF;
    opacity: 0.7;
}

#frenzy-app .app-downloads-count {
    color: #fff;
}

.case-link img {
    padding-left: 9px;
}

.app-store-txt {
    font-family: 'CircularStdRegular';
    font-style: normal;
    font-weight: 500 !important;
    font-size: 16px;
    line-height: 25px;
    text-align: center;
    display: block;
    padding-bottom: 15px;
    color: #E6E6E6 !important;
}

.app-downloads-count {
    font-style: normal;
    font-weight: 600;
    font-size: 42px;
    line-height: 63px;
    color: #FF9F0A;
}

#portfolio-new .my-border {
    margin-bottom: 33px;
}

#portfolio-new .my-border .strips {
    position: absolute;
    width: 189px;
    height: 3px;
    background-color: #F04C1F;
    animation: border_anim 5s linear forwards infinite;
    animation-direction: alternate;
    background: linear-gradient(90deg, #FF69C3 50%, #ffcd43 50%) top/100% 3px no-repeat;
    margin-top: -10px;
}

#portfolio-new .portfolio-title {
    font-style: normal;
    font-weight: 600;
    font-size: 51px;
    line-height: 72px;
    color: #000000;
}

#riyadh-app .app-store-txt {
    color: #E6E6E6;
    opacity: 0.7;
}

#riyadh-app .app-downloads-count {
    color: #FFFFFF;
}

#settlyt-app .app-downloads-count {
    color: #fff;
}

#wsps-app .app-downloads-count {
    color: #FFFFFF;
}

#yello-app .app-downloads-count {
    color: #FFFD00;
}

#amy-app .app-downloads-count,
#amy-app .app-store-txt {
    color: #000000 !important;
}

.rank .ranktxt {
    font-style: normal;
    font-weight: 500;
    font-size: 39.3428px;
    line-height: 59px;
    color: #FFFFFF;
}

.rank .ranktxt2 {
    font-family: 'CircularStdRegular';
    font-style: normal;
    font-weight: 500;
    font-size: 12.6459px;
    line-height: 18px;
    color: #E6E6E6;
    margin-top: 10px
}

.rank {
    padding-left: 59px;
    padding-top: 25px;
}

.rank .ranktxt2:before {
    content: "";
    position: absolute;
    background: #fff;
    height: 37px;
    width: 1px;
    opacity: 0.4;
    top: 0;
    left: 6px;
}

blockquote {
    font-family: 'CircularStdBold';
    font-style: normal;
    font-weight: 600;
    font-size: 36px;
    line-height: 41px;
    color: #000000;
}

blockquote b {
    color: #ffcd43;
}

blockquote b span {
    text-decoration: underline;
}

.section2 {
    padding: 16px 0px 51px 5px;
}

#portfolio-new .portfolio19 .txt {
    padding-top: 153px;
}

blockquote:before {
    background: url(/images/newportfolio/quote.svg);
    top: -31px;
    background-repeat: no-repeat;
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: -37px
}

.blockquotetxt {
    display: flex;
    align-items: center;
    justify-content: center;
}

.portfolio4 .bannerBtn {
    padding-top: 10%;
}

.portfolio4 .downloadtxt {
    font-weight: 500;
}

.showdesk {
    display: block;
}

.skills {
    transform: translate(-38px, 0px);
    -webkit-transform: translate(-38px, 0px);
    -moz-transform: translate(-38px, 0px);
    -ms-transform: translate(-38px, 0px);
    -o-transform: translate(-38px, 0px);
}

.transport {
    transform: translate(-91px, 0px);
    -webkit-transform: translate(-91px, 0px);
    -moz-transform: translate(-91px, 0px);
    -ms-transform: translate(-91px, 0px);
    -o-transform: translate(-91px, 0px);
}

.ecao {
    /* margin-top: 50px; */
}

.portfolio7 .bannerBtn {
    padding-top: 10%;
}

.case-link-orange {
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    color: #FF813A !important;
}

.case-link-orange .case-border {
    position: absolute;
    width: 170px;
    left: 47px;
    bottom: 2px;
    background: #FF813A;
    height: 2px;
}

.case-link-black {
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    color: #000 !important;
}

.case-link-black .case-border {
    position: absolute;
    width: 126px;
    left: 47px;
    bottom: 2px;
    background: #000;
    height: 2px;
}

.portfolio8 .txt p {
    width: 453px;
}

.portfolio8 .bannerBtn img {
    width: 96px;
    height: 32px;
}

.list-inline-item img {
    width: 118.92px;
    height: 37.52px;
}

.casestudytitle {
    font-size: 36px;
    line-height: 54px;
    color: #050505;
    font-weight: 500;
    margin-bottom: 45px;
}

.casestudytitle span {
    font-family: "CircularStdBold";
}

.coreytxt {
    display: flex;
}

.coreyimg {
    margin: 20px;
    margin-top: 14px;
    margin-left: 0px;
}

.corey_sec {
    margin-top: 20px;
}

.corey-byer blockquote:before {
    top: 0px !important;
}

.txtc .firsttxt {
    font-style: normal;
    font-weight: 600;
    font-size: 24px;
    line-height: 0px;
    color: #030303;
}

.txtc .secondtxt {
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 9px;
    color: #000000;
    display: block;
    opacity: 0.7;
}

.portfolio9 .case-link {
    color: #000 !important;
}

.portfolio9 .txt h2 {
    color: #1C1C1C !important;
}

.portfolio9 .txt p {
    color: #000000 !important;
    opacity: 0.6;
}

.portfolio9 .case-border {
    background: #000;
}

.portfolio9 .inline-list .downloadtxt {
    color: #000 !important;
}

.portfolio9 .bannerBtn {
    padding-top: 10%;
}

.workplacesec blockquote:after {
    bottom: -373px;
}

.adslide91 .txt h2 {
    color: #161616 !important;
}

.adslide91 .txt p {
    color: rgba(25, 25, 25, 0.75) !important;
    opacity: 1 !important;
}

.adslide91 .downloadtxt {
    color: #161616 !important;
}

.portfolio16 .txt h2,
.portfolio16 .txt p {
    color: #000 !important;
}

.portfolio16 .txt p {
    opacity: 0.7 !important;
}

.workplace {
    transform: translate(-61px, 0px);
    -webkit-transform: translate(-61px, 0px);
    -moz-transform: translate(-61px, 0px);
    -ms-transform: translate(-61px, 0px);
    -o-transform: translate(-61px, 0px);
}

#ideal-app .app-downloads-count {
    color: #fff;
}

.portfolio13 .txt h2,
.portfolio13 .txt p,
.portfolio13 .case-link,
.portfolio13 .downloadtxt {
    color: #000 !important;
}

.portfolio13 .case-border {
    background: #000 !important;
}

.portfolio10 .bannerBtn {
    padding-top: 10%;
}

.portfolio11 .bannerBtn {
    padding-top: 10%;
}

.portfolio12 .bannerBtn {
    padding-top: 10%;
}

.portfolio13 .bannerBtn {
    padding-top: 10%;
}

.portfolio14 .bannerBtn {
    bottom: -115%;
}

.portfolio15 .bannerBtn {
    padding-top: 10%;
}

.portfolio13 .txt p {
    font-weight: 400 !important;
    width: 353px !important;
}

.portfolio13 .case-border {
    width: 116px !important;
    left: 43px !important;
}

.portfolio13 .txt {
    padding-left: 43px !important;
}

.portfolio12 .txt p {
    width: 417px !important;
}

#alpha-app .app-store-txt {
    color: #000 !important;
    opacity: 0.7;
}

#alpha-app .app-downloads-count {
    color: #000 !important;
}

.bungietxt {
    transform: translate(51px, 0px);
}

.bungie {
    transform: translate(-72px, 0px);
    -webkit-transform: translate(-72px, 0px);
    -moz-transform: translate(-72px, 0px);
    -ms-transform: translate(-72px, 0px);
    -o-transform: translate(-72px, 0px);
}

.catapult {
    transform: translate(-72px, -25px);
    -webkit-transform: translate(-72px, -25px);
    -moz-transform: translate(-72px, -25px);
    -ms-transform: translate(-72px, -25px);
    -o-transform: translate(-72px, -25px);
}

.portfolio21 .txt {
    padding-top: 46px !important;
}

.portfolio21 .txt p {
    width: 453px !important;
}

.blacktxt {
    color: #010101 !important;
    opacity: 0.7 !important;
}

.portfolio22 h2 {
    color: #010101 !important;
}

.portfolio22 .txt {
    padding-top: 34px !important;
}

.portfolio22 .txt p {
    width: 414px !important;
}

.portfolio22 .downloadtxt {
    color: #000000;
}

.portfolio-cta .ctabg {
    background-image: url() !important;
    height: 213px !important;
}

#cta .ctabg h2 {
    font-style: normal;
    font-weight: 600;
    font-size: 32px;
    line-height: 133%;
    letter-spacing: -1px;
    color: #FFFFFF;
    margin-bottom: 30px;
}

#cta .ctabg a {
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    border-radius: 0px;
    color: #ffee00;
    padding: 14px 28px;
}

#cta {
    padding-bottom: 70px;
}

#cta .ctabg a:hover:before {
    background: rgba(253, 253, 253, 0.384);
    left: 60%;
    right: 60%;
}

#cta .ctabg a:hover:after {
    background: rgba(253, 253, 253, 0.384);
    left: 60%;
    right: 60%;
}

#cta .ctabg a img {
    margin-left: 12px;
}

.portfolio17 .bannerBtn {
    padding-top: 10%;
}

.adslide91 .bannerBtn {
    padding-top: 10%;
}

.adslide91 .txt p {
    width: 451px !important;
}

.jeddah {
    transform: translate(-72px, -14px);
    -webkit-transform: translate(-72px, -14px);
    -moz-transform: translate(-72px, -14px);
    -ms-transform: translate(-72px, -14px);
    -o-transform: translate(-72px, -14px);
}

.portfolio18 .bannerBtn {
    padding-top: 10%;
}

.portfolio19 .bannerBtn {
    padding-top: 10%;
}

#portfolio-new .portfolio7 .txt {
    top: 0%;
}

.portfolio20 .txt p {
    color: #010101 !important;
    opacity: 0.6 !important;
}

.portfolio20 .downloadtxt {
    color: #000000;
}

.portfolio20 .bannerBtn {
    padding-top: 10%;
}

.public {
    transform: translate(-95px, -8px);
    -webkit-transform: translate(-95px, -8px);
    -moz-transform: translate(-95px, -8px);
    -ms-transform: translate(-95px, -8px);
    -o-transform: translate(-95px, -8px);
}

.section22 {
    padding: 38px 0px;
}

.portfolio21 .bannerBtn {
    bottom: -120%;
}

.maxsold {
    transform: translate(-95px, 0px);
    -webkit-transform: translate(-95px, 0px);
    -moz-transform: translate(-95px, 0px);
    -ms-transform: translate(-95px, 0px);
    -o-transform: translate(-95px, 0px);
}

#portfolio-new .portfolio23 .case-border {
    position: absolute;
    width: 91px;
    left: 47px;
    bottom: 3px;
    background: #fff;
    height: 1px;
}

#portfolio-new .portfolio23 .txt {
    padding-top: 50px !important;
}

#portfolio-new .portfolio23 .txt p {
    width: 437px !important;
}

.portfolio23 .bannerBtn {
    bottom: -110%;
}

#portfolio-new .portfolio24 .txt {
    padding-top: 134px;
}

#portfolio-new .portfolio24 h2,
#portfolio-new .portfolio29 h2 {
    font-size: 40px !important;
}

.portfolio24 .bannerBtn {
    padding-top: 10%;
}

.idealblock {
    transform: translate(37px, 0px);
}

.idealprot {
    transform: translate(-95px, -33px);
    -webkit-transform: translate(-95px, -33px);
    -moz-transform: translate(-95px, -33px);
    -ms-transform: translate(-95px, -33px);
    -o-transform: translate(-95px, -33px);
}

#portfolio-new .portfolio25 .txt p {
    width: 408px !important;
}

#portfolio-new .portfolio25 .txt {
    padding-top: 102px;
}

.portfolio25 .bannerBtn {
    padding-top: 10%;
}

.portfolio26 .txt p {
    color: #FFFDFD !important;
    opacity: 0.7 !important;
}

#portfolio-new .portfolio26 .txt p {
    width: 408px !important;
}

.portfolio26 .bannerBtn {
    bottom: -133%;
}

#portfolio-new .portfolio26 .txt {
    padding-top: 57px !important;
}

#portfolio-new .portfolio27 h2,
#portfolio-new .portfolio32 h2,
#portfolio-new .portfolio37 h2 {
    font-size: 36px !important;
}

#portfolio-new .portfolio27 .txt {
    padding-top: 111px;
}

.portfolio27 .bannerBtn {
    bottom: -115%;
}

.frenzy {
    transform: translate(-42px, 20px);
    -webkit-transform: translate(-42px, 20px);
    -moz-transform: translate(-42px, 20px);
    -ms-transform: translate(-42px, 20px);
    -o-transform: translate(-42px, 20px);
}

#portfolio-new .portfolio28 .txt {
    padding-top: 90px;
}

.portfolio28 .bannerBtn {
    bottom: -84%;
}

#portfolio-new .portfolio29 .txt p {
    font-size: 14px;
    width: 407px !important;
}

#jane-app .app-downloads-count {
    color: #FF87A4 !important;
}

.portfolio29 .bannerBtn {
    padding-top: 10%;
}

.portfolio30 .txt h2 {
    line-height: 135% !important;
}

.portfolio30 .txt p {
    color: #FFFFFF !important;
    opacity: 0.7 !important;
    width: 402px !important;
}

.portfolio30 .bannerBtn {
    bottom: -135%;
}

.portfolio31 .case-border {
    width: 92px !important;
    bottom: 1px !important;
    height: 2px !important;
}

#portfolio-new .portfolio31 .txt {
    padding-top: 52px !important;
}

#portfolio-new .portfolio31 .txt p {
    width: 363px !important;
}

.frenzyblock {
    font-size: 34px !important;
}

#portfolio-new .portfolio32 .txt p {
    width: 493px !important;
}

#portfolio-new .portfolio32 .txt {
    padding-top: 53px !important;
}

#portfolio-new .portfolio33 .txt p {
    width: 351px !important;
}

.case-link-white .case-border {
    width: 91px !important;
    bottom: 1px !important;
}

.portfolio33 .txt {
    padding-top: 116px !important;
}

.portfolio34 .txt p {
    width: 395px !important;
}

#portfolio-new .portfolio34 .txt {
    padding-top: 135px !important;
}

.simply {
    transform: translate(-42px, -10px);
}

#portfolio-new .portfolio39 .txt p {
    width: 464px !important;
}

#portfolio-new .portfolio38 .txt p {
    width: 387px !important;
}

#portfolio-new .portfolio37 .txt p {
    width: 388px !important;
}

#portfolio-new .portfolio38 .txt {
    padding-top: 147px !important;
}

#portfolio-new .portfolio39 .txt {
    padding-top: 42px !important;
}

#portfolio-new .portfolio36 .txt {
    padding-top: 126px !important;
}

#portfolio-new .portfolio36 .txt p {
    width: 376px !important;
    font-size: 16px;
}

#portfolio-new .portfolio35 .txt p {
    width: 382px !important;
    font-size: 16px;
}

#portfolio-new .portfolio35 .txt {
    padding-top: 57px !important;
}

#portfolio-new .portfolio20 .txt p {
    width: 363px !important;
}

blockquote b:before {
    content: "";
    background: #ffcd43;
    width: 20px;
    top: 149px;
    height: 4px;
    right: 48%;
    position: absolute;
}

@media (min-width: 1500px) and (max-width: 1520px) {
    .container {
        max-width: 1336px !important;
    }
}

@media (min-width: 1199px) and (max-width: 1399px) {
    .portfolio-banner .bannerimg {
        width: 617.52px;
        height: 645.18px;
        margin-left: -63px;
        margin-top: 76px;
    }
    .portfolio-banner .mt-5,
    .my-5 {
        margin-top: 7rem !important;
    }
    #portfolio-new .container,
    .container-lg,
    .container-md,
    .container-sm,
    .container-xl {
        max-width: 1246px;
    }
    .caseoverlay {
        width: 92.5% !important;
    }
    blockquote b:before {
        content: "";
        background: #ffcd43;
        width: 20px;
        top: 149px;
        height: 3px;
        right: 42%;
        position: absolute;
    }
    .portfolio-banner .banner-heading h1 {
        font-size: 49px;
    }
    .portfolio5 .bannerBtn {
        padding-top: 13%;
    }
    .portfolio6 .txt {
        padding-top: 10% !important;
    }
    .corey {
        transform: translate(-38px, 0px);
    }
    .skills {
        transform: translate(-38px, 0px);
        -webkit-transform: translate(-38px, 0px);
        -moz-transform: translate(-38px, 0px);
        -ms-transform: translate(-38px, 0px);
        -o-transform: translate(-38px, 0px);
    }
    .showdesk {
        display: none;
    }
    .portfolio4 .bannerBtn {
        padding-top: 25%;
    }
    .portfolio4 .txt {
        padding-top: 60px !important;
    }
    blockquote {
        font-size: 28px;
    }
    .corey-byer blockquote {
        font-size: 40px;
        width: 88%;
        line-height: 44px;
    }
    .portfolio13 .txt {
        padding-top: 114px !important;
    }
    .portfolio3 .bannerBtn {
        padding-top: 39%;
    }
    .portfolio1 .bannerBtn {
        padding-top: 15%;
    }
    .portfolio2 .bannerBtn {
        padding-top: 13%;
    }
    .portfolio7 .bannerBtn {
        padding-top: 25%;
    }
    .portfolio8 .bannerBtn {
        padding-top: 17%;
    }
    .portfolio-ad-section .portfolio-app {
        height: 80vh;
    }
    .portfolio9 .bannerBtn {
        padding-top: 25%;
    }
    .portfolio10 .bannerBtn {
        padding-top: 27%;
    }
    .portfolio12 .txt {
        padding-top: 108px !important;
    }
    .portfolio12 .txt p {
        width: 402px !important;
    }
    .portfolio11 .bannerBtn {
        padding-top: 16%;
    }
    .portfolio12 .bannerBtn {
        padding-top: 14%;
    }
    .portfolio13 .bannerBtn {
        padding-top: 19%;
    }
    .portfolio14 .bannerBtn {
        bottom: -97%;
    }
    .portfolio15 .bannerBtn {
        padding-top: 25%;
    }
    .portfolio17 .bannerBtn {
        padding-top: 28%;
    }
    .portfolio18 .txt {
        padding-top: 105px !important;
    }
    .adslide91 .bannerBtn {
        padding-top: 17%;
    }
    .adslide91 .case-link-black .case-border {
        width: 131px !important;
        left: 49px !important;
    }
    .portfolio18 .txt p {
        width: 396px !important;
    }
    .portfolio18 .bannerBtn {
        padding-top: 20%;
    }
    .adslide91 .txt {
        padding-top: 97px !important;
    }
    .portfolio19 .bannerBtn {
        padding-top: 16%;
    }
    .portfolio20 .bannerBtn {
        padding-top: 33%;
    }
    .portfolio8 .txt {
        padding-top: 50px !important;
    }
    .portfolio9 .txt {
        padding-top: 94px;
    }
    .portfolio21 .bannerBtn {
        bottom: -118%;
    }
    .portfolio22 .bannerBtn {
        bottom: -134%;
    }
    #portfolio-new .portfolio22 .txt {
        padding-left: 41px;
    }
    #portfolio-new .portfolio17 .txt {
        padding-top: 65px;
    }
    .portfolio23 .bannerBtn {
        bottom: -114%;
    }
    .portfolio24 .bannerBtn {
        padding-top: 15%;
    }
    .portfolio25 .bannerBtn {
        padding-top: 12%;
    }
    .portfolio26 .bannerBtn {
        bottom: -137%;
    }
    .portfolio27 .bannerBtn {
        bottom: -98%;
    }
    .portfolio28 .bannerBtn {
        bottom: -71%;
    }
    .portfolio29 .bannerBtn {
        padding-top: 9%;
    }
    .portfolio30 .bannerBtn {
        bottom: -135%;
    }
}

.case-link-black img {
    margin-left: 8px;
}

.portfolio16 .case-link-black .case-border {
    width: 98px;
}

#portfolio-new .portfolio16 .txt h2 {
    font-size: 36px;
    line-height: 120%;
}

#portfolio-new .portfolio17 .txt p {
    width: 427px !important;
}

@media screen and (min-width: 1690px) and (max-width: 1822px) {
    .portfolio-ad-section #mindset-app {
        background-color: #720000dc;
    }
    .portfolio-ad-section #riyadh-app {
        background-color: #6d6d6dcc;
    }
    .portfolio-ad-section #settlyt-app {
        background-color: #31709c;
    }
    .portfolio-ad-section #frenzy-app {
        background-color: #0a1119;
    }
    .portfolio-ad-section #wsps-app {
        background-color: #ffc72c;
    }
    .portfolio-ad-section #ideal-app {
        background-color: #f9b52cde;
    }
    .portfolio-ad-section #alpha-app {
        background-color: #ebba39;
    }
    .portfolio-ad-section #yello-app {
        background-color: #0d181c;
    }
    .portfolio-ad-section #amy-app {
        background-color: #e5d4ba;
    }
    .portfolio-ad-section #jane-app {
        background-color: #1a1f23;
    }
    .portfolio-ad-section .portfolio-app {
        height: 667px;
    }
    .port-cta .ctaBtn {
        transform: translate(-39px, 13px);
    }
    .caseoverlay {
        width: 94% !important;
    }
    .casestudylink a {
        left: 22%;
    }
    .portfolio4 .bannerBtn {
        padding-top: 40%;
        margin-left: -13px;
    }
    .portfolio5 .bannerBtn {
        padding-top: 41%;
    }
    .portfolio1 .bannerBtn {
        padding-top: 53%;
    }
    .portfolio2 .bannerBtn {
        padding-top: 41%;
    }
    .portfolio3 .bannerBtn {
        padding-top: 66%;
    }
    .portfolio6 .bannerBtn {
        padding-top: 58%;
    }
    .portfolio7 .bannerBtn {
        padding-top: 40%;
    }
    .portfolio8 .bannerBtn {
        padding-top: 36%;
    }
    .portfolio9 .bannerBtn {
        padding-top: 45%;
    }
    .portfolio10 .bannerBtn {
        padding-top: 60%;
    }
    .portfolio11 .bannerBtn {
        padding-top: 45%;
    }
    .portfolio12 .bannerBtn {
        padding-top: 44%;
    }
    .portfolio13 .bannerBtn {
        padding-top: 53%;
    }
    .portfolio12 .txt p {
        width: 449px !important;
    }
    .portfolio13 .txt p {
        width: 416px !important;
    }
    .portfolio14 .bannerBtn {
        bottom: -109%;
    }
    .portfolio15 .bannerBtn {
        padding-top: 44%;
    }
    .portfolio17 .txt {
        top: -2% !important;
        padding-top: 69px !important;
    }
    .portfolio17 .bannerBtn {
        padding-top: 26%;
    }
    .adslide91 .bannerBtn {
        padding-top: 33%;
    }
    .adslide91 .case-link-black .case-border {
        width: 131px !important;
        left: 52px !important;
    }
    .case-border {
        left: 50px !important;
    }
    .portfolio18 .bannerBtn {
        padding-top: 44%;
    }
    .portfolio19 .bannerBtn {
        padding-top: 36%;
    }
    .portfolio20 .bannerBtn {
        padding-top: 58%;
    }
    .portfolio21 .txt {
        padding-top: 32px !important;
    }
    .portfolio21 .bannerBtn {
        bottom: -151%;
    }
    .portfolio22 .bannerBtn {
        bottom: -160%;
    }
    .portfolio23 .bannerBtn {
        bottom: -129%;
    }
    .portfolio24 .bannerBtn {
        padding-top: 37%;
    }
    .portfolio25 .bannerBtn {
        padding-top: 30%;
    }
    .portfolio26 .bannerBtn {
        bottom: -151%;
    }
    .portfolio27 .bannerBtn {
        bottom: -132%;
    }
    .portfolio28 .bannerBtn {
        bottom: -99%;
    }
    .portfolio29 .bannerBtn {
        padding-top: 43%;
    }
    .portfolio30 .bannerBtn {
        bottom: -153%;
    }
    .portfolio-ad-section .container {
        max-width: 1494px;
    }
    .portfolio-banner .container {
        max-width: 1494px;
    }
    .portfolio-banner .bannerimg {
        width: 803.52px;
        height: 818px;
        margin-left: -140px;
        margin-top: 76px;
    }
    blockquote b:before {
        height: 2px;
        right: 51.5%;
    }
    .portfolio31 .case-border {
        width: 104px !important;
        bottom: 1px !important;
        height: 2px !important;
    }
    .case-link-white .case-border {
        width: 104px !important;
        bottom: 1px !important;
    }
    .portfolio-banner .col-lg-7 {
        transform: translate(86px, 0px);
    }
}

@media (min-width: 1400px) {
    .container {
        max-width: 1433px;
    }
}

.hidden-sys {
    display: block;
}

.visible-sys {
    display: none;
}

@media (min-width: 1600px) and (max-width: 1690px) {
    .container {
        max-width: 1423px !important;
    }
    .portfolio-banner .bannerimg {
        width: 834.52px;
        height: auto;
        margin-left: -194px;
        margin-top: 3px;
    }
    .arrowdown img {
        left: 46% !important;
    }
    .corey {
        transform: translate(-24px, 0px);
    }
    .corey_sec {
        transform: translate(48px, 0px);
    }
    .hidden-sys {
        display: none !important;
    }
    .visible-sys {
        display: block !important;
    }
    .corey-byer blockquote:before {
        top: -10px !important;
        left: -62px;
    }
}

.corey {
    transform: translate(23px, 0px);
    -webkit-transform: translate(23px, 0px);
    -moz-transform: translate(23px, 0px);
    -ms-transform: translate(23px, 0px);
    -o-transform: translate(23px, 0px);
}

.corey_sec {
    transform: translate(138px, 0px);
}

.corey-byer blockquote:before {
    top: -10px !important;
    left: -62px;
}

@media (max-width: 1199px) and (min-width: 900px) {
    blockquote br {
        display: none;
    }
}

@media screen and (min-width: 1823px) {
    .portfolio-ad-section #mindset-app {
        background-color: #720000dc;
    }
    .portfolio-ad-section #riyadh-app {
        background-color: #6d6d6dcc;
    }
    .portfolio-ad-section #settlyt-app {
        background-color: #31709c;
    }
    .portfolio-ad-section #frenzy-app {
        background-color: #0a1119;
    }
    .portfolio-ad-section #wsps-app {
        background-color: #ffc72c;
    }
    .portfolio-ad-section #ideal-app {
        background-color: #f9b52cde;
    }
    .portfolio-ad-section #alpha-app {
        background-color: #ebba39;
    }
    .portfolio-ad-section #yello-app {
        background-color: #0d181c;
    }
    .portfolio-ad-section #amy-app {
        background-color: #e5d4ba;
    }
    .portfolio-ad-section #jane-app {
        background-color: #1a1f23;
    }
    .portfolio-ad-section .portfolio-app {
        height: 793px !important;
    }
    .portfolio10 .bannerBtn {
        padding-top: 68%;
    }
    .portfolio4 .bannerBtn {
        margin-left: -13px;
        padding-top: 52%;
    }
    .portfolio3 .bannerBtn {
        padding-top: 77%;
    }
    .portfolio2 .bannerBtn {
        padding-top: 57%;
    }
    .portfolio1 .bannerBtn {
        padding-top: 62%;
    }
    .portfolio6 .bannerBtn {
        padding-top: 67%;
    }
    .portfolio5 .bannerBtn {
        padding-top: 49%;
    }
    .portfolio7 .bannerBtn {
        padding-top: 40%;
    }
    .portfolio8 .bannerBtn {
        padding-top: 48%;
    }
    .portfolio9 .bannerBtn {
        padding-top: 54%;
    }
    .portfolio11 .bannerBtn {
        padding-top: 52%;
    }
    .portfolio12 .bannerBtn {
        padding-top: 56%;
    }
    .portfolio13 .bannerBtn {
        padding-top: 63%;
    }
    .portfolio14 .bannerBtn {
        padding-top: 53%;
    }
    .portfolio15 .bannerBtn {
        padding-top: 52%;
    }
    .portfolio17 .bannerBtn {
        padding-top: 38%;
    }
    .adslide91 .bannerBtn {
        padding-top: 44%;
    }
    .portfolio19 .bannerBtn {
        padding-top: 45%;
    }
    .portfolio18 .bannerBtn {
        padding-top: 54%;
    }
    .portfolio20 .bannerBtn {
        padding-top: 69%;
    }
    .portfolio21 .bannerBtn {}
    .portfolio22 .bannerBtn {}
    .portfolio23 .bannerBtn {}
    .portfolio24 .bannerBtn {
        padding-top: 46%;
    }
    .portfolio25 .bannerBtn {
        padding-top: 41%;
    }
    .portfolio26 .bannerBtn {}
    .portfolio27 .bannerBtn {}
    .portfolio28 .bannerBtn {}
    .portfolio29 .bannerBtn {
        padding-top: 54%;
    }
    .portfolio30 .bannerBtn {}
    .portfolio-banner .bannerimg {
        width: 834.52px;
        height: auto;
        margin-left: -100px;
        margin-top: 76px;
    }
    .portfolio-ad-section .container {
        max-width: 1687px;
    }
    blockquote b:before {
        height: 3px;
        right: 51.5%;
    }
}

@media only screen and (min-width:2000px) and (max-width:2049px) {
    blockquote b:before {
        height: 3px;
        right: 51.5%;
        top: 150px;
    }
}

@media (max-width: 1366px) {
    #portfolio-new .txt {
        top: 0;
        padding-left: 48px;
    }
    .portfolio16 .txt p {
        width: 409px !important;
    }
    .portfolio17 .txt p {
        width: 427px !important;
    }
}

.hearticn i {
    width: 24px;
    height: 24px;
    color: #000;
}

.port-cta.ios-cta .ctabg {
    background-image: url(/images/#);
    background-size: cover;
    width: 100%;
    height: 213px;
    padding: 30px 0 0px 72px;
    image-rendering: -webkit-optimize-contrast;
}

.port-cta .ctaBtn {
    transform: translate(52px, 58px);
    -webkit-transform: translate(52px, 58px);
    -moz-transform: translate(52px, 58px);
    -ms-transform: translate(52px, 58px);
    -o-transform: translate(52px, 58px);
}

.port-cta {
    padding-bottom: 70px;
}

.port-cta .ios-cta h2 {
    font-style: normal;
    font-weight: 400;
    font-size: 36px;
    line-height: 133%;
    letter-spacing: -1px;
    color: #FFFFFF;
    margin-bottom: 10px;
}

.port-cta p {
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    line-height: 27px;
    color: #FFFFFF;
    opacity: 0.6;
}

.port-cta h2 span {
    color: #1DA0FF;
}

.port-cta .ctaBtn {
    margin-bottom: 9px;
}

.port-cta .ctabg {
    padding: 43px 0 0 72px;
}

.port-cta h2 {
    font-style: normal;
    font-weight: 600;
    font-size: 36px;
    line-height: 133%;
    color: #FFFFFF;
}

.port-cta .ctaBtn a {
    background: #1DA0FF;
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    color: #FFFFFF;
    border-radius: 0px;
    padding: 14px 14px;
}

.port-cta .ctaBtn a img {
    margin-left: 10px;
}

.zin {
    z-index: 1;
}

.zinz {
    z-index: 0;
}

.casestudy-slide img {
    width: 100%;
}

.casestudy-slide {
    padding-bottom: 70px !important;
}

.arrowdown img {
    text-align: center;
    left: 48%;
    width: 120px !important;
    height: 120px !important;
    top: 84%;
    border-radius: 25px;
    margin-bottom: 100;
    font-size: 18px;
    vertical-align: middle;
    position: absolute;
    padding: 15px 10px;
}

@media (min-width: 1200px) {}

.casestudylink {
    display: none;
}

.casestudylink a {
    position: absolute;
    top: 40%;
    left: 19%;
    font-weight: 600;
    font-size: 24px;
    line-height: 36px;
    color: #fff !important;
    overflow: hidden;
}

.casestudylink a img {
    width: 35px;
}

.caseoverlay {
    background: rgba(0, 0, 0, 0.7);
    position: absolute;
    height: auto;
    width: 93.5%;
    left: 15px;
    top: 0;
    bottom: 0;
    right: 0;
    opacity: 0;
    -webkit-transition: all 0.4s ease-in-out 0s;
    -moz-transition: all 0.4s ease-in-out 0s;
    transition: all 0.4s ease-in-out 0s;
}

.casestudyblock:hover .caseoverlay {
    opacity: 1;
}

.casestudyblock:hover .casestudylink {
    display: block;
    -webkit-transition: all 0.4s ease-in-out 0s;
    -moz-transition: all 0.4s ease-in-out 0s;
    transition: all 0.4s ease-in-out 0s;
    -ms-transition: all 0.4s ease-in-out 0s;
    -o-transition: all 0.4s ease-in-out 0s;
}

:root {
    --color-bg: #FDF1F2;
    --color-heart: #EA442B;
    --easing: cubic-bezier(.7, 0, .3, 1);
    --duration: .5s;
}

.like-button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: none;
    border-radius: 50%;
    background: white;
    width: 1em;
    height: 1.5em;
    padding: 0;
    margin: 0;
    outline: none;
    z-index: 2;
    -webkit-transition: -webkit-transform var(--duration) var(--easing);
    transition: -webkit-transform var(--duration) var(--easing);
    transition: transform var(--duration) var(--easing);
    transition: transform var(--duration) var(--easing), -webkit-transform var(--duration) var(--easing);
    cursor: pointer;
    transform: translate(10px, -5px);
}

.like-button:before {}

.like-button:after {}

.like-button:active:before {
    -webkit-animation: depress-shadow var(--duration) var(--easing) both;
    animation: depress-shadow var(--duration) var(--easing) both;
}

.like-button:focus:after {
    -webkit-animation: depress var(--duration) var(--easing) both;
    animation: depress var(--duration) var(--easing) both;
}

@-webkit-keyframes depress {
    from,
    to {
        -webkit-transform: none;
        transform: none;
    }
    50% {
        -webkit-transform: translateY(5%) scale(0.9);
        transform: translateY(5%) scale(0.9);
    }
}

@keyframes depress {
    from,
    to {
        -webkit-transform: none;
        transform: none;
    }
    50% {
        -webkit-transform: translateY(5%) scale(0.9);
        transform: translateY(5%) scale(0.9);
    }
}

@-webkit-keyframes depress-shadow {
    from,
    to {
        -webkit-transform: none;
        transform: none;
    }
    50% {
        -webkit-transform: scale(0.5);
        transform: scale(0.5);
    }
}

@keyframes depress-shadow {
    from,
    to {
        -webkit-transform: none;
        transform: none;
    }
    50% {
        -webkit-transform: scale(0.5);
        transform: scale(0.5);
    }
}

.like-wrapper {
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    z-index: 1;
}

.like-wrapper>* {
    margin: auto;
    grid-area: 1 / 1;
}

.heart {
    width: 40px;
    height: 40px;
    bottom: -12px;
    position: relative;
    margin-top: 0;
    margin-left: 2px;
    display: block;
    -webkit-transform-origin: center 80%;
    transform-origin: center 80%;
}

.heart>#likeno {
    display: inline;
}

.heart>path {
    stroke: #000000;
    stroke-width: 2;
    fill: transparent;
}

.like-button:focus .heart>path {
    fill: var(--color-heart);
    stroke: var(--color-heart);
}

.like-button:focus .heart {
    -webkit-animation: heart-bounce var(--duration) var(--easing);
    animation: heart-bounce var(--duration) var(--easing);
}

@-webkit-keyframes heart-bounce {
    40% {
        -webkit-transform: scale(0.7);
        transform: scale(0.7);
    }
    0%,
    80%,
    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@keyframes heart-bounce {
    40% {
        -webkit-transform: scale(0.7);
        transform: scale(0.7);
    }
    0%,
    80%,
    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

.particles {
    width: 1px;
    height: 1px;
}

.particle {
    position: absolute;
    top: 42px;
    left: 20px;
    height: .1em;
    width: .1em;
    border-radius: .05em;
    background-color: var(--color);
    --percentage: calc(var(--i) / var(--total-particles));
    --Θ: calc(var(--percentage) * 1turn);
    -webkit-transform: translate(-50%, -50%) rotate(var(--Θ)) translateY(0) scaleY(0);
    transform: translate(-50%, -50%) rotate(var(--Θ)) translateY(0) scaleY(0);
    -webkit-transition: all var(--duration) var(--easing);
    transition: all var(--duration) var(--easing);
}

.like-button:focus .particle {
    -webkit-animation: particles-out calc(var(--duration) * 1.2) var(--easing) forwards;
    animation: particles-out calc(var(--duration) * 1.2) var(--easing) forwards;
}

@-webkit-keyframes particles-out {
    50% {
        height: .3em;
    }
    50%,
    60% {
        height: .3em;
        -webkit-transform: translate(-50%, -50%) rotate(var(--Θ)) translateY(0.8em) scale(1);
        transform: translate(-50%, -50%) rotate(var(--Θ)) translateY(0.8em) scale(1);
    }
    60% {
        height: .2em;
    }
    100% {
        -webkit-transform: translate(-50%, -50%) rotate(var(--Θ)) translateY(1em) scale(0);
        transform: translate(-50%, -50%) rotate(var(--Θ)) translateY(1em) scale(0);
    }
}

@keyframes particles-out {
    50% {
        height: .3em;
    }
    50%,
    60% {
        height: .3em;
        -webkit-transform: translate(-50%, -50%) rotate(var(--Θ)) translateY(0.8em) scale(1);
        transform: translate(-50%, -50%) rotate(var(--Θ)) translateY(0.8em) scale(1);
    }
    60% {
        height: .2em;
    }
    100% {
        -webkit-transform: translate(-50%, -50%) rotate(var(--Θ)) translateY(1em) scale(0);
        transform: translate(-50%, -50%) rotate(var(--Θ)) translateY(1em) scale(0);
    }
}

.ripple {
    height: 1em;
    width: 1em;
    border-radius: 50%;
    overflow: hidden;
    z-index: 1;
}

.ripple:before {}

.like-button:focus .ripple:before {
    -webkit-animation: ripple-out var(--duration) var(--easing);
    animation: ripple-out var(--duration) var(--easing);
}

@-webkit-keyframes ripple-out {
    from {
        -webkit-transform: scale(0);
        transform: scale(0);
    }
    to {
        -webkit-transform: scale(5);
        transform: scale(5);
    }
}

@keyframes ripple-out {
    from {
        -webkit-transform: scale(0);
        transform: scale(0);
    }
    to {
        -webkit-transform: scale(5);
        transform: scale(5);
    }
}

.like-button:focus {
    pointer-events: none;
    cursor: normal;
}

@media (max-width: 767px) {
    .hidden-xs {
        display: none;
    }
    .visible-xs {
        display: block;
    }
    #portfolio-new .bannerBtn {
        position: absolute;
    }
    .portfoliossec #portfolio-new .ios-riyadhBanner {
        width: 100% !important;
        height: 724px !important;
    }
    .simplysec .frenzyblock {
        font-size: 33px !important;
    }
    .arrowdown img {
        display: none !important;
    }
    .port-cta .ctaBtn a {
        font-size: 14px !important;
        line-height: 21px !important;
        padding: 14px 10px !important;
    }
    .casestudylink a {
        left: 18% !important;
    }
    .bg-half-170 {
        height: 70vh !important;
        padding-top: 0px !important;
        padding-bottom: 33px;
    }
    blockquote b:before {
        top: 242px;
        height: 3px;
        right: 59%;
    }
    .authority {
        margin-top: 30px !important;
    }
}

#likeno {
    font-size: 10px;
    position: absolute;
    transform: translate(-12px, -5px);
    z-index: 2;
    color: #fff;
}

#portfolio-new .txt h2 {
    letter-spacing: 1.1px;
}

@media only screen and (max-width: 767px) {
    button.owl-next {
        margin-left: 138px !important;
    }
    .portfolio-banner .banner-heading h1 {
        font-weight: 700;
        font-size: 41px !important;
        line-height: 60px !important;
        text-align: center;
        margin-top: -29px;
    }
    #portfolio-new .my-border {
        margin-bottom: 39px;
    }
    .ref-container {
        padding-top: 2rem;
    }
    #portfolio-new .ios-riyadhBanner h2 {
        margin-bottom: 0px !important;
    }
    .portfolio-banner .banner-heading h1 br,
    .portfolio-banner .banner-heading p br {
        display: none;
    }
    .portfolio-banner {
        background: url(/images/newportfolio/mobile/portfolio-mobile.webp);
        background-size: cover;
        background-position: left;
        margin-top: 60px;
    }
    .portfolio-banner .banner-heading p {
        text-align: center;
    }
    .portfolio-banner .col-lg-7 {
        padding: 0px 6px;
    }
    .portfolio-title {
        margin-top: -8px;
    }
    #portfolio-new .col-md-9 {
        flex: 0 0 100%;
        max-width: 100%;
        padding: 0 !important;
    }
    #portfolio-new .col-md-3 {
        display: none;
    }
    #portfolio-new .txt p {
        font-size: 14px !important;
        line-height: 24px !important;
        color: #D0D0D0;
        opacity: 0.7;
        width: 95% !important;
    }
    .case-border {
        left: 16px;
    }
    .mobile-b {
        display: flex;
    }
    .app-store-txt {
        text-align: left !important;
        font-size: 14.4291px !important;
        line-height: 30px !important;
    }
    .firstb img {
        width: 131.06px;
        height: 50px;
    }
    .firstb,
    .secondb {
        width: 42%;
    }
    .portfolio2 .app-downloads-count {
        color: #fff !important;
    }
    .portfolio2 .bannerBtn {
        bottom: -167%;
    }
    #portfolio-new .portfolio3 .app-downloads-count {
        color: #fff !important;
    }
    .app-downloads-count {
        font-size: 32.4656px;
        line-height: 49px;
    }
    .portfolio-ad-section .portfolio1 {
        background: url(/images/ampcb3.webp);
    }
    .portfolio1 .bannerBtn {
        bottom: -133%;
    }
    #portfolio-new .portfolio2 .txt p {
        color: #C0C1DD !important;
    }
    .rank {
        display: none;
    }
    .portfolio-ad-section .portfolio2 {
        background: url(/images/guru3.webp);
    }
    .portfolio-ad-section .portfolio3 {
        background: url(/images/newportfolio/mobile/settlyte.webp);
    }
    .portfolio-ad-section .portfolio4 {
        background: url(/images/bipm3.webp);
    }
    .portfolio-ad-section .portfolio5 {
        background: url(/images/newportfolio/mobile/skills.webp);
    }
    .portfolio-ad-section .portfolio6 {
        background: url(/images/newportfolio/mobile/frenzy.webp);
    }
    .portfolio-ad-section .portfolio7 {
        background: url(/images/newportfolio/mobile/ecao.webp);
    }
    .portfolio-ad-section .portfolio20 {
        background: url(/images/newportfolio/mobile/amy-macedo.webp);
    }
    .portfolio-ad-section .portfolio8 {
        background: url(/images/newportfolio/mobile/simply-signs.webp);
    }
    .portfolio-ad-section .portfolio9 {
        background: url(/images/newportfolio/mobile/alpha-match.webp);
    }
    .portfolio-ad-section .portfolio10 {
        background: url(/images/newportfolio/mobile/wsps.webp);
    }
    .portfolio-ad-section .portfolio11 {
        background: url(/images/newportfolio/mobile/taxvolt.webp);
    }
    .portfolio-ad-section .portfolio12 {
        background: url(/images/newportfolio/mobile/ideal-protein.webp);
    }
    .portfolio-ad-section .portfolio21 {
        background: url(/images/newportfolio/mobile/public-services.webp);
    }
    .portfolio-ad-section .portfolio13 {
        background: url(/images/newportfolio/mobile/alpha-match-web.webp);
    }
    .portfolio-ad-section .portfolio14 {
        background: url(/images/newportfolio/mobile/yello.webp);
    }
    .portfolio-ad-section .portfolio22 {
        background: url(/images/newportfolio/mobile/basf.webp);
    }
    .portfolio-ad-section .portfolio15 {
        background: url(/images/newportfolio/mobile/rehvup.webp);
    }
    .portfolio-ad-section .portfolio16 {
        background: url(/images/newportfolio/mobile/bungie-foundation.webp);
    }
    .portfolio-ad-section .portfolio17 {
        background: url(/images/newportfolio/mobile/maxsold.webp);
    }
    .portfolio-ad-section .portfolio18 {
        background: url(/images/newportfolio/mobile/catapult.webp);
    }
    .portfolio-ad-section .portfolio19 {
        background: url(/images/newportfolio/mobile/jeddah.webp);
    }
    .portfolio-ad-section .portfolio23 {
        background: url(/images/newportfolio/mobile/quick.webp);
    }
    .portfolio-ad-section .portfolio23 {
        background: url(/images/newportfolio/mobile/quick.webp);
    }
    .portfolio-ad-section .portfolio24 {
        background: url(/images/newportfolio/mobile/viewgem.webp);
    }
    .portfolio-ad-section .portfolio25 {
        background: url(/images/newportfolio/mobile/ideal-web.webp);
    }
    .portfolio-ad-section .portfolio26 {
        background: url(/images/newportfolio/mobile/haven.webp);
    }
    .portfolio-ad-section .portfolio27 {
        background: url(/images/newportfolio/mobile/ableopps.webp);
    }
    .portfolio-ad-section .portfolio28 {
        background: url(/images/newportfolio/mobile/frenzy-web.webp);
    }
    .portfolio-ad-section .portfolio29 {
        background: url(/images/newportfolio/mobile/jane-mob.webp);
    }
    .portfolio-ad-section .portfolio30 {
        background: url(/images/newportfolio/mobile/cardea-health.webp);
    }
    .portfolio-ad-section .portfolio31 {
        background: url('/images/newportfolio/mobile/smart-bisto.webp');
    }
    .portfolio-ad-section .portfolio32 {
        background: url('/images/newportfolio/mobile/ca-health-care.webp');
    }
    .portfolio-ad-section .portfolio33 {
        background: url('/images/newportfolio/mobile/cloudicide.webp');
    }
    .portfolio-ad-section .portfolio34 {
        background: url('/images/newportfolio/mobile/goyasso.webp');
    }
    .portfolio-ad-section .portfolio35 {
        background: url('/images/newportfolio/mobile/ballgod.webp');
    }
    .portfolio-ad-section .portfolio36 {
        background: url('/images/newportfolio/mobile/we-care.webp');
    }
    .portfolio-ad-section .portfolio37 {
        background: url('/images/newportfolio/mobile/health-care.webp');
    }
    .portfolio-ad-section .portfolio38 {
        background: url('/images/newportfolio/mobile/covid.webp');
    }
    .portfolio-ad-section .portfolio39 {
        background: url('/images/newportfolio/mobile/buzzwork.webp');
    }
    #portfolio-new .adslide91 {
        background: url(/images/newportfolio/mobile/jane.webp);
        background-size: cover;
    }
    .portfolio-cta .ctabg {
        background-image: url(/images/newportfolio/mobile/#) !important;
        height: 333px !important;
    }
    #portfolio-new .ios-riyadhBanner {
        width: 100% !important;
        height: 724px !important;
    }
    #portfolio-new .portfolio5 h2 {
        font-size: 36px !important;
        line-height: 44px !important;
    }
    #portfolio-new .ios-riyadhBanner .txt {
        padding-left: 16px !important;
        padding-top: 20px !important;
    }
    .portfolio20 .app-store-txt {
        color: #000000;
        opacity: 0.6;
    }
    .app-store-txt {
        padding-bottom: 10px;
        margin-top: -10px;
    }
    #portfolio-new .portfolio14 .app-downloads-count {
        color: #FFFD00 !important;
        font-weight: 500 !important;
    }
    #portfolio-new .portfolio14 .txt h2 {
        font-size: 42px;
        line-height: 63px;
    }
    .portfolio23 .bannerBtn {
        bottom: -261%;
    }
    #portfolio-new .portfolio23 .txt h2 {
        color: #232730 !important;
    }
    #portfolio-new .portfolio23 .txt p {
        color: #232730 !important;
        opacity: 0.6 !important;
    }
    #portfolio-new .portfolio23 .downloadtxt {
        color: #000;
    }
    #portfolio-new .ios-riyadhBanner h2 {}
    #portfolio-new .portfolio4 .txt {
        padding-left: 16px !important;
        padding-top: 90px !important;
    }
    #portfolio-new .portfolio24 .txt {
        padding-top: 38px !important;
    }
    .portfolio24 .bannerBtn {
        bottom: -253%;
    }
    #portfolio-new .portfolio24 .txt p {
        margin-bottom: 0.3rem;
    }
    #portfolio-new .portfolio5 .txt {
        padding-left: 16px !important;
        padding-top: 52px !important;
    }
    #portfolio-new .portfolio7 .txt {
        padding-top: 54px !important;
    }
    #portfolio-new .portfolio8 .txt p {
        width: 97% !important;
    }
    #portfolio-new .portfolio9 .txt {
        padding-top: 51px !important;
    }
    #portfolio-new .portfolio11 .txt {
        padding-top: 58px !important;
    }
    #portfolio-new .portfolio22 .txt {
        padding-top: 39px !important;
    }
    .basf blockquote::after {
        bottom: -216px !important;
    }
    #portfolio-new .portfolio32 .txt h2,
    #portfolio-new .portfolio37 .txt h2 {
        font-size: 30px !important;
        line-height: 48px !important;
    }
    #portfolio-new .portfolio32 .txt p {
        width: 95% !important;
    }
    #portfolio-new .portfolio33 .txt p {
        width: 95% !important;
        color: #ffffff;
    }
    #portfolio-new .portfolio32 .txt,
    #portfolio-new .portfolio33 .txt,
    #portfolio-new .portfolio34 .txt {
        padding-top: 36px !important;
    }
    #portfolio-new .portfolio37 .txt p,
    #portfolio-new .portfolio38 .txt p {
        width: 94% !important;
        color: #FFFFFF !important;
        opacity: 0.7 !important;
    }
    #portfolio-new .portfolio39 .txt p {
        width: 89% !important;
    }
    .port-cta.ios-cta .ctabg {
        background-image: url(/images/newportfolio/mobile/cta.webp);
        height: 418px !important;
        padding: 61px 0 0px 0px;
        text-align: center;
    }
    .port-cta {
        padding-top: 72px !important;
    }
    .port-cta h2 {
        text-transform: capitalize;
    }
    .casestudytitle {
        font-size: 36px;
        line-height: 50px;
    }
    .casestudyblock {
        margin-bottom: 25px;
    }
    .port-cta p {
        width: 98%;
        transform: translate(6px, 0px);
    }
    .port-cta p br {}
    .port-cta .ctaBtn {
        transform: none;
        margin-top: 20px;
    }
    .simply {
        transform: none;
        width: 85px;
        height: 87.5px;
        margin-top: 30px;
    }
    .simplysec .idealblock::after {
        bottom: -167px !important;
        left: 348px !important;
    }
    #portfolio-new .portfolio35 .txt p {
        width: 333px !important;
    }
    #portfolio-new .portfolio36 .txt p {
        width: 369px !important;
        color: rgba(255, 255, 255, 0.85) !important;
        opacity: 0.7 !important;
    }
    #portfolio-new .portfolio15 .txt {
        padding-top: 50px !important;
    }
    #portfolio-new .portfolio22 .txt p {
        width: 96% !important;
    }
    .portfolio16 .case-link-black .case-border {
        width: 98px !important;
        left: 14px;
    }
    .portfolio18 .bannerBtn {
        bottom: -253%;
    }
    #portfolio-new .portfolio29 .app-downloads-count {
        color: #FF87A4 !important;
    }
    .portfolio29 .bannerBtn {
        bottom: -108%;
    }
    #portfolio-new .portfolio25 .txt p {
        width: 98% !important;
    }
    #portfolio-new .portfolio30 .txt p {
        color: #131313 !important;
        opacity: 0.7 !important;
    }
    #portfolio-new .portfolio30 .txt h2 {
        color: #131313 !important;
    }
    #portfolio-new .portfolio30 .txt {
        padding-top: 40px !important;
    }
    .portfolio30 .bannerBtn {
        bottom: -281%;
    }
    #portfolio-new .portfolio25 .txt p {
        color: #FFFFFF !important;
        opacity: 0.7 !important;
    }
    #portfolio-new .portfolio25 .downloadtxt,
    #portfolio-new .portfolio28 .downloadtxt,
    #portfolio-new .portfolio30 .downloadtxt {
        color: #000000 !important;
    }
    .portfolio25 .bannerBtn {
        bottom: -206%;
    }
    #portfolio-new .portfolio26 .txt p {
        width: 95% !important;
    }
    #portfolio-new .portfolio26 .txt {
        padding-top: 46px !important;
    }
    #portfolio-new .portfolio27 .txt {
        padding-top: 42px !important;
    }
    .portfolio27 .bannerBtn {
        bottom: -224%;
    }
    .frenzy {
        transform: none;
        width: 206px;
        height: 95.26px;
        margin: 50px 0px;
        margin-bottom: 20px;
    }
    .frenzysec .idealblock::after {
        bottom: -339px !important;
        left: 300px !important;
    }
    .portfolio26 .bannerBtn {
        bottom: -229%;
    }
    .idealprot {
        transform: none;
        width: 261px;
        height: 139px;
    }
    .idealblock {
        transform: none;
    }
    .idealblock::before {
        top: -10px !important;
        left: 4px !important;
    }
    .idealblock::after {
        bottom: -177px !important;
        left: 349px !important;
    }
    #portfolio-new .adslide91 .txt {
        padding-top: 51px !important;
    }
    #portfolio-new .adslide91 .downloadtxt {
        color: #fff !important;
    }
    .adslide91 .bannerBtn {
        bottom: -201%;
    }
    .case-link-black .case-border {
        left: 17px;
    }
    .portfolio16 .case-link-black .case-border {
        width: 98px !important;
    }
    .portfolio8 .bannerBtn {
        bottom: -205%;
    }
    .portfolio9 .bannerBtn {
        bottom: -245%;
    }
    .portfolio11 .bannerBtn {
        bottom: -161%;
    }
    .portfolio15 .bannerBtn {
        bottom: -249%;
    }
    .bungie {
        transform: none;
        width: 226px;
        height: 85px;
        margin: 50px 0px;
    }
    .bungietxt {
        transform: none;
    }
    .bungietxt::after {
        bottom: -265px !important;
    }
    .bungietxt::before {
        top: -22px !important;
    }
    #portfolio-new .case-link,
    #portfolio-new .downloadtxt {
        letter-spacing: 0.5px;
    }
    #portfolio-new .portfolio9 .case-link,
    #portfolio-new .portfolio10 .case-link,
    #portfolio-new .portfolio11 .case-link,
    #portfolio-new . .case-link,
    #portfolio-new .portfolio13 .case-link,
    #portfolio-new .portfolio17 .case-link,
    #portfolio-new .portfolio24 .case-link,
    #portfolio-new .adslide91 .case-link {
        font-size: 16px;
        line-height: 24px;
    }
    #portfolio-new .portfolio9 .case-border,
    #portfolio-new .portfolio10 .case-border,
    #portfolio-new .portfolio11 .case-border,
    #portfolio-new .portfolio12 .case-border,
    #portfolio-new .portfolio13 .case-border,
    #portfolio-new .portfolio17 .case-border,
    #portfolio-new .portfolio24 .case-border,
    #portfolio-new .adslide91 .case-border {
        width: 137px !important;
        bottom: 1px !important;
    }
    #portfolio-new .portfolio13 .case-border {
        left: 16px !important;
    }
    #portfolio-new .portfolio12 .firstb,
    #portfolio-new .portfolio12 .secondb {
        width: 34%;
    }
    #portfolio-new .portfolio12 .app-downloads-count {
        font-weight: 500;
        color: #fff !important;
    }
    #portfolio-new .portfolio12 .app-store-txt {
        font-weight: 400 !important;
        font-size: 12.4859px !important;
        line-height: 20px !important;
        opacity: 0.7;
    }
    #portfolio-new .portfolio12 .txt p {
        width: 98% !important;
    }
    #portfolio-new .portfolio21 .txt h2 {
        font-weight: 600 !important;
        font-size: 32px !important;
        line-height: 40px !important;
    }
    #portfolio-new .portfolio21 .txt {
        padding-top: 43px !important;
    }
    .portfolio21 .bannerBtn {
        bottom: -197%;
    }
    #portfolio-new .portfolio13 .txt {
        padding-top: 55px !important;
    }
    #portfolio-new .portfolio17 .txt {
        padding-top: 26px !important;
    }
    #portfolio-new .portfolio17 .txt p {
        width: 100% !important;
        margin-bottom: 0.3rem;
    }
    #portfolio-new .portfolio19 .txt {
        padding-top: 45px !important;
    }
    .portfolio19 .bannerBtn {
        bottom: -298%;
    }
    #portfolio-new .portfolio23 .txt p {
        width: 95% !important;
    }
    .jeddah {
        transform: none;
        width: 162px;
        height: 150px;
        margin-top: 20px;
    }
    .catapult {
        transform: none;
        width: 220px;
        height: 108px;
        margin: 50px 0px;
        margin-bottom: 20px;
    }
    .catapulte .bungietxt:after {
        bottom: -251px !important;
    }
    .catapulte .bungietxt:before {
        top: -14px !important;
    }
    .portfolio17 .bannerBtn {
        bottom: -237%;
    }
    .portfolio12 .bannerBtn {
        bottom: -136%;
    }
    .public {
        transform: none;
        width: 228px;
        height: 87px;
        margin-bottom: 20px;
    }
    .portfolio13 .bannerBtn {
        bottom: -243%
    }
    .portfolio13 .downloadtxt {}
    .transportation blockquote:after {
        bottom: -222px
    }
    .transport {
        transform: none;
        width: 276px;
        height: 56px;
        margin: 42px 0px;
    }
    .section22 {
        text-align: center;
        padding-top: 0px;
    }
    .maxsold {
        transform: none;
        margin: 36px 0px;
    }
    .maxsoldsec blockquote {
        font-size: 28px;
    }
    .maxsoldsec blockquote:before {
        top: -18px !important;
        left: 12px !important;
    }
    .maxsoldsec blockquote:after {
        bottom: -221px !important;
    }
    .section22 .col-md-8 {
        padding: 5px;
    }
    .section22 .container,
    .section2 .container {}
    .publics blockquote:before {
        top: -16px
    }
    .publics blockquote:after {
        bottom: -429px !important;
        left: 319px !important;
    }
    #cta {
        padding-bottom: 32px;
        padding-top: 12px;
    }
    #cta .ctabg h2 {
        font-weight: 500;
        font-size: 34px !important;
        line-height: 133%;
    }
    #cta .ctabg h2 span {
        font-family: 'CircularStdBold' !important;
    }
    #cta .ctabg a {
        font-weight: 600 !important;
        font-size: 15px !important;
        line-height: 22px !important;
        padding: 14px 13px !important;
    }
    .corey {
        width: 152px;
        height: 155px;
        text-align: center;
        transform: none;
    }
    .coreyimg {
        display: none;
    }
    .txtc .secondtxt {
        font-size: 14px;
        line-height: 21px;
    }
    .corey-byer blockquote {
        font-size: 28px;
    }
    .corey_sec {
        transform: none;
    }
    .corey-byer blockquote:before {
        top: 6px !important;
        left: 8px !important;
    }
    .corey-byer blockquote:after {
        bottom: -252px;
    }
    .txtc .firsttxt {
        font-size: 24px;
        line-height: 36px;
    }
    .portfolio4 .case-border {
        left: 16px;
    }
    .portfolio4 .bannerBtn {
        bottom: -153%;
    }
    .portfolio5 .bannerBtn {
        bottom: -238%;
    }
    .portfolio6 .bannerBtn {
        bottom: -150%;
    }
    .portfolio7 .bannerBtn {
        bottom: -224%;
    }
    .portfolio20 .downloadtxt {
        display: none;
    }
    .portfolio20 .bannerBtn {
        bottom: auto;
    }
    .ecao {
        margin: 50px 0px;
    }
    .portfolio6 .firstb img {
        width: 78.81px;
        height: 45.37px;
        margin-bottom: 5px;
    }
    .portfolio6 .secondb .app-downloads-count {
        color: #fff !important;
    }
    .skills {
        transform: translate(19px, 0px);
    }
    .showdesk {
        display: none;
    }
    .skillsontario blockquote:before {
        top: -11px;
    }
    .skillsontario blockquote:after {
        bottom: -303px;
        left: 329px;
    }
    blockquote:before {
        background: url(/images/newportfolio/quote.svg);
        top: -28px;
        background-repeat: no-repeat;
        width: 100%;
        height: 20%;
        content: "";
        position: absolute;
        left: 27px;
    }
    blockquote:after {
        background: url(/images/newportfolio/mobile/quote.svg);
        bottom: -403px;
        background-repeat: no-repeat;
        width: 100%;
        height: 100%;
        content: "";
        position: absolute;
        left: 329px;
    }
    .ecaosec blockquote:after {
        bottom: -334px;
    }
    .section2 .col-md-8 {
        padding: 5px;
    }
    .section2 .col-md-9 {
        padding: 5px;
    }
    blockquote {
        font-size: 29px;
        line-height: 42px;
        text-align: center;
        padding-top: 36px;
        padding-inline: 1rem;
    }
    blockquote br {
        display: none;
    }
    .section2 {
        text-align: center;
        padding-top: 0px;
    }
    .new-web-section16 {
        padding-bottom: 0px !important;
    }
    .portfolio3 .bannerBtn {
        bottom: -176%;
    }
    .canadian blockquote:after {
        bottom: -398px !important;
    }
    .portfolio28 .bannerBtn {
        bottom: -274%;
    }
    #portfolio-new .portfolio29 .txt p {
        font-size: 14px;
        width: 95% !important;
    }
    .workplace {
        transform: none;
        width: 230px;
        height: 87px;
        margin-bottom: 20px;
    }
    .portfolio10 .app-downloads-count {
        color: #fff !important;
    }
    #portfolio-new .portfolio10 .txt p {
        width: 85% !important;
    }
    #portfolio-new .portfolio11 .txt p {
        width: 89% !important;
    }
    .portfolio10 .bannerBtn {
        bottom: -140%;
    }
    #portfolio-new .col-md-12 {
        padding: 0;
    }
    .downloadtxt {
        font-weight: 600 !important;
        padding-bottom: 2px;
    }
    #portfolio-new .portfolio10 .app-downloads-count {
        font-size: 31.8538px;
        line-height: 48px;
    }
    #portfolio-new .portfolio10 .app-store-txt {
        font-weight: 400;
        font-size: 14.2859px;
        line-height: 23px;
        margin-top: -5px;
        color: #E6E6E6;
        opacity: 0.8;
    }
    .new-web-section16 .ios-riyadhBanner {
        margin-bottom: 15px !important;
    }
    .corey-byer {
        padding-top: 30px;
    }
}

@media only screen and (min-width: 400px) and (max-width: 430px) {
    .portfolio18 .bannerBtn {
        bottom: -360% !important;
    }
    .portfolio5 .bannerBtn {
        bottom: -268%;
    }
    .portfolio6 .bannerBtn {
        bottom: -211%;
    }
    .portfolio8 .bannerBtn {
        bottom: -236%;
    }
    .portfolio17 .bannerBtn {
        bottom: -239%;
    }
    .portfolio5 .bannerBtn {
        bottom: -237%;
    }
    .portfolio4 .bannerBtn {
        bottom: -155%;
        margin-left: -8px;
    }
    .portfolio3 .bannerBtn {
        bottom: -169%;
    }
    .portfolio2 .bannerBtn {
        bottom: -170%;
        right: 38%;
    }
    .portfolio1 .bannerBtn {
        bottom: -127%;
    }
    .bg-half-170 {
        height: 61vh !important;
    }
    .portfolio15 .bannerBtn {
        bottom: -250%;
    }
    .portfolio13 .bannerBtn {
        bottom: -244%;
    }
    .portfolio12 .bannerBtn {
        bottom: -156%;
    }
    .portfolio11 .bannerBtn {
        bottom: -159%;
    }
    .portfolio10 .bannerBtn {
        bottom: -129%;
    }
    .portfolio9 .bannerBtn {
        bottom: -197%;
    }
    .portfolio6 .bannerBtn {
        bottom: -210%;
    }
    #portfolio-new .ios-riyadhBanner {
        width: 100% !important;
        height: 786px !important;
    }
    .portfolio29 .bannerBtn {
        bottom: -99%;
    }
    .portfolio25 .bannerBtn {
        bottom: -236%;
    }
    .portfolio24 .bannerBtn {
        bottom: -251%;
    }
    .portfolio19 .bannerBtn {
        bottom: -307%;
    }
    .adslide91 .bannerBtn {
        bottom: -211%;
    }
    .ecaosec blockquote {
        font-size: 30px;
        line-height: 42px;
        text-align: center;
        padding: 0px 5px;
        padding-top: 36px;
    }
    .portfolio7 .bannerBtn {
        bottom: -226%;
    }
    .portfolio8 .bannerBtn {
        bottom: -204%;
    }
    .corey-byer blockquote {
        padding: 0 5px;
        padding-top: 10px;
    }
    .corey-byer blockquote:after {
        bottom: -250px;
        left: 347px;
    }
    .workplacesec blockquote {
        font-size: 30px !important;
        padding: 0 7px !important;
    }
    .workplacesec blockquote:before {
        top: -43px !important;
    }
    .workplacesec blockquote:after {
        bottom: -349px;
        left: 354px;
    }
    .workplace {
        margin-top: 24px !important;
    }
    .bungietxt::after {
        bottom: -226px !important;
        left: 345px !important;
    }
    .frenzysec .idealblock::after {
        bottom: -269px !important;
        left: 334px !important;
    }
    .publics blockquote:after {
        bottom: -336px !important;
        left: 335px !important;
    }
    .corey-byer blockquote:before {
        top: -18px !important;
        left: 9px !important;
    }
    .ecaosec .blockquotetxt1 blockquote:after {
        bottom: -348px !important;
        left: 341px !important;
    }
    .port-cta h2 {
        margin-top: -81px;
        font-size: 42px !important;
    }
    .port-cta.ios-cta .ctabg {
        padding: 97px 0 0px 0px !important;
    }
    .canadian blockquote:after {
        bottom: -436px !important;
        left: 371px !important;
    }
    .portfolio5 .bannerBtn {
        bottom: -269%;
    }
}

@media only screen and (max-width: 325px) {
    blockquote b:before {
        top: 267px;
        height: 2px;
        right: 44%;
    }
    .portfolio-banner .col-lg-7 {
        margin-top: 0px !important;
    }
    .firstb,
    .secondb {
        width: 50%;
    }
    #portfolio-new .txt p {
        font-size: 13px !important;
        line-height: 20px !important;
        width: 99% !important;
        margin-bottom: 0.3rem;
    }
    #portfolio-new .ios-riyadhBanner {
        height: 595px !important;
        background-repeat: no-repeat;
        background-size: contain !important;
    }
    .portfolio1 .bannerBtn {
        bottom: -103%;
    }
    .portfolio2 .bannerBtn {
        bottom: -129%;
    }
    .portfolio3 .bannerBtn {
        bottom: -169%;
    }
    .portfolio1 .bannerBtn {
        bottom: -97%;
    }
    .portfoliossec #portfolio-new .ios-riyadhBanner {
        height: 593px !important;
    }
    .bg-half-170 {
        height: 85vh !important;
        padding-top: 61px !important;
    }
    .portfolio-banner .banner-heading h1 {
        font-size: 29px !important;
        line-height: 46px !important;
    }
    .portfolio4 .bannerBtn {
        bottom: -132%;
    }
    .portfolio5 .bannerBtn {
        bottom: -199%;
    }
    .portfolio6 .bannerBtn {
        bottom: -134%;
    }
    .portfolio7 .bannerBtn {
        bottom: -227%;
    }
    blockquote {
        font-size: 27px !important;
        line-height: 39px !important;
    }
    blockquote:before {
        top: -4px !important;
        left: 15px !important;
    }
    blockquote:after {
        bottom: -366px !important;
        left: 258px !important;
    }
    .canadian blockquote:after {
        bottom: -398px !important;
    }
    .skillsontario blockquote:after {
        bottom: -241px !important;
    }
    .skillsontario blockquote {
        font-size: 24px !important;
        line-height: 39px !important;
    }
    #portfolio-new .portfolio5 h2 {
        font-size: 28px !important;
        line-height: 40px !important;
    }
    .ecaosec blockquote {
        font-size: 26px !important;
    }
    .ecaosec blockquote:after {
        bottom: -352px !important;
    }
    #portfolio-new .portfolio20 .txt p {
        width: 95% !important;
    }
    .corey-byer blockquote:after {
        bottom: -345px !important;
    }
    .portfolio8 .bannerBtn img {
        width: 89px;
        height: 30px;
    }
    .portfolio8 .bannerBtn {
        bottom: -168%;
    }
    .portfolio9 .bannerBtn {
        bottom: -246%;
    }
    .portfolio10 .bannerBtn {
        bottom: -103%;
    }
    #portfolio-new .portfolio11 .txt p {
        width: 97% !important;
    }
    .portfolio11 .bannerBtn {
        bottom: -204%;
    }
    #cta .ctabg h2 {
        font-size: 32px !important;
    }
    #cta .ctabg a {
        font-weight: 600 !important;
        font-size: 13px !important;
        line-height: 20px !important;
        padding: 14px 14px !important;
    }
    .workplacesec blockquote:after {
        bottom: -400px !important;
    }
    #portfolio-new .portfolio10 .txt p {
        width: 96% !important;
    }
    .new-web-section3 .ios-cta .ctabg {
        padding: 22px 0 0px 14px !important;
    }
    #portfolio-new .portfolio12 .firstb,
    #portfolio-new .portfolio12 .secondb {
        width: 41%;
    }
    #portfolio-new .portfolio12 .txt p {
        font-size: 13px !important;
    }
    .portfolio12 .bannerBtn {
        bottom: -135%;
    }
    .portfolio12 .secondb {
        transform: translate(0px, 0.9px);
        -webkit-transform: translate(0px, 0.9px);
        -moz-transform: translate(0px, 0.9px);
        -ms-transform: translate(0px, 0.9px);
        -o-transform: translate(0px, 0.9px);
    }
    .portfolio10 .firstb {
        transform: translate(0px, -0.1px);
        -webkit-transform: translate(0px, -0.1px);
        -moz-transform: translate(0px, -0.1px);
        -ms-transform: translate(0px, -0.1px);
        -o-transform: translate(0px, -0.1px);
    }
    .portfolio21 .bannerBtn {
        bottom: -197%;
    }
    #portfolio-new .portfolio13 .case-border {
        left: 14px !important;
    }
    .publics blockquote:after {
        bottom: -402px !important;
        left: 254px !important;
    }
    #portfolio-new .portfolio21 .txt h2 {
        font-size: 24px !important;
        line-height: 37px !important;
    }
    .portfolio13 .bannerBtn {
        bottom: -220%;
    }
    .app-downloads-count {
        font-size: 29px !important;
        line-height: 40px !important;
    }
    .firstb img {
        width: 112.81px !important;
        height: 35.37px !important;
        margin-bottom: 5px !important;
    }
    .portfolio1 .firstb img {
        width: 106.81px;
    }
    .app-store-txt {
        padding-bottom: 0px
    }
    #portfolio-new .ios-riyadhBanner .txt {
        padding-left: 12px !important;
        padding-top: 10px !important;
    }
    #portfolio-new .portfolio4 .txt {
        padding-left: 16px !important;
        padding-top: 51px !important;
    }
    #portfolio-new .portfolio10 .app-store-txt {
        line-height: 20px;
    }
    #portfolio-new .portfolio12 .firstb {
        width: 30%;
    }
    #portfolio-new .portfolio12 .txt h2 {
        font-size: 34px !important;
        line-height: 47px !important;
    }
    .transportation blockquote:after {
        bottom: -240px !important;
    }
    .portfolio15 .bannerBtn {
        bottom: -217%;
    }
    .bungietxt::after {
        bottom: -282px !important;
    }
    #portfolio-new .portfolio16 h2 {
        font-size: 30px !important;
        line-height: 36px !important;
    }
    #portfolio-new .portfolio16 .txt p {
        font-size: 12px !important;
    }
    .portfolio16 .case-link-black .case-border {
        left: 13px;
    }
    .maxsoldsec blockquote:after {
        bottom: -241px !important;
    }
    #portfolio-new .portfolio17 h2 {
        font-size: 34px !important;
        line-height: 40px !important;
    }
    #portfolio-new .portfolio17 .txt p {
        line-height: 20px !important;
    }
    .portfolio17 .bannerBtn {
        bottom: -256%;
    }
    .catapulte blockquote {
        font-size: 24px !important;
        line-height: 39px !important;
    }
    .catapulte .bungietxt:after {
        bottom: -208px !important;
    }
    .portfolio18 .bannerBtn {
        bottom: -220%;
    }
    .new-web-section16 .adslide91 .txt {
        top: -4% !important;
    }
    .adslide91 .bannerBtn {
        bottom: -218%;
    }
    #portfolio-new .portfolio19 h2 {
        font-size: 34px !important;
        line-height: 47px !important;
    }
    .portfolio19 .bannerBtn {
        bottom: -345%;
    }
    .portfolio23 .bannerBtn {
        bottom: -210%;
    }
    .idealblock::after {
        bottom: -242px !important;
        left: 251px !important;
    }
    .portfolio24 .bannerBtn {
        bottom: -250%;
    }
    #portfolio-new .portfolio25 h2 {
        font-size: 34px !important;
        line-height: 42px !important;
    }
    .portfolio25 .bannerBtn {
        bottom: -192%;
    }
    .portfolio26 .bannerBtn {
        bottom: -194%;
    }
    .portfolio27 .bannerBtn {
        bottom: -194%;
    }
    .frenzysec blockquote {
        font-size: 22px !important;
        line-height: 37px !important;
    }
    .frenzysec .idealblock::after {
        bottom: -259px !important;
        left: 244px !important;
    }
    .portfolio28 .bannerBtn {
        bottom: -238%;
    }
    #portfolio-new .portfolio29 .txt p {
        width: 100% !important;
    }
    .portfolio29 .bannerBtn {
        bottom: -78%;
    }
    #portfolio-new .portfolio31 h2 {
        font-size: 33px !important;
        line-height: 51px !important;
    }
    #portfolio-new .portfolio31 .txt p {
        width: 96% !important;
    }
    .portfolio31 .case-border {
        left: 14px;
    }
    .basf .frenzyblock {
        font-size: 27px !important;
    }
    .basf blockquote::after {
        bottom: -293px !important;
        left: 227px !important;
    }
    #portfolio-new .portfolio32 .txt h2,
    #portfolio-new .portfolio37 .txt h2 {
        font-size: 24px !important;
        line-height: 48px !important;
    }
    #portfolio-new .portfolio32 .txt p {
        width: 98% !important;
    }
    .simplysec .frenzyblock {
        font-size: 30px !important;
    }
    .simplysec .idealblock::after {
        bottom: -321px !important;
        left: 239px !important;
    }
    #portfolio-new .portfolio35 .txt p {
        width: 90% !important;
    }
    #portfolio-new .portfolio36 .txt p {
        width: 95% !important;
    }
    #portfolio-new .portfolio38 h2 {
        font-size: 32px !important;
        line-height: 52px !important;
    }
    #portfolio-new .portfolio39 .txt p {
        width: 94% !important;
        font-size: 12px !important;
        line-height: 22px !important;
    }
    .port-cta h2 {
        font-size: 32px !important;
        line-height: 129% !important;
    }
    .port-cta p {
        width: 98%;
        transform: translate(4px, 0px);
        font-size: 16px;
        line-height: 25px;
    }
    .port-cta .ctaBtn a {
        font-size: 13px !important;
        line-height: 24px !important;
        padding: 14px 6px !important;
    }
    .casestudytitle {
        font-size: 35px;
        line-height: 50px;
    }
    .publics blockquote {
        font-size: 24px !important;
    }
    .portfolio19 .case-border {
        left: 14px;
    }
    .casestudylink a {
        left: 12%;
    }
    .caseoverlay {
        width: 92%;
        left: 13px;
    }
    .casestudy-slide {
        padding-bottom: 20px !important;
    }
    .port-cta {
        padding: 50px 0 !important;
    }
    .case-border {
        left: 14px;
    }
}

@media only screen and (min-width:1600px) and (max-width:1685px) {
    blockquote b:before {
        content: "";
        background: #ffcd43;
        width: 20px;
        top: 149px;
        height: 3px;
        right: 51%;
        position: absolute;
    }
    .bg-half-170 {
        height: auto;
    }
    .bg-half-170 .col-lg-7 {
        margin-top: -2rem !important;
    }
}

@media only screen and (min-width: 767px) and (max-width: 993px) {
    .portfolio-ad-section #mindset-app {
        background-color: #720000dc;
    }
    .portfolio-ad-section #riyadh-app {
        background-color: #6d6d6dcc;
    }
    .portfolio-ad-section #settlyt-app {
        background-color: #31709c;
    }
    .portfolio-ad-section #frenzy-app {
        background-color: #0a1119;
    }
    .portfolio-ad-section #wsps-app {
        background-color: #ffc72c;
    }
    .portfolio-ad-section #ideal-app {
        background-color: #f9b52cde;
    }
    .portfolio-ad-section #alpha-app {
        background-color: #ebba39;
    }
    .portfolio-ad-section #yello-app {
        background-color: #0d181c;
    }
    .portfolio-ad-section #amy-app {
        background-color: #e5d4ba;
    }
    .portfolio-ad-section #jane-app {
        background-color: #1a1f23;
    }
    .portfolio-ad-section .portfolio-app {
        height: 793px !important;
    }
    .portfolio-banner .banner-heading h1 {
        font-size: 38px !important;
        line-height: 54px !important;
    }
    .portfolio-banner .bannerimg {
        width: 425.52px !important;
        height: 461.18px !important;
        margin-left: -80px !important;
        margin-top: 76px !important;
    }
    .portfolio-banner .banner-heading p br {
        display: none;
    }
    #portfolio-new .txt {
        padding-top: 24px !important;
        padding-left: 15px !important;
    }
    #portfolio-new .txt p {
        font-size: 13px !important;
        line-height: 21px !important;
        width: 100%;
    }
    #portfolio-new h2 {
        font-size: 31px !important;
        line-height: 81% !important;
    }
    .portfoliossec #portfolio-new .ad-portfolio-box {
        height: 374px !important;
    }
    .portfoliossec .portfolio-ad-section .portfolio-app {
        height: 374px !important;
        padding-top: 16px !important;
    }
    .portfolio-app img {
        width: 87% !important;
    }
    .app-downloads-count {
        font-size: 29px !important;
        line-height: 39px !important;
    }
    .app-store-txt {
        font-size: 11px !important;
        line-height: 16px !important;
        padding-bottom: 4px !important;
    }
    .portfolio1 .bannerBtn {
        bottom: -49% !important;
    }
    #portfolio-new .my-border .strips {
        width: 134px !important;
    }
    .case-link {
        font-size: 14px !important;
        line-height: 21px !important;
    }
    #portfolio-new .txt p {
        margin-bottom: 0px;
        text-align: initial;
    }
    .bannerBtn {
        padding-top: 5rem !important;
        padding-right: 6rem;
    }
    .bannerBtn .downloadtxt {
        text-align: left;
    }
    .portfolio13 .bannerBtn {
        padding-top: 8.5rem !important;
        padding-right: 12rem;
    }
    .portfolio15 .bannerBtn {
        padding-top: 9rem !important;
        padding-right: 10.5rem;
    }
    .case-border {
        width: 122px;
        left: 11px;
        /* bottom: -5px; */
        height: 2px
    }
    .case-link {
        float: left;
    }
    .portfolio3 .bannerBtn {
        padding-top: 9rem !important;
        padding-right: 11.3rem;
    }
    .rank {
        padding-left: 36px !important;
        padding-top: 14px !important;
    }
    #portfolio-new .portfolio2 .txt {
        padding-top: 12px !important;
    }
    .rank .ranktxt2 {
        font-size: 10.6459px !important;
    }
    blockquote {
        font-size: 29px !important;
    }
    blockquote br {
        display: none;
    }
    .authority .col-md-2 img {
        transform: translate(-23px, 64px);
    }
    blockquote b:before {
        top: 201px !important;
        height: 2px !important;
        right: 21% !important;
    }
    #portfolio-new .txt p br {
        display: none;
    }
    .downloadtxt {
        font-size: 9.5px !important;
        line-height: 12px !important;
        padding-left: 11px !important;
        padding-bottom: 3px
    }
    .portfolio2 .bannerBtn {
        left: 27px !important;
    }
    .portfolio2 .downloadtxt {
        padding-left: 1px !important;
    }
    .canadian .col-md-2 img {
        transform: translate(-41px, 41px);
    }
    .portfolio4 .bannerBtn {
        bottom: -100%;
        margin-left: -5px;
    }
    .skills {
        transform: translate(-52px, 13px);
    }
    #portfolio-new .portfolio5 h2 {
        font-size: 30px !important;
        line-height: 124% !important;
    }
    .portfolio5 .bannerBtn {
        bottom: -117%;
    }
    #frenzyapp .app-store-txt br {
        display: none;
    }
    .portfolio6 .bannerBtn {
        bottom: -72%;
    }
    .ecao {
        transform: translate(-37px, 39px);
    }
    .ecaosec blockquote {
        font-size: 27px !important;
    }
    .portfolio7 .bannerBtn {
        bottom: -113%;
    }
    #portfolio-new .portfolio20 .txt p {
        width: 281px !important;
    }
    .portfolio20 .bannerBtn {
        bottom: -131%;
    }
    .downloadtxt {
        letter-spacing: 0.2px !important;
    }
    .list-inline-item img {
        width: 73px !important;
        height: 23.52px !important;
    }
    .portfolio8 .bannerBtn {
        bottom: -84%;
    }
    .showdesk {
        display: none;
    }
    .corey-byer blockquote {
        font-size: 25px !important;
        width: 89%;
    }
    .corey {
        width: 204px;
        height: auto;
        transform: translate(-5px, 52px);
        -webkit-transform: translate(-5px, 52px);
        -moz-transform: translate(-5px, 52px);
        -ms-transform: translate(-5px, 52px);
        -o-transform: translate(-5px, 52px);
    }
    .corey_sec {
        transform: translate(91px, 25px);
    }
    .portfolio4 .bannerBtn {
        padding-top: 10rem !important;
        padding-right: 11rem;
    }
    .portfolio5 .bannerBtn {
        padding-top: 6rem !important;
        padding-right: 10.7rem;
    }
    .portfolio9 .bannerBtn {
        bottom: -104%;
    }
    .portfolio9 .bannerBtn {
        padding-top: 10rem !important;
        padding-right: 10.7rem;
    }
    .portfolio7 .bannerBtn {
        padding-top: 12rem !important;
        padding-right: 10.7rem;
    }
    .portfolio6 .bannerBtn {
        padding-top: 8rem !important;
        padding-right: 6.2rem;
    }
    .portfolio20 .bannerBtn {
        padding-top: 10rem !important;
        padding-right: 11.3rem;
    }
    .portfolio8 .bannerBtn {
        padding-top: 9rem !important;
        padding-right: 10.7rem;
    }
    #portfolio-new .portfolio20 .txt p {
        width: 243px !important;
    }
    .workplace {
        transform: translate(-104px, 43px);
        width: 280px;
        -webkit-transform: translate(-104px, 43px);
        -moz-transform: translate(-104px, 43px);
        -ms-transform: translate(-104px, 43px);
        -o-transform: translate(-104px, 43px);
    }
    .portfolio10 .bannerBtn {
        padding-top: 9rem !important;
        padding-right: 6.2rem;
    }
    #portfolio-new .txt h2 {
        text-align: initial;
        font-size: 24px !important;
    }
    .portfolio11 .bannerBtn {
        padding-top: 6rem !important;
        padding-right: 10.7rem;
    }
    .portfolio10 .bannerBtn {
        bottom: -103%;
    }
    .portfolio12 .bannerBtn {
        padding-top: 8.8rem !important;
        padding-right: 6.1rem;
    }
    .portfolio11 .bannerBtn {
        bottom: -130%;
    }
    .portfolio13 .txt p {
        width: 93% !important;
    }
    #cta .ctabg h2 {
        font-size: 24px !important;
        line-height: 110% !important;
        margin-bottom: 15px !important;
    }
    .portfolio-cta .ctabg {
        background-image: url(/images/newportfolio/#) !important;
        height: 116px !important;
        background-color: #1d80ff !important;
        padding: 12px 0 0px 31px !important;
    }
    #cta .ctabg a {
        font-size: 14px !important;
        line-height: 19px !important;
        padding: 9px 19px !important;
    }
    .portfolio12 .bannerBtn {
        bottom: -45%;
    }
    #portfolio-new .portfolio12 h2 {
        font-size: 25px !important;
        line-height: 77% !important;
    }
    #portfolio-new .portfolio12 .txt p {
        font-size: 12px !important;
        line-height: 20px !important;
        width: 100% !important;
    }
    .public {
        transform: translate(-95px, 95px);
        width: 256px;
    }
    .publics blockquote {
        font-size: 27px !important;
    }
    #portfolio-new .portfolio21 h2 {
        line-height: 120% !important;
        font-size: 26px !important;
    }
    #portfolio-new .portfolio21 .txt {
        padding-top: 25px !important;
    }
    .portfolio13 .case-border {
        width: 122px !important;
        left: 15px !important;
    }
    .portfolio13 .bannerBtn {
        bottom: -84%;
    }
    .transport {
        transform: translate(-89px, 69px);
        width: 300px;
    }
    #portfolio-new .portfolio22 .txt p {
        font-size: 12px !important;
        line-height: 18px !important;
    }
    .portfolio15 .bannerBtn {
        bottom: -133%;
    }
    .bungie {
        transform: translate(-89px, 38px);
        width: 276px;
        -webkit-transform: translate(-89px, 38px);
        -moz-transform: translate(-89px, 38px);
        -ms-transform: translate(-89px, 38px);
        -o-transform: translate(-89px, 38px);
    }
    .case-link-black {
        float: left;
    }
    .case-link-black .case-border {
        bottom: initial;
    }
    .portfolio17 .bannerBtn {
        padding-top: 11.5rem !important;
        padding-right: 10.5rem;
    }
    .portfolio18 .bannerBtn {
        padding-top: 10rem !important;
        padding-right: 16rem;
    }
    .adslide91 .bannerBtn {
        padding-top: 7.5rem !important;
        padding-right: 16.2rem;
    }
    .portfolio16 .case-link-black .case-border {
        width: 109px;
        left: 14px;
    }
    .portfolio19 .bannerBtn {
        padding-top: 12rem !important;
        padding-right: 16rem;
    }
    .portfolio24 .bannerBtn {
        padding-top: 11.5rem !important;
        padding-right: 15.8rem;
    }
    .corey-byer {
        padding-top: 10px;
    }
    .portfolio21 .bannerBtn {
        bottom: -88%;
    }
    #portfolio-new .portfolio16 .txt p {
        width: 90% !important;
    }
    .maxsold {
        transform: translate(-101px, 55px);
    }
    .maxsoldsec blockquote {
        transform: translate(28px, 0px);
    }
    #portfolio-new .portfolio17 .txt p {
        width: 342px !important;
        font-size: 11px !important;
    }
    .portfolio17 .bannerBtn {
        bottom: -62%;
    }
    .bungietxt {
        transform: none;
    }
    .catapult {
        transform: translate(-72px, 55px);
        width: 226px;
    }
    .portfolio18 .bannerBtn {
        bottom: -106%;
    }
    #portfolio-new .adslide91 .txt {
        padding-top: 36px !important;
    }
    #portfolio-new .adslide91 .txt p {
        width: 87% !important;
    }
    .adslide91 .case-link-black .case-border {
        position: absolute;
        width: 126px;
        left: 19px
    }
    .adslide91 .bannerBtn {
        bottom: -33%;
    }
    .jeddah {
        transform: translate(-72px, 33px);
        width: 170px;
    }
    .portfolio19 .bannerBtn {
        bottom: -111%;
    }
    #portfolio-new .portfolio23 .txt p {
        width: 95% !important;
    }
    #portfolio-new .portfolio23 .case-border {
        left: 15px !important;
    }
    .portfolio23 .bannerBtn {
        bottom: -62%;
    }
    .portfolio24 .bannerBtn {
        bottom: -100%;
    }
    .idealprot {
        transform: translate(-95px, -25px);
        width: 288px;
        -webkit-transform: translate(-95px, -25px);
        -moz-transform: translate(-95px, -25px);
        -ms-transform: translate(-95px, -25px);
        -o-transform: translate(-95px, -25px);
    }
    .portfolio11 .bannerBtn {
        padding-top: 8.5rem !important;
        padding-right: 10.7rem;
    }
    #portfolio-new .portfolio25 .txt p {
        width: 93% !important;
    }
    .portfolio25 .bannerBtn {
        bottom: -55%;
    }
    .portfolio26 .bannerBtn {
        bottom: -92%;
    }
    .portfolio27 .bannerBtn {
        bottom: -90%;
    }
    .frenzy {
        transform: translate(-60px, 82px);
        width: 238px;
    }
    .portfolio28 .bannerBtn {
        bottom: -90%;
    }
    #portfolio-new .portfolio29 .txt p {
        width: 252px !important;
    }
    .portfolio25 .bannerBtn {
        padding-top: 9.5rem !important;
        padding-right: 16rem;
    }
    .portfolio29 .bannerBtn {
        padding-top: 3rem !important;
        padding-right: 11.3rem;
    }
    .portfolio33 .case-link-white .case-border {
        bottom: unset !important;
    }
    .case-link-white .case-border {
        bottom: unset !important;
    }
    .ad-portfolio-box .col-md-3 {
        padding: 0px;
    }
    .portfolio29 .bannerBtn {
        bottom: -42%;
    }
    .portfolio30 .bannerBtn {
        bottom: -117%;
    }
    #portfolio-new .portfolio32 .txt p {
        width: 100% !important;
    }
    #portfolio-new .portfolio27 h2,
    #portfolio-new .portfolio32 h2,
    #portfolio-new .portfolio37 h2 {
        font-size: 23px !important;
    }
    #portfolio-new .portfolio32 .txt {
        padding-top: 29px !important;
    }
    #portfolio-new .portfolio33 .txt p {
        width: 318px !important;
    }
    #portfolio-new .portfolio34 .txt {
        padding-top: 57px !important;
    }
    #portfolio-new .portfolio36 .txt {
        padding-top: 118px !important;
    }
    #portfolio-new .portfolio36 .txt p {
        width: 283px !important;
    }
    #portfolio-new .portfolio37 .txt p {
        width: 335px !important;
    }
    #portfolio-new .portfolio38 .txt p {
        width: 286px !important;
    }
    #portfolio-new .portfolio38 .txt {
        padding-top: 95px !important;
    }
    #portfolio-new .portfolio38 h2 {
        font-size: 28px !important;
    }
    #portfolio-new .portfolio39 .txt p {
        width: 359px !important;
    }
    .port-cta.ios-cta .ctabg {
        padding: 25px 0 0px 22px !important;
    }
    .port-cta h2 {
        font-size: 35px;
        line-height: 110%;
    }
    .port-cta p br {
        display: none;
    }
    .port-cta .col-md-8 {
        flex: 0 0 56.666667%;
        max-width: 56.666667%;
        color: #444;    }
    .port-cta .col-md-4 {
        flex: 0 0 43.333333%;
        max-width: 43.333333%;
    }
    .port-cta .ctaBtn {
        transform: translate(-10px, 70px);
    }
    .port-cta .ctaBtn a {
        font-size: 12px;
    }
}

@media only screen and (min-width: 420px) and (max-width: 424px) {
    .canadian blockquote:after {
        bottom: -343px !important;
        left: 353px !important;
    }
    .portfolio5 .bannerBtn {
        bottom: -268%;
    }
}

@media only screen and (min-width: 790px) and (max-width: 850px) {
    .bg-half-170 {
        height: 54vh !important;
    }
    #portfolio-new .bannerBtn {
        transform: translate(12px);
    }
    .downloadtxt {
        padding-left: 2px !important;
    }
}

@-moz-document url-prefix() {
    @media (max-width: 767px) {
        .bg-half-170 {
            height: 85vh !important;
            padding-top: 0px !important;
            padding-bottom: 33px;
        }
    }
    .new-web-section16 .container {
        overflow: unset;
    }
    html:not(.no-js) [data-aos^="fade"][data-aos^="fade"].aos-animate {
        opacity: 1;
        -webkit-transform: none !important;
        transform: none;
    }
    html:not(.no-js) [data-aos^="zoom"][data-aos^="zoom"].aos-animate {
        opacity: 1;
        -webkit-transform: none !important;
        transform: none;
    }
    @media only screen and (min-width: 330px) and (max-width: 360px) {
        #portfolio-new #publicser .txt h2 {
            font-weight: 600 !important;
            font-size: 27px !important;
            line-height: 40px !important;
        }
    }
    @media only screen and (min-width: 330px) and (max-width: 360px) {
        #portfolio-new #ontario h2 {
            font-size: 31px !important;
            line-height: 44px !important;
        }
        .maxsoldsec blockquote {
            font-size: 25px !important;
        }
        .catapulte blockquote {
            font-size: 26px !important;
        }
    }
    @media only screen and (min-width: 416px) and (max-width: 428px) {
        .workplacesec blockquote::after {
            bottom: -288px !important;
            left: 342px;
        }
    }
    @media only screen and (max-width: 767px) {
        .corey-byer blockquote {
            font-size: 27px !important;
        }
        .portfolio13 .bannerBtn {
            bottom: -184% !important;
        }
        blockquote {
            font-size: 30px !important;
        }
        #portfolio-new .portfolio13 .bannerBtn {
            bottom: -245% !important;
        }
        .workplacesec blockquote {
            font-size: 28px !important;
            padding: 0 7px !important;
        }
    }
    @media only screen and (min-width: 330px) and (max-width: 360px) {
        .workplacesec blockquote {
            font-size: 27px;
        }
    }
    @media (min-width: 1199px) and (max-width: 1399px) {
        .portfolio-ad-section #mindset-app {
            background-color: #720000dc;
        }
        .portfolio-ad-section #riyadh-app {
            background-color: #6d6d6dcc;
        }
        .portfolio-ad-section #settlyt-app {
            background-color: #31709c;
        }
        .portfolio-ad-section #frenzy-app {
            background-color: #0a1119;
        }
        .portfolio-ad-section #wsps-app {
            background-color: #ffc72c;
        }
        .portfolio-ad-section #ideal-app {
            background-color: #f9b52cde;
        }
        .portfolio-ad-section #alpha-app {
            background-color: #ebba39;
        }
        .portfolio-ad-section #yello-app {
            background-color: #0d181c;
        }
        .portfolio-ad-section #amy-app {
            background-color: #e5d4ba;
        }
        .portfolio-ad-section #jane-app {
            background-color: #1a1f23;
        }
        .portfolio-banner .banner-heading h1 {
            font-size: 47px;
        }
        .portfolio13 .bannerBtn {
            bottom: -105%;
        }
        blockquote {
            font-size: 33px;
        }
        blockquote b::before {
            height: 2px;
        }
    }
    .new-web-section16 .ios-riyadhBanner h2 {
        font-size: 42px !important;
    }
    #portfolio-new .portfolio23 .case-border {
        width: 109px !important;
    }
    .portfolio31 .case-border {
        width: 106px !important;
    }
    .frenzyblock {
        font-size: 33px !important;
    }
    .case-link-white .case-border {
        width: 105px !important;
        bottom: 1px !important;
    }
    .port-cta .ctaBtn a {
        font-size: 15px !important;
    }
}

@supports (-ms-ime-align:auto) {
    [data-aos][data-aos][data-aos-duration="1200"],
    body[data-aos-duration="1200"] [data-aos] {
        transition-duration: 0.8s !important;
    }
}

@media only screen and (min-width: 428px) and (max-width: 432px) {
    .canadian blockquote::after {
        bottom: -421px !important;
    }
}

@media screen and (-ms-high-contrast: active),
(-ms-high-contrast: none) {
    [data-aos][data-aos][data-aos-duration="1200"],
    body[data-aos-duration="1200"] [data-aos] {
        transition-duration: 0.8s !important;
    }
}

@media only screen and (min-width: 400px) and (max-width: 415px) {
    .portfolio6 .bannerBtn {
        bottom: -186%;
    }
    .portfolio17 .bannerBtn {
        bottom: -161%;
    }
    .portfolio18 .bannerBtn {
        bottom: -306% !important;
    }
}

@media only screen and (min-width: 416px) and (max-width: 428px) {
    .ecaosec blockquote:after {
        bottom: -313px !important;
        left: 341px !important;
    }
    .workplacesec blockquote:after {
        bottom: -255px;
        left: 342px;
    }
    .bungietxt::after {
        bottom: -262px !important;
        left: 345px !important;
    }
    .jeddahsec .bungietxt::after {
        bottom: -296px !important;
        left: 345px !important;
    }
}

@media only screen and (min-width: 330px) and (max-width: 360px) {
    .portfolio-banner .banner-heading h1 {
        font-weight: 700;
        font-size: 35px !important;
        line-height: 60px !important;
        text-align: center;
        margin-top: -29px;
    }
    .portfolio3 .bannerBtn {
        bottom: -180%;
    }
    .portfolio5 .bannerBtn {
        bottom: -171%;
    }
    .workplacesec blockquote:after {
        left: 296px;
    }
    #portfolio-new .portfolio10 .txt p {
        width: 95% !important;
    }
    #portfolio-new .portfolio12 .firstb,
    #portfolio-new .portfolio12 .secondb {
        width: 37%;
    }
    .portfolio12 .bannerBtn {
        bottom: -136%;
    }
    .portfolio13 .bannerBtn {
        bottom: -205%;
    }
    .transportation blockquote:after {
        bottom: -226px;
        left: 306px;
    }
    .portfolio17 .bannerBtn {
        bottom: -239%;
    }
    .portfolio18 .bannerBtn {
        bottom: -259%;
    }
    .adslide91 .bannerBtn {
        bottom: -211%;
    }
    .portfolio25 .bannerBtn {
        bottom: -207%;
    }
    .portfolio29 .bannerBtn {
        bottom: -105%;
    }
    .simplysec .idealblock::after {
        bottom: -335px !important;
        left: 291px !important;
    }
    .portfolio1 .bannerBtn {
        bottom: -120%;
    }
    .portfolio2 .bannerBtn {
        bottom: -147%;
    }
    blockquote {
        font-size: 28px;
        line-height: 42px;
        text-align: center;
        padding-top: 36px;
    }
}

@media only screen and (min-width: 365px) and (max-width: 375px) {
    .portfolio-banner .banner-heading h1 {
        font-weight: 700;
        font-size: 35px !important;
        line-height: 60px !important;
        text-align: center;
        margin-top: -29px;
    }
    blockquote:after {
        bottom: -383px;
        left: 313px;
    }
    .portfolio3 .bannerBtn {
        bottom: -177%;
    }
    .portfolio4 .bannerBtn {
        bottom: -133%;
    }
    .skillsontario blockquote {
        font-size: 29px;
    }
    .portfolio9 .bannerBtn {
        bottom: -207%;
    }
    #portfolio-new .portfolio5 h2 {
        font-size: 34px !important;
        line-height: 44px !important;
    }
    .portfolio5 .bannerBtn {
        bottom: -170%;
    }
    .portfolio6 .bannerBtn {
        bottom: -157%;
    }
    .portfolio7 .bannerBtn {
        bottom: -195%;
    }
    .ecaosec blockquote:after {
        bottom: -378px !important;
        left: 313px !important;
    }
    .corey-byer blockquote:after {
        left: 317px;
        bottom: -323px;
    }
    .workplacesec blockquote:after {
        bottom: -385px;
        left: 308px;
    }
    .workplacesec blockquote:before {
        top: -14px;
        left: 11px;
    }
    .portfolio10 .bannerBtn {
        bottom: -103%;
    }
    .portfolio12 .bannerBtn {
        bottom: -133%;
    }
    .portfolio13 .bannerBtn {
        bottom: -204%;
    }
    .portfolio15 .bannerBtn {
        bottom: -209%;
    }
    #portfolio-new .portfolio21 .txt h2 {
        font-weight: 600 !important;
        font-size: 30px !important;
        line-height: 40px !important;
    }
    .bungietxt::after {
        bottom: -266px !important;
        left: 326px !important;
    }
    .maxsoldsec blockquote {
        font-size: 27px;
    }
    .portfolio17 .bannerBtn {
        bottom: -236%;
    }
    .catapulte blockquote {
        font-size: 29px;
    }
    .portfolio18 .bannerBtn {
        bottom: -256% !important;
    }
    .adslide91 .bannerBtn {
        bottom: -209%;
    }
    .jeddahsec .bungietxt::after {
        bottom: -247px !important;
        left: 322px !important;
    }
    .portfolio25 .bannerBtn {
        bottom: -203%;
    }
    .portfolio29 .bannerBtn {
        bottom: -97%;
    }
    .simplysec .idealblock::after {
        bottom: -342px !important;
        left: 296px !important;
    }
}

@media only screen and (min-width: 330px) and (max-width: 360px) {
    .authority blockquote:after {
        bottom: -338px;
        left: 299px;
    }
    blockquote:before {
        top: -13px;
        left: 18px;
    }
    .canadian blockquote:after {
        bottom: -389px !important;
        left: 300px;
    }
    .portfolio4 .bannerBtn {
        bottom: -135%;
    }
    .skillsontario blockquote {
        font-size: 28px;
    }
    .skillsontario blockquote:after {
        bottom: -226px;
        left: 306px;
    }
    #portfolio-new .portfolio5 h2 {
        font-size: 33px !important;
        line-height: 44px !important;
    }
    .ecaosec blockquote:after {
        bottom: -357px !important;
        left: 313px !important;
    }
    .portfolio7 .bannerBtn {
        bottom: -194%;
    }
    #portfolio-new .portfolio20 .txt p {
        width: 359px !important;
    }
    .corey-byer blockquote:after {
        left: 304px;
        bottom: -323px;
    }
    .portfolio9 .bannerBtn {
        bottom: -213%;
    }
    .portfolio10 .bannerBtn {
        bottom: -106%;
    }
    .portfolio11 .bannerBtn {
        bottom: -142%;
    }
    .publics blockquote:after {
        bottom: -429px !important;
        left: 286px !important;
    }
    #portfolio-new .portfolio21 .txt h2 {
        font-weight: 600 !important;
        font-size: 28px !important;
        line-height: 40px !important;
    }
    #portfolio-new .portfolio13 .txt p {
        width: 98% !important;
    }
    .portfolio15 .bannerBtn {
        bottom: -212%;
    }
    .bungietxt::after {
        bottom: -266px !important;
        left: 297px !important;
    }
    #portfolio-new .portfolio16 .txt h2 {
        font-size: 33px !important;
    }
    .maxsoldsec blockquote {
        font-size: 26px;
    }
    .maxsoldsec blockquote:after {
        bottom: -221px !important;
        left: 280px;
    }
    #portfolio-new .portfolio17 .txt p {
        width: 99% !important;
        margin-bottom: 0.3rem;
    }
    .catapulte blockquote {
        font-size: 28px;
    }
    .jeddahsec .bungietxt::after {
        bottom: -264px !important;
        left: 303px !important;
    }
    #portfolio-new .portfolio19 .txt p {
        width: 97% !important;
    }
    .idealblock::after {
        bottom: -258px !important;
        left: 289px !important;
    }
    .frenzysec .idealblock::after {
        bottom: -339px !important;
        left: 284px !important;
    }
    .basf .frenzyblock {
        font-size: 32px !important;
    }
    #portfolio-new .portfolio32 .txt h2,
    #portfolio-new .portfolio37 .txt h2 {
        font-size: 27px !important;
        line-height: 48px !important;
    }
    .portfolio6 .firstb,
    .secondb {
        width: 45%;
    }
}

.portfolio-ad-section .portfolio-app {
    height: 80vh !important;
}

#portfolio-new .ios-riyadhBanner {
    height: 80vh !important;
    background-size: cover;
    background-repeat: no-repeat;
}

@media (min-width: 1600px) and (max-width: 1690px) {
    .portfolio-ad-section #mindset-app {
        background-color: #720000dc;
    }
    .portfolio-ad-section #riyadh-app {
        background-color: #6d6d6dcc;
    }
    .portfolio-ad-section #settlyt-app {
        background-color: #31709c;
    }
    .portfolio-ad-section #frenzy-app {
        background-color: #0a1119;
    }
    .portfolio-ad-section #wsps-app {
        background-color: #ffc72c;
    }
    .portfolio-ad-section #ideal-app {
        background-color: #f9b52cde;
    }
    .portfolio-ad-section #alpha-app {
        background-color: #ebba39;
    }
    .portfolio-ad-section #yello-app {
        background-color: #0d181c;
    }
    .portfolio-ad-section #amy-app {
        background-color: #e5d4ba;
    }
    .portfolio-ad-section #jane-app {
        background-color: #1a1f23;
    }
    .portfolio1 .bannerBtn {
        padding-top: 62%;
    }
    .portfolio10 .bannerBtn {
        padding-top: 68%;
    }
    .portfolio4 .bannerBtn {
        margin-left: -13px;
        padding-top: 52%;
    }
    .portfolio3 .bannerBtn {
        padding-top: 70%;
    }
    .portfolio2 .bannerBtn {
        padding-top: 53%;
    }
    .portfolio6 .bannerBtn {
        padding-top: 67%;
    }
    .portfolio5 .bannerBtn {
        padding-top: 42%;
    }
    .portfolio7 .bannerBtn {
        padding-top: 49%;
    }
    .portfolio8 .bannerBtn {
        padding-top: 48%;
    }
    .portfolio9 .bannerBtn {
        padding-top: 54%;
    }
    .portfolio11 .bannerBtn {
        padding-top: 48%;
    }
    .portfolio12 .bannerBtn {
        padding-top: 56%;
    }
    .portfolio13 .bannerBtn {
        padding-top: 63%;
    }
    .portfolio14 .bannerBtn {
        padding-top: 53%;
    }
    .portfolio15 .bannerBtn {
        padding-top: 52%;
    }
    .portfolio17 .bannerBtn {
        padding-top: 49%;
    }
    .adslide91 .bannerBtn {
        padding-top: 44%;
    }
    .portfolio19 .bannerBtn {
        padding-top: 45%;
    }
    .portfolio18 .bannerBtn {
        padding-top: 54%;
    }
    .portfolio20 .bannerBtn {
        padding-top: 69%;
    }
    .portfolio21 .bannerBtn {}
    .portfolio22 .bannerBtn {}
    .portfolio23 .bannerBtn {}
    .portfolio24 .bannerBtn {
        padding-top: 46%;
    }
    .portfolio25 .bannerBtn {
        padding-top: 41%;
    }
    .portfolio26 .bannerBtn {}
    .portfolio27 .bannerBtn {}
    .portfolio28 .bannerBtn {}
    .portfolio29 .bannerBtn {
        padding-top: 46%;
    }
    .portfolio30 .bannerBtn {}
}

@media (min-width: 1200px) and (max-width: 1285px) {
    .portfolio-ad-section #mindset-app {
        background-color: #720000dc;
    }
    .portfolio-ad-section #riyadh-app {
        background-color: #6d6d6dcc;
    }
    .portfolio-ad-section #settlyt-app {
        background-color: #31709c;
    }
    .portfolio-ad-section #frenzy-app {
        background-color: #0a1119;
    }
    .portfolio-ad-section #wsps-app {
        background-color: #ffc72c;
    }
    .portfolio-ad-section #ideal-app {
        background-color: #f9b52cde;
    }
    .portfolio-ad-section #alpha-app {
        background-color: #ebba39;
    }
    .portfolio-ad-section #yello-app {
        background-color: #0d181c;
    }
    .portfolio-ad-section #amy-app {
        background-color: #e5d4ba;
    }
    .portfolio-ad-section #jane-app {
        background-color: #1a1f23;
    }
    .portfolio5 .bannerBtn {
        padding-top: 39%;
    }
    .portfolio6 .bannerBtn {
        padding-top: 55%;
    }
    .portfolio3 .bannerBtn {
        padding-top: 70%;
    }
    .portfolio1 .bannerBtn {
        padding-top: 54%;
    }
    .portfolio2 .bannerBtn {
        padding-top: 42%;
    }
    .portfolio7 .bannerBtn {
        padding-top: 46%;
    }
    .portfolio8 .bannerBtn {
        padding-top: 37%;
    }
    .portfolio9 .bannerBtn {
        padding-top: 46%;
    }
    .portfolio10 .bannerBtn {
        padding-top: 57%;
    }
    .portfolio11 .bannerBtn {
        padding-top: 43%;
    }
    .portfolio12 .bannerBtn {
        padding-top: 44%;
    }
    .portfolio13 .bannerBtn {
        padding-top: 58%;
    }
    .portfolio14 .bannerBtn {
        bottom: -97%;
    }
    .portfolio15 .bannerBtn {
        padding-top: 45%;
    }
    .portfolio17 .bannerBtn {
        padding-top: 30%;
    }
    .adslide91 .bannerBtn {
        padding-top: 29%;
    }
    .portfolio18 .bannerBtn {
        padding-top: 46%;
    }
    .portfolio19 .bannerBtn {
        padding-top: 42%;
    }
    .portfolio20 .bannerBtn {
        padding-top: 65%;
    }
    .portfolio21 .bannerBtn {
        bottom: -118%;
    }
    .portfolio22 .bannerBtn {
        bottom: -134%;
    }
    .portfolio23 .bannerBtn {
        bottom: -114%;
    }
    .portfolio24 .bannerBtn {
        padding-top: 41%;
    }
    .portfolio25 .bannerBtn {
        padding-top: 33%;
    }
    .portfolio26 .bannerBtn {
        bottom: -137%;
    }
    .portfolio27 .bannerBtn {
        bottom: -98%;
    }
    .portfolio28 .bannerBtn {
        bottom: -71%;
    }
    .portfolio29 .bannerBtn {
        padding-top: 47%;
    }
    .portfolio30 .bannerBtn {
        bottom: -135%;
    }
    .portfolio4 .bannerBtn {
        padding-top: 45%;
    }
    .portfolio33 .case-link-white .case-border {
        width: 93px !important;
    }
}

/* replica */

.case-link {
    cursor: pointer;
}

.portfolio16 a,
.portfolio31 a,
.portfolio33 a,
.portfolio34 a {
    pointer-events: none;
}

@media only screen and (min-width: 400px) and (max-width: 430px) {
    .portfolio5 .bannerBtn {
        bottom: -199%;
    }
    .portfolio6 .bannerBtn {
        bottom: -181%;
    }
    .portfolio20 .bannerBtn {
        padding-top: 0%;
    }
    .portfolio18 .bannerBtn {
        bottom: -260% !important;
    }
}

body {
    overflow-x: hidden;
}

.banner-heading p {
    padding-left: 0 !important;
    width: auto !important;
}

@media (max-width: 767px) {
    .app-downloads-count {
        font-size: 32.4656px !important;
        line-height: 49px !important;
        color: #FF9F0A !important;
        font-weight: 600 !important;
    }
    .portfolio20 .bannerBtn {
        padding-top: 0% !important;
    }
}

@media only screen and (min-width: 380px) and (max-width: 399px) {
    .portfolio5 .bannerBtn {
        bottom: -171%;
    }
    .portfolio10 .bannerBtn {
        bottom: -104%;
    }
}

h1,
h2,
h3,
h4,
h5 {
    font-family: CircularStdBold !important;
}

p,
a {
    font-family: CircularStdMedium !important;
}

/* Normal Css */

.portfolio1 .txt {
    padding-top: 100px;
    position: unset;
}

.portfolio6 .txt {
    padding-top: 110px;
}

#wsps-app .app-store-txt {
    padding-bottom: 2px;
}

/* Breakpoints */

@media only screen and (min-width: 1400px) and (max-width: 1450px) {
    .container {
        max-width: 1356px;
    }
}

@media only screen and (min-width: 1440px) {
    .portfolio-ad-section #mindset-app {
        background-color: #720000dc;
    }
    .portfolio-ad-section #riyadh-app {
        background-color: #6d6d6dcc;
    }
    .portfolio-ad-section #settlyt-app {
        background-color: #31709c;
    }
    .portfolio-ad-section #frenzy-app {
        background-color: #0a1119;
    }
    .portfolio-ad-section #amy-app {
        background-color: #e5d4ba;
    }
    .portfolio-ad-section #wsps-app {
        background-color: #ffc72c;
    }
    .portfolio-ad-section #ideal-app {
        background-color: #f9b52cde;
    }
    .portfolio-ad-section #alpha-app {
        background-color: #ebba39;
    }
    .portfolio-ad-section #yello-app {
        background-color: #0d181c;
    }
    .portfolio-ad-section #jane-app {
        background-color: #1a1f23;
    }
    .portfolio1 .bannerBtn {
        padding-top: 39%;
    }
    .portfolio2 .bannerBtn {
        padding-top: 29%;
    }
    .new-web-section16 .ios-riyadhBanner .txt p {
        width: 430px;
    }
    .portfolio3 .bannerBtn {
        padding-top: 50%;
    }
    blockquote {
        line-height: 45px;
        width: 80%;
    }
    .section2 {
        padding: 26px 0px 51px 5px;
        margin-left: 8rem;
    }
    .portfolio4 .bannerBtn {
        padding-top: 31%;
    }
    .portfolio5 .bannerBtn {
        padding-top: 28%;
    }
    .portfolio6 .txt {
        padding-top: 119px !important;
    }
    .portfolio6 .bannerBtn {
        padding-top: 37%;
    }
    .ecao {
        margin-top: 50px;
    }
    .portfolio7 .bannerBtn {
        padding-top: 35%;
    }
    .portfolio20 .txt {
        padding-top: 105px !important;
    }
    .portfolio20 .bannerBtn {
        padding-top: 41%;
    }
    .portfolio8 .txt {
        padding-top: 141px !important;
    }
    .portfolio8 .bannerBtn {
        padding-top: 23%;
    }
    .corey_sec {
        width: 62%;
    }
    .portfolio9 .txt {
        padding-top: 121px !important;
    }
    .portfolio9 .bannerBtn {
        padding-top: 29%;
    }
    .portfolio10 .txt {
        padding-top: 99px !important;
    }
    .portfolio10 .bannerBtn {
        padding-top: 37%;
    }
    .portfolio11 .txt {
        padding-top: 113px !important;
    }
    .portfolio11 .bannerBtn {
        padding-top: 27%;
    }
    .portfolio12 .txt {
        padding-top: 122px !important;
    }
    .portfolio12 .bannerBtn {
        padding-top: 32%;
    }
    .public {
        transform: translate(-95px, 44px);
        -webkit-transform: translate(-95px, 44px);
        -moz-transform: translate(-95px, 44px);
        -ms-transform: translate(-95px, 44px);
        -o-transform: translate(-95px, 44px);
    }
    .section22 {
        margin-left: 12rem;
    }
    .portfolio13 .txt {
        padding-top: 156px !important;
    }
    .portfolio13 .bannerBtn {
        padding-top: 26%;
    }
    .transport {
        transform: translate(-91px, 33px);
        -webkit-transform: translate(-91px, 33px);
        -moz-transform: translate(-91px, 33px);
        -ms-transform: translate(-91px, 33px);
        -o-transform: translate(-91px, 33px);
    }
    .portfolio15 .bannerBtn {
        padding-top: 35%;
    }
    .portfolio16 .txt {
        padding-top: 121px !important;
    }
    .workplace {
        transform: translate(-61px, 27px);
        -webkit-transform: translate(-61px, 27px);
        -moz-transform: translate(-61px, 27px);
        -ms-transform: translate(-61px, 27px);
        -o-transform: translate(-61px, 27px);
    }
    .maxsold {
        transform: translate(-95px, 39px);
        -webkit-transform: translate(-95px, 39px);
        -moz-transform: translate(-95px, 39px);
        -ms-transform: translate(-95px, 39px);
        -o-transform: translate(-95px, 39px);
    }
    .portfolio17 .bannerBtn {
        padding-top: 35%;
    }
    .catapult {
        transform: translate(-72px, 22px);
        -webkit-transform: translate(-72px, 22px);
        -moz-transform: translate(-72px, 22px);
        -ms-transform: translate(-72px, 22px);
        -o-transform: translate(-72px, 22px);
    }
    .portfolio18 .txt {
        padding-top: 130px !important;
    }
    .portfolio18 .bannerBtn {
        padding-top: 28%;
    }
    .adslide91 .txt {
        padding-top: 145px !important;
    }
    .adslide91 .bannerBtn {
        padding-top: 26%;
    }
    #portfolio-new .portfolio19 .txt {
        padding-top: 184px;
    }
    .portfolio19 .bannerBtn {
        padding-top: 27%;
    }
    #portfolio-new .portfolio23 .txt {
        padding-top: 80px !important;
    }
    .portfolio24 .bannerBtn {
        padding-top: 31%;
    }
    .ideal-quote blockquote {
        width: 97%;
    }
    .ideal-quote {
        margin-left: 6rem;
    }
    #portfolio-new .portfolio25 .txt {
        padding-top: 129px;
    }
    .portfolio25 .bannerBtn {
        padding-top: 20%;
    }
    .frenzysec blockquote {
        width: 100%;
    }
    .frenzy {
        transform: translate(-42px, 42px);
        -moz-transform: translate(-42px, 42px);
        -ms-transform: translate(-42px, 42px);
        -o-transform: translate(-42px, 42px);
        -webkit-transform: translate(-42px, 42px);
    }
    .frenzysec {
        margin-left: 0rem;
    }
    #portfolio-new .portfolio28 .txt {
        padding-top: 130px;
    }
    .portfolio29 .bannerBtn {
        padding-top: 25%;
    }
    .frenzy {
        transform: translate(-42px, 27px);
        -webkit-transform: translate(-42px, 27px);
        -moz-transform: translate(-42px, 27px);
        -ms-transform: translate(-42px, 27px);
        -o-transform: translate(-42px, 27px);
    }
    .simply {
        transform: translate(44px, -22px);
    }
    .simplysec {
        margin-left: 0rem;
    }
    #portfolio-new .portfolio36 .txt {
        padding-top: 9rem !important;
    }
    #contact-form-bottom {
        padding-inline: 9rem;
    }
    .footer.ar-vr-bg.footer-sec {
        padding-inline: 1rem;
    }
    #toTopBtn {
        bottom: 66px;
    }
}

@media only screen and (min-height: 864px) and (max-height: 864px) and (min-width: 1536px) and (max-width: 1536px) {
    .portfolio1 .txt {
        padding-top: 136px !important;
    }
    .portfolio1 .bannerBtn {
        padding-top: 42% !important;
    }
    .portfolio2 .txt {
        padding-top: 140px !important;
        position: unset;
    }
    .portfolio2 .bannerBtn {
        padding-top: 31% !important;
    }
    .section2 {
        margin-left: 1rem !important;
    }
    .portfolio3 .bannerBtn {
        padding-top: 52% !important;
    }
    .canadian {
        margin-left: 11rem !important;
    }
    .skillsontario {
        margin-left: 8rem !important;
    }
}

@media only screen and (min-width: 1536px) {
    #contact-form-bottom {
        padding-inline: 12rem;
    }
    .portfolio1 .txt {
        padding-top: 99px !important;
    }
    .portfolio1 .bannerBtn {
        padding-top: 32%;
    }
    .portfolio2 .bannerBtn {
        padding-top: 25%;
    }
    .portfolio3 .bannerBtn {
        padding-top: 46%;
    }
    .section2 {
        margin-left: 14rem;
    }
    .portfolio4 .bannerBtn {
        padding-top: 29%;
    }
    .portfolio5 .bannerBtn {
        padding-top: 25%;
    }
    .portfolio6 .bannerBtn {
        padding-top: 33%;
    }
    .portfolio7 .bannerBtn {
        padding-top: 32%;
    }
    .portfolio20 .bannerBtn {
        padding-top: 37%;
    }
    .portfolio8 .bannerBtn {
        padding-top: 19%;
    }
    .portfolio9 .bannerBtn {
        padding-top: 26%;
    }
    .portfolio10 .bannerBtn {
        padding-top: 33%;
    }
    .portfolio11 .bannerBtn {
        padding-top: 23%;
    }
    .portfolio12 .bannerBtn {
        padding-top: 28%;
    }
    .portfolio13 .bannerBtn {
        padding-top: 22%;
    }
    .portfolio15 .bannerBtn {
        padding-top: 32%;
    }
    .portfolio17 .bannerBtn {
        padding-top: 32%;
    }
    .portfolio18 .bannerBtn {
        padding-top: 24%;
    }
    .adslide91 .bannerBtn {
        padding-top: 22%;
    }
    .portfolio19 .bannerBtn {
        padding-top: 24%;
    }
    #portfolio-new .portfolio23 .case-border {
        width: 93px;
    }
    .portfolio24 .bannerBtn {
        padding-top: 28%;
    }
    .portfolio25 .bannerBtn {
        padding-top: 17%;
    }
    .portfolio29 .bannerBtn {
        padding-top: 22%;
    }
    .portfolio-ad-section #mindset-app {
        background-color: #720000dc;
    }
    .portfolio-ad-section #riyadh-app {
        background-color: #6d6d6dcc;
    }
    .portfolio-ad-section #settlyt-app {
        background-color: #31709c;
    }
    .portfolio-ad-section #frenzy-app {
        background-color: #0a1119;
    }
    .portfolio-ad-section #amy-app {
        background-color: #e5d4ba;
    }
    .portfolio-ad-section #wsps-app {
        background-color: #ffc72c;
    }
    .portfolio-ad-section #ideal-app {
        background-color: #f9b52cde;
    }
    .portfolio-ad-section #alpha-app {
        background-color: #ebba39;
    }
    .portfolio-ad-section #yello-app {
        background-color: #0d181c;
    }
    .portfolio-ad-section #jane-app {
        background-color: #1a1f23;
    }
}

@media only screen and (min-height: 864px) and (max-height: 864px) and (min-width: 1536px) and (max-width: 1536px) {
    .portfolio1 .txt {
        padding-top: 136px !important;
    }
    .portfolio1 .bannerBtn {
        padding-top: 50% !important;
    }
    .portfolio2 .txt {
        padding-top: 140px !important;
    }
    .portfolio2 .bannerBtn {
        padding-top: 38% !important;
    }
    .section2 {
        margin-left: 1rem !important;
    }
    .portfolio3 .bannerBtn {
        padding-top: 54% !important;
    }
    .canadian {
        margin-left: 11rem !important;
    }
    .skillsontario {
        margin-left: 8rem !important;
    }
    .authority {
        margin-left: 4rem !important;
    }
    .portfolio3 .txt {
        padding-top: 165px !important;
    }
    .portfolio4 .bannerBtn {
        padding-top: 48%;
    }
    .portfolio5 .txt {
        padding-top: 115px !important;
    }
    .portfolio5 .bannerBtn {
        padding-top: 39% !important;
    }
    .portfolio6 .bannerBtn {
        padding-top: 58%;
    }
    .ecaosec {
        margin-left: 9rem !important;
    }
    .portfolio7 .bannerBtn {
        padding-top: 52%;
    }
    .portfolio20 .bannerBtn {
        padding-top: 62%;
    }
    .portfolio8 .bannerBtn {
        padding-top: 39%;
    }
    .corey-byer {
        margin-left: 16rem !important;
    }
    .portfolio9 .bannerBtn {
        padding-top: 45%;
    }
    .workplacesec {
        margin-left: 8rem !important;
    }
    .portfolio10 .bannerBtn {
        padding-top: 57%;
    }
    .portfolio11 .txt {
        padding-top: 154px !important;
    }
    .portfolio11 .bannerBtn {
        padding-top: 36%;
    }
    .portfolio12 .bannerBtn {
        padding-top: 52%;
    }
    .portfolio13 .bannerBtn {
        padding-top: 45%;
    }
    .transport {
        transform: translate(19px, 33px);
        -webkit-transform: translate(19px, 33px);
        -moz-transform: translate(19px, 33px);
        -ms-transform: translate(19px, 33px);
        -o-transform: translate(19px, 33px);
    }
    .portfolio15 .bannerBtn {
        padding-top: 51%;
    }
    .bungie {
        transform: translate(35px, 0px);
        -webkit-transform: translate(35px, 0px);
        -moz-transform: translate(35px, 0px);
        -ms-transform: translate(35px, 0px);
        -o-transform: translate(35px, 0px);
    }
    .portfolio17 .bannerBtn {
        padding-top: 51%;
    }
    .catapult {
        transform: translate(42px, 1px);
        -webkit-transform: translate(42px, 1px);
        -moz-transform: translate(42px, 1px);
        -ms-transform: translate(42px, 1px);
        -o-transform: translate(42px, 1px);
    }
    .portfolio18 .txt {
        padding-top: 175px !important;
    }
    .portfolio18 .bannerBtn {
        padding-top: 37%;
    }
    .adslide91 .bannerBtn {
        padding-top: 41%;
    }
    .portfolio19 .bannerBtn {
        padding-top: 43%;
    }
    .portfolio24 .bannerBtn {
        padding-top: 47%;
    }
    .portfolio25 .bannerBtn {
        padding-top: 36%;
    }
    .portfolio29 .bannerBtn {
        padding-top: 46%;
    }
}

@media only screen and (min-width: 1580px) {
    #contact-form-bottom {
        padding-inline: 13.8rem;
    }
    .portfolio1 .txt {
        padding-top: 8rem !important;
    }
    .portfolio1 .bannerBtn {
        padding-top: 54%;
    }
    .portfolio2 .bannerBtn {
        padding-top: 41%;
    }
    .portfolio3 .txt {
        padding-top: 10rem !important;
    }
    .portfolio3 .bannerBtn {
        padding-top: 57%;
    }
    .portfolio4 .txt {
        padding-top: 8rem !important;
    }
    .portfolio4 .bannerBtn {
        padding-top: 42%;
    }
    .txt {
        padding-top: 8rem !important;
    }
    .portfolio5 .bannerBtn {
        padding-top: 39%;
    }
    .portfolio6 .txt {
        padding-top: 9rem !important;
    }
    .portfolio6 .bannerBtn {
        padding-top: 52%;
    }
    .portfolio7 .bannerBtn {
        padding-top: 45%;
    }
    .portfolio20 .bannerBtn {
        padding-top: 63%;
    }
    .portfolio8 .txt {
        padding-top: 10rem !important;
    }
    .portfolio8 .bannerBtn {
        padding-top: 39%;
    }
    .portfolio9 .txt {
        padding-top: 10rem !important;
    }
    .portfolio9 .bannerBtn {
        padding-top: 42%;
    }
    .portfolio10 .txt {
        padding-top: 10rem !important;
    }
    .portfolio10 .bannerBtn {
        padding-top: 46%;
    }
    .portfolio11 .txt {
        padding-top: 10rem !important;
    }
    .portfolio11 .bannerBtn {
        padding-top: 38%;
    }
    .portfolio12 .txt {
        padding-top: 10rem !important;
    }
    .portfolio12 .bannerBtn {
        padding-top: 43%;
    }
    .portfolio13 .txt {
        padding-top: 11rem !important;
    }
    .portfolio13 .bannerBtn {
        padding-top: 44%;
    }
    .portfolio15 .bannerBtn {
        padding-top: 46%;
    }
    .bungie {
        transform: translate(-72px, 23px);
        -moz-transform: translate(-72px, 23px);
        -ms-transform: translate(-72px, 23px);
        -o-transform: translate(-72px, 23px);
        -webkit-transform: translate(-72px, 23px);
    }
    .portfolio17 .bannerBtn {
        padding-top: 47%;
    }
    .portfolio18 .txt {
        padding-top: 10rem !important;
    }
    .portfolio18 .bannerBtn {
        padding-top: 41%;
    }
    .adslide91 .txt {
        padding-top: 10rem !important;
    }
    .adslide91 .bannerBtn {
        padding-top: 41%;
    }
    #portfolio-new .portfolio19 .txt {
        padding-top: 12rem !important;
    }
    .portfolio19 .bannerBtn {
        padding-top: 44%;
    }
    .portfolio24 .txt {
        padding-top: 9rem !important;
    }
    .portfolio24 .bannerBtn {
        padding-top: 46%;
    }
    .portfolio25 .txt {
        padding-top: 11rem !important;
    }
    .portfolio25 .bannerBtn {
        padding-top: 32%;
    }
    #portfolio-new .portfolio26 .txt {
        padding-top: 6rem !important;
    }
    #portfolio-new .portfolio27 .txt {
        padding-top: 10rem !important;
    }
    #portfolio-new .portfolio28 .txt {
        padding-top: 11rem !important;
    }
    .portfolio29 .bannerBtn {
        padding-top: 38%;
    }
    #portfolio-new .portfolio36 .txt {
        padding-top: 11rem !important;
    }
    #portfolio-new .portfolio38 .txt {
        padding-top: 12rem !important;
    }
}

@media only screen and (min-width: 1600px) {
    .section2 {
        margin-left: 8rem;
    }
    .corey_sec br {
        display: none;
    }
    .corey-byer {
        margin-left: 17rem;
    }
    .corey {
        transform: translate(29px, 0px);
        -webkit-transform: translate(29px, 0px);
        -moz-transform: translate(29px, 0px);
        -ms-transform: translate(29px, 0px);
        -o-transform: translate(29px, 0px);
    }
}

@media only screen and (min-width: 1680px) {
    #contact-form-bottom {
        padding-inline: 16.8rem;
    }
    .portfolio1 .bannerBtn {
        padding-top: 40%;
    }
    .portfolio2 .bannerBtn {
        padding-top: 29%;
    }
    .portfolio3 .bannerBtn {
        padding-top: 44%;
    }
    .portfolio4 .bannerBtn {
        padding-top: 32%;
    }
    .portfolio5 .bannerBtn {
        padding-top: 28%;
    }
    .portfolio6 .bannerBtn {
        padding-top: 40%;
    }
    .portfolio7 .bannerBtn {
        padding-top: 34%;
    }
    .portfolio20 .bannerBtn {
        padding-top: 50%;
    }
    .portfolio9 .bannerBtn {
        padding-top: 29%;
    }
    .portfolio10 .bannerBtn {
        padding-top: 33%;
    }
    .portfolio8 .bannerBtn {
        padding-top: 28%;
    }
    .portfolio11 .bannerBtn {
        padding-top: 27%;
    }
    .portfolio12 .bannerBtn {
        padding-top: 35%;
    }
    .portfolio10 .txt p {
        width: 393px !important;
    }
    .portfolio13 .bannerBtn {
        padding-top: 31%;
    }
    .portfolio15 .bannerBtn {
        padding-top: 34%;
    }
    .portfolio17 .bannerBtn {
        padding-top: 36%;
    }
    .portfolio18 .bannerBtn {
        padding-top: 31%;
    }
    .adslide91 .bannerBtn {
        padding-top: 32%;
    }
    .portfolio19 .bannerBtn {
        padding-top: 34%;
    }
    .portfolio24 .bannerBtn {
        padding-top: 37%;
    }
    .portfolio25 .bannerBtn {
        padding-top: 22%;
    }
    .portfolio29 .bannerBtn {
        padding-top: 26%;
    }
    .canadian img {
        transform: translate(0px, 21px);
    }
}

@media only screen and (min-width: 1792px) {
    #contact-form-bottom {
        padding-inline: 20.2rem;
    }
    .portfolio1 .txt {
        padding-top: 12rem !important;
    }
    .portfolio1 .bannerBtn {
        padding-top: 64%;
    }
    .txt {
        padding-top: 12rem !important;
    }
    .portfolio2 .bannerBtn {
        padding-top: 54%;
    }
    .portfolio3 .txt {
        padding-top: 13rem !important;
    }
    .portfolio3 .bannerBtn {
        padding-top: 70%;
    }
    .portfolio4 .bannerBtn {
        padding-top: 63%;
    }
    .portfolio5 .bannerBtn {
        padding-top: 48%;
    }
    .portfolio6 .txt {
        padding-top: 12rem !important;
    }
    .portfolio6 .bannerBtn {
        padding-top: 66%;
    }
    .portfolio7 .bannerBtn {
        padding-top: 53%;
    }
    .portfolio20 .txt {
        padding-top: 12rem !important;
    }
    .portfolio20 .bannerBtn {
        padding-top: 71%;
    }
    .portfolio8 .bannerBtn {
        padding-top: 55%;
    }
    .portfolio9 .txt {
        padding-top: 12rem !important;
    }
    .portfolio9 .bannerBtn {
        padding-top: 54%;
    }
    .portfolio10 .bannerBtn {
        padding-top: 72%;
    }
    .portfolio11 .txt {
        padding-top: 12rem !important;
    }
    .portfolio11 .bannerBtn {
        padding-top: 51%;
    }
    .portfolio12 .txt {
        padding-top: 12rem !important;
    }
    .portfolio12 .bannerBtn {
        padding-top: 62%;
    }
    .portfolio13 .txt {
        padding-top: 15rem !important;
    }
    .portfolio13 .bannerBtn {
        padding-top: 59%;
    }
    .portfolio15 .bannerBtn {
        padding-top: 52%;
    }
    .portfolio17 .txt {
        padding-top: 10rem !important;
    }
    .portfolio17 .bannerBtn {
        padding-top: 56%;
    }
    .portfolio18 .txt {
        padding-top: 14rem !important;
    }
    .portfolio18 .bannerBtn {
        padding-top: 48%;
    }
    .portfolio21 .txt {
        padding-top: 6rem !important;
    }
    .portfolio22 .txt {
        padding-top: 6rem !important;
    }
    .portfolio16 .txt {
        padding-top: 12rem !important;
    }
    .adslide91 .txt {
        padding-top: 15rem !important;
    }
    .adslide91 .bannerBtn {
        padding-top: 45%;
    }
    #portfolio-new .portfolio19 .txt {
        padding-top: 15rem !important;
    }
    .portfolio19 .bannerBtn {
        padding-top: 53%;
    }
    #portfolio-new .portfolio23 .txt {
        padding-top: 7rem !important;
    }
    .portfolio24 .txt {
        padding-top: 13rem !important;
    }
    .portfolio24 .bannerBtn {
        padding-top: 54%;
    }
    .portfolio25 .txt {
        padding-top: 14rem !important;
    }
    .portfolio25 .bannerBtn {
        padding-top: 39%;
    }
    #portfolio-new .portfolio27 .txt {
        padding-top: 13rem !important;
    }
    #portfolio-new .portfolio28 .txt {
        padding-top: 16rem !important;
    }
    .portfolio29 .bannerBtn {
        padding-top: 44%;
    }
    #portfolio-new .portfolio31 .txt {
        padding-top: 6rem !important;
    }
    #portfolio-new .portfolio32 .txt {
        padding-top: 6rem !important;
    }
    .portfolio33 .txt {
        padding-top: 12rem !important;
    }
    #portfolio-new .portfolio33 .txt p {
        width: 449px !important;
    }
    #portfolio-new .portfolio35 .txt {
        padding-top: 9rem !important;
    }
    #portfolio-new .portfolio38 .txt {
        padding-top: 15rem !important;
    }
    .ios-cta.port-cta .container,
    .casestudy-slide .container {
        max-width: 1493px;
    }
}

@media only screen and (min-width: 1920px) {
    #contact-form-bottom {
        padding-inline: 24.2rem;
    }
    .portfolio1 .txt {
        padding-top: 10rem !important;
    }
    .portfolio1 .bannerBtn {
        padding-top: 39%;
    }
    .portfolio2 .bannerBtn {
        padding-top: 26%;
    }
    .section2 {
        margin-left: -4rem;
    }
    blockquote {
        line-height: 48px;
        width: 100%;
    }
    .portfolio3 .bannerBtn {
        padding-top: 40%;
    }
    .portfolio4 .bannerBtn {
        padding-top: 35%;
    }
    .txt {
        padding-top: 8rem !important;
    }
    .portfolio5 .bannerBtn {
        padding-top: 32%;
    }
    .portfolio6 .bannerBtn {
        padding-top: 39%;
    }
    .portfolio20 .txt {
        padding-top: 10rem !important;
    }
    .portfolio20 .bannerBtn {
        padding-top: 44%;
    }
    .portfolio7 .bannerBtn {
        padding-top: 38%;
    }
    .portfolio8 .txt {
        padding-top: 6rem !important;
    }
    .portfolio8 .bannerBtn {
        padding-top: 39%;
    }
    .corey_sec {
        width: 92%;
    }
    .portfolio9 .txt {
        padding-top: 10rem !important;
    }
    .portfolio9 .bannerBtn {
        padding-top: 34%;
    }
    .portfolio10 .bannerBtn {
        padding-top: 40%;
    }
    .portfolio11 .bannerBtn {
        padding-top: 28%;
    }
    .portfolio12 .bannerBtn {
        padding-top: 34%;
    }
    .public {
        transform: translate(-95px, 9px);
        -webkit-transform: translate(-95px, 9px);
        -moz-transform: translate(-95px, 9px);
        -ms-transform: translate(-95px, 9px);
        -o-transform: translate(-95px, 9px);
    }
    .portfolio13 .txt {
        padding-top: 12rem !important;
    }
    .portfolio13 .bannerBtn {
        padding-top: 34%;
    }
    .transport {
        transform: translate(-91px, 17px);
        -webkit-transform: translate(-91px, 17px);
        -moz-transform: translate(-91px, 17px);
        -ms-transform: translate(-91px, 17px);
        -o-transform: translate(-91px, 17px);
    }
    .portfolio15 .bannerBtn {
        padding-top: 37%;
    }
    .portfolio16 .txt {
        padding-top: 10rem !important;
    }
    .portfolio17 .bannerBtn {
        padding-top: 34%;
    }
    .portfolio18 .bannerBtn {
        padding-top: 26%;
    }
    .adslide91 .bannerBtn {
        padding-top: 24%;
    }
    .portfolio19 .bannerBtn {
        padding-top: 30%;
    }
    .portfolio24 .bannerBtn {
        padding-top: 31%;
    }
    .portfolio25 .txt {
        padding-top: 12rem !important;
    }
    .portfolio25 .bannerBtn {
        padding-top: 23%;
    }
    .portfolio29 .bannerBtn {
        padding-top: 32%;
    }
    #portfolio-new .portfolio38 .txt {
        padding-top: 13rem !important;
    }
    #portfolio-new .portfolio39 .txt {
        padding-top: 79px !important;
    }
    .port-cta.ios-cta .ctabg {
        height: 293px;
        padding: 73px 0 0px 72px;
    }
    .port-cta .ctaBtn a {
        font-size: 22px;
        padding: 19px 45px;
    }
    .port-cta .ctaBtn {
        transform: translate(161px, 62px);
    }
    .ios-cta.port-cta .container,
    .casestudy-slide .container {
        max-width: 1692px;
    }
}

@media only screen and (min-width: 1100px) and (max-width: 1290px) {
    .portfolio1 .txt {
        padding-top: 6rem !important;
    }
    .portfolio1 .bannerBtn {
        padding-top: 28%;
    }
    .portfolio2 .txt {
        padding-top: 5rem !important;
    }
    .portfolio2 .bannerBtn {
        padding-top: 30%;
    }
    .section2 {
        margin-left: -4rem;
    }
    blockquote {
        line-height: 40px;
        width: 100%;
    }
    .portfolio3 .bannerBtn {
        padding-top: 44%;
    }
    .portfolio4 .bannerBtn {
        padding-top: 35%;
    }
    .txt {
        padding-top: 4rem !important;
    }
    .portfolio5 .txt {
        padding-top: 4rem !important;
    }
    .portfolio5 .bannerBtn {
        padding-top: 29%;
    }
    .portfolio6 .bannerBtn {
        padding-top: 39%;
    }
    .portfolio20 .txt {
        padding-top: 6rem !important;
    }
    .portfolio20 .bannerBtn {
        padding-top: 46%;
    }
    .portfolio7 .bannerBtn {
        padding-top: 38%;
    }
    .portfolio8 .txt {
        padding-top: 4rem !important;
    }
    .portfolio8 .bannerBtn {
        padding-top: 28%;
    }
    .corey_sec {
        width: 92%;
    }
    .portfolio9 .txt {
        padding-top: 5rem !important;
    }
    .portfolio9 .bannerBtn {
        padding-top: 38%;
    }
    .portfolio10 .bannerBtn {
        padding-top: 47%;
    }
    .portfolio11 .txt {
        padding-top: 7rem !important;
    }
    .portfolio11 .bannerBtn {
        padding-top: 24%;
    }
    .portfolio12 .bannerBtn {
        padding-top: 31%;
    }
    .public {
        transform: translate(-95px, 9px);
        -webkit-transform: translate(-95px, 9px);
        -moz-transform: translate(-95px, 9px);
        -ms-transform: translate(-95px, 9px);
        -o-transform: translate(-95px, 9px);
    }
    .portfolio13 .txt {
        padding-top: 9rem !important;
    }
    .portfolio13 .bannerBtn {
        padding-top: 28%;
    }
    .transport {
        transform: translate(-91px, 6px);
        -webkit-transform: translate(-91px, 6px);
        -moz-transform: translate(-91px, 6px);
        -ms-transform: translate(-91px, 6px);
        -o-transform: translate(-91px, 6px);
    }
    .portfolio15 .bannerBtn {
        padding-top: 40%;
    }
    .portfolio16 .txt {
        padding-top: 6rem !important;
    }
    .portfolio17 .bannerBtn {
        padding-top: 40%;
    }
    .portfolio18 .bannerBtn {
        padding-top: 29%;
    }
    .adslide91 .bannerBtn {
        padding-top: 26%;
    }
    .portfolio19 .txt {
        padding-top: 9rem !important;
    }
    .portfolio19 .bannerBtn {
        padding-top: 30%;
    }
    .portfolio24 .txt {
        padding-top: 7rem !important;
    }
    .portfolio24 .bannerBtn {
        padding-top: 31%;
    }
    .portfolio25 .txt {
        padding-top: 7rem !important;
    }
    .portfolio25 .bannerBtn {
        padding-top: 23%;
    }
    .portfolio29 .bannerBtn {
        padding-top: 32%;
    }
    #portfolio-new .portfolio38 .txt {
        padding-top: 13rem !important;
    }
    #portfolio-new .portfolio39 .txt {
        padding-top: 79px !important;
    }
    .skills {
        transform: translate(-38px, -16px);
        -webkit-transform: translate(-38px, -16px);
        -moz-transform: translate(-38px, -16px);
        -ms-transform: translate(-38px, -16px);
        -o-transform: translate(-38px, -16px);
    }
    .ecao {
        margin-top: 34px;
    }
    .catapult {
        transform: translate(-72px, 0px);
        -webkit-transform: translate(-72px, 0px);
        -moz-transform: translate(-72px, 0px);
        -ms-transform: translate(-72px, 0px);
        -o-transform: translate(-72px, 0px);
    }
    .portfolio18 .txt {
        padding-top: 8rem !important;
    }
    .adslide91 .txt {
        padding-top: 8rem !important;
    }
    .portfolio27 .txt {
        padding-top: 6rem !important;
    }
    .portfolio28 .txt {
        padding-top: 10rem !important;
    }
    #portfolio-new .portfolio38 .txt {
        padding-top: 9rem !important;
    }
    #portfolio-new .portfolio39 .txt {
        padding-top: 42px !important;
    }
}

@media only screen and (min-width: 1000px) and (max-width: 1100px) {
    .portfolio-ad-section #mindset-app {
        background-color: #720000dc;
    }
    .portfolio-ad-section #riyadh-app {
        background-color: #6d6d6dcc;
    }
    .portfolio-ad-section #settlyt-app {
        background-color: #31709c;
    }
    .portfolio-ad-section #frenzy-app {
        background-color: #0a1119;
    }
    .portfolio-ad-section #amy-app {
        background-color: #e5d4ba;
    }
    .portfolio-ad-section #wsps-app {
        background-color: #ffc72c;
    }
    .portfolio-ad-section #ideal-app {
        background-color: #f9b52cde;
    }
    .portfolio-ad-section #alpha-app {
        background-color: #ebba39;
    }
    .portfolio-ad-section #yello-app {
        background-color: #0d181c;
    }
    .portfolio-ad-section #jane-app {
        background-color: #1a1f23;
    }
    .portfolio-app img {
        width: 90%;
    }
    .portfolio1 .txt {
        padding-top: 6rem !important;
    }
    .portfolio1 .bannerBtn {
        padding-top: 50%;
    }
    .portfolio2 .txt {
        padding-top: 5rem !important;
    }
    .portfolio2 .bannerBtn {
        padding-top: 51%;
    }
    .section2 {
        margin-left: 0rem;
    }
    blockquote {
        line-height: 40px;
        width: 100%;
    }
    .portfolio3 .txt {
        padding-top: 9rem !important;
    }
    .portfolio3 .bannerBtn {
        padding-top: 65%;
    }
    .portfolio4 .bannerBtn {
        padding-top: 57%;
    }
    .txt {
        padding-top: 4rem !important;
    }
    .portfolio5 .txt {
        padding-top: 4rem !important;
    }
    .portfolio5 .bannerBtn {
        padding-top: 45%;
    }
    .portfolio6 .txt {
        padding-top: 8rem !important;
    }
    .portfolio6 .bannerBtn {
        padding-top: 53%;
    }
    .portfolio20 .txt {
        padding-top: 6rem !important;
    }
    .portfolio20 .bannerBtn {
        padding-top: 73%;
    }
    .portfolio7 .bannerBtn {
        padding-top: 62%;
    }
    .portfolio8 .txt {
        padding-top: 4rem !important;
    }
    .portfolio8 .bannerBtn {
        padding-top: 46%;
    }
    .corey_sec {
        width: 80%;
    }
    .portfolio9 .txt {
        padding-top: 5rem !important;
    }
    .portfolio9 .bannerBtn {
        padding-top: 58%;
    }
    .workplace {
        transform: translate(-61px, 14px);
        -webkit-transform: translate(-61px, 14px);
        -moz-transform: translate(-61px, 14px);
        -ms-transform: translate(-61px, 14px);
        -o-transform: translate(-61px, 14px);
    }
    .portfolio10 .bannerBtn {
        padding-top: 73%;
    }
    .portfolio11 .txt {
        padding-top: 7rem !important;
    }
    .portfolio11 .bannerBtn {
        padding-top: 39%;
    }
    .portfolio12 .txt {
        padding-top: 6rem !important;
    }
    .portfolio12 .bannerBtn {
        padding-top: 62%;
    }
    .public {
        transform: translate(-95px, 37px);
        -webkit-transform: translate(-95px, 37px);
        -moz-transform: translate(-95px, 37px);
        -ms-transform: translate(-95px, 37px);
        -o-transform: translate(-95px, 37px);
    }
    #portfolio-new .txt h2 {
        font-size: 37px;
    }
    .portfolio13 .txt {
        padding-top: 9rem !important;
    }
    .portfolio13 .bannerBtn {
        padding-top: 50%;
    }
    .transport {
        transform: translate(-91px, 6px);
        -webkit-transform: translate(-91px, 6px);
        -moz-transform: translate(-91px, 6px);
        -ms-transform: translate(-91px, 6px);
        -o-transform: translate(-91px, 6px);
    }
    .portfolio15 .txt {
        padding-top: 6rem !important;
    }
    .portfolio15 .bannerBtn {
        padding-top: 54%;
    }
    .bungie {
        transform: translate(-72px, 30px);
        -webkit-transform: translate(-72px, 30px);
        -moz-transform: translate(-72px, 30px);
        -ms-transform: translate(-72px, 30px);
        -o-transform: translate(-72px, 30px);
    }
    body {
        overflow-x: hidden;
    }
    blockquote {
        font-size: 30px;
    }
    .portfolio16 .txt {
        padding-top: 6rem !important;
    }
    .portfolio17 .txt {
        padding-top: 6rem !important;
    }
    .portfolio17 .bannerBtn {
        padding-top: 55%;
    }
    .portfolio18 .bannerBtn {
        padding-top: 41%;
    }
    .adslide91 .bannerBtn {
        padding-top: 34%;
    }
    .portfolio19 .txt {
        padding-top: 9rem !important;
    }
    .portfolio19 .bannerBtn {
        padding-top: 49%;
    }
    #portfolio-new .portfolio23 .txt {
        padding-top: 68px !important;
    }
    .portfolio24 .txt {
        padding-top: 7rem !important;
    }
    .portfolio24 .bannerBtn {
        padding-top: 51%;
    }
    .portfolio25 .txt {
        padding-top: 7rem !important;
    }
    .portfolio25 .bannerBtn {
        padding-top: 39%;
    }
    .portfolio29 .bannerBtn {
        padding-top: 47%;
    }
    #portfolio-new .portfolio38 .txt {
        padding-top: 13rem !important;
    }
    #portfolio-new .portfolio39 .txt {
        padding-top: 79px !important;
    }
    .skills {
        transform: translate(-38px, -16px);
        -webkit-transform: translate(-38px, -16px);
        -moz-transform: translate(-38px, -16px);
        -ms-transform: translate(-38px, -16px);
        -o-transform: translate(-38px, -16px);
    }
    .ecao {
        margin-top: 43px;
    }
    .catapult {
        transform: translate(-72px, 0px);
        -webkit-transform: translate(-72px, 0px);
        -moz-transform: translate(-72px, 0px);
        -ms-transform: translate(-72px, 0px);
        -o-transform: translate(-72px, 0px);
    }
    .portfolio18 .txt {
        padding-top: 8rem !important;
    }
    .adslide91 .txt {
        padding-top: 10rem !important;
    }
    .portfolio27 .txt {
        padding-top: 6rem !important;
    }
    .portfolio28 .txt {
        padding-top: 10rem !important;
    }
    #portfolio-new .portfolio38 .txt {
        padding-top: 9rem !important;
    }
    #portfolio-new .portfolio39 .txt {
        padding-top: 42px !important;
    }
}

/* Mobile Responsiveness */

@media only screen and (max-width: 600px) {
    .case-border {
        width: 109px;
    }
    .portfolio20 .app-store-txt {
        color: #000000 !important;
        opacity: 0.6;
    }
    .logo {
        padding: 10px 0 6px;
    }
    #portfolio-new .portfolio24 .case-border {
        width: 132px !important;
        bottom: 1px !important;
        left: 12px;
    }
    .portfolio31 .case-border {
        left: 12px;
    }
    .portfolio33 .case-border {
        left: 11px;
    }
    .portfolio34 .case-border {
        left: 10px;
    }
    .port-cta h2 {
        font-size: 37px !important;
    }
    .portfolio33 .case-link-white .case-border {
        width: 94px !important;
    }
    .hide-xs {
        display: block;
    }
    .hide-desktop {
        display: none;
    }
}

@media only screen and (max-width: 430px) {
    .canadian blockquote:before {
        top: 3px;
        left: 13px;
    }
    .portfolio10 .app-store-txt {
        line-height: 24px !important;
    }
}

@media only screen and (max-width: 416px) {
    .portfolio1 .bannerBtn {
        bottom: -112%;
    }
    .portfolio24 .bannerBtn {
        bottom: -260%;
    }
    .canadian blockquote:after {
        bottom: -459px !important;
        left: 350px !important;
    }
    .skillsontario blockquote:after {
        bottom: -334px;
        left: 329px;
    }
    .ecaosec .blockquotetxt1 blockquote:after {
        bottom: -377px !important;
        left: 316px !important;
    }
    .portfolio10 .bannerBtn {
        bottom: -127%;
    }
    #portfolio-new .portfolio11 .txt {
        padding-top: 49px !important;
    }
    .portfolio11 .bannerBtn {
        bottom: -172%;
    }
    .bungietxt::after {
        bottom: -298px !important;
    }
    .maxsoldsec blockquote:after {
        bottom: -242px !important;
        left: 310px;
    }
    .workplacesec blockquote:after {
        bottom: -17rem;
        left: 354px;
    }
    .portfolio17 .bannerBtn {
        bottom: -32rem;
    }
    .portfolio29 .bannerBtn {
        bottom: -99%;
    }
    #portfolio-new .portfolio10 .txt {
        padding-top: 0px !important;
    }
}

@media only screen and (max-width: 399px) {
    #portfolio-new .portfolio11 .txt {
        padding-top: 20px !important;
    }
    .port-cta.ios-cta .ctabg {
        height: 456px !important;
    }
    .authority blockquote:after {
        bottom: -455px;
    }
    .corey-byer blockquote:after {
        bottom: -280px;
    }
    .workplacesec blockquote:after {
        bottom: -22rem;
        left: 336px;
    }
    .publics blockquote:after {
        bottom: -363px !important;
        left: 319px !important;
    }
    .maxsoldsec blockquote:after {
        bottom: -290px !important;
    }
    .catapulte .bungietxt:after {
        bottom: -246px !important;
    }
    .idealblock::after {
        bottom: -216px !important;
        left: 316px !important;
    }
    .frenzysec .idealblock::after {
        bottom: -297px !important;
        left: 300px !important;
    }
    .portfolio29 .bannerBtn {
        bottom: -86%;
    }
    .basf blockquote::after {
        bottom: -254px !important;
    }
    .simplysec .idealblock::after {
        bottom: -167px !important;
        left: 319px !important;
    }
    .canadian blockquote:after {
        bottom: -454px !important;
        left: 315px !important;
    }
    .portfolio11 .bannerBtn {
        bottom: -204%;
    }
    .portfolio10 .no-gutters p {
        font-size: 19px;
        margin-top: -6px;
    }
    .portfolio10 .bannerBtn {
        bottom: -137%;
    }
    .portfolio11 .case-border {
        left: 10px;
    }
    .portfolio3 .bannerBtn {
        bottom: -146%;
    }
    .portfolio9 .bannerBtn {
        bottom: -170%;
    }
}

@media only screen and (min-width: 393px) and (max-width: 393px) {
    .portfolio11 .case-border {
        left: 10px;
    }
    .portfolio5 .bannerBtn {
        bottom: -194%;
    }
    .portfolio12 .bannerBtn {
        bottom: -153%;
    }
    .portfolio25 .bannerBtn {
        bottom: -238%;
    }
    .portfolio17 .case-border {
        left: 11px;
    }
}

@media only screen and (max-width: 380px) {
    .maxsoldsec blockquote:after {
        left: 291px;
    }
    .skillsontario blockquote:after {
        left: 314px;
    }
    .corey-byer blockquote:after {
        bottom: -310px;
    }
    .canadian blockquote:after {
        bottom: -493px !important;
        left: 315px !important;
    }
    .ecaosec .blockquotetxt1 blockquote:after {
        bottom: -426px !important;
        left: 307px !important;
    }
    .workplacesec blockquote:after {
        left: 317px;
    }
    .publics blockquote:before {
        top: -12px;
        left: 0px;
    }
    .publics blockquote:after {
        bottom: -412px !important;
        left: 304px !important;
    }
    .bungietxt::after {
        bottom: -338px !important;
        left: 317px !important;
    }
    .catapulte .bungietxt:after {
        bottom: -282px !important;
        left: 299px !important;
    }
    .jeddahsec .bungietxt::after {
        bottom: -295px !important;
        left: 304px !important;
    }
    .idealblock::after {
        bottom: -216px !important;
        left: 301px !important;
    }
    .frenzysec .idealblock::after {
        bottom: -326px !important;
    }
    .simplysec .idealblock::after {
        bottom: -211px !important;
        left: 301px !important;
    }
}

@media only screen and (max-width: 370px) {
    .portfolio27 .bannerBtn {
        bottom: -192% !important;
    }
    #portfolio-new .portfolio11 .txt {
        padding-top: 9px !important;
    }
    .portfolio1 .bannerBtn {
        bottom: -98%;
    }
    .canadian blockquote:after {
        bottom: -493px !important;
        left: 299px !important;
    }
    .portfolio6 .bannerBtn {
        bottom: -158%;
    }
    .ecaosec .blockquotetxt1 blockquote:after {
        left: 294px !important;
    }
    .skillsontario blockquote:after {
        left: 302px;
    }
    .workplacesec blockquote:after {
        left: 300px;
    }
    .portfolio11 .bannerBtn {
        bottom: -187%;
    }
    .publics blockquote:after {
        left: 290px !important;
    }
    .transportation blockquote:after {
        left: 294px;
    }
    .bungietxt::after {
        left: 290px !important;
    }
    .frenzysec .idealblock::after {
        left: 292px !important;
    }
    .simplysec .idealblock::after {
        left: 292px !important;
    }
    .port-cta h2 {
        font-size: 32px !important;
    }
}

@media only screen and (max-width: 330px) {
    .portfolio1 .bannerBtn {
        bottom: -17.6rem;
    }
    .portfolio3 .bannerBtn {
        bottom: -137%;
    }
    .portfolio9 .bannerBtn {
        bottom: -194%;
    }
    .portfolio27 .bannerBtn {
        bottom: -210% !important;
    }
    .authority blockquote:after {
        bottom: -515px !important;
    }
    .canadian blockquote:after {
        left: 260px !important;
    }
    .skillsontario blockquote:after {
        bottom: -320px !important;
    }
    .portfolio6 .bannerBtn {
        bottom: -146%;
    }
    .ecaosec .blockquotetxt1 blockquote:after {
        left: 259px !important;
    }
    .corey-byer blockquote:after {
        bottom: -295px !important;
    }
    .workplacesec blockquote:after {
        bottom: -352px !important;
    }
    .portfolio10 .bannerBtn {
        bottom: -103%;
    }
    #portfolio-new .portfolio11 .txt {
        padding-top: 4px !important;
    }
    .app-downloads-count {
        font-size: 23.4656px !important;
    }
    .portfolio1 .secondb {
        transform: translate(0px, -9px);
        -webkit-transform: translate(0px, -9px);
        -moz-transform: translate(0px, -9px);
        -ms-transform: translate(0px, -9px);
        -o-transform: translate(0px, -9px);
    }
    .portfolio2 .bannerBtn {
        bottom: -138%;
    }
    .logo {
        font-weight: 700;
        font-size: 24px;
        padding: 10px 0 6px;
        letter-spacing: 1px;
        line-height: 68px;
    }
    .portfolio4 .bannerBtn {
        bottom: -145%;
    }
    .portfolio11 .bannerBtn {
        bottom: -204%;
    }
    .publics blockquote:after {
        left: 231px !important;
    }
    .portfolio13 .bannerBtn {
        bottom: -247%;
    }
    .bungietxt::after {
        left: 265px !important;
        bottom: -398px !important;
    }
    .portfolio17 .bannerBtn {
        bottom: -27rem;
    }
    .catapulte .bungietxt:after {
        left: 261px !important;
    }
    .portfolio18 .bannerBtn {
        bottom: -244%;
    }
    .adslide91 .bannerBtn {
        bottom: -245%;
    }
    .jeddahsec .bungietxt::after {
        bottom: -347px !important;
        left: 256px !important;
    }
    .portfolio15 .bannerBtn {
        bottom: -247%;
    }
    .portfolio19 .bannerBtn {
        bottom: -376%;
    }
    .portfolio24 .bannerBtn {
        bottom: -270%;
    }
    .idealblock::after {
        left: 246px !important;
    }
    .portfolio25 .bannerBtn {
        bottom: -215%;
    }
    .portfolio29 .bannerBtn {
        bottom: -79%;
    }
    .case-link-white .case-border {
        left: 8px;
        width: 93px !important;
    }
    .simplysec .idealblock::after {
        left: 245px !important;
    }
    .portfolio6 .secondb {
        transform: translate(0px, -9px);
    }
    .frenzysec .idealblock::after {
        left: 247px !important;
        bottom: -266px !important;
    }
    .portfolio16 .case-link-black .case-border {
        left: 10px;
    }
    .portfolio31 .case-border {
        left: 8px;
    }
    .port-cta h2 {
        font-size: 28px !important;
        line-height: 129% !important;
    }
    .portfolio10 .app-store-txt {
        line-height: 20px !important;
    }
    .portfolio10 .bannerBtn {
        bottom: -126%;
    }
    .portfolio3 .secondb {
        transform: translate(0px, -8px);
    }
    .port-cta.ios-cta .ctabg {
        height: 421px !important;
    }
}

@media only screen and (min-width: 1000px) {
    #topnav .logo {
        padding: 11px 0 6px;
    }
    .portfolio33 .case-link-white .case-border {
        width: 93px !important;
    }
}

.portfolio9 .downloadtxt {
    color: #000000 !important;
    text-shadow: 0px 0 #000000;
}

.portfolio20 .downloadtxt {
    color: #000000 !important;
}

.casestudylink a {
    cursor: pointer;
}

.downloadtxt {
    font-family: CircularStdBold !important;
}

.portfolio13 .downloadtxt {
    color: #000 !important;
    text-shadow: 0px 0 #000;
}

.siren-md img {
    width: 87% !important;
}

@media only screen and (min-width: 414px) and (max-width: 415px) {
    .authority blockquote:after {
        bottom: -421px;
    }
}

@media only screen and (min-width: 420px) and (max-width: 428px) {
    .corey-byer blockquote:after {
        bottom: -217px;
        left: 365px;
    }
}

@media only screen and (min-width: 767px) and (max-width: 993px) {
    .new-web-section16 .ios-riyadhBanner .txt p {
        font-size: 14px !important;
        line-height: 23px !important;
        width: 88% !important;
    }
}

@media only screen and (min-width: 1366px) and (max-width: 1370px) {
    .ios-cta.port-cta .container {
        max-width: 1249px;
    }
    .casestudy-slide .container {
        max-width: 1249px;
    }
    .port-cta.ios-cta .ctabg {
        padding: 31px 0 0px 72px;
    }
}

.portfolio-ad-section #mindset-app {
    background-color: #720000dc;
}

.portfolio-ad-section #riyadh-app {
    background-color: #6d6d6dcc;
}

.portfolio-ad-section #settlyt-app {
    background-color: #31709c;
}

.portfolio-ad-section #frenzy-app {
    background-color: #0a1119;
}

.portfolio-ad-section #wsps-app {
    background-color: #ffc72c;
}

.portfolio-ad-section #ideal-app {
    background-color: #f9b52cde;
}

.portfolio-ad-section #alpha-app {
    background-color: #ebba39;
}

.portfolio-ad-section #yello-app {
    background-color: #0d181c;
}

.portfolio-ad-section #amy-app {
    background-color: #e5d4ba;
}

.portfolio-ad-section #jane-app {
    background-color: #1a1f23;
}

/*  */

@media (min-width:1000px) {
    .ad-portfolio-box .no-gutters>.col,
    .no-gutters>[class*=col-] {
        padding-right: 0;
        padding-left: 0;
        height: 80vh !important;
    }
    #portfolio-new .bannerBtn {
        position: absolute !important;
        bottom: 0 !important;
        left: 42px;
    }
    .portfolio2 .bannerBtn {
        position: absolute !important;
        bottom: 68px !important;
        left: 58px;
    }
    .bannerBtn {
        padding-top: 0px !important;
    }
}