@charset "utf-8";
/* CSS Document */

@font-face {
	font-family: 'open_sanslight';
	src: url('../font/OpenSans-Light-webfont.eot');
	src: url('../font/OpenSans-Light-webfont.eot?#iefix') format('embedded-opentype'),  
		url('../font/OpenSans-Light-webfont.woff') format('woff'),  
		url('../font/OpenSans-Light-webfont.ttf') format('truetype'),  
		url('../font/OpenSans-Light-webfont.svg#open_sanslight') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'open_sanssemibold';
	src: url('../font/OpenSans-Semibold-webfont.eot');
	src: url('../font/OpenSans-Semibold-webfont.eot?#iefix') format('embedded-opentype'),  
		url('../font/OpenSans-Semibold-webfont.woff') format('woff'),  
		url('../font/OpenSans-Semibold-webfont.ttf') format('truetype'),  
		url('../font/OpenSans-Semibold-webfont.svg#open_sanssemibold') format('svg');
	font-weight: normal;
	font-style: normal;
}
*{
	margin: 0px;
	padding: 0px;
}
body{
	font-family: 'open_sanslight', sans-serif;
	background: url(../img/bg-sketch.jpg) bottom right fixed no-repeat;
}
h1, h2, h3, h4, h5, h6{
	font-weight: normal;
	line-height: 110%;
	color: #970000;
}
h1{
	font-size: 40px;
	margin-bottom: 25px;
}
h2{
	font-size:35px;
	margin-bottom: 15px;
}
h3{
	font-size: 27px;
	margin-bottom: 10px;
}
h4{
	font-size: 24px;
	margin-bottom: 5px;
}
h5{
	font-size: 20px;
}
h6{
	font-size: 16px;
}
p, table, td, tr, span, ul, ol, li, div{
	color: #555555;
	font-size: 16px;
	line-height: 27px;
}
ul, ol{
}
a:link, a:visited{
	text-decoration: none;
	color: #970000;
}
a:active, a:hover{
	color: #111111;
}
input, textarea, select{
	border: 1px solid #DDDDDD;
	padding: 3px;
	font-size: 15px;
	color: #666666;
}
input:hover, textarea:hover, select:hover{
	border: 1px solid #666666;
}
hr{
	height: 1px;
	border: none;
	color: #DDDDDD;
	background-color: #DDDDDD;
}
b, strong{
	font-family: 'open_sanssemibold',sans-serif;
	font-weight: normal;
}
.wrapper{
	width: 100%;
	max-width: 1000px;
	margin-left: auto;
	margin-right: auto;
}
.wrapper_nav{
	width: 96%;
	margin-left: 2%;
	margin-right:2%;
}
#lang{
	background: url(../img/bg_lang-neu.jpg) bottom repeat-x #680404;
	padding-bottom: 30px;
}
ul#lang_nav{
	list-style: none;
	text-align: right;
	padding-top: 20px;
	position: relative;
	z-index: 999;
}
ul#lang_nav li{
	display: inline-block;
	background: url(../img/lang_button-neu.png)center no-repeat;
	height: 40px;
	width: 40px;
	text-align: center;
	line-height: 40px;
}
ul#lang_nav li a{
	color: #FFFFFF;
}
#header{
	margin-bottom: 65px;
	padding-bottom: 15px;
}
#logo-responsive{
	float: left;
	font-size: 25px;
	line-height: 85px;
	color: #FFFFFF;
	position: relative;
	z-index: 1100;
}
#logo-responsive img{
	max-width: 85px;
	vertical-align: middle;
	margin-right: 10px;
}
#logo-responsive a{
	color: #FFF;
}
.logo{
	width: 100%;
}
#logo-name {
    font-size: 35px;
    color: #ededed;
    text-shadow: 3px 2px 5px #000;
	width: 98%;
	position: absolute;
	margin-top: 25px;
}
#content{}
.content_wrapper{
	margin-top: 40px;
}
#footer{
	background: url(../img/bg_bottom.jpg) top center repeat-x #686868;
	margin-top: 100px;
	padding-bottom: 50px;
	padding-top: 50px;
}
#footer p, #footer a{
	color: #DDDDDD;
}
#footer-icon{
	float: left;
	position: absolute;
	max-width: 270px;
	margin-top: -11px;
}
#footer-icon img{
	width: 100%;
}

/*Startseite*/
.layer-layout{
	position: relative;
	/*min-height: 550px;*/
}
.layer-layout h3{
	margin-bottom: 5px;
}
.layer-1, .layer-2, .layer-3{
	position: relative;
	float: left;
	background: #FFFFFF;
	text-align: center;
}
.layer-1 img, .layer-2 img, .layer-3 img{
	opacity: 0.7;
}
.layer-1:hover img, .layer-2:hover img, .layer-3:hover img{
	opacity: 1;
}
.layer-1{
	z-index: 1;
}
.layer-2{
	z-index: 5;
}
.layer-3{
	z-index: 10;
}
.position-1{
	margin-left: 10px;
	margin-top: 30px;
}
.position-2{
    margin-left: -60px;
    margin-top: 90px;
}
.position-3{
    margin-left: 590px;
    margin-top: -225px;
}
.position-4{
    margin-left: -340px;
	margin-top: 320px;
}
.position-5 {
    margin-top: -260px;
    margin-left: 50px;
}
.position-6 {
    margin-top: -660px;
    margin-left: 550px;
}
.box{
	padding: 2px;
}
.box:hover{
	z-index: 9999;
	opacity: 1 !important;
}
.box img{
	width: 100%;
	max-width: 400px;
}
.box.layer-1 img{
	max-width: 350px;
}
.box.layer-2 img{
	max-width: 300px;
}
/*Startseite Ende*/

