@charset "UTF-8";
/* eh_style.scss
Style for E+H Webdesign
*/
/* main.scss
Style for E+H Webdesign
*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font: inherit; font-size: 100%; vertical-align: baseline; }

html { line-height: 1; }

ol, ul { list-style: none; }

table { border-collapse: collapse; border-spacing: 0; }

caption, th, td { text-align: left; font-weight: normal; vertical-align: middle; }

q, blockquote { quotes: none; }
q:before, q:after, blockquote:before, blockquote:after { content: ""; content: none; }

a img { border: none; }

article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display: block; }

/*! normalize.css v3.0.0 | MIT License | git.io/normalize */
/*! normalize.css v3.0.0 | HTML5 Display Definitions | MIT License | git.io/normalize */
article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary { display: block; }

audio, canvas, progress, video { display: inline-block; vertical-align: baseline; }

audio:not([controls]) { display: none; height: 0; }

[hidden], template { display: none; }

/*! normalize.css v3.0.0 | Base | MIT License | git.io/normalize */
html { font-family: sans-serif; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }

body { margin: 0; }

/*! normalize.css v3.0.0 | Links | MIT License | git.io/normalize */
a { background: transparent; }

a:active, a:hover { outline: 0; }

/*! normalize.css v3.0.0 | Typography | MIT License | git.io/normalize */
abbr[title] { border-bottom: 1px dotted; }

b, strong { font-weight: bold; }

dfn { font-style: italic; }

h1 { font-size: 2em; margin: 0.67em 0; }

mark { background: #ff0; color: #000; }

small { font-size: 80%; }

sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }

sup { top: -0.5em; }

sub { bottom: -0.25em; }

/*! normalize.css v3.0.0 | Embedded Content | MIT License | git.io/normalize */
img { border: 0; }

svg:not(:root) { overflow: hidden; }

/*! normalize.css v3.0.0 | Figures | MIT License | git.io/normalize */
figure { margin: 1em 40px; }

hr { -moz-box-sizing: content-box; box-sizing: content-box; height: 0; }

pre { overflow: auto; }

code, kbd, pre, samp { font-family: monospace, monospace; font-size: 1em; }

/*! normalize.css v3.0.0 | Forms | MIT License | git.io/normalize */
button, input, optgroup, select, textarea { color: inherit; font: inherit; margin: 0; }

button { overflow: visible; }

button, select { text-transform: none; }

button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; cursor: pointer; }

button[disabled], html input[disabled] { cursor: default; }

button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }

input { line-height: normal; }

input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; }

input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { height: auto; }

input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }

input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }

fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; }

legend { border: 0; padding: 0; }

textarea { overflow: auto; }

optgroup { font-weight: bold; }

/*! normalize.css v3.0.0 | Tables | MIT License | git.io/normalize */
table { border-collapse: collapse; border-spacing: 0; }

td, th { padding: 0; }

/* images.scss
erstellt ein Sprite von allen Grafiken in dem angegebenen Verzeichnis
*/
.image-sprite, .image-add_16, .image-arrow_down_16, .image-arrow_left_16, .image-arrow_right_16, .image-arrow_up_16, .image-cancel_16, .image-cancel_24, .image-cb_checked_16, body.modern input[type=checkbox].checked + label:before, .image-cb_checked_hover_16, body.modern input[type=checkbox].checked + label:hover:before, .image-cb_unchecked_16, body.modern input[type=checkbox] + label:before, .image-cb_unchecked_hover_16, body.modern input[type=checkbox] + label:hover:before, .image-checked_16, .image-deh_24, .image-deh_64, .image-device_24, .image-diagnostics_32, .image-diagnostics_64, .image-edit_16, .image-eh_logo, .image-enter_16, .image-filter_24, .image-fmcs_check_24, .image-fmcs_check_32, .image-fmcs_failure_24, .image-fmcs_failure_32, .image-fmcs_maintenance_24, .image-fmcs_maintenance_32, .image-fmcs_nocat_24, .image-fmcs_nocat_32, .image-fmcs_ok_24, .image-fmcs_ok_32, .image-fmcs_outofspec_24, .image-fmcs_outofspec_32, .image-help_16, .image-i_16, .image-i_24, .group .param .tooltip, #header .param .tooltip, #main .param .tooltip, .image-limit, .image-limit_gradient_falling, .image-limit_gradient_rising, .image-limit_lower, .image-limit_upper, .image-locked_16, .image-locked_24, .image-locked_24_black, .image-locked_24_blue, .image-measurement_24, .image-menu-icon, #menu-main-icon:hover, .image-menu-icon_black, #menu-main-icon, .image-orsg35, .image-orsg45, .image-pdf_24, .image-pdf_24_blue, .image-rb_checked_16, body.modern input[type=radio].checked + label:before, .image-rb_checked_hover_16, body.modern input[type=radio].checked + label:hover:before, .image-rb_unchecked_16, body.modern input[type=radio] + label:before, .image-rb_unchecked_hover_16, body.modern input[type=radio] + label:hover:before, .image-refresh_16, .image-rsg35, .image-rsg45, .image-rtf_24, .image-rtf_24_blue, .image-rtf_64, .image-rtf_64_blue, .image-save_16, .image-save_24, .image-search_16, .image-select_16, #menu a.submenu:after, .image-select_16_disabled, .image-submenu_16, .image-submenu_24, .image-tabcontrol_16, .image-under_construction_64 { background-image: url('../images/image_26_V2_0_55.png'); background-repeat: no-repeat; }

.image-add_16 { background-position: -48px 0; height: 16px; width: 16px; }

.image-arrow_down_16 { background-position: -112px 0; height: 16px; width: 16px; }

.image-arrow_left_16 { background-position: -16px 0; height: 16px; width: 16px; }

.image-arrow_right_16 { background-position: 0 -16px; height: 16px; width: 16px; }

.image-arrow_up_16 { background-position: -16px -16px; height: 16px; width: 16px; }

.image-cancel_16 { background-position: -32px -16px; height: 16px; width: 16px; }

.image-cancel_24 { background-position: -24px -88px; height: 24px; width: 24px; }

.image-cb_checked_16, body.modern input[type=checkbox].checked + label:before { background-position: -64px -16px; height: 16px; width: 16px; }

.image-cb_checked_hover_16, body.modern input[type=checkbox].checked + label:hover:before { background-position: -80px -16px; height: 16px; width: 16px; }

.image-cb_unchecked_16, body.modern input[type=checkbox] + label:before { background-position: -96px -16px; height: 16px; width: 16px; }

.image-cb_unchecked_hover_16, body.modern input[type=checkbox] + label:hover:before { background-position: -112px -16px; height: 16px; width: 16px; }

.image-checked_16 { background-position: -128px -16px; height: 16px; width: 16px; }

.image-deh_24 { background-position: -232px -40px; height: 24px; width: 24px; }

