1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889 |
- * {
- box-sizing: border-box;
- line-height: 30px;
- font-family: Sans-Serif
- }
-
- body {
- margin: 12px;
- }
-
- body > div {
- margin-bottom: 12px;
- }
-
- button {
- display: inline-block;
- padding: 0px;
- border: 1px solid #666;
- width: 50px;
- height: 32px;
- background: #ddd;
- margin-left: 2px;
- margin-right: 2px;
- }
-
- button:active,
- button.active {
- background: #aaa;
- }
-
- /*
- * Playback
- */
-
- #is-playing,
- #progress-text {
- display: inline-block;
- }
- #progress-text {
- float: right;
- }
- #group-buttons {
- text-align: center;
- }
-
- progress {
- width: 100%;
- height: 24px;
- }
-
- /*
- * Volume
- */
-
- input[type="range"] {
- border: 1px solid rgba(0, 0, 0, 0);
- box-sizing: border-box;
- margin: 0px;
- width: 100%;
- }
-
- #group-volume {
- text-align: center;
- border-top: 1px solid #ccc;
- }
-
- #group-volume {
- padding-top: 12px;
- margin-top: 24px;
- }
-
- /*
- * Sub Delay
- */
-
- #group-sub-delay {
- text-align: center;
- }
-
- #group-sub-delay {
- border-top: 1px solid #ccc;
- }
-
- #group-sub-delay {
- padding-top: 12px;
- }
- #group-sub-delay button {
- margin-top: 6px;
- }
|