.d4-skill.hexenmeister .inner {display:none!important;visibility:hidden;opacity:0;}

/*********************************/
/* CSS VARIABLEN                 */
/*********************************/

:root {

--f-family-headline-primary:    "Headline-Primary", "Open-Sans", Arial, Sans-Serif;
--f-family-text-primary:        "Text-Primary", "Open-Sans", Arial, Sans-Serif;

--f-letter-spacing-l:  .15rem;
--f-letter-spacing-m:  .08rem;
--f-letter-spacing-s:  .02rem;

--f-size-h1:  3.10rem;
--f-size-h2:  2.40rem;
--f-size-h3:  2.00rem;
--f-size-h4:  1.60rem;
--f-size-h5:  1.30rem;
--f-size-h6:  1.20rem;
--f-size-p-l: 1.60rem;
--f-size-p-m: 1.40rem;
--f-size-p-s: 1.20rem;

--f-size-button-big:    1.60rem;
--f-size-button-small:  1.20rem;

--f-line-height-h1:         /*4.1rem*/1.32em;
--f-line-height-h2:         /*3.3rem*/1.40em;
--f-line-height-h3:         /*2.8rem*/1.40em;
--f-line-height-h4:         /*2.2rem*/1.38em;
--f-line-height-h5:         /*2.2rem*/1.70em;
--f-line-height-h6:         /*1.8rem*/1.50em;
--f-line-height-p-l:        /*2.5rem*/1.56em;
--f-line-height-p-m:        /*2.0rem*/1.43em;
--f-line-height-p-s:        /*1.7rem*/1.42em;
--f-line-height-btn-big:    1.45em;
--f-line-height-btn-small:  1.30em;
--f-line-height-1:          1.00em;

--f-weight-regular:  400;
--f-weight-semibold: 600; 
--f-weight-bold:     700; 
  
--f-p-h1:  0 0 1.0rem 0;
--f-p-h2:  0 0 /*1.6rem*/.65em 0;
--f-p-h3:  0 0 /*1.5rem*/.60em 0;
--f-p-h4:  0 0 /*1.4rem*/.90em 0;
--f-p-h5:  0 0 /*1.2rem*/.90em 0;
--f-p-h6:  0 0 /*1.4rem*/1.1em 0;
--f-p-p-l: 0 0 /*2.4rem*/1.1em 0;
--f-p-p-m: 0 0 /*1.8rem*/1.1em 0;
--f-p-p-s: 0 0 /*1.4rem*/1.2em 0;

--bx-shadow-big: 0 0.7rem 1.5rem 0 rgba(0, 0, 0, 0.8);
--bx-shadow-small: 0 0.3rem 0.5rem 0 rgba(0, 0, 0, 0.8);
--bx-shadow-big-inset: inset 0 0 5.0rem 2.0rem rgba(0, 0, 0, .8);
--bx-shadow-small-inset: inset 0 0 3.0rem 1.0rem rgba(0, 0, 0, .8);

--br: 2px;

--maxwidth : 117rem;

}

@media screen and (max-width:767px) {
    :root { --bx-shadow-big: 0 0.6rem 1.0rem 0 rgba(0, 0, 0, 0.8); }
    :root { --bx-shadow-big-inset:   inset 0 0 3.0rem 1.0rem rgba(0, 0, 0, .8); }
    :root { --bx-shadow-small-inset: inset 0 0 2.0rem 1.0rem rgba(0, 0, 0, .7); }
}



/*********************************/
/* FONTS                         */
/*********************************/

/* FONT EMBED ********************/

