/*@viewport 
	{
	width: device-width;
	zoom: 1;
	}*/

Body
{
color: #ffffff;
font-family: Roboto;
font-family: Helvetica;
font-weight: 600;
margin: 0;
/*padding: 2;*/ 
background-color: #000000;
background-size: 100% 100%;
background: radial-gradient(farthest-side at 80% 55%, black 90%, yellow 150%) fixed;
background-attachment: fixed;
}


#Header
{
color: #000000;
position: fixed;
overflow: hidden;
top: 0;
left: 0;
height: 22px;
width: 100%;	
background-color: #ffff00;
z-index: 1;
}


	.HeaderLink
	{
	padding-top: 1px;
	margin-left: 15px;
	margin-right: 22px;
	position: relative;
	float: right;
	}


#Body
{
position: absolute;
top: 22px;
bottom: 22px;
left: 0;
width: 100%;
/*Hintergrund siehe "Body", da der overflow-Parameter sonst das Logo verdeckt*/
/*background-color: #8bc5eb;*/
/*background-repeat: repeat-y;*/
/*overflow: auto;*/
}

.IndentedText
{
text-indent: -1.1em;
padding-left: 1em;
}

.IndentedText2
{
text-indent: -0.6em;
padding-left: 0.5em;
}


	#Banner
	{
	position: realive;
	top: 0;
	left: 0;
	height: 170px;
	width: 100%;
	/*background: linear-gradient(to bottom right, #e4ebf5, #669fd7);*/
	/*background: linear-gradient(to bottom right, rgba(0,0,0,1), rgba(255,255,0,0.4));*/
	/*opacity: 0.8;*/
	}


		#Logo
		{
		/*opacity: 1.0;*/	
		position: absolute;
		margin-top: -10px;
		top: 0;
		left: 15;
		height: 141px;
		width: 600px;
		background-image: url(Layout/Logo.png);
		background-repeat: no-repeat;
		z-index: 2;
		}
		
		
		#MenuBox
		{
		position: fixed;
		top: 60px;
		right: 45px;
		z-index: 1;	
		}
		
		
		#Menu
		{
		position: relative;
		font-size: 187%;
		}
			
			
			#MenuButton
			{
			position: relative;
			float: left;
			font-weight: 1200;
			color: #ffff00;
			border-radius: 17px;
			padding: 0 10px 5px 10px;
			border: 4px solid #ffff00;
			background-color: #000000;
			z-index: 2;	
			
			}
			
			
			.MenuLink
			{
			visibility: hidden;
			position: relative;
			float: left;
			margin-right: -30px;
			font-weight: 1200;
			color: #ffff00;
			border-radius: 17px;
			padding: 4px 40px 6px 10px;
			border: 4px solid #ffff00;
			background-color: #000000;
			z-index: 2;	
			}
			
			
			.SubMenu
			{
			visibility: hidden;
			position: absolute;
			width: 100%;
			}
			
			
			.SubLink
			{
			position: relative;
			float: left;
			margin-top: 30px;
			margin-right: -30px;
			width: 25.5%;
			font-size: 50%;
			font-weight: 1200;
			color: #ffff00;
			border-radius: 17px;
			padding: 24px 40px 6px 20px;
			border: 4px solid #ffff00;
			background-color: #000000;
			z-index: 0;	
			}
			
			.MenuLink:hover, .Sublink:hover
			{
			color: #000000;	
			background-color: #ffff00;
			}
	
	
	.ContentBox
	{
    z-index: 0;
	position: relative;
	font-weight: 400;
	color: #ffffff;
	vertical-align: top;
	}
        
        .Content p
        {
        margin-bottom: 0px;
        }
		
		.Content a, .Content a p a
        {
        color: #ffff00;
        }
		
		.Content
		{
		position: relative;
		float: left;
		/*left: -40px;*/
		border-radius: 20px;
		padding: 0.8em;
		border: 4px solid #ffff00;
		background-color: #000000;
		z-index: 2;
		}
	
		.ContentImg
		{
		position: relative;
		float: left;
		vertical-align: middle;
		border-radius: 20px;
		padding: 0 0 0 0;
		border: 4px solid #ffff00;
		z-index: 1;
		}
	
			.ContentImg img 
			{
			border-radius: 15px;
			}
	
	
        
        /*
	@media 
	(orientation: portrait) {
	#MenuBox
	{
	Top: 120px;
	right: 20px;
	}´	
	}
        */

#Footer
{
position: fixed;
overflow: hidden;
z-index: 2;
bottom: 0;
left: 0;
height: 22px;
width: 100%;	
color: #000000;
background-color: #ffff00;	
}

	#Footer a
	{
	color: #000000;
	}
	
	.FooterLink
	{
	padding-top: 1px;
	margin-left: 22px;
	margin-right: 45px;
	position: relative;
	float: left;
	}


@media 
(orientation: portrait) and (max-width: 600px), (orientation: landscape) and (max-height: 600px)
{
	#Banner
	{
	height: 100px;	
	/*background-color: #ffffff;*/
	}
	#Logo
	{
	/*background-image: url(Layout/Logo_320.png);*/
	width: 320px;	
	height: 75px;
	background-size: 100%;
	margin-top: -5px;
	left: 7;
	}
	#Menu
	{
	font-size: 140%;	
	}
	#MenuBox
	{
	top: 80px;
	right: 3%;
	z-index: 3;
	}
	#MenuButton
	{
	border-radius: 15px;
	padding: 0 8px 4px 8px;
	border: 4px solid #ffff00;	
	}
	.MenuLink
	{
	border-radius: 15px;
	margin-right: -25px;
	padding: 7px 30px 6px 10px;
	font-size: 80%;	
	}
	.SubLink
	{
	margin-top: 30px;
	margin-right: -28px;
	width: 25.5%;
	font-size: 50%;
	border-radius: 15px;
	padding: 12px 30px 6px 10px;	
	}
	.HeaderLink
	{
	padding-top: 0;
	margin-left: 8px;
	margin-right: 18px;
	}
	.FooterLink
	{
	padding-top: 0;
	margin-left: 8px;
	margin-right: 18px;
	}
	.ContentBox
	{
	top: 1%;
	left: 14%;	
	min-width: calc(60%);
	width: calc(70%);
	max-width: calc(80%);
	}
	.Content
	{
	padding: 0.5em;	
	}
}
@media 
(orientation: landscape) and (max-aspect-ratio: 5/3)
{
	.ContentBox
	{
	top: 10%;
	left: 25%;
	min-width: calc(57%);
	width: calc(67%);
	max-width: calc(77%);
	}
}
