@charset "utf-8";

/* ===== FONTS ===== */

@font-face {
 font-family: 'Lora';
 font-weight: normal;
 font-style: normal;
 font-display: fallback;
 src: url('../fonts/LoraRegular-webfont.eot');
 src: local('Lora Regular'),
  url('../fonts/LoraRegular-webfont.woff2') format('woff2'),
  url('../fonts/LoraRegular-webfont.woff') format('woff'),
  url('../fonts/LoraRegular-webfont.ttf') format('truetype'),
  url('../fonts/LoraRegular-webfont.svg#Lora') format('svg');
}

@font-face {
 font-family: 'Lora';
 font-weight: bold;
 font-style: normal;
 font-display: fallback;
 src: url('../fonts/LoraBold-webfont.eot');
 src: local('Lora Bold'),
  url('../fonts/LoraBold-webfont.woff2') format('woff2'),
  url('../fonts/LoraBold-webfont.woff') format('woff'),
  url('../fonts/LoraBold-webfont.ttf') format('truetype'),
  url('../fonts/LoraBold-webfont.svg#Lora') format('svg');
}

@font-face {
 font-family: 'Lora';
 font-weight: normal;
 font-style: italic;
 font-display: fallback;
 src: url('../fonts/LoraItalic-webfont.eot');
 src: local('Lora Italic'),
  url('../fonts/LoraItalic-webfont.woff2') format('woff2'),
  url('../fonts/LoraItalic-webfont.woff') format('woff'),
  url('../fonts/LoraItalic-webfont.ttf') format('truetype'),
  url('../fonts/LoraItalic-webfont.svg#Lora') format('svg');
}

@font-face {
 font-family: 'Lora';
 font-weight: bold;
 font-style: italic;
 font-display: fallback;
 src: url('../fonts/LoraBoldItalic-webfont.eot');
 src: local('Lora Bold Italic'),
  url('../fonts/LoraBoldItalic-webfont.woff2') format('woff2'),
  url('../fonts/LoraBoldItalic-webfont.woff') format('woff'),
  url('../fonts/LoraBoldItalic-webfont.ttf') format('truetype'),
  url('../fonts/LoraBoldItalic-webfont.svg#Lora') format('svg');
}

@font-face {
 font-family: 'DCJVIconFont';
 font-weight: normal;
 src: url('../fonts/IconFont-webfont.eot');
 src: local('☺'),
  url('../fonts/IconFont-webfont.woff2') format('woff2'),
  url('../fonts/IconFont-webfont.woff') format('woff'),
  url('../fonts/IconFont-webfont.ttf') format('truetype'),
  url('../fonts/IconFont-webfont.svg#webfontregular') format('svg');
}

/* =========================== */
/* == Core html setup stuff == */
/* =========================== */

/* =========================== */
/* @copyright  Copyright (C) 2018 Jasper Habicht.  */
/* @license    Creative Commons CC BY-SA 3.0 DE.   */
/* =========================== */

/* ===== RESET TO DEFAULT ===== */

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;
 font-variant: normal;
 box-sizing: border-box;
}

datalist {
 display: none;
}

ol, ul {
 list-style: none;
}

/* ===== */

h1, h2 {
 font-size: 150%;
 line-height: 150%;
 font-weight: 700;
 margin-bottom: 15px;
}

h3, h4, h5 {
 margin-top: 20px;
 font-weight: 700;
}

p, ul li {
 margin-top: 10px;
}

strong, b {
 font-weight: 700;
}

em, i {
 font-style: italic;
}

sub {
 vertical-align: sub;
 font-size: 80%;
 line-height: 1em;
 padding: 0 0.2em;
}

sup {
 vertical-align: super;
 font-size: 80%;
 line-height: 1em;
 padding: 0 0.2em;
}

ul li {
 padding-left: 20px;
 text-indent: -10px;
}

ul li::before {
 display: inline-block;
 width: 10px;
 content: '—';
}