@font-face {
    font-family: 'Headline-Primary';
    src: url('/wp-content/uploads/fonts/Domine-SemiBold.eot'); 
    src: url('/wp-content/uploads/fonts/Domine-SemiBold.woff2') format('woff2'),
         url('/wp-content/uploads/fonts/Domine-SemiBold.woff') format('woff'),
         url('/wp-content/uploads/fonts/Domine-SemiBold.eot?#iefix') format('embedded-opentype'), 
         url('/wp-content/uploads/fonts/Domine-SemiBold.ttf')  format('truetype'),
         url('/wp-content/uploads/fonts/Domine-SemiBold.svg#Headline-Primary') format('svg');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Text-Primary';
    src: url('/wp-content/uploads/fonts/IBMPlexSans-Regular.eot'); 
    src: url('/wp-content/uploads/fonts/IBMPlexSans-Regular.woff2') format('woff2'),
         url('/wp-content/uploads/fonts/IBMPlexSans-Regular.woff') format('woff'),
         url('/wp-content/uploads/fonts/IBMPlexSans-Regular.eot?#iefix') format('embedded-opentype'), 
         url('/wp-content/uploads/fonts/IBMPlexSans-Regular.ttf')  format('truetype'),
         url('/wp-content/uploads/fonts/IBMPlexSans-Regular.svg#Text-Primary') format('svg');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Text-Primary';
    src: url('/wp-content/uploads/fonts/IBMPlexSans-Bold.eot'); 
    src: url('/wp-content/uploads/fonts/IBMPlexSans-Bold.woff2') format('woff2'),
         url('/wp-content/uploads/fonts/IBMPlexSans-Bold.woff') format('woff'),
         url('/wp-content/uploads/fonts/IBMPlexSans-Bold.eot?#iefix') format('embedded-opentype'), 
         url('/wp-content/uploads/fonts/IBMPlexSans-Bold.ttf')  format('truetype'),
         url('/wp-content/uploads/fonts/IBMPlexSans-Bold.svg#Text-Primary') format('svg');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

/* BASIC FONT SETTINGS ***********/

* { box-sizing:border-box; } 

html {
    font-size:   10px;
    font-family: var(--f-family-text-primary);
    line-height: var(--f-line-height-p-m);
    font-weight: var(--f-weight-regular);
    color:       var(--c02);  
    background:  var(--c01);
}
body {
    font-size:   inherit; 
    color:       inherit; 
    text-align:  left; 
    font-size:   inherit;
    min-height:  100vh; 
}


/*
@media screen and (min-width:768px) and (max-width:1549px)  { html { font-size: 10px; }}
@media screen and (max-width:767px)             			{ html { font-size: 10px; }}*/

/* FONT PADDINGS *****************/

p, .edit ul, .edit ol { padding: var(--f-p-p-m);   }
p.f-p-l, h2.f-p-l     { padding: var(--f-p-p-l);   }
.f-p-s                { padding: var(--f-p-p-s);   }
.f-h1-p, h1           { padding: var(--f-p-h1);    }
.f-h2-p, h2           { padding: var(--f-p-h2);    }
.f-h3-p, h3           { padding: var(--f-p-h3);    }
.f-h4-p, h4           { padding: var(--f-p-h4);    }
.f-h5-p, h5           { padding: var(--f-p-h5);    }
.f-h6-p, h6           { padding: var(--f-p-h6);    }

p.f-p-0, .f-p-0 p, ul.f-p-0 { padding-bottom: 0 !important; }
.edit ul[class], .edit ol[class] { list-style:none; }
.hidden {display:none;}


/* RICH TEXT *********************/

p, li {
    font-family:    var(--f-family-text-primary);
    font-size:      var(--f-size-p-m);
    line-height:    var(--f-line-height-p-m);
    font-weight:    var(--f-weight-regular);
}
h1 {
    font-family:    var(--f-family-headline-primary);
    font-size:      var(--f-size-h1);
    line-height:    var(--f-line-height-h1);
    font-weight:    var(--f-weight-semibold);
    color:          var(--c04);
}
h2 {
    font-family:    var(--f-family-headline-primary);
    font-size:      var(--f-size-h2);
    line-height:    var(--f-line-height-h2);
    font-weight:    var(--f-weight-semibold);
    color:          var(--c04);
}
h3 {
    font-family:    var(--f-family-headline-primary);
    font-size:      var(--f-size-h3);
    line-height:    var(--f-line-height-h3);
    font-weight:    var(--f-weight-semibold);
    color:          var(--c04);
}
h4 {
    font-family:    var(--f-family-headline-primary);
    font-size:      var(--f-size-h4);
    line-height:    var(--f-line-height-h4);
    font-weight:    var(--f-weight-semibold);
    color:          var(--c04);
}
h5 {
    font-family:    var(--f-family-headline-primary);
    font-size:      var(--f-size-h5);
    line-height:    var(--f-line-height-h5);
    font-weight:    var(--f-weight-semibold);
    color:          var(--c04);
}
h6 {
    font-family:    var(--f-family-headline-primary);
    font-size:      var(--f-size-h6);
    line-height:    var(--f-line-height-h6);
    font-weight:    var(--f-weight-semibold);
    color:          var(--c04);
}

/* FONT CLASSES ******************/

/* MOBILE CORRECTION BEACHTEN */
.f-p-l, .f-p-l p, .f-p-l li, .nav .sub-menu a, .offcanvas .sub-menu .menu-item a, .data-grid-empty:after, .ts-control,
.is-form-style input.is-search-input, .sitemap p, .toc-content ol li, .form-select, .form-checkbox-list, .search {
    font-family:    var(--f-family-text-primary)!important;
    font-size:      var(--f-size-p-l)!important;
    line-height:    var(--f-line-height-p-l)!important;
    font-weight:    var(--f-weight-regular)!important;
}
.f-p-m, .f-p-m p, .f-p-m li, .filter .radio-input label, .intro-box-data h1 span, .d2-item.runenwort .inner ul li, .database-size,
.timer-amount, .marquee-content, .edit table td, .edit table td p, .edit table td li, .edit p.img-desc, .d2-item.runenwort .inner p,
.nav .menu-item-has-children:not(.mega-menu) .sub-menu a, .d2-item.standard .inner p, .d2-item.standard .inner li, .d2-item .inner p, .d2-item .inner li, .page-number, .d4-item .inner *, .d4-aspekt .inner *, .card:is(.d4-glyphe, .d4-knoten, .d4-skill) .inner div:not(.tags) * {
    font-family:    var(--f-family-text-primary)!important;
    font-size:      var(--f-size-p-m)!important;
    line-height:    var(--f-line-height-p-m)!important;
    font-weight:    var(--f-weight-regular)!important;
}
.f-p-s, .f-p-s p, .f-p-s li {
    font-family:    var(--f-family-text-primary)!important;
    font-size:      var(--f-size-p-s)!important;
  	line-height:    var(--f-line-height-p-s)!important;
  	font-weight:    var(--f-weight-regular)!important;
}
.f-h1 {
    font-family:    var(--f-family-headline-primary)!important;
    font-size:      var(--f-size-h1)!important;
  	line-height:    var(--f-line-height-h1)!important;
  	font-weight:    var(--f-weight-semibold)!important;
    color:          var(--c04);
}
.f-h2 {
    font-family:    var(--f-family-headline-primary)!important;
    font-size:      var(--f-size-h2)!important;
  	line-height:    var(--f-line-height-h2)!important;
  	font-weight:    var(--f-weight-semibold)!important;
    color:          var(--c04);
}
.f-h3 {
    font-family:    var(--f-family-headline-primary)!important;
    font-size:      var(--f-size-h3)!important;
  	line-height:    var(--f-line-height-h3)!important;
  	font-weight:    var(--f-weight-semibold)!important;
    color:          var(--c04);
}
.f-h4 {
    font-family:    var(--f-family-headline-primary)!important;
    font-size:      var(--f-size-h4)!important;
  	line-height:    var(--f-line-height-h4)!important;
  	font-weight:    var(--f-weight-semibold)!important;
    color:          var(--c04);
}
.f-h5 {
    font-family:    var(--f-family-headline-primary)!important;
    font-size:      var(--f-size-h5)!important;
  	line-height:    var(--f-line-height-h5)!important;
  	font-weight:    var(--f-weight-semibold)!important;
    color:          var(--c04);
}
.f-h6 {
    font-family:    var(--f-family-headline-primary)!important;
    font-size:      var(--f-size-h6)!important;
  	line-height:    var(--f-line-height-h6)!important;
  	font-weight:    var(--f-weight-semibold)!important;
    color:          var(--c04);
}
.f-btn-big, .nav .menu > .menu-item > a, .offcanvas .menu > li > a, .box .intro > p, .box .intro > h2, .boxhead p,
.card .name-title {
    font-family:    var(--f-family-headline-primary)!important;
    font-size:      var(--f-size-button-big)!important;
  	line-height:    var(--f-line-height-btn-big)!important;
  	font-weight:    var(--f-weight-semibold)!important;
  	letter-spacing: var(--f-letter-spacing-l)!important;
  	text-transform: uppercase!important;
}
.f-btn-small, .ad-banner:before, .is-show-more-results-text, .is-ajax-search-no-result, .card .name-label, .tag, .mood, 
.sitemap p a span, .lang-switch button, .edit table th, .tab-header a em, *[class*="mood-"]:before, .nr-list strong:before, 
h2[class*="bg-heading"] em, .para-switch.mobile *, .list-item .node-level, .new-item .name-title:before {
    font-family:    var(--f-family-text-primary)!important;
    font-size:      var(--f-size-button-small)!important;
  	line-height:    var(--f-line-height-btn-small)!important;
  	font-weight:    var(--f-weight-bold)!important;
  	letter-spacing: var(--f-letter-spacing-m)!important;
  	text-transform: uppercase!important;
}

/* FONT MOBILE CORRECTION ********/

@media screen and (max-width:767px) {
.f-h1, h1 { 
    font-size:      calc(var(--f-size-h1)*.8)!important; 
}
.f-h2, h2 { 
    font-size:      calc(var(--f-size-h2)*.9)!important; 
}
.f-h3, h3 { 
    font-size:      calc(var(--f-size-h3)*.9)!important; 
}
.f-p-l, .f-p-l p, .f-p-l li, .nav .sub-menu a, .offcanvas .sub-menu .menu-item a, .data-grid-empty:after, .ts-control,
.is-form-style input.is-search-input, .sitemap p, .toc-content ol li, .form-select, .form-checkbox-list, .search {
    font-size:      calc(var(--f-size-p-l)*.9)!important; 
}
.f-btn-big, .nav .menu > .menu-item > a, .offcanvas .menu > li > a, .box .intro > p, .box .intro > h2, .boxhead p,
.card .name-title {
    font-size:      calc(var(--f-size-button-big)*.85)!important; 
}
.f-btn-small, .ad-banner:before, .is-show-more-results-text, .is-ajax-search-no-result, .card .name-label, .tag, .mood, 
.sitemap p a span, .lang-switch button, .edit table th, .tab-header a em, *[class*="mood-"]:before, .nr-list strong:before, h2[class*="bg-heading"] em {
    font-size:      calc(var(--f-size-button-small)*.9)!important; 
}
}



/*********************************/
/* CSS FRAMEWORK                 */
/*********************************/

/* COLORS ************************/

:root {

/* Layout */ 
--c00: #ffffff; /* pure white */
--c01: #000000; /* black */
--c02: #D3CDC4/*E3E1DE*/; /* matte white */
--c03: #ef2c0e; /* red */
--c04: #b6aa89; /* green */
--c05: #818181; /* grey */
--c06: #262626; /* border light */
--c07: rgba(38,38,38,1); /* border dark */
--c08: #171717; /* bg light */
--c09: #111111; /* bg medium */
--c10: #0d0d0d; /* bg dark */
--c11: #292929; /* button bg */

/* Diablo */
--c-myt: #C193D0; /* mythic */
--c-uni: #DCA779; /* unique */
--c-leg: #FF6800; /* legendary */
--c-sel: #FFFA00; /* rare */
--c-mag: #6B82F3; /* magic */
--c-set: #90ff00; /* set */
--c-run: #B044CB; /* rune */
--c-nmr: #DBA864; /* number */

/* Tier List */

--c-p1: #159708; /* S-Tier */
--c-p2: #4CCA08; /* A-Tier */
--c-p3: #F4F10A; /* B-Tier */
--c-p4: #EF7D0E; /* C-Tier */
--c-p5: #EF2C0E; /* D-Tier */

}

.c00 { color:var(--c00)!important; }
.c01 { color:var(--c01)!important; }
.c02 { color:var(--c02)!important; }
.c03 { color:var(--c03)!important; }
.c04 { color:var(--c04)!important; }
.c05 { color:var(--c05)!important; }
.c06 { color:var(--c06)!important; }
.c07 { color:var(--c07)!important; }
.c08 { color:var(--c08)!important; }
.c09 { color:var(--c09)!important; }
.c10 { color:var(--c10)!important; }
.c11 { color:var(--c11)!important; }

.cp1 { color:var(--c-p1)!important; }
.cp2 { color:var(--c-p2)!important; }
.cp3 { color:var(--c-p3)!important; }
.cp4 { color:var(--c-p4)!important; }
.cp5 { color:var(--c-p5)!important; }

.bgc00 { background-color:var(--c00)!important; }
.bgc01 { background-color:var(--c01)!important; }
.bgc02 { background-color:var(--c02)!important; }
.bgc03 { background-color:var(--c03)!important; }
.bgc04 { background-color:var(--c04)!important; }
.bgc05 { background-color:var(--c05)!important; }
.bgc06 { background-color:var(--c06)!important; }
.bgc07 { background-color:var(--c07)!important; }
.bgc08 { background-color:var(--c08)!important; }
.bgc09 { background-color:var(--c09)!important; }
.bgc10 { background-color:var(--c10)!important; }
.bgc11 { background-color:var(--c11)!important; }

.bgcp1 { background-color:var(--c-p1)!important; }
.bgcp2 { background-color:var(--c-p2)!important; }
.bgcp3 { background-color:var(--c-p3)!important; }
.bgcp4 { background-color:var(--c-p4)!important; }
.bgcp5 { background-color:var(--c-p5)!important; }

/* EDITOR COLORS */

.has-inline-color, mark[class], .edit mark { transition:.2s;background:transparent!important;color:var(--c04); }
mark.de, mark.en {color:unset;}

.has-link-color                 { color:var(--c03)!important; }
.has-headline-color             { color:var(--c04)!important; }

.has-myt-color, .has-mythisch-color, .c-myt  { color:var(--c-myt)!important; }
.has-uni-color, .has-unique-color, .c-uni    { color:var(--c-uni)!important; }
.has-leg-color, .has-legendaer-color, .c-leg { color:var(--c-leg)!important; }
.has-mag-color, .has-magisch-color, .c-mag   { color:var(--c-mag)!important; }
.has-sel-color, .has-selten-color, .c-sel    { color:var(--c-sel)!important; }
.has-set-color, .c-set          { color:var(--c-set)!important; }
.has-run-color, .c-run          { color:var(--c-run)!important; }
.has-nmr-color, .c-nmr          { color:var(--c-nmr)!important; }
.has-white-color                { color:var(--c00)!important; }
.has-normal-color               { color:var(--c02)!important; }
.has-grau-color                 { color:var(--c05)!important; }

.has-ratinga-color, .rate_5     { color:var(--c-p1)!important; }
.has-ratingb-color, .rate_4     { color:var(--c-p2)!important; }
.has-ratingc-color, .rate_3     { color:var(--c-p3)!important; }
.has-ratingd-color, .rate_2     { color:var(--c-p4)!important; }
.has-ratinge-color, .rate_1     { color:var(--c-p5)!important; }
 
.has-hinweis-color              { color:var(--c-leg)!important; }
.hinweis .has-hinweis-color     { color:var(--c04)!important; }
.warnung .has-hinweis-color     { color:var(--c-leg)!important; }
.info .has-hinweis-color        { color:var(--c-mag)!important; }

/* TAGS **************************/

a               { transition:.2s!important;outline:none;cursor:pointer;text-decoration:none;color:var(--c03); }
button          { transition:.2s!important;outline:none;cursor:pointer;text-decoration:none;color:var(--c03);
          		  background:transparent;border:none;border-radius:0; }                 
a:hover     	{ color:var(--c04); }
a.c04:hover     { color:var(--c03)!important; }
a.c02:hover     { color:var(--c03)!important; }
blockquote      { }
ul, ol        	{ list-style-position: inside; }
.edit ul, .edit ol { list-style-position: outside;padding-left: .9em; }

/* FONT STYLES *******************/

.f-center, .has-text-align-center   { text-align:center!important;width:100%; }
.f-left, .has-text-align-left       { text-align:left!important; }
.f-right, .has-text-align-right     { text-align:right!important; }
.f-justify, .has-text-align-justify { text-align:justify!important; }

.f-bold, b, strong                  { font-weight:var(--f-weight-bold)!important; }
.f-reg                              { font-weight:var(--f-weight-regular)!important; }
.f-italic, i, em                    { font-style:italic!important; }

.f-uppercase, u                     { text-transform:uppercase!important; }
.f-underline                        { text-decoration:underline!important; }

/* IMAGES ************************/

.img-fill, *[class*="img-wrap"] > img { 
    width:100%!important;
    height:100%!important;
    object-fit:cover;
    object-position:center center; 
}
.img-full {
    width:100%;
    height:auto;
}
*[class*="img-wrap"] { 
    border:1px solid var(--c06);
    border-radius:var(--br);
    box-shadow: var(--bx-shadow-big);
    position:relative; 
    overflow:hidden;
}
a[class*="img-wrap"] img { 
    transition:.3s ease-in-out;
}
a[class*="img-wrap"]:hover { 
    border:1px solid var(--c03);
}
a[class*="img-wrap"]:hover img { 
    transform:scale(1.05);
}
*[class*="img-wrap"]:after {
    content: "";
    z-index: 50;
    position: absolute;
    inset: 0;
    pointer-events: none;
}
.img-wrap-small:after {
    box-shadow: var(--bx-shadow-small-inset);
}
.img-wrap-big:after {
    box-shadow: var(--bx-shadow-big-inset);
}

/* BASIC IMG BG ******************/

.img-bg-basic {
    position:relative;
}
a.img-bg-basic:hover {
    border-color:var(--c03);
}
.img-bg-basic > .img-bg {
    position: absolute;
    z-index:0;
    width:100%;
    height:100%;
    overflow:hidden;
    pointer-events:none;
}
.img-bg-basic > .img-bg img {
    position: relative;
    z-index:0;
    transition: .3s ease-in-out;
}
a.img-bg-basic:hover > .img-bg img {
    transform:scale(1.05);
}
.img-bg-basic > .img-bg:after {
    content:'';
    position: absolute;
    z-index:1;
    width:100%;
    height:100%;
    top:0;
    left:0;
    border-radius:1px;
    box-shadow:var(--bx-shadow-small-inset);
}

/* VALUES ************************/

.w100 { width: 100%; }
.h100 { height: 100%; }

:root {

--v05: 0.5rem;
--v10: 1.0rem;
--v15: 1.5rem;
--v20: 2.0rem;
--v25: 2.5rem;
--v30: 3.0rem;
--v35: 3.5rem;
--v40: 4.0rem;
--v45: 4.5rem;

}

@media screen and (max-width:767px) { :root { --v25: 2rem; } }

.gap-05   { gap:var(--v05); }
.gap-10   { gap:var(--v10); }
.gap-15   { gap:var(--v15); }
.gap-20   { gap:var(--v20); }
.gap-25   { gap:var(--v25); }
.gap-30   { gap:var(--v30); }
.gap-35   { gap:var(--v35); }
.gap-40   { gap:var(--v40); }

@media screen and (max-width:767px) {
.gap-767-15           { gap:var(--v15); }
}

.hgap-10   { gap:0 var(--v10); }
.hgap-20   { gap:0 var(--v20); }

.mt-05    { margin-top:var(--v05)!important; }
.mt-10    { margin-top:var(--v10)!important; }
.mt-15    { margin-top:var(--v15)!important; }
.mt-20    { margin-top:var(--v20)!important; }
.mt-25    { margin-top:var(--v25)!important; }
.mt-30    { margin-top:var(--v30)!important; }
.mt-35    { margin-top:var(--v35)!important; }
.mt-40    { margin-top:var(--v40)!important; }
.mt-45    { margin-top:var(--v45)!important; }

.mb-05    { margin-bottom:var(--v05)!important; }
.mb-10    { margin-bottom:var(--v10)!important; }
.mb-15    { margin-bottom:var(--v15)!important; }
.mb-20    { margin-bottom:var(--v20)!important; }
.mb-25    { margin-bottom:var(--v25)!important; }
.mb-30    { margin-bottom:var(--v30)!important; }
.mb-35    { margin-bottom:var(--v35)!important; }
.mb-40    { margin-bottom:var(--v40)!important; }
.mb-45    { margin-bottom:var(--v45)!important; }

.pt-05    { padding-top:var(--v05)!important; }
.pt-10    { padding-top:var(--v10)!important; }
.pt-15    { padding-top:var(--v15)!important; }
.pt-20    { padding-top:var(--v20)!important; }
.pt-25    { padding-top:var(--v25)!important; }
.pt-30    { padding-top:var(--v30)!important; }

.pb-05    { padding-bottom:var(--v05)!important; }
.pb-10    { padding-bottom:var(--v10)!important; }
.pb-15    { padding-bottom:var(--v15)!important; }
.pb-20    { padding-bottom:var(--v20)!important; }
.pb-25    { padding-bottom:var(--v25)!important; }
.pb-30    { padding-bottom:var(--v30)!important; }

.mt-0     { margin-top:0!important; }
.mb-0     { margin-bottom:0!important; }
.pt-0     { padding-top:0!important; }
.pb-0     { padding-bottom:0!important; }


/* FLEX **************************/

.flx                  { display:flex; }
.flx-d-column         { flex-direction:column; }
.flx-d-row            { flex-direction:row; }
.flx-wrap             { flex-wrap:wrap; }
.flx-nowrap           { flex-wrap:no-wrap; }
.flx-jc-start         { justify-content:flex-start; }
.flx-jc-end           { justify-content:flex-end; }
.flx-jc-center        { justify-content:center; }
.flx-jc-space-between { justify-content:space-between; } 
.flx-ai-start         { align-items:flex-start; }
.flx-ai-end           { align-items:flex-end; }
.flx-ai-center        { align-items:center; }
.flx-ai-stretch       { align-items:stretch; }
.flx-ac-start         { align-content:flex-start; }
.flx-ac-end           { align-content:flex-end; }
.flx-ac-center        { align-content:center; }
.flx-ac-stretch       { align-content:stretch; }
.flx-ac-space-between { align-content:space-between; }
.flx-ac-space-around  { align-content:space-around; }

/* GRID **************************/

*[class*="grd-"]      { display:grid; }
.grd-2                { grid-template-columns: repeat(2, minmax(1px, 1fr)); }
.grd-3                { grid-template-columns: repeat(3, minmax(1px, 1fr)); }
.grd-4                { grid-template-columns: repeat(4, minmax(1px, 1fr)); }
.grd-5                { grid-template-columns: repeat(5, minmax(1px, 1fr)); }
.grd-6                { grid-template-columns: repeat(6, minmax(1px, 1fr)); }

@media screen and (max-width:767px) {
.grd-767-1            { grid-template-columns: repeat(1, minmax(1px, 1fr)); }
.grd-767-2            { grid-template-columns: repeat(2, minmax(1px, 1fr)); }
}
@media screen and (max-width:479px) {
.grd-479-1            { grid-template-columns: repeat(1, minmax(1px, 1fr)); }
.grd-479-2            { grid-template-columns: repeat(2, minmax(1px, 1fr)); }
}

/* BORDER ************************/

.bd-full    { border:1px solid var(--c06); }
.bd-left  	{ border-left:1px solid var(--c06); }
.bd-right 	{ border-right:1px solid var(--c06); }
.bd-top   	{ border-top:1px solid var(--c06); }
.bd-bottom  { border-bottom:1px solid var(--c06); }

.bl-full    { border:1px solid var(--c07); }
.bl-left  	{ border-left:1px solid var(--c07); }
.bl-right 	{ border-right:1px solid var(--c07); }
.bl-top   	{ border-top:1px solid var(--c07); }
.bl-bottom  { border-bottom:1px solid var(--c07); }

.br-full  	{ border-radius:var(--br); }
.br-tl    	{ border-top-left-radius:var(--br); }
.br-tr    	{ border-top-right-radius:var(--br); }
.br-bl    	{ border-bottom-left-radius:var(--br); }
.br-br    	{ border-bottom-right-radius:var(--br); }

/* BOX SHADOW ********************/

.box-shadow-big     	{ box-shadow: var(--bx-shadow-big); }
.box-shadow-small     	{ box-shadow: var(--bx-shadow-small); }
.box-shadow-big-inset   { position:relative; }
.box-shadow-small-inset { position:relative; }
.box-shadow-big-inset:before { 
    content:'';
    top:0;
    left:0;
    width:100%;
    height:100%;
    border-radius:1px;
    position:absolute;
    z-index:5;
    pointer-events:none;
    box-shadow: var(--bx-shadow-big-inset); 
}
.box-shadow-small-inset:before { 
    content:'';
    top:0;
    left:0;
    width:100%;
    height:100%;
    border-radius:1px;
    position:absolute;
    z-index:5;
    pointer-events:none;
    box-shadow: var(--bx-shadow-small-inset); 
}
.box-shadow-none-inset:before, .box-shadow-none-inset:after {display:none!important;} 

/* LINE CLAMPS *******************/

.lc1, .lc2, .lc3 {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    word-wrap: break-word;
}
.lc1 { -webkit-line-clamp: 1; }
.lc2 { -webkit-line-clamp: 2; }
.lc3 { -webkit-line-clamp: 3; }

/* GRAD PSEUDO *******************/

.grad-top, .grad-bottom, .grad-left, .grad-right, .edit .wp-block-table tbody tr:first-child td {
  	position:relative;
}
.grad-top:before, .grad-bottom:before, .grad-left:before, .grad-right:before, #menu-open:before,
.edit .wp-block-table tbody tr:first-child td:before, .header .header-icons a:nth-child(5):before {
  	content:'';
  	position: absolute;
  	z-index:5;
  	pointer-events:none;
}
.grad-top:before, 
.edit .wp-block-table tbody tr:first-child td:before {
  	width:100%;
  	height:1.3rem;
  	top:0;
  	left:0;
  	background: linear-gradient(0deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, .5) 100%);
}
.grad-bottom:before {
  	width:100%;
  	height:1.3rem;
  	bottom:0;
  	left:0;
  	background: linear-gradient(0deg, rgba(0, 0, 0, .5) 0%, rgba(0, 0, 0, 0) 100%);
}
.grad-left:before,
.header .header-icons a:nth-child(5):before {
  	width:1.3rem;
  	height:100%;
  	top:0;
  	left:0;
  	background: linear-gradient(90deg, rgba(0, 0, 0, .5) 0%, rgba(0, 0, 0, 0) 100%);
}
.grad-right:before,
#menu-open:before {
  	width:1.3rem;
  	height:100%;
  	top:0;
  	right:0;
  	background: linear-gradient(90deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, .5) 100%);
}

