@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,700,300);    
    
/* LAYOUT */
.header-bg {background:#fff; border-top:8px solid #3e454c; margin:0; padding:0} 
.footer-bg {background:#3e454c; border-top:8px solid #ea661e; margin:0; padding:0} 
.content-bg {background:#eee; margin:0; padding:0}    
p, .container, .container-fluid, .row {font-size:14px; font-family: 'Open Sans', serif;}
.maincontent, .sidebar {margin:0; padding:0}
    
/* HEADER */
.logo-pos {margin:0; padding:0; padding-top:30px}
.header-info {margin:0; padding:15px 0 0 0;}
.header-info img {max-height:70px; margin:20px 20px 0 0}
.header-info h1 {text-align:left; margin:20px 0 0 0; font-family: 'Open Sans', serif; font-weight:400; font-size:25px; color:#3e454d;}
.header-info h2 {text-align:left; margin:0; font-family: 'Open Sans', serif; font-weight:700; font-size:36px; padding-top:5px; color:#3e454d;}
.header-link {margin:0; padding-top:20px;}
.header-link img {max-height:100px; float:left; margin-left:33px}

/* MENU */
.menubar {border-top: 8px solid #fff; background:#3e454c; margin:0; margin-top:15px; padding:0;}
ul.menu {margin:0; padding:0}
ul.menu li {float:left; width:168px; height:70px; line-height:70px; list-style-type:none; margin:0; padding:0; font-family: 'Open Sans', serif; font-weight:700; border-right: 1px solid #4b5259; font-size:13px}
ul.menu li a {display:block; color:#fff; text-shadow:1px 1px 0px #222}
ul.menu li a:hover {text-decoration:none; background:#353c42}

/* RESPONSIVE MENU */
.dropdown {margin:0; padding:10px 0;}
ul.resmenu {margin:0; padding:0; width:100%; border-top:5px solid #fff;}
ul.resmenu li {float:left; display:block; margin:0; padding:0; width:20%; background:#353c42; border-right:1px solid #3e454c;}
ul.resmenu li a {display:inline-block; text-align:center; font-size:20px; color:#fff; background: #353c42; text-decoration: none; margin:0; padding:15px 0}
ul.resmenu li a:hover {color:#ea661e}
 
/* SUCHE */
.header-suche {padding:0; margin:10px 10px 0 0; border:none; float:right}
.suchfeld {width:250px; height:50px; float:left; font-family: 'Open Sans', serif; background:#fff; color:#6f6f6f; line-height:50px; margin:0; padding:0 20px; border:none; text-align: left}
.suchbutton {float:right; width:50px; height:50px; background:#fff; color:#686e74; font-size:20px; text-align:center; margin:0; padding:0;border:none;}
.suchbutton i {line-height: 50px}
.suchbutton:hover {background:#ea661e; color:#fff}

/* ARTIKELBILDER */
.image-gallery {margin:0; width:400px; height:400px;}
.image-gallery .big-image {width:400px; height:100%;; margin:0; position:relative;}
.image-gallery .big-image img {opacity:0; position:absolute; left:0px; top:0px; max-height:400px; width:auto; margin:0; transition: opacity 350ms;}
.image-gallery .big-image img:target {opacity:1;}
.image-gallery .big-image img:target ~ img#default {opacity:0;}
.image-gallery .big-image img#default {opacity:1;}
.image-gallery .thumbs {margin:0; position: relative; top:5px;}
.image-gallery .thumbs ul {list-style-type:none; margin:0!important; padding:0!important; text-align: center}
.image-gallery .thumbs li {width:23%; list-style:none; margin:0; padding:0; display:inline-block; margin-right:3px; text-align: center}
.image-gallery .thumbs li a:hover{opacity:1;}
.image-gallery .thumbs li a {opacity:0.85; text-align: center}
.image-gallery .thumbs li a:focus{opacity:1;}
.image-gallery .thumbs li img {max-height:100px; width:auto;}

/* TEXT & ÜBERSCHRIFTEN */
.textbox {margin:20px; margin-left:0px; padding:0; padding-bottom:10px; background:#fff; text-align:left; font-family: 'Open Sans', serif; border:1px solid #eee}
.textbox p {margin:0; padding:10px; padding-bottom:2px}
.main {margin-right:0!important}
.sidebar h1, .textbox h1 {font-family: 'Open Sans', serif; font-weight:700; font-size: 16px; background:#3e454c; border-bottom:5px solid #ea661e; padding:15px 0; margin:0; text-align:center; text-transform:uppercase; color:#fff; text-shadow:1px 1px 0px #222;} 
    
/* SHOPKATEGORIEN */
ul.katmenu {margin:0; padding:0; padding-top:10px; text-align:left;}
ul.katmenu li {margin:0; padding:0; list-style-type:none; font-family: 'Open Sans', serif; font-weight:700; font-size:14px}
ul.katmenu li a {display:block; margin:0; padding:5px 20px; color:#3e454c; text-decoration:none;}
ul.katmenu li a:hover {color:#353c42; background:#ea661e}
ul.katmenu li a:hover i {color:#fff}
ul.katmenu li.ukat a {padding-left:35px}
        
/* SERVICE */
.service {height:40px; margin:20px; padding:0; color:#3e454c; text-align: left; font-size:12px}    
.service-1 {float:left; margin:0; margin-top:2px; margin-right:8px; padding:0; color:#bfbfbf; font-size:30px; text-align:center;}
.service-2 {margin:0; padding:0; color:#ea661e; line-height: 16px; font-size:16px; font-weight:700;} 

/* ARTIKELBESCHREIBUNG */
.artdesc, .artdesc-2 {margin:0; padding:0}
.artdesc-2 {padding:20px;} 
.artdesc-3 {padding-top:10px; padding-right:20px}
.artdesc h2 {font-family: 'Open Sans', serif; font-weight:700; font-size: 18px; color:#3e454c; text-align:left}
.artdesc h3 {font-family: 'Open Sans', serif; font-weight:700; font-size: 14px; color:#3e454c; text-align:left}
.artdesc h4 {font-family: 'Open Sans', serif; font-weight:700; font-size: 42px; color:#3e454c; text-align:center; padding:20px 0}
ul.artdetail {margin:0; padding:0; font-size:14px; border:1px solid #e6e6e6; border-bottom:none}
ul.artdetail li {list-style-type:none; background:#fcfcfc; margin:1px 0; padding:7px 12px; border-bottom:1px solid #e6e6e6; line-height:20px}
ul.artdetail li:before {font-family: 'FontAwesome'; content: '\f105'; font-size:14px; padding-right:10px; color:#ea661e;}
.artdesc .mwst {font-size:12px; color:#909090; font-weight:300}
a.buys {display:block; font-weight:700; font-size:16px; background:#3e454c; margin:0; padding:10px; color:#fff; text-decoration: none; text-align:center; border-bottom:5px solid #ea661e;}
a.buys:hover {background:#353c42;}
.buysinfo {margin:0; padding:5px 0 0 0; text-align:center; font-family: 'Open Sans', serif; font-weight:700; font-size:14px;}
.buysinfo a {display:block; text-decoration:none; color:#353c42; background:#fff; padding:10px; margin:0}
.buysinfo a:hover i {color:#ea661e;}
.buysinfo i {color:#3e454c; padding-right:5px}
.buysinfo i.fa-inverse {color:#fff!important;}
.buysfix {padding:0; margin:0} 
    
/* TABS */
.tabs{background: none; padding:0; margin:0}
/*.tabs span {display: none}*/
#tbc {display: block; position: relative; margin:0; padding:0}
#tbc ul {margin:0; padding:0; overflow: hidden; background:none; border-bottom:4px solid #ea661e}
#tbc ul li {float:left; display:inline; list-style-type: none; margin:0 10px 0 0; padding:0;}
#tbc ul li a {display: inline-block; position: relative; z-index: 1; background: #3e454c; color:#fff; font-family: 'Open Sans', serif; font-size: 14px; font-weight: 700; text-align: center; margin:0; padding:12px 20px 10px 20px; text-decoration: none; cursor: pointer;}
#tbc ul li a:hover {background: #4c555d; color: #fff; text-decoration: none}
#tbc > div {position: relative; clear: both; visibility: hidden; background: #fff; margin:0; padding: 0 15px; height: 0; overflow: hidden; color: #3e454c; text-align:left; font-family: 'Open Sans', serif; font-size: 14px; font-weight: 400}
#tbc > div h1 {font-family: 'Open Sans', serif; font-size:18px; font-weight:700; border-bottom:1px solid #ddd; margin:0 0 10px 0; padding:10px 0}
span:target ~ #tbc ul li:first-child a {background: #3e454c; color: #fff;}
span:target ~ #tbc > div:first-of-type {visibility:hidden; height:0; padding:0 10px;}
span ~ #tbc > div:first-of-type, #tbl-1:target ~ #tbc > div.tbc-1, #tbl-2:target ~ #tbc > div.tbc-2, #tbl-3:target ~ #tbc > div.tbc-3, #tbl-4:target ~ #tbc > div.tbc-4 {visibility: visible; height: auto;	padding: 15px; position: relative; z-index: 6;}
span ~ #tbc > ul li:first-child a, #tbl-1:target ~ #tbc > ul li a[href$="#tbl-1"], #tbl-2:target ~ #tbc > ul li a[href$="#tbl-2"], #tbl-3:target ~ #tbc > ul li a[href$="#tbl-3"], #tbl-4:target ~ #tbc > ul li a[href$="#tbl-4"] {background: #ea661e; color: #3e454c;}
    
/* CROSS-SELL */
.xsell {margin:0; padding:20px 20px 10px 20px}
.xsellbox img {border:none; width:100%; height:auto; display:block}
.maincontent a {text-decoration:none}
.xsell h1 {font-family: 'Open Sans', serif; font-size:14px; color:#fff!important; text-align:center; margin:0; padding:10px; border:none; border-top:5px solid #ea661e; line-height:14px}
.xsell h1:hover {background:#353c42}
.xsell h2 {font-family: 'Open Sans', serif; font-size:16px; text-align:center; margin:10px 0; padding:0; color:#333; font-weight:700;}

/* FOOTER */
.footer {padding:0 0 10px 0; margin:0; font-family: 'Open Sans', serif; color:#9faab2}
.footer h1 {font-family: 'Open Sans', serif; font-weight:700; font-size: 16px; background:#3e454c; border-bottom:5px solid #353c42; padding:15px 0; margin:0 10px; margin-top:5px; text-align:center; text-transform:uppercase; color:#fff; text-shadow:1px 1px 0px #222;}
.footer ul.katmenu li {margin:0 0 0 10px; padding:0; width:90%}
.footer ul.katmenu li a {color:#fff; padding-left:40px}
.footer ul.katmenu li a:hover {color:#353c42}
.footer ul.katmenu li a:hover i {color:#fff}
.footer p {padding:10px}
i.sm-icon {margin:0; padding:5px; font-size:34px; overflow:hidden; vertical-align: middle; color:#9faab2}
i.sm-icon:hover {color:#ea661e}
a.nws i {color:#ea661e; font-size:16px; padding-right:15px}
a.nws {margin:0 25px; display:block; background:#353c42; font-size:14px; padding:10px; color:#7d8a96; text-decoration:none; text-align:center}
a.nws:hover {background:#30363b}
    
/* MEDIA QUERY */  
    
@media (min-width:992px) and (max-width: 1200px) {
    .logo {font-size:36px; margin-top:20px}
    .header-link {padding-left:60px}
    .header-info {padding-left:0;}
    ul.menu li {width:140px}
    .suchfeld {width:180px}
    .service {font-size:11px}
    .buysinfo {font-size:11px}
    .artdesc h4 {font-size:30px}
    .footer p {font-size:12px}
    i.sm-icon {font-size:26px}
    a.nws {font-size:12px}
    .image-gallery .big-image {width:340px; height:350px; margin:0}
    .image-gallery .big-image img {max-height:340px; width:auto;}
    .image-gallery .thumbs {top:0; max-width:340px}
    .image-gallery .thumbs li img {max-height:80px; width:auto;}
    }
    
@media (min-width:768px) and (max-width: 992px) {
    .logo {font-size:36px; margin-top:20px}
    .header-info {padding-left:0px}    
    ul.menu li {font-size:13px; width:150px; background:#3e454c}
    .artdesc-3 {padding:0 30px}
    .artdesc h2 {padding-top:20px; margin-top:0}  
    .xsell h1 {padding:20px 10px}
    .xsell h2 {padding-bottom:10px}
    .artdesc-2 {text-align:left}
    .image-gallery {height:400px;}
    .image-gallery .big-image {width:500px; height:500px; margin:0;}
    .image-gallery .big-image img {max-height:500px; width:auto;}
    .image-gallery .thumbs {top:10px; max-width:500px}
    .image-gallery .thumbs li img {max-height:100px; width:auto;}
    }
    
@media (max-width: 768px) { 
    #tbc ul li {display:block; width:100%; background:#3e454c}
    #tbc ul li a {display:block; width:100%;}
    .main h1 {padding:10px}
    .sidebar .textbox {width:100%; margin:0} 
    .logo-pos {margin:0; padding:10px 0 0 0;}
    .logo-icon {width:90px}
    .logo {font-size:30px; margin-top:22px; line-height:24px}
    .slogan {font-size:10px}
    .buysinfo {text-align: left; padding-left:15px}
    .xsell h1 {padding:20px 10px}
    .xsell h2 {padding-bottom:10px}
    a.buys {padding:20px 0}
    .tab label {display: block; float:none; margin-bottom:5px; -webkit-border-radius:0px; -moz-border-radius:0px; border-radius:0px;}
    .tab input:checked + label {margin-bottom:5px}
    .tab .content {border:none; margin:0; padding:0 15px}
    .footer {margin-bottom:0}
    .footer p {font-size:14px; padding:20px}
    ul#resmenu {position: static;display: none;}
	ul#resmenu li {margin-bottom: 1px;}
	ul#resmenu li, ul#resmenu li a {width: 100%;}
	.show-menu {display:block;}
    .image-gallery {width:295px; height:100%;}
    .image-gallery .big-image {width:290px; height:290px; margin:0;}
    .image-gallery .big-image img {max-height:290px; width:auto;}
    .image-gallery .thumbs {top:10px; max-width:290px}
    .image-gallery .thumbs li img {max-height:70px; width:auto;}
    } 
 .no-padding {padding:0px !important;}