body,form,figure{margin:0;padding:0}img{border:0}header,footer,nav,section,aside,article,figure,figcaption{display:block}body{font-size:100.01%}select,input,textarea{font-size:99%}#container,.inside{position:relative}#main,#left,#right{float:left;position:relative}#main{width:100%}#left{margin-left:-100%}#right{margin-right:-100%}#footer{clear:both}#main .inside{min-height:1px}.ce_gallery>ul,.content-gallery>ul{margin:0;padding:0;overflow:hidden;list-style:none}.ce_gallery>ul li,.content-gallery>ul li{float:left}.ce_gallery>ul li.col_first,.content-gallery>ul li.col_first{clear:left}.float_left,.media--left>figure{float:left}.float_right,.media--right>figure{float:right}.block{overflow:hidden}.media{display:flow-root}.clear,#clear{height:.1px;font-size:.1px;line-height:.1px;clear:both}.invisible{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.custom{display:block}#container:after,.custom:after{content:"";display:table;clear:both}
@media (max-width:767px){#wrapper{margin:0;width:auto}#container{padding-left:0;padding-right:0}#main,#left,#right{float:none;width:auto}#left{right:0;margin-left:0}#right{margin-right:0}}img{max-width:100%;height:auto}.audio_container audio{max-width:100%}.video_container video{max-width:100%;height:auto}.aspect,.responsive{position:relative;height:0}.aspect iframe,.responsive iframe{position:absolute;top:0;left:0;width:100%;height:100%}.aspect--16\:9,.responsive.ratio-169{padding-bottom:56.25%}.aspect--16\:10,.responsive.ratio-1610{padding-bottom:62.5%}.aspect--21\:9,.responsive.ratio-219{padding-bottom:42.8571%}.aspect--4\:3,.responsive.ratio-43{padding-bottom:75%}.aspect--3\:2,.responsive.ratio-32{padding-bottom:66.6666%}.aspect--9\:16,.responsive.ratio-916{padding-bottom:177.7777%}.aspect--1\:1,.responsive.ratio-11{padding-bottom:100%}
/**
 * Contao Open Source CMS
 *
 * Copyright (c) 2005-2016 Leo Feyer
 *
 * @license LGPL-3.0+
 */

/**
 * Make the wrapping container 960 pixel wide
 * Edited by Oidt #wrapper -> #container
 * This makes the header, footer and wrapper full width.
 */
#container {
	width:960px;
	margin:0 auto;
}

/**
 * Set the default margin of the grid columns
 */
*[class*="grid"] {
	float:left;
	margin-left:10px;
	margin-right:10px;
	display:inline;
}

/**
 * Add a default margin to all content elements, so they align with the floatet
 * ones (otherwise you would have to add "grid12" to every element)
 */
.mod_article *[class*="content-"], /* Contao 5.x mit Twig-Templates */ 
.mod_article *[class*="ce_"],.mod_article *[class*="mod_"] {
	margin-left:10px;
	margin-right:10px;
}

/**
 * Handle news and event reader modules which are added via content element and
 * contain content elements themselves (see #5331)
 */
.mod_article .mod_newsreader,.mod_article .mod_eventreader {
	margin-left:0;
	margin-right:0;
}
.mod_article *[class*="layout_"] > *,.mod_article *[class*="event_"] > * {
	margin-left:10px;
	margin-right:10px;
}

/**
 * Remove the margin from floated articles, because the margin is already
 * applied to its content elements (see above)
 */
.mod_article.grid1,.mod_article.grid2,.mod_article.grid3,.mod_article.grid4,.mod_article.grid5,.mod_article.grid6,
.mod_article.grid7,.mod_article.grid8,.mod_article.grid9,.mod_article.grid10,.mod_article.grid11,.mod_article.grid12 {
	margin-left:0;
	margin-right:0;
}

/**
 * Automatically clear the floats in the main column, so you do not have to add
 * a clearing div to each article
 */
#main .inside {
	overflow:hidden;
}

/**
 * Grid column widths
 */
.grid1  { width:60px;  }
.grid2  { width:140px; }
.grid3  { width:220px; }
.grid4  { width:300px; }
.grid5  { width:380px; }
.grid6  { width:460px; }
.grid7  { width:540px; }
.grid8  { width:620px; }
.grid9  { width:700px; }
.grid10 { width:780px; }
.grid11 { width:860px; }
.grid12 { width:940px; }

/**
 * Floated articles can be 20 pixel wider (no margin)
 */