/* Mobile Grad Fix ***************/

#menu-open:before {right:calc(100% + 1px);}
.header .header-icons a:nth-child(5):before {left:calc(100% + 1px);}
@media screen and (min-width:1100px) {#menu-open:before, .header .header-icons a:nth-child(5):before {display:none;}}

/* TRIANGLES *********************/

.triangle-top, .triangle-bottom, .triangle-left, .triangle-right, .d4-para-data .para-switch button.active, 
.header-games > a.active, .tab-header:not(.unstyled) li.active a {
  	position:relative;
}
.triangle-top:after, .triangle-bottom:after, .triangle-left:after, .triangle-right:after,
.header-games > a.active:before, .tab-header:not(.unstyled) li.active a:before, .d4-para-data .para-switch button.active:after {
  	content:'';
  	position: absolute;
  	pointer-events:none;
  	z-index:5;
  	height: 0;
    width: 0;
  	transition: 0s;
    opacity:.65;
}
.triangle-top:after {
  	top: -.8rem;
    left: calc(50% - .8rem);
    border-right: solid .8rem transparent;
    border-left: solid .8rem transparent;
    border-bottom: solid .8rem var(--c04);
}
.triangle-bottom:after, 
.header-games > a.active:before, .tab-header:not(.unstyled) li.active a:before {
  	bottom: -.8rem;
    left: calc(50% - .8rem);
    border-right: solid .8rem transparent;
    border-left: solid .8rem transparent;
    border-top: solid .8rem var(--c04);
    transition: 0;
}
.triangle-left:after {
  	top: calc(50% - .8rem);;
    left: -.8rem;
    border-right: solid .8rem var(--c04);
    border-bottom: solid .8rem transparent;
    border-top: solid .8rem transparent;  
}
.triangle-right:after, .d4-para-data .para-switch button.active:after {
  	top: calc(50% - .8rem);;
    right: -.8rem;
    border-left: solid .8rem var(--c04);
    border-bottom: solid .8rem transparent;
    border-top: solid .8rem transparent;  
}

/* SCROLLBARS */

/* Für Firefox */
* {
  scrollbar-width: thin; /* Optionen: auto | thin | none */
  scrollbar-color: var(--c11) var(--c01); /* thumb-farbe track-farbe */
}

/* Für Chrome, Safari und Edge */
*::-webkit-scrollbar {
  width: 6px; /* Breite der vertikalen Scrollbar */
  height: 6px; /* Höhe der horizontalen Scrollbar */
}

*::-webkit-scrollbar-track {
  background: var(--c01); /* Hintergrund des Tracks */
}

*::-webkit-scrollbar-thumb {
  background-color: var(--c11); /* Farbe des Scroll-Knopfes */
  border-radius: 3px; /* Abrundung */
  border: 2px solid var(--c01); /* Erzeugt einen Rand um den Thumb */
}

*::-webkit-scrollbar-thumb:hover {
  background-color: var(--c11); /* Farbe beim Drüberfahren */
}


/*********************************/
/* BUTTONS                       */
/*********************************/

.btn-big { padding:1.5rem 2rem;display:inline-block; }
.btn-medium { padding:.5rem 1.5rem;display:inline-block;height:3.8rem; }
.btn-small { padding:.5rem 1rem;display:inline-block; }

.btn-style-1 { background:var(--c03);color:var(--c00);border-radius:var(--br);box-shadow: var(--bx-shadow-small); }
.btn-style-1:hover { background:var(--c11);color:var(--c00); }
.btn-style-1 svg { fill:var(--c00); }

.btn-style-2 { background:var(--c11);color:var(--c02);border-radius:var(--br);box-shadow: var(--bx-shadow-small); }
.btn-style-2:hover { background:var(--c03);color:var(--c00); }
.btn-style-2 svg { fill:var(--c03); }
.btn-style-2:hover svg { fill:var(--c00)!important; }

.btn-border, .header-icons > *, .header-games > a { 
  	border:1px solid var(--c06);color:var(--c03);border-radius:var(--br); 
}
.btn-border:hover, .header-icons > *:hover, .header-games > a:hover { 
  	border:1px solid var(--c03);color:var(--c03);
  	background:var(--c09);box-shadow: var(--bx-shadow-small); 
}
.header-games > a.active { 
  	border:1px solid var(--c04);color:var(--c04);
  	background:var(--c09);box-shadow: var(--bx-shadow-small); 
}
.btn-border.btn-wicon svg { fill:var(--c03); }
.btn-border.btn-wicon:hover svg { fill:var(--c04); }

.btn-wicon svg { width:.85rem;height:.85rem;transition:.2s;}
.btn-wicon.b-fsize-big svg { width:1rem;height:1rem;}
.btn-wicon { display:inline-flex;gap:.8rem;align-items:center;justify-content:center;}
.btn-wicon-spaced { justify-content: space-between!important; }


.btn-icon-big, .header-icons > * { width:4.6rem;height:4.6rem;display:flex;align-items:center;justify-content:center;padding:0;}
.btn-icon-big svg, .header-icons > * svg { width:1.5rem;height:1.5rem;fill:var(--c02);transition:.2s; }
.btn-icon-big:hover svg, .header-icons > *:hover svg { fill:var(--c03); }

.btn-icon-medium { width:3.4rem;height:3.4rem;display:flex;align-items:center;justify-content:center;padding:0;}
.btn-icon-medium svg { width:1.3rem;height:1.3rem;fill:var(--c02);transition:.2s; }
.btn-icon-medium:hover svg { fill:var(--c03); }

.btn-icon-small { width:2.8rem;height:2.8rem;display:flex;align-items:center;justify-content:center;padding:0;}
.btn-icon-small svg { width:1rem;height:1rem;fill:var(--c02);transition:.2s; }
.btn-icon-small:hover svg { fill:var(--c03); }

.btn-50, .header-icons > * { border-radius: 50%; }



/*********************************/
/* NAVIGATION                    */
/*********************************/

/* LOGO **************************/

.logo {
	width:26.3rem;
	height:6.2rem;
    transition:0s!important;
}
@media screen and (max-width:767px) {
	.logo { width:21.2rem;height:5rem; }	
}
@media screen and (max-width:350px) {
	.logo { width:17rem;height:4rem; }	
}

/* HEADER ************************/

.header {
    width: 100%;
  	min-height:7.5rem;
  	position:relative;
  	z-index:2000;
	padding-left:var(--v20);
	padding-right:var(--v20);
}
.header-wrap {
  	width:100%;
  	max-width:var(--maxwidth);
  	margin:0 auto;
}
.header-games > a {
  	width:6.2rem;
  	height:5rem;
  	border-radius:var(--br);
  	display: flex;
  	align-items:center;
  	justify-content:center;
}
.header-games > a img {
  	width:3.6rem;
  	height:3.6rem;
}
.header-games > a:last-child {
  	width:3.2rem;
}
.header-games > a:last-child svg {
  	fill:var(--c02);
  	width:1rem;
  	height:1rem;
  	transition:.2s;
}
.header-games > a:last-child:hover svg {
  	fill:var(--c04);
}
@media screen and (max-width:1099px) {
	.header .header-games, .header .header-icons a:not(:nth-child(5)) { display:none; }
	.header { position:fixed;top:0;align-items:center;background:var(--c09);border-bottom:1px solid var(--c06);
    z-index:10000;box-shadow:var(--bx-shadow-big);min-height:6.5rem; }
    .logo { position:absolute;left:50%;transform:translateX(-50%);}
    .header .header-icons button, .header .header-icons a:nth-child(5) { 
        position:absolute;top:1.45rem;border:none;border-radius:0;
        width:calc(6.5rem - 1px);height:calc(6.5rem - 1px);top:0;
        border-radius:0;background:var(--c08);box-shadow:none;
    }
    .header .header-icons button { border-left:1px solid var(--c07);right:0; }
    .header .header-icons a:nth-child(5) { 
        border-right:1px solid var(--c07);left:0;}
    .header .header-icons button svg { width:1.6rem;height:1.6rem; }
}
@media screen and (max-width:767px) {
	.header { min-height:5.2rem;box-shadow: var(--bx-shadow-big); }
	.header .header-icons button, .header .header-icons a:nth-child(5) { width:calc(5.2rem - 1px);height:calc(5.2rem - 1px);top:0; }
}


/* MOBILE LANDSCAPE STICKY FIX *****/

@media screen and (max-width:1099px) and (max-height:500px) {
    .header {position:relative;}
    .content {padding-top:5rem!important;}
    .toc-box {top:0!important;}
    .build-toc {top:0!important;}
    .item-details-mobile .sticky {top:6.5rem!important;z-index:15001;}
    .para-switch.mobile {top:calc(5rem - 1px)!important;z-index:15000;}
}
@media screen and (max-width:767px) and (max-height:500px) {
    .content {padding-top:3.3rem!important;}
}



/* MAIN MENU *********************/

.nav {
    width:100%;
    z-index:7000;
    position:sticky;
  	top:0;
	padding-left:var(--v20);
	padding-right:var(--v20);
}
.nav > div {
  	width:100%;
  	max-width:var(--maxwidth);
    background:var(--c09);
    border:1px solid var(--c06);
    box-shadow:var(--bx-shadow-big);
    padding-left:var(--v20);
	padding-right:var(--v20);
    border-radius:var(--br);
  	margin:0 auto;
}
.nav .menu {
  	width:100%;
  	min-height:5rem;
  	display:flex;
  	justify-content:center;
  	align-items:stretch;
    gap:0 var(--v40);
}
.nav .nav-wide .menu {
    justify-content:space-between;
    gap:unset;
}
.nav .menu > .menu-item {
    display:flex;
    align-items:stretch;
}
.nav .menu > .menu-item > a {
    color:var(--c02);
    display: flex;
    align-items:center;
    position:relative;
}
.nav .menu > .menu-item:hover > a {
    color:var(--c03);
}
.nav .menu > .current_page_item:not(.no-current) > a, 
.nav .menu > .current-menu-item:not(.no-current) > a {
    color:var(--c04);
}
.nav .menu > .current_page_item:not(.no-current) > a:before,
.nav .menu > .current-menu-item:not(.no-current) > a:before {
    content:'';
    position: absolute;
    bottom:-1px;
    left:0;
    z-index:5;
    width:100%;
    height:1px;
    background:var(--c04);
}
@media screen and (max-width:1099px) {
	.nav { display:none!important; }
}

/* MAIN MENU ARROW **************/

.nav .menu > .menu-item-has-children:not(.mega-menu) {
    position: relative;
}
.nav .menu > .menu-item-has-children > a {
    padding-right:1.5rem;
    position: relative;
    z-index:5500;
}
.nav .menu > .menu-item-has-children > a:after {
    width: 1rem;
    height: 1rem;
    position: absolute;
    right: 0;
    top: calc(50% - .5rem);
    content:'';
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23b6aa89' viewBox='0 0 24 24'%3E%3Cpath d='M0 7.33l2.829-2.83 9.175 9.339 9.167-9.339 2.829 2.83-11.996 12.17z'/%3E%3C/svg%3E");
    transition:.2s;
}
.nav .menu > .menu-item-has-children:hover > a:after {
    transform:rotateX(180deg);
}
.nav .menu > .menu-item-has-children:not(.current-menu-item):hover > a:after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23ef2c0e' viewBox='0 0 24 24'%3E%3Cpath d='M0 7.33l2.829-2.83 9.175 9.339 9.167-9.339 2.829 2.83-11.996 12.17z'/%3E%3C/svg%3E");
}

