1/* 2 * CSS styleshet for the "Madsonic 4k" theme. 3 */ 4 5@import "font-Montserrat.css"; 6 7@import "default.css"; 8 9@import "scrollbar-px.css"; 10 11@import "playericons/playericons4klight.css"; 12 13 14.browse-index-shortcut { 15 font-size: 150% !important; 16} 17 18.maincontrol a { 19 font-weight: bold; 20} 21 22.maincontrol a img { 23 padding-bottom: 3px; 24 padding-right: 1px; 25 padding-left: 1px; 26} 27 28.leftpanel p.dense{ 29 clear: both; 30 padding: 4px; 31 border-bottom: 1px dotted #ccc; 32 line-height: 1.1em; 33 font-family: 'Montserrat', sans-serif !important; 34 font-weight: 400; 35 font-size: 8pt; 36} 37 38.mainframe #content_artist #anchor_list a{ 39 font-size: 16pt; 40} 41 42h2 { 43 margin: 10px 0 0 5px; 44 font-size: 10pt; 45} 46 47.album { 48 font-size: 9pt; 49 font-weight: 700; 50} 51 52::-webkit-scrollbar { 53 width: 14px; 54 height: 14px; 55 /* background: #ECECEC; */ 56} 57 58/* Custom */ 59span.off { 60 background: #FFF !important; 61} 62 63span.on { 64 background: #33B5E5 !important; 65 color: #fff !important; 66} 67 68span.off:hover { 69 background: #33B5E5 !important; 70 border: solid 1px #333 !important; 71 } 72 73span.on:hover { 74 background: #44B5E5 !important; 75 border: solid 1px #333 !important; 76 } 77 78 79span.off2 { 80 background: #333; 81 cursor: pointer; 82 float:left; 83 padding: 4px 9px; 84 margin: 2px; 85 color: #FFF; 86 -webkit-border-radius: 7px; 87 -moz-border-radius: 7px; 88 border-radius: 7px; 89 border: solid 1px #333; 90 -webkit-transition-duration: 0.1s; 91 -moz-transition-duration: 0.1s; 92 transition-duration: 0.1s; 93 -webkit-user-select:none; 94 -moz-user-select:none; 95 -ms-user-select:none; 96 user-select:none; 97 white-space: nowrap; 98 font-size: 8pt; 99} 100 101span.on2 { 102 cursor: pointer; 103 float:left; 104 padding: 4px 9px; 105 margin: 2px; 106 background: #33B5E5; 107 color: #FFF; 108 -webkit-border-radius: 7px; 109 -moz-border-radius: 7px; 110 border-radius: 7px; 111 border: solid 1px #ccc; 112 -webkit-transition-duration: 0.1s; 113 -moz-transition-duration: 0.1s; 114 transition-duration: 0.1s; 115 -webkit-user-select:none; 116 -moz-user-select:none; 117 -ms-user-select:none; 118 user-select:none; 119 white-space: nowrap; 120 121 font-size: 8pt; 122} 123 124span.on2:hover { 125 background: #33B5E5 !important; 126 border: solid 1px #444 !important; 127} 128 129span.off2:hover { 130 background: #000 !important; 131 border: solid 1px #444 !important; 132} 133 134table.music tr { 135 line-height: 30px !important; 136} 137 138table.music tr:nth-of-type(even) { background: rgba(0,0,0,.02); } 139table.music tr:nth-of-type(odd) { background: rgba(0,0,0,.04); } 140 141table.content tr:nth-of-type(even) { background: rgba(0,0,0,.02); } 142table.content tr:nth-of-type(odd) { background: rgba(0,0,0,.04); } 143 144table.content tr { border-bottom: 1px solid rgba(128,128,128,0.05) !important; } 145 146#playlistBody tr:nth-of-type(even) { background: rgba(0,0,0,.02); border-bottom: 1px solid rgba(128,128,128,0.05) !important; } 147#playlistBody tr:nth-of-type(odd) { background: rgba(0,0,0,.04); border-bottom: 1px solid rgba(128,128,128,0.05) !important; } 148 149 150#startButton, #stopButton { 151 cursor:pointer; font-size:30px; color:#0090BB !important; 152} 153 154.playlistframe #progress, #progress-slider, #volume, #volume-slider { 155 background: #ccc !important; 156} 157 158.ui-slider-range-min { 159 background: #0090BB !important; 160} 161 162.ui-slider .ui-slider-handle { 163 background: #0090BB !important; 164} 165 166#cc-on, #cast-active { 167 color: #0090BB !important; 168} 169 170#play, #pause, #buffer { 171 font-size: 24px !important; 172 color: #0090BB !important; 173} 174 175.flowplayer, .flowplayer.is-playing, .flowplayer.is-fullscreen .fp-player { 176 background-color: #ECECEC !important; 177} 178 179 180.starred { 181 color: #009BCA !important; 182} 183 184.loved { 185 color: #009BCA !important; 186} 187 188.control { 189 color: #888 !important; 190} 191 192.hot { 193 color: orange !important; 194} 195 196.custom-icon-rank { 197 font-size:10px; 198 font-family: 'Montserrat', Arial, serif !important; 199 /* padding:7px 4px 2px 4px; */ 200} 201 202.custom-icon { 203 font-size:7px; 204 background:#fff; 205 padding: 7px 5px 4px 5px !important; 206 margin:3px 1px 3px 1px; 207 /* background:rgba(0,0,0,0.2); */ 208 -webkit-border-radius:25%; 209 -moz-border-radius:25%; 210 -o-border-radius:25%; 211 border-radius:25%; 212 border:1px solid #ccc !important; 213 color:#888; 214 box-shadow: 0 1px 10px rgba(0, 0, 0, 0.08); 215 text-align:center; 216 display:table-cell; 217 vertical-align:middle; 218 width:15px; 219 height:15px; 220 -moz-transition:.5s; 221 -webkit-transition:.5s; 222 -o-transition:.5s; 223 transition:.5s; 224} 225 226.custom-icon:hover { 227 background:rgba(1,1,1,0.1); 228 border:1px solid #8cce38; 229 box-shadow: 0 1px 5px rgba(25, 31, 31, 0.8) !important; 230 color: #009BCA; 231} 232 233 234.custom-icon:active { 235 background:rgba(0,0,0,0.4); 236 border:1px solid #fff !important; 237 box-shadow: 0 1px 5px rgba(0, 0, 0, 0.46) !important; 238 color: orange !important; 239} 240 241.custom-icon-header { 242 font-size:20px !important; 243 background:#fff; 244 padding:7px 4px 3px 4px; 245 margin:0 0 8px 0; 246 -webkit-border-radius:25%; 247 -moz-border-radius:25%; 248 -o-border-radius:25%; 249 border-radius:25%; 250 border:1px solid #ccc !important; 251 text-align:center; 252 display:table-cell; 253 vertical-align:middle; 254 width:24px; 255 height:24px; 256 -moz-transition:.5s; 257 -webkit-transition:.5s; 258 -o-transition:.5s; 259 transition:.5s; 260} 261 262.custom-icon-main { 263 font-size:14px !important; 264 background:#fff; 265 padding: 7px 6px 5px 6px; 266 margin:0 0 8px 0; 267 -webkit-border-radius:25%; 268 -moz-border-radius:25%; 269 -o-border-radius:25%; 270 border-radius:25%; 271 border:1px solid #ccc !important; 272 text-align:center; 273 display:table-cell; 274 vertical-align:middle; 275 width:16px; 276 height:16px; 277 -moz-transition:.5s; 278 -webkit-transition:.5s; 279 -o-transition:.5s; 280 transition:.5s; 281} 282 283.custom-icon-main:hover { 284 border:1px solid #eee !important; 285 color: orange !important; 286} 287 288.custom-icon-main:active { 289 border:1px solid #fff !important; 290 color: orange !important; 291} 292.custom-icon-nohover { 293 font-size:7px; 294 background:#fff; 295 padding:6px 4px 2px 4px; 296 margin:0px; 297 /* background:rgba(0,0,0,0.2); */ 298 -webkit-border-radius:25%; 299 -moz-border-radius:25%; 300 -o-border-radius:25%; 301 border-radius:25%; 302 border:1px solid #ddd !important; 303 color:#888; 304 text-align:center; 305 display:table-cell; 306 vertical-align:middle; 307 width:15px; 308 height:15px; 309 -moz-transition:.5s; 310 -webkit-transition:.5s; 311 -o-transition:.5s; 312 transition:.5s; 313} 314 315.custom-icon-nohover:hover { 316 color: orange; 317} 318 319.fix-editor { 320 display:none; 321} 322.icon-wrapper { 323 display:inline-block; 324} 325 326.detail { 327 font-size: 9pt; 328} 329 330.detailmini { 331 font-size: 8pt; 332} 333 334.detailcolordark { 335 font-size: 8pt; 336} 337 338.dd-theme-classic, .dd-all { 339 background-color: #fff !important; 340} 341 342input { 343 background: none repeat scroll 0 0 #FFFFFF; 344 color: #333; 345 border-radius: 5px; 346 font-family: 'Montserrat', Arial, serif; 347 font-size: 8.5pt; 348 padding: 7px 10px 7px 10px; 349 border: 1px solid #bbb; 350} 351 352select { 353 background: none repeat scroll 0 0 #FFFFFF; 354 border-radius: 5px; 355 color: #333; 356 font-family: 'Montserrat', Arial, serif; 357 font-size: 8.5pt; 358 padding: 7px 10px 7px 10px; 359 border: 1px solid #bbb; 360} 361 362button { 363 /* background: none repeat scroll 0 0 #FFFFFF; */ 364 /* background-color: #333; */ 365 color: #eee; 366 border-radius: 5px; 367 font-family: 'Montserrat', Arial, serif; 368 font-size: 8.5pt; 369 font-weight: 400; 370 padding: 7px 10px 7px 10px; 371 margin-left: 4px; 372 border: 1px solid #444; 373} 374 375.jumbotron { 376 color: #333 !important; 377 background-color: #888 !important; 378} 379 380.playingframe .songTitle{ 381 line-height: 20px; 382 font-weight: 700; 383 font-size: 110%; 384} 385 386.playingframe .songYear { 387 line-height: 25px; 388 font-weight: 700; 389 font-size: 130%; 390} 391 392.playingframe .songDuration { 393 line-height: 30px; 394 font-weight: 700; 395 font-size: 100%; 396} 397.playingframe .detailmini { 398 display: inline-table; 399} 400 401.leftpanel p.dense{ 402 border-bottom: 1px dotted #ddd; 403 clear: both; 404 padding: 4px; 405 line-height: 1.4em; 406 font-size: 9pt; 407} 408.dropshadowXXX { 409 border: 0px solid #111; 410 -webkit-border-radius: 2px; 411 -moz-border-radius: 2px; 412 border-radius: 2px; 413 opacity:0.95; 414 filter:alpha(opacity=95); 415 -moz-box-shadow: 2px 2px 15px 0 #111; 416 -webkit-box-shadow: 2px 2px 15px 0 #111; 417 box-shadow: 2px 2px 15px 0 #111; 418} 419 420.accent { 421 color: #7B9DB6 !important; 422 font-weight: 700 !important; 423 424} 425