﻿html {
	overflow: scroll;
	height: 100%;
}

body, a, input, td {
	font-family: "Segoe UI", "Segoe", Tahoma, Helvetica, Arial, sans-serif;
	font-size: 15px;
	color: #000;
	margin: 0;
	padding: 0;
	height: 100%;
}

.ui-dialog * {
	font-size: 13px;
}

.inline {
	display: inline-block;
}

:-ms-input-placeholder {
	color: #ccc;
}

::-webkit-input-placeholder {
	color: #ccc;
}

:-moz-placeholder {
	color: #aaa;
}

::-moz-placeholder {
	color: #aaa;
}

form {
	height: 100%;
}

.background {
	background-repeat: no-repeat;
	background-size: 100% auto;
	background-color: #fff;
	position: fixed;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
}

.headerImg {
	background-repeat: no-repeat;
	background-size: 100% auto;
	background-color: rgba(140,140,69,1);
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
}


h1 {
	margin: 0 0 10px 0;
}

h3 {
	margin: 0 0 5px 0;
}

hr {
	height: 1px;
	background-color: #000;
	border: 0
}

input[type="checkbox"], input[type="radio"] {
	margin-right: 5px !important;
	height: 15px;
}

a {
	text-decoration: none;
}

	a.link, a.extLink {
		text-decoration: underline;
	}

	a.internalLink {
		-ms-background-repeat: no-repeat;
		background-repeat: no-repeat;
		text-decoration: none;
		background-image: url("/Images/arrow_right.gif");
		-ms-background-position: 0 5px;
		background-position: 0 5px;
		padding-left: 15px;
	}

.hidden {
	display: none !important;
}

.btn {
	padding: 5px 10px 5px 10px !important;
	background-color: #b0b0b0 !important;
}

div.message {
	position: fixed;
	top: 0;
	width: 100%;
	font-size: 15px;
	font-weight: bold;
	margin: auto;
	padding: 10px;
	display: none;
	text-align: center;
}

	div.message.error {
		color: #fff;
		background-color: red;
		display: block;
	}

	div.message.success {
		color: #fff;
		background-color: green;
		display: block;
	}

div.login .message {
	color: red;
}

#pageArea {
	width: 100%;
	min-height: 80%;
	position: relative;
	padding-bottom: 50px;
	margin-bottom: 20px;
	text-align: center;
}

#topArea {
	position: relative;
	text-align: center;
	background-color: rgba(106, 106, 52, 1);
}

#headline {
	position: relative;
	width: 1024px;
	display: inline-block;
	text-align: left;
	margin: 60px 0 10px 0;
}

	#headline a.home {
		margin-left: 150px;
		display: block;
	}

	#headline img {
		position: absolute;
		width: 120px;
		height: 120px;
		top: -50px;
		left: 0px;
		z-index: 10000;
	}

#breadcrumbs {
	position: relative;
	background-color: rgba(180, 178, 137, 1);
	padding: 6px 0 6px 30px;
	font-size: 11px;
}

	#breadcrumbs span {
		color: #000;
		width: 1024px;
		display: inline-block;
		text-align: left;
	}

#headline a {
	font-size: 36px;
	font-weight: 600;
	text-decoration: none;
	margin-top: 0;
}

#topArea div.loginInfo {
	position: absolute;
	float: right;
	text-align: right;
	right: 10px;
	top: 10px;
}

	#topArea div.loginInfo a {
		text-decoration: none;
	}

/*#topArea div.loginInfo { top: 0;width: 0;display: none;}*/
#middleArea {
	height: auto;
	width: 100%;
	display: inline-block;
	background: rgba(255, 255, 255, 0.8);
	text-align: center;
	min-height: 450px;
}

	#middleArea .container {
		width: 1024px;
		display: inline-block;
		text-align: left;
		height: 100%;
		margin-top: 40px;
	}

#bottomArea {
	float: none;
	display: inline-block;
	width: 100%;
	height: 35px;
	vertical-align: bottom;
}

div.article {
	margin-bottom: 40px;
}

	div.article div.images {
		display: block;
		margin-bottom: 10px;
		max-width: 1024px;
	}

		div.article div.images.left {
			margin-right: 10px;
		}

			div.article div.images.left.flow {
				float: left;
				display: inline;
			}

		div.article div.images.center {
			margin: 0 auto 10px;
		}

		div.article div.images.right {
			float: right;
			margin-left: 10px;
		}

			div.article div.images.right.flow {
			}

		div.article div.images div.img {
			margin: 0;
			position: absolute;
		}

			div.article div.images div.img img {
				margin-bottom: -3px;
				max-width: 1024px;
			}

			div.article div.images div.img .label {
				padding: 5px;
				display: block;
				min-height: 18px;
			}

#middleLeftArea div.images div.img, #middleLeftArea div.images div.img img {
	max-width: 200px;
}

div.article div.images.galery {
}

	div.article div.images.galery > div {
		position: absolute;
	}

	div.article div.images.galery div.img {
		border: 1px solid #fff;
	}

		div.article div.images.galery div.img img {
			max-width: 1024px;
		}

div.article div.images.kacheln {
	display: inline;
}

	div.article div.images.kacheln div.img {
		position: static;
		float: left;
		margin-right: 20px;
		margin-bottom: 20px;
	}

div.article h2 {
	margin: 0 0 5px 0;
	font-weight: normal;
}

div.article p {
	margin: 0;
}

div.article a.detailsExpander {
	float: right;
	background-repeat: no-repeat;
	text-decoration: none;
	background-image: url("/Images/arrow_down.gif");
	background-position: 80px 6px;
	padding-right: 20px;
}

	div.article a.detailsExpander.expanded {
		background-image: url("/Images/arrow_up.gif");
	}

