/*
 * @license
 * MyFonts Webfont Build ID 3297037, 2016-10-18T04:20:54-0400
 * 
 * The fonts listed in this notice are subject to the End User License
 * Agreement(s) entered into by the website owner. All other parties are 
 * explicitly restricted from using the Licensed Webfonts(s).
 * 
 * You may obtain a valid license at the URLs below.
 * 
 * Webfont: FuturaBT-Light by Bitstream
 * URL: http://www.myfonts.com/fonts/bitstream/futura/light/
 * 
 * Webfont: FuturaBT-Book by Bitstream
 * URL: http://www.myfonts.com/fonts/bitstream/futura/book/
 * 
 * 
 * License: http://www.myfonts.com/viewlicense?type=web&buildid=3297037
 * Licensed pageviews: 200,000
 * Webfonts copyright: Copyright © 2015 Monotype Imaging Inc. All rights reserved.
 * 
 * © 2016 MyFonts Inc
*/

@font-face {font-family: 'Futura';font-weight: normal;font-style: normal;src: url('webfonts/324F0D_0_0.eot');src: url('webfonts/324F0D_0_0.eot?#iefix') format('embedded-opentype'),url('webfonts/324F0D_0_0.woff2') format('woff2'),url('webfonts/324F0D_0_0.woff') format('woff'),url('webfonts/324F0D_0_0.ttf') format('truetype');}

@font-face {font-family: 'Futura';font-weight: bold;font-style: normal;src: url('webfonts/324F0D_1_0.eot');src: url('webfonts/324F0D_1_0.eot?#iefix') format('embedded-opentype'),url('webfonts/324F0D_1_0.woff2') format('woff2'),url('webfonts/324F0D_1_0.woff') format('woff'),url('webfonts/324F0D_1_0.ttf') format('truetype');}

@font-face {
	font-family: 'Font Awesome 5 Pro';
	font-style: normal;
	font-weight: 300;
	font-display: auto;
	src: url("webfonts/fa-light-300.eot");
	src: url("webfonts/fa-light-300.eot?#iefix") format("embedded-opentype"), url("webfonts/fa-light-300.woff2") format("woff2"), url("webfonts/fa-light-300.woff") format("woff"), url("webfonts/fa-light-300.ttf") format("truetype"), url("webfonts/fa-light-300.svg#fontawesome") format("svg");
}

@font-face {
	font-family: 'Font Awesome 5 Brands';
	font-style: normal;
	font-weight: 400;
	font-display: auto;
	src: url("webfonts/fa-brands-400.eot");
	src: url("webfonts/fa-brands-400.eot?#iefix") format("embedded-opentype"), url("webfonts/fa-brands-400.woff2") format("woff2"), url("webfonts/fa-brands-400.woff") format("woff"), url("webfonts/fa-brands-400.ttf") format("truetype"), url("webfonts/fa-brands-400.svg#fontawesome") format("svg");
}


/**********	general	**********/
abbr, acronym {
	cursor: help;
	border: none;
}

body, html {
	font-family: "Calibri", Verdana;
	font-size: 0.95em;
	padding: 0;
	background-color: #fff;
	color: #000;
}

.center {text-align: center}
a:link, a:visited {
	color: #000;
	text-decoration: underline;
	}
	
