/* Projekt    : Statistikfuchs
   Komponente : Dax Trendanalysen
   Datei      : Trendanalysen.css

   Stylesheet für die Anzeige von Trendanalysen
     16.05.11  Gernot Daum  Neuimplementierung
     29.09.11  Gernot Daum  Maximale Seitenbreite
     31.01.12  Gernot Daum  max-width von 80 auf 89
     03.04.12  Gernot Daum  body#PlusD2 höhere max-width
     15.06.12  Gernot Daum  max-width auf 97
     17.01.13  Gernot Daum  form.upgrade Formatierungen
     24.04.15  Gernot Daum  Erste Media Query
*/


/* Allgemeine Festlegungen */
html {height: 100%; font-size: 62.5%}
	
body {
	/* font: 1.2em/1.8em Verdana, sans-serif; */
	font: 1.2em/1.8em Georgia, sans-serif;
}
* {margin: 0em; padding: 0em; border: 0em;}

/* -- Überschriften */
h1, h2, h3, h4, h5, h6 {
	text-align: center;
	font-family: "Century Gothic", sans-serif;
	margin: 0em 0em 0.5em 0em;
	color: #000000;
	clear:both;
}
h1 {
	font-size: 2.2em;
	font-weight: normal;
}
h2 {font-size: 1.2em;}
h3 {font-size: 1.8em;}
h4 {font-size: 1.6em;}
h5 {
font-family: "Courier New", sans-serif;
font-size: 1.4em;
text-align: center;
word-spacing: 0.4em
}
h6 {font-size: 1.4em;}

/* -- Textformatierungen */
p.centertext{horizontal-align: center}
p.emptyline{margin-top: -0.4em}
div.ind1 {
	list-style-image: url("21_Icons/Fuchs.PNG"); 
	margin-top: 0.2em; margin-left: 3em
}
div.ind1 p {display: list-item}
div.ind2{margin-left: 5em; list-style-type: circle; clear: both}
div.ind2 p.emptyline{clear: both}
div.big1{font-size: 1.4em}
div.big2{font-size: 1.6em; margin-top: 0.4em}
div.big3{font-size: 1.8em}
div.big4{font-size: 2em}
div.big5{font-size: 2.4em}
span.bulletpoint{display: list-item; margin-left: 1em}

/* -- Text und Tabellen seitlich von Bildern */
img.floatnone, img.floatnone1, img.floatnone2, img.floatnone3, img.floatnone4
{width: 90%; margin-left: 3em} 
img.floatnoneFill, img.floatnoneuFill {width: 100%; margin: 1%}
img.floatnoneFill8, img.floatnoneuFill8 {width: 80%; margin: 2% 0%; padding: 1% 10%}
img.floatnoneFill6, img.floatnoneuFill6 {width: 60%; margin: 2% 0%; padding: 1% 20%}
img.floatleft, img.floatleftu, img.floatleft2, img.floatleft2u,
img.floatleft3, img.floatleft3u, img.floatleft4, img.floatleft4u,
img.floatlefth, img.floatleftuh, img.floatleft2h, img.floatleft2uh,
img.floatleft3h, img.floatleft3uh
{float: left; clear: both}
img.floatright, img.floatright2, img.floatright3, img.floatrighth,
img.floatrightu, img.floatrightu3, img.floatrightuh, img.floatright4, 
img.floatright11, img.floatrightu12
 {float: right; ; clear: both; padding-left: 1em}
 
/* ---- Standard Größen */
img.floatnone  {max-width: 26em}
img.floatnone2 {max-width: 32em}
img.floatnone3 {max-width: 42em}
img.floatnone4 {max-width: 72em}
img.floatright, img.floatleft{width: 26em}
img.floatright2, img.floatleft2{width: 32em}
img.floatright3, img.floatleft3{width: 44em}
img.floatright4, img.floatleft4{width: 72em}
/* ---- Sondergrößen */
img.floatnone11 {width: 24em; margin-left: 5em}
img.floatright11, img.floatleft11{width: 32em; height: 13em}
img.floatright12, img.floatleft12{width: 6em; height: 3em; margin-top: 0.6em}
img.floatrightu12, img.floatleftu12{width: 8em; margin-right: 0.6em}

img.floatrightu{width: 20em; padding-left: 8em; padding-right: 4em}
img.floatright, img.floatright2, img.floatright3, img.floatright4
{margin-right: 1.4em; margin-left: 0.8em}
img.floatleft, img.floatleft2, img.floatleft3, img.floatleft4
{margin-left: 3em; margin-right: 0.8em}
div.newline {clear:both}


