/**************************** RESET ****************************/

*, *:before, *:after {
margin: 0;
padding: 0;
border: 0;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
-webkit-font-smoothing: antialiased;
-moz-font-smoothing: antialiased;
font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-weight: 400 !important;
font-style: normal !important;
-webkit-appearance: none;
vertical-align: top;
outline:none;
}

/**************************** FONT ****************************/

@font-face {
font-family: 'Light';
font-style: normal;
font-weight: normal;
src: url('../fonts/Light.woff2') format('woff2'), url('../fonts/Light.woff') format('woff'), url('../fonts/Light.eot') format('eot');
}

@font-face {
font-family: 'Regular';
font-style: normal;
font-weight: normal;
src: url('../fonts/Regular.woff2') format('woff2'), url('../fonts/Regular.woff') format('woff'), url('../fonts/Regular.eot') format('eot');
}

@font-face {
font-family: 'LAdsfB';
font-style: normal;
font-weight: normal;
src: url('../fonts/labmono-regular-web.woff2') format('woff2'), url('../fonts/labmono-regular-web.woff') format('woff'), url('../fonts/labmono-regular-web.eot') format('eot');
}

/**************************** BASIC ****************************/

body {
font-family: 'LAB', monospace;
font-size:13px;
line-height:18px;
color:white;
background:rgb(180,180,180);
overflow-x:hidden;
}

.big {
font-size: 24px !important;
line-height: 32px;
font-family: 'Light', Arial;
}

h1 {
font-size: 24px !important;
line-height: 32px;
font-family: 'Light', Arial;
padding-bottom:32px;
text-align:center;
}

p {
padding-bottom: 34px;
}

a {
color:rgb(150,150,150);
text-decoration:none;
}

.content a {
color:white;
text-decoration:none;
text-shadow:rgba(0,0,255,0.8) 0px 0px 20px;
}

.content a:hover {
color:white;
text-decoration:none;
text-shadow:none;
}

.navigation a {
text-shadow: none;
}

.navigation h1 {
padding:0px;
text-align:left;
}

ul {
    padding-left:24px;
	padding-bottom:34px;
}


/**************************** CONTENT ****************************/

.content {
width:100%;
min-height:100vh;
background:rgb(180,180,180);
-webkit-box-shadow: 0px -20px 16px 0px rgba(0,0,0,0.1);
-moz-box-shadow: 0px -20px 16px 0px rgba(0,0,0,0.1);
box-shadow: 0px -20px 16px 0px rgba(0,0,0,0.1);
padding:32px;
padding-top:64px;
padding-bottom:64px;
box-sizing:border-box;
position:relative;
z-index:1;
}

.content.projekte,
.content.default {
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}

.text {
width:100%;
max-width:700px;
margin:0 auto;
color:white;
text-align:left;
}

#home {
padding-top:0px !important;
}

.page {
text-align:center;
padding-top:64px;
}

.page img {
width:100%;
max-width:900px;
margin:0 auto;
padding-bottom:40px;
}


/**************************** FOOTER ****************************/

.footer .text,
.static-footer .text {
width:100%;
max-width:none !important;
margin:0 auto;
color:white;
}

.right {
float:right !important;
}

.footer {
max-height:calc(100vh - 100px);
height:auto;
width:100%;
left:0px;
right:0px;
background:white;
position:fixed;
z-index:3;
padding:32px;
padding-top:16px;
box-sizing:border-box;
-webkit-box-shadow: 0px -20px 16px 0px rgba(0,0,0,0.1);
-moz-box-shadow: 0px -20px 16px 0px rgba(0,0,0,0.1);
box-shadow: 0px -20px 16px 0px rgba(0,0,0,0.1);
top:100vh;
}

.mobile-static-footer .text,
.static-footer .text,
.footer .text {
color: rgb(150,150,150);
}

.kontakt {
height:80px;
}

.mobile-static-footer,
.static-footer {
background:white;
padding:32px;
padding-top:16px;
box-sizing:border-box;
-webkit-box-shadow: 0px -20px 16px 0px rgba(0,0,0,0.1);
-moz-box-shadow: 0px -20px 16px 0px rgba(0,0,0,0.1);
box-shadow: 0px -20px 16px 0px rgba(0,0,0,0.1);
position:relative;
z-index: 2;
}

.mobile-static-footer .kontakt,
.static-footer .kontakt {
height:auto;
}

.mobile-static-footer p,
.static-footer p {
padding-bottom:0px;
}

.footer .text,
.static-footer .text,
.mobile-static-footer .text {
margin-top:0px !important;
padding-top:0px !important;

}

.footer p {
padding-bottom:16px;
}

.impressum {
padding-bottom:64px;
}

.menu-kontakt,
.menu-impressum {
cursor:pointer;
padding:0px;
}

.kontakt p {
float:left;
}