ol {
 counter-reset: ol-li;
}

ol li::before {
 display: inline-block;
 width: 2em;
 counter-increment: ol-li;
 content: counters(ol-li,'.') '.\00a0';
}

a {
 color: rgb(153,0,0);
 text-decoration: none;
}

a:focus, a:hover {
 text-decoration: underline;
}

blockquote, q {
 quotes: none;
}

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

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

img {
 border: 0;
 max-width: 100%;
}

hr {
 border: none;
 border-top: 1px solid #CCC;
 margin: 20px 0;
}

/* ===== */

fieldset {
 font-weight: normal;
}

input, textarea, select,
.visform input, .visform textarea, .visform select {
 display: inline-block;
 font-size: inherit;
 font-family: inherit;
 box-sizing: border-box;
 padding: 2px;
 border: 1px solid #CCC;
 width: 100%;
}

input[type=checkbox], input[type=radio] {
 height: 1.5em;
 width: 1.5em;
 margin-right: 0;
 margin-left: 0;
 padding: 0;
}

aside input, aside textarea, aside select {
 width: 100%;
}

label, .visCSSlabel {
 display: block;
 width: 100%;
 margin-right: 0;
 font-weight: normal;
}

label.label-hidden, .visCSSlabel.label-hidden {
 display: none;
}

legend {
 font-weight: normal;
}

input[type=submit], button {
 padding: 2px 5px;
 border: 1px solid #CCC;
 border-radius: 3px;
 box-shadow: inset 0px 1px 1px #fff;
 background-image: linear-gradient(#EEE,#DDD);
 cursor: pointer;
}

input[type=submit], button[type=submit] {
 font-family: 'Lora', 'Georgia', 'Songti SC', '宋体-简', 'SimSun', '宋体', serif;
 font-size: 16px;
 line-height: 24px;
 width: 100%;
 margin-top: 30px;
 margin-bottom: 10px;
}

.popover {
 display: none !important;
}

/* ===== */

::-moz-selection {
 color: white;
 background: rgb(51,51,51);
}

::selection {
 color: white;
 background: rgb(51,51,51);
}

/* ===== START ===== */

html {
 voice-family: female;
 margin: 0;
 padding: 0;
 height: 100%;
}

head {
 speak: none;
}

body {
 position: relative;
 width: 100%;
 margin: 30px 0 70px;
 padding: 0;
 font-family: 'Lora', 'Georgia', 'Songti SC', '宋体-简', 'SimSun', '宋体', serif;
 color: rgb(51,51,51);
 font-size: 16px;
 -webkit-text-size-adjust: none;
 line-height: 24px;
 text-align: left;
 text-transform: none;
}

/* accessibility styling (display: none wont't show up) */

.access {
 position: absolute !important;
 top: -9999px !important;
 left: -9999px !important;
}

.clear {
 clear: both;
}

/* ===== */

header, footer, #contents {
 position: relative;
 max-width: 1000px;
 margin: 0 auto;
 padding: 0 25px;
}

#banner-wrapper {
  float: none;
  width: 100%;
  padding: 0 25px;
  background-image: linear-gradient(#EEE, transparent 75px);
}

#banner {
 position: relative;
 max-width: 950px;
 margin: 0 auto;
 padding: 0;
}

#head {
 margin: 30px auto 0;
 height: 90px;
 border-left: solid 5px rgb(153,0,0);
 padding: 10px 0 10px 15px;
}

#foot {
 margin: 0 auto;
 padding: 10px 0;
}

#subfoot {
 margin: 0 auto;
 margin-top: 30px;
 padding-top: 20px;
 /* border-top: 1px solid #ccc; */
}

#logo {
 font-size: 150%;
 line-height: 150%;
 font-weight: 700;
 color: rgb(153,0,0);
}

#logo h1 {
 font-size: 100%;
 line-height: 150%;
 margin-bottom: 0;
}

