.publication-overview{hyphens:auto;overflow-wrap:anywhere;color:var(--text-color); :is(dl, dd, dt, ol, ul) { margin: 0px; padding: 0px; list-style-type: none; } :is(.block_info, li, .toggle-all).hidden { display: none; } fieldset:has(.filter) { display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); column-gap: 50px; margin-bottom: 20px; :nth-child(3 of .filter) { align-self: end; margin-top: 5px; } .filter { position: relative; &:has(select:disabled, input:disabled) { label { border-color: var(--copyright-color); color: var(--copyright-color); pointer-events: none; } :is(input[type="search"], select) { pointer-events: none; border-color: var(--copyright-color); } } label.default { height: 25px; display: flex; align-items: center; margin-bottom: 5px; cursor: pointer; text-transform: uppercase; color: var(--fsu-blue); } :where(input[type="search"], select) { width: 100%; height: 44px; padding-right: 44px; box-sizing: border-box; background-color: var(--white-100); border: 1px solid var(--fsu-blue); cursor: pointer; color: var(--fsu-blue); font-variation-settings: var(--fsu-font-variation-text-italic); font-size: 1.188rem; line-height: 1.563rem; &.invalid { border-color: var(--error-color); } &:focus-visible { outline: 3px solid var(--hover-color-dark); outline-offset: 3px; } &:hover { border-color: var(--hover-color-dark); outline: 1px solid var(--hover-color-dark); outline-offset: 3px; & + .select-icon { color: var(--hover-color-dark); } } } .reset { width: 44px; height: 44px; display: none; align-items: center; justify-content: center; box-sizing: border-box; padding: 0px; position: absolute; right: 0px; bottom: 0px; z-index: 2; cursor: pointer; background-clip: padding-box; border: 1px solid transparent; background-color: var(--white-100); color: var(--fsu-blue); &.show { display: flex; } &:focus-visible { outline: 3px solid var(--hover-color-dark); outline-offset: -7px; } &:hover { color: var(--hover-color-dark); outline: 1px solid var(--hover-color-dark); outline-offset: -5px; } } button[type="submit"] { width: 100%; height: 44px; padding: 0px 10px; box-sizing: border-box; background-color: var(--white-100); border: 1px solid var(--fsu-blue); cursor: pointer; color: var(--fsu-blue); font-variation-settings: var(--fsu-font-variation-text-condensed); font-size: 1.125rem; line-height: 1.500rem; &:disabled { box-sizing: border-box; pointer-events: none; background-color: var(--white-100); border: 1px solid var(--copyright-color); color: var(--copyright-color); } &:focus-visible { outline: 3px solid var(--hover-color-dark); outline-offset: -6px; } &:hover { border-color: var(--hover-color-dark); color: var(--hover-color-dark); outline: 1px solid var(--hover-color-dark); outline-offset: -4px; } } } } .toggle-all { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; p { align-self: center; margin: 0px 0px 0px 10px; color: var(--copyright-color); font-variation-settings: var(--fsu-font-variation-text-condensed); font-size: 0.750rem; line-height: 1.000rem; } button { height: 44px; display: flex; align-items: center; justify-content: center; padding: 0px 10px 0px 0px; margin-left: auto; cursor: pointer; border: none; background-color: transparent; -webkit-text-decoration: none; text-decoration: underline transparent 1px; text-underline-offset: 3px; color: var(--text-color); font-variation-settings: var(--fsu-font-variation-text-condensed); &:disabled { pointer-events: none; color: var(--copyright-color); } &:focus-visible { outline: 3px solid var(--hover-color-dark); outline-offset: 0px; } &:hover { -webkit-text-decoration: underline; text-decoration-color: inherit; } } } ol > li { border-bottom: 1px solid var(--block-background); &:first-child { border-top: 1px solid var(--block-background); } details { padding: 3px; margin: -3px; &[open]:not(.isClosing) summary i.icon { transform: rotate(180deg); } summary { display: grid; grid-template-columns: 1fr 44px; grid-template-rows: auto auto; grid-template-areas: "all-property icon" "all-author icon" "title icon"; align-items: center; gap: 10px; padding: 15px 0px 15px 10px; list-style: none !important; cursor: pointer; &::-webkit-details-marker, &::marker { display: none; } &:focus-visible { outline: 3px solid var(--hover-color-dark); outline-offset: 0px; } &:hover { outline: 1px solid var(--hover-color-dark); outline-offset: 0px; i.icon { color: var(--hover-color-dark); } } @media (prefers-reduced-motion: no-preference) { i.icon { transition: transform 350ms ease-in-out; } } .all-property { grid-area: all-property; display: flex; flex-wrap: wrap; gap: 10px; text-transform: uppercase; font-size: 0.750rem; line-height: 1.000rem; span:not(.hidden_text) { padding: 4px 5px 3px 5px; vertical-align: middle; &.year { box-sizing: border-box; border: 1px solid var(--nav-background); background-color: var(--nav-background); color: var(--white-100); } &.status { box-sizing: border-box; border: 1px solid var(--block-background); background-color: var(--block-background); color: var(--text-color); } &.appeared-in { padding-left: 0px; span { padding-top: 0px; padding-left: 0px; padding-bottom: 0px; } } } } .all-author { grid-area: all-author; strong { font-weight: 600; font-variation-settings: var(--fsu-font-variation-text-bold); } } h3 { grid-area: title; display: block; margin: 0px; color: var(--fsu-blue); text-wrap: balance; font-weight: 500; font-variation-settings: var(--fsu-font-variation-headline-block); font-size: 1.375rem; line-height: 1.813rem; } i.icon { grid-area: icon; align-self: start; display: flex; align-items: center; justify-content: center; color: var(--button-color); } } .content { padding: 0px 10px; dl:first-child > div:first-child :is(a, dt) { padding-top: 0px; } dl > div { display: flex; flex-wrap: wrap; column-gap: 5px; dt { padding: var(--link-block-padding) 0px var(--link-block-padding) 0px; } a { width: fit-content; display: block; padding: var(--link-block-padding) 0px var(--link-block-padding) 0px; text-decoration: underline 1px; text-underline-offset: 3px; color: inherit; @media (forced-colors: active) { color: LinkText; } &:focus-visible { outline: 3px solid var(--hover-color-dark); outline-offset: 0px; } &:hover { text-decoration-thickness: 2px; } } } } } } fieldset:has(.pagination) { display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); column-gap: 50px; margin-top: 50px; .pagination { grid-column: 2 / 3; display: flex; align-items: center; gap: 10px; div { text-align: center; flex-grow: 1; color: var(--text-color); font-variation-settings: var(--fsu-font-variation-text-condensed); font-size: 1.125rem; line-height: 1.500rem; } button { width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; border: none; background-color: var(--button-color); cursor: pointer; color: var(--white-100); &:disabled { box-sizing: border-box; pointer-events: none; background-color: var(--white-100); border: 1px solid var(--copyright-color); color: var(--copyright-color); } &:focus-visible { outline: 3px solid var(--white-100); outline-offset: -6px; } &:hover { background-color: var(--hover-color-dark); outline: 1px solid var(--white-100); outline-offset: -4px; } } } }}@media(min-width:48.0000em) and (max-width:74.9375em){.publication-overview fieldset:has(.filter){column-gap:24px}}@media(max-width:74.9375em){.publication-overview h3{font-size:clamp(var(--fsu-block-font-size-scale-min),var(--fsu-block-font-size-scale),var(--fsu-block-font-size-scale-max));line-height:clamp(var(--fsu-block-line-height-scale-min),var(--fsu-block-line-height-scale),var(--fsu-block-line-height-scale-max))}}@media(max-width:47.9375em){.publication-overview{fieldset:has(.filter) { grid-template-columns:minmax(0px,1fr); row-gap:10px;:where(input[type="search"],select) { font-size:1.000rem; line-height:1.313rem; } } ol > li details .content dl > div { dt { padding-bottom:0px; } dd { flex-basis:100%; a { padding-top:0px; } } } fieldset:has(.pagination) { grid-template-columns:minmax(0px,1fr); margin-top:20px; .pagination { grid-column:1/2; } }}}