body {
    margin: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
    background-color: #f0f0f0; /* Light background */
}

.container {
    position: relative;
    width: 400px; /* Set a fixed width */
    height: 600px; /* Set a fixed height */
    overflow: hidden; /* Hide overflowing hearts */
    border: 2px solid #FF4081; /* Optionally, add a border to the container */
    border-radius: 10px; /* Rounded corners */
}

.heart {
                width: 200px; /* control the size */
                aspect-ratio: 1;
                border-image: radial-gradient(red 69%,#0000 70%) 84.5% fill/100%;
                clip-path: polygon(0 0,100% 0,100% 41%,50% 91%,0 41%);
    animation: float 3s infinite; /* Animation */
}

@keyframes float {
    0% {
        transform: translateY(0);
    }
    100% {
        transform: translateY(-100px);
    }
}