#logo a:hover {
 text-decoration: none;
}

#logo img {
 float: left;
 height: 70px;
 padding-right: 20px;
}

#controls-container {
 position: absolute;
 margin: -55px auto 0;
 width: 100%;
}

#controls {
 display: block;
 position: relative;
 height: 45px;
 margin: 0 auto;
 padding: 0 5px;
}

#controls ul.nav {
 position: absolute;
 display: inline-block;
 right: 5px;
 z-index: 999;
}

header p, footer p {
 margin: 0;
}

header nav {
 display: block;
 position: relative;
 height: 45px;
 margin: 0 auto;
 border-left: solid 5px rgb(153,0,0);
 z-index: 10;
 font-weight: 700;
}

button.menu-toggle {
 display: none;
}

nav ul, #controls ul {
 height: 100%;
 padding: 0px;
 margin: 0px;
}

header nav ul {
 background-color: rgba(255,255,255,.85);
}

nav ul li::before, #controls ul li::before {
 content: none;
}

nav ul li, #controls ul li {
 margin: 0px;
 text-indent: 0px;
}

header nav li, ul.nav li {
 display: inline-block;
 height: 45px;
 padding: 10px 5px 10px 15px;
 vertical-align: top;
 overflow: hidden;
}

#controls ul.nav li {
 padding: 10px 0 10px 10px;
 text-align: right;
}

header nav li ul {
 display: block;
 position: absolute;
 overflow: hidden;
 visibility: hidden;
 top: 45px;
 left: 0;
 width: 100%;
 height: auto;
 padding-left: 5px;
 margin: 0 auto;
 color: rgb(51,51,51);
}

header nav li:hover ul, header nav li:focus ul, header nav li ul.focus {
 visibility: visible;
}

header nav li ul li,
header ul.nav li ul li {
 padding: 10px;
}

header #navigation.fixed {
 position: fixed;
 z-index: 99;
 top: 0;
 width: 100%;
 max-width: 950px;
 margin: 0 auto;
}

header #navigation.fixed #wrapper {
 width: 100%;
 margin: 0 auto;
 max-width: 950px;
}

header #navigation.fixed + #nav-distance {
 height: 45px;
}

header #navigation.fixed li ul {
 left: -5px;
 padding-left: 5px;
 border-left: solid 5px rgb(153,0,0);
 box-sizing: content-box;
}

.icon {
 height: 25px;
 width: 25px;
}

.icon a {
 left: 25px;
 color: transparent;
}

.icon a::before {
 display: inline-block;
 width: 45px;
 height: 45px;
}

button.menu-toggle {
 display: none;
 border: none;
 background: none;
 cursor: pointer;
 height: 45px;
 margin-left: 10px;
 font-family: 'Lora', 'Georgia', 'Songti SC', '宋体-简', 'SimSun', '宋体', serif;
 font-size: 16px;
 line-height: 24px;
 font-weight: bold;
 color: rgb(153,0,0);
}

.icon a::before, button.menu-toggle::before {
 display: inline-block;
 font-size: 24px;
 font-family: 'DCJVIconFont';
 font-weight: normal;
 color: rgb(153,0,0);
}

.icon.home a::before {
 content: '\F200';
}

.icon.language a::before {
 content: '\F320';
}

.icon.search a::before {
 content: '\F210';
}

.menu-toggle::before {
 content: '\F208';
 padding-right: 10px;
 vertical-align: bottom;
}

#banner {
 border-left: solid 5px rgb(153,0,0);
}

#banner div {
 position: relative;
 max-height: 250px;
 margin: 0 auto;
 overflow: hidden;
}

#banner .home, #banner .home div {
 max-height: 500px;
 min-height: 250px;
 background-color: #333;
}

#banner .home div, #banner .home div p {
  display: flex;
}

#banner img {
 display: block;
 width: 100%;
 height: auto;
 margin-top: -5%;
 object-fit: cover;
}

