/***************************************************************************
* Variabeln
***************************************************************************/
:root {
  --accentColor: #9c134b;
  --secondColor: #7e9660 !important; 
  --thirdColor: #d81756;
  
 --bg-secondColor: rgba(126, 150, 96, 0.85);
 --bg-lightColor: rgba(224,223,218,0.3);
  
  --light-grey: #e0dfda; /* hellgrau */
  
  --abstand-xxxs: 0.2rem;
  --abstand-xxs: 0.4rem;
  --abstand-xs: 0.6rem;
  --abstand-s: 0.8rem;
  --abstand-m: 3rem;
  --abstand-l: 3rem;
  --abstand-xl: 6rem;
}


/***************************************************************************
* Google Fonts
***************************************************************************/
/* hind-300 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Hind';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/hind-v16-latin/hind-v16-latin-300.eot'); /* IE9 Compat Modes */
  src: url('../fonts/hind-v16-latin/hind-v16-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/hind-v16-latin/hind-v16-latin-300.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/hind-v16-latin/hind-v16-latin-300.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('../fonts/hind-v16-latin/hind-v16-latin-300.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('../fonts/hind-v16-latin/hind-v16-latin-300.svg#Hind') format('svg'); /* Legacy iOS */
}

/* hind-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Hind';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/hind-v16-latin/hind-v16-latin-regular.eot'); /* IE9 Compat Modes */
  src: url('../fonts/hind-v16-latin/hind-v16-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/hind-v16-latin/hind-v16-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/hind-v16-latin/hind-v16-latin-regular.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('../fonts/hind-v16-latin/hind-v16-latin-regular.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('../fonts/hind-v16-latin/hind-v16-latin-regular.svg#Hind') format('svg'); /* Legacy iOS */
}

/* hind-500 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Hind';
  font-style: normal;
  font-weight: 500;
  src: url('../fonts/hind-v16-latin/hind-v16-latin-500.eot'); /* IE9 Compat Modes */
  src: url('../fonts/hind-v16-latin/hind-v16-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/hind-v16-latin/hind-v16-latin-500.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/hind-v16-latin/hind-v16-latin-500.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('../fonts/hind-v16-latin/hind-v16-latin-500.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('../fonts/hind-v16-latin/hind-v16-latin-500.svg#Hind') format('svg'); /* Legacy iOS */
}

/* hind-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Hind';
  font-style: normal;
  font-weight: 600;
  src: url('../fonts/hind-v16-latin/hind-v16-latin-600.eot'); /* IE9 Compat Modes */
  src: url('../fonts/hind-v16-latin/hind-v16-latin-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/hind-v16-latin/hind-v16-latin-600.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/hind-v16-latin/hind-v16-latin-600.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('../fonts/hind-v16-latin/hind-v16-latin-600.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('../fonts/hind-v16-latin/hind-v16-latin-600.svg#Hind') format('svg'); /* Legacy iOS */
}

/* hind-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Hind';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/hind-v16-latin/hind-v16-latin-700.eot'); /* IE9 Compat Modes */
  src: url('../fonts/hind-v16-latin/hind-v16-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/hind-v16-latin/hind-v16-latin-700.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/hind-v16-latin/hind-v16-latin-700.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('../fonts/hind-v16-latin/hind-v16-latin-700.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('../fonts/hind-v16-latin/hind-v16-latin-700.svg#Hind') format('svg'); /* Legacy iOS */
}

/* lemon-tuesday */
@font-face {
  font-display: swap; 
  font-family: 'lemon-tuesday';
  font-style: normal;
  font-weight: normal;
  src: url('../fonts/lemon-tuesday/lemon_tuesday.otf') format('opentype'); 
}


/***************************************************************************
* Typografie
***************************************************************************/
body > *, body h1, body h2, body h5, body h6, .h1, .h2, .h5, .h6, div.ce_revolutionslider_text.bold {
	font-family: 'Hind' !important;
	font-weight: 400;
}

body h1, body h2 {
    font-weight: 700;
}

body h1:after {
    content: "";
    height: 5px;
    width: 130px;
    background: var(--thirdColor);
    display: block;
}

body {
	/*font-family: 'Hind';*/
	font-weight: 400;
	font-style: normal;
	font-size: 18px;
}

body h3, body h4 {
	font-weight: 600;
}

body h3 {
    font-size: 1.5rem;
}

body h4 {
    font-size: 1.3rem;
}

h1, h5, h6 {
	font-family: 'Hind';
	font-weight: 400;
	font-style: normal;
}

.ce_headerimage .ce_headline h2 {
    font-family: 'lemon-tuesday';
    font-size: 80px;
    color: #4b6281;
}

.ce_headerimage .subline {
    font-size: 40px;
    margin-top: 10px;
    font-weight: 400;
}

.ce_headerimage_inside {
    background: rgba(255,255,255,0.8);
}


.handwriting {
    font-family: 'lemon-tuesday';
}

#header {
  font-family: 'Hind';
}

.intranet .ce_accordion button {
    font-family: 'Hind';
    font-size: 18px;
}

a {
    color: var(--accentColor);
}


/***************************************************************************
* Breadcrumb
***************************************************************************/
.mod_breadcrumb .mod_breadcrumb_inside:after, .mod_breadcrumb .mod_breadcrumb_inside:before {
    border-top: 0;
}

.no-hero .mod_breadcrumb {
    display: none;
}

/***************************************************************************
* Überschriften
***************************************************************************/
.title-container {
    display: flex;
    align-items: center;
    justify-content: center;
}

.title-container .line {
    height: 2px;
    width: 50px; /* oder eine andere Breite nach Bedarf */
    background: var(--thirdColor);
    margin: 0 10px; /* Abstand zwischen Linie und Titel */
}

.title-container h2 {
    margin: 0;
}

.title-container {
    margin-bottom: 25px;
}

@media only screen and (max-width: 767px) {
    .title-container h2 {
        text-align: center;
    }
}


/***************************************************************************
* Farb-Klassen
***************************************************************************/
.bg_secondColor {
    background: var(--bg-secondColor);
}

.bg-lightgray {
	background-color: #e0dfda !important;
}


/***************************************************************************
* Attribute * Icons * Links
***************************************************************************/
a.hyperlink_txt:hover {
    color: #ffffff !important;
}

#footer a:hover {
    color: var(--accentColor) !important;
}

#footer a:before {
    background-color: #ffffff;
}

#main a[href ^="https://"],
#main a[href$='.pdf'],
#main a[href*='.pdf?'], 
#main .ext-pdf a,
#main a[href$='.docx'],
#main a[href*='.docx?'],
a[href^="mailto:"],
a[href^="tel:"]{
    position: relative;
    padding-left: 30px;
}

#main a[href ^="https://"]:before,
#main a[href$='.pdf']:before,
#main a[href*='.pdf?']:before, 
.ext-pdf a:before,
#main a[href$='.docx']:before,
#main a[href*='.docx?']:before,
a[href^="tel:"]:before,
a[href^="mailto:"]:before{
  content: "";
  position: absolute;
  width: 18px;
  height: 18px;
  margin-top: 2px;
  margin-left: -30px;
  background-color: var(--accentColor); 
  mask-size: contain;
  -webkit-mask-size: contain;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}

#main p a:before {
      mask: url("/files/sarb/layoutelemente/fontawesome-light-svg/circle-chevron-right.svg") no-repeat center;
  -webkit-mask: url("/files/sarb/layoutelemente/fontawesome-light-svg/circle-chevron-right.svg") no-repeat center;
   padding-left: var(--abstand-xxs);
}

#main p a:hover:before {
      mask: url("/files/sarb/layoutelemente/fontawesome-solid-svg/circle-chevron-right.svg") no-repeat center;
  -webkit-mask: url("/files/sarb/layoutelemente/fontawesome-solid-svg/circle-chevron-right.svg") no-repeat center;
  padding-left: var(--abstand-xxs);
}



.bg_downloads .ext-pdf a:before,
.bg_headertext .ext-pdf a:before{
    background-color: #ffffff !important;
}

