@media screen and (max-width:1600px) {

    .mobile_header nav ul li a,
    header nav ul li a {
        font-size: 14px
    }

    header nav ul li .dropdown-menu1 {
        left: -319px
    }

    header nav ul li .dropdown-menu2 {
        left: -596px
    }

    .section4 .sec4_after {
        width: 720px;
        height: 346px;
        top: 60%;
        transform: translateY(-50%)
    }

    .connect-sec .connect-sec-before {
        width: 720px;
        height: 295px
    }

    .connect-sec .connect-sec-before img,
    .section4 .sec4_after img {
        width: 400px;
        height: 400px
    }

    .section8 {
        padding: 150px 0
    }

    .section8 .before {
        width: 625px;
        height: 706px;
        bottom: -315px
    }

    .section8 .after {
        width: 377px;
        height: 678px;
        bottom: -180px
    }

    .inner-pages-sec4::after {
        width: 72px;
        height: 141px
    }

    .services-page .sec3_content .twoD_box::before {
        left: -150px
    }

    .services-page .sec3_content .threeD_box::after {
        right: -150px
    }

    .before_footer::before,
    .pricing-section .pricing-top::before {
        width: 100%;
        height: 220px
    }

    .section-2d-process::after {
        width: 200px;
        height: 179px;
        right: 280px
    }
}

@media screen and (max-width:1440px) {

    .before_footer .bf_col3 ul li,
    p {
        line-height: 25px
    }

    h3 {
        font-size: 35px
    }

    .h1 {
        font-size: 50px
    }

    .h2,
    h2 {
        font-size: 40px
    }

    h5 {
        font-size: 25px
    }

    p {
        font-size: 15px
    }

    header {
        padding: 20px
    }

    header nav ul li a {
        font-size: 15px;
        padding: 0 !important
    }

    header nav ul li .dropdown-menu {
        width: 1170px
    }

    header nav ul li .dropdown-menu1 {
        left: -316px
    }

    header nav ul li .dropdown-menu2 {
        left: -556px
    }

    header nav ul li:hover .dropdown-menu {
        height: 480px;
        padding: 20px 0 0
    }

    header nav ul li .dropdown-menu .dropdown_inner .dropdown_left {
        padding: 1rem 0
    }

    header nav ul li .dropdown-menu .dropdown_inner .dropdown_left p {
        font-size: 12px;
        line-height: unset;
        margin: 10px 0
    }

    header nav ul li .dropdown-menu .dropdown_inner .dropdown_right {
        width: 30%;
        height: 470px
    }

    .banner::after {
        top: 50%;
        transform: translateY(-50%)
    }

    .banner .banner_left p {
        margin-top: 1rem
    }

    .section2.services-inner-pages-sec2,
    .section5 {
        padding: 50px 0
    }

    .section2 .sec2_right .sec2_circle {
        width: 400px;
        height: 400px
    }

    .section2 .sec2_right .sec2_box {
        width: 180px;
        height: 180px
    }

    .services-inner-pages-sec2 .sec2_right .sec2_box {
        width: 330px;
        height: 330px
    }

    .section2 .sec2_right .box1 {
        top: -60px
    }

    .section2 .sec2_right .box2 {
        right: 20px
    }

    .section2 .sec2_right .box3 {
        bottom: -60px
    }

    .section2 .sec2_right .box4 {
        left: 20px
    }

    .section3 .heading {
        font-size: 100px;
        bottom: -70px;
        left: 20px
    }

    .section3 .sec3_content::after {
        width: 105px;
        height: 85px;
        top: -150px
    }

    .section3 .sec3_content::before {
        width: 98px;
        height: 95px;
        left: 10px;
        bottom: -40px
    }

    .section4 .sec4_after {
        width: 680px;
        height: 327px
    }

    .connect-sec .connect-sec-before {
        width: 680px;
        height: 279px
    }

    .connect-sec .connect-sec-before img,
    .section4 .sec4_after img {
        width: 380px;
        height: 380px
    }

    .inner-pages-sec4::before {
        width: 220px;
        height: 141px
    }

    .inner-pages-sec4::after {
        width: 72px;
        height: 141px;
        top: 40px;
        right: 30px
    }

    .section5 .sec5_content p {
        margin: 1rem 0 !important
    }

    .section6 .sec6_content .sec6_left .nav-pills .nav-link span {
        font-size: 18px
    }

    .section6 .sec6_content .sec6_left .nav-pills .nav-link::after {
        width: 30px;
        height: 30px;
        font-size: 14px
    }

    .section6 .sec6_content .sec6_left .nav-pills .nav-link.active .nav-para {
        font-size: 12px;
        margin-top: 10px;
        height: 75px
    }

    .section7 .sec7_content ul li .box .testi_content .testi_body p {
        font-size: 13px;
        line-height: 20px;
        height: 90px
    }

    .section8 {
        padding: 100px 0
    }

    .section8 .before {
        width: 495px;
        height: 556px;
        bottom: -250px
    }

    .section8 .after {
        width: 295px;
        height: 538px;
        bottom: -150px
    }

    .section8 .sec8_content {
        margin-top: 1rem !important
    }

    .section8 .sec8_content .contact_form form input {
        height: 45px
    }

    .section8 .sec8_content .contact_form form textarea {
        height: 80px
    }

    .before_footer .bf_col1 p {
        font-size: 14px
    }

    .inner-pages-sec2::before {
        width: 580px;
        height: 400px;
        left: -15%
    }

    .inner-pages-sec2 .sec2_right::after {
        display: none
    }

    .services-page .sec3_content .twoD_box::before {
        left: -240px
    }

    .services-page .sec3_content .threeD_box::after {
        right: -240px
    }

    .spinx-connect h3.spinx-acco-title.current {
        font-size: 40px;
        line-height: 60px
    }

    .index-section-five .tab-content-item-bg {
        padding-top: 2rem
    }

    .location-slider-position .row {
        padding: 1rem 0 !important
    }

    .tab-content-item-bg {
        height: 600px
    }

    .tab-location-main-img {
        width: 280px;
        height: 280px
    }

    .section-2d-process::after {
        right: 200px
    }

    .inner-pages-sec3 .sec3_content .sec3_features_box ul li button,
    .inner-pages-sec3 .sec3_content .sec3_features_box ul li button.active {
        padding: 1rem
    }

    .career-sec3 .sec3_content .sec3_features_box ul li button.active .box .h1 {
        bottom: -40px;
        opacity: 1
    }

    .career-sec4 .sec4_content .box {
        padding: 1.5rem 1rem
    }

    .career-sec4 .sec4_content .box .box-img {
        height: 180px
    }
}

