/*Allgemeine Formatierungen*/

*, *:before, *:after {
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		box-sizing: border-box; }

html,body {
		height: 100%;
		background-color: #ecf2f6; }

body,td,p {
		font-family: 'Bauhaus';
		font-size: 16px;
		color: #000000;
		line-height: 22px; }
								
@font-face {
		font-family: 'Bauhaus';
		src: url('Bauhaus-Light.eot');
		src: url('Bauhaus-Light.eot?#iefix') format('embedded-opentype'),
		url('Bauhaus-Light.woff') format('woff'),
		url('Bauhaus-Light.ttf') format('truetype'),
		url('Bauhaus-Light.svg#Bauhaus-Light') format('svg');
		font-weight: normal;
		font-style: normal; }

@font-face {
		font-family: 'Bauhaus';
		src: url('Bauhaus-Medium.eot');
		src: url('Bauhaus-Medium.eot?#iefix') format('embedded-opentype'),
		url('Bauhaus-Medium.woff') format('woff'),
		url('Bauhaus-Medium.ttf') format('truetype'),
		url('Bauhaus-Medium.svg#Bauhaus-Medium') format('svg');
		font-weight: bold;
		font-style: normal; }

h2 {
		font-size: 16px;
		font-weight: bold; }

p {
		margin-bottom: 20px; }

.auszeichnung {
		font-weight: bold; }	
								
a, {
		text-decoration: none; }

a:link {
		color: #000000;
		text-decoration: none; }

a:visited {
		color: #000000;
		text-decoration: none; }

a:hover {
		color: #0976b5; }

a:active {
		color: #0976b5; }


/*Navigation*/

.container_navi {
		position: fixed;
		top: 0px;
		right: 100px;
		left: 100px;
		text-align: right;
		font-weight: bold;
		background: #FFFFFF;
		height: 90px; }

.navi {
		position: relative;
		margin-right: 40px;
		margin-top: 50px;
		float: right;
		width: auto;
		font-size: 18px; }
								
.navi li {
		list-style: none;
		margin-top: 20px;
		margin-bottom: 8px;
		margin-right: 20px; }
		
.navi .aktiv a {
		color: #0976b5; } 

/*Bildstreifen*/

.zierstreifen {
		position: absolute;
		right: 100px;
		left: 100px;
		height: 80px;
		top: 90px;
		overflow: hidden; }

		
/*Inhalt allgemein*/

.container_inhalt {
		position: absolute;
		float: left;
		right: 100px;
		left: 100px;
		top: 170px;
		bottom: 88px;
		background: #FFFFFF; }
								
.bildmarke {
		position: absolute;
		bottom: 0px;
		right: 0px;
		left: 320px;
		opacity: 0.06;
		overflow: hidden; }

.inhalt_spalte_breit,.inhalt_spalte_schmal {		
		position: absolute;
		bottom: 40px;
		right: 40px;
		height: auto;
		overflow: scroll; }

.inhalt_spalte_breit {
		left: 40px;
		top: 136px; }
								
.inhalt_spalte_schmal {
		left: 220px;
		top: 40px; }

.container_angebot {
		position: absolute;
		top: 40px;
		right: 40px;
		left: 40px;
		height: auto;
		float: right;
		font-weight: bold;
		text-align: right;
		text-decoration: none;
		clear: both; }
		
.container_angebot ul li {
		display: inline; }

#filter .active a {
		color: #0976b5; }


/*Inhalt Portfolio*/

.container_portfolio_2, .container_portfolio_3 {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		justify-content: space-between;
		clear: both; }

.container_portfolio_3 .portfolio {
		width: 32%; }

.container_portfolio_2 .portfolio {
		width: 49%; }


.kunde {
		margin-top: 40px;
		margin-bottom: -10px; }

.container_farbfelder {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		justify-content: space-between;
		clear: both; }
		
.farbfelder {
		height: 40px;
		width: 32%; }

/** Lightbox **/

.lightbox {
		display: none;
		position: fixed;
		z-index: 999;
		width: 100%;
		height: 100%;
		text-align: center;
		top: 0;
		left: 0;
		background: rgba(255,255,255,0.8); }

.lightbox img {
		max-width: 80%;
		max-height: 80%;
		margin-top: 40px; }

.lightbox:target {
		outline: none;
		display: block; }


/*Footerbereich*/

.footer {
		position: fixed;
		bottom: 0;
		right: 100px;
		left: 100px;
		background: #FFFFFF;
		float: left;
		height: auto; }
								
.footerlogo {
		position: relative;
		bottom: 30px;
		left: 20px;
		float: left;
		width: auto;
		margin-top: 30px }
								
.footeradress {
		position: relative;
		white-space:nowrap;
		bottom: -55px;
		left: 18px;
		float: left;
		width: auto;
		margin-right: 38px;
		font-size: 12px;
		line-height: 18px; }

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

/*Allgemeine Formatierungen*/

body,td,p {
		font-size: 12px;
		line-height: 16px; }

/*Navigation*/

.container_navi {
		right: 20px;
		left: 20px;
		height: 60px; }

.navi {
		margin-top: 30px;
		margin-right: 20px;
		font-size: 14px; }

/*Bildstreifen*/

.zierstreifen {
		right: 20px;
		left: 20px;
		height: 40px;
		top: 60px; }


/*Inhalt allgemein*/

.container_inhalt {
		top: 100px;
		right: 20px;
		left: 20px;
		bottom: 62px; }

.inhalt_spalte_breit {
		top: 116px; }
		
.inhalt_spalte_schmal {
		left: 20px;
		top: 20px; }

.bildmarke {
		left: 144px; }

.container_angebot {
		top: 20px;
		right: 20px;
		left: 20px; }

/*Inhalt Portfolio*/

.container_portfolio_2, .container_portfolio_3 {
		display: block; }

.container_portfolio_2 .portfolio, .container_portfolio_3 .portfolio {
		width: 100%;
		margin: 0 0 10px 0; }


/** Lightbox **/

/*Footerbereich*/

.footer {
		right: 20px;
		left: 20px; }

.footerlogo {
		bottom: 20px;
		margin-top: 40px }

.footerlogo img {
		width: 120px; }

.footeradress {
		white-space:pre-wrap;
		bottom: 10px;
		left: 18px;
		margin-right: 38px;
		font-size: 10px;
		line-height: 14px; }


}