body,form,figure{margin:0;padding:0}img{border:0}header,footer,nav,section,aside,article,figure,figcaption{display:block}body{font-size:100.01%}select,input,textarea{font-size:99%}#container,.inside{position:relative}#main,#left,#right{float:left;position:relative}#main{width:100%}#left{margin-left:-100%}#right{margin-right:-100%}#footer{clear:both}#main .inside{min-height:1px}.ce_gallery>ul,.content-gallery>ul{margin:0;padding:0;overflow:hidden;list-style:none}.ce_gallery>ul li,.content-gallery>ul li{float:left}.ce_gallery>ul li.col_first,.content-gallery>ul li.col_first{clear:left}.float_left,.media--left>figure{float:left}.float_right,.media--right>figure{float:right}.block{overflow:hidden}.media{display:flow-root}.clear,#clear{height:.1px;font-size:.1px;line-height:.1px;clear:both}.invisible{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.custom{display:block}#container:after,.custom:after{content:"";display:table;clear:both}
@media (max-width:767px){#wrapper{margin:0;width:auto}#container{padding-left:0;padding-right:0}#main,#left,#right{float:none;width:auto}#left{right:0;margin-left:0}#right{margin-right:0}}img{max-width:100%;height:auto}.audio_container audio{max-width:100%}.video_container video{max-width:100%;height:auto}.aspect,.responsive{position:relative;height:0}.aspect iframe,.responsive iframe{position:absolute;top:0;left:0;width:100%;height:100%}.aspect--16\:9,.responsive.ratio-169{padding-bottom:56.25%}.aspect--16\:10,.responsive.ratio-1610{padding-bottom:62.5%}.aspect--21\:9,.responsive.ratio-219{padding-bottom:42.8571%}.aspect--4\:3,.responsive.ratio-43{padding-bottom:75%}.aspect--3\:2,.responsive.ratio-32{padding-bottom:66.6666%}.aspect--9\:16,.responsive.ratio-916{padding-bottom:177.7777%}.aspect--1\:1,.responsive.ratio-11{padding-bottom:100%}
@font-face {
    font-family: 'General Sans';
    src: url('../../files/web/fonts/GeneralSans-Regular.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'General Sans';
    src: url('../../files/web/fonts/GeneralSans-Italic.woff2') format('woff2');
    font-weight: 400;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'General Sans';
    src: url('../../files/web/fonts/GeneralSans-Medium.woff2') format('woff2');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'General Sans';
    src: url('../../files/web/fonts/GeneralSans-MediumItalic.woff2') format('woff2');
    font-weight: 500;
    font-style: italic;
    font-display: swap;
}
#wrapper {
 width: 100%;
}

.container {
 width: min(100% - 40px, 1280px);
 margin-inline: auto;
}

#header {
 width: 100%;
 max-width: 948px;
 margin-right: auto;
 margin-left: auto;
}

#main{
 max-width: 948px;
 margin-right: auto;
 margin-left: auto;
 float: none;
 min-height: 800px;
 padding-bottom: 100px;
}

#main, #main p{
 font-size: 1.25rem;
 line-height: 1.25;
}

#footer{
 background-color: #FAF578;
 width: 100%;
 max-width: 1280px;
 margin-right: auto;
 margin-left: auto;
}
.site-header__menu-button {
    box-sizing: border-box;
    width: 84px;
    height: 33px;

    padding: 0;

    color: #000;
    background: #f5efec;

    border: 1px solid #000;
    border-radius: 41px;

    box-shadow: 4px 4px 0 0 #000;

    cursor: pointer;
}

.site-header__menu-button:hover,
.home-tool-teaser__link a:hover{
    box-shadow: 2px 2px 0 #000;
    transform: translate(2px, 2px);
}


body{
	background-color: #F5EFEC;
	font-family: 'General Sans', sans-serif;
    font-weight: 400;
    font-size: 16px;
}

#main {
    position: relative;
}

#main::before {
    content: "";
    position: absolute;
    width: 90%;
    max-width: 1059px;
    aspect-ratio: 1059 / 512;

    top: 350px;
    left: 50%;
    transform: translate(-50%);
    
        
    /*...oder auch vertikal immer exakt in der Seite zentriert*/
    /*
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    */

    background: url('/files/web/images/global/diverse/schleife.png') center / contain no-repeat;

    pointer-events: none;
    z-index: 0;
}

.schlaufe-rechts #main::before {
    transform: translate(-20%,-30%);
}
body.schlaufe-rechts{
    overflow-x: clip;
}

/* HEADER ELEMENTE*/
.site-header {
    max-width: 1280px;
    height: 190px;
    margin-inline: auto;
    padding-inline: 32px;
    box-sizing: border-box;

    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
}

.site-header__logo {
    grid-column: 2;
}

.site-header__logo img {
    display: block;
}

.site-header__menu-button {
    grid-column: 3;
    justify-self: end;
}

/* Heading – 55/110*/
h1 {
    font-family: 'General Sans';
    font-style: normal;
    font-weight: 500;
    font-size: 55px;
    line-height: 110%;
}

h1.intro{
    max-width: 649px;
}

