html { overflow-y:scroll; }
body {
  background-color:#fefefe;
  color:black;
  height:100%;
  font-family:Verdana, sans-serif;
}
a {
  text-decoration:none;
  color:#999999;
}
a:hover { color:#333333; }
h1, h1 a {
  font-size:4.0em;
  font-family:'Times-Roman', 'Times', 'Times New Roman', serif;
  font-style:normal;
  font-weight:400;
  color:#000000;
}
h2 {
  margin-top:0em;
  font-size:1.2em;
}
.sitewidth { width:960px; }
.center { margin:0 auto; }
#header {
  height:100px;
  z-index:100;
  width:100%;
  position:relative;
}
.clearfloat {
  clear:both;
  display:block;
}
ul {
  padding:0px;
  margin:0px;
}
.subtitle {
  position:absolute;
  top:164px;
  font-size:0.75em;
}
.subtitle p {
  font-family:'Times-Roman', 'Times', 'Times New Roman', serif;
  font-style:normal;
  font-size:2.0em;
  letter-spacing:0.06em;
  margin:0px;
  margin-left:0.12em;
}
#navigation {
  position:relative;
  box-sizing:border-box;
  float:left;
  top:-100px;
  z-index:100;
  padding-right:30px;
  padding-left:30px;
  padding-bottom:4px;
  background-color:#fefefe;
  margin:0px;
  margin-right:12px;
  width:188px;
  min-height:400px;
}
#navigation h1 {
  margin-top:100px;
  margin-bottom:70px;
}
ul.nav {
  padding:0px;
  margin:0px;
}
ul.nav > li {
  display:block;
  margin-bottom:8px;
  padding-bottom:2px;
}
ul.nav > li > a { font-size:0.8em; }
ul.nav li { color:#999999; }
.nav li a:hover { color:#333333; }
ul.dropdownlist {
  margin-top:6px;
  padding-left:16px;
}
ul.dropdownlist li {
  display:block;
  font-size:11px;
  margin-bottom:6px;
  border:none;
}
ul.dropdownlist li a { color:#999999; }
ul.dropdownlist li a.link-current, ul.dropdownlist li a.link-active { color:#000000; }
.link-current, .link-active { color:#000000; }
li.new.category {
  background-color:#999999;
  padding:4px;
  color:white;
}
li.new.category a { color:white; }
li.new.category:hover {
  background-color:#333333;
  padding:4px;
  color:white;
}
li.new.category a:hover { color:white; }
.dropdownlist.hide-inactive { display:none; }
.link-current+ul, .link-active+ul { display:block !important; }
.link-active + .dropdownlist { display:block; }
#content {
  float:left;
  position:relative;
  top:145px;
  margin-left:10px;
  width:700px;
}
.box-list {
  float:left;
  width:720px;
}
.box-list > .hanya-editable {
  box-sizing:border-box;
  float:left;
  padding:0px;
  margin:0px;
}
.box {
  float:left;
  height:255px;
  margin-left:20px;
  margin-bottom:10px;
  opacity:1;
}
.box:nth-child(2n + 1) { margin-left:0px; }
.box.new {
  margin-left:8px;
  margin-bottom:18px;
}
.box:hover { opacity:1; }
.box-content {
  position:relative;
  width:340px;
  overflow:hidden;
}
.box-content.unpublished { opacity:.5; }
.box-content.unpublished:hover { opacity:0.8; }
.box .image {
  width:100%;
  height:236px;
  margin-bottom:3px;
  overflow:hidden;
}
.box img { width:100%; }
.box .title {
  position:relative;
  font-size:11px;
}
.box .status {
  position:absolute;
  color:#ff0000;
  background-color:black;
  width:100%;
  text-align:center;
  top:107.5px;
  transform:rotate(20deg);
  -ms-transform:rotate(20deg);
  -webkit-transform:rotate(20deg);
  font-size:2.0em;
  font-weight:bold;
}
.box .show-on-frontpage {
  position:absolute;
  width:100%;
  text-align:center;
  top:50px;
  color:black;
  font-size:1.5em;
}
.item { position:relative; }
.item img {
  max-height:100%;
  max-width:100%;
}
.slide .image {
  width:700px;
  height:500px;
  overflow:hidden;
}
.backgroundslideshow {
  overflow:hidden;
  position:absolute !important;
  z-index:0;
  width:100%;
  height:100%;
}
.backgroundslideshow a { z-index:1; }
.backgroundslideshow .image {
  width:100%;
  height:100%;
}
.backgroundslideshow img {
  width:100%;
  height:100%;
}
.project .image_big {
  width:700px;
  position:relative;
  margin-bottom:6px;
}
.projectsite img { width:700px; }
.project .text {
  margin-top:12px;
  margin-bottom:5px;
}
.slide .title {
  position:absolute;
  font-size:0.8em;
  padding:3px 0 0 0;
  bottom:0px;
  color:#999999;
  background-color:#ffffff;
  width:100%;
}
.box.new > .hanya-createable {
  display:block;
  text-align:center;
  box-sizing:border-box;
  border:1px solid black;
  width:340px;
  min-height:200px;
}
.project h2 {
  font-size:0.8em;
  color:#333333;
  font-weight:normal;
  margin:0.7em 0;
  display:block;
}
.project .grey { color:#999999; }
.project .description {
  font-size:0.8em;
  color:#999999;
  width:700px;
}
.project .description p { padding-bottom:8px !important; }
.project .copyright {
  width:700px;
  text-align:right;
  margin-top:10px;
  margin-bottom:23px;
  font-size:0.7em;
  color:#999999;
}
.project .image_description {
  font-size:0.8em;
  min-height:1.0em;
  margin-bottom:15px;
  color:#999999;
}
.project .anfrage {
  margin-bottom:10px;
  margin-top:4px;
  color:#999999;
  float:right;
  font-size:0.8em;
  text-decoration:underline;
}
.mail { width:462px; }
.mail form { margin-top:20px; }
.mail {
  color:#999999;
  font-size:0.8em;
  width:450px;
}
.mail label {
  position:relative;
  display:inline-block;
  width:140px;
}
.mail input, .mail textarea {
  display:inline-block;
  width:290px;
  max-width:290px;
}
.mail textarea { height:100px; }
.mail input.button {
  width:100px;
  height:19px;
  position:relative;
  right:6px;
  float:right;
  margin-bottom:20px;
  margin-right:3px;
}
.mail .info { color:#999999; }
.profil_text {
  color:#999999;
  font-size:0.8em;
}
.profil_picture {
  margin-bottom:20px;
  width:450px;
  overflow:hidden;
}
.profil_picture img { max-width:320px; }
.profil h2, .mail h2 {
  font-weight:normal;
  font-size:13px;
  color:black;
}
.impressum h2 { margin-top:0; }
.contact { margin-bottom:60px; }
.contact .adress {
  font-size:0.8em;
  line-height:1.5em;
  color:#999999;
}
#slideshow {
  display:none;
  position:relative;
  margin-bottom:10px;
}
.slidesjs-navigation { margin-top:5px; }
a.slidesjs-next, a.slidesjs-previous {
  background-image:url(/assets/icons/btns-next-prev.png);
  background-repeat:no-repeat;
  background-size:18px 24px;
  display:block;
  width:9px;
  height:12px;
  overflow:hidden;
  text-indent:-9999px;
  top:0px;
  margin-right:5px;
  z-index:100;
  float:left;
}
a.slidesjs-next {
  margin-right:0px;
  background-position:-9px -12px;
}
a:hover.slidesjs-next { background-position:-9px 0px; }
a.slidesjs-previous { background-position:0 -12px; }
a:hover.slidesjs-previous { background-position:0 0; }
a.slidesjs-play {
  width:15px;
  background-position:-25px 0;
}
a:hover.slidesjs-play { background-position:-25px -18px; }
a.slidesjs-stop {
  width:18px;
  background-position:-41px 0;
}
a:hover.slidesjs-stop { background-position:-41px -18px; }
.slidesjs-pagination {
  z-index:101;
  margin:5px 0 0;
  float:right;
  list-style:none;
}
.slidesjs-pagination li {
  float:left;
  margin:0 1px;
}
.slidesjs-pagination li a {
  display:block;
  width:12px;
  height:0;
  padding-top:12px;
  background-image:url(/assets/icons/pagination_points.png);
  background-position:0 0;
  background-size:100%;
  float:left;
  overflow:hidden;
}
.slidesjs-pagination li a.active, .slidesjs-pagination li a:hover.active { background-position:0 -48px; }
.slidesjs-pagination li a:hover { background-position:0 -24px; }
#slides a:link, #slides a:visited { color:#333333; }
#slides a:hover, #slides a:active { color:#9e2020; }
.navbar { overflow:hidden; }
.nav-toggle, .nav-toggle-label { display:none; }
@media screen and (max-width: 980px) {
  html { overflow-y:auto; }
  .sitewidth {
    width:auto;
    padding:0 16px;
    padding-left:calc(16px + env(safe-area-inset-left));
    padding-right:calc(16px + env(safe-area-inset-right));
  }
  #navigation {
    padding-left:0;
    padding-right:20px;
    margin-right:0;
  }
  #navigation.nav-home { padding-left:20px; }
  #content {
    float:none;
    display:flow-root;
    width:auto;
    margin-left:0;
  }
  .box-list {
    float:none;
    width:auto;
    display:flex;
    flex-wrap:wrap;
  }
  .box {
    width:49%;
    height:auto;
    margin-left:2%;
  }
  .box:nth-child(2n + 1) { margin-left:0; }
  .box.new { margin:0; }
  .box-content { width:auto; }
  .box .image {
    height:auto;
    aspect-ratio:1.4375;
  }
  .box .image img {
    height:100%;
    object-fit:cover;
  }
  .project .image_big, .project .description, .project .copyright { width:100%; }
  .projectsite img {
    width:100%;
    height:auto;
  }
  .profil_picture { width:auto; }
  .profil_picture img {
    max-width:100%;
    height:auto;
  }
  .backgroundslideshow {
    position:absolute !important;
    top:0;
    left:0;
    width:100%;
    height:100%;
    height:100lvh;
  }
  .backgroundslideshow .slidesjs-container, .backgroundslideshow .slidesjs-control, .backgroundslideshow .slidesjs-slide {
    width:100% !important;
    height:100% !important;
  }
  .backgroundslideshow img {
    object-fit:cover;
    object-position:0 50%;
  }
}
@media screen and (max-width: 640px) {
  #header { display:none; }
  .hanya-admin-login { display:none; }
  #navigation.nav-home {
    display:inline-block;
    margin-top:0;
    padding:24px 30px 36px 30px;
    padding-top:calc(24px + env(safe-area-inset-top));
    background-color:#fefefe;
  }
  #navigation.nav-home h1 {
    font-size:3.6em;
    margin:12px 0 -5px 0;
  }
  #navigation.nav-home .subtitle { font-size:0.675em; }
  #navigation.nav-home ul.nav { padding-top:14px; }
  #navigation.nav-home ul.nav a {
    border-bottom:none;
    padding:8px 0;
  }
  #navigation {
    float:none;
    top:0;
    width:auto;
    min-height:0;
    padding:0;
    margin:0;
  }
  #navigation h1 {
    font-size:3em;
    margin:24px 0 8px 0;
  }
  .subtitle {
    position:static;
    margin-bottom:20px;
  }
  ul.nav li {
    margin:0;
    padding:0;
  }
  ul.nav a, ul.nav > li > a {
    display:block;
    padding:11px 0;
    border-bottom:1px solid #eeeeee;
    font-size:16px;
    color:#666666;
  }
  ul.nav ul.dropdownlist {
    margin:0;
    padding-left:16px;
  }
  ul.nav ul.dropdownlist li {
    margin:0;
    font-size:15px;
  }
  ul.nav ul.dropdownlist a { font-size:15px; }
  ul.nav ul.dropdownlist ul.dropdownlist { display:none !important; }
  ul.nav a.link-current, ul.nav a.link-active { color:#000000; }
  ul.nav a.link-current { font-weight:bold; }
  #navigation.has-menu-toggle {
    position:sticky;
    top:0;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:10px 0;
    border-bottom:1px solid #eeeeee;
  }
  #navigation.has-menu-toggle h1 {
    font-size:2.2em;
    margin:0;
    line-height:1;
  }
  #navigation.has-menu-toggle .subtitle { display:none; }
  .nav-toggle-label {
    display:block;
    padding:10px 0 10px 12px;
    cursor:pointer;
    color:#000000;
    font-size:15px;
    line-height:20px;
    -webkit-user-select:none;
    user-select:none;
  }
  .nav-toggle-label:after {
    content:"";
    display:inline-block;
    vertical-align:middle;
    width:20px;
    height:2px;
    margin:-3px 0 0 10px;
    background:#000000;
    box-shadow:0 -6px 0 #000000, 0 6px 0 #000000;
  }
  .nav-toggle:checked + .nav-toggle-label:after {
    content:"\2715";
    width:20px;
    height:auto;
    margin-top:0;
    background:none;
    box-shadow:none;
    font-size:18px;
    text-align:center;
  }
  .nav-toggle ~ ul.nav { display:none; }
  .nav-toggle:checked ~ ul.nav {
    display:block;
    position:absolute;
    top:100%;
    left:-16px;
    right:-16px;
    max-height:75vh;
    overflow-y:auto;
    padding:4px 16px 16px 16px;
    background-color:#fefefe;
    box-shadow:0 8px 16px rgba(0,0,0,0.15);
  }
  #content {
    top:0;
    margin-top:20px;
  }
  .box { width:48.5%; }
  .box:nth-child(n) { margin-left:3%; }
  .box:nth-child(2n + 1) { margin-left:0; }
  .box .title { font-size:12px; }
  .project h2, .project .description, .project .image_description, .profil_text, .contact .adress, .mail { font-size:0.9em; }
  .mail { width:auto; }
  .mail label {
    display:block;
    width:auto;
    margin-bottom:4px;
  }
  .mail input, .mail textarea {
    display:block;
    width:100%;
    max-width:none;
    box-sizing:border-box;
    font-size:16px;
  }
  .mail input.button {
    float:none;
    right:0;
    width:auto;
    height:auto;
    padding:6px 24px;
    margin:10px 0 20px 0;
  }
}