/* ************************************* */
/*                                       */
/* theme.css Global                      */
/*                                       */
/* ************************************* */
/* ************************************* */
/*                                       */
/* Headlines                             */
/*                                       */
/* ************************************* */

h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: var(--font-headline);
	margin: 0;
	padding: 0;
	position: relative;
}

[class*="header"] :is(h1:last-child, h2:last-child, h3:last-child, h4:last-child, h5:last-child, h6:last-child) {
	margin: 0;
}

h1,
.h1 {
	font-size: 24px;
	text-transform: uppercase;
	font-weight: bold;
	font-family: var(--font-headline-big);
	margin-bottom: 18px;
	line-height: 130%;
}

h2,
.h2 {
	font-size: 18px;
	font-weight: bold;
	font-family: var(--font-headline);
	text-transform: none;
	line-height: 140%;
	margin-bottom: 18px;
}

.h2__underline {
	border-bottom: 3px solid;
	display: inline-block;
	margin-bottom: 30px;
}

h3,
.h3 {
	font-size: 16px;
	font-weight: bold;
	line-height: 140%;
}

h4,
.h4,
h5,
.h5,
h6,
.h6 {
	font-size: 18px;
	line-height: 150%;
	margin-bottom: 18px;
}

:is(h4, .h4, h5, .h5, h6, .h6) strong {
	font-family: var(--font-headline-big);
}

h5,
.h5 {
	font-size: 20px;
}

h6,
.h6 {
	font-size: 24px;
}

h4:last-child,
.h4:last-child,
h5:last-child,
.h5:last-child,
h6:last-child,
.h6:last-child {
	margin-bottom: 0;
}

.h1--title {
	margin-bottom: 0;
}

/* ************************************* */
/*                                       */
/* Links                                 */
/*                                       */
/* ************************************* */

a,
span {
	text-decoration: none;
	color: inherit;
}

.a--deco,
.span--deco,
.page__content a,
.section__inner__txt a,
.area a {
	display: inline-block;
	padding-left: 2px;
	padding-right: 2px;
	position: relative;
}

.a--deco::after,
.span--deco::after,
.page__content a::after,
.section__inner__txt a::after,
.area a::after {
	content: " ";
	position: absolute;
	top: 96%;
	left: 25%;
	width: 50%;
	height: 1px;
	border-bottom: 1px solid var(--color-accent);
	transition: 0.4s;
}

.a--deco:hover::after,
.span--deco:hover::after,
.page__content a:hover::after,
.section__inner__txt a:hover::after,
.area a:hover::after {
	width: 100%;
	left: 0;
}

/* a.tri:before {    
font-family: 'Material Icons';
content: attr(chevron-right);
margin:0 5px 0 -15px;
color: #f00;
} */

/* ************************************* */
/*                                       */
/* Paragraphs                            */
/*                                       */
/* ************************************* */

.area {
    overflow-wrap: anywhere;
}

p {
	font-size: var(--font-primary-size);
	line-height: var(--font-primary-lineheight);
	margin-top: 0;
	margin-bottom: 24px;
}

.area p,
p.area {
	font-size: var(--font-fulltext-size);
	line-height: var(--font-fulltext-lineheight);
}

p:last-child {
	margin-bottom: 0;
}

.text {
	font-family: var(--font-fulltext);
	font-weight: var(--font-fulltext--weight);
	font-size: 18px;
}

.small {
	font-size: var(--font-small-size);
	font-weight: 300;
}

.bisserl-smaller {
	font-size: 13px;
}

.semibold {
	font-weight: 500;
}

.upper {
	text-transform: uppercase;
}

.fz-20 {
	font-size: 20px;
}

.fz-18 {
	font-size: 18px;
}
.fz-16 {
	font-size: 16px;
}

.fz-14 {
	font-size: 14px;
}

.fz-12 {
	font-size: 12px;
}

.indented {
	padding: 0px 20px 0 20px;
}

b,
.b,
.strong,
strong {
	font-weight: bold;
}

/* ************************************* */
/*                                       */
/* Lists                                 */
/*                                       */
/* ************************************* */

ul,
.ol {
	margin: 0;
	padding: 0;
}

.ol {
	list-style: decimal;
	padding-left: 17px;
}

li {
	list-style: none;
}

li:last-child {
	margin-bottom: auto;
}

.ol li {
	list-style: decimal;
	padding-left: 7px;
}

.area ul,
.area ol,
.area .ol {
	margin-bottom: 24px;
	font-size: var(--font-fulltext-size);
	line-height: var(--font-fulltext-lineheight);
}

.area ul:last-child,
.area ol:last-child,
.area .ol:last-child {
	margin-bottom: 0;
}

.area ul li,
.area ol li,
.area .ol li {
	margin-bottom: 0px; /* TODO IS margin-bottom: 8px; */
	list-style: disc;
	margin-left: 15px;
}

