From 9e096c5d0a526b25e5c41d2f29c2f479a16315d5 Mon Sep 17 00:00:00 2001
From: ArturSierzant <artur.sierzant@ompd.pl>
Date: Wed, 22 Jul 2020 17:43:11 +0200
Subject: [PATCH] v1.06 as published on web page

Added darker skin
---
 about.php                                     |    3 +-
 include/config.inc.php                        |    4 +-
 skin/ompd_darker/about.txt                    |    1 +
 skin/ompd_darker/img/large_file_not_found.png |  Bin 0 -> 13058 bytes
 skin/ompd_darker/img/medium_image.png         |  Bin 0 -> 1388 bytes
 skin/ompd_darker/img/medium_message_error.png |  Bin 0 -> 1264 bytes
 skin/ompd_darker/img/medium_message_ok.png    |  Bin 0 -> 700 bytes
 .../img/medium_message_warning.png            |  Bin 0 -> 838 bytes
 skin/ompd_darker/img/medium_online.png        |  Bin 0 -> 1482 bytes
 skin/ompd_darker/img/playing.gif              |  Bin 0 -> 1589 bytes
 .../img/small_animated_progress.gif           |  Bin 0 -> 1160 bytes
 skin/ompd_darker/img/small_check.png          |  Bin 0 -> 342 bytes
 skin/ompd_darker/img/small_error.png          |  Bin 0 -> 626 bytes
 skin/ompd_darker/img/small_login.png          |  Bin 0 -> 804 bytes
 skin/ompd_darker/img/small_uncheck.png        |  Bin 0 -> 291 bytes
 skin/ompd_darker/img/tiny_check.png           |  Bin 0 -> 299 bytes
 skin/ompd_darker/img/tiny_uncheck.png         |  Bin 0 -> 299 bytes
 skin/ompd_darker/styles.css                   | 2338 +++++++++++++++++
 skin/ompd_darker/styles.less                  |  114 +
 skin/ompd_darker/template.footer.php          |  167 ++
 skin/ompd_darker/template.header.php          |  930 +++++++
 21 files changed, 3554 insertions(+), 3 deletions(-)
 create mode 100644 skin/ompd_darker/about.txt
 create mode 100644 skin/ompd_darker/img/large_file_not_found.png
 create mode 100644 skin/ompd_darker/img/medium_image.png
 create mode 100644 skin/ompd_darker/img/medium_message_error.png
 create mode 100644 skin/ompd_darker/img/medium_message_ok.png
 create mode 100644 skin/ompd_darker/img/medium_message_warning.png
 create mode 100644 skin/ompd_darker/img/medium_online.png
 create mode 100644 skin/ompd_darker/img/playing.gif
 create mode 100644 skin/ompd_darker/img/small_animated_progress.gif
 create mode 100644 skin/ompd_darker/img/small_check.png
 create mode 100644 skin/ompd_darker/img/small_error.png
 create mode 100644 skin/ompd_darker/img/small_login.png
 create mode 100644 skin/ompd_darker/img/small_uncheck.png
 create mode 100644 skin/ompd_darker/img/tiny_check.png
 create mode 100644 skin/ompd_darker/img/tiny_uncheck.png
 create mode 100644 skin/ompd_darker/styles.css
 create mode 100644 skin/ompd_darker/styles.less
 create mode 100644 skin/ompd_darker/template.footer.php
 create mode 100644 skin/ompd_darker/template.header.php