#banner .home p, #banner .home img {
  margin: 0;
}

#banner .home img {
 filter: sepia(0.25);
}


#banner .home p:first-child::before,
#banner .home p:first-child::after {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  content: '';
}

#banner .home p:first-child::after {
  background-image: linear-gradient(rgba(153,0,0,0), rgba(153,0,0,.5));
}

#banner .claim {
 position: absolute;
 bottom: 0;
 padding: 10px 20px;
 font-size: 400%;
 line-height: 150%;
 font-weight: 400;
 color: rgb(255,255,255);
 text-shadow: 0px 0px 15px rgba(0,0,0,1), 0px 0px 35px rgba(153,0,0,1);
}

#banner .claim h2 {
 font-size: 100%;
 line-height: 150%;
}

#contents {
 margin: 0 auto;
 padding: 30px 25px;
}

#contents section {
 float: left;
 width: 67%;
}

#contents .pull-right {
 max-width: 33%;
 float: right;
 margin-top: 1em;
 margin-bottom: 1em;
 margin-left: 1em;
}

#contents .pull-left {
 max-width: 33%;
 float: left;
 margin-top: 1em;
 margin-bottom: 1em;
 margin-right: 1em;
}

#contents .pull-center {
 max-width: 100%;
 margin-top: 1em;
 margin-bottom: 1em;
}

#contents figcaption {
 font-size: 80%;
 line-height: 1.2em;
}

.blog div.item, .blog div.blog-item, .blog .items-leading {
 margin-bottom: 50px;
}

.blog .item h2, .blog .blog-item h2, .blog .items-leading h2 {
 font-size: 120%;
 line-height: 120%;
 font-weight: 700;
 margin-bottom: 10px;
}

ul.category-module div {
 font-weight: bold;
}

ul.category-module > li {
 text-indent: 0;
 padding-left: 0;
}

ul.category-module > li::before {
 content: none;
}

table.category .list-title {
 padding-bottom: 20px;
 font-weight: 700;
}

.com-content-categories__item {
  border-bottom: none;
}

#login-form ul.unstyled {
 margin-top: 10px;
 font-size: .8em;
 line-height: 1.5em;
}

#login-form ul.unstyled li {
 text-indent: 0;
 padding: 0;
 margin: 0;
}

#login-form ul.unstyled li::before {
 content: none;
}

aside {
 float: right;
 width: 33%;
 padding-left: 30px;
}

footer .nav {
 border-left: solid 5px rgb(153,0,0);
}

.quick-search-label {
 display: none;
}

.law-collection li {
 padding-left: 0;
 text-indent: 0;
 border-top: 1px solid rgba(0,0,0,.25);
 padding-top: 5px;
}

.law-collection li::before {
 display: none;
 content: '';
 width: 0;
}

.law-collection .row {
 display: table;
 padding-left: 20px;
 width: 100%;
 font-size: .8em;
}

.law-collection .field {
 display: table-row;
}

.law-collection .label {
 display: table-cell;
 width: 35%;
 opacity: .5;
}

.law-collection .value {
 display: table-cell;
}

.law-collection .description {
 padding-left: 20px;
 font-size: .8em;
}

/* ===== */

form .control-group {
 position: relative;
}

form .control-group .control-label, form .control-group .controls {
 display: inline;
}

form .controls a[title=Abbrechen] {
 display: none;
}

form .control-group .control-label label {
 margin-top: 10px;
}

form .control-group.sameline .control-label {
 float: left;
 width: calc(100% - 50px);
 margin-top: 10px;
}

form .control-label .spacer label {
 width: 100%;
 margin-top: 0;
 margin-bottom: 10px;
}

form .star {
 color: #900;
}

#form-login-remember {
 margin-top: 10px;
}

.visCSSinput {
 margin-top: 0;
}

.visBtnCon {
 margin: 0;
}

.visform div[class^=field] {
 position: relative;
}