.area ol li,
.area .ol li {
	list-style: decimal;
}

.ul--ellipsis li {
	background-image: url("../img/icons/icon-more-horiz.svg");
	background-repeat: no-repeat;
	background-position: left 6px;
	padding-left: 24px;
	background-size: 18px;
}

.page__content ul,
.page__content ol,
.section__content ul,
.section__content ol,
.section__inner__txt ul,
.section__inner__txt ol {
	margin-bottom: 24px;
}

.page__content li,
.section__content li,
.section__inner__txt li {
	list-style: disc;
	margin-left: 15px;
	font-size: var(--font-primary-size);
	line-height: var(--font-primary-lineheight);
}

/* ************************************* */
/*                                       */
/* Quote                                 */
/*                                       */
/* ************************************* */

blockquote {
	margin: 40px;
	padding: 0;
	position: relative;
	margin-bottom: 20px;
}

blockquote:before,
blockquote:after {
	position: absolute;
}

blockquote:before {
	content: "";
	background-image: url("data:image/svg+xml,%3Csvg width='18.302' height='15.3' viewBox='0 0 18.302 15.3' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23828282'%3E%3Cpath d='M 11.7 15.3 L 11.1 14.4 A 14.869 14.869 0 0 0 12.941 12.947 Q 13.881 12.068 14.523 11.107 A 8.923 8.923 0 0 0 14.7 10.83 A 8.089 8.089 0 0 0 15.834 7.475 A 10.223 10.223 0 0 0 15.9 6.3 L 14.1 6.9 A 3.265 3.265 0 0 1 12.614 6.564 A 3.3 3.3 0 0 1 11.76 5.94 Q 10.8 4.98 10.8 3.6 A 3.907 3.907 0 0 1 11.009 2.3 A 3.367 3.367 0 0 1 11.82 1.02 A 3.445 3.445 0 0 1 14.157 0.007 A 4.584 4.584 0 0 1 14.4 0 A 4.707 4.707 0 0 1 15.633 0.153 A 3.405 3.405 0 0 1 17.25 1.11 A 3.655 3.655 0 0 1 18.113 2.684 Q 18.265 3.237 18.294 3.892 A 7.09 7.09 0 0 1 18.3 4.2 Q 18.3 10.777 13.058 14.447 A 16.441 16.441 0 0 1 11.7 15.3 Z M 0.9 15.3 L 0.3 14.4 A 14.869 14.869 0 0 0 2.141 12.947 Q 3.081 12.068 3.723 11.107 A 8.923 8.923 0 0 0 3.9 10.83 A 8.089 8.089 0 0 0 5.034 7.475 A 10.223 10.223 0 0 0 5.1 6.3 L 3.3 6.9 A 3.265 3.265 0 0 1 1.814 6.564 A 3.3 3.3 0 0 1 0.96 5.94 Q 0 4.98 0 3.6 A 3.907 3.907 0 0 1 0.209 2.3 A 3.367 3.367 0 0 1 1.02 1.02 A 3.445 3.445 0 0 1 3.357 0.007 A 4.584 4.584 0 0 1 3.6 0 A 4.707 4.707 0 0 1 4.833 0.153 A 3.405 3.405 0 0 1 6.45 1.11 A 3.655 3.655 0 0 1 7.313 2.684 Q 7.465 3.237 7.494 3.892 A 7.09 7.09 0 0 1 7.5 4.2 Q 7.5 10.777 2.258 14.447 A 16.441 16.441 0 0 1 0.9 15.3 Z'/%3E%3C/g%3E%3C/svg%3E");
	left: -20px;
	top: -20px;
	transform: translate(-100%, 0);
	font-size: 100px;
	width: 20px;
	height: 20px;
	background-position: center center;
	background-repeat: no-repeat;
}

