html {
  font-size: 100%;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%; 
}
body {
  font-family: "Lucida Grande", "Lucida Sans Unicode", sans-serif; 
  margin: 0;
}

@media screen {
  html, body {
    height: 100%;
  }
  html {
    overflow-y: scroll;
  }
  body {
    font-size: 82%;
    color: #444545;
    background-color: #9b9d9e;
  }
}

@media only screen and (max-width: 479px) {
  body {
    font-size: 100%;
  }
}

@media screen {
  #wrapper {
    max-width: 910px;
    min-height: 100%;
    background-color: #f0f8f3;
    padding-left: 5%;
    padding-right: 10px;
    margin: 0 auto;
    -webkit-box-shadow: 3px 0px 5px rgba(80,80,80,0.4);
    -moz-box-shadow: 3px 0px 5px rgba(80,80,80,0.4);
    box-shadow: 3px 0px 5px rgba(80,80,80,0.4);
  }
}

@media only screen and (min-width: 891px) {
  #wrapper {
    padding-left: 72px;
    margin: 0 auto;
    -webkit-box-shadow: 3px 0px 5px rgba(80,80,80,0.4);
    -moz-box-shadow: 3px 0px 5px rgba(80,80,80,0.4);
    box-shadow: 3px 0px 5px rgba(80,80,80,0.4);
  }
}

@media only screen and (max-width: 639px) {
  #wrapper {
    padding-left: 10px;
  }
}


.nowrap { white-space: nowrap; }
.thinspace { margin-left: -0.17em; }

img { border: 0; }

p  { margin: 6px 0 12px 0; }

small small { font-size: 1em; }
.big { font-size: larger; }
.big .big { font-size: 1em; }

sub, sup {
  font-size: 82%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
sup { top: -0.34em; }
sub { bottom: -0.25em; }

.wordwrap {
  white-space: pre-wrap; /* css-3 */
  white-space: -moz-pre-wrap; /* Mozilla, FF2 und Camino2 aber nicht  */
  white-space: -pre-wrap; /* Opera 4-6 */
  white-space: -o-pre-wrap; /* Opera 7 */
  word-wrap: break-word; /* Internet Explorer 5.5+ */
}

.clearfix:after {
  visibility: hidden;
  display: block;
  font-size: 0;
  content: " ";
  clear: both;
  height: 0;
}

.hidden { display: none; }

.noview {
  height: 1px;
  width: 1px;
  margin: 0;
  padding: 0;
  overflow: hidden;
  line-height: 2;
  position: absolute;
}

a:active { outline: 0; }

span.rel-prev:before,
a[rel="prev"]:before, 
a.linkspfeil:before { content: "« "; }

span.rel-next:after,
a[rel="next"]:after, 
a.rechtspfeil:after { content: " »"; }

@media screen {
  .printonly { display: none; }
}

@media print {
  .noprint { display: none; }
  #cms_vorschau_label { display: none; }
}

.absatz hr { height: 1px; border: 0; border-top: 1px solid black; padding: 0; margin: 0 0 1em 0; color: white;  }

/* overrides extra padding on button elements in Firefox */
button::-moz-focus-inner,
input::-moz-focus-inner {
  padding: 0;
  border: 0;
}

del, .del { color: #BB0000; text-decoration: line-through; }
ins, .ins { color: #009900; text-decoration: underline; }
#header {
  max-width: 528px;
  padding: 48px 0 28px 252px;
  position: relative;
}

@media only screen and (max-width: 890px) {
  #header {
    max-width: 95%;
    padding: 68px 0 28px 0;
  }
  #js.menuopen #header,
  #nojs:target #header {
    display: none;
  }
}

@media only screen and (max-width: 639px) {
  #header {
    max-width: none;
  }
}

@media print {
  #header {
    height: auto; 
    padding-bottom: 2em;
    border-bottom: 1px solid silver;
  }
}