@media screen and (max-width:1366px) {

    .btn span,
    header nav ul li a {
        font-size: 14px
    }

    .btn {
        width: 160px;
        height: 45px;
        line-height: 45px
    }

    .btn span {
        font-weight: 500
    }

    p {
        font-size: 13px;
        line-height: 25px
    }

    header nav ul li .dropdown-menu {
        width: 1100px
    }

    header nav ul li .dropdown-menu1 {
        left: -327px
    }

    header nav ul li .dropdown-menu2 {
        left: -544px
    }

    header nav ul li {
        margin: 0 8px
    }

    .banner .banner_left {
        padding-top: 4rem
    }

    .section4 .sec4_after {
        width: 640px;
        height: 308px
    }

    .connect-sec .connect-sec-before img,
    .section4 .sec4_after img {
        width: 370px;
        height: 370px
    }

    .connect-sec .connect-sec-before {
        width: 640px;
        height: 262px
    }

    .services-page .sec3_content .twoD_box::before {
        left: -320px
    }

    .services-page .sec3_content .threeD_box::after {
        right: -320px
    }

    .services-inner-pages-sec2::before {
        width: 660px;
        height: 450px;
        top: 10%
    }

    .section-2d-process {
        padding: 50px 0 580px
    }

    .section-2d-process .sec-2d-process-content ul .slick-center .box {
        box-shadow: 0 0 10px 2px #000
    }

    .section-2d-process .sec-2d-process-content ul li .box {
        width: 405px;
        height: 450px;
        padding: 2rem
    }

    .section-2d-process .sec-2d-process-content ul li .box .box_img {
        width: 100%
    }

    .section7 {
        padding: 70px 0
    }

    .inner-pages-sec4::before {
        width: 160px;
        height: 101px
    }

    .inner-pages-sec4::after {
        width: 52px;
        height: 101px;
        top: 40px;
        right: 30px
    }

    .inner-pages-sec4 .sec4_content ul li:last-child {
        display: none
    }

    .blog_section .sec_content .box {
        height: 400px
    }

    .blog_section .sec_content .box .box_img {
        height: 200px
    }

    .blog_section .sec_content .box .box_body .h3 {
        font-size: 22px
    }
    .section-2d-process .sec-2d-process-content ul li .box .box_body p {
    height: 105px;
    overflow-y: scroll;
    overflow-x: hidden;
}
}