/* -- Verweise */
a {color: #000000; text-decoration: none}
a:link {}
a:hover {Color: #C00020}
a:active {}

/* -- Tabellen */
table {font-size: 0.88em; margin: 0.1em; padding: 0.1em;}
div#wrap_content table{margin-left: 4em}
/* tbody tr {line-height: 1.45em}*/ /* 09.07.13 unkontrollierbare Auswirkung auf Chartlinge Karten */
tbody tr.odd {background: #CCCCCC}
body#Preisliste tbody tr.odd {background: #FFFFE1}
tbody tr.even {background: #F6F6FF; line-height: 1.5em}
body#Preisliste tbody tr.even {background: #C6D3FB}
tbody tr td.up {background: #AAFFBB}
tbody tr td.down {background: #FFCCCC}
th, tfoot {text-align: center}
tfoot a {background: #CCCCCC; font-size: 2em}


/* Fehlerbehandlung */
div#error, div.error {
	margin: 2em; padding: 1.5em;
	background: #FFD4D4;
	border: 0.3em solid #FF0000;
	font-size: 1.6em;
	text-align: center;
	float: left 
}
div.usererror {clear: both; font-size: 1.4em; color: #FF0000}


/* Festlegungen zur Hauptstruktur des Doumentes */

/* -- Äußerer Rahmen */
div#wrapper {
	max-width: 100em; margin: 0 auto;  
	background: #C6D3FB;
}
body#PlusD2 div#wrapper {max-width: 96em} /* 50 ungekürzte Aktiennamen */

/* -- Seitenkopf */
div#logoheader{display: inline-block; padding-top: 0.5em; width : 95%}
div#logo {float: left; width: 20%; min-width: 10em; max-width: 15em}
div#logo img {width: 100%}
div#logotext {float: right; width: 75%}
div#logotext h1, h2, h3, h4, h5, h6 {text-align: center}
div#header {height: 2.4em; background: #E8E8FA;	padding: 0.5em}
div#header h1 {border: 0em;}

/* -- Navigation (Kopf- und Fußleiste, Seitenmenü */

div#nav, div#nav2, div#footer, div#pages, div#scrollitems {
	background: #FFFFE1;
	margin: 0em 0.6em 0.6em 0.6em;
	padding: 0.2em 0em 0.2em 0em;
	text-align: center;
	overflow: auto
}
div#footer {border-bottom: 0.6em solid #C6D3FB}
div#nav li, div#nav2 li, div#footer li  {
	display: inline;
	padding: 0.2em 0.6em 0.4em 0.6em;
	background: #FFFFE1;
}
div#nav2, div#nav2 li{
	background: #E2E9ED;
	padding: 0.1em 0.1em 0.2em 0.2em;
}
div#nav a, div#nav2 a, div#footer a, 
div#menu li a.menu1, div#menu li a.menu2,
div#menuSmall li a.menu1, div#menuSmall li a.menu2,
div#pages a, div#scrollitems a{
	text-decoration: none;
	font-weight: bold;
	padding-left: 0.2em; padding-right: 0.2em;
	padding-bottom: 0.1em;
}
div#nav li.navS a, div#nav2 li.navS a, div#footer li.navS a, 
div#menu li a.menu1S, div#menu li a.menu2S,
div#menuSmall li a.menu1S, div#menuSmall li a.menu2S,
div#pages a.pageS, div#scrollitems a.pageS {
	border-left: 0.1em solid #800080;
	border-top: 0.2em solid #800080;
	border-right: 0.1em solid #800080;
	border-bottom: 0.2em solid #800080;
	padding-left: 0.1em; padding-right: 0.1em;
}

div#nav li.navS a:hover, div#nav2 li.navS a:hover, 
div#pages a.pageS:hover, 
div#menu li a.menu1S:hover, div#menu li a.menu2S:hover,
div#menuSmall li a.menu1S:hover, div#menuSmall li a.menu2S:hover
{color: black} /* Keine Farbveränderung bei Maus über selektiertem Menüpunkt */
	
div#nav li.nav a:hover, div#nav2 li.nav a:hover, div#footer li.nav a:hover,
div#menu li a.menu1:hover, div#menu li a.menu2:hover, 
div#menuSmall li a.menu1:hover, div#menuSmall li a.menu2:hover, 
div#pages a.page:hover, div#scrollitems a:hover {
	color: black;
	border-top: 0.2em dashed #C00020;
	border-bottom: 0.2em dashed #C00020;
}

