.plugin-dlg { max-width: 50em; display: inline-block; position: absolute; left: 50%; top: 30%; border: solid 1px #AAA; border-radius: 5px; background-color: #FAFAFA; width: 30em; margin-left: -15em; min-height: 10em; box-shadow: 2px 2px 5px #333; opacity: 1; z-index: 101; }
.plugin-dlg-title { background-color: #55F; padding: 5px; cursor: pointer; font-weight: bold; color: #FFF; border-bottom: solid 1px #AAA; border-radius: 5px 5px 0 0; }
.plugin-dlg-title-close { float: right; background-color: #EEE; border: solid 1px #AAA; border-radius: 3px; font-weight: normal; right: 0; top: 0; width: 1em; text-align: center; color: #333; }
.plugin-dlg-body { text-align: center; padding: 10px; overflow-y: auto; margin-bottom: 3em; max-height: 15em; }
.plugin-dlg-nav { text-align: right; position: absolute; bottom: 0; border-top: solid 1px #CCC; width: 30em; padding: 7px 0; background-color: #FFF; }
.plugin-dlg-nav button { min-width: 5em; margin-right: 1em; }
.plugin-dlg-bg  { background: #000; height: 100%; opacity: 0.3; position: fixed; width: 100%; top: 0; left: 0; z-index: 100; }

.sm-btn { cursor: pointer; }

.plugin-frame { text-align: center; }
.plugin-frame table thead tr{ text-align: center; font-weight: bold; background-color: #E1F0FB; font-size: 95%; border-bottom: solid 1px #CCC; }
.plugin-frame table thead td { text-align: center; font-weight: bold; height: 3em; border-right: solid 1px #DDD; color: #777; }
.plugin-frame table thead td:last-child { border-right: none; }
.plugin-frame table { border-collapse: separate; border-spacing: 0; font-size: 100%; color: #333; margin: 0 auto; border: 1px solid #AAA; border-radius: 5px; }
.plugin-frame tr.thead { border: solid 1px #AAA; }
.plugin-frame table td { padding: .3em 1em; text-align: left; border-right: solid 1px #DDD; border-bottom: solid 1px #CCC; }
.plugin-frame .thead td { text-align: center; color: #555; font-weight: bold; padding: 0.5em 1.5em; background-color: #F0F0FF; font-size: 100%; height: 3.5em; }
.plugin-frame table tr:first-child { border-top-left-radius: 5px; }
.plugin-frame table tr:last-child { border-top-right-radius: 5px; }
.plugin-frame table tr:first-child td:first-child { border-top-left-radius: 5px; }
.plugin-frame table tr:first-child td:last-child { border-top-right-radius: 5px; }
.plugin-frame table tr:last-child td:first-child { border-bottom-left-radius: 5px; }
.plugin-frame table tr:last-child td:last-child { border-bottom-right-radius: 5px; }
.plugin-frame table tr:last-child td { border-bottom: 0; }
.plugin-frame table td { vertical-align: middle; }
.plugin-frame table tr:nth-child(even) { background-color: #F7F7F7; }

.plugin-frame input[type="text"] { padding: .1em .2em;  width: 30em; }
.plugin-frame textarea { padding: .1em .2em; width: 30em; height: 5em; }
.plugin-frame .fempty { text-align: center; }
.plugin-frame .fname { font-size: 90%; text-align: right; }
.plugin-frame .fval { font-size: 100%; }

.plugin-frame .menu-bottom { text-align: right; background-color: #F3F3F3; padding: .7em 1em; border-radius: 5px; border: solid 1px #CCC; margin: .3em 0; }
.plugin-frame .menu-bottom button { margin: 0 0 0 .5em; padding: .1em .5em; }
.plugin-frame .frame-inner { display: inline-block; }
.plugin-frame .frame-scroll { display: inline-block; overflow: auto; max-height: 25em; }

.plugin-frame .list { margin: 0; }
.plugin-frame .list thead tr:last-child td { border-bottom: solid 1px #CCC; }
.plugin-frame .list thead tr:last-child td:first-child { border-bottom-left-radius: 0; }
.plugin-frame .list thead tr:last-child td:last-child { border-bottom-right-radius: 0; }
.plugin-frame .list tbody tr:first-child td:first-child { border-top-left-radius: 0; }
.plugin-frame .list tbody tr:first-child td:last-child { border-top-right-radius: 0; }

.plugin-frame .unit { margin: 0; }
.plugin-frame .unit td { padding: .5em .7em; }
.plugin-frame .unit .help { background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAMAAAAoLQ9TAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAA51BMVEUAAAAAbO4Abe8AbfEAbfAAbvEAbu4Abf8AbfAAbfAAbfAAbe8AbPEAbvAAbfAAbfAAbe8AgP8AbfAAbfAAbvAAceMAZuYAbfAAbvAAbvEAAP8AbvAAbfAAbvAAbO8Abe4Abe8AbPAAbu8Abu8Aa+0Abe0AbfAAbfAAcfEAa/IAbfAAbfAAdOgAbfAAbvEAbe8AafAAbvAAb+4Abu8AbvEAbPAAbfAAbfAAbfEAavEAbfAAZv8AbfAAbPAAbe8AbfAAbfAAbfAAbPIAbfAAbe8AbfMAa/IAbO8AbfAAbfAAbfEAbfAAAADSxn4lAAAAS3RSTlMALZHU9JAsB5b97KR/pe38lAa++3sJCr2XSgFkt7phTZOGgoArDvnJEhPL9gvujtURZi5yJafT834k6gXyVYHxzOIoplIqTE68u41Fj1+uAAAAAWJLR0QAiAUdSAAAAAlwSFlzAAAOxAAADsQBlSsOGwAAAAd0SU1FB+MBEhUgLCbFXPIAAADLSURBVBjTNU9pV4JQEL2BWMiTkZ6auSeaVi6VASqKmlvF//8/vXnqfLjbOXfmDKDmxjAzGdPK4jy3d3bOESLvUsHT/l4WSyzKQj5wUpGPqNbqjSbQorbq20XgKbVl2gF86sLKldB77g9eXt96GI7GmDjA+8cnME2/gCBENDvfmpuLWHWWWArtg5RWipI1JnkdbLbfTLsQlltmtd8z8tIs6SWOw5jQASjI4zU4kaHQ+5FCt4YJ/cYsvDa5O98PRmTEl3+74zCKwr8D639meBQPi3clHgAAACV0RVh0ZGF0ZTpjcmVhdGUAMjAxOS0wMS0xOFQyMDozMjo0NCswMTowMEOF9kYAAAAldEVYdGRhdGU6bW9kaWZ5ADIwMTktMDEtMThUMjA6MzI6NDQrMDE6MDAy2E76AAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAAABJRU5ErkJggg==') center no-repeat; width: 16px; height: 16px; display: inline-block; vertical-align: middle; background-size: 16px; }
.plugin-frame .unit table td { border-right: none; }


.plugin-frame .msg { text-align: center; font-size: 90%; margin-bottom: 1em; }
.plugin-frame .msg div { background: #F0FFF0; padding: 1em 1.5em; display: inline-block; border: solid 1px #CCC; border-radius: 7px; margin: .5em auto; max-width: 20em; }

.err { background-color-: pink; border: solid 1px red !important; outline: none !important; }