/*
768 ipad old
810 ipad new
960 max
1080 container
*/
@font-face {
    font-family: 'TitilliumUpright';
    src: url('fonts/Titillium-LightUpright.otf');
    font-style: normal;
    font-weight: 300;
}
/*
@font-face {
    font-family: 'TitilliumUpright';
    src: url('fonts/Titillium-LightItalic.otf');
    font-style: italic;
    font-weight: 300;
}
*/
@font-face {
    font-family: 'TitilliumUpright';
    src: url('fonts/Titillium-RegularUpright.otf');
    font-style: normal;
    font-weight: normal;
}
@font-face {
    font-family: 'TitilliumUpright';
    src: url('fonts/Titillium-SemiboldUpright.otf');
    font-style: normal;
    font-weight: 600;
}
/*
@font-face {
    font-family: 'TitilliumUpright';
    src: url('fonts/Titillium-BoldItalic.otf');
    font-style: italic;
    font-weight: bold;
}


@font-face {
    font-family: 'xLexia';
    src: url('fonts/Lexia-XBold.otf');
    font-style: normal;
    font-weight: normal;
}
*/

@font-face {
	font-family: 'FontAwesome';
	src: url('fonts/fontawesome-webfont.woff') format('woff');
	font-style:normal;
	font-weight:normal;
}


/*
@font-face {
	font-family: 'FontAwesome';
	src: url('fonts/fa-solid-900.woff');
	font-style:normal;
	font-weight:bold;
}
*/
:root {
	--body: #000000;
	--brown: #875533;
	--lightbrown: #D7C9B5;
	--green: #6A9202;
	--green2: #69931C;
	--lightgreen: #86bc26;
	--darkgreen: #699101;
	--mint: #6cbe98;
	--mustard: #bba000;
	--sand: #eee8dc;
	--lightsand: #f6f3ed;
	
	--tgreen: rgba(106, 146, 2,0.2);
	
	--bg-dark: #39373A;
	--almostblack: #25262B;
	
	--orangered: #eb4f36;
	--red: #d9132a;
	--darkred: #ac1010;
	--blue: #0061a1;
	--steelblue: #6b8eaa;
	--darkgrey: #39373a;

	--bggrey: #39373A;

	--practicallyblack: #1b1c20;
	--somewhatlighterdarkgrey: #484848;
	--mediumdarkgrey: #757575;
	--mediumgrey: #888;
	--mediumlightgrey: #e8e8e8;
	--lightgrey: #fafafa;
	--reddishgrey: #d94848;
	--blueishgrey:#434e66;
	--intactgrey:#9d9d9b;

	--highlight: #d9132a;


	--bgpaper: #fff7ec;
	--bgsandpaper: #cfbfab;
	--cardboard: #e7d9c6;
	
	--motorrad: #86522f;
	--starter: #700000;
	--antrieb: #003d5d;
	--versorgung: #004b1d;
	--charger: #39373a;
	
	--bglight: #fff7ec;
	--bglighter: #fffcf2;
	--bglightgrey: #f5f5f5;
	--bgdark: #d0b799;
	--bgdarkpaper:#d0b799;
	
	--szSmall: 12px;
	--szNormal: 16px;
	--szSmaller: 14px;
	--szLarger: 18px;
	--szMediumLarge: 20px;
	--szLarge: 24px;
	--szQuiteLarge: 30px;
	--szReallyLarge: 36px;
	--szVeryLarge: 40px;
	--szEvenLarger: 45px;
	--szHuge: 50px;
	--szMassive: 60px;
	
	--onecol: 340px;
	--w1col: 180px;
	--w2col: 360px;
	--w4col: 720px;
	
	--spacing: 20px;

	--fontSerif: "TitilliumUpright";
	--fontSans: "TitilliumUpright";
	--fontCasual: "TiitlliumUpright";
	
	--pagemenutop: 138px;
	--xscrolledtop: 100px;
	--scrolledtop: 74px;
	--scrolledoffset: -84px;

}
@media screen and (max-width:768px) {
	:root {
		--szMassive: 46px;
		--szHuge: 36px;
		--szLarge: 20px;
		--szQuiteLarge: 24px;
		--szVeryLarge: 28px;
	}
	
}

/* Box-Sizing immer inkl. padding */
* {
	box-sizing:border-box;
}

