﻿/* Schrift allgemein */
body, ul, .title, .title_login, .slogan_login, h2, h3, input, select, button {
    font-family: Verdana, sans-serif; font-size: 14px; 
    color: #333;
}

#content h1 { color:#002C6C; text-transform:uppercase; padding-top:20px }
#content h2 { margin-top:35px; margin-left:0px; color:#002C6C }
#content h3 { margin-top:30px; color:#002C6C }
#content a { text-decoration:none; color: #008DBD }
#content a:hover { color: #002C6C; }
#content form { margin:15px }

/* Seite allgemein und Kopf */
body { font-size:14px; margin: 0; padding: 0; }

body > div { width:1200px; margin:0 auto; background:#fff; position: relative; } /* zentriert */

#header {
    position: relative; padding: 5px 0px; border-bottom: 5px solid #b0b3b3; height: 115px;
}

#header_content {
    margin-top: 20px; padding:10px 0px 0px 10px;  
    margin-left: 800px; width:490px; height: 85px;
    border-left: 1px dotted #d4d4d4; text-align:left;
}

#header_end { border-top: 1px dotted #d4d4d4; }

#header h2 { font-size:120%; color:#F26334 }
#header h3 { font-size:90% }
#header a, #navi a { color: #008DBD; text-decoration:none }
#header a:hover, #navi a:hover {color:#002C6C}
#header a.gs1logo img { height: 59px; padding-top: 25px; }

#navi { 
    width: 260px; position: absolute; top: 140px; 
    left: 0px; margin: 30px 20px; 
}
#content { margin-left:311px; min-height:500px; }
#footer { border-top:1px dotted gray; padding:10px; margin-top:40px; font-size:14px; color:gray; }
#footer a { font-size:14px; text-decoration:none; color:#008DBD }
#footer a:hover { color: #002C6C; }

div.logo { float: left; padding: 10px; }

div.title { font-size:450%; position:absolute; color:#F26334; padding-bottom:1px; top: 25px; left: 300px; }
div.slogan { position:absolute; color:#002C6C; font-size:130%; top: 90px; left: 300px; width: 500px; text-align: center; }

a img { border: none; }

.content_title { text-decoration:none; font-size:24px;margin-left: 15px;color:#002C6C }
.logout { float:right; font-size:110%; padding: 0px 10px; }

/* Anmeldeinformationen */
.header_box {position:relative; color:#002C6C; font-size:140%; margin:2px 0px 2px 0px; padding: 0}
.header_box_title {font-size:150%; margin: 0; padding: 0}

/* Navigation */
#navi a {font-size:100%; color:#002C6C; margin: 0 0 0 -3px}
#navi a:hover,
#navi li.highlight a { color:#F26334; padding:3px 3px; margin:-3px 0px 0px -6px}
#navi ul {
    list-style: none outside none;
    margin: 0;
    padding: 0;
    border-left: 1px solid #b0b3b3;
    border-right: 1px solid #b0b3b3;
}
#navi ul li {list-style: none; background: url(../images/li_blue_mittel.png) no-repeat left center;
             margin: 0 10px 0 10px; border-bottom:1px solid #D1D3D4; padding: 8px 0px 8px 25px }

#navi ul.zusatznav {
        margin-top: 50px;
        border: none;
}

#navi ul.zusatznav li {
        border: none;
}

#navi div.nav-hinweis {
    margin-top: 50px;
}

/* Hervorhebung des aktuellen Menüeintrags */
#glnprint #glnprintnav a {
    background: #002C6C;
    color: #F2F2F2;
    padding: 3px 3px;
    margin: -3px 0px 0px -3px;
    cursor: default
}

table {border-spacing: 0px}
td { vertical-align: baseline; padding: 10px; }
.Ueberschrift {font-weight: bold; padding-left: 8px}
input.ZahlFeldStandard {width: 100px; text-align: right}
.RadioButtonList {border-color: darkgray; border-style: solid;border-width:thin;}
.DropdownKurz {width: 30px}
.SsccBox {border:solid 1px black; padding:2px; background-color:#EEEEEE; }
input.Text100 {width: 100px}
input.Text300 {width: 300px}

.ButtonBox { overflow: auto; } /* Stellt sicher, dass die Box mindestens so hoch wie die Buttons ist, obwohl diese Floats sind. */
.ButtonRechts { text-align: center; float: right; padding: 5px;}
.InfoLabelKlein {font-size: 80%}
.InfoLabelKleinFett {font-size: 80%; font-weight: bold}
.Validator {color: red; }

.nodropdown table.ajax__combobox_inputcontainer td.ajax__combobox_buttoncontainer { display: none; }
#content .ajax__calendar_container { font-family: Arial, sans-serif; }

img.InfoIcon { margin-left: 3px; width: 16px; height: 16px; }

/* Workaround zur korrekten Positionierung der ComboBox */
.ajax__combobox_itemlist
{
    top: auto!important;
    left: auto!important;
    position: absolute!important;            
    overflow: hidden!important;      
    display: block!important;      
}
table.ajax__combobox_inputcontainer, 
table.ajax__combobox_buttoncontainer { 
    top: auto!important; 
    line-height: 0;  /* Verhindert einen freien Platz über dem Button */
    display: block!important;
}
table.ajax__combobox_inputcontainer td { padding: 0px; vertical-align: top; } /* vertical-align: baseline scheint Textbox und Button zueinander zu verschieben. */

/* Infobox */
body .ui-tooltip { 
    color: white; background: #454545; 
    border: #454545;
}
body .ui-tooltip a { color: white; }

button.flach, input[type=submit].flach {
    background-color: #002C6C;
    color: white;
    border: none;
    cursor: pointer;
    padding: 10px;
}
button.flach:disabled, input[type=submit].flach:disabled {
    background-color: #aec0db;
    cursor: default;
}

/* Kontaktseite (möglicherweise nicht mehr alles notwendig) */
#content div.kontakt { float: left; margin-right: 20px; }
#content div.kontakt h2 { margin-top: 0px; }
#content div.kontakt table td { 
    line-height: 1.5em; 
    padding-top: 3px; padding-bottom:3px; padding-left: 1px; padding-right: 40px;
}

