| |
| * { |
| margin: 0; |
| padding: 0; |
| box-sizing: border-box; |
| font-family: "Poppins", sans-serif; |
| } |
|
|
| body { |
| background-color: #0d0d0d; |
| color: #f1f1f1; |
| min-height: 100vh; |
| } |
|
|
| |
| header { |
| display: flex; |
| align-items: center; |
| justify-content: space-between; |
| background: #1a1a1a; |
| padding: 15px 40px; |
| box-shadow: 0 0 10px #6a0dad; |
| position: sticky; |
| top: 0; |
| z-index: 10; |
| } |
|
|
| .logo { |
| display: flex; |
| align-items: center; |
| gap: 10px; |
| } |
|
|
| .logo img { |
| width: 45px; |
| height: 45px; |
| border-radius: 10px; |
| } |
|
|
| .logo h1 { |
| color: #a855f7; |
| font-size: 24px; |
| } |
|
|
| |
| .nav-links { |
| list-style: none; |
| display: flex; |
| gap: 20px; |
| } |
|
|
| .nav-links a { |
| text-decoration: none; |
| color: #e0e0e0; |
| font-weight: 500; |
| transition: 0.3s; |
| } |
|
|
| .nav-links a:hover { |
| color: #a855f7; |
| text-shadow: 0 0 10px #a855f7; |
| } |
|
|
| |
| .language-select select { |
| background: #262626; |
| color: #f1f1f1; |
| border: 1px solid #a855f7; |
| border-radius: 8px; |
| padding: 5px 10px; |
| cursor: pointer; |
| } |
|
|
| |
| main { |
| padding: 50px 80px; |
| } |
|
|
| .anime-list h2 { |
| font-size: 28px; |
| color: #a855f7; |
| margin-bottom: 20px; |
| text-shadow: 0 0 10px #a855f7; |
| } |
|
|
| |
| .anime-cards { |
| display: grid; |
| grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); |
| gap: 25px; |
| } |
|
|
| .anime-card { |
| background: #1a1a1a; |
| border: 1px solid #3b3b3b; |
| border-radius: 15px; |
| padding: 10px; |
| text-align: center; |
| transition: transform 0.3s, box-shadow 0.3s; |
| } |
|
|
| .anime-card:hover { |
| transform: translateY(-10px); |
| box-shadow: 0 0 20px #a855f7; |
| } |
|
|
| .anime-card img { |
| width: 100%; |
| border-radius: 10px; |
| } |
|
|
| .anime-card h3 { |
| margin: 10px 0; |
| color: #f1f1f1; |
| } |
|
|
| .anime-card button { |
| background: #a855f7; |
| border: none; |
| border-radius: 8px; |
| color: white; |
| padding: 8px 15px; |
| cursor: pointer; |
| font-weight: 600; |
| transition: 0.3s; |
| } |
|
|
| .anime-card button:hover { |
| background: #9333ea; |
| box-shadow: 0 0 15px #a855f7; |
| } |
|
|
| |
| footer { |
| text-align: center; |
| padding: 15px; |
| background: #1a1a1a; |
| color: #a0a0a0; |
| border-top: 1px solid #3b3b3b; |
| margin-top: 40px; |
| } |