/* Port of the original stylesheets/etherm/*.css (2010), IE hacks removed. */

html { height: 100%; font-family: Verdana, Tahoma, Arial, sans-serif; }
body { background-color: #fff; height: 100%; margin: 0; padding: 0; }
.noFloat { float: none; clear: right; }
.clearLeft { clear: left; }

/* mainLayout */
#mainLayoutLayer0 { min-height: 100%; position: relative; }
#mainLayoutLayer1 { position: relative; min-height: 100%; padding-bottom: 30px; }
#mainLayoutLayer2 { text-align: center; }
#mainLayoutLayer3 {
  min-height: 384px; margin: 0 auto; text-align: left; width: 1000px;
  background: url('/images/graph/banner.png') no-repeat top;
}
#logoLinkDiv, #logoLink { float: right; height: 147px; width: 255px; }
#logoLink { display: block; float: none; }

/* topMenu */
#topMenu { float: right; height: 30px; width: 402px; }
#topMenu img { border: 0; }

/* mainMenu */
#mainMenu { height: 40px; float: right; display: flex; }
#mainMenuLeftSide { height: 40px; width: 8px; background-image: url('/images/graph/mainmenu/leftending.png'); }
#mainMenuRightSide { height: 40px; width: 16px; background-image: url('/images/graph/mainmenu/rightending.png'); }
.mainMenuItem { height: 40px; background-image: url('/images/graph/mainmenu/background.png'); }
.mainMenuItemText { padding: 12px 10px 0 10px; float: left; }
.mainMenuItemText a { color: #fff; font-size: 11px; font-weight: bold; float: left; text-decoration: none; }
.mainMenuItemSeparator { height: 40px; width: 11px; background-image: url('/images/graph/mainmenu/separator.png'); float: left; }

/* footer */
#footer { height: 24px; width: 100%; position: absolute; bottom: 0; background-color: #fff; }
#footerContent, #footerContent a {
  margin: 2px auto 0; text-align: center; font-weight: bold; width: 1000px;
  font-size: 10px; color: #d57a17; text-decoration: none;
}
#footerSeparator { margin: 0 auto; width: 1000px; height: 5px; background-color: #d57a17; }
#footerMenu { width: 530px; float: left; }
#copyright { text-align: right; float: right; width: 220px; color: #d1d1d1; }
#footerFill { width: 230px; float: left; color: #d1d1d1; text-align: left; }
#footerFill a { color: #bcbbbb; }

/* mainBlock */
#mainBlock { width: 1000px; padding-top: 3px; }

/* leftColumn */
#leftColumn { width: 203px; float: left; }
#searchBoxContainer {
  border: solid #c8c8c8; border-width: 1px 1px 0 1px; width: 191px; margin-top: 2px;
  height: 38px; padding: 0 10px 0 0; font-size: 11px; background-color: #fff;
}
#searchBox form { margin: 0; padding: 0; }
#searchBox .inputbox {
  border: 1px solid #d1d1d1; float: left; margin: 7px 0 0 7px; font-size: 12px;
  height: 17px; width: 150px; padding: 0 0 0 2px;
}
#searchBox .submitButton {
  height: 28px; width: 25px; border: 0; margin: 2px 0 0 5px; padding: 0; float: left; cursor: pointer;
  background: url('/images/graph/searchButton.png') no-repeat top left;
}
#advancedSearch { margin: 0 0 0 5px; padding: 0 0 0 2px; }
#advancedSearch a { padding-left: 17px; font-weight: bold; font-size: 10px; color: #d57a17; text-decoration: none; }
#leftMenu { border: solid #c8c8c8; border-width: 1px 1px 0 1px; background-color: #fff; width: 201px; margin-top: 2px; min-height: 200px; }

