body{
    background-color:#EDE9E0 ;
    display: flex;
    flex-direction: column;
}
nav{
    display:flex;
    width:100%;
    align-items: center;
background-color:#EDE9E0

}
    
   nav ul{
    display:flex;
    gap: 30px;
    list-style-type:none;
    
}
.logoo{
    margin-right: auto;
}

.socialmedia{
    margin-left: auto;
    gap: 20px;
    display: flex;

}
.graph{
    color: grey;
    font-family: cursive;
    display: flex;
    width: 300%;
    
}
.apple{
    margin-top: 15%;
    display: flex;
        font-family: cursive;

}
.para{
    display: flex;
    flex-direction: column;
    margin-left: 100px;
    
}
.pic{
    margin-left: 50%;
    height: 100%;
    width: 100%;
}
.pic img{
    height: 100%;
    width: 100%;
}

.say{
    color: grey;
  font-size: 15px;
  gap:20px;
  margin-left: 40%;
  margin-top: 15%;
}
.pict{
margin-top: 25%;
width: 20%;
height: 20%;
display: flex;
flex-direction: row;

    }

.bee{
    flex-direction: row;
    display: flex;
    gap:25%;
    margin-left: 65%;

}
.se{
    width:500px;
    height: auto;
    margin-top: 20%;
}
.main{
    display: flex;
    justify-content: center;
    background-color:#F3F0EA ;

}
.start{
    display: flex;
    height: auto;
}
.x{
    color:grey
}
.n{
    color: black;
}
.j{
    background-color:#EDE9E0 ;
    padding: 55px;
}
.net{
    color: grey;
    margin-top: 5%;
}
.h{
    margin-top: 10%;
}
.p{
    color: rgb(37, 37, 117);
}
.e{
    color: rgb(98, 41, 41);
}
.i{
    color: grey;
    margin-top: 5%;
}
.div{
    margin-top: 10%;
}
.ya{
    color:#252575;
}
.work{
    color:#622929;
}
.nunc{
    color: grey;
    margin-top: 5%;
}
.zig{
    margin-top: 10%;
}
.en{
    color: #252575;
}
.neg{
    color: #622929;
}
.iz{
    color:grey;
    margin-top:5%;
}
.cap{
    margin-top: 10%;
    text-align: center;

}
.ure{
    color: grey;
}
.fly{
    justify-content: left;
    display: flex;
    gap: 20px;
}
.day{
    margin-top: 20px;
    display: flex;
    gap: 20px;
}
.card-services{
    display: flex;
    gap: 30px;
}
.bar{
    width:130px;
    height: 30px;
    border-radius: 30px;
    background-color: #F3F0EA;
    background-image:linear-gradient(180deg,rgb(237, 232, 223),#b3a589);
}
.tools{
    display: flex;
    gap:30px;
}

.dis{
    margin-left: 35px;
    margin-top: 20px;
    flex-direction: column;
}
.touch{
    text-align: center;
    margin-top: 10%;
}
.vul{
        text-align: center;
color: grey;
}
.fif{
display: flex;
    gap:60px;
    justify-content: center;
}
.card{
    margin-top: 5%;
    height:450px;
    padding-top: 20px;
width:300px;
background: linear-gradient(180deg,rgb(237, 232, 223),#b3a589);
border-radius: 10px;
text-align: left;
padding-left: 30px;
}
.num{
    color:#86756c;
}
.logo{
    flex-direction: row;
    gap: 100px;
    padding-top: 20px;
    color:grey
}
.order{
    padding-top: 20px;
}
.testimonials{
    text-align: center;
    width: 50%;
    height: auto;
}
.dora{
    margin-top: 10%;
    text-align: center;
    display: flex;
    width: 100%;

}
.mon{
    width: 50%;
    height: auto;
}
.camera{
    margin-left: 60%;
    color: #622929;
}
.bay{
    color:black;
}
.three{
text-align: center;}
.enter{
    display: flex;
    padding-left: 30px;
margin-top: 10%;
color: grey;
}
.mang{
    margin-left: 20%;
}
.ning{
    color: black;
}
.img{
    gap:20px;
    padding:30px;
    display: flex;
    justify-content: center;
}
.trust{
    text-align: center;
    margin-top: 10%;

}
.apps{
    gap:30px;
    font-family: cursive;
    margin-top: 5%;
    display: flex;
justify-content: center;
font-size: larger;}

.fusce{
color: grey;
}
.end{
    margin-top: 7%;
    color: grey;
}
.orange{
    background-color: rgb(171, 84, 41);
    height: 70%;
    width: 70%;
}
.nay{
    display: flex;
    gap: 50px;
    justify-content: center;
}
.cards:hover {
    transform: translateY(-20);
    box-shadow: 0px, 0px, 8px, 8px;
    background: linear-gradient(180deg, rgba(247, 169, 169, 0.7),rgb(163, 158, 158));
    cursor: pointer;
    color: plum;
}
.card h1{
    margin-right: 50%;
    text-align: center;
    font-size: 20px;
}