.ter-kal-block-list {
container-type: inline-size;
width: 100%;
}  .ter-kal-block-list .eventlist,
.ter-kal-block-list .simple_list,
.ter-kal-block-list .ter-kal-content { width: 100%; } @container (max-width: 500px) {
.ter-kal-content { }
}
@container (min-width: 501px) {
.ter-kal-content { }
} .tk_kategorie_title {
font-size: 2rem;
line-height: 3rem;
font-weight: 800;
border-radius: 0.5rem;
padding: 0.5rem;
}
.tk_kategorie_title_dashicon {
font-size: 3rem;
width: 1.2em; } .eventlist h3 {
font-size: 2rem;
margin: 0;
background-color: #007bff;
color: #fff;
padding: 0.2rem; border-radius: 0.5rem;
display: flex;
align-items: center;
position: relative;
padding: 0.3rem;
padding-right: 2.2rem; }
.eventlist h3 .accordeon_icon {
font-size: 2rem;
height: 2rem;
width: 2rem;
border: 0;
margin-right: 0.2rem;
opacity: 0.5;
}
.eventlist h3 .accordeon_day { font-weight: bold; font-family: sans-serif;
margin-right: 0.2rem; opacity: 0.5;
} .eventlist h3 .header-text {
font-size: 1rem;
display: inline-block; } .eventlist h3::after {
font-family: dashicons; content: '\f347'; position: absolute;
right: 0.2rem;
top: 50%;
transform: translateY(-50%); transition: transform 0.3s ease;
} .eventlist .ui-accordion-header-active::after {
content: '\f347';  transform: translateY(-50%) rotate(180deg);
}
.ter-kal-block-list .eventlist.ui-accordion .ui-accordion-header {
margin-bottom: 0.1rem;
} .eventlist div {
border: 1px solid #dddddd;
border-top: none;
background-color: #fff;
}
.eventlist .eventlist_daytime { font-size: 0.9rem;
border-radius: 0.5rem;
padding: 0.4rem;
margin: 0;
opacity: 0.7;
}
.eventlist h2 {
font-size: 1.4rem;
}
.eventlist hr {
margin: 0.1rem;
}
.eventlist .ui-accordion-content {
padding: 0.5rem;
}
.eventlist .ter_kal_event_details {
display: flex;
flex-direction: column;
gap: 0.5rem;
border: 0;
}
.eventlist .ter_kal_event_details  img { border-radius: 0.5rem;
} .eventlist button,
.eventlist .bootstrap_button {
margin-top: 1rem;
font-size: 0.8rem;
color: #7b8793;
background: #fff;
border-color: #7b8793;
width: 98%;
}
.eventlist button,
.eventlist .bootstrap_button:hover {
color: #fff;
background: #7b8793;
}
.eventlist button,
.eventlist .bootstrap_button:focus,
.bootstrap_button:visited {
color: #7b8793;
background: #dedede;
}    @container (max-width: 768px) {
.eventlist {
font-size: 0.8rem;
}
.eventlist h4 {
font-size: 0.9rem;
}
.eventlist h2 {
font-size: 1rem;
}
.eventlist button,
.eventlist .bootstrap_button {
font-size: 0.7rem !important;
line-height: 1.4rem;
padding: 0.3rem;
overflow: hidden;
}
}  @container (max-width: 400px) {
.eventlist h3 .header-text,
.eventlist .ui-accordion-content,
.eventlist button,
.eventlist .bootstrap_button,
.eventlist {
font-size: 0.6rem !important;
}
.eventlist h4 {
font-size: 0.7rem !important;
}
.eventlist h2 {
font-size: 0.8rem !important;
}
.eventlist h3 .header-text,
.eventlist .ui-accordion-content,
.eventlist button,
.eventlist .bootstrap_button {
line-height: 1.4rem;
padding: 0.2rem;
}
.eventlist h3 .accordeon_day,
.eventlist .accordeon_icon {
display: none;
}
.eventlist h3 {
padding-right: 1rem;
}
.eventlist h3::after {
font-size: 0.9rem;
}
}