/* General Styling */
body {
    margin: 0;
    font-family: Arial, sans-serif;
    background: linear-gradient(120deg, #4e342e, #000000);
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    position: relative;
    color: white;
}

/* Background Images */
.background img {
    position: absolute;
    opacity: 0.6;
    width: 150px;
    height: 150px;
}

.img1 { animation: zoom-in-out 10s infinite; top: 10%; left: 5%; }
.img2 { animation: zigzag 12s infinite; top: 30%; right: 10%; }
.img3 { animation: bounce 8s infinite; bottom: 15%; left: 15%; }
.img4 { animation: rotate-scale 15s infinite; top: 70%; right: 25%; }

@keyframes zoom-in-out {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.2); }
}

@keyframes zigzag {
    0%, 100% { transform: translate(0, 0); }
    25% { transform: translate(50px, -50px); }
    50% { transform: translate(100px, 50px); }
    75% { transform: translate(-50px, 50px); }
}

@keyframes bounce {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-30px); }
}

@keyframes rotate-scale {
    0%, 100% { transform: rotate(0deg) scale(1); }
    50% { transform: rotate(180deg) scale(1.3); }
}