html { 
	margin:0;
	padding:0;
	scroll-behavior:smooth;
	/*
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
	font-smoothing: antialiased;
	*/
}
body {
	font-family:"TitilliumUpright",serif;
	font-weight:300;
	font-size:16px;
	line-height:1.3;
	margin:0;
	padding:0;
	color:var(--body);
	text-rendering:optimizeLegibility;
}

main,footer,section,header,p,figure,aside {
	margin:0;padding:0;
}
section {
	position:relative;
	padding:2rem 0;
}
footer {
	min-height:400px;
	background-color:var(--darkgrey);
	color:white;
}
figure {
	display:inline-block;
}
table {
	border-collapse:collapse;
}
td {
	padding:5px;
	vertical-align:top;
}
a {
	color: inherit;
	text-decoration:none;
	border:none;
	outline:none;
}
a img {
	border:none;
	outline:none;
}
b,strong {
	font-weight:600;
}
h1,h2,h3,h4,h5 {
	margin:0;padding:0;
	line-height:1.1;
	font-weight:400;
}
h1 { font-size:40px;text-transform:uppercase; hyphens:auto; }
h2 { font-size:30px;text-transform:uppercase; }
h3 { font-size:20px }
h4 { font-size:20px }
h5 { font-size:20px }

/*
.rtf p:hover .dict-entry, .rtf ul:hover .dict-entry {
	box-shadow:inset 0 -2px 0 greenyellow;
	transition:box-shadow 0.3s ease-out;
	cursor:help;
	position:relative;
}
.rtf p:hover .dict-entry:hover, .rtf ul:hover .dict-entry:hover {
	box-shadow:inset 0 -1.2em 0 greenyellow;
}
*/
address {
	font-style:normal;
	font-size:inherit;
	font-weight:inherit;
	font-family:inherit;
}

.hidden {
	display:none !important;
}

.bgBlack {
	background-color:black;
	color:white;
}
.bgWhite {
	background-color:white;
	color:black;
}
.dict-entry {
	box-shadow:inset 0 -2px 0 var(--green);
	transition:box-shadow 0.3s ease-out;
	cursor:help;
	position:relative;
}
.dict-entry:hover {
	box-shadow:inset 0 -1.2em 0 var(--green);
}

.balloon {
	position:absolute;
	left:0;
	top:0;

	opacity:0;

	padding:0;
	background-color:white;
	color:black;
	z-index:8000;
	width:250px;
	min-height:160px;

	transform:translateY(calc(-100% - 4px)) translateX(-50%);

	font-family:TitilliumUpright;
	text-transform:none;
	font-style:normal;
	font-weight:normal;
	font-size:15px;
	text-align:left;
	box-shadow:0 0 32px rgba(0,0,0,0.3);
	transition:opacity 0.3s ease-out;
}
.balloon:after {
	top: 100%;
	left: 50%;
	border: solid transparent;
	content: "";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: rgba(255, 255, 255, 0);
	border-top-color: #ffffff;
	border-width: 8px;
	margin-left: -8px;
}
.balloon.below {
	transform:translateY(2em) translateX(-50%);
}
.balloon.below::after {
	top:auto;
	bottom:100%;
	border-top-color: rgba(255,255,255,0);
	border-bottom-color: #ffffff;
}

.balloon.active {
	opacity:1;
}
.balloon h5 {
	font-size:var(--szNormal);
	text-transform:uppercase;
	color:var(--green);
	font-family:var(--sans);
	font-weight:bold;
	line-height:1.3;
	margin-bottom:0.7rem;
}
.balloon-image {
}
.balloon-image img {
	display:block;
	max-width:100%;
	height:auto;
}
.balloon-text {
	padding:0.7rem;
	padding-bottom:0.7rem;
}
.balloon-more {
	color:var(--green);
	text-align:center;
	text-transform:uppercase;
	font-weight:600;
	line-height:1;
	padding-bottom:4px;
}
.glossary-alias {
	padding:0 0 0.5rem 0;
}
.balloon-link {
	padding:1rem;
	border-top:1px solid #ddd;
	display:flex;
	justify-content:space-between;
	align-items:center;
}
.balloon-link a {
	font-weight:600;
	display:inline-block;
}
.balloon-link a.glossary-link {
	display:inline-block;
	width:75px;
	height:22px;
	background:transparent url(/template/deco/icn_glossary_link.png) no-repeat left center;
}
.balloon-link a.glossary-link:hover {
	background-image:url(/template/deco/icn_glossary_link_active.png);
}
.balloon-link a.video-link, .video-link-icon {
	display:inline-block;
	width:64px;
	height:22px;
	background:transparent url(/template/deco/icn_video_link.png) no-repeat left center;
	cursor:pointer;
}
.balloon-link a.video-link:hover, .video-link-icon:hover {
	background-image:url(/template/deco/icn_video_link_active.png);
}
.balloon-link a.audio-link, .audio-link-icon {
	display:inline-block;
	width:66px;
	height:22px;
	background:transparent url(/template/deco/icn_audio_link.png) no-repeat left center;
	cursor:pointer;
}
.balloon-link a.audio-link:hover, .audio-link-icon:hover {
	background-image:url(/template/deco/icn_audio_link_active.png);
}
.balloon-link a.audio-link.active, .audio-link-icon.active {
	background-image:url(/template/deco/icn_audio_link_active.png);
}
.audio-link-icon.active {
	animation:pulseAudio 2s infinite
}
@keyframes pulseAudio {
 0% { opacity:1 }
 50% { opacity:0.4; }
 100& { opacity:1 }
}