#main p a[href$='.pdf']:before,
#main p a[href*='.pdf?']:before,
#main a[href$='.pdf']:before,
#main a[href*='.pdf?']:before, 
#main .ext-pdf a:before{
      mask: url("/files/sarb/layoutelemente/fontawesome-light-svg/file-pdf.svg") no-repeat center;
  -webkit-mask: url("/files/sarb/layoutelemente/fontawesome-light-svg/file-pdf.svg") no-repeat center;
}

#main p a[href$='.pdf']:hover:before,
#main p a[href*='.pdf?']:hover:before,
#main a[href$='.pdf']:hover:before,
#main a[href*='.pdf?']:hover:before, 
#main .ext-pdf a:hover:before{
      mask: url("/files/sarb/layoutelemente/fontawesome-solid-svg/file-pdf.svg") no-repeat center;
  -webkit-mask: url("/files/sarb/layoutelemente/fontawesome-solid-svg/file-pdf.svg") no-repeat center;
}

#main p a[href^="mailto:"]:before,
a[href^="mailto:"]:before {
      mask: url("/files/sarb/layoutelemente/fontawesome-light-svg/envelope.svg") no-repeat center;
  -webkit-mask: url("/files/sarb/layoutelemente/fontawesome-light-svg/envelope.svg") no-repeat center;
  background-color: var(--accentColor);
}

#main p a[href^="mailto:"]:hover:before,
a[href^="mailto:"]:hover:before {
      mask: url("/files/sarb/layoutelemente/fontawesome-solid-svg/envelope.svg") no-repeat center;
  -webkit-mask: url("/files/sarb/layoutelemente/fontawesome-solid-svg/envelope.svg") no-repeat center;
  background-color: var(--accentColor);
}

#main p a[href^="tel:"]:before,
a[href^="tel:"]:before {
      mask: url("/files/sarb/layoutelemente/fontawesome-light-svg/phone.svg") no-repeat center;
  -webkit-mask: url("/files/sarb/layoutelemente/fontawesome-light-svg/phone.svg") no-repeat center;
  background-color: var(--accentColor);
}

#main p a[href^="tel:"]:hover:before,
a[href^="tel:"]:hover:before {
      mask: url("/files/sarb/layoutelemente/fontawesome-solid-svg/phone.svg") no-repeat center;
  -webkit-mask: url("/files/sarb/layoutelemente/fontawesome-solid-svg/phone.svg") no-repeat center;
  background-color: var(--accentColor);
}

#main p a[href$='.docx']:before,
#main p a[href*='.docx?']:before,
#main a[href$='.docx']:before,
#main a[href*='.docx?']:before {
      mask: url("/files/sarb/layoutelemente/fontawesome-light-svg/file-word.svg") no-repeat center;
  -webkit-mask: url("/files/sarb/layoutelemente/fontawesome-light-svg/file-word.svg") no-repeat center;
}

#main p a[href$='.docx']:hover:before,
#main p a[href*='.docx?']:hover:before,
#main a[href$='.docx']:hover:before,
#main a[href*='.docx?']:hover:before {
      mask: url("/files/sarb/layoutelemente/fontawesome-solid-svg/file-word.svg") no-repeat center;
  -webkit-mask: url("/files/sarb/layoutelemente/fontawesome-solid-svg/file-word.svg") no-repeat center;
}

#main a[href ^="https://"]:before{
          mask: url("/files/sarb/layoutelemente/fontawesome-light-svg/link.svg") no-repeat center;
  -webkit-mask: url("/files/sarb/layoutelemente/fontawesome-light-svg/link.svg") no-repeat center;
}

#main a[href ^="https://"]:hover:before {
          mask: url("/files/sarb/layoutelemente/fontawesome-solid-svg/link.svg") no-repeat center;
  -webkit-mask: url("/files/sarb/layoutelemente/fontawesome-solid-svg/link.svg") no-repeat center;
}



.datenschutz div.ce_text li a {
	color: var(--accentColor);
}

/***************************************************************************
* Hyperlink mit Icon
***************************************************************************/
.ce_hyperlink a:hover, a.btn:hover,
.ce_hyperlink-extended a.link-own-color-lighttxt:hover, 
.ce_hyperlink-extended a.link-own-color-darktxt:hover, 
.ce_hyperlink-extended a.link-own-color-outline:hover {
    opacity: 1;
}

#footer .ce_hyperlin:hover a, 
#footer .ce_hyperlink:hover a, 
#footer .ce_hyperlink:hover a {
    color: #ffffff !important;
}


#slider .ce_hyperlink a.hyperlink_txt,
#main .ce_hyperlink a.hyperlink_txt, 
#footer .ce_hyperlink a.hyperlink_txt{
    position: relative;
    padding-left: 50px;
}

#slider .ce_hyperlink a.hyperlink_txt:before,
#main .ce_hyperlink a.hyperlink_txt:before,
#footer .ce_hyperlink a.hyperlink_txt:before{
  content: "";
  width: 20px;
  height: 20px;
  margin-top: 0;
  position: absolute;
  margin-left: -30px;
  background-color: #ffffff !important; 
  mask-size: contain;
  -webkit-mask-size: contain;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}


#slider .ce_hyperlink a.hyperlink_txt.link-own-color-darktxt:before,
#main .ce_hyperlink a.hyperlink_txt.link-own-color-darktxt:before,
#footer .ce_hyperlink a.hyperlink_txt.link-own-color-darktxt:before {
    background-color: var(--accentColor) !important;
}

#slider .ce_hyperlink a.hyperlink_txt.link-own-color-darktxt,
#main .ce_hyperlink a.hyperlink_txt.link-own-color-darktxt,
#footer .ce_hyperlink a.hyperlink_txt.link-own-color-darktxt {
    color: var(--accentColor) !important;
}

#slider .ce_hyperlink a.hyperlink_txt:before,
#main .ce_hyperlink a.hyperlink_txt:before,
#footer .ce_hyperlink a.hyperlink_txt:before{
   mask: url("/files/sarb/layoutelemente/fontawesome-light-svg/circle-chevron-right.svg ") no-repeat center;
  -webkit-mask: url("/files/sarb/layoutelemente/fontawesome-light-svg/circle-chevron-right.svg ") no-repeat center;
}

#slider .ce_hyperlink a.hyperlink_txt:hover:before,
#main .ce_hyperlink a.hyperlink_txt:hover:before,
#footer .ce_hyperlink a.hyperlink_txt:hover:before{
   mask: url("/files/sarb/layoutelemente/fontawesome-solid-svg/circle-chevron-right.svg ") no-repeat center;
  -webkit-mask: url("/files/sarb/layoutelemente/fontawesome-solid-svg/circle-chevron-right.svg ") no-repeat center;
}

#slider .ce_hyperlink a[href$='.pdf'].hyperlink_txt:before,
#slider .ce_hyperlink a[href*='.pdf?'].hyperlink_txt:before,
#main .ce_hyperlink a[href$='.pdf'].hyperlink_txt:before,
#main .ce_hyperlink a[href*='.pdf?'].hyperlink_txt:before,
#footer .ce_hyperlink a[href$='.pdf'].hyperlink_txt:before,
#footer .ce_hyperlink a[href*='.pdf?'].hyperlink_txt:before{
   mask: url("/files/sarb/layoutelemente/fontawesome-light-svg/file-pdf.svg") no-repeat center;
  -webkit-mask: url("/files/sarb/layoutelemente/fontawesome-light-svg/file-pdf.svg") no-repeat center;
}

#slider .ce_hyperlink a[href$='.pdf'].hyperlink_txt:hover:before,
#slider .ce_hyperlink a[href*='.pdf?'].hyperlink_txt:hover:before,
#main .ce_hyperlink a[href$='.pdf'].hyperlink_txt:hover:before,
#main .ce_hyperlink a[href*='.pdf?'].hyperlink_txt:hover:before,
#footer .ce_hyperlink a[href$='.pdf'].hyperlink_txt:hover:before,
#footer .ce_hyperlink a[href*='.pdf?'].hyperlink_txt:hover:before{
   mask: url("/files/sarb/layoutelemente/fontawesome-solid-svg/file-pdf.svg") no-repeat center;
  -webkit-mask: url("/files/sarb/layoutelemente/fontawesome-solid-svg/file-pdf.svg") no-repeat center;
}

