

	@font-face
	{
		font-family: 'Open Sans';
		font-weight: normal;
		src: local('Open Sans'), local('OpenSans'), url('../fonts/OpenSans-Regular.woff') format('woff');
	}

	@font-face
	{
		font-family: 'Open Sans';
		font-weight: bold;
		src: local('Open Sans Bold'), local('OpenSans-Bold'), url('../fonts/OpenSans-Semibold.woff') format('woff');
	}

	@font-face
	{
		font-family: 'Open Sans';
		font-weight: 200;
		src: local('Open Sans Light'), local('OpenSans-Light'), url('../fonts/OpenSans-Light.woff') format('woff');
	}


	*
	{
		margin: 0px;
		padding: 0px;
	}
	
	
	
	body
	{
		font-size: 14px;
		font-family: 'Open Sans', sans-serif;
		background: #F1F2ED;
		transition: background 0.8s;
		-webkit-transition: background 0.8s;
		-moz-transition: background 0.8s;
		-o-transition: background 0.8s;
		-ms-transition: background 0.8s;
	}
	
		body.dark
		{
			background: #3D3D3D;
		}
	
	
	
	a
	{
		text-decoration: none;
		color: #666;
		transition: color 0.4s,background-color 0.4s;
		-webkit-transition: color 0.4s,background-color 0.4s;
		-moz-transition: color 0.4s,background-color 0.4s;
		-o-transition: color 0.4s,background-color 0.4s;
		-ms-transition: color 0.4s,background-color 0.4s;
	}
	
		a:hover
		{
			color: #AAA;
		}
	
		a.button
		{
			padding: 7px 16px 7px 16px;
			color: #FFF;
			background: #84B818;
			-moz-border-radius: 20px;
			-webkit-border-radius: 20px;
			-khtml-border-radius: 20px;
			border-radius: 20px;
			behavior: url(border-radius.htc);
		}
	
			a.button:hover
			{
				background: #A4D838;
			}
	
		a.button.form
		{
			background: #530170;
		}
	
			a.button.form:hover
			{
				background: #732190;
			}
	
		a.button.grey
		{
			background: #999;
		}
	
			a.button.grey:hover
			{
				background: #AAA;
			}
	
		a.button.bottom
		{
			position: fixed;
			bottom: 20px;
			margin-left: -400px;
		}
	
	img
	{
		border-style: none;
	}
	
	input[type=text], input[type=password], select
	{
		padding: 6px;
		font-family: 'Open Sans', sans-serif;
		font-size: 14px;
		color: #777;
		background: #FFF;
		border: 1px solid #DDD;
	}
	
	
	div.loader
	{
		width: 32px;
		height: 32px;
		background: url('../images/loader.gif') no-repeat;
		overflow: hidden;
	}
	
		body.dark div.loader
		{
			background-image: url('../images/loader_dark.gif')
		}
	
	
	
	
	
	
	
	
	
	
	
	#head
	{
		background: #FFF;
	}
	
		#head img.logo
		{
			position: absolute;
			top: 34px;
			left: 50%;
			margin-left: -475px;
		}
	
		#head div.topmenu
		{
			z-index: 1500;
			position: absolute;
			left: 50%;
			width: 475px;
			text-align: right;
		}
	
			#head div.topmenu div.lang
			{
				float: right;
				padding-top: 6px;
				padding-left: 2px;
			}
	
				#head div.topmenu div.lang a
				{
					padding-left: 5px;
					font-size: 11px;
					color: #555;
				}
				
					#head div.topmenu div.lang a:hover
					{
						color: #555;
					}
	
					#head div.topmenu div.lang a.inactive
					{
						color: #BBB;
					}
	
						#head div.topmenu div.lang a.inactive:hover
						{
							color: #555;
						}
	
			#head div.topmenu div.back
			{
				display: none;
				padding-top: 6px;
				color: #CCC;
			}
		
				#head div.topmenu div.back a
				{
					font-size: 11px;
				}
	
		#head div.submenu
		{
			position: absolute;
			left: 50%;
			width: 491px;
			margin-top: 55px;
			text-align: right;
		}
	
			#head div.submenu a
			{
				padding: 4px 16px;
				font-size: 14px;
				text-transform: uppercase;
				-moz-border-radius: 20px;
				-webkit-border-radius: 20px;
				-khtml-border-radius: 20px;
				border-radius: 20px;
				behavior: url(border-radius.htc);
			}
	
				#head div.submenu a.active
				{
					color: #FFF;
					background: #84B818;
				}
	
		#head div.title
		{
			display: table;
			width: 100%;
			height: 300px;
			background: url('../images/header.png') #84B818 center center no-repeat;
			border-top: 100px solid #FFF;
			transition: background 0.5s;
			-webkit-transition: background 0.5s;
			-moz-transition: background 0.5s;
			-o-transition: background 0.5s;
			-ms-transition: background 0.5s;
		}
	
			#head div.title.error
			{
				background: url('../images/header_error.png') #B41918 center center no-repeat;
			}
	
			#head div.title div
			{
				
			}
	
			#head div.title h1
			{
				display: table-cell;
				padding-left: 10%;
				vertical-align: middle;
				font-size: 51px;
				font-weight: 200;
				letter-spacing: 2px;
				line-height: 50px;
				text-transform: uppercase;
				color: #FFF;
			}









	#pages
	{
		padding-top: 50px;
		padding-bottom: 40px;
	}
	
		#pages div.page
		{
			display: none;
			width: 950px;
			margin: auto;
			color: #777;
		}
	
		body.dark #pages div.page
		{
			color: #FFF;
		}
	
			#pages div.page div.loader
			{
				position: absolute;
				left: 50%;
				margin-left: -16px;
			}
	
			#pages div.page div.message
			{
				position: absolute;
				left: 50%;
				width: 800px;
				margin-left: -400px;
				text-align: center;
				text-transform: uppercase;
				letter-spacing: 2px;
				font-size: 50px;
				color: #B41918;
			}
	
				#pages div.page div.message.error
				{
					color: #B41918;
				}
	
				#pages div.page div.message.success
				{
					color: #84B818;
				}
	
			#pages div.page a.imagecontrol
			{
				float: right;
			}
	
			#pages div.page h2
			{
				padding-bottom: 40px;
				font-weight: 200;
				font-size: 26px;
				letter-spacing: 1px;
				color: #99C342;
			}
	
			#pages div.page h3
			{
				padding-bottom: 20px;
				font-weight: normal;
				font-size: 20px;
				letter-spacing: 1px;
			}
	
			#pages div.page h4
			{
				clear: both;
				float: left;
				width: 230px;
				font-weight: normal;
			}
	
			#pages div.page p
			{
				padding-bottom: 20px;
			}
	
			#pages div.page form
			{
				
			}
	
				#pages div.page form div.block
				{
					margin: 0px -40px;
					padding: 20px 40px;
				}
	
				#pages div.page form div.block.white
				{
					background-color: #FFF;
				}
	
				#pages div.page form div.submit
				{
					height: 60px;
					padding-top: 40px;
				}
	
					#pages div.page form div.submit a.button
					{
						float: left;
						margin-top: -15px;
						margin-right: 14px;
					}
	
						#pages div.page form div.submit a.button.restart
						{
							float: right;
							background-color: #AA0000;
						}
	
							#pages div.page form div.submit a.button.restart:hover
							{
								background-color: #CC0000;
							}
	
					#pages div.page form div.submit a.advanced
					{
						float: left;
						margin-top: -15px;
						padding: 8px 20px 26px 20px;
						font-size: 12px;
						color: #999;
					}
	
						#pages div.page form div.submit a.advanced:hover
						{
							color: #666;
						}
	
						#pages div.page form div.submit a.advanced.active
						{
							background: #E5E6DE;
						}
	
					#pages div.page form div.submit div.loader
					{
						margin-top: -22px;
					}
	
				#pages div.page form p
				{
					padding-left: 280px;
				}
	
					#pages div.page form p span.line
					{
						display: block;
						padding: 20px 0px;
					}
	
					#pages div.page form p span.value
					{
						padding-left: 3px;
						padding-right: 50px;
						color: #84B818;
					}
	
				#pages div.page form input
				{
					margin-right: 4px;
				}
				
				#pages div.page form input[type=text], #pages div.page form input[type=password]
				{
					width: 300px;
				}
				
					#pages div.page form input.large
					{
						width: 500px;
					}
				
					#pages div.page form input.small
					{
						width: 150px;
					}
				
					#pages div.page form input.xsmall
					{
						width: 60px;
					}
	
				#pages div.page form label
				{
					padding-right: 20px;
				}
		
		
		#pages #menu
		{
			display: none;
			position: absolute;
			left: 0px;
			width: 100%;
			height: 230px;
			margin-top: -28px;
			background: #E5E6DE;
		}
		
			#pages #menu ul
			{
				position: absolute;
				left: 50%;
				width: 950px;
				height: 200px;
				margin-top: 30px;
				margin-left: -475px;
				list-style-type: none;
			}
			
				#pages #menu ul li
				{
					float: left;
					padding-right: 20px;
					padding-bottom: 20px;
				}
			
					#pages #menu ul li a
					{
						display: table;
						width: 215px;
						height: 75px;
						font-size: 14px;
						line-height: 16px;
						background: #FFF 18px center no-repeat;
					}
			
						#pages #menu ul li.picture a
						{
							background-image: url('../images/icon-bild.png');
						}
			
						#pages #menu ul li.video a
						{
							background-image: url('../images/icon-video.png');
						}
			
						#pages #menu ul li.remote a
						{
							background-image: url('../images/icon-fernsteuerung.png');
						}
			
						#pages #menu ul li.user a
						{
							background-image: url('../images/icon-benutzer.png');
						}
			
						#pages #menu ul li.setup a
						{
							background-image: url('../images/icon-einstellungen.png');
						}
			
						#pages #menu ul li a span
						{
							display: table-cell;
							padding-left: 62px;
							vertical-align: middle;
							color: #3C3C3C;
						}
		
			#pages #menu div
			{
				clear: both;
				padding: 10px 20px;
				font-size: 11px;
				color: #777;
				background: #FFF;
			}
		
				#pages #menu div h5
				{
					font-size: 12px;
					font-weight: bold;
				}
		
				#pages #menu div p
				{
					padding: 0px;
				}




		#pages #page_picture
		{
			text-align: center;
			height: 620px;
		}
		
			#pages #page_picture div
			{
				position: absolute;
				left: 50%;
			}


		#pages #page_video
		{
			text-align: center;
			height: 620px;
		}
		
			#pages #page_video div
			{
				position: absolute;
				left: 50%;
			}



	#authentication
	{
		display: none;
		z-index: 1100;
		position: fixed;
		top: 0px;
		left: 0px;
		width: 100%;
		height: 100%;
		background-color: rgb(0,0,0);
		background-color: rgba(0,0,0,.85);
		background-color: transparent\9;
		filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#D9000000,endColorstr=#D9000000);
		zoom: 1;
	}
	
		#authentication div.box
		{
			position: absolute;
			top: 50%;
			left: 50%;
			width: 300px;
			margin-top: -100px;
			margin-left: -150px;
			background: #F1F2ED;
		}

		#authentication h2
		{
			padding: 20px;
			padding-bottom: 0px;
			font-size: 16px;
			font-weight: normal;
			color: #666;
		}

		#authentication p
		{
			padding: 20px;
			padding-bottom: 30px;
		}

			#authentication p.error
			{
				display: none;
				padding: 4px 20px;
				color: #EE0000;
			}

		#authentication div.loader
		{
			float: right;
			margin-top: -46px;
			margin-right: 20px;
		}

		#authentication i
		{
			display: block;
			padding-top: 10px;
			padding-bottom: 2px;
			font-size: 11px;
			color: #888;
		}

		#authentication input
		{
			width: 160px;
		}

		#authentication a
		{
			float: right;
		}







