@charset "utf-8";
/* CSS Document */


.kat-results {width: 100%; text-align: right; font-size: 10px; color: #A3A3A3; margin-bottom: 10px; font-style: italic; box-sizing: border-box; padding-right: 1.25%;}

.katmenu {width: 80.125%; max-width: 1282px; margin: 0 0 40px 19.875%; display: none;}
a.katmenu-btn {padding: 3px 8px 4px 8px; border: 1px #babbbe solid; border-radius: 8px; color: #032b44; float: left; margin: 0 0.92879256% 24px 0.92879256%; box-sizing: border-box; text-decoration: none; font-size: 16px;}
a.katmenu-btn:hover, a.katmenu-btn:active {border: 1px #00adef solid; color: #00adef;}
.kb-selected {border: 1px #00adef solid!important; color: #00adef!important;}
@media screen and (max-width: 1585px){
	a.katmenu-btn {margin: 0 0.92879256% 12px 0.92879256%;}
}
@media screen and (max-width:900px){
	.katmenu {display: none;}
}

.katnav-produkt-master {width: 100%;}

.left-katmenu, .top-katmenu {width: 16.25%; max-width: 260px; float: left; box-sizing: border-box; border: 1px #babbbe solid; border-radius: 8px; background-color: #f3f3f3; padding: 20px 15px; margin-right: 3.125%;}
.left-katmenu h4, .top-katmenu h4 {color: #00adef; font-size: 20px; margin: 0 0 30px 0;}
.left-katmenu a, .top-katmenu a {color: #032b44; padding: 5px 0; width: 100%; border-bottom: 1px #babbbe solid; margin: 10px 0 10px 0; text-decoration: none; display: table; font-size: 16px;}
.left-katmenu a:hover, .leftkatmenu a:active, .top-katmenu a:hover, .top-katmenu a:active {color: #00adef;}
.sidemenu-selected {color: #00adef!important;}
.top-katmenu {display: none;}

.katprodukte-box {width: 80.625%; max-width: 1290px; float: left; box-sizing: border-box;}
.katprodukte {width: 21.89922457%; max-width: 282.5px; height: 22vw; float: left; margin: 0 1.55038758% 40px 1.55038758%; box-sizing: border-box; border: 1px #00adef solid; border-radius: 8px; padding: 20px 20px 30px 20px; position: relative; color: #096b90;}
/*  -webkit-box-shadow: -3px 3px 20px 0px rgba(204,204,204,1); -moz-box-shadow: -3px 3px 20px 0px rgba(204,204,204,1); box-shadow: -3px 3px 20px 0px rgba(204,204,204,1); */
.katprodukte .prod_name {height: 70px; line-height: 30px; position: relative; z-index: 10; overflow: visible;}
.katprodukte p {margin: 0 0 30px 0;}
.katprodukte .katzusatz {font-size: 12px; color: #00adef;}
.katprodukte .image {width: 100%; max-height: 347px; overflow: hidden; margin-bottom: 50px;}
.katprodukte .basket-btn {max-width: 26px; position: absolute; left: 20px; bottom: 20px; cursor: pointer;}
.katprodukte .right-btn {max-width: 26px; position: absolute; right: 20px; bottom: 20px; cursor: pointer;}
.katprodukte .basket-btn-de:hover::before, .katprodukte .right-btn-de:hover::before, .katprodukte .basket-btn-en:hover::before, .katprodukte .right-btn-en:hover::before {border: 1px #babbbe solid; background-color: #ffffff; color: #032b44; padding: 0 5px 3px 0; position: absolute; bottom: -25px; left: 50%; margin-left: -55px; width: 110px; text-align: center; font-size: 12px;}
.katprodukte .basket-btn-de:hover::before {content: "Angebot anfordern";}
.katprodukte .right-btn-de:hover::before {content: "Produktdetails";}
.katprodukte .basket-btn-en:hover::before {content: "Request a quote";}
.katprodukte .right-btn-en:hover::before {content: "Product details";}
@media screen and (max-width: 1130px){
	.katprodukte {width: 30.14%; max-width: 390px; height: 30vw;}
}
@media screen and (max-width: 965px){
	.katprodukte {height: 30vw;}
}
@media screen and (max-width: 900px){
	.katprodukte-box, .top-katmenu {float: none; width: 100%; max-width: none;}
	.top-katmenu {margin-right: 0; margin-bottom: 30px; display: block;}
	.top-katmenu .select-box {margin-bottom: 0;}
	.left-katmenu {display: none;}
	.katprodukte {height: 40vw;}
	.kat-results {margin-bottom: 0;}
}
@media screen and (max-width: 710px){
	.katprodukte {width: 45.50494456%; max-width: 303.7px; margin: 0 2.2475277% 30px 2.2475277%; height: 55vw;}
}
@media screen and (max-width: 455px){
	.katprodukte .prod_name {height: 60px; line-height: 20px; font-size: 15px;}
	.katprodukte p {line-height: 10px;}
	.katprodukte .basket-btn, .katprodukte .right-btn {max-width: 20px; bottom: 5px;}
	.katprodukte .basket-btn {left: 10px;}
	.katprodukte .right-btn {right: 10px;}
}
@media screen and (max-width: 400px){
	.katprodukte {height: 60vw;}
}

/* Download Button Datenblaetter */
.katprodukte .datendown-btn, .bild-preview .datendown-btn {line-height: 26px; background-color: #00adef; color: #ffffff; text-align: center; width: 100px; position: absolute; bottom: 25px; left: 50%; margin-left: -50px; cursor: pointer;}
.katprodukte .datendown-btn::before, .bild-preview .datendown-btn::before {content: "DOWNLOAD";}

/* Weiter Button */
button.page-selection-btn, button.page-selection-btn:active, button.page-selection-btn:visited, button.page-selection-btn:focus {-webkit-appearance: none; appearance: none; background-color: transparent; border: 0; border-width: 0; border-style: none; border-color: transparent;}
.page-selection {width: 80.625%; max-width: 1290px; margin-left: 19.375%;}
.page-selection-master {display: table; margin: 0 auto; border: 1px #00adef solid;}
.page-selection-btn {-webkit-appearance: none; appearance: none; width: 40px; line-height: 40px; height: 40px; color: #00adef; border-left: 1px #00adef solid!important; text-align: center; cursor: pointer; float: left;}
.page-selection-btn:first-child {border-left: 0 none!important;}
.page-selection-btn:hover, .ps-active {background-color: #00adef!important; color: #ffffff;}
@media screen and (max-width: 1138px){
	.page-selection {margin-left: auto; margin-right: auto; width: 100%;}
}
@media screen and (max-width: 1450px){
	.page-selection-master {border: 0 none;}
	.page-selection-btn {border-right: 1px #00adef solid!important; border-top: 1px #00adef solid!important; border-bottom: 1px #00adef solid!important; margin: 0 2px 4px 2px;}
	.page-selection-btn:first-child {border-left: 1px #00adef solid!important;}
}