body {
    
        font-family: Arial, sans-serif;
        background-color: #f4f4f4;
        color: #333;
        margin: 0;
        padding: 0;
}
.content1{
    display: flex;
    justify-content: space-evenly;
    margin-top: 50px;
    background-color: rgb(255, 123, 0);
    border-radius: 0% 0% 50% 50% ;
    height: 500px;
}
.part1{
    margin-top: 20px;
}
.part1 h1{
    font-weight: bolder;
    color: rgb(68, 67, 67);
}
.part1 strong{
    color: white;
    font-size: 30px;
}
.part1 p{
    font-size: 16px;
    width: 100%;
    font-style: normal;
}
.img_part1 img{
width: 90%;
}
.condon{
     margin-top: 20px;
    text-align: center;    
}
.mission{
    display: flex;
    justify-content: space-evenly;
    height: 450px;
   margin-top: 10px;
}
.head_mission{
    color: aliceblue;
    font-weight: bolder;
    background-color: purple;
    border: 10px solid rgb(151, 82, 153);
    border-radius: 20px 20px 20px 20px;
    width: 50%;
    margin-left: 25%;
}
.prompt{
    width: 250px;
    background-color: blue;
    border-radius: 50%;
    height: 50%;
    border: 10px solid rgb(179, 177, 177);
    text-align: center;
}
.quality{
    width: 250px;
    background-color: rgb(212, 10, 104);
    border-radius: 50%;
    height: 50%;
    border: 10px solid rgb(179, 177, 177);
    text-align: center;
}
.service{
    width: 250px;
    background-color: rgb(37, 73, 45);
    border-radius: 50%;
    height: 50%;
    border: 10px solid rgb(153, 151, 27);
    text-align: center;
}
.guaranteed{
    width: 250px;
    background-color: rgb(110, 7, 114);
    border-radius: 50%;
    height: 50%;
    border: 10px solid rgb(194, 117, 159);
    text-align: center;
}
.mission h1{
    margin-top: 85px;
    color: white;
    font-weight: bolder;

}
.member{
    display: flex;
    justify-content: center;
    background-color: rgb(255, 123, 0);
    height:700px;
    margin-top: -15%;   
    border-radius: 40% 40% 0% 0% ;
}
.member1{
    margin-left: 2%;
    margin-top: 20%;

}
h3{
    font-size: 12px;
    color: white;
}
.member h1{
    margin-left: 2%;
    margin-top: 20%;
    color: white;
    text-shadow: 2px 2px 2px black;
    font-size: 50px;
}
.member img{
    width: 200px;
}
.serve{
    height:auto;
    text-shadow: 2px 2px 2px rgb(255, 255, 255);
    background-color: rgba(228, 228, 228, 0.644);
}
.serve h1{
    color:rgb(255, 138, 4);
    font-size: 60px;
    font-weight: bolder;
}
.service1 img{
    width: 550px;
}
.service1{
    text-align: center;
    margin-top: 5%;
}
.service1 h6{
    font-size: 28px;
    color: rgb(0, 0, 0);
    text-shadow: 1px 30px 10px rgb(230, 109, 10);
}
.feedback{
    height: auto;
    position:absolute;
   margin-top: 5%;
   background-color: rgb(231, 113, 45);
}
.feedback h1{
    text-align: center;
    color: white;
}
.customer{
    display: grid;
    justify-content: space-evenly;
}
.customer span{
    font-size: 36px;
}
.customer img{
    width: 300px;
}
.feedback p{
    color: rgb(224, 224, 224);
    font-size: 16px;
    font-weight: bold;
    width: 80%;
    font-style: normal;
    margin-left: 10%;
}
.feedback strong{
    color: rgb(208, 255, 0);
    text-shadow: 0px 1px 1px rgb(0, 0, 0);
}
.form{
    width: 80%;
    margin-top: 80%;
    margin-left: 10%;
    display: flex;
    justify-content: space-evenly;
}
@media screen and (max-width:786px) {
    .form{
        display: grid;
        margin-top: 190%;
    }
}
.form button{
    width: 50%;
}
.card{
    text-align: center;
    padding: 20px;
    margin: 20px;
    box-shadow: 1px 1px 10px grey;
}
.card h3{
    color: rgb(255, 115, 0);
    font-weight: bold;
}
.card h4{
    color: rgb(102, 87, 87);
}
.card:hover{
    background-color: rgb(212, 107, 8);
    color: white;
}
.card:hover h4{
    color: white;
}
.card:hover h3{
    color: white;
}
.flex{
    display:flex;
    justify-content: space-evenly;
    width: 80%;
    margin-left: 10%;
}
.data{
    background-color: rgba(0, 0, 0, 0.541);
    height: 450px;
}
.photo{
    width: 100%;
}
.photo img{
    width: 100%;
    height: auto;
}

.data p{
    font-size: 16px;
}
@media screen and (max-width: 768px){
    .flex{
        display: grid;
        width: 80%;
    }
}
.data button{
    margin-left: 30px;
    text-align: center;
    width: 150px;
}
.data button:hover{
    background: white;
    color: red;
    border: 0px solid transparent;
}
.data p, h3{
 color: rgb(255, 255, 255);
 padding: 30px;
 width: 80%;
}
@media screen and (max-width:768px){
    .content1{
        display: grid;
        justify-content: center;
        margin-left: 10%;
        width: 80%;
    }
    .part1{
        margin-top: 20px;
        margin-left: 20%;
        width: 50%;
    }
    .part1 h1{
        font-weight: bolder;
        color: rgb(68, 67, 67);
    }
    .part1 strong{
        color: white;
        font-size: 30px;
    }
    .part1 p{
        font-size: 16px;
        width: 100%;
        font-style: normal;
    }
    .img_part1 img{
        width: 110%;
        }
        .condon{
            display:flow-root;
            justify-content: space-evenly;
            height: 500px;
            margin-left: 10%;
            width: 80%;
            margin-top: 50%;
        }
        .mission{
            display:flow-root;
            justify-content: space-evenly;
            height: 500px;
            margin-left: 10%;
            width: 80%;
            margin-top: 10%;
            margin-bottom: 50%;
        }
        .prompt,.quality, .service, .guaranteed{
            margin: 20px;
        }
        .member{
            display: grid;
            margin-top: 150%;
            height: 1000px;
        }
        .member h1{
            margin-left: 20%;
        }
        .member1{
            margin-top: 10%;
        }
        .member h3{
            font-size: 20px;
            margin-top: -5%;
            color: rgb(0, 0, 0);
            background-color: white;
            text-align: right;
        }
        .member img{
            width: 100px;
        }
        .customer{
            display: flow-root;
            justify-content: space-evenly;
        }
}