.image-deh_64 { background-position: -184px -150px; height: 64px; width: 64px; }

.image-device_24 { background-position: -208px -40px; height: 24px; width: 24px; }

.image-diagnostics_32 { background-position: -48px -88px; height: 32px; width: 32px; }

.image-diagnostics_64 { background-position: -120px -150px; height: 64px; width: 64px; }

.image-edit_16 { background-position: -32px 0; height: 16px; width: 16px; }

.image-eh_logo { background-position: 0 -120px; height: 30px; width: 257px; }

.image-enter_16 { background-position: -64px 0; height: 16px; width: 16px; }

.image-filter_24 { background-position: -64px -40px; height: 24px; width: 24px; }

.image-fmcs_check_24 { background-position: -40px -40px; height: 24px; width: 24px; }

.image-fmcs_check_32 { background-position: 0 -214px; height: 32px; width: 32px; }

.image-fmcs_failure_24 { background-position: -184px -64px; height: 24px; width: 24px; }

.image-fmcs_failure_32 { background-position: -144px -88px; height: 32px; width: 32px; }

.image-fmcs_maintenance_24 { background-position: -160px -64px; height: 24px; width: 24px; }

.image-fmcs_maintenance_32 { background-position: -176px -88px; height: 32px; width: 32px; }

.image-fmcs_nocat_24 { background-position: -224px -16px; height: 24px; width: 24px; }

.image-fmcs_nocat_32 { background-position: -32px -214px; height: 32px; width: 32px; }

.image-fmcs_ok_24 { background-position: -88px -64px; height: 24px; width: 24px; }

.image-fmcs_ok_32 { background-position: -24px -150px; height: 32px; width: 32px; }

.image-fmcs_outofspec_24 { background-position: -16px -64px; height: 24px; width: 24px; }

.image-fmcs_outofspec_32 { background-position: -208px -88px; height: 32px; width: 32px; }

.image-help_16 { background-position: -208px -16px; height: 16px; width: 16px; }

.image-i_16 { background-position: -192px -16px; height: 16px; width: 16px; }
.image-i_16:hover, .image-i_16.i_16-hover { background-position: -224px 0; }

.image-i_24, .group .param .tooltip, #header .param .tooltip, #main .param .tooltip { background-position: -64px -64px; height: 24px; width: 24px; }
.image-i_24:hover, .group .param .tooltip:hover, #header .param .tooltip:hover, #main .param .tooltip:hover, .image-i_24.i_24-hover, .group .param .i_24-hover.tooltip, .group .param .tooltip:hover, #header .param .i_24-hover.tooltip, #header .param .tooltip:hover, #main .param .i_24-hover.tooltip, #main .param .tooltip:hover { background-position: 0 -150px; }

.image-limit { background-position: -192px 0; height: 16px; width: 16px; }

.image-limit_gradient_falling { background-position: -176px 0; height: 16px; width: 16px; }

.image-limit_gradient_rising { background-position: -160px 0; height: 16px; width: 16px; }

.image-limit_lower { background-position: -128px 0; height: 16px; width: 16px; }

.image-limit_upper { background-position: -96px 0; height: 16px; width: 16px; }

.image-locked_16 { background-position: -80px 0; height: 16px; width: 16px; }

.image-locked_24 { background-position: -88px -40px; height: 24px; width: 24px; }

.image-locked_24_black { background-position: -112px -40px; height: 24px; width: 24px; }

.image-locked_24_blue { background-position: -136px -40px; height: 24px; width: 24px; }

.image-measurement_24 { background-position: -160px -40px; height: 24px; width: 24px; }

.image-menu-icon, #menu-main-icon:hover { background-position: -112px -88px; height: 32px; width: 32px; }

.image-menu-icon_black, #menu-main-icon { background-position: -80px -88px; height: 32px; width: 32px; }

.image-orsg35 { background-position: -164px -278px; height: 76px; width: 75px; }

.image-orsg45 { background-position: 0 -278px; height: 75px; width: 89px; }

.image-pdf_24 { background-position: -208px -64px; height: 24px; width: 24px; }

.image-pdf_24_blue { background-position: -232px -64px; height: 24px; width: 24px; }

.image-rb_checked_16, body.modern input[type=radio].checked + label:before { background-position: -24px -40px; height: 16px; width: 16px; }

.image-rb_checked_hover_16, body.modern input[type=radio].checked + label:hover:before { background-position: -48px -16px; height: 16px; width: 16px; }

.image-rb_unchecked_16, body.modern input[type=radio] + label:before { background-position: -144px -16px; height: 16px; width: 16px; }

.image-rb_unchecked_hover_16, body.modern input[type=radio] + label:hover:before { background-position: -176px -16px; height: 16px; width: 16px; }

.image-refresh_16 { background-position: 0 0; height: 16px; width: 16px; }

.image-rsg35 { background-position: -89px -278px; height: 76px; width: 75px; }

.image-rsg45 { background-position: 0 -354px; height: 75px; width: 89px; }

.image-rtf_24 { background-position: -112px -64px; height: 24px; width: 24px; }

.image-rtf_24_blue { background-position: -40px -64px; height: 24px; width: 24px; }

.image-rtf_64 { background-position: -56px -150px; height: 64px; width: 64px; }

.image-rtf_64_blue { background-position: -128px -214px; height: 64px; width: 64px; }

.image-save_16 { background-position: -208px 0; height: 16px; width: 16px; }

.image-save_24 { background-position: -136px -64px; height: 24px; width: 24px; }

.image-search_16 { background-position: -144px 0; height: 16px; width: 16px; }

.image-select_16, #menu a.submenu:after { background-position: 0 -88px; height: 16px; width: 24px; }

.image-select_16_disabled { background-position: 0 -40px; height: 16px; width: 24px; }

.image-submenu_16 { background-position: 0 -64px; height: 16px; width: 16px; }

.image-submenu_24 { background-position: -184px -40px; height: 24px; width: 24px; }

.image-tabcontrol_16 { background-position: -160px -16px; height: 16px; width: 16px; }

.image-under_construction_64 { background-position: -64px -214px; height: 64px; width: 64px; }

#disableInput { /* Do not display it on entry */ display: none; /* Display it on the layer with index 1001. Make sure this is the highest z-index value used by layers on that page */ z-index: 1001; /* make it cover the whole screen */ position: absolute; top: 0%; left: 0%; width: 100%; height: 100%; /* make it white but fully transparent */ background-color: #FFFFFF; opacity: .50; filter: alpha(opacity=0); }

#loadimage { position: fixed; top: 50%; left: 30%; height: 50px; width: 50px; }