.treeMenu { margin: 0; padding-left: 5px; }
.treeMenu li {
  list-style-type: none; padding-left: 30px;
  background: url('/images/graph/sideMenuArrow.png') no-repeat 0 7px;
}
.treeMenu li.glowne { background: none; padding: 5px 0 0 0; }
.treeMenu a, .treeMenu summary { color: #000; text-decoration: none; font-size: 12px; font-weight: bold; cursor: pointer; }
.treeMenu summary { list-style: none; }
.treeMenu summary::-webkit-details-marker { display: none; }
.treeMenu ul { margin: 0; padding: 0; }
.treeMenu ul li a { font-size: 11px; font-weight: normal; }

/* contentColumn */
#contentColumn { float: left; width: 585px; margin: 0 4px; min-height: 300px; }
#contentColumnHeader {
  width: 565px; height: 17px; color: #d57a17; padding: 8px 0 0 20px; font-size: 12px; font-weight: bold;
  background: url('/images/graph/textHeaderBackground.png') no-repeat; text-transform: uppercase;
}
#contentColumnHeader a { color: #d57a17; }
#contentColumnMiddle {
  width: 563px; border: solid #d1d1d1; border-width: 0 1px; background-color: #fff;
  padding: 0 10px 10px 10px; min-height: 390px; text-align: justify; font-size: 13px;
}
#contentColumnMiddle h4 { padding: 0; margin: 0; }
#contentColumnFooter { width: 585px; height: 17px; background: url('/images/graph/textHeaderBackgroundBottom.png'); }
.headerSeparator { height: 2px; background-color: #fff; width: 583px; border: solid #d1d1d1; border-width: 0 1px; padding: 5px 0 10px 0; }
.headerSeparatorPattern { height: 2px; background-image: url('/images/graph/textSeparator.png'); width: 563px; margin: 0 10px; }
.textSeparator { width: 500px; height: 2px; margin: 5px auto 10px; background: url('/images/graph/textSeparator.png'); }

/* rightColumn */
#rightColumn { width: 203px; float: right; padding-bottom: 30px; }

/* columnBoxes */
.columnRoundedHeaderBox { height: 35px; width: 203px; background: url('/images/graph/searchBoxBackground.png'); }
.columnRoundedFooterBox { height: 17px; width: 203px; background: url('/images/graph/roundedFooter.png'); margin: 0 0 4px 0; }
.columnRoundedHeaderBoxDot { background: url('/images/graph/dot.png') no-repeat 9px 9px; height: 35px; }
.columnRoundedHeaderBoxText { font-size: 12px; font-weight: bold; color: #d57a17; margin-left: 30px; padding-top: 10px; }
.columnContentBox {
  border: solid #c8c8c8; border-width: 1px 1px 0 1px; width: 181px; margin-top: 2px; min-height: 50px;
  padding: 10px 10px 0 10px; font-size: 11px; background-color: #fff; color: #000;
}
.columnContentBox a { color: #000; font-size: 11px; font-weight: bold; text-decoration: none; }
.hoverRow:hover { background-color: #e0e0e0; cursor: pointer; }

/* productsList */
.product { width: 100%; }
.productPicture { width: 180px; text-align: center; }
.productPicture img { border: 0; }
.productProperties, .productDescription { padding-left: 20px; vertical-align: top; width: 280px; }
.productDescription { padding-top: 10px; font-size: 10px; }
.propertyName { font-size: 10px; font-weight: bold; width: 120px; color: #d57a17; }
.propertyValue { font-size: 10px; }
.detailsLink { color: #000; font-size: 11px; font-weight: bold; text-decoration: none; }

/* productDetails */
.productDetailsProperties { padding-left: 20px; vertical-align: top; width: 280px; }
.productDetailsProperties .propertyName, .productDetailsProperties .propertyValue { font-size: 11px; }
.productDetailsDescription { padding: 5px 0 0 0; font-size: 11px; text-align: justify; }

/* tabs (kontakt, produkt) */
.tabs { display: flex; justify-content: center; margin-bottom: 10px; }
.tabs .side-l { height: 40px; width: 8px; background-image: url('/images/graph/mainmenu/leftending.png'); }
.tabs .side-r { height: 40px; width: 16px; background-image: url('/images/graph/mainmenu/rightending.png'); }
.tabs .sep { height: 40px; width: 11px; background-image: url('/images/graph/mainmenu/separator.png'); }
.tabs a {
  display: block; height: 16px; padding: 12px; width: 120px; background-image: url('/images/graph/mainmenu/background.png');
  color: #fff; font-size: 11px; font-weight: bold; text-align: center; text-decoration: none;
}
.tabs a:hover, .tabs a.selected { color: #000; }

/* filter form */
.filter_form { font-size: 11px; text-align: center; }
.filter_form select { font-size: 11px; width: 100%; }
.filter_form input { font-size: 11px; }
.pagination { font-size: 11px; text-align: right; }
.pagination a, .pagination span { margin-left: 4px; }
.pagination .current { font-weight: bold; }
.pagination .disabled { color: #999; }

/* lightbox (replaces lytebox) */
#lightbox { border: 3px solid #888; padding: 10px; text-align: center; font: 10px Verdana, sans-serif; max-width: 90vw; }
#lightbox::backdrop { background: rgb(0 0 0 / .8); }
#lightbox img { display: block; max-width: 85vw; max-height: 80vh; margin: 0 auto 6px; }
#lightbox nav { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
#lightbox button { border: 0; background: none; cursor: pointer; padding: 0; }

/* Narrow screens: one column, content first, side boxes below (side by side when there is room). */
@media (max-width: 1000px) {
  #mainLayoutLayer3, #mainBlock, #footerContent, #footerSeparator { width: auto; }
  #mainLayoutLayer3 { background-position: top right; }
  #topMenu { width: 100%; display: flex; justify-content: flex-end; overflow: hidden; }
  #mainMenu { float: none; clear: both; height: auto; flex-wrap: wrap; justify-content: center; }
  #mainMenuLeftSide, #mainMenuRightSide, .mainMenuItemSeparator { display: none; }
  .mainMenuItemText { padding: 12px 8px 0; }

  #mainBlock { display: flex; flex-wrap: wrap; gap: 0 8px; padding: 3px 8px 0; }
  #contentColumn { order: -1; flex: 1 1 100%; width: auto; margin: 0 0 8px; }
  #leftColumn, #rightColumn { flex: 1 1 260px; width: auto; float: none; padding-bottom: 0; }
  #contentColumnHeader, #contentColumnMiddle, .headerSeparator, .headerSeparatorPattern, #contentColumnFooter,
  .columnRoundedHeaderBox, .columnRoundedFooterBox, #searchBoxContainer, #leftMenu, .columnContentBox { width: auto; }
  #contentColumnHeader { height: auto; min-height: 17px; padding-right: 10px; }
  #contentColumnHeader, #contentColumnFooter, .columnRoundedHeaderBox, .columnRoundedFooterBox { background-size: 100% 100%; }
  .headerSeparatorPattern { margin: 0 10px; }
  .textSeparator { width: auto; max-width: 500px; }
  #contentColumnMiddle img, #contentColumnMiddle iframe { max-width: 100%; height: auto; }
  #contentColumnMiddle iframe { height: 350px; }
  .productProperties, .productDetailsProperties, .productDescription { width: auto; padding-left: 10px; }
  .productPicture { width: auto; }

  #footer { position: static; height: auto; }
  #footerFill, #footerMenu, #copyright { float: none; width: auto; text-align: center; padding: 4px 8px; }
  #mainLayoutLayer1 { padding-bottom: 0; }
}

/* Phones: Kontakt's two half-width columns stack. */
@media (max-width: 600px) {
  #dane > div { width: auto !important; float: none !important; }
  .tabs a { width: 90px; }
}