.mod_article.grid1  { width:80px;  }
.mod_article.grid2  { width:160px; }
.mod_article.grid3  { width:240px; }
.mod_article.grid4  { width:320px; }
.mod_article.grid5  { width:400px; }
.mod_article.grid6  { width:480px; }
.mod_article.grid7  { width:560px; }
.mod_article.grid8  { width:640px; }
.mod_article.grid9  { width:720px; }
.mod_article.grid10 { width:800px; }
.mod_article.grid11 { width:880px; }
.mod_article.grid12 { width:960px; }

/**
 * Default offset widths
 */
.offset1  { margin-left:90px  !important; }
.offset2  { margin-left:170px !important; }
.offset3  { margin-left:250px !important; }
.offset4  { margin-left:330px !important; }
.offset5  { margin-left:410px !important; }
.offset6  { margin-left:490px !important; }
.offset7  { margin-left:570px !important; }
.offset8  { margin-left:650px !important; }
.offset9  { margin-left:730px !important; }
.offset10 { margin-left:810px !important; }
.offset11 { margin-left:890px !important; }
.offset12 { margin-left:970px !important; }

/**
 * Floated articles do not have margin
 */
.mod_article.offset1  { margin-left:80px  !important; }
.mod_article.offset2  { margin-left:160px !important; }
.mod_article.offset3  { margin-left:240px !important; }
.mod_article.offset4  { margin-left:320px !important; }
.mod_article.offset5  { margin-left:400px !important; }
.mod_article.offset6  { margin-left:480px !important; }
.mod_article.offset7  { margin-left:560px !important; }
.mod_article.offset8  { margin-left:640px !important; }
.mod_article.offset9  { margin-left:720px !important; }
.mod_article.offset10 { margin-left:800px !important; }
.mod_article.offset11 { margin-left:880px !important; }
.mod_article.offset12 { margin-left:960px !important; }

/**
 * Reduce the overall width and the width of the grid columns if the screen
 * width is less than 980px (e.g. on a portrait tablet)
 */
@media (min-width:768px) and (max-width:979px)
{
	/**
	 * Reduce the overall width
	 * Edited by Oidt #wrapper -> #container
	 */
	#container {
		width:744px;
	}

	/**
	 * Reduce the grid column widths
	 */
	.grid1  { width:42px;  }
	.grid2  { width:104px; }
	.grid3  { width:166px; }
	.grid4  { width:228px; }
	.grid5  { width:290px; }
	.grid6  { width:352px; }
	.grid7  { width:414px; }
	.grid8  { width:476px; }
	.grid9  { width:538px; }
	.grid10 { width:600px; }
	.grid11 { width:662px; }
	.grid12 { width:724px; }

	/**
	 * Floated articles can be 20 pixel wider (no margin)
	 */
	.mod_article.grid1  { width:62px;  }
	.mod_article.grid2  { width:124px; }
	.mod_article.grid3  { width:186px; }
	.mod_article.grid4  { width:248px; }
	.mod_article.grid5  { width:310px; }
	.mod_article.grid6  { width:372px; }
	.mod_article.grid7  { width:434px; }
	.mod_article.grid8  { width:496px; }
	.mod_article.grid9  { width:558px; }
	.mod_article.grid10 { width:620px; }
	.mod_article.grid11 { width:682px; }
	.mod_article.grid12 { width:744px; }

	/**
	 * Reduce the offset widths
	 */
	.offset1  { margin-left:72px  !important; }
	.offset2  { margin-left:134px !important; }
	.offset3  { margin-left:196px !important; }
	.offset4  { margin-left:258px !important; }
	.offset5  { margin-left:320px !important; }
	.offset6  { margin-left:382px !important; }
	.offset7  { margin-left:444px !important; }
	.offset8  { margin-left:506px !important; }
	.offset9  { margin-left:568px !important; }
	.offset10 { margin-left:630px !important; }
	.offset11 { margin-left:692px !important; }
	.offset12 { margin-left:754px !important; }

	/**
	 * Floated articles do not have margin
	 */
	.mod_article.offset1  { margin-left:62px  !important; }
	.mod_article.offset2  { margin-left:124px !important; }
	.mod_article.offset3  { margin-left:186px !important; }
	.mod_article.offset4  { margin-left:248px !important; }
	.mod_article.offset5  { margin-left:310px !important; }
	.mod_article.offset6  { margin-left:372px !important; }
	.mod_article.offset7  { margin-left:434px !important; }
	.mod_article.offset8  { margin-left:496px !important; }
	.mod_article.offset9  { margin-left:558px !important; }
	.mod_article.offset10 { margin-left:620px !important; }
	.mod_article.offset11 { margin-left:682px !important; }
	.mod_article.offset12 { margin-left:744px !important; }
}

