/* Mobile */
@media (max-width: 320px){
    .mobile-brand p {
        font-size: 30px!important;
    }

    .home-header img {
        width: 90%!important;
    }

    .home-header {
        padding: 25% 0 5% 0!important;
    }

    .outsource {
        background-position: bottom center;
        padding: 14% 0!important;
    }

    .outsource .row {
        height: 430px!important;
    }
    .home-intro-services.expertise {
        min-height: 830px !important;
        padding: 20px 13px!important;
        height: min-content;
    }
    .background-block {
        padding: 20px 10px!important;
    }

    .service-body img {
        border-radius: 5px;
        margin-top: 30px;
    }
}
@media (min-width: 500px) and (max-width: 766px){
    .about-header, .projects-header, .contact-header, .blog-header {
        padding: 15% 0 5% 0!important;
    }

    .services-header {
        padding: 18% 0 2% 0!important;
    }
}
@media (max-width: 767px){
    .mt-lg-n5 {
        margin-top: 5% !important;
    } 

    p, dt, dd, li, a {
        font-size: 17px;
    }

    .h3, h3 {
        font-size: 25px;
    }

    .btn-primary {
        padding: 5px 10px;
    }

    .navbar-toggler i {
        font-size: 30px;
        font-weight: 400;
    }

    .navbar-toggler {
        padding: 0 20px;
        font-size: 20px;
        line-height: 1;
        color: #0D3457;
        background-color: transparent;
        border: 0;
    }

    .navbar-toggler img {
        width: 25px;
    }

    .services-pages .navbar-toggler {
        padding: 0 20px;
        font-size: 30px;
        line-height: 1;
        color: #fff;
        background-color: transparent;
        border: 0;
    }

    .navbar-toggler:focus {
        text-decoration: none;
        outline: 0;
        box-shadow: none;
    }

    .navbar-nav {
        display: flex;
        flex-direction: column;
        padding: 20px;
        margin-bottom: 0;
        list-style: none;
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        background-color: #f6faff;
        box-shadow: none;
        z-index: 99999;
        box-shadow: 0px 9px 6px -5px #ccc;
        max-height: 500px;
        overflow-y: auto;
    }

    .navbar-nav .nav-item {
        padding: 10px 0;
    }

    .nav-item a {
        color: #01121F !important;
        padding: 10px 20px 10px 25px!important;
    }

    .navbar-nav .btn-primary {
        margin-top: 20px;
        color: #fff!important;
        padding-top: 10px !important;
    }

    .services-pages .nav-item .btn-primary.solid {
        background-color: #0069ff !important;
        color: #fff !important;
        border: 2px solid #0069ff;
    }

    .service-body img {
        border-radius: 5px;
        margin-top: 30px;
    }

    .nav-link {
        padding: 0;
    }

    .nav-link i {
        padding-left: 10px;
    }

    .multi-dropdowns .dropdown-toggle>i {
        float: none;
        padding-left: 0;
        font-size: 15px;
    }

    .navbar-nav .nav-link.show {
        text-align: center;
    }

    .navbar-nav .dropdown-menu a {
        padding: 0px 20px 5px 25px !important;
    }

    .dropdown {
        display: block;
    }

    .dropdown-menu {
        position: static;
        top: 0;
        left: 0;
        border-radius: 0;
        border: 0;
        min-width: 100%;
        padding: 10px 0 10px 0px;
        right: 0;
        margin: 0 auto;
        box-shadow: none!important;
        text-align: center;
    }

    .dropdown {
        position: relative!important;
        display: flow-root!important;
        padding: 0px!important;
        font-size: 18px!important;
        text-align: center!important;
    }

    .dropdown-menu .dropdown-toggle i, .dropdown-submenu i {
        float: none;
        margin-right: 0px;
        font-size: 20px;
    }

    .dropdown-menu[data-bs-popper] {
        top: auto;
        left: 0;
        background-color: transparent;
    }

    .dropdown-menu {
        position: static;
        top: 0;
        left: 0;
        border-radius: 0;
        border: 0;
        /* min-width: 100%; */
        padding: 0px;
        right: 0;
        margin: 0 auto;
        box-shadow: none!important;
        text-align: center;
        background-color: transparent;
    }

    .dropdown-menu .dropdown-submenu {
        top: 100% !important;
        left: 0 !important;
        position: static !important;
        buffered-rendering: static;
        background-color: transparent;
        text-align: center;
        border-top: 0;
        border-radius: 0;
        margin-top: 0;
        display: block;
    }

    .submenu {
        border-top: 1px solid #000;
        border-bottom: 1px solid #000;
        background-color: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
    }

    .mobile-brand {
        display: inline-block!important;
    }

    .mobile-brand p {
        font-size: 30px;
        margin-bottom: 0;
        line-height: 25px;
    }

    .navbar-brand, .service-body br {
        display: none;
    }

    .about-header, .service-body, .projects-header {
        padding: 5% 0 10% 0;
    }

    .whoweare, .home-webdesign, .values, .what-cost, .about, .benefit, .branding-portfolio, .xero, .projects, .contact-details, .home-portfolio, .technologies {
        padding: 10% 0;
    }

    .examples {
        padding-bottom: 10%;
        padding-top: 10%;
    }
    
    .convert{
        padding-bottom: 10%;
        background-color: #01121f;
        color: #fff;
        padding-top: 10%;
    }

    .app-dev-features, .email-marketing, .blog-main {
        padding-top: 10%;
    }

    .services-header {
        /* height: 330px; */
        height: auto;
    }

    .wsh-header {
        /* background-image: url('https://files.crtgroupstorage.com/crtwebsite/services/hosting-mobi-header.jpg'); */
        padding: 20% 0 7% 0;
    }
    
    .gd-header {
        /* background-image: url('https://files.crtgroupstorage.com/crtwebsite/services/xero-header.jpg'); */
        padding: 20% 0 7% 0;
    }
    
    .ewd-header{
        /* background-image: url('https://files.crtgroupstorage.com/crtwebsite/services/ecommerce-mobi-header.jpg'); */
        padding: 20% 0 7% 0;
    }
    
    .wd-header {
        /* background-image: url('https://files.crtgroupstorage.com/crtwebsite/services/webdesign-mobi-header.jpg'); */
        padding: 20% 0 7% 0;
    }
    
    .csd-header {
        /* background-image: url('https://files.crtgroupstorage.com/crtwebsite/services/software-mobi-header.jpg'); */
        padding: 20% 0 7% 0;
    }
    
    .sm-header {
        /* background-image: url('https://files.crtgroupstorage.com/crtwebsite/services/digital-marketing-mobi-header.jpg'); */
        padding: 20% 0 7% 0;
    }
    
    .seo-header {
        /* background-image: url('https://files.crtgroupstorage.com/crtwebsite/services/seo-mobi-header.jpg'); */
        padding: 20% 0 7% 0;
    }
    
    .mad-header {
        /* background-image: url('https://files.crtgroupstorage.com/crtwebsite/services/mobile-app-mobi-header.jpg'); */
        padding: 20% 0 7% 0;
    }
    
    .cxi-header, .en-header {
        /* background-image: url('https://files.crtgroupstorage.com/crtwebsite/services/xero-mobi-header.jpg'); */
        padding: 20% 0 7% 0;
    }
    
    .bes-header {
        /* background-image: url('https://files.crtgroupstorage.com/crtwebsite/services/business-email-mobi-header.jpg'); */
        padding: 10% 0 10% 0;
    }
    
    .bd-header, .uxd-header, .wi-header {
        /* background-image: url('https://files.crtgroupstorage.com/crtwebsite/services/branding-design-mobi-header.jpg'); */
        padding: 20% 0 7% 0;
    }

    .softservv-logo {
        width: 80%;
        height: auto;
    }

    .services-header h1 {
        font-size: 30px;
    }

    .services-header p>br {
        display: none;
    }

    .services-pages .mobi-services-bars {
        display: block!important;
    }

    .mobi-bars {
        display: none;
    }

    .services-pages .navbar-brand {
        display: none;
    }

    .policy {
        padding: 30% 0 5% 0;
    }

    /* Home */
    .page-heading {
        font-size: 25px;
    }

    .home-header p {
        font-size: 17px;
    }

    .page-heading>br, .home-header p>br {
        display: none;
    }

    .home-header {
        text-align: center;
        padding: 20% 0 5% 0;
    }

    .home-header img {
        width: 80%;
    }

    .silver-partner {
        width: 60%;
    }

    .home-cards {
        text-align: center;
    }

    .home-intro-services {
        background-image: url('https://files.crtgroupstorage.com/crtwebsite/2025/home%20header%20background%20mobile.jpg')!important;
        padding: 60px 20px;
        height: 450px;
    }

    .home-intro-services.expertise {
        background-image: url('https://files.crtgroupstorage.com/crtwebsite/2025/technical%20expertise%20mobile.jpg') !important;
        background-position: bottom;
        min-height: 620px!important;
        height: max-content;
        padding: 30px 20px;
    }

    .customize-tools {
        top: 92%!important;
    }

    .customize-tools #customize-controls .prev {
        left: 35%!important;
    }

    .customize-tools #customize-controls .next {
        right: 35%!important;
    }

    .color-heading .h2, .color-heading h2 {
        font-size: 30px;
    }

    .home-portfolio {
        padding: 5% 0 20% 0 !important;
    }

    .about-header, .projects-header, .contact-header, .blog-header {
        padding: 23% 0 10% 0;
    }

    .home-intro-new, .about {
        padding: 10% 0 0 0;
    }

    .home-intro-new .card {
        margin-bottom: 30px;
    }

    .home-intro-new .card-body {
        min-height: 140px;
    }

    .home-intro-new .card .card-header {
        margin-bottom: 0px;
    }

    .color-heading {
        padding: 6% 0;
    }

    .mobi-color-heading {
        background-color: #f6faff;
        padding: 15px;
        margin-bottom: 15px;
    }

    .webdesign-img-1 img {
        min-width: auto;
        height: auto;
        width: 100%;
    }

    .testimonials .card #chat-bubble {
        font-size: 40px;
    }

    .testimonials .slide-controls {
        position: absolute;
        top: -25px;
        right: 10px;
        width: 16%;
    }

    .timeline-carousel__item-inner .card {
        min-height: 550px;
    }

    .slick-slide img {
        width: 100%;
    }

    .client-logos {
        padding: 5%;
    }

    .client-logos img {
        width: 100%;
    }

    .card-title .btn-primary, .blog-main .card .card-title .btn-primary, .timeline-carousel__item-inner .card .card-title .btn-primary {
        width: auto;
    }

    .card-title .text-break {
        width: 60%;
    }

    .projects .card .card-title, .timeline-carousel__item-inner .card .card-title, .blog-main .card .card-title {
        margin-bottom: 10px;
        vertical-align: middle;
        line-height: 25px;
    }

    .slick-list {
        padding: 0 0 34px 0px!important;
    }

    .slick-prev {
        text-transform: none;
        position: absolute;
        bottom: 0;
        top: auto;
        width: 80px;
        right: auto;
        left: 25%;
        background-color: transparent;
        border: 0;
        background-image: url('https://files.crtgroupstorage.com/crtwebsite/long-arrow-left-light.svg');
        background-size: 40%;
        background-position: center;
        background-repeat: no-repeat;
        color: transparent;
        height: 20px;
        z-index: 9999999999999999999;
    }

    .slick-next {
        text-transform: none;
        position: absolute;
        bottom: 0;
        top: auto;
        width: 80px;
        right: 25%;
        left: auto;
        background-color: transparent;
        border: 0;
        background-image: url('https://files.crtgroupstorage.com/crtwebsite/long-arrow-right-light.svg');
        background-size: 40%;
        background-position: center;
        background-repeat: no-repeat;
        color: transparent;
        height: 20px;
        z-index: 9999999999999999999;
    }

    .about-header .h4 {
        font-size: 18px;
    }

    .values ul {
        margin-top: 20px;
    }

    .values li {
        line-height: normal;
        margin-bottom: 20px;
    }

    .xero {
        text-align: center;
    }

    .outsource-header {
        background-size: 100%;
        background-position: right bottom 1%;
        padding: 25% 0 65% 0;
    }

    .outsource .row {
        height: 400px;
    }

    .outsource {
        background-position: bottom 5% center;
        padding: 10% 5px;
        height: 540px;
    }

    .flag img {
        width: 10%;
        vertical-align: middle;
    }

    .blog-main .card {
        margin-bottom: 30px;
    }

    /* Footer */
    footer img {
        width: 100%;
        height: auto;
        margin-bottom: 20px;
    }

    footer .logo {
        width: 60%;
        height: auto;
    }

    footer h3 {
        font-size: 30px;
    }

    footer h4 {
        font-size: 30px;
    }

    .footer-contact-details p {
        line-height: 30px;
    }

    footer .btn-primary {
        margin: 20px 0;
    }

    footer a {
        font-size: 20px;
        line-height: 40px;
    }

    footer i {
        font-size: 30px;
        padding: 0px 10px;
    }

    footer img {
        width: 100%;
        height: auto;
    }

    .xero-logo-foot img {
        width: 100%;
        text-align: left;
        float: left;
    }

    .logos-row {
        margin: 0!important;
    }
}