/*----------------------------------------------------------------------------------------
// -base.scss
//
// A Base rule is applied to an element using an element selector, a descendent selector,
// or a child selector, along with any pseudoclasses.
// It doesnÆt include any class or ID selectors. It is defining the default styling for
// how that element should look in all occurrences on the page.
----------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------
// -size.scss
//
// enthõlt allgemeine Gr÷▀enangaben
*/
/* colors.scss
*/
/*----------------------------------------------------------------------------------------
//  _fonts.scss
//
// dieses CSS enthõlt alle im StyleTiles 025 definierten Schriftelemente
----------------------------------------------------------------------------------------*/
h1, .caption { font-family: 'E+H Serif', 'Times New Roman', Times, serif; }

h2 { font-family: 'E+H Sans',  Arial, Helvetica, sans-serif; font-weight: bold; }

#menu a, #breadcrumb, .measurement, .group .param, .group .param .errortext, #FormelEditor, .clFormelEditor .errortext, #header .param, #header .param .errortext, #main .param, #main .param .errortext, #main .table .row, .button, .group .param .tooltip:hover:after, #header .param .tooltip:hover:after, #main .param .tooltip:hover:after, #header li.param { font-family: 'E+H Sans',  Arial, Helvetica, sans-serif; font-weight: normal; }

.measurement .label, h3, .measurement .value { font-family: 'E+H Sans',  Arial, Helvetica, sans-serif; font-weight: bold; }

/*
%meta-navigation { @extend      %fontfamily-sans-light; font-size  : $fontsize-standard; color      : $antrazit;
 &:active   { color : $cyan3; }
}
*/
#menu a, #breadcrumb { font-size: 16px; }
#menu a a, #breadcrumb a { color: #a8005c; }
#menu a a:hover, #breadcrumb a:hover { color: #007caa; }
#menu a li:after, #breadcrumb li:after { color: #8fa2ac; }
#menu a li:last-child a, #breadcrumb li:last-child a { font-weight: bold; color: #007caa; }
#menu a li:last-child, #breadcrumb li:last-child { font-weight: bold; color: #007caa; }