/* DROPDOWN **********************/

.nav .sub-menu {
    position: absolute;
    z-index:5000;
    background: var(--c09);
    box-shadow: 0 0 1.6rem .4rem rgba(0, 0, 0, 1); ;
    border:1px solid var(--c07);
    border-radius:var(--br);
    width: auto;
    padding:var(--v10) var(--v20);
    top: 5.5rem;
    left: 50%;
    transform:translateX(-50%);
    opacity: 0;
    visibility: hidden;
    transition: 0.2s;
    width:16rem;
}
.nav .sub-menu-wide > .sub-menu {width:23rem;}
.nav .sub-menu-extra-wide > .sub-menu {width:30rem;}
.nav .menu-item-has-children:hover .sub-menu {
    top: 5rem;
    opacity: 1;
    visibility: visible;
}
.nav .sub-menu > li {
    display: flex;
    justify-content: space-between;
    width: auto;
}
.nav .menu-item-has-children:not(.mega-menu) .sub-menu li:not(:first-child) {
    border-top:1px solid var(--c07);
}
.nav .menu-item-has-children:not(.mega-menu) .sub-menu a {
    padding: .6rem .8rem .6rem 0;
    color:var(--c02)!important;
    display:flex;
    justify-content:space-between;
    align-items:center;
    width:100%;
    position:relative;
}
.nav .menu-item-has-children:not(.mega-menu) .sub-menu a:hover {
    color:var(--c03)!important;
}
.nav .menu-item-has-children:not(.mega-menu) .sub-menu a:after {
    width: 1rem;
    height: 1rem;
    position: absolute;
    right: .4rem;
    top: calc(50% - .5rem);
    content:'';
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23ef2c0e' viewBox='0 0 24 24'%3E%3Cpath d='M7.33 24l-2.83-2.829 9.339-9.175-9.339-9.167 2.83-2.829 12.17 11.996z'/%3E%3C/svg%3E");
    transition:.2s;
    opacity:0;
}
.nav .menu-item-has-children:not(.mega-menu) .sub-menu a:hover:after {
    opacity:1;
    right: -.2rem;
}

/* MEGA MENU *********************/

.nav .mega-menu {
    position:static!important;
}
.nav .mega-menu .sub-menu {
    position: absolute;
    z-index:5000;
    left: 50%;
    width: 100%!important;
    max-width:125rem;
    transform:translateX(-50%);
    padding:0 var(--v20);
    box-shadow:none;
    background: transparent;
    border:none;
}
.nav .mega-menu.menu-item-has-children:hover .sub-menu {
    top:calc(5rem + 1px);
}

/* MEGA WRAP */

.nav .mega-wrap {
    width:calc(100% - 4rem);
}
.mega-wrap {
    margin:0 auto;
    max-width:117rem;
    background: var(--c09);
    box-shadow: 0 0 1.6rem .4rem rgba(0, 0, 0, 1); ;
    border:1px solid var(--c07);
    border-radius:var(--br);
    padding:var(--v15) var(--v20);
    gap:var(--v20) var(--v20);
    display:grid;
}
.nav .mega-wrap.hide-5 > div:last-child {display:none;}

.mega-wrap li, .mega-wrap a, .sub-menu .mega-wrap a {
    display: block;
    color:var(--c02);
    font-size: var(--f-size-p-m)!important;
    line-height: var(--f-line-height-p-m)!important;
}
.mega-wrap a:hover {
    color:var(--c03);
}
.mega-wrap p {
    padding:0;
}
.mega-wrap .f-btn-small {
    position:relative;
    margin:.7rem 0 .5rem!important;
}
.mega-wrap .f-btn-small.mt-0 {
    position:relative;
    margin:-.5rem 0 .5rem!important;
}
.mega-wrap .f-btn-small span {
    background:var(--c09);
    position:relative;
    z-index:5;
    padding-right:.5rem;
}
.mega-wrap .f-btn-small span:empty {
    opacity:0;
}
.mega-wrap .f-btn-small:before {
    content:'';
    position: absolute;
    bottom:.2rem;
    left:0;
    width:100%;
    height:1px;
    z-index:0;
    background:var(--c07);
}
.mega-wrap .f-btn-big {
    display: flex;
    align-items:center;
    justify-content: space-between;
    width:100%;
}
.mega-wrap .empty {
    color:transparent;
    pointer-events:none;
}

@media screen and (max-width:1400px) {
    .mega-wrap { width:100%;gap:var(--v15); }
}

/* Mega Hinweis */

.mega-hinweis {padding-bottom:7rem!important;}
.mega-hinweis-text {position:absolute;bottom:0;left:0;width:100%;padding:1rem 2rem!important;border-top:1px solid var(--c06);
    text-align:center;min-height:4.8rem;}
.mega-hinweis-text a {display:inline!important;color:var(--c03)!important;}

/***************************************************/
/***************************************************/
/* MEGA D4 BUILDS UL MIN HÖHEN *********************/
/***************************************************/
/***************************************************/

/* 4 Zeilen = 8em | 3 Zeilen = 6em | 2 Zeilen = 4em */

.mega-d4-builds div.class-section ul {min-height:2rem;}

