@import url('https://fonts.googleapis.com/css2?family=Handlee&display=swap');


.aboutus-contain-main{
    padding-top:700px;
    /* height: 2000px; */
    /* background-color: red; */
}
.aboutus-contain-main-header{
    text-align: center;
    margin-top: 40px;
}
.topic-background{
    position: absolute;
    top:100px;
    width: 100%; 
    height:600px;
    object-fit: cover;
    background: linear-gradient(rgb(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)),
    url("../image/professional-cleaning-services.jpg");
    background-size:cover;
    background-repeat:no-repeat;
    background-position:center;
    background-size:cover;
    background-repeat:no-repeat;
    background-attachment:fixed;
    background-position: top;
  
}
.topic{
    margin-top: 250px;
    text-align: center;
    font-weight: 500;
    color: azure;
    font-size: 50px;
}.image{
    width: 100%; 
    height:400px;
    object-fit: cover;
}
.line-2{
    height:2px;
    width: 100px;
    background-color: white;
    margin-top: 10px;
    margin-right:calc(50% + 5px) ;
}
.aboutus-content{
    box-sizing: border-box;
    width: 100%;
    padding-top: 50px;
    padding-left: 20px;
    /* background-color: red; */
    min-height:400px;
    padding-bottom: 50px;
}
.aboutus-content h1{
    /* width: 100%; */
    width:calc(100% - 610px);
    text-align: center;
    padding-bottom: 50px;
    /* padding-left: 20px; */
}
.aboutus-content-text{
    /* position: absolute; */
    padding-left:5%;
    padding-right: 5%;
    display: inline-block;
    text-align: center;
    box-sizing: border-box;
    /* height: 100px; */
    /* background-color: yellow; */
    /* width: 100px; */
    /* width:calc(100% - 600px); */
    box-sizing: border-box;
}
.aboutus-content-image{
    /* padding-top: 10px; */
    text-align: center;
    box-sizing: border-box;
    /* position: absolute; */
    /* left:calc(100% - 580px); */
    /* width: 580px; */
    /* height: 100px; */
    /* background-color: red; */
    display: inline-block;
    box-sizing: border-box;

}
.aboutus-content-image-1{
    display: none;
}
.aboutus-content-image-img{
    width:400px;
}
@media(max-width:1050px){
    .aboutus-content-image-img{
        width:100%;
    }
}
@media(max-width:992px){
    .aboutus-content-text{
        display: block;
    }
    .aboutus-content-image-1{
        display: block;
    }
    .aboutus-content-image{
        display: none;
    }
}

.what-we-do-row{
    width: 100% !important;
    text-align: center;
    margin-top: 200px;
}
.aboutus-what-we-do{
    min-height:400px;
    width: 100%;
    /* background-color: aqua; */
}
.aboutus-what-we-do h1{
    text-align: center;
    padding: 30px;
    padding-top: 50px;
}
.aboutus-what-we-do-content{
 /* background-color: red; */
 min-height: 100px;
 position: static;
 margin-bottom: 100px;
}
.aboutus-what-we-do-row{
    width: 100%;
    text-align: center;
    margin-top: 100px;
}
.aboutus-what-we-do-col{
    width: 500px;
    display: inline-block;
    height: 500px;
    /* margin-right: 1%; */
    margin-top: 40px;
    background-color: rebeccapurple;
}
.service-img{
    width: 370px;
    height: 370px;
    border-radius: 50%;
    object-fit: cover;
    box-sizing: content-box;
    margin-bottom: 50px;
}
@media(max-width:1200px){
    .service-img{
        width: 300px;
        height: 300px;
    }
}
@media(max-width:1000px){
    .service-img{
        width: 250px;
        height: 250px;
    }
}

@media(max-width:900px){
    .service-img{
        width: 200px;
        height: 200px;
    }
}
@media(max-width:768px){
    .service-img{
        width: 280px;
        height: 280px;
    }
    .what-we-do-row{

        margin-top: 250px;
    }
}
@media(max-width:576px){

    .service-img{
        margin-left:20px;
        /* margin-top: 350px; */
    }
}