@media screen and (max-width:1199px) {

    .before_footer .bf_col3 ul li,
    p {
        line-height: 22px
    }

    .h1 {
        font-size: 45px
    }

    .h2,
    h2 {
        font-size: 35px
    }

    h3 {
        font-size: 30px
    }

    h4 {
        font-size: 24px
    }

    .inner-pages-sec3 .sec3_content .sec3_features_box ul li button .box .box_body h5,
    .tab-content-item-content h5,
    h5 {
        font-size: 20px
    }

    h6 {
        font-size: 16px
    }

    p {
        font-size: 12px
    }

    .btn {
        width: 130px;
        height: 35px;
        line-height: 35px
    }

    header {
        padding: 10px
    }

    header nav .navbar-brand {
        width: 180px
    }

    header nav ul li {
        margin: 0 5px
    }

    .btn span,
    header nav ul li a {
        font-size: 13px
    }

    header nav ul li .dropdown-menu {
        width: 930px
    }

    header nav ul li .dropdown-menu1 {
        left: -261px
    }

    header nav ul li .dropdown-menu2 {
        left: -448px
    }

    header nav ul li:hover .dropdown-menu {
        height: 330px;
        padding: 10px 0 0
    }

    header nav ul li .dropdown-menu .dropdown_inner {
        padding: 0 0 0 20px
    }

    header nav ul li .dropdown-menu .dropdown_inner .dropdown_left {
        width: 68%;
        padding: 20px 0
    }

    header nav ul li .dropdown-menu .dropdown_inner .dropdown_left p {
        display: none
    }

    header nav ul li .dropdown-menu .dropdown_inner .dropdown_left ul {
        height: 230px
    }

    header nav ul li .dropdown-menu .dropdown_inner .dropdown_right {
        width: 30%;
        height: 330px
    }

    .banner::after {
        width: 600px;
        height: 410px
    }

    .section2 .sec2_right::after {
        width: 80px;
        height: 55px;
        top: 50%
    }

    .section2 .sec2_right .sec2_circle {
        width: 360px;
        height: 360px
    }

    .section2 .sec2_right .sec2_box {
        width: 150px;
        height: 150px
    }

    .section2 .sec2_right .box1 {
        top: -40px
    }

    .section2 .sec2_right .box2 {
        right: 10px
    }

    .section2 .sec2_right .box3 {
        bottom: -40px
    }

    .section2 .sec2_right .box4 {
        left: 10px
    }

    .before_footer .bf_col3 ul li a,
    .pricing-section .pricing-content ul li .box h3 del,
    .section2 .sec2_right .sec2_box .box_item h6,
    .tab-content-item-content ul li a {
        font-size: 14px
    }

    .section3 {
        padding: 50px 0
    }

    .section3 .heading {
        font-size: 80px;
        bottom: -60px
    }

    .section3 .sec3_top::before {
        width: 70%;
        height: 140px;
        top: -40px
    }

    .connect-sec .connect-sec-before img,
    .section3 .sec3_content .sec3_box ul li,
    .section4 .sec4_after img {
        width: 300px;
        height: 300px
    }

    .section3 .sec3_content::before {
        width: 68px;
        height: 65px
    }

    .section3 .sec3_content::after {
        width: 65px;
        height: 55px;
        top: -100px
    }

    .section4 {
        padding: 80px 0
    }

    .section4 .sec4_after {
        width: 500px;
        height: 241px;
        top: 50%;
        transform: translateY(-50%)
    }

    .connect-sec .connect-sec-before {
        width: 500px;
        height: 205px
    }

    .section6 {
        padding: 70px 0;
        background-color: #f8f8f8
    }

    .section6 .sec6_content {
        margin-top: 2rem
    }

    .section6 .sec6_content .sec6_left .nav-pills .nav-link span {
        font-size: 15px
    }

    .section6 .sec6_content .sec6_left .nav-pills .nav-link::after {
        width: 25px;
        height: 25px;
        font-size: 10px
    }

    .section7 .sec7_content ul li .box {
        width: 480px;
        height: 180px
    }

    .section7 .sec7_content ul li .box .testi_content .testi_header img {
        width: 25px
    }

    .section7 .sec7_content ul li .box .testi_content .testi_body p {
        font-size: 11px;
        line-height: 15px;
        height: 60px
    }

    .section8 .before {
        width: 400px;
        height: 446px;
        bottom: -200px
    }

    .section8 .after {
        width: 195px;
        height: 358px;
        bottom: -50px
    }

    .section8 .sec8_content .contact_form form input {
        height: 35px;
        font-size: 14px
    }

    .before_footer::before {
        width: 80%;
        height: 100px;
        top: 20px
    }

    .before_footer::after {
        width: 50px;
        height: 47px;
        bottom: 0;
        left: 20px
    }

    .before_footer p {
        font-size: 12px !important
    }

    .before_footer .bf_col2 p {
        margin-bottom: 30px
    }

    .inner-pages-sec2 .sec2_right img.tilt {
        width: 70%
    }

    .inner-pages-sec3 .sec3_content::after {
        bottom: -30px;
        top: unset
    }

    .inner-pages-sec3 .sec3_content .sec3_features_box ul li button .box .box_img {
        height: 120px
    }

    .inner-pages-sec3 .sec3_content .sec3_features_box ul li button .box .box_img img {
        width: 100%;
        height: 100%;
        object-fit: contain
    }

    .inner-pages-sec4::before {
        width: 100px;
        height: 60px
    }

    .inner-pages-sec4::after {
        width: 40px;
        height: 76px;
        top: 20px
    }

    .tab-content-item-bg {
        height: 580px
    }

    .tab-location-main-img {
        width: 250px;
        height: 250px
    }

    .inner-pages-sec2::before {
        width: 450px;
        height: 310px
    }

    .services-inner-pages-sec2 .sec2_right .sec2_box {
        width: 295px;
        height: 295px
    }

    .services-page .sec3_content {
        margin-top: 1rem;
        overflow: hidden
    }

    .services-page .sec3_content .twoD_box::before {
        width: 860px;
        height: 480px;
        left: -320px
    }

    .services-page .sec3_content .threeD_box::after {
        width: 860px;
        height: 480px;
        right: -320px
    }

    .connect-sec,
    .pricing-section {
        padding: 60px 0
    }

    .spinx-connect:before {
        left: 24px
    }

    .spinx-connect h3.spinx-acco-title.current {
        font-size: 30px;
        line-height: unset
    }

    .spinx-connect h3.spinx-acco-title i {
        width: 49px
    }

    .spinx-connect .spinx-acco-content {
        padding: 5px 0 10px 80px
    }

    .spinx-connect p {
        margin-bottom: 0
    }

    .spinx-connect h3.spinx-acco-title.current i {
        background: #9e68df;
        width: 50px;
        height: 50px
    }

    .spinx-connect h3.spinx-acco-title.current .icn-connect:before {
        height: 30px;
        width: 30px
    }

    .spinx-connect h3.spinx-acco-title.current .icn-create:before {
        height: 25px;
        width: 17px
    }

    .spinx-connect h3.spinx-acco-title.current .icn-evolve:before {
        height: 15px;
        width: 28px
    }

    .spinx-connect h3.spinx-acco-title.current .icn-touch:before {
        height: 25px;
        width: 25px
    }

    .career-sec4 .sec4_content .box .box-img {
        height: 120px;
        width: 100%
    }

    .pricing-section .pricing-top::before {
        width: 80%;
        height: 130px
    }

    .pricing-section .pricing-content ul li .box {
        padding: 2rem
    }

    .blog_section .sec_content .box .box_body .h3,
    .pricing-section .pricing-content ul li .box h6 {
        font-size: 18px
    }

    .pricing-section .pricing-content ul li .box ul {
        height: 185px;
        margin: 20px 0 !important
    }

    .pricing-section .pricing-content ul li .box ul li {
        font-size: 12px;
        margin-bottom: 8px
    }

    .section-2d-process::after {
        right: 80px
    }

    .section-2d-process .sec-2d-process-content ul li .box {
        width: 310px;
        height: 400px;
        padding: 1rem
    }

    .section-2d-process .sec-2d-process-content ul li .box .box_img {
        width: 100%;
        height: 150px
    }

    .video-testimonial .video-left p {
        padding: 10px 30px 10px 0;
        font-size: 15px
    }

    .blog_section .sec_content .box {
        height: 360px
    }

    .blog_section .sec_content .box .box_img {
        height: 180px
    }
}