#header .max-width-box {
  max-width: 316px;
}

#header .responsive-box {
  padding-bottom: 43.670886075949%;
}


#trennlinie {
  max-width: 780px;
  margin: 0;
  opacity: 0.7;
}

@media only screen and (max-width: 890px) {
  #trennlinie {
    max-width: 95%;
  }
}

@media only screen and (max-width: 639px) {
  #trennlinie {
    max-width: none;
  }
}

.id1351080528 #header,
.id1351080528 #trennlinie {
  display: none;
}

@media only screen and (max-width: 479px) {
  .id1351080528 #header,
  .id1351080528 #trennlinie {
    display: block;
  }
}


@media print {
  #header img { margin: 0; }
  #trennlinie {
    max-width: none;
    opacity: 0.7;
  }
}
#nojs #hero {
  display: none;
}


#hero {
  max-width: 780px;
  padding-top: 66px;
}

@media only screen and (max-width: 890px) {
  #hero {
    max-width: 95%;
  }
}

@media only screen and (max-width: 639px) {
  #hero {
    max-width: none;
  }
}

@media only screen and (max-width: 479px) {
  .id1351080528 #hero {
    display: none;
  }
}

#hero .responsive-box {
  padding-bottom: 51.282051%;
}

#js .fadeshow {
  position: absolute;
  width: 100%;
  height: 100%;
  overflow: hidden; /* zum Clippen der zoomenden Frames */
}


#js .fadeshow img { /* transform 7.5s 0.5s <- die ersten 0.5s der Überblendung erfolgen ohne Skalierung */
  -webkit-transition: opacity 1.5s linear, -webkit-transform 8s;
  transition: opacity 1.5s linear, transform 8s;
}


#js .fadeshow img.fadeout:nth-child(odd) {
  opacity: 0;
  -webkit-transform: scale(1.03);
  transform: scale(1.03);
}

#js .fadeshow img.fadein:nth-child(odd) {
  opacity: 1;
  -webkit-transform: scale(1.0);
  transform: scale(1.0);
}


#js .fadeshow img.fadeout:nth-child(even) {
  opacity: 0;
  -webkit-transform: scale(1.0);
  transform: scale(1.0);
}

#js .fadeshow img.fadein:nth-child(even) {
  opacity: 1;
  -webkit-transform: scale(1.03);
  transform: scale(1.03);
}
.menu-button {
  color: white;
  background-color: #00325e;
  text-align: right;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  z-index: 99;
  display: none;
}

@media only screen and (max-width: 890px) {
  .menu-button {
    display: block;
  }

  #js.menuopen .menu-button span {
    display: none;
  }

  #js.menuopen .menu-button a:after {
    content: ' × ';
  }
}

.menu-button a {
  color: inherit;
  text-transform: uppercase;
  text-decoration: none;
  display: inline-block;
  padding: 6px 10px;
}

.menu-button a:hover {
  opacity: 0.8;
}

@media print {
  .menu-button { display: none; }
}
/* --------------------- Container -----------------------*/

.verticalnavi {
  position: absolute;
  width: 228px;
  padding: 47px 0 0 0;
  line-height: 36px;
}


@media only screen and (max-width: 890px) {
  .verticalnavi {
    background-color: inherit;
    top: 0;
    left: 0;
    width: 100%;
    font-size: 1.3em;
    line-height: 2.5;
    min-height: 100%;
    padding-top: 57px;
    padding-left: 80px;
    padding-bottom: 47px;
    box-sizing: border-box;
    z-index: 98;
    display: none;
  }

  #js.menuopen .verticalnavi,
  #nojs:target .verticalnavi {
    display: block;
  }
}

@media only screen and (max-width: 479px) {
  .verticalnavi {
    font-size: 1.1em;
    padding-left: 70px;
  }
}


@media print {
  .verticalnavi { display: none; }
}

/* ---------------------- UL-Tags ----------------------- */