diff --git a/about.php b/about.php
index b25155b..e668d04 100644
--- a/about.php
+++ b/about.php
@@ -160,7 +160,7 @@ function about() {
 <tr class="line"><td colspan="5"></td></tr>
 <tr class="<?php echo ($i++ & 1) ? 'even' : 'odd'; ?>">
 	<td>&nbsp;</td>
-	<td style="vertical-align: top;">v1.06 <br>2020.07.??</td>
+	<td style="vertical-align: top;">v1.06 <br>2020.07.22</td>
 	<td></td>
 	<td>
 	<ul style="padding-left: 1em;">
@@ -171,6 +171,7 @@ function about() {
 	<li> added default login option</li>
 	<li> added possibility to login using URL (login.php)</li>
 	<li> added support for PWA (Progressive Web App)</li>
+	<li> added new skin (darker)</li>
 	<li> improved TIDAL support (python API replaced with PHP API - works much faster)</li>
 	<li> improved Favorites - mixed lists (streams and local files) are allowed</li>
 	<li> improved Favorites - tracks from Tidal and YouTube now can be added to Favorites</li>
diff --git a/include/config.inc.php b/include/config.inc.php
index 6f26c13..bc29247 100644
--- a/include/config.inc.php
+++ b/include/config.inc.php
@@ -46,10 +46,10 @@
 //  | Use a UNIX style directory scheme with a trailing slash.               |
 //  |                                                                        |
 //  | Windows:        'D:/Media/';                                           |
-//  | Linux/Unix/OSX: '/var/mpd/music/';                                     |
+//  | Linux/Unix/OSX: '/var/lib/mpd/music/';                                 |
 //  +------------------------------------------------------------------------+
 
-$cfg['media_dir']                   = '/share/HDA_DATA/ompd/';
+$cfg['media_dir']                   = '/var/lib/mpd/music/';
 
 
 
diff --git a/skin/ompd_darker/about.txt b/skin/ompd_darker/about.txt
new file mode 100644
index 0000000..c89e76d
--- /dev/null
+++ b/skin/ompd_darker/about.txt
@@ -0,0 +1 @@
+O!MPD darker skin by Artur Sierżant.
\ No newline at end of file
diff --git a/skin/ompd_darker/img/large_file_not_found.png b/skin/ompd_darker/img/large_file_not_found.png
new file mode 100644
index 0000000000000000000000000000000000000000..be6c4c4c708b874f7d55966f09a7afcf171d8fee
GIT binary patch
literal 13058
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
bjR19+-t#Atvl;Na51=To`l$G!(YyZx77u94

literal 0
HcmV?d00001

diff --git a/skin/ompd_darker/img/medium_image.png b/skin/ompd_darker/img/medium_image.png
new file mode 100644
index 0000000000000000000000000000000000000000..91bf5f2c9b07756d09e5f1cd8d420ee92c65fdaa
GIT binary patch
literal 1388
zcmeAS@N?(olHy`uVBq!ia0vp^3LwnE3?yBabR7dy%*9TgAsieWw;%dHU|?X14)6(a
z{r~@eUtd*PTAG4ycd`XTh(1H622d$OOG`^lO=&?z0Z_`@+q+ngA>4$+-b@#$00@90
zmX?+f#Y##_KoOu~prDhJlZ<O~yeTVCR$EU`OG^(Z)!W++l#+Ju0Lr?XC>a|Y^YQUP
z49T`-2ddQ6)RdBvnmK!FQ%ikaT^&%dfNcX%SyXg1kX`D?4%9exDo7S6;t*D>=G_Ez
zEl|+fITENn&WO3SvjynROj~}S)j*RAN~#JIeX`6Lfn1>TX3m@m)Lzrl3seI%q0W&J
zXeQ8vTszKkTLu%`pa^qepaZzLK%v(^X*$rf!oqx@0t5G)#Y+|~S~P$1>?P*ObM%rH
z0<8lo0|wgHuU|iW`}66`x7VM3e)#a=<(v19-+q7n`qlI2&!0TJ2Luo9+`NA4?&&-4
zuU)%#<?_Y-*FPM*{AB0l_ovQXK6B>G_H$2<9zD9}@TvWWPwd^hck!V|TlXDZwD0z|
zZQG`7zdd{N*@c^q^=-PjX3d(pYxhrGeF*4`-X;5HELh#J=mapJfbIc$s&K&tpuhU3
z&RII4EOX|W1%1`IlMm)k+S$|7lhA(@=!@LWmB4t6>fRsGbu6s&aAMmUVDS339qOpb
zI+xE~QPb+yc+kIg{e~Q6@9K3CWz%-2aBNNy@+e*ETDm@@XtGVo)@f-*_W6rEbEg1<
zZgH&0f>0)40EUEwwE6ONd9eiqMAdi*Ho9}V`zIE7Dgy&E(_Ro5M8LQM#_1IazG7g2
zo-7IS3uX|60AOrD0Z<JPxWGUt6aei>ODhM14j=&f5(-v<z-|x#1|KrG3j*&T02nbe
z22&SH7y>=TS>O=~^c=Sk2s2)~TlWVjC|2ScQQ};bnpl#VpQjL#nVZUBV5)Cmq;Ftc
z|1|I$P=!25MR0yvNqJ&XDuZuga#4P6YD#9Jf?H-$YI%N9cCmuR){ILP3=E8Io-U3d
z7QM*{5_=rfT)5Zo@wgCYT=Qws!re@)1>WAbkI3K3Ki?A^XIXje&e7<goI)*ws4FI^
z$2Nr)?s!sp*z9cl_R8Pe5@bHr%xe!fyM86)dvx;j^sl$JZ`G6KFsf<YaB}mGcef3U
zwQZMg*s<UoOSjGJ#|K5Nmp@Al-}b%4BqH%tafM98#(yuibY0rknti>@I$7(&e2dz%
z6F)3jb?aQ~YV&V9lTUc7Jh`r09ym87@U~Inw@G&PbtaX1^ZztmlW_Za@64U1Nw0qW
z%1AU}6>GJO^_#;}6#LTB)ztK<E9ayYpQ>Cf_fGTS;mL}9nYuPMwpTTF)`?3&YQfz?
zybd~3uk{=YQ_#pab(wVi=H`U*HA*v9UYQlo&eChz>%ny;xcvQ%<Z}nkojZ3xctgoK
zCWVMy2`lZ*ed3hg9{HHOa#z!%M@>z)g1Ni8y1Y)EI@PUq+UY6l-9<{udrCz`M2;Li
z+WY)!gAPNZr2*?30R;^Wjw4CS%F2M{QdwEqvo@O<jl9<zy|Ww`7^Y9Gmntv2bP5=G
N44$rjF6*2UngD4_m1qC}

literal 0
HcmV?d00001

diff --git a/skin/ompd_darker/img/medium_message_error.png b/skin/ompd_darker/img/medium_message_error.png
new file mode 100644
index 0000000000000000000000000000000000000000..67d04e1fab424e8084a01a7d768bdbd70f14014b
GIT binary patch
literal 1264
zcmeAS@N?(olHy`uVBq!ia0vp^QXtI11|(N{`J4k%k|nMYCBgY=CFO}lsSJ)O`AMk?
zp1FzXsX?iUDV2pMQ*9U+n3Xa^B1$5BeXNr6bM+EIYV;~{3xK*A7;Nk-3KEmEQ%e+*
zQqwc@Y?a>c-mj#PnPRIHZt82`Ti~3Uk?B!Ylp0*+7m{3+ootz+WN)WnQ(*-(AUCxn
zQK2F?C$HG5!d3}vt`(3C64qBz04piUwpD^SD#ABF!8yMuRl!uxKsVXI%s|1+P|wiV
z#N6CmN5ROz&_Lh7NZ-&%*U;R`*vQJjKmiJrfVLH-q*(>IxIyg#@@$ndN=gc>^!3Zj
z%k|2Q_413-^$jg8EkR}&8R-I5=oVMzl_XZ^<`pZ$OmImpPA<wUD9OyvQvjKmn3P{y
zVygsnDZ~r81#n~YilM;-3^4tQ!~%UoJp+)JU<!SG@hi>Eg{v+u2}(t{7puX=A(aKG
z`a!A1`K3k4z=%sz23b{L<y@4SSdw29lAoUg3&ntp{F40QjQj!x=U`I>-^Aq1JP;qO
z-q+X4Gq1QLF)umQ)5TT^Xo6m5W{Q=gk*k5Li>sxfxto!pp{t>jrLm)>p|gdHtC^{p
zv5^~0uS<S%X>Mv>2~2MaLa!rEy`ZF!TL84#CABECEH%ZgC_h&L>}9J=+-@<)X&zK>
z3U0Sp;MA)Rbc{YIVv!;mCIn19ASOK70y*%6pPC0u?M1+3?ZI~F4+8^Zil>WXNX4x^
zVHbOw4R}<yFn>7fzms=GM8oZdJO{Om{H8l>Jr3p>?mJimb|1VeKR=Z@E4;6zh|{7e
ziBnajZ~j{wb-~*E?AaY30?%z))3R*Q{q@T-&vi31dN7_nDq+WPW9nwRFB~h9`XW;g
z_dJuHb;wBcXra!nZGUIZwPNU8@Y8iM-&DSR{2qzs=A~CTJRFLzuIW&iB{FOF!@W!D
zaxFHruXv{y9qrHLan`6n$snR**Zg}c7tcDW`#bUV;wM|$_+3~6rma*g$eJ0xWt!|o
z&V5IW_7#8Gs<Nd_io?d~>EgqUDN0IHlyA=H@#wu^na&V-Sx)NWf`yX;4;*yKotkpm
zGymMpP@%1st^59mZ*VzV^)TDx)oK@m^Ty{+8dUMMF<ZI&@UJhi@@T7D@={Jn^s01z
zq0Xa}*PKE89S=6o_d0Nh-8i@S$yWEfT>T5g1@d0qmv+3cO~mc!a_;6kUq$t=RXNzP
aN-#V>lq~W?<n%638RY5e=d#Wzp$P!c`nvW2

literal 0
HcmV?d00001

diff --git a/skin/ompd_darker/img/medium_message_ok.png b/skin/ompd_darker/img/medium_message_ok.png
new file mode 100644
index 0000000000000000000000000000000000000000..2fbe0eb9bedd9372350e631fa138720c80c450a6
GIT binary patch
literal 700
zcmeAS@N?(olHy`uVBq!ia0vp^3LwnE3?yBabR7dy%*9TgAsieWw;%dH0CIN)_=LFr
z|No!C7|3B@&}3i`1T%UV7=YSs7@*><3=GOJaUi>xfgziLAq^}G)WQvxngSLFnj;1i
zfv5zU0~7=*1DXI-12h?^(G6^P6$3*A*dm}HL@|&HHy@%HsAeWiBTx#?1~W>vszZU6
z+m!_Q1v3Z=Dk&)$gMf>RODGJafk8PKbb!FjnKM@b!S3C=&zw1P7YN?Hd-wmp-Rc=Y
z(-}AmJR*U<;}!y8#!GkW{s0BVN?apKoQqNuOEUBG6hbm{QyC0Q^$m>l4UFrb27Uvo
zkO!#<&QB{TPb^Ah@J&oE%Fj(r$xKvm%PdMQ&o9a@R<PKbajAlVfsx76#WBR9w{~)M
z_#p$Hqv-+{ukzM3a@YxeFbomcX1e75|LmJrjBT4${~GWAa_`O;lddVo9*&0tv+^BZ
z8+^0P)8;+)Y<X1k#)^eSn=Y$_Rrt;CR7&XhU=;YH?L(ZQ!L)*l(<`$&Pify&IQy4@
z-{|{i!F{LLYUW?7HB|f^{8L4$#C+cFO5KMSpX`jb&D!yP-z(-HN@;Tg49~2TxX#NL
z7PIHG>EX{8%ghzOOlVF$ZhP#B-8Z2_S`(O<<NJY(QiuKQ?!252f6qTZD~uz3YD=`)
z`XBy__GHE-sy>ukD!RRiWnX7L$MX}MPtAMy{t9tlY*6)!6LW6;-B-5epYwgjL+<|=
Zt+(i&HJ`g|Au!+=JYD@<);T3K0RT80>jwY;

literal 0
HcmV?d00001

diff --git a/skin/ompd_darker/img/medium_message_warning.png b/skin/ompd_darker/img/medium_message_warning.png
new file mode 100644
index 0000000000000000000000000000000000000000..3f9a72a536a1903fc94c4ead956b1c28276d4e55
GIT binary patch
literal 838
zcmeAS@N?(olHy`uVBq!ia0vp^3LwnE3?yBabR7dy%*9TgAsieWw;%dH0CGPB_=LFr
z|Nmb*vVnzz8z=x|Xoc4(IwwjRdkH8R^2urQNU8wEfr8@t&cf;z5H?U2C?aPYA!`#R
z?-&bYt9WHAdL;u%hzaU}B@i}{3uHqCHA5<q*$_dX?O(tDeD~?=%eSANyn6ri>C^kq
z-rRot>c)c?7jHkgdGqGk8xPN%IkV&Vl_lFx%-ei)>C&aW%XYUf+}<#IbMd6rIX%nk
z>+6$R7REKs3#*=0R8$mHG2OdpvSW6yO<I?Ea=URtYh+}keoPa@I%8wwhukf_KyL(;
z1o;Is2nq@+K><+8*u^C@G&HTeyu4#35Ukq08))^JyLa!tdk1tU5#WItt0vHF&H|6f
zVg?3oArNM~bhqvgP*A?aHKHUqKdq!Zu_%?nH!-;=KQ}ccGf}}UvnaJZzbLy{!D4I1
zr3#=@F_2Q{qSVBa%=|oskj&gv1_M)l10#I{<NBw8-xwGeT|8YJLo9mN21Q06G7#uF
zw)@n>+C^gP^K?T40|E|oFE)Ad|G#v3_><RD?JW6!Z=L&6#kf=8fA`T-7lZWbS5DbG
zM|p+Dk&PywmP!j*q%M9GV|dP|$yeoYz{-<l+miUoCH8#}42?Z4@<z#YS3TE-B>U4z
zj6gxglER6ro!TA<@UqDrxXU5$cS-DZ$_J)>{OdCw<}49e{v-bW*R9|7GP=(7|Df7+
zqowT{Z^g0|)|}k0UNAFkIrgzv|N3gfc~)F<6Qt`Ou1F5qD!%nWpOuH>de_a9drrw-
z?Z~pdw1)R_;LgQnh6ijMW-k&;<J!gMJYDilV}W${DOuC{$~TSj7O$qwDHW-6ieZ=-
z{Iu^C!$nmFrR83NyFajBpWWnNntE#@myyGLeii8%4<npzR5q<rZQU}rGx>n4Agfc9
jtFlg?V)2Asm6?ASxULr6^4-Y?${!4#u6{1-oD!M<=TmOH

literal 0
HcmV?d00001

diff --git a/skin/ompd_darker/img/medium_online.png b/skin/ompd_darker/img/medium_online.png
new file mode 100644
index 0000000000000000000000000000000000000000..c7d43b1d6e480cb4dd4bf4b90584657c594d00da
GIT binary patch
literal 1482
zcmYk53pkT|9LHbx5}_0)ItPzSXfcYFl({vQr6HGwkTF6`B$q^%B`HniHp*?!Y?2hG
zOv?R|OBa_T?9hf|#zJ~<?EK}Np7VL0_kExL@Av(`m+$xYk{vN8WTp2=Ll7iuhqA_k
ztJ=n~MGTy+i*L3-km$1GNoO0OP*~v)(OsYzUl}(y2Uk~Dw38Pajg~$f4QZkvIT$3h
z3v8(-KtNU!0O9fY4GkKtb0m0+KH+C~Ll4A|Tn`bdBZ>jN{Gl+gWW_3gCAhh&)m8cZ
zE}P4s3qct{P;-)eJSjanaJ%;DG#zwo-z~L)6j@LNT|JL`;5D?IvOr7qC=s+kJ)9T@
z_n@dFLpCeKOA$Z`wyRr*)1T1$DSD5u%K*(mpNF6VWFuMXpqP}B92<8Th|_`&#{_Em
z2cUsqG|!ZsXE^pidw_BP2<}9QgCe*IyBN9IDtw%u^)T};B?A%q%rdwbbb(RA^=aXH
z&D!$d+EUlT;#c8vsc<=WR<QP6(8TBSg^N+^f@Gl}W{S&M<9V&}f`mL9A<tMadF9)r
z&k`3a7(cVdRh(gm%#GQ6{ZO(nratr8VZMjj`f-BYPw40!o*G2V4k~>4WZTu%)$y)%
zw)GbGozHAj%6Kn~+b28J<uclBHq?onsgD_HcKurCH&=JzQ>*!KyT)J}eEL<yXuIr(
zH<yPRJmzaWr)mgO&;14(CHc>sKh&LkQCrP_f-bG;=2p1%vLrZ6Cjs3oulhZQhMp-i
z10UY@)PhrL)kr7J6&bL~$a##{h4jklN3iNLB8O@SJo%EV4;%xwjAiQr-x>>*X}RRu
zLW5lDL*R2mzA~`7C(|%C=WSJvX2yd@)fAO-iq4yKQ%1%wsp*;F>6Mq$s8z|PmDdj4
zzhMPD2hoGPJV-1`ysP*1Dsmh;D^5NvE+rubk4k8~8ihc`yhtN%M@GNI5pR;ix1I}6
zu#YG`L1fxSl!M&Qgx&<vI9|8{(g8Dx2r54kOtU298wS5P7)XN$GR)5B7~q*k=Sy_`
zE8)HcAi)EkxtgBEy0~00T|;o~8(^&cBC!}JNa25I{KObwy@AUH;2HSn4O0Ij`v>$5
zUTp$m+hk-DFckmN<kyG;f81|&)<|bWCo9uDSn;$XX>8RzI!gPQ%7VYiY2R_ZmwhdX
zBI<WA&ODg-)x_f#zD4`atc%2Mvq4t&VR+)(w%W^U*;<*9&S&x_dEFz~Pum#oLvDW&
zx;gU~YbOs&eV;^rD_EojWYw6iOW$&k@lZ1>;dH#Q@L92UA(E`*jyb;)xz804i7ncW
zFX5{tk&wkHFXK8~2D!~-ts_*)V);G$F1?~Z*uihSzPzzosTUiqCwhBWVjh##Y9zUf
zvSVNQXEEisii+1u0(U&mVeJ+5M&T`7Z2O1sOr^nnOP^TEY$L|eg(9zp@gjYaaZ+LS
zHrCEY(_h2lJqfe1z0K2TqriK$dpWiT6iK%IQUMO7pLw+YW~FPxi~&ov31{yIT&koU
z|09pNti5FDA%oM5|6@!>Zsz%%u`$}fJ07<J=NCVg)K<dDA|eGLc7w2RszZA9apr`H
zoru9Hm>BF5PNAc{)qN!p@~PdO87Vz?Yyuj8)Xs$e9$dh@g4ZKg1*rB&A<ms87pkT%
zHU%B8hh<JyawpAON2%@@b9u*$(BEaA*w_<0F=`aY+EsD3MUjTaZl}cB7zxKxS|OI8
ze`i`p-}G#Vy>4>@JbF%i>rSlJYnRndssRjQw<MxMt=w-ro9#_xc<n#RW4NiQ&vq4b
z(*IoO>BJ^MDE=0!@l+B_CFxQ=%a14mArj<d_K5D_t*ESJe3z(4GHIxY>`pM5kev<2
Jy2A2Y(m%|B%8LL1

literal 0
HcmV?d00001

diff --git a/skin/ompd_darker/img/playing.gif b/skin/ompd_darker/img/playing.gif
new file mode 100644
index 0000000000000000000000000000000000000000..05213ebe2747081e78e9ba52cb032a5fc6f91c10
GIT binary patch
literal 1589
zcmaiz`8yL19LJ~TEMjJI)M)PeX2`KNEDdvq!rZwM#YA$<5yF`JzBfmN$dQ~;?z4tS
zQI1ZLBYgSc`#gQ0r|0>8{({%@etllLXdM-}Jq!Q_d;}aH4GqnS6DLldJP8B>X=!Qc
z=;-L_=@}Rp7#SIvn3ztTI(7Q=X=Y|-78aH>XU?#)va+$Ufj}U3c6Klr%)!9{fj~Gp
zInSOw%f-dT&CSij!^6wVd+yx1^XJb)p-?_PK7M}w3l}cHU@!pz0YO1QAt51QVPO#w
z5m8Z5F)=Z5ad8O=2}wywDJdywX=xc58Ch9bIXO9bd3gl|1w}<gB_$<gWn~o=6*wHO
zs;a7{rlzj0e(~Z(4Gj%VO-(H=Ep2UW1OjpC(j_Dki9(@tbaZreb@lZ0&}j7K%a`@_
z^{-sHg27-63=9kn4ULS9uvo0Iv9XDXiK(fnnVFfnxw(afg{7tC)vH&ntgNi9t!-><
zu3fu!{rYuVTU$FjJ9~S391iE;;Na-!=;Y+&?Ck8~;^OM+>gMKl<HiklcXtmD4^K}|
zFE1}|Z||EoZ~FN7+`4tk*Vot2&+qo_+js8V@%Q%+2nfLA@qvMXckkW}3JMAi4!(Eq
zUPwsD{rmSrLqo&D!otJDBO)RQ1VUtFWK>jCbaZq~Ow5A^4`O3u<Kp7t<KrJbe3+1s
zkeHa5l$1my5|fjYQ&Lh$BvNW>YFb)adU|?BMn-04W>!{Kc6N47PEKxaZeCtqetv#I
zK|x_*VNp?0adB};Nl9sGX<1oWd3iaROr}sM6%`egm6cUhRn^tij~+d$si~>0t$qCX
zaa~<qeSLjHL&K9NPZ}E=o0^)QK7HEU+}zUA(%RbE*4Fmy*|YZc_UF%^cXV`gc6N4k
zb#-@l_w@Ai_V&Jb@uIJ<ufM<l<;$0^UcDL^7#JKJ92y!L9v&VU85tcN9UB`PA0MBX
zn3$ZLoSK@No}PaF`t_SPZ>Uu2%*@Q}?Cjj!+}pQr=jZ1a78c&Ud$+i_`2PL-4<9}(
zEiElCFMs^_@zbYID=RCjtE+2kYwPRlpFe;8^5x6duV24?`}Y0&_a8rgY;0`&{P}Zp
zb8~BJ>({Se+uPeaJ3G6(yL)?kzkmPU-`_ttI5<2!<Uc%RfHF0?q-}(flae_}bJPR>
z4v>)%a0rk%j^j8J00RMV$N=7cl;07~z%C}ClDN<r#mc1=r-!xg(&UimZnaEuKqf$i
zBY9tA1&|N<&J<<`_z3n#NHIQfbTbyj5aoTQW&=!|4dO)ctGuckwnj0?&;tdkiJNgL
zykIwoyRO8v%%l$2V6{n^&a-Y;YNIxIjAL9!5A-WiKbJOmyelQeD)IeEcH)Q(bVL>f
zIArA2tI6*O4FL(M_pugqYSKdy9(_i*?kKQ0PQg_c_9C8E4FraR9MJ?Qw$!HS)*?EU
zAERozGv+iH0zorPJY{z<$WRGpLhU3k4-imEECf6lXI!T5xh24@C^A_ABH;+llQ+z(
zt-8X_?M<v%);TMa&Gx({tsAqb&7_vpYU=$z+5TNE_LyzE%&sH!Xf>Pkkp=BY)<gL3
zqMJBmG=xXBwND0yNPsGvgSo~Q5Q#u^sREo>qLU^LeWvcpR)QqSicWRo*`0@S74TFb
z#kXj%Kn-(#30=R^T`Z?hXSSO{nIv1rnonj<l1Hm-x&qsF{X8tnokla6TgaX>Azt&n
zb3kRUYmNRhbilvy9a%lzZsEBm0~@zZUyVJ2zzov~+SXk}Jm7>{DMTj~^~M9$Am9}v
zSbsQFIMXKM+kAhVr0mNpT*M3d1bOSg`j`#po-`@^R@@4^&~QF78Nn<1(*>K4$q^%|
z)>AOW=C#Iiney%y)rMUL`;><D>AzZ~q5to{CH$Y&T07kY9&ND?XNe2C$%3@Gekw#q
z{S;|?DL=T$GBQcgbF7u@TQ;1hf~R!5`Yes4>vBRc8K$4wOJMODPE2N^<7BKLXfCs%
r!mP@+3sI>GskE$g=_jJBr`%^EvKD*yh5fzeFn(*xq!wi_Er8lTN?X#^

literal 0
HcmV?d00001

diff --git a/skin/ompd_darker/img/small_animated_progress.gif b/skin/ompd_darker/img/small_animated_progress.gif
new file mode 100644
index 0000000000000000000000000000000000000000..66800c7816c34eb7055cb6a894a7cafc14425aef
GIT binary patch
literal 1160
zcmZ?wbhEHb6lD-)xXQrr|3Aa`?;P*nGdz37aqZfid-nv+oH=vtn&Gu;n%Ax=Uc1I|
z?wr%Pb5`fh0mY5??iJX&Rbc5-$vJbX=gg7p0fFM49>o?AP^<=l?CNU8Vh~VFPS%Wy
z()0oWO(zgAG&VN=544Y}K=D7fpKD04vtxj(k)8oFBhYZgpDe6g45|z|EDS6Ryg<mn
z=6GPzga-l>TqK(dUNTsC23%@=S>v`;)#+-Lslv7f?Jr6U-TlwEyx<Xwxe?vY7^gbr
z-t`|s{A;bIIkAanGjWtTIbt)_<G`d1EgTG7a~^&$U~y@gvQ+4Sq}y`U#-J59ZQ3T}
za=K`hD}<^>>csKePVk$_BGkUQus1?`-!v-*FP{J>fkvlhFBxVA#%QdD`yZGTprOGj
z(6X?IgTZHtkYn+!04a~f$3p~y;ye<(H!ptDao|CJs%F%#*4(F0n$<cjPVqS;IL1#=
z4D#hyR$=qv3if3dD)P;DX5nyk^}=e0=YdHD9y&p44NE2&E}7uLm0A=aY3I!JG+E_|
z&HTBO4jAnb@to{mcvi1YXUU?-49~KCDt!fC0=S&~orNNUc>P73*@HZVJ94venSSAb
z<P@euDU)29H2A#~S1x98nCjCga6mO?gTOk5OBWj!$rY9Cwd1xH@E2Kf&}N4!hjFE1
z!AGWQ|BC#k996-#Ko3?KHczakTLJ@rir_?+!%tj2lz3$it6u);!?!X_Tl7F_$Cf(=
zMzcj*c1A4ZDAZeeGSBEs*VJjx@>c!TROtMM)ihvK25@LKnjBVC^}IEO&r9v4VvAb)
z67A<vuT%t?JIXmc*%&eyj|6{mV97WzbIunRuIq(G)*>l8{hb8r14Cn5RK3HcTwSp{
zH4y03BZ5<1Bo7ztRGFyaqn4>6Afy&}DY=6|!^wG4swM*ii|oU88<S++XNjR25!0=n
ze!k=+)h5Nj;mlv_Bh2E&tlS#tB;?oY%_i=qB;$?M3tpfAkt}L+<}C7%lw(nzRN|F2
zjiG_P)Jif*_sWE%&c7bkO;0Zby;|kn)b~Z1K}T9~6|41}oTdCVsv`9&%FNt8`J!3w
zPU0S5<2li?5HLMXSim^dL2}`y5{8^<7lar-bT};!oRrA<Lc=q`FM(6A$$CO#5W~kQ
sHUf>C1YS0@3gl=WV7%`wTcyfYpWPHz$-o}w)Yu&$?xrfm0!)wA08?3G+W-In

literal 0
HcmV?d00001

diff --git a/skin/ompd_darker/img/small_check.png b/skin/ompd_darker/img/small_check.png
new file mode 100644
index 0000000000000000000000000000000000000000..8390e67deb45f3d9e725525f2161be7e5dcf292b
GIT binary patch
literal 342
zcmeAS@N?(olHy`uVBq!ia0vp^q9Dw|3?!p1cPs@`%*9TgAsieWw;%dH0CIH$d_r9R
z|NqZ0lYvMiJK+#JP$PdykY6x^ppvmmXj=KqRlCpJefMA2YHtxxinG8YvY3H^TL^?1
zFWs&C0~8c1ag8W(E=o--$;{7F2+7P%WiT++H!#vSFs^?Z_zkE+9;6~TKdq!Zu_%?n
zH!-;=KQ}ccGf}}UvnaJZzbLy{!D4I1r3#?Z2u~Ns5RRG22?~rY3NzM(3+CMBEKvI_
z&1iA^x6quEMP>|&f0#}Mq$J!d7dVt+zx2WHYYbX-?~m?#ZE&<S|GsX+#?*UzLmM{U
pydT>veWHXf(canOP+b!P!@GTA8E@Ad-VU^b!PC{xWt~$(697VjaajNW

literal 0
HcmV?d00001

diff --git a/skin/ompd_darker/img/small_error.png b/skin/ompd_darker/img/small_error.png
new file mode 100644
index 0000000000000000000000000000000000000000..98c599447bc47041cbe93339929012662f8fa206
GIT binary patch
literal 626
zcmeAS@N?(olHy`uVBq!ia0vp^q9Dw{3?%2B3|#`Gn2Vh}LpV4%Za?&Y0OW27@CkAK
z|Ns9~28M11hI$4DAY&N=!%PN-<*ckg#!4`E6Bic{t>fU>%FhpBpH@%=a)BD(HaEX&
zsDD*g_c|^8c~bJ@h=?Zv0k6HiAA5N{a&>!UZ~xH2;i;ANJxj}bre?RyOz#;P-89gD
ztf_fJQ}dRF#x+&7CyI*KR8$_w$v>8oI;x~}T~-EY_(MsF`=TQEg@levNL=OTzt6*c
zg@fZB8{2JW=4%WLK&$6}o5%-rzfDPyUoeB9prDemaavkh`KsN!&z!mY?j6u&#DN`C
z@2&@$!&%@FS<Jw|Ed;`hm+sd60SbzhxJHyX7o{eaWaj57gk<KXG8mZZ8yM*u7}q}y
z{03AZ4^k1FpH@<ySd_}(o0wdbpPQPJnW*5FS(I9yUzA;}V6iphQUy@y0Z$jl5Q(X4
zFT53NbP#BGxHRRk+iPW^m(_uR(PpLpzpK8v#QNo5&AB<2>1+-2CMg`^bt|~xTDj`>
zv`kB@AgdKOe;asi`tc;ge%gdupG`W;r~G>7qtp1(ZuP2HKi6bGyQdibB*y8m!M5Bb
zJp$o5wr8GhkA0iCuJ`6uw=;4XJEGR!HWTDNqEqzP{jB!+r1uuK7eC1+_lO9uV}8;W
zpKNY4{itNuv)`53s*2qg|EHvexipH$bXPv-XW+Sd{(Ok!mn+;k{*u!*pY_-S{lehs
L>gTe~DWM4f(De?_

literal 0
HcmV?d00001

diff --git a/skin/ompd_darker/img/small_login.png b/skin/ompd_darker/img/small_login.png
new file mode 100644
index 0000000000000000000000000000000000000000..6bd79908985ad45b56511e078a455e193cfc1bed
GIT binary patch
literal 804
zcmeAS@N?(olHy`uVBq!ia0vp^q9Dw{3?%2B3|+#&z<4OYC&cyt|Nj%G^fxruXIEq=
z=jBC2_=bdpczb)RTV<!ErG<xw!?}x_xn|FsQJKWEqMBiL3B#0phOC^d{w#(?OXdR^
zK(e%=sJOIf%Oq|fBQc}6F_UrGiX}i1AiJfl8E8daV{LU!1yH0iLv_=Z^@r#20|oo4
z)TR_O?A*I$+m0=3H?Cg0ZuRn2OXn?^GkNC1sWT=4-8QSk{{O$1|NmeA|8M)BZ`b~O
zJ@fg?r+?qq|Np-1|M%H%KmPgg@yNS(@BV*j{Qsrw_ooT}KUV(x*!=Bn>z}vDf8NCX
zev|e8jqCq6#vh+oeR~o2?RnzYXF<Q8X?%DT`RAF)>j$~-@4J4!ulV|o@0a_+uWtK2
zyOsFhTIP!z7H@9|p1g4J%?+t1SKXdmbvbk9%*nIIPn|vf>}=w#^RbUE=-xZ;^z0(<
z%`>6*&RO3)?RfWS_|@Z1SC8A?IAM7I6xZ#ON|z5-+&js8^FY*%gF!p?Z2|i6>Ji23
zhuJRg@d0}F!d|8eds$Cxbl9@Ic)_B%CznVZnlG_qfj%&h56qR=G)raI4AIR~Ww%b1
z?&zJgreAVdw-_)O7qyAZZ4&CN@t#^E&|S>eS;%>Tg?lqFQq4<({DK(-p+E@)TtY*E
zahR6Y(J^!8%vC_Jd-rajH-O+S2mk{O3Y2meC;*MP<>}%WA`zaPus|r`(RA}1qfoI#
zcd?Wy7kqs^eOH=Jedr=2>RomzJSf=ID{pdAGq+LpjTfFp#v8h3hh!BVbdBVh6SAYx
zWVVy5J%7xU!#5lS&rIlj|FE_D)6A(E++3WT-K)&~gc`cDrcGVC^y$;7*G;yRy*S`H
z`>d|c+c&Ycf1DO4s~vWYUi0RT&EIC_Nkv?jmoMn3Vr@H`CK8^i+!<y4o26AfWop><
z=gKa(*T&X3D?Q%SwdysOz@oW*+uq${JQ&zHbLY?Chl?)Vjon)-tmZe*CiPT^CEF?n
ZhI47=w)%Dl^MJl&@O1TaS?83{1OQsXq8$JL

literal 0
HcmV?d00001

diff --git a/skin/ompd_darker/img/small_uncheck.png b/skin/ompd_darker/img/small_uncheck.png
new file mode 100644
index 0000000000000000000000000000000000000000..d9083ab9f5e431b820eac3ad8fae6140876f7666
GIT binary patch
literal 291
zcmeAS@N?(olHy`uVBq!ia0vp^q9Dw|3?!p1cPs@`%*9TgAsieWw;%dH0CJ@Rd_r9R
z|Np;a^L?zSRU@bXsEo5D$S;_|*d;V=)tPtyubx*50|^#*L>4nJa0`Jj<E6WGe}IBw
zC9V-A&PAz-C7Jno3L%-fsSF0D`UXb&2FCSI1HS=P$b(b_=ckpFCl;kL_$DS7<>#iR
zWF{)OWfrBD=NDxcD_CsJxKsgDYU}CZ7{W0#IbnfZMoL0LPQxZwQHc=N1v$%Hj;ZWW
zGBjtjn7x!`VdNnuy>lWbBv_JHYc>e5FtE;KTJa)|VXXkG@9j;i9s&(w@O1TaS?83{
F1OOc|WIX@?

literal 0
HcmV?d00001

diff --git a/skin/ompd_darker/img/tiny_check.png b/skin/ompd_darker/img/tiny_check.png
new file mode 100644
index 0000000000000000000000000000000000000000..2ab688b4f007767c0a6ba92668b2f48cc55db0da
GIT binary patch
literal 299
zcmeAS@N?(olHy`uVBq!ia0vp^AT}2ZGmxy8xzq=wn2Vh}LpV4%Za?&Y0OYC%_=LFr
z|Noz1CIdnALt(EaPz!HKkY6x^ppvmmXj;e2Gk4$p*S;^B29)3|@Q5sCVBi)4Va7{$
z>;3=*#Y$WwN}P*Q6H7Al^Atidb5j`%O!W<n^bL&bp9X#ds*ne%2+mI{DNig)W$;Z*
zF3QhMP037DaLX)8Ezd8?E>^JEnsKQDsMOTc#W93qW^w`pleoaaO{^|e<_$AevotI@
zug2E4V#-ZM9-dpf{TY6~Nf%@CJa(5&p;XO*hk;p#Gk?<eu=79z7(8A5T-G@yGywpv
CW>|&*

literal 0
HcmV?d00001

diff --git a/skin/ompd_darker/img/tiny_uncheck.png b/skin/ompd_darker/img/tiny_uncheck.png
new file mode 100644
index 0000000000000000000000000000000000000000..160053829b74be95c4a68218a8d1177edfb8de00
GIT binary patch
literal 299
zcmeAS@N?(olHy`uVBq!ia0vp^AT}2ZGmxy8xzq=wn2Vh}LpV4%Za?&Y0OYC%_=LFr
z|Nno<=KBN@k4OX)Pz!HKkY6x^ppr{yTF1;)yU)D)FR3k-4V2(4@Q5sCVBi)4Va7{$
z>;3=*#Y$WwN}P*Q6H7Al^Atidb5j`%O!W<n^bL&bp9X#ds*ne%2+mI{DNig)W$;Z*
zF3QhMP037DaLX)8Ezd8?E>^JEnsKQDsMOTc#W93qW^w`pvl}a$8YA1XlROi-czDE~
zMK?H|sTOKb`K`&UFmv)ANezRk2M;wgO7<LJV7M;Io;z>vqDr6v44$rjF6*2UngET~
BXx0D#

literal 0
HcmV?d00001

diff --git a/skin/ompd_darker/styles.css b/skin/ompd_darker/styles.css
new file mode 100644
index 0000000..11423e7
--- /dev/null
+++ b/skin/ompd_darker/styles.css
@@ -0,0 +1,2338 @@
+/*  +------------------------------------------------------------------------+
+    | styles.css                                                             |
+    +------------------------------------------------------------------------+ */
+/*  +------------------------------------------------------------------------+
+    | styles.css                                                             |
+    +------------------------------------------------------------------------+ */
+@viewport {
+  width: device-width;
+  zoom: 100%;
+}
+html {
+  height: 100%;
+}
+body {
+  margin: 0 auto;
+  border: 0;
+  padding: 0;
+  background: #000000;
+  color: #161616;
+  font-family: "Roboto", "sans-serif";
+  width: 100%;
+  height: 100%;
+  max-width: 1280px;
+  letter-spacing: 0px;
+  overflow-y: scroll;
+}
+* {
+  box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  -webkit-box-sizing: border-box;
+}
+p {
+  margin: 0;
+}
+i:active {
+  color: #b53d00;
+}
+@media all and (max-width: 320px) {
+  html {
+    font-size: 11px;
+    font-weight: 300;
+  }
+}
+@media all and (min-width: 321px) and (max-width: 529px) {
+  html {
+    font-size: 12px;
+    font-weight: 300;
+  }
+}
+@media all and (max-width: 529px) {
+  td.side-margin {
+    width: 0px;
+  }
+  td.menu_top_left {
+    display: none;
+  }
+  .full {
+    height: 11em;
+    overflow: hidden;
+    display: inline-block;
+    margin-bottom: 5px;
+    white-space: nowrap;
+    width: 0;
+  }
+  #pl-track-info {
+    display: none;
+  }
+  #image_container {
+    clear: both;
+    width: 100%;
+    float: none;
+    margin-bottom: 5px;
+    text-align: center;
+  }
+  #image {
+    margin-left: auto;
+    margin-right: auto;
+    min-width: 200px;
+    min-height: 200px;
+  }
+  #playlist {
+    margin: 0 0;
+  }
+  .pl-track-info-right {
+    width: 100%;
+    clear: both;
+    max-width: 380px;
+    margin: 0 auto;
+  }
+  .album-info-area-right {
+    width: 100%;
+    clear: both;
+    padding-left: 5px;
+    min-height: 164px;
+  }
+  .pl-track-info {
+    clear: both;
+    width: 100%;
+    float: none;
+    padding-top: 0px;
+  }
+  .sign-ctrl {
+    font-size: 2em;
+  }
+  .cb-typcn {
+    font-size: 2.5em;
+    top: 2px;
+  }
+  td.small_cover {
+    display: none;
+  }
+  td.play-indicator,
+  .pl-year,
+  .pl-genre,
+  .track-list-artist {
+    display: none;
+  }
+  .track-list-artist-narrow {
+    display: block;
+  }
+  div.playlist_indicator {
+    width: 100%;
+  }
+  #track-progress {
+    width: 80%;
+  }
+  #info_area {
+    margin: 0;
+    position: relative;
+  }
+  div.media_control {
+    padding-bottom: 5px;
+  }
+  #menuSubMiddleMediaGenre,
+  #genreList,
+  #menuSubMiddleMediaQuickSearch {
+    column-count: 3;
+    -moz-column-count: 3;
+    -webkit-column-count: 3;
+  }
+  #searchFormAll {
+    display: table;
+    width: 100%;
+    padding: 3px 2px;
+    background-color: #161616;
+    display: none;
+    z-index: 20;
+    margin: 5px 0 0;
+  }
+  #searchFormAll input {
+    height: 2.5em;
+  }
+  #volumeValueWrapper {
+    width: 70%;
+  }
+  #volumeValue {
+    width: 100%;
+  }
+  #favoriteTableFirstCol {
+    min-width: 8em;
+  }
+}
+@media all and (min-width: 530px) {
+  html {
+    font-size: 14px;
+    font-weight: 300;
+  }
+  td.menu_top_left {
+    display: table-cell;
+  }
+  .full {
+    height: 9.65em;
+    overflow: hidden;
+    display: inline-block;
+    margin-bottom: 5px;
+    white-space: nowrap;
+    width: 0;
+  }
+  /*.tile 	{
+			width: 7em; 
+			height: 7em;
+			display:inline-block; 
+			margin: 1px;
+			}
+	*/
+  #pl-track-info {
+    display: none;
+  }
+  #image_container {
+    float: left;
+    width: 39%;
+    min-width: 220px;
+  }
+  .pl-track-info-right {
+    width: 59%;
+    position: absolute;
+    top: 0;
+    bottom: 0;
+    right: 0;
+  }
+  .album-info-area-right {
+    overflow: auto;
+    width: 58%;
+    float: right;
+    padding-left: 5px;
+  }
+  .pl-track-info {
+    width: 100%;
+    padding-top: 7px;
+  }
+  .sign-ctrl {
+    font-size: 1.5em;
+  }
+  .cb-typcn {
+    font-size: 2em;
+    top: 0;
+  }
+  td.small_cover {
+    display: none;
+  }
+  td.play-indicator {
+    display: none;
+  }
+  div.playlist_indicator {
+    width: 100%;
+  }
+  .track-list-artist-narrow {
+    display: none;
+  }
+  #track-progress {
+    width: 80%;
+  }
+  #info_area {
+    height: 100%;
+    position: relative;
+  }
+  #additional-info {
+    clear: left;
+    padding: 0px 0;
+  }
+  #menuSubMiddleMediaGenre,
+  #genreList,
+  #menuSubMiddleMediaQuickSearch {
+    column-count: 4;
+    -moz-column-count: 4;
+    -webkit-column-count: 4;
+  }
+  #searchFormAll {
+    height: 2.4em;
+    display: none;
+    position: relative;
+    float: right;
+    right: 4px;
+    top: -2px;
+    width: 17em;
+    z-index: 20;
+    margin: 5px;
+  }
+  #searchFormAll input {
+    height: 2em;
+  }
+  #volumeValue,
+  #volumeValueWrapper {
+    width: 450px;
+  }
+  #favoriteTableFirstCol {
+    min-width: 10em;
+  }
+}
+@media all and (min-width: 530px) and (max-width: 1170px) {
+  div.media_control {
+    width: 100%;
+    position: absolute;
+    bottom: 0px;
+    padding-right: 2px;
+    padding-bottom: 2px;
+  }
+  #track-progress {
+    width: 75%;
+  }
+  td.side-margin {
+    width: 0px;
+  }
+}
+@media all and (min-width: 768px) {
+  td.small_cover {
+    display: table-cell;
+  }
+}
+@media all and (min-width: 1170px) {
+  html {
+    font-size: 17px;
+    font-weight: 300;
+  }
+  #pl-track-info-narrow {
+    display: none;
+  }
+  #info_area {
+    min-height: 500px;
+  }
+  .full {
+    height: 11.5em;
+    overflow: hidden;
+    display: inline-block;
+    margin-bottom: 5px;
+    white-space: nowrap;
+    width: 0;
+  }
+  /*.tile 	{
+			width: 7em; 
+			height: 7em;
+			display: inline-block; 
+			margin: 1px;
+			}
+	*/
+  #pl-track-info {
+    display: block;
+  }
+  td.small_cover {
+    display: table-cell;
+  }
+  td.side-margin {
+    width: 0px;
+  }
+  td.play-indicator {
+    display: table-cell;
+  }
+  div.media_control {
+    width: 100%;
+    position: absolute;
+    bottom: 0px;
+    padding-bottom: 4px;
+  }
+}
+@media all and (min-width: 1281px) {
+  td.side-margin {
+    width: 0px;
+  }
+}
+#menu {
+  background: #161616;
+  position: relative;
+  display: block;
+  width: 100%;
+  z-index: 10;
+}
+#content {
+  height: 100%;
+  width: 100%;
+  padding-top: 0px;
+}
+#logo1 {
+  color: #3498db;
+  font-weight: normal;
+}
+#logo2 {
+  color: #fdf6e3;
+  font-weight: normal;
+}
+#image_in {
+  width: 100%;
+  position: relative;
+}
+#image_container {
+  float: left;
+  overflow: hidden;
+  position: relative;
+}
+#cover-spinner {
+  left: 0;
+  top: 0;
+  right: 0;
+  bottom: 0;
+}
+#cover-spinner img {
+  position: absolute;
+  margin: auto;
+  left: 0;
+  top: 0;
+  right: 0;
+  bottom: 0;
+}
+#parameters {
+  margin: 5px auto;
+  text-align: center;
+  font-size: 0.8em;
+  color: #a5a5a5;
+}
+#info_area {
+  background-color: #171717;
+}
+#album-info-area {
+  overflow: hidden;
+  background-color: #171717;
+}
+#back-ground-wrapper {
+  display: none;
+  position: fixed;
+  width: 100%;
+  height: 100%;
+  max-width: 1280px;
+}
+#back-ground-img {
+  width: 100%;
+  height: 100%;
+  opacity: 0.2;
+  z-index: -10;
+}
+#back-ground:before {
+  content: "";
+  position: absolute;
+  display: block;
+  z-index: -100;
+  width: 100%;
+  height: 100%;
+  filter: url('/ompd/playlist.php#blur');
+  filter: blur(25px);
+  -webkit-filter: blur(25px);
+  opacity: 0.2;
+  background-size: cover;
+  background-position: 20% 20%;
+}
+a:link,
+a:visited {
+  color: #fdf6e3;
+  text-decoration: none;
+}
+a:active {
+  opacity: 0.8;
+  color: #b53d00 !important;
+}
+a:hover {
+  color: #fdf6e3;
+  text-decoration: none;
+}
+a.sort_selected {
+  color: #b53d00;
+}
+/*  +------------------------------------------------------------------------+
+    | Table                                                                  |
+    +------------------------------------------------------------------------+ */
+table {
+  border: 0px;
+  font-size: 1em;
+  width: 100%;
+}
+table.fullscreen {
+  width: 100%;
+  color: #a5a5a5;
+}
+.halfscreen {
+  width: 50%;
+}
+table.border {
+  width: 100%;
+}
+tr.line,
+td.line {
+  height: 1px;
+  background-color: #171717;
+  border-bottom: 1px #171717 solid;
+  transform: scaleY(0.5);
+}
+td.fullscreen {
+  width: 100%;
+}
+td.vertical_line {
+  width: 0.769em;
+}
+td.nowrap {
+  white-space: nowrap;
+}
+tr.nowrap td {
+  white-space: nowrap;
+}
+tr.even :nth-child(1),
+tr.even :nth-child(2),
+tr.even :nth-child(3),
+tr.odd :nth-child(1),
+tr.odd :nth-child(2),
+tr.odd :nth-child(3),
+tr.select :nth-child(1),
+tr.select :nth-child(2),
+tr.select :nth-child(3) {
+  padding-left: 0px;
+}
+tr.select td:nth-child(1) {
+  /* background-color: (@active-nav); */
+}
+tr.select #trackNumber,
+tr.select .trackNumber {
+  color: #fdf6e3;
+  background-color: #b53d00;
+}
+tr.even td,
+tr.odd td,
+tr.select td {
+  padding: 2px 2px 2px 5px;
+}
+.tabFixed {
+  table-layout: fixed;
+}
+/*  +------------------------------------------------------------------------+
+    | Table menu                                                             |
+    +------------------------------------------------------------------------+ */
+table.menu_top {
+  width: 100%;
+  background-color: #161616;
+  height: 3.846em;
+}
+td.menu_top_left {
+  width: 10em;
+  vertical-align: middle;
+  padding-left: 0px;
+}
+td.menu_top {
+  color: #a5a5a5;
+  text-align: center;
+  font-size: 0.9em;
+  border-top: 0.3em solid #161616;
+  width: 9em;
+  vertical-align: middle;
+  cursor: pointer;
+  transition: all 100ms linear;
+  position: relative;
+  text-transform: uppercase;
+  font-weight: normal;
+}
+td.menu_top_config {
+  max-width: 3em !important;
+  width: 3em;
+  text-align: center;
+  font-size: 1.1em;
+}
+td.menu_top_selected {
+  color: #fdf6e3;
+  border-top: 4px solid #b53d00;
+}
+table.menu_middle a:link {
+  color: #fdf6e3;
+  text-decoration: none;
+}
+table.menu_middle a:visited {
+  color: #fdf6e3;
+  text-decoration: none;
+}
+table.menu_middle a:hover {
+  color: #fdf6e3;
+  text-decoration: none;
+}
+table.menu_middle p span {
+  display: inline-block;
+  line-height: 1.1em;
+}
+table.menu_middle {
+  width: 100%;
+  color: #fdf6e3;
+  background-color: #4e6819;
+  height: 2em;
+  text-transform: uppercase;
+  font-size: 0.8em;
+  font-weight: normal;
+}
+td.menu_middle_left {
+  width: 0px;
+  border-bottom: 0px solid #4e6819;
+}
+td.menu_middle {
+  border-bottom: 0px solid #4e6819;
+  line-height: 2.4em;
+  height: 3.2em;
+}
+td.menu_middle_right {
+  width: 0px;
+  border-bottom: 0px solid #4e6819;
+}
+table.menu_bottom {
+  width: 100%;
+}
+td.menu_bottom_left {
+  width: 0.769em;
+}
+td.menu_bottom_right {
+  width: 0.769em;
+}
+#activePlayer,
+#currentVolume {
+  font-size: 0.5em;
+  padding-top: 3px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  width: 100%;
+  position: absolute;
+  text-transform: uppercase;
+  white-space: nowrap;
+}
+#volumeValue {
+  display: inline-block;
+  position: relative;
+}
+#volumeBar {
+  background: #b53d00;
+}
+#volumeValueWrapper {
+  display: inline-block;
+  position: relative;
+  margin: 0 5px;
+  height: 100%;
+}
+#volumeArea {
+  padding: 5px;
+}
+#playerList,
+#volumeArea {
+  text-align: right;
+  display: none;
+  line-height: 2em;
+  color: #fdf6e3;
+  margin-bottom: 0 !important;
+}
+#selectPlayer > span,
+#playlistAction > span {
+  cursor: pointer;
+  max-width: 10em;
+  text-overflow: ellipsis;
+  overflow-x: hidden;
+}
+#selectPlayer {
+  background-color: #161616;
+}
+#playlistAction {
+  background-color: #232323;
+}
+#playlistAction,
+#selectPlayer {
+  text-transform: uppercase;
+  line-height: 3em;
+  padding: 7px;
+}
+#playlistAction > div {
+  margin: 1em 0;
+  line-height: initial;
+}
+#selectSource,
+#selectDest,
+#menuSubMiddleMediaSavePlaylist select,
+#menuSubMiddleMediaSavePlaylist input,
+#menuSubMiddleMediaAddUrl select,
+#menuSubMiddleMediaAddUrl input {
+  max-width: 40%;
+  border-width: 0px;
+  background-color: #fefefe;
+  border-radius: 3px;
+  text-transform: uppercase;
+  font-size: 1em;
+}
+#menuMiddleMedia {
+  position: relative;
+  overflow: visible;
+  display: inline-block;
+  width: 100%;
+  padding: 0.4em 4px;
+}
+#menu_middle_items {
+  padding: 0 4px;
+  display: block;
+}
+#menuMiddleMedia > span {
+  cursor: pointer;
+}
+[id^=menuSubMiddle] {
+  position: relative;
+  display: none;
+  left: 0;
+  width: 100%;
+  color: #fdf6e3;
+  padding: 5px;
+  white-space: normal;
+  z-index: 20;
+  line-height: 2.5em;
+  font-weight: normal;
+}
+#menuSubMiddleMediaAlpha a,
+#menuSubMiddleMediaGenre a,
+#menuSubMiddleMediaQuickSearch a,
+.paginator-nav a {
+  color: #fdf6e3;
+}
+#menuSubMiddleMediaAlpha {
+  color: rgba(253, 246, 227, 0.8);
+}
+#menuSubMiddleMediaAlpha span,
+.paginator-nav span,
+.buttons span,
+[id^=playlistAddTo],
+[id^=playlistSaveAs],
+[id^=playlistAddUrl] {
+  line-height: 1.7em;
+  border-radius: 3px;
+  display: inline-block;
+  min-width: 2.8em;
+  padding: 5px;
+  margin: 0.2em 0.1em;
+  text-align: center;
+  white-space: nowrap;
+  text-transform: uppercase;
+  font-weight: normal;
+  cursor: pointer;
+  color: #fdf6e3;
+}
+.paginator-nav span,
+.buttons span {
+  background-color: #67891e;
+}
+[id^=playlistAddTo],
+[id^=playlistSaveAs],
+[id^=playlistAddUrl] {
+  cursor: pointer;
+  width: 5em;
+  background-color: #777777;
+}
+#menuSubMiddleMediaGenre p {
+  font-weight: normal;
+}
+.savePlaylistCol1 {
+  width: 10em;
+  max-width: 20%;
+  display: inline-block;
+  text-align: right;
+  margin: 0 5px;
+}
+.savePlaylistCol2 {
+  width: 20em;
+  display: inline-block;
+  margin-right: 5px;
+  max-width: 55%;
+}
+.savePlaylistCol3 {
+  width: 5em;
+  display: inline-block;
+  max-width: 55%;
+  margin: 0.2em;
+}
+#menuSubMiddleMediaSavePlaylist input,
+#menuSubMiddleMediaSavePlaylist select,
+#menuSubMiddleMediaAddUrl input,
+#menuSubMiddleMediaAddUrl select {
+  width: 100%;
+  max-width: 100% !important;
+  text-transform: none;
+}
+#menuSubMiddleMediaSavePlaylist,
+#menuSubMiddleMediaAddUrl {
+  line-height: 4em;
+  color: #fdf6e3;
+  font-size: 1.2em;
+  padding: 0;
+}
+#menuSubMiddleMediaSavePlaylist div:nth-child(2),
+#menuSubMiddleMediaSavePlaylist div:nth-child(3),
+#menuSubMiddleMediaSavePlaylist div:nth-child(4) {
+  background-color: #57741c;
+  border-bottom: solid 1px #4e6819;
+}
+.listDivider {
+  background-color: #171717;
+  color: #a5a5a5;
+}
+.paginator-nav span a,
+.buttons span a {
+  color: #fdf6e3;
+  white-space: normal !important;
+}
+.artist_all {
+  border: 1px solid #fdf6e3;
+  display: inline-block;
+  padding: 0 5px !important;
+  /* padding: 1px 2px !important; */
+  margin: 0 0.3em;
+  text-align: center;
+  white-space: nowrap;
+  line-height: 1.2em;
+}
+#fixedMenu {
+  background: inherit;
+  width: 100%;
+  max-width: 1280px;
+  position: fixed;
+  z-index: 30;
+  top: 0;
+}
+#fixedMenuFill {
+  height: 3.846em;
+}
+/*  +------------------------------------------------------------------------+
+    | Table playlist                                                         |
+    +------------------------------------------------------------------------+ */
+div.playlist_top {
+  width: 100%;
+}
+table.playlist_top_1 {
+  width: 100%;
+  color: gray;
+}
+table.playlist a:link {
+  color: #CFFEFF;
+  text-decoration: none;
+}
+table.playlist a:visited {
+  color: #CFFEFF;
+  text-decoration: none;
+}
+table.playlist a:hover {
+  color: #FF8000;
+  text-decoration: none;
+}
+table.playlist {
+  width: 100%;
+  height: 2.3077em;
+  padding-top: 0.231em;
+  background-color: #161616;
+  color: #161616;
+}
+td.playlist_text {
+  width: 5.3846em;
+}
+td.playlist_display {
+  width: 3.846em;
+  color: #CAD2EC;
+  font-size: 0.923em;
+  text-align: center;
+}
+div.playlist_title {
+  color: #fdf6e3;
+  font-size: 1.077em;
+  text-align: left;
+}
+div.playlist_title_album {
+  font-size: 0.923em;
+  color: #a5a5a5;
+}
+td.playlist_bar_top {
+  width: 15.3846em;
+  height: 0.3846em;
+}
+td.playlist_bar_middle {
+  width: 15.3846em;
+  height: 0.3846em;
+}
+td.playlist_bar_bottom {
+  width: 15.3846em;
+  height: 0.8462em;
+}
+td.playlist_bar_space {
+  width: 0.3846em;
+  height: 1.6154em;
+}
+td.playlist_button {
+  width: 2.3077em;
+  height: 1.6154em;
+}
+td.playlist_button_status {
+  width: 5.7692em;
+  height: 1.6154em;
+}
+td.playlist_space {
+  width: 7.6923em;
+  height: 1.6154em;
+}
+td.playlist_back_space {
+  width: 1px;
+  height: 1.6154em;
+}
+#playlist {
+  background-color: #111111;
+  padding: 0em;
+  padding-top: 1.5em;
+  clear: both;
+  color: #a5a5a5;
+}
+.showPL,
+.hidePL {
+  cursor: pointer;
+}
+.playlist-title {
+  font-size: 1.2308em;
+  padding-bottom: 1.154em;
+  padding-left: 5px;
+  display: inline-block;
+  letter-spacing: 1px;
+  text-transform: uppercase;
+  margin-right: 5px;
+  color: #a5a5a5;
+}
+div.playlist_button_border {
+  padding: auto;
+  display: block;
+}
+.control-row {
+  display: table;
+  width: 100%;
+  max-width: 500px;
+  margin: 10px auto 0;
+}
+div.playlist_button {
+  text-align: center;
+  display: table-cell;
+  vertical-align: middle;
+  width: 3em;
+  height: 2.3em;
+  cursor: pointer;
+  background-color: #161616;
+  border: solid 1px #171717;
+  color: #171717;
+}
+div.playlist_button.miniplayer {
+  background-color: #161616;
+  border: solid 1px #161616;
+  color: #161616;
+}
+div.playlist_button_play {
+  width: 6.1538em;
+}
+div.playlist_indicator {
+  padding-top: 0.5em;
+  vertical-align: middle;
+  text-align: center;
+  color: #a5a5a5;
+}
+div.playlist_status_off {
+  text-shadow: -1px 0 #a5a5a5, 0 1px #a5a5a5, 1px 0 #a5a5a5, 0 -1px #a5a5a5;
+}
+div.playlist_status_on {
+  color: #b53d00;
+}
+div.playlist_status_on_border {
+  border: solid 1px #a5a5a5;
+}
+.sign {
+  font-size: 1.8em;
+  color: #777777;
+}
+.pl-track-info-right {
+  overflow: auto;
+}
+.pl-track-info {
+  padding-left: 5px;
+  padding-right: 5px;
+}
+.pl-fld-name {
+  font-size: 0.75em;
+  color: #a5a5a5;
+  margin-top: 1px;
+}
+#title_wait_indicator {
+  font-size: 1em;
+}
+.pl-track-number-title {
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+.pl-track-title {
+  font-size: 1.3em;
+  color: #a5a5a5;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+.pl-track-number {
+  font-size: 0.8em;
+}
+.pl-track-artist {
+  font-size: 1.1em;
+  padding-top: 0.5em;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+.pl-track-favorites {
+  font-size: 1.4em;
+  padding-top: 0.5em;
+  color: #fdf6e3;
+}
+.pl-favorites {
+  color: #fdf6e3;
+  cursor: pointer;
+  font-size: 1.5em;
+  max-width: 1.9em;
+  width: 1.9em;
+  padding-right: 0 !important;
+}
+.pl-tdr {
+  font-size: 1em;
+  text-align: center;
+  width: 2em;
+  max-width: 2em;
+}
+#favorites,
+#favorites1 {
+  cursor: pointer;
+}
+.pl-file-info {
+  font-size: 1em;
+  padding-top: 0.769em;
+}
+/*  +------------------------------------------------------------------------+
+    | Table header & footer                                                  |
+    +------------------------------------------------------------------------+ */
+tr.header a:link {
+  color: #a5a5a5;
+}
+tr.header a:visited {
+  color: #a5a5a5;
+}
+tr.header a:hover {
+  color: #a5a5a5;
+  text-decoration: none;
+}
+tr.header td {
+  white-space: nowrap;
+  padding-left: 5px;
+  vertical-align: middle;
+  line-height: 3.5em;
+  text-transform: uppercase;
+  color: #a5a5a5;
+}
+tr.header :nth-child(1),
+tr.header :nth-child(2),
+tr.header :nth-child(3) {
+  padding-left: 0px;
+}
+tr.header {
+  background-color: #171717;
+  color: #161616;
+  font-weight: normal;
+  font-size: 0.9em;
+}
+tr.multidisc_header {
+  background-color: #171717;
+}
+tr.header_bigger {
+  font-size: 1em !important;
+}
+tr.header td.icon span i {
+  font-size: 2em;
+}
+tr.header td.padding3 {
+  padding-left: 3px;
+}
+tr.footer a:link {
+  color: #a5a5a5;
+}
+tr.footer a:visited {
+  color: #a5a5a5;
+}
+tr.footer a:hover {
+  color: #a5a5a5;
+  text-decoration: none;
+}
+tr.footer {
+  line-height: 3.5em;
+  font-size: 1em;
+  background-color: #171717;
+  color: #a5a5a5;
+}
+/*  +------------------------------------------------------------------------+
+    | Table tab                                                              |
+    +------------------------------------------------------------------------+ */
+table.tab {
+  width: 100%;
+}
+td.tab_on {
+  height: 2.3077em;
+  width: 7.6923em;
+  border-left: 1px solid #b53d00;
+  border-top: 1px solid #b53d00;
+  border-right: 1px solid #b53d00;
+  border-bottom: 0.3077em solid #b53d00;
+  background-color: #b53d00;
+  color: #fdf6e3;
+  text-align: center;
+  cursor: pointer;
+}
+td.tab_off {
+  height: 2.3077em;
+  width: 7.6923em;
+  border-left: 1px solid #2f3439;
+  border-top: 1px solid #2f3439;
+  border-right: 1px solid #2f3439;
+  border-bottom: 0.3077em solid #b53d00;
+  background-color: #2f3439;
+  text-align: center;
+  cursor: pointer;
+  color: #ffffff;
+}
+td.tab_none {
+  border-bottom: 0.3077em solid #b53d00;
+}
+tr.tab_header a:link {
+  color: #a5a5a5;
+}
+tr.tab_header a:visited {
+  color: #a5a5a5;
+}
+tr.tab_header a:hover {
+  color: #a5a5a5;
+  text-decoration: underline;
+}
+tr.tab_header td {
+  white-space: nowrap;
+}
+tr.tab_header {
+  background-color: #171717;
+  color: #a5a5a5;
+  font-weight: normal;
+  font-size: 0.9em;
+  line-height: 3.5em;
+  text-transform: uppercase;
+}
+#header_user_name {
+  width: 15em;
+}
+table.tab_border {
+  border-left: 1px solid #171717;
+  border-right: 1px solid #171717;
+  border-bottom: 1px solid #171717;
+  background-color: #171717;
+  width: 100%;
+}
+/*  +------------------------------------------------------------------------+
+    | Table ok, warning & error                                              |
+    +------------------------------------------------------------------------+ */
+table.ok a:link {
+  color: #529600;
+  text-decoration: underline;
+}
+table.ok a:visited {
+  color: #529600;
+  text-decoration: underline;
+}
+table.ok {
+  max-width: 360px;
+  background-color: #EFFFD6;
+  margin-top: 1em;
+  color: black;
+}
+table.ok tr.line {
+  height: 1px;
+  background-color: #529600;
+}
+table.warning a:link {
+  color: #42559C;
+  text-decoration: underline;
+}
+table.warning a:visited {
+  color: #42559C;
+  text-decoration: underline;
+}
+table.warning {
+  max-width: 360px;
+  background-color: #B6D0DC;
+  margin-top: 1em;
+  color: black;
+}
+table.error a:link {
+  color: Red;
+  text-decoration: underline;
+}
+table.error a:visited {
+  color: Red;
+  text-decoration: underline;
+}
+table.error {
+  max-width: 360px;
+  background-color: #FFA4A4;
+  margin-top: 1em;
+  color: black;
+}
+table.error tr.line {
+  height: 1px;
+  background-color: Red;
+}
+/*  +------------------------------------------------------------------------+
+    | Table bar                                                              |
+    +------------------------------------------------------------------------+ */
+td.bar {
+  vertical-align: middle;
+  padding-left: 5px;
+  width: 115px;
+}
+.stat_bar {
+  padding: 3px 2px 3px 2px;
+}
+td.bar_space {
+  width: 1px;
+  height: 1.6154em;
+}
+/*  +------------------------------------------------------------------------+
+    | Table odd, even, select & mouseover                                    |
+    +------------------------------------------------------------------------+ */
+tr.odd {
+  height: 4em;
+  background-color: #111111;
+  -webkit-transition: all 300ms linear;
+  -moz-transition: all 300ms linear;
+  -o-transition: all 300ms linear;
+  transition: all 300ms linear;
+}
+tr.even {
+  height: 4em;
+  background-color: #111111;
+  -webkit-transition: all 300ms linear;
+  -moz-transition: all 300ms linear;
+  -o-transition: all 300ms linear;
+  transition: all 300ms linear;
+}
+tr.artist_list {
+  height: 3em;
+  background-color: #111111;
+}
+tr.artist_list td,
+tr.album_list td {
+  border-bottom: dotted 1px #171717;
+  padding: 7px 0;
+}
+tr.album_list td {
+  padding: 0;
+}
+tr.year {
+  height: 2.5em;
+  background-color: #111111;
+}
+tr.year td {
+  border-bottom: dotted 1px #171717;
+  padding: 7px 5px 7px 0;
+}
+tr.odd_ok {
+  height: 3.0769em;
+  background-color: #E9FFE9;
+  color: #000000;
+  -webkit-transition: all 300ms linear;
+  -moz-transition: all 300ms linear;
+  -o-transition: all 300ms linear;
+  transition: all 300ms linear;
+}
+tr.odd_info,
+tr.even_info,
+tr.odd_error,
+tr.even_error,
+tr.album_list {
+  height: 3em;
+}
+tr.select {
+  height: 4em;
+  background-color: #222222;
+  -webkit-transition: all 300ms linear;
+  -moz-transition: all 300ms linear;
+  -o-transition: all 300ms linear;
+  transition: all 300ms linear;
+}
+/*  +------------------------------------------------------------------------+
+    | Table various                                                          |
+    +------------------------------------------------------------------------+ */
+tr.list {
+  height: 4.1538em;
+}
+td.update_text {
+  width: 9.5em;
+}
+tr.screen_footer {
+  height: 2.3846em;
+  /* minimum 2x cell padding fullscreen plus text height */
+  text-align: center;
+  font-size: 0.8462em;
+  width: 100%;
+}
+#favoriteTable {
+  width: 100%;
+  padding: 1px;
+}
+/*  +------------------------------------------------------------------------+
+    | Table space & align                                                    |
+    +------------------------------------------------------------------------+ */
+td.tabspace {
+  width: 1px;
+}
+td.smallspace {
+  width: 0.3846em;
+}
+td.space {
+  width: 5px !important;
+  min-width: 5px;
+}
+.space {
+  width: 1px !important;
+}
+td.textspace {
+  width: 2.3077em;
+}
+td.counter {
+  width: 4em;
+}
+td.matrix {
+  width: 5em;
+  text-align: center;
+}
+td.matrix > div {
+  -webkit-transform: translate(0px, 10px) rotate(315deg);
+  transform: translate(0px, 10px) rotate(315deg);
+  -webkit-transform-origin: 50% 50%;
+  -moz-transform-origin: 50% 50%;
+  -ms-transform-origin: 50% 50%;
+  -o-transform-origin: 50% 50%;
+  transform-origin: 50% 50%;
+  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
+  display: inline-block;
+  width: 2.5em;
+}
+td.vert {
+  height: 6em;
+}
+tr.smallspace {
+  /* vertical space */
+  height: 0.3846em;
+}
+tr.space {
+  /* vertical space */
+  height: 0.769em;
+}
+tr.textspace {
+  /* vertical space */
+  height: 1.6154em;
+}
+/*  +------------------------------------------------------------------------+
+    | Image                                                                  |
+    +------------------------------------------------------------------------+ */
+img {
+  border: 0px;
+}
+img.align {
+  vertical-align: middle;
+}
+img.space,
+input.space {
+  vertical-align: middle;
+  margin: 0px 0.3846em 0px 0px;
+  position: relative;
+  top: -1px;
+}
+img.tiny {
+  vertical-align: middle;
+  margin: 0px 0px 0px 0.231em;
+  width: 0.769em;
+  height: 0.769em;
+}
+img.small {
+  width: 1.4615em;
+  height: 1.4615em;
+  vertical-align: middle;
+  position: relative;
+  top: -1px;
+  padding: 0.231em 0.231em 0.231em 0.231em;
+  opacity: 0.8;
+}
+img.small_tab_header {
+  vertical-align: middle;
+  position: relative;
+  top: -1px;
+}
+img.small_high {
+  width: 1.6154em;
+  height: 3.846em;
+}
+img.medium {
+  vertical-align: middle;
+  margin: 0px 0.769em 0px 0px;
+  width: 2em;
+  height: 2em;
+  opacity: 0.8;
+}
+/*  +------------------------------------------------------------------------+
+    | Form search                                                            |
+    +------------------------------------------------------------------------+ */
+#searchFormAll input,
+#searchFormAllMiddle input {
+  width: 100%;
+  display: table-cell;
+  font: inherit;
+  font-weight: 300;
+  font-size: 16px;
+  background-color: #fefefe;
+  border: none;
+  /* color: (@font-first); */
+  padding: 0 5px;
+  border-radius: 3px 0 0 3px;
+}
+#searchFormAll > div,
+#searchFormAllMiddle > div {
+  display: table;
+  width: 100%;
+  background-color: #67891e;
+  font-weight: normal;
+  border-radius: 3px;
+}
+#searchFormAll > div div,
+#searchFormAllMiddle > div div {
+  display: table-cell;
+  width: 3em;
+  text-align: center;
+  vertical-align: middle;
+  color: #fdf6e3;
+  cursor: pointer;
+}
+#searchFormAllMiddle {
+  display: table;
+  position: absolute;
+  right: 4px;
+  top: 4.05em;
+  width: 12em;
+  z-index: 20;
+}
+/*  +------------------------------------------------------------------------+
+    | Form                                                                   |
+    +------------------------------------------------------------------------+ */
+form,
+input,
+select {
+  margin: 0px;
+}
+input,
+select {
+  font-family: Roboto, Verdana, Geneva, Arial, Helvetica, sans-serif;
+  font-size: 16px;
+  border-radius: 3px;
+  border: solid 1px #bbb;
+  line-height: 1.7em;
+  padding: 4px;
+  background-color: #fefefe;
+}
+#updateDir,
+#randomDir {
+  width: 70%;
+}
+#comment {
+  margin-top: 1px;
+}
+#formSettings {
+  text-align: left;
+}
+input.button {
+  cursor: pointer;
+}
+input.readonly,
+select.readonly {
+  background: #B6D0DC;
+}
+input.login {
+  width: 11.5384em;
+}
+input.edit {
+  width: 13.4615em;
+}
+input.url {
+  width: 29.2308em;
+}
+input.autosugest,
+select.autosugest {
+  width: 27em;
+  border-radius: 0.3077em;
+  border: 1px solid #aaaaaa;
+}
+input.autosugest_readonly {
+  width: 29.2308em;
+  color: Silver;
+  height: 1.923em;
+  border-radius: 0.3077em;
+  border: 1px solid #aaaaaa;
+}
+input.search {
+  height: 2em;
+  border-radius: 0.3077em;
+  border: 1px solid #aaaaaa;
+}
+/*  +------------------------------------------------------------------------+
+    | overLIB                                                                |
+    +------------------------------------------------------------------------+ */
+div.overlib {
+  position: absolute;
+  visibility: hidden;
+  z-index: 1000;
+}
+.ol_foreground {
+  background-color: #a5a5a5;
+}
+.ol_background {
+  background-color: #161616;
+}
+.ol_caption {
+  font-family: Roboto, Verdana, Arial, Helvetica, sans-serif;
+  font-size: 0.769em;
+  font-weight: bold;
+  color: #a5a5a5;
+}
+.ol_text {
+  font-family: Roboto, Verdana, Arial, Helvetica, sans-serif;
+  font-size: 0.769em;
+  color: #161616;
+}
+div.ol_line {
+  border-top: 1px solid #161616;
+  margin-top: 0.3846em;
+  margin-bottom: 0.3077em;
+}
+/*  +------------------------------------------------------------------------+
+    | List                                                                   |
+    +------------------------------------------------------------------------+ */
+ul {
+  margin-top: 0.1538em;
+  margin-bottom: 0px;
+}
+/*  +------------------------------------------------------------------------+
+    | Font                                                                   |
+    +------------------------------------------------------------------------+ */
+span.nav_home {
+  font-size: 1.3846em;
+  font-family: tahoma, "Trebuchet MS", Verdana, Geneva, Arial, Helvetica, sans-serif;
+}
+span.nav_tree {
+  font-size: 0.9em;
+  letter-spacing: 1px;
+  width: 100%;
+  padding: 4px 0;
+  display: inline-block;
+  line-height: 3em;
+  text-transform: uppercase;
+  padding-left: 2px;
+  text-align: left;
+  color: #a5a5a5;
+}
+span.nav_genre {
+  font-size: 0.923em;
+  color: #666666;
+  width: 100%;
+}
+span.nav_seperation {
+  font-size: 0.923em;
+  font-weight: bold;
+  color: #b53d00;
+}
+span.seperation {
+  font-size: 0.923em;
+  color: #cccccc;
+}
+span.login_message {
+  font-size: 0.769em;
+}
+/*  +------------------------------------------------------------------------+
+    | Added by ArtS                                                          |
+    +------------------------------------------------------------------------+ */
+div.content {
+  position: relative;
+}
+.wrapper {
+  min-height: 100%;
+  margin-bottom: -4.2em;
+  /* margin-bottom: -3.2em; */
+  padding-bottom: 4px;
+}
+.wrapper:after {
+  content: "";
+  display: block;
+  width: 100%;
+  height: 6.4em;
+}
+.wrapper.miniplayer:after {
+  height: 10.4em;
+}
+.bottom {
+  height: 3.2em;
+  width: 100%;
+}
+.bottom.miniplayer {
+  position: relative;
+  bottom: 4em;
+}
+div.screen_footer {
+  font-size: 0.769em;
+  border-top: 0.3em solid #161616;
+  padding-top: 1.4em;
+  text-align: center;
+  background-color: #161616;
+  color: #a5a5a5;
+  width: 100%;
+  height: 100%;
+}
+div.mpd_title {
+  position: relative;
+  left: 0.769em;
+  font-size: 1.538em;
+}
+div.area {
+  color: #222222;
+  background-color: #161616;
+}
+div.out {
+  width: 200px;
+  height: 6px;
+  min-height: 4px;
+  background-color: #333333;
+  vertical-align: middle;
+  display: inline-block;
+  overflow: hidden;
+}
+div.out-popular,
+div.out-statistics {
+  width: 100px;
+  height: 6px;
+  min-height: 4px;
+  background-color: #333333;
+  vertical-align: middle;
+  display: inline-block;
+}
+div.in {
+  width: 0px;
+  height: 100%;
+  -webkit-transition: width 1s;
+  transition: width 1s;
+  background: -webkit-linear-gradient(left, #b53d00, #b53d00);
+  background: -moz-linear-gradient(left, #b53d00, #b53d00);
+  background: -o-linear-gradient(left, #b53d00, #b53d00);
+  background: -ms-linear-gradient(left, #b53d00, #b53d00);
+  background-color: #b53d00;
+}
+div.in-static {
+  width: 0px;
+  height: 100%;
+  background-color: #b53d00;
+}
+#bar-indicator {
+  position: absolute;
+  background-color: #b53d00;
+  border: 0px solid #b53d00;
+  border-radius: 50%;
+  width: 9px;
+  height: 9px;
+  display: none;
+}
+#bar-indicator-in {
+  position: absolute;
+  background-color: blue;
+  border: 1px solid blue;
+  border-radius: 50%;
+  width: 2px;
+  height: 2px;
+  top: 5px;
+  left: 5px;
+}
+.albums_container {
+  width: 100%;
+  margin: 5px auto;
+  line-height: 1px;
+}
+.full {
+  line-height: 1px;
+}
+div.tile {
+  overflow: hidden;
+  position: relative;
+  transition: all 100ms linear;
+}
+.tile {
+  width: 110px;
+  height: 110px;
+  display: inline-block;
+  margin: 0 0 1px 1px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+.tile_info {
+  padding: 0.4em;
+  font-size: 0.8em;
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  width: 100%;
+  background-color: #222222;
+  opacity: 0.85;
+  filter: alpha(opacity=85);
+}
+.tile_title,
+.tile_band {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  line-height: 1.5em;
+}
+.tile_title {
+  color: #ffffff;
+}
+.tile_band {
+  color: rgba(255, 255, 255, 0.7);
+}
+div.tile_space {
+  margin-bottom: 0.3846em;
+  float: left;
+  white-space: nowrap;
+}
+td.tile {
+  background-color: #161616;
+}
+div.trackNumber {
+  font-size: 1.3077em;
+  color: #a5a5a5;
+  text-align: center;
+  overflow: hidden;
+}
+div.footer_line {
+  width: 100%;
+  border-top: 0.2em solid #b53d00;
+}
+td.icon {
+  padding-left: 0.3em;
+  padding-right: 0em;
+  vertical-align: middle;
+  text-align: center;
+  width: 3em;
+  max-width: 3em;
+}
+td.iconDel {
+  padding-left: 5px;
+  padding-right: 5px;
+  vertical-align: middle;
+  width: 2em;
+  text-align: right;
+  cursor: pointer;
+}
+.icon-small {
+  font-size: 1.8em;
+  color: #777777;
+  vertical-align: middle;
+  margin: 0.2em 0.2em 0.2em 0;
+  line-height: 1.2em;
+}
+.icon-small-selected {
+  font-size: 1.8em;
+  color: #b53d00;
+  vertical-align: middle;
+}
+.icon-selected {
+  color: #b53d00;
+}
+.icon-selected-main-menu {
+  color: #b53d00;
+}
+.icon-ok {
+  color: #67891e;
+}
+.icon-nok {
+  color: #FF0000;
+}
+.icon-unava {
+  color: #a5a5a5;
+}
+.icon-anchor {
+  color: #fdf6e3;
+  cursor: pointer;
+}
+.icon-right {
+  margin-right: 0;
+  text-align: right;
+}
+.larger {
+  font-size: 1.33em;
+}
+img.menu_img {
+  width: 2.3077em;
+  height: 2.3077em;
+  vertical-align: middle;
+  position: relative;
+  top: -1px;
+}
+img.mpd_img {
+  width: 3.846em;
+  height: 3.846em;
+  vertical-align: top;
+  float: left;
+  position: relative;
+  top: -1px;
+}
+td.time {
+  /* padding-left: 0.4em; */
+  padding: 2px 2px 2px 5px;
+}
+td.time_w {
+  width: 3em;
+  max-width: 3em;
+}
+td.small_cover,
+td.small_cover_md {
+  width: 4em;
+  height: 4em;
+  line-height: 0;
+  padding: 0 !important;
+}
+td.small_cover_md + td {
+  padding-left: 10px;
+}
+td.trackNumber {
+  padding: 0px 0px 0 0;
+  text-align: center;
+  max-width: 2.5em;
+  width: 2.5em;
+  overflow: hidden;
+}
+td.play-indicator {
+  text-align: center;
+  font-size: 3em;
+  width: 45px !important;
+}
+.blackstar {
+  border: solid 1px;
+  border-radius: 3px;
+}
+.blackstar-selected {
+  background-color: #161616;
+}
+#trackOptions {
+  display: none;
+}
+#waitIndicator,
+#waitIndicatorImg {
+  background-color: rgba(50, 50, 50, 0.6);
+  z-index: 1000000000;
+}
+#waitIndicator {
+  display: none;
+  position: fixed;
+  top: 50%;
+  left: 50%;
+  width: 100%;
+  height: 100%;
+}
+#waitIndicatorImg {
+  position: absolute;
+  top: 0;
+  left: 0;
+}
+#divCenter {
+  display: none;
+  background: red;
+  position: fixed;
+  color: #a5a5a5;
+  top: 50%;
+  left: 50%;
+  padding: 15px;
+  -ms-transform: translateX(-50%) translateY(-50%);
+  -webkit-transform: translate(-50%, -50%);
+  transform: translate(-50%, -50%);
+  z-index: 1000;
+}
+#album-info {
+  margin: 0 0px;
+  overflow: hidden;
+  max-width: 100%;
+}
+.sign-play {
+  font-size: 4em;
+  color: #fdf6e3;
+  display: table-cell;
+  vertical-align: middle;
+  padding-right: 5px;
+}
+.quick-play {
+  font-size: 3.5em;
+  position: absolute;
+  right: 0;
+  bottom: 0;
+  opacity: 0.2;
+  padding: 0.02em 0.1em;
+  color: #fdf6e3;
+}
+#track-progress {
+  position: relative;
+  top: -1px;
+}
+#album-info-title {
+  font-size: 1.2em;
+  margin-bottom: 0.3em;
+  padding: 0;
+  color: #a5a5a5;
+}
+#album-info-artist {
+  font-size: 1em;
+}
+.col-right {
+  display: table-cell;
+  vertical-align: middle;
+  padding: 0 5px;
+  max-width: 100%;
+}
+.line {
+  border-bottom: 0px dashed #dedede;
+  padding-bottom: 7px;
+  margin-top: 7px;
+}
+.line-thin {
+  border-bottom: 1px solid #dedede;
+}
+#bar-popularity-out {
+  display: inline-block;
+}
+.add-info-left {
+  width: 25%;
+  display: inline-block;
+  clear: left;
+  text-transform: uppercase;
+  font-size: 0.9em;
+  color: #a5a5a5;
+}
+.add-info-right {
+  width: 70%;
+  display: inline-block;
+  clear: right;
+  color: #a5a5a5;
+}
+[id^=menu-track] {
+  position: relative;
+  cursor: pointer;
+  display: inline-block;
+}
+.menuSub {
+  display: none;
+  visibility: visible;
+  background-color: #141414;
+  cursor: pointer;
+  width: 100%;
+  overflow: hidden;
+  position: relative;
+  padding: 0 0 0 2.8em;
+  border-left: 5px solid #b53d00;
+  border-bottom: 1px solid #171717;
+}
+.menuSubLeft {
+  padding: 0;
+}
+.menuSubRight {
+  display: none;
+  visibility: visible;
+  background-color: #141414;
+  cursor: pointer;
+  width: 100%;
+  overflow: hidden;
+  position: relative;
+  padding: 0 5px 0 0;
+  border-right: 5px solid #b53d00;
+  border-bottom: 1px solid #171717;
+  text-align: right;
+}
+.menuSubStarSave {
+  padding: 0.2em;
+  border-top: solid 1px #111111;
+  border-bottom: solid 1px #111111;
+}
+.menuSubStarAdd {
+  padding: 0.2em;
+}
+[id^=menu-star-track] {
+  line-height: 3.5em;
+  cursor: auto;
+}
+[id^=menu-star-track] input,
+[id^=menu-star-track] select {
+  width: 15em;
+  max-width: 60%;
+  font-size: 1em;
+  background-color: #fefefe;
+}
+.pointer {
+  cursor: pointer;
+}
+.noselect {
+  -webkit-touch-callout: none;
+  -webkit-user-select: none;
+  -khtml-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+}
+.decade {
+  color: #b53d00;
+  padding: 0.5em;
+  margin: 0.5em 1px;
+  font-weight: bold;
+  line-height: 2em;
+}
+.right {
+  text-transform: unset !important;
+}
+h1 {
+  line-height: 3.5em;
+  background-color: #171717;
+  color: #a5a5a5;
+  font-weight: normal;
+  font-size: 0.9em;
+  vertical-align: middle;
+  padding: 0 4px;
+  margin: 0 0 1px 0;
+  position: relative;
+  text-transform: uppercase;
+}
+.total-time {
+  text-align: right;
+  font-size: 1rem;
+  padding-right: 2px;
+  font-weight: 300;
+}
+[id^=total_time],
+[id^=end_time],
+[id^=end_in] {
+  text-transform: uppercase;
+  opacity: 0.7;
+}
+.search_artist {
+  line-height: 1px;
+  padding: 3px 0px;
+  background-color: #111111;
+}
+.search_artist p {
+  padding-left: 4px;
+  line-height: 2em;
+}
+[id^=searchResults] {
+  display: none;
+}
+.back-to-top {
+  position: fixed;
+  bottom: 3.3em;
+  right: 10px;
+  height: 3.2em;
+  width: 3.2em;
+  text-decoration: none;
+  color: #fdf6e3;
+  background-color: rgba(246, 246, 246, 0.3);
+  font-size: 1em;
+  padding-left: 0.77em;
+  padding-top: 0.64em;
+  display: none;
+  cursor: pointer;
+  -moz-border-radius: 50%;
+  border-radius: 50%;
+}
+.back-to-top.miniplayer {
+  margin-bottom: 4em;
+}
+.back-to-top:hover {
+  display: inline-block;
+}
+#paginationGoTo {
+  font-size: 1em;
+  padding: 1px;
+  background-color: #67891e;
+  color: #fdf6e3;
+}
+.paginator-nav {
+  height: 3.4em;
+  background-color: rgba(235, 235, 235, 0);
+  position: relative;
+  display: inline-block;
+  float: left;
+  width: 100%;
+  text-align: center;
+  vertical-align: middle;
+}
+.paginator-nav span {
+  margin: 0.6em 0;
+}
+.buttons {
+  margin-bottom: 5px;
+}
+#usersTab {
+  overflow: auto;
+}
+.svg-filters {
+  position: absolute;
+  left: -9999px;
+}
+.update_info {
+  color: rgba(165, 165, 165, 0.5);
+  font-size: 0.9em;
+}
+.lh3 {
+  line-height: 3em;
+}
+.no-display {
+  display: none;
+}
+.break-word {
+  word-wrap: break-word;
+  white-space: normal !important;
+}
+.break-all {
+  word-break: break-all;
+  -ms-word-break: break-all;
+}
+.blink_me {
+  -webkit-animation-name: blinker;
+  -webkit-animation-duration: 2s;
+  -webkit-animation-timing-function: linear;
+  -webkit-animation-iteration-count: infinite;
+  -moz-animation-name: blinker;
+  -moz-animation-duration: 2s;
+  -moz-animation-timing-function: linear;
+  -moz-animation-iteration-count: infinite;
+  animation-name: blinker;
+  animation-duration: 2s;
+  animation-timing-function: linear;
+  animation-iteration-count: infinite;
+}
+@-moz-keyframes blinker {
+  0% {
+    opacity: 1.0;
+  }
+  80% {
+    opacity: 0.1;
+  }
+  100% {
+    opacity: 1.0;
+  }
+}
+@-webkit-keyframes blinker {
+  0% {
+    opacity: 1.0;
+  }
+  80% {
+    opacity: 0.1;
+  }
+  100% {
+    opacity: 1.0;
+  }
+}
+@keyframes blinker {
+  0% {
+    opacity: 1.0;
+  }
+  80% {
+    opacity: 0.1;
+  }
+  100% {
+    opacity: 1.0;
+  }
+}
+#discBrowser {
+  overflow: hidden;
+  white-space: nowrap;
+  text-align: left;
+  display: none;
+  padding-bottom: 5px;
+  overflow-x: auto;
+}
+.imgThumb {
+  width: 4em;
+  height: 4em;
+  display: inline-block;
+  margin: 0 3px 3px 0;
+  white-space: normal;
+  cursor: pointer;
+  vertical-align: top;
+}
+.selected {
+  border-bottom: solid 4px #b53d00;
+  box-sizing: content-box;
+}
+.fileBrowserItemName {
+  text-overflow: ellipsis;
+  overflow: hidden;
+  white-space: nowrap;
+  width: 100%;
+}
+#miniplayer {
+  position: fixed;
+  bottom: 0;
+  height: 4.2em;
+  width: 100%;
+  background-color: #161616;
+  max-width: 1280px;
+  border-top: 1px solid #303030;
+}
+#image_container_mini,
+#image_in_mini {
+  width: 4em;
+  height: 4em;
+}
+#media_control_mini {
+  min-width: 10em;
+  max-width: 10em;
+  width: 10em;
+  padding-left: 5px;
+  display: none;
+  vertical-align: middle;
+}
+#file-info-mini,
+#image_container_mini {
+  display: table-cell;
+  vertical-align: middle;
+}
+#file-info-mini {
+  color: #a5a5a5;
+  padding-left: 8px;
+  /* max-width: 10em; */
+  line-height: 1.7em;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+}
+.artist_mini,
+#track_number {
+  font-size: 0.9em;
+  line-height: 1.5em;
+}
+.track_title_mini {
+  font-size: 1.1em;
+}
+.artist_mini,
+.track_title_mini {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+.artist_bio_pic {
+  background-size: 200000% 200000%;
+  height: 270px;
+  padding: 10px 0;
+  text-align: center;
+}
+.artist_bio_pic img {
+  display: block;
+  margin-left: auto;
+  margin-right: auto;
+  width: 100%;
+  max-width: 250px;
+  border-radius: 10%;
+}
+.artist_bio_pic_not_found {
+  font-size: 210px;
+  width: 260px;
+  border-radius: 10px;
+  background-color: #161616;
+  display: inline-block;
+  max-height: 260px;
+  color: #ffffff;
+}
+.artist_bio_text {
+  margin-top: 5px;
+}
+.artist_bio_source {
+  margin-bottom: 5px;
+}
+.artist_bio_related {
+  overflow: hidden;
+  /* max-height: 100px; */
+  height: 9em;
+  white-space: nowrap;
+  overflow-x: scroll;
+}
+.artist_bio_related img {
+  width: 6em;
+  display: block;
+  margin-left: auto;
+  margin-right: auto;
+  /* border-radius: 10%; */
+}
+.artist_related {
+  display: inline-block;
+  margin: 0 1em;
+  width: 6em;
+}
+.artist_related div {
+  white-space: nowrap;
+  text-align: center;
+  text-overflow: ellipsis;
+  overflow: hidden;
+  margin-top: 3px;
+}
+.artist_related .artist_container_small {
+  border-radius: 10px;
+  background-color: #161616;
+  color: #ffffff;
+}
+#timebar_mini {
+  width: 0px;
+  height: 2px;
+  background-color: #b53d00;
+}
+.shadow-down {
+  box-shadow: 0px 4px 7px 0px rgba(0, 0, 0, 0.6);
+  transition: box-shadow 0.3s ease-in-out;
+}
+.shadow-up {
+  box-shadow: 0px -4px 7px 0px rgba(0, 0, 0, 0.6);
+  transition: box-shadow 0.3s ease-in-out;
+}
+.small_cover_sub {
+  height: 3em;
+  width: 3em;
+  margin-right: 10px;
+}
+@font-face {
+  font-family: Roboto;
+  src: url(fonts/Roboto/Roboto-Regular.ttf);
+  font-weight: 400;
+}
+@font-face {
+  font-family: Roboto;
+  src: url(fonts/Roboto/Roboto-Light.ttf);
+  font-weight: 300;
+}
+/* Main background */
+/* Sub background */
+/* Categories background (headers, footers, album/now playing) */
+/* Background color of track in tracklist/playlist */
+/* Background playlist current track */
+/* Background of track submenu */
+/* Main banner background */
+/* Main sub banner background */
+/* Main sub sub banner background */
+/* Sub banner background */
+/* Sub sub banner background */
+/* Footer background */
+/* Background of forms */
+/* Separators in subbanner */
+/* fonts */
+/* tabs */
+/* buttons */
+/* buttons in add/save playlist menu and submenus */
+/* buttons in select player, paginator, favorites, etc.*/
+/* buttons in Now Playing: ff, play/pause, etc. */
+/* logo */
+/* playing bars */
+/* Active color */
+/* Player buttons outline */
diff --git a/skin/ompd_darker/styles.less b/skin/ompd_darker/styles.less
new file mode 100644
index 0000000..c3104db
--- /dev/null
+++ b/skin/ompd_darker/styles.less
@@ -0,0 +1,114 @@
+/*  +------------------------------------------------------------------------+
+    | styles.css                                                             |
+    +------------------------------------------------------------------------+ */
+
+@import url("./../styles_inc.less");
+
+@font-face {
+    font-family: Roboto;
+    src: url(fonts/Roboto/Roboto-Regular.ttf);
+		font-weight: 400;
+}
+
+@font-face {
+    font-family: Roboto;
+    src: url(fonts/Roboto/Roboto-Light.ttf);
+		font-weight: 300;
+}
+
+/* Main background */
+@bg-main: #000;
+
+/* Sub background */
+@bg-sub: #161616;
+
+/* Categories background (headers, footers, album/now playing) */
+@bg-categories: #171717;
+
+/* Background color of track in tracklist/playlist */
+@bg-track: #111;
+
+/* Background playlist current track */
+@bg-playlist-active: #222;
+@bg-track-playing-active: #b53d00;
+
+/* Background of track submenu */
+@bg-track-submenu: #141414;
+
+/* Main banner background */
+@bg-banner: #161616;
+
+/* Main sub banner background */
+@bg-sub-banner-2: #161616;
+
+/* Main sub sub banner background */
+@bg-sub-sub-banner-2: lighten(@bg-sub-banner-2, 5%);
+
+/* Sub banner background */
+@bg-sub-banner: #4e6819;
+
+/* Sub sub banner background */
+@bg-sub-sub-banner: lighten(@bg-sub-banner, 3%);
+
+/* Footer background */
+@bg-footer: #161616;
+
+/* Background of forms */
+@bg-forms: #fefefe;
+@bg-forms-banner: #fefefe;
+
+/* Separators in subbanner */
+@separator-sub-banner: #cccccc;
+
+/* fonts */
+@font-first: #a5a5a5;
+@font-active: #fdf6e3;
+@font-banner: #a5a5a5;
+@font-categories: @font-banner;
+@font-tags: #fdf6e3;
+@font-search-button: #fdf6e3;
+@font-sub-banner: #fdf6e3;
+@font-sub-sub-banner: #fdf6e3;
+@font-sub-button: #fdf6e3;
+@font-album-title-library: #ffffff;
+@font-artist-library: fade(@font-album-title-library, 70%);
+@font-track-playing: #fdf6e3;
+@font-track-playing-active: #fdf6e3;
+@font-album-title-playing: #a5a5a5;
+
+/* tabs */
+@tab-selected: #b53d00; 
+@tab: #2f3439;
+
+/* buttons */
+@button: #777777;
+@button-banner: #a5a5a5;
+@button-banner-active: #fdf6e3;
+
+/* buttons in add/save playlist menu and submenus */
+@button-sub: #777777;
+
+/* buttons in select player, paginator, favorites, etc.*/
+@button-nav: #67891e;
+@button-quick-play: #fdf6e3;
+
+/* buttons in Now Playing: ff, play/pause, etc. */
+@button-playlist: #161616;
+@button-playlist-off: #a5a5a5;
+@button-playlist-on: #b53d00;
+
+/* logo */
+@logo-first-color: #3498db;
+@logo-second-color: #fdf6e3;
+
+/* playing bars */
+@playing-bar: #b53d00;
+@bg-playing-bar: #333;
+@volume-bar: @playing-bar;
+
+/* Active color */
+@active-nav: #b53d00;
+@active-banner: #b53d00;
+
+/* Player buttons outline */
+@player-button-outline: true;	
diff --git a/skin/ompd_darker/template.footer.php b/skin/ompd_darker/template.footer.php
new file mode 100644
index 0000000..54bf4f5
--- /dev/null
+++ b/skin/ompd_darker/template.footer.php
@@ -0,0 +1,167 @@
+<?php
+//  +------------------------------------------------------------------------+
+//  | template.footer.php                                                    |
+//  +------------------------------------------------------------------------+
+//  | Do NOT close the body and html tag!                                    |
+//  | This is done by the footer.inc.php script to allow dynamic content.    |
+//  +------------------------------------------------------------------------+
+if (isset($footer) == false)
+	exit();
+?>
+<!-- begin footer -->
+	</td>
+	<td class="side-margin"></td>	
+</tr>
+<tr>
+	<td colspan="3" height="0"></td>
+</tr>
+</table>
+</div><!-- end content -->
+	
+	</td>
+</tr>
+</table>
+
+<?php 
+if (!isset($cfg['items_count'])) $cfg['items_count'] = 0;
+$curr_page = (get('page') ? get('page') : 1);
+$whole_pages = floor($cfg['items_count'] / $cfg['max_items_per_page']);
+$rest_items = ($cfg['items_count'] % $cfg['max_items_per_page']);
+($rest_items == 0) ? $last_page = $whole_pages : $last_page = ($whole_pages + 1);
+
+$url1 = $_SERVER["QUERY_STRING"];
+
+$str = parse_str($url1, $output);
+
+isset($output['action']) ? '' : $output['action'] = "viewNew";
+
+$output['page'] = "1";
+$url_first_page = $_SERVER["SCRIPT_NAME"] . "?" . http_build_query($output);
+
+$output['page'] = $curr_page - 1;
+$url_prev_page = $_SERVER["SCRIPT_NAME"] . "?" . http_build_query($output);
+
+$output['page'] = $curr_page + 1;
+$url_next_page = $_SERVER["SCRIPT_NAME"] . "?" . http_build_query($output);
+
+$output['page'] = $last_page;
+$url_last_page = $_SERVER["SCRIPT_NAME"] . "?" . http_build_query($output);
+
+
+if ($last_page > 1) {
+?>
+
+<div class="paginator-nav">
+
+
+
+<?php if ($curr_page == 1) { ?>
+	<span><i class="fa fa-angle-double-left"></i></span>
+<?php 
+} 
+else {
+?>
+	<a href="<?php echo $url_first_page ?>"><span><i class="fa fa-angle-double-left"></i></span></a>
+<?php }?>
+
+
+
+
+<?php if ($curr_page == 1) { ?>
+	<span><i class="fa fa-angle-left"></i></span>
+<?php 
+} 
+else {
+?>
+	<a href="<?php echo $url_prev_page ?>"><span><i class="fa fa-angle-left"></i></span></a>
+<?php }?>
+
+
+<span> Page 
+<select id="paginationGoTo">
+	<?php 
+	for ($k=1; $k <= $last_page; $k++) {
+		$output['page'] = $k;
+		$url_page = $_SERVER["SCRIPT_NAME"] . "?" . http_build_query($output);
+		$sel = '';
+		if ($k == $curr_page) $sel = ' selected';
+		echo '<option value="' . $url_page . '"' . $sel . '>' . $k . '</option>';
+	}
+	?>
+</select>
+
+<script>
+$("#paginationGoTo").change(function()
+{
+    document.location.href = $(this).val();
+});
+</script>
+<?php echo " of " . $last_page?> </span>
+
+<!--
+<?php echo $curr_page . " of " . $last_page?> </span>
+-->
+
+<?php if ($curr_page == $last_page) { ?>
+	<span><i class="fa fa-angle-right"></i></span>
+<?php 
+} 
+else {
+?>
+	<a href="<?php echo $url_next_page ?>"><span><i class="fa fa-angle-right"></i></span></a>
+<?php }?>
+
+
+<?php if ($curr_page == $last_page) { ?>
+	<span><i class="fa fa-angle-double-right"></i></span>
+<?php 
+} 
+else {
+?>
+	<a href="<?php echo $url_last_page ?>"><span><i class="fa fa-angle-double-right"></i></span></a>
+<?php }?>
+
+
+
+</div>
+
+<?php 
+}
+$cfg['items_count'] = 0 ?>
+
+</div> <!-- wrapper -->
+
+<pre>
+<?php
+//var_dump($_SERVER);
+?>
+</pre>
+
+
+<div class="bottom">
+	<div class="screen_footer">	
+		<?php echo $footer; ?>
+	</div>
+</div>
+
+<div class="back-to-top"><i class="fa fa-2x fa-arrow-circle-o-up"></i></div>
+
+<?php
+$action = get('action');
+if (NJB_SCRIPT != 'playlist.php' && strpos($action,'layerProfile') === false  && $action != 'license' && NJB_SCRIPT != 'message.php' && $cfg['username'] != '' && $cfg['show_miniplayer']) {
+$hasAccess = simpleAuthenticate('access_play');
+if ($hasAccess == 1) {
+?>
+	<div id="miniplayer">
+		<?php 
+		require_once('playlist-mini.php');
+		?>
+	</div>
+<?php
+}
+}
+?>
+
+
+
+
diff --git a/skin/ompd_darker/template.header.php b/skin/ompd_darker/template.header.php
new file mode 100644
index 0000000..bb58fa3
--- /dev/null
+++ b/skin/ompd_darker/template.header.php
@@ -0,0 +1,930 @@
+<?php
+//  +------------------------------------------------------------------------+
+//  | template.header.php                                                    |
+//  +------------------------------------------------------------------------+
+if (isset($header) == false)
+	exit();
+
+require_once('include/play.inc.php');
+
+?>
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="UTF-8"> 
+<meta name="viewport" content="width=device-width, initial-scale: 1, minimal-ui" />
+<meta name="mobile-web-app-capable" content="yes" />
+<meta name="theme-color" content="#1f2429" />
+<link rel="icon" type="image/png" sizes="196x196" href="image/favicon.png?v=2">
+
+
+<script type="text/javascript" src="jquery/jquery-3.4.1.min.js"></script>
+<script type="text/javascript" src="javascript-src/spin.min.js"></script>
+<script type="text/javascript" src="javascript-src/arts.functions.js?<?php echo filemtime('javascript-src/arts.functions.js') ?>"></script>
+<script type="text/javascript" src="javascript-src/jquery.longpress.js"></script>
+
+<?php
+$query1=mysqli_query($db,'SELECT player.player_name as pl, player.player_host as host, player.player_port as port FROM player, session WHERE (sid = BINARY "' . cookie('netjukebox_sid') . '") and player.player_id=session.player_id');
+$session1 = mysqli_fetch_assoc($query1);
+$player1=$session1['pl'];
+$player1_host=$session1['host'];
+$player1_port=$session1['port'];
+?>
+
+<script type="text/javascript">
+
+//global variables
+var previous_volume;
+var $tileCount = 3;
+var $tileSize = 0;
+var $tileSizeArr = calcTileSize();
+$tileSize = $tileSizeArr[0];
+$containerWidth = $tileSizeArr[1];
+var $useMaxWidth = false;
+
+var opts = {
+  lines: 13, // The number of lines to draw
+  length: 21, // The length of each line
+  width: 10, // The line thickness
+  radius: 28, // The radius of the inner circle
+  corners: 0.6, // Corner roundness (0..1)
+  rotate: 43, // The rotation offset
+  direction: 1, // 1: clockwise, -1: counterclockwise
+  color: '#fff', // #rgb or #rrggbb
+  speed: 1, // Rounds per second
+  trail: 36, // Afterglow percentage
+  shadow: false, // Whether to render a shadow
+  hwaccel: true, // Whether to use hardware acceleration
+  className: 'spinner', // The CSS class to assign to the spinner
+  zIndex: 2e9, // The z-index (defaults to 2000000000)
+  top: 'auto', // Top position relative to parent in px
+  left: 'auto' // Left position relative to parent in px
+};
+
+var spinnerImg = new Spinner(opts);
+
+//adding swipe support
+//$.fn.swipe.defaults.excludedElements = "input, textarea, .noSwipe";
+//$.fn.swipe.defaults.threshold = $(window).width() * 0.2;
+$(function() {    
+		
+	
+	<?php
+	switch (strtolower($cfg['menu'])) {
+		case "library":
+			echo 'nextP = "playlist.php";
+			prevP = "config.php";';
+			break;
+		case "playlist":
+			echo 'nextP = "favorite.php";
+			prevP = "index.php";';
+			break;
+		case "favorite":
+			echo 'nextP = "config.php";
+			prevP = "playlist.php";';
+			break;
+		case "about":
+		case "config": 
+			echo 'nextP = "index.php";
+			prevP = "favorite.php";';
+			break;
+	}
+	?>
+	/* uncomment this if you want to use swipe on touch screens	
+	if (nextP && prevP) { 
+      $(document).swipe( {
+        swipeLeft:function(event, direction, distance, duration, fingerCount, fingerData) {
+			if (duration < 1000) window.location.href = nextP; 
+        },
+		swipeRight:function(event, direction, distance, duration, fingerCount, fingerData) {
+			if (duration < 1000) window.location.href = prevP; 
+        }
+      });
+    };
+	*/
+});
+	
+
+function changePlayer(player_id) {
+	$.ajax({
+			type: "GET",
+			url: "ajax-change-player.php",
+			data: { 'player_id': player_id, 'sid': '<?php echo $cfg['sid']; ?>'},
+			dataType : 'json',
+			success : function(json) {
+				$("#activePlayer").html(json['player']);
+				var winLoc = location.href;
+				var n = winLoc.indexOf("playlist.php");
+				var m = winLoc.indexOf("message.php");
+				if (n>0 || m>0) {
+					window.location = "playlist.php";
+				};
+				var f = winLoc.indexOf("favorite.php");
+				if (f>0) {
+					window.location = "favorite.php";
+				};
+				var o = winLoc.indexOf("config.php?action=playerProfile");
+				if (o>0) {
+					window.location = "config.php?action=playerProfile";
+				};
+				toggleChangePlayer();
+			},
+			error : function() {
+			}	
+		});
+};
+
+function playlistAction(action) {
+	switch(action){
+		case "Sync":
+			$('[id="playlistSync"] > i').removeClass('fa-refresh').addClass('fa-cog fa-spin');
+			break;
+		case "Copy":
+			$('[id="playlistCopy"] > i').removeClass('fa-files-o').addClass('fa-cog fa-spin');
+			break;
+		case "Add":
+			$('[id="playlistAdd"] > i').removeClass('fa-plus-circle').addClass('fa-cog fa-spin');
+			break;
+	}
+	
+	$.ajax({
+			type: "GET",
+			url: "ajax-playlist-sync.php",
+			data: { 'action': action, 'source': $('#selectSource').val(), 'dest': $('#selectDest').val()},
+			dataType : 'json',
+			success : function(json) {
+				if(json.action_status) {
+							$('[id="playlist' + action + '"] > i').removeClass('fa-cog fa-spin icon-selected').addClass('fa-check-square');
+						} 
+						else {
+							$('[id="playlist' + action + '"] > i').removeClass('fa-cog fa-spin icon-selected').addClass('fa-exclamation-circle icon-nok');
+						}
+				switch(action){
+					case "Sync":
+						if(json.action_status) {
+							setTimeout(function(){
+							  $('[id="playlistSync"] > i').removeClass('fa-check-square icon-ok').addClass('fa-refresh');
+							}, 2000);
+						} 
+						else {
+							setTimeout(function(){
+							  $('[id="playlistSync"] > i').removeClass('fa-exclamation-circle icon-nok').addClass('fa-refresh');
+							}, 2000);
+						}
+						break;
+					case "Copy":
+						if(json.action_status) {
+							setTimeout(function(){
+							  $('[id="playlistCopy"] > i').removeClass('fa-check-square icon-ok').addClass('fa-files-o');
+							}, 2000);
+						} 
+						else {
+							setTimeout(function(){
+							  $('[id="playlistCopy"] > i').removeClass('fa-exclamation-circle icon-nok').addClass('fa-files-o');
+							}, 2000);
+						}
+						break;
+					case "Add":
+						if(json.action_status) {
+							setTimeout(function(){
+							  $('[id="playlistAdd"] > i').removeClass('fa-check-square icon-ok').addClass('fa-plus-circle');
+							}, 2000);
+						} 
+						else {
+							setTimeout(function(){
+							  $('[id="playlistAdd"] > i').removeClass('fa-exclamation-circle icon-nok').addClass('fa-plus-circle');
+							}, 2000);
+						}
+						break;
+				}
+			},
+			error : function() {
+			}	
+		});
+};
+
+
+
+//$(document).ready(function () {}) - since jQuery 3.0 is deprecated. 
+//$(function () {}) is recommended
+$(function () {
+	<?php 
+	// to prevent recursive call: issue#5
+	if (NJB_SCRIPT != 'message.php') { 
+	?>
+	
+	ajaxRequest('ajax-evaluate-status.php', evaluateVolume);
+	
+	<?php 
+	}; 
+	?>
+	
+	setMaxWidth();
+	$tileSizeArr = calcTileSize();
+	<?php
+	global $tileSizePHP;
+	if (!$tileSizePHP) echo 'resizeTile($tileSizeArr[0],$tileSizeArr[1]);';
+	?>
+
+	resizeSuggested($tileSizeArr[0],$tileSizeArr[1]);
+	resizeUsersTab($tileSizeArr[0],$tileSizeArr[1]);
+	changeTileSizeInfo();
+	addFavSubmenuActions();
+	resizeImgContainer();
+	<?php
+	$action = $_GET['action'];
+	if (NJB_SCRIPT != 'playlist.php' && strpos($action,'layerProfile') === false && $action != 'license' && NJB_SCRIPT != 'message.php' && $cfg['username'] != '' && $cfg['show_miniplayer']) {
+	?>
+		setMiniplayer();
+	<?php
+	}
+	?>
+	//edit settings on config page
+	if (typeof myCodeMirror !== 'undefined') {
+		resizeFormSettings($tileSizeArr[1], myCodeMirror);
+	};
+	//hideAddressBar();
+	
+	//spinner for image
+	var targetImg = document.getElementById('waitIndicatorImg');
+	if (targetImg != null) {
+		showSpinnerImg(targetImg, spinnerImg);
+	}
+	
+	/* $("#image_in").one("load", function() {
+		$("#waitIndicatorImg").hide();
+	}).each(function() {
+		if(this.complete) $(this).load();
+	}); */
+	
+	$("#image_in").ready(function() {
+		$("#waitIndicatorImg").hide();
+	});
+	
+	$(window).scroll(function() {     
+		var scroll = $(window).scrollTop();
+		//var toScroll = $( "table[class='menu_middle']" ).height();
+		var toScroll = 0;
+		if (scroll > toScroll) {
+			$("#miniplayer").addClass("shadow-up");
+			$("#fixedMenu").addClass("shadow-down");
+		}
+		else {
+			$("#miniplayer").removeClass("shadow-up");
+			$("#fixedMenu").removeClass("shadow-down");
+		}
+	});
+	
+	$(window).resize(function() {
+		setMaxWidth();
+    $tileSizeArr = calcTileSize();
+		resizeTile($tileSizeArr[0],$tileSizeArr[1]);
+		changeTileSizeInfo();
+		//hideAddressBar();
+		resizeImgContainer();
+		//edit settings on config page
+		if (typeof myCodeMirror !== 'undefined') {
+			resizeFormSettings($tileSizeArr[1], myCodeMirror);
+		};
+		//resizeSuggested($tileSize,$containerWidth);
+    });
+	
+
+		//var offset = 0.6 * $(window).height();
+		var offset = 0.6 * window.innerHeight;
+    var duration = 500;
+    $(window).scroll(function() {
+        if ($(this).scrollTop() > offset) {
+            $('.back-to-top').fadeIn(duration);
+        } else {
+            $('.back-to-top').fadeOut(duration);
+        }
+    });
+    
+    $('.back-to-top').click(function(event) {
+        event.preventDefault();
+        $('html, body').animate({scrollTop: 0}, duration);
+        return false;
+    })
+	
+	$('[id^="add_"]').click(function(){
+		$(this).removeClass('fa-plus-circle').addClass('fa-cog fa-spin icon-selected');
+	});
+	
+	$('[id^="play_"]').click(function(){
+		$(this).removeClass('fa-play-circle-o').addClass('fa-cog fa-spin icon-selected');
+	});
+	
+	
+	$('[id^="saveCurrent"]').click(function(){
+		resetSaveCurrentOptions();
+		$(this).find('i').removeClass("fa-circle-o").addClass("fa-check-circle-o");
+		if ($(this).attr('id') == 'saveCurrentTrack') {
+			$("#trackOptions").slideDown( "slow", function() {});
+			getFavoritesList(current_track_id,current_track_mpd_url);
+		}
+		else {
+			$("#trackOptions").slideUp( "slow", function() {});
+			getFavoritesList();
+		}
+		//$('#savePlaylistAsName').focus();
+	});
+	
+	$('a').click(function(){
+		if (this.hasAttribute('id')) {
+			if ($(this).attr('id').indexOf("_title") > -1) {
+				//$("#play i").removeClass('fa-play fa-pause fa-stop').addClass('fa-cog fa-spin');
+			}
+		}
+		$(this).find('> i[id^="play_"]').removeClass('fa-play-circle-o').addClass('fa-cog fa-spin icon-selected');
+		$(this).find('> i[id^="add_"]').removeClass('fa-plus-circle').addClass('fa-cog fa-spin icon-selected');
+		$(this).find('> i[id^="insertPlay_"]').removeClass('fa-play-circle').addClass('fa-cog fa-spin icon-selected');
+		$(this).find('> i[id^="insert_"]').removeClass('fa-indent').addClass('fa-cog fa-spin icon-selected');
+		$(this).find('> i[id^="playTo_"]').removeClass('fa-share-square-o').addClass('fa-cog fa-spin icon-selected');
+		$(this).find('> i[id^="randomPlay"]').removeClass('fa-random').addClass('fa-cog fa-spin icon-selected');
+	});
+	
+	$('#playlistSync').click(function(){
+		playlistAction('Sync');
+	});
+	
+	$('#playlistCopy').click(function(){
+		playlistAction('Copy');
+	});
+	
+	$('#playlistAdd').click(function(){
+		playlistAction('Add');
+	});
+	
+	$('#playlistAddTo').click(function(){
+		playlistSave('AddTo','',current_track_id,'<?php echo $player1_host; ?>','<?php echo $player1_port; ?>',current_track_mpd_url);
+	});
+	
+	$('#playlistSaveAs').click(function(){
+		playlistSave('SaveAs','',current_track_id,'<?php echo $player1_host; ?>','<?php echo $player1_port; ?>',current_track_mpd_url);
+	});
+	
+	$('#addUrlAddress').keypress(function(event) {
+		  if ( event.which == 13 ) {
+			 $('#playlistAddUrl').click();
+		  }
+	});
+	
+	$('#savePlaylistAsName').keypress(function(event) {
+		  if ( event.which == 13 ) {
+			 $('#playlistSaveAs').click();
+		  }
+	});
+	
+	$('#savePlaylistComment').keypress(function(event) {
+		  if ( event.which == 13 ) {
+			 $('#playlistSaveAs').click();
+		  }
+	});
+	
+	$('#playlistAddUrl').click(function(){
+		$('#playlistAddUrl > i').removeClass('fa-plus-circle').addClass('fa-cog fa-spin');
+		$.ajax({
+			type: "GET",
+			url: "play.php",
+			data: { 'action': 'addSelectUrl', 'url': $('#addUrlAddress').val()},
+			dataType : 'json',
+			success : function(json) {
+				if (json.addResult == 'add_OK') {
+					$('[id="playlistAddUrl"] > i').removeClass('fa-cog fa-spin icon-selected').addClass('fa-check-square');
+					setTimeout(function(){
+					  $('[id="playlistAddUrl"] > i').removeClass('fa-check-square icon-ok').addClass('fa-plus-circle');
+					}, 2000);
+				}
+				else {
+					$('[id="playlistAddUrl"] > i').removeClass('fa-cog fa-spin icon-selected').addClass('fa-exclamation-circle icon-nok');
+					setTimeout(function(){
+					  $('[id="playlistAddUrl"] > i').removeClass('fa-exclamation-circle icon-nok').addClass('fa-plus-circle');
+					}, 2000);
+				} 
+			},
+			error: function() {
+				$('[id="playlistAddUrl"] > i').removeClass('fa-cog fa-spin icon-selected').addClass('fa-exclamation-circle icon-nok');
+				setTimeout(function(){
+				  $('[id="playlistAddUrl"] > i').removeClass('fa-exclamation-circle icon-nok').addClass('fa-plus-circle');
+				}, 2000);
+			}
+		});
+		//$('#menuSubMiddleMediaAddUrl input').first().focus();
+	});
+	
+	$('#playRandomFile').click(function(){
+		$('#playRandomFile > i').removeClass('fa-play-circle-o').addClass('fa-cog fa-spin');
+		$.ajax({
+			type: "GET",
+			url: "ajax-random-files.php",
+			data: { 'dir': $('#randomDir').val(), 
+					'limit': $('#randomLimit').val()
+					},
+			dataType : 'json',
+			success : function(json) {
+				if (json.random_files_result == 'random_files_OK') {
+					window.location.href = "playlist.php";
+				}
+				else {
+					$('[id="playRandomFile"] > i').removeClass('fa-cog fa-spin icon-selected').addClass('fa-exclamation-circle icon-nok');
+					setTimeout(function(){
+					  $('[id="playRandomFile"] > i').removeClass('fa-exclamation-circle icon-nok').addClass('fa-play-circle-o');
+					}, 2000);
+					$('#errorMessage').text(json.random_files_result);
+				} 
+			},
+			error: function() {
+				$('[id="playRandomFile"] > i').removeClass('fa-cog fa-spin icon-selected').addClass('fa-exclamation-circle icon-nok');
+				setTimeout(function(){
+				  $('[id="playRandomFile"] > i').removeClass('fa-exclamation-circle icon-nok').addClass('fa-play-circle-o');
+				}, 2000);
+			}
+		});
+		//$('#menuSubMiddleMediaAddUrl input').first().focus();
+	});
+	
+	$('#randomBrowse').click(function(){
+		var t = $('#randomDir').val();
+		t = t.replace(/&/g,'ompd_ampersand_ompd');
+		t = t.replace(/=/g,'%3D');
+		t = t.replace(/\+/g,'%2B');
+		
+		window.location.href = "browser.php?showSelect=true&dir=" + t;
+	});
+	
+	$('#updateSelectedDir').click(function(){
+		$('#updateSelectedDir > i').removeClass('fa-refresh').addClass('fa-cog fa-spin');
+		var t = $('#updateDir').val();
+		t = t.replace(/&/g,'ompd_ampersand_ompd');
+		t = t.replace(/=/g,'%3D');
+		t = t.replace(/\+/g,'%2B');
+		
+		window.location.href = "update.php?action=update&sign=<?php echo $cfg['sign'] ;?>&dir_to_update=" + t;
+	});
+	
+	$('#updateAll').click(function(){
+		$('#updateAll > i').removeClass('fa-refresh').addClass('fa-cog fa-spin');
+		window.location.href = "update.php?action=update&sign=<?php echo $cfg['sign'] ;?>";
+	});
+	
+	$('#updateBrowse').click(function(){
+		var t = $('#updateDir').val();
+		t = t.replace(/&/g,'ompd_ampersand_ompd');
+		t = t.replace(/=/g,'%3D');
+		t = t.replace(/\+/g,'%2B');
+		
+		window.location.href = "browser.php?showUpdateSelect=true&dir=" + t;
+	});
+	
+	$('#deletePlayed').longpress(function(e) {
+		
+		ajaxRequest('play.php?action=consume',evaluateConsume);
+		if ($('#deletePlayed').text() == "delete played [Auto]") {
+			ajaxRequest('play.php?action=consume&consume=0',evaluateConsume);
+		}
+		else {
+			ajaxRequest('play.php?action=consume&consume=1',evaluateConsume);
+		}
+	}, function(e) {
+			ajaxRequest('play.php?action=deletePlayed&menu=playlist');
+	});	
+	
+});
+
+
+function evaluateConsume(data){
+	if (data.consume == '1') {
+		$('#deletePlayed').text("delete played [Auto]");
+	}
+	else {
+		$('#deletePlayed').text("delete played");
+	}
+}
+
+function evaluateVolume(data) {
+	if (typeof data.player != 'undefined') {
+		player = data.player;
+		$('#activePlayer').html(player);
+	}
+	if (typeof data.volume != 'undefined') {
+		volume = data.volume;
+	}
+	else {
+		volume = data;
+	}
+	<?php $max_volume = 100; ?>
+	if (volume < 0) {
+		//volume setting not available
+		$('#currentVolume').html('---');
+		$('#volumeBar').width(0);
+		$('#setVolume').attr('onclick','').unbind('click');
+	}
+	else {
+		var volume_percentage = Math.round(100 * volume / <?php echo $max_volume; ?>);
+		var maxWidth = $('#volumeValue').width();
+		var width = Math.round(maxWidth * volume / <?php echo $max_volume; ?>);
+		if (volume_percentage == 0) {
+			$('#currentVolume').html('mute');
+		}
+		else {
+			$('#currentVolume').html(volume_percentage);
+		}
+		$('#volumeBar').width(width);
+		$('#setVolume').attr('onclick','toggleVolume();');
+	}
+}
+
+function setMaxWidth() {
+	var containerWidth = $(window).width();
+	$("#info_area").css("max-width",containerWidth);
+	$("#info_area_mini").css("max-width",containerWidth);
+	$(".wrapper").css("max-width",containerWidth);
+}
+
+function setMiniplayer(){
+		$(".wrapper, .bottom, .back-to-top, div.playlist_button").toggleClass("miniplayer");
+}
+</script>
+
+
+
+<?php echo $header['head']; ?>
+
+<body <?php echo $header['body']; ?>>
+
+<!--
+<div id="back-ground-wrapper">
+<img id="back-ground-img" src="skin/<?php echo $cfg['skin'] ?>/img/bg4.jpg">
+<div id="back-ground-"></div>
+</div>
+-->
+
+<div id="waitIndicator"></div>
+<div id="divCenter">Some text to display<br>Action: OK</div>
+<?php 
+$pos = strpos($_SERVER['PHP_SELF'], 'playlist.php');
+$action 		= get('action');
+?>
+<script type="text/javascript">
+	var target = document.getElementById('waitIndicator');
+	var spinner = new Spinner(opts);
+	<?php if ($action != 'view3' && $action != 'downloadAlbum' && $action != 'downloadTrack' && $pos === false) echo ('showSpinner();'); 
+	?>
+</script>
+
+<div class="wrapper">
+
+
+<div class="overlib" id="overDiv"></div>
+<table cellspacing="0" cellpadding="0" class="fullscreen" id="main_table">
+<tr valign="top">
+	<td>
+
+<div id="menu" class="menu">
+
+
+
+<?php 
+//require_once('include/play.inc.php');
+//$status = mpdSilent('status');
+
+$query2 = mysqli_query($db,'SELECT player_name, player_type, player_id FROM player ORDER BY player_name');
+
+?>
+<div id="fixedMenu">
+<div>
+<table cellspacing="0" cellpadding="0" class="menu_top">
+<tr>
+	<td class="menu_top_left"><div class="mpd_title pointer" onclick="javascript: window.location.href='http://ompd.pl'"><span id="logo1">O!</span><span id="logo2">MPD</span></div></td>
+	<td class="menu_top<?php echo ($cfg['menu'] == 'Library') ? ' menu_top_selected' : ''; ?>" onclick="javascript: window.location.href='index.php';"><p>&nbsp;library</p></td>
+	<td class="menu_top<?php echo ($cfg['menu'] == 'playlist') ? ' menu_top_selected' : ''; ?>" onclick="javascript: window.location.href='playlist.php';">&nbsp;now playing</td>
+	<td class="menu_top<?php echo ($cfg['menu'] == 'favorite') ? ' menu_top_selected' : ''; ?>" onclick="javascript: window.location.href='favorite.php';">&nbsp;favorites</td>
+	<td>&nbsp;</td>
+	<td class="menu_top menu_top_config" id="setVolume" onclick='javascript: toggleVolume();'>
+		<div><i id="iconVolumeToggler" class="fa fa-volume-up fa-lg"></i></div>
+		<div id="currentVolume"><?php //echo $status['volume']; ?></div>
+	</td>
+	<?php if (mysqli_num_rows($query2)>1) { ?>
+	<td class="menu_top menu_top_config" id="playerProfile" onclick='javascript: toggleChangePlayer();'>
+		<div><i id="iconPlayerToggler" class="fa fa-music fa-lg"></i></div>
+		<div id="activePlayer"><?php echo $player1; ?></div>
+	</td>
+	<?php }; ?>
+	<td class="menu_top menu_top_config<?php echo ($cfg['menu'] == 'config') ? ' menu_top_selected' : ''; ?>" onclick="javascript: window.location.href='config.php';">
+		<i class="fa fa-cog fa-lg"></i>
+	</td>
+	<td class="menu_top menu_top_config" id="searchToggler" onclick='javascript: toggleSearch();'>
+		<i id="iconSearchToggler" class="fa fa-search fa-lg"></i>
+	</td>
+</tr>
+</table>
+</div>
+
+<div id="playerList" class="buttons">
+<div id="selectPlayer">
+<?php
+	while ($player = mysqli_fetch_assoc($query2)) {
+?>
+	<span onclick="javascript: changePlayer(<?php echo $player['player_id']; ?>);"><?php echo html($player['player_name']); ?></span>
+<?php
+}
+?>
+</div>
+<div id="playlistAction">
+	<div>With current playlist:</div>
+	
+	<div>from&nbsp;
+		<select id="selectSource">
+		<?php
+		$query2 = mysqli_query($db,'SELECT player_name, player_type, player_id FROM player ORDER BY player_name');
+		while ($player = mysqli_fetch_assoc($query2)) {
+		?>
+			<option value="<?php echo $player['player_id']; ?>"
+			<?php if($cfg['player_id'] == $player['player_id']) {
+				echo " selected";
+			}?>
+			><?php echo html($player['player_name']); ?></option>
+		<?php
+		}
+		?>
+		</select>
+	&nbsp;to&nbsp;
+		<select id="selectDest">
+		<?php
+		$query2 = mysqli_query($db,'SELECT player_name, player_type, player_id FROM player ORDER BY player_name');
+		$selected = false;
+		while ($player = mysqli_fetch_assoc($query2)) {
+		?>
+			<option value="<?php echo $player['player_id']; ?>"
+			<?php if(($cfg['player_id'] != $player['player_id']) && $selected == false) {
+				echo " selected";
+				$selected = true;
+			}?>
+			><?php echo html($player['player_name']); ?></option>
+		<?php
+		}
+		?>
+		</select>
+	</div>
+	<div>
+	<span id="playlistSync"><i class="fa fa-refresh fa-fw"></i> Synchronize</span>
+	<span id="playlistCopy"><i class="fa fa-files-o fa-fw"></i> Copy</span>
+	<span id="playlistAdd"><i class="fa fa-plus-circle fa-fw"></i> Add</span>
+	</div>
+</div>
+</div>
+<div>
+<form action="search.php" id="searchFormAll">
+	<div>
+	<input type="text" id="search_string" name="search_string" autocomplete="off" value=""><div onclick="goSearch();" class="icon-selected">GO</div>
+	<input type="hidden" name="filter" value="base">
+	<input type="hidden" name="action" value="search_all">
+	</div>
+	</form>
+</div>
+<div id="volumeArea">
+
+<div class="playlist_indicator">
+	<div class="buttons">
+		<span class="pointer" onClick="ajaxRequest('play.php?action=volumeImageMap&amp;dx=' + $('#volumeValue').width() + '&amp;x=' + ($('#volumeBar').width() -($('#volumeValue').width() * 0.05)) + '&amp;menu=playlist', evaluateVolume);"><i class="fa fa-volume-down fa-lg fa-fw"></i></span>
+		<div id="volumeValueWrapper" onClick="ajaxRequest('play.php?action=volumeImageMap&amp;dx=' + this.clientWidth + '&amp;x=' + getRelativeX(event, this) + '&amp;menu=playlist', evaluateVolume);">
+		<div id="volumeValue" class="out pointer">
+			<div id="volumeBar" style="width: 0px; overflow: hidden;" class="in"></div>
+		</div>
+		</div>
+		<span class="playlist_status_off" id="volume" style="text-align: left; padding-left: 1px; display: none; align: middle;"></span>
+		<span class="pointer" onClick="ajaxRequest('play.php?action=volumeImageMap&amp;dx=' + $('#volumeValue').width() + '&amp;x=' + ($('#volumeBar').width() +($('#volumeValue').width() * 0.05)) + '&amp;menu=playlist', evaluateVolume);"><i class="fa fa-volume-up fa-lg fa-fw"></i></span>
+	</div>
+</div>
+	
+<?php
+	 /* End volume */ ?>
+</div>
+</div>
+<div id="fixedMenuFill"></div>
+<script type="text/javascript">
+//$('#search_string').focus(function() {$(this).val('');});
+</script>
+<table cellspacing="0" cellpadding="0" class="menu_middle">
+<tr>
+	<td class="menu_middle_left"></td>
+	<td class="menu_middle">
+<?php 
+	if ($cfg['menu'] == 'Library') {
+?>
+
+
+
+<span id="menuMiddleMedia">
+<span id="list" onclick='toggleSubMiddle("Alpha");'>artist <i id="iconmenuSubMiddleMediaAlpha" class="fa fa-chevron-circle-down"></i></span>
+
+<?php echo $header['seperation']; ?>
+<!-- <span id="genre" onclick='toggleSubMiddle("Genre");'>genre <i id="iconmenuSubMiddleMediaGenre" class="fa fa-chevron-circle-down"></i></span>
+-->
+<a href="index.php?action=viewGenre">genre</a>
+
+<?php echo $header['seperation']; ?>
+<span id="quickSearch" onclick='toggleSubMiddle("QuickSearch");'>quick search <i id="iconmenuSubMiddleMediaQuickSearch" class="fa fa-chevron-circle-down"></i></span>
+
+<?php echo $header['seperation']; ?>
+
+<?php
+	
+	$header['menu'] = "\t" . '<a href="index.php?action=viewYear">year</a>' . $header['seperation'];
+	//$header['menu'] .= "\t" . '<a href="index.php?action=viewNew&page=1">new</a>'. $header['seperation'];
+	$header['menu'] .= "\t" . '<a href="index.php?action=viewPopular&amp;period=overall">popular</a>' . $header['seperation'];
+	//$header['menu'] .= "\t" . $header['seperation'];
+	$header['menu'] .= '<a href="index.php?action=viewRandomAlbum&amp;order=artist">random</a>' . $header['seperation'];
+	$header['menu'] .= '<a href="browser.php">files</a>' . $header['seperation'];
+	$header['menu'] .= '<a href="index.php?action=viewDR">DR</a>';
+	echo $header['menu'];
+?>
+
+</span>
+
+
+
+<div id="menuSubMiddleMediaAlpha_old">
+	<?php
+	$header['menu'] = '<a href="index.php?action=view2&amp;filter=all&amp;order=artist"><span>all</span></a>';
+	//ArtS
+	$header['menu'] .= "\t" . '<a href="index.php?action=view2&amp;filter=symbol&amp;artist=%23&amp;order=artist"><span>#</span></a>';
+	for ($i = 'a'; $i != 'aa'; $i++)
+		  $header['menu'] .= "\t" . '<a href="index.php?action=view2&amp;filter=start&amp;artist='. $i .'&amp;order=artist"><span>' . $i . '</span></a>';
+	$header['menu'] .= "\t"  . '<a href="index.php?action=view2&amp;artist=Various%20Artists&amp;filter=exact&amp;order=artist"><span>VA</span></a>';
+	echo $header['menu'];
+	?>
+</div>
+
+<div id="menuSubMiddleMediaAlpha">
+	<?php
+	$header['menu'] = 'Artist<br><a href="index.php?action=view1&amp;filter=all&amp;order=artist"><span>all</span></a>';
+	$header['menu'] .= "\t" . '<a href="index.php?action=view1&amp;filter=symbol&amp;artist=&amp;order=artist"><span>#</span></a>';
+	for ($i = 'a'; $i != 'aa'; $i++)
+		  $header['menu'] .= "\t" . '<a href="index.php?action=view1&amp;filter=start&amp;artist='. $i .'&amp;order=artist"><span>' . $i . '</span></a>';
+	
+	$header['menu'] .= '<br>Album artist<br><a href="index.php?action=view2&amp;filter=all&amp;order=artist"><span>all</span></a>';
+	$header['menu'] .= "\t" . '<a href="index.php?action=view2&amp;filter=symbol&amp;artist=%23&amp;order=artist"><span>#</span></a>';
+	for ($i = 'a'; $i != 'aa'; $i++)
+		  $header['menu'] .= "\t" . '<a href="index.php?action=view2&amp;filter=start&amp;artist='. $i .'&amp;order=artist"><span>' . $i . '</span></a>';
+	$header['menu'] .= "\t"  . '<a href="index.php?action=view2&amp;artist=Various%20Artists&amp;filter=exact&amp;order=album"><span>VA</span></a>';
+	
+	$header['menu'] .= '<br>Composer<br><a href="index.php?action=viewComposer&amp;filter=all&amp;order=composer"><span>all</span></a>';
+	$header['menu'] .= "\t" . '<a href="index.php?action=viewComposer&amp;filter=symbol&amp;order=composer"><span>#</span></a>';
+	for ($i = 'a'; $i != 'aa'; $i++)
+		  $header['menu'] .= "\t" . '<a href="index.php?action=viewComposer&amp;filter=start&amp;composer='. $i .'&amp;order=composer"><span>' . $i . '</span></a>';
+	echo $header['menu'];
+	?>
+</div>
+
+<div id="menuSubMiddleMediaGenre">
+	<?php
+	$query = mysqli_query($db,'SELECT genre, genre_id
+		FROM genre 
+		WHERE genre !=""
+		ORDER BY genre');
+	if (mysqli_num_rows($query) > 0) {
+		//echo '<div class="genre">';
+		//$genre1 = ($genre['genre'] == '' ? $genre['genre'] : 'Unknown genre');
+		while ($genre = mysqli_fetch_assoc($query))
+			echo  '<p><span><a href="index.php?action=view2&amp;order=artist&amp;sort=asc&amp;genre_id=' . $genre['genre_id'] . '">' . str_replace(" ", "&nbsp;", html($genre['genre'])) . '</a></span></p>';
+			
+	//echo '&nbsp;' . $genre_seperation .'&nbsp;' . "\n";
+	
+	}
+	?>
+</div>
+
+<div id="menuSubMiddleMediaQuickSearch">
+	<?php 
+	//print_r($cfg['quick_search']);
+	$quick_search = $cfg['quick_search'];
+	$count = count($quick_search);
+	for ($i=1; $i<$count+1; $i++) {
+	?>
+	<p><span>
+	<a href="index.php?action=view2&amp;filter=exact&amp;order=artist&amp;qsType=<?php echo $i; ?>"><?php echo str_replace(" ", "&nbsp;", html($quick_search[$i][0])); ?></a>
+	</p></span>
+	<?php
+		//if ($i<$count) echo '&nbsp;|&nbsp;';
+	}
+	?>
+</div>
+
+<!-- search form here -->
+
+<?php		 
+	}
+	else if ($cfg['menu'] == 'playlist') {
+	?>
+	<span id="menuMiddleMedia">
+	<a id="deletePlayed" class="pointer noselect">delete played</a>
+	<!-- <a id="deletePlayed" href="javascript:ajaxRequest('play.php?action=deletePlayed&amp;menu=playlist');">delete played</a> --> 
+<?php
+	/* $status = mpd('status');
+	$consume = isset($status['consume']) ? $status['consume'] : '0';
+	if ($consume == '0') {
+			echo '<a id="deletePlayed" class="pointer noselect">delete played</a>';
+	}
+	else if ($consume == '1') {
+			echo '<a id="deletePlayed" class="pointer noselect">delete played [Auto]</a>';
+	} */
+?>
+	
+	<?php echo $header['seperation']; ?>
+	<a href="javascript:ajaxRequest('play.php?action=crop&amp;menu=playlist');">crop</a>
+	<?php echo $header['seperation']; ?>
+	<a class="showPL">show playlist</a>
+	<?php echo $header['seperation']; ?>
+	<a href="javascript:ajaxRequest('play.php?action=loopGain&amp;menu=playlist',evaluateGain);" id="gain"><span id="gain_text" class="gain">gain: off</span></a>
+	<?php echo $header['seperation']; ?>
+	<span id="addUrl" onclick='toggleSubMiddle("AddUrl");'>add <i id="iconmenuSubMiddleMediaAddUrl" class="fa fa-chevron-circle-down"></i></span>
+	<?php echo $header['seperation']; ?>
+	<span id="savePlaylist" onclick='toggleSubMiddle("SavePlaylist");'>save <i id="iconmenuSubMiddleMediaSavePlaylist" class="fa fa-chevron-circle-down"></i></span>
+	</span>
+	
+	<div id="menuSubMiddleMediaAddUrl">
+		<div>
+			<span class="savePlaylistCol1">File/stream</span><span class="savePlaylistCol2"><input id="addUrlAddress"></span>
+			<span id="playlistAddUrl"><i class="fa fa-plus-circle fa-fw"></i> Add</span>
+		</div>
+	</div>
+	
+	<div id="menuSubMiddleMediaSavePlaylist">
+	<div>
+		<span class="savePlaylistCol1">current</span>
+		<span>
+			<span id="saveCurrentPlaylist" class="pointer"><i class="fa fa-check-circle-o fa-fw"></i>playlist</span>
+			<span id="saveCurrentTrack" class="pointer"><i class="fa fa-circle-o fa-fw"></i>track</span>
+		</span>
+	</div>
+	<div id="trackOptions">
+		<span class="savePlaylistCol1"></span>
+		
+		<span id="addToFav" class="pointer">
+		<i id="save_favorite_star" class="fa fa-star-o fa-fw"></i><span id="addToFav_txt"> Add to </span><?php echo $cfg['favorite_name'];?></span><br>
+		
+		<span class="savePlaylistCol1"></span>	
+		
+		<span id="addToBlacklist" class="pointer">
+		<span id="blacklist_star_bg_save" class="blackstar"><i id="blacklist_star" class="fa fa-star-o fa-fw"></i></span>
+		<span id="addToBlacklist_txt"> Add to </span><?php echo $cfg['blacklist_name'];?></span>
+	</div>
+	<div>
+		<span class="savePlaylistCol1">Save as</span><span class="savePlaylistCol2"><input id="savePlaylistAsName"></span><br>
+		<span class="savePlaylistCol1">Comment</span><span class="savePlaylistCol2"><input id="savePlaylistComment"></span>
+		<span id="playlistSaveAs"><i class="fa fa-floppy-o fa-fw"></i> Save</span>
+	</div>
+	<div>
+	<span class="savePlaylistCol1">Add to</span><span class="savePlaylistCol2"> 
+		<select id="savePlaylistAddTo">
+	<?php 
+		echo listOfFavorites();
+	?>
+		</select>
+		</span>
+		<span id="playlistAddTo"><i class="fa fa-plus-circle fa-fw"></i> Add</span>
+	</div>
+	</div>
+	<?php
+	}
+	else {
+		echo $header['menu'];
+	}?>
+	</td>
+	<td class="menu_middle_right"></td>
+</tr>
+
+</table>
+<table cellspacing="0" cellpadding="0" class="menu_bottom">
+<tr>
+	<td class="menu_bottom_left"></td>
+	<td></td>
+	<td class="menu_bottom_right"></td>
+</tr>
+</table>
+</div><!-- end menu -->
+
+	</td>
+</tr>
+<tr>
+	<td height="100%">
+
+<div id="content" class="content">
+<table cellspacing="0" cellpadding="0" class="fullscreen tabFixed">
+<!-- <tr>
+	<td colspan="3" height="3px"></td>
+</tr>
+-->
+<tr <?php echo $cfg['align'] ? 'align="center" valign="middle"' : 'valign="top"'; ?>>
+	<td class="side-margin"></td>
+	<td>
+
+<?php
+	@ob_flush();
+	flush();
+?>	
+
+	
+<!-- end header -->