/*
 * z-index:
 *
 *  5: *navwrapper blurry borders
 *  8: #page_subheader
 * 10: footer
 * 12: header
 * 15: logo
 * 
 * 
 * 20: tooltips
 */

/* Custom Font */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 400;
    src: url('fonts/open-sans-v15-latin-regular.eot'); /* IE9 Compat Modes */
    src: local('Open Sans Regular'), local('OpenSans-Regular'),
         url('fonts/open-sans-v15-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('fonts/open-sans-v15-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
         url('fonts/open-sans-v15-latin-regular.woff') format('woff'), /* Modern Browsers */
         url('fonts/open-sans-v15-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
         url('fonts/open-sans-v15-latin-regular.svg#OpenSans') format('svg'); /* Legacy iOS */
}


/* general stuff */
html,body,div,span,nav,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,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{ margin: 0; padding: 0; border: 0; outline: 0; vertical-align: baseline; background: transparent; font-family: 'Open Sans', sans-serif; font-size: 100%;}
html{ height: 100%; background-color: #ebebeb; }
body{ text-align: left; height: 100%; font-size: 13px; }
input,textarea{ margin: 0px; border: 1px solid transparent; }

/* everything except footer */
#wrapper{ min-height: 100vh; min-height: 100dvh; padding: 0; margin: 0; }


/* header */
#page_header{ position: absolute; z-index: 12; top: 0; left: 0; background-color: #fff; width: 100%; min-width: 940px; height: 155px; overflow: visible; border-bottom: 2px solid #CCC; }
.page_header_fullscreen{ display: none !important; }
#logo{ position: absolute; top: 30px; left: 0; margin-left: 35px; width: 231px; height: 65px; z-index: 15;}
.logo_fullscreen{ display: none !important; }

/* login box top right */
#loginbox{ position: absolute;  right: 0px; height: 20px; padding: 11px; font-size: 11px; top: 0px;  }
#loginbox a{ text-decoration: none; font-size: 11px; color: #444444; }

/* page header spacers */
#spacer0{ height: 63px; }
#spacer1{ height: 30px; width: 295px; float: left; }
#spacer2{ height: 30px; width: 285px; float: left; }

/* Navigation */
#pagenavwrapper,#tabnavwrapper{ overflow: hidden; height: 47px; position: relative; }
#pagenavwrapper:before,#pagenavwrapper:after,#tabnavwrapper:before,#tabnavwrapper:after{ z-index: 5; pointer-events:none; content:''; position:absolute; top:0; width:20px; }
#pagenavwrapper:before{ left:0; height:100%; box-shadow:inset 20px 0 10px -10px #fff; }
#pagenavwrapper:after{ right:0; height:100%; box-shadow: inset -20px 0 10px -10px #fff; }
#tabnavwrapper:before{ left:0; height:30px; padding-top: 15px; box-shadow:inset 20px 0 10px -10px #fff; }
#tabnavwrapper:after{ right:0; height:30px; padding-top: 15px; box-shadow: inset -20px 0 10px -10px #fff; }

#pagenav{ padding: 12px 0 15px 0px; height: 20px; position: relative; white-space: nowrap; overflow: visible; }
#pagenav a{ text-decoration: none; font-size: 16px; color: #444444; }
#pagenav a.currentPageLink{ font-weight: bold; }
#pagenav span.separator{ padding: 12px 15px 15px; font-size: 16px; }

#tabnav{ padding: 15px 0px 0px 0px; height: 32px; position: relative; white-space: nowrap; overflow: visible; }
#tabnav div{ display: inline-block; position: relative; height: 20px; background-color: #e5e5e5; border: 2px solid #e5e5e5; border-bottom: 0px solid #ccc; padding: 4px 0px; margin-right: 15px; -webkit-border-top-left-radius: 6px; -moz-border-radius-topleft: 6px; border-top-left-radius: 6px; -webkit-border-top-right-radius: 6px; -moz-border-radius-topright: 6px; border-top-right-radius: 6px; }
#tabnav a{ text-decoration: none; color: #444444; padding: 4px 35px; }
#tabnav div.currentTabLink{ background-color: #ebebeb; border-top: 2px solid #ccc; border-left: 2px solid #ccc; border-right: 2px solid #ccc; border-bottom: 2px solid #ebebeb; }
#tabnav a.currentTabLink{ font-weight: bold; }

section{ display: inline-block; min-width: 100%; padding-top: 247px; padding-bottom: 22px; background-color: #ebebeb; }
.section_fullscreen{ padding-top: 60px !important; }

/* Footer */
footer{ width: 100%; height: 22px; bottom: 0px; display: inline-block; position: fixed; z-index: 10; background-color: #FDC300; font-size: 10px; font-weight: normal; color: #fff; line-height: 22px; }
footer>div.data_success{ margin: 0; padding-left: 5px; height: 22px; text-align: left; float: left;  }
footer>a.notify{ display: block; margin: 0; margin-left: 10px; padding-left: 20px; padding-right: 5px; height: 22px; text-align: right; float: right; background-image: url('../images/warning.png'); background-repeat: no-repeat; color: #fff; text-decoration: none; font-weight: bold; }
footer>div.version{ margin: 0; margin-left: 10px; padding-left: 5px; padding-right: 5px; height: 22px; display: block; font-size: 9px; font-weight: normal; color: #fff; text-align: right; float: right; }
footer>div a{ color: #fff; text-decoration: none; }


/* subheader */
#page_subheader{ z-index: 8; position: absolute; top: 157px; bottom: 0; width: 100%; height: 40px; padding-top: 50px; background-color: #ebebeb; }
#page_subheader span.subheader_title{ font-size: 21px; font-weight: bold; color: #444444;  max-width: calc(100dvw - 56px); margin-left: 56px; display: inline-block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.page_subheader_fullscreen{ top: -30px !important; }

.shadowscroll{ box-shadow: 0 -5px 5px 5px #555; }

/* switch */
.switch-container{ display: inline-block; height: 26px; margin-left: 32px; padding: 2px 16px 0 16px; overflow: hidden; }
.switch{ display: inline-block; margin: 0 !important; }
.switch .md-label{ margin-top: -2px; }

@media (max-width: 1640px) {
    .switch-container{ margin-left: 8px; padding: 2px 0 0 8px; }
}

/* Sidebar */
#page_side{ width: 320px; min-height: 200px; float: left; color: #444444; }
#page_side_wide{ width: 420px; min-height: 200px; float: left; color: #444444; }
.page_side_fixed{ position: fixed; top: 60px; }

.page_side_help{ width: 200px; margin: 0px 0px 25px 50px; padding: 15px 20px 15px 0px; float: left; text-align: left; }
.page_side_help p{ margin-bottom: 5px; }

.page_side_wide_help{ width: 300px; margin: 0px 0px 25px 50px; padding: 15px 20px 15px 0px; float: left; text-align: left; }
.page_side_wide_help p{ margin-bottom: 5px; }


/* content area (right of sidebar) */
#page_content{ margin: 0px 20px 20px 320px; padding: 0; overflow: visible; background-color: #F2F2F2; min-height: 100%; min-width: calc(940px - 320px - 20px); }
#page_content_narrow{ margin: 0px 20px 20px 420px; padding: 0; overflow: visible; background-color: #F2F2F2; min-height: 100%; }
.page_content_full_width{ margin-left: 20px !important; }
.content_item{ display: block; background-color: #F2F2F2; padding: 20px; }

/* About page */
.abouttext a{ color: #000; }
.abouttext p{ padding-bottom: 20px; }
.abouttext ul{ list-style-type: none; padding-left: 7px; }

/* Login */
.login_text{ display: block; width: 300px; margin-right: 20px; margin-bottom: 15px; outline: 0px none; background-color: #F2F2F2; border: 1px solid #a6a6a6; padding: 5px; }
.login_button{ width: 120px; height: 28px; display: inline-block; background-image: url('../images/anmelden.png'); border: 0px; color: #fff; margin: 0px; cursor: pointer; padding: 5px 25px; }
.login_error{ padding-bottom: 15px; }

/* Event Links */
.eventlinks a{ color: #000; font-weight: 400; }
.eventlinks p{ padding-bottom: 20px; }
.eventlinks ul{ list-style-type: disc; padding-left: 16px; font-weight: bold; }
.eventlinks li{ padding-top: 8px; }

/* Collapse */
.collapse{ display: none; }
.collapse.in{ display: block; }
.collapsing{ position: relative; height: 0; overflow: hidden; -webkit-transition: height .35s ease; -o-transition: height .35s ease; transition: height .35s ease; }

/* Tooltips */
span[uib-tooltip],div[uib-tooltip],span[uib-tooltip-html],div[uib-tooltip-html],td[uib-tooltip-html]{ cursor: help; }
span[uib-tooltip=''],div[uib-tooltip=''],span[uib-tooltip-html=''],div[uib-tooltip-html='']{ cursor: inherit; }
div.tooltip{ position: absolute; overflow: visible; height: 1em; z-index: 20; }
div.tooltip div.tooltip-inner{ white-space: pre-line; position: relative; overflow: hidden; max-width: 500px; background-color: #FFF; border: 2px solid #fdc300; padding: 6px; border-radius: 6px; }
div.tooltip.stringfilter div.tooltip-inner{ top: 41px; left: -162px; width: 338px; }
div.tooltip-inner li{ margin-top: 2px; }
ul.nosymbols{ list-style-type: none; }

/* notification alerts */
#alerts { position: absolute; font-size: 12px; overflow:visible; pointer-events:none; background:none !important; right: 0px; bottom: 22px; width: 30%; }
#alerts .alert { color: #F2F2F2; background-color: #323232; margin: 10px; padding: 10px; pointer-events: all; border-radius: 4px; }
#alerts .alert .close{ border: 1px solid #fdc300; height: 13px; width: 13px; float: right; background-color: #484848; background-image: url('../images/hide_alert.png'); background-repeat: no-repeat; }
#alerts .alert .close span{ display: none; }

/* Config forms */
.form_header{ display: inline-block; font-size: 21px; font-weight: bold; color: #444444; padding: 22px 0px 12px 25px; }
.form_block{ display: inline-block; margin: 0px 25px; width: 740px; }
.form_block input:required{ box-shadow: none; }
.form_block_header{ display: inline-block; float: left; width: 720px; margin-right: 20px; min-height: 20px; padding-top: 20px; font-weight: bold; cursor: pointer; border-bottom: 1px solid #a6a6a6; }
.form_block_full{ display: inline-block; float: left; width: 720px; margin-right: 20px; min-height: 40px; }
.form_block_msg{ display: inline-block; float: left; width: 688px; margin-right: 20px; border: 1px solid #a6a6a6; background-color: #FFAAAA; padding: 15px; }
.form_block_2313_23{ display: inline-block; float: left; width: 472px; margin-right: 20px;  min-height: 40px; }
.form_block_2313_13{ display: inline-block; clear: left; width: 228px; margin-right: 20px;  min-height: 40px; }
.form_block_1323_13{ display: inline-block; float: left; width: 228px; margin-right: 20px;  min-height: 40px; }
.form_block_1323_23{ display: inline-block; clear: left; width: 472px; margin-right: 20px;  min-height: 40px; }
.form_block_1212_l{ display: inline-block; float: left; width: 350px; margin-right: 20px;  min-height: 40px; }
.form_block_1212_r{ display: inline-block; clear: left; width: 350px; margin-right: 20px;  min-height: 40px; }
.form_block_131313_13{ display: inline-block; float: left; width: 226px; margin-right: 20px;  min-height: 40px; }
.form_block_131313_13_cust1{ display: inline-block; float: left; width: 118px; margin-right: 20px;  min-height: 40px; }
.form_block_131313_13_cust2{ display: inline-block; float: left; width: 164px; margin-right: 20px;  min-height: 40px; }
.form_block_131313_13_narrow{ display: inline-block; float: left; width: 102px; margin-right: 20px;  min-height: 40px; }
.form_block_label{ margin-top: -8px; }
.form_block_footer{ min-height: 32px; }
.form_block_flat{ min-height: 0; }

/* .. Form Elements */
.form_desc{ font-size: 16px; color: #666666; height: 14px; padding: 2px 0px 5px 5px; }
.form_text{ padding: 5px; border: 1px solid #a6a6a6; font-size: 13px; }
input.form_text{ height: 16px; }
.form_text_w_full{ width: 708px; }
.form_text_w_23{ width: 460px; }
.form_text_w_12{ width: 338px; }
.form_text_w_13{ width: 214px; }
.form_text_w_13_narrow{ width: 107px; }

/* .. Form Buttons */
.form_button{ background-color: #fdc300; border: 1px solid; color: #fff; cursor: pointer; }
.form_button[disabled=disabled]{ cursor: auto; }
.form_button_save{ background-image: url(../images/speichern.png); height: 37px; width: 206px; margin-top: 35px; }
.form_button_save[disabled=disabled]{ background-image: url(../images/speichern_gray.png); }
.form_button_cancel{ background-image: url(../images/abbrechen.png); height: 37px; width: 206px; margin-top: 35px; margin-left: 20px; }

/* Helper Divs */
.clear{ clear: both; }
.alignright{ text-align: right; }
.min-940{ min-width: 940px; }
.min-1500{ min-width: 1500px; }

/* Public Stand View */
.noscrollcontent{ display: flex; width: 100vw; height: calc(100vh - 82px); height: calc(100dvh - 82px); overflow: hidden; }
.public_stand_table_wrapper{ min-width: 420px; height: 100%; overflow-y: auto; overflow-x: hidden; touch-action: pan-y; }
.public_stand_image_wrapper{ background-color: #f2f2f2; width: 100vw; height: 100%; overflow: hidden; margin: 0px 16px; align-items: center; justify-content: center; touch-action: none; }

/* Table publicStand View */
.publicStandTable{ margin: 25px 0px 35px 25px; border-spacing: 0px; }
.publicStandTable > tbody > tr > th{ font-weight: bold; text-align: left; border-bottom: 1px solid #dbdbdb; padding: 6px 12px 6px 16px; white-space: nowrap; line-height: 22px; }
.publicStandTable > tbody > tr > td{ padding: 2px 12px 0px 16px; vertical-align: middle; white-space: nowrap; }
.publicStandTable > tbody > tr.redRow{ background-color: #FF9090; }
.publicStandTable td.redCell{ color: #CC0000; }
.publicStandTable td.boldCell{ font-weight: bold; }

/* adjustemnts for smaller screens */
@media (max-width: 800px) {
    #page_subheader span.subheader_title{ margin-left: 25px; }
    .noscrollcontent{ flex-direction: column; }
    .public_stand_table_wrapper{ height: 50%; }
    .public_stand_image_wrapper{ height: 50%; margin: 16px 0px 0px 0px; }
}