div#nav li.navS a, div#nav2 li.navS a, div#footer li.navS a, 
div#pages a.pageS, div#scrollitems a.pageS, 
div#menu li a.menu1S, div#menu li a.menu2S, 
div#menuSmall li a.menu1S, div#menuSmall li a.menu2S, 
div#nav li.nav a:hover, div#nav2 li.nav a:hover, div#footer li.nav a:hover,
div#menu li a.menu1:hover, div#menu li a.menu2:hover,
div#menuSmall li a.menu1:hover, div#menuSmall li a.menu2:hover,
div#pages a.page:hover, div#pages a.pageS:hover, div#scrollitems a:hover {
  -webkit-border-radius: 0.4em;
	-moz-border-radius: 0.4em;
	border-radius: 0.4em
}	
div#nav li.nav a:active, div#nav2 li.nav a:active, div#footer li.nav a:active,
div#menu li a.menu1:active, div#menu li a.menu2:active,
div#menuSmall li a.menu1:active, div#menuSmall li a.menu2:active,
div#pages a.page:active, div#scrollitems a.page:active
{background: #FFFF96} /* beim Drücken dunklees Gelb als Hintergrund */
/*
div#nav a:visited, div#footer a:visited {color: #000000}
li.navS {background: #FFE4F0;}
div#scrollitems a {color: #000000}
*/


/* -- Innerer Rahmen */
div#wrap_content {
	/* background: #C6D3FB url(../21_Icons/MenuBack.gif) 0.6em repeat-y; */
	overflow: auto; /*; height: 100%*/ 
	}

/* -- Spezielle Einstellungen für die Seitennavigation */
div#menu, div#menuSmall {
	float: left;
	width: 20%; max-width : 15em;
	margin-left: 0.6em;
	padding: 0.6em 0.4em
}
div#menuSmall {width: 12em}

div#menu li div.menu1, div#menuSmall li div.menu1{margin-left: -0.8em}
div#menu li a.menu2, div#menuSmall li a.menu2 {font-weight: normal; margin-left:  -0.2em;}
div#menu ul, div#menuSmall ul {list-style-type: none; font-weight: bold; line-height: 1.5em}
div#menu ul ul, div#menuSmall ul ul {margin-left: 1em; font-weight: normal; line-height: 1.3em}
div#menu li.subselect, div#menuSmall li.subselect {
	border-left: 0.4em solid #E3004F;
	padding-left: 0.2em;
	margin-left: -0.6em;
}
body#TrendDisplay div#menu, body#TrendDisplay div#menuSmall
{background: #FFFFE1}

/* -- zentraler Textbereich  */
div#pages{clear : none} /* Sonst schiebt sich Seitenauswahl unter seitliche Navigation */
div#pages, div#scrollitems{
	padding-bottom: 0.2em; /* Sonst erscheint Scrollbar */
	font-size: 1.15em;
	margin: 0em 0.45em 0em 0.45em;
	text-align: center;
}
div#scrollitems {background: #C6D3FB}

div#maintext {
  line-height: 1.6em;
	margin: 0em 0.6em 0.0em 0.6em;
	background: #FFFFFF;
	overflow: auto
}
/* div#maintext p {margin-left: 3em; margin-right: 5em} */
div#maintext p {margin: 0% 1%}
div#maintext a { /* Link Sonderbehandlungen im Rahmen aufheben */ 
	font-size: 1em; 
	/* padding-bottom: 0.1em; */
	text-decoration: underline
}
/* div#maintext a:visited {Color: #800080} */
div#maintext a {Color: #800080}
div#maintext a:hover {Color: #C00020}

/* Ersatzformatierunge für fehlende Teile*/
div#NoSideMenuWrapper  {
	width: 84em;
	margin-left: 16em 
}		


/* Einstellungen für bestimmte Elmente */

/* -- Textkästen */
div.Überschrift {text-align: center}
div.Linksfließend {float: left}
div#maintext div.Linksfließend p {margin: 0}

div.Halbseite, div.Halbbox,
div.Zweidrittelseite, div.Zweidrittelseite-sideways, 
div.Viertelseite, div.Viertelbox, 
div.Dreiviertelseite, div.Dreiviertelbox,
div.Achtelseite, div.Achtelbox,
div.Halbseite-sideways, div#TwitterTimeline
{margin-right: 1%; float: left}
div.Halbseite, div#TwitterTimeline, div.Halbbox, div.Halbseite-sideways {
	width: 48.5%; 
}
div#TwitterTimeline{margin-left: 1%; width: 42%}

div.Viertelseite {min-width: 18em}
div.Dreiviertelseite {min-width: 54em}
div.Drittelseite {min-width: 24em}
div.Zweidrittelseite {min-width: 24em}