.mobile-static-footer {
display:none;
}

/**************************** TICKER ****************************/

#marquee {
background: #eee;
overflow: hidden;
white-space: nowrap;
position:fixed;
z-index:99 !important;
background:white !important;
text-transform:uppercase;
color:blue;
width:100000000px;
}

#marquee p {
float:left;
padding-right:20px;
white-space: nowrap;
padding-bottom:0px;
font-size: 16px !important;
line-height: 32px !important;
}


/**************************** INTRO ****************************/

.gradient {
position:relative;
height:100vh;
width:100%;
z-index:-2;
top:0px;
background:-moz-linear-gradient(-45deg, #c3b7da, #e04d87);
background:-webkit-linear-gradient(-45deg, #c3b7da, #e04d87);
background:linear-gradient(-45deg, #c3b7da, #e04d87);
}

.intro {
height:64px;
text-align:center;
width:100%;
height:100vh;
top:0px;
position:fixed;
z-index:0;
}

.intro h1, .intro a {
font-size:64px;
line-height:64px;
position:relative;
top:50%;
margin-top:-50px;
letter-spacing:0.1em;
text-decoration:none;
color:white;
}

/**************************** NAVIGATION ****************************/

.navigation {
	position:absolute;
	width:200px !important;
	float:left;
}

.sticky-wrapper {
	float:left;
}

.sticky-wrapper,
.sticky-wrapper * {
	width:200px !important;
}

.navigation > a {
font-family: 'LAB', monospace;
font-size:13px;

}

.navigation a,
.bilder-text a {
color:white;
text-decoration:none;
}

.bilder-text {
position:absolute;
right:32px;
}

.active > a {
	text-shadow:rgba(0,0,255,0.8) 0px 0px 10px;
}

.active .menu-startseite {
	text-shadow:none !important;
}

.menu-item > div {
	padding-left:16px !important;
	display:none;
}

.active > div {
	display:block;
}

.menu-startseite {
	font-size: 24px !important;
	line-height: 32px;
	font-family: 'Light', Arial;
}

/**************************** MOBILE-NAVIGATION ****************************/

.mobile-navigation {
display:none;
position:fixed;
top:0px;
bottom:0px;
left:0px;
right:0px;
background:-moz-linear-gradient(-45deg, #c3b7da, #e04d87);
background:-webkit-linear-gradient(-45deg, #c3b7da, #e04d87);
background:linear-gradient(-45deg, #c3b7da, #e04d87);
z-index:99;
width:100%;
height:100vh;
overflow:auto;
box-sizing:border-box;
padding:32px 32px 32px 32px;
text-align:center !important;
}

.mobile-navigation * {
color:white !important;
font-size:24px !important;
line-height:44px !important;
text-shadow:none !important;
float:none !important;
}

.burger {
display:none;
position:fixed;
right:32px;
top:54px;
color: rgb(180,180,180) !important;
font-size:24px !important;
line-height:24px !important;
text-shadow:none !important;
background:white;
border-radius:1000px;
z-index:100;
padding:9px 10px 10px 10px;
width:44px;
height:44px;
text-align:center;
font-family: 'Regular';
}

/**************************** SLIDER ****************************/

.page img {
width:100%;
max-width:900px;
margin:0 auto;
color:white;
}

.slider {
width:100%;
max-width:900px;
margin:0 auto;
color:white;
padding-top:64px;
}

.slides {
margin-bottom:20px;
}

.slides,
.slidesjs-container {
overflow-y:visible !important;
position:relative;
}

.slides img {
max-width:900px;
width:100%;
padding:0px;
}

.slides p {
position:absolute;
bottom:0px;
left:0px;
background:rgb(180,180,180);
width:100%;
padding:10px 0px 10px 0px;
}

.slides {
	display: none
}
	
.container {
	margin: 0 auto
}
	
.slidesjs-pagination .active {
	color:red;
}

.slidesjs-previous,
.slidesjs-next {
position:absolute;
top:50%;
z-index:10;
width:15px;
height:25px;
margin-top:-13px;
}

.slidesjs-previous {
left:10px;
}

.slidesjs-next {
right:10px;
}

.defs-only {
  position: absolute;
  height: 0; width: 0;
  overflow: none;
  left: -100%;
}

/**************************** NEWSLETTER + DOWNLOAD ****************************/

#newsletter-download {
padding-top:100px !important;
padding-bottom:60px !important;
}

#newsletter-download,
#newsletter-download div {
font-size:0px !important;
}

.newsletter,
.download {
margin:2%;
border:0px;
font-size: 24px !important;
line-height: 32px;
font-family: 'Light', Arial;
padding:11px;
background:white;
width:44%;
position:relative;
display:inline-table;
color: rgb(180,180,180) !important;
}

.newsletter:hover,
.newsletter:focus,
.download:hover {
	box-shadow:rgba(0,0,255,0.5) 0px 0px 20px;
}

.newsletter input {
font-size: 24px !important;
line-height: 32px;
font-family: 'Light', Arial;
background:white;
height:100%;
width:calc(100% - 30px);
}

.newsletter button {
font-size: 24px !important;
line-height: 32px;
font-family: 'Light', Arial;
background:white;
height:100%;
width:30px;
}

/*button.download {
border-radius:100px;
}*/


/**************************** TABLE ****************************/
table {
border-collapse: collapse; 
}

table * {
text-align:left;
vertical-align:top;
}

table {
position:relative;
width:100%;
}

tr {
border-bottom:1px solid white;
}

td,
th {
padding: 9px 0px 9px 0px;
}

.table-projekte,
.table-publikation {
width:50%;
}

.table-jahr {
width:50%;
}


/**************************** UNTERSEITE ****************************/


.text .slider {
padding-top:0px;
}

/**************************** POPUP ****************************/

.popup {
position:fixed;
background:white;
width:600px;
height:400px;
overflow:auto;
top:50%;
left:50%;
margin-left:-300px;
margin-top:-200px;
z-index:2;
color:rgb(180,180,180);
-webkit-box-shadow: 0px -20px 16px 0px rgba(0,0,0,0.1);
-moz-box-shadow: 0px -20px 16px 0px rgba(0,0,0,0.1);
box-shadow: 0px -20px 16px 0px rgba(0,0,0,0.1);
display:none;
padding:32px;
}

.popup button {
background:blue !important;
}

.popup .close {
position:relative;
float:right;
color:blue;
cursor:pointer;
font-family: 'Light', Arial;
}

.popup .header {
width:100%;
left:0px;
top:0px;
padding-bottom:32px !important;
}

.menu-newsletter {
cursor:pointer;
}

table tr,
table td,
table td * {
padding:0px !important;
margin:0px !important;
}

table td {
width:100% !important;
padding-bottom:5px !important;
padding-top:5px !important;
display:block;
}

.popup input,
.popup select {
padding:5px !important;
width:100% !important;
}

.popup button {
padding:5px !important;
width:100% !important;
text-align:center;
margin-top:30px !important;
border-radius:1000px !important;
}

.popup input[type=checkbox] {
width:10px !important;
height:10px !important;
border-top-left-radius: 2px;
border-top-right-radius: 2px;
border-bottom-right-radius: 2px;
border-bottom-left-radius: 2px;
border: 1px solid rgb(216, 222, 228);
margin-top:3px !Important;
margin-right:10px !Important;
}

.popup input[type=checkbox]:checked {
	background: rgb(216, 222, 228);
}

.popup table div {
	padding-left:80px !important;
}


/**************************** RESPONSIVE ****************************/

@media screen and (max-width: 1025px) {
	
.burger {
display:block;
}

#navigation-sticky-wrapper,
#sticky-wrapper,
.navigation {
display:none;}

* {
font-size: 18px !important;
line-height: 24px !important;
}

body {
font-family: 'LAB', monospace;
color:white;
background:rgb(180,180,180);
}

.content {
padding:16px !important;
}

.mobile-static-footer *,
.navigation,
.navigation > a {
font-family: 'LAB', monospace;
font-size: 16px !important;
line-height: 24px !important;
}

h1, .big {
font-family: 'Light', Arial;
}

p {
padding-bottom: 21px;
}

#sticky-wrapper,
#sticky-wrapper * {
position:relative !important;
width:100% !important;
padding:0px !important;
margin:0px !important;
left:0px !important;
top:0px !important;
}

#sticky-wrapper{
margin-bottom:21px !important;
}

.intro h1, .intro a {
font-size:32px !important;
line-height:32px !important;
}

.static-footer,
.footer {
display:none !important;
}

.kontakt {
height:auto !important;
float:left;
}

.mobile-static-footer {
height:auto !important;
float:left;
display:block;
padding:16px !important;
width:100% !important;
}

.mobile-static-footer p {
width:100%;
}

.text {
max-width:none !important;
}

.slidesjs-previous {
left:10px;
}

.slidesjs-next {
right:10px;
}

}

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


.popup {
position:fixed;
background:white;
width:100%;
height:100%;
overflow:auto;
top:0px;
left:0px;
margin-left:0px;
margin-top:0px;
z-index:100;
color:rgb(180,180,180);
-webkit-box-shadow: 0px -20px 16px 0px rgba(0,0,0,0.1);
-moz-box-shadow: 0px -20px 16px 0px rgba(0,0,0,0.1);
box-shadow: 0px -20px 16px 0px rgba(0,0,0,0.1);
display:none;
padding:32px;
}

#marquee p {
float:left;
padding-right:20px;
white-space: nowrap;
padding-bottom:0px;
font-size: 10px !important;
line-height: 20px !important;
}


}