@media screen and (min-width:1100px) { /* 4 SPALTEN */
    /* 1-4 */ .mega-d4-builds div.class-section:nth-child(-n+4) ul:nth-child(3)                {min-height:8rem;}
    /* 5-8 */ .mega-d4-builds div.class-section:nth-last-child(n+5):nth-last-child(-n+8) ul:nth-child(3) ul:nth-child(3)            
                                                                                               {min-height:4rem;}
}
@media screen and (min-width:768px) and (max-width:1099px) { /* 3 SPALTEN */
    /* 1-3 */ .mega-d4-builds div.class-section:nth-child(-n+3) ul:nth-child(3)                {min-height:8rem;}
    /* 4-6 */ .mega-d4-builds div.class-section:nth-child(n+4):nth-child(-n+6) ul:nth-child(3) {min-height:4rem;}
    /* 7-8 */ .mega-d4-builds div.class-section:nth-child(n+7):nth-child(-n+8) ul:nth-child(3) {min-height:4rem;}
}
@media screen and (min-width:501px) and (max-width:768px) { /* 2 SPALTEN */
    /* 1-2 */ .mega-d4-builds div.class-section:nth-child(-n+2) ul:nth-child(3)                {min-height:8rem;}
    /* 3-4 */ .mega-d4-builds div.class-section:nth-child(n+3):nth-child(-n+4) ul:nth-child(3) {min-height:4rem;}
    /* 5-6 */ .mega-d4-builds div.class-section:nth-child(n+5):nth-child(-n+6) ul:nth-child(3) {min-height:4rem;}
    /* 7-8 */ .mega-d4-builds div.class-section:nth-child(n+7):nth-child(-n+8) ul:nth-child(3) {min-height:4rem;}
}


/* OFFCANVAS *********************/

.offcanvas-active {
    overflow:hidden;
}
.offcanvas {
    position: fixed;
    top: 0;
    right: 0;
	width:100%;
    max-width: 34rem;
	border-left:1px solid var(--c07);
    height: 100%;
    background: var(--c09);
    color: var(--c02);
    padding:1.45rem var(--v20) var(--v40);
    box-shadow: none;
    transform: translateX(100%);
    transition: transform .4s ease;
    z-index: 9999999999;
    overflow:scroll;
}
.offcanvas.open {
    transform: translateX(0);
    box-shadow: 0 0 2rem rgba(0,0,0,.4);
}
.offcanvas .menu {
    list-style:none;
    padding:0;
    padding:1.45rem 0 0 0;
}
.offcanvas .menu > li > a {
    color: var(--c02);
    border-top:1px solid var(--c07);
    display: flex;
    align-items: center;
    justify-content: space-between;
    width:100%;
	min-height:5rem;
    padding: .1rem 0 0 0;
}
.offcanvas .menu > li > a:hover {
	color:var(--c04);
}
.offcanvas .menu > li:last-child > a {
    border-bottom:1px solid var(--c07);
}
.offcanvas .menu > li > a:hover {
    color:var(--c04);
}
.backdrop {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.7);
	backdrop-filter: blur(3px);
    opacity: 0;
    visibility: hidden;
    transition: opacity .4s ease;
    z-index: 9999999998;
}
.backdrop.show {
    opacity: 1;
    visibility: visible;
}

/* OFFCANVAS PROMO */

.offcanvas-promo {
    display:block;
    margin:1.45rem 0 .55rem 0;
}
.offcanvas-promo:hover {
    border-color:var(--c03);
}
.offcanvas-promo .img-bg {
    border-radius:px;
    overflow:hidden;
    position:relative;
}

/* OFFCANVAS SUBMENU ************/

.offcanvas .menu-item-has-children > a {
    position:relative;
}
.offcanvas .menu-item-has-children > a:after {
    content:'';
	position: absolute;
	right:1px;
	top:50%;
    transform:translateY(-50%);
	width: 3.2rem;
    height: 3.2rem;
	pointer-events:none;
}
.offcanvas .ico-d4 > a:after {
    background:url('/wp-content/uploads/Game-Icon-D4-2x.webp') center center no-repeat;
    background-size:cover;
}
.offcanvas .ico-d2 > a:after {
    background:url('/wp-content/uploads/Game-Icon-D2R-2x.webp') center center no-repeat;
    background-size:cover;
}
.offcanvas .ico-poe2 > a:after {
    background:url('/wp-content/uploads/Game-Icon-POE2-2x.webp') center center no-repeat;
    background-size:cover;
}
.offcanvas .sub-menu {
    padding:1.5rem;
    margin: 0;
    list-style: none;
	border-top:1px solid var(--c07);
	border-left:1px solid var(--c07);
	border-right:1px solid var(--c07);
	border-radius:var(--br) var(--br) 0 0;
	background:var(--c10);
	display: grid;
    gap:var(--v05);
	grid-template-columns: repeat(2, minmax(1px, 1fr));
    position:relative;
}
.offcanvas .sub-menu > .menu-item {
  	border-bottom: none; 
}
.offcanvas .menu-item-has-children.open > .sub-menu {
    max-height: 50rem; 
    padding-bottom: 1rem; 
}
.offcanvas .sub-menu .menu-item a {
    color:var(--c02);
	display: block;
    padding:.2rem 0;
    background:var(--c08);
    height:3.5rem;
    border-radius:var(--br);
    display: flex;
    align-items:center;
    justify-content:center;
}
.offcanvas .menu .current-menu-item > a {
    color:var(--c04);
}
.offcanvas .sub-menu .menu-item a:hover {
    background:var(--c03);color:var(--c02);
}

/* LEGAL */

.legal { margin-top:var(--v15); }
.legal a { color:var(--c05); }
.legal a:hover { color:var(--c04); }

/* BACKGROUND IMAGE **************/

.fixed-bg {
    position: fixed;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    max-width: 1600px;
    height: 100vh;
    max-height: 90rem;
    z-index: -1;
    pointer-events: none;
    opacity:.8;
}
.fixed-bg:after {
  	content:'';
  	position: absolute;
  	top:0;
  	left:0;
  	width:100%;
  	height:12rem;
  	background: #000000;
  	background: linear-gradient(0deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 100%);
  	z-index:1;
}
@media screen and (max-width:767px) {
	/*.fixed-bg { display:none; }*/
}

/* FOOTER ************************/

.footer {
    width: 100%;
  	position:relative;
  	z-index:2000;
	padding-left:var(--v20);
	padding-right:var(--v20);
}
.footer-wrap {
    border-top:1px solid var(--c07);
  	width:100%;
  	max-width:var(--maxwidth);
  	margin:var(--v35) auto 0 auto;
    padding:var(--v20) 0 110px 0;
    position:relative;
}
.footer-wrap p, .footer-wrap p a {
    color:var(--c05);
}
.footer-wrap p a:hover {
    color:var(--c04);
}
.footer-wrap .btn-icon-medium {
    position:absolute;
    left:50%;
    top:0;
    transform:translate(-50%, -50%);
}
@media screen and (max-width:767px) {
    .footer-wrap { flex-direction:column; }
    .footer-wrap p:last-child { order:1;gap:1.5rem;margin:0 0 -1.5rem 0; }
    .footer-wrap p:first-child { order:2; }
    .footer-wrap .btn-icon-medium { display:none; }
}

/*********************************/
/* ADS ***************************/
/*********************************/

/* TOP BILLBOARD */
.ad-banner {
    position:relative;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow:hidden;
    border-radius:var(--br);
}
.ad-banner:before {
    content: 'Anzeige';
    border-radius:var(--br);
    border:1px solid var(--c07);
    position: absolute;
    width: 100%;
    height: 100%;
    color:var(--c06);
    top: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 0;
    pointer-events: none;
}
#ad-top-billboard, #ad-bottom-billboard, #ad-mid-billboard {
    width: 100%;
    max-width: var(--maxwidth);
    min-height: 280px;
    max-height: 280px;
}
#ad-top-billboard {
    margin:0 auto var(--v35) auto;
}
#ad-bottom-billboard, #ad-mid-billboard {
    margin:var(--v35) auto 0 auto;
}
@media screen and (max-width:767px) {
    #ad-top-billboard { min-height:100px;max-height:100px;margin:0 auto var(--v25) auto; }
    #ad-bottom-billboard, #ad-mid-billboard { min-height:280px;max-height:280px;margin:var(--v35) auto 0 auto; }
}
/* SIDERAIL */
#ad-siderail-wrap {
    position: relative;
    width: 100%;
}
#ad-siderail-left, #ad-siderail-right {
    position: fixed;
    z-index: 6000;
    top: calc(50%);
    transform:translateY(-50%);
    align-items: flex-end;
    min-height: 600px;
    max-height: 600px;
    width: 160px;
    transition:.2s ease;
}
#ad-siderail-left { left: calc(50% - 78.5rem); }
#ad-siderail-right { right: calc(50% - 78.5rem); }

@media screen and (min-width:1840px) {
    #ad-siderail-left { width: 320px;left: calc(50% - 93.5rem); }
    #ad-siderail-right { width: 320px;right: calc(50% - 93.5rem); }
}
@media screen and (max-width:1520px) {
    #ad-siderail-left { left: calc(50% - 76.5rem); }
    #ad-siderail-right { right: calc(50% - 76.5rem); }
}
/* SIDEBAR */
div[id*="ad-sidebar-"] {
    width:100%;
    min-height: 600px;
    max-height: 600px;
}
@media screen and (max-width:1099px) {
    div[id*="ad-sidebar-"] { min-height:100%;max-height:100%; }
}
@media screen and (max-width:649px) {
    div[id*="ad-sidebar-"] { min-height:280px;max-height:280px; }
}
/* IN CONTENT */
div[id*="ad-incontent"] {
    margin: 0 0 var(--v25) 0;
    min-height: 280px;
    max-height: 280px;
    width: 100%;
    max-width: 840px;
    clear: both;
    position: relative;
    z-index: 0;
}

/* PUBLIFT */ 

/* ANCHOR STYLES */

.publift-widget-sticky_footer-container-background {background-color:transparent!important;pointer-events:none!important;}
.publift-widget-sticky_footer {align-items:flex-end!important;}

/* COOKIE BANNER */

.qc-cmp-cleanslate {background-color: rgba(0, 0, 0, 0.75)!important;}
.qc-cmp2-summary-section .qc-cmp2-summary-info div {padding-bottom:6px!important;}
.qc-cmp-cleanslate > #qc-cmp2-ui {padding-top:12px!important;}
.qc-cmp2-consent-info {padding-left:15px!important;padding-right:15px!important;padding-top:0!important;}
.qc-cmp2-publisher-logo-container .span-heading {padding-left:0!important;padding-right:0!important;}



/*********************************/
/* ELEMENTS                      */
/*********************************/

/* CONTENT ***********************/

.content { 
    padding:var(--v35) var(--v20) 0; 
}
.content-wrap { 
    width:100%;
    max-width:var(--maxwidth);
    margin:0 auto; 
}
.main-wrap {
    display:flex;
    gap:var(--v35);
}
.main-col {
    width:calc(100% - 33.5rem);
}
.sidebar {
    width:30rem;
    display: flex;
    flex-direction:column;
    gap:var(--v25);
}
.sidebar-wrap {
    display: flex;
    flex-direction:column;
    gap:var(--v25);
}

/* SHORT SIDEBAR HIDE ************/

.sidebar.short > .short { display:none!important; }

@media screen and (max-width:1099px) {
    .content { padding:11.5rem var(--v20) 0;max-width:830px;margin:0 auto; }
    .main-wrap { flex-direction:column; }
    .main-col, .sidebar { width:100%; }
    .sidebar { display:grid;grid-template-columns: repeat(2, minmax(1px, 1fr));gap:var(--v20)!important;}
    .main-wrap:not(.database) .sidebar { border-top:1px solid var(--c06);padding-top:var(--v35); }
    .sidebar-wrap {display:none!important; }
}
@media screen and (max-width:767px) {
    .content { padding:8.5rem var(--v15) 0; } 
    .sidebar, .sidebar-wrap, .sidebar .sticky {gap:var(--v15)!important;} 
}
@media screen and (max-width:649px) {
    .sidebar { display:grid;grid-template-columns: repeat(1, minmax(1px, 1fr));max-width:45rem;margin:0 auto; }
}

