@import url('/system/modules/alkacon.mercury.bistuemer.ebk/css/ebk-agency-menu.css');
@import url('/.themes/fonts/font.css');
@import url('/export/sites/demo-s-11/0-caritas-shared/m-access/m-access.css');

.img-max .visual {max-width: 250px;}
.pp-banner .message p:last-of-type { margin-bottom: 6px; font-size: 15px;}
.pp-banner .buttons .btn-save {background: #e00;}
.pp-banner .buttons .btn-accept {background: #034EA2;}
.ap-legaltext .headline {padding-left: 15px; margin-bottom: 22px;}
.ap-legaltext table {margin: 25px 0 !important;}
.ap-legaltext .table-sm > :not(caption) > * > * { padding: 5px 10px; font-size: 18px;}

.datenschutz {padding-left: 15px;}
.ap-privacy-policy h2, .datenschutz h2, .ap-legaltext h3 {font-size: 28px; font-weight: 400;}
@media (max-width: 763.98px) {
.ap-privacy-policy h2, .datenschutz h2, .ap-legaltext h3  {font-size: 20px; }
}

/*########################## Global ###################################*/
#mercury-page {overflow-x: clip;padding-bottom: 20px;}

@media (min-width: 764px) {
#mercury-page { max-width: 90%; position: relative; margin: 0 auto;}

}

.max-1190 .container {max-width: 1190px !important;}

body {font-size: 20px;}
body, h1, h2, h3, h4, h5, h6, li, a, .h4{font-family: 'Open Sans';     font-weight: 300; color: #444;}
h1, h2, h3 {letter-spacing: -2px; line-height: 1.1;}
h1, h2 {font-size: 50px;}
h1 strong,  h2 strong, h3 strong {font-weight: 700;}

.full-width .container {max-width: 100%;}
.text ul {margin-bottom: 15px !Important;}

.struktur {background: url('/.galleries/bilder/.system/back-area.png') 0 0; padding: 15px 50px; border-radius: 25px 0;}


.box.white {
    background-color: #fff;
    padding: 40px !important;
    box-shadow: 0px 0px 5px -1px rgba(0, 0, 0, .3);
}

.box.white h2 {font-size: 25px;}
.box.white img {margin-bottom: 15px;}


@media (min-width: 1119.98px) and (max-width: 1499.98px) {
.teaser-tile .piece > .body + .link a.btn, .teaser-tile .piece > .body .text + .link a.btn {width: 100% !important; font-size: 1.7rem;}
.struktur {padding: 15px 30px;}
}

@media (max-width: 1013.98px) {
body {font-size: 1.4rem;}
h1, h2 {
    font-size: 3rem;}
.btn {font-size: 1.4rem;}

.teaser-tile .piece > .body + .link a.btn, .teaser-tile .piece > .body .text + .link a.btn {
    width: 100%;}
.teaser-tile .teaser.piece > .body {max-width: 95% !important;}
.teaser-tile .piece > .body + .link a.btn, .teaser-tile .piece > .body .text + .link a.btn {width: 100% !important; font-size: 1.4rem;}
.teaser .intro-headline {font-size: 1.6rem;}
}
@media (max-width: 763.98px) {
h1, h2 {
    font-size: 2.2rem;}
.struktur {padding: 15px 0px;}
.no-mb {margin-bottom: 0 !important; }
}

/*########################## Header  + Nav ###################################*/
.h-logo-row.container {
    max-width: 100% ! Important;
}

.area-header {
    margin-bottom: 0;
}

header.bh .header-group {
    border-bottom: 0 !important;
}

.nav-toggle span, .nav-toggle span::before, .nav-toggle span::after {	
	height: 3px;
    background: #444 !important;
}

header.bh #nav-toggle-label-open .nav-toggle {
    width: 50px;
    height: 43px;
}

.nav-toggle {
	 background-color: transparent !Important;
	 background: rgba(255,255,255,0.7);
}
.nav-toggle-btn.active-nav .nav-burger {
    background: none !important;
}


.nav-main-container {background-color: #fff; padding: 30px 50px 45px;}
@media (max-width: 763.98px) {
.nav-main-container { padding: 30px 20px 25px;}

}

@media (max-width: 551.98px) {
    header.bh .nav-main-items li > a {
                padding: 10px 0;
        font-size: 15px;
    }
}


header.bh .nav-menu-header .nav-menu-logo .mobile-logolink {max-width: 200px;}
.nav-main-items li[aria-expanded] > a[aria-controls]::after, .nav-main-container .nav-main-group {
  background-color: transparent;
}







.nav-main-items li > a {
  color: #444 !important;
 
  font-size: 18px;
  font-weight: 400;
  padding: 15px 0;
  border-bottom: solid 1px #444;
}


.nav-main-items li.nav-icon > a {
  border-bottom: 0;
}








.nav-main-items li.expand.expand.ed > a[aria-controls]::after, .nav-main-items li.active > a:first-child {}

.nav-main-container .nav-main-group .nav-main-items {
    border-top: solid 1px #444;
}

	
header.bh .nav-menu-header {
    background-color: transparent;
    padding: 0px 0 35px;
}


.nav-main-items li ul li.active > a{
	padding-left: 0 !Important;
    font-weight: 600 !Important;
}


.nav-main-items .expand.ed ul a{
  font-size: 18px;
  padding: 5px 0;
  border-bottom: 0;
  text-transform: none;
  font-weight: 400;
}
.nav-main-items .nav-menu .expand.ed{
	margin-bottom: 10px;
}

.nav-main-items  .expand.ed .nav-menu{
	background: #eee; padding: 15px 20px; margin-bottom: 15px;     margin-top: 5px;
}

.nav-main-items .nav-menu .expand.ed ul{
	margin-top: 15px;	
}




html.active-nav .area-header .head-overlay {opacity: 0.5;}


header.bh .nav-main-items .nav-meta-icons > ul {border-bottom: 0;}

.nav-main-items li.active.expand.ed > a, .nav-main-items li.active > a {background-color: transparent;}
header.bh .nav-main-items li.expand > a::after {right: 0;}
.nav-main-items li.expand > a[aria-controls]::after {top: 9px; background-color:  transparent; color: #444;}
html.active-nav .area-header .header-group li.expand > a::after {
    right: 3px;
}
.nav-main-items li.expand.ed > a {background-color: transparent;
    border-color: transparent;}
	
	
	li.projects > a:before {font-family: 'fontawesome';
    content: "\f004";
    margin-right: 7px;
    top: 0px;
    position: relative;
	color: #e00;}


@media (min-width: 1014px) {
.area-header .header-group::before {background-image: none;}
header.bh.ls-3 .h-logo-col {
        flex: 0 0 275px;
        max-width: 275px;
}
}


@media (max-width: 1013.98px) {
header.bh .h-meta {display: block; max-width: max-content; position: absolute; top: 21px; right: 70px;}
}

@media (max-width: 763.98px) {
header.bh .h-meta {top: 16px;}
}

@media (max-width: 400px) {
header.bh .h-meta {top: 14px; right: 60px;}
}

@media (min-width: 1014px) {
header.bh.meta-right .header-links {position: absolute; top: 53px; right: 78px;}
.header-image img {top: 12px !important;}
}

@media (min-width: 1200px) {
header.bh.meta-right .header-links {top:top: 53px;}

}


.area-header .header-links > ul > li > a:hover {color: #16B795;}
.nav-main-group #nav-main-addition {display: none;}
.area-header .header-links > ul {font-size: 2.5rem;}

/*########################## Slider ###################################*/
.type-slider .slide-wrapper .caption {background-color: transparent;}




.type-slider .slide-wrapper .caption strong, .type-slider .slide-wrapper .caption .titlecaption { border-radius: 0px; padding: 8px 30px;    background: rgba(238, 0, 0, 1);  max-width: 100%; text-shadow: none; font-size: 40px; font-weight: 400; display: inline-block;}
.type-slider .slide-wrapper .caption small {font-weight: 300;  border-radius: 0px; padding: 8px 30px;  background: rgba(255, 255, 255, 1);  color: #222;  text-shadow: none; font-size: 29px; display: inline-block; transform: rotate(-2.5deg); margin-left: 30px;
  margin-top: 0 !important;}
.type-slider .slide-wrapper .caption {padding: 15px 10px 18px;}

@media (max-width: 1199.98px) {
.type-slider .slide-wrapper .caption small {    font-size: 1.9rem; }
.type-slider .slide-wrapper .caption strong, .type-slider .slide-wrapper .caption .titlecaption {font-size: 2.8rem; }
.type-slider .slide-wrapper .caption.left {left: 1.2rem;}
.type-slider .slide-wrapper .caption.bottom {bottom: 1.2rem;}
}

@media (max-width: 600.98px) {
.type-slider .slide-wrapper .caption small {    font-size: 1.3rem; padding: 6px 12px;}
.type-slider .slide-wrapper .caption strong, .type-slider .slide-wrapper .caption .titlecaption {font-size: 1.8rem; padding: 6px 12px;}
.type-slider .slide-wrapper .caption.left {left: 1.2rem;}
.type-slider .slide-wrapper .caption.bottom {bottom: 1.2rem;}
}




/*########################## Contact ###################################*/
 .contact-pers h3 {font-size: 25px; font-weight: 400; letter-spacing: -1px;}
  .contact-pers .h4 {font-size: 20px; font-weight: 400; letter-spacing: -1px; margin-bottom: 15px;}
 .contact-pers .body   {display: flex;align-items: center;}
.contact-pers img {border-radius: 50%; padding: 6px; border: 8px solid #f9f9f9; max-width: 350px; overflow-x: visible;}
.type-contact .ico, .type-contact .fa {
    margin-right: auto;
    width: auto;
}

/*########################## Versprechen ###################################*/
.versprechen h3 {font-size: 35px;}
.versprechen p {font-size: 28px; font-style: italic;}
.versprechen .text {border-left: 8px solid #eee; padding-left: 30px;}

/*########################## Head Mix ###################################*/
.head-mix {margin-top: 25px; margin-bottom: 55px;}



html:not(.opencms-page-editor) .head-mix {margin-right: -40px;}
@media (max-width: 763.98px) {
html:not(.opencms-page-editor) .head-mix {  margin-right: -25px; margin-left: -23px;margin-top: 0px; }
}

.head-mix .col-lg-4 {box-shadow: 0px 0px 5px -1px rgba(0, 0, 0, .3); position: relative; top: -40px; left: -40px; z-index: 5; background: #fff; padding: 35px 45px;     justify-content: center;
    align-items: center;
    display: flex;
    flex-direction: column;}
.head-mix .col-lg-8 .element {margin-bottom: 0;}

.head-mix .col-lg-4 .element { width: 100%;}
.head-mix .col-lg-4  a.btn {display: block;  background-color: #034EA2; padding: 12px 20px;
    background-color: #034EA2;
    font-size: 22px;
    border-radius: 30px;}
	
	.head-mix .col-lg-4  .red a.btn {background-color: #e00;}
	

.claim .claim-header {font-size: 38px; letter-spacing: -2px; line-height: 1.1; margin-bottom: 20px !important;}
.claim p {font-size: 25px; font-style: italic; margin-bottom: 20px !important; }

@media (max-width: 1499.98px) {
.head-mix { margin-bottom: 30px;}
.claim .claim-header {
    font-size: 28px;
    letter-spacing: -1px;}
.claim p {
    font-size: 23px;}
.head-mix .col-lg-4 {padding: 35px 35px;}
.head-mix .col-lg-4 a.btn {padding: 12px 15px; font-size: 1.8rem;}
}

@media (max-width: 1199.98px) {
.head-mix { margin-bottom: 30px;}
.claim .claim-header {
    font-size: 25px;
    letter-spacing: -1px;}
.claim p {
    font-size: 20px;}
.head-mix .col-lg-4 {padding: 35px 35px;}
.head-mix .col-lg-4 a.btn {padding: 12px 15px; font-size: 1.4rem;}
}
@media (max-width: 1013.98px) {
.head-mix { margin-bottom: 20px;}
.head-mix .col-lg-4 {top: unset;  left: unset;}
.head-mix .col-lg-4 a.btn { padding: 12px 20px; max-width: 80%; margin: 0 auto;}
.claim {display: none;}
.head-mix .col-lg-4 {box-shadow: none; padding: 0px; margin: 30px 0 10px;}
.head-mix .col-lg-4 a.btn {padding: 12px 15px; font-size: 1.8rem; }
	}
	
	
	@media (max-width: 763.98px) {
.head-mix { margin-bottom: 10px;}
.head-mix .col-lg-4 a.btn {        padding: 7px 15px;
        font-size: 1.6rem;
        margin-bottom: -8px; }
	}
	

/*########################## Partner ###################################*/
.refs h3 {font-size: 30px;}
.refs h3:before {font-family: 'fontawesome';
    content: "\f004";
    margin-right: 10px;
    top: 2px;
    position: relative;     color: #e00;}
.refs .square-col .content { padding: 10px;border: 1px solid #eee;}
.refs .type-imageseries.slide-list .image-col .zoom-overlay {background-color: transparent;}
.refs  .image-col {pointer-events: none;}
.refs html.keyboard-nav a:focus .zoom-overlay .zoom-icon, .refs .zoom:hover .zoom-overlay .zoom-icon {display: none;}

@media (max-width: 1013.98px) {
.refs h3 {
    font-size: 23px;}
	}
/*########################## two-cols ###################################*/
@media (min-width: 1014px) {
.two-cols.piece > .body {column-count: 2;
-webkit-column-count: 2;
-moz-column-count: 2;
column-gap: 60px;
-webkit-column-gap: 60px;
-moz-column-gap: 60px;
column-rule: 1px solid #ccc;
-webkit-column-rule: 1px solid #ccc;
-moz-column-rule: 1px solid #ccc;}
}

/*########################## Normal-AC ###################################*/
.accordion .acco-header .acco-toggle {border-radius: 97% 0.5% 92% 0.5% / 2% 97% 1% 95%; padding: 1.5rem 1.5rem; padding-left: 30px; font-weight: 400; overflow: visible; background-color: #e9eff3;}
.accordion .acco-header .acco-toggle:hover {color: var(--my-main-theme); background-color: #eceff3;}
.accordion .acco-header .acco-toggle[aria-expanded=true] {color: var(--my-main-theme); background-color: #eceff3;border-color: var(--my-body-bg);}
.accordion .acco-header .acco-toggle::before {font-family: ForkAwesome; font-weight: 300; line-height: .8; text-rendering: auto; content: "\f068"; position: absolute; display: flex; justify-content: unset;
    align-items: unset; top: 13px; height: auto; transform: none; transition: transform .33s; right: unset; left: -18px; color: #e00;font-size: 4rem; padding: 0; background-color: transparent;}
.accordion .acco-header .acco-toggle.collapsed::before {content: "\f061"; font-family: ForkAwesome; transform: rotate(360deg); top: 14px;    transition: transform 0.33s;}
.accordion .acco-header .acco-toggle:hover::before {color: #e00;}
.accordion .acco-header .acco-toggle.collapsed::after, .accordion .acco-header .acco-toggle::after {display: none;}
.colored-row .accordion .acco-header .acco-toggle::before, .colored-row .accordion .acco-header .acco-toggle:hover, .colored-row .accordion .acco-header .acco-toggle:hover::before, .colored-row .accordion .acco-header .acco-toggle[aria-expanded=true] {color: #e00;}
.accordion .acco-body {padding: 5px 30px 30px; background-color: #eceff3; border-bottom-left-radius: 10px; border-bottom-right-radius: 7px;}
.accordion {--my-at-border: 0;}
.accordion {box-shadow: none; --my-at-margin-between: 1.5rem; margin-left: 18px;}

@media (max-width: 1013.98px) {
.accordion .acco-header .acco-toggle {font-size: 1.8rem;}
.accordion .acco-header .acco-toggle.collapsed::before, .accordion .acco-header .acco-toggle::before {font-size: 3rem;}
}

@media (max-width: 763.98px) {
.accordion .acco-header .acco-toggle {font-size: 1.6rem;}
.accordion .acco-header .acco-toggle.collapsed::before, .accordion .acco-header .acco-toggle::before {font-size: 2.5rem;}
}


@media (min-width: 1014px) {
.accordion .acco-header .acco-toggle {
    font-size: 2.7rem;}
}




/*#################### Vorschläge ###########################*/

.vorschlag.piece > .body  {
    background: #fff;
    padding: 30px;
    margin: 0 auto;
    margin-top: -38px;
    z-index: 3;
    max-width: 85%;
	box-shadow: 0px 0px 5px -1px rgba(0, 0, 0, .3)
}

.vorschlag h3 strong {font-weight: 900;}
.vorschlag h3 {font-size: 45px; font-weight: 400; color: #555; }
.vorschlag p {font-style: italic;}

.vorschlag.piece > .body + .link, .vorschlag.piece > .body .text + .link {text-align: center;
    display: block;
   
    z-index: 6;
    width: 85%;
    margin: 0 auto;
	  margin-top: 20px;}

.vorschlag.piece > .body + .link a.btn, .vorschlag.piece > .body .text + .link a.btn {
width: 85%;
    border-radius: 4px;
    padding: 7px;
	background-color: #034EA2;white-space: normal;
-webkit-hyphens: auto;
    hyphens: auto;
    overflow-wrap: anywhere;
    word-break: break-word;
}

@media (max-width: 1013.98px) {
.vorschlag {margin-bottom: 60px;}
}


@media (max-width: 763.98px) {
.vorschlag.piece > .body + .link a.btn, .vorschlag.piece > .body .text + .link a.btn {
    width: 95%;}
.vorschlag h3 {
    font-size: 35px;}
.vorschlag.piece > .body {max-width: 95%;}
.vorschlag.piece > .body + .link, .vorschlag.piece > .body .text + .link {width: 95%;}
	}
/*#################### News ###########################*/

.teaser-tile .piece > .body + .link, .teaser-tile .piece > .body .text + .link {text-align: center;
    display: block;
   
    z-index: 6;
    width: 85%;
    margin: 0 auto;
	  margin-top: 20px;}

.teaser-tile .piece > .body + .link a.btn, .teaser-tile .piece > .body .text + .link a.btn {
width: 85%;
    border-radius: 4px;
    padding: 7px;
	background-color: #034EA2;
}

.teaser-tile .piece > .body + .link a.btn:before, .teaser-tile .piece > .body .text + .link a.btn:before {
font-family: 'fontawesome';
    content: "\f004";
    margin-right: 7px;
    top: 2px;
    position: relative;
	}


.teaser-tile .teaser.piece > .body .headline, .teaser-elaborate .headline {font-weight: 400;letter-spacing: -1px;}
.teaser-tile .teaser.piece > .body .teaser-text { line-height: 1.6;font-size: 16px;}
.teaser-text-tile .visual {margin-bottom: 0;}

.teaser-tile .teaser.piece > .body  {
    background: #fff;
    padding: 20px;
    margin: 0 auto;
    margin-top: -38px;
    z-index: 3;
    max-width: 85%;
	box-shadow: 0px 0px 5px -1px rgba(0, 0, 0, .3)
}
.list-pagination .btn-append {    max-width: max-content; padding: 10px 30px;
    margin: 0 auto;
    margin-top: 30px;
    font-size: 2.2rem;}
.list-pagination .btn-append:hover {background-color: #16B795; color: #fff;}
.intro-headline > .intro {font-size: 17px;
    color: #555;
    letter-spacing: -1px;
    max-width: max-content;
    padding: 0;
    margin-bottom: 7px;
    font-weight: 500;}
	
	
	.intro-headline > .intro:before {font-family: 'fontawesome';
    content: "\f006";
    margin-right: 6px;
    top: 0;
    position: relative;}

.detail-page.type-article .sub-header, .detail-page.type-event .sub-header {display: none;}

.detail-page.type-article .intro-headline > .intro, .detail-page.type-event .intro-headline > .intro {font-size: 40%;  padding: 4px 13px; font-weight: 400; }

.detail-page.type-event .detail-visual .visual-info .info {display: inline-block; font-size: 20px;}
.detail-page .detail-visual .visual-info .info::before {width: auto; padding-right: 4px;}

@media (max-width: 763.98px) {
.detail-page.type-event .detail-visual .visual-info .info {font-size: 17px;}
}

.detail-page.type-event .info.date {float: left; margin-right: 10px;  margin-top: 10px; background: #19465F; padding: 6px 14px; color: #fff; border-radius: 3px;}
.teaser .teaser-date {font-size: 16px;}

.detail-page.type-event .detail-visual .visual-info .person {float: left;  margin-top: 10px; background: #16B795; padding: 6px 14px; color: #333; border-radius: 3px;}


.detail-page .detail-visual .visual-info .person::before { content: "\f0c0"; margin-right: 5px;}

.detail-page.type-event .detail-visual .visual-info .date::before {margin-right: 5px;}

.teaser-text-tile.type-decoy.in-list .headline:after {
   display: none;
}
.teaser .list-badge {display: none;}

@media (min-width: 764px) {
    .detail-page.type-event .detail-visual.full:not(.pnv) .visual-info.right {
        justify-content: flex-start;

    }
}

@media (max-width: 1013.98px) {
.list-pagination .btn-append {max-width: 290px; font-size: 1.6rem;}
.teaser-text-tile.type-decoy.in-list {margin-bottom: 25px;}
}

@media (min-width: 1014px) {
.teaser-tile h2, .teaser-tile h3 {margin: 5px 0 25px;}
.teaser-elaborate .intro-headline { font-size: 2.6rem; }
    .teaser .intro-headline {font-size: 2.3rem;}
	}

/* ######## COUNTER ######## */
.row-count {max-width: 80%;margin: 0 auto; color: #444;}
.counter-plus {display: block; font-weight: 600; font-size: 23px;}
.counter {font-size: 85px;  font-weight: 700;display: inline-block; margin-bottom: -20px; color: #ccc;}
.features-info {display: block; font-size: 20px; font-weight: 400; padding-top: 20px; border-top: 2px solid #ccc; max-width: 80%; margin: 0 auto; margin-top: 20px;}
.features {text-align: center;}
@media (max-width: 1013.98px) {
.counter {
    font-size: 65px;}
	}
@media (max-width: 763.98px) {
.counter {
    font-size: 55px;}
	}
/*########################## Footer ###################################*/

.shariff li a {border-radius: 50%;}
.centa {display:flex; justify-content: center;}

.area-foot .topfoot {
background: #fff url(/.galleries/bilder/.system/footer-divider.png) no-repeat center 0;
    padding-top: 80px !important;
    margin-top: 80px;
	}
	

	
	.area-foot .subfoot {background-color: #fff; font-size: 18px; margin: 13px 0 15px;} 
	.area-foot .subfoot .type-linksequence {justify-content: center;display: flex;}
	
		@media (max-width: 600px) {
.area-foot .topfoot { background-size: 340px; margin-top: 40px;}
.area-foot .subfoot {font-size: 16px;}
	}	
	
	#topcontrol:hover {
  background-color: #EF7604;
  border-radius: 255px 15px 225px 15px/15px 225px 15px 255px !important;
}
#topcontrol::after {
  width: 40px;
  line-height: 38px;
  content: "\f062";
}
#topcontrol,#topcontrol:hover  {
  color: #e00;
  background: transparent;
}

