body{
    font-family:Arial, Helvetica, sans-serif;
    background-color: rgb(255, 255, 255);
}
.dark-mode{
    background-color: black;
    color: white;
}
.dark-mode .download-app{
    font-weight: 500;
    background-image: linear-gradient(to bottom left,gold,black);
}
.dark-mode .download-app:hover{
    background-image: linear-gradient(to bottom left,rgb(168, 145, 15),black);
}
.dark-mode .Smart-solution,.dark-mode .discover,.dark-mode .download-app,.dark-mode .our-contact-us, .dark-mode input,.dark-mode input::placeholder,.dark-mode textarea ,.dark-mode textarea::placeholder{
    color: white;
}
.img-1{
    transition: 0.5s all;
    animation: 0.7s alternate infinite movement;
    cursor: no-drop;
}
@keyframes movement {
    from{
        transform: translateY(0);
    }
    to{
        transform: translateY(-20px);
    }
}
.card1,.card2,.card3{
    transition: 0.5s all;
}
.card1:hover , .card2:hover , .card3:hover{
    transform: translateY(-10px);
    box-shadow: 0 15px 30px 6px black;
}

.dark-mode .card1,.dark-mode .card2,.dark-mode .card3{
    transition: 0.5s all;
}
.dark-mode .card1:hover ,.dark-mode .card2:hover ,.dark-mode .card3:hover{
    transform: translateY(-10px);
    box-shadow: 0 15px 30px 13px grey;
}
footer p:hover, footer h2:hover{
    text-decoration: underline;
    cursor: pointer;
}
.img-2{
    transition-property: transform;
    transition: 0.3s ease-out;
}
.img-2:hover{
    filter: brightness(0.8);
    transform: translateX(-25px);
}
footer i{
    cursor: pointer;
    animation: 3s infinite alternate icons;
}
@keyframes icons {
    from{
        transform: rotate(0) scale(1.2);
    }
    to{
        transform: rotate(180deg) scale(1);
    }
}