* {
  margin: 0px;
  padding: 0px;
}

body {
  background-color: #efefef;
  font-size: 80%;
  font-family: Helvetica, Arial, sans-serif;
  color: #8d8d8d;
  line-height: 1.5;
}

#container {
  width: 960px;
  background: #FFFFFF;
  margin: 0 auto;
}

#content_container {
  float: left;
  width: 100%;
  background-color: #ffffff; /*Sitemap sonst links und rechts grau*/
}

#wrapper {
  background-color: #ffffff;
  width: 100%;
  margin: 0 auto;
}

@media screen and (min-width: 1400px) {
  #wrapper {
    width: 1400px;
  }
}

.absatz {
  padding: 32px;
}

hr {
  margin-top: 8px;
  margin-bottom: 8px;
}

/***** Grid-Muster GKD-Recklinghausen *********/

/*Besonderheiten wegen Hintergrundfarbe Öffnungszeiten */
@media screen and (min-width: 881px) {
  #mainContent .tabellenlayout .container_inhalte {
    display:table-row; 
  }

  #mainContent .tabellenlayout .container_inhalte div.container_einspaltig, 
  #mainContent .container_inhalte div.container_zweispaltig  {
    display:table-cell; 
    float: none;
    vertical-align: top;
  }
}

@media screen and (min-width: 1280px) {
/*** Large-View (8 Spalten) ***/	
	.large-0 {display: none !important;}
	.large-1 {float: left;width: 12.5%;}
	.large-2 {float: left;width: 25%;}
	.large-3 {float: left;width: 37.5%;}
	.large-4 {float: left;width: 50%;}
	.large-5 {float: left;width: 62.5%;}	
	.large-6 {float: left;width: 75%;}
	.large-7 {float: left;width: 87.5%;}
	.large-8 {float: left;width: 100%;} 
	.large-flip {clear:both;}
  .nurfuertabansicht {display: none;}
}

@media screen and (min-width: 881px) and (max-width: 1279px) {
/*** Medium-View, Tablet-View ***/
  .medium-0 {display: none !important;}
  .medium-1 {float: left;width: 25%;}
  .medium-2 {float: left;width: 50%;}
  .medium-3 {float: left;width: 75%;}
  .medium-4 {float: left;width: 100%;}
  .medium-flip {clear:both;}


  #sidebarLeft {
    width:25%;
    float: left;
  }
  .page #mainContent {
    width: 75% !important;
  }
  .start #mainContent{
    width: 100%;
  }
  #sidebarRight {display: none;}
  .nurfuertabansicht {display: block;}

}

@media screen and (max-width: 880px) {
/*** Small-View, Smartphone-View (Landscape) ***/
	.small-0 {display: none !important;}
	.small-1{float: left;width: 50%;}
	.small-2{float: left;width: 100%;}
}

/****** Kopf ******/

#headerbox {
  position:relative;
}

#headerbild, .headerbild, .bx-wrapper {
  width:100%;
  padding: 0px;
  margin-top: -2.4px;
  float: left;
}

.banner_textbox h3 {
  position: absolute;
  bottom: 0%; 
  width: 47%;
  margin-left: 17.5%;
  padding: 1% 1% 1% 9.5%;
  height: 3em;
  display: table;
}

@media screen and (max-width: 880px) {
.banner_textbox h3 {
  height: 100%;
}
}

.banner_textbox h3 .banner_text {
  font-size: 150%;
  color: #ffffff;
  display: table-cell;
  vertical-align: middle;
  text-align: left;
}

#logo {
  height: 120px;
  background:url(../img/Logo.png) no-repeat;
  font-size:0px;
  background-size: 100% auto; 
}

.logo_box {
   width: 200px;
   float: left;
  padding: 32px 0px 0px 24px;
}

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

  .search-box, #BreadCrumb {display: none;}

  .logo_box {
    height: 80px;
    width: 43px;
    float: none;
    padding: 33.6px 0px 0px 24px;
  }

  #logo {
    background:url(../img/OE_Logo_Mobile.png) no-repeat;
    background-size: 100% auto; 
  }

  #headerbild, .headerbild, .bx-wrapper {
    width: auto;
    margin-top: 0;
  }

  .banner_textbox h3 {
    position: relative;
    width: auto;
    margin-left: 0;
    padding: 30px 30px 0px 30px;
    display: block;
    opacity: 1;
  }

  .banner_textbox h3 .banner_text {
    vertical-align: middle;
    text-align: left;
    font-size: 120%;
    display: block;
  }

  .banner_textbox h3 .banner_text p:first-child {
    color: #8d8d8d;
  }

  div.banner_image, div.slider_image {
    width: 100%;
    overflow: hidden;
  }
 
  div.banner_image img, div.slider_image img  {
    margin-left: -500px;
  }
}

a.bx-next:active, a.bx-next:focus, 
a.bx-prev:active, a.bx-prev:focus,
.bx-controls a:active, .bx-controls a:focus, 
a.bx-pager-link:active, a.bx-pager-link:focus,
.bxslider a:active, .bxslider a:focus {
   border: 1px solid #ffffff;
}