.verticalnavi,
.verticalnavi ul {
  list-style-type: none;
  margin: 0;
}

.verticalnavi ul {
  padding: 0;
}

/* ---------------------- LI-Tags ------------------------ */

.verticalnavi ul li { padding-left: 12px; }

.verticalnavi li.curdir:before {
  content: url(files/Layout/BuEroklammer.png?ver=1351081516);
  display: block;
  position: absolute;
  left: -78px;
  margin-top: 7px;
}

@media only screen and (max-width: 890px) {
  .verticalnavi li.curdir:before {
    left: -3px;
    margin-top: 5px;
  }
}

/* ---------------------- A-Tags ------------------------ */

.verticalnavi a { 
  text-decoration: none;
  font-weight: bold;
}

.verticalnavi ul a {
  font-weight: normal;
}

/* --------------------- Link-Farben --------------------- */

.verticalnavi a { color: #00325e; }
.verticalnavi ul a { color: #9b9d9e; }

/* -------------------- Hover-Farben ---------------------*/

.verticalnavi a:hover { color: #9b9d9e; }
.verticalnavi ul a:hover { color: #444545; }

/* -------------------- Active-Farben ---------------------*/

.verticalnavi a:active  { color: #00325e; }
.verticalnavi ul a:active { color: #9b9d9e; }


/* ---------------------- Spezial-Tags ------------------------ */

.verticalnavi a span {
  display: inline-block;
  line-height: 24px;
  padding-top: 6px;

  padding-left: 12px; /* hiermit Einrückung der 2. Zeile steuern */
  text-indent: -12px;
}

#content {
  line-height: 24px;
  max-width: 528px;
  padding: 47px 0 30px 252px;
}

@media only screen and (max-width: 890px) {
  #content {
    max-width: 95%;
    padding: 4% 0 30px 0;
  }
  #js.menuopen #content,
  #nojs:target #content {
    display: none;
  }
}
@media only screen and (max-width: 639px) {
  #content {
    max-width: none;
  }
}

.up-link a, .logout-link,
.user-content a            { color: #00325e; }
.user-content a:visited { color: #8698a8; }
.up-link a:hover, .logout-link:hover,
.user-content a:hover { color: #4c769c; }
.up-link a:active, .logout-link:active,
.user-content a:active { color: #00325e; }

@media print {
  #content {
    max-width: none;
    padding: 2em 0 0 0;
  }
  .user-content a,
  .user-content a:visited,
  .user-content a:hover,
  .user-content a:active { color: black; text-decoration: underline; }
  #content a[href^="http"]:after { content: " <"attr(href)">"; }
  #content .notprinturl a[href^="http"]:after,
  #content a[href^="http"].notprinturl:after { content: ""; }
}
.up-link,
.logout-link { float: right; }

h1, h2, h3, h4, h5, h6 { 
  line-height: 24px;
  font-size: 100%;
  margin: 0 0 12px 0;
}

h1 { 
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-top: 5px;
}

h1,
.tblue, 
.kanzlei-partner h2 {
  color: #00325e;
}

h2 { 
  margin-top: 24px;
}

h1.noview + h2 { 
  margin-top: 6px;
}

.nowrap h2 { white-space: normal; }
.absatz ul, .absatz ol {
  padding-top: 0; 
  margin-top: 0; 
  padding-bottom: 0; 
  margin-bottom: 12px;
}

.listemptyline > li {
  margin-bottom: 12px;
}

.blindlist,
ul.user-content,
.user-content ul {
  list-style: none;
  margin-left: 0;
  padding-left: 0;
}

.user-content ul li {
  padding-left: 24px;
  position: relative;
}

.includearea .box-sub h2:before, /* siehe Maske "Architektenrecht" */
.user-content ul li:before {
  content: '■';
  position: absolute;
  left: 0;
  color: #00325e;
  font-family: Arial, sans-serif; /* sonst werden die Bullits unter Mac und Win unterschiedlich groß */
  font-size: 1.1em;
  line-height: 24px;
}

.absatz table {
  margin: 0 0 12px 0; 
  border-collapse: collapse;
}

.absatz th,
.absatz td  {
  vertical-align: top;
  padding: 6px 0;
  min-width: 68px;
}

.absatz th {
  text-align: left; 
  font-weight: normal;
}

table.width100,
.width100 table { width: 100%; }

.alignright th,
.alignright td  { text-align: right; }

@media print {
  .absatz th { font-weight: bold; }
}


.responsive-box {
  height: 0;
  position: relative;
}

.responsive-box img {
  position: absolute;
  width: 100%;
  height: 100%;
}

.bild img {
  width: auto;
  max-width: 100%;
  height: auto;
}
/* Porträtfotos Startseite */

#loc-1 > span {
  display: inline-block;
  margin-right: 16px;
}

#loc-1 .portrait {
  margin-top: 1.5em;
}

#loc-1 .caption {
  display: block;
}

@media only screen and (max-width: 639px) and (min-width: 360px) {
  #loc-1 > span {
    display: block;
    margin-top: 0.5em;
    margin-right: 0;
  }
  #loc-1 .portrait {
    display: inline-block;
    margin-right: 24px;
    vertical-align: bottom;
  }
  #loc-1 .caption {
    display: inline-block;
  }
}
#kontaktliste {
  padding: 0;
  margin: 17px 0 0 0;
  list-style-type: none;
  width: 42em;
}