#slider .q-wiki-hyperlink a.hyperlink_txt:before,
#main .q-wiki-hyperlink a.hyperlink_txt:before,
#footer .q-wiki-hyperlink a.hyperlink_txt:before{
   mask: url("/files/sarb/layoutelemente/fontawesome-light-svg/folder-magnifying-glass.svg") no-repeat center;
  -webkit-mask: url("/files/sarb/layoutelemente/fontawesome-light-svg/folder-magnifying-glass.svg") no-repeat center;
}

#slider .q-wiki-hyperlink a.hyperlink_txt:hover:before,
#main .q-wiki-hyperlink a.hyperlink_txt:hover:before,
#footer .q-wiki-hyperlink a.hyperlink_txt:hover:before{
   mask: url("/files/sarb/layoutelemente/fontawesome-solid-svg/folder-magnifying-glass.svg") no-repeat center;
  -webkit-mask: url("/files/sarb/layoutelemente/fontawesome-solid-svg/folder-magnifying-glass.svg") no-repeat center;
}

#slider .ce_hyperlink.icon_spenden a.hyperlink_txt:before,
#main .ce_hyperlink.icon_spenden a.hyperlink_txt:before,
#footer .ce_hyperlink.icon_spenden a.hyperlink_txt:before{
   mask: url("/files/sarb/layoutelemente/fontawesome-light-svg/hand-holding-heart.svg ") no-repeat center;
  -webkit-mask: url("/files/sarb/layoutelemente/fontawesome-light-svg/hand-holding-heart.svg ") no-repeat center;
}

#slider .ce_hyperlink.icon_spenden a.hyperlink_txt:hover:before,
#main .ce_hyperlink.icon_spenden a.hyperlink_txt:hover:before,
#footer .ce_hyperlink.icon_spenden a.hyperlink_txt:hover:before{
   mask: url("/files/sarb/layoutelemente/fontawesome-solid-svg/hand-holding-heart.svg") no-repeat center;
  -webkit-mask: url("/files/sarb/layoutelemente/fontawesome-solid-svg/hand-holding-heart.svg") no-repeat center;
}

#slider .ce_hyperlink.kalender a.hyperlink_txt:before,
#main .ce_hyperlink.kalender a.hyperlink_txt:before,
#footer .ce_hyperlink.kalender a.hyperlink_txt:before {
      mask: url("/files/sarb/layoutelemente/fontawesome-light-svg/calendar-lines-pen.svg") no-repeat center;
  -webkit-mask: url("/files/sarb/layoutelemente/fontawesome-light-svg/calendar-lines-pen.svg") no-repeat center;
   padding-left: var(--abstand-xxs);
}

#slider .ce_hyperlink.kalender a.hyperlink_txt:hover:before,
#main .ce_hyperlink.kalender a.hyperlink_txt:hover:before,
#footer .ce_hyperlink.kalender a.hyperlink_txt:hover:before {
      mask: url("/files/sarb/layoutelemente/fontawesome-solid-svg/calendar-lines-pen.svg") no-repeat center;
  -webkit-mask: url("/files/sarb/layoutelemente/fontawesome-solid-svg/calendar-lines-pen.svg") no-repeat center;
  padding-left: var(--abstand-xxs);
}

/***************************************************************************
* Header
***************************************************************************/
.header.original .mainmenu::before {
	content: '';
	height: 0;
	position: absolute; 
	left: 40px;
	bottom: 60px;
	right: 40px;
	background: 0 !important;
    opacity: 0;
}

.no-hero .header.original {
    box-shadow: 0 0 2px 2px rgba(0,0,0,0.1);
}

#header {
    postion: relative
}

/***************************************************************************
* Mainmenu / Spitex-Button / GRA2-Button
***************************************************************************/
.mod_navigation .mainmenu {
    width: 100%;
    position: relative;
}

.stickyheader .mod_customnav {
    position: absolute;
    right: 0;
}

.stickyheader .mainmenu {
    margin-right: 85px;
}

.spitex_sticker {
    width: 150px;
    padding-top: 10px;
    padding-left: 10px;
    padding-right: 10px;
    background: rgba(255,255,255,0.95);
    height: 80px;
    position: absolute;
    z-index: 100;
    right: 10px;
    bottom: -70px;
    transform: rotate(5deg);
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3); 
    transition: transform 0.3s ease, box-shadow 0.3s ease; 
}

.spitex_sticker img {
    padding-top: 15px;
}

.gra2_sticker img {
    padding-top: 3px !important;
}

.spitex_sticker:before {
    content:"";
    width: 90px;
    height: 20px;
    z-index: 150;
    position: absolute;
    top: -10px;
    left: 33px;
    transform: rotate(0deg);
    background-color: rgba(217, 245, 79, 0.3);
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
    
}

.spitex_sticker:hover {
    transform: rotate(10deg); 
}


/***************************************************************************
* Mainmenu Intranet
***************************************************************************/
.intranet .mainmenu ul li a {
	font-family: Hind;
	font-size: 18px;
	font-weight: normal;
}


/***************************************************************************
* Metanavi - Web
***************************************************************************/
.header .header_metanavi li {
    height: 65px;
    text-align: center;
    min-width: 53px;

}

.header .header_metanavi a {
    display: block;
    background: url("../../sarb/layoutelemente/icons/icon-bauinformationen.svg") center center;
    background-size: 35px;
    background-repeat: no-repeat;
    background-position: center top;
    padding-top: 25px;
    margin-left: 20px;
    margin-right: 20px;
    color: #000000;
}

.header .header_metanavi ._menu a {
    background: url("../../sarb/layoutelemente/icons/icon-menuplan.svg") center center;
    background-size: 35px;
    background-repeat: no-repeat;
    background-position: center top;
}

.header .header_metanavi ._spenden a {
    background: url("../../sarb/layoutelemente/icons/icon-spenden.svg") center center;
    background-size: 35px;
    background-repeat: no-repeat;
    background-position: center top;
}

.header .header_metanavi ._jobs a {
    background: url("../../sarb/layoutelemente/icons/icon-jobs.svg") center center;
    background-size: 35px;
    background-repeat: no-repeat;
    background-position: center top;
}

.header .header_metanavi ._baustelleninformation a {
    background: url("../../sarb/layoutelemente/icons/icon-bauinformationen.svg") center center;
    background-size: 35px;
    background-repeat: no-repeat;
    background-position: center top;
}

.header .header_metanavi ._zuweisende a {
    background: url("../../sarb/layoutelemente/icons/icon-zuweisende.svg") center center;
    background-size: 35px;
    background-repeat: no-repeat;
    background-position: center top;
}

.header .header_metanavi ._suche a {
    background: url("../../sarb/layoutelemente/icons/icon-suche.svg") center center;
    background-size: 35px;
    background-repeat: no-repeat;
    background-position: center top;
}

.header .header_metanavi a:last-child {
    padding-right: 0;
}


/***************************************************************************
* Metanavi - Spitex
***************************************************************************/
.header .header_metanavi ._jobs_spitex a {
    background: url("../../sarb/layoutelemente/icons/icon-jobs-spitex.svg") center center;
    background-size: 35px;
    background-repeat: no-repeat;
    background-position: center top;
}

.header .header_metanavi ._suche_spitex a {
    background: url("../../sarb/layoutelemente/icons/icon-suche-spitex.svg") center center;
    background-size: 35px;
    background-repeat: no-repeat;
    background-position: center top;
}


/***************************************************************************
* Metanavi - Intranet
***************************************************************************/
.header .header_metanavi ._reme a {
    background: url("../../sarb/layoutelemente/icons/icon-reme.svg") center center;
    background-size: 35px;
    background-repeat: no-repeat;
    background-position: center top;
}

.header .header_metanavi ._cirs a {
    background: url("../../sarb/layoutelemente/icons/icon-cirs.svg") center center;
    background-size: 35px;
    background-repeat: no-repeat;
    background-position: center top;
}

.header .header_metanavi ._weiterbildung a {
    background: url("../../sarb/layoutelemente/icons/icon-weiterbildung.svg") center center;
    background-size: 35px;
    background-repeat: no-repeat;
    background-position: center top;
}

