.setting-line { margin: 0.6em 0 0.6em 0.3em; position: relative; } .setting-line .choices { display: flex; flex-wrap: wrap; } .setting-line .radio-line input { margin-right: 0.3em; height: 1.2rem; width: 1.2rem; border: 1px solid; outline: none; -webkit-appearance: none; cursor: pointer; border-radius: 50%; } .setting-line .radio-line input + span { padding-bottom: 1px; } .radio-line .setting-name { width: 100%; } .radio-line .choice { margin-top: 0.1em; margin-bottom: 0.1em; min-width: 3.8em; padding: 0.3em; display: flex; align-items: center; cursor: pointer; } .radio-line .choice + .choice { margin-left: 0.5em; } .toggle { position: relative; width: 100%; margin-right: 20px; display: flex; align-items: center; cursor: pointer; } .toggle input { opacity: 0; position: absolute; } .slider { position: relative; width: 45px; min-width: 45px; display: block; height: 28px; margin-right: 20px; cursor: pointer; background-color: #ccc; transition: .3s; } .slider:before { position: absolute; content: ""; height: 19px; width: 19px; left: 4px; bottom: 4px; transition: .3s; } input:checked + .slider:before { transform: translateX(19px); } .setting-line > .sub-settings { padding-left: 42px; width: 100%; display: block; } #settings .setting-line { margin: 1.2em 0.6em; }