/**
 * Remove all floats and fixed widths if the screen width is less than 768
 * pixel (e.g. on a mobile phone)
 */
@media (max-width:767px)
{
	/**
	 * Remove the overall width
	 * Edited by Oidt #wrapper -> #container
	 */
	#container {
		width:auto;
	}

	/**
	 * Show all columns underneath each other
	 */
	*[class*="grid"] {
		float:none !important;
		display:block !important;
		width:auto !important;
	}
	*[class*="offset"] {
		margin-left:10px !important;
	}
}

html {
    height: 100%;
}

body {
    height: 100%;
    margin: 0px;
    font-size: 18px;
    line-height: 20px;
    font-family: 'source_sans_proregular';
    color: #195ea5;
}

a {
    text-decoration: none;
    color: #d91414;
}

h1, .h1 {
    font-size: 22px;
    line-height: 28px;
    margin-bottom: 12px;
}

h1:first-of-type:not(.content-headline) {
  margin-bottom: 1.5em;
}

h2 {
    font-size: 18px;
    line-height: 22px;
}

h3 {
    font-size: 15px;
    line-height: 18px;
}

h1, h2, h3 {
  position: relative;
  font-family: 'varela_roundregular';
  margin-top: 0px;
}

h2, h3 {
  margin-bottom: 0px;
}

p {
    margin-top: 0.3em;
}

.image_container img {
    display: block;
}

.media--left img {
  padding-right: 0.75rem;
  padding-bottom: 0.5rem;
}

.special_head {
    padding: 16px;
    color: #8a1876;
    border-left: 2px solid #bbbdbe;
}

.color_head {
  background-color: #7cc8ec; /* Headline in blue box */
  padding: 6px;
}

.colortext {
  color: #d91414; /* red text color. Maybe removed... */
}

.notrufnummern {
  padding-top: 12px;
  margin-bottom: 24px;
  border-top: 4px solid #d91414;
  border-bottom: 4px solid #d91414;
}

.notrufnummern h3 {
  margin: 0px;
  font-size: 16px;
}

.notrufnummern p {
  margin-top: 0px;
  margin-bottom: 6px;
}

#wrapper {
    position: relative;
    min-height: 100%;
    /*
    background-image: url("../../files/assets/bg_image_moerser_skal_ret.jpg");
    background-size: cover;
    */
    /*background-image: linear-gradient(white, #7cc8ec);*/
}

#container {
    margin-top: 20px;
    /*background-color: rgba(255, 255, 255, 0.9);*/
    padding-bottom: 160px; /* Matches the height of the #footer */
    /*position: relative;*/
    /*
    background-image: url("../../files/assets/bg_image_moerser_skal.jpg");
    background-size: cover;
    overflow: visible;
    */

}

#footer {
    width: 100%;
    height: 60px; /* => #container padding-bottom */
    position: absolute;
    bottom: 0px;
    position: absolute;
    /* uf20221129 höherer Kontrast für Barrierefreiheit */
    /* uf20221129 noch höherer Kontrast für Barrierefreiheit */
    background-color: #38628d; /*#4272a5;*/ /*#4c86c4;*/
    text-align: center;
}

#footer .inside {
  margin: 0px;
}

#footerslogan {
  width: 180px;
  position: absolute;
  bottom: -8px;
  left: 30px;
}

#header {
    /*height: 320px;*/
    width: 100%;
    top: 0px;
    left: 0px;
    /*
    height: 230px;
    background-color: #e3e4e4;
    background-position: top center;
    box-shadow:         3px 3px 5px 2px #a3a3a3;
    */
}

.mod_article {
  /*margin-top: 30px;*/
  /*margin-bottom: 30px;*/
  margin-top: 24px;
}

.mod_article.first {
  margin-top: 30px;
}

.clearall {
  clear: both;
}

.clearright {
  clear: right;
}

.floatleft {
  float: left;
}

.floatright {
  float: right;
}

.opening {
  margin-top: 12px;
}

.opening .col_first {
  padding-right: 8px;
}

.opening .col_last {
  text-align: right;
  padding-left: 18px;
}

.opening td {
  padding-top: 2px;
}

.custom_list ul {
  padding-left: 1.2em;
}

ul {
  padding-left: 1.2em;
}

#apo_app {
  margin-top: 60px;
  border-top: 3px solid;
  padding-top: 22px;
}

.textbox_leistung {
  border-left: 6px solid #7cc8ec;
  box-sizing: border-box;
  position: relative;
  min-height: 340px;
}

.textbox_service  {
  border-left: 6px solid #7cc8ec;
  box-sizing: border-box;
}

.textbox_links  {
  border-left: 6px solid #7cc8ec;
  box-sizing: border-box;
  min-height: 280px;
}

