.scroll-buttons {
  position: fixed;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  flex-direction: column;
  gap: 10px;
  z-index: 1000;
}

.scroll-buttons button {
    width:40px;
    height:100px;
  background-color: #333;
  color: #fff;
  border: none;
  padding: 10px 14px;
  font-size: 18px;
  border-radius: 6px;
  cursor: pointer;
  box-shadow: 0 2px 4px rgba(0,0,0,0.3);
   display: flex;
  align-items: center;
  justify-content: center;
}

.scroll-buttons button:hover {
  background-color: #555;
}

#InfotickerContent {
    font-family: Arial, sans-serif;
    border: 1px solid #C20;
    margin: 0px 0;
    font-style: italic;
    position: relative;
    padding: 0 0 0 100px;
    box-shadow: 0 2px 5px -3px #000;
    border-radius: 3px;
}
#InfotickerContent:before {
    content: "Infoticker:";
    display: inline-block;
    font-style: normal;
    background: #C20;
    padding: 10px;
    color: #FFF;
    font-weight: bold;
    position: absolute;
    top: 0;
    left: 0;
}
#InfotickerContent:after {
    content: '';
    display: block;
    top: 0;
    left: 80px;
    background: linear-gradient(#FFF, rgba(255, 255, 255, 0));
    height: 20px;
}
#InfotickerContent ul li {
    list-style: none;
    padding: 10px 0;
}
#dragandrophandler
{
border:2px dotted #0B85A1;
width:100%;
min-height:200px;
color:#92AAB0;
vertical-align:middle;
padding-top:50px;
text-align:center;
margin-bottom:10px;
font-size:200%;
}
.progressBar {
    width: 200px;
    height: 22px;
    border: 1px solid #ddd;
    border-radius: 5px; 
    overflow: hidden;
    display:inline-block;
    margin:0px 10px 5px 5px;
    vertical-align:top;
}
 
.progressBar div {
    height: 100%;
    color: #fff;
    text-align: right;
    line-height: 22px; /* same as #progressBar height if we want text middle aligned */
    width: 0;
    background-color: #0ba1b5; border-radius: 3px; 
}
.statusbar
{
    border-top:1px solid #A9CCD1;
    min-height:25px;
    width:700px;
    padding:10px 10px 0px 10px;
    vertical-align:top;
}
.statusbar:nth-child(odd){
    background:#EBEFF0;
}
.filename
{
display:inline-block;
vertical-align:top;
width:250px;
}
.filesize
{
display:inline-block;
vertical-align:top;
color:#30693D;
width:100px;
margin-left:10px;
margin-right:5px;
}
.abort{
    background-color:#A8352F;
    -moz-border-radius:4px;
    -webkit-border-radius:4px;
    border-radius:4px;display:inline-block;
    color:#fff;
    font-family:arial;font-size:13px;font-weight:normal;
    padding:4px 15px;
    cursor:pointer;
    vertical-align:top
    }
    /*------------------*/
    