/* BOX ***************************/

.box, .hinweis, .info, .warnung, .data-grid-empty:after, .edit blockquote, .boxpad, .edit pre.wp-block-code, .splide,
.tippy-box[data-theme~='tippy-minimal'], .build-item, .build-intro, .archiv.archiv-hinweis {
    background:var(--c09);
    border:1px solid var(--c06);
    border-radius:var(--br);
    box-shadow: var(--bx-shadow-big);
}
.hinweis, .info, .warnung {
    margin: var(--f-p-p-m);
}
.box .intro {
    display: flex;
    align-items:center;
    justify-content:space-between;
    min-height:4.8rem;
    padding:var(--v05) var(--v10) var(--v05) var(--v20);
    background:var(--c08);
    border-bottom:1px solid var(--c06);
}
.box .intro.center {
    padding:var(--v05) var(--v20);
}
.box .intro > p {
    color:var(--c04);
    padding:.2rem 0 0 0!important;
}
.box .intro > svg {
    width:1.5rem;
    height:1.5rem;
    fill:var(--c02);
    margin-right:.8rem;
}
.box .inner {
    padding:var(--v15) var(--v20);
}
@media screen and (max-width:767px) {
.box .intro {padding:var(--v05) var(--v05) var(--v05) var(--v15);min-height:4rem;}
.box .inner {padding:var(--v10) var(--v15);}
}

/* PAGE INTRO */

.main-col-intro {
    width:100%;
    min-height:18rem;
    display: flex;
    justify-content:space-between;
    gap:var(--v30);
    padding-bottom:var(--v25);
}
@media screen and (min-width:768px) {
    .main-col-intro > div.flx {max-width:calc(100% - 30.5rem);}
}

.main-col-intro #ad-maincol-video {
    aspect-ratio: 16 / 9;
    width:27.5rem;
    height:15.5rem;
}
.main-col-intro h1 {
    max-width:58rem;
    margin-top:-.2em;
}
.main-col-intro p.f-p-l {
    padding-bottom:2.3rem!important;
    max-width:58rem;
}
@media screen and (max-width:767px) {
    .main-col-intro { flex-direction:column;gap:var(--v20);min-height:unset; }
    .main-col-intro > div:last-child { margin:0 auto; }
    .main-col-intro #ad-maincol-video {margin-top:0rem;width:26rem;height:14.6rem; }
    .main-col-intro .filter {margin-bottom:var(--v25);}
}
@media screen and (min-width:768px) {
    .main-col-intro > .flx .f-btn-small {margin-bottom:-.3rem;}
}

/* TABS **************************/

.tab-header:not(.unstyled) {
    display:flex;
    gap:var(--v05);
    align-items: stretch;
    width:100%;
    overflow-X:auto;
    padding:0 0 var(--v10) 0!important;
}
.tab-header:not(.unstyled) li {
    list-style:none;
    width:100%;
    min-width:15rem;
    padding-left:0!important;
}
.tab-header:not(.unstyled) li:before {
    display: none;
}
.tab-header:not(.unstyled) li a {
    background:var(--c11);
    border:1px solid var(--c11);
    min-height:4.8rem;
    padding:1.2rem var(--v20);
    border-radius:var(--br);
    color:var(--c02);
    font-weight:var(--f-weight-bold);
    line-height: var(--f-line-height-p-s)!important;
    width:100%;
    height:100%;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:var(--v05);
    box-shadow: var(--bx-shadow-small);
    text-align:center;
}
@media (hover: hover) {
    .tab-header:not(.unstyled) li a:hover {border:1px solid var(--c03);}
}
@media screen and (max-width:767px) { 
    .tab-header:not(.unstyled) {margin:0 0 0 -1.5rem!important;padding-left:1.5rem!important;width:calc(100% + 3rem);padding-right:1.5rem !important;}
    .tab-header:not(.unstyled) li a {min-height:4rem;padding:var(--v10) var(--v20);gap:.4rem;}
}
.tab-header:not(.unstyled) li.active a, .tab-header:not(.unstyled) li.highlight:not(.active) a {
    background:var(--c04);
    border:1px solid var(--c04);
    color:var(--c01);
}




/* LINKED SYMBOL */
/*
.linked + .linked {
    position:relative;
}
.linked + .linked:before {
    content:'';
    position:absolute;
    z-index:10;
    left:-1.4rem;
    top:50%;
    transform:translateY(-50%);
    width:2.3rem;
    height:.9rem;
    background:var(--c05);
    border:.3rem solid var(--c01);
    border-radius:.45rem;
    display:block;
    opacity:1;
}
.linked.highlight:before, .linked.active:before {
    background:var(--c04);
}
*/
.tab-header li a em {
    font-style:normal!important;
    color:var(--c04)!important;
}
.tab-header li a em:empty {
    display:none;
}
.tab-header li.active a em, .tab-header li.highlight:not(.active) a em {
    mix-blend-mode: multiply;
    color:var(--c05)!important;
}
.tab-content {
    margin-top:var(--v15);
    display: none;
}
.tab-content.active {
    display: block;
}


/* MOOD **************************/

*[class*="mood-"]:before {
    position:relative;
    border-radius:var(--br);
    margin-right:.5rem;
    padding:.05rem .4rem;
}
.mood-neu:before {
    content:'NEU';
    background:var(--c03);
    color:var(--c00);
}
.mood-update:before {
    content:'UPDATE';
    background:var(--c-uni);
    color:var(--c01);
}
.mood-hot:before {
    content:'HOT';
    background:var(--c-sel);
    color:var(--c01);
}
.mood-meta:before {
    content:'META';
    background:var(--c-myt);
    color:var(--c00);
}
.mega-wrap .s-tier {
    position: relative;
}
.mega-wrap .s-tier:after {
    content: '★';
    font-size: .95em !important;
    line-height: 1em !important;
    padding: 0!important;
    color: var(--c-p2);
    display: inline-block;
    transform: translateY(-.1em);
}
@-moz-document url-prefix() {
.mega-wrap .s-tier:after {
    font-size: 1.25em !important;
    line-height: 1em !important;
    padding: 0!important;
    transform: translateY(-.05em);
}
}
.mood-bald:before {
    content:'BALD';
    background:var(--c05);
    color:var(--c00);
}
.menu li:not(.mega-menu) .mood-bald a {opacity:.6!important;}
.mega-wrap .mood-bald {color:var(--c05)!important;}
.nav .sub-menu > li[class*="mood-"] {align-items:center;}

div.mood[class*="-tier"].d-tier {color:var(--c05);}
.mood.s-tier {color:var(--c-p5);}
.mood.a-tier {color:var(--c-p3);}

.mood.neu {color:var(--c03);}
.mood.hot {color:var(--c-sel);}
.mood.meta {color:var(--c-myt);}




/* BUILD ITEM MOOD */

.build-item .mood {
    position:absolute;
    top:var(--v20);
    right: 0rem;
    z-index:10;
    border-radius:var(--br) 0 0 var(--br);
    padding:.05rem .4rem;
    background:var(--c03);
    color:var(--c00);
    pointer-events:none;
}
.build-item.archiv .mood {display:none;}
.build-item .mood.meta {
    background:var(--c-myt);
    color:var(--c00);
}
.build-item .mood.update {
    background:var(--c-uni);
    color:var(--c01);
}
.build-item .mood.hot {
    background:var(--c-sel);
    color:var(--c01);
}





/* ACCORDION *********************/

.acco-panel { display: none; }
.acco-panel.active { display: block; background: var(--c05); }
.acco-header { cursor: pointer; background: var(--c05); }

/* HR ****************************/

.main-col > hr, .edit hr, .tippy-box hr {
    background:transparent;
    border:none;
    border-bottom:1px solid var(--c07);
}

/* POPUPS ************************/

.ppp-container {
  	position: fixed;
  	top: 0; left: 0;
  	width: 100vw; 
  	height: 100dvh;
  	background: rgba(0,0,0,0.7);
    backdrop-filter: blur(3px);
  	opacity: 0;
  	pointer-events: none;
  	transition: opacity 0.3s ease;
  	display: flex;
  	justify-content: center;
  	align-items: center;
  	z-index: 100000;
}
.ppp-container.active {
  	opacity: 1;
  	pointer-events: all;
}
.ppp-content {
  	position: relative;
  	box-shadow: 0 1rem 2rem rgba(0,0,0,.4);
  	opacity: 0;
  	transform: translateY(1.5rem);
  	transition: opacity 0.3s ease, transform 0.3s ease;
}
.ppp-container.active .ppp-content {
  	opacity: 1;
  	transform: translateY(0);
    border-radius:var(--br);
    background: var(--c09);
    border:1px solid var(--c06);
}
.ppp-content > div {
  	min-width:30rem;
    width:117rem;
    max-width:calc(100dvw - 4rem);
    max-height:calc(100dvh - 4rem);
  	overflow:auto;
}
.ppp-content > .ppp-basic {
    min-width:30rem;
    width:30rem;
    padding:var(--v15) var(--v20) var(--v20);
}
.ppp-close {
  	position: absolute;
  	z-index:50;
  	left:100%;
  	top:0;
  	transform:translate(-50%,-50%);
    margin-top:0!important;
}
@media screen and (max-width:767px) { 
    .ppp-content > div {max-width:calc(100dvw - 3rem);max-height:calc(100dvh - 3rem);overflow:auto;}
    .ppp-close {top:.5rem;left:calc(100% - .5rem);}
}
@media screen and (min-width:550px) and (max-width:1099px) { 
    .ppp-content > div {max-width:calc(100dvw - 15rem);}
}
.ppp-close svg {
  	fill:var(--c02);
  	width:1.2rem;
  	height:1.2rem;
  	transform:rotate(45deg);
  	transition:.3s ease;
}
.ppp-content hr {
    border:none;
    border-top:1px solid var(--c07);
    margin:-.2rem 0 1.2rem;
}
.popup-active .wrapper {
  	z-index:65000;
}
.popup-active {
  	/*overflow:hidden;*/
}

/* HINWEISE */

.has-hinweis-color { 
    text-transform:uppercase;
    font-weight:var(--f-weight-bold);
    position:relative;
}
.hinweis, .info, .warnung {
    padding:1.5rem var(--v20) 1.55rem 5.5rem;
    position:relative;
    overflow:unset;
}
.info     { border:1px solid var(--c-mag); }
.warnung  { border:1px solid var(--c-leg); }
.hinweis  { border:1px solid var(--c04); }

