input[type='checkbox'] {
  -webkit-appearance: none;
  background-image: -webkit-linear-gradient(#ededed, #ededed 38%, #dedede);
  border: 1px solid rgba(0, 0, 0, .25);
  border-radius: 2px;
  bottom: 2px;
  box-shadow: 0 1px 0 rgba(0, 0, 0, .08),
      inset 0 1px 2px rgba(255, 255, 255, .75);
  color: #444;
  font: inherit;
  height: 13px;
  margin: 4px 1px 0 0;
  position: relative;
  -webkit-user-select: none;
  text-shadow: 0 1px 0 rgb(240, 240, 240);
  vertical-align: middle;
  width: 13px;
}

input[type='checkbox']:checked::before {
  background-image: -webkit-image-set(
      url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAsAAAALCAYAAACprHcmAAAAcklEQVQY02NgwA/YoJgoEA/Es4DYgJBCJSBeD8SboRinBiYg7kZS2IosyQ/Eakh8LySFq4FYHFlxGRBvBOJYqMRqJMU+yApNkSRAeC0Sux3dfSCTetE0wKyXxOWhMKhTYIr9CAUXyJMzgLgBagBBgDPGAI2LGdNt0T1AAAAAAElFTkSuQmCC) 1x,
      url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAWCAYAAADEtGw7AAAA60lEQVQ4y2P4//8/Ay0wA00NpgC4AXEksgA1DNYA4vVAvBnZcEoNFgLihVBDNyMbTonBLEDchWYo3HBKDM7BYSgIZ5JrsBseQxuBmIkcg5EjCx1PBmJufGHsBMQFQMxORGTB8BIglsCXKmSBeA1U8RQgliMistYBsTq+dAxy4TQ0TSBLnPFE1iYgdkAPL3SDC/BECi4cjS0i0A12RgoGYnAxEDMSYzAIyGMJDmy4B4jZcCUdXKmCnUCwzAVifnxpklA6xhY0K4BYgVBiJyaDgIJmKtTQjUBsTEwuIjbnwYLGi9jsSZ8aZEgZDACI3DQYaeTU0AAAAABJRU5ErkJggg==) 2x);
  background-size: 100% 100%;
  content: '';
  display: block;
  height: 100%;
  -webkit-user-select: none;
  width: 100%;
}

input[type='checkbox']:disabled {
  opacity: .75;
}

input[type='checkbox']:focus {
  border-color: rgb(77, 144, 254);
  outline: none;
}

button {
  -webkit-appearance: none;
  background-image: -webkit-linear-gradient(#ededed, #ededed 38%, #dedede);
  border: 1px solid rgba(0, 0, 0, 0.25);
  border-radius: 2px;
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.08),
      inset 0 1px 2px rgba(255, 255, 255, 0.75);
  color: #444;
  font: inherit;
  margin: 0 1px 5px 0;
  min-height: 24px;
  min-width: 48px;
  padding-bottom: 1px;
  -webkit-padding-end: 10px;
  -webkit-padding-start: 10px;
  text-shadow: 0 1px 0 rgb(240, 240, 240);
  -webkit-user-select: none;
}

button:enabled:hover {
  background-image: -webkit-linear-gradient(#f0f0f0, #f0f0f0 38%, #e0e0e0);
  border-color: rgba(0, 0, 0, 0.3);
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.12),
      inset 0 1px 2px rgba(255, 255, 255, 0.95);
  color: black;
}

button:enabled:active {
  background-image: -webkit-linear-gradient(#e7e7e7, #e7e7e7 38%, #d7d7d7);
  box-shadow: none;
  text-shadow: none;
}

button:disabled {
  background-image: -webkit-linear-gradient(#f1f1f1, #f1f1f1 38%, #e6e6e6);
  border-color: rgba(80, 80, 80, 0.2);
  box-shadow: 0 1px 0 rgba(80, 80, 80, 0.08),
      inset 0 1px 2px rgba(255, 255, 255, 0.75);
  color: #aaa;
}

button:focus {
  border-color: rgb(77, 144, 254);
  outline: none;
}

input[type='number'] {
  border: 1px solid #bfbfbf;
  border-radius: 2px;
  box-sizing: border-box;
  color: #444;
  font: inherit;
  margin: 0;
  min-height: 2em;
  padding: 3px;
}

input[type='number']:focus {
  border-color: rgb(77, 144, 254);
  outline: none;
}

input[type='number']:invalid {
  background-color: pink;
}

input[type='text'] {
  border: 1px solid #bfbfbf;
  border-radius: 2px;
  box-sizing: border-box;
  color: #444;
  font: inherit;
  margin: 0;
  min-height: 2em;
  padding: 3px;
}

input[type='text']:focus {
  border-color: rgb(77, 144, 254);
  outline: none;
}

input[type='text']:invalid {
  background-color: pink;
}

input[type='password'] {
  border: 1px solid #bfbfbf;
  border-radius: 2px;
  box-sizing: border-box;
  color: #444;
  font: inherit;
  margin: 0;
  min-height: 2em;
  padding: 3px;
}

input[type='password']:focus {
  border-color: rgb(77, 144, 254);
  outline: none;
}

input[type='password']:invalid {
  background-color: pink;
}

section {
  margin: 8px 0 10px;
  max-width: 600px;
  -webkit-padding-start: 20px;
}

select {
  -webkit-appearance: none;
  background-image: -webkit-image-set(
      url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABMAAAAICAYAAAAbQcSUAAAAaUlEQVQoz2P4//8/A7UwdkEGhiggTsODo4g2LBEImJmZvwE1/UfHIHGQPNGGAbHCggULFrKxsf1ENgjEB4mD5EnxJoaByAZB5Yk3DNlAPj6+L8gGkWUYzMC3b982IRtEtmFQjaxYxDAwAGi4TwMYKNLfAAAAAElFTkSuQmCC) 1x,
      url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACcAAAAQCAYAAACV3GYgAAAAWklEQVRIx+3VOwoAIAwD0B49N686CCJ+K0aHFrIl8LaKqsqvEccxcPEQo8bgNs4KTBth4HaByCMWbhWIcsDEzYCoy2xcD4hW8QWuBqJXeoXLQIwK/iEc57iDBIg+ClNpjek/AAAAAElFTkSuQmCC) 2x),
      -webkit-linear-gradient(#ededed, #ededed 38%, #dedede);
  background-position: right center;
  background-repeat: no-repeat;
  border: 1px solid rgba(0, 0, 0, .25);
  border-radius: 2px;
  box-shadow: 0 1px 0 rgba(0, 0, 0, .08), inset 0 1px 2px rgba(255, 255, 255, .75);
  color: #444;
  font: inherit;
  margin: 0 1px 0 0;
  min-height: 2em;
  min-width: 160px;
  padding-bottom: 1px;
  -webkit-padding-end: 20px;
  -webkit-padding-start: 6px;
  text-shadow: 0 1px 0 rgb(240, 240, 240);
  -webkit-user-select: none;
}

select:disabled {
  background-image: -webkit-image-set(
      url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABMAAAAICAYAAAAbQcSUAAAAWklEQVQoz2P4//8/A7UwdkEGhiggTsODo4g2LBEIGhoa/uPCIHmiDQNihQULFizEZhBIHCRPijexGggzCCpPvGHoBiIbRJZhMAPfvn3bhGwQ2YZBNbJiEcPAAIgGZrTRc1ZLAAAAAElFTkSuQmCC) 1x,
      url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACYAAAAQCAYAAAB6Hg0eAAAAX0lEQVRIx+3UOwoAIAxEwRz93TwWIoj4lwRBA9vtwlQRVZUbcyVqCUY8PQwWsFMcgFjBdnGkvSVsFUe+tYbN4ih3HrARjtrGC9bC0ep7wkocva43LOEY9d75/B/2YZsJM1B42fe2uWoAAAAASUVORK5CYII=) 2x),
      -webkit-linear-gradient(#f1f1f1, #f1f1f1 38%, #e6e6e6);
  border-color: rgba(80, 80, 80, .2);
  box-shadow: 0 1px 0 rgba(80, 80, 80, .08), inset 0 1px 2px rgba(255, 255, 255, .75);
  color: #aaa;
}

select:focus {
  border-color: rgb(77, 144, 254);
  outline: none;
}

body {
  background-color: black;
}

t {
  color: white;
}

p {
  color: white;
}

a {
  color: red;
}

h1 {
  color: red;
}

h2 {
  color: white;
}

.body {
  -webkit-user-select: none;  /* Chrome all / Safari all */
  -moz-user-select: none;     /* Firefox all */
  -ms-user-select: none;      /* IE 10+ */
  -o-user-select: none;
  user-select: none;
}