/* Tablet & small screens: */
@media (min-width: 768px) and (max-width: 991px){
    .btn-primary {
        padding: 5px 10px;
    }

    .navbar-toggler img {
        width: 25px;
    }

    .services-pages .mobi-services-bars {
        display: block;
    }

    .mobi-bars {
        display: none;
    }

    .services-header {
        height: auto;
        padding-top: 12%;
        padding-bottom: 3%;
    }

    .bes-header {
        padding-top: 6%;
    }

    .services-header h1 {
        font-size: 30px;
    }

    .services-header p>br {
        display: none;
    }

    .services-pages .navbar-toggler {
        padding: 0 20px;
        font-size: 30px;
        line-height: 1;
        color: #fff;
        background-color: transparent;
        border: 0;
    }

    .navbar-toggler i {
        font-size: 30px;
        font-weight: 400;
    }

    .navbar-toggler {
        padding: 0 20px;
        font-size: 20px;
        line-height: 1;
        color: #0D3457;
        background-color: transparent;
        border: 0;
    }

    .navbar-toggler:focus {
        text-decoration: none;
        outline: 0;
        box-shadow: none;
    }

    .navbar-nav {
        display: flex;
        flex-direction: column;
        padding: 20px;
        margin-bottom: 0;
        list-style: none;
        position: absolute;
        top: 100%;
        left: auto;
        right: 0;
        background-color: #f6faff;
        z-index: 99999;
        max-width: 60%;
        min-width: 280px;
        box-shadow: 0px 9px 6px -5px #ccc;
        max-height: 500px;
        overflow-y: auto;
    }

    .navbar-nav .nav-item {
        padding: 5px 0;
    }

    .multi-dropdowns .nav-item a {
        padding: 0px !important;
    }

    .nav-item a {
        color: #01121F !important;
        padding: 5px 0px 0px 5px !important;
    }

    .navbar-nav .btn-primary {
        margin-top: 20px;
        color: #fff!important;
        padding: 10px !important;
        background-color: #0069FF!important;
    }

    .navbar-nav .btn-primary:hover {
        margin-top: 20px;
        color: #0069FF!important;
        padding: 10px !important;
        background-color: transparent!important;
    }

    .services-pages .nav-item .btn-primary.solid {
        background-color: #0069ff !important;
        color: #fff !important;
        border: 2px solid #0069ff;
    }

    .nav-link {
        padding: 0;
    }

    .nav-link i {
        padding-left: 10px;
        font-size: 20px;
    }

    .dropdown {
        display: block;
    }

    .dropdown-menu {
        position: static;
        top: 0;
        left: 0;
        border-radius: 0;
        border: 0;
        /* min-width: 100%; */
        padding: 10px 0 10px 0px;
        right: 0;
        margin: 0 auto;
        box-shadow: none!important;
        text-align: center;
    }

    .dropdown {
        position: relative!important;
        display: flow-root!important;
        padding: 5px 0px!important;
        font-size: 18px!important;
        text-align: center!important;
    }

    .dropdown-menu .dropdown-toggle i, .dropdown-submenu i {
        float: none;
        margin-right: 0px;
        font-size: 20px;
    }

    .dropdown-menu[data-bs-popper] {
        top: auto;
        left: 0;
        background-color: transparent;
    }

    .dropdown-menu {
        position: static;
        top: 0;
        left: 0;
        border-radius: 0;
        border: 0;
        /* min-width: 100%; */
        padding: 0px;
        right: 0;
        margin: 0 auto;
        box-shadow: none!important;
        text-align: center;
        background-color: transparent;
    }

    .dropdown-menu .dropdown-submenu {
        top: 100% !important;
        left: 0 !important;
        position: static !important;
        buffered-rendering: static;
        background-color: transparent;
        text-align: center;
        border-top: 0;
        border-radius: 0;
        margin-top: 0;
        display: block;
    }

    .submenu {
        border-top: 1px solid #000;
        border-bottom: 1px solid #000;
        background-color: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
    }

    .navbar-nav .nav-link.show {
        text-align: center;
        font-weight: 700;
    }

    .mobile-brand {
        display: inline-block!important;
    }

    .mobile-brand p {
        font-size: 40px;
        margin-bottom: 0;
        line-height: 25px;
    }

    /* .navbar-brand {
        display: none!important;
    } */

    /* .services-pages .navbar-brand {
        display: none!important;
    } */
    
    .outlined {
        font-size: 40px;
        font-weight: 600;
    }

    .whoweare, .home-webdesign, .values, .what-cost, .about, .benefit, .branding-portfolio, .xero, .projects, .contact-details, .home-portfolio {
        padding: 10% 0;
    }

    .what-cost img {
        width: 100%;
        height: auto;
        text-align: center;
        margin: 0 auto;
    }

    .examples dt>i {
        font-size: 17px;
    }

    .xero img {
        width: 80%;
        height: auto;
    }

    .convert, .examples, .technologies {
        padding-bottom: 10%;
    }

    .app-dev-features, .email-marketing, .blog-main {
        padding-top: 10%;
    }

    /* Home */
    .page-heading {
        font-size: 33px;
    }

    .home-header {
        padding: 15% 0 10% 0;
    }

    .service-body br, .home-header br, .benefit br, .examples br {
        display: none;
    }

    .home-intro-new img {
        width: 100%;
    }

    .customize-tools {
        top: 92%!important;
    }

    .customize-tools #customize-controls .prev {
        left: 45%!important;
    }

    .customize-tools #customize-controls .next {
        right: 45%!important;
    }

    .home-portfolio {
        padding: 5% 0 10% 0 !important;
    }

    .color-heading {
        padding: 4% 0;
    }

    .testimonials .slide-controls {
        top: -40px;
        width: 12%;
    }

    .testimonials .card #chat-bubble {
        font-size: 40px;
    }

    .timeline-carousel__item-inner .card .btn-primary {
        margin-top: 0;
    }

    .card-title .btn-primary, .timeline-carousel__item-inner .card .card-title .btn-primary {
        width: auto;
    }

    .card-title .text-break {
        width: 65%;
    }

    .webdesign-img-1 img {
        min-width: auto;
        height: auto;
        width: 100%;
    }

    .outsource-header {
        background-size: 90%;
        background-position: bottom;
        padding: 13% 0 54% 0!important;
    }

    .outsource h3 {
        font-size: 20px;
    }

    .outsource .row {
        height: 300px;
    }

    .outsource br {
        display: none;
    }

    .outsource {
        background-position: right center;
        background-size: 55%;
    }

    .flag {
        vertical-align: middle;
    }

    .flag img {
        width: 10%;
        vertical-align: middle;
    }

    .projects-header {
        padding: 10% 0 5% 0;
    }

    .service-body {
        padding: 5% 0 5% 0;
    }

    .blog-header, .contact-header, .about-header {
        padding: 13% 0 5% 0;
    }

    #map {
        height: 300px;
    }

    .card-title .btn-primary, .timeline-carousel__item-inner .card .card-title .btn-primary {
        width: auto;
    }

    .slick-slide img {
        width: 100%;
        height: auto;
    }

    .service-body img {
        display: none;
    }

    /* Footer */
    footer h3 {
        font-size: 30px;
    }

    footer h4 {
        font-size: 40px;
    }

    footer .logo {
        width: 40%;
        height: auto;
    }

    footer img {
        width: 100%;
        height: auto;
    }

    .xero-logo-foot img {
        width: 85%;
        text-align: left;
        float: left;
    }
}

