/* Fonts */
 
@font-face {
    font-family: 'MulettLight';
    src: url("fonts/MulettLight.ttf") format("truetype"); /* Passe den Pfad an */
}


/* resets */

* { 
    -moz-box-sizing: border-box; 
    -ms-box-sizing: border-box; 
    box-sizing: border-box; 
}
section, article, header, footer, nav, aside,
figure, figcaption {
    display: block; 
}
img { 
    border: 0px; 
    width: 100%; 
}
ul, ol { 
    list-style: none; 
    margin: 0px; 
    padding: 0px; 
}
figure { 
    margin: 0; 
    padding: 0; 
}

/* General */

html, body {
    font-family: 'MulettLight', Arial, sans-serif; /* Die neue Schriftart hier hinzufügen */
    margin: 0; 
    padding: 0;
    height: 100%;
    color: #000000; 
}
body {
    font-size: 1.125em; 
    line-height: 1.3333em; 
    letter-spacing: 0.06em; 
    padding-top: 279px; 
}

a { 
    color: #000000; 
    text-decoration: none; 
}
a:hover, a.selected { 
    border-bottom: 1px solid #000000; 
}
.soft-links a { 
    color: #b2b2b2; 
}
.soft-links a:hover { 
    border-bottom: 1px solid #b2b2b2; 
}
a:hover img {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
    -moz-opacity: 0.9;
    -khtml-opacity: 0.9;
    opacity: 0.9; 
}

h1, h2 {
    margin: 0;
    color: #000000; 
    font-weight: normal;
    font-family: 'MulettLight', Arial, sans-serif; /* Die neue Schriftart hier hinzufügen */
    font-size: 1em; 
    line-height: 1.428571em; 
}

::selection { background: rgba(0,0,0,0.1); }
::-moz-selection { background: rgba(0,0,0,0.1); }

/*ol {
    font-family: "adobe-garamond-pro", Garamond, Times New Roman, serif;
    font-size: 1em;
    
}*/