.header .header_metanavi ._q_wiki a {
    background: url("../../sarb/layoutelemente/icons/icon-q-wiki.svg") center center;
    background-size: 35px;
    background-repeat: no-repeat;
    background-position: center top;
}

.header .header_metanavi ._briefkasten a {
    background: url("../../sarb/layoutelemente/icons/icon-briefkasten.svg") center center;
    background-size: 35px;
    background-repeat: no-repeat;
    background-position: center top;
}

/***************************************************************************
* Customnav / MobNav - Web
***************************************************************************/
div.mod_mmenu_custom_nav a {
    height: 65px;
    text-align: center;
    min-width: 60px;
    padding-top: 35px;
    color: #000000;
}

div.mod_mmenu_custom_nav a:hover {
    color: var(--accentColor);
}

div.mod_mmenu_custom_nav a._spenden {
    background: url("../../sarb/layoutelemente/icons/icon-spenden.svg") center center;
    background-size: 35px;
    background-repeat: no-repeat;
    background-position: center top;
}

div.mod_mmenu_custom_nav a._bauinformation{
    background: url("../../sarb/layoutelemente/icons/icon-bauinformationen.svg") center center;
    background-size: 35px;
    background-repeat: no-repeat;
    background-position: center top;
}

div.mod_mmenu_custom_nav a._menu{
    background: url("../../sarb/layoutelemente/icons/icon-menuplan.svg") center center;
    background-size: 35px;
    background-repeat: no-repeat;
    background-position: center top;
}

div.mod_mmenu_custom_nav a._jobs{
    background: url("../../sarb/layoutelemente/icons/icon-jobs.svg") center center;
    background-size: 35px;
    background-repeat: no-repeat;
    background-position: center top;
}

div.mod_mmenu_custom_nav a._zuweisende{
    background: url("../../sarb/layoutelemente/icons/icon-zuweisende.svg") center center;
    background-size: 35px;
    background-repeat: no-repeat;
    background-position: center top;
}


/***************************************************************************
* Customnav / MobNav - Spitex
***************************************************************************/
div.mod_mmenu_custom_nav a._jobs_spitex {
    background: url("../../sarb/layoutelemente/icons/icon-jobs-spitex.svg") center center;
    background-size: 35px;
    background-repeat: no-repeat;
    background-position: center top;
}


/***************************************************************************
* Customnav / MobNav - Intranet
***************************************************************************/
div.mod_mmenu_custom_nav a._reme {
    background: url("../../sarb/layoutelemente/icons/icon-reme.svg") center center;
    background-size: 35px;
    background-repeat: no-repeat;
    background-position: center top;
}

div.mod_mmenu_custom_nav a._cirs {
    background: url("../../sarb/layoutelemente/icons/icon-cirs.svg") center center;
    background-size: 35px;
    background-repeat: no-repeat;
    background-position: center top;
}

div.mod_mmenu_custom_nav a._weiterbildung {
    background: url("../../sarb/layoutelemente/icons/icon-weiterbildung.svg") center center;
    background-size: 35px;
    background-repeat: no-repeat;
    background-position: center top;
}

div.mod_mmenu_custom_nav a._q_wiki {
    background: url("../../sarb/layoutelemente/icons/icon-q-wiki.svg") center center;
    background-size: 35px;
    background-repeat: no-repeat;
    background-position: center top;
}

div.mod_mmenu_custom_nav a._briefkasten {
    background: url("../../sarb/layoutelemente/icons/icon-briefkasten.svg") center center;
    background-size: 35px;
    background-repeat: no-repeat;
    background-position: center top;
}

/***************************************************************************
* MegaMenu
***************************************************************************/
.mod_pct_megamenu .mod_navigation a:before {
    transform-origin: left; /* Ursprung der Transformation auf der linken Seite */
}

.mod_pct_megamenu .mod_navigation a, .mod_pct_megamenu .mod_customnav a {
    position: relative;
    padding-left: 20px;
}

.mod_pct_megamenu .mod_navigation a:after, .mod_pct_megamenu .mod_customnav a:after {
    font-family: FontAwesome;
    content: "\f105";
    margin-right: 2px;
    margin-left: 2px;
    transition: all 0.3s;
    display: inline-block;
    transform-origin: center center;
    position: absolute;
    left: 0;
}

.mod_pct_megamenu .h6 {
    margin-bottom: 5px;
}

.mod_pct_megamenu.active {
    border-top: 1px solid var(--accentColor);
}

.mainmenu_link:hover .mod_pct_megamenu  {
    display: block
}

/***************************************************************************
* Mobile Menu
***************************************************************************/

.mobile_vertical a {
    color: #000000;
}

.mobile_vertical a:hover {
    color: var(--accentColor);
}

#mmenu .mod_navigation li a.active {
    color: var(--accentColor);
}

#mmenu .mod_mmenu_custom_nav  {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr);
    gap: 5px;
    width: 100%;
}

#mmenu .mod_mmenu_custom_nav a{
    margin-right: 0;
}

/***************************************************************************
* Footer: Web & Intranet
***************************************************************************/
#footer, #bottom {
	background-color: var(--secondColor) !important;
	font-size: 16px;
}

#footer h4{
    font-family: 'Hind';
    font-size: 25px;
}

#footer a[href^="mailto:"], #footer a[href^="tel:"] {
	position: relative;
	padding-left: 30px;
	color: #ffffff !important;
}

#footer .totop {
    display: none;
}

#privacy_optout_link {
    display: none;
}

/***************************************************************************
* Suche
***************************************************************************/
#main .mod_search {
	text-align: left;
}

#main .mod_search input {
	border-radius: 0;
}

.mod_search p.header {
	margin-top: 0px;
}

#main .mod_search .search_default {
    margin-top: 20px;
    border-bottom: 1px solid rgb(153,153,153);
}

#main .mod_search .search_default h3 a {
    color: var(--accentColor);
}

#mmenu .mod_search {
	width: 100%;
}

/***************************************************************************
* Hero-Texte
***************************************************************************/
.bg_headertext {
    background: var(--bg-secondColor);
    width: 60%;
    float: right;
    padding: var(--abstand-m);
}

.bg_headertext h2 {
    margin-bottom: var(--abstand-xxxs);
    font-weight: 700;
}

.bg_headertext h4 {
    margin-bottom: var(--abstand-xxs);
    font-weight: 700;
}

.bg_headertext .ce_text {
    margin-bottom: var(--abstand-m);
}

.bg_header_accentColor {
    background: var(--accentColor);
    padding: var(--abstand-s) var(--abstand-m);
    display: inline-block;
    color: #ffffff;
    font-family: 'lemon-tuesday' !important;
    font-style: normal;
    font-weight: normal;
}


/***************************************************************************
* Teamboxen
***************************************************************************/
.ce_teambox .function {
	color: #000000;
}

.mod_newslist.mitarbeitende_col4 {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 20px;
}

.intranet .teambox_content .h5 {
    font-family: Hind;
}

/* Wenn ein Mitarbeiter im Intranet eine andere E-Mail-Adresse hat, als als Kontaktperson auf der Website */
.intranet .teambox_content .weitereemail {
    display: none;
}

#ausbildung-kontakt .teambox_content div.email {
    display: none;
}



/***************************************************************************
* Testimonial
***************************************************************************/
.ce_testimonial_inside .text {
    padding: 40px 20px;
}

.font-style-quote {
    padding: 40px 30px 40px 30px;
}

.ce_text_extented.font-style-quote p:first-child::before {
	content: "\f10d";
	font-family: "FontAwesome";
	position: absolute;
	top: -60px;
	left: 0px;
	opacity: 1;
	font-size: 3.5rem;
	line-height: 3rem;
}

.ce_text_extented.block.font-style-quote {
	overflow: unset !important;
}

.ce_text_extented.font-style-quote p {
	border-left: 0;
	padding-left: 0;
	position: relative;
}

/***************************************************************************
* Testimonial: Stimmen 38-Stunden-Woche
***************************************************************************/
#stimmen-spitex .ce_text_extented.font-style-quote p:first-child::before, #stimmen-pflege .ce_text_extented.font-style-quote p:first-child::before, #stimmen-unterhalt .ce_text_extented.font-style-quote p:first-child::before {
    color: var(--secondColor);
}