a:hover, a:active {color: #000; text-decoration:none}
::selection {background: #F9906F}
::-moz-selection {background: #F9906F}

h1, h2, h3 {
	font-family: "Futura", "Verdana";
	font-weight: bold;
	font-size: 1.45em;
	font-style: normal;
}
h2, h3 {margin:0;padding:0}
	
.Upgrade {
	display: none;
	font-weight: bold;
}

.clearer {
	clear : both;
	height : 1px;
	font-size : 1px;
}

.n {
	font-family: Calibiri, Verdana, Arial;
	font-size: 11px;
	color: #000;
}


/**********	header menu	**********/
#top_menu {
	font-family: Verdana, arial, sans-serif;
	font-size: 0.9em;
	color: #F6F6F6;
	cursor: default;
	position: relative;
	z-index: 100;
}
#top_menu [data-fa-icon]::before {content: attr(data-fa-icon); font-family: "Font Awesome 5 Pro"; font-size: 1.8em; font-weight: normal; margin-right: 0.5em; display: inline-block; text-rendering: auto; -webkit-font-smoothing: antialiased; vertical-align: sub}
#top_menu a, #top_menu p {color: #F6F6F6; text-decoration: none; display: block; padding: 5px 10px 5px 20px}
#top_menu a {cursor: pointer}
#top_menu img {border: 0px none currentColor; vertical-align: middle;padding-right: 5px; height: 24px}
#top_menu p {margin: 0}
/* level 1 */ 
#top_menu ul {display: inline-block; margin: 0px;}
#top_menu ul li {width:200px; display: block; float: left; background: #6A0F0C; border: solid #6A0F0C 1px}
#top_menu ul li:hover {background: #780808; opacity: 1}
/* level 2 */ 
#top_menu ul li ul {display: none; margin-left: -1px; padding: 9px 0 0 0; position: absolute; background: #780808; border: solid #780808 1px; border-top-width: 0}
#top_menu ul li:hover ul, #top_menu ul li:active ul {display: block}
#top_menu ul li ul li {float: none; display: block; border:none; background: #780808}
#top_menu ul li ul li a {padding: 10px 10px 10px 20px}
#top_menu ul li ul li a:hover{color: #FFF; background: #8F1D21}

.breadcrumbs {box-sizing: border-box;font-family: "Futura", "Verdana";overflow: hidden;position: relative;text-align: left;}
.breadcrumbs > ul { margin:0; padding-left: 1em}
.breadcrumbs > ul::before, .breadcrumbs > ul::after {display: table;content: "";}
.breadcrumbs > ul::after {clear: both;}
.breadcrumbs > ul > li {float: left;font-size: .85rem;list-style: none;max-width: 30%;padding-right: 10px;position: relative;}
.breadcrumbs > ul > li:first-child > a::before {content: "\f015";display: inline-block;font-family: "Font Awesome 5 Pro";font-size: 14px;margin: -3px 7px -3px 0;vertical-align: -1px;}
.breadcrumbs > ul > li > a {color: #666666;display: block;overflow: hidden;padding: 5px 1px 5px 5px;text-decoration: none;text-overflow: ellipsis;white-space: nowrap;word-wrap: normal;text-shadow: 0 1px 0 transparent;}
.breadcrumbs > ul > li > .pointer {padding: 5px 0;position: absolute;top: 0;right: 0;}


/**********	DIV container	**********/ 
#ContentContainer {
	width: 1204px;
	margin: auto;
	padding: 0;
	text-align:justify;
	overflow: visible;
	line-height:1.5em;
	text-align:justify;
	
	border: 4px #F3F3F3 solid;
	border-top: 0;
	background: #fff;
	
	box-shadow: 0 2px 3px 0px #616161;
}
#HeaderContainer {
	width: 1260px;
	margin: auto;
}
#Social_NetworkHeader {
	margin: 1.2em 1em;
	position: absolute;
}
#Social_NetworkHeader a::before {
	color: #FFF;
	content: attr(data-fa-icon);
	display: inline-block;
	font-family: "Font Awesome 5 Brands";
	font-size: 40px;
	margin: 0 0.25em;
	text-rendering: auto;
	vertical-align: sub;
	-webkit-font-smoothing: antialiased
}

.RankingShare {
	background: linear-gradient(to bottom, rgba(242, 242, 242, 0.600) 0px, #F2F2F2 100%) transparent;
	bottom: 0px;
	display: inline;
	height: 50px;
	position: absolute;
	width: 780px;
	padding-left: 20px
}
	
#Subtitle {
	background-color:#f33928;
	color:#fff;
	padding:2px 0px 0px 0px;
	border: 0 #444 solid; border-bottom-width: 1px;
}
	
	
#Subtitle a:link, #Subtitle a:visited, #Subtitle a:hover {
	text-decoration: underline;
	color: #fff;
	background-color:transparent;
	}	
	
