body { height: 100vh; margin: 0 auto; padding: 0; background-color: white; color: #222; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 16px; } nav { position: absolute; top: 0; left: 0; right: 0; text-align: center; z-index: 5; // on top of
} nav ul { list-style-type: none; margin: 0 auto; padding: 0; color: #0a0; font-size: 80%; } nav li { min-width: 8em; display: inline-block; margin: 0 0 1em; border-left: 2px solid black; border-right: 2px solid black; border-bottom: 2px solid black; border-radius: 0 0 2em 2em; background-color: rgba(255, 255, 255, 0.8); } nav li a { display: inline-block; color: black; font-wieght: bold; padding: 0.3em 2em 0.5em; } nav li a:hover { color: #cfc; } a { color: #070; text-decoration: none; } h3 { font-size: 120%; margin: 1em 0; padding: 0; } .bordered { border: 2px solid black; } .block{ display: block; white-space: pre; margin: 0 auto; } .center { text-align: center; } dl dt { font-weight: bold; } #head1 { position: relative; z-index: 1; margin-top: 32px; height: 77px; background: url('../images/style/tsd1.png') center top no-repeat; } #head2 { position: relative; z-index: 2; margin-top: -27px; height: 200px; background: url('../images/style/tsd2.png') center top no-repeat; } #head3 { position: relative; z-index: 3; margin-top: -1px; height: 86px; background: url('../images/style/tsd3.png') center top no-repeat; } article { position: relative; box-sizing: border-box; z-index: 4; margin: -5px auto 0; padding: 16px 170px 16px; max-width: 960px; background: url('../images/style/tsd4.png') center top no-repeat; } article > * { } footer { position: relative; background-color: #0f3f00; color: #777; text-align: center; } footer a { color: #fff; } #oldds { list-style-type: none; margin: 0 auto; } #oldds li { display: inline; padding: 0 0.3em; } #foodlocator { cursor: pointer; } #foordlocator.expanded { cursor: default; } #food dt { clear: both; margin-top: 1em; font-weight: bold; } #food dt .wheelchair { font-size: 120%; line-height: 1em; color: #444; } #food dt .addr, #food dt .website { font-weight: normal; margin-left: 0.8em; color: #444; } #food dd { color: #444; font-size: 80%; margin: 0 0 0 2em; } .geo-arrow { float: left; clear: left; margin: 0 0.5em 1.5em 0; } .geo-arrow .arrow { margin: 0; text-align: center; font-size: 200%; font-weight: bold; line-height: 1em; } .geo-arrow .arrow span { display: inline-block; } .geo-arrow .dist { margin: 0; text-align: center; font-size: 70%; line-height: 1em; font-weight: 100; } .schedule td.cell-height1, .schedule td.cell-height2, .schedule td.cell-height3, .schedule td.cell-height4, .schedule td.cell-height5, .schedule td.cell-height6, .schedule td.cell-height7, .schedule td.cell-height8 { border: 1px solid #ccc; border-collapse: collapse; } .schedule td.cell-time { border-bottom: 1px solid #ccc; border-collapse: collapse; } .schedule { table-layout: fixed; width: 620px; } .schedule th, .schedule td { width: 190px; } .schedule th.cell-time, .schedule td.cell-time { width: 50px; height: 1.5em; } .schedule h2 { font-size: 110%; } .schedule .event-details { font-size: 80%; } a[href$="mitschnitte-rss.xml"]:before { padding-right: 0.3em; content: url(../images/feed.png); text-align: right; vertical-align: middle; } .resource { display: inline-block; margin: 8px; padding: 0; box-sizing: border-box; width: 290px; border: 2px solid black; } .resource h4 { text-align: center; margin: 2px 4px; padding: 0; font-size: 100%; font-weight: bold; } .resource img { width: 100%; } .resource .links { margin: 2px 4px; padding: 0; list-style-type: none; text-align: center; } .resource .links li { display: inline-block; font-size: 80%; } .resource .links li .size { padding: 0 1em 0 0.4em; color: #777; }