#stimmen-spitex .font-style-quote, #stimmen-pflege .font-style-quote, #stimmen-unterhalt .font-style-quote {
    padding: 40px 30px 0px 30px;
}

#stimmen-spitex .ce_text_extented, #stimmen-pflege .ce_text_extented, #stimmen-unterhalt .ce_text_extented {
    padding: 0px 30px 0px 30px;
}


/***************************************************************************
* Angehörige: inkl. Stimmen Bewohner
***************************************************************************/
.mod_eventlist_v3 .event-sarb .item-inside {
	padding: 15px;
	border: 0;
	background: var(--light-grey);
	transition: All 0.5s ease;
	-webkit-transition: All 0.5s ease;
	position: relative;
}

.mod_eventlist_v3 i {
    opacity: 1;
}

.mod_eventlist_v3 .meta-info {
    border-top: none;
    padding-top: 0;
    color: #000000;
}

.event-sarb a[href^="https://"]::before {
	display: none;
}

.event-sarb a[href^="https://"] {
    padding-left: 0px !important;
}

#stimmen-bewohner .ce_text_extented.font-style-quote p:first-child::before {
    color: var(--secondColor);
}

#stimmen-bewohner .font-style-quote {
    padding: 40px 30px 0px 30px;
}

#stimmen-bewohner .ce_text_extented {
    padding: 0px 30px 0px 30px;
}

#angehoerige-impressionen .mod_portfoliolist_v3 .item .title {
	margin-bottom: 0;
	float: left;
	font-size: 1rem;
	line-height: 1;
	margin-right: 10px;
	margin-bottom: 0;
	font-weight: bold;
	color: #fff;
}

#angehoerige-impressionen .mod_portfoliolist_v3 .item .content {
	position: absolute;
	bottom: 15px;
	margin: 0;
	background: var(--bg-secondColor);
	left: 0;
	right: 0;
}

/***************************************************************************
* News
***************************************************************************/
.newsteaser .info {
    display: none;
}

.newsteaser-inside {
    background: var(--bg-lightColor) !important;
    position: relative;
    border-bottom: 1px solid var(--thirdColor);
    position: relative;
    display: flex;
    flex-direction: column;
    height: 100%;
}

.newsteaser .content {
    background: none !important;
    border: none;
    padding: 15px;
}

.newsteaser .link {
    position: absolute;
    bottom: 15px;
    left: 15px;
}

.newsteaser .content .h6 a {
    font-family: 'Hind';
    color: var(--accentColor) !important;
    font-size: 15px;
}

.newsteaser .image_container, .newsteaser .content {
    border-radius: 0;
}

.newsteaser .h6 {
    word-wrap: break-word;
    font-weight: bold;
}

.teaser p {
    color: #000000;
    word-wrap: break-word;
    margin-bottom: 50px;
}


/***************************************************************************
* News-Favoriten
***************************************************************************/
.newsteaser.featured .newsteaser-inside {
	background: var(--accentColor) !important;
	border-bottom: 1px solid var(--accentColor) !important;
}

.newsteaser.featured .content .h6 a, .newsteaser.featured .teaser p, .newsteaser.featured p a {
    color: #fff !important;
}

/*.newsteaser.featured .date { background: var(--thirdColor); }*/

/***************************************************************************
* Imagemap
***************************************************************************/
.ce_imagemap .circle {
	border-radius: 100%;
	width: 30px;
	height: 30px;
	border: none;
	position: absolute;
	left: 50%;
	top: 50%;
	margin-left: -18px;
	margin-top: -18px;
	display: block;
	background: none;
	animation: pulseImageMap 2s infinite;
	box-shadow: 0 0 0 4px var(--accentColor);
}

.ce_imagemap .hotspot_content h5 {
    margin-bottom: 10px !important;
}

.ce_imagemap .hotspot_content {
	min-width: 300px;
}

/***************************************************************************
* Vertikaler Raumteiler
***************************************************************************/

#slider .ce_vertical_spacer_px {
    max-height: 200px;
}

/***************************************************************************
* Downloads Unterseiten
***************************************************************************/
.bg_downloads {
    background: var(--secondColor);
    width: 50%;
    float: right;
    padding: var(--abstand-m);
}

.bg_downloads h2, .bg_downloads a, .bg_downloads a span.size {
    color: #ffffff !important;
}

.bg_headertext .ce_downloads {
    margin-bottom: var(--abstand-m);
}

.ce_downloads a span.size {
	display: none;
}

/***************************************************************************
* gallerie hintergrund
***************************************************************************/
.ce_gallery .content {
    background: var(--bg-secondColor);
}

/***************************************************************************
* Offene Stellen
***************************************************************************/
#stellen-pflege .ce_fancylink, #stellen-spitex .ce_fancylink, #stellen-gastro .ce_fancylink, #stellen-hw .ce_fancylink, #stellen-bundt .ce_fancylink, #stellen-admin .ce_fancylink, #freie-lehrst .ce_fancylink {
    margin-bottom: var(--abstand-xs);
}

/***************************************************************************
* überschreiben von Attributen
***************************************************************************/
#main .back a:before{
    mask: none !important;
}
/***************************************************************************
* Fancylink style1 und style2
***************************************************************************/

.ce_fancylink.style1 a {
    position: relative !important;
}

.ce_fancylink.style1 .shaft{
    display: none;
    }

.ce_fancylink.style1 a:before {
    position: absolute !important;
    left: 2px !important;
    width: 22px !important;
    font-family: 'Fontawesome' !important;
    content: "\f105" !important;
    color: var(--accentColor) !important;
    font-weight: normal;
    font-style: normal;
    line-height: 30px !important;
    font-size: 14px !important;
    text-align: center!important;
    height: 30px !important;
    margin-top: -16px !important;
    margin-left: 0 !important;
    top: 13px !important;
    transition: all 0.33s cubic-bezier(0.10,0.90,0.5,1) !important;
    }

.ce_fancylink.style1.fancylink_color_white a:before {
    color: #ffffff !important;
}

.ce_fancylink.style1 a:before,
.ce_fancylink.style1.fancylink_color_white .shaft:before{
    background-color: transparent !important;
    mask: none !important;
    -webkit-mask: none !important;
    }


.ce_fancylink.style1 a:after {
    content: '';
    border-radius: 100%;
    border: 1px solid var(--accentColor);
    height: 22px;
    width: 22px;
    transform: translateY(-50%);
    transform-origin: center;
    position: absolute;
    left: 0;
    top: 13px;
    display: block;
    transition: all 0.33s cubic-bezier(0.10,0.90,0.5,1);
    }

.ce_fancylink.style1.fancylink_color_white a:after {
    content: '';
    border-radius: 100%;
    border: 1px solid #ffffff;
    height: 22px;
    width: 22px;
    transform: translateY(-50%);
    transform-origin: center;
    position: absolute;
    left: 0;
    top: 13px;
    display: block;
    transition: all 0.33s cubic-bezier(0.10,0.90,0.5,1);
    }
 
.ce_fancylink.style1 a:hover:after {   
    transform: scale(0.8) translateY(-50%);
    transform-origin: center;
    opacity: 0;
}

.ce_fancylink.style1 a:hover:after{    
    left: 0;
    width: 24px;
    height: 1px;
    background: var(--accentColor);
    transform: none;
    margin-top: -1px;
    border: none;
    top: 13px;
    opacity: 1;
    }
    
.ce_fancylink.style1 a {
    padding-left: 35px;
    line-height: 1.7;
    color: var(--accentColor);
    }
    
.ce_fancylink.style1.fancylink_color_white a {
    color: #ffffff !important;
    }

.ce_fancylink.style1.fancylink_color_white a:hover {
    color: var(--accentColor) !important;
}

#main .ce_fancylink.style1 a:hover:before {
    background: none !important;
}
    
.ce_fancylink.style1 a:hover .link_text {
    transform: none;
}

.ce_fancylink.style1 a:hover:before {
    transform: scale(1, 1) translateX(9px);
    left: 2px;
    color: var(--accentColor) !important;
    }
    
