
#pixelinfo {
	position: 			fixed;
	margin-top: 		20px;
	margin-left: 		20px;
	background-color: 	#00ff00;
	padding-left:           20px;
      padding-right:          20px;
	z-index:                100;
      opacity: 			0.8;
	display:                none;
}

.content {
	max-width:			1280px;
	margin:			0 auto;
}

.fakten {
	background-color:		#efefef;
	padding:			16px;
}

html, body {
	height: 			100%;
}

body {
	font-family:            Verdana, Arial;
	font-size:              11pt;
	line-height:		14pt;
	background-attachment:	fixed;
	margin:                 0;
	color:                  #787878;
	background-color:       #ffffff;
}

h1, p.titel {
	margin-top:             20px;
	margin-bottom:          20px;
      color:			#0e3771;
      font-family: 		'Roboto', sans-serif;
      font-weight:            light;
}

h2, h3, h4 {
      color:			#0e3771;
      font-family: 		'Roboto Condensed', sans-serif;
	font-weight:            normal;
}

h1, p.titel {
	font-size:              20pt;
	line-height:            22pt;
}

h2 {
	margin-top:             10px;
	font-size:              16pt;
	line-height:		20pt;
      color:                  #787878;
}

h3, h4 {
	font-size:              14pt;
	line-height:		18pt;
      color:                  #787878;
}

h3.zitat {
	text-align:			center;
	line-height:		18pt;
	color:			#0e3771;
	font-style: 		italic;
	margin:			48px;
	width:			80%
}

h4 {
	font-size:              12pt;
}

a, a:visited {
	color:                  #0e3771;
	text-decoration:        none;
}

a.thumbnaila {
	border:			none;	
}

a.button {
      font-family: 		'Roboto Condensed', sans-serif;
	height:           	20px;
	padding:          	5px;
	padding-left:     	8px;
	padding-right:  		8px;
	margin-right:     	8px;
	font-size:        	11pt;
	box-shadow: 		3px 3px 4px rgba(0, 0, 0, 0.2);
	margin-top:      		5px;
      text-decoration:        none;
	background-color: 	#0e3771;
	color:            	#ffffff;
	border:			none;
}

a.button:hover {
	background-color: 	#ffffff;
	color:            	#0e3771;
}

p {
	line-height:            15pt;
	margin:			0px;
	margin-bottom:          10px;
}



.thumbnails img {
	max-width:              200px;
	float:			left;
	margin:			24px;
}



figcaption {
	display:			none;
}

p a {
	border-bottom:		1px dotted;	
}

li {
	list-style-type:		square;
	margin-bottom:		8px;
}

table th {
	text-align:             left;
}

#content {
	margin: 			0px auto;
	width: 			95%;
	background-color:       #ffffff;
	width:                  95%;
	margin-top:             20px;
	margin-bottom:          40px;
	position:               relative;
}

#header {
	background-color:       #ffffff;
	background-image:       url('/media/Wir_bauen_Ihr_Haus_380x120.jpg');
      background-repeat:	no-repeat;
	background-position:	left;
      height: 			120px;
	width:                  100%;
	text-align:             right;
	position: 			relative;
      margin-top:             20px;
	a-box-shadow: 		0px 5px 20px rgba(0, 0, 0, 0.2);
}

#header img {
	margin:                 20px;
}

#logo {
	width:                  auto;
	position:               relative;
	right:            	30px;
	top:                    10px;
	float:                  right;
}

#logo img {
      width:			100%;
}

#imagebar {
      height: 			44px;
      max-width:              1280px;
}

#imagebar_content {
      width: 			90%;
}

#breadcrumbs {
	font-size:              8pt;
	margin-top:             10px;
	margin-bottom:          5px;
}

#breadcrumbs a {
      color:			#0e3771;
	text-decoration:        none;
}

#mitte {
      background-color: 	#ffffff;
	margin: 			0px auto;
	margin-top:             24px;
}

#inhalt {
	width:                  95%;
}

#mitte img {
	width:			100%;
}

.thumbnailc {
	margin-left: 		10px;
	margin-bottom:          10px;
}

.thumbnailb {
	margin-left: 		10px;
	margin-bottom:          10px;
}

.menubox {
      background-color:		#0e3771;
	background-color:       #efefef;
	height:                 auto;
      float:                  left;
}

.menubox a {
	color: 			#ffffff;
	text-decoration: 		none;
}

.menubox h2, .menubox h3, .menubox h4, .menubox p {
      color:                  white;
	margin:                 5px 10px 10px;
}

.menuicon {
	width:                  100px;
      height:                 100px;
      background-color:		rgba(255, 255, 255, 0.3);
	border:                 1px solid #ffffff;
	float:                  left;
	margin-left:           	5px;
	margin-bottom:          5px;
}

#advantages {
	background-color:       #e1e2e3;
      position: 			relative;
	top: 				0px;
	padding:                20px;
}

#copyright {
	background-color:       #ffffff;
}

#copyright_content {
	padding:                20px;
}

