:root { --primary-color: rgb(230, 210, 255); --text-color: rgb(230, 230, 255); --background-color: rgb(50, 35, 75); --second-bg-color: black; } * { text-align: center; color: var(--text-color); font-family: Verdana, Geneva, Tahoma, sans-serif; } h1, h1>* { color: var(--primary-color) } p, select, input { font-size: 1.4rem; } p { margin: 5px; display: inline-block } body, html { background-color: var(--background-color); } .grid-container { width: 100%; margin: auto; } select, input { display: inline-block; background-color: var(--second-bg-color); color: var(--text-color); margin: 5px auto; border: 2px var(--primary-color) solid; border-radius: 5px; padding: 5px; } .col-sm-3 { outline: white solid 2px } select:hover, input:hover { color: var(--text-color); border-color: var(--text-color) } label { font-size: 1.5rem; } hr { opacity: 0.3; } .note { font-size: 1.1rem; color: white; } .setting { display: block; margin: 5px; }