/* Extra small devices (phones, less than 576px) */
@media (max-width: 575.98px) {
    .responsive_header_area {
        padding: 0 12px;
        margin: .5rem auto;
    }

    .header_meta_buttons {
        margin-bottom: 10px;
    }

    .sidebar_primary_menu ul li a {
        font-size: 1.1rem;
    }

    .nl_header {
        display: block;
        padding: 1rem 0;
    }

    .nl_logo {
        max-width: 85%;
        margin: auto;
    }

    .nl_header_bottom {
        display: none;
    }

    .nl_social_media {
        margin-top: 1rem;
        justify-content: space-between;
    }

    .hero-slider-area {
        margin: auto;
        overflow: unset;
        margin-bottom: 3rem !important;
    }

    .nl-page-content-area .slick-dots {
        margin: 0;
        padding: 0;
        bottom: -2rem;
    }

    .slick-dots li {
        width: 10px;
        height: 10px;
        margin: 0 3px;
    }

    .single-hero-item {
        height: max(200px, 40vh);
    }

    .nl-page-content-area h1,
    .gjs-dashed h1 {
        font-size: 1.6rem;
    }

    .nl-page-content-area .brand-header p,
    .gjs-dashed .brand-header p,
    .nl-page-content-area p,
    .gjs-dashed p {
        font-size: .9rem;
        margin-bottom: .6em;
    }

    .portfolio_meta_details {
        column-count: 1;
        column-gap: 15px;
        margin-top: 2rem;
        margin-bottom: 1rem;
    }

    .nl-page-content-area .col {
        flex: 100%;
    }

    .nl-page-content-area .col .text-block,
    .gjs-dashed .col .text-block {
        margin-bottom: 0;
    }

    .nl-page-content-area img[width*="0"] {
        width: auto;
    }

    .nlda_print_items {
        column-count: 2;
        column-gap: .5rem;
        margin: 2rem 0;
    }

    .print_single_item {
        margin-bottom: .5rem;
        display: block;
    }

    .nl-page-content-area h4,
    .gjs-dashed h4 {
        font-size: 1.12rem;
        letter-spacing: -0.0px;
        margin-top: 1rem;
    }

    .section_title {
        width: auto;
        margin: auto;
        padding: 0;
    }

    .related-portfolio-area h1 {
        font-size: 1.8rem;
    }

    .related-portfolio-slider {
        margin: 1rem 0 3rem 0 !important;
    }

    .nl_newsletter_area h1 {
        font-size: 1.8rem;
    }

    .nl_newsletter_area h5 {
        font-size: .9rem;
        width: auto;
        margin: auto;
    }

    .hover_box {
        opacity: 1;
        visibility: visible;
        left: auto;
        justify-content: flex-end;
        align-items: flex-end;
    }

    .hover_box i {
        background: #282828d1;
        padding: 7px 15px;
        font-size: .8rem;
        border-radius: 10px 0 0 10px;
    }

    .nl_experience_area .d-flex {
        display: block !important;
        text-align: center;
    }

    .nl_experience_area .d-flex img.w-100 {
        max-width: 225px;
    }

    .nl_experience_area .ps-5 {
        padding: 0 !important;
        font-size: .8rem;
    }

    .nl_experience_area .ps-5 p {
        margin-bottom: .7rem;
    }

    .nl_experience_area h1 {
        font-size: 2rem;
        margin: 1rem 0;
    }

    .nl_newsletter_form form {
        /* gap: 12px; */
        /* font-size: 14px; */
        display: block;
    }

    .nl_newsletter_form form input {
        margin-bottom: 15px;
    }

    .nl_experience_area {
        padding: 3rem 0;
    }

    .nl_browse_by_industry_area {
        padding-top: 1rem;
    }

    .element_call_to_action {
        font-size: .9rem;
        margin-bottom: 0;
        padding: 7px;
    }

    .nl_social_media ul {
        display: grid;
        gap: 15px;
        grid-template-columns: auto auto auto auto auto;
    }

    .nl-banner-content-box {
        display: flex;
        flex-direction: column-reverse;
    }

    .nl-banner-content-text {
        font-size: 1rem;
        text-align: center;
        padding: 0 1rem;
    }

    .nl-banner-content-text h1 {
        font-size: 2rem;
    }

    .audit-form {
        width: auto;
        margin-top: 1.7rem;
    }

    .nl-banner-content-image img {
        max-width: 350px;
        width: 100%;
    }

    .nl-home-page-banner-area {
        padding: 0 0 2rem 0;
    }

    .responsive_header_area {
        display: flex;
        justify-content: space-between;
        padding: .5rem;
        margin: 1rem auto;
        border-radius: .5rem;
    }

    .header_logo {
        width: 45%;
    }

    .header_meta {
        flex: 1;
        display: flex;
        justify-content: flex-end;
        align-items: center;
    }

    .header_meta button {
        border: none;
        background: none;
    }

    .header_meta button i {
        color: black;
    }

    .main-header {
        display: none;
    }

    .responsive_header_area {
        display: block;
    }

    h1 {
        font-size: 1.9rem;
    }

    p {
        font-size: 0.9rem;
    }

    .nl-banner-content-text .button-group a {
        flex: auto;
    }

    .nl-home-cta-area .button-group a {
        font-size: .7rem;
    }

    .nl_portfolio_area {
        padding-bottom: 2rem;
    }

    .nl-banner-content-text .button-group {
        flex-wrap: wrap;
    }

    .nl-freebies {
        column-count: 2;
        column-gap: .5rem;
        margin: 2rem 0;
    }

    .nl-freebies a {
        margin-bottom: .5rem;
    }

    .nl-freebies img {
        height: 12rem;
    }

    .fancybox__carousel {
        width: auto;
    }

    .f-caption .nl-btn-group .nl-btn {
        padding: 0 1rem;
        font-size: .6rem;
        height: 2rem;
        line-height: 2rem;
        border: 1px solid;
    }

    .f-caption .nl-btn-group {
        flex-wrap: wrap;
        margin-top: .55rem !important;
    }

    .f-caption .nl-btn-group .nl-btn.nl-btn-primary {
        border-color: rgba(var(--bs-danger-rgb), var(--bs-bg-opacity)) !important;
    }

    .is-horizontal .f-button.is-arrow.is-prev,
    .is-horizontal .f-button.is-arrow.is-next {
        transform: translateY(-50%) scale(.5);
        inset: 42% auto auto;
    }

    .is-horizontal.is-ltr .f-button.is-arrow.is-prev {
        left: 0;
    }

    .is-horizontal.is-ltr .f-button.is-arrow.is-next {
        right: 0;
    }

    .nl-home-cta-area h1 {
        font-size: 1.7rem;
        margin-bottom: .4rem;
    }

    .nl_footer_bottom {
        margin-top: 2rem;
    }

    .nl_footer_area {
        padding: 2rem 0;
    }

    .copyright {
        margin-top: .5rem;
    }

    .copyright ul {
        flex-wrap: wrap;
        justify-content: center;
        gap: .4rem;
    }

    .copyright ul li:first-child {
        list-style: none;
        width: 100%;
    }

    .copyright ul li {
        line-height: 1;
        gap: 5px;
    }

    .footer_header {
        flex-direction: column;
        gap: 1rem;
    }

    .footer_logo img {
        max-width: 200px;
    }

    .footer_header ul {
        gap: 0.5rem;
        margin-right: .8rem;
    }

    .footer_header ul li a {
        font-size: .8rem;
    }

    .footer_get_start a {
        padding: 3px 10px;
        font-size: .8rem;
    }

    .nl_portfolio_area h1 {
        max-width: 70%;
        margin-left: auto;
        margin-right: auto;
    }

    .nl_portfolio_area p {
        max-width: 80%;
        margin: auto;
    }

    .gallery-item .overlay {
        opacity: 1;
        background: transparent;
    }

    .gallery-item .overlay a {
        width: 100%;
        height: 100%;
        position: relative;
    }

    .gallery-item .overlay a i {
        display: none;
    }

    /* .gallery-item .overlay a::before {
        position: absolute;
        right: .5rem;
        top: .5rem;
        background: url('../img/expand-solid-full.svg');
        content: "";
        width: 30px;
        height: 30px;
        font-family: "Font Awesome 6 Free";
    } */
}



