1/*
2 * Base CSS stylesheet used by all themes.
3 *
4 * Note that attributes that are typically changed by theme authors are
5 * placed at the top.
6  *
7 * Author: Sindre Mehus
8 */
9
10/* The primary background color (light gray). */
11.bgcolor1, table.music tr:nth-of-type(even) {
12    background-color: #FDFDFD;
13}
14
15/* The secondary background color (darker gray). */
16.bgcolor2, .ruleTableHeader, .log, table.music tr:nth-of-type(odd) {
17    background-color: #666;
18}
19
20.headerSelected {
21    border-bottom: 3px solid #E65100;
22}
23
24/* Background color for form controls (use default). */
25input, select {
26}
27
28/* The primary foreground color (black). */
29body {
30    color: black;
31}
32
33/* The secondary foreground color used for h1, h2, details etc (gray). */
34h1, h2, .detail, .albumComment, .icon {
35    color: #565656;
36}
37
38/* Foreground color used for bold and tr. */
39b, tr {
40    color: #333333;
41}
42
43b {
44    font-weight: 500;
45}
46
47/* Link color */
48a:link, a:active, a:visited, a:link *, a:active *, a:visited * {
49    color: inherit
50}
51
52/* Link hover color */
53a:hover, a:hover * {
54    text-decoration: underline;
55}
56
57/* Color for warning messages. */
58.warning {
59    color: #E65100;
60}
61
62/* Simple dark border. */
63.border1, .ruleTableHeader, .ruleTableCell, .log {
64    border: 1px solid black;
65}
66
67/* Scrollbar colors (supported on IE and Opera) */
68body {
69    scrollbar-face-color: #DEE3E7;
70    scrollbar-highlight-color: #FFFFFF;
71    scrollbar-shadow-color: #DEE3E7;
72    scrollbar-3dlight-color: #D1D7DC;
73    scrollbar-arrow-color: #006699;
74    scrollbar-track-color: #EFEFEF;
75    scrollbar-darkshadow-color: #98AAB1;
76}
77
78body, form, label, table, a {
79    font-family: 'Roboto', arial, sans-serif;
80}
81
82h1, h1 a {
83    font-family: 'Ubuntu', arial, sans-serif;
84    font-weight: normal;
85}
86
87h2, h2 a, .topHeader a {
88    font-family: 'Roboto', arial, sans-serif;
89    font-weight: normal;
90}
91
92/* Put stuff here if you need to customize any of the frames. */
93.mainframe {
94    padding-left:1em
95}
96.topframe {
97}
98.leftframe {
99}
100.rightframe {
101}
102.playlistframe {
103}
104
105.topframe::-webkit-scrollbar:vertical {
106    display:none
107}
108.playlistframe::-webkit-scrollbar:vertical {
109    display:none
110}
111.leftframe::-webkit-scrollbar:horizontal {
112    display:none
113}
114
115/***************************************************************************************
116 * The rest of the CSS is typically not changed in other themes (but not necessarily so).
117 ***************************************************************************************/
118
119body {
120    padding:0;
121    border:0;
122    margin:0.75em;
123    font-size: 10.5pt;
124    line-height: 1.5em;
125}
126
127p {
128    padding:0;
129    border:0;
130    margin:0 0 1em 0;
131}
132
133.dense {
134    white-space: nowrap;
135    margin: 0;
136    line-height: 1.5em
137}
138
139h1 {
140    white-space: nowrap;
141    font-size: 150%;
142    padding: 0 0 0.1em;
143    border: 0;
144    margin: 0;
145}
146
147h2 {
148    white-space: nowrap;
149    font-size: 108%;
150    margin: 0.8em 0 0.2em 0;
151}
152
153form {
154    font-size: 100%;
155    line-height: 140%;
156    padding: 0;
157    border: 0;
158    margin: 0;
159}
160
161input, textarea, select {
162    font-size: 90%;
163    padding: 3px;
164    border-radius: 3px;
165    border: 1px solid lightgray;
166}
167
168input[type=submit], input[type=button] {
169    background: white;
170    padding-left: 1em;
171    padding-right: 1em;
172}
173
174input[type=submit]:active, input[type=button]:active {
175    background: #e9e9e9;
176}
177
178input:hover, textarea:hover, select:hover {
179    border: 1px solid darkgray;
180}
181
182label {
183    font-size: 100%;
184    line-height: 140%;
185}
186
187table {
188    font-size: 100%;
189    line-height: 140%;
190    padding: 0;
191    border: 0;
192    margin: 0 0 0.4em 0;
193}
194
195
196/* Table with some white space above it.*/
197table.indent {
198    margin: 1em 0 0.4em 0;
199}
200
201table.music {
202    line-height: 230%;
203    border-collapse:collapse;
204    white-space:nowrap;
205    width: 100%;
206}
207
208td.fit {
209    width:1px;
210    padding-left:4px;
211    padding-right:4px;
212}
213
214td.truncate {
215    max-width:50px;
216    overflow:hidden;
217    text-overflow:ellipsis;
218    white-space: nowrap;
219    padding-left:10px;
220    padding-right:10px;
221}
222
223td.rightalign {
224    text-align:right;
225    padding-right: 20px;
226}
227
228a {
229    font-size: 100%;
230    text-decoration: none
231}
232
233img {
234    border-style: none;
235    border: 0;
236    margin: 0;
237    padding: 0;
238    vertical-align: middle;
239}
240
241img.circle {
242    border-radius:50%;
243    object-fit:cover;
244    object-position:center;
245}
246
247.dropshadow {
248    box-shadow: 2px 2px 10px #333333;
249}
250
251.shadow {
252    box-shadow: 0 0 20px 3px #555555;
253}
254
255.space-above {
256    margin-top: 1em;
257}
258
259.coverart {
260    background-color: white;
261    color: #323232;
262    border-radius:2px;
263}
264
265.coverart .caption1 {
266    overflow:hidden;
267    text-overflow:ellipsis;
268    white-space:nowrap;
269    padding:6px 8px 4px 8px;
270    line-height: 100%;
271    font-weight: 300;
272}
273
274.coverart .caption1 a:link, .coverart .caption1 a:visited  {
275    color: #323232;
276}
277
278.coverart .caption2 {
279    overflow:hidden;
280    text-overflow:ellipsis;
281    white-space:nowrap;
282    padding:0px 8px 5px 8px;
283    font-size: 90%;
284    color: #aaaaaa;
285    line-height: 100%;
286    font-weight: 300;
287}
288
289.coverart .caption3 {
290    overflow:hidden;
291    text-overflow:ellipsis;
292    white-space:nowrap;
293    padding:0px 8px 5px 8px;
294    font-size: 90%;
295    color: #aaaaaa;
296    line-height: 100%;
297    font-weight: 300;
298}
299
300::-webkit-scrollbar {
301    width: 6px;
302    height: 6px;
303}
304
305::-webkit-scrollbar-thumb {
306    background: rgba(128, 128, 128, 0.5);
307    border-radius: 6px;
308}
309
310.header, .header a, .headerSelected, .headerSelected a {
311    padding-left: 0.25em;
312    padding-right: 0.25em;
313    font-weight: 300;
314    white-space: nowrap;
315}
316
317.similar-artist-divider {
318    padding-left: 0.5em;
319    padding-right: 0.5em;
320}
321
322.detail {
323    white-space: nowrap;
324    font-size: 90%;
325    line-height: 1.25em;
326}
327
328.songTitle {
329    font-style: italic;
330}
331
332.topHeader, .topHeader a {
333    font-size: 102%;
334    font-weight: 300;
335    padding: 0.15em 0 0 0;
336    margin: 0;
337    border: 0;
338    white-space: nowrap;
339}
340
341.back, .forward {
342    background-position:center left;
343    background-repeat:no-repeat;
344    padding-left: 12px;
345    line-height: 16px;
346}
347
348.back {
349    background-image:url("../icons/default_light/back.png");
350}
351
352.forward {
353    background-image:url("../icons/default_light/forward.png");
354}
355
356.albumComment {
357    width: 50em;
358    font-size: 90%;
359    line-height: 1.4em;
360    padding-top: 0.25em;
361}
362
363.albumThumb {
364    display:inline-block;
365    vertical-align: top;
366    padding-bottom: 20px;
367    padding-right: 20px;
368}
369
370.albumOverflowButton {
371    display:inline-block;
372    cursor:pointer;
373    vertical-align:bottom;
374    margin-left:15px;
375    margin-bottom:20px
376}
377
378.log {
379    white-space: nowrap;
380    font-size: 90%;
381    line-height: 1em;
382}
383
384.checkbox {
385    border: 0
386}
387
388/* Table with simple lines between the cells. */
389.ruleTable {
390    border-collapse: collapse;
391}
392
393.ruleTableHeader, .ruleTableCell {
394    margin: 5px;
395    padding: 5px;
396}
397
398.ruleTableHeader {
399    font-weight: bold;
400}
401
402.context-menu-item {
403    color: black;
404}
405
406.clickable {
407    cursor: pointer;
408}
409
410.ellipsis {
411    overflow: hidden;
412    text-overflow: ellipsis;
413    white-space: nowrap;
414}
415
416.starred {
417    color: #FF9800;
418}
419
420.nospace {
421    margin: 0;
422    padding: 0;
423    border: 0;
424}