.ce_fancylink.style2 a:before {
    display: none;
}

.standort-no-content .ce__sarb_standorte.standort .box .bild::after {
	display: none;
}


/***************************************************************************
* fancylink für Standorte und Standorte Nummern
***************************************************************************/ 

.standort.ce_fancylink.style1.fancylink_color_white a:after {
    content: '';
    border-radius: 100%;
    border: 1px solid var(--accentColor);
    background: var(--accentColor);
    height: 22px;
    width: 22px;
    transform: translateY(-50%);
    transform-origin: center;
    position: absolute;
    left: 0;
    top: 13px;
    display: block;
    transition: all 0.33s cubic-bezier(0.10,0.90,0.5,1);
    color: #ffffff;
    font-weight: 700;
    text-align: center;
    line-height: 25px;
    }

.standort.ce_fancylink.style1 a:before {
    display: none;
    }
    
.standort.ce_fancylink.style1 a:hover:after {
    margin-top: 0;
}

.standort-01.standort.ce_fancylink.style1.fancylink_color_white a:after,
.ce__sarb_standorte.standort.standort-01 .box .bild:after{
    content: '1';
}

.standort-02.standort.ce_fancylink.style1.fancylink_color_white a:after,
.ce__sarb_standorte.standort.standort-02 .box .bild:after{
    content: '2';
}

.standort-03.standort.ce_fancylink.style1.fancylink_color_white a:after,
.ce__sarb_standorte.standort.standort-03 .box .bild:after{
    content: '3';
}

.standort-04.standort.ce_fancylink.style1.fancylink_color_white a:after,
.ce__sarb_standorte.standort.standort-04 .box .bild:after{
    content: '4';
}

.standort-05.standort.ce_fancylink.style1.fancylink_color_white a:after,
.ce__sarb_standorte.standort.standort-05 .box .bild:after{
    content: '5';
}

.standort-06.standort.ce_fancylink.style1.fancylink_color_white a:after,
.ce__sarb_standorte.standort.standort-06 .box .bild:after{
    content: '6';
}

.ce__sarb_standorte.standort .box {
    position: relative;
}

.ce__sarb_standorte.standort .box .bild:after {
        content: '';
    border-radius: 100%;
    border: 1px solid var(--accentColor);
    background: var(--accentColor);
    height: 22px;
    width: 22px;
    transform: translateY(-50%);
    transform-origin: center;
    position: absolute;
    left: 0;
    top: 13px;
    display: block;
    transition: all 0.33s cubic-bezier(0.10,0.90,0.5,1);
    color: #ffffff;
    font-weight: 700;
    text-align: center;
    line-height: 25px;
    }
    
.ce__sarb_standorte.standort .box .bild ul li:not(:first-child) {
    display: none;
}
/***************************************************************************
* Fancybox
***************************************************************************/
.ce_fancybox.style2 .overlay {
    height: 100%;
    background: linear-gradient(to bottom,rgba(0,0,0,0),rgba(0,0,0,0.45) 100%);
}

.ce_fancybox.style2:hover .overlay {
    height: 100%;
}

.ce_fancybox.style2.fancy_box_color_second:hover .overlay {
    background: var(--bg-secondColor);
}

.ce_fancybox.style2 .attribute.ce_headline.headline {
    position: relative;
}

.ce_fancybox.style2 .ce_headline:before {
    position: absolute;
    left: -28px;
    width: 22px;
    font-family: 'Fontawesome';
    content: "\f105";
    color: #ffffff !important;
    font-weight: normal;
    font-style: normal;
    color: rgb(0, 0, 0);
    line-height: 30px;
    font-size: 14px;
    text-align: center;
    height: 30px;
    margin-top: -4px;
    transition: all 0.33s cubic-bezier(0.10,0.90,0.5,1)
    }
    
.ce_fancybox.style2 .ce_headline:after {
    content: '';
    border-radius: 100%;
    border: 1px solid #ffffff;
    height: 22px;
    width: 22px;
    transform: translateY(-50%);
    transform-origin: center;
    position: absolute;
    left: -30px;
    top: 11px;
    display: block;
    transition: all 0.33s cubic-bezier(0.10,0.90,0.5,1);
    }
    
.ce_fancybox.style2:hover .ce_headline:before {
    left: -20px;
    }

.ce_fancybox.style2:hover .ce_headline:after {
    border: none;
    height: 1px;
    background-color: #ffffff;
    top: 11.5px;
    }
    
.ce_fancybox.style2:hover a {
    color: #ffffff !important;
}


/***************************************************************************
* Imagebox (Alternative zu Fancybox für Tablet & Mobile)
***************************************************************************/
.ce_imagebox .overlay {
	content: '';
	position: absolute;
	height: 100%;
	right: 0;
	bottom: 0;
	left: 0;
	background: var(--bg-secondColor);
	transition: all .6s cubic-bezier(0.24,1,0.30,1);
}
/***************************************************************************
* Tabellen
***************************************************************************/
.ce_table table th {
	color: #000000;
	background: var(--bg-lightColor);
}


/***************************************************************************
* FAQ
***************************************************************************/
.mod_faqpage section {
    display: block;
    margin: 2.4em 0;
    padding: 0 0 0 60px;
    width: 100%;
}

.mod_faqpage h3, .mod_faqpage .h3 {
    font-size: 1.5rem;
}

.mod_faqpage .h3:before, .mod_faqpage h3:before {
    font-family: "FontAwesome";
    content: "\f059";
    margin-right: 5px;
    color: var(--accentColor);
    position: absolute;
    left: 55px;
    font-size: 40px;
    margin-top: -15px;
}


/***************************************************************************
* Newsletter
***************************************************************************/
form .cr_page {
	margin: 40px 0 10px 0;
	text-align: left;
}


/***************************************************************************
* Formulare
***************************************************************************/
form#anmeldung-angehoerige.no-border fieldset legend {
	margin-bottom: 5px;
}

form#anmeldung-angehoerige fieldset legend, form#cirs fieldset legend {
	width: auto;
	padding-right: 0;
	padding-left: 0;
	background-color: #fff;
	color: #000000;
	border-radius: 0;
	font-weight: bold;
}

form#anmeldung-angehoerige .checkbox_container span, form#cirs span.mandatory {
	display: inline;
}

form#anmeldung-angehoerige .checkbox_container span {
	display: block;
}

form#anmeldung-angehoerige span.mandatory {
    display: inline;
}


form#cirs fieldset legend {
	padding-right: 10px;
	padding-left: 10px;
}


/***************************************************************************
* Spitex
***************************************************************************/
.spitex .logo a {
    background-image: url(../themedesigner/uploads/lg_spitex_region_buelach.svg);
    width: 270px;
}

@media only screen and (max-width: 767px) {
    .spitex .logo a {
        width: 160px;
    }
}

.spitex {
  --accentColor: #005096;
}

.spitex .header .mainmenu ul li a.a-level_1:hover {
    color: #005096;
}

.spitex .header.original .mainmenu ul li a.trail.a-level_1, .spitex .header.original .mainmenu ul li a.active.a-level_1, .spitex .header.cloned .mainmenu ul li a.trail.a-level_1, .spitex .header.cloned .mainmenu ul li a.active.a-level_1, .spitex .mod_pct_megamenu .mod_navigation a.active.a-level_1 {
    color: #005096 !important;
}

.spitex .stickyheader .logo {
    height: 100px;
}

.spitex .mainmenu ul ul {
	border-radius: 0;
}

.spitex h1:after {
    content: "";
    height: 5px;
    width: 130px;
    background: #005096;
    display: block;
}

.spitex #weitere-angebote .ce_fancylink {
    margin-bottom: var(--abstand-xs);
}

.spitex .title-container .line {
    background: #005096;
}

/***************************************************************************
* Pflege- und Betreungsbedarf Skala Tief bis Hoch
***************************************************************************/

.skala_betreuung h3 {
    color: var(--accentColor);
    margin-top: 10px;
    margin-bottom: 10px;
}

.skala_betreuung {
    background: linear-gradient(to right, white 100px, var(--light-grey) 100px 100%);
    padding: var(--abstand-s);
    padding-left: 150px;
    border-bottom: 1px solid #ffffff;
    position: relative;
}

