/* Copyright 2019 WEBMARX Digital Agentur | https://www.ebay.de/str/webmarx | eBay Auktionsvorlage Blanco V.1.0 */                    

.container-fluid > *, .row > * {margin:0; padding:0; font-family: 'Heebo', sans-serif;}
.container {margin:0 auto;}
    
/* HEADER */
.header {padding:30px 0;}
.logo {margin:0; padding:0; text-align: center;}
.logo img {margin:0 auto; max-width: 240px;}

/* KATEGORIEN */
.kategorien {background:#fff; border-top:1px solid #e9e9e9;}
.kategorien-table {display:table; margin: 0 auto;}
.kategorien ul {margin:0 auto; padding:0; height:60px; list-style:none; position: relative;} 
.kategorien ul li {display:inline; float:left; margin:0; padding:0 10px; list-style-type:none; line-height:60px; border-top:2px solid rgba(0,0,0,0); position: relative; top:-4px;} 
/* HOVER */
.kategorien ul li a {margin:0; padding:0; color:#444; font-size:13px; font-weight:600; letter-spacing: 1.2px; text-transform: uppercase; text-decoration: none; display: inline-block; vertical-align: middle; -webkit-transform: perspective(1px) translateZ(0); transform: perspective(1px) translateZ(0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); position: relative; overflow: hidden;}
.kategorien ul li a:before {content: ""; position: absolute; z-index: -1; left: 0; right: 100%; top: 0; background: #000; height: 2px; -webkit-transition-property: right; transition-property: right; -webkit-transition-duration: 0.4s; transition-duration: 0.4s; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out;}
.kategorien ul li a:hover:before, .kategorien ul li a:focus:before, .kategorien ul li a:active:before {right: 0;}    
/* DIVIDER */
.kategorien ul li:before {margin:0; padding:0 20px 0 0; content:'/'; color:#e9e9e9;}  
.kategorien ul li:first-child:before {content:'';}  
/* DROPDOWN*/
.kategorien ul ul {display:none; position:absolute; height:auto; background:#fff; top:60px; z-index:16; list-style-type: none; box-shadow:0 5px 10px rgba(0,0,0,0.02);}
.kategorien ul li:hover > ul {display:inherit;}
.kategorien ul ul li {min-width:100%; width:auto; float:none; display:block; position: relative; font-weight:600; color:#444; text-transform: uppercase; padding:15px 0; margin:0; font-size:13px; background:#fff; list-style-type: none; line-height:40px;}
.kategorien ul ul li:before, div.kategorien ul ul li a:before {display:none;}
.kategorien ul ul li a {display:block; margin:0; font-size:13px; padding:0 30px; font-weight:600; color:#444!important; text-transform: uppercase; line-height: 1.1;}
.kategorien ul ul li:hover {background:#444; color:#fff;}
.kategorien ul ul li:hover a {color:#fff!important; text-decoration: none;}

/* SLIDER */
.slider-bg {margin:0 0 30px 0; padding:0; background:#fff; overflow: hidden;}
.carousel {position: relative; margin:0;}
.slider-inner {position: relative; overflow: hidden; width: 100%;}
.slider-open:checked + .slider-item {position: relative; opacity: 100;}
.slider-item {position: absolute; opacity: 0; -webkit-transition: opacity 0.6s ease-out; transition: opacity 0.6s ease-out; text-align: center;}
.slider-item img {display: block; height: auto; max-width: 100%; margin:0 auto;}
.slider-control {opacity: 0; background: rgba(0, 0, 0, 0.1); border-radius: 50%; color: #fff; cursor: pointer; display: none; font-size: 40px; height: 40px; line-height: 35px; position: absolute; top: 50%; -webkit-transform: translate(0, -50%); cursor: pointer; -ms-transform: translate(0, -50%); transform: translate(0, -50%); text-align: center; width: 40px; z-index: 10;}
.slider-bg:hover .slider-control {opacity:1;}
.slider-control.prev {left: 1%;}
.slider-control.next {right: 1%;}
.slider-control:hover {background: rgba(0, 0, 0, 0.2); color: #fff;}
	#carousel-1:checked ~ .control-1,
	#carousel-2:checked ~ .control-2,
	#carousel-3:checked ~ .control-3,
	#carousel-4:checked ~ .control-4 {display: block;}
.slider-nav {opacity: 0; list-style: none; margin: 0; padding: 0; position: absolute; bottom: 2%; left: 0; right: 0; text-align: center; z-index: 10;}
.slider-bg:hover .slider-nav {opacity: 1;}
.slider-nav li {display: inline-block; margin: 0 5px;}
.slider-bullet {color: #fff; cursor: pointer; display: block; font-size: 35px;}
.slider-bullet:hover {color: #aaaaaa;}
#carousel-1:checked ~ .control-1 ~ .slider-nav li:nth-child(1) .slider-bullet,
#carousel-2:checked ~ .control-2 ~ .slider-nav li:nth-child(2) .slider-bullet,
#carousel-3:checked ~ .control-3 ~ .slider-nav li:nth-child(3) .slider-bullet,
#carousel-4:checked ~ .control-4 ~ .slider-nav li:nth-child(4) .slider-bullet {color: #ccc;}

/* ARTIKELBILDER */
img {max-width:100%; height:auto}
.artikelbilder.galerie {display:inline-block; position:relative; width:100%; height:auto; text-align: center;}   
.artikelbilder.galerie > .anker {display:none;}
.artikelbilder.galerie > ul {position:relative; z-index:1; font-size:0; line-height:0; margin:0 auto; padding:0; height:auto; overflow:hidden; white-space:nowrap;}
.artikelbilder.galerie > ul > .slide.img img {width:100%; height:auto;}
.artikelbilder.galerie > ul > .slide {position:relative; display:inline-block; width:100%; height:auto; overflow:hidden; line-height: normal; white-space: normal; vertical-align:top; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0);}
/* Thumbnails */
.artikelbilder.galerie > .thumb {position:absolute; left:0; width:100%; height:auto; z-index:6; text-align:center;}
.artikelbilder.galerie > .thumb > div {margin-left:-50%; width:100%;}
.artikelbilder.galerie > .thumb > label {position:relative; display:inline-block; cursor:pointer;}
.artikelbilder.galerie > .thumb {bottom:5px; margin-bottom:5px;}
.artikelbilder.galerie > .thumb > label {border-radius:50%; margin:0 5px; padding:9px; background:none;}
.artikelbilder.galerie > .thumb > label > .anker {position:absolute; left:50%; top:50%; margin-left:-2px; margin-top:-2px; background: transparent; border-radius: 50%; padding: 2px;}
.artikelbilder.galerie > .thumb > label:hover > .anker,
.artikelbilder.galerie > #slide1:checked~.thumb > label.pic1>.anker, .artikelbilder.galerie > #slide2:checked~.thumb > label.pic2>.anker,
.artikelbilder.galerie > #slide3:checked~.thumb > label.pic3>.anker, .artikelbilder.galerie > #slide4:checked~.thumb > label.pic4>.anker, 
.artikelbilder.galerie > #slide5:checked~.thumb > label.pic5>.anker, .artikelbilder.galerie > #slide6:checked~.thumb > label.pic6>.anker, 
.artikelbilder.galerie > #slide7:checked~.thumb > label.pic7>.anker, .artikelbilder.galerie > #slide8:checked~.thumb > label.pic8>.anker, 
.artikelbilder.galerie > #slide9:checked~.thumb > label.pic9>.anker, .artikelbilder.galerie > #slide10:checked~.thumb > label.pic10>.anker, 
.artikelbilder.galerie > #slide11:checked~.thumb > label.pic11>.anker, .artikelbilder.galerie > #slide12:checked~.thumb > label.pic12>.anker, 
.artikelbilder.galerie > #slide13:checked~.thumb > label.pic13>.anker, .artikelbilder.galerie > #slide14:checked~.thumb > label.pic14>.anker, 
.artikelbilder.galerie > #slide15:checked~.thumb > label.pic15>.anker, .artikelbilder.galerie > #slide16:checked~.thumb > label.pic16>.anker {background:none;}
.artikelbilder.galerie {height: auto; max-height: auto; margin-bottom:0; text-align: center;}
.artikelbilder.galerie img {border-radius: 3px;}
.artikelbilder.galerie .thumb {position:relative; width: 100%; text-align: left; margin-top: 10px;}
.artikelbilder.galerie > .thumb > label {box-sizing: border-box; border-radius: none; margin: 0 auto; padding:5px; background: none; text-align: center;}
.artikelbilder.galerie > .thumb > label img {margin:0 auto; max-height:115px; width:auto;}
.artikelbilder.galerie > ul > .slide.img img {width: auto; max-width: 100%; max-height: 100%; margin:0 auto;}
.artikelbilder.galerie > ul > .slide {text-align:center;}
.artikelbilder.galerie img {box-shadow: none; width:100%; height:auto; max-width:100%;}
/* Original-Bild */ 
.artikelbilder.galerie > #slide1:checked~ul > .slide.pic1, .artikelbilder.galerie > #slide2:checked~ul > .slide.pic2,
.artikelbilder.galerie > #slide3:checked~ul > .slide.pic3, .artikelbilder.galerie > #slide4:checked~ul > .slide.pic4, 
.artikelbilder.galerie > #slide5:checked~ul > .slide.pic5, .artikelbilder.galerie > #slide6:checked~ul > .slide.pic6, 
.artikelbilder.galerie > #slide7:checked~ul > .slide.pic7, .artikelbilder.galerie > #slide8:checked~ul > .slide.pic8, 
.artikelbilder.galerie > #slide9:checked~ul > .slide.pic9, .artikelbilder.galerie > #slide10:checked~ul > .slide.pic10, 
.artikelbilder.galerie > #slide11:checked~ul > .slide.pic11, .artikelbilder.galerie > #slide12:checked~ul > .slide.pic12, 
.artikelbilder.galerie > #slide13:checked~ul > .slide.pic13, .artikelbilder.galerie > #slide14:checked~ul > .slide.pic14, 
.artikelbilder.galerie > #slide15:checked~ul > .slide.pic15, .artikelbilder.galerie > #slide16:checked~ul > .slide.pic16 {opacity:1; z-index:2;}
/* Animations */
.artikelbilder.galerie > ul > .slide {display:inline-block; position:absolute; left: 0; top: 0; opacity: 0; z-index: 1; -webkit-transition: opacity 1250ms ease; transition: opacity 1250ms ease; -webkit-transform: rotate(0deg); transform: rotate(0deg);}
@-webkit-keyframes fade {
0%, 37.254901960784316%, 100% {opacity: 0;}
12.254901960784315%,25% {opacity: 1;}
0%,24.999% {z-index: 2;}
25.001%,100% {z-index: 1;}
}   
@keyframes fade {
0%, 37.254901960784316%, 100% {opacity: 0;}
12.254901960784315%,25% {opacity: 1;}
0%,24.999% {z-index: 2;}
25.001%,100% {z-index: 1;}
}
/* Größe */
.artikelbilder.galerie {max-width:520px;}
.artikelbilder.galerie > ul {height:520px;}
.artikelbilder.galerie > ul > .slide.img img {max-height:520px; width:auto; margin:0 auto;}
.artikelbilder.galerie > .thumb > label img {max-height:115px; width:auto; margin:0 auto;}
@media (min-width:992px) and (max-width: 1200px) {
.artikelbilder.galerie {max-width:400px;}
.artikelbilder.galerie > ul {height:400px;}
.artikelbilder.galerie > ul > .slide.img img {max-height:400px; width:auto; margin:0 auto;}
.artikelbilder.galerie > .thumb > label img {max-height:80px; width:auto; margin:0 auto;}
}   
@media (max-width: 768px) { 
.artikelbilder.galerie {max-width:300px;}
.artikelbilder.galerie > ul {height:300px;}
.artikelbilder.galerie > ul > .slide.img img {max-height:300px; width:auto; margin:0 auto;}
.artikelbilder.galerie > .thumb > label img {max-height:55px; width:auto; margin:0 auto;}
} 

/* ARTIKELBESCHREIBUNG */
.artpic {margin:0; padding:0 20px; text-align: center;}
.dsc {margin:0; padding:10px 0 20px 0; letter-spacing: 1.2px; font-weight:400; color:#444; font-size:15px; text-align: left;}
.dsc p, .tab-content p {margin:0; padding: 0 0 20px 0; letter-spacing: 1.2px; font-weight:400; color:#444; font-size:15px;}
.dsc h1, .tab-content h1, .dsc h2, .tab-content h2, .dsc h3, .tab-content h3, .dsc h4, .tab-content h4 {margin:0; padding:0 0 10px 0;}
.tab-content h1, .tab-content h2, .tab-content h3, .tab-content h4 {margin:10px 0 0 0; padding:0 0 10px 0;}
.dsc h1, .tab-content h1 {color:#000; font-size:20px; font-weight:600; letter-spacing: 1.2px;} 
.dsc h2, .tab-content h2 {color:#000; font-size:18px; font-weight:400; letter-spacing: 1.2px;} 
.dsc h3, .tab-content h3 {color:#000; font-size:16px; font-weight:400; letter-spacing: 1.2px;} 
.dsc h4, .tab-content h4 {color:#000; font-size:14px; font-weight:400; letter-spacing: 1.2px;} 
.dsc h1:after {display:block; content:''; width:120px; height:1px; background:#e9e9e9; padding:0; margin:10px 0;}
/* LISTEN */
.dsc ul, .tab-content ul {margin:0 0 20px 0; padding:0;}
.dsc ul li, .tab-content ul li {margin:0; padding:0.7em 0; list-style-type: none; letter-spacing: 1.2px; font-weight:400; color:#444; font-size:13px; text-align: left; text-indent:-0.95em; padding-left:1.2em; border-bottom:1px dotted #f5f5f5;}
.dsc ul li:last-child, .tab-content ul li:last-child {border:none;}
.dsc ul li:before, .tab-content ul li:before {font-family: 'FontAwesome'; content: '\f105'; font-size:13px; padding-right:7px; color:#ccc;}  
/* VARIANTEN */
.dsc span.var {display:inline-block; min-width:60px; padding:10px; margin:3px 5px; color:#444; border:1px solid #f5f5f5; text-align: center; cursor: default; background:#fff; box-shadow:0 2px 2px rgba(0,0,0,0.03); transition:all 0.3s ease;}    
.dsc span.var:hover {background:#444; color:#fff; transition:all 0.3s ease;}     
   
/* BUTTONS */
.kaufenbox {margin-top:20px; padding:25px 20px; background:#fff;}
.preis {margin:0; padding:0 10px 0 0; cursor:default;}
.preis h1 {margin:0; padding:0; color:#000; font-size:30px; font-weight:600; text-align:left;}
.preis h1:after {display:none;}
.preis h2 {margin:0; padding:5px 0 0 0; color:#999; font-size:12px; font-weight:300; text-align:left;}
a.skb {display:block; margin:0 0 10px 0; line-height:50px; color:#fff; text-align:center; background:#000; -webkit-border-radius: 1px; -moz-border-radius: 1px; border-radius: 1px; font-weight:300; text-decoration:none!important; text-transform: uppercase; letter-spacing: 1.2px; transition:all 0.3s ease;}
a.skb:hover {background:#444; color:#fff; transition:all 0.3s ease;}
a.beo, a.fsb {display:inline-block; margin:0; padding:0 15px 0 0; color:#999; font-weight:400; text-decoration: none!important; letter-spacing: 1.2px; transition:all 0.3s ease;}
a.beo i, a.fsb i {color:#999; padding:0;}
a.beo:hover, a.fsb:hover {color:#000;}
a.beo:hover i, a.fsb:hover i {color:#000;}
    
/* TABS */
.tabs {margin:50px 0; padding:0; background:none; text-align: center;}
.tabs input[type=radio] {display:none}
.tabs label {width:auto; color:#444; font-size:15px; font-weight:600; letter-spacing: 1.2px; text-decoration: none; text-align:center; cursor:pointer; background:#fff; padding:20px 30px; margin:0 20px 0 0; overflow: hidden; text-transform: uppercase;}
.tabs label span {display:inline-block}
/* HOVER */
.tabs label {display: inline-block; vertical-align: middle; -webkit-transform: perspective(1px) translateZ(0); transform: perspective(1px) translateZ(0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); position: relative; overflow: hidden;}
.tabs label:before {content: ""; position: absolute; z-index: -1; left: 0; right: 100%; bottom: 0; background: #000; height: 2px; -webkit-transition-property: right; transition-property: right; -webkit-transition-duration: 0.4s; transition-duration: 0.4s; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out;}
.tabs label:hover:before, .tabs label:focus:before, .tabs label:active:before {right: 0;}
.tabs [id^="tab"]:checked + label {color: #000;}
.tabs [id^="tab"]:checked + label:before {position: absolute; z-index: -1; left: 0; right: 0; bottom: 0; background: #000; height: 2px;}
/* CONTENT */
.tab-content {display:none; width:100%; float:left; padding:20px; box-sizing:border-box; background:#fff; border-top:1px solid #e9e9e9; margin-top:0; text-align:left;}
/* TAB ANIMATION */
#tab1:checked ~ #tab-content1, #tab2:checked ~ #tab-content2, #tab3:checked ~ #tab-content3, #tab4:checked ~ #tab-content4, #tab5:checked ~ #tab-content5, #tab6:checked ~ #tab-content6, #tab7:checked ~ #tab-content7, #tab8:checked ~ #tab-content8, #tab9:checked ~ #tab-content9 {display:block; -webkit-animation: fadein 1.5s; -moz-animation: fadein 1.5s; -ms-animation: fadein 1.5s; -o-animation: fadein 1.5s; animation: fadein 1.5s;}
@keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}
@-moz-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}
@-webkit-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}
@-ms-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}
@-o-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}
.tabs:after {content:''; display:table; clear:both}
    
/* TABLE */
.tab-content table, .dsc table {margin:10px 0; cursor: default; color:#444; font-family: 'Heebo', sans-serif; font-size:13px; letter-spacing: 1.2px; font-weight: 400;}
.tab-content table tr, .dsc table tr {border-bottom:1px solid #f5f5f5;}
.tab-content table tr:nth-child(odd), .dsc table tr:nth-child(odd) {background: #f5f5f5;}
.tab-content table tr:last-child, .dsc table tr:last-child {border-bottom:none;}
.tab-content table td, .dsc table td {padding:10px;}
    
/* STYLES */
blockquote {display:block; margin:10px 0; padding:20px;  font-size:14px; color:#444; background: #f5f5f5; border-left:3px solid #444; font-family: 'Heebo', sans-serif; font-size:13px; letter-spacing: 1.2px; font-weight: 400; border-radius: 0; -moz-border-radius: 0; -webkit-border-radius: 0;}
code {display:block; margin:10px 0; padding:20px;  color:#fff; font-family: 'Heebo', sans-serif; font-size:13px; letter-spacing: 1.2px; font-weight: 400; background: #444; border-left:3px solid #000; border-radius: 0; -moz-border-radius: 0; -webkit-border-radius: 0;}
mark {color:#444; background:#fff5e6; font-family: 'Heebo', sans-serif; font-size:13px; letter-spacing: 1.2px; font-weight: 400;}
small {font-size:12px; color:#999; font-family: 'Heebo', sans-serif; letter-spacing: 1.2px; font-weight: 400;}
kbd {background:#444; color:#fff; font-family: 'Heebo', sans-serif; font-size:13px; letter-spacing: 1.2px; font-weight: 400; box-shadow:none; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px;}
    
/* XSELL */
.xsell {margin:0; padding:0 0 100px 0;}    
.xsell-1, .xsell-2 {margin:0; padding:0;}
.xsell-1 {padding:0 25px 0 100px;}
.xsell-2 {padding:0 100px 0 25px;}
.xsell-bg {min-height:230px; margin:0; padding:65px 0; background:#f5f5f5;}
/* XSELL RIGHT */
.xsell-1 .xsell-text {float:right; width:270px;}
.xsell-1 .xsell-text h1 {text-align: left; padding:0 30px 20px 0; margin:0; font-size:28px; font-weight:400;}
.xsell-1 .xsell-text a {display:inline-block; padding:10px 20px; margin:0; color:#444; font-size:13px; letter-spacing: 1.2px; border:1px solid #f5f5f5; text-align: center; background:#fff; box-shadow:0 2px 2px rgba(0,0,0,0.03); transition:all 0.3s ease;}
.xsell-1 .xsell-img {width:250px; height:250px; position: absolute; top:10%; left:3%;}
.xsell-1 .xsell-img img {max-width:100%; height:auto; border:none; margin:0 auto;}
/* XSELL LEFT */
.xsell-2 .xsell-text {float:left; width:270px;}
.xsell-2 .xsell-text h1 {text-align:left; padding:0 0 20px 30px; margin:0; font-size:28px; font-weight:400;}
.xsell-2 .xsell-text a {display:inline-block; padding:10px 20px; margin:0 0 0 30px; color:#444; letter-spacing: 1.2px; font-size:13px; border:1px solid #f5f5f5; text-align: center; background:#fff; box-shadow:0 2px 2px rgba(0,0,0,0.03); transition:all 0.3s ease;}
.xsell-2 .xsell-img {width:250px; height:250px; position: absolute; top: 10%; right:3%;}
.xsell-2 .xsell-img img {max-width:100%; height:auto; border:none; margin:0 auto;}
/* HOVER */
.xsell-1:hover .xsell-img img, .xsell-2:hover .xsell-img img {transform: scale(1.05); transition:all 0.3s ease;}
.xsell-text a:hover {background:#444; color:#fff; text-decoration: none; transition:all 0.3s ease;}
    
/* XSELL SINGLE */
.xsell-single {margin:40px 0; padding:0 10px; text-align: center;}
.xsell-single img {max-height:300px; width:auto; margin:0 auto; border:1px solid #fff; opacity: 1;}
.xsell-single:hover img {opacity: 0.8; transition:opacity 0.3s ease;}
.xsell-single h1 {display:block; margin:20px 0 10px 0; padding:0; font-size:13px; color:#444; letter-spacing:1.2px; text-align: center; font-weight: 600;}    
.xsell-single h2 {display:block; margin:0; padding:0; font-size:13px; color:#999; letter-spacing:1.2px; text-align: center; font-weight: 400;}    
.xsell-single:hover h1 {color:#000;}
.xsell-single h3 {position: absolute; top:-2%; right:7%; background:#fff; display:inline-block; color:#000; font-size:13px; letter-spacing:1.2px; text-align: center; font-weight: 600; line-height:25px; padding:0 10px; box-shadow:0 2px 2px rgba(0,0,0,0.03);}
    
/* SERVICE */
.service {background:#f5f5f5; margin:50px 0 0 0; padding:30px 0; text-align: left;}
.service-box i {width:50px; float:left; display:block; color:#000; margin:0 5px 10px 0; font-size:32px; padding:4px 0 0 0;}
.service-box span {display:block; margin:0; padding:0 0 2px 0; color: #000; font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: 1.2px;}
.service-box {margin:0; padding:20px 60px 10px 60px; color: #8b8b8b; font-size: 12px; font-weight: 400; letter-spacing: 1.2px; border-right:1px solid #e5e5e5; text-align: left;}
.service-box:hover span {color: #8b8b8b; cursor:default; transition:all 0.3s ease;}
.service-box:last-child {border:none;}  
    
.footer {margin:0; padding:40px; color:#444; letter-spacing: 1.2px; font-weight:400; font-size:13px;}
.footer h1 {margin:0; padding:10px 0; color: #000; font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: 1.2px;}
.footer ul {margin:0; padding:0;}    
.footer ul li {list-style-type:none; text-align:left; margin:0; padding:0;}
.footer ul li a {display:block; margin:0; padding:5px 0; color:#444; letter-spacing: 1.2px; font-weight:400; font-size:13px;}
.footer ul li a:hover {color:#000; text-decoration: none;}
a.kontakt {display:block; max-width:250px; padding:0 0 0 20px; margin:20px 0; color:#444; font-size: 13px; border:1px solid #f5f5f5; text-align: left; background:#fff; box-shadow:0 2px 2px rgba(0,0,0,0.03); transition:all 0.3s ease; line-height:40px;}
a.kontakt:hover {text-decoration: none; transition:all 0.3s ease;}
a.kontakt:after {font-family: 'FontAwesome'; content: '\f105'; font-size:14px; padding:0; margin:0; display:block; background: #000; color: #fff; width:40px; float:right; text-align: center;}
a.kontakt:hover:after {background: #333; color: #fff;}

/* MEDIA QUERY */  
    
@media (min-width:992px) and (max-width: 1199px) {
.service-box i {margin-bottom:30px}
.tabs label {top:-1px;}
.service-box {padding:20px 30px 0 30px;}
.xsell-1 .xsell-img img, .xsell-2 .xsell-img img {max-width:200px; height:auto;}
.xsell-1 .xsell-img {left:-5%;}
.xsell-2 .xsell-img {right:0%;}
.xsell-1 .xsell-bg {padding-left:120px;}
.xsell-2 .xsell-bg {padding-right:120px;}
.xsell-1 .xsell-text {float:right; width:240px;}
.xsell-2 .xsell-text {float:none; width:auto;}
.xsell-1 .xsell-text h1 {padding:0 20px 20px 0; font-size:24px;}
.xsell-2 .xsell-text h1 {padding:0 0 20px 30px; font-size:24px;}
}
    
@media (min-width:768px) and (max-width: 991px) {
.tabs label {top:-1px;}
.dsc {padding:30px 0 0 0; margin:0}
.xsell-1 {padding:0 25px 0 50px}
.xsell-2 {padding:0 50px 0 25px}
.xsell-1 .xsell-img img, .xsell-2 .xsell-img img {max-width:100px; height:auto;}
.xsell-1 .xsell-img {left:-20%; top:40px;}
.xsell-2 .xsell-img {position: absolute; right:-20%; top:-10%;}
.xsell-1 .xsell-bg {padding:30px 0; padding-left:70px; min-height:160px;}
.xsell-2 .xsell-bg {padding:30px 0; padding-right:60px; min-height:160px;}
.xsell-1 .xsell-text {float:right; width:240px;}
.xsell-2 .xsell-text {float:none; width:auto;}
.xsell-1 .xsell-text h1 {padding:0 20px 20px 0; font-size:18px;}
.xsell-2 .xsell-text h1 {padding:0 0 20px 30px; font-size:18px;}
.xsell-single h3 {top:-4%; right:10%;}
.service-box {padding:20px 30px 0 30px;}
.service-box i {margin-bottom:40px;}
.footer {padding: 40px 10px;}
a.kontakt {max-width:210px; font-size:10px;}
}
    
@media (max-width: 767px) {
.tabs {margin-top:10px}
.tabs label {margin:0; width:100%; display:block; float:left}
.tabs label:before {display:none;}
.tabs label:hover {background:#444!important; color:#fff!important;}
.tabs [id^="tab"]:checked + label {color: #000; background:#f5f5f5}
.dsc {margin:0; padding:20px;}
a.skb {margin-top:25px;}
.kaufenbox {margin-top:0;}
a.beo {display:block; padding:2px 0;}
.header {padding:15px;}
.logo img {max-height:60px; width:auto;}
.art {margin:20px 0 0 0;}      
}
    
@media (max-width: 991px) {
/* KATEGORIEN */
.kategorien {border-bottom:1px solid #e9e9e9; padding:0;}
.kategorien ul {display:block; width:100%; margin:0; padding:0;}
.kategorien ul li {display:block; margin:0; padding:0; width:100%; border-top:1px solid #e9e9e9; line-height:15px;}
.kategorien ul li:hover {background:#f5f5f5!important;}
.kategorien ul li:hover a, .kategorien ul ul li:hover a {color:#444!important; text-decoration: none!important;}
.kategorien ul li a {display:block; margin:0; padding:15px; width:100%; line-height:15px;}
.kategorien ul li:last-child {border-bottom:none;}
.kategorien ul li a:before, .kategorien ul li:before, .kategorien ul li a:after, .kategorien ul li:after {display:none;}
.kategorien ul ul {display:block; position: inherit; margin-top:5px; top:0; left:0; box-shadow:none;}
.kategorien ul ul li {display:block; line-height:15px; margin:0; padding:0;}
.kategorien ul ul li a {display:block; line-height:15px; padding:15px 40px;}
/* RESPONSIVE MENU */
.toggle-box *, .toggle-box *:before, .toggle-box *:after {box-sizing: border-box;}
.toggle-box {width:100%;}
.toggle-box input[name='panel'] {display: none;}
.toggle-box label {height:50px; position: relative; display: block; padding:0; margin:0; line-height:50px; background:none; border:none; color:#444; font-size:13px; font-weight:600; letter-spacing: 1.2px; cursor: pointer; transition: all 0.4s cubic-bezier(0.865, 0.14, 0.095, 0.87); text-transform: uppercase; text-align: center;}
.toggle-box label:after {content: '\f107'; font-family:'FontAwesome'; position: absolute; top:12px; right:40px; font-size:14px; width:25px; height: 25px; line-height:25px; color:#fff; text-align: center; border-radius: 50%; background: #444; padding:0;}
.toggle-box label:hover {color:#000;}
.toggle-box input:checked + label {color: #000;}    
.toggle-box input:checked + label:after {content: '\f106'; font-family:'FontAwesome';}
.toggle-box .toggle-content {overflow: hidden; max-height: 0em; position: relative; padding: 0; background: #fff; color:#444; transition: all 0.4s cubic-bezier(0.865, 0.14, 0.095, 0.87);}    
.toggle-box .toggle-content:not(:last-of-type) {}
.toggle-box .toggle-content .toggle-body {padding:0;}
input[name='panel']:checked ~ .toggle-content {max-height:595px; overflow-y: scroll; overflow-x: hidden;} 
}