@media screen, print {
html, body {
	margin: 0;
	padding: 0;
	text-align: center;
	height: 100%;
  background-color:#d9dadc;
}

body {
	font: 11px Verdana, Arial, 'Helvetica', sans-serif;
  padding: 0;
  margin: 0;
  /*background:url(../ui-images/bg-all.png) no-repeat top left #d9dadc;
    war schon bei Giegler ein Fehlereintrag*/
}

h6 {
  color: #000;
  font-size: 11px;
  font-weight: normal;
  margin:0px;
  padding: 0px 0px 12px 0px;
}

h5 {
  color: #000;
  font-size: 11px;
  font-weight: normal;
  margin:0px;
  padding: 0px 0px 8px 0px;
  width: 100%;
  border-bottom: 1px solid black;
}

h4 {
    color: #000;
    font-size: 11px;
    font-weight: bold;
    margin:0px;
    padding: 0px 0px 8px 0px;
    width: 100%;
    border-bottom: 1px solid black;
}

h3 {
	background-color: #e0e0e0;
	color: #000;
	font-size: 12px;
	padding-top: 2px;
	padding-left: 1em;
	padding-bottom: -1em;
	padding-bottom: 2px;
	margin: 0px;
}

h2 {
    color: #444;
    font-size: 16px;
}

h1 {
  font-size: 28px;
  color: #a01010;
  font-weight: normal;
}

table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0px;
  border: none;
}

input {
	border: none;
	font-size:11px;
	padding-top: 2px;
	padding-bottom: 2px;
	margin-top: 2px;
	margin-bottom: 2px;
}

form {
  margin: 0px;
  padding: 0px;
}

p {
  margin-top: 8px;
  margin-bottom: 4px;
  padding: 0px;
}

.textOutput {
  border: 1px solid #eee;
  padding: 2px;
  background-color: #FFF;
}


.textInput {
  width: 205px;
  border: 1px solid #eee;
  padding: 2px;
  margin-right: 5px;
  background-color: #FFF;
}

.textInput2 {
  width: 312px;
  border: 1px solid #eee;
  padding: 2px;
  margin-right: 5px;
  background-color: #FFF;
}

.textInputOff {
  width: 220px;
  border: none;
  padding: 2px;
  background: transparent ;
}

.selectInput {
  width: 206px;
  margin-bottom: 10px;
  background-color: #fff;
	padding: 1px;
  font-size: 11px;
	border: 1px solid #eee;
}

.selectInput2 {
  width: 210px;
  background-color: #fff;
	padding: 2px;
  font-size: 11px;
	border: 1px solid #eee;
  margin-top: 2px;
  margin-bottom: 2px;
}

.selectInput3 {
  width: 320px;
  margin-bottom: 10px;
  background-color: #fff;
	padding: 1px;
  font-size: 11px;
	border: 1px solid #eee;
}

.selectInput4 {
  width: 640px;
  margin-bottom: 10px;
  background-color: #fff;
	padding: 1px;
  font-size: 11px;
	border: 1px solid #eee;
}

.checkInput {
  background: transparent ;
  vertical-align:middle;
}

.textAreaInput {
  width: 400px;
  border: 1px solid #eee;
  padding: 2px;
}

.plzInput {
  width: 55px;
  margin-right: 2px;
   border: 1px solid #eee;
}

.ortInput {
  width: 140px;
   border: 1px solid #eee;
}



.inputFocus {
    background-color: #f0f0f0;
    border: 1px solid #d0d0d0;
    padding: 2px;
     awidth: 200px;
}

.inputError {
	border: 1px solid #d11;
}

label {
	width: 200px;
  text-align:left;
}

a {
    text-decoration: none;
    color: #000;
}

ul {
  margin: 0px;
  padding: 0px;
}
li {
  list-style-type: none;
}

.divider {
  height:1px;
  width:100%;
  border-bottom: 1px solid black;
  margin: 8px 0px 8px 0px;
  padding: 0px;
}

.spacer {
  height:8px;
  width:100%;
  border-bottom: 1px solid transparent ;
  margin: 0px;
  padding: 0px;
}