/* Small devices (phones, 576px and up) */
@media (min-width: 576px) and (max-width: 767.98px) {

    .container,
    .container-sm {
        max-width: 100%;
    }

    .container,
    .container-sm {
        max-width: 100%;
        overflow-x: hidden;
        padding: 0px 25px;
    }

    .nl-page-content-area,
    .gjs-dashed {
        padding: 0px 10px;
    }

    .slick-list {
        width: 95%;
        margin: auto;
    }

    .slick-prev {
        left: -5px;
    }

    .slick-next {
        right: 15px;
    }

    .nl_breadcrumb {
        padding-left: 0;
    }

    .portfolio_meta_details {
        display: grid;
        grid-template-columns: 1fr 1fr 1.5fr;
        gap: 30px;
    }

    .nl-page-content-area .portfolio_meta_details p,
    .gjs-dashed .portfolio_meta_details p {
        font-size: .9rem;
        margin-bottom: 0;
    }

    .nl-page-content-area h1,
    .gjs-dashed h1 {
        font-size: 1.8rem;
    }

    .nl-page-content-area h3,
    .gjs-dashed h3 {
        font-size: 1.25rem;
    }

    .nl-page-content-area h4,
    .gjs-dashed h4 {
        font-size: 1.1rem;
    }

    .nl_header_bottom {

        gap: 0;
    }

    .nl_header_search {
        display: none;
    }

    .nl-page-content-area p,
    .gjs-dashed p {
        margin-bottom: 1.2em;
        font-size: .9rem;
    }

    .nl-page-content-area p:has(> strong),
    .gjs-dashed p:has(> strong) {
        margin-bottom: .6em;
    }

    .nlda_print_items {
        column-gap: .5rem;
    }

    .print_single_item {
        display: block;
        margin-bottom: .5rem;
    }

    .related-portfolio-area {
        margin-top: 1rem;
    }

    .section_title.title_large h1 {
        font-size: 3rem;
    }

    .nl_header_buttons {
        justify-content: center;
    }

    .nl_header_buttons a {
        font-size: 65%;
        padding: 0px 15px;
        height: 30px;
        line-height: 30px;
    }

    .nl_social_media {
        width: 100%;
        justify-content: space-between;
        display: flex;
        align-items: center;
    }

    .btn.mobile_menu_btn {
        display: inline-flex;
        font-size: 1.3em;
    }

    .sidebar_header_buttons {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        gap: 20px;
    }

    .nl-btn {
        font-size: 14px;
        padding: 5px 10px;
    }

    .nl_single_banner {
        padding: 0;
    }

    .banner_content h1 {
        font-size: 3rem;
        margin-bottom: 20px;
    }

    .banner_content {
        width: 60%;
        font-size: 1.2rem;
    }

    .nl_banner_area.section_padding {
        padding: 1rem 0 3rem 0;
    }

    .section_title h1 {
        font-size: 2rem;
    }

    .section_title h4 {
        font-size: 1.2rem;
    }

    .nl-portfolios {
        column-count: 3;
    }

    .nl_service_content h3 {
        font-size: 1.4rem;
    }

    .page_nl_portfolio_area.section_padding_top {
        padding-top: 1rem;
    }

    .industry_content h3 a {
        font-size: 1rem;
    }

    .industry_content {
        font-size: .8rem;
    }

}