@media (min-width: 992px) and (max-width: 1199px){
    .btn-primary {
        padding: 5px 15px;
    }

    .mobile-brand {
        display: inline-block!important;
    }

    .navbar-brand h1 {
        font-size: 30px;
    }

    .nav-item {
        padding: 0 11px;
    }

    .navbar-expand-lg .navbar-nav .nav-link {
        padding: 0;
    }
    .navbar-nav .dropdown-menu a {
        padding: 0px 5px 0px 20px !important;
    }

    .navbar-brand p {
        font-size: 33px;
        vertical-align: middle;
        margin-bottom: 0;
    }

    .services-header h1 {
        font-size: 40px;
    }

    .page-heading {
        font-size: 30px;
    }

    .home-header {
        padding: 10% 0 5% 0;
    }

    .home-header img {
        width: 100%;
        height: auto;
    }

    .home-portfolio {
        padding: 5% 0 0% 0;
    }

    .customize-tools {
        top: 90%!important;
    }

    .customize-tools #customize-controls .prev {
        left: 45%!important;
    }

    .customize-tools #customize-controls .next {
        right: 45%!important;
    }

    .service-body br, .home-header br, .benefit br, .examples br {
        display: none;
    }

    .support-page {
        padding: 10% 0 5% 0;
    }

    .home-intro-new img {
        width: 100%;
        height: auto;
    }

    .xero-card img {
        margin-bottom: 10px;
    }

    .home-intro-new .card.xero-card .card-header {
        height: 60px;
    }

    .testimonials .slide-controls {
        top: -40px;
        width: 8%;
    }
    
    .testimonials .card #chat-bubble {
        color: #0069FF;
        font-size: 40px;
    }

    .webdesign-img-1 img {
        min-width: auto;
        height: auto;
        width: 100%;
    }
    
    .outsource-header {
        background-size: 50%;
        background-position: right bottom 0%;
        padding: 10% 0 23% 0;
    }

    .outsource .row {
        height: 320px;
    }

    .outsource br {
        display: none;
    }

    .about-header, .projects-header, .blog-header, .contact-header {
        padding: 10% 0 5% 0;
    }

    .flag img {
        width: 11%;
        vertical-align: middle;
    }

    .dropdown {
        display: block;
    }

    .dropdown-menu .dropdown-toggle i, .dropdown-submenu i {
        font-size: 20px;
    }

    .dropdown-menu[data-bs-popper] {
        top: auto;
        left: 10px;
        padding: 10px 0 10px 0px;
    }

    .submenu {
        min-width: 240px;
        box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
        padding: 10px 5px 10px 0px;
    }

    .blog-main .card-title .btn-primary {
        width: auto;
    }

    .projects-header {
        padding: 14% 0 5% 0;
    }

    .card-title .text-break {
        width: 60%;
        display: inline-block;
    }

    .card-title .btn-primary, .timeline-carousel__item-inner .card .card-title .btn-primary {
        width: 40%;
    }

    .slick-slide img {
        display: block;
        width: 100%;
        height: auto;
    }

    .client-logos img {
        width: 100%;
        height: auto;
    }

    .home-webdesign {
        padding: 5% 0;
    }

    .email-marketing dt>i {
        font-size: 20px;
        vertical-align: middle;
    }
    

    .packages dt>i {
        font-size: 20px;
        vertical-align: bottom;
    }

    .services-header {
        padding-top: 10%;
        height: auto;
        padding-bottom: 3%;
    }

    /* .service-body img {
        display: none;
    } */

    footer h4 {
        font-size: 40px;
    }

    footer img {
        width: 95%;
        height: auto;
    }

    .xero-logo-foot img {
        width: 100%;
    }
}