.leftLabelCell {
	width: 218px;
}

.leftLabelCell2 {
	width: 98px;
}

.tabCell {
  width: 108px;
}

.checkCell {
  width: 10px;
  padding: 5px;
}


.submitButton, .submitButton200, .submitButton300  {
	background-color: #a01010;
	border: none;
	text-align:left;
	color: white;
  padding: 1px 3px 1px 3px;
	overflow: visible;
  cursor:pointer;
}

.submitButton {
  width: 100px;
}

.submitButton:hover, .submitButton200:hover, .submitButton300:hover {
	background-color: #ff0000;
}

.submitButton200 {
  width: 200px;
}

.submitButton300 {
  width: 318px;
}


.submitButton20 {
	background-color: #a01010;
	border: none;
  font-size: 1em;
	text-align:center;
	color: white;
  width: 20px;
  padding: 2px;
	overflow: visible;
}

.submitButton20:hover {
  background-color: #ff0000;
}

.darkGrey {
	background-color: #585858;
}

.black {
	background-color: #000000;
	color: #ffffff;
}

.red {
	background-color: #a01010;
	color: #ffffff;
}

.blue {
  background-color: #2040FF;
  color: #ffffff;
}

.black {
	background-color: #000;
	color: #ffffff;
}

.redtext {
  color: #9d0d16;
}

.grey {
	background-color: #d0d4d8;
	color: #444;
}

.paging {
  margin-top: 8px;
  width: 99%;
  afloat: left;
}

.vAlignTop {
  vertical-align: top;
}

.sortBox {
  margin: 0px 0px 0px 440px;
}

.sortBox input {
  vertical-align: middle;
  padding: 0px;
  margin: 0px;
}

.oneRow {
  padding: 2px;
  margin: 0px;
}

.dateField {
  vertical-align: top;
  border: none;
  margin: 0px;
  padding: 2px;
  height: 16px;
}

.nobr {
  white-space: nowrap
}

.kundartbez {
  color: blue;
  font-weight: bold;
}


/*
 * Der Wrapper umgibt alle anderen Container, ist also der Root und in layout.jsp eingesetzt.
 */
#wrapper {
	position: relative; /* adding position: relative allows you to position the two sidebars relative to this container */
	width: 1100px;  
	margin: 0 auto 0 0; /* the auto margins (in conjunction with a width) center the page */
	text-align: left; /* this overrides the text-align: center on the body element. */
        padding: 0;
  background-color: #d9dadc;;
}

#headerPanel {
	height: 150px; /* if you're changing the source order of the columns, you'll may want to use a height on the header so that you can give the columns a predictable top value */
	background:  no-repeat top left;
  overflow: hidden;
	padding: 0 10px 0 20px;  /* this padding matches the left alignment of the elements in the divs that appear beneath it. If an image is used in the #header instead of text, you may want to remove the padding. */
}

/*
 * Top Navigation. Die Links mit den abgerundeten Tabs als Hintergrund.
 */

/*
#topNavigation {
	width: 100%;
	height: 4000px;
	width: 100%;
  overflow: hidden;
	margin-left: 256px;
	padding-bottom: 0px;
	margin-bottom: 10px;
	position:absolute;
	top: 118px;
	left:0px;
	z-index:2;
}
*/

.topcat {
	display:block;
	position:absolute;
	z-index:100;
	width:100px;
  top: 105px;
}

.topcathead {
	position:relative;
	z-index:101;
	height: 36px;
  background:url(../ui-images/roundtab.png) no-repeat top right;
}

.topcatheadlink  {
  display: block;
  color:white;
  padding-left: 5px;
  padding-top: 5px;
}

.topcatcontent {
	position:relative;
	top: 0px;
	background:#d9dadc;
  aborder: 1px solid #f00;
	z-index:102;
  width:650px;
  display:none;
}

.topcatcontent ul li {
  line-height: 18px;
  padding-left: 10px;
}

.topcatcontent ul li a {
  color:#666
}

.topcatcontent ul li a:hover {
  color:#000;
}



