body {
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
            margin: 0;
            font-family: Arial, sans-serif;
            background: linear-gradient(
                to bottom right,
                #000033 0%, 
                #000033 60%, 
                turquoise 100%
            );
            color: white;
            overflow: hidden; /* Prevents overflow due to animations */
        }
        .container {
            text-align: center;
            position: relative; /* Allows positioning of animated rows */
        }
		/*
        img {
            max-width: 100%;
            height: auto;
				border-radius: 50%; 	 circular image
            object-fit: cover;   	cover image with the entire circle
			box-shadow: 20px 20px 35px rgba(0, 0, 0, 0.9),  Shadow for 3D effect
			/* border: 5px solid white;  solid white border around the image 
			inset 0 0 5px rgba(255, 255, 255, 0.3);  Inner glow for metallic look
            border: 15px solid #aaa; 	/* Base border color for the frame 
            background: linear-gradient(145deg, #ccc, #888); /* Gradient for metallic effect 
            border-radius: 50%;  Ensures the border follows the circular shape 
        } */

		img {
			max-width: 100%;
            height: auto;
            border-radius: 50%; /* Makes the image circular */
            object-fit: cover; /* Ensures the image covers the entire circle */
            box-shadow: 
                20px 20px 35px rgba(0, 0, 0, 0.7), /* Shadow for 3D effect */
                inset 0 0 5px rgba(152, 245, 255, 0.5); /* Inner glow for metallic look */
            border: 12px solid #aaa; /* Base border color for the frame */
            background: linear-gradient(145deg, #E0FFFF, #7fffd4); /* Gradient for metallic effect */
            border-radius: 50%; /* Ensures the border follows the circular shape */


}

        /* Styling for binary rows */
        .binary-row {
            position: relative;
            width: 100%;
            white-space: nowrap; /* Prevent line break */
            font-size: 20px; 
            opacity: 0.2; 
        }
        /* Animation for the first row (moving left) */
        .row1, .row4 {
            top: 10%; /* Position from the top */
            animation: move-left 60s linear infinite; 
        }
        /* Animation for the second row (moving right) */
        .row2, .row5 {
            top: 20%; /* Position from the top */
            animation: move-right 90s linear infinite; 
        }
        /* Animation for the third row (moving left) */
        .row3, .row6 {
            top: 20%; /* Position from the top */
            animation: move-left 70s linear infinite; 
        }
		/* Bottom rows */
        .row7 {
            bottom: 6%; /* Position from the bottom */
            animation: move-left 60s linear infinite; /* Animation properties */
        }
        .row8 {
            bottom: 3%; /* Position from the bottom */
            animation: move-right 90s linear infinite; /* Animation properties */
        }
        .row9 {
            bottom: 0%; /* Position from the bottom */
            animation: move-left 80s linear infinite; /* Animation properties */
        }

        
        /* Keyframes for moving left */
        @keyframes move-left {
            0% {
                transform: translateX(100%); /* Start off-screen to the right */
            }
            100% {
                transform: translateX(-100%); /* Move to off-screen left */
            }
        }

        /* Keyframes for moving right */
        @keyframes move-right {
            0% {
                transform: translateX(-100%); /* Start off-screen to the left */
            }
            100% {
                transform: translateX(100%); /* Move to off-screen right */
            }
        }