.introduction-section {
    height: 100vh;
}


.introduction-section {
    background-image: url("../images/blob.svg");
    background-repeat: no-repeat;
    background-size: cover;
    aspect-ratio: 960/540;
}

@media (max-width: 1400px) {
    .introduction-section {
    background-image: url("../images/blob.svg");
        background-repeat: no-repeat;
        background-size: cover;
        aspect-ratio: 960/540;
    }
}

@media (max-width: 1280px) {
    .introduction-section {
    background-image: url("../images/blob.svg");
        background-repeat: no-repeat;
        background-size: cover;
        aspect-ratio: 960/800;
    }
}

@media (max-width: 992px) {
    .introduction-section {
    background-image: url("../images/blob.svg");
        background-repeat: no-repeat;
        background-size: cover;
        aspect-ratio: 960/992;
    }

    .first-section .description {
        font-size: 1rem;
    }
}

.introduction-section .introduction-item {
    min-height: 100vh;
    position:relative;
    color: white;
    text-shadow: 2px 2px 2px rgb(0, 0, 0, 0.2);
}

.introduction-section .introduction-item .introduction-inner-content {
    position: absolute;
    width: 100%;
    height: 100%;
    
}

.what-section {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
}

.what-icon {
    height: 120px;
    width: 120px;
    color: white;
    transition: 0.3s;
    background: var(--primary-color);
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 20px;
}

.what-icon i {
    font-size: 60px;
}

.construct-pro-container {
        display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
}

.qc-trowel-container {
        display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
}

.tylers-book-container {
        display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
}

.upcoming-block {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
}
@media (max-width: 768px) {
    /* .introduction-section .introduction-item {
        min-height: 50vh;
        background-position: 10%;
    } */
}

#map  {
    height: 400px;
}
@media (max-width: 576px) { 

    .introduction-section .image-lock {
        background-image: url('../images/fixingknob.jpg');
        background-size: cover;
        background-repeat: no-repeat;
        background-position:center ;
    
    }

    .services-container .service-item .service-content {
        margin-bottom: 15px;
        height: 230px;
    }    
    
    .introduction-section .introduction-item {
        min-height: 60vh;
        position:relative;
        color: white;
        text-shadow: 2px 2px 2px rgb(0, 0, 0, 0.2);
    }

    .introduction-section {
        margin-bottom: 3rem;
    }

    .introduction-description {
        font-size: 1rem !important;
        margin: .5rem 1rem !important;
        text-wrap: wrap !important;
    }
    
    
    .about-container {
        height: auto;
        display: block;
        margin-bottom: 3rem;
    }

    .section-title  {

        justify-content: center !important;
    }

    .about-content {
        text-align: center !important;
    }

    .what-container {
        height: auto;
        display: block;
        margin-bottom: 3rem;
    }

    .services-container {
        height: auto;
        display: block;
        margin-bottom: 3rem;
    }

    .contact-container {
        height: auto;
        display: block;
        margin-bottom: 3rem;
    }

    #map {
        height: 220px;
    }

    .services-container .service-item {
        height: 550px;
        background: white;
        transition: 0.3s;
    }

}









