universe

Universe
git clone https://git.dasho.dev/universe.git
Log | Files | Refs | Submodules | README

setup.css (21373B)


      1 a.setup-author-output {
      2  padding: 0 10px;
      3  font-size: 14px;
      4  color: #fff;
      5  border-radius: 3px;
      6  height: 30px;
      7  line-height: 30px;
      8  text-decoration: none;
      9  background: #9b59b6;
     10  display: inline-block;
     11  margin-bottom: 5px;
     12 }
     13 
     14 .setup-content-output {
     15  padding: 15px;
     16  font-size: 16px;
     17  background: #fff;
     18  margin-bottom: 10px;
     19 }
     20 
     21 .setup-ad-image {
     22  display: inline-block;
     23  vertical-align: middle;
     24  width: 300px;
     25  margin: 10px auto;
     26 }
     27 
     28 .setup-ad-image > .im {
     29  width: 100%;
     30  padding-bottom: 25%;
     31  background-size: cover;
     32  background-position: center center;
     33  margin: 0 auto;
     34 }
     35 
     36 .setup-panel {
     37  display: block;
     38  width: 100%;
     39  height: calc(100vh - 60px);
     40  position: relative;
     41  padding: 20px 0;
     42 }
     43 
     44 .setup-panel > nav.menu {
     45  position: absolute;
     46  top: 0;
     47  left: 0;
     48  width: 250px;
     49  background: #323a44;
     50  height: 100%;
     51  overflow-y: auto;
     52 }
     53 
     54 .setup-panel > nav.menu > ul {
     55  display: block;
     56  width: 100%;
     57  list-style: none;
     58 }
     59 
     60 .setup-panel > nav.menu > ul > li {
     61  display: block;
     62  width: 100%;
     63  border-bottom: 1px solid #222;
     64 }
     65 
     66 .setup-panel > nav.menu > ul > li:last-child {
     67  border-bottom: 0;
     68 }
     69 
     70 .setup-panel > nav.menu > ul > li > a {
     71  display: block;
     72  width: 100%;
     73  height: 40px;
     74  line-height: 40px;
     75  text-decoration: none;
     76  color: #fff;
     77  padding: 0 15px;
     78  font-size: 16px;
     79 }
     80 
     81 .setup-panel > .panel-content {
     82  display: block;
     83  position: absolute;
     84  top: 0;
     85  right: 0;
     86  width: calc(100% - 250px);
     87  height: calc(100vh - 60px);
     88  background: #efefed;
     89  padding: 20px 20px 0 20px;
     90  overflow-y: auto;
     91 }
     92 
     93 .setup-panel > .panel-content:after {
     94  content: "";
     95  height: 20px;
     96  display: block;
     97  width: 100%;
     98 }
     99 
    100 .setup-panel > .panel-content > p {
    101  font-size: 16px;
    102  line-height: 18px;
    103  margin-bottom: 15px;
    104 }
    105 
    106 .setup-panel > .panel-content > .notes > .note {
    107  display: block;
    108  width: 100%;
    109  font-size: 16px;
    110  padding: 15px;
    111  margin-bottom: 5px;
    112  background: #fff;
    113 }
    114 
    115 .setup-panel > .panel-content > .notes > .note > .username {
    116  font-weight: bold;
    117  font-size: 16px;
    118  color: #000;
    119  margin-bottom: 5px;
    120 }
    121 
    122 .setup-panel > .panel-content > .notes > .note > .timestamp {
    123  font-size: 14px;
    124  color: #888;
    125  margin-bottom: 10px;
    126 }
    127 
    128 .setup-panel > .panel-content > .notes > .note > .msg {
    129  font-size: 16px;
    130  color: #000;
    131  line-height: 18px;
    132  margin-bottom: 20px;
    133 }
    134 
    135 .setup-panel > .panel-content > .notes > .note:last-child {
    136  margin-bottom: 0;
    137 }
    138 
    139 .setup-panel > .panel-content .panel-bulk {
    140  display: block;
    141  width: 100%;
    142  margin-bottom: 20px;
    143  background: #323a44;
    144  color: #fff;
    145  padding: 15px;
    146 }
    147 
    148 .setup-panel > .panel-content .panel-bulk > .title {
    149  font-size: 22px;
    150  margin-bottom: 10px;
    151 }
    152 
    153 .setup-panel > .panel-content .panel-bulk > p {
    154  margin-bottom: 10px;
    155 }
    156 
    157 .setup-panel > .panel-content .vote-list {
    158  display: block;
    159  width: 100%;
    160  font-size: 0;
    161 }
    162 
    163 .setup-panel > .panel-content .vote-list > .item {
    164  display: inline-block;
    165  vertical-align: top;
    166  width: 50%;
    167  padding: 15px 15px 15px 35px;
    168  position: relative;
    169  color: #fff;
    170  font-size: 16px;
    171 }
    172 
    173 .setup-panel > .panel-content .vote-list > .item:before {
    174  width: 16px;
    175  height: 16px;
    176  left: 10px;
    177  top: 50%;
    178  margin-top: -9px;
    179  content: "";
    180  font-size: 16px;
    181  color: #fff;
    182  position: absolute;
    183 }
    184 
    185 .setup-panel > .panel-content .vote-list > .item.up {
    186  background: #2ecc71;
    187 }
    188 
    189 .setup-panel > .panel-content .vote-list > .item.down {
    190  background: #e74c3c;
    191 }
    192 
    193 .setup-panel > .panel-content .vote-list > .item.up:before {
    194  content: "▲";
    195 }
    196 
    197 .setup-panel > .panel-content .vote-list > .item.down:before {
    198  content: "▼";
    199 }
    200 
    201 .setup-panel > .panel-content .vote-list > .item > a {
    202  color: #fff;
    203  font-weight: bold;
    204  text-decoration: none;
    205 }
    206 
    207 .setup-panel > .panel-content .panel-list {
    208  display: block;
    209  width: 100%;
    210 }
    211 
    212 .setup-panel > .panel-content .panel-list.posts > .item > .details {
    213  padding-left: 15px !important;
    214 }
    215 
    216 .setup-panel > .panel-content .panel-list.subdreads > .item {
    217  min-height: 80px;
    218 }
    219 
    220 .setup-panel > .panel-content .panel-list.subdreads > .item > .details {
    221  padding-left: 70px !important;
    222 }
    223 
    224 .setup-panel > .panel-content .panel-list.ads > .item > .image {
    225  display: inline-block;
    226  vertical-align: middle;
    227  width: 250px;
    228  margin-right: 15px;
    229 }
    230 
    231 .setup-panel > .panel-content .panel-list.ads > .item > .image > .im {
    232  width: 100%;
    233  padding-bottom: 25%;
    234  background-size: cover;
    235  background-position: center center;
    236 }
    237 
    238 .setup-panel > .panel-content .panel-list.ads > .item > .details {
    239  padding-left: 0;
    240  width: calc(100% - 415px);
    241  padding-right: 15px;
    242  vertical-align: middle;
    243 }
    244 
    245 .setup-panel > .panel-content .panel-list.ads > .item > .details > .post-title {
    246  font-size: 16px;
    247  font-weight: bold;
    248 }
    249 
    250 .setup-panel
    251  > .panel-content
    252  .panel-list.ads
    253  > .item
    254  > .details
    255  > .info
    256  > span {
    257  display: inline-block;
    258 }
    259 
    260 .setup-panel > .panel-content .panel-list > .item {
    261  display: block;
    262  width: 100%;
    263  padding: 10px 15px;
    264  background: #fff;
    265  font-size: 0;
    266  position: relative;
    267  margin-bottom: 1px;
    268 }
    269 
    270 .setup-panel > .panel-content .panel-list > .item:nth-child(even) {
    271  background: #efefef;
    272 }
    273 
    274 .setup-panel > .panel-content .panel-list > .item > input[type="checkbox"] {
    275  position: absolute;
    276  top: 50%;
    277  left: 15px;
    278  width: 20px;
    279  height: 20px;
    280  padding: 0;
    281  margin: -10px 0 0;
    282  z-index: 999;
    283 }
    284 
    285 .setup-panel > .panel-content .panel-list > .item > .bg {
    286  position: absolute;
    287  top: 0;
    288  left: 0;
    289  width: 100%;
    290  height: 100%;
    291 }
    292 
    293 .setup-panel
    294  > .panel-content
    295  .panel-list
    296  > .item
    297  > input[type="checkbox"]:checked
    298  ~ .bg {
    299  background: #9b59b6;
    300 }
    301 
    302 .setup-panel
    303  > .panel-content
    304  .panel-list
    305  > .item
    306  > input[type="checkbox"]:checked
    307  ~ .details {
    308  color: #fff;
    309 }
    310 
    311 .setup-panel
    312  > .panel-content
    313  .panel-list
    314  > .item
    315  > input[type="checkbox"]:checked
    316  ~ .details
    317  > a.username {
    318  color: #fff;
    319 }
    320 
    321 .setup-panel
    322  > .panel-content
    323  .panel-list
    324  > .item
    325  > input[type="checkbox"]:checked
    326  ~ .actions
    327  > a.none {
    328  border: 1px solid #fff;
    329 }
    330 
    331 .setup-panel > .panel-content .panel-list > .item > .details {
    332  position: relative;
    333  z-index: 5;
    334  padding-left: 40px;
    335  display: inline-block;
    336  vertical-align: middle;
    337  width: calc(100% - 150px);
    338  font-size: 14px;
    339 }
    340 
    341 .setup-panel > .panel-content .panel-list > .item > .details > .post-title {
    342  text-decoration: none;
    343  font-size: 22px;
    344  color: #000;
    345 }
    346 
    347 .setup-panel > .panel-content .panel-list > .item > .details > .username {
    348  text-decoration: none;
    349  font-size: 16px;
    350  font-weight: bold;
    351 }
    352 
    353 .setup-panel
    354  > .panel-content
    355  .panel-list
    356  > .item
    357  > .details
    358  > .username
    359  > .flair {
    360  background-color: #efefef;
    361  display: inline-block;
    362  font-size: 12px;
    363  padding: 0;
    364  vertical-align: middle;
    365  margin-left: 3px;
    366  -webkit-border-radius: 3px;
    367  -moz-border-radius: 3px;
    368  border-radius: 3px;
    369  font-weight: normal;
    370  height: 20px;
    371  width: 20px;
    372  line-height: 20px;
    373  color: #fff;
    374  text-align: center;
    375 }
    376 
    377 .setup-panel > .panel-content .panel-list > .item > .details > .info {
    378  margin-top: 10px;
    379 }
    380 
    381 .setup-panel > .panel-content .panel-list > .item > .details > .info > span {
    382  display: block;
    383  margin-top: 5px;
    384 }
    385 
    386 .setup-panel > .panel-content .panel-list > .item > .actions {
    387  position: relative;
    388  z-index: 5;
    389  display: inline-block;
    390  vertical-align: middle;
    391  width: 150px;
    392 }
    393 
    394 .setup-panel > .panel-content .panel-list > .item > .actions > button,
    395 .setup-panel > .panel-content .panel-list > .item > .actions > a {
    396  display: block;
    397  width: 100%;
    398 }
    399 
    400 .setup-panel > .panel-content > .quick-forms > form.quick-tool {
    401  display: inline-block;
    402  vertical-align: top;
    403  width: calc(100% / 3 - (20px / 3));
    404  padding: 15px;
    405  background: #fff;
    406  margin-right: 10px;
    407  margin-bottom: 20px;
    408  font-size: 14px;
    409 }
    410 
    411 .setup-panel > .panel-content > .quick-forms > form.quick-tool > .t {
    412  font-size: 16px;
    413  font-weight: bold;
    414  color: #3498db;
    415  margin-bottom: 10px;
    416 }
    417 
    418 .setup-panel > .panel-content > .quick-forms > form.quick-tool > label {
    419  display: block;
    420  font-weight: bold;
    421  margin-bottom: 5px;
    422 }
    423 
    424 .setup-panel
    425  > .panel-content
    426  > .quick-forms
    427  > form.quick-tool
    428  input[type="text"],
    429 .setup-panel
    430  > .panel-content
    431  > .quick-forms
    432  > form.quick-tool
    433  input[type="number"] {
    434  display: block;
    435  width: 100%;
    436  max-width: 100%;
    437  padding: 0 15px;
    438  height: 40px;
    439  line-height: 40px;
    440  color: #000;
    441  margin-bottom: 10px;
    442  border: 1px solid #ccc;
    443  font-size: 14px;
    444  font-family: roboto, helvetica, sans-serif, arial, verdana, tahoma;
    445 }
    446 
    447 .setup-panel
    448  > .panel-content
    449  > .quick-forms
    450  > form.quick-tool
    451  input[type="text"]:focus,
    452 .setup-panel
    453  > .panel-content
    454  > .quick-forms
    455  > form.quick-tool
    456  input[type="text"]:active,
    457 .setup-panel
    458  > .panel-content
    459  > .quick-forms
    460  > form.quick-tool
    461  input[type="number"]:focus,
    462 .setup-panel
    463  > .panel-content
    464  > .quick-forms
    465  > form.quick-tool
    466  input[type="number"]:active {
    467  border-color: #3498db;
    468 }
    469 
    470 .setup-panel > .panel-content > .quick-forms > form.quick-tool textarea {
    471  display: block;
    472  width: 100%;
    473  max-width: 100%;
    474  resize: vertical;
    475  outline: 0;
    476  border: 1px solid #ccc;
    477  line-height: 16px;
    478  font-size: 14px;
    479  color: #000;
    480  padding: 10px 15px;
    481  min-height: 150px;
    482  margin-bottom: 10px;
    483  font-family: roboto, helvetica, sans-serif, arial, verdana, tahoma;
    484 }
    485 
    486 .setup-panel > .panel-content > .quick-forms > form.quick-tool textarea:focus,
    487 .setup-panel > .panel-content > .quick-forms > form.quick-tool textarea:active {
    488  border-color: #3498db;
    489 }
    490 
    491 .setup-panel
    492  > .panel-content
    493  > .quick-forms
    494  > form.quick-tool:nth-child(3n + 3) {
    495  margin-right: 0;
    496 }
    497 
    498 .setup-panel > .panel-content > .quick-forms > form.quick-tool.lg {
    499  margin-right: 0;
    500  width: 100%;
    501 }
    502 
    503 .setup {
    504  background-color: var(--lv3-col);
    505 }
    506 
    507 .setup h2 {
    508  color: var(--accent);
    509  font-family: Arial, Helvetica, sans-serif;
    510 }
    511 
    512 .setup table tr td table {
    513  padding: 0.5em 0.5em;
    514  background-color: var(--lv2-col);
    515  border: solid var(--lv3-col);
    516 }
    517 
    518 .setup table tr td table th,
    519 .setup table tr td table tr td th {
    520  padding: unset;
    521  color: var(--accent);
    522  font-family: Arial, Helvetica, sans-serif;
    523 }
    524 
    525 .setup table tr td table td form {
    526  font-family: Arial, Helvetica, sans-serif;
    527 }
    528 
    529 .setup table tr td hr {
    530  padding: unset;
    531  color: var(--accent);
    532 }
    533 
    534 .setup input[value="View"] {
    535  background-color: var(--accent2);
    536  padding: 0.3em;
    537  font-family: Arial, Helvetica, sans-serif;
    538  border: solid #ddd;
    539  border-radius: 0.2em;
    540  border-width: 0.1em;
    541  color: var(--button-text-col);
    542  transition: background-color, color, 0.3s;
    543  transition-timing-function: ease-in-out;
    544 }
    545 
    546 .setup input[value="View"]:hover {
    547  background-color: var(--accent);
    548  padding: 0.3em;
    549  font-family: Arial, Helvetica, sans-serif;
    550  border: solid #ffffff;
    551  border-radius: 0.2em;
    552  border-width: 0.1em;
    553  color: var(--accent2);
    554 }
    555 
    556 .setup table tr td table tr td input[type="password"],
    557 .setup table tr td table tr td textarea[type="password"] {
    558  background-color: var(--lv2-col);
    559  border: solid var(--accent);
    560  border-radius: 0.2em;
    561  border-width: 0.1em;
    562  text-align: left;
    563  max-width: 100%;
    564  padding: 0.3em;
    565 }
    566 
    567 .setup table tr td table tr td input[type="text"],
    568 .setup table tr td table tr td textarea[type="text"] {
    569  background-color: var(--lv2-col);
    570  border: solid var(--accent);
    571  border-radius: 0.2em;
    572  border-width: 0.1em;
    573  text-align: left;
    574  max-width: 100%;
    575  padding: 0.3em;
    576 }
    577 
    578 .setup table tr td table tr td table {
    579  border: none !important;
    580 }
    581 
    582 .setup table tr td table tr td select[name="ignore"] {
    583  background-color: var(--accent2);
    584  color: var(--button-text-col);
    585  padding: 0.3em;
    586  text-align: left;
    587  font-family: Arial, Helvetica, sans-serif;
    588  border: solid var(--accent);
    589  border-radius: 0.2em;
    590  border-width: 0.1em;
    591 }
    592 
    593 .setup table tr td table tr td select[name="ignore"]:hover {
    594  padding: 0.3em;
    595  text-align: left;
    596  color: var(--accent);
    597  background-color: var(--lv2-col);
    598  font-family: Arial, Helvetica, sans-serif;
    599  border: solid var(--accent);
    600  border-radius: 0.2em;
    601  border-width: 0.1em;
    602 }
    603 
    604 .setup table tr td table tr td input[type="number"] {
    605  background-color: var(--accent2);
    606  color: var(--button-text-col);
    607  padding: 0.3em;
    608  text-align: left;
    609  font-family: Arial, Helvetica, sans-serif;
    610  border: solid var(--accent);
    611  border-radius: 0.2em;
    612  border-width: 0.1em;
    613 }
    614 
    615 .setup table tr td table tr td input[type="number"]:hover {
    616  padding: 0.3em;
    617  text-align: left;
    618  color: var(--accent);
    619  background-color: var(--lv2-col);
    620  font-family: Arial, Helvetica, sans-serif;
    621  border: solid var(--accent);
    622  border-radius: 0.2em;
    623  border-width: 0.1em;
    624 }
    625 
    626 .setup table tr td table tr td input[type="color"] {
    627  background-color: var(--accent2);
    628  color: var(--button-text-col);
    629  padding: 0.3em;
    630  text-align: left;
    631  font-family: Arial, Helvetica, sans-serif;
    632  border: solid var(--accent);
    633  border-radius: 0.2em;
    634  border-width: 0.1em;
    635 }
    636 
    637 .setup table tr td table tr td input[type="color"]:hover {
    638  padding: 0.3em;
    639  text-align: left;
    640  color: var(--accent);
    641  background-color: var(--lv2-col);
    642  font-family: Arial, Helvetica, sans-serif;
    643  border: solid var(--accent);
    644  border-radius: 0.2em;
    645  border-width: 0.1em;
    646 }
    647 
    648 .setup table tr td table tr td select[name="font"] {
    649  background-color: var(--accent2);
    650  color: var(--button-text-col);
    651  padding: 0.3em;
    652  text-align: left;
    653  font-family: Arial, Helvetica, sans-serif;
    654  border: solid var(--accent);
    655  border-radius: 0.2em;
    656  border-width: 0.1em;
    657 }
    658 
    659 .setup table tr td table tr td select[name="font"]:hover {
    660  padding: 0.3em;
    661  text-align: left;
    662  color: var(--accent);
    663  background-color: var(--lv2-col);
    664  font-family: Arial, Helvetica, sans-serif;
    665  border: solid var(--accent);
    666  border-radius: 0.2em;
    667  border-width: 0.1em;
    668 }
    669 
    670 .setup table tr td table tr td select[name="eninbox"] {
    671  background-color: var(--accent2);
    672  color: var(--button-text-col);
    673  padding: 0.3em;
    674  text-align: left;
    675  font-family: Arial, Helvetica, sans-serif;
    676  border: solid var(--accent);
    677  border-radius: 0.2em;
    678  border-width: 0.1em;
    679 }
    680 
    681 .setup table tr td table tr td select[name="eninbox"]:hover {
    682  padding: 0.3em;
    683  text-align: left;
    684  color: var(--accent);
    685  background-color: var(--lv2-col);
    686  font-family: Arial, Helvetica, sans-serif;
    687  border: solid var(--accent);
    688  border-radius: 0.2em;
    689  border-width: 0.1em;
    690 }
    691 
    692 .setup select {
    693  background-color: var(--accent2);
    694  color: var(--button-text-col);
    695  padding: 0.3em;
    696  text-align: left;
    697  font-family: Arial, Helvetica, sans-serif;
    698  border: solid var(--accent);
    699  border-radius: 0.2em;
    700  border-width: 0.1em;
    701 }
    702 
    703 .setup select:hover {
    704  padding: 0.3em;
    705  text-align: left;
    706  color: var(--accent);
    707  background-color: var(--lv2-col);
    708  font-family: Arial, Helvetica, sans-serif;
    709  border: solid var(--accent);
    710  border-radius: 0.2em;
    711  border-width: 0.1em;
    712 }
    713 
    714 .setup input[value="Save changes"] {
    715  background-color: var(--accent2);
    716  padding: 0.3em;
    717  font-family: Arial, Helvetica, sans-serif;
    718  border: solid #ddd;
    719  border-radius: 0.2em;
    720  border-width: 0.1em;
    721  color: var(--button-text-col);
    722  transition: background-color, color, 0.3s;
    723  transition-timing-function: ease-in-out;
    724 }
    725 
    726 .setup input[value="Save changes"]:hover {
    727  background-color: var(--accent);
    728  padding: 0.3em;
    729  font-family: Arial, Helvetica, sans-serif;
    730  border: solid #ffffff;
    731  border-radius: 0.2em;
    732  border-width: 0.1em;
    733  color: var(--accent2);
    734 }
    735 
    736 .setup input[value="Register"] {
    737  background-color: var(--accent2);
    738  padding: 0.3em;
    739  font-family: Arial, Helvetica, sans-serif;
    740  border: solid #ddd;
    741  border-radius: 0.2em;
    742  border-width: 0.1em;
    743  color: var(--button-text-col);
    744  transition: background-color, color, 0.3s;
    745  transition-timing-function: ease-in-out;
    746 }
    747 
    748 .setup input[value="Register"]:hover {
    749  background-color: var(--accent);
    750  padding: 0.3em;
    751  font-family: Arial, Helvetica, sans-serif;
    752  border: solid #ffffff;
    753  border-radius: 0.2em;
    754  border-width: 0.1em;
    755  color: var(--accent2);
    756 }
    757 
    758 .setup input[value="Change"] {
    759  background-color: var(--accent2);
    760  padding: 0.3em;
    761  font-family: Arial, Helvetica, sans-serif;
    762  border: solid #ddd;
    763  border-radius: 0.2em;
    764  border-width: 0.1em;
    765  color: var(--button-text-col);
    766  transition: background-color, color, 0.3s;
    767  transition-timing-function: ease-in-out;
    768 }
    769 
    770 .setup input[value="Change"]:hover {
    771  background-color: var(--accent);
    772  padding: 0.3em;
    773  font-family: Arial, Helvetica, sans-serif;
    774  border: solid #ffffff;
    775  border-radius: 0.2em;
    776  border-width: 0.1em;
    777  color: var(--accent2);
    778 }
    779 
    780 .setup input[value="Kick"] {
    781  background-color: var(--accent2);
    782  padding: 0.3em;
    783  font-family: Arial, Helvetica, sans-serif;
    784  border: solid #ddd;
    785  border-radius: 0.2em;
    786  border-width: 0.1em;
    787  color: var(--button-text-col);
    788  transition: background-color, color, 0.3s;
    789  transition-timing-function: ease-in-out;
    790 }
    791 
    792 .setup input[value="Kick"]:hover {
    793  background-color: var(--accent);
    794  padding: 0.3em;
    795  font-family: Arial, Helvetica, sans-serif;
    796  border: solid #ffffff;
    797  border-radius: 0.2em;
    798  border-width: 0.1em;
    799  color: var(--accent2);
    800 }
    801 
    802 .setup input[value="Logout"] {
    803  background-color: var(--accent2);
    804  padding: 0.3em;
    805  font-family: Arial, Helvetica, sans-serif;
    806  border: solid #ddd;
    807  border-radius: 0.2em;
    808  border-width: 0.1em;
    809  color: var(--button-text-col);
    810  transition: background-color, color, 0.3s;
    811  transition-timing-function: ease-in-out;
    812 }
    813 
    814 .setup input[value="Logout"]:hover {
    815  background-color: var(--accent);
    816  padding: 0.3em;
    817  font-family: Arial, Helvetica, sans-serif;
    818  border: solid #ffffff;
    819  border-radius: 0.2em;
    820  border-width: 0.1em;
    821  color: var(--accent2);
    822 }
    823 
    824 .setup input[value="Create"] {
    825  background-color: var(--accent2);
    826  padding: 0.3em;
    827  font-family: Arial, Helvetica, sans-serif;
    828  border: solid #ddd;
    829  border-radius: 0.2em;
    830  border-width: 0.1em;
    831  color: var(--button-text-col);
    832  transition: background-color, color, 0.3s;
    833  transition-timing-function: ease-in-out;
    834 }
    835 
    836 .setup input[value="Create"]:hover {
    837  background-color: var(--accent);
    838  padding: 0.3em;
    839  font-family: Arial, Helvetica, sans-serif;
    840  border: solid #ffffff;
    841  border-radius: 0.2em;
    842  border-width: 0.1em;
    843  color: var(--accent2);
    844 }
    845 
    846 .setup input[value="Delete"] {
    847  background-color: var(--accent2);
    848  padding: 0.3em;
    849  font-family: Arial, Helvetica, sans-serif;
    850  border: solid #ddd;
    851  border-radius: 0.2em;
    852  border-width: 0.1em;
    853  color: var(--button-text-col);
    854  transition: background-color, color, 0.3s;
    855  transition-timing-function: ease-in-out;
    856 }
    857 
    858 .setup input[value="Delete"]:hover {
    859  background-color: var(--accent);
    860  padding: 0.3em;
    861  font-family: Arial, Helvetica, sans-serif;
    862  border: solid #ffffff;
    863  border-radius: 0.2em;
    864  border-width: 0.1em;
    865  color: var(--accent2);
    866 }
    867 
    868 .setup input[value="Reload"] {
    869  background-color: var(--accent2);
    870  padding: 0.3em;
    871  font-family: Arial, Helvetica, sans-serif;
    872  border: solid #ddd;
    873  border-radius: 0.2em;
    874  border-width: 0.1em;
    875  color: var(--button-text-col);
    876  transition: background-color, color, 0.3s;
    877  transition-timing-function: ease-in-out;
    878 }
    879 
    880 .setup input[value="Reload"]:hover {
    881  background-color: var(--accent);
    882  padding: 0.3em;
    883  font-family: Arial, Helvetica, sans-serif;
    884  border: solid #ffffff;
    885  border-radius: 0.2em;
    886  border-width: 0.1em;
    887  color: var(--accent2);
    888 }
    889 
    890 .setup input[value="Apply"] {
    891  background-color: var(--accent2);
    892  padding: 0.3em;
    893  font-family: Arial, Helvetica, sans-serif;
    894  border: solid #ddd;
    895  border-radius: 0.2em;
    896  border-width: 0.1em;
    897  color: var(--button-text-col);
    898  transition: background-color, color, 0.3s;
    899  transition-timing-function: ease-in-out;
    900 }
    901 
    902 .setup input[value="Apply"]:hover {
    903  background-color: var(--accent);
    904  padding: 0.3em;
    905  font-family: Arial, Helvetica, sans-serif;
    906  border: solid #ffffff;
    907  border-radius: 0.2em;
    908  border-width: 0.1em;
    909  color: var(--accent2);
    910 }
    911 
    912 .setup input[value="Backup and restore"] {
    913  background-color: var(--accent2);
    914  padding: 0.3em;
    915  font-family: Arial, Helvetica, sans-serif;
    916  border: solid #ddd;
    917  border-radius: 0.2em;
    918  border-width: 0.1em;
    919  color: var(--button-text-col);
    920  transition: background-color, color, 0.3s;
    921  transition-timing-function: ease-in-out;
    922 }
    923 
    924 .setup input[value="Backup and restore"]:hover {
    925  background-color: var(--accent);
    926  padding: 0.3em;
    927  font-family: Arial, Helvetica, sans-serif;
    928  border: solid #ffffff;
    929  border-radius: 0.2em;
    930  border-width: 0.1em;
    931  color: var(--accent2);
    932 }
    933 
    934 .setup input[value="Go to the Setup-Page"] {
    935  background-color: var(--accent2);
    936  padding: 0.3em;
    937  font-family: Arial, Helvetica, sans-serif;
    938  border: solid #ddd;
    939  border-radius: 0.2em;
    940  border-width: 0.1em;
    941  color: var(--button-text-col);
    942  transition: background-color, color, 0.3s;
    943  transition-timing-function: ease-in-out;
    944 }
    945 
    946 .setup input[value="Go to the Setup-Page"]:hover {
    947  background-color: var(--accent);
    948  padding: 0.3em;
    949  font-family: Arial, Helvetica, sans-serif;
    950  border: solid #ffffff;
    951  border-radius: 0.2em;
    952  border-width: 0.1em;
    953  color: var(--accent2);
    954 }
    955 
    956 
    957 p #changelang {
    958  font-family: Arial, Helvetica, sans-serif;
    959 }
    960 
    961 .setup table tr td table a {
    962  color: white;
    963  text-decoration: underline white dotted;
    964 }
    965 
    966 .setup  textarea {
    967  background-color: var(--lv2-col);
    968  border: solid var(--accent);
    969  border-radius: 0.2em;
    970  border-width: 0.1em;
    971  text-align: left;
    972  max-width: 100%;
    973  padding: 0.3em;
    974 }
    975 
    976 .setup small {
    977  font-family: Arial, Helvetica, sans-serif;
    978 }