
.sections{
    padding: 4em 10px;
}

    .sections .hero_btn_wrap{
        margin-top: 40px;
    }

/* ABOUT SECTION */    

        .mutipleText_wrap{
            display: flex;
            flex-wrap: wrap;
            justify-content: space-between;
            margin: 80px 0;
        }

            .text_wrap{
                width: 100%;
                margin: 10px;
                flex: 1 1 300px;
                padding: 10px;
            }

                .text_wrap h2{
                    font-size: 2.5rem;
                    color: var(--primary-color);
                    font-family: var(--secondary-font);
                    margin-bottom: 1em;
                }

                .text_wrap p{
                    font-size: 1.1rem;
                    color: var(--secondary-color);
                    margin-bottom: 10px;
                }


            .singleText_wrap{
                margin: 10px auto;
                padding: 10px;  
                text-align: center;           
            }
                .singleText_wrap h2{
                    font-size: 2.5rem;
                    color: var(--dark-grey);
                    font-family: var(--secondary-font);
                    margin-bottom: 1em;
                }

                .singleText_wrap p{
                    font-size: 1.1rem;
                    color: var(--secondary-color);
                    margin-bottom: 5px;
                }
                    #innerTextUl{
                        padding: 10px;
                    }

                    #innerTextUl li{
                        margin-left: 10px;
                    }

                    #innerTextUl li strong{
                        display: block;
                        color: var(--tertiary-color);
                        font-family: var(--secondary-color);
                        font-size: 1.1rem;
                    }

/* SERVICES */
#outter_secWrap_services{
    background: var(--dark-grey);
}


    #services .main_title h2{
        color: var(--light-grey);
    }

     .services_wrap{
        display: flex;
        flex-wrap: wrap;
     }
        .service_Wrap{
            flex: 1 1 300px;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: flex-start;
            margin: 10px;
            padding: 10px;            
        }
            .service_Wrap img{
                width: 120px;
                height: 120px;            
            }

            .service_Wrap p{
                color: var(--light-grey);
                text-align: center;
                margin: 1em 0;
                font-family: var(--primary-font);
                font-size: 1.3em;
                letter-spacing: 1px;
            }


/*  OUR WORK */


#outter_secWrap_Ourwork{
    position: relative;
    overflow: hidden;
}        

    #ourWork{


    }

        #workcards_wrap{
            padding: 10px;
            margin: 10px;
            display: flex;
            flex-wrap: wrap;
        }
            .workcard_inner{
                margin: 10px;
                display: flex;
                flex-direction: column;
                width: 100%;
                background: var(--dark-grey);
                padding: 15px;
                text-align: center;
                position: relative;
                overflow: hidden;
            }
                    .workcard_inner::after{
                        content: '';
                        position: absolute;
                        bottom: -240px;
                        left: 311px;
                        width: 38%;
                        transform: rotate(44deg);
                        height: 238%;
                        background: var(--primary-color);
                        z-index: 0;
                    }

                .workcard_img_wrap{
                    display: flex;
                    flex-wrap: wrap; 
                    z-index: 1; 
                    height: 400px;                              
                }
                    .workcard_img_wrap .workCard_img{
                        width: calc(100% / 2);
                        height:calc(100% / 2);             
                    }

                        .workCard_img img {
                            width: 100%;
                            height: 100%;
                            object-fit: cover;
                        }
                    .workcard_text{
                        margin-top: 10px;
                        z-index: 1; 
                    }
                        .workcard_text h3{
                            color: var(--light-grey);
                            font-family: var(--secondary-font);
                            font-size: 1.5rem;                   
                        }


/* form */