.full_width_pic img {
  width: 100%;
}

.shadow {
  box-shadow: 2px 2px 4px 2px #585858;  /* Opera 10.5, IE 9, Firefox 4+, Chrome 6+, iOS 5 */
}

.header_pic {
    margin-top: 0px;
    height: auto;
    box-shadow: 3px 3px 5px 2px #a3a3a3;
}

.header_pic .image_container img {
    margin: 0px;
    width: 100%;
    vertical-align: middle;
}

.headertestmodule {
  width: 100%;
  position: relative;
  /* uf20221129 höherer Kontrast für Barrierefreiheit */
  /* uf20221129 noch höherer Kontrast für Barrierefreiheit */
  background-color: #38628d; /*#4272a5;*/ /*#4c86c4;*/
}

.notdienst_module_mobile {
  display: none;
}

.notdienst_label {
  display: block;
  font-size: 1.4em;
  margin-top: 0px;
  padding-left: 48px;
  line-height: 46px;
  background-image: url("../../files/assets/apo_button.png");
  background-repeat: no-repeat;
}

.telnum_label {
  display: block;
  font-size: 1.1em;
  margin-top: 0px;
  padding-left: 48px;
  line-height: 46px;
  background-image: url("../../files/assets/telefon_symbol_hoerer.png");
  background-repeat: no-repeat;
}

.apo_app_label {
  /*
  padding-left: 52px;
  line-height: 48px;
  background-image: url("../../files/assets/appicon_small.png");
  background-repeat: no-repeat;
  */
}

.gesundheitsinfo_label {
  display: block;
  font-size: 1.1em;
  margin-top: 0px;
  padding-left: 64px;
  line-height: 46px;
  background-image: url("../../files/assets/button_gesundheitsinfo.jpg");
  background-repeat: no-repeat;
}

#logo_header {
  position: absolute;
  top: 40px;
  right: 160px;
  width: 50%;
}

#logo_header_solo {
  display: none;
  position: absolute;
  top: 20px;
  left: 10px;
  width: 74%;
}

.notdienst_module {
  padding: 6px;
  position: absolute;
  top: 30px;
  /*background-color: rgba(230, 230, 230, 0.8);*/
  background-color: rgba(255, 255, 255, 0.5);
}

#venenfach_article_intro {
  border-left: 6px solid #7cc8ec;
  box-sizing: border-box;
  min-height: 460px;
  position: relative;
}

#leber_article_intro {
  border-left: 6px solid #7cc8ec;
  box-sizing: border-box;
  min-height: 460px;
  position: relative;
}

#apoohnegrenzen_article_intro {
  border-left: 6px solid #7cc8ec;
  box-sizing: border-box;
  min-height: 460px;
  position: relative;
}

.bottom_fixed_pic {
  position: absolute;
  bottom: 0px;
}

#videowrapper video {
    display: block;
    position: relative;
    width: 100%;
}


/********** Media Queries **************/

@media (max-width: 767px) {

  #footer {
    position: relative;
  }

  #menu_icon_wrapper {
      display: block;
  }

  #main_nav ul li {
      float: none;
      display: none;
  }

  #main_nav a {
      padding-left: 0px;
  }

  #main_nav {
      display: none;
  }

  #main_nav ul {
    padding-left: 0px;
  }

  #main_nav {
      padding-bottom: 0px;
      margin-bottom: 0px;
      text-align: left;
  }

  #menu_icon {
      display: block;
  }

  #main_nav.smallMenuOpen ul li {
      margin-bottom: 2px;
      padding-left: 10px;
      padding-right: 10px;
      display: block;
  }

  #main_nav.smallMenuOpen {
      position: absolute;
      /*background-color: rgba(0, 0, 0, 0.6);
      background-color: #e3e4e4;*/
      background-color: #195ea5e7;
      z-index: 20;
      height: 260px;
      width: 100%;
      display: block;
      text-align: left;
      top: 0px;
      right: 0px;
  }

  #main_nav.smallMenuOpen a {
    /*color: #195ea5;*/
  }

  #logo_header {
    display: none;
  }

  #logo_header_solo {
    display: block;
  }

  .notdienst_module {
    display: none;
  }

  .notdienst_module_mobile {
    display: block;
    margin-left: 10px;
    margin-top: 0px;
    margin-bottom: 15px;
  }

  .opening .col_first {
    width: 40%;
  }

  #container {
    margin-top: 0px;
  }

  .notdienst_module_mobile .notdienst_label {
    /*float: left;*/
  }

  .textbox_leistung {
    min-height: 60px;
  }

  .bottom_fixed_pic {
    position: relative;
    /*bottom: 0px;*/
  }

  #links_slogan {
    display: none !important;
  }

  #footerslogan {
    display: none;
  }

  #videowrapper {
    margin-bottom: 30px;
  }

  .header_pic {
    overflow: hidden;
  }

  .header_pic .image_container img {
    min-width: 500px;
    height: auto;
  }

}