/* Laptop: */
@media (min-width: 1200px) and (max-width: 1600px){
    .navbar-brand h1 {
        font-size: 40px;
    }

    .navbar-brand p {
        font-size: 35px;
    }

    .navbar-nav .dropdown-menu a {
        padding: 5px 10px 5px 10px !important;
    }

    .dropdown-menu .dropdown-submenu {
        left: 0;
        top: 0px;
    }

    .page-heading {
        font-weight: 800;
        font-size: 34px;
    }

    .home-header {
        padding: 10% 0 5% 0;
    }

    .home-header br {
        display: none;
    }

    .nav-item {
        padding: 0 15px;
    }

    /* .navbar-expand-lg .navbar-nav .dropdown-menu {
        width: 270px!important;
    } */

    .dropdown-menu .dropdown-toggle i, .dropdown-submenu i {
        margin-right: 10px;
    }

    .submenu {
        box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
    }

    .home-webdesign {
        padding: 5% 0;
    }

    .home-intro-new img {
        width: 100%;
        height: auto;
    }

    .home-portfolio {
        padding: 5% 0 10% 0;
    }

    .services-header {
        padding-top: 10%;
        height: auto;
        padding-bottom: 3%;
    }

   .customize-tools {
        top: 90%!important;
    }

    .customize-tools #customize-controls .prev {
        left: 45%!important;
    }

    .customize-tools #customize-controls .next {
        right: 45%!important;
    }

    .outsource .row {
        height: 380px;
    }

    .outsource-header {
        background-size: 39%;
        background-position: right bottom 0%;
    }

    .card-title .btn-primary, .timeline-carousel__item-inner .card .card-title .btn-primary {
        width: auto;
    }

    .card-title .text-break {
        width: 60%;
    }

    .about-header, .projects-header, .blog-header, .contact-header {
        padding: 8% 0 3% 0;
    }

    .about, .benefit, .branding-portfolio, .xero, .projects, .contact-details, .request-quote {
        padding: 3% 0 3% 0;
    }

    .webdesign-img-1 img {
        min-width: 100%;
        height: auto;
        width: 100%;
    }

    .slick-slide img {
        width: 100%;
        height: auto;
    }

    .support-page {
        padding: 10% 0 5% 0;
    }

    .projects .card .card-title, .timeline-carousel__item-inner .card .card-title {
        margin-bottom: 10px;
        vertical-align: middle;
        line-height: 40px;
    }

    footer img {
        width: 100%;
    }

    .xero-logo-foot img {
        width: 100%;
    }
}