#footer {
	background-color:       #0e3771;
	position:			relative;
	bottom: 			0;
	width: 			100%;
}

#footer, #footer p, #footer a, #footer a:visited {
	color:                  #cdd1db;
	text-decoration:        none;
	border:			none;
}

.masc {
	margin-top:             20px;
	position:			relative;
	height:			250px;
	overflow: 			hidden;
}

.baukonzept-masc {
	position:			relative;
	height:			331px;
	width:                  843px;
	awidth:                  100%;
	margin:			0 auto;
}

.masc .slideshow {
	position:			absolute;
	top: 				0;
	left: 			0;
	width: 			2560px;
	height:			250px;

	background-position:	100px 50%;

	-webkit-animation: infinite-image 60s linear infinite;
	-moz-animation: infinite-image 60s linear infinite;
	-o-animation: infinite-image 60s linear infinite;
	animation: infinite-image 60s linear infinite;

      transition:			height 1s;
	-webkit-transition:	height 1s; /* Safari */

	overflow: 			hidden;
}

.masc .baukonzept {
	position:			relative;
	top: 				0;
	left: 			0;
	height:			331px;
	background-position:	100px 50%;
}

.a-masc:hover, .a-masc .slideshow:hover, .a-masc:hover a-.slideshow {
      height:			300px;
}

.masc:hover .titel_teaser {
	margin-top:    		200px;
}

@-webkit-keyframes infinite-image {
	0% { left:0;}
	100% { left: -1280px; }
}

@-webkit-keyframes infinite-band {
	0% { left:100%;}
	50% { -webkit-transform: scale(1.5);}
	100% { left: -100%;}
}

@-moz-keyframes infinite-image {
	0% { left:0;}
	100% { left: -1280px; }
}

@-o-keyframes infinite-image {
	0% { left:0;}
	100% { left: -1280px; }
}

@keyframes infinite-image {
	0% { left:0;}
	100% { left: -1280px; }
}




/*  COLUMN SETUP  */
.col {
	display: block;
	float:left;
	margin: 1% 0 1% 3%;
}
.col:first-child { margin-left: 0; }

/*  GROUPING  */
.group:before,
.group:after { content:""; display:table; }
.group:after { clear:both;}
.group { zoom:1; /* For IE 6/7 */ }

/*  GRID OF TWO  */
.span_2_of_2 {
	width: 100%;
}
.span_1_of_2 {
	width: 48.5%;
}

/*  GO FULL WIDTH AT LESS THAN 480 PIXELS */

@media only screen and (max-width: 680px) {
	.col {
		margin: 1% 0 1% 0%;
	}
}

@media only screen and (max-width: 680px) {
	.span_2_of_2, .span_1_of_2 { width: 100%; }
}




#nav {
	max-width:              1280px;
	font-family: 		'Roboto Condensed', sans-serif;
	background-color: 	#ffffff;
	border-top: 		1px solid #cccccc;
	border-bottom: 		1px solid #cccccc;
}

#nav, #nav li, #nav li li {
      z-index:                100;
}

#nav > a {
	display: 			none;
}

#nav li {
	position: 			relative;
}

#nav li a {
	color: 			#fff;
	display: 			block;
}

#nav li a:active {
	background-color: 	#c00 !important;
}

#nav li a.highlighted {
	background-color:       #cccccc;
}

#nav span:after {
	width: 			0;
	height: 			0;
	border: 			0.313em solid transparent; /* 5 */
	border-bottom: 		none;
	border-top-color: 	#3a5c8b;
	content: 			'';
	vertical-align: 		middle;
	display: 			inline-block;
	position: 			relative;
	right: 			-0.313em; /* 5 */
}

/* first level */

#nav > ul {
	height: 			34px;
	background-color: 	#ffffff;
}

#nav > ul > li {
	float: 			left;
}

#nav > ul > li > ul > li {
	width:			200px;
	text-align: 		left;
      float: 			left;
}

#nav > ul > li > a {
	height: 			100%;
	font-size:              12pt;
	line-height: 		1.5em; /* 60 (24) */
	text-align: 		center;
}

#nav > ul > li:not( :last-child ) > a {
//	border-right: 1px solid #e01629;
}

#nav > ul > li:hover > a, #nav > ul:not( :hover ) > li.active > a {
	background-color: 	#e01629;
	color:                  #efefef;
}


/* second level */

#nav li ul {
	background-color: 	#e01629;
	display: 			none;
	position: 			absolute;
	top: 				100%;
}

#nav li:hover ul {
	display: 			block;
	left: 			0;
	right: 			0;
}

#nav li:not( :first-child ):hover ul {
	left: 			-1px;
}

#nav li ul a {
	font-size: 			1.25em; /* 20 */
	font-size:              11pt;
	border-top: 		1px solid #3a5c8b;
	padding: 			0.75em; /* 15 (20) */
}

#nav li ul li a:hover,
#nav li ul:not( :hover ) li.active a {
	background-color: 	#e01629;
}

@media only screen and (min-width: 800px) {

	.bildimtext {
		float:		right;
		margin-left:	24px;
		margin-bottom: 	8px;
	}

}

