* { font-family: ubuntu, sans-serif; } html { font-size: 18px; } body { margin: 0; padding: 0; } body[data-theme="light"] { background-color: white; color: black; } body[data-theme="dark"] { background-color: #101010; color: white; } body[data-theme="spooky"] { background-color: #f9ac59; } body[data-theme="light"] #themebtn { background-color: #D8D8D8; } body[data-theme="dark"] #themebtn { background-color: #202020; } body[data-theme="spooky"] #themebtn { background-color: #a15605; color: white; } body[data-theme="light"] #langbtn { background-color: #D8D8D8; } body[data-theme="dark"] #langbtn { background-color: #202020; } body[data-theme="spooky"] #langbtn { background-color: #a15605; color: white; } body[data-theme="light"] #themebtn:hover { color: #fd8c04; } body[data-theme="dark"] #themebtn:hover { color: #0475FD; } body[data-theme="light"] .list-header { border-top: 2px solid black; border-bottom: 2px solid black; } body[data-theme="dark"] .list-header { border-top: 2px solid white; border-bottom: 2px solid white; } body[data-theme="light"] footer { background-color: #fff; } body[data-theme="dark"] footer { background-color: #101010; } body[data-theme="spooky"] footer { background-color: #f9ac59; } body[data-theme="light"] h1 { color: black; } body[data-theme="light"] h2 { color: black; } body[data-theme="light"] :not(#notifs h3) { color: black; } body[data-theme="light"] h4 { color: black; } body[data-theme="light"] h5 { color: black; } body[data-theme="light"] h6 { color: black; } body[data-theme="dark"] h1 { color: white; } body[data-theme="dark"] h2 { color: white; } body[data-theme="dark"] :not(#notifs h3) { color: white; } body[data-theme="dark"] h4 { color: white; } body[data-theme="dark"] h5 { color: white; } body[data-theme="dark"] h6 { color: white; } a { color: #8c9eff; text-decoration: none; } a:hover { color: #acb8ff; text-decoration: underline; }