blockquote:after {
	content: "";
	background-image: url("data:image/svg+xml,%3Csvg width='18.301' height='15.3' viewBox='0 0 18.301 15.3' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23828282'%3E%3Cpath d='M 17.4 0 L 18 0.9 Q 16.5 1.92 15.42 3.12 Q 14.34 4.32 13.77 5.76 A 8.056 8.056 0 0 0 13.274 7.753 A 10.246 10.246 0 0 0 13.2 9 L 15 8.4 A 3.265 3.265 0 0 1 16.487 8.736 A 3.3 3.3 0 0 1 17.34 9.36 Q 18.3 10.32 18.3 11.7 A 3.907 3.907 0 0 1 18.092 13 A 3.367 3.367 0 0 1 17.28 14.28 A 3.445 3.445 0 0 1 14.944 15.294 A 4.584 4.584 0 0 1 14.7 15.3 A 4.841 4.841 0 0 1 13.48 15.154 A 3.427 3.427 0 0 1 11.85 14.22 A 3.468 3.468 0 0 1 11.031 12.802 Q 10.865 12.266 10.819 11.621 A 7.226 7.226 0 0 1 10.8 11.1 A 14.398 14.398 0 0 1 11.139 7.9 A 10.818 10.818 0 0 1 12.51 4.53 A 12.72 12.72 0 0 1 15.815 1.022 A 15.991 15.991 0 0 1 17.4 0 Z M 6.6 0 L 7.2 0.9 Q 5.7 1.92 4.62 3.12 Q 3.54 4.32 2.97 5.76 A 8.056 8.056 0 0 0 2.474 7.753 A 10.246 10.246 0 0 0 2.4 9 L 4.2 8.4 A 3.265 3.265 0 0 1 5.687 8.736 A 3.3 3.3 0 0 1 6.54 9.36 Q 7.5 10.32 7.5 11.7 A 3.907 3.907 0 0 1 7.292 13 A 3.367 3.367 0 0 1 6.48 14.28 A 3.445 3.445 0 0 1 4.144 15.294 A 4.584 4.584 0 0 1 3.9 15.3 A 5.963 5.963 0 0 1 3.872 15.3 Q 2.092 15.292 1.05 14.22 A 3.468 3.468 0 0 1 0.231 12.802 Q 0.065 12.266 0.019 11.621 A 7.226 7.226 0 0 1 0 11.1 A 14.398 14.398 0 0 1 0.339 7.9 A 10.818 10.818 0 0 1 1.71 4.53 A 12.72 12.72 0 0 1 5.015 1.022 A 15.991 15.991 0 0 1 6.6 0 Z'/%3E%3C/g%3E%3C/svg%3E");
	right: -20px;
	bottom: 5px;
	width: 19px;
	height: 16px;
	background-position: center center;
	background-repeat: no-repeat;
	transform: translate(100%, 0);
}

/* ************************************* */
/*                                       */
/* Inline                                */
/*                                       */
/* ************************************* */

hr,
.hr {
	border: 0;
	border-bottom: 1px solid black;
	margin-bottom: 20px;
	margin-top: 20px;
}

/* --------------------------------------------|
|                                              |
|  Decoration                                  |
|                                              |
|-------------------------------------------- */

.section--stripes {
	background-image: url('data:image/svg+xml;charset=utf8,<svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%"><defs><pattern id="pattern" patternUnits="userSpaceOnUse" width="9.5" height="9.5" patternTransform="rotate(135)"><line x1="0" y="0" x2="0" y2="9.5" stroke="%23CDDAD6" stroke-width="1"/></pattern></defs><rect width="100%" height="100%" fill="url(%23pattern)" opacity="1"/></svg>');
}

.stripes {
	position: relative;
}

/*.stripes:before {
  z-index:-1;
  width: 200%;
  height: 100%;
  position: absolute;
  left: -44px;
  top:-40px;
  content: url('data:image/svg+xml;charset=utf8,<svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%"><defs><pattern id="pattern" patternUnits="userSpaceOnUse" width="9.5" height="9.5" patternTransform="rotate(135)"><line x1="0" y="0" x2="0" y2="9.5" stroke="%230099FF" stroke-width="1"/></pattern></defs><rect width="100%" height="100%" fill="url(%23pattern)" opacity="1"/></svg>');
}*/

.stripes:before {
	/*clip-path: polygon(0 0, 55% 0, 100% 100%, 45% 100%);*/
	content: "";
	z-index: -1;
	position: absolute;
	left: -44px;
	top: -40px;
	bottom: -40px;
	right: -44px;
	background-size: cover;
	background-repeat: repeat;
	background-image: url('data:image/svg+xml;charset=utf8,<svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%"><defs><pattern id="pattern" patternUnits="userSpaceOnUse" width="9.5" height="9.5" patternTransform="rotate(135)"><line x1="0" y="0" x2="0" y2="9.5" stroke="%230099FF" stroke-width="1"/></pattern></defs><rect width="100%" height="100%" fill="url(%23pattern)" opacity="1"/></svg>');
}

.stripes--slim:before {
	inset: 5px 15px 15px 15px;
	background-image: url('data:image/svg+xml;charset=utf8,<svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%"><defs><pattern id="pattern" patternUnits="userSpaceOnUse" width="9.5" height="9.5" patternTransform="rotate(135)"><line x1="0" y="0" x2="0" y2="9.5" stroke="%23A6850A" stroke-width="1"/></pattern></defs><rect width="100%" height="100%" fill="url(%23pattern)" opacity="1"/></svg>');
}

@media screen and (max-width: 428px) {
	.stripes:before {
		left: 0;
		right: 0;
	}
}

.triangle {
	position: relative;
}

.triangle:before {
	content: "";
	z-index: 1;
	position: absolute;
	left: -30px;
	top: 0;
	background-color: var(--color-grey-light);
	clip-path: polygon(0 0, 0% 100%, 60% 50%);
	width: 24px;
	height: 24px;
}
