@import url("https://fast.fonts.net/t/1.css?apiType=css&projectid=26297a0d-4579-43d9-a4d6-1c9de7fbf684");
    @font-face{
        font-family:"Century Gothic W01";
        src:url("../fonts/bd45538f-4200-4946-b177-02de8337032d.eot?#iefix");
        src:local("Century Gothic"),url("../fonts/bd45538f-4200-4946-b177-02de8337032d.eot?#iefix") format("eot"),url("../fonts/700cfd4c-3384-4654-abe1-aa1a6e8058e4.woff2") format("woff2"),url("../fonts/9908cdad-7524-4206-819e-4f345a666324.woff") format("woff"),url("../fonts/b710c26a-f1ae-4fb8-a9fe-570fd829cbf1.ttf") format("truetype");
    }
	
/* bei Details - Atribute (abgebildet) bitte noch einen Satz bilden */
/* .attributes.dl-horizontal {display:none} */
	
html {overflow-x:hidden}
html, body {width:100%; height:100%; margin:0; padding:0}
body {font-family:"Century Gothic W01",Raleway,"Helvetica Neue",Helvetica,Arial,sans-serif; color:#231f20}
.cl-start .fullwidth-container, .cl-start .main-row {height:100%}

h1 {font-size:32px}
h2 {font-size:24px}
h3 {font-size:20px}
.page-header h1 {margin-top:10px}

a:focus{outline:none}

.navbar-default .navbar-nav > li > a {color:#231f20}
.logo-col {width:100%; text-align:center; padding-top:40px}
@media (min-width:768px) { #navigation {display:flex; justify-content:space-between; float:none} }

.cl-start {background:#373334}
.cl-start #navigation {margin:0}
.cl-start #navLeft, .cl-start #navRight {display:none}

#navigation > li {text-transform:uppercase; float:none; white-space:nowrap}
#navigation > li li {text-transform:none}
#mainnav .nav > li.active > a {color:#231f20}
body.cl-details #mainnav .nav > li.active > a {color:#777}
body.cl-details .navbar-default .navbar-nav > .open > a {color:#777}
body.cl-details .navbar-default .navbar-nav > li > a:hover  {color:#777}
.navbar-default .navbar-nav > li > a:hover svg path {fill:#231f20}
body.cl-details .navbar-default .navbar-nav > li > a:hover svg path {fill:#777}

#navigation .dropdown-menu {top:40px}

#mainnav .navbar-collapse.navbar-ex1-collapse.collapse.in ul li li{border:none; font-size:larger; font-weight:bold}
#mainnav .navbar-collapse.navbar-ex1-collapse.collapse.in ul ul {margin-bottom:15px}
.navbar-right {margin-right:-8px}

#mainnav .nav::before, #mainnav .nav::after {content:none}

#header, #wrapper {background:none}
#header {min-height:130px}

#header, .navbar-default, .cl-start #wrapper {background:transparent; border:none}
.cl-start .navbar-default .fa.fa-angle-down {}
.navbar-default .navbar-nav > li > a,
.navbar-default .navbar-nav > li.active > a,
.navbar-default .navbar-nav > li > a:focus  {color:#8d7e5c}
.navbar-right > li > div > a,
.navbar-right > li.active > div > a,
.navbar-right > li > div > a:focus {color:#8d7e5c; padding:8px; display:block; font-size:16px}

.navbar-nav > li > div > a {}
/* .cl-start .navbar-default .navbar-nav > li > a:hover {color:#ccc}
.cl-start .navbar-default .navbar-nav > li.dropdown.open .dropdown-menu {display:none}*/

.cl-start .dropdown-menu {background:rgba(0,0,0,0.8)}
.cl-start #navbarRight {display:none}
.cl-start .navbar-default .navbar-nav > li a {color:#fff}
.cl-start .navbar-default .navbar-nav > .open > a:hover {color:#fff}
.cl-start #header > .container {display:none} 
.cl-start .navLogo {display:none}
.cl-start .search-toggle {display:none}
.cl-start #header {}
#logoStart {display:none}
.cl-start #logoStart {display:block; position:absolute; top:100px; left:50%; transform:translateX(-50%); height:112px; opacity:0; transition:opacity 0.8s}
#promo-carousel {position:absolute; bottom:40px; left:50%; transform:translateX(-50%); width:33%}
#promo-carousel li img {width:100%}


.navLogo a:hover, .navLogo a:focus {text-decoration:none}
.navLogo div {transition:color 0.3s}
.navLogo path {transition:fill 0.3s}
.navLogo:hover div, .navLogo:hover path {color:#231f20; fill:#231f20}
body.cl-details .navLogo:hover div, body.cl-details .navLogo:hover path {color:#777; fill:#777}

.nav .open > a {background-color:transparent; color:#231f20}
body.cl-details .nav .open > a {color:#777}


.navLogo {padding:10px 0}
.navbar-header .navLogo {position:relative; top:4px; left:0}
#navbarRightMobile {position:absolute; right:10px; top:0}
.navLogo div {text-transform:lowercase; text-align:center; line-height:1; padding-top:2px; font-size:18px; color:#8d7e5c}
.navLogo span {display:block; text-transform:uppercase; font-size:10px; letter-spacing:1.5px; margin-top:1px}

.navbar-collapse {position:relative}

.navbar-collapse.in .navLogo,
.navbar-collapse.collapsing .navLogo,
.navbar-collapse.in #navbarRight,
.navbar-collapse.collapsing #navbarRight {display:none}


.slides li {}

#breadcrumb {display:none}

#logo {width:80px; fill:#8d7e5c}
.logoNav {height:40px; width:48px; fill:#8d7e5c; display:block; margin:0 auto}
body.fixed-header .logoNav {height:25px; width:28px; fill:#8d7e5c; display:block; margin:-2px auto 0 auto}

body.fixed-header .navLogo div {display:none} 
@media (min-width:768px) {.navbar-collapse.collapse {height:40px!important} }

body.cl-start, body.cl-details {background:#373334}
/* body.cl-details #header .header-box {padding-top:0} */
#header .header-box {padding:20px 0}


body.cl-details #breadcrumb {display:none}
body.cl-details .detailsInfo > .row {border-bottom:none}

body.cl-details #detailsItemsPager {border-bottom:0; margin:0 0 6px 0}

body.cl-details .details-col-middle {font-size:14px; color:#777; padding:0 30px}
body.cl-details .details-col-middle h2, body.cl-details #productTitle {font-size:12pt; color:#777}
body.cl-details .details-col-middle > div {padding:0}

body.cl-details .details-col-right {border-left:none}
body.cl-details #productLinksDesktop .details-col-right > div {padding:0}
body.cl-details .details-col-right .fa {margin-right:3px}

body.cl-details #morePicsContainer a img {border-color:#8d7e5c}
body.cl-details #morePicsContainer a img:hover {background-color:#8d7e5c}
body.cl-details #morePicsContainer a.selected img {border-color:#777}
body.cl-details #morePicsContainer a.selected img {background-color:transparent}

body.cl-details .fa.fa-angle-left {width:20px}
body.cl-details .fa.fa-angle-right {width:20px; text-align:right}



body.cl-details .tobasket .deliverytime::before {content:''}

body.cl-details .star-ratings {margin-bottom:0; margin-top:0}
body.cl-details .detailsInfo > .row {margin-bottom:0}



.details-col-middle h2 {margin-top:10px}

.tobasket .input-group {width:100%}

#morePicsContainer ul {list-style:none; padding:0}


.list-container img, .categoryDescription img {
 padding:4px;
 line-height:1.42857143;
 background-color:#fff;
 border:1px solid #ddd;
 border-radius:4px;
 transition:all .2s linear;
 display:inline-block;
 max-width:100%;
 height:auto
}

.navbar-header .navbar-right li {float:none}
#navbarRightMobile li {float:left}
#navbarRightMobile li > a {padding:10px}
#navbarRightMobile .navbar-right {margin-right:0}


.attributes {padding-top:5px}
.attributes span {margin-right:32px; padding-top:20px}

#tsOverlay {position:fixed; box-sizing:border-box; top:0; left:0; bottom:0; right:0; background-color:#373334; display:none; z-index:1200; overflow-y:auto; text-align:center}

/*
#jvwOverlay {position:fixed; box-sizing:border-box; top:0; left:0; bottom:0; right:0; background-color:#373334; display:none; z-index:1200; overflow-y:auto; text-align:center}

#jvwOverlay > div {position:relative; width:1200px; margin:0 auto; color:#8d7e5c}
#jvwOverlay h2 {color:#8d7e5c; font-size:1.5em}
*/
#categoryPicture {position:relative; width:100%; height:0; padding-bottom:29%}
.categoryDescription > .row > div:first-child {text-align:center}
.categoryDescription > .row:nth-child(even) > div:first-child {float:right}

.postText > .row > div:first-child {text-align:center}
.postText > .row:nth-child(even) > div:first-child {float:right}

.cl-alist #content h1, .cl-search #content h1 {text-align:center}
.search-col {display:none}
.cl-search .search-col {display:block}
.form-control:focus{border-color:#777;outline:0;box-shadow:inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(46, 46, 46, 0.6)}

.listRefine {position:relative; top:0}
/* .fixed-filter .listRefine {position:sticky; top:40px} */
#toggleFilter {display:inline-block; cursor:pointer; position:absolute; left:0; right:0; top:-10px; margin:0 auto; width:200px; text-align:center; font-size:larger; z-index:1000}
#toggleFilter .fa-filter {font-size:larger}


.listRefine.activeFilter #toggleFilter {display:none}

.list-filter {position:relative}



body.fixed-filter #filterWrapper {position:fixed; top:40px}


.list-filter .btn-group {display:block}
.list-filter .fa-times {position:absolute; top:0; right:0; padding:10px; font-size:larger; font-weight:100; cursor:pointer}
.filter-menu label {margin-bottom:0; cursor:pointer}
#filter ul {list-style:none; padding-left:0}
#boxwrapper_productList {width:100%}

.categoryDescription h2 {padding-bottom: 7px; border-bottom: 1px solid #ddd;}
.categoryDescription .row {margin-bottom:50px}
.ddoe-wysiwyg .panel-body > .row {clear:both; margin-bottom:50px}


.boxwrapper .list-container .infogridView {margin-bottom:0}

#filterWrapper {position:relative; width:100%}


#wrapper {min-height:calc(100vh - 200px)}
#footer {background:transparent; border:0}
.cl-start #footer, .cl-details #footer {color:#777}
#footer a, #footer a {color:#8d7e5c}



@media (max-width:1199px) { 
#productLinksDesktop {display:none}
.pager-overview-link {text-align:center; padding-top:10px}
  #filter {max-height:0; overflow:hidden; transition:max-height 0.6s}
.listRefine.activeFilter #filter {max-height:500px}
}

@media (min-width:1200px) { 

#productLinksMobile {display:none} 
#morePicsContainer li {width:100%}
body.cl-details #morePicsContainer {margin-top:0}
#zoom1, #morePicsContainer li a {position:relative; display:block; width:100%; padding-bottom:69%}
#zoom1 img, #morePicsContainer li a img {position:absolute}
body.cl-details #morePicsContainer img {max-width:100%}
.pager-overview-link .fa-bars {margin-right:3px}

.list-filter {position:relative; left:100%; width:20%; transition:left 0.6s}
.listRefine.activeFilter .list-filter {left:80%}
#boxwrapper_productList {transition:width 0.6s}
.listWrapper.activeFilter #boxwrapper_productList {width:80%}
/* #boxwrapper_productList {transition:padding-left 0.6s}
#content.activeFilter #boxwrapper_productList {padding-left:0} */
#filterWrapper {
  width: 100vw;
  position: absolute;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
}
  #filter {width:1140px; margin:0 auto; overflow:hidden; margin-top:24px}
#filterContainer {float:right}
}



@media (min-width:992px) {

}

@media (max-width:991px) { 
  
  #filter {}
}

.navbar-default .navbar-toggle {border:none; background:transparent!important; padding:14px 10px}
.navbar-default .navbar-toggle:hover {background:transparent!important}
.navbar-default .navbar-toggle .icon-bar {background-color:#8d7e5c}
.navbar-default .navbar-toggle .icon-bar:hover {background-color:#231f20}
.cl-start .navbar-default .navbar-toggle .icon-bar {background-color:#fff}

@media (min-width:768px) {
.navbar-header .navLogo,
.navbar-header #navbarRightMobile {display:none}

.boxwrapper .list-container .infogridView .productBox .picture {height:320px}
}

@media (max-width:767px) { 
#promo-carousel {width:90%}
.cl-start #logoStart {top:50px; height:100px}
.cl-start #header {min-height:75%}
#promo-carousel {position:relative; bottom:0}
.navbar-collapse {border-top:0}
.cl-start .navbar-collapse {margin-top:140px; box-shadow:none; background:rgba(55,51,63,0.2)}
#navigation {border-top:1px solid #e7e7e7}
.cl-start #navigation > li a {color:#fff}
body.cl-details #detailsItemsPager {font-size:100%}
body.fixed-header #header #mainnav {position:relative}
body.fixed-header .navLogo div {display:block}
.list-filter label {display:inline; font-size:smaller}
.list-filter div {padding:5px}
.list-filter li {padding:2px}
.productBox {margin-bottom:0}
body.fixed-header #header #mainnav, .navbar-collapse {box-shadow:none}
.navbar-nav {margin-bottom:0}
}



.fullscreen-bg {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  overflow: hidden;
  z-index: -100;
}

.fullscreen-bg__video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

@media (min-aspect-ratio: 16/9) {
  .fullscreen-bg__video {
    height: 300%;
    top: -100%;
  }
}

@media (max-aspect-ratio: 16/9) {
  .fullscreen-bg__video {
    width: 300%;
    left: -100%;
  }
}

@media (max-width: 767px) {
 /*  .fullscreen-bg {
    background: url('/cms/images/bg.jpg') center center / cover no-repeat;
  }

  .fullscreen-bg__video {
    display: none;
  } */
}

#startVideo {position:fixed; top:0; left:0; right:0; bottom:0; z-index:-100; opacity:0; transition:opacity 1.2s}

#startVideo video, #startVideo canvas {
  position:absolute;
  top:50%; 
  left:50%;
  -webkit-transform:translateX(-50%) translateY(-50%);
  transform:translateX(-50%) translateY(-50%);
  min-width:100%; 
  min-height:100%; 
  width:auto; 
  height:auto;
  z-index:-100; 
  overflow:hidden;
}

h1 .fa-rss {font-size:24px; color:#8d7e5c}
#bContent a {color:#8d7e5c!important}

/* Details Navigation nicht weiss */
body.cl-details.fixed-header #header #mainnav.fadeIn {background-color:rgba(55, 51, 52,0.95)}
body.cl-details .dropdown-menu {background-color:#373334}
body.cl-details .dropdown-menu a {color:#8d7e5c}
body.cl-details .dropdown-menu li.active a, body.cl-details .dropdown-menu li:hover a {color:#373334}