#Subtitle a:active, #Subtitle a:focus {
	color: #f33928; text-decoration:none; background-color: #fff;
	}

#Subcontainer {
	text-align:left;
	background-color:#fff;
	padding-bottom:18px;
	}


/********** Add-Layer **********/
#NoHTML5 {
	position: absolute;
	width: 100%; 
	top: 128px; left: 0;
	background: #6A0F0C;
}
#NoHTML5 aside {display: none}
.HTML5inf {
	padding: 5px;
	position: relative;
	margin: auto;
	width: 650px;
	background: #FFF
}
#NoHTML5 p, #NoHTML5 span{font-size: small; font-weight: 600}
.HTML5inf ul{display: inline-block; margin: 0px;}
.HTML5inf li {padding: 0 10px 0 12px; display: block; float: left}
.browser::before {
	display: inline-block;
	font-family: "Font Awesome 5 Brands";
	font-size: 44px;
	margin: -3px 4px -3px 2px;
	vertical-align: -1px;
	padding: 10px;
}
 .chrome::before {content: "\f268"}
 .firefox::before {content: "\f269"}
 .ie9::before {content: "\f282"}
 .opera::before {content: "\f26a"}
 .safari::before {content: "\f267"}

#mobile {
	display: none;
	z-index: 100;
	position: fixed;
	padding: 1em;
	top: 0px;
	left: 0;
	width: 100%
}
#mobile a {
	color: #fff;
	font: bold;
		font-size: 2.4em;
	font-weight: 700;
	background: transparent url("/templates/standard/imgs/icon/Cellular_Network.svg") 0 0 no-repeat;
	padding-left: 50px;
	background-size: 48px 48px;
	 width: 48px;
	 height: 48px;
}


/********** HTML5/CSS3-Extensions **********/
.IDE_box {
	color: #333;
	display: block;
	font-size: 0.75em;
	font-weight: 700;
	margin: -5px auto 1em;
	text-align: center;
	width: 650px
}
.trans {transition: all 0.3s ease-in-out}
.vt_chart, .linear_grey, .H5V_controls , #mobile{
	background: #313131;
	background: linear-gradient(top,#666,#313131);
}


/********** HTML5-Tags **********/
article p {margin: 0.2em 0 1em 0.4em;}
article h1, article h2, section h2, .sidenav h2 {
	font-weight: bold;
	margin: 0;
	padding: 0.8em 1em 0.2em 1em;
	border: none;
	border-bottom: solid #F3F3F3 5px;
}
article h1 {
	border: none;
	margin-top: 0;
	padding-top: 0;
}

footer {
	background: #C41C22;
	color: #fff;
	border: 0 #F3F3F3 solid;
	border-top-width: 2px;
	margin-top: 40px;
	padding: 5px 25px
}
footer a, footer a:link, footer a:visited { 
	border: none;
	color: #fff;
	text-decoration: none;
}
footer a:active, footer a:focus, footer a:hover {
	text-decoration: underline;
}

