body { margin: 0; background-color: #000000; color: #FFFFFF; font-family: 'Special Elite', monospace; overflow-x: hidden; } header { text-align: center; padding: 30px 20px; background-color: #0a0a0a; box-shadow: 0 2px 10px #FF4E00; } .title { font-family: 'Pirata One', cursive; color: #FF4E00; font-size: 60px; margin: 0; letter-spacing: 3px; } .navbar { margin-top: 20px; display: flex; justify-content: center; flex-wrap: wrap; gap: 20px; } .navbar a { color: #FFFFFF; text-decoration: none; padding: 12px 25px; border: 2px solid #FF4E00; border-radius: 5px; transition: all 0.4s ease; font-size: 18px; } .navbar a:hover { background-color: #00FF00; color: #000000; transform: scale(1.1); } .welcome { margin: 30px 0; background-color: #111111; padding: 10px 0; box-shadow: inset 0 0 10px #FF4E00; } .welcome marquee { font-size: 22px; color: #FF4E00; } .filters { text-align: center; margin: 40px 0; } .dropdown { position: relative; display: inline-block; } .dropbtn { background-color: #FF4E00; color: #000000; padding: 14px 28px; font-size: 18px; border: none; border-radius: 8px; cursor: pointer; transition: background-color 0.4s, transform 0.4s; } .dropbtn:hover { background-color: #00FF00; transform: translateY(-2px); } .dropdown-content { display: none; position: absolute; background-color: #000000; min-width: 180px; box-shadow: 0px 8px 16px 0px rgba(255,78,0,0.5); z-index: 1; border: 1px solid #FF4E00; } .dropdown-content a { color: #FFFFFF; padding: 14px 18px; text-decoration: none; display: block; font-size: 16px; transition: background-color 0.3s; } .dropdown-content a:hover { background-color: #00FF00; color: #000000; } .dropdown:hover .dropdown-content { display: block; } .torrent-table { width: 90%; margin: 50px auto; overflow-x: auto; } .torrent-table table { width: 100%; border-collapse: collapse; background-color: #111111; box-shadow: 0 0 10px #FF4E00; } .torrent-table th, .torrent-table td { border: 1px solid #FF4E00; padding: 16px; text-align: center; font-size: 18px; transition: background-color 0.3s, color 0.3s; } .torrent-table th { background-color: #FF4E00; color: #000000; text-transform: uppercase; } .torrent-table tr:hover { background-color: #00FF00; color: #000000; } footer { text-align: center; padding: 20px; background-color: #0a0a0a; border-top: 2px solid #FF4E00; margin-top: 50px; font-size: 14px; } footer p { color: #FFFFFF; margin: 0; letter-spacing: 1px; } html { scroll-behavior: smooth; } .torrent-table tbody tr { cursor: pointer; } .torrent-table tbody tr:hover td { background-color: #00FF00; color: #000000; } @media (max-width: 1024px) { .title { font-size: 50px; } .navbar a { font-size: 16px; padding: 10px 20px; } .dropbtn { padding: 12px 24px; font-size: 16px; } .torrent-table th, .torrent-table td { font-size: 16px; padding: 12px; } } @media (max-width: 768px) { .navbar { flex-direction: column; gap: 10px; } .navbar a { width: 80%; text-align: center; } .title { font-size: 40px; } .dropbtn { width: 100%; padding: 10px; } .torrent-table { width: 100%; margin: 20px 0; } } @media (max-width: 480px) { .title { font-size: 32px; } .welcome marquee { font-size: 18px; } .dropbtn { font-size: 14px; padding: 8px 16px; } .dropdown-content a { font-size: 14px; padding: 10px; } .torrent-table th, .torrent-table td { font-size: 14px; padding: 10px; } footer { font-size: 12px; } }