/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 14.02.2017, 09:15:46
    Author     : andreasmethling
*/
body { }
div { /* display: inline-block; */ margin: 0px; padding: 0px; }
div.white, set.white { background-color: #ffffff; }
.greylight { background-color: #f7f5f5; }
div.grey, fieldset.grey, label.grey, span.grey { background-color: #e2e2e2; }
.internerbereich { display: none!important; }
div.form.padding { padding: 1%; }
div.error_block { width: 96%; padding: 1%; margin: 1%; border: 1px solid #e2000a; color: #e2000a; }
div.errorbox > p { width: 98%; padding: 1%; border: 1px solid #e2000a; color: #e2000a; }
.mousehover:hover { background-color: #e2e2e2; cursor: pointer; }
div.dataedit { width: 70%!important; height: 70%; position: fixed; left: 15%; top: 15%; border: 3px solid #2d6298; overflow-x: scroll; background-color: #FFF; z-index: 10000000; }
div.dataedit > fieldset { width: 96%!important; border: 0px!important; padding: 0px!important; }
div.row100.nopadding{ padding: 0px!important; margin: 0px!important; }
div.textcenter { text-align: center!important; }
div.formular.row100.red { color: #FFF; background-color:  #e2000a;  }
div.row100.fixed { position: fixed; max-width: 1400px; top: 57px; border-bottom:  3px solid #ccc; background-color: #FFF; }
div.row100 { display: inline-block; width: 100%; max-width: 100%; padding: 0.2% 0% 0.2% 0%; margin: 0.2% 0% 0.2% 0%; float: none; vertical-align: top; }
div.row90 { display: inline-block; width: 89%; max-width: 89%; padding: 0.2% 0% 0.2% 0%; margin: 0.2% 0% 0.2% 0%; float: none; vertical-align: top; }
div.row75 { display: inline-block; width: 74%; max-width: 74%; padding: 0.2% 0% 0.2% 0%; margin: 0.2% 0% 0.2% 0%; float: none; vertical-align: top; }
div.row50 { display: inline-block; width: 48%; max-width: 48%; padding: 0.2% 0% 0.2% 0%; margin: 0.2% 1% 0.2% 0%; float: none; vertical-align: top; }
div.row45 { display: inline-block; width: 43%; max-width: 43%; padding: 0.2% 0% 0.2% 0%; margin: 0.2% 1% 0.2% 0%; float: none; vertical-align: top; }
div.row40 { display: inline-block; width: 38%; max-width: 38%; padding: 0.2% 0% 0.2% 0%; margin: 0.2% 1% 0.2% 0%; float: none; vertical-align: top; }
div.row35 { display: inline-block; width: 32%; max-width: 32%; padding: 0.2% 0% 0.2% 0%; margin: 0.2% 1% 0.2% 0%; float: none; vertical-align: top; }
div.row25 { display: inline-block; width: 23%; max-width: 23%; padding: 0.2% 0% 0.2% 0%; margin: 0.2% 1% 0.2% 0%; float: none; vertical-align: top; }
div.row20 { display: inline-block; width: 19%; max-width: 19%; padding: 0.2% 0% 0.2% 0%; margin: 0.2% 1% 0.2% 0%; float: none; vertical-align: top; }
div.row15 { display: inline-block; width: 14%; max-width: 14%; padding: 0.2% 0% 0.2% 0%; margin: 0.2% 1% 0.2% 0%; float: none; vertical-align: top; }
div.row10 { display: inline-block; width: 9%; max-width: 9%; padding: 0.2% 0% 0.2% 0%; margin: 0.2% 1% 0.2% 0%; float: none; vertical-align: top; }
div.row5 { display: inline-block; width: 4%; max-width: 4%; padding: 0.2% 0% 0.2% 0%; margin: 0.2% 1% 0.2% 0%; float: none; vertical-align: top; }
div.left { display: inline-block; float: left; }
div.right, button.button.right { display: inline-block; float: right; }
div.form { display: inline-block; text-align: left; max-width: 1400px; }
div.formular { display: inline-block; border-bottom: 1px solid #ccc; }


div.formular label,  div.formular input, div.formular textarea, div.formular select { display: inline-block; width: 45%; float: none; vertical-align: top; padding: 1%; margin: 1%; }

div.formular option { padding: 1%; }
div.formular > p, div.formular > strong { display: inline-block; width: 98%; padding: 1%; margin: 0.2% 0% 0.2% 0%; }
div.formular > span { display: inline-block; width: 34%; padding: 1%!important; margin: 1%!important; }
div.formular > input, div.formular > textarea { border: 1px solid #ccc; }
div.formular > textarea { min-height: 200px; }
div.formular > textarea.noautofill { width: 96%; }
button.noautofill { width: 96%!important; }
textarea.full, input.full, label.full, select.full { width: 96%!important; }
div.formular > textarea.memotext { height: 50px!important; min-height: 50px!important; }
label.pflichtfeld:after { content:"*";  display: inline-block; width: 20px; margin: 0px 0px 0px 10px; color: #e2000a;  }
div.formular > input:focus, div.formular > textarea:focus { border: 1px solid #2d6298; }
div.form fieldset { display: inline-block; width: 97%; padding: 0.5%; margin: 1%; border: 1px solid #ccc; }
div.form fieldset.noboarder { border: 0px; }
div.form fieldset > legend { display: inline-block; width: 80%; padding: 0.5% 2% 0.5% 2%; margin: 0.2% 1% 0% 1%; font-size: 18px;  float: none; clear: none; background-color: #FFF; color: #2d6298; border: 1px solid #ccc; }
div.form fieldset > legend.noboarder { border: 0px; }
div.row25 > div > fieldset > legend { font-size: 16px; }
@media only screen and (max-width: 400px){
div.form fieldset > legend { border: 0px;  margin: 0px; } 
div.form fieldset { border-right: 0px; border-left: 0px; border-top: 0px; border-bottom: 1px solid #ccc; }
}
div.formular > button,
div.row100 > button,
div.row90 > button,
div.row75 > button,
div.row50 > button,
div.row45 > button,
div.row40 > button,
div.row35 > button,
div.row25 > button, 
div.row20 > button, 
div.row15 > button, 
div.row10 > button,
div.row5 > button,
div.left > button, 
div.right > button,
div.formular > input[type="submit"]
{ width: 45%; padding: 1%; margin: 1%; outline: none; border: none; background: transparent; float: none; color: #ffffff; cursor: pointer; vertical-align: top; }
div.formular > button:hover, div.formular > button:focus, div.formular > button:active { outline: none; }
div.formular > button.button,
div.row100 > button.button,
div.row90 > button.button,
div.row75 > button.button,
div.row50 > button.button,
div.row45 > button.button,
div.row40 > button.button,
div.row35 > button.button,
div.row25 > button.button, 
div.row20 > button.button, 
div.row15 > button.button, 
div.row10 > button.button,
div.row5 > button.button,
div.left > button.button, 
div.right > button.button
{ width: 47%; margin: 1% 2% 1% 1%; padding: 1%; float: none;  background-color: #2d6298; }

div.formular > button.add,
div.row100 > button.add,
div.row90 > button.add,
div.row75 > button.add,
div.row50 > button.add,
div.row45 > button.add,
div.row40 > button.add,
div.row35 > button.add,
div.row25 > button.add, 
div.row20 > button.add, 
div.row15 > button.add, 
div.row10 > button.add,
div.row5 > button.add,
div.left > button.add, 
div.right > button.add {
  background-image: url("/resources/css/images/plus.svg")!important;
  background-size: 25px; 
  background-position: right center!important;
  background-repeat: no-repeat!important; 
  background-color: #FFF!important;
  color: #000!important;
  border: 1px solid #2d6298!important;
}
div.formular button.button.add:hover { background-color: #FFF!important; color: #2d6298!important; }

div.formular > button.save,
div.row100 > button.save,
div.row90 > button.save,
div.row75 > button.save,
div.row50 > button.save,
div.row45 > button.save,
div.row40 > button.save,
div.row35 > button.save,
div.row25 > button.save, 
div.row20 > button.save, 
div.row15 > button.save,
div.row10 > button.save,
div.row5 > button.button,
div.left > button.save, 
div.right > button.save,
div.formular > input[type="submit"]
{ background-color: #009966!important; border: 0px!important; }
div.formular > a.button { display: inline-block; width: 96%; margin: 1% 2% 1% 1%; padding: 1%; float: none; color: #FFF; text-align: center; text-decoration: none; color: #2d6298; }
div.formular > a.button.close { background-color: #e2000a; color: #FFF; }
div.formular > button.close,
div.row100 > button.close,
div.row90 > button.close,
div.row75 > button.close,
div.row50 > button.close,
div.row45 > button.close,
div.row40 > button.close,
div.row35 > button.close,
div.row25 > button.close, 
div.row20 > button.close, 
div.row15 > button.close, 
div.row10 > button.close,
div.row5 > button.close,
div.left > button.close, 
div.right > button.close
{ background-color: #e2000a!important; }
div.form a.button.print {
    display: inline-block;
    width: 37%;
    padding: 1% 1% 1% 10%;
    margin: 1%;
    float: none;
    vertical-align: top;
    background-image: url("/resources/css/images/printit.svg");
    background-repeat: no-repeat;
    background-position: 5px center;
    background-size: 25px auto;
    background-color: #2d6298;
    color: #FFF;
    text-decoration: none;
}

button.print {
    display: inline-block;
    width: auto;
    padding: 1% 1% 1% 10%;
    margin: 1%;
    float: none;
    vertical-align: top;
    background-image: url("/resources/css/images/printit.svg");
    background-repeat: no-repeat;
    background-position: 5px center;
    background-size: 25px auto;
    background-color: #2d6298;
    color: #FFF;
    
}

button.button.closeformular { background-color: #e2000a!important; }
div.formular button.ui-datepicker-trigger { width: 40px!important }
div.formular.hidden_formular { display: none!important; }
button.fixed { position: absolute; right: 5px; top: 5px; padding: 1%!important; z-index: 1000000; }
label.search { }
label.noautofill, input.noautofill { width: auto!important; }
select.noautofill, span > select.noautofill, div.formular > span.noautofill { width: 98%!important; }
span.noautofill-descend > select {
    width: 98% !important
}
input.noautofill.datepicker { width: 98%!important; }  
input[type="text"].red { border: 1px solid #e2000a; }
button.row100 { width: 98%!important; }
label.whitetext, i.whitetext { color: #FFF; }
label.redtext, i.redtext { color: #e2000a; }
label.xltext, i.xltext { font-size: 120%; }
i.redtext, i.whitetext { display: inline-block; min-width: 20px; margin-right: 5px; border-radius: 5px; }

/* Span Buttons und a. Buttons (speziell für personal Shopping in der Cloud) */
div.formular span.button { display: inline-block; width: 98%; padding: 1%; cursor: pointer;  color: #FFF; }
div.formular span.button.open { background-image: url("/resources/css/images/down.svg"); background-size: 15px; background-repeat: no-repeat; background-position: right 10px center; background-color: #2d6298; } 
div.formular span.button.close { background-color: #e2000a; }

/* personal Shopping Opencustomers */
div.opencustomers { padding-left: 1%; background-image: url("/resources/css/images/down.svg"); background-size: 15px; background-repeat: no-repeat; background-position: right 10px center; background-color: #009966; color: #FFF; cursor: pointer; }
div.formular i.fa.fa-envelope { padding-right: 5%; color: #2d6298; }
div.formular a.mailcustomers { text-decoration: none; color: #2d6298; }

/* neue Checkboxen */
label.checkboxen { width: 100%!important; margin: 0px!important; position: relative; overflow: hidden; cursor: pointer; line-height: 33px; font-weight: normal; }
label.checkboxen > span { display: block; width: 100%; padding: 1% 1% 1% 10%; cursor: pointer; background-image: url("/resources/css/images/checkbuttons.svg"); background-repeat: no-repeat; background-size: 28px auto; background-position: left center;  }
input[type="checkbox"].checkboxen { display: none; width: 100%; height: 100%; margin-left: -50%; position: absolute; left: 0px; top: 0px;  }
input[type="checkbox"].checkboxen:checked { display: none; background-image: none;  }
input[type="checkbox"]:checked + span { display: block; background-image: url("/resources/css/images/checkbuttons_ok.svg"); background-repeat: no-repeat; background-size: 28px auto; background-position: left center; }
div.formular > input[type="submit"] { width: 98%!important; }
div.formular.noboarder { border-bottom: 0px!important; }
div.formular > label.viewover { display: none; opacity: 0; }
div.formular:hover label.viewover, div.formular:active label.viewover { display: inline-block; width: auto;  opacity: 0.5; }
div.Wareneingang, div.absolute_window { display: none; width: 80%; height: 70%; padding: 1%; margin: 0% 10% 0% 10%; position: fixed; top: 15%; left: 0%;  background-color:#FFF; border: 2px solid #2d6298; overflow-y: scroll;  z-index: 20000; }
div#lieferueberschreitungWareneingang, div#lieferueberschreitungartikel_result_box  { display: inline-block; }
div#datenschutzshow, div#einwilligungsshow { display: none; }
div#showList > div.row100 > div.row100 { padding: 0.1% 0% 0.1% 0%; margin: 0.1% 0% 0.1% 0%; }
div#showList > div.row100 > div.row100:hover { background-color: #e2e2e2; cursor: pointer; }
div.formular > label.floatleft, div.formular > span.floatleft, span.floatleft,  div.floatleft { width: 46%!important; padding: 1%!important; margin: 1%!important; float: none!important; vertical-align: top; }
select#form_art { margin: 0.2% 0% 0% 0.2%; }

/* Return Result Activecard */
div#return_value { display: inline-block; width: 94%; padding: 1%; margin: 2%; float: none; border: 2px solid #009966; color: #009966; font-size: 120%; }

/* Button Code und EAN */
a.button.ean, a.button.code { display: inline-block; width: 98%; padding: 1%; margin: 1%; color: #FFF; text-decoration: none; }
a.button.ean { background-color: #2d6298; }
a.button.code { background-color:  #009966; }
/* Fimrenverwaltung */
div#getFirmen { margin-top: 20px; }
div#getFirmen div.row100:hover { cursor: pointer; }

@media only screen and (max-width: 1023px){
div.formular label, div.formular input, div.formular textarea, div.formular select, label.noautofill, input.noautofill, select.noautofill, div.formular > button.button, div.row100 > button.button, div.form fieldset > legend {  width: 94%!important; padding: 2%!important; } 
div.formular:hover label.viewover, div.formular:active label.viewover, div.formular button.ui-datepicker-trigger { display: none; }
div.formular > input { font-size: 18px; }
div.formular.row50 { width: 99%; padding: 0.5%; max-width: 99%; }
}
         
div.formular > input, div.formular > textarea { font-size: 18px; font-family: inherit; }
textarea#fa_details { min-height: 150px; }
label.checkboxen { line-height: normal; }
label.checkboxen > span, input[type="checkbox"]:checked + span { background-position: left top; min-height: 39px; }
label.checkboxen > span { padding: 1% 1% 1% 15%; }

div.form > .button.button,
div.formular > button.button,
div.form > input.button,
div.formular > input.button,
div.form > a.button,
div.formular > a.button
{ display: inline-block; padding: 1%; margin: 1%; border-radius: 5px; font-size: 18px; background: transparent; }
div.form > .button.open, div.formular > .button.open {
padding-right: 9%!important;
background-color: #2d6298;
background-image: url("/resources/css/images/down.svg");
background-size: 30px;
background-repeat: no-repeat;
background-position: right 15px center;
}
#searchresult > fieldset > div.row100 > button.open,
#searchresult > fieldset > div.row100 > input { margin: 1rem; padding: 1rem; } 
#searchresult > fieldset > div.row100 > button.open { margin-right: 0; float: none; vertical-align: top; }
#searchresult > fieldset > div.formular.row100 { border: 0 none; }
.button:hover, .button:active, .button:focus { outline: none; }
div.formular > img { max-width: 90%; }

@media only screen and (max-width: 1280px){
div.tabbed-content.button-tabs > ul.tabs { width: 94%; padding: 0% 0% 0% 6%; } 
div.teaser.ebene_1, div.teaser.ebene_2, div.teaser.ebene_3 { max-width: 1200px; }
div.form { max-width: 1200px; }
} 

/* Scan Fomulare */
@media only screen and (max-width: 1900px){
div.formular > button.scan { padding: 3%; background-color: #2d6298; }
div.formular > button > label { width: 96%; padding: 0px; margin: 0px; position: relative;  cursor: pointer; }
div.formular > button > label > i { display: inline-block; width: auto; padding: 1%; position: absolute; left: 0px; top: 0px; }
div.formular.row35.noboarder > form > input, div.formular.row35.noboarder > form > button {  display: inline-block; padding: 3%; margin: 1%; float: none; vertical-align: top; }
div.formular.row35.noboarder > form > input { border: 1px solid #ccc; }
div.formular.row35.noboarder > form > button { width: auto; background-color: #2d6298; color: #FFF; border: 1px solid #2d6298; outline: none; border-radius: 0px; cursor: pointer; }
div.verleih-container.row75 { margin: 1%; border: 1px solid #ccc; }
input#verleihPrereserveTo, input#verleihPrereserveFrom { min-height: 28px; background-color: #FFF; }

}
/* responosive Ausgabe */
@media only screen and (max-width: 768px){
div.row100 { width: 99%; max-width: 99%; }
div.formular.row35.noboarder { width: 99%; max-width: 99%; }
div.formular > button.scan { width: 99%!important; } 
div.formular.row35.noboarder > form > input, div.formular.row35.noboarder > form > button { padding: 3%!important; margin: 1%; }
div.formular.row35.noboarder > form > input { width: 68%; max-width: 68%; }
}

/* Container unsichtbar (hidden) setzen */
div.div_hidden { display: none; }

/* Rows für mobile Ansicht */
div.row50.mobile { width: 47%!important; float: none!important; }
/* Formulare für Absortierung Kasse */
div.sort--by {  }
div.sort--by > span.sort--by-title,
div.sort--by > a.sort--by-link--print,
div.sort--by > span.sort--by-count { display: inline-block; float: none; vertical-align: top;}
div.sort--by > span.sort--by-title { width: 30%;}
div.sort--by > a.sort--by-link--print,
div.sort--by > button { width: 20%; padding: 1%; margin: 1%; text-decoration: none; color: #FFF; background-color: #2d6298; background-image: url("/resources/css/images/printit.svg"); background-repeat: no-repeat; background-position: right center; background-size: auto 90%; }
div.sort--by > span.sort--by-count { width: 5%; float: right; }
div.sort--by > span.sort--by-count.red { background-color: #e2000a; color: #FFF; font-size: 120%; text-align: center; }
div.sort--by > button { font-size: 1rem; text-align: left; }
div.sort--by--buttons > a { display: inline-block; width: 98%; padding: 1%; margin: 1%; float: none; vertical-align: top; text-decoration: none; text-align: center!important; color: #000; }
div.sort--by--buttons > a > span { text-align: center; }
div#nachdruck > button { margin: 0.5%; background-image: url("/resources/css/images/printit.svg"); background-repeat: no-repeat; background-position: right center; background-size: auto 90%; }
div.detailWindow { padding-left: 0px; background-color: #e5e5e5; overflow: hidden;}