header {
	height: auto;
	color: #000;
	background-color: #C41C22;
	background: linear-gradient(68deg, #11305E 0, #1F4788 250px, #C41C22 251px, #8F1D21 100%);
	border: 0 #F3F3F3 solid;
	border-bottom-width: 2px;
	box-shadow: 0 2px 3px 0px #616161
}
.NameAndClaim {
	color: #FFF;
	display: block;
	font-family: "Futura", "Verdana";
	font-size: 250%;
	font-weight: 600;
	margin-bottom: 25px;
	text-align: right;
}
.NameAndClaim img {
	float:right;
	margin:5px 10px;
}
.NameAndClaim small {
	display: block;
	font-size: 50%;
	top: -25px;
}
header aside {
	display:inline-block;
	position:absolute;
	left: 40%;
	top: 65px;
}
header a:active, h1 a:link, h1 a:hover, h1 a:focus, h1 a:visited {
	text-decoration: none;
	color: #fff;
	background-color:transparent
}

.sidenav {
	color: #FFF;
	float: right;
	font-family: "Verdana", "arial", sans-serif;
	margin: 0 20px 0 0;
	text-align:left;
	width: 340px;
}
.sidenav a:hover, .HoverHighlight:hover, .pager a:hover {
	background: #C41C22
}
.sidenav h2 {color: #666;}
.HoverHighlight {transition: all 0.22s ease-in-out}
.HoverHighlight:hover {color: #FFF}

section {
	width: 800px;
	float: left;
	overflow: visible;
	position:relative;
}
section h2, section h1 {
	margin-top: 0;
	color: #666;
}
section h3 {
	color: #333;
	font-size: 1.2em;
	margin: 0.2em 0.5em;
}


/********** Video **********/
video {
	background: #000;
	border: 1px #888 solid;
	display: block; /* styling shim for older browsers */
	width: 100%;
}

#H5V {
	position: relative;
	width: 800 px;
	height: 450 px;
}
#H5V .IDE_box {display:none}

.H5V_audiocontrol {
	position: relative;
	top: 1em;
	margin: 0 0.7em;
	border: none;
	background: transparent;
	float: right;
	width: auto;
}
.H5V_audiocontrol img {
	float: left;
	width: auto;
	margin-top: 2px;
}
.H5V_audiocontrol input {
	float: left;
	width: 5em;
}

.H5V_bar_red {
	width: 0%;
	color: #C41C22;
	background: #C41C22;
	transition: all 0.2s ease-in-out;
}

.H5V_controls {
	position: absolute;
	bottom: 0;
	border: 1px #666 solid;
	width: 100%;
	height: 3em;
	opacity: 0.2;
}
.H5V_controls:hover { 
	border-color: #555;
	opacity: 0.9;
}

.H5V_controls button, .H5V_timerange, .H5V_timerange_bar, .H5V_toggleHD, .H5V_toggleFS {
	float: left;
	position: relative;
	top: 1em;
	width: 2em;
	margin: 0 1em;
	border: none;
	background: transparent;
}

.H5V_fullscreen:full-screen {
	width:	100%;
	height:	100%
}
.H5V_fullscreen:full-screen .H5V_toggleFS::before {content: "\f78c"}

.H5V_logo {
	position: absolute;
	top: 0;
	right: 0;
	width: auto;
	height: auto;
	margin: 1em;
}

.H5V_timerange {
	width: auto;
	color: #fff;
	font-size: 0.95em;
	font-family: "Calibri", Verdana;
	font-weight: 700;
}
.H5V_timerange_bar {
	width: 500px;
	margin: 0;
	color: #fff;
}
.H5V_timerange_bar_frame {
	border: 1px #666 solid;
	background: #FFF;
	overflow:hidden;
	height:1.2em
}

.H5V_toggleFS, .H5V_toggleHD {
	width: auto;
	color: #BBB;
	font-size: 0.95em;
	font-family: "Calibri", Verdana;
	font-weight: bold;
	cursor: default;
	margin: 0 0 0 0.5em
}
.H5V_toggleFS::before {content: "\f0b2"}


/********** Sprite **********/
.imgl::before {
	display: inline-block;
	font-family: "Font Awesome 5 Pro";
	font-size: 14px;
	margin: -3px 4px -3px 2px;
	vertical-align: -1px;
}
 .category::before {content: "\f07c"}
 .permalink::before {content: "\f0c1"}
 .comment::before {content: "\f086"}
 .trackback::before {content: "\f10e"}
 .previous::before {content: "\f322"}
 .next::before {content: "\f325"}
 
 
 /********** Pager **********/
.pager {
	border: 1px #F3F3F3 solid;
	border-width: 1px 0;
	box-shadow: 0px 2px 3px 0px #616161;
	display: inline-block;
	margin: 1em 0
}
.pager a, .pagerCurrent {
	border: 1px #F3F3F3 solid;
	border-width: 0 1px;
	display: inline-block;
	font-size: 0.9em;
	font-weight: 700;
	margin: 0 -2px;
	padding: 4px 12px;
	text-decoration: none
}
.pagerCurrent {color: #777; cursor: default}
.pagerLinkPrevPage {margin-right: -8px !important}
.pagerLinkNextPage {margin-left: -5px !important}

.vt_chart {border-top: 1px solid #666; margin: 5px -4px -12px}
.vt_chart div {height: 14px}


/********** adverts **********/

#vtnacs_nav_r1, #vtnacs_nav_s1, #vtnacs_comment_l1 {margin-top: 0.8em}
.AdvIndicator {
	display: block;
}

.fa_link_logo {
	background-color: #633;
	border-radius: 3px;
	box-shadow: 0 0 0px #AAA;
	padding: 0px 5px 0px 2px;
	color: #fff!important;
	font-weight: 700;
	text-decoration: none!important;
	transition: all 0.2s ease-in-out;
	white-space: nowrap;
 }
.fa_link_logo::before {
	content: "\f07a";
	display: unset !important;
	font-family: "Font Awesome 5 Pro";
	font-size: 14px;
	font-weight: 400;
	margin-right: 4px;
	text-rendering: auto;
	vertical-align: bottom;
	-webkit-font-smoothing: antialiased;
}
.fa_link_logo::after {
	font-size: 7px;
	font-weight: 400;
	margin-left: 4px;
	vertical-align: super;
}
.amazon_link {background-color: #FF8322}
.amazon_link::after {content: "amazon.de"}
.mm_link {background-color: #DF0100}
.mm_link::after {content: "mediamarkt.de"}
.sn_link {background-color: #112D3F}
.sn_link::after {content: "saturn.de"}
.thomann_link {background-color: #008C99}
.thomann_link::after {content: "thomann.de"}

.fa_link_logo:hover {box-shadow:0 0 2px #AAA}
.fa_link_logo:active {box-shadow:0 0 2px #333}


.SpecialOffer {
	background: #EE9;
	border: solid #F3F3F3 3px;
	font-size: 0.9em;
	font-weight: 700;
	margin: 0.5em;
	padding: 0.3em 1em
}

.AdvIndicator, .SpecialOffer small {
	color: #666;
	font-weight: 500;
}

article .SpecialOffer {
	margin: 0.9em 0 0.9em -0.4em;
	border-left-width: 0
}

section .SpecialOffer {
	margin: 0;
	border-width: 0 0 3px 0
}

nav .SpecialOffer {
	font-size: 0.6em;
	border-width: 0 0 0.2em 0;
	margin: 0 -4px 0 0;
}
/********** column a **********/
.date {font-weight: bold; margin: 0 0 0.4em 2.0em; display: block}

.footer {padding-bottom: 0.8em; text-align: left; font-size: 90%; margin-top: -7px}
.footer > div {float: left; padding: 0 5px}
	
#Nextpost {text-align:center}	
	
div.comment {
	width: 85%;
	border: 1px solid #d4d0cd;
	border-radius: 0.5em 0 0.5em 0;
	margin: 1.5em 0 0 1em;
	font-family: "verdana";
	font-size: 11px;
	text-align: justify
}
	
.commentposterinfo {
	margin: 0;
	padding:0.3em 0 0.1em 0.3em;
	font-weight: bold;	
	border-radius: 0.5em 0 0 0;
	background: #eee;
	background: linear-gradient(top,#eee, #e0e0e0);
	background: -o-linear-gradient(top,#eee, #e0e0e0);
	background: -moz-linear-gradient(top,#eee, #e0e0e0);
	background: -webkit-linear-gradient(top,#eee, #e0e0e0);
}
	
h3.commentheader {
	font-size:medium;
	color:#b8b2ac;
	font-weight: normal
}
	
.reply {font-weight: normal;font-size:small;margin-left:2em}

div.commenttext {
	margin:0.5em;
}


#CommentForm fieldset {
	border:2px solid #d4d0cd; 
	padding-top:10px; 
	margin-top:10px; 
	padding-left:10px; 
	padding-bottom:10px
}

#CommentForm legend {
	color:#e33928;
	padding:2px 4px 2px 4px;
	background-color: #ffffff;
	font-weight : bold
}

#CommentForm label {
	text-align: left;
	width: 19em;
	float:left;
	display:block;
	clear:both; 
	float:left;
	margin-top:8px;
	margin-bottom:0px
}
#CommentForm input {
	margin-top:	8px;
	margin-bottom: 8px;
	width: 200px;
	border:1px solid #ccc;
	border-radius:5px
}	
#Submit {
	margin-top:8px;
	margin-bottom:8px;
	margin-left:6em
}
	
#CommentForm textarea {
	margin-top:8px;
	margin-bottom:0px
}

#upload_progress {
	display:none;
	width:525px;
}
#ProgressBarFrame {
	overflow:hidden;
	width:50%;
	background-color:#fff;
	border:1px solid #ccc;
	border-radius:5px
}
#ProgressMsg {
	border:1px solid #d1d1d1;
	border-radius:5px;
	background-color:#dadada;
	margin:10px 0px;
}
#ProgressMsg p {
	margin:5px;
	font-size:95%;
	font-weight:600;
	color:#000;
}

/********** "aside" column **********/
#XSS {
	border:solid #666 1px;
	border-width: 1px 0px 1px 1px;
	width: auto;
	margin: 10px 0 10px 0
}
	
#Search fieldset {
	background: #F3F3F3;
	text-align: center;
	margin: 0.3em auto 1em;
	width: 200px;
	border: 0;	
	opacity: 0.8;
	padding: 0;
}
#Search fieldset:hover {opacity:0.95} 
#Search input {
	background: #F3F3F3;
	border: none;
	color: #000;
	font-size: 0.8em;
	font-weight: 600;
	margin: 0;
	padding: 0 0 0 5px;
	height: 20px;
	width: 85%;
}
#search input:active + #Search fieldset {opacity:1}
#Search img, #Search button {
	background: #F3F3F3;
	border: none;
	height: 16px;
	padding: 0 0 0 2px;
	vertical-align: middle;
}