@media screen and (max-width:991px) {

    .mobile_header,
    .navbar-scroll {
        -webkit-transition: left .5s cubic-bezier(.6, .05, .28, .91);
        transition: left .5s cubic-bezier(.6, .05, .28, .91)
    }

    .btn {
        width: 120px;
        height: 35px;
        line-height: 35px
    }

    .h1 {
        font-size: 40px
    }

    .h2,
    h2 {
        font-size: 30px
    }

    h3 {
        font-size: 25px
    }

    h4 {
        font-size: 20px
    }

    .banner::after,
    header {
        display: none
    }

    .mobile_header {
        display: block;
        position: absolute;
        width: 100%;
        z-index: 999
    }

    .navbar-scroll {
        position: fixed;
        background: #373737
    }

    .mobile_header #box #items .dropdown,
    .mobile_header .navbar {
        position: relative
    }

    .mobile_header .navbar .navbar-header img {
        width: 180px
    }

    .mobile_header .navbar .d-block #btn {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        right: 30px;
        cursor: pointer;
        -webkit-transition: left .5s cubic-bezier(.6, .05, .28, .91);
        transition: left .5s cubic-bezier(.6, .05, .28, .91);
        z-index: 99
    }

    .mobile_header .navbar .d-block #btn div {
        width: 30px;
        height: 2px;
        border-radius: 15px;
        margin-bottom: 5px;
        background-color: #fff !important;
        -webkit-transition: -webkit-transform .5s cubic-bezier(.6, .05, .28, .91), opacity .5s, box-shadow 250ms, background-color .5s;
        transition: transform .5s cubic-bezier(.6, .05, .28, .91), opacity .5s, box-shadow 250ms, background-color .5s
    }

    .mobile_header .navbar .d-block #btn.active div {
        background-color: #fff !important
    }

    .mobile_header .navbar .d-block #btn.active:hover>div {
        box-shadow: 0 0 1px #343838
    }

    .mobile_header .navbar .d-block #btn.active #top {
        -webkit-transform: translateY(10px) rotate(-135deg);
        -ms-transform: translateY(10px) rotate(-135deg);
        transform: translateY(10px) rotate(-135deg)
    }

    .mobile_header .navbar .d-block #btn.active #middle {
        -webkit-transform: scale(0);
        -ms-transform: scale(0);
        transform: scale(0)
    }

    .mobile_header .navbar .d-block #btn.active #bottom {
        -webkit-transform: translateY(-4px) rotate(-45deg);
        -ms-transform: translateY(-4px) rotate(-45deg);
        transform: translateY(-4px) rotate(-45deg)
    }

    .mobile_header .navbar .d-block #btn #bottom {
        margin-bottom: 0
    }

    .mobile_header #box {
        position: fixed;
        overflow: auto;
        top: 0;
        right: -350px;
        width: 320px;
        opacity: 0;
        padding: 2rem;
        display: flex;
        justify-content: center;
        flex-direction: column;
        height: 100%;
        background: url("../images/pricing/price-bg.webp") #323232;
        -webkit-transition: 350ms cubic-bezier(.6, .05, .28, .91);
        transition: 350ms cubic-bezier(.6, .05, .28, .91);
        z-index: 11
    }

    .mobile_header #box.active {
        right: 0;
        opacity: 1
    }

    .mobile_header #box #items {
        padding: 0;
        margin: 0
    }

    .mobile_header #box #items .item {
        margin-bottom: 5px;
        cursor: pointer;
        -webkit-transition: 250ms;
        transition: 250ms
    }

    .mobile_header #box #items .item .nav-link {
        font-size: 16px;
        color: #fff;
        text-transform: uppercase;
        padding: 0;
        margin: 0;
        display: inline-block
    }

    .mobile_header #box #items .dropdown .dropdown_anchor {
        margin: 0;
        position: absolute;
        top: 0;
        right: 10px
    }

    .mobile_header #box #items .dropdown .dropdown_anchor i {
        font-size: 18px;
        color: #fff
    }

    .mobile_header #box #items .dropdown .items_links {
        padding: 0 0 0 20px;
        margin: 0;
        height: 0;
        overflow: auto;
        transition: .4s linear
    }

    .mobile_header #box #items .dropdown.active .items_links {
        height: 165px
    }

    .mobile_header #box #items .item .items_links::-webkit-scrollbar {
        width: 5px
    }

    .mobile_header #box #items .item .items_links li {
        display: flex;
        align-items: center;
        margin-bottom: 10px
    }

    .mobile_header #box #items .item .items_links li img {
        filter: invert(1);
        margin-right: 10px;
        object-fit: contain
    }

    .mobile_header .btn {
        margin: 0 !important;
        padding: 0
    }

    .banner {
        height: 50vh;
        padding: 0
    }

    .section2,
    .section4,
    .section6,
    .section7 {
        padding: 50px 0
    }

    .section2 .sec2_right .sec2_circle {
        width: 260px;
        height: 260px
    }

    .section2 .sec2_right .sec2_box {
        width: 120px;
        height: 120px
    }

    .section2 .sec2_right .sec2_box .box_item h6 {
        font-size: 11px;
        bottom: 8px
    }

    .section2 .sec2_right::after {
        width: 50px;
        height: 35px
    }

    .section3 .sec3_top::before {
        width: 70%;
        height: 110px
    }

    .section3 .sec3_content {
        margin-top: 1rem !important
    }

    .section3 .sec3_content .sec3_box,
    .section7 .sec7_content {
        margin-top: 2rem
    }

    .section3 .sec3_content .sec3_box ul li {
        width: 200px;
        height: 200px
    }

    .section3 .heading {
        font-size: 65px;
        bottom: -50px
    }

    .section3 .sec3_content::before {
        width: 50px;
        height: 50px
    }

    .section3 .sec3_content::after {
        width: 50px;
        height: 45px;
        top: -50px
    }

    .section4 .sec4_after {
        width: 390px;
        height: 188px
    }

    .section4 .sec4_after img {
        width: 240px;
        height: 240px;
        transform: translateY(-30px)
    }

    .connect-sec .connect-sec-before {
        width: 390px;
        height: 161px
    }

    .connect-sec .connect-sec-before img {
        width: 240px;
        height: 240px
    }

    @keyframes sec4_animate {

        0%,
        100% {
            transform: translateY(-30px)
        }

        50% {
            transform: translateY(-40px)
        }
    }

    .section6 .sec6_content .sec6_left .nav-pills .nav-link span {
        font-size: 13px
    }

    .section6 .sec6_content .sec6_left .nav-pills .nav-link.active .nav-para {
        font-size: 11px;
        margin-top: 5px;
        height: 70px
    }

    .section8 {
        padding: 80px 0 40px;
        background-position: center
    }

    .section8 .before {
        width: 320px;
        height: 366px;
        bottom: -170px
    }

    .section8 .after {
        width: 145px;
        height: 268px;
        bottom: -50px
    }

    .section8 .sec8_content .contact_form form input {
        height: 30px;
        font-size: 12px
    }

    .section8 .sec8_content .contact_form form textarea {
        height: 65px;
        font-size: 12px
    }

    .before_footer::before {
        width: 80%;
        height: 80px;
        top: 20px
    }

    .before_footer .bf_col h5 {
        font-size: 16px
    }

    .before_footer .bf_col2 p i {
        font-size: 10px;
        margin-right: 5px
    }

    .before_footer .bf_col3 ul li a {
        font-size: 12px
    }

    .inner-pages-sec3 .sec3_content .sec3_features_box ul li {
        width: 32%;
        margin-bottom: 12px
    }

    .inner-pages-sec4::after {
        width: 40px;
        height: 76px
    }

    .inner-pages-sec4 .sec4_content ul li {
        width: 15%
    }

    .inner-pages-sec4 .sec4_content ul li img {
        height: 50px
    }

    .tab-location-main-img {
        width: 160px;
        height: 160px
    }

    .tab-content-item-bg {
        height: 510px
    }

    .services-page .sec3_content .twoD_box::before {
        width: 770px;
        height: 450px;
        left: -320px
    }

    .services-page .sec3_content .motion-graphics::before {
        width: 660px;
        height: 360px;
        left: -230px
    }

    .services-page .sec3_content .threeD_box::after {
        width: 600px;
        height: 340px;
        right: -190px;
        top: -35px
    }

    .services-page .sec3_content .visualization::after {
        width: 500px;
        height: 280px;
        right: -80px;
        top: 45px
    }

    .services-page .sec3_content .infographics::after {
        width: 500px;
        height: 280px;
        right: -80px;
        top: 10px
    }

    .services_box.twoD_box.cgi-vfx .services-content .btn {
        width: 100px
    }

    .services_box.twoD_box.cgi-vfx .services-content .btn.btn-2 {
        margin: 0 5px 0 0 !important
    }

    .spinx-connect h3.spinx-acco-title i,
    .spinx-connect h3.spinx-acco-title.current i {
        width: 50px;
        height: 50px;
        margin-right: 15px
    }

    .spinx-connect .spinx-acco-content {
        padding: 5px 0 10px 65px
    }

    .spinx-connect h3.spinx-acco-title.current {
        font-size: 25px;
        line-height: 45px
    }

    .career-sec4 .sec4_content .box .box-body p {
        height: 100px;
        margin: 15px 0 !important;
        line-height: 20px
    }

    .pricing-section .pricing-content ul li .box {
        padding: 1rem
    }

    .pricing-section .pricing-content ul li .box ul li {
        font-size: 12px;
        margin-bottom: 5px;
        display: flex
    }

    .terms-page {
        height: 25vh;
        padding: 0
    }

    .video-testimonial {
        padding: 40px 0
    }

    .video-testimonial .video-left {
        width: 50%;
        height: 300px;
        margin: 0 auto
    }

    .blog_section .sec_content .box {
        width: 100%;
        height: 400px
    }
}