.plan{
	width: 100%;
	max-width: 400px;
}
table.daten{
	width: 100%;
}
table.daten td{
	padding: 5px;
}
table.daten tr.grau td{
	background: #efefef;
}
ul.ref_list{
	list-style: none;
	text-align: center;
	margin-top: 20px;
	padding-top: 20px;
	border-top: 2px dotted #ddd;
}
ul.ref_list li{
	display: inline-block;
	width: 30%;
	margin: 5px;
}
ul.ref_list li:hover{
	opacity: 0.8;
}
ul.ref_list li img{
	width: 100%;
	border: 3px solid #FFF;
	box-shadow: 0 0 6px 1px #CCCCCC;
}
ul.list_complete{
	text-align: center;
	list-style: none;
}
ul.list_complete li{
	display: inline-block;
	width: 25%;
	margin: 25px;
}
ul.list_complete li h3{
	border-bottom: 3px dotted #DDD;
	padding-bottom: 10px;
	margin-bottom: 10px;
}
ul.list_complete li .img_wrap{
	overflow: hidden;
}
ul.list_complete li img{
	width: 100%;
	transform: scale(1.1);
}
ul.list_complete li:hover img{
	-webkit-transform: scale(1.5);
    -moz-transform: scale(1.5);
    -ms-transform: scale(1.5);
    -o-transform: scale(1.5);
    transform: scale(1.5);
    -webkit-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s;
}
.ref_pic {
    width: 100%;
    max-width: 550px;
    margin-bottom: 15px;
}
label.control-label {
    display: inline-block;
    width: 25%;
	vertical-align: top;
}
input.form-control {
	display: inline-block;
    margin-bottom: 10px;
    width: 65%;
}
textarea.form-control {
    width: 65%;
}
button.btn {
    background: #970000 none repeat scroll 0 0;
    border: medium none;
    border-radius: 3px;
    color: #fff;
    font-size: 16px;
    margin-top: 15px;
    padding: 15px 0;
    width: 93%;
}
button.btn:hover{
	background: #444444;
	cursor: pointer;
}
.textbox {
    border-bottom: 2px dotted #ddd;
    margin-bottom: 40px;
	padding-bottom: 20px;
}
.box-bild {
    float: left;
    max-width: 350px;
    width: 30%;
}
.block-text {
    float: right;
    width: 65%;
}
.left{
	float: left;
	width: 48%;
}
.right{
	float: right;
	width: 48%;
}
.left p, .right p{
	text-align: justify;
}
.center{
	text-align: center;
}
.text-center{
	text-align: center;
}
.text-left{
	text-align: left;
}
.text-right{
	text-align: right;
}
.text-justify{
	text-align: justify;
}
.title{
	margin-bottom: 25px;
	padding-bottom: 15px;
	border-bottom: 2px dotted #DDDDDD;
}
.clear{
	clear: both;
}

@media(max-width:1456px){
}
@media(max-width:1656px){
}
@media(max-width:1256px){
	.position-1, .position-2, .position-3, .position-4, .position-5, .position-6{
		transform: rotate(0deg);
		margin: 10px;
	}
	.box.layer-1 img, .box.layer-2 img, .box.layer-3 img{
		max-width: 600px;
	}
	.box{
		padding: 5px;
		width: 30%;
	}
}
@media(max-width:1056px){
	#logo-name{
		position: relative;
		margin-top: 0px;
		padding-top: 15px;
	}
	.wrapper{
		width: 96%;
		margin-left: 2%;
		margin-right: 2%;
	}
}
@media(max-width:956px){
	.box{
		width: 42%;
	}
}
@media(max-width:756px){
	.wrapper_nav{
		width: 100%;
		margin: 0px;
	}
	.box.layer-1 img, .box.layer-2 img, .box.layer-3 img{
	}
	.left, .right{
		width: 100%;
		float: none;
	}
	.left{
		margin-bottom: 15px;
	}
	
}
@media(max-width:656px){
	.box.layer-1 img, .box.layer-2 img, .box.layer-3 img{
	}
	ul.list_complete li{
		width: 40%;
		margin: 10px;
	}
}
@media(max-width:556px){
	.box.layer-1 img, .box.layer-2 img, .box.layer-3 img{
		width: 100%;
	}
	#logo-responsive{
		float: none;
		width: 100%;
		text-align: center;
	}
	#logo-responsive img{
		max-width: 50px;
		margin-right: 5px;
		font-size: 22px;
	}
	#lang{
		padding-bottom: 20px;
	}
	ul#lang_nav{
		padding-top: 0px;
		text-align: center;
		margin-top: -20px;
	}
	#logo-name{
		position: relative;
		margin-top: 0px;
		padding-top: 15px;
		font-size: 25px;
	}
	#header{
		margin-bottom: 5px;
	}
	ul.list_complete li{
		display: block;
		width: 100%;
		margin: 10px 0px;
	}
}

@media(max-width:456px){
	.box.layer-1 img, .box.layer-2 img, .box.layer-3 img{
		width: 100%;
	}
	.box-bild {
		float: none;
		max-width: 500px;
		width: 80%;
		margin-bottom: 20px;
	}
	.block-text {
		float: none;
		width: 80%;
	}
	#logo-responsive{
		font-size: 20px;
	}
	.box{
		width: 85%;
	}
	
}