.border
{
    
  border: 1px solid #d0d0d0;
  background: #f7f7f7;
  padding: 10px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.08);
  text-align: center;
}

@font-face {
  font-family: 'Open Sans';
  src: url('../font/opensans-bold-webfont.woff2') format('woff2'),
       url('../font/opensans-bold-webfont.woff') format('woff');
  font-weight: 700;
  font-style: normal;
}

@font-face {
  font-family: 'Open Sans';
  src: url('../font/opensans-bolditalic-webfont.woff2') format('woff2'),
       url('../font/opensans-bolditalic-webfont.woff') format('woff');
  font-weight: 700;
  font-style: italic;
}

@font-face {
  font-family: 'Open Sans';
  src: url('../font/opensans-italic-webfont.woff2') format('woff2'),
       url('../font/opensans-italic-webfont.woff') format('woff');
  font-weight: 400;
  font-style: italic;
}

@font-face {
  font-family: 'Open Sans';
  src: url('../font/opensans-regular-webfont.woff2') format('woff2'),
       url('../font/opensans-regular-webfont.woff') format('woff');
  font-weight: 400;
  font-style: normal;
}


.im-breadcrumbs h6{
  margin: 0;
  font-weight: 400 !important;
}

.im-breadcrumbs a{
  font-weight: 400 !important;
}

.im-breadcrumbs .current{
  font-weight: 700 !important;
}

html {
	overflow-y:scroll;
}

body {
	background: none repeat scroll 0 0 #e4e2dd;
	font-size: 20px;
	font-family: "Open Sans", Arial, sans-serif;
	color: #2b2b2b;
}

h1, h2, h3, h4, h5, h6 {
	color: #3a3a3a;
	font-weight: normal;
	line-height: 1.3;
	margin: 0.5rem 0;
}

h1 { font-size: 1.6rem; }
h2 { font-size: 1.5rem; font-weight: 500; }
h3 { font-size: 1.4rem; }
h4 { font-size: 1.3rem; font-weight: 500; }
h5 { font-size: 1.2rem;}
h6 { font-size: 0.8rem; }

a, a:link, a:visited, a:hover, a:active {
	text-decoration: none;
	color: #2b2b2b;
	transition: color 0.20s linear 0s;
	-o-transition: color 0.20s linear 0s;
	-ms-transition: color 0.20s linear 0s;
	-moz-transition: color 0.20s linear 0s;
	-webkit-transition: color 0.20s linear 0s;
}

a:hover {
	color: #0f0f0f;
}

:target {
  display: block;
  position: relative;
  top: -120px; 
  visibility: hidden;
}

p, li, dl, blockquote, table, kbd {
	font-size: 1.0rem;
	line-height: 1.6;
}

hr {
	border: 0;
	border-top: 1px solid #b8b3aa;
	clear: both;
	height: 0;
	margin: 0.5rem auto;
}

