.example{display:flex}.example-c1{flex:1}.example-c2{flex:2}.example-c3{flex:1}.tf-base{box-sizing:border-box;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;font-size:16px}.tf-base *,.tf-base *:before,.tf-base *:after{box-sizing:inherit}.tf-base h2{font-size:1.3em;line-height:1.2em}.tf-config-preview{padding:.7em}.tf-config-preview .tf-preview-item{margin:.5em;border:1px solid #ccc;border-radius:5px;background:#fafafa}.tf-config-preview .tf-preview-item-header{display:flex;padding:.5em 0;border-radius:5px 5px 0 0;background:#eee}.tf-config-preview .tf-preview-item-header h3{flex:1;margin:0;padding:0 .5em;font-size:1.1em;line-height:0 1.5em}.tf-config-preview .tf-preview-item-header span{flex-basis:2.5em;flex-grow:0;flex-shrink:0;text-align:center}.tf-config-preview .tf-preview-item-header span a{cursor:pointer}.tf-config-preview .tf-preview-item-header span svg{height:1em}.tf-config-preview .tf-preview-item-content{padding:.5em 1em}.tf-config-preview .tf-preview-plus{margin:.5em;padding:1em 0;border:1px solid #eee;border-radius:5px;background:#fafafa;text-align:center}.tf-config-preview .tf-preview-plus svg{height:2.5em}.tf-config-picker{padding:.7em}.tf-fe-picker{display:flex;margin:.5em;border:1px solid #ccc;border-radius:5px;background:#eee}.tf-fe-picker div{padding:.5em 0}.tf-fe-picker .tf-icon{display:flex;flex-basis:3.5em;flex-grow:0;flex-shrink:0;align-items:center;justify-content:center}.tf-fe-picker .tf-icon svg{height:1.5em}.tf-fe-picker .tf-text{flex:5;line-height:1.6em}.tf-fe-picker .tf-handle{display:flex;flex-basis:2.5em;flex-grow:0;flex-shrink:0;align-items:center;justify-content:center;background:#ccc;text-align:right}.tf-fe-picker .tf-handle svg{height:1em}.tf-draggable{cursor:grab}