/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) and (max-width: 991.98px) {
    .nl_header_area .container {
        max-width: 100%;
        width: 100%;
    }

    .nl_header_bottom {
        display: none;
    }

    .nl_header {
        display: grid;
        grid-template-columns: auto;
        grid-template-areas: "logo logo" "menu social";
    }

    .nl_logo {
        grid-area: logo;
    }

    .nl_primary_menu {
        grid-area: menu;
    }

    .nl_social_media {
        grid-area: social;
    }

    .nl_primary_menu ul li a {
        padding-left: 1.3rem;
        font-size: .8em;
    }

    .nl_social_media ul {
        gap: 10px;
    }

    .nl_breadcrumb {
        padding: 20px 0;
        margin-left: -1rem;
    }

    .single-hero-item {
        height: 400px;
    }

    .nl-page-content-area .slick-dots {
        margin: 0;
        padding: 0;
        bottom: -2rem;
    }

    .hero-slider-area {
        overflow: unset;
    }

    .portfolio_meta_details {
        margin: 1rem;
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }

    .print_single_item {
        display: block;
    }

    .nl-page-content-area h4,
    .gjs-dashed h4 {
        font-size: 1.1em;
        letter-spacing: -0.2px;
    }

    .nl-page-content-area p,
    .gjs-dashed p {
        font-size: .9rem;
        line-height: 1.5;
    }

    .section_title.title_large h1 {
        font-size: 3rem;
    }

    .related-portfolio-slider {
        margin: 1rem 0 3rem 0 !important;
    }

    .grid-item.equal img {
        height: 200px;
    }

    .hover_box {
        opacity: 1;
        visibility: visible;
        left: auto;
        justify-content: flex-end;
        align-items: flex-end;
    }

    .hover_box i {
        background: #282828d1;
        padding: 7px 15px;
        font-size: .8rem;
        border-radius: 10px 0 0 10px;
    }

    .single_footer_widget {
        flex: 20%;
    }

}

/* Portrait tablets */
@media only screen and (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) {}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) and (max-width: 1199.98px) {

    .container,
    .container-sm {
        max-width: 100%;
        overflow-x: hidden;
        padding: 0px 25px;
    }

    .nl-page-content-area,
    .gjs-dashed {
        padding: 0px 10px;
    }

    .slick-list {
        width: 95%;
        margin: auto;
    }

    .slick-prev {
        left: -5px;
    }

    .slick-next {
        right: 15px;
    }

    .nl_breadcrumb {
        padding-left: 0;
    }

    .portfolio_meta_details {
        display: grid;
        grid-template-columns: 1fr 1fr 1.5fr;
        gap: 30px;
    }

    .nl-page-content-area .portfolio_meta_details p,
    .gjs-dashed .portfolio_meta_details p {
        font-size: 1.2rem;
        margin-bottom: 0;
    }

    .nl-page-content-area h1,
    .gjs-dashed h1 {
        font-size: 2.8rem;
    }

    /* Style .row only if it has .col > .text-block */
    .row:has(> .col > .text-block) {}
}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) and (max-width: 1599.98px) {}

/* 1600px and up (wide desktops / 2K) */
@media (min-width: 1600px) and (max-width: 1919.98px) {}

/* 1920px and up (full HD / 1080p large screens) */
@media (min-width: 1920px) and (max-width: 2559.98px) {}

/* 2560px and up (2K / QHD screens) */
@media (min-width: 2560px) and (max-width: 3839.98px) {}

/* 3840px and up (4K / UHD screens) */
@media (min-width: 3840px) {
    /* Add CSS for 4K / UHD / ultra wide screens here */
}