78,6 → 78,7 |
} |
|
body.empty { |
margin-top: 3em; |
margin-left: 0.2em; |
margin-bottom: 3em; |
} |
210,6 → 211,7 |
.empty #bow-top { |
border-top-left-radius: 1.2em; |
border-bottom-left-radius: 1.2em; |
min-width: 10em; |
} |
|
/* 0.0 to 1.0 s */ |
217,6 → 219,7 |
from { |
left: 90%; |
border-top-left-radius: 0; |
border-bottom-left-radius: 0; |
} |
} |
|
241,6 → 244,10 |
text-overflow: ellipsis; |
} |
|
.empty #bow-top .text { |
left: 0.93em; |
} |
|
/* 0.0 to 1.0 s */ |
@-webkit-keyframes bow-top-text { |
from { |
267,6 → 274,53 |
white-space: nowrap; |
} |
|
.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; |
overflow: hidden; |
text-overflow: ellipsis; |
} |
|
.empty #footer .text span { |
padding-right: 0.1em; |
padding-left: 0.1em; |
background-color: #000; |
text-transform: uppercase; |
white-space: nowrap; |
} |
|
.empty .separator-left { |
position: absolute; |
left: 2em; |
370,7 → 424,7 |
} |
|
#bow ul { |
margin: 0 0.2em 0.5em 0; |
margin: 0 0.2em 0.2em 0; |
padding: 0; |
} |
|
417,45 → 471,17 |
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 { |
#bow-bottom .spacer { |
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; |
left: 10.2em; |
bottom: 0em; |
width: 0.2em; |
height: 0.5em; |
background-color: black; |
} |
|
.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; |
.empty #bow-bottom-left-concave { |
display: none; |
} |
|
/* Controls */ |
675,14 → 701,15 |
.group { |
margin: 0 auto; |
position: relative; |
width: 9em; |
width: 7.7em; |
} |
|
.group .separator { |
float: left; |
position: absolute; |
margin-left: 14px; |
width: 29px; |
top: 0; |
left: 0; |
width: 1.5em; |
height: 100%; |
background-color: #c66; |
color: #000; |
690,49 → 717,60 |
|
.group .separator:after { |
position: absolute; |
width: 18px; |
height: 9px; |
bottom: 3px; |
left: 3px; |
width: 0.8em; |
height: 0.5em; |
bottom: 0.25em; |
left: 0.25em; |
background-color: #000; |
content: "\a0"; |
} |
|
.group ul { |
margin-left: 35px; |
margin-left: 1.7em; |
} |
|
.group li { |
margin-bottom: 4px; |
margin-bottom: 0; |
} |
|
.group .button:visited:hover, |
.group .button:visited, |
.group .button |
{ |
display: block; |
position: relative; |
width: 6em; |
background-color: #99f !important; |
} |
|
.group .button.right { |
border-top-left-radius: 0; |
border-bottom-left-radius: 0; |
.group li:last-child .button |
{ |
margin-bottom: 0; |
} |
|
.group .button.left { |
border-top-right-radius: 0; |
border-bottom-right-radius: 0; |
.button.right { |
border-top-right-radius: 1em; |
border-bottom-right-radius: 1em; |
} |
|
.button.right .text { |
right: 1em; |
} |
|
.button.left { |
border-top-left-radius: 1em; |
border-bottom-left-radius: 1em; |
} |
|
.group .button .key { |
display: inline-block; |
position: absolute; |
left: 0.25em; |
left: 0.2em; |
top: 0; |
bottom: 0; |
padding: 0 1px; |
padding: 0 0.1em; |
background-color: #000; |
color: #f90; |
font-size: 222%; |
font-size: 2.4em; |
text-transform: uppercase; |
} |
line-height: 0.9; |
} |