.skala_betreuung:after {
    content: "";
    height: 100%;
    width: 20px;
    background-color: rgba(156, 19, 75, 1);
    position: absolute;
    top: 0;
    left: 40px;
}

.skala_01.skala_betreuung:after {
    background: rgba(156, 19, 75, 0.25);
    height: calc(100% - 30px);
    top: 30px;
    background-image: url("/files/sarb/layoutelemente/icons/skala-tief.svg") ;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 15px auto;
}

.skala_02.skala_betreuung:after {
    background: rgba(156, 19, 75, 0.5);
}

.skala_03.skala_betreuung:after {
    background: rgba(156, 19, 75, 0.75);
}

.skala_04.skala_betreuung:after {
    height: calc(100% - 30px);
    background-image: url("/files/sarb/layoutelemente/icons/skala-hoch.svg") ;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 15px auto;

}

.skala_01:before {
    content: "";
    position: absolute;
    top: 0; 
    left: 20px; 
    border-left: 30px solid transparent;
    border-right: 30px solid transparent;
    border-bottom: 30px solid rgba(156, 19, 75, 0.25);
    width: 0;
    height: 0;
    opacity: 1;
    display: flex;
    justify-content: center;
    font-size: 13px;
}

.skala_04:before {
    content: "";
    position: absolute;
    bottom: 0; 
    left: 20px; 
    border-left: 30px solid transparent;
    border-right: 30px solid transparent;
    border-top: 30px solid var(--accentColor); 
    width: 0;
    height: 0;
    color: #ffffff;
}

.skala_betreuung ul {
    column-count: 2; /* Zwei Spalten */
    column-gap: 30px; /* Abstand zwischen den Spalten */
    margin-bottom: var(--m);
}

.skala_betreuung p {
    column-count: 2; /* Zwei Spalten */
    column-gap: 30px; /* Abstand zwischen den Spalten */
    margin-bottom: var(--m);
}

.ce_wrap:hover .skala_betreuung.skala_01 {
    background: linear-gradient(to right, white 100px, rgba(156, 19, 75, 0.25) 100px 100%);
}

.ce_wrap:hover .skala_betreuung.skala_02 {
    background: linear-gradient(to right, white 100px, rgba(156, 19, 75, 0.50) 100px 100%);
}

.ce_wrap:hover .skala_betreuung.skala_03 {
    background: linear-gradient(to right, white 100px, rgba(156, 19, 75, 0.75) 100px 100%);
    color: #ffffff;
}

.ce_wrap:hover .skala_betreuung.skala_04 {
    background: linear-gradient(to right, white 100px, rgba(156, 19, 75, 1) 100px 100%);
    color: #ffffff;
}

.ce_wrap:hover .skala_betreuung.skala_03 h3,
.ce_wrap:hover .skala_betreuung.skala_04 h3 {
    color: #ffffff;
}

.skala_betreuung h3 {
    position: relative;
    padding-left: 35px;
}

.skala_betreuung h3:before {
    position: absolute;
    left: 2px;
    width: 22px;
    font-family: 'Fontawesome';
    content: "\f105";
    color: var(--accentColor);
    font-weight: normal;
    font-style: normal;
    line-height: 30px;
    font-size: 14px;
    text-align: center;
    height: 30px;
    margin-top: -16px;
    margin-left: 0;
    top: 13px;
    transition: all 0.33s cubic-bezier(0.10,0.90,0.5,1);
}

.ce_wrap:hover .skala_betreuung h3:before {
    transform: scale(1, 1) translateX(9px);
    left: 2px;
    color: var(--accentColor);
    }
    
.ce_wrap:hover .skala_betreuung.skala_03 h3:before,
.ce_wrap:hover .skala_betreuung.skala_04 h3:before{
    color: #ffffff;
    }

.skala_betreuung h3:after {
    content: '';
    border-radius: 100%;
    border: 1px solid var(--accentColor);
    height: 22px;
    width: 22px;
    transform: translateY(-50%);
    transform-origin: center;
    position: absolute;
    left: 0;
    top: 13px;
    display: block;
    transition: all 0.33s cubic-bezier(0.10,0.90,0.5,1);
}

.ce_wrap:hover h3:after {
    left: 0;
    width: 24px;
    height: 1px;
    background: var(--accentColor);
    transform: none;
    margin-top: -1px;
    border: none;
    top: 13px;
    opacity: 1;
}

.ce_wrap:hover .skala_betreuung.skala_03 h3:after,
.ce_wrap:hover .skala_betreuung.skala_04 h3:after{
    background: #ffffff;
    }


/***************************************************************************
* Spendenbarometer
***************************************************************************/
.spendenbarometer-web .spenden-container {
    display: flex;
    flex-direction: row;
}

.spendenbarometer-web .spenden-container .ziel-flagge{
    padding-left: 20px;
}

.spendenbarometer-web .spenden-container .ce_chart_inside {
    position: relative;
    width: 100%;
    padding: 0.5rem 0 1rem 0;
}


.spendenbarometer-web .spenden-container .chart_footer {
    display: flex;
    justify-content: space-between;
    margin-top: 0.5rem;
    align-items: center;
    padding-top: 10px;
}

.spendenbarometer-web .spenden-container .chart_footer .left {
    color: white;
    padding-top: 0px;
    font-size: 1.5rem;
}

.spendenbarometer-web .spenden-container .chart_footer .left strong {
    background-color: white;
    color: var(--accentColor);
    padding: 5px 15px 0 15px;
    border-radius: 15px;
}
.spendenbarometer-web .spenden-container .chart_footer .right {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: white;
    font-size: 1.5rem;
}

.spendenbarometer-web .spenden-container .chart_footer .ziel strong {
    font-size: 1.8rem;
}

.spendenbarometer-web .spenden-container .ziel-flagge{
    width: 7% !important;
}

@media only screen and (max-width: 767px) {
    .spendenbarometer-web .spenden-container .ziel-flagge{
        padding-left: 5px;
        padding-top: 5px;
        width: 15% !important;
    }
    
    .spendenbarometer-web .spenden-container .chart_footer .left, 
    .spendenbarometer-web .spenden-container .chart_footer .right{
        font-size: 18px;
    }
    
    .spendenbarometer-web .spenden-container .chart_footer .ziel strong {
        font-size: 20px;
    }
    .spendenbarometer-web .spenden-container .chart_footer {
        display: block;
    }

}


/*mit Etappen Ziel*/
/*.spendenbarometer-web.test .spenden-container {
    position: relative;
}

.spendenbarometer-web.test .spenden-container .ce_chart_inside {
    padding: 3.5rem 0 1rem 0;
    width: 100%;
}

.spendenbarometer-web.test .spenden-container .chart_top img {
    height: 100px;
    position: absolute;
    left: 33.33%;
    z-index: 99999999;
}

@media only screen and (max-width: 767px) { 
    .spendenbarometer-web.test .spenden-container .ce_chart_inside {
        padding: 2.5rem 0 1rem 0;
    }
    
    .spendenbarometer-web.test .spenden-container .chart_top img {
        height: 80px;
    }
}*/

.spendenbarometer-web.zwischenziel .spenden-container .ce_chart_inside {
    padding: 8rem 0 1rem 0;
}

.spendenbarometer-web.zwischenziel .spenden-container .ziel-flagge {
    padding-top: 7.5rem;
}

.spendenbarometer-web.zwischenziel .chart_bg,
.spendenbarometer-web.zwischenziel .ce_chart_inside {
    position: relative;   
}

.spendenbarometer-web.zwischenziel .chart_scale {
    position: absolute;
    left: 0;
    right: 0;
    top: 44px;            
    height: 70px;
    width: 100%;  
}

.spendenbarometer-web.zwischenziel .scale_item {
    position: absolute;
    top: -0.5rem;
    transform: translateX(-50%);
    text-align: center;
}

.spendenbarometer-web.zwischenziel .scale_tick {
    display: block;
    width: 2px;
    height: 50px;
    background: var(--accentColor);
    margin: 0 auto;
    border-radius: 25px;
}

