.form-wrapper { display: table; margin: 0 auto; text-align: left !important; width: 30em; } .form-row { display: table-row; } .form-label { width: 1%; white-space: pre; } .form-label, .form-input { display: table-cell; line-height: 37px; vertical-align: text-bottom; } .form-input { overflow: hidden; text-overflow: ellipsis; } .form-row label { padding-right: 1em; text-align: right; } .tag-input, textarea, input[type=text], input[type=password] { padding: 2px 4px; border: 1px solid #eee; background: #fafafa; font-family: monospace; font-size: 17px; text-overflow: ellipsis; width: 100%; box-sizing: border-box; } button, input[type=button] { padding: 0.1em 0.5em; border: 1px solid #eee; background: #eee; font-family: 'Droid Sans', sans-serif; font-size: 17px; } button:not(:disabled), input[type=button]:not(:disabled) { cursor: pointer; } button:not(:disabled):hover, input[type=button]:not(:disabled):hover { background: #f5f5f5; } button:disabled { color: gray; } button.highlight, input[type=button].highlight { background: #ad5; } button:not(:disabled):hover.highlight, input[type=button]:not(:disabled):hover.highlight { background: #dfa; } textarea:focus, input:focus { outline: none; } .tag-input.focused, textarea:focus, input:not(.tag-real-input):focus { box-shadow: 0 0 0 1px #5da inset; border-color: #5da; } input[type=radio], input[type=checkbox] { display:none; } input[type=radio] + label, input[type=checkbox] + label { -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -o-user-select: none; user-select: none; } input[type=radio] + label:before, input[type=checkbox] + label:before { font-family: 'FontAwesome'; display: inline-block; width: 1em; text-align: left; } input[type=radio] + label:before { content: "\f1db"; } input[type=radio]:checked + label:before { content: "\f192"; } input[type=checkbox] + label:before { content: "\f096"; } input[type=checkbox]:checked + label:before { content: "\f046"; } .file-handler { border: 3px dashed #eee; padding: 0.3em 0.5em; line-height: 140% !important; text-align: center; cursor: pointer; } .file-handler.active { border-color: #6a2; background-color: #eeffcc; } .tag-input { padding: 1px; line-height: normal !important; cursor: text; } .tag-input ul { list-style-type: none; display: inline; margin: 0; padding: 0; } .tag-input li { background: #ddd; display: inline-block; font-family: 'Droid Sans', sans-serif; margin: 1px; padding: 2px 4px; font-size: 15px; } .tag-input input { border: none; width: auto; } .tag-input li a { color: black; font-size: 14px; margin-left: 0.5em; cursor: pointer; }