@charset "UTF-8";
/**
 * "Yet Another Multicolumn Layout" - (X)HTML/CSS Framework
 *
 * (en) Template for designing a screen layout
 * (de) Gestaltungsvorlage für die Erstellung eines Screenlayouts
 *
 * @copyright       Copyright 2005-2010, Dirk Jesse
 * @license         CC-A 2.0 (http://creativecommons.org/licenses/by/2.0/),
 *                  YAML-C (http://www.yaml.de/en/license/license-conditions.html)
 * @link            http://www.yaml.de
 * @package         yaml
 * @version         3.2.1
 * @revision        $Revision:392 $
 * @lastmodified    $Date:2009-07-05 12:18:40 +0200 (So, 05. Jul 2009) $
 */

:root{
	--cyan: #009bdc;
	--violett1: #5A2572;
	--violett2: #2E2672;
	--violett3: #6E2272;
	--violett4: #462672;
	--weiss: #FFFFFF; 
}

@media screen, projection
{
  /** 
   * (en) Forcing vertical scrollbars in IE8, Firefox, Webkit & Opera 
   * (de) Erzwingen vertikaler Scrollbalken in IE8, Firefox, Webkit & Opera 
   *
   * @workaround
   * @affected IE8, FF, Webkit, Opera
   * @css-for all
   * @valid CSS3
   */

  body { overflow-y:scroll; }

 /*------------------------------------------------------------------------------------------------------*/

 /**
  * Design of the Basic Layout | Gestaltung des YAML Basis-Layouts
  *
  * @section layout-basics
  */

  /* Page margins and background | Randbereiche & Seitenhintergrund */
  body {  
    background-color: #FFFFFF;
  }

  /* Layout:Width, Background, Border | Layout:Breite, Hintergrund, Rahmen */
  .ym-wrapper{ width:100%; margin-left:0; margin-right:0; }
	@media(min-width:800px){ .ym-wrapper{ width: 85%; max-width:2046px; margin-left: auto; margin-right: auto; } }
  .ym-wbox{  }

  /* Design of the Main Layout Elements | Gestaltung der Hauptelemente des Layouts */
  .service-row{ display:none; }
	@media(min-width:800px){ .service-row{ display:block; }}
  header .header{ background-color:#462672; display:flex;}
  header .header-logo{ background-color:#5A2572; max-height:82px; width:auto; display:inline-block; padding:20px 4.1666666%; }
  header .header-logo img{ max-height:42px; width:auto; vertical-align:middle; border:0; }
  header .header-name{ display:inline-block; }
  header .header-menu{ display:inline-block; padding:20px; margin-left:auto; margin-right:4.166666666%;}
  header#header { padding-top:1vw; background-color:transparent; }
  header{ background-color:transparent; }
  #headerrow{ display:table; }
  #logo{ width:19%; display:table-cell; }
  #topnav { }
  nav#nav{ /*background-color:#D3EAFB;*/ background:#d4d0de none repeat scroll 0 0 }

  #trailer{ margin-bottom:2.5em; }

  main {  }

  footer{ background-color:#D3EAFB; padding-top:2em; margin-top:5em; }
  footer#page-footer{ background:none; }
  footer#page-footer .internal .ym-g33{ padding:19px 0 24px 0; }
	@media(min-width:800px){ footer#page-footer .internal .ym-g33{ padding:57px 4.16667% 87px 4.19997%; }}
  footer#page-footer .service-links{ clear:both; min-height:72px; text-align:left; padding-top:50px; padding-bottom:20px; padding-left:10px; padding-right:10px;}
	@media(min-width:800px){ footer#page-footer .service-links{text-align:center; padding-top:26px; padding-bottom:11px; padding-left:0; padding-right:0; }}
  footer#page-footer .service-links nav{ background:none; }
  footer#page-footer .service-links.donation-hint{ padding-top:40px; }
  footer#page-footer .donation-hint p{ padding-left:10px; padding-right:10px; color:#FFFFFF; letter-spacing:1.0px; }
  footer#page-footer .donation-hint .donation-title{ font-weight:bold; }
  footer#page-footer .social-media{ color:#FFFFFF; text-align:left; pading-top:20px; padding-bottom:15px; padding-left:10px; padding-right:10px; }
	@media(min-width:800px){ footer#page-footer .social-media{ text-align:center; padding-top:40px; padding-bottom:20px; padding-left:0px; padding-right:0px; }}
  footer#page-footer .partner-links{ text-align:center; }
  footer#page-footer .partner-links ul{ margin:0; }
	@media(min-width:800px){ footer#page-footer .partner-links ul{ margin:0; }}


 /*------------------------------------------------------------------------------------------------------*/

 /**
  * Formatting of the Content Area | Formatierung der Inhaltsbereichs
  *
  * @section layout-main
  */

  .ym-gbox-left{ padding: 0 1.25em 0 0; }
  .ym-gbox-right{ padding: 0 0 0 1.25em; }
  
  .ym-g34{ width:33.33%; }
  .ym-g67{ width:66.66%; }
  
  .csc-default{ margin-bottom:2em; }

  .news-list-browse{ margin-top:2em; text-align:right; }
  
  .row{ margin-left:0; margin-right:0; }
  
  .color-violet-1{ background-color:#5a2572!important; }
  .color-violet-2{ background-color:#2e2672!important; }
  .color-violet-3{ background-color:#462672!important; }
  .color-violet-4{ background-color:#6e2272!important; }
  
  /* Abstand davor */
  .frame-space-before-extra-small{ margin-top:4rem; }
  .frame-space-before-small{ margin-top:6rem; }
  .frame-space-before-medium{ margin-top:8rem; }
  .frame-space-before-large{ margin-top:10rem; }
  .frame-space-before-extra-large{ margin-top:12rem; }
  
  /* Abstand danach */
  .frame-space-after-extra-small{ margin-bottom:6rem; }
  .frame-space-after-small{ margin-bottom: 8rem; }
  .frame-space-after-medium{ margin-bottom:12rem; }
  .frame-space-after-large{ margin-bottom:16rem; }
  .frame-space-after-extra-large{ margin-bottom:24rem; }
  
  /* Rahmen für CEs */
  .frame-schatten{ box-shadow:0 0.56rem 0.75rem #4626721a; padding:0.5em; }


 /*------------------------------------------------------------------------------------------------------*/

 /**
  * Design of Additional Layout Elements | Gestaltung weiterer Layoutelemente
  *
  * @section layout-misc
  */

  #tx_cookies{ width:100vw; bottom:0; position:fixed; min-height:35px; background:#eee; z-index:500; }
  #tx_cookies_inner{ width:85%; max-width:2046px; margin-left:auto; margin-right:auto; }

  div.csc-textpic .csc-textpic-imagewrap figure, div.csc-textpic figure.csc-textpic-imagewrap{ display:block; }
  div.csc-textpic .csc-textpic-imagewrap .csc-textpic-image{ margin-bottom:1.5em; }

  .csc-textpic-1-col .csc-textpic-imagecolumn, .csc-textpic-1-col .csc-textpic-image { width:100%; }
  .csc-textpic-2-col .csc-textpic-imagecolumn, .csc-textpic-2-col .csc-textpic-image { width:48% }
  .csc-textpic-3-col .csc-textpic-imagecolumn, .csc-textpic-3-col .csc-textpic-image { width:31% }
  .csc-textpic-4-col .csc-textpic-imagecolumn, .csc-textpic-4-col .csc-textpic-image { width:23%; }
  .csc-textpic-5-col .csc-textpic-imagecolumn, .csc-textpic-5-col .csc-textpic-image { width:18%; }

  .csc-textpic-1-col .csc-textpic-imagecolumn .csc-textpic-image, .csc-textpic-2-col .csc-textpic-imagecolumn .csc-textpic-image, .csc-textpic-3-col .csc-textpic-imagecolumn .csc-textpic-image, .csc-textpic-4-col .csc-textpic-imagecolumn .csc-textpic-image, .csc-textpic-5-col .csc-textpic-imagecolumn .csc-textpic-image{ width:100%; }
  
  .ym-g16{ width:38%; }
  .ym-g84{ width:62%; }

  .csc-textpic-intext-right .csc-textpic-imagewrap{ width:50%; }
  .csc-textpic-intext-right .csc-textpic-imagewrap .csc-textpic-imagewrap{ width:100%; }
  .csc-textpic-intext-left .csc-textpic-imagewrap{ width:50%; }
  .csc-textpic-intext-left .csc-textpic-imagewrap .csc-textpic-imagewrap{ width:100%; }
  .csc-textpic-intext-left-nowrap .csc-textpic-text{ margin-left:calc(38% + 1.5em); }

  figcaption.csc-textpic-caption{ width:100%; display:block; }

  .owl-theme .owl-controls{ margin-top:-30px!important; text-align:right!important; z-index:100; }
  .owl-theme .owl-controls .owl-page span{ background-color:#50267E!important; }
  .owl-carousel .owl-wrapper-outer.autoHeight{ height:30%!important; }

  .csc-frame-rulerAfter .csc-textpic-intext-left-nowrap .csc-textpic-imagewrap{ width:38%; float:left; margin-right:1.5em; }
  .csc-frame-rulerAfter .csc-textpic-intext-right-nowrap .csc-textpic-imagewrap{ width:38%; float:right; margin-left:1.5em; }
  .csc-frame-rulerAfter .csc-textpic-imagewrap .csc-textpic-imagewrap{ width:100%; }
  .csc-frame-rulerAfter { border-bottom:1px solid #50267e; margin-bottom:1em;}
  .csc-frame-rulerAfter .ym-clearfix{ margin-bottom:1em; }
  
  .mobilonly{ display:block; }
  
  .container{
	box-sizing: content-box;
    max-width: 100%;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    margin-left: auto;
    margin-right: auto;
  }
  
  .frame-default.important{ background-color:var(--cyan); border-color:var(--cyan); color:var(--weiss); }
  
  .frame-type-msm_teaser{
	display: flex;
    flex-wrap: wrap-reverse;
    align-items: center;
    gap: 2rem;
    margin-bottom: 5rem;
  }
  .frame-type-msm_teaser.frame-layout-105{ flex-direction:row-reverse; }
  .text-image-teaser__content, .text-image-teaser__image{ flex:1 1 20.25rem; width:100%; }
  .text-image-teaser__image{ flex-grow:2.4; }
  .text-image-teaser__image image{ position:relative; width:100% }

.iframecontainer {
  position: relative; 
  padding-bottom: 56.25%; /* ratio 16x9 */
  height: 0; 
  overflow: hidden; 
  width: 100%;
  height: auto;
}
.iframecontainer iframe {

  position: absolute; 
  top: 0; 
  left: 0; 
  width: 100%; 
  height: 100%; 
}
/* ratio 4x3 */
.iframecontainer.ratio4x3 {
  padding-bottom: 75%;
}

.placeholder{ background:#DDDDDD; text-align:center; vertical-align:middle; margin:0 auto; max-width:1200px; }

/* Unterseite "Anfahrt" */
#maps{ background-color:#DDDDDD; text-align:center; max-width:1200px; margin:0 auto; }


  .trailer.blueBackground{ background-color:#5A2572; padding:4em 0; height:auto; }
  .trailer{ height:43vw; margin-top:2.5em; background-attachment:fixed; background-repeat:no-repeat; background-size:100vw; background-position:center center; text-align:center; }
  
  .card-columns{ display:grid; width:100%; margin:1rem 0px 4rem; padding:0; grid-template-columns:repeat(1, 1fr); }
    @media (min-width:60rem){ .card-columns{ grid-template-columns:repeat(2, 1fr); gap:2rem; }}
  .w-50{ width:50% !important; }
  .card{ position:relative; flex:auto; flex:1 1 300px; flex-direction:column; min-width:0; word-wrap:break-word; background-clip:border-box; box-shadow:rgba(70,38,114,0.1) 0px 0.56rem 0.75rem; }
  .card:hover, .card:focus{ box-shadow:rgba(70,38,114, 0.3) 0px 0.56rem 0.75rem; }
  .card-body{ padding:1.rem 1rem; }
    @media screen and (min-width:60rem){ .card-body{ padding:1.5rem 2rem;}}
  
  
 /**
  * ------------------------------------------------------------------------------------------------- #
  *
  * Skiplinks 
  *
  * (en) Visual styling for skiplink navigation
  * (de) Visuelle Gestaltung der Skiplink-Navigation
  *
  * @section content-skiplinks
  */
  
  #skiplinks a.skip:focus,
  #skiplinks a.skip:active { 
  color:#fff; 
  background:#333; 
  border-bottom:1px #000 solid;
  padding:10px 0;
  text-decoration:none;
  }  
}

/* Nur für kleine Monitore */
@media screen and ( max-width: 480px)  {
	/* linearize for column module */
	.linearize-level-2,
	.linearize-level-2 > [class*="ym-g"] {
		margin:auto;
		margin-left:0;
		margin-right:0;
	}
}


@media screen and ( max-width: 650px )  {
  /* linearization for column module */
  .linearize-level-1,
  .linearize-level-1 > [class*="ym-g"] {
    display: block;
    float: none;
    padding: 0;
    /*margin: 0;*/
	margin-left:0; margin-right:0;
    width: 100% !important;
  }
  /* reset defined gutter values */
  .linearize-level-1 > [class*="ym-col"] > [class*="ym-cbox"] {
    overflow: hidden; /* optional for containing floats */
    padding: 0;
    margin: 0;
  }
}

/* Nur für große Monitore */
@media (min-width: 800px){
  .mobilonly{ display:none; }
}