/****** Inhaltsbereich ******/

#mainContent {
  background-color: #ffffff;
}

/* nur für Startseite */
.start #mainContent {
  width: 100%;
}

body.start div.oeffnungszeiten {
  background-color:#f5f2e9;
}

.oeffnungszeiten_zeiten {
  margin-top: 64px;
}

/* nur für Unterseiten */
.page #mainContent {
 padding-top: 32px; 
 padding-bottom: 16px;
 width:50%;
 padding-right:2%;
 padding-left:2%;
 -moz-box-sizing: border-box; 
 box-sizing: border-box;
}

@media screen and (min-width: 881px) and (max-width: 1279px) {
  .page #mainContent {
    width:100%;
    padding-left:2%;
  }
}

@media screen and (max-width: 880px) {
  .page #mainContent {
     width:100%;
/* Notwendig für gleichmässig Abstände in der mobilen Ansicht*/
     padding-left:30px;
     padding-right:30px;
     padding-top: 30px; 
  }
}

/****** Bilder ******/
#mainContent img, #sidebarRight img {
  max-width: 100%;
}

/****** Tabelle ******/

.divinhalt table {
  margin-bottom: 16px;
  border-collapse: collapse;
}

td, th {
  padding: 5px 16px 5px 0px;
}

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

.selfdb_list th {
  font-weight: bold;
}

#mainContent table p {
  padding: 0px; 
  margin: 0px;
}

div.table {
  display: table;
  width: 100%;
}

div.tr { 
  display:table-row; 
}

div.td {
  display: table-cell;
  padding-bottom: 16px;
  padding-right: 16px;
}

/****** Linke Spalte ******/

#sidebarLeft {
  float: left;
}

#sidebarLeft .ohneNavigation {
  border: 1px solid transparent;
}

#sidebarLeft h2 {
  padding-bottom: 32px;
}

#sidebarLeft .absatz {
  padding: 0px;
}

#sidebarLeft .text_grau_gross{
  padding-left: 32px;
}

/****** Rechte Spalte ******/

#sidebarRight {
  float:right;
  background-color: #f5f2e9;
}

#sidebarRight .container_einspaltig a img {
  float: left;
}

/****** Fußzeile ******/

#footer {
  background-color: #8d8d8d;
  color: #ffffff;
}

@media screen and (max-width: 880px) {
  .footereintraege{
    padding-left:0;
  }
}

@media screen and (min-width: 881px) and (max-width: 1279px) {
  .footereintraege {
    padding-left:0;
  }
}

#footer a {
  text-decoration: none;
  color: #ffffff;
}

#footer p {
  padding-bottom: 16px;
}

.fltrt {
  float: right;
  margin-left: 8px;
}
.fltlft {
  float: left;
  margin-right: 8px;
}

footer {
  clear:left;
}

#footer .container_footerzusatz {
  padding-top: 32px;
  background-color: #f5f2e9;
  color: #8d8d8d;
}

#footer .container_footerzusatz a {
  text-decoration: underline;
  color: #324c7f;
}

/****** Navigation ******/
#navigation {
  text-align: right;
  position: relative;
  z-index: 1;
  float: right;
  width: 100%;
}

#navigation a {
  text-decoration:none;
  color: #515554;
  padding-right: 8px;
  padding-left: 8px;
}

#navigation li {
  display: inline; 
}

#navigation .gelb {border-bottom: 0.4em solid #d8b550;}
#navigation .blau {border-bottom: 0.4em solid #2c5f94;}
#navigation .rot {border-bottom: 0.4em solid #d03b3d;}
#navigation .orange {border-bottom: 0.4em solid #f99702;}
#navigation .grau {border-bottom: 0.4em solid #9db9bc;}
#navigation .gruen {border-bottom: 0.4em solid #36cf41;}
#navigation .schwarz {border-bottom: 0.4em solid #000000;}
#navigation .lila {border-bottom: 0.4em solid #622181;}
#navigation .braun {border-bottom: 0.4em solid #673b15;}

@media screen and (max-width: 880px) {
  #navigation li {
    display: block;
    width: 100%;
    text-align: left;
    padding: 32px 0px; 
  }

  #navigation li a {
    color: #ffffff; 
  }

  #navigation .gelb {border-bottom: 0em solid; background-color: #8D8D8D;}
  #navigation .blau {border-bottom: 0em solid; background-color: #8D8D8D;}
  #navigation .rot {border-bottom: 0em solid; background-color: #8D8D8D;}
  #navigation .orange {border-bottom: 0em solid; background-color: #8D8D8D;}
  #navigation .grau {border-bottom: 0em solid; background-color: #8D8D8D;}
  #navigation .gruen {border-bottom: 0em solid; background-color: #8D8D8D;}
  #navigation .schwarz {border-bottom: 0em solid; background-color: #8D8D8D;}
  #navigation .lila {border-bottom: 0em solid; background-color: #8D8D8D;}
  #navigation .braun {border-bottom: 0em solid; background-color: #8D8D8D;}
}