p.clear {
	clear: both;
	height: 0;
}

div.login {
	padding: 20px;
	width: 600px;
}

	div.login label {
		width: 165px;
		display: inline-block;
	}

	div.login input[type="text"], div.login input[type="password"] {
		width: 300px;
		padding: 5px
	}

	div.login p.buttons {
		padding-left: 200px;
	}

	div.login .btn {
		margin-left: 10px;
	}

/* Loading-Animation */
#loading {
	background-color: #000;
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	text-align: center;
	vertical-align: middle;
	z-index: 9999;
	filter: alpha(opacity=50); /* IE */
	-moz-opacity: 0.50; /* Mozilla */
	opacity: 0.50; /* Opera */
	display: none;
}

	#loading .spinner {
		width: 50%;
		margin-left: 50%;
		margin-top: 25%;
	}

/* Tables */
table {
	width: 100%;
	/*max-width:1600px;*/
	border-spacing: 0px;
	border: 0;
	border-collapse: collapse;
}

	table.headlined tr:first-child td {
		background-color: #a0a0a0;
		color: white;
		/*text-align: center;   */
	}

	table td {
		padding: 5px;
		vertical-align: top;
	}

	table.bordered td {
		padding: 5px;
		border: 1px solid #bbb;
		vertical-align: top;
	}

.grip {
	width: 20px;
	height: 15px;
	margin-top: -3px;
	background-image: url('/Images/ColResizable/grip.png');
	margin-left: -5px;
	position: relative;
	z-index: 88;
	cursor: e-resize;
	background-repeat: no-repeat;
}

	.grip:hover {
		background-position-x: -20px;
	}

.dragging .grip {
	background-position-x: -40px;
}

.JCLRLastGrip .grip {
	background-position-y: -18px;
	left: -2px;
}

#postback {
	margin-bottom: 10px;
}

/* END Tables */

/* GBook*/
div.gbookItem {
	margin-bottom: 20px;
}

a.newGbookItem {
	font-size: 15px;
	padding: 5px;
}

.currPage {
	font-weight: bold;
}

/* COLORS */
body, input, td {
	color: #000;
}
/*#pageArea {	background: rgba(255, 255, 255, 0.85); }*/
#topArea, #topArea a.home, #topArea a.link {
	color: #fff;
}

	#topArea a.home, #topArea a.link {
		text-shadow: 0 4px 10px #000;
	}

	#topArea, #topArea .loginInfo li a {
		color: #000;
	}

div.article div.img .label {
	color: #fff;
	background-color: #b0b0b0;
}

div.login input[type="text"], div.login input[type="password"] {
	border: 1px solid #b0b0b0;
}

._vdError, ._vdBackendError, ._vdError input {
	background-color: #fbcdaf;
}

div.editDialog input, div.editDialog textarea {
	border: 1px dashed #a0a0a0;
}

div.editDialog .tableBackground1 {
	background-color: #f0f0f0;
	padding: 5px;
	display: block;
	width: 98%;
}

div.editDialog table {
	margin: 0px;
}

	div.editDialog table input {
		/*background*/
	}

	div.editDialog table.headlined tr:first-child input {
		background-color: #f0f0f0;
		color: #000;
	}

	div.editDialog table.bordered td {
		border-color: #000;
	}

.disabled, .aspNetDisabled {
	color: #b0b0b0 !important;
	cursor: default !important;
}

a.newGbookItem {
	background: #fff;
}

a.newGbookItem {
}

span.answer {
	font-weight: bold;
}

@media screen and (max-width: 1024px) {
	body, a, input, td {
		font-size: 16px;
	}

	#burger div {
		width: 26px;
		height: 3px;
		background-color: white;
		margin: 7px;
		transition: 0.4s;
	}

	#burger.active div:nth-child(1) {
		-webkit-transform: rotate(-45deg) translate(-7px, 7px);
		transform: rotate(-45deg) translate(-7px, 7px);
	}

	#burger.active div:nth-child(2) {
		opacity: 0;
	}

	#burger.active div:nth-child(3) {
		-webkit-transform: rotate(45deg) translate(-7px, -7px);
		transform: rotate(45deg) translate(-7px, -7px);
	}

	/*
	table, caption, colgroup, col, thead, tbody, tfoot, tr, th, td {
		display: block
	}
		*/

	/* TABELLEN */
	div.article {
		overflow: auto;
	}

	td {
		background-color: #fff;
		width: 1% !important;
	}

	#headline {
		margin: 20px 0 10px 0;
		width: 95%;
	}

	.headerImg {
		display: none;
	}


	#breadcrumbs span {
		width: 100%;
	}

	#headline a {
		font-size: 32px;
	}


	#topArea div.loginInfo {
		display: none;
	}

	#topArea {
		/*background-color: rgb(105, 162, 240);*/
		background-color: rgba(140, 140, 69, 1);
		/*background-image: linear-gradient(rgb(105, 162, 240), #fff)*/
	}

	#headline a span {
		display: block;
	}

	#middleArea .container {
		width: 95%;
	}

	.background {
		background-image: none !important;
		/*background-image: linear-gradient(rgb(105, 162, 240), #fff)*/;
	}

	div.images {
		width: 95% !important;
		/*background-color: red;*/
	}

	div.img {
		width: 95% !important;
		/*background-color: blue;*/
	}

	div.images img {
		width: 100% !important;
		/*background-color: green;*/
	}

	div.images.galery > div {
		width: 95%;
	}

	div.article div.images.right {
		float: none;
		margin-left: 0;
	}

	div.article a.detailsExpander {
		background-position: 82px 9px;
	}
}