body#Aktuell div#menu {width: 5%}

div.Viertelseite, div.Viertelbox{width: 23%}
div.Dreiviertelseite, div.Dreiviertelbox{width: 71%}
div.Achtelseite, div.Achtelbox {width: 12.125%}
div.Zweidrittelseite, div.Zweidrittelbox {width: 64%}
div.Zweidrittelseite-sideways{width: 32%}
div.Drittelseite{width: 32%; float: left}
div#maintext div.Drittelseite p, div#maintext div.Halbseite p, 
div#maintext div.Zweidrittelseite p
{margin: 0; padding-left: 1.5%}
/* 25.02.14: Die Folgezeile ist nicht logisch ! */
/* div.Halbseite div.newline, div.Zweidrittelseite div.newline {clear:none} */

div.Drittelseite img, div.Halbseite img {margin: 1% 0%}

div#Hinweis, div#Halbseite, div#Zweidrittelseite
{ float: left; 
	padding-top: 1em; 
	margin-left: 3em; 
	margin-bottom: 0.3em
}
div#Halbseite{width: 48.5%}
div#Zweidrittelseite{width: 60em}
div#Fazit, div.Fazit{
	width: 93%; 
	overflow: auto
}
div#Hinweis {
	width: 35em;
	background: #CCFFCC
}
div#Halbseite, div#Zweidrittelseite {margin-left: 0em}

/* 22.11.13: Neuer verbesserter Halbseitenmechanismus */
div.Vollseite {width: 97%}
div.HalbseiteLinks, div.HalbseiteRechts
{width: 48.5%; min-width: 20em; /* max-width: 42em; */ float: left}
div.HalbseiteLinks{margin-right: 1%}
div#maintext div.HalbseiteLinks p, 
div#maintext div.HalbseiteRechts p {margin: 0% 1.5%}

div#HomepageAdd, div#Hinweis, div#maintext div.Rechts1, 
div#maintext div.Rechts2, div#maintext div.Rechts3
div.Mitte1, div#Fazit, div.Fazit, div#Addition1,
div.HervorgehobenGelb, div.HervorgehobenGrün, div#LinkBox {
	border: 0.3em solid #800080;
	-webkit-border-radius: 0.3em;
	-moz-border-radius: 0.3em;
	border-radius: 0.3em;
  background: #FFFF99;
  display: inline-block
}
div#LinkBox{float: Left}
div.HervorgehobenGrün, div#LinkBox{background: #CCFFCC}
div.UnterlegtGrün{background: #CCFFCC; display: inline-block}
	
div#HomepageAdd, div#Fazit, div.Fazit, div#Addition1, div#hint1 {
	background: #FFFFE1;
	margin-left: 3em; margin-right: 32em;
	margin-bottom: 1em;
	padding-left: 0.5em; padding-right: 0.5em;
}
div#Fazit, div#Addition1 {margin-right: 4em}
div.Fazit {margin: 0.5% 2%}

div#Addition1 {font-weight: bold; background: #CCFFCC}

div#maintext div.Rechts1{
	background: #C6D3FB;
	width: 20em;
	margin-left: 8em; margin-right: 3.5em;
	padding-left: 0em; padding-right: 0em;
	float: right;
}
div#maintext div.Rechts2, div#maintext div.Rechts3, div#maintext div.Mitte1{
	background: #C6D3FB; /* Für IE */
	background: -webkit-linear-gradient(top, #FFC8C8, #C6D3FB);
	background: -moz-linear-gradient(top, #FFC8C8, #C6D3FB);
	/*  16.11.12: W3C Fehler background: linear-gradient(top, #FFC8C8, #C6D3FB); */
	border-top: 0.4em solid #C6D3FB;
	border-right: 0.3em solid #C6D3FB;
	border-bottom: 0.4em solid #FFC8C8;
	border-left: 0.3em solid #FFC8C8;
	width: 23em;
	margin-left: 3em; margin-right: 3.5em;
	padding-left: 0em; padding-right: 0em;
	float: right;
}
div#maintext div.Rechts3 {margin-top: 3em}

div#maintext div.Mitte1{margin-right: 5em; width: 64em}

div#HomepageAdd p, div#maintext div.Rechts1 p, 
div#maintext div.Rechts2 p, div#maintext div.Rechts3 p{
	line-height: 1.6em; 
	margin: 0em; padding: 0.4em;
	text-align: center;
}	

div#maintext div.Links1
{width: 29.5em; float: left; padding-left: 3em; padding-right: 2em}
div#maintext div.Links1 p
{margin: 0em; padding: 0em}