@media only screen and (max-width: 800px) {

	.bildimtext {
		display:		block;
		margin-left:	auto;
		margin-right: 	auto;
		margin-bottom: 	8px;
	}

}

@media only screen and (max-width: 45em) /* 1000 */
{
	#header {
		background-image:       none;
	}

	#nav {
		width: 			100%;
		position: 			static;
		margin: 			0;
	}

	html {
		font-size: 			75%; /* 12 */
	}

	#nav {
		position: 		relative;
		top: 			auto;
		left: 		auto;
	}

	#nav > a {
		width:		3.125em; /* 50 */
		height: 		3.125em; /* 50 */
		text-align: 	left;
		text-indent: 	-9999px;
		background-color: #e01629;
		position: 		relative;
	}

	#nav > a:before, #nav > a:after {
		position: 		absolute;
		border: 		2px solid #fff;
		top: 			35%;
		left: 		25%;
		right: 		25%;
		content: 		'';
	}

	#nav > a:after {
		top: 			60%;
	}

	#nav:not( :target ) > a:first-of-type, #nav:target > a:last-of-type {
		display: 		block;
	}


	/* first level */

	#nav > ul {
		height:		auto;
		display:		none;
		position: 		absolute;
		left: 		0;
		right: 		0;
	}

	#nav:target > ul {
		display: 		block;
	}

	#nav > ul > li {
		width: 		100%;
		float: 		none;
	}

	#nav > ul > li > a {
		height: 		auto;
		text-align: 	left;
		padding: 		0 0.833em; /* 20 (24) */
	}

	#nav > ul > li > ul > li {
            float: 		none;
	}

	#nav > ul > li:not( :last-child ) > a {
		border-right: 	none;
		border-bottom: 	1px solid #e01629;
	}


	/* second level */

	#nav li ul {
		position: 		static;
		padding: 		1.25em; /* 20 */
		padding-top: 	0;
		background-color: #efefef;
	}
}

#nav ul li {
	list-style-type: none;
}


#nav:-before {
	line-height:	0.1;
	font-size:		1px;
	margin:		0;
	height:		9px;
	display:		block;
	border-bottom:	1px solid #333333;
	content:		url('/media/key-point_tl.gif');
}

#nav:-after {
	display:		block;
	padding-top:	0;
	line-height:	0.1;
	font-size:		1px;
	margin:		0 0 0 0;
	height:		8px;
	background:		#dddddd scroll no-repeat bottom right;
	border-top:		1px solid 999999;
}

#nav, #nav ul {
	margin:		0;
	padding:		0;
	list-style:		none;
}

#nav li {
	display:		inline;
	padding:		0;
	margin:		0;
}

#nav li a {
	display:		block;
	padding:		5px 10px;
	text-decoration:	none;
	border-right:	1px solid #cccccc;
	font-size:		11px;
	color:            #0e3771;
}

#nav li li a {
      border-right:	none;
}

#nav li li a {
	padding:		6px 8px 6px 20px;
      background-image: none;
      box-shadow: 	5px 5px 5px rgba(0, 0, 0, 0.3);
}

#nav li a:hover {
	color:            	#ffffff;
}





nav li:hover a {
	color:       		#ffffff;
}

nav li a {
	color:                  #5e5e5d;
}

nav li a:hover {
	color:                  #ffffff;
}

nav ul li ul li {
	background-color:		#efefef;
}

nav li ul li a:hover {
      background-color:       #e12132;
	color:                  #efefef;
}




.my-gallery {
      width: 100%;
      float: left;
}

.my-gallery img {
      width: 100%;
      height: auto;
}

.my-gallery figure {
      a-display: block;
      float: left;
      a-margin: 0 5px 5px 0;
      width: 40%;
}

.my-gallery figcaption {
      display: none;
}


#cookiemessage {
	border-top: 1px solid #fff;
	background: rgba(51, 51, 51, 0.8);	
	color: #fff;
	position:fixed;
	bottom: 0px; 
	z-index: 10000; 
	width: 100%; 
	font-size: 11pt; 
	line-height: 12pt;
}

#cookiemessage  table {
	padding: 20px;
}

#cookiemessage input {
	background-color: #ffff00;
	padding: 10px 30px 10px 30px;
	color: #333;
	border: none;
	font-size: 11pt;
	cursor:pointer;
	margin-left: 20px;
	margin-right: 20px;
}

#cookiemessage a {
	color: #fff;
	text-decoration: underline;
}

#cookiemessageCloser {
	color: #777;
	font: 14px/100% arial, sans-serif;
	position: absolute;
	right: 5px;
	text-decoration: none;
	text-shadow: 0 1px 0 #fff;
	top: 5px;
	cursor:pointer;
	border: 1px solid #fff;
	padding: 5px;
	background: #ced6df; /* Old browsers */

}

#cookiemessageCloser:hover {
	border-bottom: 1px solid white;
	border-right: 1px solid white;
	border-top: 1px solid #7b92a9;
	border-left: 1px solid #7b92a9;
}
