*{
    margin: 0;
    padding: 0;
    font-family: Arial, Helvetica, sans-serif;
    border: none;
    text-decoration: none;
    box-sizing: border-box;
}

img {
    max-width: 100%;
    height: auto;
}

/* class-home */

.class-home .child {
    display: flex;
    flex-direction: row;
    justify-content: center;
    gap: 130px;
    align-items: center;
    margin-top: 40px;
}

.child{
    width: 90%;
    margin: auto;
}

.class-home div img{
    border-radius: 20px;
}

.class-home h1{
    font-size: 60px;
    font-weight: bolder;
    padding: 16px;
}

.class-home p{
    padding: 20px;
    font-size: 18px;
    color: rgb(108, 107, 107);
    text-align: left;
}

.class-home button{
    margin-left: 15px;
}

/* button */

.start {
    padding: 20px;
    background-color: black;
    color: white;
    border-radius: 10px;
    font-weight: bold;
}

.learn{
    padding:20px ;
    background-color: white;
    font-weight: bold;
    border-radius: 10px;
    border: 1px solid rgb(170, 168, 168);
}

/* responsive */

@media (min-width: 320px) and (max-width: 767px) {
    .class-home .child{
        display: flex;
        flex-direction: column;
        gap: 20px;
    }
}
/* end class-home */
/* start choose-fitcore */
/* heading */
h2,.top-paragraph{
    text-align: center;
    padding: 20px;
}

h2{
    font-size: 30px;
    font-weight: bolder;
}

.top-paragraph {
    font-size: 18px;
    color:rgb(108, 107, 107) ;
}
/* end heading */
.choose-fitcore .child {
    display: flex;
    flex-direction: row;
    justify-content: center;
    gap: 20px;
    width: 100%;
}
/* box1 */
.child h3{
    padding: 10px;
}
.child p,.numbers p{
    color: rgb(69, 68, 68);
}
.choose-fitcore .box1{
    background-color: rgb(191, 225, 247);
    text-align: center;
    padding: 15px;
    border-radius: 20px;
}

