#qspinner { width: 100%; max-width: 768px; text-align: center; }
.hidden { display: none !important; }
.header { margin-bottom: 0.5rem; border-bottom: 1px solid var(--crna); }
.header .city { display: inline-block; margin-right: 1em; }
.header .city[data-city="Berlin"] strong { color: var(--turkizna1); }
.header .city[data-city="New_York"] strong { color: var(--modra1); }
.header .city[data-city="London"] strong { color: var(--cokoladna); }
.header .city[data-city="Vienna"] strong { color: var(--rdeca); }
.chart { overflow-x: auto; }
.chart .box { cursor: pointer; }
.chart .box:hover { background-color: red; }
.chart .box.selected { border-color: red; background: white; }
.chart tr.header { border: 0; }
.chart th { font-size: 16px; }
.chart th .count { font-weight: 400; white-space: nowrap; }
.chart th .count:after { content: "👤"; font-family: NotoEmoji; }
.chart th.year { vertical-align: top; padding-right: 0.4rem; padding-left: 0.4rem; min-width: 3.1rem; }
.chart th.year.inverse { color: white; }
.chart th.city {
    text-transform: uppercase; font-weight: 400; white-space: nowrap;
    padding-left: 0.4rem; padding-right: 0.4rem; }
.chart tr.header th.mon {
    text-transform: uppercase; font-weight: 400;
    padding: 1px 1px; text-align: center; }
.chart tr.header th.mon { min-width: 3.2rem; }
@media (min-width: 1024px) and (max-width: 1199px) {
    .chart tr.header th.mon { min-width: 2.5rem; }
}
@media (min-width: 768px) and (max-width: 1023px) {
    .chart tr.header th.mon { min-width: 2.8rem; }
}
@media (max-width: 767px) {
    .chart tr.header th.mon { min-width: 1.3rem; }
    .chart tr.header th.mon label {
	transform: rotate(-90deg); padding: 0; margin: 0 0 0.4rem 0; position: relative; }
}
.chart tr.row-0 { border-top: 1px solid #DBDBDB; }
.chart tr.row-0 td { padding-top: 0.4rem; }
.chart tr.row-0 th { padding-top: 0.4rem; }
.chart tr.row-z th { padding-bottom: 0.4rem; }
.chart tr td { vertical-align: middle; }
.chart tr td span { display: inline-block; min-width: 100%; height: 1rem; border-radius: 0.5rem; border: 6px solid transparent; }
.legend { margin-right: 2rem; }
.legend tr { border-top: 1px solid #DBDBDB; }
.legend th { padding-left: 0.2rem; padding-right: 1rem; cursor: pointer; white-space: nowrap; vertical-align: middle; }
.legend th label { margin: 0.2rem 0.4rem; }
.legend th span { margin-right: 0.2rem; vertical-align: middle; height: 20px; }
.legend th label { margin: 0.2rem 0.4rem; }
.legend td { padding: 0 0.4rem; }
.legend tr[data-type] th label:before {
    content: "\2610"; font-family: NotoSymbols2;
    margin-right: 1rem; font-size: 22px; vertical-align: middle; }
.legend tr.selected[data-type]  label:before { content: "\2612"; }
.legend tr:hover { background: var(--bela); }
body.kontrast-temen .legend th:hover { color: black; }
body.kontrast-temen .legend th.selected { color: black; }
body.kontrast-temen .legend tr.selected { color: black; }
//.legend tr.selected { background: var(--bela); }
//.legend th.selected { background: var(--bela); }
.legend th, .legend td { font-size: 20px; font-weight: 400; }
.legend td { text-align: right; font-size: smaller; }
//.legend .category.selected th span:before { color: var(--bela); content: "\00d7"; margin-left: 0.45rem; }
.details nav { float: right; }
.details a { text-decoration: none; }
.details p { margin: 1rem0; }
.details pre { display: none; }
.description { font-size: smaller; margin: 0 0 1rem 0; }
.categories { font-size: smaller; }
.categories .category { font-weight: bold; font-size: smaller; margin-right: 0.5rem; }
.categories .category:before { content: '#'; }
.residency-info { padding: 1rem; background: var(--bela); }
.residency-info:empty { display: none; }
.residency-info ul { margin: 1rem 0; }
body.anon .residency-info .record { display: none; }
.hgroup { display: flex; }
.artists { font-weight: bold; margin-top: 0.5rem;}
.links, .time { font-size: smaller; }
.categories { margin-top: 1rem; }
.related { font-size: smaller; padding-left: 0; list-style: none; }
.related li:before { font-family: "culture_ico" !important; content: " "; }
@media (max-width: 1023px) { 
    .hgroup { flex-direction: column; } 
    .legend { margin-bottom: 1rem; }
    .legend tr { display: inline-block; margin-right: 1rem; width: 180px; }
    .legend td { display: none; }
    .legend th { padding-right: 0.5rem; }
    .chart tr.header th { min-width: 2.8rem; text-align: center; }
    .legend tr[data-type] th label:before { margin-right: 0.4rem; }
}

.category span { min-width: 1.4rem; display: inline-block; }
.category-Architecture { background-color: #D9B167; }
.category-Cultural_heritage { background-color: #4FA395; }
.category-Design { background-color: #3E7C94; }
.category-Film { background-color: #75A02F; }
.category-Intermedia_arts { background-color: #95A77E; } 
.category-Literature { background-color: #B7AB28; }
.category-Media { background-color: #C9744A; }
.category-Music { background-color: #DC6461; }
.category-New_media_art { background-color: #D39660; }
//.category-Theatre { background-color: #70395B; }
.category-Theatre, .category-Theatre__Dance { background-color: #91537A; }
.category-Dance { background-color: #A87495; }
.category-Visual_arts { background-color: #4F9CBB; }
.category-Photography { background-color: #457A73; }
//.category-Multiple { background-color: #526768; }
.category-Multiple { background-color: #676768; }
.category-unknown { background-color: #bbb; }
#mytooltip {
    position: fixed;
    min-width: 180px;
    margin-left: -90px;
    margin-top: -76px;
    padding: 8px;
    z-index: 1000;
    border: none;
    background: rgba(255,255,255,0.9);
    box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1);
    border-radius: 8px;
    text-align: center;
    font-size: 16px;
    white-space: nowrap;
    padding-left: 1rem;
    padding-right: 1rem;
    color: black;
}