/****** Klappmenue aus Sitemap ******/
@media screen and (max-width: 880px) {
  #menuicon {
    position: absolute;
    top: 35px;
    right: 35px;
    cursor: pointer;
  }

  #menuicon img {
    width: 3em;
  }
}

#smmenu {
  background-color: #efefef;
}

#smmenu .sm_ebene1 {
  height: 2%;
  color: darkgrey;
  font-size: 120%;
  border-bottom: 1px solid #e7e7e7;
  padding: 22.4px 0px;
  margin: 0px 0px 0px 5%;
}

#smmenu .sm_ebene2 {
  height: 1%;
  font-size: 120%;
  color: darkgrey;
  padding: 16px 0px;
  margin: 0px 0px 0px 13%;
}

#smmenu .sm_ebene3 {
  height: 1%;
  font-size: 120%;
  color: darkgrey;
  padding: 16px 0px;
  margin: 0px 0px 0px 20%;
}

#smmenu .sm_ebene1, #smmenu .sm_ebene2, #smmenu .sm_ebene3 {
  cursor: pointer;
}

#smmenu .sm_ebene1 a, #smmenu .sm_ebene2 a, #smmenu .sm_ebene3 a {
  color: #324c7f;
  text-decoration: none;
}

/****** Navigation Rechts Mobile ******/
#navigation_rechts {
  padding-top:38px;
}

#navigation_rechts li {
  padding-top:16px;
  padding-bottom:16px;
}

#navigation_rechts a {
  text-decoration: none;
}

#navigation_rechts a:hover, #navigation_rechts a:active {
  text-decoration: none;
}

/****** Brotkrumen ******/

#mainContent #BreadCrumb {
  border-bottom: 1px solid #8d8d8d;
  font-size: 80%;
  color: #8d8d8d;
  padding-top: 32px;
  margin-bottom: 16px;
}

#mainContent #BreadCrumb ul {
  margin-left: 0px;
}

#BreadCrumb li {
  display:inline;
  margin-right: 2px;
}

#mainContent #BreadCrumb a {
  text-decoration: none;
  color: #8d8d8d;
}

#BreadCrumb li:before {
  content: "> ";
}

#BreadCrumb li:first-child:before {
  content: "";
}

/****** Veranstaltungen auf Startseite ******/
#footer .selfdb_adresse {
  display:inline;
}

/****** Suchschlitz ******/
.search-box {
  float: right;
  margin: 32px 16px 0px 0px;
}

@media screen and (max-width: 880px) {
  .search-box {
    clear: both;
    float: none;
    width: 100%;
  } 
}

.search-box input[type='search'], .search-box input[type='text'], #content-search-field
{
  width: 258px;
  height: 30px;
  line-height: 30px;
  background-color: #efefef;
  border: 1px solid #ffffff;
  display: inline-block;
  padding: 0px 0px 0px 8px;
  vertical-align: middle;
  box-sizing: border-box;
  text-align: center;
}

.searchform input[type='search'], .searchform_pansite input[type='search'] {
  width: 215px;
  height: 30px;
  color: #8d8d8d;
  border: 1px solid #ffffff;
  padding: 0 0 0 8px;
  text-align: center;
}

.content-form #content-search-field
{
  font-size: .875em;
}

.search-box #search-btn, #content-search-btn, .search-btn
{
  display:inline-block;
  margin-left:4px;
  max-width:29px;
  vertical-align:middle;
}

/****** Sitemap ******/
#mainContent .sm_ebene1{
  padding-left: 32px;
  font-weight: bold;
  line-height: 1.8em;
  border-top: 1px solid #8d8d8d;
}

#mainContent .sm_ebene2 {
  font-weight: normal;
  line-height: 1.5em;
  padding-left: 72px;
}

#mainContent .sm_ebene3 {
  font-weight: normal;
  line-height: 1.5em;
  padding-left: 104px;
}

.sm_ebene1 a:link, .sm_ebene1 a:visited, .sm_ebene1 a:active,
.sm_ebene2 a:link, .sm_ebene2 a:visited, .sm_ebene2 a:active,
.sm_ebene3 a:link, .sm_ebene3 a:visited,.sm_ebene3 a:active {
}

.sm_ebene1 a:hover,.sm_ebene2 a:hover,.sm_ebene3 a:hover, 
.sm_ebene1 a:focus,.sm_ebene2 a:focus,.sm_ebene3 a:focus,
.sm_ebene1 a:active,.sm_ebene2 a:active,.sm_ebene3 a:active {
}

/****** Sonstiges Abschluss für Editoren ******/

.nofloat{
  clear: both;
  width: 100%;
  padding:0px;
}

.div_hideme {
 position: absolute;
 top: -32768px;
 left: -32768px;
}