@media (min-width: 1600px) and (max-width: 2000px){
    /* .customize-tools #customize-controls .prev { 
        left: 200px!important; 
    }

    .customize-tools #customize-controls .next {
        right: 200px!important;
    } */

    /* .webdesign-img-1 img {
        min-width: auto;
        height: auto;
        width: auto;
    } */
}
/* 14” HD Laptop */
@media (min-width: 1380px) and (max-width: 2000px){
    .page-heading {
        font-size: 34px;
    }

    .services-header {
        padding-top: 10%;
        padding-bottom: 70px;
    }

    .navbar-nav .dropdown-menu a {
        padding: 0px 0px 5px 5px !important;
    }

    .home-header {
        padding: 9% 0 5% 0;
    }

    .home-intro-new img {
        width: 100%;
        height: auto;
    }

    .home-portfolio {
        padding: 3% 0 6% 0;
    }

    /* .customize-tools {
        top: 90%;
    } */

    .customize-tools #customize-controls .prev {
        left: 5%!important;
    }

    .customize-tools #customize-controls .next {
        right: 5%!important;
    }

    .outsource-header {
        background-size: 40%!important;
        background-position: right bottom 40%!important;
    }

    .testimonials .slide-controls {
        width: 7%;
    }

    .outsource .row {
        height: 430px;
    }

    .dropdown-menu[data-bs-popper] {
        top: 100%;
        left: 20px;
    }

    .home-intro-new .card .card-header {
        height: 70px;
    }

    .card-title .btn-primary, .timeline-carousel__item-inner .card .card-title .btn-primary {
        width: auto;
    }

    .card-title .text-break {
        width: 60%;
    }

    .home-webdesign .m-md-auto {
        margin: auto 5% !important;
        width: 650px;
    }

    .services-header {
        padding-top: 10%;
        height: auto;
    }

    /* footer {
        padding-top: 20px;
    } */

    footer .btn-primary {
        margin: 10px 0;
    }

    footer .col-lg-1 {
        width: 11%;
    }

    footer img {
        width: 100%;
    }

    .xero-logo-foot img {
        width: 90%;
    }
}
/* 
@media (min-width: 2000px) and (max-width: 2500px){
    .customize-tools #customize-controls .next {
        right: 21%;
    }

    .customize-tools #customize-controls .prev {
        left: 21%;
    }

    .customize-tools #customize-controls li i {
        font-size: 50px;
    }
} */