html {
font-family: Sans-Serif;
}
div.displayclean {
background-color:#F8F8F8;
border-width:1px 2px;
width:100%;
margin-bottom: 5em;
}
div.displayclean > ul {
position:relative;
width:100%;
background-color:#F8F8F8;
list-style-type:none;
margin:0;
padding:0;
border-bottom: 1px solid #cccccc;
}
div.displayclean > ul > li {
min-height:7em;
background-color:#F8F8F8;
display:block;
border-width:1px 0;
border-style:solid;
border-color:#CCCCCC;
width:100%;
position:relative;
}
div.displayclean li .line {
color:#FFFFFF;
background-color:#666666;
font-weight:bold;
font-size: 2.9em;
padding:3px 8px 2px 5px;
position:absolute;
top:7px;
left:2px;
}
div.displayclean li .line .trainno {
font-weight: normal;
}
div.displayclean li .lineinfo {
color:#000000;
font-size: 2em;
position:absolute;
bottom:2px;
left:2px;
}
div.displayclean li .lineinfo .replacement {
color: #006600;
}
div.displayclean li .lineinfo .replaced {
color: #660000;
}
div.displayclean li .tram {
background-color: #CC0000;
}
div.displayclean li .sbahn {
background-color:#006E10;
-webkit-border-radius: 30px;
-moz-border-radius: 30px;
border-radius: 30px;
}
div.displayclean li .ubahn {
background-color:#001090;
}
div.displayclean li .bus {
background-color:#991199;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}
div.displayclean li .route {
color:#444444;
font-size:2.1em;
position:absolute;
top:5px;
left:7.7em;
height: 1em;
width: 70%;
overflow: hidden;
}
div.displayclean li .info {
color:#ff0000;
font-size:2.1em;
position:absolute;
top:5px;
left:7.7em;
height: 1.1em;
width: 70%;
overflow: hidden;
z-index: 2;
}
div.displayclean li .moreinfo {
position:fixed;
top:0em;
left:0em;
right:0em;
bottom:0em;
z-index: 4;
display: none;
}
div.displayclean li .moreinfo-bgbox {
display: block;
position: absolute;
top:0em;
left:0em;
right:0em;
bottom:0em;
background-color: black;
z-index: 5;
opacity: 0.8;
}
div.displayclean li .moreinfo-inner {
position:absolute;
color:#000000;
font-size:2.1em;
top:1em;
left:1em;
right:1em;
min-height: 1em;
max-height: 90%;
background-color: white;
border: 0.2em solid black;
z-index: 6;
overflow: auto;
display: block;
opacity: 1;
}
div.displayclean li .collapsed-moreinfo {
display: none;
}
div.displayclean li .expanded-moreinfo {
display: block;
}
div.displayclean li .moreinfo .mheader {
text-align: center;
background-color: #cccccc;
font-size: 120%;
}
div.displayclean li .moreinfo .reason,
div.displayclean li .moreinfo .minfo {
color: #ff0000;
margin-bottom: 0.6em;
}
div.displayclean li .moreinfo .timeinfo {
margin-bottom: 0.6em;
}
div.displayclean li .moreinfo .mroute {
margin-bottom: 0.6em;
}
div.displayclean li .moreinfo .mroute .separator {
color: #999999;
}
div.displayclean li .moreinfo .mroute .important-stop {
color: #000000;
}
div.displayclean li .moreinfo .mroute .generic-stop {
color: #555555;
}
div.displayclean li .moreinfo .mroute .additional-stop {
color: #009900;
}
div.displayclean li .moreinfo .mroute .cancelled-stop {
color: #cc0000;
}
div.displayclean li .dest {
color:#000000;
/*font-weight:bold;*/
font-size:4em;
position:absolute;
top:0.65em;
left:4em;
width: 70%;
z-index: 1;
overflow: hidden;
}
div.displayclean li.cancelled {
background-color: #ffe7d0;
}
div.displayclean li .countdown {
color: #000000;
font-size: 3em;
position: absolute;
right: 5px;
bottom: 2px;
}
div.displayclean li .header {
color:#000000;
font-size:2em;
font-weight:bold;
padding-top:8px;
border-width-top:0;
display:block;
text-align:center;
}
div.displayclean li .head {
border-bottom-width:0;
}
div.displayclean li .countdown .delay {
font-size:1em;
color:#FF0000;
padding-right:7px;
}
div.displayclean li .countdown .undelay {
font-size:1em;
color:#006600;
padding-right:7px;
}
div.displayclean li .countdown .delaynorm {
font-size:0.9em;
color:#BB3333;
padding-right:7px;
}
div.displayclean li .countdown .undelaynorm {
font-size:0.9em;
color:#338833;
padding-right:7px;
}
div.displayclean li .countdown .platform {
font-weight: bold;
}
div.displayclean li .time {
color:#000000;
font-size:2.4em;
position:absolute;
right:5px;
top:5px;
}
div.displayclean span.delayed {
color: #ff0000;
}
div.displaymulti {
border: 0.2em solid #000066;
width: 55em;
}
div.displaymulti div.display {
background-color: #0000ff;
color: white;
font-family: Sans-Serif;
font-weight: bold;
position: relative;
margin-bottom: 0;
margin-top: 0;
padding-top: 0;
padding-bottom: 0;
width: 55em;
height: 1.4em;
}
div.displaymulti div.display div {
overflow: hidden;
position: absolute;
height: 100%;
}
div.displaymulti div.time {
left: 0;
width: 6%;
font-size: 95%;
}
div.displaymulti div.train {
left: 5%;
width: 9%;
background-color: white;
color: #0000ff;
font-size: 95%;
}
div.displaymulti div.via {
left: 15%;
width: 35%;
}
div.displaymulti div.via span {
margin-right: 0.4em;
font-size: 80%;
}
div.displaymulti div.destination {
left: 50%;
width: 25%;
font-size: 120%;
}
div.displaymulti div.platform {
left: 75%;
width: 5%;
}
div.displaymulti div.info {
left: 80%;
width: 20%;
background-color: white;
color: #0000ff;
font-size: 80%;
line-height: 150%;
}
div.displaymulti div.separator {
border-bottom: 0.1em solid #000066;
}
div.displaysingle div.display {
background-color: #0000ff;
color: white;
font-family: Sans-Serif;
font-weight: bold;
position: relative;
margin-left: 1em;
margin-top: 1em;
float: left;
width: 28em;
height: 4.5em;
border: 0.7em solid #000066;
}
div.displaysingle div.display div {
overflow: hidden;
position: absolute;
}
div.displaysingle div.no_data {
top: 0.5em;
left: 1em;
font-size: 1.7em;
}
div.displaysingle div.time {
top: 0em;
left: 0em;
font-size: 1.7em;
}
div.displaysingle div.train {
left: 0em;
top: 1.8em;
}
div.displaysingle div.via {
top: 1.5em;
left: 5.8em;
width: 17em;
height: 1em;
}
div.displaysingle div.via span {
margin-right: 0.4em;
}
div.displaysingle div.destination {
top: 1.6em;
left: 3.6em;
width: 12em;
font-size: 1.6em;
height: 1.2em;
}
div.displaysingle div.platform {
top: 0em;
right: 0em;
font-size: 3em;
}
div.displaysingle div.info {
top: 0em;
left: 5.8em;
width: 16.5em;
height: 1em;
background-color: white;
color: #0000ff;
}
div.about {
font-family: Sans-Serif;
color: #666666;
}
div.about a {
color: #000066;
text-decoration: none;
}
div.error {
font-size: 150%;
font-weight: bold;
color: #ee0000;
}
pre {
margin-bottom: 2em;
}
span.optional,
span.notes {
color: #666666;
}
div.break {
height: 1em;
}
div.field {
width: 100%;
clear: both;
}
div.field div.desc {
float: left;
width: 14em;
text-align: right;
padding-right: 0.5em;
}
input, select {
border: 1px solid black;
}
div.notes {
margin-top: 4em;
}
div.notes ul {
margin-top: 1em;
}