@media screen, print {

.half-bar       { padding-top:24px; }
.one-bar        { padding-top:66px; }
.two-bars       { padding-top:120px; }

/* ------------ bar ------------------- */
body > .bar     { background:#e9e9e9; border-bottom:1px solid #d9d9d9; font-size:18px; font-weight:400; height:30px; left:0; margin:0; padding:8px 44px 5px; position:fixed; top:0; width:100%; z-index:999; }
body > .bar.off { display:none; }

/* ------------ bar field, knob --------- */
body > .bar select
                { margin:0 12px 0 8px; }
body > .bar .btn:first-child
                { margin-left:-6px;/* offsets padding, 50px -- 44px */ }
body > .bar .dedent/* i.a. toggle main menu area/knob on very left top */
                { background:transparent; color:#d9d9d9; height:30px; left:0; padding:8px 5px 6px 7px; position:absolute; text-align:center; text-decoration:none; top:0; width:18px; }
body > .bar .dedent:hover
                { border-bottom-color:transparent; /* overrides knob default */ }

/* ------------ filter bar -------------- */
body > .bar.filter,
body > .bar + .bar
                { background:#f8f8f8; color:#bababa; border-bottom:4px solid #fbfbfb; border-top:1px solid #d9d9d9; padding:9px 44px 8px; }
body > .bar + .bar
                { top:43px;/* = full height of bar on very top - bottom border thereof */ }
body > .bar.filter select:first-child
                { margin-left:0;/* for proper alignment */ }
body > .bar.filter select.valet
                { width: 170px; }
}
body > .bar.filter #load-type,
body > .bar.filter #therapy_arm_id,
body > .bar.filter select.js-load-type {
    width: 100px !important;
}