@charset "utf-8";
*		{ 	
	margin:0; padding:0; 
	-webkit-box-sizing: border-box; 
	-moz-box-sizing: border-box;   
	box-sizing: border-box;          
	font-family:'ArialMT', 'Arial', sans-serif;
	font-size:14px;
}
img		{ border:none; }
a		{ text-decoration:none; color:green;}

body	{
	/*text-align:center;*/ /* set inline in default.tpl*/
        color:rgb(88, 77, 77);
        line-height:21px;
}

div		{
	position:relative;
}

h1	{font-size:2.0em; padding-bottom:12px; color:darkorange;}
h2	{font-size:1.8em; padding-bottom:12px; color:darkorange;}
h3	{font-size:1.7em; padding-bottom:0px;}
h4	{font-size:1.2em; margin-top:7px; line-height:1.2em;padding-bottom:0px;}
h5	{font-size:1.0em; }

p       {margin-top:4px;}

.wrapper{
	display:inline-block;
	width:760px;
	margin-top:0;
	text-align:left;
	border:0px dashed;
	border-radius:5px;
        /*background-color:green;*/
}
.head	{
        display:none;
	width:auto;
	height:80px;
	border-bottom:1px solid;
	background-image:url(../content/img/myLogo.jpg);
	background-repeat:no-repeat;
	background-position:0 8px;
}

.indexTop	{
	position:absolute;
	right:0px;
	left:200px;
	bottom:0px;
	width:auto;
	height:20px;
}

.body{}/* don't mistake with html-body-tag! */

.rearLeft, .rearRight	{
	/*background-color:#0099FF;*/
	/*opacity:0.5;*/
}

.rearLeft	{
	position:absolute;
	width:100%;		/* set  equal to .paneLeft->width */
	top:0px;		/* set  equal to .header->height */
	bottom:0px;	/* set  equal to .base->height */
	border-right:0px solid;

        background-image:url(../content/img/thomas_gitarre.png);
	background-repeat:no-repeat;
	background-position:200px 20px;
}

.rearRight	{
        display:none;
	position:absolute;
	right:0px;
	width:20%;		/* set  equal to .paneRight->width */
	top:80px;		/* set  equal to .header->height */
	bottom:21px;	/* set  equal to .base->height */
	border-left:1px solid;
}

.paneLeft, .paneCenter, .paneRight{
	min-height:500px;
	height:100%;
}

.paneLeft	{
        display:none;
	float:left;
	width:20%;
	padding:1.4em 1.4em 2.4em 1.8em;
}

.paneCenter	{
	float:left;
	width:100%;
	padding:1.4em 1.4em 1.0em 1.4em;
}

.paneRight	{
        display:none;
	float:left;
	width:20%;
	padding:1.4em 1.4em 2.4em 1.4em;
}

.content	{
	clear:both;
	width:auto;
	padding-bottom:0px;
}
.base		{
	clear:both;
	width:auto;
	height:21px;
	padding: 0 1.4em;
	text-align:right;
	border-top:1px solid;
}

.wrapper, .rearRight, .rearLeft, .head, .paneLeft, .paneCenter, .paneRight, .base{
	border-color:silver;
}

/*---------------------    dynamicBoxes   -----------------------*/

.dynBoxArea		{top:10px;}
.paneLeft > .dynBoxArea		
				{top:78px;}

.dynBoxArea p	{margin:4px 0px 6px 0px; line-height:14px; }

.dynBox			{margin: 0 0 0 0; border:1px solid silver; border-radius:3px;  opacity:1.0;}

.dynBoxHead		{height:18px; font-weight:bold; border-color:#298edc; background-color:#e0e0e0;}

.dynBoxBody		{ overflow:auto;}
.paneRight > .dynBoxArea > .dynBox
				{}/*min-height:120px;min-height:440px; max-height:440px; max-height:340px;*/

.dynBoxContent	{margin:0px 8px 0px 8px; padding:3px 0 6px 0; line-height:1.3em;}




/* usage only for development */
.green	{background-color:green;}
.orange	{background-color:orange;}
.yellow	{background-color:yellow;}
.red	{background-color:red;}
.blue	{background-color:royalblue;}
.gray	{background-color:gray;}
.silver	{background-color:silver;}