.header-background { background: var(--itzehoer-green); height: 240px; left: 0; right: 0; position: relative; margin-bottom: -40px; z-index: -1; mix-blend-mode: multiply; } .header-background>picture>img,.header-background>video { position: absolute; object-fit: cover; width: 100%; height: 100%; opacity: 0.5; mix-blend-mode: multiply; } .abc-reiter li { list-style: none; margin-right: 8px; } .abc-reiter li a { display: flex; width: 38px; padding: 7px 0px; justify-content: center; align-items: center; border-radius: 4px; border: 1px solid var(--border, #D8D8D8); background: #F3F3F3; color: #4A4A4A; font-size: 24px; font-weight: bold; line-height: 24px; } .abc-reiter { width: 100%; max-width: 520px; } .abc-menu { display: flex; flex-direction: row; width: 100%; padding: 5px 0px; align-items: center; gap: 64px; border-radius: 16px; background: var(--white, #FFF); box-shadow: 0px 0px 0px 0px rgba(224, 191, 174, 0.10), 0px 5px 12px 0px rgba(224, 191, 174, 0.10), 0px 22px 22px 0px rgba(224, 191, 174, 0.09), 0px 49px 29px 0px rgba(224, 191, 174, 0.05), 0px 87px 35px 0px rgba(224, 191, 174, 0.01), 0px 136px 38px 0px rgba(224, 191, 174, 0.00); } .abc-reiter ul { display: flex; flex-direction: row; align-items: flex-start; gap: 8px 0; flex: 1 0 0; flex-wrap: wrap; } .abc-reiter .zahlen-reiter { width: 64px; } .abc-reiter .zahlen-reiter a{ width: 62px; } .abc-search { display: flex; width: 100%; max-width: 520px; align-items: center; gap: 16px; flex-shrink: 0; border-radius: 8px; background: #faf6f4; box-shadow: 2px 2px 0px 0px #DCDCDC inset; flex-direction: row; height: 60px; padding: 2px 16px 2px 16px; } .abc-search button { display: flex; width: 48px; height: 48px; justify-content: center; background: #faf6f4; align-items: center; gap: 8px; flex-shrink: 0; border-radius: 8px; border: none; cursor: pointer; } .abc-search input { border-radius: 8px; background: #faf6f4; flex-grow: 2; height: -webkit-fill-available; border: none; font-size: 24px; font-weight: 600; width: 100%; margin:0; padding:0; } .abc-search input:hover { border:none; } .abc-search input:focus { border:none; outline: none; } .abc-content { display: flex; flex-direction: column; align-items: center; margin-top: 96px; } li.active a{ background-color: var(--itzehoer-green); color: white; } .renderUnit { width: 720px; } .collapsible { display: flex; background-color: var(--sand); border-style: none; color:#444; cursor:pointer; font-size:15px; margin-bottom:5px; outline:none; padding:18px 8px; text-align:left; width: 720px; flex-direction: row; justify-content: space-between; align-content: flex-end; flex-wrap: nowrap; align-items: center; color: var(--itz-grau, #4A4A4A); font-size: 24px; font-style: normal; font-weight: 600; } .contentsearchbox>.richtext { padding-top: 0; padding-bottom: 0; } .collapsible--content { max-height:0; overflow:hidden; transition:max-height .2s ease-out; border-bottom: 1px solid var(--hellgrau, #D8D8D8); width: 720px; } .collapsible:after { color:#fff; content:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M18.3333 8.33333H11.6667V1.66667C11.6667 1.22464 11.4911 0.800716 11.1785 0.488156C10.8659 0.175595 10.442 0 10 0C9.55797 0 9.13405 0.175595 8.82149 0.488156C8.50893 0.800716 8.33333 1.22464 8.33333 1.66667V8.33333H1.66667C1.22464 8.33333 0.800716 8.50893 0.488156 8.82149C0.175595 9.13405 0 9.55797 0 10C0 10.442 0.175595 10.8659 0.488156 11.1785C0.800716 11.4911 1.22464 11.6667 1.66667 11.6667H8.33333V18.3333C8.33333 18.7754 8.50893 19.1993 8.82149 19.5118C9.13405 19.8244 9.55797 20 10 20C10.442 20 10.8659 19.8244 11.1785 19.5118C11.4911 19.1993 11.6667 18.7754 11.6667 18.3333V11.6667H18.3333C18.7754 11.6667 19.1993 11.4911 19.5118 11.1785C19.8244 10.8659 20 10.442 20 10C20 9.55797 19.8244 9.13405 19.5118 8.82149C19.1993 8.50893 18.7754 8.33333 18.3333 8.33333Z' fill='white'/%3E%3C/svg%3E"); float:right; font-size:13px; margin-left:5px; background-color: var(--itzehoer-green); border-radius: 8px; padding: 6px 6px 3px 6px; } .activePanel:after { content:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='4' viewBox='0 0 20 4' fill='none'%3E%3Cpath d='M18.3333 0.5C12.776 0.5 7.22342 0.5 1.66667 0.5C1.22464 0.5 0.800716 0.658035 0.488156 0.93934C0.175595 1.22064 0 1.60218 0 2C0 2.39783 0.175595 2.77936 0.488156 3.06066C0.800716 3.34196 1.22464 3.5 1.66667 3.5C8.4305 3.5 11.8713 3.5 18.3333 3.5C18.7754 3.5 19.1993 3.34196 19.5118 3.06066C19.8244 2.77936 20 2.39783 20 2C20 1.60218 19.8244 1.22064 19.5118 0.93934C19.1993 0.658035 18.7754 0.5 18.3333 0.5Z' fill='white'/%3E%3C/svg%3E"); padding: 6px 6px 11px 6px; } .activePanel + .collapsible--content { margin-bottom:20px!important; max-width:720px; } section.abc-module { padding-top: 0px; position: relative; } .abc-headline { position: absolute; color: white; top: 84px; } .abc-reiter #suche { width:62px; display: none !important; } .abc-reiter #suche a{ width:62px; } #nohit { display: none; } @media (max-width: 1167px) { .abc-menu { flex-direction: column; width: 80%; margin: auto; max-width: 740px; padding: 5% 10% 5% 10%; } .abc-content { width: 80%; margin: auto; max-width: 740px; padding: 5% 10% 5% 10%; } .collapsible { width: 100%; } .renderUnit { width: 100%; } .activePanel + .collapsible--content { width:100%; } .collapsible--content { width:100%; } } @media (max-width: 559px) { .collapsible { font-size: 20px; } } .topic { display: flex; justify-content: space-between; align-items: center; min-height: 70px; border-bottom: 1px solid #cfcfcf; cursor:pointer; padding:0 10px; } .topic h3 { margin: 0; font-size: 22px; } .topic a { border-bottom: 1px solid #62bb46; margin-top: 2px; } .topic:hover { background-color: #EFEFEF; } .topic-search { display:none; }