.hinweis > div > *:last-child, .warnung > div > *:last-child, .info > div > *:last-child,
.hinweis > *:last-child, .warnung > *:last-child, .info > *:last-child {
    padding-bottom:0!important;
}
.hinweis:before, .warnung:before, .info:before {
    content:'';
    position: absolute;
    left:var(--v20);
    top:50%;
    transform:translateY(-50%);
    width:1.8rem;
    height:1.8rem;
}
.hinweis:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23b6aa89' viewBox='0 0 24 24'%3E%3Cpath d='M12 24c6.627 0 12-5.373 12-12s-5.373-12-12-12-12 5.373-12 12 5.373 12 12 12zm1-6h-2v-8h2v8zm-1-12.25c.69 0 1.25.56 1.25 1.25s-.56 1.25-1.25 1.25-1.25-.56-1.25-1.25.56-1.25 1.25-1.25z'/%3E%3C/svg%3E");
    background-size:cover;
}
.warnung:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23FF6800' viewBox='0 0 24 24'%3E%3Cpath d='M12 0c-6.627 0-12 5.373-12 12s5.373 12 12 12 12-5.373 12-12-5.373-12-12-12zm-1 5h2v10h-2v-10zm1 14.25c-.69 0-1.25-.56-1.25-1.25s.56-1.25 1.25-1.25 1.25.56 1.25 1.25-.56 1.25-1.25 1.25z'/%3E%3C/svg%3E");
    background-size:cover;
}
.info:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%236B82F3' viewBox='0 0 24 24'%3E%3Cpath d='M12 0c-6.627 0-12 5.373-12 12s5.373 12 12 12 12-5.373 12-12-5.373-12-12-12zm0 18.25c-.69 0-1.25-.56-1.25-1.25s.56-1.25 1.25-1.25c.691 0 1.25.56 1.25 1.25s-.559 1.25-1.25 1.25zm1.961-5.928c-.904.975-.947 1.514-.935 2.178h-2.005c-.007-1.475.02-2.125 1.431-3.468.573-.544 1.025-.975.962-1.821-.058-.805-.73-1.226-1.365-1.226-.709 0-1.538.527-1.538 2.013h-2.01c0-2.4 1.409-3.95 3.59-3.95 1.036 0 1.942.339 2.55.955.57.578.865 1.372.854 2.298-.016 1.383-.857 2.291-1.534 3.021z'/%3E%3C/svg%3E");
    background-size:cover;
}
@media screen and (max-width:767px) { 
    .hinweis, .info, .warnung {padding:1.2rem var(--v20) 1.2rem 4rem;}
    .hinweis:before, .warnung:before, .info:before { left:1.25rem;width:1.6rem;height:1.6rem; }
}

/* VIDEO BADGE *******************/

.video-badge {
    content:'+';
    position:absolute;
    z-index:2000;
    bottom:0;
    right:var(--v20);
    width:3.2rem;
    height:3.2rem;
    padding-top:.15rem;
    background:var(--c03);
    background: linear-gradient(180deg,rgba(239, 44, 14, 1) 0%, rgba(239, 44, 14, 1) 30%, rgba(107, 25, 13, 1) 100%);
    border-radius:50% 50% 0 0;
    display: flex;
    align-items:center;
    justify-content:center;
    box-shadow:0 -.2rem .8rem 0 rgba(0,0,0,.5);
    transition:.2s ease;
}
.video-badge svg {
    width:1.5rem;
    height:1.5rem;
    fill:var(--c02);
}
.list-basic .video-badge { right:var(--v10); }

/* SPRACHWECHSEL HIDE */

html[lang*="de"] *.en, html[lang*="en"] *.de,
html[lang*="de"] .has-en-color, html[lang*="en"] .has-de-color { display:none!important; }
.edit .has-en-color, .edit .has-de-color { color:var(--c02); }


/*********************************/
/* LISTS                         */
/*********************************/

/* LIST BASIC */

.list-basic {
    display: flex;
    flex-direction:column;
    gap:var(--v25);
}
.archive-list .list-basic {
    border-top:1px solid var(--c07);
    padding-top:var(--v25);
}
.list-basic .item {
    display:flex;
    align-items: flex-start;
    gap:var(--v25);
    padding-bottom:var(--v25);
    border-bottom:1px solid var(--c07);
}
.list-basic .thumb {
    width:/*30rem*/33.33%;
    aspect-ratio: 16/9;
}
.list-basic .data {
    width:calc(66.66% - var(--v20));
    margin-bottom:-.2rem;
}
.list-basic .data > p:first-child {
    margin:-.6rem 0 .5rem;
    font-size:2.3rem!important;
    line-height:3rem!important;
}
.list-basic .data * {
    text-wrap: pretty;
}
.list-basic .data > p:last-child {
    margin-top:1rem;
}

@media screen and (max-width:767px) {
    .list-basic { gap:var(--v20);}
    .list-basic .item { gap:var(--v15);padding-bottom:var(--v20); }
    .list-basic .thumb { width:35%; }
    .list-basic .data { width:calc(65% - var(--v15)); }
    .archive-list .main-col-intro .f-p-l {padding-bottom:0!important;}
    .archive-list .list-basic {border-top:none;padding-top:0;}
    .list-basic .thumb img, .list-feature .thumb img {object-position: center 25%;}
}
@media screen and (max-width:490px) {
    .list-basic .item { flex-direction:column;gap:var(--v20); }
    .list-basic .thumb { width:100%;height:33vw; }
    .list-basic .data { width:100%; }
}


/* LIST SIDEBAR ******************/

.list-sidebar .item {
    padding:1.2rem var(--v20) 1rem;
    height:9rem;
    overflow:hidden;
    display: flex;
    flex-direction: column;
    justify-content: center;

}
.list-sidebar .item:before {
    content:'';
    width:1px;
    height:100%;
    background:var(--c03);
    position:absolute;
    left:0;
    top:0;
    z-index:50;
    opacity:0;
    transition:.2s;
}
.list-sidebar .item:hover:before {
    opacity:1;
}
.list-sidebar .item:not(:last-child) {
    border-bottom:1px solid var(--c06);
}
.item {
    position: relative;
    display:block;
}
.item .img-bg {
    position: absolute;
    width:83%;
    height:100%;
    top:0;
    right:-4rem;
    z-index:1;
    overflow:hidden;
}
.item .img-bg:before {
    content:'';
    position: absolute;
    z-index:2;
    left:0;
    top:0;
    width:100%;
    height:100%;
    background: linear-gradient(5deg,rgba(17, 17, 17, 1) 10%, rgba(17, 17, 17, 0) 90%);
    transition:.3s ease-in-out;
}
.item .img-bg:after {
    content:'';
    position: absolute;
    z-index:3;
    left:0;
    top:0;
    width:100%;
    height:100%;
    background: linear-gradient(90deg, rgba(17, 17, 17, 1) 0%, rgba(17, 17, 17, .9) 25%, rgba(17, 17, 17, 0) 60%);
}
.item .img-bg img {
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center center;
    opacity:.7;
    transition:.3s ease-in-out;
}
.list-sidebar .item .img-bg img {
    object-position: center 20%;
}
.item:hover .img-bg img {
    transform:scale(1.05);
    opacity:1;
}
.item:hover .img-bg:before {
    opacity:.2;
}
.item > *:not(.img-bg) {
    position: relative;
    z-index:4;
}
.list-sidebar .item > p.f-btn-small {
    margin:.5rem 0 .5rem 0;
}
.list-sidebar .item > p.c02 {
    text-shadow: 0 .1rem .2rem rgba(10,10,10,1);
    text-wrap: balance;
    max-width: 80%;
}
@media screen and (min-width:420px) and (max-width:1099px) {
    .list-sidebar .item > p.c02 { max-width:80%; }
}
@media screen and (max-width:767px) {
    .list-sidebar .item {min-height:7rem;height:unset;padding:1.2rem var(--v15) 1rem;}
    .item:hover .img-bg img {transform:scale(1);}
}

/* BUILD SIDEBAR */

.build-sidebar .item {flex-direction:row;gap:var(--v15);align-items: center;}
.build-sidebar .item .img-bg img {opacity:.5;}
.build-sidebar .d4-skill {width:5rem;height:5rem;box-shadow:var(--bx-shadow-small);}
.build-sidebar .d4-skill img {width:100%;height:100%;}
.build-sidebar .data {width:calc(100% - 6.5rem);}
.build-sidebar .data > p:first-child {margin:-.6rem 0 .2rem 0;padding-right:1.5rem;max-width:19rem;}
.build-sidebar .data > p:last-child {margin-bottom: -.5rem;}

/* STICKY ************************/

.stick      { position:sticky;top:7rem; }
.stick-toc  { position:sticky;top:11.5rem; }

/*********************************/
/* SIDEBAR                       */
/*********************************/ 

/* SIDEBAR STICKY ****************/

.sidebar .sticky {
    position:sticky;
    top:7rem;
    display: flex;
    flex-direction:column;
    gap:var(--v25);
}
@media screen and (min-width:650px) and (max-width:1099px) {
    .sidebar .sticky { grid-column: 1 / 3; display:grid;grid-template-columns: repeat(2, minmax(1px, 1fr)); }
}

/* SIDEBAR DISCORD ***************/

#sidebar-discord {
    height:15.5rem;
    padding:var(--v10) var(--v20);
}
#sidebar-discord p {
    text-align:center;
}
#sidebar-discord p.f-btn-big {
    line-height:2.2rem!important;
    margin:0 0 -.2rem 0;
}
#sidebar-discord p.f-btn-small {
    margin:.2rem 0 .1rem 0;
}
#sidebar-discord > p {
    position: relative;
    z-index:1;
}

/* SIDEBAR SUPPORT **************/

#sidebar-support {
    height:15.5rem;
    padding:var(--v10) var(--v20);
}
#sidebar-support:hover {
    border-color:var(--c03);
}
#sidebar-support p {
    text-align:center;
}
#sidebar-support p.f-btn-big {
    line-height:2.2rem!important;
    margin:0 0 -.2rem 0;
}
#sidebar-support > p, #sidebar-support > img {
    position: relative;
    z-index:1;
    color:var(--c02);
}
#sidebar-support > img {
    margin:.4rem 0 .4rem;
}
@media screen and (max-width:1099px) {
    .sidebar > #sidebar-discord { order:1; }  
    .sidebar > #sidebar-support { order:2; }
    .sidebar > #sidebar-twitch  { display:none; }
    .sidebar > *:not(#sidebar-support):not(#sidebar-discord) { order:4;height: fit-content; }
}
/* SIDEBAR TWITCH *****************/

#sidebar-twitch .inside {
    aspect-ratio: 16/9;
}
#sidebar-twitch .inside a {
    position: absolute;
    left:50%;
    top:calc(50% + 1rem);
    transform:translate(-50%, -50%);
    z-index:5;
    box-shadow:var(--bx-shadow-big);
    opacity:0;
    transition:.2s ease-in-out;
}
#sidebar-twitch .inside:hover a {
    opacity:1;
    top:50%;
}
#sidebar-twitch.live .intro svg {
    fill:var(--c03);
}

/* SIDEBAR SUPPORT ***************/

#sidebar-partner {
    height: fit-content;
}
#sidebar-partner .inside {
    display:block;
}
#sidebar-partner .inside > .img-bg {
    position:relative;
}
#sidebar-partner .inside > .img-bg:after {
    opacity:0;
    transition:.3s ease-in-out;
}
#sidebar-partner .inside:hover > .img-bg:after {
    opacity:1;
}



/* TOOLTIP */

/*@media screen and (max-width:550px) {.tippy-box .card {width:calc(100vw - 3rem);}}
.ttp {cursor: help;}*/

.ttp-data {display:none;visibility:hidden;pointer-events:none;}

.ttp-inner {
    background: var(--c09);
    border: 1px solid var(--c06);
    border-radius: var(--br);
    box-shadow: 0 .5rem 1rem 0.5rem rgba(0, 0, 0, 1);
    padding:1rem 1.5rem!important;
}

.tippy-box[data-theme~='tippy-minimal'] {
    max-width: 22rem !important; 
    word-wrap: break-word;
}
.tippy-box[data-theme~='tippy-minimal'] * {
    text-align:center;
}

/*****************/
/* HEADLINES     */
/*****************/