/*
 * Das Sidepanel auf der linken Seite
 */
#sidePanel {
	/*color: #d9dadc;*/
  color: #fff;
	position: absolute;
  padding-top: 0px;
  margin-top: 0px;
	top: 149px;
	left: 0;
	width: 220px; /* the actual width of this div, in standards-compliant browsers, or standards mode in Internet Explorer will include the padding and border in addition to the width */
	background-color: #d9dadc;; /* the background color will be displayed for the length of the content in the column, but no further */
}

#sidePanel input {
	width: 100px;
}

#sidePanel a:hover {
    color: #fff;
}

#sidePanel #login {
	padding-top: 10px;
  padding-right: 10px;
	padding-bottom: 2px;
  aborder: 1px solid red;
  height: 100px;
}

#sidePanel #search {
	padding-top: 6px;
	padding-bottom: 6px;
	margin-top: 8px;
  height: 44px;
}

#sidePanel #search input {
	awidth: 100px;
}

#sidePanel #search table {
	width: 100%;
}

#sidePanel #miniCart {
	background-color: #d9dadc;
	color: #444;
  font-size: 11px;
  overflow: hidden;
}

#sidePanel #miniCart .red {
  border-bottom: 1px solid white;
}

#sidePanel #miniCart td {
	padding: 2px 2px 2px 2px;
}

#sidePanel #miniCart a {
	color: #ffffff;
    text-decoration: none;
}

#sidePanel .myAccount {
  margin-top: 8px;
  margin-bottom: 8px;
}

#sidePanel .categories {
  margin-top: 8px;
  margin-bottom: 8px;
}

#sidePanel #kategorienBox {
  margin-bottom: 8px;
}

.sidebarbox {
	background-color: #585858;
	padding-left: 10px;
  padding-right: 5px;
  height: 15px;
  margin-top: 1px;
  overflow: hidden;
}

.sidebarboxtall {
	background-color: #585858;
	padding-left: 10px;
  padding-right: 5px;
  padding-top: 5px;
  padding-bottom: 5px;
  height: 64px;
  margin-top: 1px;
}

.selectKst {
  font-size: 11px;
  position: relative;
  width: 202px;
  margin-top: 1px;
}

.tabWidth {
  width: 110px;
}

.tabWidthDouble {
  width: 220px;
}

.sidebarbox a {
  /*color: #D9DADC;*/
  color: #fff;
}

.level1 {
	background-color: #d9dadc;
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 2px;
	padding-bottom: 2px;
	margin-top: 0px;
	margin-bottom: 0px;
  color: #000;
}

.level1 a {
  font-size:11px;
  color: #000;
}

#kategorienBox .level1 a:hover, #accountBox .level1 a:hover {
  font-weight: bold;
  color: #000;
}

.closedBox {
  background-color: #585858;
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 2px;
	padding-bottom: 2px;
	margin-top: 1px;
	margin-bottom: 1px;
	background-image: url(../ui-images/plus.png);
	background-position:206px 4px;
	background-repeat: no-repeat;
}

.openedBox {
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 2px;
	padding-bottom: 2px;
	margin-top: 1px;
	margin-bottom: 2px;
	background-color: #a01010;;
	background-image: url(../ui-images/arrow.png);
	background-position:206px 4px;
	background-repeat: no-repeat;
  color:#fff;
}

.toggleBox {
  /*color: #D9DADC;*/
  color: #fff;
}

.transparentLink {
  color: #d9dadc;
  border: none;
  text-decoration:none;
  cursor:pointer;
}

#fillboxcontent {
	background-color: #585858;
	height: 176px;
	margin: 8px 256px 0px 256px;
}

#fillboxsidebar {
	background-color: #585858;
	height: 238px;
	margin: 8px 0px;
}

#fillboxagb {
	background-color: #585858;
	height: 150px;
	margin: 10px 0px;
}

#fillboxagb p {
	font-size: 9px;
	padding: 10px 12px 20px 12px;
}

#fillboxagb a {
	color: #ddd;
}