.spendenbarometer-web.zwischenziel .scale_text {
    position: absolute;
    bottom: 100%;
    left: 50%;
    transform: translate(-50%, -7px);
    font-size: 18px;
    font-weight: 400;
    color: white;
    white-space: nowrap;
    line-height: 1.25;
}

@media only screen and (max-width: 767px) { 
    .scale_item.second,
    .scale_item.third{
        display: none;
    }
}


/***************************************************************************
* standorte
***************************************************************************/

.ce__sarb_standorte .content {
    display: grid;
    grid-template-columns: 1fr 1fr 2fr;
    border-bottom: 1px solid var(--light-grey);
    padding-top: var(--abstand-s);
    }
    
.ce__sarb_standorte .box {
    padding: var(--abstand-xs);
}

.ce__sarb_standorte h3 {
    color: var(--accentColor);
    margin-bottom: 10px;
}

.ce__sarb_standorte .adresse {
    color: var(--secondColor);
    font-weight: 700;
}

.ce__sarb_standorte li {
    position: relative;
}

.ce__sarb_standorte ul {
    margin-bottom: var(--abstand-s);
}

.ce__sarb_standorte .dienstleistungen li {
    padding-left: 15px;
}

.ce__sarb_standorte .dienstleistungen li:before{
  content: "";
  position: absolute;
  width: 10px;
  height: 10px;
  margin-top: 5px;
  margin-left: -25px;
  background-color: #000000; 
  mask-size: contain;
  -webkit-mask-size: contain;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}

.ce__sarb_standorte li:before {
      mask: url("/files/sarb/layoutelemente/fontawesome-light-svg/chevron-right.svg") no-repeat center;
  -webkit-mask: url("/files/sarb/layoutelemente/fontawesome-light-svg/chevron-right.svg") no-repeat center;
   padding-left: var(--abstand-xxs);
}

.ce__sarb_standorte .ce_gallery:before{
  content: "Auf das Bild klicken für weitere Bilder";
  position: absolute;
  width: calc(100% - 5px);
  height: 25px;
  padding-left: 5px;
  left: 0;
  bottom: 10px;
  background-color: var(--secondColor); 
  color: #ffffff;
  z-index: 5;
  font-size: 1rem;
}

.ce__sarb_standorte .ce_gallery{
  position: relative;
  }


#main .google_map a[href ^="https://"]:before{
          mask: url("/files/sarb/layoutelemente/fontawesome-light-svg/location-dot.svg") no-repeat center;
  -webkit-mask: url("/files/sarb/layoutelemente/fontawesome-light-svg/location-dot.svg") no-repeat center;
}

#main .google_map a[href ^="https://"]:hover:before {
          mask: url("/files/sarb/layoutelemente/fontawesome-solid-svg/location-dot.svg") no-repeat center;
  -webkit-mask: url("/files/sarb/layoutelemente/fontawesome-solid-svg/location-dot.svg") no-repeat center;
}

.ce__sarb_standorte .ce_gallery .image_container i.fa.fa-plus-circle {
    display: none;
}


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

@media only screen and (max-width: 1150px) and (min-width: 768px) {
        
    .header.original .logo {
        width: 256px !important;
    } 
    
    .header .header_metanavi a {
    background-size: 25px !important;
    padding-top: 17px;
    margin-left: 5px;
    margin-right: 5px;
    font-size: 0.8rem;
    }
    
    .header .header_metanavi li {
    min-width: 50px;
    }
    
   .ce__sarb_standorte .content {
    grid-template-columns: 50% 50%;
    grid-template-rows: auto auto; /* Für 2 Reihen */
  }

  .ce__sarb_standorte .content .box:nth-child(1) {
    grid-column: 1 / 2; /* Erste Spalte */
    grid-row: 1 / 3; /* Über zwei Reihen */
    width: 100%; /* Volle Breite der Spalte */
  }

  .ce__sarb_standorte .content .box:nth-child(2) {
    grid-column: 2 / 3; /* Zweite Spalte */
    grid-row: 1 / 2; /* Erste Reihe */
    width: 100%; /* Volle Breite der Spalte */
  }

  .ce__sarb_standorte .content .box:nth-child(3) {
    grid-column: 2 / 3; /* Zweite Spalte */
    grid-row: 2 / 3; /* Zweite Reihe */
    width: 100%; /* Volle Breite der Spalte */
  }
  

}

@media only screen and (max-width: 1380px) and (min-width: 900px) {
  
    .bg_headertext .col_3,
    .bg_headertext .col_4,
    .bg_headertext .col_5{
    flex: 0 0 calc((100% / 12) * 6) !important;
    max-width: calc((100% / 12) * 6) !important;
    margin-bottom: var(--abstand-s);
    }
    
    .bg_headertext .neue-zeile{
    flex: 0 0 calc((100% / 12) * 12) !important;
    max-width: calc((100% / 12) * 12) !important;
    margin-bottom: var(--abstand-s);
}

    .bg_headertext {
        padding: 25px;
    }
    
    #slider .ce_vertical_spacer_px {
        max-height: 100px;
    }
}

    
@media only screen and (min-width: 768px) {
    .header.original .header_metanavi a {
        margin-right: 0 !important;
    }
    
    .header.original .header_metanavi {
        position: absolute;
        right: 0 !important;
        top: 20px;
        display: block;
    }
    
}

@media only screen and (max-width: 1024px) {
   .spitex_sticker {
       right: 20px;
       top: 100px;
   }
   
   #stickyheader .spitex_sticker {
       display: none;
   }

   .bg_headertext .column[class*=col_]    {
    flex: 0 0 calc((100% / 12)* 12) !important;
    max-width: calc((100% / 12)* 12) !important;
    }
  
    .bg_headertext .column:last-child {
     margin-top: 20px;   
     margin-bottom: 0;
    }
    
    .one_fourth {
        flex: 0 0 calc(100% / 3);
    }
    
    .skala_betreuung ul {
    column-count: 1; /* Zwei Spalten */
    column-gap: 30px; /* Abstand zwischen den Spalten */
    margin-bottom: var(--m);
}

.skala_betreuung p {
    column-count: 1; /* Zwei Spalten */
    column-gap: 30px; /* Abstand zwischen den Spalten */
    margin-bottom: var(--m);
}

}

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

   #slider .ce_vertical_spacer_px {
       display: none;
   }
   
   .bg_downloads {
    background: var(--bg-secondColor);
   }


}

@media only screen and (max-width: 767px) {
   .spitex_sticker {
       right: 20px;
       top: 65px;
   }

    #slider .inside::before {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-color: var(--bg-secondColor); 
      z-index: 1;
    }
    
    .bg_downloads {
    background: var(--bg-secondColor);
    width: 100%;
    clear: both;
    padding-left: 20px;
    padding-right: 20px;
    padding-bottom: 20px;
    }
    
    .bg_headertext {
    width: 100%;
    background: none;
    position: relative;
    z-index: 2;
    padding-left: 20px;
    padding-right: 20px;
    padding-bottom: 20px;
    }
    
    .bg_header_accentColor {
    position: relative;
    z-index: 2;
    }
    
    .one_fourth {
        flex: 0 0 calc(100% / 2) !important;
    }
    
    .ce__sarb_standorte .content {
    grid-template-columns: 1fr;
    }

    .ce__sarb_standorte .content .box{
    grid-column: span 1;
    }
    
    .ce__sarb_standorte .ce_gallery ul.flex-gallery li {
    flex: 0 0 100% !important;
    }
    
    .mod_faqpage .h3::before, .mod_faqpage h3::before {
	left: 35px;
    }

}

@media only screen and (max-width: 500px) {
    
    .one_fourth {
    flex: 0 0 calc(100% / 1) !important;
    }
    
    .skala_betreuung {
    padding-left: 120px;
    }

}

@media only screen and (min-width: 768px) and (max-width: 970px) {
    .mod_newslist.mitarbeitende_col4 {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 20px;
    }
}

@media only screen and (min-width: 971px) and (max-width: 1140px) {
    .mod_newslist.mitarbeitende_col4 {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
    }
}

@media only screen and (max-width: 768px) {
    .mod_newslist.mitarbeitende_col4 {
	display: grid;
	grid-template-columns: repeat(1, 1fr);
	gap: 20px;
    }
}