label.error {
 display: inline-block !important;
 font-size: .8em;
 line-height: 1.5em;
 color: #fff;
 padding: 10px;
 background-color: rgba(0,0,0,.75) !important;
 border-radius: 5px;
 width: 300px;
 max-width: none !important;
 margin-left: 0;
 position: absolute;
 bottom: 30px;
 left: 0;
}

.sameline label.error {
 bottom: 0px;
}

.visform .errorcontainer label.error {
 bottom: -10px;
}

.visform .errorcontainer::after {
 content: none;
}

label.error::after {
 content: '';
 width: 0;
 height: 0;
 display: block;
 margin-left: 10px;
 border-top: 12px solid rgba(0,0,0,.75);
 border-right: 12px solid transparent;
 border-left: 12px solid transparent;
 position: absolute;
 bottom: -12px;
}

input.invalid,
.visform input.error, .visform textarea.error, .visform select.error {
 border: 1px solid #900 !important;
}

label.invalid {
 color: #000;
}

input.no-label, textarea.no-label, select.no-label {
 margin-top: 5px;
}

input.label-sameline, #login-form input[type=checkbox] {
 float: right;
}

.sameline input.label-sameline {
 margin-top: 10px;
}

label.label-sameline {
 display: inline-block;
 width: calc(100% - 50px);
}

.visCustomText {
 display: inline;
 float: left;
 margin-top: 10px;
 font-size: 1em;
 width: calc(100% - 50px);
}

p.label-sameline {
 display: inline;
}

#visformcontainer .vis_mandatory {
 color: #000;
 font-size: inherit;
 font-weight: normal;
}

#visformcontainer .vis_mandatory::after {
 content: none;
}

#visformcontainer form div.required > label.visCSSlabel::after {
 color: #900;
 padding-left: 5px;
}

#visformcontainer .errorcontainer {
 position: absolute;
}

.icons .btn-group {
 display: none;
}

/* ===== */


@media only screen and (max-width: 1050px) {

 header, footer, #contents {
  width: 100%;
 }

}


@media only screen and (max-width: 965px) {

 header #navigation.fixed {
  right: 0;
  padding: 0 25px;
 }

 header #navigation nav {
  height: auto;
 }

 #banner .claim {
   font-size: 325%;
 }

}


@media only screen and (max-width: 700px) {

 body {
  font-size: 90%;
 }

 header, #banner, footer, #contents {
  width: 320px;
  padding: 0 10px;
  margin: auto;
 }

 #navigation {
  border-left: solid 5px rgb(153,0,0);
 }

 #head {
  height: 170px;
 }

 #logo img {
  float: none;
 }

 button.menu-toggle {
  display: inline-block;
 }

 header #navigation.fixed {
   padding: 0;
 }

 header #navigation nav#mainnav {
  height: 0;
  padding-left: 15px;
  border: none;
  overflow: hidden;
 }

 header #navigation nav#mainnav.expanded {
  height: auto;
 }

 header #navigation nav#mainnav ul {
  padding-bottom: 10px;
 }

 header nav li, ul.nav li {
  display: block;
  padding: 5px 0;
  height: auto;
 }

 header nav li ul, header ul.nav li ul {
  position: relative;
  visibility: visible;
  top: 0px;
 }

 header nav li ul li, header ul.nav li ul li {
  padding: 0px 10px;
 }

 header #navigation.fixed {
  position: relative;
 }

 header #navigation.fixed + #nav-distance {
  height: 0px;
 }

 #banner {
  width: 300px;
  padding: 0;
 }

 #banner div {
  max-height: 125px;
 }

 #banner div.home, #banner div.home div {
  max-height: 175px;
  min-height: 0px;
 }

 #banner .claim {
  font-size: 150%;
  font-weight: 700;
 }

 #contents {
  margin: 20px auto;
 }

 #contents section, aside {
  float: none;
  width: 100%;
  padding-left: 0;
 }

 footer .nav {
  padding-left: 15px;
 }

}