#contentPanel {
  margin: 0px 220px; /* the right and left margins on this div element creates the two outer columns on the sides of the page. No matter how much content the sidebar divs contain, the column space will remain. */
  padding: 0px 0px 0px 10px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
  aborder: 1px solid red;
  aheight: 600px;
  background: #d9dadc;
}

#content {
  background-color: #d9dadc;
  padding-bottom: 40px;
}

#contentPanel a.redlink {
	color: #ff0000;
}

#contentPanel a.redlink:hover {
	color: #000;
  font-weight:bold;
}

#contentPanel a.blacklink {
  color: #000;
  font-weight:bold;
}

#welcomeDialog {
  text-align: left;
}


#rightPanel {
	color: #fff;
	text-align: right;
	position: absolute;
	top: 150px;
	right: 0;
	width: 220px; /* the actual width of this div, in standards-compliant browsers, or standards mode in Internet Explorer will include the padding and border in addition to the width */
}

#rightPanel p {
	margin-left: 16px;
	width: 220px;
}

#angebote {
	background-color: #ffffff;
	background-image:url(../images/AktuelleAngebote_246.jpg);
	background-position: top;
	background-repeat:no-repeat;
  margin-left: 10px;
  margin-bottom: 8px;
	width: 210px;
	height: 180px;
}

#angebote a {
  text-decoration: none;
  border: none ;
}

#angebote a img {
  border: none ;
}

#zubehoersuche {
	margin-bottom: 8px;
  margin-left: 10px;
  width: 210px;
	background-color: #9d0a0e;
	background-image:url(../images/Zubehoer_246.jpg);
	background-position:top;
	background-repeat:no-repeat;
}

#zubehoersuche p {
	padding-top: 40px;
	padding-bottom: 20px;
	margin: 0px;
}
#services {
	margin-bottom: 8px;
  margin-left: 10px;
  width: 210px;
	background-color: #9d0a0e;
	background-image:url(../images/Service_246.jpg);
	background-position:top;
	background-repeat:no-repeat;
}

#services p {
	padding-top: 40px;
	padding-bottom: 20px;
	margin: 0;
}

.sidebartext {
	display:block;
	widht: 140px;
	height: 40px;
	color:white;
	text-align: right;
	padding-right: 10px;
	padding-top: 38px;
	padding-bottom:16px;

}

#freecall {
	margin-bottom: 8px;
}

#schnaeppchen {
	margin-bottom: 8px;
}

#schnaeppchen a {
  text-decoration: none;
  border: none ;
}

#schnaeppchen img {
  border: none ;
}

.sidebarboxright {
	background-color: #9d0a0e;
	padding-right: 10px;
  padding-top: 1px;
	border-top: 1px solid white;
	text-align: right;
}

.sidebarboxright a {
	color: #fff;
}

.sidebarboxright a:hover {
	color: #ddd;
}



#homeaktionen {
	width: 320px;
	height: 414px;
	background-color:#FC0;
  position: absolute;
  top: 338px;
  left: 230px;
}

#homeaktionen .homefttext, #homeneuheiten .homefttext  {
	display:block;
	height: 40px;
	color:white;
	text-align: right;
	padding-right: 10px;
	padding-top: 45px;
	padding-bottom:16px;
}


#homeneuheiten {
	width: 320px;
	height: 414px;
	background-color:#FC0;
  position: absolute;
  top: 338px;
  left: 560px;
}

#hometitel img {
  border: none;
}



#shoppingCart .mengenInput {
  width: 70%;
  margin-left: 5px;
  margin-right: 5px;
  
}

.shoppingCartTable tr td, .shoppingCartTable tr th {
  border-right: 1px solid #c0c0c0;
  border-bottom: 1px solid #eee;
  padding: 2px;
  vertical-align: top;
}





#catalogue .leftList {
	float: left;
	width: 250px;
	margin-left: 40px;
	margin-bottom: 20px;
}

#catalogue .rightList {
	width: 250px;
	margin-left: 40px;
	margin-bottom: 20px;
}

#catalogue ul {
	margin: 0px;
	padding: 0;
	list-style: none;
	list-style-position: inside;
}


