
	#lebensraum-menue {max-width:850px;}
@media (min-width:  1px) and (max-width:868px) { #lebensraum-menue {max-width:425px;} }
	/* @media (min-width:768px) and (max-width:991px) { #main .container {width:870px;} } */
	.leben-small {float:left; width:85px; height:85px; border:0px solid lightgrey;}	/*transition:all 0.0s linear; transition:all 0.2s ease;*/
	.leben-small:hover  {background-position:0 -85px; cursor:pointer;}
	.leben-small.active {background-position:0 -85px;}
	.leben-small.active:focus, .leben-small.active:hover {transform: scale(1.2)}
/* LEBENSRAUM */
	.leben-small.feuer 	{background-image:url(/static/lebensraeume/small_feuer.png);}	/* Beinhaltet 2 Grafiken (Color/SW) */
	.leben-small.natur 	{background-image:url(/static/lebensraeume/small_natur.png);}
	.leben-small.erde 	{background-image:url(/static/lebensraeume/small_erde.png);}
	.leben-small.donner {background-image:url(/static/lebensraeume/small_donner.png);}
	.leben-small.wasser {background-image:url(/static/lebensraeume/small_wasser.png);}
	.leben-small.licht 	{background-image:url(/static/lebensraeume/small_licht.png);}
	.leben-small.dunkel {background-image:url(/static/lebensraeume/small_dunkel.png);}
	.leben-small.magie 	{background-image:url(/static/lebensraeume/small_magie.png);;}
	.leben-small.metall {background-image:url(/static/lebensraeume/small_metall.png);}
	.leben-small.legende{background-image:url(/static/lebensraeume/small_legende.png);;}
	#lebentext {font-weight:700;}
	#lebensraeume {}
	.leben-table {display:none; max-width:720px; margin-bottom:20px;}
/* table */
	.table-text {display:none; padding:10px 0; border:0px solid red;}
	.leben-text-bold {display:none; height:17px; font-weight:bold; text-align:center; border:0px solid red;}
	.feuer .leben-text-bold::before 	{content:"Feuer";}
	.natur .leben-text-bold::before 	{content:"Natur";}
	.erde .leben-text-bold::before 		{content:"Erde";}
	.donner .leben-text-bold::before 	{content:"Donner";}
	.wasser .leben-text-bold::before 	{content:"Wasser";}
	.licht .leben-text-bold::before 	{content:"Licht";}
	.dunkel .leben-text-bold::before 	{content:"Dunkel";}
	.magie .leben-text-bold::before 	{content:"Magie";}
	.metall .leben-text-bold::before 	{content:"Metall";}
	.legende .leben-text-bold::before	{content:"Legende";}
	.table {display:none; border:2px solid darkgrey; box-shadow:8px 8px 5px lightgrey;}
	.tr {display:table-row; text-align:center;}
	.td {display:table-cell; word-break:break-word; border:1px solid lightgrey;}
	.h6 {padding-right:0px !important; font-weight:bold; text-align:center !important; background-color:#ccc; border-color:grey;}
	.sp0 {width: 70px;}
	.sp1 {width: 90px;}
	.sp2 {width: 80px;}
	.sp3 {width:100px;}
	.sp4 {width:120px; text-align:right; padding-right:26px;}
	.sp5 {width:120px; text-align:right; padding-right:26px;}
	.sp6 {width: 80px; text-align:right; padding-right:26px;}
	.sp7 {width: 60px;}
	.td[class*=sp] {height:24px; vertical-align:middle;}
	.gold 		{background-position:95%;}
	.futter 	{background-position:95%;}
	.goldstar 	{background-position:95%;}
	.bluestar 	{background-position:95%;}
	.time 		{background-position:95%;}
/* LEBENSRAUM */
/* gilt für alle Tabellen */
	.color .row00.sp0.h6::before {content:"Level";}
	.color .row00.sp1.h6::before {content:"Available";}
	.color .row00.sp2.h6::before {content:"Monster";}
	.color .row00.sp3.h6::before {content:"Maximum";}
	.color .row00.sp4.h6::before {content:"Price";}
	.color .row00.sp5.h6::before {content:"Bonus";}
	.color .row00.sp6.h6::before {content:"Time";}
	.color .row00.sp7.h6::before {content:"Size";}

	.db .sp1:before {content:"Level ";}
	.desktop {}
	.mobile  {display:none}
	
@media (max-width:600px) {
	.goldstar, .bluestar, .time {text-align:center; background-image:none;padding-right:0;}
	.color .row00.sp0.h6::before {content:"Lv";}
	.color .row00.sp1.h6::before {content:"Av";}
	.color .row00.sp2.h6::before {content:"Mo";}
	.color .row00.sp3.h6::before {content:"Max";}
	.color .row00.sp4.h6::before {content:"Pr";}
	.color .row00.sp5.h6::before {content:"B";}
	.color .row00.sp6.h6::before {content:"T";}
	.color .row00.sp7.h6::before {content:"S";}
	.db .sp1::before {content:"Lv ";}
	.sp4 {padding-right:24px;}
	.desktop {display:none !important;}
	.mobile  {display:block;}
}

@media {/* beispiel zur info */
	.beispiel::before    {white-space:pre-wrap; content:"text1. \A";}
	.beispiel::after     {content:"text2.";}
}