@media screen and (max-width:767px) {

    .floating-form-wrap{
        display: none !important;
    }

    .h1,
    h3 {
        letter-spacing: 1px
    }

    .h1 {
        font-size: 35px
    }

    .h2,
    h2 {
        font-size: 25px;
        letter-spacing: 1px !important
    }

    h3 {
        font-size: 20px
    }

    .banner {
        height: fit-content;
        padding: 60px 0
    }

    .banner .banner_left .badges ul,
    .before_footer::after,
    .career-sec3 .sec3_content .sec3_features_box ul li button.active .box .h1,
    .inner-pages-sec2::before,
    .inner-pages-sec3 .sec3_content .sec3_features_box ul li button .box .box_img,
    .inner-pages-sec4::after,
    .inner-pages-sec4::before,
    .section2 .sec2_right,
    .section8 .after,
    .section8 .before,
    .services-page .sec3_content .threeD_box::after,
    .services-page .sec3_content .twoD_box::before {
        display: none
    }

    .section2 .sec2_right {
        margin: 5rem 0 2rem
    }

    .section2 .sec2_right .sec2_circle {
        width: 320px;
        height: 320px
    }

    .section2 .sec2_right .sec2_box {
        width: 140px;
        height: 140px
    }

    .section2 .sec2_right .box2 {
        right: 40px
    }

    .section2 .sec2_right .box4 {
        left: 40px
    }

    .section2 .sec2_right::after {
        width: 70px;
        height: 48px
    }

    .section3 .heading {
        font-size: 55px;
        bottom: -40px
    }

    .section3 .sec3_top::before {
        width: 100%;
        height: 80px
    }

    .section3 .sec3_content::before {
        width: 70px;
        height: 70px
    }

    .section3 .sec3_content::after {
        width: 70px;
        height: 55px;
        top: -50px;
        right: 10px
    }

    .section3 .sec3_content .sec3_box ul li {
        width: 45%;
        height: unset
    }

    .section4 {
        padding: 300px 0 50px
    }

    .section4 .sec4_after {
        width: 390px;
        height: 188px;
        top: 60px;
        transform: translateY(0)
    }

    .connect-sec .connect-sec-before {
        width: 390px;
        height: 160px;
        top: 60px;
        transform: translateY(0)
    }

    .blog_section .sec_content,
    .sec6_right {
        margin-top: 2rem
    }

    .section7 .sec7_content ul li .box {
        width: 90%;
        height: 140px
    }

    .section8 .sec8_content .contact_form form input {
        height: 35px;
        font-size: 14px
    }

    .section8 .sec8_content .contact_form form textarea {
        height: 85px;
        font-size: 14px
    }

    .before_footer::before {
        width: 100%;
        height: 50px;
        top: 20px
    }

    .before_footer .bf_col1 .h2 {
        margin: 10px 0 !important
    }

    .before_footer .bf_col,
    .before_footer .bf_col1 {
        padding: 0 0 50px
    }

    .before_footer .bf_col h5 {
        font-size: 25px;
        margin-bottom: 10px
    }

    .before_footer p {
        font-size: 14px !important
    }

    .before_footer .bf_col3 ul li a {
        font-size: 14px
    }

    .before_footer .bf_col2 p:last-child {
        margin: 0
    }

    .before_footer .row .col-sm-12:last-child .bf_col {
        padding: 0
    }

    .footer {
        padding: 10px 0
    }

    .blog_section .sec_top .h2,
    .case-study-inner-sec1,
    .footer p,
    .services-page .sec3_content .services_box .services-content {
        text-align: center
    }

    .section2::after {
        background-size: cover
    }

    .inner-pages-sec2 .sec2_right img.tilt {
        width: 100%
    }

    .inner-pages-sec3 .sec3_content .sec3_features_box ul,
    .services-page .sec3_content .services_box .services-content .combo_btn {
        justify-content: center
    }

    .inner-pages-sec3 .sec3_content .sec3_features_box ul li {
        width: 48%;
        margin: 2px
    }

    .inner-pages-sec3 .sec3_content .sec3_features_box ul li button,
    .inner-pages-sec3 .sec3_content .sec3_features_box ul li button.active {
        padding: 10px
    }

    .inner-pages-sec3 .sec3_content .sec3_features_box .tab-content {
        text-align: center;
        margin-top: 2rem
    }

    .inner-pages-sec4 {
        padding: 50px 0
    }

    .inner-pages-sec4 .sec4_content ul li {
        width: 15%;
        margin: 10px
    }

    .inner-pages-sec4 .sec4_content ul li img {
        height: 50px
    }

    .tab-content-item-bg {
        height: 450px
    }

    .location-slider-position {
        position: absolute;
        bottom: 0;
        z-index: 99;
        right: 0;
        left: 0;
        top: 150px
    }

    .services-page .sec3_content .services_box.threeD_box .row {
        flex-direction: column-reverse
    }

    .services-page .sec3_content .services_box .services-img {
        width: 100%;
        margin: 0 auto 5rem;
        background: #9e68df;
        box-shadow: 0 0 25px 30px #9e68df;
        text-align: center
    }

    .services-page .sec3_content .services_box .services-img img {
        width: 70%
    }

    .connect-sec {
        padding: 340px 0 10px
    }

    .career-sec4 .sec4_content .box {
        height: unset;
        width: 80%;
        margin: 0 auto
    }

    .career-sec4 .sec4_content .box .box-body p {
        height: unset
    }

    .pricing-section .pricing-content ul {
        flex-direction: column
    }

    .pricing-section .pricing-content ul li {
        width: 80%;
        margin: 20px auto
    }

    .pricing-section .pricing-content ul li .box {
        padding: 2rem
    }

    .services-inner-pages-sec2 .sec2_right .sec2_box {
        width: 260px;
        height: 260px
    }

    .section-2d-process {
        padding: 50px 0 500px
    }

    .section-3d-process::after {
        width: 90px;
        height: 100px;
        right: 0
    }

    .section-2d-process::after {
        width: 90px;
        height: 79px;
        right: 0;
        filter: invert(1);
        top: 10px;
        object-fit: contain
    }

    .section-2d-process::before {
        width: 100%;
        height: 100%
    }

    .section-2d-process .sec-2d-process-content ul li .box {
        width: 90%;
        height: unset;
        padding: 2rem
    }

    .section-2d-process .sec-2d-process-content ul .slick-center .box {
        transform: scale(1.065);
        box-shadow: 0 0 15px 0 #00000036
    }

    .banner .banner_left img {
        width: 200px;
        margin: 0 auto;
        display: block
    }

    .case-study-inner-sec2,
    .case-study-inner-sec3 {
        padding: 40px 0
    }

    .case-study-inner-sec2 .sec2-video .overlay img {
        width: 70px
    }

    .case-study-inner-sec2 .sec2-content {
        padding-top: 2rem
    }

    .video-testimonial .video-left {
        width: 60%;
        height: 300px
    }

    .video-testimonial .video-left p {
        padding: 10px 20px 10px 0;
        font-size: 12px !important
    }

    .video-testimonial .video-left p a {
        width: 40px;
        height: 40px;
        margin-left: 20px
    }

    .video-testimonial .video-left p a i {
        font-size: 16px
    }

    .blog_section .sec_top .sec_top_right {
        text-align: center !important
    }

    .blog_section .sec_content .box {
        width: 70%;
        height: unset;
        margin: 0 auto 20px
    }
}