/* 
 * ---------------------------------------------------------------------------------------
 * ENDE: Katalog
 * ---------------------------------------------------------------------------------------
 */ 


/* 
 * ---------------------------------------------------------------------------------------
 * Start: Einkaufslisten
 * ---------------------------------------------------------------------------------------
 */ 

#einkaufslisten .actionTable {
   margin: 15px 0px 15px 0px;  
}

#einkaufslisten table.actionTable td  {
  margin-right: 10px;
}

.popUpHolder {
	border-top: 1px solid white;
	border-left: 1px solid white;
	border-right: 1px solid #aaa;
	border-bottom: 1px solid #aaa;
	background-color:#eee;
	padding: 5px;
}

/* 
 * ---------------------------------------------------------------------------------------
 * Ende: Einkaufslisten
 * ---------------------------------------------------------------------------------------
 */ 

 .leftIntend {
 	padding-left: 10px;
 }

.tAlignRight {
 	text-align: right;
}

.tAlignCenter {
 	text-align: center;
}

.tAlignLeft {
 	text-align: left;
}

.fullTable {
  width: 650px;
}

.halfTable {
  width: 320px;
  margin-bottom: 11px;
}

.borderTopBottom {
  border-top: 1px solid black;
  border-bottom: 1px solid black;
}

.borderBottom {
  border-bottom: 1px solid black;
}

.borderTopBottomRed {
  border-top: 1px solid red;
  border-bottom: 1px solid red;
}

.tableHeader {
  font-weight: normal;
  text-align: left;
  background-color: #D0E0Ff;
  background-color: #FFF;
  border-bottom: 1px solid #eee;
  height: 30px;
  vertical-align: bottom;
}

.tableInfo {
  font-size: 10px;
  background-color: #c0e0ff;
  color: #000;
  line-height: 24px;
}

.tableFooter {
  font-weight: bold;
  background-color: #D0E0Ff;
  background-color: #FFF;
  border-top: 1px solid #eee;
  height: 30px;
}

.info {
  line-height: 1.3em;
}

.smallText {
  font-size: 11px;
}

.even {
  background-color: #fefefe;
}

.odd {
  background-color: #fafaff;
}

.fieldError {
    color: red;
    margin-left: 10px;
    display: inline;
    margin-top: 0px;
    padding-top: 0px;
    width: 200px;
}

.fieldErrorInput {
    border-color: #fee;
    width: 200px;
}

.imageLink {
  border: none;
}

.imageSpacing {
  margin-top: 5px;
  margin-bottom: 5px;
}

.boldText {
  font-weight:bold;
}

.textUeberschrift {
  font-weight:bold;
  line-height: 24px;
}

/*
 * ---------------------------------------------------------------------------------
 * Definitionen für die Artikeldarstellung in Listen. Header-Cells und andere Cells
 * ---------------------------------------------------------------------------------
 */
 
.artikelTable {
  width: 650px;
}

.artikelTable tr td {
   vertical-align: top;
   padding-top: 6px;
}

.artikelTable tr th {
   vertical-align: middle;
   border-bottom: 1px solid black;
   height: 30px;
}

.artikelTable tr td input {
   margin: -1px 1px 0px 5px;
   text-align: right;
}

.artikelBezCell {
  width: 386px;
}

.artikelDetailBeschriebCell {
  width: 324px;
}

.artikelBeschriebCell {
  width: 220px;
}

.sortierenCell {
   width: 108px;
}

.imageCell {
  width: 170px;
  text-align: center;
  cursor:pointer;
}

.veCell {
  width: 40px;
  text-align: right;
}

.meCell {
  width: 40px; 
}

.preisCell {
  width: 50px;
  text-align: right
}

/* Darstellung Mengen */
.mengeCell {
  width: 60px;
  text-align: right;
}
/* Darstellung für die Icons rechts */
.iconCell {
  width:55px;
  text-align:right;
}

.thirdCell {
  width: 34%;
}

.selectCell {
  width: 20px;
}

.inputCell {
  width: 200px;
}

.dateCell {
  width: 40px;
}

.tilesColumCell {
  width: 100px;
}