div#maintext div.Links1-sideways
{width: 40em; float: left; margin: 0em; padding-right: 0.5em}
div#maintext div.Links1-sideways p
{margin: 0em; padding: 0em}

/* Abgesetzte Blöcke zur allgemeinen Verwendung */ 
div.Block01, div.Block02, div.Block03 { 
	display: inline-block; 
	margin: 1%;
	border: 0.2em solid #800080;
	-webkit-border-radius: 0.8em;
	-moz-border-radius: 0.8em;
	border-radius: 0.8em;
	background: #C6D3FB;
}
div.Block02, div.Block03 {padding: 0.5%; border: 0.1em solid #800080} 
div.Block03 {background: #FBFCE2}

div.LinkButton {
	display: inline-block; /* Damit er Raum im umliegenden Container beansprucht */
}
div.LinkButton a, div.LinkButton01 a {padding: 0.3em}

div.Linksammlung {margin-left: 6em}

div#SocialMedia {padding-left: 0.5em; background: #C6D3FB}
div#SocialMedia div.floatleft {float: left; width: 50em; padding-left: 0.4em; padding-top: 0.9em}
div#SocialMedia img {padding-left: 0.5em; padding-top: 0.2em}

/* temporäre Formatierungen: April 2014, Traders */
div#SocialMedia div.cust01 a {
	float: left; 
	width: 28em;
	text-decoration: none;
	padding-left: 0.4em; padding-top: 1em;
  color: #EC3415;
  font-size: 1.6em;
}
div#SocialMedia div.cust02 {float: left; width: 48em}
div#SocialMedia img.cust01 {
	float: left; width: 18em; 
	padding-left: 5.5em; 
	padding-top: 0.6em; 
	padding-right: 0.6em; 
	padding-bottom: 0.6em
}