#content div.support td { 
    vertical-align: middle; padding-left: 20px; width: 330px; 
    padding-top: 3px; padding-bottom:3px; padding-right: 20px;
}

#content div.kontakt table,
#content div.support table {border-style: solid;border-color: lightgray;border-width: 1px; padding: 5px; height: 105px; }
#content div.kontakt a,
#content div.support a { font-size: 14px; font-family:Arial, sans-serif;}

table.TableBox {border-style: solid;border-color: lightgray;border-width: 1px; padding: 5px; margin: 0px 0px 20px 0px;}
table.TableBoxButtons {border-style: solid;border-color: lightgray;border-width: 1px; padding: 0px; margin: 0;}
table.TableBoxButtons td.NeueGruppe {border-left: solid lightgray 1px; }

div.statistik .RadioButtonList td {padding:2px;}
div.statistik .RadioButtonList label {padding:0px 4px;}
div.statistik .ButtonAusgabe { text-align: center; float: left; padding: 5px;}

.modalBackground { background-color: rgba(127, 127, 127, 0.7); }

/* Archiv- und Gtin-Listen */
#content table.Liste th a,
#content table.Liste th a:hover {color: white; text-decoration: underline;}
table.Liste th {padding:5px; background-color: #002C6C; color: white; border: none; border-right: 1px solid white; font-weight: 600; }
table.Liste td {padding:2px 5px; border:none}
table.Liste .Zeile {background-color:white; border-top: 1px solid lightgray; }
table.Liste .ZeileAlternierend {background-color:#EEEEEE; border-top: 1px solid lightgray; }
table.Liste .Pager { background-color: #002C6C; color: white; }
table.Liste .Pager table { margin: 4px auto; }
#content table.Liste .Pager a, 
#content table.Liste .Pager a:hover { color: white; text-decoration: underline; }
table.Liste .Pager span { font-weight: 600; }
/* Mangels Übersetzung wieder deaktiviert:
    table.Liste .Pager table td:first-child:before { content: "Seite: "; }
*/

/* Gtin-Listen-Popup */
.GtinButton {
    background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAGCAYAAADgzO9IAAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH4QQUCRokuMghCgAAAB1pVFh0Q29tbWVudAAAAAAAQ3JlYXRlZCB3aXRoIEdJTVBkLmUHAAAAPElEQVQI123L0QmAQBAD0bdgbWt1FrTVxR/F4zAwEBgGBtkY6B/RktiqSeIVa9VJ1CNU1UCSEw7fruW7AT6qI3R4Ey48AAAAAElFTkSuQmCC') no-repeat center #DDD;
    width: 22px;
    position: relative;
    left: -4px;
    float: left;
}
#GtinPopup {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: none;
}
#GtinPopup .Content { background: white; border: 1px solid black; font-size: 80%; 
                      position: absolute; top: 0; left: 0; right: 0; margin: 100px auto;
                      width: 1000px; filter: initial; opacity: 1; }
#GtinPopup .Content .Close { float: right; }
#GtinPopup .Content .Close a { font-size: 24px; padding-right: 5px; text-decoration: none; }
#GtinPopup .Content table.Liste { width: 960px; margin: 20px; }
#GtinPopup .Content table a, #GtinPopup .Content table a:hover { text-decoration: underline; color: white; }
#GtinPopup a { text-decoration:none; color: #008DBD }
#GtinPopup a:hover { color: #002C6C; }
#GtinPopup h2 { margin-top: 10px; margin-left: 20px; color: #002C6C }

span.toggle-password {
    position: relative; left: -30px; 
    cursor: pointer; visibility: hidden;
}
input:focus + span.toggle-password {
    visibility: visible;
}
span.toggle-password:hover {
    visibility: visible;
}

div.progress-bar {
    height: 1.5em;
    width: 100%;
    background-color: #ddd;
}

div.progress-bar div.value {
    background-color: #002C6C;
    display: inline-block;
    height: 100%;
}

div.spinner-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgb(200 200 200 / 0.5); /* halbtransparent */
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}