body {
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    -webkit-touch-callout: none;
}
#toppanel {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
}
#footpanel {
    position: absolute;
    left: 0px;
    bottom: 0px;
    width: 100%;
}
.ownWellHead {
    padding-top: 2px;
    margin-top: -15px;
    margin-bottom: 13px;
}
.box-header-DNG {
  background-color: #fbfbfb;
  background-image: -moz-linear-gradient(top, #ffffff, #f5f5f5);
  background-image: -ms-linear-gradient(top, #ffffff, #f5f5f5);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#f5f5f5));
  background-image: -webkit-linear-gradient(top, #ffffff, #f5f5f5);
  background-image: -o-linear-gradient(top, #ffffff, #f5f5f5);
  background-image: linear-gradient(top, #ffffff, #f5f5f5);
  background-repeat: repeat-x;
  border: 1px solid #ddd;
  filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ffffff', endColorstr='#f5f5f5', GradientType=0);
  -webkit-box-shadow: inset 0 1px 0 #ffffff;
     -moz-box-shadow: inset 0 1px 0 #ffffff;
          box-shadow: inset 0 1px 0 #ffffff;
	padding: 7px 7px;
  margin: 0;
  list-style: none;
  cursor:move;
  height: 18px;
}
.round-top-DNG {
    
    border: 1px solid #ddd;
	-webkit-border-top-left-radius: 3px;
	-webkit-border-top-right-radius: 3px;
	-moz-border-radius-topleft: 3px;
	-moz-border-radius-topright: 3px;
	border-radius: 3px 3px 0 0;
}
/*RAUS ANFANG ?
*/
#wrapper {
	position:absolute; 
	top:45px; bottom:48px; left:0;
	width:100%;
	background:#ffffff;
	overflow:auto;

}

#scroller {
	position:absolute; 

/*	-webkit-touch-callout:none;*/
	
	width:100%;
	padding:0;
}
/*RAUS ENDE ?
*/


th.pdf {
    border-top: 1px solid #89B62B;
    border-bottom: 1px solid #89B62B;
    color: #89B62B;
    margin-left:0px;
    padding-left:0px;
    font-weight:normal;
    text-align:left;
}
th.pdf {
    border-top: 1px solid #89B62B;
    border-bottom: 1px solid #89B62B;
    color: #89B62B;
    margin-left:0px;
    padding-left:0px;
    font-weight:normal;
}
.pdftable td {
    margin-left:0px;
    padding-left:0px;
}
.dnganschrift {
    font-family: 'Trebuchet MS', Helvetica, sans-serif; 
    font-size:8px;
    color: #555555;
}
.pdftablefooter {
    /*font-size: 9px;*/
}
.pdftablefooter td {
    /*font-size: 8px;*/
}

/**
 *
 * Horizontal Scrollbar
 *
 */
.myScrollbarH {
	position:absolute;
	z-index:100;
	height:8px;
	bottom:1px;
	left:2px;
	right:7px
}

.myScrollbarH > div {
	position:absolute;
	z-index:100;
	height:100%;

	/* The following is probably what you want to customize */
	background-image:-webkit-gradient(linear, 0 0, 100% 0, from(#a00), to(#f00));
	background-image:-moz-linear-gradient(top, #f00, #900);
	background-image:-o-linear-gradient(top, #f00, #900);

	border:1px solid #900;
	-webkit-background-clip:padding-box;
	-moz-background-clip:padding-box;
	-o-background-clip:padding-box;
	background-clip:padding-box;
	
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	-o-box-sizing:border-box;
	box-sizing:border-box;
	
	-webkit-border-radius:4px;
	-moz-border-radius:4px;
	-o-border-radius:4px;
	border-radius:4px;
	
	-webkit-box-shadow:inset 1px 1px 0 rgba(255,255,255,0.5);
	-moz-box-shadow:inset 1px 1px 0 rgba(255,255,255,0.5);
	-o-box-shadow:inset 1px 1px 0 rgba(255,255,255,0.5);
	box-shadow:inset 1px 1px 0 rgba(255,255,255,0.5);
}


/**
 *
 * Vertical Scrollbar
 *
 */
.myScrollbarV {
	position:absolute;
	z-index:100;
	width:8px;bottom:7px;top:2px;right:1px
}

.myScrollbarV > div {
	position:absolute;
	z-index:100;
	width:100%;

	/* The following is probably what you want to customize */
	background:-webkit-gradient(linear, 0 0, 100% 0, from(#f00), to(#900));
	background-image:-moz-linear-gradient(top, #f00, #900);
	background-image:-o-linear-gradient(top, #f00, #900);

	border:1px solid #900;

	-webkit-background-clip:padding-box;
	-moz-background-clip:padding-box;
	-o-background-clip:padding-box;
	background-clip:padding-box;
	
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	-o-box-sizing:border-box;
	box-sizing:border-box;
	
	-webkit-border-radius:4px;
	-moz-border-radius:4px;
	-o-border-radius:4px;
	border-radius:4px;
	
	-webkit-box-shadow:inset 1px 1px 0 rgba(255,255,255,0.5);
	-moz-box-shadow:inset 1px 1px 0 rgba(255,255,255,0.5);
	-o-box-shadow:inset 1px 1px 0 rgba(255,255,255,0.5);
	box-shadow:inset 1px 1px 0 rgba(255,255,255,0.5);
}

/*FIX AB HIER BOOTSTRAP Anpassung */
.btn-group > input {
    display: none;
}

.btn-group input:first-child + .btn {
     /* This is an actual copy/paste of the .btn-group .btn:first-child style */
    border-bottom-left-radius: 4px;
    border-top-left-radius: 4px;
    margin-left: 0;
}

input:checked + label.btn {
    /* This is an actual copy/paste of the .btn:active style */
    background-color: #0074cc;
    background-image: none;
    
    color: white; 
    text-shadow: none;
    outline: 0 none;
}

input[disabled] + label.btn {
    /* This is an actual copy/paste of the .btn:disabled style */
    background-color: #E6E6E6;
    background-image: none;
    box-shadow: none;
    cursor: default;
    opacity: 0.65;
}
​
.control-group-ticket {
  margin-bottom: 9px;
}

legend + .control-group-ticket {
  margin-top: 18px;
  -webkit-margin-top-collapse: separate;
}

.form-horizontal .control-group-ticket {
  margin-bottom: 18px;
  *zoom: 1;
}

.form-horizontal .control-group-ticket:before,
.form-horizontal .control-group-ticket:after {
  display: table;
  content: "";
}

.form-horizontal .control-group-ticket:after {
  clear: both;
}

.form-horizontal .control-label-ticket {
  float: left;
  width: 60px;
  margin-left: -25px;
  /*width: 100px;DNG*/
  
  text-align: right;
}
.form-horizontal .control-label-ticketneu {
  float: left;
  width: 100px;
  margin-left: -25px;
  /*width: 100px;DNG*/
  padding-top: 5px;
  text-align: right;
}
.form-horizontal .control-label-ticket-well {
  float: left;
  width: 80px;
  margin-left: -25px;
  /*width: 100px;DNG*/
  text-align: right;
}
.form-horizontal .controls-ticketneu {
  *display: inline-block;
  *padding-left: 10px;
  margin-left: 100px;
  /*margin-left: 140px;DNG*/
  *margin-left: 0;
  /*DNG*/
  margin-bottom: 7px;
  /*DNG*/
}
.form-horizontal .controls-ticket {
  *display: inline-block;
  *padding-left: 10px;
  margin-left: 50px;
  /*margin-left: 140px;DNG*/
  *margin-left: 0;
  /*DNG*/
  margin-bottom: 7px;
  
  /*DNG*/
}

.form-horizontal .controls-ticket-well {
  *display: inline-block;
  *padding-left: 10px;
  margin-left: 70px;
  /*margin-left: 140px;DNG*/
  *margin-left: 0;
  /*DNG*/
  
  margin-bottom: 7px;
  /*DNG*/
}
.form-horizontal .controls-ticket:first-child {
  *padding-left: 120px;
  
}
.row-fluid span4-ticket {
    margin-left:0px;
}
span12-ticket {
    margin-left:0px;
}
.row-fluid .span8-debitor {
  width: 62.95744680199999%;
  *width: 62.90425531263828%;
  margin-right: 1%;
}
.row-fluid .span12-debitor {
  width: 96.99999998999999%;
  *width: 96.94680850063828%;
}

    /*
    Warengruppen ANFANG
    */
    .control-group-wg {
        margin-bottom: 9px;
    }

    legend + .control-group-wg {
        margin-top: 18px;
        -webkit-margin-top-collapse: separate;
    }

    .form-horizontal .control-group-wg {
        margin-bottom: 18px;
        *zoom: 1;
    }

    .form-horizontal .control-group-wg:before,
    .form-horizontal .control-group-wg:after {
        display: table;
        content: "";
    }

    .form-horizontal .control-group-wg:after {
        clear: both;
    }

    .form-horizontal .control-label-wg {
        float: left;
        width: 139px;
        margin-left: -65px;
        text-align: right;
    }
    .form-horizontal .controls-wg {
        *display: inline-block;
        *padding-left: 0px;
        margin-left: 80px;
        /*margin-left: 140px;DNG*/
        *margin-left: 0;
        /*DNG*/
        margin-bottom: 7px;
        /*DNG*/
        }

     .row-fluid .span12-wg {
        width: 93.99999998999999%;
        *width: 93.94680850063828%;
     }
     .row-fluid .span12-wgb {
        width: 96.99999998999999%;
        *width: 96.94680850063828%;
     }
     
     .form-horizontal .controls-wgform {
        *display: inline-block;
        *padding-left: 5px;
        margin-left: 125px;
        /*margin-left: 140px;DNG*/
        *margin-left: 0;
        /*DNG*/
        margin-bottom: 7px;

        /*DNG*/
        }
        .form-horizontal .control-label-wgform {
        float: left;
        width: 175px;
        margin-left: -60px;
        text-align: right;
    }
    /*
    Warengruppen ENDE
    */
    
    /*
    Artikel ANFANG
    */
    .row-fluid .span12-artikel {
        width: 97.2%;
        *width: 95.94680850063828%;
     }
     
     .form-horizontal .controls-artikel {
        *display: inline-block;
        *padding-left: 0px;
        margin-left: 80px;
        /*margin-left: 140px;DNG*/
        *margin-left: 0;
        
        /*DNG*/

        /*DNG*/
     }
     
    
    /*
    Artikel ENDE
    */
    /*ANGEBOTE
    */
    .row-fluid .span12-20 {
        
         margin-left:0px;
         margin-top: 10px;
     }
     .row-fluid .span1_5 {
        width: 8%;
        *width: 8%;
     }
     .row-fluid .span2_preisnetto{
        width: 12%;
        *width: 12%;
     }
     .row-fluid .span2_preisgesamt{
        width: 14%;
        *width: 14%;
     }
     .row-fluid .span2_lieferdatum{
        width: 10%;
        *width: 10%;
     }
    .form-horizontal .control-label-angebot {
        float: left;
        width: 100px;
        text-align: left;
        
    }
    .form-horizontal .controls-angebot {
        *display: inline-block;
        *padding-left: 0px;
        margin-left: 100px;
        
        *margin-left: 0;
    }
    .form-horizontal .control-label-angebotartikel-menge {
        float: left;
        width: 45px;
        text-align: left;
        
    }
    .form-horizontal .controls-angebotartikel-menge {
        
        *display: inline-block;
        *padding-left: 0px;
        margin-left: 47px;
        
        *margin-left: 0;
    }
   .form-horizontal .control-label-angebotartikel-rabatt {
        float: left;
        width: 60px;
        text-align: left;
        
    }
    .form-horizontal .controls-angebotartikel-rabatt {
        
        *display: inline-block;
        *padding-left: 0px;
        margin-left: 63px;
        
        *margin-left: 0;
    }
    .form-horizontal .control-label-angebotartikel {
        float: left;
        width: 70px;
        text-align: left;
        
    }
    .form-horizontal .controls-angebotartikel {
        
        *display: inline-block;
        *padding-left: 0px;
        margin-left: 70px;
        
        *margin-left: 0;
    }
    .form-horizontal .control-label-angebotauftragform {
        float: left;
        width: 100px;
        text-align: left;
        
    }
    .form-horizontal .controls-angebotauftragform {
        
        *display: inline-block;
        *padding-left: 0px;
        margin-left: 100px;
        
        *margin-left: 0;
    }
    .controls-angebotauftragform .span12 {
        width: 94.24%;
        *width: 94.14680850063828%;
    }
    .form-horizontal .control-label-buh {
        float: left;
        width: 140px;
        text-align: left;
        margin-top:5px;
        /*border: 1px solid #ff0000;*/
    }
    .form-horizontal .controls-buh {
        
        *display: inline-block;
        *padding-left: 0px;
        margin-left: 160px;
        margin-top:2px;
        /*border: 1px solid #ff0000;*/
        *margin-left: 0;
    }
    .form-horizontal .control-label-buh-small {
        float: left;
        width: 80px;
        text-align: left;
        margin-top:5px;
    }
    .form-horizontal .controls-buh-small {
        
        *display: inline-block;
        *padding-left: 0px;
        margin-left: 90px;
        margin-top:2px;
        /*border: 1px solid #ff0000;*/
        *margin-left: 0;
    }
    .control-label-full {
        float: left;
        width: 140px;
        text-align: left;
        margin-top:5px;
        /*border: 1px solid #ff0000;*/
    }
    .controls-full {
        
        *display: inline-block;
        *padding-left: 0px;
        margin-left: 160px;
        margin-top:2px;
        /*border: 1px solid #ff0000;*/
        *margin-left: 0;
    }
.btn-group {
    margin-bottom: 5px;
}

/*
Ab hier CSS Anpassung für Ipad Touch Funktion
*/


.modalpopupartikelfilter input{
    max-width:80px;
}
.span12 .successmsg {
    border: 1px solid #009900;
    padding: 3px;
    font-weight: bold;
}

hr.black {
    background-color: black;
    height:1px;
}

/*.group .verfuegbar {
    background-color: #c9c9c9;
    border: 1px solid #ff0000;
}
.group .nicht-verfuegbar {
    background-color: #c2c2c2;
    border: 1px solid #ff0000;
}*/

/*
* {
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: -moz-none;
-o-user-select: none;
user-select: none;
}
 
input {
-webkit-user-select: text;
-khtml-user-select: text;
-moz-user-select: text;
-o-user-select: text;
user-select: text;
}
*/