/* -- Buttons und Pseudo Buttons */
/* ---- normales Erscheinungsbild */
button.Doit1, button.Doit2, button.DoitL,  button.DoitR, 
button.FormSubmitL, button.FormSubmitR,
div#Chartlings button.btstyle1, form#scores button.btstyle1,
div#scores button.ShowButtonT, div#scrollitems a,
div#maintext div.buttonr1 a, div#maintext div.buttonr2 a,
body#Startseite p a, 
div#maintext div.LinkButton a, div#maintext div.LinkButton01 a, 
div#maintext div.LinkButton02 a, div.Linksammlung a,
a.ExtLink {
	font-size: 1.3em; text-decoration: none;
	padding: 0.3em;
	margin: 0.2em;
	color: #800080;
	border: 0.1em solid #888888;
	float: left;
  -webkit-box-shadow: inset 0.2em 0.2em 0.2em #efefef;
	-moz-box-shadow: inset 0.2em 0.2em 0.2em #efefef;
	box-shadow: inset 0.2em 0.2em 0.2em #efefef;
	-webkit-border-radius: 1.2em;
	-moz-border-radius: 1.2em;
	border-radius: 1.2em;
  cursor: pointer
}
body#Startseite p {clear: left}
div#scrollitems a, div#scores button.ShowButtonT
{float: none; margin: 0.0em; font-size: 1.1em}
button.FormSubmitL, button.FormSubmitR {background: #C6D3FB}
button.Doit2, button.DoitL, button.DoitR {Color: #C00020; background: #C6FBD3}
button.DoitL{margin: 0em}
button.DoitR, button.FormSubmitR{float: right}
a.ExtLink, div#maintext button.Doit1, div#maintext div.LinkButton01 a, 
div#maintext div.LinkButton02 a
  {font-weight: bold; text-align: center; color: #000000; background: #FFFFE1}
a.ExtLink, div#maintext div.LinkButton02 a
  {background: #FFD47F}  

div.Centering{text-align: center}
div.Centering div.LinkButton01, div.Centering div.LinkButton02
{display: inline-block}

/* ---- Effekte beim Überstreichen */
button.Doit1:hover, button.Doit2:hover, button.DoitL:hover, button.DoitR:hover,
button.FormSubmitL:hover, button.FormSubmitR:hover, 
body#Startseite p a:hover, div#maintext div.LinkButton a:hover, 
div.Linksammlung a:hover, div.LinkButton01 a:hover, 
div#maintext div.LinkButton01 a:hover, div#maintext div.LinkButton02 a:hover
{border: 0.1em solid #000000; Color: #FF00FF; }
/* ---- Effekte beim Klicken mit der Maus */
button.Doit1:active, button.FormSubmitL:active, button.FormSubmitR:active, 
div#Chartlings button.btstyle1:active, form#scores button.btstyle1:active,
body#Startseite p a:active
{background: #85B1FF}
button.Doit2:active, button.DoitL:active, button.DoitR:active,
div#maintext div.LinkButton a:active 
{background: #37FF37}

div#maintext div.Rechts1 p a, div#HomepageAdd p a, div#hint1 p a{
	display: inline-block; 
	text-decoration: none;
	background: #C6FBD3;
	line-height: 1.6em; 
	font-size: 1.4em;
	border: 0.1em solid #800080;
	padding-left: 0.4em; padding-right: 0.2em;
	-webkit-box-shadow: inset 0.2em 0.2em 0.2em lightgrey;
	-moz-box-shadow: inset 0.2em 0.2em 0.2em lightgrey;
	box-shadow: inset 0.2em 0.2em 0.2em #e1ffff;
	-webkit-border-radius: 1em;
	-moz-border-radius: 1em;
	border-radius: 1em;
}	
div#maintext div.Rechts1 p a:hover, div#HomepageAdd p a:hover
{border: 0.3em solid silver}
div#maintext div.Rechts1 p a:active, div#HomepageAdd p a:active
{	background: #B2FBD3;
	-webkit-box-shadow: inset 0.2em 0.2em 0.2em silver;
	-moz-box-shadow: inset 0.2em 0.2em 0.2em silver;
	box-shadow: inset 0.2em 0.2em 0.2em silver}
	
div#maintext div.buttonr1 a, div#maintext div.buttonr2 a
{float: right; 
	background: -webkit-linear-gradient(top, #EEEEEE, #D4D0C8);
	background: -moz-linear-gradient(top, #EEEEEE, #D4D0C8);
	text-decoration: None;
	padding : 0.4em}
		
div#maintext div.buttonr2 a {margin-right: 20.8em; margin-top: -0.6em}
div#maintext div.buttonr1 a {margin-top: 1.3em; margin-right: 1%}

div#Chartlings button.btstyle1:hover, form#scores button.btstyle1:hover,
div#maintext div.buttonr1 a:hover, div#maintext div.buttonr2 a:hover,
div#scrollitems a:hover, div#scores button.ShowButtonT:hover
{border: 0.1em solid silver; Color: #C00020}

div#maintext div.buttonr1 {float: right; width: 20%}
div#maintext div.buttonr1 p {margin: 0% 1.5%}
div#maintext div.buttonr1-sideways {float: left; width: 80%}
div#maintext div.buttonr2-sideways {float: left; width: 30em}
div#maintext div.buttonr1-sideways p, div#maintext div.buttonr2-sideways p
{margin-right: 0.0em}


/* Formatierungen für bestimmte Bücher */
body#Startseite p {margin-right: 0em}
body#Startseite div.Zweidrittelseite-sideways p {margin-left: 1em}
body#Startseite div#hint1{clear: both}

body#Aktuell div#maintext {padding-left: 1em; padding-bottom: 0.5em}

body#Erläuterungen img.floatright, img.floatleft{padding-bottom: 2em}

div.GamePreview
{width: 36em; height: 10em;
 margin: 1em 3em;
 float: left;
 background: transparent url(22_Images/Chartspiel1.JPG) no-repeat -1.6em -20em
}
div.GamePreview-sideways
{float: left; width: 40em}

div#menu li {padding: 0.5em }
body#TrendDisplay div#menu li{padding: 0em }
div#menuSmall li {font-size: 0.95em}

 /* eigene (integrierte) Masken */

div#maintext form p{margin-left: 0em; margin-right: 0em}
div#additionaltext1 form p{margin-left: 0em;}
div#form_wrapper {
	padding: 0.5em; padding-left: 6em; 
	clear: both
}
div#form_wrapper p {width: 98%; font-size: 1.1em}
div#maintext form li, div#form_wrapper li {width: 50em; font-size: 1em; margin-left: 2em}  

form.Vollseite, div#wrap_content form.login, div#wrap_content form.upgrade, 
form.enroll, form#errorhandling,
div#hint1, div#hintgame p {
	margin-left: 1%;
	border: 0.2em solid #800080;
	-webkit-border-radius: 2%;
	-moz-border-radius: 2%;
	border-radius: 2%;
	padding: 1%;
	width: 70%; min-width: 40em 
	}
form.Vollseite {width: 95%; display: inline-block}	
div#hintgame p{width: 80em}	
div#maintext form.login{margin-left: -4em}
div#additionaltext1 form.upgrade{margin-left: 10em}	
div#wrap_content form.upgrade, div#hint1 {border: 0.3em solid #00A4F6}	
div#hint1 {margin-left: 16em; background: #CCFFCC}
div#maintext div#hint1 {margin-left: 3em; width: 65em}
div#NoSideMenuWrapper form.upgrade {width: 56em}
div#wrap_content form.login h2, div#wrap_content form.upgrade h2
{font-size: 1.8em}
div#wrap_content form.login h3, div#wrap_content form.upgrade h3,
div#InternalError h3 {
	margin-top: 0.6em;
	color: red; font-size: 1.2em
}
div#InternalError, div#error {
	margin-top: 2em;	margin-bottom: 2em;
	margin-left: 5em;	margin-right: 5em; 
	border: 0.4em solid red
}
div#InternalError h3 {font-size: 2em}

/* Spaltenformatierung von Masken */
div.lblcol1, div.lblcol3, div.lblcol1a, div.lblcol1b, div.lblcol1c, 
div.txtcol2, div.txtcol4 
{float: left}
div.lblcol1, div.lblcol3, div.txtcol2, div.txtcol4  
{margin: 0.2em; margin-top: 0.7em}
div.lblcol1 {width: 24%}
div.lblcol1a {margin-left: 1em; width: 10em}
div.lblcol1b {width: 16em}
div.lblcol1c {margin: 0.7em 1.4em; width: 12em}
div.txtcol2 {width: 48%}
input.col2 {width: 98%}

input[type="text"], input[type="password"] /* Attributselektor */
{background: #FEFEFE}

div#wrap_content form.login button.btstyle1, 
div#wrap_content form.upgrade button.btstyle1 {
	background: #00A4F6;
	font-size: 1.2em;
	margin: 0.2em;
  border-top: 0.2em solid #4D5130;
  border-left: 0.2em solid #4D5130;
  border-bottom: 0.2em solid #C9C0BB;
  border-right: 0.2em solid #C9C0BB;
  cursor: pointer
}
div#wrap_content form.upgrade button{color: #0042F6}


/* Einstellung für Spiel "Chartlings" */
body#Aktuell div#menu {float: left; text-align: center; width: 15%; max-width: none}
body#Aktuell div#menu li {float: left; display: inline}
body#Aktuell div#maintext{clear: both}

body#Unterhaltung div#wrap_content {margin: 0em 1em}
body#Unterhaltung div#maintext{background: #F5E4B6; margin-right: 1.2em}
body#Unterhaltung div#menu {text-align: center; width: 20%; max-width: none}
body#Unterhaltung div#menu li {float: left; display: inline}

body#Unterhaltung div#pages {float: left; padding: 0.6em; 0.4em}
body#Unterhaltung div#maintext{clear: both}
body#Unterhaltung div#menu li a.menu1,
body#Unterhaltung div#menu li a.menu1S
{background: #FFFFFF}

/* 05.03.15: Aktueller Stand: Das meiste wird über die Game Area gesteuert */
div#GameArea{margin: 1% 0.5%; clear: both}
div#GameArea div{float: left} /* Float für die Spielkarten */ 
div#GameArea button{position: relative; background: transparent}
div#GameArea img {width: 92%}

div#Chartlings {
	float : left;
}	
div#Chartlings, 
body#Unterhaltung div#wrap_content,
body#Unterhaltung div#pages, body#Unterhaltung div#scrollitems{
	background: #D1EDB2 url(21_Icons/gamedesk.jpg);
	margin: 0em
}	
/*
div#Chartlings img {
  margin: 0.0em 0.0em 0.0em 0.0em;
  width: 14em; 
}
div#Chartlings button, div.OpenCard {position: relative}
div#Chartlings div.Overlay {
  position: absolute;
  top: 2.5em;
  left: 1.5em;
  width: 0em;
  text-align: center;
	font-size: 1.4em;
  background: #FFFFFF;	
  color: #040678; 
}	
div#Chartlings div.NamedCard div.Overlay {width: 8em}
*/

div#Chartlings h2 {font-size: 1.3em;}
div#Chartlings h2, div#Chartlings p{
	background: #F5E4B6;	color: #040678; 
	margin: 0.3em;
	margin-left: 2em;
  float: left;
}

div#Chartlings div.lblcol1{width: 11em}

div#score {
	float : left;
	width: 60em;
	font-weight : bold;
	margin-top: -1em; margin-bottom: 0.4em;
	margin-left: 1.4em; 
}

div#Chartlings table#table1{clear:both; margin-left:0.5em}

img.cards1 {border: 0.3em solid #5E7ECB}
img.cards2 {border: 0.3em solid #FFFF00}
img.cards3 {border: 0.3em solid #E3004F}
img.cards4 {border: 0.3em solid #55FF55}
div.OpenCard img.cards4 {
	border: 0.5em solid #E4C688;
	font-size: 1.26em;
	}

div#Scorelist table {margin: 1em; padding: 0em; float: left}
div#Chartlings caption{
	font-size: 1.4em; 
	margin-top: 0.6em;
  color: #040678; 
	background: #F5E4B6
}
div#Scorelist caption{
	font-size: 1.5em; 
	margin-bottom: 0.6em
}
div#Scorelist tbody td {
	padding-left: 0.6em; 
	padding-top: 0.2em; 
	padding-right: 0.4em;
	padding-bottom: 0.1em
}
div#Chartlings button.cards1{cursor: pointer}

div#Chartlings div#score {margin-top: 0.7em}	
div#Chartlings span.Label, div#Chartlings span.slimlabel, div#scores h2{
	background: #E4C688; color: #040678; 
	margin-left : 1.6em;
	padding : 0.2em;
	font-size: 1.3em;
}
div#Chartlings span.slimlabel {font-size: 1.1em}
div#scores{float: left}
div#scores h2{
	margin-left: 0em;
	margin-top: 1.4em;
	clear: left;
}
table.time caption, table.highscore caption
{color: #040678; background: #F5E4B6}
body#Unterhaltung thead, body#Unterhaltung tbody 
  {font-size: 1em; font-weight: bold}
body#Unterhaltung thead th {
	font-size: 1.2em;
	color: #040678;	background: #E4C688;
	padding: 0.1em 0.3em
}
body#Unterhaltung tbody tr {color: ##040678}
body#Unterhaltung tbody tr.odd {background: #F5E4B6}
body#Unterhaltung tbody tr.even{background: #E4C688}
body#Unterhaltung tbody tr.highlighted {background: #37FF37}

/* Besondere Farbverläufe */
div#wrapper, 
div#wrap_content, 
form.Vollseite, div#wrap_content form.login, div#wrap_content form.upgrade{
  background: #FFFFE1; /* Für IE */
	background: -webkit-linear-gradient(top, #FFFFE1, #C6D3FB);
	background: -moz-linear-gradient(top, #FFFFE1, #C6D3FB);
	/* 16.11.12: W3C Fehler background: linear-gradient(top, #FFFFE1, #C6D3FB); */
}

div#maintext {
	background: #C6D3FB; /* Für IE */
	background: -webkit-linear-gradient(top, #C6D3FB, #FFFFE1);
	background: -moz-linear-gradient(top,  #C6D3FB, #FFFFE1);
}


/* 12.02.14: "Responsive" Design der Textkästen  
div.Halbseite, div#TwitterTimeline {min-width: 24em}
@media screen and (max-width: 48.5em) {
   div.Halbseite, div.Drittelseite, div.Zweidrittelseite, div#TwitterTimeline 
   { width: 97%}
}
*/

/* "Responsive" Design: 1-Spaltig  */ 
div.Halbseite {min-width: 300px}
@media screen and (max-width: 720px) {
	/* Allgemeine Einstellungen */
	div.big2 {font-size: 1.2em}
	
	/* Äußerer Rahmen */
  div#logo {min-width: 4em; max-width: 10em}
	div#logotext{margin-left: 1%; margin-top: 1%}
	div#logotext h1 {font-size: 1.4em}
	div#logotext h2 {font-size: 1em}
	div#nav li a, div#nav2 li a, div#menu li a, div#pages a, div#footer li a{
	  font-size: 0.9em; font-weight: normal;
	  margin: 0.1em
	}
	div#menu, body#Aktuell div#menu{
		max-width: none; width: 97%;
		padding: 0.5% 0.5%; margin: 0.5% 0.5%
	}
	div#pages, div#scrollitems {padding: 1% 0.5%; margin: 1% 0.5%}
	div#menu li, div#footer li{display: inline; margin: 0em 1em}
	div#pages, div#maintext {clear: both}
  body#Aktuell div#maintext{width: 100%; margin: 0; padding: 0}
  div.Halbseite, div.Drittelseite, div.Zweidrittelseite, div#TwitterTimeline {width: 97%}
  div.Drittelseite{max-width: 360px}
  div.Halbseite{max-width: 480px}
  div.Halbseite{max-width: 720px}
  div#Hinweis{margin-left: 2%; width: 96%}
  div#maintext div.LinkButton01 a,  div#maintext div.LinkButton01 a  {font-size: 1.1em}
  div#scrollitems a{font-size: 1em; font-weight: normal}
}