@font-face {
	font-family: DINWeb;
	src: url("../fonts/DINWeb.eot");
}

@font-face {
	font-family: DINWeb;
	src: url("../fonts/DINWeb.woff") format("woff");
}


* {
	margin: 0;
	padding: 0;
}

body {
	background-color: #201909;
	color: #BAB49E;
	font-family: DINWeb, Arial, sans-serif;
	font-size: 13px;
}
a {
	text-decoration: none;
  color: white;
}

#wrapper {	
	zoom: 1.1; 
    -moz-transform: scale(1.1); 
    -moz-transform-origin: 0 0;
	position: absolute;
	width: 925px;
	height: 618px;
	margin: -339px 0 0 -510px;
	top: 50%;
	left: 50%;
	background-color: #595047;
	line-height: 17px;
}

#wrapper_OLD {
	position: absolute;
	width: 925px;
	height: 618px;
	margin: -309px 0 0 -413px;
	top: 50%;
	left: 50%;
	background-color: #595047;
	line-height: 17px;
}

body.black #wrapper {
	background-color: black;
}


body#home #wrapper {
	background: transparent url(../media/home.jpg) top left no-repeat;
	background-size: cover;
}

body#home h1 {
	text-indent: -10000px;
	width: 350px;
	height: 90px;
	cursor: pointer;
}

body#home a {
	color: #BAB49E;
}

body#home section {
	padding-top: 220px;
	padding-left: 40px;
}

body#home section strong {
	color: #B49961;
}

body#home section p {
	margin-top: 30px;
}

nav {
	position: absolute;
	top: 425px;
	left: 0;
	width: 100%;
	height: 165px;
	background-color: #201909;
	z-index: 2;
	overflow: visible;
}

nav ul {
	list-style: none;
	margin-top: 10px;
	margin-left: 40px;
}

nav ul ul {
	position: absolute;
	top: 0;
	left: 160px;
}

nav a {
	color: #8D8787;
}

nav a.active, nav a:hover, li.sub-open > a {
	color: white;
}

header img {
	position: absolute;
	top: 530px;
	left: 860px;
	z-index: 3;
}

section {
	position: absolute;
	top: 0;
	left: 0;
	width: 630px;
	height: 400px;	
	padding: 35px 100px 0 200px;
	overflow: auto;	
}

section strong {
  font-weight: normal;
  color: white;
}

section.nav {
	top: 435px;
	left: 200px;
	width: 475px;
	height: auto;
	padding: 0;
	overflow: visible;
	z-index: 2;
}

section#gallery {
	width: 890px;
	padding: 35px 0 0 35px;
}

#gallery img {
	width: 165px;
	height: 110px;
	border: 1px solid #BAB49E;
	cursor: pointer;
	display: block !important;
}

#gallery li {
	list-style: none;
	float: left;
	margin: 0 5px 5px 0;
}

#background-gallery img {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 0;
	display: none;
}

#background-gallery img.active {
	z-index:1;
	display: block;
}

#background-gallery div.detailthumb {
	z-index:100;
	width:200px;
	height:134px;
	position:absolute;
	top:291px;
	right:0;
	background: top left no-repeat;
	background-size: 200px 134px;
	display: none;
}

#background-gallery div.detailthumb.active {
	display: block;
}

#background-gallery div.next-img,
#background-gallery div.prev-img {
	position: absolute;
	top: 0;
	height: 425px;
	width: 400px;
	background: transparent url("../media/pfeil_li.png") 10px 180px no-repeat;
	z-index: 200;
	opacity: 0;
	background-size: 60px;
}

#background-gallery div.next-img {
	left: auto;
	right: 0;
	background-position: 330px 180px;
	background-image: url("../media/pfeil_re.png");
}

#background-gallery div.next-img:hover,
#background-gallery div.prev-img:hover {
	opacity: 1;
	cursor: pointer;
}

#background-gallery div.next-img.inactive,
#background-gallery div.prev-img.inactive {
	display: none;
}


section div.legend {
	position: absolute;
	top: 0;
	left: 0;
	display: none;
}

section div.legend.active {
	display: block;
}

section div.legend p {
  margin: 0;
}

section p {
	margin-bottom: 10px;
	
}
#paging {
	position: absolute;
	top: 437px;
	right: 5px;
	width: 180px;
	z-index: 2;
	color: #8D8787;
}

#paging:before {
	content: "Objekte";
}

#paging ul {
	position: absolute;
	top: 0;
	left: 60px;
}

#paging li {
	list-style: none;
	float: left;
	padding-right: 0;
	text-align: center;
	width: 22px;
}

#paging a {
	color: #8D8787;
}

#paging a.active {
	color: white;
}

#page-image {
	position: absolute;
	top: 35px;
	left: 35px;
}

#fancybox-overlay {
	background-color: black !important;
}

.mobile {
	position: absolute;
	top: -10000px;
	left: -10000Ppx
}

.detail {
	color: #8D8787;
}

.detail:hover {
	color: white;
}

/* Responsive */
@media (max-width: 999px) {

	#wrapper {
		position: relative;
		margin: 0;
		top: 0;
		left: 0;
	}
	
	body#home section {
		padding: 0;
	}
	
}

@media (max-width: 479px) {
	
	body#home {
		background-color: black;
		width: 100%;
		overflow-x: hidden;
	}
	
	body#home #wrapper {
		width: 100%;
	}
	
}