#Categories ul, #Syndicate ul, #Recently ul, #Sections ul {
	background: #C41C22;
	list-style: none outside none;
	margin:0;
	padding:0;
	font-size: 0.8em;
	font-weight: 700
}
	
#Syndicate ul, #Sections ul {
	text-transform: capitalize;
}

#Categories a, #Syndicate a, #Recently a, #Sections a {
	color:#FFF !important;
	display:block;
	padding: 6px 10px 8px 15px;
	line-height: 1.3;
	text-decoration:none;
	cursor: pointer;
}

#Categories a:hover, #Syndicate a:hover, #Recently a:hover, 
#Sections a:hover, #Categories a:focus, #Syndicate a:focus, 
#Recently a:focus, #Links a:focus, #Categories a:active,	
#Syndicate a:active, #Recently a:active, #Sections a:active {
	background: #8F1D21;
}
#Bestenliste {
	background: #F3F3F3;
	border-width: 0;
	color: #222222;
	font-size: 0.9em;
	font-weight: 600;
	padding: 0 0.5em
}

#Links h2 {text-transform: capitalize}


/* ******************	footer	*************** */
#Bottommenu {
	clear:both;
	background-color:#f33928;
	color:#fff;
	padding:3px 15px 3px 15px;
	display: none;
	}
