| 0,0 → 1,738 |
| @CHARSET "UTF-8"; |
| |
| /* Basic fonts */ |
| |
| @font-face { |
| font-family: "LCARS"; |
| font-style: normal; |
| font-weight: normal; |
| src: local("LCARS"), url(fonts/LCARS.ttf); |
| } |
| |
| /* EOT font created with WEFT on 2002-03-23 */ |
| @font-face { |
| font-family: "Downloadable Haettenschweiler"; |
| font-style: normal; |
| font-weight: normal; |
| src: url(fonts/HAETTEN0.eot), url(fonts/HAETTENS.ttf); |
| } |
| |
| /* |
| @font-face { |
| font-family:Webdings; |
| font-style:normal; |
| font-weight:normal; |
| src:url(fonts/WEBDING0.eot); |
| } |
| */ |
| |
| @font-face { |
| font-family: "Downloadable Zurich XCn BT"; |
| font-style: normal; |
| font-weight: normal; |
| src: url(fonts/ZurichXCn.pfr); |
| } |
| |
| /* Basic display */ |
| |
| * { |
| font-family: "LCARS", |
| Haettenschweiler, "Downloadable Haettenschweiler", |
| "Zurich XCn BT", "Downloadable Zurich XCn BT", |
| impact, Verdana, Geneva, Arial, Helvetica, sans-serif; |
| font-weight: normal; |
| } |
| |
| body { |
| margin-top: 12em; |
| margin-left: 22em; |
| margin-right: 0.2em; |
| margin-bottom: 0.2em; |
| |
| background-color: #000; |
| color: #99f; |
| font-size: 131%; |
| overflow: auto; |
| } |
| |
| /* 0.0 to 1.0 s */ |
| @-webkit-keyframes fade-in { |
| from { |
| opacity: 0; |
| } |
| |
| /* at 0.25 s */ |
| 25% { |
| opacity: 0; |
| } |
| |
| to { |
| opacity: 1; |
| } |
| } |
| |
| body.fade-in { |
| /* TODO: Step-by-step display instead */ |
| /*-webkit-animation-name: fade-in;*/ |
| /* -webkit-animation-iteration-count: infinite; */ |
| } |
| |
| body.empty { |
| margin-left: 0.2em; |
| margin-bottom: 3em; |
| } |
| |
| body.multi { |
| /* TODO from lcars21.css, use `em' instead */ |
| } |
| |
| #content { |
| /* position: relative; */ |
| } |
| |
| a { |
| text-decoration: none; |
| } |
| |
| a:link:hover, |
| a:link:focus |
| { |
| background-color:#000; |
| color: #f90; |
| } |
| |
| a:link:active { |
| background-color:#000; |
| color: #fff; |
| } |
| |
| a:link { |
| background-color:#000; |
| color:#fc9; |
| } |
| |
| a:visited:hover, |
| a:visited:focus |
| { |
| background-color:#000; |
| color:#f90; |
| } |
| |
| a:visited:active { |
| background-color:black; |
| color:#fff; |
| } |
| |
| a:hover, |
| a:focus, |
| a:active |
| { |
| text-decoration: underline; |
| } |
| |
| a:visited { |
| background-color:black; |
| color:#c9c; |
| } |
| |
| h2 { |
| background-color: #000; |
| color: #fff; |
| font-size: 136%; |
| } |
| |
| p { |
| margin-top: 1em; |
| margin-bottom: 0; |
| line-height: 1.5; |
| text-align: justify; |
| } |
| |
| li p { |
| line-height: normal; |
| } |
| |
| p:first-child { |
| margin-top: 0; |
| } |
| |
| .instruction { |
| background-color: #000; |
| color: #f90; |
| font-size: 136%; |
| } |
| |
| /* Language support */ |
| |
| [lang^="x-vulcan-latin"] { |
| font-family: "URW Chancery L", "Matura MT Script Capitals", |
| Haettenschweiler, Haettens, "Zurich XCn BT", impact, Verdana, |
| Geneva, Arial, Helvetica, sans-serif; |
| } |
| |
| /* Bow (main) and elbo (multi-view) */ |
| |
| #LCARS { |
| position: fixed; |
| left: 0; |
| top: 0; |
| right: 0; |
| padding: 0.2em; |
| background-color: #000; |
| z-index: 1701; |
| } |
| |
| #bow { |
| position: absolute; |
| left: 0.2em; |
| top: 0.2em; |
| right: 0.2em; |
| height: 2.4em; |
| padding-bottom: 0.2em; |
| background-color: #000; |
| } |
| |
| #bow-top { |
| /* NOTE: position: absolute is needed for animation */ |
| position: absolute; |
| top: 0; |
| left: 0; |
| right: 0; |
| min-width: 15.4em; |
| height: 2em; |
| background-color: #999; |
| border-top-left-radius: 2.4em; |
| border-top-right-radius: 1.2em; |
| border-bottom-right-radius: 1.2em; |
| line-height: 0.9; |
| } |
| |
| .empty #bow-top { |
| border-top-left-radius: 1.2em; |
| border-bottom-left-radius: 1.2em; |
| } |
| |
| /* 0.0 to 1.0 s */ |
| @-webkit-keyframes bow-top { |
| from { |
| left: 90%; |
| border-top-left-radius: 0; |
| } |
| } |
| |
| .fade-in #bow-top { |
| -webkit-animation-name: bow-top; |
| -webkit-animation-duration: 1s; |
| -webkit-animation-timing-function: linear; |
| } |
| |
| #bow-top .text { |
| position: absolute; |
| margin: 0; |
| left: 4.33em; |
| top: 0; |
| right: 0.65em; |
| height: 1em; |
| text-align: right; |
| color: #fc0; |
| font-size: 2.4em; |
| padding-right: 0.1em; |
| overflow: hidden; |
| text-overflow: ellipsis; |
| } |
| |
| /* 0.0 to 1.0 s */ |
| @-webkit-keyframes bow-top-text { |
| from { |
| opacity: 0; |
| } |
| |
| /* shortly before 1.0 s */ |
| 99% { |
| opacity: 0; |
| } |
| } |
| |
| .fade-in #bow-top .text { |
| -webkit-animation-name: bow-top-text; |
| -webkit-animation-duration: 1s; |
| -webkit-animation-timing-function: linear; |
| } |
| |
| #bow-top .text span { |
| padding-right: 0.1em; |
| background-color: #000; |
| padding-left: 0.1em; |
| text-transform: uppercase; |
| white-space: nowrap; |
| } |
| |
| .empty .separator-left { |
| position: absolute; |
| left: 2em; |
| height: 2em; |
| width: 0.25em; |
| background-color: #000; |
| } |
| |
| .empty .separator-right { |
| position: absolute; |
| right: 2em; |
| height: 2em; |
| width: 0.25em; |
| background-color: #000; |
| } |
| |
| #bow-top-left { |
| position: absolute; |
| top: 2em; |
| left: 0; |
| right: 0; |
| height: 3.2em; |
| width: 9.2em; |
| background-color: #999; |
| } |
| |
| /* 0.0 to 1.25 s */ |
| @-webkit-keyframes bow-top-left { |
| from { |
| height: 0; |
| } |
| |
| /* at 1.0 s */ |
| 80% { |
| height: 0; |
| } |
| } |
| |
| .fade-in #bow-top-left { |
| -webkit-animation-name: bow-top-left; |
| -webkit-animation-duration: 1.25s; |
| -webkit-animation-timing-function: linear; |
| } |
| |
| .empty #bow-top-left { |
| display: none; |
| } |
| |
| #bow-top-left .concave { |
| position: absolute; |
| top: 0; |
| left: 8em; |
| height: 3.2em; |
| width: 1.2em; |
| background-color: #000; |
| border-top-left-radius: 1.2em; |
| } |
| |
| .empty #bow-top-left-concave { |
| display: none; |
| } |
| |
| #bow .menu |
| { |
| position: absolute; |
| left: 0; |
| top: 5.4em; |
| width: 15.4em; |
| overflow: auto; |
| } |
| |
| /* 0.0 to 2.25 s */ |
| @-webkit-keyframes bow-menu { |
| from { |
| opacity: 0; |
| height: 0; |
| overflow: hidden; |
| } |
| |
| /* at ca. 1.25 s */ |
| 55% { |
| opacity: 0; |
| } |
| |
| 56% { |
| opacity: 1; |
| height: 0; |
| overflow: hidden; |
| } |
| |
| to { |
| height: auto; |
| } |
| } |
| |
| .fade-in #bow .menu |
| { |
| -webkit-animation-name: bow-menu; |
| -webkit-animation-duration: 2.25s; |
| -webkit-animation-timing-function: linear; |
| } |
| |
| #bow ul { |
| margin: 0 0.2em 0.5em 0; |
| padding: 0; |
| } |
| |
| #bow li { |
| margin: 0; |
| } |
| |
| #bow #bottom |
| { |
| position: fixed; |
| left: 0; |
| bottom: 0; |
| width: 20.8em; |
| height: 2.4em; |
| background-color: #000; |
| z-index: 1701; |
| } |
| |
| #bow-bottom { |
| position: absolute; |
| bottom: 0.2em; |
| left: 0.2em; |
| width: 20.6em; |
| height: 2.4em; |
| border-bottom-left-radius: 2.4em; |
| border-bottom-right-radius: 2em; |
| background-color: #999; |
| } |
| |
| .empty #bow-bottom { |
| display: none; |
| } |
| |
| #bow-bottom .concave { |
| position: absolute; |
| margin-left: 0.2em; |
| margin-bottom: 0.2em; |
| bottom: 0.3em; |
| left: 7.8em; |
| height: 2.1em; |
| width: 7.6em; |
| border-bottom-left-radius: 1.2em; |
| border-bottom-right-radius: 1em; |
| background-color: #000; |
| } |
| |
| .empty #bow-bottom-left-concave { |
| display: none; |
| } |
| |
| .empty #footer-container { |
| position: fixed; |
| left: 0.2em; |
| bottom: 0; |
| right: 0.2em; |
| min-height: 2.4em; |
| padding-top: 0.2em; |
| padding-bottom: 0.2em; |
| background-color: #000; |
| } |
| |
| .empty #footer { |
| position: absolute; |
| bottom: 0; |
| left: 0; |
| right: 0; |
| height: 2em; |
| margin-bottom: 0.2em; |
| background-color: #999; |
| border-radius: 1.2em; |
| line-height: 0.8; |
| } |
| |
| .empty #footer .text { |
| position: absolute; |
| bottom: 0; |
| left: 0.75em; |
| margin: 0 !important; |
| background-color: #000; |
| color: #fc0; |
| padding-top: 0.1em; |
| padding-left: 0.1em; |
| padding-right: 0.1em; |
| text-transform: uppercase; |
| font-size: 2.4em; |
| } |
| |
| /* Controls */ |
| |
| .button:visited:hover, |
| .button:visited, |
| .button:hover, |
| .button |
| { |
| position: relative; |
| display: inline-block; |
| margin-right: 0.2em; |
| margin-bottom: 0.2em; |
| width: 5em; |
| height: 2em; |
| background-color: #7d7d7d; /* c9c */ |
| color: #000 !important; |
| font-family: "LCARS", |
| Haettenschweiler, "Downloadable Haettenschweiler", |
| "Zurich XCn BT", "Downloadable Zurich XCn BT", |
| impact, Verdana, Geneva, Arial, Helvetica, sans-serif; |
| text-decoration: none !important; |
| text-transform: uppercase; |
| overflow: hidden; |
| cursor: pointer; |
| } |
| |
| .button .text { |
| position: absolute; |
| bottom: 0; |
| right: 0.5em; |
| } |
| |
| .button.command { |
| border-radius: 1.2em; |
| } |
| |
| .button.command .text { |
| position: absolute; |
| bottom: 0; |
| right: 1em; |
| } |
| |
| .button:hover, |
| .button:focus, |
| .button.selected:hover, |
| .button.selected:focus, |
| .group .button:hover, |
| .group .button:focus, |
| .group .button:visited:hover, |
| .group .button:visited:focus |
| { |
| background-color: #f90 !important; |
| color: #000 !important; |
| } |
| |
| .button:active, |
| .button.selected:active, |
| .group .button:active, |
| .group .button:visited:active |
| { |
| background-color: #fff !important; |
| color: #000 !important; |
| } |
| |
| #bow .button { |
| display: block; |
| width: 8em; |
| height: 1em; |
| line-height: 1; |
| background-color: #9cf; |
| color: #000 !important; |
| } |
| |
| .multi-display |
| { |
| position: fixed; |
| top: 2.8em; |
| left: 15.8em; |
| right: 0em; |
| } |
| |
| .multi-display .button |
| { |
| width: 5em !important; |
| } |
| |
| .multi-display .upper |
| { |
| position: absolute; |
| top: 0; |
| left: 0; |
| right: 0; |
| height: 7.2em; |
| padding-bottom: 0.2em; |
| padding-right: 0.2em; |
| background-color: black; |
| } |
| |
| .multi-display .upper .button |
| { |
| height: 3.8em; |
| background-color: #c9c !important; |
| } |
| |
| .multi-display .upper .elbo |
| { |
| position: absolute; |
| left: 0; |
| top: 4em; |
| width: 6em; |
| height: 3.2em; |
| border-bottom-left-radius: 2em; |
| background-color: #9cf; |
| } |
| |
| .multi-display .upper .elbo .concave |
| { |
| position: absolute; |
| left: 5em; |
| top: 0; |
| width: 1em; |
| height: 2.2em; |
| border-bottom-left-radius: 1em; |
| background-color: black; |
| } |
| |
| .multi-display .upper .border |
| { |
| position: fixed; |
| top: 9em; |
| left: 21.8em; |
| right: 0.2em; |
| height: 1em; |
| background-color: #9cf; |
| } |
| |
| .multi-display .lower |
| { |
| position: absolute; |
| top: 7.3em; |
| left: 0; |
| padding-top: 0.1em; |
| background-color: black; |
| } |
| |
| .multi-display .lower .elbo |
| { |
| position: relative; |
| width: 6em; |
| height: 3em; |
| border-top-left-radius: 2em; |
| background-color: #fc6; |
| } |
| |
| .multi-display .lower .elbo.database, |
| .multi-display .lower .bg.database, |
| .multi-display .lower .border |
| { |
| background-color: #c66; |
| } |
| |
| .multi-display .lower .elbo .concave |
| { |
| position: absolute; |
| left: 5em; |
| top: 1em; |
| width: 1em; |
| height: 2em; |
| background-color: black; |
| border-top-left-radius: 1em; |
| } |
| |
| .multi-display .lower .bg |
| { |
| position: fixed; |
| top: 13.4em; |
| bottom: 2.8em; |
| width: 5em; |
| background-color: #fc6; |
| } |
| |
| .multi-display .lower .border-container |
| { |
| position: fixed; |
| top: 10.2em; |
| left: 21.8em; |
| right: 0em; |
| height: 1.2em; |
| background-color: black; |
| } |
| |
| .multi-display .lower .border |
| { |
| position: absolute; |
| top: 0; |
| left: 0; |
| right: 0.2em; |
| height: 1em; |
| background-color: #fc6; |
| } |
| |
| #bow .button.database { |
| background-color: #c66; |
| } |
| |
| #bow .button .text { |
| position: static; |
| margin: 0 0.25em; |
| } |
| |
| .button.selected { |
| background-color: #fc6 !important; |
| color: #000 !important; |
| } |
| |
| .group { |
| margin: 0 auto; |
| position: relative; |
| width: 9em; |
| } |
| |
| .group .separator { |
| float: left; |
| position: absolute; |
| margin-left: 14px; |
| width: 29px; |
| height: 100%; |
| background-color: #c66; |
| color: #000; |
| } |
| |
| .group .separator:after { |
| position: absolute; |
| width: 18px; |
| height: 9px; |
| bottom: 3px; |
| left: 3px; |
| background-color: #000; |
| content: "\a0"; |
| } |
| |
| .group ul { |
| margin-left: 35px; |
| } |
| |
| .group li { |
| margin-bottom: 4px; |
| } |
| |
| .group .button:visited:hover, |
| .group .button:visited, |
| .group .button |
| { |
| position: relative; |
| background-color: #99f !important; |
| } |
| |
| .group .button.right { |
| border-top-left-radius: 0; |
| border-bottom-left-radius: 0; |
| } |
| |
| .group .button.left { |
| border-top-right-radius: 0; |
| border-bottom-right-radius: 0; |
| } |
| |
| .group .button .key { |
| display: inline-block; |
| position: absolute; |
| left: 0.25em; |
| top: 0; |
| bottom: 0; |
| padding: 0 1px; |
| background-color: #000; |
| color: #f90; |
| font-size: 222%; |
| text-transform: uppercase; |
| } |
| Property changes: |
| Added: svn:mime-type |
| ## -0,0 +1 ## |
| +text/plain |
| \ No newline at end of property |