/* Darstellung für die Icons rechts */
.gesamtpreisCell {
  width:30px;
  text-align: right;
}

.aufnrCell {
  width: 70px;
}

.dateCell {
  width: 90px;
}

.statusCell {
  width: 180px;
}

.bemerkungenCell {
  width: 260px;
  font-size: 11px;
  padding-left: 5px;
  border-left: 1px solid #bbb;
}

/* Darstellung für das Bild */
.artikelTable tr .artikelImageCell {
  vertical-align: middle;
  abackground-color: White;
}

.artikelImageCell img{ 
  vertical-align: middle;
  display: block;
  margin: auto auto 0 auto;
  background-color: white;
  padding: 0px;
}

.void {
  border: none;
  color:#d9dadc;
}

.katgliedImage {
  border: none;
  height: 25px; /* 24.05.10 pg höhe standardisiert */
}

#imageLoader {
  border: 3px solid white;
  background-color: #eee;
  display:none;
  z-index:1000;
  position:absolute;
  top:20px;
}

#imageLoader.imageLoading {
 
}


.bgPanel {
  background: #d9dadc;
  width: 100%;
  height: 100%;
  clear:both;
}

/* col to display the colums in the catalogue and the index */
.col {
  width: 219px;
  overflow:hidden;
  margin: 0px;
  padding: 0px;
  float:left;
}

.colright {
  width: 200px;
  overflow:hidden;
  margin: 0px;
  padding: 0px;
  float:left;
}

.col ul, .colright ul {
  margin-top: 10px;
}

.col ul li, .colright ul li {
  line-height: 18px;
}

.col ul li:hover, .colright ul li:hover {
  line-height: 18px; 
  color: #000;
  font-weight:bold;
}

/* col to display the colums in the catalogue and the index */
.topcol {
  width: 220px;
  overflow:hidden;
  float:left;
  background-color:#d9dadc;
  font-size:11px;
}

.topcol a {
  color: #000;
}

.topcol a:hover {
  font-weight:bold;
}

.topcol ul {
  margin-top: 10px;
  margin-left: 0px;
  padding-left: 0px;
}

.topcol ul li {
  line-height: 18px;
  margin-left: 0px;
  padding-left: 0px;
}

.defaultColumn {
  width: 200px;
}

.loader {
  width: 25px;
}

.statSheetTable {
  width: 650px;
  max-height:400px;
  overflow:auto;
  padding: 10px 0px 30px 0px;
}

.statCell {
  width: 108px;
  text-align: right;
  vertical-align:top;
}
/*
 * ---------------------------------------------------------------------------------
 * ENDE: Definitionen für die Artikeldarstellung in Listen. Header-Cells und andere Cells
 * ---------------------------------------------------------------------------------
 */



/*
 * ---------------------------------------------------------------------------------
 * Definitionen für die Artikeldarstellung in Listen. Header-Cells und andere Cells
 * ---------------------------------------------------------------------------------
 */
 
.multipleSelect {
   width: 318px;
   height: 140px;
   border: 1px solid #808080;
}

#backgroundPopup{  
  display:none;  
  position:fixed;  
  _position:absolute; /* hack for internet explorer 6*/  
  height:100%;  
  width:100%;  
  top:0;  
  left:0;  
  background:#000000;  
  border:1px solid #cecece;  
  z-index:1;  
}

#agb {
 
}

#agb li {
  list-style-type: decimal;
  padding: 5px;
  font-size: 11px;
  line-height: 18px;
}

#dialog ul li {
	text-align:left;
	list-style-type:circle;
  margin-left: 10px;
  padding: 2px;
}

#validationDialog ul li {
	text-align:left;
	list-style-type:circle;
  margin-left: 10px;
  padding: 2px;
}
}

@media print {

  #sidePanel {
    display:none;
  }
  
  #rightpanel {
    display:none;
  }
  
  #topNavigation {
    display:none;
  }
  
  #headerPanel{
    display:none;
  }
  
  #contentPanel {
    width: 780px;
    margin:0 0;
    padding:0 10px;
  }
}