/********** Fonts **********************/

@font-face {
    font-family: 'source_sans_prolight';
    src: url('../../files/fonts/xsans-light-webfont.woff2') format('woff2'),
         url('../../files/fonts/xsans-light-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'source_sans_proregular';
    src: url('../../files/fonts/xsans-regular-webfont.woff2') format('woff2'),
         url('../../files/fonts/xsans-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: block;
}

@font-face {
    font-family: 'source_sans_prosemibold';
    src: url('../../files/fonts/xsans-semibold-webfont.woff2') format('woff2'),
         url('../../files/fonts/xsans-semibold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: block;
}

@font-face {
    font-family: 'ubuntu_titlingbold';
    src: url('../../files/fonts/ubuntutitling-bold-webfont.woff2') format('woff2'),
         url('../../files/fonts/ubuntutitling-bold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: block;
}

@font-face {
    font-family: 'varela_roundregular';
    src: url('../../files/fonts/varelaround-regular-webfont.woff2') format('woff2'),
         url('../../files/fonts/varelaround-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: block;
}

/*********** Menu stuff ********************/

#menu_icon_wrapper {
    display: none;
    border: 1px solid white;
    cursor: pointer;
    position: absolute;
    background-color: rgba(32, 102, 176, 1);
    width: 44px;
    height: 41px;
    right: 20px;
    top: 12px;
    z-index: 30;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    -webkit-tap-highlight-color: transparent; /* For some Androids */
}

.icon_bar {
    position: relative;
    width: 30px;
    height: 5px;
    background-color: white;
    margin-left: 6px;
    margin-top: 6px;
}

#m-icon-a {
    transform: matrix(1, 0, 0, 1, 0, 0);
}
#m-icon-b {
    opacity: 1;
}
#m-icon-c {
    transform: matrix(1, 0, 0, 1, 0, 0);
}

#main_nav {
    /*float: right;*/
    /*background-color: #195ea5;*/
    /* uf20221129 höherer Kontrast für Barrierefreiheit */
    /* uf20221129 noch höherer Kontrast für Barrierefreiheit */
    background-color: #38628d; /*#4272a5;*/ /*#4c86c4;*/
    text-align: right;
    padding-top: 0.5em;
    padding-bottom: 0em;
    padding-right: 1em;
}

#main_nav ul {
  margin: 0px;
}

#main_nav li {
    /*position: relative;*/
    display: inline-block;
    min-height: 40px;
    /*line-height: 40px;*/
    font-family: "source_sans_proregular";
    font-size: 17px;
    /*text-transform: uppercase;*/
    margin-left: 12px;
    margin-right: 12px;
    margin-top: 2px;
}

#main_nav a {
    /*display: block;*/
    /*line-height: 40px;*/
    color: #ffffff;
    text-decoration: none;
}

#main_nav li a:hover, #main_nav li a:active {
    text-decoration: none;
    color: #c8e3f6;
    /*
    border-bottom: 1px solid white;
    */
    border-bottom: 3px solid #c8e3f6;
}

/*#main_nav span.active {*/
#main_nav strong.active {
    font-weight: normal;
    color: #ffffff;
    /*
    border-bottom: 1px solid white;
    */
    border-bottom: 3px solid #c8e3f6;
}

#service_nav {
    margin: 0px;
}

#service_nav ul {
  margin: 0px;
  padding: 0px;
}

#service_nav li {
    display: inline-block;
    min-height: 30px;
    line-height: 30px;
    /*width: 170px;*/
    font-family: "source_sans_proregular";
    font-size: 15px;
    text-align: center;
    margin-left: 16px;
    margin-top: 16px;
    /*border: 1px solid #FFFFFF;*/
}

#service_nav a {
    text-decoration: none;
    color: white;
}

#service_nav li a:hover, #service_nav li a:active {
      color: #c8e3f6;
    /*
    border-bottom: 1px solid white;
    */
    border-bottom: 3px solid #c8e3f6;
}

/*#service_nav span.active {*/
#service_nav strong.active {
    font-weight: normal;
    color: #ffffff;
    /*
    border-bottom: 1px solid white;
    */
    border-bottom: 3px solid #c8e3f6;
}

@media (max-width: 767px) {
  #menu_icon_wrapper {
      display: block;
  }
}