/* --- BASIC SETTINGS --- */

html,body{box-sizing:border-box;margin:0;padding:0;width:100%}
body{overflow-x:hidden;min-height:calc(100vh - 80px);background-color:#24292e}
body.layout-3,body.layout-4{background-color:#fff}
body.initState{overflow-y:hidden}
body.readyToUse{overflow-y:auto}
body.fancybox-active.readyToUse{overflow-y:hidden!important}
*{box-sizing:border-box;border-width:0;border-style:solid;border-color:#dadada;background-repeat:no-repeat}

.hide,.hidden,section#lang,header nav .menu > section.print.link,header nav .menu > section.print,header nav .menu > section.pdf{display:none!important}
.invisible{visibility:hidden}
/* br:first-child{display:none} */
.wSub br{font-size:0}

.noverflow{overflow:hidden}

span.enCrypt{display:inline-block;width:auto!important;color:inherit}
span.enCrypt::after{content:'\0040';display:inline-block;position:static!important;width:auto;font-size:inherit;font-family:microns;color:inherit}

i.fas,i.far,i.fab{margin:0 3px 0 10px!important}

*::marker{display:none!important}


/* --- LISTS --- */

ul{list-style:none;margin:0;padding:0}
ul li{list-style:none;line-height:1.5}
article .ceItem ul,article .ceItem ol{list-style-position:inside;margin:20px 0 0 0;padding:0 0 0 20px}
article .ceItem ul,article .ceItem ul li{list-style-type:square}
article .ceItem ol,article .ceItem ol li{list-style-type:decimal}
article .ceItem ul li,article .ceItem ol li{margin-bottom:10px}
article .ceItem ul li:last-of-type,article .ceItem ol li:last-of-type{margin-bottom:0}
article .ceItem ol li{text-indent:-20px}
.bodyText ul,.bodyText ol{margin-top:20px}


/* --- MISC SETTINGS --- */

h1,h2,h3,h4,h5,h6{margin:0;padding:0}
h1,h2{padding-bottom:15px}
h1:last-child,h2:last-child{padding-bottom:0}
h3,h4{padding-bottom:20px}
h3:last-child,h4:last-child{padding-bottom:0}
.wSub h2:last-child,.wSub h3:last-child,.wSub h4:last-child{padding-bottom:0}
h1:only-child,h2:only-child,.hGroup.wSub h3{padding-bottom:0}
p,.ceItem .txtWrap div:not(.hGroup) h3{margin:20px 0 0;padding:0}
.headWrap + .bodyText p:first-child{margin:0}
main .bodyText:first-child p,footer .bodyText p:first-child{margin-top:0}
#topBox p,.newsText p:first-child,.hGroup + p,.ceItem .txtWrap div.hGroup h3:only-child{margin:0!important}
* + p:first-of-type{margin:20px 0 0!important}
.hGroup + p:first-of-type{margin:0!important}
p.text-justify{-webkit-hyphens:auto;hyphens:auto;text-align:justify}
td p{margin:0;-webkit-hyphens:none;hyphens:none;text-align:left;-webkit-column-count:1!important;column-count:1!important;-webkit-column-gap:0!important;column-gap:0!important}
#mediaBox p{-moz-hyphens:none;-webkit-hyphens:none;hyphens:none}
p.txt2col,p.txt2col > *{-webkit-column-count:2;column-count:2;-webkit-column-gap:5%;column-gap:5%}
a{text-decoration:none;color:inherit}
a,a *,button,input[type=submit]{cursor:pointer}
a.fancybox{display:block!important}
.contactLink{text-decoration:underline;cursor:pointer}
.contactLink:hover{text-decoration:none}
hr{margin:20px auto;width:20px;height:5px;background-color:#1a1a1a}
i{margin:0 3px}
i:first-child{margin-left:0}

input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,input:-webkit-autofill,textarea:-webkit-autofill,textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,select:-webkit-autofill,select:-webkit-autofill:hover,select:-webkit-autofill:focus{-webkit-text-fill-color:#52ffb8!important;-webkit-box-shadow:0 0 0 1000px #24292e inset;transition:background-color 5000s ease-in-out 0s}
input,input:-moz-autofill,input:-moz-autofill-preview,input:-webkit-autofill{filter:none!important}
input:autofill{background-color:transparent!important}


/* --- IMG, FRAMES, DIRECTIONS --- */

figure{position:relative;margin:0}
figure a{display:inline-block}
figure img{width:100%!important;height:auto!important}

.ceItem .left figure,.alignLeft,.alignLeft *,.text-left,.text-left *,hgroup.header-left *,.hGroup.header-left,.hGroup.header-left *{text-align:left}
.ceItem .center figure,.alignCenter,.alignCenter *,.align-center,.text-center,.text-center *,hgroup.header-center *,.hGroup.header-center,.hGroup.header-center *,.hGroup.header-Center,.hGroup.header-Center *,.hGroup.hCenter,.hGroup.hCenter *,.align-108{text-align:center;width:100%}
.ceItem .right figure,.alignRight,.alignRight *,.align-right,.text-right,.text-left *,hgroup.header-right *,.hGroup.header-right,.hGroup.header-right *,.hGroup.header-Right,.hGroup.header-Right *,.hGroup.hRight,.hGroup.hRight *{text-align:right;width:100%}
.hasBg .hGroup.header-108 *,.hasMedia .hGroup.header-108 *,.hasBody hgroup.header-right *,.hasBody .hGroup.header-right,.hasBody .hGroup.header-right *,.hasBody .hGroup.header-Right,.hasBody .hGroup.header-Right *,.hGroup.hLeft,.hGroup.hLeft *{text-align:left;width:100%}


/* --- FLEXBOX VARS --- */

#Box{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-flex-wrap:wrap;flex-wrap:wrap;-webkit-flex-direction:row;flex-direction:row}
#Box{-webkit-flex-wrap:nowrap;flex-wrap:nowrap}
#Box{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-flex-wrap:wrap;flex-wrap:wrap;-webkit-flex-direction:row-reverse;flex-direction:row-reverse}
#Box{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-flex-wrap:wrap;flex-wrap:wrap;-webkit-flex-direction:column;flex-direction:column}
#Box{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-flex-wrap:wrap;flex-wrap:wrap;-webkit-flex-direction:column-reverse;flex-direction:column-reverse}

#Box{-webkit-justify-content:space-around;justify-content:space-around}
#Box{-webkit-justify-content:flex-start;justify-content:flex-start}
#Box{-webkit-justify-content:flex-end;justify-content:flex-end}
#Box{-webkit-justify-content:center;justify-content:center}
#Box{-webkit-justify-content:space-between;justify-content:space-between}

#Box{-webkit-align-items:flex-start;align-items:flex-start}
#Box{-webkit-align-items:flex-end;align-items:flex-end}
#Box{-webkit-align-items:center;align-items:center}
#Box{-webkit-align-items:stretch;align-items:stretch}

#Box{-webkit-align-content:flex-start;align-content:flex-start}
#Box{-webkit-align-content:center;align-content:center}

#Box{-webkit-align-self:flex-start;align-self:flex-start}
#Box{-webkit-align-self:center;align-self:center}
#Box{-webkit-align-content:stretch;align-content:stretch}


/* --- BASIC EFFECTS --- */

/* global clips */
#Box{-webkit-clip-path:polygon(50% 0,100% 0,100% 80%,50% 100%,0 100%,0 20%);clip-path:polygon(50% 0,100% 0,100% 80%,50% 100%,0 100%,0 20%)}
#Box{-webkit-clip-path:polygon(0 0, 0 0, 50% 0, 0 10vw);clip-path:polygon(0 0, 0 0, 50% 0, 0 10vw)}
#Box{-webkit-clip-path:polygon(100% 0, 100% 0, 100% 100%, 50% 100%);clip-path:polygon(100% 0, 100% 0, 100% 100%, 50% 100%)}
#Box{-webkit-clip-path:none;clip-path:none}
#Box{-webkit-clip-path:polygon(100% 0, 100% 0, 100% 100%, 50% 100%);clip-path:polygon(100% 0, 100% 0, 100% 100%, 50% 100%)}
#Box{-webkit-clip-path:polygon(100% 0, 0% 100%, 100% 100%);clip-path:polygon(100% 0, 0% 100%, 100% 100%)}
#Box{-webkit-clip-path:none;clip-path:none}
#Box{-webkit-clip-path:polygon(8% 13%,100% 0,100% 93%,0 100%);clip-path:polygon(8% 13%,100% 0,100% 93%,0 100%)}
#Box{-webkit-clip-path:polygon(0 0, 0% 100%, 100% 100%);clip-path:polygon(0 0, 0% 100%, 100% 100%)}

/* global shadows */
#Box{-webkit-box-shadow:0 2px 20px 5px rgba(150,150,150,.2);box-shadow:0 2px 20px 5px rgba(150,150,150,.2)}
#Box{-webkit-box-shadow:5px 8px 10px rgba(0, 0, 0, 0.25);box-shadow:5px 8px 10px rgba(0, 0, 0, 0.25)}
#Box{-webkit-box-shadow:0 4px 4px rgba(0,0,0,.2);box-shadow:0 4px 4px rgba(0,0,0,.2)}
#Box{-webkit-box-shadow:1px -1px 6px rgba(0,0,0,.3);box-shadow:1px -1px 6px rgba(0,0,0,.3)}
#Box{-webkit-box-shadow:2px 2px 8px rgba(0,0,0,.3);box-shadow:2px 2px 8px rgba(0,0,0,.3)}
#Box{-webkit-box-shadow:1px 1px 6px rgba(0,0,0,.4);box-shadow:1px 1px 6px rgba(0,0,0,.4)}
#Box{-webkit-box-shadow:0 6px 6px rgba(0,0,0,.4);box-shadow:0 6px 6px rgba(0,0,0,.4)}
.noShadow{-webkit-box-shadow:none!important;box-shadow:none!important}

.shadow3d{position:relative}
.shadow3d::before,.shadow3d::after{
	content:"";position:absolute;z-index:0;top:40px;width:calc(50% - 30px);height:calc(100% - 75px);-webkit-box-shadow:0 25px 40px #000;box-shadow:0 25px 40px #000;
	-webkit-transition:all .4s;transition: all .4s}
.shadow3d::before{right:30px;-webkit-transform:rotate(4deg);transform:rotate(4deg)}
.shadow3d::after{left:30px;-webkit-transform:rotate(-4deg);transform:rotate(-4deg)}
.shadow3d > *{position:relative;z-index:1}
.grid-col > .shadow3d:not(.hasBgColor):not(.hasBgWrap) > *{padding:40px;background-color:#fff;border:1px solid #f2f2f2}
.grid-col > .shadow3d + *{margin-top:40px!important}
.grid-col > .shadow3d + *:last-child{margin-bottom:40px!important}


/* global radius */
#Box{-webkit-border-radius:15px;border-radius:15px}
#Box{-webkit-border-radius:0 0 15px 15px;border-radius:0 0 15px 15px}
#Box{-webkit-border-radius:15px 0 0 15px!important;border-radius:15px 0 0 15px!important}
#Box{-webkit-border-radius:0 15px 15px 0!important;border-radius:0 15px 15px 0!important}
#Box{-webkit-border-radius:7px;border-radius:7px}
#Box{-webkit-border-radius:0!important;border-radius:0!important}

/* global scaling */
#Box{-webkit-transform:scale(1.05);transform:scale(1.05)}

/* global rotation */
#Box{-webkit-transform:rotate(-2deg);transform:rotate(-2deg)}
#Box{-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}
#Box{-webkit-transform:rotate(45deg);transform:rotate(45deg)}
#Box{-webkit-transform:rotate(-12deg);transform:rotate(-12deg)}
#Box{-webkit-transform:rotate(12deg);transform:rotate(12deg)}
#Box{-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}
#Box{-webkit-transform:rotate(0deg);transform:rotate(0deg)}

#Box{transform-origin:center center}

/* global filters */
.imgFilter-101,.imgFilter-101 img{filter:grayscale(100%)}
.imgFilter-102,.imgFilter-102 img{filter:saturate(50%)}
.imgFilter-103,.imgFilter-103 img{filter:saturate(25%)}
.imgFilter-104,.imgFilter-104 img{filter:sepia(50%) saturate(50%)}

/* global animation */
.typed{display:inline-block;overflow:hidden;white-space:nowrap;-webkit-hyphens:none;hyphens:none}
.typed-1{animation:typing 3s .5s steps(40, end)}
.typed-2{animation:typing 3s 3s steps(60, end)}
.typed-3{animation:typing 3s steps(60, end)}
.typed-slider{animation:typing 3s steps(40, end)}


/* --- BASIC TRANSITIONS --- */

body *{-webkit-transition:all .4s;transition:all .4s}


/* --- FONTS --- */

body,textarea,input,select,button{font-family:jsr,arial,helvetica,awesome,awesome5,microns,sans-serif}

h1,h2,h3{font-family:jsb,arial,helveticablack,helvetica,awesome,awesome5,microns,sans-serif;font-weight:bold}

.menu.main ul.level-1 li.headLine .title,.menu.main ul.level-1 li.headLine .title > span{font-family:jsr,arial,helvetica,sans-serif}
strong,.hd1,.hd1 *,.hd2,.hd2 *,#mediaBox .ceItem.media .itemWrap .lnkWrap .button a .lnkHeader{font-family:jsb,arial,helveticablack,helvetica,sans-serif;font-weight:bold}
header figure a,.menu.main ul.level-1 > li.headLine > .title > span.root,.hs-normal .hd1 .mainTitle,.hs-normal .hd2 .mainTitle,.shs-normal .hd1 .subTitle,.shs-normal .hd2 .subTitle,
.hs-light .hd1 .mainTitle,.hs-light .hd2 .mainTitle,.shs-light .hd1 .subTitle,.shs-light .hd2 .subTitle{font-family:jsr,arial,helvetica,sans-serif;font-weight:normal}
h1:first-child,h1:first-child *,h2:first-child,h2:first-child *{font-family:jsb,arial,helveticablack,helvetica,awesome,awesome5,microns,sans-serif;font-weight:bold}
.hs-normal .mainTitle,.shs-normal .subTitle{font-family:jsr,arial,helvetica,awesome,awesome5,microns,sans-serif;font-weight:normal}
.hs-light .mainTitle,.shs-light .subTitle,.bodyText h1,.bodyText h2,.bodyText h3{font-family:jsr,arial,helvetica,awesome,awesome5,microns,sans-serif;font-weight:normal}

.fa,.far,.fas{font-family:awesome5}
.fab{font-family:awesome5b}
.fas{font-family:awesome5s}

.ceItem p,.tx-felogin-pi1 h3 + div{line-height:1.5}
.newsSingle .newsTeaser *,.newsSingle .newsText *{line-height:1.5}
h1,h2,h3,h4,h1 *,h2 *,h3 *,h4 *,.hd1,.hd2,.hd1 *,.hd2 *,.rootLine,.rootLine *{line-height:1.2}

.tUpper,.mainUpper .mainTitle,.subUpper .subTitle{text-transform:uppercase!important;letter-spacing:2px}
.tCapital{text-transform:none!important;font-variant:small-caps!important}
.tLower{text-transform:lowercase!important}
.tMixed{text-transform:none!important}


/* --- FONTSIZES --- */

html,body{font-size:16px}

header h1,header h1 *,header h2,header h2 *{font-size:3rem}
header h1 ~ h2,header h1 ~ h2 *,header h2 ~ h3,header h2  ~ h3 *,
header h3 ~ h4,header h3 ~ h4 *,header h4 ~ h5,header h4 ~ h5 *{font-size:1.5rem}

main h1,main h1 *{font-size:100px}
main h2,main h2 *{font-size:40px}
main h3,main h3 *,main h4,main h4 *{font-size:30px}

main p,main p *{}
main li,main li *{}

#topBox p,#topBox p *{font-size:12px}
/* p strong,p span{font-size:16px} */

.hs-18 *.mainTitle,.shs-18 *.subTitle{font-size:18px;line-height:25px}
.hs-22 *.mainTitle,.shs-22 *.subTitle{font-size:22px;line-height:27px}
.hs-26 *.mainTitle,.shs-26 *.subTitle{font-size:26px;line-height:30px}
.hs-30 *.mainTitle,.shs-30 *.subTitle{font-size:30px;line-height:35px}
.hs-36 *.mainTitle,.shs-36 *.subTitle{font-size:36px;line-height:45px}
.hs-48 *.mainTitle,.shs-48 *.subTitle{font-size:48px;line-height:55px}
.hs-60 *.mainTitle,.shs-60 *.subTitle{font-size:60px;line-height:65px}
.hs-80 *.mainTitle,.shs-80 *.subTitle{font-size:80px;line-height:85px}
.hs-100 *.mainTitle,.shs-100 *.subTitle{font-size:100px;line-height:105px}

@media only screen and (max-width:1024px) {
.hs-18 *.mainTitle,.shs-18 *.subTitle{font-size:16px;line-height:18px}
.hs-22 *.mainTitle,.shs-22 *.subTitle{font-size:18px;line-height:20px}
.hs-26 *.mainTitle,.shs-26 *.subTitle{font-size:20px;line-height:22px}
.hs-30 *.mainTitle,.shs-30 *.subTitle{font-size:22px;line-height:24px}
.hs-36 *.mainTitle,.shs-36 *.subTitle{font-size:24px;line-height:26px}
.hs-48 *.mainTitle,.shs-48 *.subTitle{font-size:26px;line-height:28px}
.hs-60 *.mainTitle,.shs-60 *.subTitle{font-size:28px;line-height:30px}
.hs-80 *.mainTitle,.shs-80 *.subTitle{font-size:30px;line-height:32px}
.hs-100 *.mainTitle,.shs-100 *.subTitle{font-size:35px;line-height:37px}
}

footer #toTopBox a{font-size:30px}


/* --- ICONS --- */

/* elements */
.bullets ul li::before{content:'\f046';font-family:awesome5l}

/* buttons */
.btn.ok > *::before{content:'\e718';font-family:microns}
.btn.save > *::before{content:'\e718';font-family:microns}
.btn.close > *::before,.tClose > *::before{content:'\e741';font-family:microns}
.btn.link > *::before{content:'\f08e';font-family:awesome5l}
.btn.more > *::after,#kesearch_results ul li a::after{content:'\e705';font-family:microns}
/* .btn.fwd > *::after,.btn.submit > *::after{content:'\e705';font-family:microns} */
.btn.fwd.act > *::after{content:'\e704';font-family:microns}
.btn.prev > *::before{content:'\e705';font-family:microns}
.btn.next > *::after{content:'\f30b';font-family:awesome5}
.btn.back > *::before,.goBack > *::before{content:'\e70a';font-family:microns}
.singleContentText .btn.back > *::before{content:'\f355';font-family:awesome5s}
.btn.delete > *::after{content:'\e741';font-family:microns}
.btn.refresh > *::after,.lnk.refresh > *::after{content:'\f2f1';font-family:awesome5}
.btn.lnk > *::after{content:'\e737';font-family:microns}
.btn.search > *::after{content:'\f002';font-family:awesome5l}
.searchAcc::after{content:'\e744';font-family:microns}
.searchAcc.cur::after{content:'\e744';font-family:microns}
.btn.reset > *::before{content:'\f00d';font-family:awesome5l}
.btn.reset > *::after{content:'Suche leeren'}
.btn.stick > *::before{content:'\f004';font-family:awesome5s}
.btn.share > *::before{content:'\f064';font-family:awesome5s}
.btn.clip > *::before{content:'\f0c6';font-family:awesome5s}
.btn.call > *::before{content:'\f075';font-family:awesome5s}
.btn.email > *::after{content:'\f1d8';font-family:awesome5s}
.btn.info > *::before{content:'\f05a';font-family:awesome5s}
.btn.phone > *::before{content:'\f095';font-family:awesome5s}

.btn.expd > *::after{content:'\e707';font-family:microns}
.btn.clps > *::after,.btn.expd.cur > *::after{content:'\e706';font-family:microns}

.btn.ham > *::before{content:'\e73f';font-family:microns}

.lnk.intern > *::before{content:'\f08e';font-family:awesome5l}
.lnk.stick > *::before{content:'\f08d';font-family:awesome5s}
.lnk.more > *::after{content:'\f08e';font-family:awesome5l}
.lnk.delete > *::after{content:'\e741';font-family:microns}
.lnk.cart > *::before{content:'\f08e';font-family:awesome5l}

.icon.remove a::after{content:'\f00d';font-family:awesome5l}

button.prev::after{content:'\e704';font-family:microns}
button.next::after{content:'\e705';font-family:microns}

/* news */
.newsLatest article .newsMore .lnk a::after{content:'Beitrag'}
.newsLatest article .newsMore .lnk:hover a::after{content:'lesen'}
.news .prevNext .prev a::before{content:'\e705';font-family:microns}
.news .prevNext .next a::after{content:'\e704';font-family:microns}
.news .btn.archive a span::before{content:'\f187';font-family:awesome5s}

/* misc */
.ceItem.login .hGroup::before{content:'\f007';font-family:awesome5s}
section.login::before{content:'\f007';font-family:awesome5s}
.dateAppend .btn.acc.act::after{content:'\f057';font-family:awesome5l}
.cagListPic ul.slick-dots::before{content:'Designs / Farben'}
#toTopBox a::before,#toWindowTop > *::before{content:'\e708';font-family:microns}
li.facebook a::after{content:'\f082';font-family:awesome5s}
.ceItem .accHeader::after{content:'mehr \e705';font-family:osm,arial,helvetica,sans-serif,microns}
.ceItem .accHeader.expd::after{content:'\e705';font-family:microns}
.swipeNav.prev > *::after{content:'\e704'}
.swipeNav.next > *::after{content:'\e705'}