@media(max-width:500px){

    .what-we-do-row{
        margin-top: 350px;
    }
}

.aboutus-what-we-do-col h3{
    padding-top: 30px;
    text-align: center;
    padding-left: 10px;
}
.why-we-choose-us{
    width: 100%;
    min-height: 400px;
    background-color: rgb(8, 3, 44);
}
.why-we-choose-us h1{
    padding: 30px;
    text-align: center;
    color: white;
}
.why-we-choose-us-row{
    width: 100%;
    text-align: center;
}
.why-we-choose-us-col{
    margin-top: 50px;
    display: inline-block;
    width: 300px;
    height: 300px;
    /* background-color: whit   e; */
}
.why-we-choose-us-col .col-icon{
    height: 100px;
    width: 100%;
    /* background-color: red; */
 /* color: red; */
    position: relative;
}
.why-we-choose-us-col .fa{
    font-size: 60px !important;
    position: absolute;
    left:calc(50% - 25px);
    color: rgb(236, 171, 31);
}
.why-we-choose-us-col h3{
    color: white;
}


.how-we-work{
    width: 100%; 
    min-height:600px;
    object-fit: cover;
    background: linear-gradient(rgba(85, 205, 245, 0.7), rgba(5, 14, 15, 0.7)),
    url("../image/howitworks.jpg");
    background-size:cover;
    background-repeat:no-repeat;
    background-position:center;
    background-size:cover;
    background-repeat:no-repeat;
    background-attachment:fixed;
    background-position: center;
}
.how-we-work-row{
    width: 100%;
    /* padding-top: 175px; */
}
.circle-outline{
    margin-top:100px;
    width: 230px;
    height: 230px;
    background-color: white;
    border-radius: 50%;
    display: inline-block;
    /* margin-right: 10%; */
    padding: 5px;
    margin-left: 10px;
    /* background-color: red; */
    position: relative;
}
.inner-circle{
    width: 220px;
    height: 220px;
    border-radius: 50%;
    border: 0.5px solid gray;
    
}
.inner-circle .shedule{
    width: 165px;
    position: absolute;
    left: 36px;
    top:50px;
    /* border-radius: 50%; */
}
.inner-circle .weclean{
    width: 140px;
    position: absolute;
    left:48px;
    top:35px;
    /* border-radius: 50%; */
}
.inner-circle .behappy{
    width: 170px;
    position: absolute;
    left: 30px;
    top:25px;
    /* border-radius: 50%; */
}

.how-we-work-text{
    /* background-color: red; */
    display: inline-block;
    width: 24%;
    text-align: center;
    color: white;
}
/* @media(max-width:1200px){
    .how-we-work-text{
        background-color: red;
        display: inline-block;
        width: 40%;
        text-align: center;
        color: white;
    }
}    */

.text-white{
 color: white;   
}
.small-circle{
    padding-top: 10px;
    width: 50px;
    height: 50px;
    background-color: white;
    border: 2px solid rgb(0, 153, 204 );
    position: absolute;
    border-radius: 50%;
    z-index:3;
    left:165px;
    color: black;
}
.how-we-work-head-2{
    padding-top: 40px;
    margin-top: 20px;
    text-align: center;
    color: white;
    font-size: 45px;
}
.how-we-work-head-1{
    padding-top: 40px;
    text-align: center;
    color: rgb(0, 153, 204 );
    font-family: 'Handlee', cursive;
}
.inner-circle .fa{
    color: black;
    font-size: 100px;
    position: absolute;
    left: 82px;
    top:70px;
}
.aboutus-what-we-do p{
    position: absolute;
    padding-left:20%;
    padding-right: 20%;
    display: inline-block;
    text-align: center;
}
.image{
    width: 100px;
    height: 100px;
}