/* Heading 1 – 38/110 */
h2 {
    font-size: 2.375rem; /* 38px */
    font-style: normal;
    font-weight: 500;
    line-height: 110%;
}

h2.intro, .intro h2{
    max-width: 350px;
}

/* Heading 2 – 30/120 */
h3 {
    font-style: normal;
    font-weight: 500;
    font-size: 1.5rem;
    line-height: 125%;
}

/* Heading 3 – 24/125 */
h4 {
    font-size: 1.5rem; /* 24px */
    line-height: 1.25;
}

/* Fließtext – 22/120 */
p {
    font-size: 1.375rem; /* 22px */
    line-height: 1.2;
}

/* Kleingedrucktes – 18/120 */
.small {
    font-size: 1.125rem; /* 18px */
    line-height: 1.2;
}

.abstand-typ-1{
    margin-top: 100px;
}


.footer-content {
    min-height: 330px;
    padding: 70px 50px 35px;
    box-sizing: border-box;

    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: end;
}

.footer-info {
    align-self: start;
}

.footer-info p {
    margin: 0 0 25px;
}

.footer-info a {
    display: block;
    color: #000;
    text-decoration: none;
}

.footer-instagram {
    display: block;
    width: max-content;
    margin-bottom: 20px;
}

.footer-instagram img {
    display: block;
    width: 24px;
    height: auto;
}

.footer-links {
    grid-column: 2;
    font-size: 0.75rem;
    text-transform: uppercase;
    white-space: nowrap;
}

.footer-links a {
    color: #000;
    text-decoration: none;
}

.footer-logo {
    grid-column: 3;
    justify-self: end;
}

.footer-logo img {
    display: block;
    width: 45px;
    height: auto;
}

.handorgel__header__button{
    background-color: transparent;
    padding-left: 0px;
    padding-top: 12px;
    padding-bottom: 12px;
    border-bottom: 1px #000 solid;
}

.akk-veranstaltungen-rand-oben .handorgel__header__button{
    border-top: 1px #000 solid;
}

.handorgel__content, .handorgel__content__inner{
    background-color: transparent;
    padding: 0px;
}

.handorgel__content__inner{
    padding-left: 0px;
    padding-top: 0px;
    padding-bottom: 22px;
}

.content-accordion.marker .handorgel__header__button {
    position: relative;
    z-index: 1;
}

.content-accordion.marker .handorgel__header__button::before {
    content: "";
    position: absolute;
    left: -5px;
    top: 50%;
    width: 80%;
    height: 18px;
    background: #fff56b;
    border-radius: 6px;
    transform: translateY(-50%) rotate(-2deg);
    z-index: -1;
    pointer-events: none;
}

#main .lead-text p{
    max-width: 700px;
    font-size: 1.9rem;
}
#main .lead-text-longer p{
    width: 90%;
    font-size: 1.9rem;
    max-width: 800px;
}

.themen-navigation {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 60px;
    margin-bottom: 60px;
}

.themen-navigation__links {
    display: flex;
    gap: 12px;
}

.themen-navigation__links a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 110px;
    height: 30px;
    padding: 0 15px;
    box-sizing: border-box;

    color: #000;
    text-decoration: none;
    font-size: 14px;
    line-height: 1;

    border: 1px solid #000;
    border-radius: 30px;
    box-shadow: 2px 2px 0 #000;
}

.themen-navigation__bild img {
    display: block;
    /*max-width: 180px;*/
    height: auto;
}

.content-download.download-element {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 0;
    border-top: 1px solid #000;
}

.content-download.download-element:last-of-type {
    border-bottom: 1px solid #000;
}

.content-download.download-element h2 {
    margin: 0;
    font-size: 1rem;
    line-height: 1.2;
    font-weight: 400;
}

.content-download.download-element > a {
    display: block;
    width: 24px;
    height: 24px;
    overflow: hidden;
    font-size: 0;
    background: url('../../files/web/images/seiten/praxis-wissen/download.png') center center / contain no-repeat;
}


.handorgel__header__button {
    position: relative;
    padding-right: 45px;
}

/* geschlossen = Plus */
.handorgel__header__button::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 10px;
    width: 24px;
    height: 24px;
    background: url('../../files/web/images/global/diverse/plus.png') center / contain no-repeat;
    transform: translateY(-50%);
}

/* geöffnet = Minus */
.handorgel__header--open .handorgel__header__button::after,
.handorgel__header--opened .handorgel__header__button::after {
    background-image: url('../../files/web/images/global/diverse/minus.png');
}


@media only screen and (max-width: 1250px) {
    #main {
      width:90%;
    }
    
    h1, h1.intro{
      font-size: 3rem;
    }
    
    .abstand-typ-1{
      margin-top: 0px;
    }
    
    .footer-content {
        display: block;
    }
    
    .footer-links {
      display: block;
      margin-top: 15px;
      margin-bottom: 20px;
      text-align: left;
    }
    
    .themen-navigation {
      display: block;
    }

    .themen-navigation__links {
      flex-wrap: wrap;
      margin-bottom: 30px;
    }
    
    .themen-navigation__bild img{
      max-width: 120px;
    }
}