.choose-fitcore .box1 .square{
    width: 50px;
    height: 50px;
    background-color: blue;
    border-radius: 10px;
    margin-left: 40%;
    margin-bottom: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.choose-fitcore .box1 .square .inside-square{
    width: 30px;
    height: 30px;
    background-color:white ;
    border-radius:10px;
}

/* box2 */
.choose-fitcore .box2{
    background-color: rgb(209, 246, 229);
    text-align: center;
    padding: 15px;
    border-radius: 20px;
}

.choose-fitcore .box2 .square{
    width: 50px;
    height: 50px;
    background-color: rgb(139, 196, 163);
    border-radius: 10px;
    margin-left: 40%;
    margin-bottom: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.choose-fitcore .box2 .square .inside-square{
    width: 30px;
    height: 30px;
    background-color:white ;
    border-radius:20px;
}
/* box3 */
.choose-fitcore .box3{
    background-color: rgb(237, 216, 242);
    text-align: center;
    padding: 15px;
    border-radius: 20px;
}

.choose-fitcore .box3 .square{
    width: 50px;
    height: 50px;
    background-color: rgb(151, 38, 143);
    border-radius: 10px;
    margin-left: 40%;
    margin-bottom: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.choose-fitcore .box3 .square .inside-square{
    width: 30px;
    height: 30px;
    background-color:white ;
    border-radius:10px;
}
/* responsive */
@media(min-width:320px) and (max-width:767px){
    .choose-fitcore .child {
        display: flex;
        flex-direction: column;
    }
}
/* end boxs */
/* start imges */
.imges{
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap:100px;
}

.imges img{
    border-radius: 20px;
}

.line{
    border-left: 3px solid black;
    padding-left: 10px;

}

.line h4,p{
    padding: 0px;
}
/* responsive */
@media(min-width:320px) and (max-width:767px){
    .imges{
        display: flex;
        flex-direction: column;
    }

}
/* end imges */
/* end choose fitcore */
/* start member section */
.member{
    background-color: rgb(244, 253, 255);
    width: 100%;
}
.member .child{
    display: flex;
    flex-direction: row;
    justify-content: center;
    gap: 10px;
}

.member .child img{
    border-radius: 200px;
    width: 70px;
}

.photo{
    display: flex;
    flex-direction: row;
    gap:10px;
    padding: 10px;
}
/* person1 */
.person1 {
    background-color: rgb(225, 243, 243);
    padding: 30px;
    border-radius: 15px;
    border: 1px solid lightblue;
}
/* person2 */
.person2{
    background-color: rgb(224, 247, 224);
    padding: 30px;
    border-radius: 15px;
    border: 1px solid rgb(171, 213, 179);
}
/* person3 */
.person3{
    background-color: rgb(250, 235, 250);
    padding: 30px;
    border-radius: 15px;
    border: 1px solid rgb(214, 178, 209);
}

/* responsive */
@media(min-width:320px) and (max-width:767px){
    .member .child{
        display: flex;
        flex-direction: column;
    }
}

/* numbers */

.numbers{
    display: flex;
    flex-direction: row;
    justify-content: center;
    gap: 100px;
    background-color: rgb(229, 242, 247);
    padding: 40px;
    border-radius: 30px;
    width: 70%;
    margin:auto ;
}

.numbers h3{
    font-size: 35px;
}
/* responsive */
@media (max-width: 767px) {
.child, .numbers {
    width: 100%;    
    margin: 0;      
    padding: 10px;  
    }

.numbers {
    display: grid;
    grid-template-rows: 1fr 1fr;
    grid-template-columns: 1fr 1fr;
    text-align: center;
    }
}
/* end member section */
/* start contact section */

form{
    width: 80%;
    background-color:#f9fafb ;
    margin: auto;
    border-radius: 20px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    padding: 30px;
}

form label{
    margin-bottom: -20px;
}

form input,select,form button{
    width: 100% !important;
    box-sizing: border-box;
}

.otherinputs input,select {
    background-color: #f9fafb;
    border: 1px solid rgb(161, 158, 158);
    padding: 20px;
    border-radius: 10px;
}

.names input {
    padding:20px ;
    border-radius: 10px;
    background-color: #f9fafb ;
    border: 1px solid rgb(161, 158, 158) ;
}

.names {
    display: flex;
    flex-direction: row;
    gap: 20px;
}

.names .firstname ,.names .lastname{
    flex:1;
    display: flex;
    flex-direction: column;
}

form button{
    padding: 18px;
    margin: auto;
    background-color: black;
    color: white;
    border-radius: 10px;
    font-size: 20px;
    font-weight: bold;
    text-align: center;
}

form p {
    text-align: center;
    font-size: 15px;
    color: rgb(114, 114, 114);
}
/* responsive */
@media(min-width:320px) and (max-width:767px){
    .names{
        display: flex;
        flex-direction: column;
        gap: 0px;
    }
}

/* end contact section */
/* start footor section */

.footor .row1,.row2{
    background-color: rgb(24, 36, 62);
    padding: 40px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    gap: 20px;
}

.footor h3,h4{
    color: white;
    padding: 10px;
}

.footor p,a {
    color: rgb(162, 162, 162);
    padding: 10px;
}

.col2 .links{
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.col1 .social {
    display: flex;
    flex-direction: row;
    gap: 15px;
    color:rgb(156, 156, 156) ;
}

.end-links{
    display: flex;
    flex-direction: row;
    gap:20px;
}

hr{
    height: 1px;
    background-color: rgb(162, 162, 162);
    
}

/* responsive */
@media(min-width:320px) and (max-width:767px){
    .footor .row1,.row2{
        display: flex;
        flex-direction: column;
    }
}
/* End footor section */