.balloon-content {
/*
	height:100%;
	overflow-y:auto;
*/
}


.holder {
	position:relative;
}

.noise {
	background-image:url(bg-noise.png);
	background-repeat:repeat;
}
.noise-heavy {
	background-image:url(bg-noise-20.png);
	background-repeat:repeat;
}

.skewed {
	position:absolute;
	left:0;
	top:0;
	bottom:0;
	width:60%;
}

.icn {
	font-weight:300;
}
/*
.icn:before {
	content:"\f0ad";
	font-family:FontAwesome;
	line-height:1;
	display:inline-block;
	padding-right:0.5rem;
}
.icn-user:before	{ content:"\f4fc";font-weight:bold }
.icn-search:before	{ content:"\f002";font-weight:bold }
.icn-place:before	{ content:"\f3c5";font-weight:bold }
.icn-play:before	{ content:"\f144" }
*/
.xicn {
	padding-left:20px;
	background:transparent url(deco/map-marker-alt-solid.svg) left top no-repeat;
	background-size:auto 1rem;
}
.svg-icon {
	display:inline-block;
	width:1rem;
	height:1rem;
	margin-right:0.5rem;
}


.sans {
	font-family:"TitilliumUpright",serif;
}
.casual {
	font-family:cursive;
}
.serif {
	font-family:serif;
}
.bold {
	font-weight:bold;
}
.thin {
	font-weight:300;
}
.thin b, .thin strong {
	font-weight:600;
}
.cta-button {
	text-transform:uppercase;
	font-size:30px;
	line-height:1;
	cursor:pointer;
	display:inline-block;
	padding:12px 0 10px 1rem;
}
.cta-button:active {
	transform:scale(0.97);
}

.btn {
	display:inline-block;
	padding:10px 15px 8px 15px;
	line-height:1;
	cursor:pointer;
}
.btn:hover {
	transform:scale(0.97);
}
.btn.with-arrow {
	padding-right:2rem;
	background-image:url(deco/arrow-small-right-white.png);
	background-repeat:no-repeat;
	background-position:right 10px center;
	background-size:auto 1rem;
}
.btn-green {
	background-color:var(--green);
	color:white;
}
.btn-green-outline {
	color:var(--green);
	border:4px solid var(--green);
	text-align:center;
	line-height:1;
}
.btn[disabled], .btn-green[disabled] {
	background-color:#ddd;
	color:#aaa;
}
.btn[disabled]:hover {
	transform:none;
}

.szNormal { font-size: var(--szNormal); }
.szLarger { font-size: var(--szLarger); }
.szQuiteLarge { font-size: var(--szQuiteLarge); }
.szMediumLarge { font-size: var(--szMediumLarge); }
.szLarge { font-size: var(--szLarge); }
.szVeryLarge { font-size: var(--szVeryLarge); }
.szHuge { font-size: var(--szHuge); }

.normal {
	font-size:16px;
}
.medium-large {
	font-size:20px;
}
.quite-large {
	font-size:25px;
}
.large {
	font-size:30px;
}
.very-large {
	font-size:var(--szVeryLarge);
}
.huge {
	font-size:var(--szHuge);
}
@media all and (max-width:810px) {
	.huge {
		font-size:var(--szVeryLarge);
	}
}
.massive {
	font-size:var(--szMassive);
	text-transform:uppercase;
}
.uppercase {
	text-transform:uppercase;
}
.button-outline {
	text-align:center;
	padding:10px 1.5rem 0 1.5rem;
	background-color:transparent;
	border:4px solid;
}
.button {
	text-align:left;
	padding:10px 10px 8px 10px;
	line-height:1;
	background-color:var(--mediumlightgrey);
	color:black;
	display:inline-block;
	text-transform:uppercase;
}
.button-grey {
	background-color:var(--mediumlightgrey);
}