#kontaktliste li {
  margin: 16px 0;
}

#kontaktliste li:target {
  padding: 11px 0 4px 11px;
  border: 1px solid #cad7c6;
  background-color: #e9f0e8;
  margin-left: -12px;
}

.portrait { /* .portrait wird auch woanders (u.a. Startseite) verwendet */
  display: inline-block;
  width: 160px;
  height: 120px;
  background-repeat: no-repeat;
  overflow: hidden;
}

.portrait img {
  width: 100%;
  height: 100%;
}

#kontaktliste .portrait {
  vertical-align: bottom;
  width: 160px;
  height: 120px;
}

#kontaktliste .kontakt {
  display: inline-block;
  max-width: 340px;
  margin-left: 24px;
  vertical-align: bottom;
}

@media only screen and (max-width: 639px) {
  #kontaktliste {
    width: auto;
  }
  #kontaktliste .kontakt {
    display: block;
    max-width: none;
    margin-left: 0;
    margin: 0.6em 0 1.9em 0;
  }
}

.kanzlei-partner h2,
.kanzlei-partner h3 {
  margin-bottom: 0;
}

.kanzlei-partner h2+p,
.kanzlei-partner h3+p {
  margin-top: 0;
}

.empfang > div {
  display: inline-block;
  vertical-align: top;
}

.empfang > div:nth-child(odd) {
  margin-right: 24px;
}

.standort {
  margin-bottom: 36px;
}

.standort h2 {
  text-transform: uppercase;
  letter-spacing: 1px;
}

.standort .anfahrtlink {
  float: right;
}

.impressumlink {
  margin-top: 1.5em;
}


.only-handy {
  display: none;
}

@media only screen and (max-width: 359px) {
  .no-handy {
    display: none;
  }
  .only-handy {
    display: inline;
  }
}

.only-tablet {
  display: none;
}

@media only screen and (max-width: 890px) {
  .only-tablet {
    display: inline-block;
  }
}
.impressum .vcard {
  margin-bottom: 11px;
}

.impressum #copyright,
.impressum #copyright a {
  color: gray;
  font-style: italic;
}
.impressum #copyright a  { text-decoration: none; }
.impressum #copyright a:hover { text-decoration: underline; }

@media print {
  .impressum #anfahrtlink { display: none; }
  .impressum #copyright a { color: black; text-decoration: underline; font-style: normal; display: block; margin-top: 1em; }
}

