.fb-button { font-weight: bold; padding: 3px 7px; border-radius: 3px; font-size: 10px; text-transform: uppercase; white-space: nowrap; }

.fb-circle-button { font-weight: bold; padding: 2px 6px; border-radius: 50%; white-space: nowrap; }

.fb-add-command-button { background: #434343; transform: rotate(-45deg); color: #f4f4f4; border-radius: 50%; border-top-left-radius: 0px; display: inline-block; width: 20px; height: 20px; font-size: 12px; line-height: 20px; text-align: center; margin-left: 3px; }
.fb-add-command-button i { transform: rotate(45deg); }

.fb-xl-sticker { background: linear-gradient(315deg, #22a36d, #4ea3ed); border-radius: 50%; color: #f4f4f4; font-size: 12px; font-weight: bold; white-space: nowrap; width: 1.35rem; height: 1.35rem; display: inline-block; text-align: center; line-height: 1.35rem; }

.fb-green { background: #6a4; border-bottom: 1px solid #371; color: #f4f4f4; }

.fb-purple { background: #a64d79; border-bottom: 1px solid #823c5f; color: #f4f4f4; }

.fb-red { background: #ee6666; border-bottom: 1px solid #fe0808; color: #f4f4f4; }

.fb-yellow { background: #fd6; border-bottom: 1px solid #b90; color: #434343; }

.fb-gray { background: #666; border-bottom: 1px solid #434343; color: #f4f4f4; }

.fb-orange { background: #fa0; border-bottom: 1px solid #e93; color: #434343; }

.fb-teal { background: #1eb287; border-bottom: 1px solid #157e5f; color: #f4f4f4; }

.fb-blue { background: #489fe4; border-bottom: 1px solid #287dc1; color: #f4f4f4; }

.fb-clear { border: 2px solid #666; }

.fb-add-variable { background: #f4f4f4; border: 2px dashed #ddd; font-size: 11px; font-weight: bold; padding: 2px 8px; text-transform: uppercase; white-space: nowrap; }

.fb-input { padding: 4px 7px; border-radius: 2px; font-size: 12px; box-shadow: 0 0 10px #b4b4b4; margin: 0 4px; padding-right: 12px; white-space: nowrap; }

.fb-dropdown { padding: 4px 7px; border-radius: 2px; font-size: 12px; box-shadow: 0 0 6px #b4b4b4; margin: 0 4px; white-space: nowrap; }

.fb-dropdown i.fa.fa-caret-down { margin-left: 12px; }

.fb-tooltip { background: #5f5f5f; border-radius: 50%; color: white; display: inline-block; font-weight: bold; font-size: 12px; text-align: center; white-space: nowrap; width: 18px; }

.fb-step { border-radius: 2px; color: #434343; text-transform: uppercase; font-weight: bold; padding: 2px 8px; font-size: 11px; white-space: nowrap; }

.fb-move, .fb-find-home, .fb-set-servo-angle, .fb-set-zero, .fb-calibrate, .fb-move-home, .fb-move-absolute { background: #a4c2f4; }

.fb-move-relative { background: #6a4; }

.fb-toggle-pin, .fb-write-pin { background: #fa0; }

.fb-read-pin { background: #fd6; }

.fb-mark-as, .fb-send-message, .fb-take-photo, .fb-reboot, .fb-shutdown, .fb-wait { background: #ca8; }

.fb-assertion, .fb-if-statement, .fb-lua { background: #c68ed2; }

.fb-execute { background: #ccc; }

.fb-run-farmware { background: #ebb; }

.fb-e-stop { background: #e66; }

.fb-peripheral-on { background: #6a4; padding: 3px 24px 3px 6px; }

.fb-peripheral-off { background: #e66; padding: 3px 6px 3px 19px; }

.fb-peripheral-unknown { background: #fd6; padding: 3px 45px 3px 0px; }

.fb-peripheral-disabled { background: gray; }

.fb-peripheral-on, .fb-peripheral-off, .fb-peripheral-unknown { color: #f4f4f4; border-bottom: 1px solid; border-radius: 10px; font-weight: 700; font-size: 10px; text-transform: uppercase; white-space: nowrap; }

.fb-peripheral-on:after { margin-left: 8px; }

.fb-peripheral-off:before { margin-left: -17px; }

.fb-peripheral-unknown:after { margin-left: 16px; }

.fb-peripheral-on:after, .fb-peripheral-off:before, .fb-peripheral-unknown:after { content: ""; position: absolute; margin-top: 6px; height: 14px; width: 14px; border-radius: 50%; background: #fff; box-shadow: inset 0 0 3px 3px rgba(0, 0, 0, 0.03); }

.red { color: red; }

.green { color: #6a4; }

.blue { color: #37d; }

.light-blue { color: #a4c2f4; }

.orange { color: #e93; }

.yellow { color: #fd6; }

.led.red { color: #e66; }

.saucer.red { color: #e66; }

.cable-color { border-radius: 5px; color: #434343; text-transform: uppercase; font-weight: bold; padding: 1px 10px; font-size: 11px; white-space: nowrap; margin-left: 2px; }
.cable-color.red { background: red; color: white; }
.cable-color.yellow { background: yellow; }
.cable-color.green { background: #339933; color: white; }
.cable-color.black { background: black; color: white; }
.cable-color.white { background: white; border: 2px solid black; }
.cable-color.brown { background: #996633; color: white; }
.cable-color.blue { background: #0000ff; color: white; }
.cable-color.grey { background: #bfbfbf; }
.cable-color.orange { background: #ff6600; color: white; }
.cable-color.purple { background: #9966ff; color: white; }
.cable-color.pink { background: #ffcccc; }
.cable-color.cyan { background: #66ffd9; }