#outter_secWrap_contactUs {   
    padding: 20px;
    padding: 10px;    
    background: url(../IMG/BACKGROUNDS/hero1.jpg) no-repeat center center/cover, var(--dark-grey);
    position: relative;
    /* min-height: 90vh; */
    display: flex;
    justify-content: flex-start;
    align-items: center;
    box-shadow: 0 4px 18px 7px rgb(40 40 40 / 68%);
    z-index: 0;
}
        /* dark overlay on top of hero */
        #outter_secWrap_contactUs::after{
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background: rgb(0 0 0 / 70%);
            z-index: -1;
        }
    #contactUs {
        width: 100%;
        margin: 0 auto;
        max-width: 800px;
    }

        #contactUs .main_title {
            margin-bottom: 20px;
            text-align: center;
        }

            #contactUs .main_title h2 {
                color:var(--light-grey);
            }

            .main_title .phone p{
                color: var(--light-grey);
                font-family: var(--primary-font);
            }
            .main_title .phone a{
                color: var(--primary-color);
                font-family: var(--primary-font);
                font-size: 2rem;
            }


        #contactform{
            padding: 10px;
        }          
        
            .form_title{
                font-size: 2rem;
                color: var(--light-grey);
                font-family: var(--secondary-font);
                margin-bottom: 10px;
            }

            .form_group {
                margin-bottom: 15px;
                padding: 10px;                
            }

                .form_group label {
                    font-size: 1.3rem;
                    color: var(--light-grey);
                    font-family: var(--secondary-font);
                    margin-bottom: 5px;
                    display: block;
                }
                        .requiredStar{
                            color: var(--primary-color);

                        }

                .form_group input[type="text"],
                .form_group input[type="tel"],
                .form_group input[type="email"],
                .form_group textarea,
                .form_group select {
                    width: 100%;
                    padding: 10px;
                    font-size: 1rem;
                    color: var(--dark-grey);
                    background-color: var(--light-grey);
                    margin-left: 15px;
                }

                .form_group textarea {
                    height: 100px;
                }

                .form_group select {
                    appearance: none;
                    -webkit-appearance: none;
                    -moz-appearance: none;
                    background-image: url('data:image/svg+xml;utf8,<svg fill="var(--secondary-color)" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24px" height="24px"><path d="M7.41 8.59L12 13.17l4.59-4.58L18 10l-6 6-6-6 1.41-1.41z"/></svg>');
                    background-repeat: no-repeat;
                    background-position-x: calc(100% - 15px);
                    background-position-y: center;
                    padding-right: 30px;
                }

                .form_group input[type="checkbox"] {
                    margin-left: 15px;
                    width: 20px; /* Adjust width */
                    height: 20px; /* Adjust height */
                    vertical-align: middle;     
                    cursor: pointer;               
                }







@media only screen and (min-width:650px){


    /* about */

    .text_wrap h2, .singleText_wrap h2{
        text-align: center;
    }

    .text_wrap p, .singleText_wrap p{
        font-size: 1.2rem;
        color: var(--secondary-color);
    }

    .singleText_wrap{
        max-width: 80%;            
    }


    /* OUR WORK */
    .workcard_inner{
        width: calc(100% / 2 - 20px);
    }

    #outter_secWrap_contactUs {
        background: url(../IMG/BACKGROUNDS/hero1.jpg) no-repeat center center/cover, black;
        background-attachment: fixed;
        -webkit-background-attachment: fixed; /* For Safari 4.0 - 8.0 */
        -moz-background-attachment: fixed; /* For Firefox */
        -o-background-attachment: fixed; /* For Opera */
        -ms-background-attachment: fixed; /* For Internet Explorer */        
    }

}



@media only screen and (min-width:1024px){


    /* global */

    .sections{
        max-width: 90%;
    }

    .singleText_wrap{
        max-width: 70%;            
    }


}

@media only screen and (min-width:1300px){

    /* global */
    .sections{
        max-width: 80%;
    }

    /* about */
    .singleText_wrap{
        max-width: 60%;            
    }

    /* services */


    /* OUR WORK */
    .workcard_inner{
        width: calc(100% / 3 - 20px);
    }

}