html { margin:0; padding:0; font-size:100%; height:100%; }
body { position:relative; width:100%; height:100%; overflow-x:hidden; margin:0; background:#999; }
body.loginpage { background:linear-gradient(#06c, #04a); }
body.blank, body.center { background:#fff; }
body.center { text-align:center; }
body.center > div { display:inline-block; margin:0 auto; }
body.center > div * { text-align:left; }
body, p, li, input, textarea, select, button, td, th, div, legend { vertical-align:top; font-size:1em; line-height:1.5em; font-family:'Trebuchet MS', 'Lucida Grande', 'Lucida Sans Unicode', 'Lucida Sans', Tahoma, sans-serif; }
p { margin:0; padding:.3em 0; }
fieldset legend { font-size:.8em; color:#666; }
iframe { width:100%; height:60vh; border:1px solid #ccc; }
fieldset { border:1px solid #ccc; }

/* Fonts */

h1 { margin:.3em .6em; color:#333; font-size:1.4em; }
h2 { margin:.3em 0 .5em; color:#333; font-size:1.2em; }
input[type="button"], button { width:8em; margin:0 0 .5em; padding:0 12px; border:1px solid #666; border-radius:2px; background:#ccc; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
input, select, .inputfield { width:98%; margin:0 0 .5em; border:1px solid #999; }
input[type="checkbox"] { width:auto; }
button.highlighted { background:#c00; color:#fff; }

/* jGrowl */

#jGrowl { padding-bottom:2.4em; }
#jGrowl * { color:#fff; font-size:1.1em; }
#jGrowl .jGrowl-notification, #jGrowl .jGrowl-closer { background:rgba(0, 0, 0, .85); }
#jGrowl .ui-corner-all { border:0; border-radius:1em; }
#jGrowl .jGrowl-close { width:auto; font-weight:bold; }

/* form */

form label { display:block; }
form > span, form label > span { display:inline-block; width:12em; vertical-align:top; }
form input, form button { margin:0 0 .6em; }
form select { margin:0 0 .6em; padding:2px; border:1px solid #ccc; }
form select[disabled] { background:#ebebe4; border:1px solid #a9a9a9; color:#545454; }
form .inputfield { display:inline-block; }
form .inputfield .ms-container { width:100%; }
.ms-container .ms-header { padding:0 5px; background:#333; color:#fff; }
.jqxdatepicker, .jqxdatetimepicker { display:inline-block; vertical-align:middle; }

/* form elements - toggle button with checkbox */

.noselect { -webkit-user-select:none; -khtml-user-select:none; -moz-user-select:-moz-none; -o-user-select:none; user-select:none; }

.togglebutton { border:0; clip:rect(0 0 0 0); height:1px; margin:-1px; overflow:hidden; padding:0; position:absolute; width:1px; } /* vis-hidden */
.togglebutton + label { display:inline-block; box-sizing:border-box; min-width:45px; height:24px; margin:0; padding:3px; background:#efefef; border:1px solid #aaa; border-radius:3px; font-size:13px; line-height:1.231; font-family:Verdana,Arial,sans-serif; }
.togglebutton + label:hover { background:#e8e8e8; }
.togglebutton:checked + label { background:#d1d1d1; }
.togglebutton:checked + label:hover { background:#cacaca; }

.statusfield { border:0; clip:rect(0 0 0 0); height:1px; margin:-1px; overflow:hidden; padding:0; position:absolute; width:1px; } /* vis-hidden */
.statusfield + label { display:inline-block; box-sizing:border-box; min-width:45px; height:24px; margin:0; padding:3px; background:#fff; border:1px solid #666; font-size:13px; line-height:1.231; font-family:Verdana,Arial,sans-serif; }
.statusfield:checked + label { background:#06c; }

/* error */

[data-flerror] { display:none; color:#900; font-weight:bold; }

/* general */

.left { float:left; }
.right { float:right; }
.clear { clear:both; }
.hidden { display:none; }
.line1 { display:block; }
.line2 { display:block; color:#999; font-size:.75em; line-height:1.2em; }

/* header */

header { position:fixed; z-index:10; left:0; top:0; width:100%; box-shadow:0 .1em .1em #666; }

#header1 { position:relative; z-index:3; height:3em; background:linear-gradient(#06c, #04a); }
#trendvisu { display:block; position:absolute; width:2.4em; height:2.4em; left:.5em; top:.3em; background:url(trendvisu_64x64.png) center; background-size:cover; }
#navibutton { position:absolute; display:block; right:.5em; top:.5em; width:2em; height:2em; }
#navibutton:before { content:""; position:absolute; left:0; top:.4em; width:2em; height:.3em; background: #fff; box-shadow:0 0.5em 0 0 #fff, 0 1em 0 0 #fff; }
#header1 h1 { position:absolute; left:2.6em; top:0; width:auto; margin:0; padding:.6em 0; font-size:1.4em; color:#fff; }

#header1 nav ul { display:none; position:absolute; right:0; top:3em; width:14em; margin:0; padding:.5em; box-shadow:-.07em .07em .07em #666; background:#ddd; list-style:none; }
#header1 nav ul.activated { display:block; }
#header1 nav ul li { border:1px solid #ddd; }
#header1 nav ul li.activated { background:#eee; border:1px solid #ccc; }
#header1 nav ul li div { padding:.3em; }
#header1 nav ul li a { display:block; }
#header1 nav ul li div, #header1 nav ul li a { font-size:1em; color:#000; font-weight:bold; text-decoration:none; }
#header1 nav ul li ul { position:relative; left:0; top:0; padding:0; background:transparent; box-shadow:none; }
#header1 nav ul li.activated ul { display:block; }
#header1 nav ul li ul li { border:none; }
#header1 nav ul li ul li a { font-weight:normal; }
	
#header2 { position:relative; z-index:2; /* height:1.8em; */ height:0; background:#eee; }
#header2 div { position:absolute; left:0; top:0; width:auto; padding:.2em .5em; font-size:.8em; }

/* options */

#options { display:none; position:fixed; z-index:5; left:-18em; top:0; width:18em; height:100%; background:#444; box-shadow: inset -.15em 0 .15em #000; overflow-x:hidden; }
#options * { color:#fff; }

/* content */

#content { position:absolute; z-index:1; left:0; top:0; width:100%; background:#fafafa; }
#wrap { padding:3.2em .4em 2em; overflow:hidden; }
.container { position:relative; margin:0 0 .4em; padding:0 0 .6em; }

/* more controls */

.container-view { float:right; width:auto; padding:.6em .6em; 0 0; }
.container-view a { display:inline-block; margin:0 0 0 .6em; padding:0 .6em; border:1px solid #999; border-radius:.25em; background:#aaa; text-decoration:none; color:#000; } 
[data-flfunction="infobox-button"] { display:inline-block; width:16px; height:16px; padding:0; background:#eeeeff; border:1px solid #ccccff; border-radius:3px; text-decoration:none; text-align:center; font-size:.7em; line-height:1.2em; }
[data-flfunction="infobox"] { display:none; background:#eeeeff; padding:0 5px; background:#eeeeff; border:1px solid #ccccff; border-radius:3px; text-decoration:none; font-size:.7em; }

/* controls */

.container-box { position:relative; margin:0 .6em .6em; padding:.6em .6em 0 !important; border:1px solid #bbb; border-radius:.25em; box-shadow:0 0 1px #ddd; background:#fff; }
.container-list, .container-form { display:none; max-height:93%; overflow-x:hidden; }
.container-list.container-scope, .container-form.container-scope { display:block; }
.container-controls { margin:0 0 .6em; padding:.6em .6em 0; border-top:1px solid #ccc; border-bottom:1px solid #ddd; background:#eee; }
.container-box h3 { margin:0; /* padding:0 .31em .31em; background:linear-gradient(#06c, #04a); color:#fff; */ font-size:1em; }
.container-box h4 { margin:0 0 .6em; padding:.6em; background:#eee; border-top:1px solid #ccc; border-bottom:1px solid #ccc; font-size:1em; font-weight:normal; }
.container-subform { display:none; }

ul.user a { background:url(usericon.png) .25em .5em no-repeat; }
ul.location a { background:url(locationicon.png) .25em .5em no-repeat; }
ul.controller a { background:url(controllericon.png) .25em .5em no-repeat; }
ul.role a { background:url(roleicon.png) .25em .5em no-repeat; }
ul.variable a { background:url(variableicon.png) .25em .5em no-repeat; }
ul.language a { background:url(languageicon.png) .25em .5em no-repeat; }
ul.vdatapoint a { background:url(datapointicon.png) .25em .5em no-repeat; }
ul.mdatapoint a { background:url(datapointicon.png) .25em .5em no-repeat; }
ul.smartenergy a.hardware { background:url(hardwareicon.png) .25em .5em no-repeat; }
ul.smartenergy a.controller { background:url(controllericon.png) .25em .5em no-repeat; }
ul.smartenergy a.role { background:url(roleicon.png) .25em .5em no-repeat; }
ul.smartenergy a.folder { background:url(foldericon.png) .25em .5em no-repeat; }
ul.smartenergy a.dptype { background:url(foldericon.png) .25em .5em no-repeat; }
ul.smartenergy a.plugin { background:url(pluginicon.png) .25em .5em no-repeat; }
ul.smartenergy a.datapoint { background:url(datapointicon.png) .25em .5em no-repeat; }
ul.smartenergy a.active { background-color:#e6e6e6; }

[data-flfunction="input"] { width:45%; }
[data-flfunction="create"] { width:45%; float:right; }
[data-flfunction="result"], .wrapfoldertree { border:1px solid #aaa; margin:0 0 .6em; }

[data-flfunction="result"] ul { position:relative; z-index:3; margin:0 0 1.2em; padding:0; list-style:none; }
[data-flfunction="result"] ul ul { padding:0 0 0 2.5em; margin:0; }
[data-flfunction="result"] ul li { position:relative; z-index:3; margin:0; padding:0 0 0 0; border-bottom:1px solid #ccc; background-color:#f7f7f7; }
[data-flfunction="result"] ul li ul li { border-bottom:none; }
[data-flfunction="result"] ul li a { position:relative; z-index:3; display:block; min-height:2em; color:#666; padding:.4em .19em .4em 2.5em; text-decoration:none; }

ul.tree { position:relative; z-index:3; margin:0 0 -1px; padding:0 0 0 .5em; list-style:none; background-color:#f7f7f7; }
ul.tree ul { padding:0 0 0 2.5em; margin:0; }
ul.tree li { position:relative; z-index:3; margin:0; padding:0 0 0 0; border-bottom:1px solid #ccc; }
ul.tree li ul li { border-bottom:none; }
ul.tree li a { position:relative; z-index:3; display:block; min-height:2em; color:#666; padding:.4em .19em .4em 2.5em; text-decoration:none; }

/*
[data-flfunction="result"] ul.tree ul { padding:0 0 0 1.2em; }
[data-flfunction="result"] ul.tree li { padding:0 0 0 1em; }
[data-flfunction="result"] ul.tree li .treelines1 { position:absolute; z-index:1; left:0; top:0; width:1em; height:1.25em; border-left:1px dotted #333; border-bottom:1px dotted #333; }
[data-flfunction="result"] ul.tree li .treelines2 { position:absolute; z-index:1; left:0; top:1.25em; bottom:0; width:1em; border-left:1px dotted #333; }
[data-flfunction="result"] ul.tree li:not([style*="display:none"]):not([style*="display: none"]):last-child .treelines2 { border:none; }
[data-flfunction="result"] ul.tree li .treebutton { display:block; position:absolute; z-index:1; left:-.25em; top:1em; width:.5em; height:.5em; min-height:auto; padding:0; background:#f7f7f7; border:1px solid #333; border-radius:.15em; line-height:.5em; text-align:center; }
[data-flfunction="result"] ul.tree > li { padding:0 0 0 1.5em; }
[data-flfunction="result"] ul.tree > li > .treelines1 { left:.5em; border-left:none; }
[data-flfunction="result"] ul.tree > li > .treelines2 { display:none; }
[data-flfunction="result"] ul.tree > li > .treebutton { left:.25em; }
[data-flfunction="result"] ul.tree ul > li { display:none; }
[data-flfunction="result"] ul.tree ul.opened > li { display:block; }
*/
ul.tree ul { padding:.5em 0 0 1.2em; margin:-.5em 0 0 0; }
ul.tree li { padding:0 0 0 1.5em; }
ul.tree > li { padding:0 0 0 2em; }
ul.tree li .treelines1 { position:absolute; z-index:1; left:0; top:0; width:1.5em; height:1.25em; border-left:1px dotted #333; border-bottom:1px dotted #333; }
ul.tree li .treelines2 { position:absolute; z-index:1; left:0; top:1.25em; bottom:0; width:1em; border-left:1px dotted #333; }
ul.tree li:not(.notfound):not([style*="display:none"]):not([style*="display: none"]):last-child > .treelines2, ul.tree li.lastvisible > .treelines2 { border:none; }
/* ul.tree li .treebutton { display:block; position:absolute; z-index:1; left:-.25em; top:.85em; width:.5em; height:.5em; min-height:auto; padding:.1em; background:#f7f7f7; border:1px solid #333; border-radius:.15em; line-height:.5em; text-align:center; } */
ul.tree li .treebutton { display:block; position:absolute; z-index:1; left:-.5em; top:.6em; width:.5em; height:.5em; min-height:auto; padding:.35em; background:#f7f7f7; border:1px solid #333; border-radius:.15em; line-height:.5em; text-align:center; }
ul.tree > li > .treelines1 { left:.5em; border-left:none; }
ul.tree > li > .treelines2 { display:none; }
ul.tree > li > .treebutton { left:.25em; }
ul.tree ul > li { display:none; }
ul.tree ul.opened > li { display:block; }
ul.tree li.notfound { display:none !important; }

/* footer */

footer { position:fixed; z-index:10; left:0; bottom:0; width:100%; height:2em; border-top:1px solid #000; background:#111; }
footer div.footer-time { position:absolute; left:0; bottom:0; width:auto; padding:.3em .5em; text-align:left; }
footer div.footer-version { position:absolute; right:0; bottom:0; width:auto; padding:.3em .5em; text-align:right; }
footer * { color:#fff; font-weight:bold; text-decoration:none; }

/* login */

body.loginpage > div { margin:2em 0; padding:1em 30%; background:#fff; }
#loginbox .logo { float:left; margin:1em; }
#loginbox form { float:left; max-width:10em; }

/* smart energy */

/* .container-info, .container-input, .container-trend, .container-output { margin:0 0 .5em; } */
.container-info {}
.container-input { padding-bottom:.6em; }
.container-trend {}
.container-output {}
.container-combined12 { padding-bottom:.6em; }
.container-bottomspace { margin:0 0 .6em; }
.container-wrap { height:100%; margin:0 0 .6em; padding:.6em .4em .01em; }
.container-pending { background:linear-gradient(#f7f7f7, #e7e7e7); }
.container-livevalue { text-align:right; margin:0 0 .6em; }
.container-livevalue * { text-align:left; }
.container-livevalue-label { display:inline-block; width:29%; }
.container-livevalue-value { display:inline-block; width:65%; min-height:1em; border-radius:2px; color:#fff; text-align:center; }
.container-livevalue-blue { border:1px solid #006; background:#00c; }
.container-livevalue-red { border:1px solid #600; background:#c00; }
.container-livevalue-green { border:1px solid #00450a; background:#00852a; }
.container-livevalue-yellow { border:1px solid #060; background:#cc0; }
.container-livevalue-transparent { border:1px solid #000; background:none; }
[data-flfunction="quickchart"] { height:8em; margin:0 0 .6em; }
#contentDiv { z-index:10000; } /* charts */
[data-flenabled="0"] { background-color:#f99 !important; }

/* instimg */

[data-fltype="plugin"] [data-fltype="plugin"] .container-wrap { height:100%; margin:0; padding:0; }
[data-fltype="plugin"] [data-fltype="plugin"], [data-fltype="plugin"] [data-fltype="plugin"] [data-flfunction="quickchart"] { height:100%; margin:0; }
[data-fltype="plugin"] [data-fltype="plugin"] [data-flfunction="quickchart"] { height:100%; margin:0; }
.instimglink, [data-fldialog], [data-fldialog] * { cursor:pointer; }
.instimg-if0hide { display:block; }
.instimg-if0hide[data-flvalue="0"] { display:none; }
.instimg-ifxshow { display:none; }
.instimg-ifxshow[data-flvalue="-1"] { display:block; }
.instimg-if0show { display:none; }
.instimg-if0show[data-flvalue="0"] { display:block; }
.instimg-if1show { display:none; }
.instimg-if1show[data-flvalue="1"] { display:block; }
.instimg-if2show { display:none; }
.instimg-if2show[data-flvalue="2"] { display:block; }
.instimg-if3show { display:none; }
.instimg-if3show[data-flvalue="3"] { display:block; }
.instimg-if4show { display:none; }
.instimg-if4show[data-flvalue="4"] { display:block; }
[data-flname="plugininstallationimage"] [data-flcontent] { white-space:nowrap; }

/* dialog */

.overlay { display:none; position:fixed; z-index:1000; left:0; right:0; top:0; bottom:0; padding:2em; background:#666; text-align:center; }
.dialogclose { display:block; position:absolute; z-index:1002; right:1em; top:1em; width:1.6em; height:0; padding:.8em 0; border-radius:.8em; background:#fff; box-sizing:border-box; line-height:0; font-weight:bold; color:#000; text-decoration:none; text-align:center; }
.dialog { position:absolute; left:50%; top:2%; z-index:1001; width:auto; max-width:96%; max-height:91%; transform: translate(-50%, 0); padding:1em; overflow-x:auto; background:#fff; text-align:left; }
.dialog h3 { margin-bottom:.3em; padding:.3em; background:linear-gradient(#06c, #04a); font-size:1em; margin:0; color:#fff; }
.dialog .smartenergydialogcolumn { display:inline-block; padding:0 0 0 1em; vertical-align:top; }
.dialog .smartenergydialogcolumn:first-child { padding:0; }
.dialog .smartenergydialog { padding:.1em; 0; }
.dialog .smartenergydialog .time { width:6.5em; margin:0 .3em; }
.dialog .smartenergydialog .date { width:6em; margin:0 .3em; }
.dialog .smartenergydialog .selector { width:10em; margin:0 .3em; }
.dialog .smartenergydialog .labelname { width:13em; margin:0 .3em; text-align:left; }
.dialog .smartenergydialog .check { width:3em; margin:0 .3em; }
.dialog .smartenergydialog .selector select { width:10em; }
.dialog .smartenergydialog .dayofweek { width:21.5em; margin:0 .3em; }
.dialog .smartenergydialog .status { width:2.5em; margin:0 .3em; }
.dialog .smartenergydialog > div { display:inline-block; width:auto; padding:.1em; text-align:center; }
.dialog .smartenergydialog .time select { width:2.75em; }
.dialog .smartenergydialog .time select option { text-align:right; }
.dialog .smartenergydialog .dayofweek button { width:2.75em; }
.dialog .smartenergydialog .status .statusbox { width:2.5em; border:1px solid #666; }
.dialog [data-flfunction="chart"], .dialog [data-flfunction="table"] { width:auto; height:76vh; margin:.6em 0 .6em; }
.dialog [data-flfunction="table"] { overflow-x:hidden; }
.dialog [data-flfunction="history"], .dialog [data-flfunction="status"] { width:auto; height:76vh; margin:.6em 0 0; overflow-x:hidden; }
.dialog table.tabledata { min-width:60vw; width:90vw; max-width:1200px; border-collapse:collapse; border:1px solid black; }
.dialog table.tabledata, .dialog table.tabledata th, .dialog table.tabledata td { border-collapse:collapse; border:1px solid black; }
.dialog table.tabledata th, .dialog table.tabledata td { padding:0 5px; }
.dialog table.tabledata th { background:#ddd; }
.dialog table.tabledata td:first-child { background:#aaa; }
.dialog table.tabledata td button { margin-top:.3em; }
.dialog table.tabledata td.status3 { background:#900; color:#fff; }
.dialog .container-box { min-width:75vw; }

/* status dialog */

.container-livevalue-unkown, .status-unkown .status { color: white; background-color: #000000 !important; border:1px solid #000; }
.container-livevalue-ok, .status-ok .status { color: white; background-color: #00852a !important; border:1px solid #030; }
.container-livevalue-alert, .status-alert .status { color: white !important; background-color: #c00 !important; border:1px solid #600; }
.container-livevalue-disorder, .status-disorder .status { color: white !important; background-color: #a02128 !important; border:1px solid #600; }
.container-livevalue-warning, .status-warning .status { color: black; background-color: #dd7907 !important; border:1px solid #633; }
.container-livevalue-info, .status-info .status { color: black; background-color: #9aa0a7 !important; border:1px solid #366; }
.container-livevalue-noinfo, .status-noinfo .status { color: black; background-color: #f8f9fb !important; border:1px solid #666; }
.container-livevalue-running, .status-running .status { color: white !important; background-color: #000e5b !important; border:1px solid #003; }
.container-livevalue-confirmed, .status-confirmed .status { color: black; background-color: orange !important; border:1px solid #630; }
.container-livevalue-gone, .status-gone .status { color: black; background-color: yellow !important; border:1px solid #660; }



[data-role="input"] { display:inline-block !important; }

/* organise */

.firstpart, .secondpart { margin:0 .6em .6em; }

/* datapoint select */

.ds-wrap { width:70vw; margin-bottom:.3em; text-align:left; }
.ds-view { max-width:100%; border:1px solid #a9a9a9; padding:.4em .19em .4em 2.5em; background:url(datapointicon.png) .25em .5em no-repeat #ebebe4; }
.ds-list { display:none; max-width:100%; border:1px solid #a9a9a9; padding:.19em; }
.ds-search { width:auto; margin:0 0 .19em; }
.ds-search input { width:auto; margin:0; }
.ds-list .wrapfoldertree { max-height:20em; overflow-x:hidden; margin:0; }

/* ----------------------------------------------------------------------------- *
 * Smartphone                                                                    *
 * max 750px / 16px/em = 46.875em                                                *
 * ----------------------------------------------------------------------------- */
@media only screen and (max-width: 46.870em) {
	.container-view { display:none; }
}

/* ----------------------------------------------------------------------------- *
 * Tablet                                                                        *
 * 750px / 16px/em = 46.875em                                                    *
 * ----------------------------------------------------------------------------- */
@media only screen and (min-width: 46.875em) {
	.container-view { display:none; }
	.dialog [data-flfunction="chart"], .dialog [data-flfunction="table"] { width:90vw; height:58vh; }
}

/* ----------------------------------------------------------------------------- *
 * Desktop small                                                                 *
 * 1024px / 16px/em = 64em                                                       *
 * 1152px / 16px/em = 72em (neu)                                                 *
 * ----------------------------------------------------------------------------- */

@media only screen and (min-width: 72em) {

	/*body { padding-left:18em; }*/

	input, select, .inputfield { width:20em; }

	.container-view { display:block; }

	#trendvisu { left:2em; cursor:default; }
	#header1 h1 { left:3.5em; }
	#header2 div { left:2em; }

	#navibutton { display:none; }
	#header1 nav ul { display:block; }
	#header1 nav ul li ul.activated { display:none; }
	#header1 nav { position:absolute; right:0; top:0; width:auto; }
	#header1 nav ul { position:relative; top:0; width:auto; padding:.6em 2em; box-shadow:none; background:transparent; }
	#header1 nav ul li { position:relative; display:inline-block; margin:0; padding:0; border:none; }
	#header1 nav ul li div { padding:.1em .3em; cursor:pointer; }
	#header1 nav ul li a { width:auto; height:1.8em; }
	#header1 nav ul li div, #header1 nav ul li a { color:#fff; }
	#header1 nav ul li a:hover { color:#eee; }
	#header1 nav ul li ul { display:none; position:absolute; left:0; top:1.6em; width:15em; overflow:hidden; background:#333; border:none !important; }
	#header1 nav ul li.activated { background:transparent; border:none; }
	#header1 nav ul li:hover ul, #header1 nav ul li.activated ul { display:block; border:1px solid #ccc; }
	#header1 nav ul li ul li { display:block; }
	#header1 nav ul li ul li a { height:auto; }

	#content { position:absolute; left:0; right:0; width:auto; height:100%; }
	#wrap { position:absolute; left:2em; right:2em; /* top:4.8em; */ top:3.2em; bottom:2.4em; padding:0; /* height:100%; padding:4.8em 2em 1em; */ }
	#options + #content { left:18em; }

	#options { z-index:1; left:0; top:4.8em; bottom:2em; width:18em; height:auto; background:#ddd; box-shadow:none; border-right:1px solid #999 }
	#options * { color:#000; }

	.container-list { display:block; }
	.container-list { position:relative; float:left; width:35%; height:93%; }
	.container-form { position:relative; float:right; width:60%; max-height:93%; }
	.container-small { float:left; min-width:14em; margin:0 2em .6em .6em; }
	.container-small.container-s { width:15%; height:auto; }
	.container-small.container-l { width:60%; height:auto; }

	.container-info, .container-input, .container-trend, .container-output, .container-combined12 { min-height:1em; margin:0; /* padding:0 0 .6em; */ }
	.container-info { float:left; width:20%; margin-right:1%; }
	.container-input { float:left; width:28%; margin-right:1%; }
	.container-trend { float:left; width:19%; margin-right:1%; }
	.container-output { float:right; width:28%; }
	.container-combined12 { float:left; width:48.5%; margin-right:1%; }
	.container-input button, .container-input form, .container-input form > * { max-width:100%; }

	[data-flfunction="result"] { position:absolute; left:.6em; right:.6em; top:4.31em; bottom:0; border:1px solid #aaa; overflow-x:hidden; }

	.dialog [data-flfunction="chart"], .dialog [data-flfunction="table"] { height:76vh; }

	.ds-wrap { width:20em; max-width:85%; }
	.contextmenu .ds-wrap { max-width:100%; }
}

/* ----------------------------------------------------------------------------- *
 * Desktop large                                                                 *
 * 1248px / 16px/em = 78em                                                       *
 * ----------------------------------------------------------------------------- */
@media only screen and (min-width: 78em) {

	.container-list { width:25%; }
	.container-form { width:70%; }

	[data-flname="organiseform"] { height:100%; max-height:none !important; overflow:hidden; }
	[data-flname="organiseform"] form { height:100%; overflow:hidden; }
	[data-flname="organiseform"] form .firstpart { float:left; width:43%; height:auto; margin-right:2em; }
	[data-flname="organiseform"] form .secondpart { position:relative; float:left; width:43%; height:85%; margin-bottom:0; }
	[data-flname="organiseform"] form .secondpart .wrapfoldertree { position:absolute; left:.6em; right:.6em; top:4.31em; bottom:0; overflow-x:hidden; }

}