.toolbox-field { font-family: 'Source Sans Pro', 'tenforce', Arial, sans-serif; font-kerning: normal; font-size: 16px; -webkit-font-variant-ligatures: no-common-ligatures; font-variant-ligatures: no-common-ligatures; -webkit-font-feature-settings: "kern" 1,"liga" 0; font-feature-settings: "kern" 1,"liga" 0; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; position: relative; }

.toolbox-field__label { position: relative; padding: .25rem 1rem; margin: 0 0 -.5rem; min-height: 15px; font-size: 12px; font-weight: 600; font-style: normal; letter-spacing: 1px; text-transform: uppercase; text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.toolbox-field__items { position: relative; display: flex; align-items: center; }

.toolbox-field__items ol { margin: 0 5px; }

.toolbox-field__input { outline: 0; border: 0; width: 100%; min-height: 30px; padding: .25rem .75rem; margin: .25rem; background: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; border-radius: 15px; line-height: normal; transition: all .3s ease-in-out; text-align: left; }

.toolbox-field__input:-webkit-autofill, .toolbox-field__input:-webkit-autofill:hover, .toolbox-field__input:-webkit-autofill:focus { box-shadow: inset 10px 0 10px -10px rgba(0, 0, 0, 0.35), inset 0 0 0 1000px #343434; }

.toolbox-field__input--textarea { white-space: normal; word-break: break-word; }

.toolbox-field__input--list ol { position: relative; margin: 0; }

.toolbox-field__input--list ol li { margin: 0; }

.toolbox-field__input--list:focus ol::after { content: 'press enter to add another'; font-size: 12px; font-weight: normal; font-style: italic; letter-spacing: normal; text-transform: none; text-decoration: none; color: rgba(0, 0, 0, 0.5); transition: color .3s ease-in-out; }

.toolbox-field__input--safari { box-shadow: inset 10px 0 10px -10px rgba(0, 0, 0, 0.35), inset 0 0 0 1000px #343434; }

.toolbox-field a.toolbox-field__input { color: inherit; box-shadow: none; border-radius: 0; }

.toolbox-field input.toolbox-field__input, .toolbox-field textarea.toolbox-field__input, .toolbox-field [contenteditable].toolbox-field__input, .toolbox-field [contenteditable=true].toolbox-field__input { background-color: rgba(255, 255, 255, 0.1); box-shadow: inset 10px 0 10px -10px rgba(0, 0, 0, 0.35); }

.toolbox-field input.toolbox-field__input:hover, .toolbox-field textarea.toolbox-field__input:hover, .toolbox-field [contenteditable].toolbox-field__input:hover, .toolbox-field [contenteditable=true].toolbox-field__input:hover { background-color: rgba(0, 0, 0, 0.02); }

.toolbox-field input.toolbox-field__input:focus, .toolbox-field textarea.toolbox-field__input:focus, .toolbox-field [contenteditable].toolbox-field__input:focus, .toolbox-field [contenteditable=true].toolbox-field__input:focus { box-shadow: inset 20px 0 20px -15px rgba(0, 0, 0, 0.15); background-color: rgba(0, 0, 0, 0.02); }

.toolbox-field input.toolbox-field__input:focus + .on-focus, .toolbox-field textarea.toolbox-field__input:focus + .on-focus, .toolbox-field [contenteditable].toolbox-field__input:focus + .on-focus, .toolbox-field [contenteditable=true].toolbox-field__input:focus + .on-focus { opacity: 1; }

.toolbox-field input.toolbox-field__input:not(:empty) + .on-notempty, .toolbox-field textarea.toolbox-field__input:not(:empty) + .on-notempty, .toolbox-field [contenteditable].toolbox-field__input:not(:empty) + .on-notempty, .toolbox-field [contenteditable=true].toolbox-field__input:not(:empty) + .on-notempty { opacity: 1; }

.toolbox-field [contenteditable]:empty::before, .toolbox-field [contenteditable=true]:empty::before { content: attr(placeholder); display: block; font-size: 16px; font-weight: normal; font-style: normal; letter-spacing: normal; text-transform: none; text-decoration: none; color: rgba(0, 0, 0, 0.5); transition: color .3s ease-in-out; pointer-events: none; }

.toolbox-field--whiteinput { color: #000; }

.toolbox-field--whiteinput input.toolbox-field__input, .toolbox-field--whiteinput textarea.toolbox-field__input, .toolbox-field--whiteinput [contenteditable].toolbox-field__input, .toolbox-field--whiteinput [contenteditable=true].toolbox-field__input { background-color: rgba(255, 255, 255, 0.8); }

.toolbox-field--whiteinput input.toolbox-field__input:hover, .toolbox-field--whiteinput textarea.toolbox-field__input:hover, .toolbox-field--whiteinput [contenteditable].toolbox-field__input:hover, .toolbox-field--whiteinput [contenteditable=true].toolbox-field__input:hover { background-color: white; }

.toolbox-field--whiteinput input.toolbox-field__input:focus, .toolbox-field--whiteinput textarea.toolbox-field__input:focus, .toolbox-field--whiteinput [contenteditable].toolbox-field__input:focus, .toolbox-field--whiteinput [contenteditable=true].toolbox-field__input:focus { background-color: white; }

.toolbox-field--inverted .toolbox-field__label, .toolbox-field--inverted .toolbox-field__input { color: #FFF; }

.toolbox-field--inverted input.toolbox-field__input:hover, .toolbox-field--inverted textarea.toolbox-field__input:hover, .toolbox-field--inverted [contenteditable].toolbox-field__input:hover, .toolbox-field--inverted [contenteditable=true].toolbox-field__input:hover { background-color: rgba(0, 0, 0, 0.07); }

.toolbox-field--inverted input.toolbox-field__input:focus, .toolbox-field--inverted textarea.toolbox-field__input:focus, .toolbox-field--inverted [contenteditable].toolbox-field__input:focus, .toolbox-field--inverted [contenteditable=true].toolbox-field__input:focus { background-color: rgba(0, 0, 0, 0.07); }

.toolbox-field--inverted [contenteditable]:empty::before, .toolbox-field--inverted [contenteditable=true]:empty::before { color: rgba(255, 255, 255, 0.5); }

.toolbox-field--preview { width: 100%; }

.toolbox-field--preview figure { position: relative; background-color: #d7d7d7; background-size: cover; height: 250px; border-radius: 20px; margin: 5px; padding: 5px 12px; display: flex; align-items: flex-end; justify-content: flex-end; }