@media screen and (max-width:480px) {
    .h1 {
        font-size: 25px
    }

    .h2,
    h2 {
        font-size: 20px
    }

    h3 {
        font-size: 18px
    }

    h4 {
        font-size: 16px
    }

    .inner-pages-sec3 .sec3_content .sec3_features_box ul li button .box .box_body h5,
    .tab-content-item-content h5,
    h5 {
        font-size: 14px
    }

    .btn {
        width: 100px;
        height: 30px;
        line-height: 30px
    }

    .btn span,
    .thank-section .jumbotron p {
        font-size: 12px
    }

    .section2 .sec2_right .sec2_circle {
        width: 220px;
        height: 220px
    }

    .section2 .sec2_right .sec2_box,
    .tab-location-main-img {
        width: 120px;
        height: 120px
    }

    .section2 .sec2_right::after {
        width: 50px;
        height: 34px
    }

    .section2 .sec2_right .box2 {
        right: -10px
    }

    .section2 .sec2_right .box4 {
        left: -10px
    }

    .section3 .heading {
        font-size: 45px;
        bottom: -35px
    }

    .section3 .sec3_content::before {
        width: 40px;
        height: 40px
    }

    .section3 .sec3_content::after {
        width: 40px;
        height: 35px
    }

    .section3 .sec3_content .sec3_box ul li {
        width: 45%;
        height: 150px
    }

    .section4 {
        padding: 250px 0 50px
    }

    .connect-sec .connect-sec-before,
    .section4 .sec4_after {
        width: 320px;
        height: 154px
    }

    .connect-sec .connect-sec-before img,
    .section4 .sec4_after img {
        width: 200px;
        height: 200px
    }

    .section7 .sec7_content ul .slick-slide {
        margin-top: 70px
    }

    .section7 .sec7_content ul li .box {
        width: 95%;
        height: unset;
        border-radius: 4px;
        overflow: visible;
        flex-direction: column;
        padding: 2rem 1rem 1.5rem;
        position: relative
    }

    .section7 .sec7_content ul li .box .testi-video {
        border: 6px solid #fff0f1
    }

    .section7 .sec7_content ul li .box .testi-img {
        border: 6px solid #f1f1f1
    }

    .section7 .sec7_content ul li .box .testi_img {
        width: 120px;
        height: 120px;
        position: absolute;
        top: -60px;
        right: 0;
        border-radius: 50%
    }

    .section7 .sec7_content ul li .box .testi_content {
        width: 100%;
        padding: 0
    }

    .inner-pages-sec3 .sec3_content::after {
        bottom: -30px;
        top: unset
    }

    .inner-pages-sec4 .sec4_content ul li {
        width: 25%;
        margin: 10px
    }

    .tab-content-item-bg {
        height: 400px
    }

    .spinx-connect h3.spinx-acco-title,
    .spinx-connect h3.spinx-acco-title.current {
        font-size: 16px;
        line-height: 55px
    }

    .pricing-section .pricing-content ul li {
        width: 90%;
        margin: 20px auto
    }

    .pricing-section .pricing-content ul li .box ul li {
        align-items: center
    }

    .services-inner-pages-sec2 .sec2_right {
        margin: 2rem 0 1rem
    }

    .services-inner-pages-sec2 .sec2_right .sec2_circle {
        width: 300px;
        height: 300px
    }

    .services-inner-pages-sec2 .sec2_right .sec2_box {
        width: 245px;
        height: 245px
    }

    .section-2d-process .sec-2d-process-content ul li .box .box_body p {
        font-size: 12px;
        color: #fff
    }

    .pricing-section {
        padding: 60px 0 10px
    }

    .section-2d-process .sec-2d-process-content ul li .box .box_img {
        width: 100%;
        height: 100px
    }

    .cgi-vfx-sec4 .sec4_top p,
    .thank-section .jumbotron {
        padding: 0
    }

    .connect-sec {
        padding: 250px 0 10px
    }

    .inner-pages-sec4 {
        padding: 50px 0
    }

    .thank-section .jumbotron .btn {
        margin: 5px
    }

    .video-testimonial .video-left {
        width: 80%;
        height: 300px
    }

    .video-testimonial .video-right p::before {
        font-size: 30px;
        top: -50px
    }

    .video-testimonial .video-right p::after {
        font-size: 30px;
        bottom: -50px
    }

    .blog_section .sec_content .box {
        width: 100%
    }

    .blog_section .sec_content .box .box_img {
        height: 180px
    }

    .blog_section .box .box_body .blog-icon {
        width: 50px;
        height: 50px;
        top: -25px
    }

    .blog_section .sec_content .box .box_body .h3 {
        font-size: 17px
    }
}