.text-left { text-align:left; }
.text-right { text-align:right; }
.text-center { text-align:center; }
.text-spacious { line-height:1.5; }
.center { margin-left:auto;margin-right:auto; }
.flex-center { margin:auto; }
.flex-right { margin-left:auto; }
.flex-end { margin-top:auto; }
.container {
	max-width:1060px;
	margin-left:auto;
	margin-right:auto;
}
.container.wide {
	max-width:1400px;
}
.column {
	display:flex;
	flex-direction:column;
}
.row {
	display:flex;
	flex-wrap:wrap;
	justify-content:flex-start;
	align-items:stretch;
}
.row.nowrap {
	flex-wrap:nowrap;
}
img.picture {
	max-width:100%;
	height:auto;
}
@media screen and (max-width:768px) {
	.row.nowrap {
		flex-wrap:wrap;
	}
}
.row.middle {
	align-items:center;
}
.row.bottom {
	align-items:flex-end;
}
.col-flex {
	display:flex;
	flex:0 1 100%;
	margin-right:20px;
}
.col-flex-grid {
	flex:1 0 16.6667%;
	margin-right:20px;
}
.row .col-flex:last-child, .row .col-flex-grid:last-child {
	margin-right:0;
}

.col {
/*
	flex-basis:calc(100% / 6);
	flex-grow:1;
*/
	padding-right:10px;
	padding-left:10px;
	min-height:8px;
}
@media all and (min-width:811px) {
	.row .col:first-child {
		padding-left:0;
	}
	.row .col:last-child {
		padding-right:0;
	}
}
.colpx-1,.colpx-md-1,.colpx-sm-1 { width:160px; }
.colpx-2,.colpx-md-2,.colpx-sm-2 { width:340px; }
.colpx-3,.colpx-md-3,.colpx-sm-3 { width:520px; }
.colpx-4,.colpx-md-4,.colpx-sm-4 { width:700px; }
.colpx-5,.colpx-md-5,.colpx-sm-5 { width:880px; }
.colpx-6,.colpx-md-6,.colpx-sm-6 { width:50%; }

.col-1,.col-md-1,.col-sm-1 { flex:1 0 8.33334%; }
.col-2,.col-md-2,.col-sm-2 { flex:0 0 16.66667%; }
.col-3,.col-md-3,.col-sm-3 { flex:0 0 25%; }
.col-4,.col-md-4,.col-sm-4 { flex:0 0 33.33334%; }
.col-5,.col-md-5,.col-sm-5 { flex:0 0 41.6667%; }
.col-6,.col-md-6,.col-sm-6 { flex:0 0 50%; }
.col-7,.col-md-7,.col-sm-7 { flex:0 0 58.33334%; }
.col-8,.col-md-8,.col-sm-8 { flex:0 0 66.66667%; }
.col-9,.col-md-9,.col-sm-9 { flex:0 0 75%; }
.col-10,.col-md-10,.col-sm-10 { flex:0 0 83.33334% }
.col-11,.col-md-11,.col-sm-11 { flex:0 0 91.66667%; }
.col-12,.col-md-12,.col-sm-12 { flex:0 1 100%; }

nav {
	display:flex;
	justify-content:flex-start;
}
nav a {
	display:inline-block;
	margin-right:1rem;
}
nav a:last-child {
	margin-right:0;
}

.text-right nav {
	justify-content:flex-end;
}

.indent-1 {
	margin-left:2rem;
}
.indent-2 {
	margin-left:4rem;
}
.indent-1 > strong:first-child { position:relative }
.indent-1 > strong:first-child::before {
	content:" ";
	position:absolute;
	left:-2rem;
	top:0px;
	line-height:1;
	display:block;
	width:20px;
	height:20px;
	background:transparent url(deco/bullet-arrows-green.svg) no-repeat center center;
	background-size:contain;
}
.anchor {
	position:relative;
	top:-80px;
}
/*
.with-aside main {
	display:flex;
}
.with-aside .main-wrapper {
	order:1;
}
.with-aside aside {
	width:340px;
	order:2;
}
*/