.khl-showcase{
--khl-accent:#7d9300;
--khl-text:#17202a;
--khl-muted:#65707b;
--khl-card:#f7f9fa;
--khl-line:rgba(30,45,55,.12);
width:100%;
}
.khl-showcase__subtitle{
text-align:center;
color:#535e67;
font-size:clamp(1rem,1.3vw,1.2rem);
margin:-10px 0 34px;
} .khl-highlight-grid{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:28px;
align-items:stretch;
}
.khl-highlight-card{
min-width:0;
background:var(--khl-card);
border-radius:5px;
overflow:hidden;
box-shadow:0 4px 16px rgba(0,0,0,.11);
display:flex;
flex-direction:column;
}
.khl-highlight-card__image{
display:block;
aspect-ratio:4/3;
overflow:hidden;
background:#e6eaec;
}
.khl-highlight-card__image img{
display:block;
width:100%;
height:100%;
object-fit:cover;
}
.khl-highlight-card__placeholder{
display:block;
width:100%;
height:100%;
background:linear-gradient(135deg,#edf0f2,#dce2e5);
}
.khl-highlight-card__body{
padding:20px 18px 14px;
display:flex;
flex-direction:column;
flex:1;
}
.khl-highlight-card__category{
color:var(--khl-accent);
text-transform:uppercase;
font-size:.76rem;
font-weight:700;
margin-bottom:9px;
}
.khl-highlight-card__title{
margin:0 0 12px;
font-size:clamp(1.08rem,1.35vw,1.35rem);
line-height:1.28;
font-weight:600;
}
.khl-highlight-card__title a,
.khl-highlight-card__footer a{
color:var(--khl-accent);
text-decoration:none;
}
.khl-highlight-card__meta{
color:var(--khl-muted);
font-size:.9rem;
margin-bottom:12px;
}
.khl-highlight-card__excerpt{
color:#56606a;
font-size:.96rem;
line-height:1.5;
margin-bottom:14px;
}
.khl-highlight-card__footer{
margin-top:auto;
padding-top:11px;
border-top:1px solid var(--khl-line);
text-align:right;
} .khl-divider{
display:flex;
align-items:center;
gap:18px;
margin:44px 0 26px;
color:#68737d;
}
.khl-divider:before,.khl-divider:after{
content:"";
height:1px;
background:var(--khl-line);
flex:1;
}
.khl-list-title{
margin:0 0 10px;
color:var(--khl-text);
font-size:1.25rem;
} .khl-event-list{
border-top:1px solid var(--khl-line);
}
.khl-event-row{
display:grid;
grid-template-columns:64px minmax(0,1fr) 28px;
gap:20px;
align-items:center;
padding:10px 4px;
border-bottom:1px solid var(--khl-line);
color:inherit;
text-decoration:none !important;
} .khl-has-top .khl-event-row.khl-is-highlight{
display:none;
}
.khl-date-tile{
width:58px;
border:1px solid var(--khl-accent);
border-radius:4px;
overflow:hidden;
text-align:center;
background:#fff;
}
.khl-date-tile__month{
display:block;
padding:3px 2px;
background:var(--khl-accent);
color:#fff;
font-size:.75rem;
font-weight:700;
}
.khl-date-tile__day{
display:block;
padding:4px 2px 5px;
color:#26313a;
font-size:1.45rem;
line-height:1.15;
font-weight:600;
}
.khl-event-row__title{
display:block;
color:var(--khl-text);
font-size:1rem;
line-height:1.35;
font-weight:600;
margin-bottom:5px;
}
.khl-event-row__meta{
display:flex;
flex-wrap:wrap;
gap:8px 24px;
color:var(--khl-muted);
font-size:.84rem;
}
.khl-event-row__arrow{
color:#39444c;
font-size:2rem;
line-height:1;
text-align:right;
}
.khl-all-events{
text-align:center;
margin-top:28px;
}
.khl-all-events a{
display:inline-block;
padding:10px 20px;
background:var(--khl-accent);
color:#fff !important;
border-radius:4px;
text-decoration:none !important;
font-weight:600;
} @media(max-width:900px) and (min-width:621px){
.khl-highlight-grid{
grid-template-columns:repeat(2,minmax(0,1fr));
}
} @media(max-width:620px){
.khl-showcase__subtitle{
margin-bottom:22px;
}
.khl-highlight-grid{
grid-template-columns:1fr;
gap:20px;
} .khl-has-top .khl-event-row.khl-is-highlight{
display:grid;
} .khl-has-top .khl-highlight-card{
display:none;
} .khl-mobile-highlights-1 .khl-highlight-pos-1,
.khl-mobile-highlights-2 .khl-highlight-pos-1,
.khl-mobile-highlights-2 .khl-highlight-pos-2,
.khl-mobile-highlights-3 .khl-highlight-pos-1,
.khl-mobile-highlights-3 .khl-highlight-pos-2,
.khl-mobile-highlights-3 .khl-highlight-pos-3,
.khl-mobile-highlights-4 .khl-highlight-pos-1,
.khl-mobile-highlights-4 .khl-highlight-pos-2,
.khl-mobile-highlights-4 .khl-highlight-pos-3,
.khl-mobile-highlights-4 .khl-highlight-pos-4,
.khl-mobile-highlights-5 .khl-highlight-pos-1,
.khl-mobile-highlights-5 .khl-highlight-pos-2,
.khl-mobile-highlights-5 .khl-highlight-pos-3,
.khl-mobile-highlights-5 .khl-highlight-pos-4,
.khl-mobile-highlights-5 .khl-highlight-pos-5,
.khl-mobile-highlights-6 .khl-highlight-pos-1,
.khl-mobile-highlights-6 .khl-highlight-pos-2,
.khl-mobile-highlights-6 .khl-highlight-pos-3,
.khl-mobile-highlights-6 .khl-highlight-pos-4,
.khl-mobile-highlights-6 .khl-highlight-pos-5,
.khl-mobile-highlights-6 .khl-highlight-pos-6{
display:flex;
} .khl-mobile-highlights-1 .khl-highlight-list-pos-1,
.khl-mobile-highlights-2 .khl-highlight-list-pos-1,
.khl-mobile-highlights-2 .khl-highlight-list-pos-2,
.khl-mobile-highlights-3 .khl-highlight-list-pos-1,
.khl-mobile-highlights-3 .khl-highlight-list-pos-2,
.khl-mobile-highlights-3 .khl-highlight-list-pos-3,
.khl-mobile-highlights-4 .khl-highlight-list-pos-1,
.khl-mobile-highlights-4 .khl-highlight-list-pos-2,
.khl-mobile-highlights-4 .khl-highlight-list-pos-3,
.khl-mobile-highlights-4 .khl-highlight-list-pos-4,
.khl-mobile-highlights-5 .khl-highlight-list-pos-1,
.khl-mobile-highlights-5 .khl-highlight-list-pos-2,
.khl-mobile-highlights-5 .khl-highlight-list-pos-3,
.khl-mobile-highlights-5 .khl-highlight-list-pos-4,
.khl-mobile-highlights-5 .khl-highlight-list-pos-5,
.khl-mobile-highlights-6 .khl-highlight-list-pos-1,
.khl-mobile-highlights-6 .khl-highlight-list-pos-2,
.khl-mobile-highlights-6 .khl-highlight-list-pos-3,
.khl-mobile-highlights-6 .khl-highlight-list-pos-4,
.khl-mobile-highlights-6 .khl-highlight-list-pos-5,
.khl-mobile-highlights-6 .khl-highlight-list-pos-6{
display:none;
}
.khl-divider{
margin:32px 0 20px;
}
.khl-event-row{
grid-template-columns:56px minmax(0,1fr) 18px;
gap:12px;
padding:9px 0;
}
.khl-date-tile{
width:52px;
}
.khl-date-tile__day{
font-size:1.25rem;
}
.khl-event-row__meta{
display:block;
}
.khl-event-row__meta span{
display:block;
margin-top:2px;
}
.khl-event-row__arrow{
font-size:1.6rem;
} .khl-mobile-highlights-0 .khl-highlight-grid{
display:none;
}
.khl-mobile-highlights-0 .khl-showcase__subtitle{
display:none;
}
} @media (hover:hover) and (pointer:fine) {
.khl-highlight-card {
transition: background-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.khl-highlight-card:hover {
background-color: rgba(255,255,255,.78);
box-shadow: 0 6px 20px rgba(0,0,0,.14);
transform: translateY(-2px);
}
.khl-event-row {
transition: background-color .18s ease;
}
.khl-event-row:hover {
background-color: rgba(255,255,255,.48);
}
} .khl-highlight-count-1 .khl-highlight-grid{
grid-template-columns:minmax(0, 1fr);
max-width:420px;
}
.khl-highlight-count-2 .khl-highlight-grid{
grid-template-columns:repeat(2, minmax(0, 1fr));
max-width:760px;
}
.khl-highlight-count-3 .khl-highlight-grid,
.khl-highlight-count-4 .khl-highlight-grid,
.khl-highlight-count-5 .khl-highlight-grid,
.khl-highlight-count-6 .khl-highlight-grid{
max-width:none;
}
.khl-highlight-count-1 .khl-highlight-grid,
.khl-highlight-count-2 .khl-highlight-grid{
margin-left:auto;
margin-right:auto;
} @media (min-width:621px){
.khl-no-desktop-list-items .khl-list-section{
display:none;
}
.khl-no-desktop-list-items .khl-all-events{
margin-top:28px;
}
} @media (max-width:620px){
.khl-no-desktop-list-items .khl-list-section{
display:block;
}
.khl-highlight-count-1 .khl-highlight-grid,
.khl-highlight-count-2 .khl-highlight-grid{
max-width:none;
}
} @media (min-width:621px){
.khl-event-row.khl-beyond-desktop-list-limit{
display:none;
}
} @media (min-width:980px){
.khl-list-columns-2 .khl-event-list{
display:grid;
grid-template-columns:repeat(2, minmax(0, 1fr));
column-gap:28px;
row-gap:0;
border-top:0;
}
.khl-list-columns-2 .khl-event-row{
width:100%;
min-width:0;
border-top:1px solid var(--khl-line);
border-bottom:0;
}
.khl-list-columns-2 .khl-event-row:nth-last-child(-n+2){
border-bottom:1px solid var(--khl-line);
}
.khl-list-columns-2 .khl-event-row__title{
overflow-wrap:anywhere;
}
}
@media (max-width:979px){
.khl-list-columns-2 .khl-event-list{
display:block;
}
}.sll-category-heading {
grid-column: 1 / -1;
font-size: 1.4em;
font-weight: bold;
margin: 0 0 15px 0;
padding-bottom: 4px;
border-bottom: 1px solid #ccc;
} .sll-layout-grid .sll-category-group {
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-gap: 20px;
} @media (max-width: 1024px) {
.sll-layout-grid .sll-category-group {
grid-template-columns: repeat(2, 1fr);
}
} @media (max-width: 650px) {
.sll-layout-grid .sll-category-group {
grid-template-columns: repeat(1, 1fr);
}
} .sll-link-item {
width: 100%;
margin: 0;
}
.sll-link-inner {
background: #fff;
border-radius: 8px;
overflow: hidden;
border: 1px solid #ddd;
padding: 10px;
box-sizing: border-box;
transition: box-shadow 0.3s ease, transform 0.3s ease;
}
.sll-link-inner:hover {
box-shadow: 0 4px 12px rgba(0,0,0,0.15);
transform: translateY(-2px);
}
.sll-link-image {
margin-bottom: 8px;
}
.sll-link-image img {
width: 100%;
height: auto;
display: block;
}
.sll-link-title {
font-weight: bold;
margin-bottom: 5px;
}
.sll-link-title a {
text-decoration: none;
}
.sll-link-description {
margin-top: 5px;
font-size: 14px;
line-height: 1.4;
} .sll-admin-actions {
margin: 6px 0 8px 0;
display: flex;
gap: 10px;
flex-wrap: wrap;
}
.sll-admin-actions a {
display: inline-block;
padding: 4px 10px;
border: 1px solid #ddd;
border-radius: 6px;
text-decoration: none;
font-size: 13px;
}
.sll-inline-edit-form {
margin-top: 10px;
padding: 10px;
border: 1px dashed #ddd;
border-radius: 8px;
background: #fafafa;
}
.sll-footer-link {
margin-top: 18px;
text-align: right;
} .sll-layout-list .sll-link-title{
display:flex;
align-items:center;
gap:8px;
}
.sll-layout-list .sll-actions{
display:flex;
gap:6px;
align-items:center;
}
.sll-layout-list .sll-icon-btn{
background:none;
border:none;
padding:0;
cursor:pointer;
line-height:1;
}
.sll-layout-list .sll-icon-link{
display:inline-flex;
align-items:center;
text-decoration:none;
line-height:1;
}
.sll-layout-list .sll-icon{
width:18px;
height:18px;
display:block;
fill: currentColor;
}