/*
// Prozesse, Sequenzen
%process { @extend      %fontfamily-sans-bold; font-size  : $fontsize-standard; color      : $white;
 &:inactive   { color : $wintergrau4; }
}
*/
/*
// Men³, Tabs
%tab { @extend      %fontfamily-sans-bold; font-size  : $fontsize-standard; a { color  :$white;
 &:hover { background-color : $cyan3; }
 .disabled { color            : $wintergrau3; background-color : $wintergrau1; } }
}
*/
.measurement .label { font-size: 18px; color: #333333; }

.measurement, .group .param, .group .param .errortext, #FormelEditor, .clFormelEditor .errortext, #header .param, #header .param .errortext, #main .param, #main .param .errortext, #main .table .row { font-size: 16px; color: #333333; }

.button { font-size: 16px; background-color: #8fa2ac; color: white; }
.button:hover { background-color: #007caa; }
.button .disabled { color: #8fa2ac; background-color: #e6ecf0; }

h1 { font-size: 52px; color: #333333; }

h2 { font-size: 36px; color: #333333; }

h3 { font-size: 20px; color: #333333; }

.caption { font-size: 28px; color: #007caa; }

/*
%legend { @extend      %fontfamily-sans-light; font-size  : $fontsize-appdescription; color      : $antrazit;
}
*/
.measurement .value { font-size: 80px; color: #333333; font-weight: bold; }

.group .param .tooltip:hover:after, #header .param .tooltip:hover:after, #main .param .tooltip:hover:after { font-size: 15px; line-height: 24px; color: white; }

#header li.param { font-size: 15px; }

body { margin: 0 8px; display: block; }

html { font-size: 16px; }

h2 { padding-top: 20px; padding-bottom: 20px; }

h3 { padding-top: 20px; padding-bottom: 20px; }

p { margin: 8px; line-height: 20px; padding-bottom: 0; width: 100%; clear: both; }

a { text-decoration: none; }

ul { float: left; }

ul, li { list-style: none; }

p { margin: 8px; }

.hidden { display: none; padding: 0; margin: 0; }

.img { border: none; float: left; }

/* lines.scss
*/
/*----------------------------------------------------------------------------------------
//  _inputs.scss
//
// enthõlt alle Eingabeelemente (ohne Label, ...)
// - Text einzeilig
// - Text mehrzeilig
// - Zahlen
// - Passwort
// - Auswahlliste (Combobox)
// - Auswahlliste (Radiobutton)
// - Mehrfachauswahlliste (Checkboxes)
----------------------------------------------------------------------------------------*/
input, textarea, select, .et4 form { border: 1px solid #c3ced5; padding: 8px; cursor: auto; background: white; width: 240px; }
input:focus, textarea:focus, select:focus, .et4 form:focus { outline: none; border: 1px solid #007caa; }
input[disabled], textarea[disabled], select[disabled], .et4 form[disabled] { color: #8fa2ac; }

body.old input[type="radio"], body.old input[type="checkbox"] { border: none; padding: 0; width: auto; margin-right: 8px; }

input[type=text].numedit { text-align: right; }

input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }

input.number { text-align: right; }

input[type=file] { height: 20px; padding: 4px; line-height: 20px; width: 480px; position: fixed; left: 110%; top: 110%; /*
&::-webkit-file-upload-button { width   : 0; padding : 0; margin  : 0; -webkit-appearance: none; border: none;
} */ }

form input[type=hidden] + input[type=file] { height: 28px; width: 240px; padding: 4px; position: inherit; }

/*
input[type=file]:after { content     : "..."; margin-left : $margin; float       : left; left        : 100%; position    : relative; padding     : $margin-small; height      : $linepitch; width       : $linepitch; margin-top  : -$margin-small;
	text-align  : center;
 &:hover { background-color : $cyan3; }
}
*/
input[type=button], input[type=submit] { width: auto; background-color: #a8005c; color: white; padding-left: 4px; padding-right: 4px; }

body.modern input[type=checkbox], body.modern input[type=radio] { display: none; position: absolute; clip: rect(0, 0, 0, 0); }
body.modern input[type=checkbox] + label, body.modern input[type=radio] + label { padding-left: 32px; margin-left: 8px; background-position: left center; width: 16px; height: 16px; }
body.modern input[type=radio] + label { padding-left: 0 !important; }
body.modern input[type=radio] + label:before { content: ""; display: inline-block; width: 16px; height: 16px; overflow: hidden; margin-top: 6px; margin-right: 8px; }
body.modern input[type=checkbox] + label { padding-left: 0 !important; }
body.modern input[type=checkbox] + label:before { content: ""; display: inline-block; width: 16px; height: 16px; overflow: hidden; margin-top: 6px; margin-right: 8px; }

textarea { resize: none; overflow: auto; height: 5em; line-height: normal; }

select { /* -webkit-appearance : none; -moz-appearance    : none; appearance         : none; padding            : 0; //@extend .image-select_16; background         : url(../images/select_16.png) no-repeat right; background-position: right center; height             : 36px;   // H÷he input + 2 * $margin;*/ width: 258px; /* &[disabled] { //@extend .image-select_16_disabled; background     : url(../images/select_16_disabled.png) no-repeat right; }
 + div.selector { position: absolute; }
*/ }
select:focus { outline: none; }

.progressbar { display: block; border: 1px solid #c3ced5; padding: 1px; text-align: center; height: 32px; width: 20em; position: relative; }

.progressbar-value { display: block; width: 33%; height: 100%; background-color: #007caa; padding: 0; }

/*----------------------------------------------------------------------------------------
//  _captions.scss
//
// enthõlt ▄berschriftenelemente
----------------------------------------------------------------------------------------*/
.caption { width: 100%; clear: both; padding: 4px 4px; margin: 8px; }
.caption .img { margin-right: 8px; }

/*----------------------------------------------------------------------------------------
//  _buttons.scss
//
// beschreibt den Aufbau aller Tastenelemente
//
// - Es gibt folgende Tastentypen
//   + standard = dunkelgrau mit wei▀er Schrift
//   + special  = mangenta mit wei▀er Schrift
//   + small    = wie Standard nur gleiche Breite wie H÷he
//   + submenu  = wie Standard nur mit Grafik f³r Untermen³s ">"
//
// - Die Tasten k÷nnen neben den Standardmodus noch folgende Eigenschaften annehmen
//   + selected = hervorgehobene Taste (wird derzeit nicht verwendet)
//   + disabled = Taste wird angezeigt, kann jedoch nicht angeklickt werden.
----------------------------------------------------------------------------------------*/
.button-list { float: none !important; clear: both; margin-top: 8px; }
.button-list > a { float: left; display: block; /* &:first-child + a + a + a + a { clear : left; } &:first-child + a + a + a + a + a + a + a + a { clear : left; } &:first-child + a + a + a + a + a + a + a + a + a + a + a + a { clear : left; } &:first-child + a + a + a + a + a + a + a + a + a + a + a + a + a + a + a + a { clear : left; } &:first-child + a + a + a + a + a + a + a + a + a + a + a + a + a + a + a + a + a + a + a + a { clear : left; }
*/ }
.button-list > a:nth-child(3n+1) { clear: left; }
.button-list > a.button.small { clear: none; float: left; display: block; /* &:first-child + a.button.small + a.button.small + a.button.small + a.button.small + a.button.small + a.button.small + a.button.small + a.button.small { clear : left; } &:first-child + a.button.small + a.button.small + a.button.small + a.button.small + a.button.small + a.button.small + a.button.small + a.button.small + a.button.small + a.button.small + a.button.small + a.button.small + a.button.small + a.button.small + a.button.small + a.button.small { clear : left; } &:first-child + a.button.small + a.button.small + a.button.small + a.button.small + a.button.small + a.button.small + a.button.small + a.button.small + a.button.small + a.button.small + a.button.small + a.button.small + a.button.small + a.button.small + a.button.small + a.button.small + a.button.small + a.button.small + a.button.small + a.button.small + a.button.small + a.button.small + a.button.small + a.button.small { clear : left; }
*/ }
.button-list > a.button.small:nth-child(6n+1) { clear: left; }

.button { display: block; text-align: center; margin: 4px; width: 240px; color: white; padding: 4px 8px; float: left; line-height: 32px; height: 32px; }
.button:focus, .button:hover { background-color: #007caa; }
.button.small { width: 32px; }
.button.special { background-color: #a8005c; }
.button.special:focus, .button.special:hover { background-color: #007caa; }
.button div.img { margin-top: 8px; }
.button[selected] { background: #007caa; }
.button[disabled] { background-color: #e6ecf0; color: #8fa2ac; }
.button[disabled]:hover { background-color: #e6ecf0; }

/*----------------------------------------------------------------------------------------
//  _boxes.scss
//
// Anzeige von Pseudo Popup Fenstern z.B. Hilfetext, Fehlermeldung bei der Parametrierung
----------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------
//  _parameter.scss
//
// Setzt die verschiedenen Elemente eines Parameters zusammen:
// - label
//   + Tooltip
// - Bitmap
// - Input (select, input, ..)
// - Unit
// - Bitmap2
// - Applybutton (wird von JS hinzugef³gt)
----------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------
//  _header.scss
//
// Formatierung der 5 Spalten:
// - 1. Spalte   : Gerõtesymbol (Pflicht)
// - 2. Spalte   : Gerõteinformationen (Name, Bezeichnung, Status) (Pflicht)
// - 3./4. Spalte: Messwerte (optional)
// - 5. Spalte   : E+H Logo
----------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------
//  _menus.scss
//
// - Aufbau des Men³s
----------------------------------------------------------------------------------------*/
#menu { clear: both; padding-top: 8px; }
#menu ul li div { display: block; float: left; }
#menu a { padding: 8px; margin: 0 8px; background-color: white; color: #333333; margin-right: 32px; }
#menu a:first-child { padding-left: 0; }
#menu a:last-child { padding-right: 0; }
#menu a:hover { color: #007caa; }
#menu a.submenu:after { content: " "; display: inline-block; width: 16px; height: 16px; overflow: hidden; margin-left: 8px; }
#menu ul { z-index: 100; border-bottom: 2px solid #007caa; border-top: 2px solid #c3ced5; padding-top: 4px; margin: 0; width: 100%; display: block; float: left; }
#menu ul li { line-height: 40px; float: left; vertical-align: middle; }
#menu ul li ul { display: none; width: auto; position: absolute; border: 1px solid #c3ced5; background-color: white; }
#menu ul li ul li { margin: 4px 8px; float: none; }
#menu ul li ul li a { margin-right: 8px; }
#menu ul li ul a:after { content: none; }
#menu ul li:hover ul { position: absolute; }
#menu ul li:hover li { float: none; }
#menu ul:empty { border-top: 0px none white; }
#menu .button-align-right { float: right; padding-right: 8px; }
#menu .button-align-right a { margin-right: 8px; padding-right: 0; }
#menu .button-special a { background-color: #a8005c; color: white; padding-left: 32px; padding-right: 32px; display: block; margin-right: 0; }
#menu *[disabled] { color: #8fa2ac; }
#menu *[disabled]:hover { color: #8fa2ac; }
#menu li.submenu a { margin-right: 4px; }
#menu li.submenu div.img { display: block; float: right; margin-left: 8px; }
#menu #m-0 { visibility: hidden; height: 0; }
#menu #nav-main { float: left; }
#menu ul { z-index: 200; }

#menu-main-icon { cursor: pointer; display: none; }
#menu-main-icon:hover { background-color: #007caa; }

#menu ul li { margin-bottom: 4px; }
#menu ul li a { display: block; line-height: 18px; }
#menu ul li div.img { margin: 0; padding: 0; display: none; }
#menu ul li div.img.image-locked_24_black, #menu ul li div.img.image-locked_24_blue { display: block; position: relative; top: -4px; margin-right: 4px; }

#nav-main:before { content: ""; clear: both; float: left; }

#menu.sandwich { border-bottom: 2px solid #007caa; border-top: 2px solid #c3ced5; padding-top: 2px; margin-top: 138px; }
#menu.sandwich #id-menu-main { position: relative; }
#menu.sandwich #id-menu-main ul { display: none; }
#menu.sandwich #menu-main-icon { display: block; }
#menu.sandwich #id-menu-main #nav-main { width: auto; }
#menu.sandwich #id-menu-main ul { border: 1px solid #c3ced5; position: absolute; display: none; background-color: white; }
#menu.sandwich #id-menu-main ul li { clear: left; float: left; width: 240px; height: auto !important; margin: 0; }
#menu.sandwich #id-menu-main ul li a { padding: 12px 8px; margin: 0; height: auto; }
#menu.sandwich #id-menu-main ul li ul { position: absolute; float: left; margin-left: 232px; width: auto; margin-top: -32px; }
#menu.sandwich #id-menu-main .button-align-right { float: left; }
#menu.sandwich #id-menu-main .button-special a { color: white; background-color: #a8005c; }
#menu.sandwich #nav-main { display: none; clear: both; position: absolute; width: auto; z-index: 100; }
#menu.sandwich #nav-main ul { width: auto; position: static; }
#menu.sandwich #nav-main li { clear: both; float: none; }
#menu.sandwich #nav-main #nav-main { display: block !important; }

/*----------------------------------------------------------------------------------------
//  _breadcrumb.scss
//
// enthõlt die Breadcrumbelemente
// die Breadcrumb wird in 2 Teile aufgeteilt:
// - thebreadcrumb  : die eigentliche Breadcrumb
// - breadcrumbaddon: dieser Bereich kann zusõtzliche einfache Elemente enthalten: z.B.
//   + Eingabefelder
//   + Tasten
----------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------
//  _sequence.scss
//
// - eine Sequence kann x-Schritte enthalten.
// - Jeder Schritt kann den folgenden Status haben
//   + finished = bereits erledigte Schritt
//   + selected = aktuell in Bearbeitung
//   + inactive = noch nicht ausgef³hrt
//
// - Schritte sind reine Darstellungselemente. Sie haben keinerlei Funktion, wie z.B.
//   eine Taste
----------------------------------------------------------------------------------------*/
.sequence ul { display: block; float: left; }
.sequence li { line-height: 40px; float: left; vertical-align: middle; height: 40px; width: auto; text-align: center; padding: 0 20px; margin-right: 10px; padding: 0 20px; display: block; }
.sequence li div { display: block; float: left; }
.sequence li .button { width: auto; float: left; }
.sequence li:before { content: ""; position: relative; float: left; top: 0%; border-width: 20px 0 20px 20px; border-style: solid; border-color: #8fa2ac #8fa2ac #8fa2ac white; left: -40px; z-index: 105; }
.sequence li:after { content: ""; float: right; position: relative; top: 0%; border-width: 20px 0 20px 20px; border-style: solid; border-color: white #8fa2ac white #8fa2ac; left: 24px; z-index: 100; }
.sequence li:first-child:before { border-width: 0; }
.sequence li[finished], .sequence li[finished]:hover { background-color: #8fa2ac; }
.sequence li[finished]:before, .sequence li[finished]:hover:before { border-color: #8fa2ac #8fa2ac #8fa2ac transparent; }
.sequence li[finished]:after, .sequence li[finished]:hover:after { border-color: white #8fa2ac white #8fa2ac; }
.sequence li[selected], .sequence li[selected]:hover { background-color: #007caa; }
.sequence li[selected]:before, .sequence li[selected]:hover:before { border-color: #007caa #007caa #007caa transparent; }
.sequence li[selected]:after, .sequence li[selected]:hover:after { border-color: white #007caa white #007caa; }
.sequence li[inactive], .sequence li[inactive]:hover { background-color: #e6ecf0; color: #8fa2ac; }
.sequence li[inactive]:before, .sequence li[inactive]:hover:before { border-color: #e6ecf0 #e6ecf0 #e6ecf0 transparent; }
.sequence li[inactive]:after, .sequence li[inactive]:hover:after { border-color: white #e6ecf0 white #e6ecf0; }

/*----------------------------------------------------------------------------------------
//  _table.scss
//
// - Tabellenhandling analog zu <table> <th> <tr> <td>
----------------------------------------------------------------------------------------*/
.hidden { display: none; height: 0; width: 0; }

/*
.spanned { width    : 100%; clear    : both;
//        position : absolute; }
*/
/* .sublabel { @extend       %font-sublabel; font-weight : bold; }
*/
li.cell { width: 70em; }
li.cell.size_2 { width: 2em; }
li.cell.size_3 { width: 3em; }
li.cell.size_4 { width: 4em; }
li.cell.size_5 { width: 5em; }
li.cell.size_6 { width: 6em; }
li.cell.size_8 { width: 8em; }
li.cell.size_10 { width: 10em; }
li.cell.size_12 { width: 12em; }
li.cell.size_14 { width: 14em; }
li.cell.size_16 { width: 16em; }
li.cell.size_18 { width: 18em; }
li.cell.size_20 { width: 20em; }
li.cell.size_24 { width: 24em; }
li.cell.size_28 { width: 28em; }
li.cell.size_32 { width: 32em; }
li.cell.size_36 { width: 36em; }
li.cell.size_40 { width: 40em; }
li.cell.size_46 { width: 46em; }
li.cell.size_52 { width: 52em; }
li.cell.size_58 { width: 58em; }
li.cell.size_64 { width: 64em; }
li.cell.size_70 { width: 70em; }

/*----------------------------------------------------------------------------------------
//  _measurement.scss
//
// - measurement ist eine Gruppe. Diese Gruppe kann folgende Elemente enthalten:
//   label, status, value, unit und image
// - zusõtzlich k÷nnen die Elemente label und status durch error um eine Farbõnderung
//   ergõnzt werden (z.B. Hintergrund- oder Textfarbe rot
// - wird class="ihs" angegeben, handelt es sich um eine besondere Erweiterung
//   (Instrument health status) des measurement.

----------------------------------------------------------------------------------------*/
.measurement { width: 480px; position: absolute; color: #333333; background-color: #e6ecf0; border: 1px solid #c3ced5; max-width: 30em; padding: 1em; line-height: 1.5em; margin-top: 0; margin-left: 4px; left: 0; box-shadow: 8px 8px 8px #333333; position: relative; float: left; margin: 8px 8px 4px 4px; box-shadow: none; padding: 4px; height: 112px; }
.measurement a { color: #333333; }
.measurement > * { padding: 4px; float: left; }
.measurement .label { background-color: transparent; }
.measurement .unit { float: right; }
.measurement .value { clear: both; float: right; position: relative; text-align: right; margin-top: 24px; margin-bottom: 24px; }
.measurement[error="true"] .label { background-color: #d50c2f; color: white; }
.measurement[error="true"] .status, .measurement[error="true"] .status * { color: #d50c2f; }
.measurement.ihs { height: auto; margin-bottom: 100%; background-color: #55a930; }
.measurement.ihs * { color: white; }
.measurement.ihs[error="true"] { background-color: #d50c2f; /*
* { color : $rotorange3;
}
.label { color : $white;
}
*/ /* .unit * { color : $antrazit; }
*/ }

@media screen and (max-width: 1056px) { .measurement.ihs { margin-bottom: 4px; } }
@media screen and (max-width: 528px) { .measurement { width: 97.5%; } }
/*----------------------------------------------------------------------------------------
//  _messagebox.scss
//
// enthõlt die Breadcrumbelemente
// die Breadcrumb wird in 2 Teile aufgeteilt:
// - thebreadcrumb  : die eigentliche Breadcrumb
// - breadcrumbaddon: dieser Bereich kann zusõtzliche einfache Elemente enthalten: z.B.
//   + Eingabefelder
//   + Tasten
----------------------------------------------------------------------------------------*/
#messagebox { position: fixed !important; top: 0; right: 0; bottom: 0; left: 0; z-index: 50000; background-color: gray; background-color: rgba(0, 0, 0, 0.5);     /* ul li div, div { display : block; }

	.modaldialog {
		position  : fixed;
		top       : 0;
		right     : 0;
		bottom    : 0;
		left      : 0;
		background: rgba(0,0,0,0.5);
		z-index   : 99999;
		opacity   : 0;
		pointer-events    : none; -webkit-transition: opacity 500ms ease-in;
		-moz-transition   : opacity 500ms ease-in;
		transition        : opacity 500ms ease-in;
 	&:target { 		opacity       : 1; 		pointer-events: auto; 	} }

	.modaldialog ul {
	    @extend     %font-tooltip;
		max-width : 40em; width     : 40em; padding   : 0; margin    : 0;
		position  : absolute; left      : 25%; top       : 25%;
		background: $white; border    : $borderstyle; height    : auto; display   : block; color     : $antrazit;
 div.button-list { float         : right; padding-right : 0; .button { width   : auto; padding : 0 $padding; } }
 li { &.caption { margin-top : 0; div { padding : 0 $margin; } }
 &.text p { padding : 0 $margin; }
 &.param { padding-left : $margin;
 .button-list { padding-right : $margin; } } }
	} */ }
#messagebox .modaldialog { box-sizing: border-box; margin: 40px auto 0 auto; border: 1px solid black; padding: 20px; width: 50%; overflow: hidden; background-color: white; }

/*----------------------------------------------------------------------------------------
//  _tabcontrol.scss
//
// Bei der Tabcontrol(Karteikarten) werden mehrere Tasten nebeneinander angezeigt.
//
/// Die Tastentypen und Eigenschaften entsprechen denen der Tasten  (siehe _buttons.scss)
// - Es gibt folgende Tastentypen
//   + standard = dunkelgrau mit wei▀er Schrift
//   + special  = mangenta mit wei▀er Schrift
//   + small    = wie Standard nur gleiche Breite wie H÷he
//   + submenu  = wie Standard nur mit Grafik f³r Untermen³s ">"
//
// - Die Tasten k÷nnen neben den Standardmodus noch folgende Eigenschaften annehmen
//   + selected = hervorgehobene Taste (wird derzeit nicht verwendet)
//   + disabled = Taste wird angezeigt, kann jedoch nicht angeklickt werden.
----------------------------------------------------------------------------------------*/
.tab-container { display: block; clear: both; overflow: hidden; }
.tab-container ul { border-bottom: 2px solid #007caa; height: auto; margin: 4px; clear: both; width: 100%; overflow: hidden; }
.tab-container ul > a { display: none; }
.tab-container li { height: auto; }
.tab-container a.button { width: auto; padding: 0 32px; margin: 4px 8px 1px 0; }
.tab-container a.button .img { display: none; }

/*----------------------------------------------------------------------------------------
//  _groupbox.scss
//
// fasst mehrere Elemente zu einer Gruppe zusammen.
----------------------------------------------------------------------------------------*/
.group { width: 605px; }
.group ul { border: 1px solid #c3ced5; padding: 8px; }
.group li { margin: 8px 0; clear: both; }
.group .param.hidden { display: none; }
.group .param { position: relative; display: block; clear: both; padding: 4px 4px; vertical-align: middle; margin: 8px; line-height: 40px; }
.group .param:after { content: "."; clear: both; display: block; visibility: hidden; height: 0px; }
.group .param div { float: left; }
.group .param[disabled], .group .param a[disabled] { color: #8fa2ac; }
.group .param .label, .group .param .input, .group .param .unit, .group .param .bitmap_1, .group .param .bitmap_2, .group .param .applybutton { padding-right: 4px; padding-left: 0; margin-right: 8px; }
.group .param .label { width: 15em; overflow: visible; white-space: nowrap; }
.group .param .applybutton input.button-special { padding-left: 1em; padding-right: 1em; }
.group .param .errortext { position: absolute; color: white; background-color: #d50c2f; border: 1px solid #c3ced5; max-width: 30em; padding: 1em; line-height: 1.5em; margin-top: 40px; margin-left: 4px; left: 17.7em; box-shadow: 8px 8px 8px #333333; z-index: 120; }
.group .param .errortext:before { content: ''; position: absolute; margin-top: -1.5em; left: 0.7em; border-style: solid; border-width: 0 8px 8px 8px; border-color: transparent transparent #d50c2f transparent; }
.group .param .tooltip { display: inline-block; content: ""; margin-top: 8px; margin-right: 8px; }
.group .param .tooltip.hidden { visibility: hidden; }
.group .param .tooltip:hover:before { /*@include boxes_before ($wintergrau2, 1.5em);*/ }
.group .param .tooltip:hover:after { position: absolute; color: #333333; background-color: #e6ecf0; border: 1px solid #c3ced5; max-width: 30em; padding: 1em; line-height: 1.5em; margin-top: 2em; margin-left: 4px; left: 0; box-shadow: 8px 8px 8px #333333; content: attr(tooltip); left: auto; right: 0; top: 0; z-index: 110; }
.group .param.info { color: #333333; }
.group .param.info .input[disabled], .group .param.info .input a[disabled] { color: #333333; background-color: yellow; }
.group .param.info .input select, .group .param.info .input input, .group .param.info .input textarea { color: #333333; border: none; background-color: transparent; }
.group .param.info .input select { background: none; }
.group .param.info .tooltip { visibility: hidden; }
.group .caption { padding: 0; padding-left: 8px; width: auto; }
.group .group-submit.button-list { padding-right: 34px; text-align: right; }
.group .group-submit.button-list .button { width: auto; padding-left: 32px; padding-right: 32px; float: none; display: inline-block; }
.group .group-submit.button-list .button .img { padding: 0; margin: 0; }
.group.group-align-left { margin-left: 12px; }
.group.group-align-right { float: right; }
.group.group-align-center { margin: 0 auto; }

#remote_ctrl_screenshot div.input, #hidden_remote_ctrl_screenshot { width: 640px; height: 480px; border: 1px; background: lightgray; }

#grayout { z-index: 9999; background: rgba(0, 0, 0, 0.7); position: fixed; top: 0; left: 0; width: 100%; height: 100%; }

#FormelEditor { top: 15em; left: 5em; position: absolute; border: 1px solid #c3ced5; background-color: #e6ecf0; padding: 0; margin: 0; z-index: 10000; }
#FormelEditor input[type=button] { color: white; background-color: #8fa2ac; }
#FormelEditor input[type=button]:focus, #FormelEditor input[type=button]:hover { background-color: #007caa; }
#FormelEditor input[type=button].special { background-color: #a8005c; }
#FormelEditor .clButton_Func, #FormelEditor .clButton_Operation, #FormelEditor .clButton_Numb, #FormelEditor .clButton_Eing, #FormelEditor .clButton_Controls, #FormelEditor .clAccept { margin: 4px; }
#FormelEditor .clButton_Operation, #FormelEditor .clButton_Numb { width: 2.5em; }
#FormelEditor .clButton_Func { width: 3.5em; }
#FormelEditor .clButton_Controls { width: 8em; }
#FormelEditor .clButton_Eing { width: 6em; }

.clFormelEditor { box-sizing: border-box; -moz-box-sizing: border-box; }
.clFormelEditor div { margin: 4px; padding: 4px; display: block; clear: both; }
.clFormelEditor td { vertical-align: top; }
.clFormelEditor textarea { background-color: white; margin: 0 4px; width: 44.5em; height: 5em; }
.clFormelEditor .hidden { display: none; }
.clFormelEditor .clTable_Popert { border: 1px solid #c3ced5; background-color: white; height: 18em; }
.clFormelEditor .clArea_Input, .clFormelEditor .clTable_Command, .clFormelEditor .clExtraWin, .clFormelEditor .clArea_Submit { margin-top: 0; margin-bottom: 0; display: block; clear: both; }
.clFormelEditor .clArea_Submit { padding: 0; }
.clFormelEditor .clTable_Controls { float: right; margin-bottom: 8px; margin-right: 4px; }
.clFormelEditor .clTable_Controls tbody input[type=button] { margin-left: 8px; margin-bottom: 8px; }
.clFormelEditor .clTable_Controls tbody input[type=button] .special { background-color: #a8005c; }
.clFormelEditor .errortext { position: absolute; color: white; background-color: #d50c2f; border: 1px solid #c3ced5; max-width: 30em; padding: 1em; line-height: 1.5em; margin-top: -4em; margin-left: 4px; left: 0; box-shadow: 8px 8px 8px #333333; z-index: 120; width: auto; height: auto; left: 2em; }
.clFormelEditor .errortext:before { content: ''; position: absolute; margin-top: -1.5em; left: 0.7em; border-style: solid; border-width: 0 8px 8px 8px; border-color: transparent transparent #d50c2f transparent; }
.clFormelEditor .clRadio_B { padding-top: 8px; padding-bottom: 10px; }
.clFormelEditor #idTable_STD, .clFormelEditor #idTable_LOGV, .clFormelEditor #idTable_ERW { margin: 0; padding: 0; }
.clFormelEditor .clTable_Title { margin: 8px; display: block; font-weight: bold; }
.clFormelEditor .clTable_Func { width: 20em; }
.clFormelEditor .clTable_Operation { width: 6em; }
.clFormelEditor .clTable_Numb { width: 9em; }
.clFormelEditor .clTable_Signals { width: 45em; }
.clFormelEditor .clTable_Signals ul { float: left; }
.clFormelEditor .clTable_Signals ul .label { float: left; width: 7.5em; margin-top: 16px; }
.clFormelEditor .clTable_Signals ul .input { float: left; clear: none; }
.clFormelEditor .clTable_Signals_Controls { margin-left: 2.75em; height: 100%; }
.clFormelEditor .clTable_Signals_Controls li { margin: 8px; margin-right: 0; }

@media screen and (max-width: 55em) { #FormelEditor { left: 8px; } }
#header, #menu, #main, #breadcrumb, #messagebox { position: relative; }

#header, #menu, #breadcrumb { margin-right: 12px; }

.content div.sticky { position: fixed; height: 15em; width: 100%; background-color: white; z-index: 900; }

li.et7.param div.img a { height: 100%; display: block; }

#header {     /* // Alter Header mit Spalten .col { float            : left; margin           : $margin-small; margin-right     : $margin; // Abstand zwischen den Spalten etwas vergr÷▀ern padding          : $margin; display          : table-cell; }
 .col:first-child { width            : auto; padding          : 0; border           : none; background-color : transparent; }
 .col:last-child { float            : right; width            : auto; margin-right     : $margin-small; // rechte Spalte mit Standardabstand zum rechten Rand anzeigen padding          : 0; border           : none; background-color : transparent; }
 .col:nth-child(2) { //border-right : 1px solid $wintergrau2; }
 .col:nth-child(3) { //border-right : 1px solid $wintergrau2; } */ }
#header .param.hidden { display: none; }
#header .param { position: relative; display: block; clear: both; padding: 4px 4px; vertical-align: middle; margin: 8px; line-height: 40px; }
#header .param:after { content: "."; clear: both; display: block; visibility: hidden; height: 0px; }
#header .param div { float: left; }
#header .param[disabled], #header .param a[disabled] { color: #8fa2ac; }
#header .param .label, #header .param .input, #header .param .unit, #header .param .bitmap_1, #header .param .bitmap_2, #header .param .applybutton { padding-right: 4px; padding-left: 0; margin-right: 8px; }
#header .param .label { width: 15em; overflow: visible; white-space: nowrap; }
#header .param .applybutton input.button-special { padding-left: 1em; padding-right: 1em; }
#header .param .errortext { position: absolute; color: white; background-color: #d50c2f; border: 1px solid #c3ced5; max-width: 30em; padding: 1em; line-height: 1.5em; margin-top: 40px; margin-left: 4px; left: 17.7em; box-shadow: 8px 8px 8px #333333; z-index: 120; }
#header .param .errortext:before { content: ''; position: absolute; margin-top: -1.5em; left: 0.7em; border-style: solid; border-width: 0 8px 8px 8px; border-color: transparent transparent #d50c2f transparent; }
#header .param .tooltip { display: inline-block; content: ""; margin-top: 8px; margin-right: 8px; }
#header .param .tooltip.hidden { visibility: hidden; }
#header .param .tooltip:hover:before { /*@include boxes_before ($wintergrau2, 1.5em);*/ }
#header .param .tooltip:hover:after { position: absolute; color: #333333; background-color: #e6ecf0; border: 1px solid #c3ced5; max-width: 30em; padding: 1em; line-height: 1.5em; margin-top: 2em; margin-left: 4px; left: 0; box-shadow: 8px 8px 8px #333333; content: attr(tooltip); left: auto; right: 0; top: 0; z-index: 110; }
#header .param.info { color: #333333; }
#header .param.info .input[disabled], #header .param.info .input a[disabled] { color: #333333; background-color: yellow; }
#header .param.info .input select, #header .param.info .input input, #header .param.info .input textarea { color: #333333; border: none; background-color: transparent; }
#header .param.info .input select { background: none; }
#header .param.info .tooltip { visibility: hidden; }
#header .info .column:first-child .bitmap_1 { width: 24px !important; margin-left: 0px !important; margin-right: -4px !important; }
#header .info .column:first-child + .column .bitmap_1 { display: none; }
#header .info .column:first-child + .column + .column .bitmap_1 { display: none; }
#header .device { float: absolute; top: 4px; left: 4px; }
#header .logo { position: absolute; top: 4px; right: 4px; }
#header .info { margin: 0 260px 0 100px; }
#header .info > div { float: left; box-sizing: border-box; padding-left: 8px; margin-left: 8px; }
#header .info > div:first-child + div + div ul { border: none; }
#header .info .input input { margin-top: 2px; }
#header .param .tooltip { display: none; }
#header .bitmap_2 { display: none; }
#header li.param { padding: 0; margin: 0; }
#header li.param .label, #header li.param .input, #header li.param .unit, #header li.param .bitmap_1, #header li.param .bitmap_2 { padding: 0; margin: 0 4px 0 0; height: auto; width: auto; float: left; }
#header li.param .label { width: 9em; }
#header li.param .label:after { content: ":"; margin-left: 4px; }
#header li.param .input input { color: #333333; width: 12em; border: none; background-color: transparent; }
#header li.param .img { margin-top: 8px; }
#header li.param .applybutton, #header li.param .errortext { display: none; }
#header li.param[disabled], #header li.param a[disabled] { color: #333333; }

#breadcrumb { padding: 8px 0; clear: both; vertical-align: middle; }
#breadcrumb ul { padding-top: 8px; padding-bottom: 8px; }
#breadcrumb li { float: left; margin: 0 8px; }
#breadcrumb li:after { margin-left: 8px; margin-right: 0; content: ">"; }
#breadcrumb li:last-child:after { content: ""; }

#main { position: absolute; top: 15em; right: 0; bottom: 0; left: 0; overflow-y: scroll; }
#main .param.hidden { display: none; }
#main .param { position: relative; display: block; clear: both; padding: 4px 4px; vertical-align: middle; margin: 8px; line-height: 40px; }
#main .param:after { content: "."; clear: both; display: block; visibility: hidden; height: 0px; }
#main .param div { float: left; }
#main .param[disabled], #main .param a[disabled] { color: #8fa2ac; }
#main .param .label, #main .param .input, #main .param .unit, #main .param .bitmap_1, #main .param .bitmap_2, #main .param .applybutton { padding-right: 4px; padding-left: 0; margin-right: 8px; }
#main .param .label { width: 15em; overflow: visible; white-space: nowrap; }
#main .param .applybutton input.button-special { padding-left: 1em; padding-right: 1em; }
#main .param .errortext { position: absolute; color: white; background-color: #d50c2f; border: 1px solid #c3ced5; max-width: 30em; padding: 1em; line-height: 1.5em; margin-top: 40px; margin-left: 4px; left: 17.7em; box-shadow: 8px 8px 8px #333333; z-index: 120; }
#main .param .errortext:before { content: ''; position: absolute; margin-top: -1.5em; left: 0.7em; border-style: solid; border-width: 0 8px 8px 8px; border-color: transparent transparent #d50c2f transparent; }
#main .param .tooltip { display: inline-block; content: ""; margin-top: 8px; margin-right: 8px; }
#main .param .tooltip.hidden { visibility: hidden; }
#main .param .tooltip:hover:before { /*@include boxes_before ($wintergrau2, 1.5em);*/ }
#main .param .tooltip:hover:after { position: absolute; color: #333333; background-color: #e6ecf0; border: 1px solid #c3ced5; max-width: 30em; padding: 1em; line-height: 1.5em; margin-top: 2em; margin-left: 4px; left: 0; box-shadow: 8px 8px 8px #333333; content: attr(tooltip); left: auto; right: 0; top: 0; z-index: 110; }
#main .param.info { color: #333333; }
#main .param.info .input[disabled], #main .param.info .input a[disabled] { color: #333333; background-color: yellow; }
#main .param.info .input select, #main .param.info .input input, #main .param.info .input textarea { color: #333333; border: none; background-color: transparent; }
#main .param.info .input select { background: none; }
#main .param.info .tooltip { visibility: hidden; }
#main ul { clear: both; width: 98%; }
#main .table { display: table; margin: auto 16px 16px; }
#main .table p { margin: 0; }
#main .table ul { border-bottom: 1px solid #c3ced5; }
#main .table ul:last-child { border-bottom: 0; }
#main .table .row { display: table-row; float: none; }
#main .table .table-head { display: table-header-group; font-weight: bold; float: none; }
#main .table li.cell { display: table-cell; float: none; padding-top: 8px; }

/*
#main > ul { width :100%;
}
*/
/*****************************************************************************************
/ Media Queries                                                                          /
*****************************************************************************************/
@media screen and (max-width: 1134px) { #header .logo { display: none; width: 0; position: relative; }
  #header .info { margin-right: 0; } }
@media screen and (max-width: 869px) { #header .device { display: none; }
  #header .info { margin-left: 0; }
  div.content #main { width: 869px; }
  div.content div.sticky.header, div.content div.sticky.breadcrumb { position: inherit; width: 869px; } }
/*
@media screen and (max-width: ($width_first_col + $width_second_col))
{ #header .info > div.column:nth-child(2) { display :none; }
 .input, .unit, .bitmap_2 { display : inline-block; }
}
*/
.input, .unit, .bitmap_2 { display: inline-block; }

@media screen and (max-width: 960px) { .button-list > a:nth-child(3n+1) { clear: none; } }
@media screen and (max-width: 1920px) { .button-list > a.small:nth-child(6n+1) { clear: none; } }