img.fit_width, .fit_width img{
  width: 100%;
  box-sizing: border-box;
}

img.border, .border img{
  border-bottom: solid .25em white;
}

h1,p {
  margin: 0 0 1em 0;
}


h1{
  font-weight: 300;
  text-transform: uppercase;
  padding-left: 1.2rem;
  margin: 0 0 1rem 0;
	letter-spacing: -.02em;
}

h2{
  margin: 0 0 1rem 0;
	letter-spacing: -.02em;
}

div.kasten h1{
  font-weight: bold;
  display: block;
	font-family: 'Open Sans', sans-serif;
	font-weight: bold;
  padding-left: 0;
  margin-bottom: 1em;
  margin-top: 0;
}

div.kasten{
    border: solid .2rem hsl(0, 0%, 95%);
    padding: 1rem;
    display: inline-block;
}

div.kasten h3 {
	display: inline;
	font-weight: normal;
	text-transform: uppercase;
	font-size: .85em;
	color: hsl(0, 0%, 95%);
}

@media screen and (min-width: 60em) {
	div.kasten h3 + h3:before{
	 content: "\2022";
	 display: inline-block;
	 margin: 0 .5em 0 .25em;
	}
}


div.textbox{
  padding: 1.2em;
  color: hsl(0, 0%, 85%);
  top: -1em;
  position: relative;
}

div.textbox h3{
  margin-bottom: .5em;
}

div.textbox > *:last-child{
  margin-bottom:0;
}

table{
  /*max-width: 100%;*/
}

table td{
  /*white-space: nowrap;*/
  /*overflow: hidden;*/
  /*text-overflow: ellipsis;*/
}

table.datalist th, table.data th{
  font-weight: normal;
  text-align: left;
  color: hsl(0,0%,50%);
  padding-bottom: 1em;
}

table.datalist, table.data{
  width: 100%;
  border-collapse: collapse;
}

td table.datalist{
  display: none;
  font-size: .85em;
  margin: 1em 0;
}

span.has_nested{
  font-size: .6em;
  line-height: 1em;
  padding: .33em;
  display: inline-block;
  border: solid 1px hsl(0,0%,50%);
  border-radius: .5em;
  box-sizing: border-box;
  /*color: white;*/
  /*background: hsl(0,0%,98%);*/
  cursor: pointer;
}

span.has_nested:hover{
  color: white;
  background: hsl(0,0%,50%);
}

span.has_nested:active{
  color: inherit;
  background: hsl(0,0%,100%);
}

form table tr > td:nth-of-type(2){
  width: 100%;
}

input, textarea{
  background: none;
  border: solid 1px hsl(0,0%,50%);
  padding: .75em;
  font-family: inherit;
  width: 100%;
  box-sizing: border-box;
}

label{
  margin-right: 1em;
}

textarea{
  height: 10em;
}

button{
  color: hsl(0,0%,40%);
  background: none;
  border: solid .1em hsl(0,0%,50%);
  padding: .5em;
  margin-left: auto;
  display: block;
  width: 25%;
  cursor: pointer;
  font-weight: normal;
  box-sizing: border-box;
  font-size: 1em;
}

button:hover{
  background: hsl(0,0%,98%);
}

form td{
    vertical-align: top;
}

ol, ol li {
  padding-left: 1em;
}

.referenzen table{
  font-size: .85em;
}

.referenzen a{
  display: inline-block;
  width: 1em;
  height: 1em;
  border: solid .15em hsl(0, 0%, 65%);
  vertical-align: middle;
  border-radius: .25em;
  position: relative;
}

.referenzen a:hover{
  background: hsl(0,0%,20%);
}

.referenzen a:before{
  content: "";
  display: inline-block;
  border-right: solid .15em hsl(0, 0%, 65%);
  border-bottom: solid .15em hsl(0, 0%, 65%);
  height: .4em;
  width: .4em;
  box-sizing: border-box;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%) rotate(-45deg);
}

.referenzen a.active:before{
  border: none;
  border-right: solid .15em hsl(0, 0%, 65%);
  border-left: solid .15em hsl(0, 0%, 65%);
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
}




div.menu .mainmenu-active{
  display: block;
  /*padding: .25em;*/
  background: hsl(43, 100%, 45%);
  color: white;
}

div.menu .level1 a{
  /*display: block;*/
  padding: .5em 1em;
}


.zoom {
  position: relative;
  display: block;
}

.zoom a:nth-of-type(n+2) img{
  display: none;
}



.zoom a:nth-of-type(2):before{
  content: "";
  width: 2em;
  height: 2em;
  position: absolute;
  left: 1em;
  bottom: 1em;
  background-image: url("icons/gallery.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

span.arrow{
  position: absolute;
  width: 5%;
  min-width: 4em;
  min-height: 4em;
  border: solid .2em hsla(0,0%,100%,.8);
  bottom: 2em;
  left: 50%;
  transform: translateX(-50%);
  box-sizing: border-box;
  border-radius: 25%;
  line-height: 0;
  cursor: pointer;
}

span.arrow:hover{
  background: hsla(0,0%,100%,.2);
}

span.arrow:active{
  background: hsla(0,0%,100%,.9);
}

span.arrow:after{
  content: "";
  padding-bottom: 100%;
  display: inline-block;
}

span.arrow:before{
  content: "";
  width: 40%;
  height: 40%;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-65%) rotate(135deg);
  border: solid .25em hsla(0,0%,100%,.8);
  border-bottom: none;
  border-left: none;
  box-sizing: border-box;
}

@media screen and (max-width:60em) {


	h1{
	  /*margin-top: 2em;*/
	  padding-left:0;
	}
	div.kasten h1{
	  font-weight: bold;
	  display: block;
	  padding-left: 0;
	  margin-bottom: 1rem;
	  margin-top: 0;
	}

	div.kasten{
	    border: none;
	    padding: 0;
	    display: inline-block;
	}

	div.kasten h3 {
	 display: block;
	}

}

@media screen and (max-width:40em) {
  body{
    font-size: 12px;
  }

  h1{
    padding-left: 0;
    margin-bottom: 0;
    margin-top: 1em;
  }

}
@media screen and (max-width:25em) {
  body{
    font-size: 12px;
  }

  h1{
    padding-left: 0;
    margin-bottom: 0;
    margin-top: 3em;
  }

}