/* Global Styles */ body { font-family: 'Arial', sans-serif; background-color: #f4f4f4; color: #333; margin: 0; padding: 0; } /* Header Marquee */ .header-marquee { background-color: #3498db; color: white; text-align: center; padding: 10px; border-radius: 5px; margin: 10px; font-size: 16px; font-weight: bold; box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1); } /* Button Group */ .button-group { display: flex; justify-content: center; gap: 15px; margin: 20px 10px; flex-wrap: wrap; } .button-group button { background-color: #3498db; color: white; border: none; border-radius: 5px; padding: 10px 20px; cursor: pointer; font-size: 14px; font-weight: bold; transition: all 0.3s ease; box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1); } .button-group button:hover { background-color: #2980b9; transform: scale(1.05); } /* TV Container */ #tv-container { position: relative; max-width: 900px; margin: 20px auto; border-radius: 10px; overflow: hidden; box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2); } #tv-iframe { width: 100%; height: 500px; border: none; } /* Responsive Design */ @media (max-width: 768px) { .button-group button { flex: 1 1 calc(50% - 15px); } #tv-iframe { height: 400px; } } @media (max-width: 480px) { .button-group button { flex: 1 1 100%; } #tv-iframe { height: 300px; } } You can change the TV link by clicking on the buttons below. LIVE TV 1 TV 2 TV 3 // Function to change iframe source function changeSource(newSource) { const iframe = document.getElementById('tv-iframe'); iframe.src = newSource; }