/* General page setup
---------------------------------------------------------------------- */
/* Skip link (SC 2.4.1) */
.skip-link {position:absolute; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden;}
.skip-link:focus {position:fixed; top:0; left:0; width:auto; height:auto; padding:12px 20px; background:#0060e4; color:#fff; font-size:16px; font-weight:600; z-index:9999; text-decoration:none; border-radius:0 0 6px 0;}
/* Global focus style (SC 2.4.11 — WCAG 2.2) */
:focus-visible {outline:3px solid #0060e4; outline-offset:2px; border-radius:3px;}
html,body {margin:0px;padding:0px;width:100%;height:100%;background:#f5f5f5;font-family:"Google Sans Flex","Roboto",Arial,"Helvetica Neue",Helvetica,sans-serif;font-size:16px;line-height:130%;color:#545D62;text-align:left;-webkit-tap-highlight-color:rgba(0,0,0,0);}
/* Generel table attributes and fonts
---------------------------------------------------------------------- */
table, td, select, input, label, textarea {font-family:"Google Sans Flex","Roboto",Arial,"Helvetica Neue",Helvetica,sans-serif;font-size:1em;line-height:130%;color:#545D62;}
th {font-size:1em;line-height:130%;color:#545D62;}
p {font-size:1em;line-height:130%;color:#545D62;}
a {font-size:1em;color:#0062e4;text-decoration:none;}
a:hover {text-decoration:underline;}
h1 {font-size:40px;line-height:110%;color:#545D62;}
h2,h3,h4,h5,h6 {font-size:24px;line-height:110%;color:#545D62;}
form {margin:0;padding:0;}
hr {height:1px;background-color:#e1e1e1;color:#e1e1e1;border:none;margin:0;margin-top:10px;margin-bottom:10px;}
a img {border:none;}
/* Base template setup
---------------------------------------------------------------------- */
.material-symbols-outlined {font-variation-settings:'FILL' 0, 'wght' 500, 'GRAD' 0, 'opsz' 24}
.visually-hidden {position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0, 0, 0, 0); white-space:nowrap; border:0;}
.wrapper {clear:both; padding:20px 20px 100px 20px;}
.wrapper-inner {width:1300px; margin:0 auto;}
/* Event */
.event {display:grid; grid-template-columns:1fr 310px; gap:12px; margin:0px 0px 15px 0px;}
.event .info .card {clear:both; border-radius:8px;border-radius: 8px;border: 1px solid #D9DDE3;border-bottom:1px solid #D9DDE3;background:#fff;cursor:pointer;}
.event .info .card .card-body {min-height:150px;clear:both;position:relative; padding:32px 50px 30px 45px;overflow-x:hidden;}
.event .info .card .card-body:before {width:90px;height:90px;content:'';position:absolute;top:-20px;right:-15px;z-index:0;background:url(/gfx/icon-read-more-t1.svg) no-repeat 50% 50%;background-size:100% auto;}
.event .info .card .card-body .event-title {clear:both; margin:0px 0px 8px 0px;}
.event .info .card .card-body .event-title p {margin:0; font-size:21px; line-height:140%; font-weight:400; color:#000; overflow-wrap:anywhere; word-wrap:anywhere;}
.event .info .card .card-body .event-title a {font-size:21px; line-height:140%; font-weight:400; color:#000; overflow-wrap:anywhere; word-wrap:anywhere;}
.event .info .card:hover .card-body .event-title a {text-decoration:underline;}
.event .info .card .card-body .event-title a:hover {text-decoration:underline;}
.event .info .card .card-body .event-date {clear:both; margin:0px 0px 20px 0px;}
.event .info .card .card-body .event-date p {margin:0; font-size:16px; line-height:155%; color:#6b7280;}
.event .info .card .card-body .event-desc {clear:both; margin:0px 0px 30px 0px; padding:0px 20px 0px 0px;}
.event .info .card .card-body .event-desc p {margin:0; font-size:17px; line-height:155%; font-weight:400; color:#181818; overflow-wrap:anywhere; word-wrap:anywhere;}
.event .info .card .card-body .event-tags {clear:both;}
.event .info .card .card-body .event-tags ul {margin:0; padding:0; list-style-type:none;}
.event .info .card .card-body .event-tags ul li {display:inline-block;}
.event .info .card .card-body .event-tags ul li a,
.event .info .card .card-body .event-tags ul li span {display:inline-block; line-height:40px; background:#F1F3F4; border-radius:5px; margin:0px 10px 0px 0px; padding:0px 12px; font-size:15px; color:#3C4043; font-weight:450; text-decoration:none;max-width:180px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.event .info .card .card-body .event-tags ul li a:hover {background:#f0f6fa;}
.event .info .card .card-body .event-tags ul li a.organizer,
.event .info .card .card-body .event-tags ul li span.organizer {position:relative;padding-left:34px;}
.event .info .card .card-body .event-tags ul li a.organizer .icon,
.event .info .card .card-body .event-tags ul li span.organizer .icon {position:absolute;left:0px;top:5px;font-size:18px;line-height:28px;color:#444;background: transparent;}
.event .info .card .card-footer {clear:both; position:relative; padding:18px 30px 18px 45px;}
.event .info .card .card-footer .divider {height:1px; position:absolute; left:8px; top:0px; right:8px; border-top:1px solid #eee;}
.event .info .card .card-footer .location {clear:both; position:relative; padding:0px 0px 0px 36px;}
.event .info .card .card-footer .location .material-symbols-outlined {font-size:22px; position:absolute; left:2px; top:0px; color:#999;}
.event .info .card .card-footer .location p {margin:0; font-size:16px; line-height:155%; color:#4c4747; overflow-wrap:anywhere; word-wrap:anywhere;}
.event .image {padding:5px 0px 0px 0px;}
.event .image .image-wrap {width:100%; clear:both; border-radius:16px; background-color:#fffffc;}
.event .image .image-wrap figure {width:100%; height:235px; border-radius:16px; margin:0; overflow:hidden;}
.event .image .image-wrap figure img {width:100%; height:100%; display:block; object-fit:cover;}
/* No-image cards on desktop: keep the gray placeholder block (no ![]()
). */
.event .image.image-empty .image-wrap figure {visibility:hidden;background-color:yellow;}
/* Just a list */
.eventslist .event {display:block;}
.eventslist .event .image {display:none;}
/* GEO intro — visible introductory paragraph for AI crawlers and users
---------------------------------------------------------------------- */
.geo-intro {clear:both; padding:0px 0px 18px 0px;}
.geo-intro-text {margin:0; font-size:16px; line-height:160%; color:#545D62;}
.geo-intro-text strong {font-weight:500; color:#1a1a1a;}
/* address inside event cards \u2014 reset browser italic default
---------------------------------------------------------------------- */
.event address {font-style:normal; font-size:16px; line-height:155%; color:#4c4747; display:inline; overflow-wrap:anywhere; word-wrap:anywhere;}
.date-separator {clear:both; position:relative; text-align:center; padding:30px 0px 25px 0px;}
.date-separator p {margin:0; font-size:18px; line-height:46px; display:inline-block; background:#f5f5f5; position:relative; z-index:10;}
.date-separator .line {width:10px; position:absolute; left:50%; top:5px; bottom:30px; margin:0px 0px 0px -5px; border-right:1px dashed #6363635c;}
/* Page layout
---------------------------------------------------------------------- */
.page-grid {display:grid; grid-template-columns:400px 1fr; gap:20px;}
/* Sidebar
---------------------------------------------------------------------- */
.sidebar {clear:both; position:relative;}
.sidebar-inner {clear:both; background:#fff; position:sticky; top:20px; padding:0px 0px 20px 0px; border-radius:10px; box-shadow:rgba(0,0,0,0.1) 0px 1px 3px 0px, rgba(0,0,0,0.06) 0px 1px 2px 0px;}
.sidebar-menu-toggle {display:none;}
.sidebar-logo {clear:both; padding:15px 25px 17px 23px; border-bottom:1px solid #eee; margin:0px 0px 30px 0px;}
.sidebar-logo-grid {display:grid; grid-template-columns:140px 1fr;}
.sidebar-logo-image a {display:block;}
.sidebar-logo-image a img {display:block; height:120px;}
.sidebar-logo-text {clear:both; padding:10px 0px 0px 0px;}
.sidebar-logo-text .tagline {margin:0px 0px 18px 0px; font-size:16px; line-height:130%; color:#222; font-weight:600;}
.sidebar-logo-text .tagline span {font-weight:400; color:#5f8130;}
.sidebar-logo-text .newsletter {margin:0; font-size:16px; line-height:130%; color:#222;}
.sidebar-logo-text .newsletter a {display:block; position:relative; font-size:16px; line-height:130%; color:#222; text-decoration:none;}
.sidebar-logo-text .newsletter a .material-symbols-outlined {position:absolute; top:20px; right:10px; color:#ccc; font-size:22px;transition:.2s ease all;}
.sidebar-logo-text .newsletter a:hover {color:#000;}
.sidebar-logo-text .newsletter a:hover .material-symbols-outlined {right:7px; color:#aaa;}
.sidebar-section {clear:both; padding:0px 12px; margin:0px 0px 35px 0px;}
.sidebar-section + .sidebar-section {padding-top:20px; margin-bottom:5px;}
.sidebar-section-inner {clear:both; padding:0px 25px;}
.sidebar-section-inner p {margin:0px 0px 15px 0px; font-size:19px; font-weight:500; line-height:140%; color:#41434d;}
.sidebar-nav {margin:0; padding:0; list-style-type:none; font-size:17px; color:#000; line-height:150%;}
.sidebar-nav li a {display:block; padding:15px 20px 15px 73px; position:relative; font-size:17px; color:#000; text-decoration:none; font-weight:400; line-height:160%; border-radius:9px;}
.sidebar-nav li a:hover {background:#f5f5f5; text-decoration:none;}
.sidebar-nav li a .nav-icon {width:38px; height:38px; display:block; position:absolute; left:20px; top:7px; border-radius:50%; background:#f1f1f1; text-align:center;}
.sidebar-nav li a .nav-icon .material-symbols-outlined {line-height:38px; font-size:21px;}
/* Tabs bar
---------------------------------------------------------------------- */
.tabs-bar {clear:both; margin:0px 0px 20px 0px; position:relative; background:#fff; border-radius:10px; box-shadow:rgba(0,0,0,0.1) 0px 1px 3px 0px, rgba(0,0,0,0.06) 0px 1px 2px 0px;}
.tabs-bar-inner {height:60px; clear:both; position:relative;}
.tabs-bar-nav {clear:both; padding:0px 0px 0px 45px;}
.tabs-bar-nav ul {margin:0; padding:0; list-style-type:none;}
.tabs-bar-nav ul li {display:inline-block; margin:0px 20px 0px 0px;}
.tabs-bar-nav ul li a {display:inline-block; position:relative; font-size:18px; font-weight:450; color:#5f6b7a; line-height:60px; background:#fff; border-radius:8px;}
.tabs-bar-nav ul li a:hover {/*background:#f5f5f5;*/}
.tabs-bar-nav ul li a .tab-indicator {height:4px; position:absolute; left:0px; bottom:0px; right:0px; background:#0060e4; border-radius:8px 8px 0px 0px; display:none;}
.tabs-bar-nav ul li a.active {color:#0060e4;}
.tabs-bar-nav ul li a.active .tab-indicator {display:block;}
.tabs-bar-nav ul li a .noti {width: auto;height: 18px;position:absolute;top: 2px;right: -12px;padding: 0px 6px;border-radius: 8px;background: #dd2434;color:#fff;font-size: 11px;font-weight: 500;line-height: 19px;text-align: center;}
.tabs-bar-actions {position:absolute; top:8px; right:10px;}
.tabs-bar-actions .view-toggle {display:flex; align-items:center; background:#f5f5f5; border-radius:10px; padding:4px; gap:2px;}
.tabs-bar-actions .view-toggle-btn {width:36px; height:36px; display:flex; align-items:center; justify-content:center; cursor:pointer; border-radius:7px; color:#888; transition:color 0.15s ease; border:none; background:transparent; font-family:inherit;}
.tabs-bar-actions .view-toggle-btn.active {background:#fff; color:#1a1a1a; box-shadow:0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.08);}
.tabs-bar-actions .view-toggle-btn .material-symbols-outlined {font-size:20px;}
/* Sidebar section headings (was , now
for SC 1.3.1) */
.sidebar-section-inner h2 {margin:0px 0px 15px 0px; font-size:19px; font-weight:500; line-height:140%; color:#41434d;}
/* Tab badge (e.g. "Lige tilføjet" count)
---------------------------------------------------------------------- */
.tab-badge {width:18px; height:18px; position:absolute; top:6px; right:-22px; border-radius:50%; background:#f9002d; color:#fff; font-size:11px; font-weight:500; line-height:19px; text-align:center; font-family:Roboto,sans-serif;}
/* Language picker
---------------------------------------------------------------------- */
.lang-picker {width:60px; height:40px; position:absolute; top:10px; right:100px; border-radius:6px;cursor:pointer;}
.lang-picker:hover {background:#f3f3f3;}
.lang-picker-inner {width:100%; height:100%; position:relative;}
.lang-picker-flag {width:38px; height:38px; position:absolute; left:4px; top:1px; background-repeat:no-repeat; background-position:50% 50%; background-size:22px;}
.lang-picker-arrow {width:10px; position:absolute; right:14px; top:4px;}
.lang-picker-arrow .material-symbols-outlined {font-size:22px; line-height:34px; color:#545d63;}
.lang-picker-dropdown {width:210px; position:absolute; top:44px; right:0px; z-index:100; background:#fff; border-radius:5px; box-shadow:rgba(0,0,0,0.24) 0px 3px 8px; display:none;}
.lang-picker-dropdown.is-open {display:block;}
.lang-picker-dropdown-inner {clear:both; padding:8px 6px;}
.lang-picker-dropdown ul {margin:0; padding:0; list-style-type:none; font-size:16px; line-height:140%;}
.lang-picker-dropdown ul li a {display:block; font-size:16px; color:#000; line-height:110%; padding:14px 20px 12px 46px; position:relative; background:#fff; border-radius:4px;}
.lang-picker-dropdown ul li a:hover {background:#fafaff; text-decoration:none;}
.lang-picker-dropdown ul li a.active {background:#f0f0f2;}
.lang-picker-dropdown ul li a .lang-flag {width:38px; height:38px; position:absolute; left:4px; top:3px; background-repeat:no-repeat; background-position:50% 50%; background-size:22px;}
/* Event detail page
---------------------------------------------------------------------- */
.event-detail {clear:both; margin:0px 0px 30px 0px;}
.event-detail-image {clear:both; margin:0px 0px 0px 0px; border-radius:12px 12px 0px 0px; overflow:hidden;}
.event-detail-image figure {margin:0; width:100%; max-height:420px; overflow:hidden;}
.event-detail-image figure img {width:100%; height:100%; display:block; object-fit:cover;}
.event-detail-card {clear:both; background:#fff; border-radius:0px 0px 12px 12px; border:1px solid #D9DDE3; border-top:none; padding:40px 50px 48px 50px;}
.event-detail-image + .event-detail-card {border-radius:0px 0px 12px 12px;}
/* When there is no image, card is standalone */
.event-detail:not(:has(.event-detail-image)) .event-detail-card {border-radius:12px; border-top:1px solid #D9DDE3;}
.event-detail-cats {clear:both; margin:0px 0px 26px 0px;}
.event-detail-cat-tag {display:inline-block; line-height:32px; background:#F1F3F4; border-radius:5px; margin:0px 7px 5px 0px; padding:0px 12px; font-size:14px; color:#3C4043; font-weight:450; text-decoration:none;}
.event-detail-cat-tag:hover {background:#e8eaed; text-decoration:none;}
.event-detail-title {font-size:32px; line-height:120%; font-weight:500; color:#000; margin:0px 0px 28px 0px; letter-spacing:-0.02em; overflow-wrap:anywhere; word-wrap:anywhere;}
.event-detail-meta {clear:both; margin:0px 0px 32px 0px; display:flex; flex-direction:column; gap:14px;}
.event-detail-meta-row {display:flex; align-items:flex-start; gap:14px;}
.event-detail-meta-row .material-symbols-outlined {font-size:22px; color:#6b7280; flex-shrink:0; margin-top:1px;}
.event-detail-meta-row > div {display:flex; flex-direction:column; gap:1px;}
.event-detail-meta-label {font-size:12px; font-weight:400; color:#9aa0a6; text-transform:uppercase; letter-spacing:0.06em; line-height:150%;}
.event-detail-meta-row time,
.event-detail-meta-row address,
.event-detail-meta-row a {font-size:17px; line-height:150%; color:#1a1a1a; font-style:normal; overflow-wrap:anywhere; word-wrap:anywhere;}
.event-detail-meta-row a:hover {text-decoration:underline;}
.event-detail-desc {clear:both; margin:0px 0px 36px 0px; padding-top:28px; border-top:1px solid #f0f0f0;}
.event-detail-desc p {margin:0; font-size:18px; line-height:170%; color:#1a1a1a; overflow-wrap:anywhere; word-wrap:anywhere;}
.event-detail-source {clear:both; padding-top:28px; border-top:1px solid #f0f0f0;}
.event-detail-source-btn {display:inline-flex; align-items:center; gap:8px; background:#0060e4; color:#fff; font-size:16px; font-weight:500; padding:14px 28px; border-radius:8px; text-decoration:none; transition:background 0.15s ease; max-width:100%; box-sizing:border-box; text-align:center; line-height:1.3;}
.event-detail-source-btn:hover {background:#0050c0; text-decoration:none;}
.event-detail-source-btn .material-symbols-outlined {font-size:20px; flex-shrink:0;}
.event-detail-source-note {margin:14px 0px 0px 0px; font-size:14px; color:#9aa0a6; line-height:150%;}
/* Related events section
---------------------------------------------------------------------- */
.related-events {clear:both; margin:30px 0px 0px 0px;padding:0px 10px;}
.related-events h2 {font-size:20px; font-weight:500; color:#1a1a1a; margin:0px 0px 16px 0px;}
.related-events .event {margin:0px 0px 12px 0px;}
/* Breadcrumb
---------------------------------------------------------------------- */
.breadcrumb {clear:both; margin:0px 0px 16px 0px;}
.breadcrumb ol {margin:0; padding:0; list-style:none; display:flex; flex-wrap:wrap; align-items:center; gap:4px; font-size:14px; color:#6b7280;}
.breadcrumb ol li {display:flex; align-items:center; gap:4px;}
.breadcrumb ol li + li::before {content:"›"; color:#9aa0a6;}
.breadcrumb ol li a {color:#6b7280; text-decoration:none; font-size:14px;}
.breadcrumb ol li a:hover {color:#0060e4; text-decoration:underline;}
.breadcrumb ol li[aria-current="page"] {color:#1a1a1a; font-weight:500;}
/* Event detail responsive
---------------------------------------------------------------------- */
@media (max-width: 1330px) {
.event-detail-card {padding:30px 32px 36px 32px;}
.event-detail-title {font-size:26px;}
.breadcrumb {padding:15px 0px 0px 20px;}
.event {margin: 0px 10px 15px 10px;}
.event-detail {padding:0px 10px;}
.sidebar-inner {box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;}
}
@media (max-width: 768px) {
.event-detail-card {padding:24px 20px 28px 20px;}
.event-detail-title {font-size:22px;}
.event-detail-desc p {font-size:16px;}
.event-detail-source-btn {width:100%; justify-content:center; padding:14px 16px; font-size:15px;}
.event .info .card .card-body .event-tags ul li span.organizer .icon {line-height:22px;}
}
.content {clear:both; background:#fff; border-radius:8px; border:1px solid #D9DDE3; border-bottom:1px solid #D9DDE3;}
.content-inner {clear:both; padding:60px 75px;}
/* About section
---------------------------------------------------------------------- */
.about-wrap {font-size:19px; line-height:160%; color:#000;}
.about-wrap h1 {font-size:24px; font-weight:500; line-height:120%; letter-spacing:-0.02em; margin:0px 0px 25px 0px; color:#000;}
.about-wrap h2 {font-size:22px; font-weight:500; line-height:120%; letter-spacing:-0.02em; margin:0px 0px 25px 0px; color:#000;}
.about-wrap h3 {font-size:20px; font-weight:500; margin:0px 0px 25px 0px; color:#000;}
.about-wrap .rule {width:48px; height:2px; background:#1a1a1a; margin:1rem 0 1.75rem; opacity:0.25;}
.about-wrap p {margin:0px 0px 20px 0px; color:#000; line-height:160%;}
.about-wrap ol {margin:0 0 2.5rem; padding-left:1.6rem; counter-reset:ol-counter; list-style:none;}
.about-wrap ol li {counter-increment:ol-counter; position:relative; padding-left:0.4rem; margin-bottom:0.5rem;}
.about-wrap ol li::before {content:counter(ol-counter) "."; position:absolute; left:-1.6rem; font-size:0.85em; font-weight:600; color:#555; top:0.05em;}
.about-wrap ul {margin:0 0 2.5rem; padding-left:1.6rem; list-style:none;}
.about-wrap ul li {position:relative; padding-left:0.4rem; margin-bottom:0.5rem;}
.about-wrap ul li::before {content:"—"; position:absolute; left:-1.4rem; color:#555; font-weight:400;}
.about-wrap blockquote {margin:1.75rem 0; padding:0.25rem 0 0.25rem 1.75rem; border-left:2px solid #1a1a1a; border-radius:0; font-style:italic; font-size:1.15em; line-height:1.6; color:#1a1a1a;}
.about-wrap blockquote p {margin:0 0 0.4rem; text-indent:0;}
.about-wrap blockquote cite {display:block; font-style:normal; font-size:0.75em; color:#555; margin-top:0.6rem;}
.about-wrap blockquote cite::before {content:"— ";}
.about-wrap .img-inline {float:right; margin:0.25rem 0 1rem 1.75rem; width:180px; height:180px; border-radius:50%; overflow:hidden;}
.about-wrap .img-inline img {width:100%; height:100%; display:block; object-fit:cover;}
.about-wrap .clearfix::after {content:""; display:table; clear:both;}
.about-wrap hr {border:none; background:none; border-top:1px solid #f0f0f0; margin:2.5rem 0;}
.about-wrap strong {font-weight:500;}
/* Submit event source box
---------------------------------------------------------------------- */
.submit-box {clear:both; padding:30px; background:#f4f4f4; border-radius:20px;}
.submit-box-inner {clear:both; background:#fff; border-radius:8px; position:relative; box-shadow:0 0 0 1px #32325d0d, 0 2px 12px #32325d47, 0 1px 1px #00000012;}
.submit-box-body {clear:both; padding:42px 50px 48px 48px; position:relative;}
.submit-box-body label {color:#000; display:block; margin:0px 0px 20px 0px; line-height:150%;}
.submit-box-field {clear:both; position:relative;}
.submit-box-field input[type="url"] {width:100%; line-height:66px; border:0; margin:0; padding:0px 20px; text-align:left; box-sizing:border-box; border-radius:8px; outline:0; background:#f8f8f8;}
.submit-box-field input[type="email"] {width:100%; line-height:66px; border:0; margin:0; padding:0px 20px; text-align:left; box-sizing:border-box; border-radius:8px; outline:0; background:#f8f8f8;}
.submit-box-field button {position:absolute; top:5px; right:5px; border:0; padding:0px 42px; margin:0; font-size:18px; font-weight:500; background:#0161e4; color:#fff; height:56px; border-radius:5px; cursor:pointer;}
.submit-box-field button:hover {background:#0050c0;}
/* Media / logos grid
---------------------------------------------------------------------- */
.logos {display:grid; grid-template-columns:1fr 1fr 1fr; gap:20px;margin:0px 0px 60px 0px;}
.logos .itm {clear:both;position:relative; padding:20px; background:#f7f7f7;}
.logos .itm img {display:block; max-width:100%;}
.flyers {display:grid; grid-template-columns:1fr 1fr 1fr; gap:20px;margin:0px 0px 60px 0px;}
.flyers .itm {clear:both;position:relative; padding:20px; background:#f7f7f7;}
.flyers .itm img {display:block; max-width:100%;}
/* Sidebar category colours
---------------------------------------------------------------------- */
.sidebar-nav li a.cat-etm.active {background:#EAF3FF;}
.sidebar-nav li a.cat-etm .nav-icon {background:#EAF3FF;}
.sidebar-nav li a.cat-etm .nav-icon .material-symbols-outlined {color:#174A7C;}
.sidebar-nav li a.cat-sfm.active {background:#E6F7F5;}
.sidebar-nav li a.cat-sfm .nav-icon {background:#E6F7F5;}
.sidebar-nav li a.cat-sfm .nav-icon .material-symbols-outlined {color:#0F5C56;}
.sidebar-nav li a.cat-spo.active {background:#EAF8EC;}
.sidebar-nav li a.cat-spo .nav-icon {background:#EAF8EC;}
.sidebar-nav li a.cat-spo .nav-icon .material-symbols-outlined {color:#24613A;}
.sidebar-nav li a.cat-fod.active {background:#F2F8E8;}
.sidebar-nav li a.cat-fod .nav-icon {background:#F2F8E8;}
.sidebar-nav li a.cat-fod .nav-icon .material-symbols-outlined {color:#4C651F;}
.sidebar-nav li a.cat-fee.active {background:#FFF7D6;}
.sidebar-nav li a.cat-fee .nav-icon {background:#FFF7D6;}
.sidebar-nav li a.cat-fee .nav-icon .material-symbols-outlined {color:#735A00;}
.sidebar-nav li a.cat-fak.active {background:#FFF0E3;}
.sidebar-nav li a.cat-fak .nav-icon {background:#FFF0E3;}
.sidebar-nav li a.cat-fak .nav-icon .material-symbols-outlined {color:#8A3F00;}
.sidebar-nav li a.cat-amc.active {background:#FDECEC;}
.sidebar-nav li a.cat-amc .nav-icon {background:#FDECEC;}
.sidebar-nav li a.cat-amc .nav-icon .material-symbols-outlined {color:#8A2A2A;}
.sidebar-nav li a.cat-csw.active {background:#FCECF5;}
.sidebar-nav li a.cat-csw .nav-icon {background:#FCECF5;}
.sidebar-nav li a.cat-csw .nav-icon .material-symbols-outlined {color:#7A2B55;}
.sidebar-nav li a.cat-oth.active {background:#F2EDFF;}
.sidebar-nav li a.cat-oth .nav-icon {background:#F2EDFF;}
.sidebar-nav li a.cat-oth .nav-icon .material-symbols-outlined {color:#4E347F;}
/* Pagination
---------------------------------------------------------------------- */
.pagi-wrap {clear:both;padding:40px 0px 20px 0px;position:relative;}
.pagi-wrap .pagi {text-align:center;}
.pagi-base-t0 {justify-content:center; align-items:center; margin:0 auto; padding:50px 0 40px; display:flex;}
.pagi-t1 {display:inline-block;}
.pagi-t1 ul {height:40px; margin:0; padding:0; font-size:17px; font-weight:500; list-style-type:none;}
.pagi-t1 ul::after {content:""; display:table; clear:both;}
.pagi-t1 ul li {float:left; padding:0 2px; line-height:40px; position:relative;}
.pagi-t1 ul li a {color:#555; text-align:center; border-radius:50%; width:40px; height:40px; font-size:17px; line-height:40px; text-decoration:none; display:block;}
.pagi-t1 ul li a:hover {background:#efefef;}
.pagi-t1 ul li .current {color:#fff; text-align:center; cursor:default; background:#125ef8; border-radius:50%; width:40px; height:40px; font-size:17px; line-height:40px; text-decoration:none; display:block;}
.pagi-t1 ul li .disabled {color:#bbb; cursor:default; font-size:17px; line-height:40px;}
.pagi-t1 ul .prev {padding:0 25px 0 0;}
.pagi-t1 ul .prev .disabled {color:#bbb; height:40px; font-size:17px; font-weight:500; line-height:40px; text-decoration:none; display:block; position:relative;}
.pagi-t1 ul .prev a {border-radius:0; background:none !important; width:auto !important;}
.pagi-t1 ul .prev a:hover {text-decoration:underline;}
.pagi-t1 ul .next {padding:0 0 0 25px;}
.pagi-t1 ul .next .disabled {color:#bbb; height:40px; font-size:17px; font-weight:500; line-height:40px; text-decoration:none; display:block; position:relative;}
.pagi-t1 ul .next a {border-radius:0; width:auto; background:none !important;}
.pagi-t1 ul .next a:hover {text-decoration:underline;}
.pagi-t1 ul .dot {color:#999; padding:0 10px; font-size:17px; line-height:40px; display:block;}
.pagi-t1 ul .prev,
.blgi-t1 .pagi-t1 ul .next {display:none;}
/* ======================================================================
Tablet — max-width: 1100px
Sidebar collapses into a sticky top bar. Content goes full-width.
====================================================================== */
@media (max-width: 1330px) {
.wrapper {padding:0px;}
.wrapper-inner {width:100%;}
/* Page layout: single column, sidebar on top */
.page-grid {grid-template-columns:1fr; gap:0px;}
/* Sidebar becomes a horizontal sticky top bar */
.sidebar {position:sticky; top:0px; z-index:100;}
.sidebar-inner {border-radius:0px; box-shadow:rgba(0,0,0,0.1) 0px 2px 6px 0px; padding:0px; position:static;}
/* Logo area: single row, hide the logo image */
.sidebar-logo {padding:0px; border-bottom:none; margin:0px;}
.sidebar-logo-grid {grid-template-columns:1fr auto; align-items:center; height:70px; padding:0px 16px;}
.sidebar-logo-image {position: absolute;left: 20px;top: 3px;}
.sidebar-logo-image a img {height:62px;}
.sidebar-logo-text {padding:0px 0px 0px 80px;}
.sidebar-logo-text .tagline {margin:0px; font-size:16px; line-height:120%;}
.sidebar-logo-text .newsletter {display:none;}
/* Hamburger toggle */
.sidebar-menu-toggle {display:block;display:flex; align-items:center; justify-content:center; width:48px; height:48px; border-radius:50%; cursor:pointer; flex-shrink:0;}
.sidebar-menu-toggle:hover {background:#f1f1f1;}
.sidebar-menu-toggle .material-symbols-outlined {font-size:26px; color:#333;}
/* Nav drawer: hidden by default, toggled open via JS */
.sidebar-nav-drawer {display:none; border-top:1px solid #eee;}
.sidebar-nav-drawer.is-open {display:block;}
/* Sections inside the drawer */
.sidebar-section {padding:22px 20px 28px 25px; margin:0px; border-bottom:1px solid #f0f0f0;}
.sidebar-section + .sidebar-section {padding-top:12px; margin-bottom:0px;padding-bottom:30px;}
.sidebar-section-inner {padding:0px 0px 8px 0px;}
.sidebar-section-inner p {font-size:17px; margin:0px 0px 10px 0px; color:#333; font-weight:450;}
/* Nav items: wrap as pills */
.sidebar-nav {display:flex; flex-wrap:wrap; gap:10px; font-size:15px;}
.sidebar-nav li a {padding:12px 16px 12px 46px; font-size:16px; line-height:140%; border-radius:8px; background:#f7f7f7;}
.sidebar-nav li a:hover {background:#eef4ff;}
.sidebar-nav li a .nav-icon {width:30px; height:30px; left:10px; top:6px;}
.sidebar-nav li a .nav-icon .material-symbols-outlined {line-height:30px; font-size:18px;}
/* Main content area padding */
.page-grid > div:last-child {padding:16px 16px 0px 16px;}
/* Tabs bar */
.tabs-bar {border-radius:8px;}
.tabs-bar-nav {padding:0px 0px 0px 16px;}
.tabs-bar-nav ul li a {font-size:18px;}
/* Event: drop image column */
.event .info .card .card-body {padding:24px 24px 20px 24px;}
.event .info .card .card-footer {padding:14px 24px 14px 24px;}
.event .info .card .card-footer .location {padding-left:32px;}
/* Content card */
.content-inner {padding:42px 70px 42px 45px;}
}
/* ======================================================================
Mobile — max-width: 768px
Everything single column and compact.
====================================================================== */
@media (max-width: 920px) {
.event {grid-template-columns: 1fr 250px;}
.event .image .image-wrap figure {height: 190px;}
.sidebar {max-height:500px;overflow:auto;}
.sidebar-logo-grid {position:fixed;left:0px;top:0px;right:0px;z-index:999;background:#fff;border-bottom: 1px solid #dfdfdf;}
.sidebar-nav-drawer {}
.page-grid {padding: 70px 0px 0px 0px;}
}
@media (max-width: 768px) {
/* Nav drawer sections: full-width stacked list */
.sidebar-nav {flex-direction:column; gap:2px;}
.sidebar-nav li {width:100%;}
.sidebar-nav li a {display:block; border-radius:6px;}
.sidebar-logo-image {left: 10px;}
.sidebar-logo-text {padding:0px 0px 0px 70px;}
/* Tabs bar: shorter and smaller */
.tabs-bar {margin: 0px 0px 26px 0px;border-radius: 0px;}
.tabs-bar-inner {height:60px;}
.tabs-bar-nav {padding:0px 0px 0px 12px;left:0px;right:120px;position: absolute;right: 100px;overflow: auto;}
.tabs-bar-nav ul {width:400px;}
.tabs-bar-nav ul li {margin:0px 20px 0px 0px;}
.tabs-bar-nav ul li a {font-size:17px; line-height:60px;}
.tabs-bar-nav ul li a .tab-indicator {height:4px;}
.tabs-bar-actions {top:9px; right:10px;}
.sidebar-logo-grid {padding:0px 10px 0px 16px;}
.event {display:flex;flex-direction:column-reverse;margin:0px 10px 20px 10px;}
.event .image {display:block;}
/* On mobile, hide the image area when the event has no image \u2014 no point
showing a gray banner stretched edge-to-edge above an empty card. */
.event .image.image-empty {display:none;}
.event .image .image-wrap {border-radius:8px 8px 0px 0px;}
.event .image .image-wrap figure {border-radius:8px 8px 0px 0px;}
.event .info .card {margin:-12px 0px 0px 0px;border-radius:0px 0px 8px 8px;}
/* Event card: tighter padding and smaller type */
.event .info .card .card-body {padding:25px 30px;}
.event .info .card .card-body .event-title p {font-size:18px;}
.event .info .card .card-body .event-date p {font-size:15px;}
.event .info .card .card-body .event-desc p {font-size:15px;}
.event .info .card .card-body .event-tags ul li a,
.event .info .card .card-body .event-tags ul li span {font-size:15px; line-height:34px; padding:0px 10px;}
.event .info .card .card-footer {padding:17px 30px;}
.event .info .card .card-footer .location p {font-size:15px;}
/* Language picker: hide on very small screens if needed */
.lang-picker {position:fixed;top:15px;right:58px;z-index:100;}
.flyers {grid-template-columns: 1fr;}
.logos {grid-template-columns: 1fr;}
.submit-box {padding:5px;}
.submit-box-field button {position:static;width:100%;margin:10px 0px 0px 0px;}
.submit-box-body {padding:20px 25px 25px 25px;}
}
/* "Today" / "Tomorrow" pill on event date lines
---------------------------------------------------------------------- */
.event-when-pill {display:inline-block; line-height:1; padding:5px 10px 6px; border-radius:12px; font-size:12px; font-weight:600; letter-spacing:0.04em; text-transform:uppercase; margin-right:8px; vertical-align:1px;}
.event-when-today {background:#d92626; color:#fff;}
.event-when-tomorrow {background:#ffd966; color:#5a4a00;}
.event-detail-meta-row .event-when-pill {font-size:11px; padding:4px 9px 5px; margin-right:10px;}
/* ============================================================
City landing pages
============================================================ */
.city-hero {clear:both; background:#fff; padding:30px 45px 24px 45px; border:1px solid #d9dde3; border-bottom:1px solid #c4c4c4; border-radius:8px; margin:0 0 20px 0;}
.city-hero h1 {margin:0 0 8px; font-size:21px; line-height:140%; font-weight:400; color:#000;}
.city-hero .city-intro {margin:0 0 22px; max-width:64ch; color:#555; line-height:155%; font-weight:400; font-size:17px;}
.city-hero .city-count {margin:0; color:#777; font-size:17px; padding:19px 0 0 0; border-top:1px dashed #ccc;}
.city-hero .city-count strong {color:#222;}
.city-empty {padding:32px 4px; color:#777; max-width:60ch;}
.city-other-strip {margin:40px 0 24px; padding:24px 4px 0; border-top:1px solid #eee;}
.city-other-strip h2 {margin:0 0 22px; font-size:19px; color:#42434d; font-weight:500;}
.city-chips {list-style:none; padding:0; margin:0; display:flex; flex-wrap:wrap; gap:8px;}
.city-chips a {display:inline-block; padding:9px 15px; background:#f2f3f4; border-radius:6px; color:#333; text-decoration:none; font-size:16px; font-weight:400;}
.city-chips a:hover {background:#e6e6e0; color:#000;}
/* Cities index grid */
.cities-grid {margin:24px 0;}
.city-card-list {list-style:none; padding:0; margin:0; display:grid; grid-template-columns:repeat(auto-fill, minmax(200px, 1fr)); gap:16px;}
.city-card-link {display:block; padding:18px 18px 16px; background:#fff; border:1px solid #ececec; border-radius:8px; text-decoration:none; color:inherit; transition:border-color .15s, transform .15s;}
.city-card-link:hover {border-color:#cdd; transform:translateY(-2px);}
.city-card h2 {margin:0 0 6px; font-size:20px; letter-spacing:-0.3px;}
.city-card-count {margin:0; color:#888; font-size:13px;}
.city-card-count strong {color:#222; font-size:15px;}