body {
    max-width: 100vw;
    overflow-x: hidden;
}

.text-secondary {
    color: #d3d3d3 !important;
}

.bg-primary, .btn-primary {
    background-color: black !important; 
    border-color: black !important;
}

.btn-primary:hover {
    background-color: #d3d3d3 !important; 
}

.text-primary {
    color: black !important;
}

.mobile-free-quote {
    display: none;
}

.spacer-element {
    height: 650px;
}

.spacer-element-our-work {
    height: 100px;
}

.dlc-about-us-image {
    margin-left: 5rem;
}

.hover-container .hover-content {
    display: none;
}
  
.hover-container:hover .hover-content {
    display: block;
}

.content {
    display: flex;
    flex-wrap: wrap;
}
  
.content .item {
    cursor: pointer;
    border-radius: 4px;
    border: 1px solid rgb(255, 247, 247);
    transition: all 400ms ease-out;
}
  
.content .item img {
    display: block;
    object-fit: cover;
    border-radius: 4px;
}
  
.content:has(.item:focus) .item:not(:focus),
.content:has(.item:hover) .item:not(:hover) {
    opacity: 0.1;
    scale: 0.92;
}
  
.content .item:focus,
.content .item:hover {
    box-shadow: 0px 0px 24px 4px rgba(112, 112, 112, 0.7);
    transition: all 300ms ease-out;
}
    
.background-banner {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: fixed; /* Change to fixed */
    width: 100vw;
    height: 900px;
    position: relative;
    text-align: center;
    position: absolute;
    z-index: 0;
}

@supports (-webkit-touch-callout: none) {
    /* CSS specific to iOS devices */ 
    .background-banner {
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        background-attachment: scroll; /* Change from 'fixed' to 'scroll' */
        width: 100vw;
        height: 900px;
        position: relative;
        text-align: center;
        position: absolute;
        z-index: 0;
        -webkit-transform: translateZ(0); /* Add this line */
    }
}

.scalable-width {
    width: 50% !important;
}

@media (max-width: 1400px) {
    .view-header {
        font-size: 40px !important;
    }

    .background-banner {
        background-position: center;
        height: 600px;
    }

    .spacer-element {
        height: 375px;
    }

    .desktop-free-quote {
        display: none;
    }

    .mobile-free-quote {
        display: block;
    }
}



@media (max-width: 990px) {
    .view-header {
        font-size: 15px !important;
    }

    .nav-item {
        font-size: 15px !important;
    }

    .dlc-about-us-image {
        margin-left: 0rem;
    }

    .empty-col {
        display: none;
    }

    .scalable-width {
        width: 100% !important;
    }
}

.title-text {
    font-family: "Poppins", sans-serif;
}

.nav-link {
    color: white !important;
    padding-top: 0px !important;
}

.view-header {
    font-size: 60px;
}

.contact-icon {
    font-size: 3rem !important;
}

.services-boxes {
    height:300px;
}

.overlay-background {
    opacity: 0.5;
}

.overlay-background:hover {
    opacity: 1;
    transition: opacity .25s ease-out;
    -moz-transition: opacity .25s ease-out;
    -webkit-transition: opacity .25s ease-out;
    -o-transition: opacity .25s ease-out;
}

.inline-row {
    --bs-gutter-x: 0rem;
}