#Bottommenu a, #Bottommenu a:link, #Bottommenu a:visited, footer a, 
footer a:link, footer a:visited {
	text-decoration: none;
	color: #fff;
	border: 0;
	}
#Bottommenu a:active, #Bottommenu a:focus, #Bottommenu a:hover, 
footer a:active, footer a:focus, footer a:hover { 
	text-decoration : underline; 
	color : #fff;background-color:transparent; 
	}


/* ******************	albums	*************** */
div.album {
	text-align: center;
			float: left;
			width:150px;
			margin-bottom:20px;
			margin-right:5px;
		}

.album p {
		text-align: center;
		padding: 0;
		margin:0;
		width:150px;		
	overflow: hidden;
		}
	
a img {border:none}
#album a:link {color: #e33928}
#album a:visited {color: #e33928}
#album a:hover, #album a:active, #album a:focus {color: #e33928;background:none}


/* ******************	trakbacks	*************** */
h4 {
	margin:1em 0 0 0;
	padding:0;font-size:small
}
	
dl {	
	margin:0;
	padding:0
}
	
dt {
	font-weight: bold;
	float:left
}
	
dd {	padding-left:4em}
	
	
blockquote {
	background:url('imgs/blockquote.gif') no-repeat;
	padding:10px 10px 2px 41px;
	border: dotted #d4d0cd 1px
}
	