nav {	background: #3b4a3e; }

.top-nav ul ul { background-color: #3b4a3e; }
.top-nav li a { padding:0.5rem 1rem; color: #f2f2ef; }
.top-nav li ul li a { background-color:  #3b4a3e; }
.top-nav li a:hover, .aside-nav li a:hover { background-color: #566a5b; }
.top-nav .active-item a { background: #2b362e; }

@media screen and (max-width:768px) {
	.top-nav li a {	background: none repeat scroll 0 0 #425246; }
	.top-nav li a { color: #f2f2ef; }
	.top-nav li a:hover { background: none repeat scroll 0 0 #3b4a3e; color: #f2f2ef; }
	.top-nav li ul li a { background: none repeat scroll 0 0 #46594b; }
	.top-nav li ul li ul li a { background: none repeat scroll 0 0 #2f3d33; }
	.nav-text { color: #f2f2ef; }
}

.aside-nav-noresponsee ul {
	margin:0;
	padding:0;	
}

.aside-nav-noresponsee li {
	list-style-type:none;	
}

.aside-nav-noresponsee li a:link,
.aside-nav-noresponsee li a:visited {
	display:block;
	padding:0.3rem 0.5rem;
	background-color:#e7e4dd;
	color:#273027;
}

.aside-nav-noresponsee li ul li a:link {
	padding-left:2.5rem;
}

.aside-nav-noresponsee li a:hover,
.aside-nav-noresponsee li ul li.menu-current a {
	background-color:#d7d2c8;
	color:#1f1f1f;
}

.headerpic img {
	display:block;
}

/* Transparenter Header/Content/Footer - ohne Animationen */
header .line,
section .line,
footer .line {
    background-color: rgba(255, 255, 255, 0.0) !important;
    padding:0 !important;
}

.logo {
	padding:2rem;
}

.wbcesuche {
	padding:0.5rem 1.5rem;
}

.wbcesuche input[type=text] {
	background-color:transparent;
	border:0;
	border-bottom:1px solid #f2f2ef;
	color:#f2f2ef;
}

.wbcesuche input[type=submit] {
	font-family:sli;
	border:0;
	background-color:transparent;
	color:#f2f2ef;
}

::placeholder {color:#f2f2ef;}
:-ms-input-placeholder {color:#f2f2ef;}
::-ms-input-placeholder  {color:#f2f2ef;}

h1#contentstart {
	margin-top:-0.5rem;
}

.maincontent p, .maincontent li {
	padding-bottom:0.5em;
}

.maincontent li ul, .maincontent li ol {
	padding-top:0.5em;
}

.back-to-top {
	position:fixed;
	bottom:20px;
	right:20px;	
}

a.back-to-top, footer a:link, footer a:visited {
	border:0;
	padding:0 1em;
}

@media screen and (max-width:768px) {
	.wbcesuche {
		text-align:center;
	}
}

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

@media screen and (min-width:640px) {
	img.pic2left, img.pic3left, img.pic4left { margin: 0 1em 1em 0; height:auto; }
	img.pic2right, img.pic3right,  img.pic4right { margin: 0 0 1em 1em; height:auto; }
	img.pic2left {float:left; max-width:49%;}
	img.pic2right {float:right; max-width:49%; }
	img.pic3left {float:left; max-width:32%;}
	img.pic3right {float:right; max-width:32%;}
	img.pic4left {float:left; max-width:24%;}
	img.pic4right {float:right; max-width:24%; }
}

@media screen and (max-width:640px) {
	img.pic2left, img.pic3left, img.pic4left,
	img.pic2right, img.pic3right,  img.pic4right { margin: 1em 0; width:100%; float:none; height:auto; }
}

/* === Breitere Inhaltsseite auf sehr großen Monitoren === */
@media screen and (min-width: 1600px) {
  .size-1140 .line {
    max-width: 62%;   /* statt fixer Pixelzahl → prozentual */
     background-color: rgba(255, 255, 255, 0.5);
  }
    
}

/* ------------------------------------------------------ */
/* Submenü/Sidebar auf kleinen Bildschirmen ausblenden     */
/* ------------------------------------------------------ */
@media (max-width: 959px) {
  section .box .margin > .hide-s.m-12.l-3 {
    display: none !important;
  }
}



/* ------------------------------------------------------ */
/* 2) Deine 1600px-Regel sauber auf den Content begrenzen  */
/* (aktuell wirkt .size-1140 .line auf Header + Nav + Section) */
/* ------------------------------------------------------ */
@media screen and (min-width: 1600px) {
  .size-1140 section .line{
    max-width: 62%;
  }

  /* wenn Du im Content eine leicht transparente Fläche willst, dann besser auf .box legen */
  .size-1140 section .box{
    background-color: rgba(255, 255, 255, 0.96);
  }
}

/* Falls Du KEINE transparente Content-Fläche willst, sondern wirklich alles durchsichtig:
@media screen and (min-width: 1600px) {
  .size-1140 section .box{ background: transparent !important; }
}
*/

/* ------------------------------------------------------ */
/* Footer leicht transparent darstellen                  */
/* ------------------------------------------------------ */
footer .line,
footer .box{
  background-color: rgba(255, 255, 255, 0.96);
}



/* -----------------------------------------------------------------------------
   space: Breadcrumbs
----------------------------------------------------------------------------- */
.im-breadcrumbs{
  background: transparent;
  padding: 0;
  margin: 2px 0 12px 0;
  box-shadow: none;
}
.im-breadcrumbs h6{
  margin: 0;
  font-weight: bold;
}
.im-breadcrumbs a{
  text-decoration: none;
}
.im-breadcrumbs .sep{
  opacity: .6;
  padding: 0 4px;
}