h2[class*="bg-heading"] {
    display: flex;
    flex-direction:column;
    justify-content:center;
    position:relative;
    min-height:10rem;
    padding:var(--v10) var(--v30)!important;
    font-size:3.1rem!important;
    line-height:1.3em!important;
    text-transform:uppercase;
    letter-spacing:var(--f-letter-spacing-l);
    text-shadow:0 .4rem .5rem rgba(0,0,0,.8);
    border:1px solid var(--c06);
    border-radius:var(--br);
    box-shadow: var(--bx-shadow-big);
    margin-bottom:var(--v25);
    margin-top:4.5rem;
}
h2[class*="bg-heading"] em {
    font-style:normal!important;
    padding: .3rem 0 .3rem 0;
}
h2[class*="bg-heading"] strong {
    font-size: var(--f-size-h2)!important;
  	line-height: var(--f-line-height-h2)!important;
    text-transform:none!important;
    letter-spacing:0!important;
}
.bg-heading-d4 { 
    background: var(--c10) url('/wp-content/uploads/Heading-BG-D4-1x.webp') center right no-repeat; 
    background-size: cover; 
}
.bg-heading-poe2 { 
    background: var(--c10) url('/wp-content/uploads/Heading-BG-PoE2-1x.webp') center right no-repeat; 
    background-size: cover; 
}
.bg-heading-d2 { 
    background: var(--c10) url('/wp-content/uploads/Heading-BG-D2R-1x.webp') center right no-repeat; 
    background-size: cover; 
}
.bg-heading-icon {
    position: absolute;
    right:var(--v20);
    top:50%;
    transform:translateY(-50%);
    width:6rem;height:6rem;
    background:var(--c01);
    border:1px solid var(--c06);
    border-radius:var(--br);
    box-shadow:var(--bx-shadow-small);
}
.bg-heading-icon img {
    width:100%;
    height:100%;
    object-position:center;
    object-fit:contain;
}

@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    .bg-heading-d4 {background-image: url('/wp-content/uploads/Heading-BG-D4-2x.webp');}
    .bg-heading-poe2 {background-image: url('/wp-content/uploads/Heading-BG-PoE2-2x.webp');}
    .bg-heading-d2 {background-image: url('/wp-content/uploads/Heading-BG-D2R-2x.webp');}
}
@media screen and (max-width: 767px) {
    .bg-heading-d4 {background-image: url('/wp-content/uploads/Heading-BG-D4-Mobile-3.webp');}
    .bg-heading-poe2 {background-image: url('/wp-content/uploads/Heading-BG-PoE2-Mobile.webp');}
    .bg-heading-d2 {background-image: url('/wp-content/uploads/Heading-BG-D2R-Mobile.webp');}
    h2[class*="bg-heading"] {
        background-position:center center;
        align-items:center;
        text-align:center;
        padding: var(--v15) var(--v15) 1.6rem!important;
    }
    .bg-heading-icon {right:var(--v15);width:5rem;height:5rem;}
}   




/*********************************/
/* WORDPRESS EDITOR              */
/*********************************/ 

.edit > *:last-child { margin-bottom:0!important; }
.edit > *:not(div[class*="box"]):last-child { padding-bottom:0!important; }
.edit section > *:first-child {padding-top:0;}

/************/
/* HEADINGS */
/************/

.edit h2 { padding-top:2.0rem; }
.edit h3 { padding-top:1.5rem; }
.edit h4 { padding-top:0.5rem; }

.edit > div[class*="box"] h2:first-child,
.edit > div[class*="box"] h3:first-child, 
.edit > div[class*="box"] h4:first-child { padding-top:.2em!important; }

/*********/
/* LISTS */
/*********/

.edit ol {
    list-style: revert!important;
    list-style-position: inside!important;
    padding-left: 0!important; 
    margin-left: 0!important;
} 
.edit ol li::marker {
    color:var(--c04);
} 
.edit ul, .card .inner ol, .card .inner ul, .affixes ul {
    padding-left: 0!important; 
    margin-left: 0!important;
    list-style:none!important;
}
.edit ul > li, .card .inner li, .affixes ul > li  {
    padding-left: 1.2em;
    position: relative;
}
.edit ul > li:before, .card .inner li:before, .affixes ul > li:before {
    content:'';
    width:.5em;
    height:.5em;
    border:1.5px solid var(--c05);
    opacity:.5;
    border-radius:.05em;
    position: absolute;
    left:.1em;
    top:.55em;
    transform:rotate(45deg);
}
.tippy-box .card .inner li:before, .d4-item .inner li:before, .edit .wp-block-table li:before,
.card.d2-item .inner li:before, .edit .affixes ul li:before {top:.5em;}

@media screen and (max-width:767px) {
    .card .inner li:before, .item-block-basic .desc li:before {top:.5em;}
    .card .inner {padding-left:var(--v15)!important;padding-right:var(--v15)!important;}
    .card .name > div:first-child {padding: 1rem var(--v10) 1rem var(--v15)!important;;}
}

/****************/
/* BOX & QUOTES */
/****************/

.boxpad, .edit blockquote, .edit pre.wp-block-code {padding:1.2rem var(--v20);}
.edit pre.wp-block-code {margin:0;}
.boxpad > div > p:last-child, .boxpad > div > ul:last-child, .boxpad > div > ol:last-child, 
.edit blockquote > p:last-child, .edit blockquote > ol:last-child, .edit blockquote > ul:last-child {
    padding-bottom:0!important;
}
.edit blockquote p {font-style:italic}
.edit blockquote {margin-top:var(--v05);margin-bottom:var(--v25);}
.boxhead {
    display: flex;
    align-items:center;
    justify-content:space-between;
    min-height:5rem;
    padding:var(--v05) var(--v20);
    background:var(--c08);
    border:1px solid var(--c06);
    border-radius:var(--br) var(--br) 0 0;
    box-shadow: var(--bx-shadow-big);
    position: relative;
    z-index:10;
    margin-bottom:-1px;
}
.boxhead.center {
    justify-content:center;
}
.boxhead p {
    color:var(--c04);
    padding:.2rem 0 0 0!important;
}
@media screen and (max-width:767px) {
    .boxpad {padding:var(--v10) var(--v15);}
    .boxhead {min-height:4rem;padding:var(--v05) var(--v15);}
}

/**********/
/* IMAGES */
/**********/

.edit > .wp-block-image.size-medium {width:50%!important;}
@media screen and (max-width:500px) {.edit > .wp-block-image.size-medium {width:100%!important;}}
.edit > .wp-block-image.size-thumbnail {width:33%!important;}
@media screen and (max-width:500px) {.edit > .wp-block-image.size-thumbnail {width:50%!important;}}

.img-desc {color:var(--c05);font-style:italic;margin-top:-1rem;}

.edit .wp-block-image, .edit .lightbox {
    box-shadow:var(--bx-shadow-big);
    position:relative;
    overflow:hidden;
    border:1px solid var(--c06);
    border-radius:var(--br);
    margin-bottom:2.2rem;
    margin-top:.4rem;
    display:block;
}
.edit .wp-block-image img, .edit .lightbox img {
    width:100%;
}
.edit .wp-block-image:after, .edit .lightbox:after {
    content:'';
    position: absolute;
    z-index:1;
    width:100%;
    height:100%;
    top:0;
    left:0;
    border-radius:1px;
    box-shadow:var(--bx-shadow-small-inset);
}
@media screen and (max-width:767px) {
    .edit .wp-block-image:after, .edit .lightbox:after { box-shadow:none; }
}

/***********/
/* COLUMNS */
/***********/

div[class*="wc2-"] > div > h2:first-child {padding-top:.3rem;}
div[class*="wc2-"] > div > h3:first-child {padding-top:.3rem;}

div[class*="wc2-"] {gap:var(--v25);display:flex;}
div[class*="wc2-"] > div {flex-basis: unset!important;}
div[class*="wc2-"] > div > p:last-child,
div[class*="wc2-"] > div > ul:last-child,
div[class*="wc2-"] > div > ol:last-child {padding-bottom:0!important;}

/* WP CSS FIX */
.wp-block-columns.wc2-15l:not(.is-not-stacked-on-mobile) > .wp-block-column,
.wp-block-columns.wc2-15r:not(.is-not-stacked-on-mobile) > .wp-block-column,
.wp-block-columns.wc2-30l:not(.is-not-stacked-on-mobile) > .wp-block-column,
.wp-block-columns.wc2-30r:not(.is-not-stacked-on-mobile) > .wp-block-column {
    flex-basis: unset !important;
}

/* 150 */
.wc2-15r > div:last-child, .wc2-15l > div:first-child {width:15rem;}
.wc2-15r > div:first-child, .wc2-15l > div:last-child {width:calc(100% - 17.5rem);}

@media screen and (max-width:500px) {
.wc2-15r > div:last-child, .wc2-15l > div:first-child {max-width:20%;}
.wc2-15r > div:first-child, .wc2-15l > div:last-child {width:calc(80% - 2.5rem);}
div[class*="wc2-15"] {gap:var(--v25) var(--v15);}
div[class*="wc2-15"] .wp-block-image:after { box-shadow: none; }
}

/* 300 */
.wc2-30r > div:last-child, .wc2-30l > div:first-child {width:36%;}
.wc2-30r > div:first-child, .wc2-30l > div:last-child {width:calc(64% - 1.5rem);}

@media screen and (max-width:500px) {
.wc2-30r, .wc2-30l {flex-direction:column;}
.wc2-30r > div:last-child, .wc2-30l > div:first-child {width:100%;}
.wc2-30r > div:first-child, .wc2-30l > div:last-child {width:100%;}
}

/* 50% */
.wc2-50 > div {width:calc(50% - 1.25rem);}

@media screen and (max-width:500px) {
.wc2-50 {flex-direction:column;}
.wc2-50 > div {width:100%;}
}

div[class*="wc2-"] > div > figure:first-child, div[class*="wc2-"] > div > div:first-child {
    transform:translateY(.5rem)!important;margin-bottom: 1rem;
}

/***********/
/* TABELLE */
/***********/

/* RESET */
.edit table,
.edit thead,
.edit tbody,
.edit tfoot,
.edit tr,
.edit th,
.edit td {
    width: auto;
    height: auto;
    margin: 0;
    padding: 0;
    border: none;
    border-collapse: inherit;
    border-spacing: 0;
    border-color: inherit;
    vertical-align: inherit;
    text-align: left;
    font-weight: inherit;
    -webkit-border-horizontal-spacing: 0;
    -webkit-border-vertical-spacing: 0;
}

/* STYLES */
.edit table {
    background:var(--c09);
    border:1px solid var(--c06);
    border-radius:var(--br)!important;
    margin-bottom:var(--v20);
    overflow: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--c04) transparent;
    box-shadow: var(--bx-shadow-big);
}
.edit .wp-block-table {
    max-width: 100%;
    width: 100%;
    overflow: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--c04) transparent;
    box-shadow: var(--bx-shadow-big);
    margin-bottom:var(--v20);
}
.edit .wp-block-table table {
    margin-bottom:0;
    overflow: visible;
    box-shadow: none;
}
.wp-block-table .has-fixed-layout {
    table-layout: unset!important;
}
.edit .wp-block-table::-webkit-scrollbar {
    width: 6px;
}
.edit .wp-block-table::-webkit-scrollbar-thumb {
    background-color: var(--c01);
    border-radius: 10px;
}
.edit table {
    width:100%;
}
.edit table td, .edit table th, .edit table tfoot, .edit table thead, .edit table tbody {
    border:none!important;
}
.edit thead tr th { 
    border-bottom:1px solid var(--c06)!important;
    padding:.7rem 1rem;
    background:var(--c08); 
    color:var(--c04);
}
.edit thead tr th:not(:last-child) { 
    border-right:1px solid var(--c06)!important;
}
.edit tbody tr td { 
    padding:.7rem 1rem;
    min-width:11rem;
}

.edit table thead {
    border-bottom:1px solid var(--c06)!important;
}
.edit .wp-block-table.vertical-middle tbody tr td,
.edit .wp-block-table.vertical-middle th {
    vertical-align:middle;
}
.edit table tbody tr:not(:last-child) td { 
    border-bottom:1px solid var(--c06)!important; 
}
.edit table tbody tr td:not(:last-child) { 
    border-right:1px solid var(--c06)!important; 
}
.edit .table-col1-highlight td:not(:first-child) {
    background:var(--c10);
}
.edit .table-col1-highlight td:first-child:not([colspan]) {
    font-weight:var(--f-weight-bold)!important;
}
.edit .table-col1-highlight td:first-child[colspan] {
    background:var(--c01);
}
.edit .table-50-50 td {width:50%;}
.edit .td-nomin td {min-width:unset!important;}