/* ******************	to align elements	*************** */
.left {text-align: left;display:block}
.right {text-align: right;display:block}
.center {text-align: center;display:block}

/* ******************	to float elements	*************** */
.floatleft {float: left;padding:2px 10px 10px 0px}
.floatright {float: right;padding:2px 0px 10px 10px}

/* ******************	to highlight text	*************** */
.bold {font-weight: bold}
.italic {font-style:italic}
.underline {text-decoration:underline}

/* ****************** aboutmyself	*************** */
#UserPicture {float:left;margin:10px 10px 10px 6px;border:solid #D4D0CD 1px;padding:3px;background-color:#fff}
#AboutMyself p {padding:10px 0;margin:0}

.comment_1 {margin-left: 10px}
.comment_2 {margin-left: 20px}
.comment_3 {margin-left: 30px}
 
.nav{margin-left: 4px; margin-right: 4px; color:#FFF}
.bdr{border: 1px #444 solid}


/* ****************** Chart style lib ****************** */
.arr{border-style: solid; height: 0px; width: 0px; margin-top: 7px}
.aleft { 
border-color: transparent #FFF transparent transparent;
border-width: 14px 28px 14px 0px;
float: left;
margin-left: 4px
}
.aright { 
border-color: transparent transparent transparent #FFF;
border-width: 14px 0px 14px 28px;
float: right;
margin-right: 4px
}

.chart {
	margin: 0;
	max-width: 8000px;
	width: 100%;
	border: 2px solid #F3F3F3;
	border-left-width: 0;
}
.chart_nav{
	margin: auto;
	text-align: center;
	width: 260px;
	color: #000;
	font-weight: bolder;
	margin-top: -1px;
	z-index: 10;
	cursor: default;
}

#bwd, #fwd {
	position: relative;
	display: table-cell;
	background-color: #F3F3F3;
	border-color: #FFF;
	width: 180px;
}
#bwd:hover, #fwd:hover {background-color: #F9906F}
#bwd {border-width: 0 1px 0 0; z-index: 12}
#fwd {border-width: 0 0 0 1px; z-index: 11}

.chart_inf {
	padding: 6px 0 6px 12px;
	font-size: 13px;
	font-weight: bold;
	width: calc(100% - 12px);
	display: block;
	background-color: #F3F3F3;
}
.chart_value {
	height: auto;
	margin: auto;
	max-width: 780px;
	width: 98%
}
.chart_value span, .chart_value a {
	position: relative;
	top: 5px
}
.chart_model {
	border-right: 1px solid #666;
	float: left;
 	height: 26px;
	overflow: hidden;
	display: inline-block;
	 white-space: nowrap;
	width: 230px;
	transition: all 0.3s ease-in-out;
}
.chart_model:hover {
	background: linear-gradient(to right, rgba(0,0,0,0) 0%,rgba(0,3,51,0.1) 100%);
}
.chart_model span, .chart_model a {
	text-decoration: none;
	line-height: 1em;
	font-size: 11px
}
.chart_model span:hover , .chart_model a:hover{
	cursor: default
}
.chart_y {
	margin-left: 231px;
	height: 26px;
 	background-image: url(./imgs/chart/dot.png);
}
.chart_res, .chart_res_Sec {
	bottom: 1px;
	float: right;
	font-weight: 700;
	margin: 0;
	position: relative;
	right: 2px;
	transition: all 0.12s ease-in-out;
}
.chart_res_Sec {
	color:#FFF;
	right: 3px !important;
}
.chart_result span {
	top: 6px;
	left: 3px;
}
.chart_balken {
	margin-top: 2px;
	float: left;
	height: calc(100% - 6px);
	overflow: hidden;
	border: 1px solid #BBB;
	border-width: 1px 1px 1px 0;
	transition: all 0.12s ease-in-out;
}
.chart_balken_Sec {
	background: rgba(0,3,51,0.33);
	border-right: 1px solid #999;
	display: block;
	float: left;
	opacity: 0.8;
	position: relative
}
.chart_x {
	margin-left: 235px;
	height: 6px;
	background-image: url(./imgs/chart/x_raster.png);
	background-repeat: repeat-x;
}
.chart_einheit {
	margin: 0 14px 0 auto;
	width: 90%;
	height: 25px;
	overflow: hidden;
	 text-align: right;
}
.chart_einheit span {
	font-size: 10px;
}

/* media queries || responsive webdesign */
.video-container {
	max-width: 800px;
	position:relative;
	padding-bottom: calc(56.25% - 30px);
	padding-top:30px;
	height:0;
}
.video-container[data-ytid] {
/*	background-image: url("https://i.ytimg.com/vi/" attr(data-ytid) "/maxresdefault.jpg");
	background-repeat: no-repeat;
	background-size: contain;	*/
	background-color: #F3F3F3
}
.video-container[data-ytid] > div {
	background-color: #C41C22;
	background: linear-gradient(112deg, #11305e 0, #1f4788 500px, #C41C22 501px, #8f1d21 100%);
	padding: 2em 1em;
	color: #FFF;
}
.video-container iframe {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
}

/********** GDPR Tool **********/
#GDPR {
	display: none;
	position: fixed;
	width: 100%;
	top: 135px;
	background: #6A0F0C;
	background: linear-gradient(112deg, #11305E 0, #1F4788 250px, #C41C22 251px, #8F1D21 100%);
	z-index: 1337;
	overflow-y: auto;
	max-height: calc(100% - 135px);
	-ms-overflow-style: none;
	scrollbar-width: none;
}
#GDPR::-webkit-scrollbar {display: none}
#GDPR aside {
	margin: 25px 4%;
}
#GDPR button {
	background: #333;
	border: #999 1px solid;
	color:#FFF;
	font-weight: 600;
	font-family: "Calibri", "Verdana";
	height: 28px;
	padding: 0 15px;
	opacity: 0.8;
	transition: .3s;
	width: 45%;
}
#GDPR button:hover {
	border-color: #666;
	opacity: 1;
}
#GDPR-selected {float:left}
#GDPR-all {
	background: linear-gradient(112deg, #11305E 0, #1F4788 100%) !important;
	float:right;
}
.GDPRinf {
	padding: 5px;
	position: relative;
	margin: auto;
	max-width: 650px;
	background: #FFF
}
#GDPR p, #GDPR span{font-size: small; font-weight: 400}
.GDPRinf ul{display: inline-block; margin: 1em 0; padding: 0}
.GDPRinf li {padding: 5px 10px; display: block; float: left}
#GDPR .yummy::before {
	color: #C57F2E;
	content: "\f564";
	display: inline;
	font-family: "Font Awesome 5 Pro";
	font-size: 44px;
	padding: 0 5px 0 0;
	float: left;
}
@media (max-width: 800px) {
	#GDPR {
		max-height: 100%;
		top: 0;
	}
}

.switch {
	position: relative;
	display: inline-block;
	width: 30px;
	height: 18px;
}
.switch input {
	opacity: 0;
	width: 0;
	height: 0;
}
.slider {
	position: absolute;
	border-radius: 9px;
	cursor: pointer;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #AC8181;
	transition: .4s;
}
.slider:before {
	position: absolute;
	border-radius: 50%;
	content: "";
	height: 14px;
	width: 14px;
	left: 2px;
	bottom: 2px;
	background-color: white;
	transition: .4s;
}
input:checked + .slider {background-color: #5B8930}
input:disabled + .slider {background-color: #CCC}
input:focus + .slider {box-shadow: 0 0 1px #2196F3}
input:checked + .slider:before {transform: translateX(12px)}