.button {
    border:           2px solid #000;
    transition:       .5s;
    border-radius:    4px;
    color:            #fff;
    font-size:        14px;
    font-weight:      bold;
    padding:          2px 2px 2px 2px;
    margin:           2px 2px 2px 2px;
    display:          inline-block;
    text-align:       center;
    text-decoration:  none;
  }

  .buttonBlue {
    background-color: #009;
  }

  .buttonBlue:hover {
    background-color: #33f;
    border:           2px solid #fff;
    box-shadow:       0 0 2px 2px #66f;  /* box-shadow: none|h-offset v-offset blur spread color |inset|initial|inherit; */
  }

  .buttonYel {
    background-color: #ff0;
    color:            #000;
  }

  .buttonYel:hover {
    background-color: #ff3;
    border:           2px solid #fff;
    box-shadow:       0 0 2px 2px #cc0;  /* box-shadow: none|h-offset v-offset blur spread color |inset|initial|inherit; */
  }

  .buttonGre {
    background-color: #060;
    color:            #fff;
  }

  .buttonGre:hover {
    background-color: #0c0;
    border:           2px solid #fff;
    box-shadow:       0 0 2px 2px #0a0;  /* box-shadow: none|h-offset v-offset blur spread color |inset|initial|inherit; */
  }

  .buttonOrg {
    background-color: #f60;
    color:            #000;
  }

  .buttonOrg:hover {
    background-color: #f93;
    border:           2px solid #fff;
    box-shadow:       0 0 2px 2px #f96;  /* box-shadow: none|h-offset v-offset blur spread color |inset|initial|inherit; */
  }

  .buttonRed {
    background-color: #900;
  }

  .buttonRed:hover {
    background-color: #c00;
    border:           2px solid #fff;
    box-shadow:       0 0 2px 2px #f66;  /* box-shadow: none|h-offset v-offset blur spread color |inset|initial|inherit; */
  }

  .buttonGry {
    background-color: #ddd;
    color:            #fff;
    border:           2px solid #ccc;
    pointer-events:   none !important;  /* This make the input fields Read/Only  and make "!important" so overrides all else */
  }
/*
input[type="checkbox"] {
    appearance: none;
    width: 26px;
    height: 26px;
    border-radius: 7px;
    text-align: center;
    font-size: large;
    background-color: red;
    transition: .25s;
    box-shadow: 0px 0px 10px #222;
}

input[type="checkbox"]:before {
    content: "\2a09";
}

input[type="checkbox"]:checked:before {
    content: "\2714";
}

input[type="checkbox"]:checked {
    background-color: green;
    box-shadow: inset 0px 0px 10px #222;
}
*/