/* ========================================= GOTHAMSEC: DARK KNIGHT PROTOCOL THEME ========================================= */ :root { /* -- PALETTE DEFINITIONS -- */ --bat-black: #050505; /* Deepest Void */ --armor-grey: #1a1a1a; /* Matte Armor */ --tech-grey: #2d2d2d; /* Gunmetal */ --neon-cyan: #00f0ff; /* Electric Circuit */ --neon-purple: #bc13fe; /* Venom/Signal */ --text-primary: #e0e0e0; --text-muted: #888888; /* -- OVERRIDING CTFD DEFAULTS -- */ --bg-color: var(--bat-black); --component-bg: var(--armor-grey); --border-color: var(--tech-grey); } /* 1. CORE ATMOSPHERE */ body { background-color: var(--bat-black) !important; color: var(--text-primary) !important; font-family: 'Rajdhani', 'Roboto Mono', monospace; /* Tech vibe font */ background-image: linear-gradient(rgba(0, 240, 255, 0.03) 1px, transparent 1px), linear-gradient(90deg, rgba(0, 240, 255, 0.03) 1px, transparent 1px); background-size: 40px 40px; /* Subtle grid background */ } /* 2. NAVBAR (The Utility Belt) */ .navbar { background: rgba(5, 5, 5, 0.95) !important; border-bottom: 2px solid var(--neon-purple); box-shadow: 0 4px 30px rgba(188, 19, 254, 0.2); backdrop-filter: blur(10px); } .navbar-brand { font-weight: 700; letter-spacing: 2px; color: var(--neon-cyan) !important; text-transform: uppercase; text-shadow: 0 0 10px rgba(0, 240, 255, 0.6); } .nav-link { color: var(--text-primary) !important; transition: all 0.3s ease; } .nav-link:hover { color: var(--neon-cyan) !important; text-shadow: 0 0 8px var(--neon-cyan); } /* 3. CHALLENGE CARDS (The Gadgets) */ .challenge-button { background: var(--armor-grey) !important; border: 1px solid var(--tech-grey) !important; border-radius: 0 !important; /* Sharp corners */ position: relative; overflow: hidden; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); } .challenge-button:hover { transform: translateY(-3px); border-color: var(--neon-cyan) !important; box-shadow: 0 0 15px rgba(0, 240, 255, 0.3), inset 0 0 10px rgba(0, 240, 255, 0.1); } /* Solved State - The Signal */ .challenge-button.solved { border-color: var(--neon-purple) !important; box-shadow: 0 0 15px rgba(188, 19, 254, 0.4); opacity: 0.7; } /* 4. MODALS & PANELS (The Batcomputer Interface) */ .modal-content { background-color: var(--armor-grey) !important; border: 1px solid var(--neon-cyan); box-shadow: 0 0 40px rgba(0, 0, 0, 0.8); border-radius: 4px; } .modal-header { border-bottom: 1px solid var(--tech-grey); background: linear-gradient(90deg, rgba(0,240,255,0.1) 0%, transparent 100%); } .modal-title { color: var(--neon-cyan); text-transform: uppercase; letter-spacing: 1.5px; } .nav-tabs .nav-link.active { background-color: transparent !important; border-color: transparent transparent var(--neon-cyan) !important; color: var(--neon-cyan) !important; border-bottom-width: 2px; } /* 5. INPUTS & BUTTONS */ input.form-control { background-color: #000 !important; border: 1px solid var(--tech-grey) !important; color: var(--neon-cyan) !important; border-radius: 2px; } input.form-control:focus { box-shadow: 0 0 10px rgba(0, 240, 255, 0.3); border-color: var(--neon-cyan) !important; } .btn-primary { background: transparent !important; border: 1px solid var(--neon-cyan) !important; color: var(--neon-cyan) !important; text-transform: uppercase; font-weight: bold; letter-spacing: 1px; border-radius: 2px; position: relative; overflow: hidden; z-index: 1; transition: all 0.4s ease; } .btn-primary:hover { background: var(--neon-cyan) !important; color: #000 !important; box-shadow: 0 0 20px rgba(0, 240, 255, 0.6); } /* 6. SCOREBOARD (The Leaderboard) */ .table { color: var(--text-primary) !important; } .table thead th { border-bottom: 2px solid var(--neon-purple) !important; color: var(--neon-purple); text-transform: uppercase; } .table td { border-top: 1px solid var(--tech-grey) !important; vertical-align: middle; } /* 7. JUMBOTRON (The Landing Area) */ /* This assumes your banner is uploaded via Admin > Config */ .jumbotron { background: transparent !important; /* Let the banner shine */ text-align: center; } .jumbotron h1 { text-shadow: 0 0 20px rgba(0,0,0,0.9); font-weight: 800; letter-spacing: -2px; } /* 8. FOOTER */ footer { background-color: var(--bat-black) !important; border-top: 1px solid var(--tech-grey); color: var(--text-muted) !important; } /* 9. GLITCH ANIMATION FOR TITLE (Optional Flare) */ @keyframes glitch { 0% { text-shadow: 2px 0 var(--neon-purple), -2px 0 var(--neon-cyan); } 25% { text-shadow: -2px 0 var(--neon-purple), 2px 0 var(--neon-cyan); } 50% { text-shadow: 2px 0 var(--neon-purple), -2px 0 var(--neon-cyan); } 75% { text-shadow: -2px 0 var(--neon-purple), 2px 0 var(--neon-cyan); } 100% { text-shadow: 2px 0 var(--neon-purple), -2px 0 var(--neon-cyan); } } h1, h2, h3 { color: white; } /* Apply neon glow to specific bold text */ b, strong { color: var(--neon-cyan); }

Register
Login
- English
- Deutsch
- Polski
- Español
- اَلْعَرَبِيَّةُ
- 简体中文
- 繁體中文
- Français
- 한국어
- русский язык
- Português do Brasil
- Slovenský jazyk
- 日本語
- Italiano
- tiếng Việt
- Català
- Ελληνικά
- Suomi
- Română
- Slovenščina
- Svenska
- עברית
- oʻzbekcha

Register