@charset "UTF-8";
/*  Reset
*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline; }

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block; }

body {
  line-height: 1; }

ol, ul {
  list-style: none; }

blockquote, q {
  quotes: none; }

blockquote:before, blockquote:after, q:before, q:after {
  content: '';
  content: none; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

/*  Variables
*/
/*  Allgemeine Stile
*/
body {
  padding: 40px;
  max-width: 1700px;
  font-family: Arial, Helvetica, "sans-serif";
  font-size: 12px;
  line-height: 22px; }

h1 {
  font-weight: bold;
  margin-bottom: 10px; }

h2 {
  font-weight: bold; }

p {
  margin-bottom: 10px; }

a {
  color: black;
  text-decoration: none;
  outline: 0; }

br.clear-all {
  display: inline;
  clear: both; }

img {
  width: 100%;
  height: auto; }

.clear {
  clear: both; }

header {
  margin-bottom: 50px; }
  header nav {
    margin-top: 15px; }
  header ul {
    padding: 0;
    display: table;
    width: 100%;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box; }
    header ul li {
      display: table-cell;
      text-transform: uppercase; }
      header ul li:nth-child(2n) {
        text-align: center; }
      header ul li:nth-child(3n) {
        text-align: right; }
      header ul li a.active {
        color: #646464; }

main div.text table td.col-date {
  width: 80px; }

main nav.project-navigation.sticky {
  /*
            zurzeit nicht benutzt 
            
            position: fixed;
            width: 100%;
            left: 0;
            top: 0;
            z-index: 100;
            border-top: 0;
            */ }

main nav.project-navigation ul {
  list-style-type: none;
  padding: 0;
  margin: 0 0 10px 0; }

main div.project-info {
  padding-right: 50px; }

main .project-gallery div a,
main .project-details div a {
  display: block;
  padding: 7px 10px; }

main .project-gallery div a img {
  filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale");
  /* Firefox 3.5+ */
  filter: gray;
  /* IE6-9 */
  -webkit-filter: grayscale(100%);
  /* Chrome 19+ & Safari 6+ */ }

main .project-gallery div a:hover img,
main .project-gallery div a.hover img {
  filter: none;
  -webkit-filter: grayscale(0%); }

footer {
  margin-top: 80px; }
  footer a {
    margin-right: 20px; }

/*  Aussehen der Galerie / chocolat.js
*/
.chocolat-overlay {
  opacity: 1; }

.chocolat-bottom {
  display: none; }

/*  Größer als 568px
*/
@media (min-width: 568px) {
  .hide-on-larger-567px {
    display: none; } }

/*  Größer als 768px
*/
@media (min-width: 768px) {
  header div.logo {
    padding: 0 50px 0 0; }
  header nav {
    margin: 0;
    padding: 0 7px; }
  header .clear {
    display: none; } }

/*  Kleiner als 567px
*/
@media (max-width: 567px) {
  main div.project-info {
    padding-right: 0; }
  main .project-gallery div a,
  main .project-details div a {
    padding: 7px 0; } }

/*# sourceMappingURL=main.css.map */