.video-wrap {
  position: relative; padding-bottom: 75%;
  height: 0; overflow: hidden;
  background-color: #b2b2b2; }
.video-wrap > * {
  position: absolute; left: 0; top: 0;
  width: 100%; height: 100%; }
.orientation-cinema {
  padding-bottom: 56.25%; }
.orientation-portrait {
  padding-bottom: 132.60869%; }


.trunk {
  width: 100%;
  max-width: 1440px;
  margin: 0 auto; }

.L-1-1 { width: 100%; }
.L-1-2 { width: 50%; }
.L-1-3 { width: 33.33333333%; }
.L-2-3 { width: 66.66666666%; }
.L-1-4 { width: 25%; }
.L-3-4 { width: 75%; }

.gutters { 
  padding-left: 10px;
  padding-right: 10px; }

.float-container:after {
  visibility: hidden; display: block;
  font-size: 0; height: 0;
  content: " "; clear: both; }
.float-container > * { float: left; }

.inline-block-container > * {
  display: -moz-inline-stack;
  display: inline-block;
  vertical-align: top;
  zoom: 1;
  *display: inline; }

/* Header */

body > header { 
  position: fixed; left: 0; top: 0;
  z-index: 10000;
  text-align: center; width: 100%;
  padding-top: 110px; padding-bottom: 110px; }
/* body > header nav { */
/*   letter-spacing: 0.02em; */
/*   font-size: 1.2em; } */
body > header h1, small {
  font-size: 0.6111em; }
nav { font-family: 'MulettLight', Arial, sans-serif; letter-spacing: 0; margin-top: 1em; }
nav li { display: inline; }
nav a {
  font-size: 1.3333em; }

/* Footer */
body > footer {
  clear: both;
  text-align: center;
  font-size: 0.6111em;
  margin-top: 90px; padding-bottom: 90px; }

/* Work */

.trunk.work { padding: 0 30px; }
.work img { display: block; }
.work iframe { pointer-events: none; }
.work ol { margin-bottom: 80px; }
.work .gutters {
  padding-left: 50px; padding-right: 50px; }
.work figcaption { 
  margin-top: 1em; text-align: center; }

.work-type-0, .work-type-1,
.work-type-6, .work-type-7 {
  width: 45.30%; }
.work-type-2, .work-type-8 {
  width: 47.80%; }
.work-type-3, .work-type-9 {
  width: 57.25%; }
.work-type-4, .work-type-10 {
  width: 33.33333333%; }
.work-type-5, .work-type-11 {
  width: 66.66666666%; }

.work-type-0, .work-type-7 {
  margin-left: 54.70%; }
.work-type-1, .work-type-6 {
  margin-right: 54.70%; }
.work-type-2 {
  margin-left: 45.30%; }
.work-type-3 {
  margin-left: 9.42%; }
.work-type-4 {
  margin-left: 66.66666666%; }
.work-type-5, .work-type-11 {
  margin-left: auto; margin-right: auto; }
.work-type-8 {
  margin-left: 7.2463%; }
.work-type-9 {
  margin-left: 33.33333333%; }
.work-type-10 {
  margin-right: 66.66666666%; }

.work-type-0, .work-type-6 {
  margin-bottom: -18.8405%; }
.work-type-1, .work-type-7 { 
  margin-bottom: -12.3188%; }
.work-type-2, .work-type-8 {
  margin-bottom: 9.0579%; }
.work-type-3, .work-type-9 {
  margin-bottom: -13.7681%; }
.work-type-4, .work-type-10 {
  margin-bottom: 9.0579%; }
.work-type-5, .work-type-11 {
  margin-bottom: 9.0579%; }
.work li:last-child { margin-bottom: 0 !important; }

/* Archive */

.trunk.archive { padding: 0 40px; }
.archive li { margin-bottom: 122px; }
.archive li.gutters { padding-left: 42px; padding-right: 42px; }
.archive-image-wrap {
  position: relative; padding-bottom: 100%;
  height: 0; overflow: hidden; }
.archive-image-wrap img { 
  display: block; 
  position: absolute; left: 12.5%; top: 0;
  width: 75%; height: 100%; }
.archive-image-wrap img.landscape {
  width: 100%; height: 75%;
  left: 0; top: 25%; }
.archive li figcaption {
  margin-top: 1em; text-align: center; }
.archive li figcaption h1 {
  font-size: 0.7777em; }

/* Project stub */

.trunk.project-stub { 
  max-width: 1620px; padding: 0 180px; 
  font-size: 0.61111em;
}
.project-stub header { 
  margin: 180px auto;
  text-align: center;
}
.project-stub header .credits { padding-top: 1em; }
/* .project-stub div { font-size: 0.6111em; } */
.project-stub ol li { margin-bottom: 60px; }
.project-stub img { display: block; margin-left: auto; margin-right: auto; }
.project-stub img.portrait { width: 75%; }

/* About */

.trunk.about { padding: 0 auto; width: 500px; }
.about article {
  color: #b2b2b2;
  text-align: center;
  margin-bottom: 110px; }
.about article h1 {
  font-size: 0.6111em; }
.about input[type=email] {
  width: 75%; border: 0; border-bottom: 1px solid #b2b2b2;
  text-align: center; font-size: 1em; margin: 4px 0; }
.about input[type=submit] {
  border: 0; font-size: 1em; background: transparent;
  color: #b2b2b2; cursor: pointer; }

/* Error pages */

.trunk.mini {
  padding: 0 auto; width: 500px; text-align: center; }

/* Responsive */

@media screen and (max-width: 1100px) {
  .L-1-4 { width: 33.33333333%; }
}

@media screen and (max-width: 800px) {
  .M-1-1 { width: 100%; }
  .M-1-2 { width: 50%; }
  .M-1-4 { width: 25%; }
  .M-3-4 { width: 75%; }
  .trunk, .trunk .gutters {
    padding-left: 9px !important;
    padding-right: 9px !important; }
  .trunk.about, .trunk.mini { 
    padding-left: 36px !important; padding-right: 36px !important; 
    width: 100%; }
  /* Work */
  .work-type-0, .work-type-1,
  .work-type-2, .work-type-3,
  .work-type-4, .work-type-5,
  .work-type-6, .work-type-7,
  .work-type-8, .work-type-9,
  .work-type-10, .work-type-11 {
    margin: 0; }
  .work li { margin-bottom: 36px; }
  /* Archive */
  .archive li { margin-bottom: 36px; }
  .archive-image-wrap { padding-bottom: 133.33333333%; }
  .archive-image-wrap img {
    width: 100%; left: 0;  }
  .archive-image-wrap img.landscape {
    height: 56.25%; top: 43.75%; }
  .trunk.project-stub { padding: 0 18px !important; }
  .project-stub header { margin: 90px auto; }
  .project-stub ol li { margin-bottom: 18px; }
  .about article { margin-bottom: 60px; }
}

@media screen and (max-width: 500px) {
  .S-1-1 { width: 100%; }
  .S-1-2 { width: 50%; }
  .S-1-4 { width: 25%; }
  body { padding-top: 174px; }
  body > header { padding-top: 55px; padding-bottom: 60px; }
  body > footer { margin-top: 60px; margin-bottom: 55px; }
}