improved estuary4vdr

17 files changed, 498 insertions, 317 deletions

diff --git a/skins/estuary4vdr/xmlfiles/displaychannel.xml b/skins/estuary4vdr/xmlfiles/displaychannel.xml
index a54bb37..a91e023 100644
--- a/skins/estuary4vdr/xmlfiles/displaychannel.xml
+++ b/skins/estuary4vdr/xmlfiles/displaychannel.xml
@@ -13,39 +13,39 @@
         <area x="0" y="80%" width="20%" height="20%" layer="2">
             <drawimage cache="true" condition="{channellogoexists}" imagetype="channellogo" path="{channelid}" width="80%" height="80%" align="center" valign="center" />
         </area>
-        <area x="0" y="76%" width="20%" height="4%" layer="2">
-            <drawtext align="center" y="0" width="100%" fontsize="100%" font="{regular}" color="{fontdefault}" text="{channelnumber}  {channelname}" />
+        <area x="0" y="76%" width="20%" height="5%" layer="2">
+            <drawtext align="center" y="0" width="100%" fontsize="{areaheight}*{channelnamefontsize}/100" font="{regular}" color="{fontdefault}" text="{channelnumber}  {channelname}" />
         </area>
     </channelinfo>
 
     <epginfo>
         <!-- current schedule -->
-        <area x="67%" y="76%" width="13%" height="5%" layer="2">
-            <drawtext align="right" valign="center" fontsize="80%" font="{bold}" color="{fontactive}" text="{currentstart} - {currentstop}" />
+        <area x="67%" y="76%" width="13%" height="10%" layer="2">
+            <drawtext align="right" valign="center" fontsize="{areaheight}*{startstopfontsize}/100" font="{bold}" color="{fontactive}" text="{currentstart} - {currentstop}" />
         </area>
-        <areascroll condition="{scrollepg}++empty{currentsubtitle}" scrollelement="title" mode="forthandback" orientation="horizontal" delay="1000" scrollspeed="medium" x="20%" y="76%" width="47%" height="10%" layer="2">
-            <drawtext name="title" x="0" valign="center" fontsize="55%" width="100%" font="{regular}" color="{fontdefault}" text="{currenttitle}" />
+        <areascroll condition="{scrollepg}++empty{currentsubtitle}" scrollelement="title" mode="forthandback" orientation="horizontal" delay="1000" scrollspeed="fast" x="20%" y="76%" width="47%" height="10%" layer="2">
+            <drawtext name="title" x="0" valign="center" fontsize="{areaheight}*{epgtextfontsizelarge}/100" width="100%" font="{regular}" color="{fontdefault}" text="{currenttitle}" />
         </areascroll>
-        <areascroll condition="{scrollepg}++isset{currentsubtitle}" scrollelement="title" mode="forthandback" orientation="horizontal" delay="1000" scrollspeed="medium" x="20%" y="76%" width="47%" height="5%" layer="2">
-            <drawtext name="title" x="0" valign="center" fontsize="100%" width="100%" font="{regular}" color="{fontdefault}" text="{currenttitle}" />
+        <areascroll condition="{scrollepg}++isset{currentsubtitle}" scrollelement="title" mode="forthandback" orientation="horizontal" delay="1000" scrollspeed="fast" x="20%" y="76%" width="47%" height="10%" layer="2">
+            <drawtext name="title" x="0" y="{areaheight}*{epgtextposy}/100" fontsize="{areaheight}*{epgtextfontsize}/100" width="100%" font="{regular}" color="{fontdefault}" text="{currenttitle}" />
         </areascroll>
-        <areascroll condition="{scrollepg}++isset{currentsubtitle}" scrollelement="subtitle" mode="forthandback" orientation="horizontal" delay="1000" scrollspeed="medium" x="20%" y="81%" width="50%" height="5%" layer="2">
-            <drawtext name="subtitle" x="0" y="0" fontsize="70%" width="100%" font="{regular}" color="{fontdefault}" text="{currentsubtitle}" />
+        <areascroll condition="{scrollepg}++isset{currentsubtitle}" scrollelement="subtitle" mode="forthandback" orientation="horizontal" delay="1000" scrollspeed="fast" x="20%" y="76%" width="50%" height="10%" layer="3">
+            <drawtext name="subtitle" x="0" y="{areaheight}*{epgsubtextposy}/100" fontsize="{areaheight}*{epgsubtextfontsize}/100" width="100%" font="{regular}" color="{fontdefault}" text="{currentsubtitle}" />
         </areascroll>
         <area condition="not{scrollepg}" x="20%" y="76%" width="47%" height="10%" layer="2">
-            <drawtext condition="isset{currentsubtitle}" x="0" y="5%" fontsize="50%" width="{areawidth} - {width(startstop)} - 10" font="{regular}" color="{fontdefault}" text="{currenttitle}" />
-            <drawtext condition="isset{currentsubtitle}" x="0" y="55%" fontsize="35%" width="{areawidth} - {width(startstop)} - 10" font="{regular}" color="{fontdefault}" text="{currentsubtitle}" />
-            <drawtext condition="empty{currentsubtitle}" x="0" valign="center" fontsize="55%" width="{areawidth} - {width(startstop)} - 10" font="{regular}" color="{fontdefault}" text="{currenttitle}" />
+            <drawtext condition="isset{currentsubtitle}" x="0" y="{areaheight}*{epgtextposy}/100" fontsize="{areaheight}*{epgtextfontsize}/100" width="{areawidth} - {width(startstop)} - 10" font="{regular}" color="{fontdefault}" text="{currenttitle}" />
+            <drawtext condition="isset{currentsubtitle}" x="0" y="{areaheight}*{epgsubtextposy}/100" fontsize="{areaheight}*{epgsubtextfontsize}/100" width="{areawidth} - {width(startstop)} - 10" font="{regular}" color="{fontdefault}" text="{currentsubtitle}" />
+            <drawtext condition="empty{currentsubtitle}" x="0" valign="center" fontsize="{areaheight}*{epgtextfontsizelarge}/100" width="{areawidth} - {width(startstop)} - 10" font="{regular}" color="{fontdefault}" text="{currenttitle}" />
         </area>
         <area x="70%" y="83%" width="10%" height="3%" layer="2">
             <drawtext align="right" y="0" fontsize="100%" font="{regular}" color="{fontactive}" text="+{currentremaining} min" />
         </area>
         <!-- next schedule -->
         <area x="20%" y="88%" width="60%" height="10%" layer="2">
-            <drawtext name="startstop" align="right" valign="center" fontsize="40%" font="{bold}" color="{fontdefault}" text="{nextstart} - {nextstop}" />
-            <drawtext condition="isset{nextsubtitle}" x="0" y="5%" fontsize="50%" width="{areawidth} - {width(startstop)} - 10" font="{regular}" color="{fontdefault}" text="{nexttitle}" />
-            <drawtext condition="isset{nextsubtitle}" x="0" y="55%" fontsize="35%" width="{areawidth} - {width(startstop)} - 10" font="{regular}" color="{fontdefault}" text="{nextsubtitle}" />
-            <drawtext condition="empty{nextsubtitle}" x="0" valign="center" fontsize="55%" width="{areawidth} - {width(startstop)} - 10" font="{regular}" color="{fontdefault}" text="{nexttitle}" />
+            <drawtext name="startstop" align="right" valign="center" fontsize="{areaheight}*{startstopfontsize}/100" font="{bold}" color="{fontdefault}" text="{nextstart} - {nextstop}" />
+            <drawtext condition="isset{nextsubtitle}" x="0" y="{areaheight}*{epgtextposy}/100" fontsize="{areaheight}*{epgtextfontsize}/100" width="{areawidth} - {width(startstop)} - 10" font="{regular}" color="{fontdefault}" text="{nexttitle}" />
+            <drawtext condition="isset{nextsubtitle}" x="0" y="{areaheight}*{epgsubtextposy}/100" fontsize="{areaheight}*{epgsubtextfontsize}/100" width="{areawidth} - {width(startstop)} - 10" font="{regular}" color="{fontdefault}" text="{nextsubtitle}" />
+            <drawtext condition="empty{nextsubtitle}" x="0" valign="center" fontsize="{areaheight}*{epgtextfontsizelarge}/100" width="{areawidth} - {width(startstop)} - 10" font="{regular}" color="{fontdefault}" text="{nexttitle}" />
         </area>
     </epginfo>
 
@@ -148,7 +148,7 @@
             <drawimage condition="{info}" imagetype="icon" path="info" width="{areaheight}*0.8" height="80%" x="5%" valign="center" />
             <drawimage condition="{warning}" imagetype="icon" path="warning" width="{areaheight}*0.8" height="80%" x="5%" valign="center" />
             <drawimage condition="{error}" imagetype="icon" path="error" width="{areaheight}*0.8" height="80%" x="5%" valign="center" />
-            <drawtext align="center" valign="center" fontsize="40%" font="{regular}" color="{fontdefault}" text="{text}" />
+            <drawtext align="center" valign="center" fontsize="{areaheight}*{messagemenusize}/100" font="{regular}" color="{fontdefault}" text="{text}" />
         </area>        
     </message>
 
diff --git a/skins/estuary4vdr/xmlfiles/displaymenu.xml b/skins/estuary4vdr/xmlfiles/displaymenu.xml
index 3dd5ad3..6974c9d 100644
--- a/skins/estuary4vdr/xmlfiles/displaymenu.xml
+++ b/skins/estuary4vdr/xmlfiles/displaymenu.xml
@@ -24,23 +24,23 @@
 
     <header>
         <area x="1%" y="0" width="60%" height="7%" layer="2">
-            <drawtext condition="not{hasicon}" x="0" valign="center" fontsize="80%" font="{regular}" color="{fontdefault}" text="{title}" />
+            <drawtext condition="not{hasicon}" x="0" valign="center" fontsize="{areaheight}*{headerfontsize}/100" font="{regular}" color="{fontdefault}" text="{title}" />
             <drawimage condition="{hasicon}" name="icon" imagetype="menuicon" path="{icon}" x="0" valign="center" width="{areaheight}*0.8" height="{areaheight}*0.8"/>
-            <drawtext condition="{hasicon}" x="{posx(icon)} + {width(icon)} + 20" valign="center" fontsize="80%" font="{regular}" color="{fontdefault}" text="{title}" />
+            <drawtext condition="{hasicon}" x="{posx(icon)} + {width(icon)} + 20" valign="center" fontsize="{areaheight}*{headerfontsize}/100" font="{regular}" color="{fontdefault}" text="{title}" />
         </area>
     </header>
 
     <datetime>
         <area x="60%" y="0" width="25%" height="7%" layer="2">
-            <drawtext align="right" valign="center" fontsize="70%" font="{regular}" color="{fontdefault}" text="{dayname} {day}. {monthnameshort}" />
+            <drawtext align="right" valign="center" fontsize="{areaheight}*{headerdatefontsize}/100" font="{regular}" color="{fontdefault}" text="{dayname} {day}. {monthnameshort}" />
         </area>
     </datetime>
 
     <time>
         <area x="87%" y="0" width="13%" height="7%" layer="2">
             <drawimage imagetype="icon" x="0" valign="center" width="{areaheight}*0.5" height="{areaheight}0.5" path="clock" />
-            <drawtext name="clock" x="25%" valign="center" fontsize="80%" font="{digital}" color="{fontdefault}" text="{hour}:{printf('%02d', min)}" />
-            <drawtext name="clocksec" x="{posx(clock)} + {width(clock)}" y="{areaheight}/2 -  {height(clocksec)}/2 + {height(clock)}/2 - {height(clocksec)}/2 - 3" fontsize="60%" font="{digital}" color="{fontdefault}" text=":{printf('%02d', sec)}" />
+            <drawtext name="clock" x="25%" valign="center" fontsize="{areaheight}*{headertimefontsize}/100" font="{digital}" color="{fontdefault}" text="{hour}:{printf('%02d', min)}" />
+            <drawtext name="clocksec" x="{posx(clock)} + {width(clock)}" y="{areaheight}/2 -  {height(clocksec)}/2 + {height(clock)}/2 - {height(clocksec)}/2 - 3" fontsize="{areaheight}*{headertimefontsizesmall}/100" font="{digital}" color="{fontdefault}" text=":{printf('%02d', sec)}" />
         </area>
     </time>
 
@@ -53,7 +53,7 @@
             <drawimage condition="{info}" imagetype="icon" path="info" width="{areaheight}*0.8" height="80%" x="5%" valign="center" />
             <drawimage condition="{warning}" imagetype="icon" path="warning" width="{areaheight}*0.8" height="80%" x="5%" valign="center" />
             <drawimage condition="{error}" imagetype="icon" path="error" width="{areaheight}*0.8" height="80%" x="5%" valign="center" />
-            <drawtext align="center" valign="center" fontsize="40%" font="{regular}" color="{fontdefault}" text="{text}" />
+            <drawtext align="center" valign="center" fontsize="{areaheight}*{messagemenusize}/100" font="{regular}" color="{fontdefault}" text="{text}" />
         </area>        
     </message>
 
@@ -72,28 +72,28 @@
             <drawimage imagetype="skinpart" path="button_red" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{red1}" x="0" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{red}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{red}" />
         </area>
         <!--green-->
         <area condition="{green1}" x="0" y="94%" width="25%" height="6%" layer="2">
             <drawimage imagetype="skinpart" path="button_green" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{green1}" x="0" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{green}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{green}" />
         </area>
         <!--yellow-->
         <area condition="{yellow1}" x="0" y="94%" width="25%" height="6%" layer="2">
             <drawimage imagetype="skinpart" path="button_yellow" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{yellow1}" x="0" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{yellow}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{yellow}" />
         </area>
         <!--blue-->
         <area condition="{blue1}" x="0" y="94%" width="25%" height="6%" layer="2">
             <drawimage imagetype="skinpart" path="button_blue" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{blue1}" x="0" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{blue}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{blue}" />
         </area>
 
         <!--red-->
@@ -101,28 +101,28 @@
             <drawimage imagetype="skinpart" path="button_red" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{red2}" x="25%" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{red}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{red}" />
         </area>
         <!--green-->
         <area condition="{green2}" x="25%" y="94%" width="25%" height="6%" layer="2">
             <drawimage imagetype="skinpart" path="button_green" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{green2}" x="25%" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{green}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{green}" />
         </area>
         <!--yellow-->
         <area condition="{yellow2}" x="25%" y="94%" width="25%" height="6%" layer="2">
             <drawimage imagetype="skinpart" path="button_yellow" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{yellow2}" x="25%" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{yellow}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{yellow}" />
         </area>
         <!--blue-->
         <area condition="{blue2}" x="25%" y="94%" width="25%" height="6%" layer="2">
             <drawimage imagetype="skinpart" path="button_blue" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{blue2}" x="25%" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{blue}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{blue}" />
         </area>
 
         <!--red-->
@@ -130,28 +130,28 @@
             <drawimage imagetype="skinpart" path="button_red" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{red3}" x="50%" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{red}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{red}" />
         </area>
         <!--green-->
         <area condition="{green3}" x="50%" y="94%" width="25%" height="6%" layer="2">
             <drawimage imagetype="skinpart" path="button_green" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{green3}" x="50%" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{green}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{green}" />
         </area>
         <!--yellow-->
         <area condition="{yellow3}" x="50%" y="94%" width="25%" height="6%" layer="2">
             <drawimage imagetype="skinpart" path="button_yellow" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{yellow3}" x="50%" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{yellow}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{yellow}" />
         </area>
         <!--blue-->
         <area condition="{blue3}" x="50%" y="94%" width="25%" height="6%" layer="2">
             <drawimage imagetype="skinpart" path="button_blue" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{blue3}" x="50%" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{blue}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{blue}" />
         </area>
 
         <!--red-->
@@ -159,28 +159,28 @@
             <drawimage imagetype="skinpart" path="button_red" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{red4}" x="75%" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{red}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{red}" />
         </area>
         <!--green-->
         <area condition="{green4}" x="75%" y="94%" width="25%" height="6%" layer="2">
             <drawimage imagetype="skinpart" path="button_green" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{green4}" x="75%" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{green}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{green}" />
         </area>
         <!--yellow-->
         <area condition="{yellow4}" x="75%" y="94%" width="25%" height="6%" layer="2">
             <drawimage imagetype="skinpart" path="button_yellow" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{yellow4}" x="75%" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{yellow}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{yellow}" />
         </area>
         <!--blue-->
         <area condition="{blue4}" x="75%" y="94%" width="25%" height="6%" layer="2">
             <drawimage imagetype="skinpart" path="button_blue" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{blue4}" x="75%" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{blue}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{blue}" />
         </area>
     </colorbuttons>
     
diff --git a/skins/estuary4vdr/xmlfiles/displaymenuchannels.xml b/skins/estuary4vdr/xmlfiles/displaymenuchannels.xml
index 68050ba..365219e 100644
--- a/skins/estuary4vdr/xmlfiles/displaymenuchannels.xml
+++ b/skins/estuary4vdr/xmlfiles/displaymenuchannels.xml
@@ -1,6 +1,6 @@
 <menuchannels x="0" y="0" width="100%" height="100%" fadetime="0" scaletvx="39%" scaletvy="8%" scaletvwidth="60%" scaletvheight="60%">
     
-    <menuitems x="2%" y="9%" orientation="vertical" width="98%" height="82%" align="center" numlistelements="12">
+    <menuitems x="2%" y="9%" orientation="vertical" width="98%" height="82%" align="center" numlistelements="{numitemschannels}">
         <listelement>
             <area x="0" y="0" width="{areawidth}*0.305" height="100%" layer="2">
                 <drawrectangle condition="not{current}" x="0" y="0" width="100%" height="100%" color="{menuback}" />
@@ -10,38 +10,38 @@
             <area condition="not{separator}" x="1%" y="0" width="5%" height="100%" layer="3">
                 <drawimage name="logo" imagetype="channellogo" path="{channelid}" x="0" width="100%" height="100%" valign="center" />
             </area>
-            <area condition="not{current}++not{separator}" x="7%" y="1%" width="22%" height="55%" layer="3">
-                <drawtext x="0" valign="center" font="{regular}" fontsize="95%" color="{fontdefault}" text="{number} {name}" />
+            <area condition="not{current}++not{separator}" x="7%" width="22%" layer="3">
+                <drawtext x="0" y="{areaheight}*{channelsposytitle}/100" font="{regular}" fontsize="{areaheight}*{channelssizetitle}/100" color="{fontdefault}" text="{number} {name}" />
             </area>
-            <areascroll condition="not{current}++not{separator}" scrollelement="epgtitle" mode="forthandback" orientation="horizontal" delay="1000" scrollspeed="medium" x="7%" y="55%" width="22%" height="40%" layer="3">
-                <drawtext name="epgtitle" x="0" width="100%" valign="center" font="{regular}" fontsize="100%" color="{fontdefault}" text="{presenteventstart} - {presenteventstop}: {presenteventtitle}" />
+            <areascroll condition="not{current}++not{separator}" scrollelement="epgtitle" mode="forthandback" orientation="horizontal" delay="1000" scrollspeed="medium" x="7%" width="22%" layer="3">
+                <drawtext name="epgtitle" x="0" width="100%" y="{areaheight}*{channelsposydate}/100" font="{regular}" fontsize="{areaheight}*{channelssizedate}/100" color="{fontdefault}" text="{presenteventstart} - {presenteventstop}: {presenteventtitle}" />
             </areascroll>
-            <area condition="{current}++not{separator}" x="7%" y="1%" width="22%" height="55%" layer="3">
-                <drawtext x="0" valign="center" font="{regular}" fontsize="95%" color="{fontmenuactive}" text="{number} {name}" />
+            <area condition="{current}++not{separator}" x="7%" width="22%" layer="3">
+                <drawtext x="0" y="{areaheight}*{channelsposytitle}/100" font="{regular}" fontsize="{areaheight}*{channelssizetitle}/100" color="{fontmenuactive}" text="{number} {name}" />
             </area>
-            <areascroll condition="{current}++not{separator}" scrollelement="epgtitle" mode="forthandback" orientation="horizontal" delay="1000" scrollspeed="medium" x="7%" y="55%" width="22%" height="40%" layer="3">
-                <drawtext name="epgtitle" x="0" width="100%" valign="center" font="{regular}" fontsize="100%" color="{fontmenuactive}" text="{presenteventstart} - {presenteventstop}: {presenteventtitle}" />
+            <areascroll condition="{current}++not{separator}" scrollelement="epgtitle" mode="forthandback" orientation="horizontal" delay="1000" scrollspeed="medium" x="7%" width="22%" layer="3">
+                <drawtext name="epgtitle" x="0" width="100%" y="{areaheight}*{channelsposydate}/100" font="{regular}" fontsize="{areaheight}*{channelssizedate}/100" color="{fontmenuactive}" text="{presenteventstart} - {presenteventstop}: {presenteventtitle}" />
             </areascroll>
             <area condition="not{separator}++{isEncrypted}" x="20%" y="5%" width="10%" height="38%" layer="4">
                 <drawimage condition="not{current}" imagetype="icon" path="ico_crypt" align="right" y="0" width="{areaheight}" height="{areaheight}"/>
                 <drawimage condition="{current}" imagetype="icon" path="ico_crypt_active" align="right" y="0" width="{areaheight}" height="{areaheight}"/>
             </area>
             <area condition="{separator}" x="1%" width="29%" layer="3">
-                <drawtext x="0" valign="center" width="100%" font="{regular}" fontsize="65%" color="{fontdefault}" text="{name}" />
+                <drawtext x="0" width="100%" y="{areaheight}*{channelsposytitle}/100" font="{regular}" fontsize="{areaheight}*{channelsseparator}/100" color="{fontdefault}" text="{name}" />
             </area>
         </listelement>
 
         <currentelement delay="100" fadetime="200">
             <area x="39%" y="76%" width="57%" height="6%" layer="3">
                 <drawimage name="logo" imagetype="channellogo" path="{channelid}" x="0" width="10%" height="100%" valign="center" />
-                <drawtext x="{width(logo)}+30" valign="center" font="{regular}" width="100%" fontsize="90%" color="{fontdefault}" text="{number} {name} - {sourcedescription}, Transp. {transponder}" />
+                <drawtext x="{width(logo)}+30" valign="center" font="{regular}" width="{areawidth} - {width(logo)} - 30" fontsize="{areaheight}*{channelssizecurrenttitle}/100" color="{fontdefault}" text="{number} {name} - {sourcedescription}, Transp. {transponder}" />
             </area>
 
             <areascroll mode="forthandback" orientation="vertical" delay="5000" scrollspeed="medium" x="39%" y="83%" width="57%" height="14%" layer="3">
-                <drawtext x="0" y="0" font="{regular}" fontsize="25%" color="{fontdefault}" text="Following Schedules:" />
+                <drawtext x="0" y="0" font="{regular}" fontsize="{areaheight}*{channelssizecurrenttext}/100" color="{fontdefault}" text="Following Schedules:" />
                 <loop name="schedule" x="0" y="{areaheight}/4 + 5" orientation="vertical">
-                    <drawtext x="0" name="title" font="{regular}" width="{areawidth}-20" fontsize="25%" color="{fontdefault}" text="{schedule[start]} {schedule[title]}" />
-                    <drawtext x="{width(title)}" condition="isset{schedule[shorttext]}" font="{regular}" width="{areawidth} -20 - {width(title)}" fontsize="25%" color="{fontdefault}" text=" - {schedule[shorttext]}" />
+                    <drawtext x="0" name="title" font="{regular}" width="{areawidth}-20" fontsize="{areaheight}*{channelssizecurrenttext}/100" color="{fontdefault}" text="{schedule[start]} {schedule[title]}" />
+                    <drawtext x="{width(title)}" condition="isset{schedule[shorttext]}" font="{regular}" width="{areawidth} -20 - {width(title)}" fontsize="{areaheight}*{channelssizecurrenttext}/100" color="{fontdefault}" text=" - {schedule[shorttext]}" />
                 </loop>
             </areascroll>
 
diff --git a/skins/estuary4vdr/xmlfiles/displaymenudefault.xml b/skins/estuary4vdr/xmlfiles/displaymenudefault.xml
index 524c3e8..3d4c95b 100644
--- a/skins/estuary4vdr/xmlfiles/displaymenudefault.xml
+++ b/skins/estuary4vdr/xmlfiles/displaymenudefault.xml
@@ -12,8 +12,9 @@
         </area>
     </scrollbar>
 
-    <menuitems x="2%" y="10%" orientation="vertical" width="96%" height="80%" align="center" menuitemwidth="94%" determinatefont="column1" numlistelements="16">
+    <menuitems x="2%" y="10%" orientation="vertical" width="96%" height="80%" align="center" menuitemwidth="94%" determinatefont="column1" numlistelements="{numitemsdefault}">
         <listelement>
+            <!-- Background -->
             <area x="0" y="0" width="100%" layer="2">
                 <drawrectangle condition="not{current}" x="0" y="0" width="100%" height="100%" color="{menuback}" />
                 <drawrectangle condition="not{current}" x="0" y="{areaheight}-1" width="100%" height="1" color="{menubackline}" />
@@ -21,40 +22,102 @@
             </area>
             <!-- Separators -->
             <area x="1%" condition="{separator}" width="98%" layer="3">
-                <drawtext align="left" valign="center" font="{regular}" fontsize="80%" width="98%" color="{fontdefault}" text="{column1}" />
+                <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{defaultitemfontsize}/100" width="98%" color="{fontactive}" text="{column1}" />
             </area>
             <!-- Setup Menus -->
-            <areascroll condition="not{separator} ++ {setup} ++ {column2set}" scrollelement="column1" mode="forthandback" orientation="horizontal" delay="1000" scrollspeed="medium" x="1%" width="59%" layer="3">
-                <drawtext condition="not{current}" x="0" width="99%" valign="center" font="{regular}" fontsize="80%" color="{fontdefault}" text="{column1}" />
-                <drawtext condition="{current}" name="column1" x="0" width="99%" valign="center" font="{regular}" fontsize="80%" color="{fontmenuactive}" text="{column1}" />
-            </areascroll>
-            <area x="60%" condition="not{separator} ++ {setup} ++ {column2set}" width="39%" layer="3">
-                <drawtext condition="not{current}" align="right" valign="center" font="{regular}" fontsize="80%" width="99%" color="{fontdefault}" text="{column2}" />
-                <drawtext condition="{current}" align="right" valign="center" font="{regular}" fontsize="80%" width="99%" color="{fontmenuactive}" text="{column2}" />
-            </area>
-            <area x="1%" condition="not{separator} ++ {setup} ++ not{column2set}" width="98%" layer="3">
-                <drawtext condition="not{current}" align="left" valign="center" font="{regular}" fontsize="80%" width="99%" color="{fontdefault}" text="{column1}" />
-                <drawtext condition="{current}" align="left" valign="center" font="{regular}" fontsize="80%" width="99%" color="{fontmenuactive}" text="{column1}" />
-            </area>
+            <areacontainer condition="not{separator} ++ {setup}">
+                <areascroll condition="{column2set}" scrollelement="column1" mode="forthandback" orientation="horizontal" delay="1000" scrollspeed="medium" x="1%" width="59%" layer="3">
+                    <drawtext condition="not{current}" x="0" width="99%" valign="center" font="{regular}" fontsize="{areaheight}*{defaultitemfontsize}/100" color="{fontdefault}" text="{column1}" />
+                    <drawtext condition="{current}" name="column1" x="0" width="99%" valign="center" font="{regular}" fontsize="{areaheight}*{defaultitemfontsize}/100" color="{fontmenuactive}" text="{column1}" />
+                </areascroll>
+                <area x="60%" condition="{column2set}" width="39%" layer="3">
+                    <drawtext condition="not{current}" align="right" valign="center" font="{regular}" fontsize="{areaheight}*{defaultitemfontsize}/100" width="99%" color="{fontdefault}" text="{column2}" />
+                    <drawtext condition="{current}" align="right" valign="center" font="{regular}" fontsize="{areaheight}*{defaultitemfontsize}/100" width="99%" color="{fontmenuactive}" text="{column2}" />
+                </area>
+                <area x="1%" condition="not{column2set}" width="98%" layer="3">
+                    <drawtext condition="not{current}" align="left" valign="center" font="{regular}" fontsize="{areaheight}*{defaultitemfontsize}/100" width="99%" color="{fontdefault}" text="{column1}" />
+                    <drawtext condition="{current}" align="left" valign="center" font="{regular}" fontsize="{areaheight}*{defaultitemfontsize}/100" width="99%" color="{fontmenuactive}" text="{column1}" />
+                </area>
+            </areacontainer>
+            <!-- Neutrino EPG Plugin -->
+            <areacontainer condition="not{separator} ++ {neutrinoepg}">
+                <area condition="not{current}++{column5set}" x="1%" width="100%" layer="4">
+                    <drawtext x="{column2x}" valign="center" font="{regular}" fontsize="{areaheight}*{defaultitemfontsize}/100" width="{column2width}" color="{fontdefault}" text="{column2}" />
+                    <drawtext x="{column3x}" valign="center" font="{regular}" fontsize="{areaheight}*{defaultitemfontsize}/100" width="{column3width}" color="{fontdefault}" text="{column3}" />
+                    <drawtext condition="not{column4pb}" x="{column4x}" valign="center" font="{regular}" fontsize="{areaheight}*{defaultitemfontsize}/100" width="{column4width}" color="{fontdefault}" text="{column4}" />
+                    <drawrectangle condition="{column4pb}" x="{column4x}" y="{areaheight}*0.2" width="{column4width}" height="{areaheight}*0.6" color="{progressbar}" />
+                    <drawrectangle condition="{column4pb}" x="{column4x}+1" y="{areaheight}*0.2+1" width="{column4width}-2" height="{areaheight}*0.6-2" color="{progressbarback}" />
+                    <drawrectangle condition="{column4pb}" x="{column4x} + 2" y="{areaheight}*0.2 + 2" width="{column4width}*{column4pbsize}/{column4pbtotalsize} - {column4pbsize}/{column4pbtotalsize} - 3" height="{areaheight}*0.6 - 4" color="{progressbar}" />
+                    <drawtext x="{column5x}" valign="center" font="{regular}" fontsize="{areaheight}*{defaultitemfontsize}/100" width="{column5width}" color="{fontdefault}" text="{column5}" />
+                </area>
+                <area condition="not{current}++not{column5set}" x="1%" width="100%" layer="4">
+                    <drawtext x="{column1x}" valign="center" font="{regular}" fontsize="{areaheight}*{defaultitemfontsize}/100" width="{column1width}" color="{fontdefault}" text="{column1}" />
+                    <drawtext x="{column2x}" valign="center" font="{regular}" fontsize="{areaheight}*{defaultitemfontsize}/100" width="{column2width}" color="{fontdefault}" text="{column2}" />
+                    <drawtext condition="not{column3pb}" x="{column3x}" valign="center" font="{regular}" fontsize="{areaheight}*{defaultitemfontsize}/100" width="{column3width}" color="{fontdefault}" text="{column3}" />
+                    <drawrectangle condition="{column3pb}" x="{column3x}" y="{areaheight}*0.2" width="{column3width}" height="{areaheight}*0.6" color="{progressbar}" />
+                    <drawrectangle condition="{column3pb}" x="{column3x}+1" y="{areaheight}*0.2+1" width="{column3width}-2" height="{areaheight}*0.6-2" color="{progressbarback}" />
+                    <drawrectangle condition="{column3pb}" x="{column3x} + 2" y="{areaheight}*0.2 + 2" width="{column3width}*{column3pbsize}/{column3pbtotalsize} - {column3pbsize}/{column3pbtotalsize} - 3" height="{areaheight}*0.6 - 4" color="{progressbar}" />
+                    <drawtext x="{column4x}" valign="center" font="{regular}" fontsize="{areaheight}*{defaultitemfontsize}/100" width="{column4width}" color="{fontdefault}" text="{column4}" />
+                </area>
+                <area condition="{current}++{column5set}" x="1%" width="100%" layer="4">
+                    <drawtext x="{column2x}" valign="center" font="{regular}" fontsize="{areaheight}*{defaultitemfontsize}/100" width="{column2width}" color="{fontmenuactive}" text="{column2}" />
+                    <drawtext x="{column3x}" valign="center" font="{regular}" fontsize="{areaheight}*{defaultitemfontsize}/100" width="{column3width}" color="{fontmenuactive}" text="{column3}" />
+                    <drawtext condition="not{column4pb}" x="{column4x}" valign="center" font="{regular}" fontsize="{areaheight}*{defaultitemfontsize}/100" width="{column4width}" color="{fontdefault}" text="{column4}" />
+                    <drawrectangle condition="{column4pb}" x="{column4x}" y="{areaheight}*0.2" width="{column4width}" height="{areaheight}*0.6" color="{progressbar}" />
+                    <drawrectangle condition="{column4pb}" x="{column4x}+1" y="{areaheight}*0.2+1" width="{column4width}-2" height="{areaheight}*0.6-2" color="{progressbarback}" />
+                    <drawrectangle condition="{column4pb}" x="{column4x} + 2" y="{areaheight}*0.2 + 2" width="{column4width}*{column4pbsize}/{column4pbtotalsize} - {column4pbsize}/{column4pbtotalsize} - 3" height="{areaheight}*0.6 - 4" color="{progressbar}" />
+                    <drawtext x="{column5x}" valign="center" font="{regular}" fontsize="{areaheight}*{defaultitemfontsize}/100" width="{column5width}" color="{fontmenuactive}" text="{column5}" />
+                </area>
+                <area condition="{current}++not{column5set}" x="1%" width="100%" layer="4">
+                    <drawtext x="{column1x}" valign="center" font="{regular}" fontsize="{areaheight}*{defaultitemfontsize}/100" width="{column1width}" color="{fontmenuactive}" text="{column1}" />
+                    <drawtext x="{column2x}" valign="center" font="{regular}" fontsize="{areaheight}*{defaultitemfontsize}/100" width="{column2width}" color="{fontmenuactive}" text="{column2}" />
+                    <drawtext condition="not{column3pb}" x="{column3x}" valign="center" font="{regular}" fontsize="{areaheight}*{defaultitemfontsize}/100" width="{column3width}" color="{fontdefault}" text="{column3}" />
+                    <drawrectangle condition="{column3pb}" x="{column3x}" y="{areaheight}*0.2" width="{column3width}" height="{areaheight}*0.6" color="{progressbar}" />
+                    <drawrectangle condition="{column3pb}" x="{column3x}+1" y="{areaheight}*0.2+1" width="{column3width}-2" height="{areaheight}*0.6-2" color="{progressbarback}" />
+                    <drawrectangle condition="{column3pb}" x="{column3x} + 2" y="{areaheight}*0.2 + 2" width="{column3width}*{column3pbsize}/{column3pbtotalsize} - {column3pbsize}/{column3pbtotalsize} - 3" height="{areaheight}*0.6 - 4" color="{progressbar}" />
+                    <drawtext x="{column4x}" valign="center" font="{regular}" fontsize="{areaheight}*{defaultitemfontsize}/100" width="{column4width}" color="{fontmenuactive}" text="{column4}" />
+                </area>
+            </areacontainer>
+            <!-- Systeminfo Plugin -->
+            <areacontainer condition="not{separator} ++ {systeminfo}">
+                <area condition="not{current}" x="1%" width="100%" layer="4">
+                    <drawtext x="{column1x}" valign="center" font="{regular}" fontsize="{areaheight}*{defaultitemfontsize}/100" width="{column1width}" color="{fontdefault}" text="{column1}" />
+                    <drawtext x="{column2x}" valign="center" font="{regular}" fontsize="{areaheight}*{defaultitemfontsize}/100" width="{column2width}" color="{fontdefault}" text="{column2}" />
+                    <drawtext condition="not{column3pb}" x="{column3x}" valign="center" font="{regular}" fontsize="{areaheight}*{defaultitemfontsize}/100" width="{column3width}" color="{fontdefault}" text="{column3}" />
+                    <drawrectangle condition="{column3pb}" x="{column3x}" y="{areaheight}*0.2" width="{column3width}" height="{areaheight}*0.6" color="{progressbar}" />
+                    <drawrectangle condition="{column3pb}" x="{column3x}+1" y="{areaheight}*0.2+1" width="{column3width}-2" height="{areaheight}*0.6-2" color="{progressbarback}" />
+                    <drawrectangle condition="{column3pb}" x="{column3x} + 2" y="{areaheight}*0.2 + 2" width="{column3width}*{column3pbsize}/{column3pbtotalsize} - {column3pbsize}/{column3pbtotalsize} - 3" height="{areaheight}*0.6 - 4" color="{progressbar}" />
+                </area>
+                <area condition="{current}" x="1%" width="100%" layer="4">
+                    <drawtext x="{column1x}" valign="center" font="{regular}" fontsize="{areaheight}*{defaultitemfontsize}/100" width="{column1width}" color="{fontmenuactive}" text="{column1}" />
+                    <drawtext x="{column2x}" valign="center" font="{regular}" fontsize="{areaheight}*{defaultitemfontsize}/100" width="{column2width}" color="{fontmenuactive}" text="{column2}" />
+                    <drawtext condition="not{column3pb}" x="{column3x}" valign="center" font="{regular}" fontsize="{areaheight}*{defaultitemfontsize}/100" width="{column3width}" color="{fontdefault}" text="{column3}" />
+                    <drawrectangle condition="{column3pb}" x="{column3x}" y="{areaheight}*0.2" width="{column3width}" height="{areaheight}*0.6" color="{progressbar}" />
+                    <drawrectangle condition="{column3pb}" x="{column3x}+1" y="{areaheight}*0.2+1" width="{column3width}-2" height="{areaheight}*0.6-2" color="{progressbarback}" />
+                    <drawrectangle condition="{column3pb}" x="{column3x} + 2" y="{areaheight}*0.2 + 2" width="{column3width}*{column3pbsize}/{column3pbtotalsize} - {column3pbsize}/{column3pbtotalsize} - 3" height="{areaheight}*0.6 - 4" color="{progressbar}" />
+                </area>
+            </areacontainer>
             <!-- Default Menus -->
-            <areascroll condition="not{separator} ++ not{setup}" scrollelement="column1" mode="forthandback" orientation="horizontal" delay="1000" scrollspeed="medium" x="1%" width="{column1width}" layer="3">
-                <drawtext condition="not{current}" x="{column1x}" width="{column1width}" valign="center" font="{regular}" fontsize="80%" color="{fontdefault}" text="{column1}" />
-                <drawtext condition="{current}" name="column1" x="{column1x}" width="{column1width}" valign="center" font="{regular}" fontsize="80%" color="{fontmenuactive}" text="{column1}" />
-            </areascroll>
-            <area condition="not{current}++not{separator} ++ not{setup}" x="1%" width="100%" layer="4">
-                <drawtext condition="{column2set}" x="{column2x}" valign="center" font="{regular}" fontsize="80%" width="{column2width}" color="{fontdefault}" text="{column2}" />
-                <drawtext condition="{column3set}" x="{column3x}" valign="center" font="{regular}" fontsize="80%" width="{column3width}" color="{fontdefault}" text="{column3}" />
-                <drawtext condition="{column4set}" x="{column4x}" valign="center" font="{regular}" fontsize="80%" width="{column4width}" color="{fontdefault}" text="{column4}" />
-                <drawtext condition="{column5set}" x="{column5x}" valign="center" font="{regular}" fontsize="80%" width="{column5width}" color="{fontdefault}" text="{column5}" />
-                <drawtext condition="{column6set}" x="{column6x}" valign="center" font="{regular}" fontsize="80%" width="{column6width}" color="{fontdefault}" text="{column6}" />
-            </area>
-            <area condition="{current}++not{separator} ++ not{setup}" x="1%" width="100%" layer="4">
-                <drawtext condition="{column2set}" x="{column2x}" valign="center" font="{regular}" fontsize="80%" width="{column2width}" color="{fontmenuactive}" text="{column2}" />
-                <drawtext condition="{column3set}" x="{column3x}" valign="center" font="{regular}" fontsize="80%" width="{column3width}" color="{fontmenuactive}" text="{column3}" />
-                <drawtext condition="{column4set}" x="{column4x}" valign="center" font="{regular}" fontsize="80%" width="{column4width}" color="{fontmenuactive}" text="{column4}" />
-                <drawtext condition="{column5set}" x="{column5x}" valign="center" font="{regular}" fontsize="80%" width="{column5width}" color="{fontmenuactive}" text="{column5}" />
-                <drawtext condition="{column6set}" x="{column6x}" valign="center" font="{regular}" fontsize="80%" width="{column6width}" color="{fontmenuactive}" text="{column6}" />
-            </area>
+            <areacontainer condition="not{separator} ++ not{setup} ++ not{neutrinoepg} ++ not{systeminfo}">
+                <areascroll scrollelement="column1" mode="forthandback" orientation="horizontal" delay="1000" scrollspeed="medium" x="1%" width="{column1width}" layer="3">
+                    <drawtext condition="not{current}" x="{column1x}" width="{column1width}" valign="center" font="{regular}" fontsize="{areaheight}*{defaultitemfontsize}/100" color="{fontdefault}" text="{column1}" />
+                    <drawtext condition="{current}" name="column1" x="{column1x}" width="{column1width}" valign="center" font="{regular}" fontsize="{areaheight}*{defaultitemfontsize}/100" color="{fontmenuactive}" text="{column1}" />
+                </areascroll>
+                <area condition="not{current}" x="1%" width="100%" layer="4">
+                    <drawtext condition="{column2set}" x="{column2x}" valign="center" font="{regular}" fontsize="{areaheight}*{defaultitemfontsize}/100" width="{column2width}" color="{fontdefault}" text="{column2}" />
+                    <drawtext condition="{column3set}" x="{column3x}" valign="center" font="{regular}" fontsize="{areaheight}*{defaultitemfontsize}/100" width="{column3width}" color="{fontdefault}" text="{column3}" />
+                    <drawtext condition="{column4set}" x="{column4x}" valign="center" font="{regular}" fontsize="{areaheight}*{defaultitemfontsize}/100" width="{column4width}" color="{fontdefault}" text="{column4}" />
+                    <drawtext condition="{column5set}" x="{column5x}" valign="center" font="{regular}" fontsize="{areaheight}*{defaultitemfontsize}/100" width="{column5width}" color="{fontdefault}" text="{column5}" />
+                    <drawtext condition="{column6set}" x="{column6x}" valign="center" font="{regular}" fontsize="{areaheight}*{defaultitemfontsize}/100" width="{column6width}" color="{fontdefault}" text="{column6}" />
+                </area>
+                <area condition="{current}" x="1%" width="100%" layer="4">
+                    <drawtext condition="{column2set}" x="{column2x}" valign="center" font="{regular}" fontsize="{areaheight}*{defaultitemfontsize}/100" width="{column2width}" color="{fontmenuactive}" text="{column2}" />
+                    <drawtext condition="{column3set}" x="{column3x}" valign="center" font="{regular}" fontsize="{areaheight}*{defaultitemfontsize}/100" width="{column3width}" color="{fontmenuactive}" text="{column3}" />
+                    <drawtext condition="{column4set}" x="{column4x}" valign="center" font="{regular}" fontsize="{areaheight}*{defaultitemfontsize}/100" width="{column4width}" color="{fontmenuactive}" text="{column4}" />
+                    <drawtext condition="{column5set}" x="{column5x}" valign="center" font="{regular}" fontsize="{areaheight}*{defaultitemfontsize}/100" width="{column5width}" color="{fontmenuactive}" text="{column5}" />
+                    <drawtext condition="{column6set}" x="{column6x}" valign="center" font="{regular}" fontsize="{areaheight}*{defaultitemfontsize}/100" width="{column6width}" color="{fontmenuactive}" text="{column6}" />
+                </area>
+            </areacontainer>
         </listelement>
         
     </menuitems>
diff --git a/skins/estuary4vdr/xmlfiles/displaymenudetailepg.xml b/skins/estuary4vdr/xmlfiles/displaymenudetailepg.xml
index 0d9112d..ef0b0d9 100644
--- a/skins/estuary4vdr/xmlfiles/displaymenudetailepg.xml
+++ b/skins/estuary4vdr/xmlfiles/displaymenudetailepg.xml
@@ -19,42 +19,42 @@
     <detailheader>
         <area x="3%" y="11%" width="95%" height="10%" layer="3">
             <drawimage name="logo" imagetype="channellogo" path="{channelid}" x="0" valign="center" width="15%" height="90%" />
-            <drawtext x="17%" y="0" font="{regular}" fontsize="40%" color="{fontdefault}" text="{date} {start} - {stop}" />
-            <drawtext x="17%" y="43%" width="84%" font="{regular}" fontsize="55%" color="{fontdefault}" text="{title}" />
+            <drawtext x="17%" y="{areaheight}*{detailheaderdateposy}/100" font="{regular}" fontsize="{areaheight}*{detailheaderdatesize}/100" color="{fontdefault}" text="{date} {start} - {stop}" />
+            <drawtext x="17%" y="{areaheight}*{detailheadertitleposy}/100" width="84%" font="{regular}" fontsize="{areaheight}*{detailheadertitlesize}/100" color="{fontdefault}" text="{title}" />
         </area>
     </detailheader>
 
 
     <!-- TAB EPGINFO -->
     <tab name="EPG Info" x="3%" y="23%" width="94%" height="61%" layer="4" scrollheight="{areaheight}/4">
-        <drawtextbox condition="not{isseries}++not{ismovie}" name="shorttext" x="0" y="1%" width="96%" font="{regular}" fontsize="8%" color="{fontdefault}" text="{shorttext}" />
-        <drawtextbox condition="not{isseries}++not{ismovie}" x="0" y="{posy(shorttext)} + {height(shorttext)} + 5" width="96%" font="{regular}" fontsize="6%" color="{fontdefault}" text="{description}" />
+        <drawtextbox condition="not{isseries}++not{ismovie}" name="shorttext" x="0" y="1%" width="96%" font="{regular}" fontsize="{areaheight}*{detailtextheadersize}/100" color="{fontdefault}" text="{shorttext}" />
+        <drawtextbox condition="not{isseries}++not{ismovie}" x="0" y="{posy(shorttext)} + {height(shorttext)} + 5" width="96%" font="{regular}" fontsize="{areaheight}*{detailtextsize}/100" color="{fontdefault}" text="{description}" />
 
         <drawimage condition="{isseries}" name="seriesbanner" imagetype="image" path="{seriesbanner1path}" x="{areawidth}*0.5" y="0" width="{areawidth}*0.5" height="{areawidth} * 0.5 * {seriesbanner1height} / {seriesbanner1width}"/>
-        <drawtextbox condition="{isseries}" name="shorttext" x="0" y="0" width="49%" font="{regular}" fontsize="8%" color="{fontdefault}" text="{shorttext}" />
-        <drawtextbox condition="{isseries}" x="0" y="{height(shorttext)} + 5" width="96%" float="topright" floatwidth="{areawidth}*0.5" floatheight="{areawidth} * 0.5 * {seriesbanner1height} / {seriesbanner1width} - {height(shorttext)}" font="{regular}" fontsize="6%" color="{fontdefault}" text="{description}" />
+        <drawtextbox condition="{isseries}" name="shorttext" x="0" y="0" width="49%" font="{regular}" fontsize="{areaheight}*{detailtextheadersize}/100" color="{fontdefault}" text="{shorttext}" />
+        <drawtextbox condition="{isseries}" x="0" y="{height(shorttext)} + 5" width="96%" float="topright" floatwidth="{areawidth}*0.5" floatheight="{areawidth} * 0.5 * {seriesbanner1height} / {seriesbanner1width} - {height(shorttext)}" font="{regular}" fontsize="{areaheight}*{detailtextsize}/100" color="{fontdefault}" text="{description}" />
 
         <drawimage condition="{ismovie}" name="movieposter" imagetype="image" path="{posterpath}" x="{areawidth}*0.8" y="0" width="{areawidth}*0.2" height="{areawidth} * 0.2 * {posterheight} / {posterwidth}" />
-        <drawtextbox condition="{ismovie}" name="shorttextmovie" x="0" y="0" width="75%" font="{regular}" fontsize="8%" color="{fontdefault}" text="{shorttext}" />
-        <drawtextbox condition="{ismovie}" x="0" y="{height(shorttextmovie)} + 5" width="96%" float="topright" floatwidth="{width(movieposter)} + 10" floatheight="{height(movieposter)} - {height(shorttextmovie)}" font="{regular}" fontsize="6%" color="{fontdefault}" text="{description}" />
+        <drawtextbox condition="{ismovie}" name="shorttextmovie" x="0" y="0" width="75%" font="{regular}" fontsize="{areaheight}*{detailtextheadersize}/100" color="{fontdefault}" text="{shorttext}" />
+        <drawtextbox condition="{ismovie}" x="0" y="{height(shorttextmovie)} + 5" width="96%" float="topright" floatwidth="{width(movieposter)} + 10" floatheight="{height(movieposter)} - {height(shorttextmovie)}" font="{regular}" fontsize="{areaheight}*{detailtextsize}/100" color="{fontdefault}" text="{description}" />
     </tab>
     <!-- TAB RERUNS -->
     <tab condition="{hasreruns}" name="{tr(reruns)}" x="3%" y="23%" width="94%" height="61%" layer="4" scrollheight="{areaheight}/4">
         <drawtext align="center" y="1%" name="title" font="{regular}" fontsize="8%" color="{fontdefault}" text="{tr(rerunsof)} '{title}'" />
         <loop name="reruns" x="0" y="{height(title)} + 30" width="{areawidth}" rowheight="3%" orientation="vertical">
             <drawimage name="logo" condition="{reruns[channellogoexists]}" imagetype="channellogo" path="{reruns[channelid]}" x="0" width="10%" height="8%" />
-            <drawtext name="channelname" condition="not{reruns[channellogoexists]}" x="-5" font="{regular}" fontsize="5%" color="{fontdefault}" text="{reruns[channelname]}" />
-            <drawtext condition="{reruns[channellogoexists]}" x="{width(logo)}+20" y="-5" width="{areawidth} - {width(logo)} - 20" font="{regular}" fontsize="6%" color="{fontdefault}" text="{reruns[day]} {reruns[date]} {reruns[start]} - {reruns[stop]}: {reruns[title]}  {reruns[shorttext]}" />
-            <drawtext condition="not{reruns[channellogoexists]}" x="{width(channelname)}+20" y="-5" width="{areawidth} - {width(logo)} - 20" font="{regular}" fontsize="6%" color="{fontdefault}" text="{reruns[day]} {reruns[date]} {reruns[start]} - {reruns[stop]}: {reruns[title]}  {reruns[shorttext]}" />
+            <drawtext name="channelname" condition="not{reruns[channellogoexists]}" x="-5" font="{regular}" fontsize="{areaheight}*{detailactors}/100" color="{fontdefault}" text="{reruns[channelname]}" />
+            <drawtext condition="{reruns[channellogoexists]}" x="{width(logo)}+20" y="-5" width="{areawidth} - {width(logo)} - 20" font="{regular}" fontsize="{areaheight}*{detailtextsize}/100" color="{fontdefault}" text="{reruns[day]} {reruns[date]} {reruns[start]} - {reruns[stop]}: {reruns[title]}  {reruns[shorttext]}" />
+            <drawtext condition="not{reruns[channellogoexists]}" x="{width(channelname)}+20" y="-5" width="{areawidth} - {width(logo)} - 20" font="{regular}" fontsize="{areaheight}*{detailtextsize}/100" color="{fontdefault}" text="{reruns[day]} {reruns[date]} {reruns[start]} - {reruns[stop]}: {reruns[title]}  {reruns[shorttext]}" />
         </loop>
     </tab>
     <!-- TAB ACTORS -->
     <tab condition="{isseries}||{ismovie}" name="{tr(actors)}" x="3%" y="23%" width="94%" height="61%" layer="4" scrollheight="{areaheight}/4">
-        <drawtext align="center" name="title" y="0" font="{regular}" fontsize="12%" color="{fontdefault}" text="{tr(actors)}" />
+        <drawtext align="center" name="title" y="0" font="{regular}" fontsize="{areaheight}*{detailtextheadersize}/100" color="{fontdefault}" text="{tr(actors)}" />
         <loop name="actors" x="0" y="{height(title)} + 10" width="{areawidth}" orientation="horizontal" columnwidth="{areawidth}/7" rowheight="{areawidth}/7*1.65" overflow="linewrap" >
             <drawimage name="thumb" imagetype="image" path="{actors[thumb]}" x="20" y="0" width="{columnwidth}-40" height="{columnwidth} * {actors[thumbheight]} / {actors[thumbwidth]} - 40 * {actors[thumbheight]} / {actors[thumbwidth]}"/>
-            <drawtext align="center" y="{height(thumb)} + 10" width="{columnwidth}" name="actorname" font="{regular}" fontsize="5%" color="{fontdefault}" text="{actors[name]}" />
-            <drawtext align="center" y="{height(thumb)} + 10 + {height(actorname)}" width="{columnwidth}" font="{regular}" fontsize="5%" color="{fontdefault}" text="{actors[role]}" />
+            <drawtext align="center" y="{height(thumb)} + 10" width="{columnwidth}" name="actorname" font="{regular}" fontsize="{areaheight}*{detailactors}/100" color="{fontdefault}" text="{actors[name]}" />
+            <drawtext align="center" y="{height(thumb)} + 10 + {height(actorname)}" width="{columnwidth}" font="{regular}" fontsize="{areaheight}*{detailactors}/100" color="{fontdefault}" text="{actors[role]}" />
         </loop>
     </tab>
     <!-- TAB TVDBINFO -->
@@ -62,12 +62,12 @@
         <drawimage name="banner" imagetype="image" path="{seriesbanner1path}" align="center" y="10" width="{areawidth}*0.7" height="{areawidth} * 0.7 * {seriesbanner1height} / {seriesbanner1width}"/>
         <drawimage name="episodeimage" imagetype="image" path="{episodeimagepath}" x="{areawidth}*0.7" y="{height(banner)} + 20" width="{areawidth}*0.3" height="{areawidth} * 0.3 * {episodeimageheight} / {episodeimagewidth}"/>
         <drawimage name="seasonposter" imagetype="image" path="{seasonposterpath}" x="{areawidth}*0.7" y="{height(banner)} + {height(episodeimage)} + 30" width="{areawidth}*0.3" height="{areawidth} * 0.3 * {seasonposterheight} / {seasonposterwidth}"/>
-        <drawtextbox x="0" y="{height(banner)} + 20" width="96%" float="topright" floatwidth="{width(seasonposter)} + 10" floatheight="{height(episodeimage)} + {height(seasonposter)} + 30" font="{regular}" fontsize="6%" color="{fontdefault}" text="{tr(episode)}: {episodetitle} ({tr(season)} {episodeseason}, {tr(episode)} {episodenumber}) &#10;&#10;{episodeoverview}|&#10;&#10;{tr(gueststars)}: {episodegueststars}||&#10;&#10;{tr(seriesfirstaired)}: {seriesfirstaired}||&#10;{tr(episodefirstaired)}: {episodefirstaired}||&#10;{tr(network)}: {seriesnetwork}||&#10;{tr(genre)}: {seriesgenre}||&#10;{tr(status)}: {seriesstatus}||&#10;{tr(rating)}: {seriesrating}||&#10;{tr(episoderating)}: {episoderating}&#10;|{seriesoverview}&#10;" />
+        <drawtextbox x="0" y="{height(banner)} + 20" width="96%" float="topright" floatwidth="{width(seasonposter)} + 10" floatheight="{height(episodeimage)} + {height(seasonposter)} + 30" font="{regular}" fontsize="{areaheight}*{detailtextsize}/100" color="{fontdefault}" text="{tr(episode)}: {episodetitle} ({tr(season)} {episodeseason}, {tr(episode)} {episodenumber}) &#10;&#10;{episodeoverview}|&#10;&#10;{tr(gueststars)}: {episodegueststars}||&#10;&#10;{tr(seriesfirstaired)}: {seriesfirstaired}||&#10;{tr(episodefirstaired)}: {episodefirstaired}||&#10;{tr(network)}: {seriesnetwork}||&#10;{tr(genre)}: {seriesgenre}||&#10;{tr(status)}: {seriesstatus}||&#10;{tr(rating)}: {seriesrating}||&#10;{tr(episoderating)}: {episoderating}&#10;|{seriesoverview}&#10;" />
     </tab>
     <!-- TAB MOVIEDBINFO -->
     <tab condition="{ismovie}" name="MovieDBInfo" x="3%" y="23%" width="94%" height="61%" layer="4" scrollheight="{areaheight}/4">
         <drawimage name="poster" imagetype="image" path="{posterpath}" x="70%" y="10" width="{areawidth}*0.3" height="{areawidth} * 0.3 * {posterheight} / {posterwidth}"/>
-        <drawtextbox x="0" y="10" width="96%" float="topright" floatwidth="{width(poster)} + 10" floatheight="{height(poster)} + 20" font="{regular}" fontsize="6%" color="{fontdefault}" text="{tr(originaltitle)}: {movieoriginalTitle}&#10;&#10;|{tr(genre)}: {moviegenres}&#10;&#10;||{movietagline}&#10;&#10;|{movieoverview}&#10;&#10;|{tr(budget)}: {moviebudget}&#10;||{tr(revenue)}: {movierevenue}&#10;&#10;||{tr(adult)}: {movieadult}&#10;||{tr(releasedate)}: {moviereleasedate}&#10;||{tr(runtime)}: {movieruntime} min&#10;||&#10;{tr(popularity)}: {moviepopularity}&#10;||&#10;{tr(voteaverage)}: {movievoteaverage}&#10;||&#10;{tr(homepage)}: {moviehomepage}|&#10;" />
+        <drawtextbox x="0" y="10" width="96%" float="topright" floatwidth="{width(poster)} + 10" floatheight="{height(poster)} + 20" font="{regular}" fontsize="{areaheight}*{detailtextsize}/100" color="{fontdefault}" text="{tr(originaltitle)}: {movieoriginalTitle}&#10;&#10;|{tr(genre)}: {moviegenres}&#10;&#10;||{movietagline}&#10;&#10;|{movieoverview}&#10;&#10;|{tr(budget)}: {moviebudget}&#10;||{tr(revenue)}: {movierevenue}&#10;&#10;||{tr(adult)}: {movieadult}&#10;||{tr(releasedate)}: {moviereleasedate}&#10;||{tr(runtime)}: {movieruntime} min&#10;||&#10;{tr(popularity)}: {moviepopularity}&#10;||&#10;{tr(voteaverage)}: {movievoteaverage}&#10;||&#10;{tr(homepage)}: {moviehomepage}|&#10;" />
     </tab>
     <!-- TAB SERIESGALERY -->
     <tab condition="{isseries}" name="{tr(seriesgalery)}" x="3%" y="23%" width="94%" height="61%" layer="4" scrollheight="{areaheight}*0.61">
@@ -96,13 +96,13 @@
                 <drawrectangle condition="not{tabs[current]}" x="0" y="0" width="{width(label)}" height="100%" color="{menuback}" />
                 <drawrectangle x="{columnwidth}-1" y="0" width="1" height="100%" color="{menubackline}" />
                 <drawrectangle condition="{tabs[current]}" x="0" y="0" width="{width(label)}" height="100%" color="{menubackactive}" />
-                <drawtext name="label" x="0" valign="center" font="{regular}" fontsize="60%" color="00000000" text="  {tabs[title]}  " />
+                <drawtext name="label" x="0" valign="center" font="{regular}" fontsize="{areaheight}*{tablabels}/100" color="00000000" text="  {tabs[title]}  " />
             </loop>
         </area>
         <area x="2%" y="85%" width="{areawidth} - 60" height="6%" layer="4">
             <loop name="tabs" x="0" y="0" orientation="horizontal">
-                <drawtext condition="not{tabs[current]}" x="0" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="  {tabs[title]}  " />
-                <drawtext condition="{tabs[current]}" x="0" valign="center" font="{regular}" fontsize="60%" color="{fontmenuactive}" text="  {tabs[title]}  " />
+                <drawtext condition="not{tabs[current]}" x="0" valign="center" font="{regular}" fontsize="{areaheight}*{tablabels}/100" color="{fontdefault}" text="  {tabs[title]}  " />
+                <drawtext condition="{tabs[current]}" x="0" valign="center" font="{regular}" fontsize="{areaheight}*{tablabels}/100" color="{fontmenuactive}" text="  {tabs[title]}  " />
             </loop>
         </area>
     </tablabels>
diff --git a/skins/estuary4vdr/xmlfiles/displaymenudetailrecording.xml b/skins/estuary4vdr/xmlfiles/displaymenudetailrecording.xml
index e3de0f0..56fb858 100644
--- a/skins/estuary4vdr/xmlfiles/displaymenudetailrecording.xml
+++ b/skins/estuary4vdr/xmlfiles/displaymenudetailrecording.xml
@@ -18,42 +18,42 @@
 
     <detailheader>
         <area x="3%" y="11%" width="95%" height="10%" layer="3">
-            <drawtext x="0" y="0" font="{regular}" fontsize="40%" color="{fontdefault}" text="{date} {time}, {duration} min" />
-            <drawtext x="0" y="43%" width="84%" font="{regular}" fontsize="55%" color="{fontdefault}" text="{epgname}" />
+            <drawtext x="0" y="{areaheight}*{detailheaderdateposy}/100" font="{regular}" fontsize="{areaheight}*{detailheaderdatesize}/100" color="{fontdefault}" text="{date} {time}, {duration} min" />
+            <drawtext x="0" y="{areaheight}*{detailheadertitleposy}/100" width="84%" font="{regular}" fontsize="{areaheight}*{detailheadertitlesize}/100" color="{fontdefault}" text="{epgname}" />
         </area>
     </detailheader>
 
     <!-- TAB EPGINFO -->
     <tab name="Info" x="3%" y="23%" width="94%" height="61%" layer="4" scrollheight="{areaheight}/4">
-        <drawtextbox condition="not{isseries}++not{ismovie}" name="shorttext" x="0" y="1%" width="96%" font="{regular}" fontsize="8%" color="{fontdefault}" text="{shorttext}" />
-        <drawtextbox condition="not{isseries}++not{ismovie}" x="0" y="{posy(shorttext)} + {height(shorttext)} + 5" width="96%" font="{regular}" fontsize="6%" color="{fontdefault}" text="{description}" />
+        <drawtextbox condition="not{isseries}++not{ismovie}" name="shorttext" x="0" y="1%" width="96%" font="{regular}" fontsize="{areaheight}*{detailtextheadersize}/100" color="{fontdefault}" text="{shorttext}" />
+        <drawtextbox condition="not{isseries}++not{ismovie}" x="0" y="{posy(shorttext)} + {height(shorttext)} + 5" width="96%" font="{regular}" fontsize="{areaheight}*{detailtextsize}/100" color="{fontdefault}" text="{description}" />
 
         <drawimage condition="{isseries}" name="seriesbanner" imagetype="image" path="{seriesbanner1path}" x="{areawidth}*0.5" y="0" width="{areawidth}*0.5" height="{areawidth} * 0.5 * {seriesbanner1height} / {seriesbanner1width}"/>
-        <drawtextbox condition="{isseries}" name="shorttext" x="0" y="0" width="49%" font="{regular}" fontsize="8%" color="{fontdefault}" text="{shorttext}" />
-        <drawtextbox condition="{isseries}" x="0" y="{height(shorttext)} + 5" width="96%" float="topright" floatwidth="{areawidth}*0.5" floatheight="{areawidth} * 0.5 * {seriesbanner1height} / {seriesbanner1width} - {height(shorttext)}" font="{regular}" fontsize="6%" color="{fontdefault}" text="{description}" />
+        <drawtextbox condition="{isseries}" name="shorttext" x="0" y="0" width="49%" font="{regular}" fontsize="{areaheight}*{detailtextheadersize}/100" color="{fontdefault}" text="{shorttext}" />
+        <drawtextbox condition="{isseries}" x="0" y="{height(shorttext)} + 5" width="96%" float="topright" floatwidth="{areawidth}*0.5" floatheight="{areawidth} * 0.5 * {seriesbanner1height} / {seriesbanner1width} - {height(shorttext)}" font="{regular}" fontsize="{areaheight}*{detailtextsize}/100" color="{fontdefault}" text="{description}" />
 
         <drawimage condition="{ismovie}" name="movieposter" imagetype="image" path="{posterpath}" x="{areawidth}*0.8" y="0" width="{areawidth}*0.2" height="{areawidth} * 0.2 * {posterheight} / {posterwidth}" />
-        <drawtextbox condition="{ismovie}" name="shorttextmovie" x="0" y="0" width="75%" font="{regular}" fontsize="8%" color="{fontdefault}" text="{shorttext}" />
-        <drawtextbox condition="{ismovie}" x="0" y="{height(shorttextmovie)} + 5" width="96%" float="topright" floatwidth="{width(movieposter)} + 10" floatheight="{height(movieposter)} - {height(shorttextmovie)}" font="{regular}" fontsize="6%" color="{fontdefault}" text="{description}" />
+        <drawtextbox condition="{ismovie}" name="shorttextmovie" x="0" y="0" width="75%" font="{regular}" fontsize="{areaheight}*{detailtextheadersize}/100" color="{fontdefault}" text="{shorttext}" />
+        <drawtextbox condition="{ismovie}" x="0" y="{height(shorttextmovie)} + 5" width="96%" float="topright" floatwidth="{width(movieposter)} + 10" floatheight="{height(movieposter)} - {height(shorttextmovie)}" font="{regular}" fontsize="{areaheight}*{detailtextsize}/100" color="{fontdefault}" text="{description}" />
     </tab>
     <!-- TAB RECINFO -->
     <tab name="{tr(recinfo)}" x="3%" y="23%" width="94%" height="61%" layer="4" scrollheight="{areaheight}/4">
-        <drawtext align="center" y="0" name="title" font="{regular}" fontsize="10%" color="{fontdefault}" text="{tr(recinfo)}" />
-        <drawtext name="line1" x="0" y="{height(title)} + 50" width="96%" font="{regular}" fontsize="7%" color="{fontdefault}" text="{tr(recsize)}: {recordingsize}" />
-        <drawtext name="line2" x="0" y="{posy(line1)} + {height(line1)} + 10" width="96%" font="{regular}" fontsize="7%" color="{fontdefault}" text="{tr(recsizecutted)}: {recordingsizecutted}" />
-        <drawtext name="line3" x="0" y="{posy(line2)} + {height(line2)} + 10" width="96%" font="{regular}" fontsize="7%" color="{fontdefault}" text="{tr(reclength)}: {recordinglength}" />
-        <drawtext name="line4" x="0" y="{posy(line3)} + {height(line3)} + 10" width="96%" font="{regular}" fontsize="7%" color="{fontdefault}" text="{tr(reclengthcutted)}: {recordinglengthcutted}" />
-        <drawtext name="line5" x="0" y="{posy(line4)} + {height(line4)} + 10" width="96%" font="{regular}" fontsize="7%" color="{fontdefault}" text="{tr(bitrate)}: {recordingbitrate}" />
-        <drawtext name="line6" x="0" y="{posy(line5)} + {height(line5)} + 10" width="96%" font="{regular}" fontsize="7%" color="{fontdefault}" text="{tr(format)}: {recordingformat}" />
-        <drawtext x="0" y="{posy(line6)} + {height(line6)} + 10" width="96%" font="{regular}" fontsize="7%" color="{fontdefault}" text="{tr(searchtimer)}: {searchtimer}" />
+        <drawtext align="center" y="0" name="title" font="{regular}" fontsize="{areaheight}*{detailtextheadersize}/100" color="{fontdefault}" text="{tr(recinfo)}" />
+        <drawtext name="line1" x="0" y="{height(title)} + 50" width="96%" font="{regular}" fontsize="{areaheight}*{detailtextsize}/100" color="{fontdefault}" text="{tr(recsize)}: {recordingsize}" />
+        <drawtext name="line2" x="0" y="{posy(line1)} + {height(line1)} + 10" width="96%" font="{regular}" fontsize="{areaheight}*{detailtextsize}/100" color="{fontdefault}" text="{tr(recsizecutted)}: {recordingsizecutted}" />
+        <drawtext name="line3" x="0" y="{posy(line2)} + {height(line2)} + 10" width="96%" font="{regular}" fontsize="{areaheight}*{detailtextsize}/100" color="{fontdefault}" text="{tr(reclength)}: {recordinglength}" />
+        <drawtext name="line4" x="0" y="{posy(line3)} + {height(line3)} + 10" width="96%" font="{regular}" fontsize="{areaheight}*{detailtextsize}/100" color="{fontdefault}" text="{tr(reclengthcutted)}: {recordinglengthcutted}" />
+        <drawtext name="line5" x="0" y="{posy(line4)} + {height(line4)} + 10" width="96%" font="{regular}" fontsize="{areaheight}*{detailtextsize}/100" color="{fontdefault}" text="{tr(bitrate)}: {recordingbitrate}" />
+        <drawtext name="line6" x="0" y="{posy(line5)} + {height(line5)} + 10" width="96%" font="{regular}" fontsize="{areaheight}*{detailtextsize}/100" color="{fontdefault}" text="{tr(format)}: {recordingformat}" />
+        <drawtext x="0" y="{posy(line6)} + {height(line6)} + 10" width="96%" font="{regular}" fontsize="{areaheight}*{detailtextsize}/100" color="{fontdefault}" text="{tr(searchtimer)}: {searchtimer}" />
     </tab>
     <!-- TAB ACTORS -->
     <tab condition="{isseries}||{ismovie}" name="{tr(actors)}" x="3%" y="23%" width="94%" height="61%" layer="4" scrollheight="{areaheight}/4">
-        <drawtext align="center" name="title" y="0" font="{regular}" fontsize="12%" color="{fontdefault}" text="{tr(actors)}" />
+        <drawtext align="center" name="title" y="0" font="{regular}" fontsize="{areaheight}*{detailtextheadersize}/100" color="{fontdefault}" text="{tr(actors)}" />
         <loop name="actors" x="0" y="{height(title)} + 10" width="{areawidth}" orientation="horizontal" columnwidth="{areawidth}/7" rowheight="{areawidth}/7*1.65" overflow="linewrap" >
             <drawimage name="thumb" imagetype="image" path="{actors[thumb]}" x="20" y="0" width="{columnwidth}-40" height="{columnwidth} * {actors[thumbheight]} / {actors[thumbwidth]} - 40 * {actors[thumbheight]} / {actors[thumbwidth]}"/>
-            <drawtext align="center" y="{height(thumb)} + 10" width="{columnwidth}" name="actorname" font="{regular}" fontsize="5%" color="{fontdefault}" text="{actors[name]}" />
-            <drawtext align="center" y="{height(thumb)} + 10 + {height(actorname)}" width="{columnwidth}" font="{regular}" fontsize="5%" color="{fontdefault}" text="{actors[role]}" />
+            <drawtext align="center" y="{height(thumb)} + 10" width="{columnwidth}" name="actorname" font="{regular}" fontsize="{areaheight}*{detailactors}/100" color="{fontdefault}" text="{actors[name]}" />
+            <drawtext align="center" y="{height(thumb)} + 10 + {height(actorname)}" width="{columnwidth}" font="{regular}" fontsize="{areaheight}*{detailactors}/100" color="{fontdefault}" text="{actors[role]}" />
         </loop>
     </tab>
     <!-- TAB TVDBINFO -->
@@ -61,12 +61,12 @@
         <drawimage name="banner" imagetype="image" path="{seriesbanner1path}" align="center" y="10" width="{areawidth}*0.7" height="{areawidth} * 0.7 * {seriesbanner1height} / {seriesbanner1width}"/>
         <drawimage name="episodeimage" imagetype="image" path="{episodeimagepath}" x="{areawidth}*0.7" y="{height(banner)} + 20" width="{areawidth}*0.3" height="{areawidth} * 0.3 * {episodeimageheight} / {episodeimagewidth}"/>
         <drawimage name="seasonposter" imagetype="image" path="{seasonposterpath}" x="{areawidth}*0.7" y="{height(banner)} + {height(episodeimage)} + 30" width="{areawidth}*0.3" height="{areawidth} * 0.3 * {seasonposterheight} / {seasonposterwidth}"/>
-        <drawtextbox x="0" y="{height(banner)} + 20" width="96%" float="topright" floatwidth="{width(seasonposter)} + 10" floatheight="{height(episodeimage)} + {height(seasonposter)} + 30" font="{regular}" fontsize="6%" color="{fontdefault}" text="{tr(episode)}: {episodetitle} ({tr(season)} {episodeseason}, {tr(episode)} {episodenumber}) &#10;&#10;{episodeoverview}|&#10;&#10;{tr(gueststars)}: {episodegueststars}||&#10;&#10;{tr(seriesfirstaired)}: {seriesfirstaired}||&#10;{tr(episodefirstaired)}: {episodefirstaired}||&#10;{tr(network)}: {seriesnetwork}||&#10;{tr(genre)}: {seriesgenre}||&#10;{tr(status)}: {seriesstatus}||&#10;{tr(rating)}: {seriesrating}||&#10;{tr(episoderating)}: {episoderating}&#10;|{seriesoverview}&#10;" />
+        <drawtextbox x="0" y="{height(banner)} + 20" width="96%" float="topright" floatwidth="{width(seasonposter)} + 10" floatheight="{height(episodeimage)} + {height(seasonposter)} + 30" font="{regular}" fontsize="{areaheight}*{detailtextsize}/100" color="{fontdefault}" text="{tr(episode)}: {episodetitle} ({tr(season)} {episodeseason}, {tr(episode)} {episodenumber}) &#10;&#10;{episodeoverview}|&#10;&#10;{tr(gueststars)}: {episodegueststars}||&#10;&#10;{tr(seriesfirstaired)}: {seriesfirstaired}||&#10;{tr(episodefirstaired)}: {episodefirstaired}||&#10;{tr(network)}: {seriesnetwork}||&#10;{tr(genre)}: {seriesgenre}||&#10;{tr(status)}: {seriesstatus}||&#10;{tr(rating)}: {seriesrating}||&#10;{tr(episoderating)}: {episoderating}&#10;|{seriesoverview}&#10;" />
     </tab>
     <!-- TAB MOVIEDBINFO -->
     <tab condition="{ismovie}" name="MovieDBInfo" x="3%" y="23%" width="94%" height="61%" layer="4" scrollheight="{areaheight}/4">
         <drawimage name="poster" imagetype="image" path="{posterpath}" x="70%" y="10" width="{areawidth}*0.3" height="{areawidth} * 0.3 * {posterheight} / {posterwidth}"/>
-        <drawtextbox x="0" y="10" width="96%" float="topright" floatwidth="{width(poster)} + 10" floatheight="{height(poster)} + 20" font="{regular}" fontsize="6%" color="{fontdefault}" text="{tr(originaltitle)}: {movieoriginalTitle}&#10;&#10;|{tr(genre)}: {moviegenres}&#10;&#10;||{movietagline}&#10;&#10;|{movieoverview}&#10;&#10;|{tr(budget)}: {moviebudget}&#10;||{tr(revenue)}: {movierevenue}&#10;&#10;||{tr(adult)}: {movieadult}&#10;||{tr(releasedate)}: {moviereleasedate}&#10;||{tr(runtime)}: {movieruntime} min&#10;||&#10;{tr(popularity)}: {moviepopularity}&#10;||&#10;{tr(voteaverage)}: {movievoteaverage}&#10;||&#10;{tr(homepage)}: {moviehomepage}|&#10;" />
+        <drawtextbox x="0" y="10" width="96%" float="topright" floatwidth="{width(poster)} + 10" floatheight="{height(poster)} + 20" font="{regular}" fontsize="{areaheight}*{detailtextsize}/100" color="{fontdefault}" text="{tr(originaltitle)}: {movieoriginalTitle}&#10;&#10;|{tr(genre)}: {moviegenres}&#10;&#10;||{movietagline}&#10;&#10;|{movieoverview}&#10;&#10;|{tr(budget)}: {moviebudget}&#10;||{tr(revenue)}: {movierevenue}&#10;&#10;||{tr(adult)}: {movieadult}&#10;||{tr(releasedate)}: {moviereleasedate}&#10;||{tr(runtime)}: {movieruntime} min&#10;||&#10;{tr(popularity)}: {moviepopularity}&#10;||&#10;{tr(voteaverage)}: {movievoteaverage}&#10;||&#10;{tr(homepage)}: {moviehomepage}|&#10;" />
     </tab>
     <!-- TAB SERIESGALERY -->
     <tab condition="{isseries}" name="{tr(seriesgalery)}" x="3%" y="23%" width="94%" height="61%" layer="4" scrollheight="{areaheight}*0.61">
@@ -95,13 +95,13 @@
                 <drawrectangle condition="not{tabs[current]}" x="0" y="0" width="{width(label)}" height="100%" color="{menuback}" />
                 <drawrectangle x="{columnwidth}-1" y="0" width="1" height="100%" color="{menubackline}" />
                 <drawrectangle condition="{tabs[current]}" x="0" y="0" width="{width(label)}" height="100%" color="{menubackactive}" />
-                <drawtext name="label" x="0" valign="center" font="{regular}" fontsize="60%" color="00000000" text="  {tabs[title]}  " />
+                <drawtext name="label" x="0" valign="center" font="{regular}" fontsize="{areaheight}*{tablabels}/100" color="00000000" text="  {tabs[title]}  " />
             </loop>
         </area>
         <area x="2%" y="85%" width="{areawidth} - 60" height="6%" layer="4">
             <loop name="tabs" x="0" y="0" orientation="horizontal">
-                <drawtext condition="not{tabs[current]}" x="0" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="  {tabs[title]}  " />
-                <drawtext condition="{tabs[current]}" x="0" valign="center" font="{regular}" fontsize="60%" color="{fontmenuactive}" text="  {tabs[title]}  " />
+                <drawtext condition="not{tabs[current]}" x="0" valign="center" font="{regular}" fontsize="{areaheight}*{tablabels}/100" color="{fontdefault}" text="  {tabs[title]}  " />
+                <drawtext condition="{tabs[current]}" x="0" valign="center" font="{regular}" fontsize="{areaheight}*{tablabels}/100" color="{fontmenuactive}" text="  {tabs[title]}  " />
             </loop>
         </area>
     </tablabels>
diff --git a/skins/estuary4vdr/xmlfiles/displaymenudetailtext.xml b/skins/estuary4vdr/xmlfiles/displaymenudetailtext.xml
index 41c0735..70ab8be 100644
--- a/skins/estuary4vdr/xmlfiles/displaymenudetailtext.xml
+++ b/skins/estuary4vdr/xmlfiles/displaymenudetailtext.xml
@@ -16,7 +16,7 @@
     </scrollbar>
 
     <tab name="text" x="3%" y="11%" width="95%" height="78%" layer="3" scrollheight="{areaheight}/4">
-        <drawtextbox x="0" y="0" width="100%" font="{regular}" fontsize="5%" color="{fontdefault}" text="{text}" />
+        <drawtextbox x="0" y="0" width="100%" font="{regular}" fontsize="{areaheight}*{detailtextsize}/100" color="{fontdefault}" text="{text}" />
     </tab>
 
 </menudetailedtext>
\ No newline at end of file
diff --git a/skins/estuary4vdr/xmlfiles/displaymenumain.xml b/skins/estuary4vdr/xmlfiles/displaymenumain.xml
index f0c2312..ef9b362 100644
--- a/skins/estuary4vdr/xmlfiles/displaymenumain.xml
+++ b/skins/estuary4vdr/xmlfiles/displaymenumain.xml
@@ -2,7 +2,7 @@
 
     <header>
         <area x="1%" y="0" width="50%" height="7%" layer="2">
-            <drawtext x="0" valign="center" fontsize="80%" font="{regular}" color="{fontdefault}" text="{title} {vdrversion}" />
+            <drawtext x="0" valign="center" fontsize="{areaheight}*{headerfontsize}/100" font="{regular}" color="{fontdefault}" text="{title} {vdrversion}" />
         </area>
     </header>
 
@@ -92,7 +92,7 @@
         </area>
     </temperatures>
 
-    <menuitems x="2%" y="9%" orientation="vertical" width="30%" height="60%" align="center" numlistelements="8">
+    <menuitems x="2%" y="9%" orientation="vertical" width="30%" height="60%" align="center" numlistelements="{numitemsmain}">
         <listelement>
             <area x="0" y="0" width="100%" height="100%" layer="3">
                 <drawrectangle condition="not{current}" x="0" y="0" width="100%" height="100%" color="{menuback}" />
@@ -101,16 +101,16 @@
                 <drawrectangle condition="{current}" x="15%" y="0" width="85%" height="100%" color="{menubackactive}" />
             </area>
             <area x="0" y="0" width="15%" height="100%" layer="3">
-                <drawimage condition="not{current}" imagetype="menuicon" path="{icon}" align="center" valign="center" width="{areaheight}*0.6" height="{areaheight}*0.6"/>
-                <drawimage condition="{current}" imagetype="menuicon" path="{icon}_active" align="center" valign="center" width="{areaheight}*0.6" height="{areaheight}*0.6"/>
+                <drawimage condition="not{current}" imagetype="menuicon" path="{icon}" align="center" valign="center" width="{areaheight}*{mainiconsize}/100" height="{areaheight}*{mainiconsize}/100"/>
+                <drawimage condition="{current}" imagetype="menuicon" path="{icon}_active" align="center" valign="center" width="{areaheight}*{mainiconsize}/100" height="{areaheight}*{mainiconsize}/100"/>
             </area>
             <areascroll condition="{showlistnumbers}" scrollelement="menutext" mode="forthandback" orientation="horizontal" delay="1000" scrollspeed="medium" x="20%" width="79%" layer="3">
-                <drawtext condition="not{current}" x="0" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{number} {label}" />
-                <drawtext condition="{current}" name="menutext" x="0" valign="center" font="{regular}" fontsize="60%" color="{fontmenuactive}" text="{number} {label}" />
+                <drawtext condition="not{current}" x="0" valign="center" font="{regular}" fontsize="{areaheight}*{mainfontsize}/100" color="{fontdefault}" text="{number} {label}" />
+                <drawtext condition="{current}" name="menutext" x="0" valign="center" font="{regular}" fontsize="{areaheight}*{mainfontsize}/100" color="{fontmenuactive}" text="{number} {label}" />
             </areascroll>
             <areascroll condition="not{showlistnumbers}" scrollelement="menutext" mode="forthandback" orientation="horizontal" delay="1000" scrollspeed="medium" x="20%" width="79%" layer="3">
-                <drawtext condition="not{current}" x="0" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{label}" />
-                <drawtext condition="{current}" name="menutext" x="0" valign="center" font="{regular}" fontsize="60%" color="{fontmenuactive}" text="{label}" />
+                <drawtext condition="not{current}" x="0" valign="center" font="{regular}" fontsize="{areaheight}*{mainfontsize}/100" color="{fontdefault}" text="{label}" />
+                <drawtext condition="{current}" name="menutext" x="0" valign="center" font="{regular}" fontsize="{areaheight}*{mainfontsize}/100" color="{fontmenuactive}" text="{label}" />
             </areascroll>
         </listelement>
     </menuitems>
diff --git a/skins/estuary4vdr/xmlfiles/displaymenurecordings.xml b/skins/estuary4vdr/xmlfiles/displaymenurecordings.xml
index 4afeda5..e5518e2 100644
--- a/skins/estuary4vdr/xmlfiles/displaymenurecordings.xml
+++ b/skins/estuary4vdr/xmlfiles/displaymenurecordings.xml
@@ -1,7 +1,31 @@
 <menurecordings x="0" y="0" width="100%" height="100%" fadetime="0" scaletvx="39%" scaletvy="8%" scaletvwidth="60%" scaletvheight="60%">
 
-    <menuitems x="2%" y="9%" orientation="vertical" width="98%" height="82%" align="center" numlistelements="12">
+    <background>
+        <area x="0" y="0" width="100%" height="100%" layer="1">
+            <drawimage condition="eq({indexrecmenustyle}, 0)" imagetype="skinpart" x="0" y="0" width="100%" height="100%" path="background_menu_tvframe" />
+            <drawimage condition="eq({indexrecmenustyle}, 1)" imagetype="skinpart" x="0" y="0" width="100%" height="100%" path="background_menu" />
+        </area>
+        <area condition="eq({indexrecmenustyle}, 0)" x="39%" y="70%" width="60%" height="20%" layer="2">
+            <fill color="{menuback}" />
+        </area>
+    </background>
 
+    <scrollbar>
+        <area condition="lt({height}, 1000) ++ eq({indexrecmenustyle}, 0)" x="33%" y="9%" width="{areawidth}*0.01" height="82%" layer="2">
+            <fill color="{menuback}" />
+        </area>
+        <area condition="lt({height}, 1000) ++ eq({indexrecmenustyle}, 1)" x="98%" y="9%" width="{areawidth}*0.01" height="82%" layer="2">
+            <fill color="{menuback}" />
+        </area>
+        <area condition="lt({height}, 1000) ++ eq({indexrecmenustyle}, 0)" x="33%" y="9%" width="{areawidth}*0.01" height="82%" layer="3">
+            <drawrectangle x="0" y="{areaheight} * {offset} / 1000" width="100%" height="{areaheight} * {height} / 1000" color="{progressbar}" />
+        </area>
+        <area condition="lt({height}, 1000) ++ eq({indexrecmenustyle}, 1)" x="98%" y="9%" width="{areawidth}*0.01" height="82%" layer="3">
+            <drawrectangle x="0" y="{areaheight} * {offset} / 1000" width="100%" height="{areaheight} * {height} / 1000" color="{progressbar}" />
+        </area>
+    </scrollbar>
+
+    <menuitems x="2%" y="9%" condition="eq({indexrecmenustyle}, 0)" orientation="vertical" width="98%" height="82%" align="center" numlistelements="{numitemsrecnarrow}">
         <listelement>
             <area x="0" y="0" width="{areawidth}*0.305" height="100%" layer="2">
                 <drawrectangle condition="not{current}" x="0" y="0" width="100%" height="100%" color="{menuback}" />
@@ -13,33 +37,32 @@
                 <drawimage condition="not{current}" imagetype="icon" path="ico_recfolder" x="0" width="0.8*{areaheight}" height="0.9*{areaheight}" valign="center" />
                 <drawimage condition="{current}" imagetype="icon" path="ico_recfolder_active" x="0" width="0.8*{areaheight}" height="0.9*{areaheight}" valign="center" />
             </area>
-            <area condition="{folder}" x="6%" y="50%" width="24%" height="50%" layer="3">
-                <drawtext condition="not{current}" x="0" y="0" font="{regular}" fontsize="80%" color="{fontdefault}" text="({numrecordingsfolder} recordings, {newrecordingsfolder} new)" />
-                <drawtext condition="{current}" x="0" y="0" font="{regular}" fontsize="80%" color="{fontmenuactive}" text="({numrecordingsfolder} recordings, {newrecordingsfolder} new)" />
+            <area condition="{folder}" x="6%" width="24%" layer="3">
+                <drawtext condition="not{current}" x="0" y="{areaheight}*{recposyfolderstats}/100" font="{regular}" fontsize="{areaheight}*{recsizefolderstats}/100" color="{fontdefault}" text="({numrecordingsfolder} recordings, {newrecordingsfolder} new)" />
+                <drawtext condition="{current}" x="0" y="{areaheight}*{recposyfolderstats}/100" font="{regular}" fontsize="{areaheight}*{recsizefolderstats}/100" color="{fontmenuactive}" text="({numrecordingsfolder} recordings, {newrecordingsfolder} new)" />
             </area>
-
-            <areascroll condition="{folder}" scrollelement="foldertext" mode="forthandback" orientation="horizontal" delay="1000" scrollspeed="medium" x="6%" y="0" width="24%" height="50%" layer="3">
-                <drawtext condition="not{current}" x="0" valign="bottom" font="{regular}" fontsize="95%" color="{fontdefault}" text="{name}" />
-                <drawtext condition="{current}" x="0" valign="bottom" font="{regular}" fontsize="95%" color="{fontmenuactive}" text="{name}" />
+            <areascroll condition="{folder}" scrollelement="foldertext" mode="forthandback" orientation="horizontal" delay="1000" scrollspeed="medium" x="6%" width="24%" layer="3">
+                <drawtext condition="not{current}" x="0" y="{areaheight}*{recposyfoldertitle}/100" font="{regular}" fontsize="{areaheight}*{recsizefoldertitle}/100" color="{fontdefault}" text="{name}" />
+                <drawtext condition="{current}" x="0" y="{areaheight}*{recposyfoldertitle}/100" font="{regular}" fontsize="{areaheight}*{recsizefoldertitle}/100" color="{fontmenuactive}" text="{name}" />
             </areascroll>
-            
-            <area condition="not{folder}++not{current}" x="1%" y="0" width="29%" height="50%" layer="3">
-                <drawtext x="0" y="15%" font="{regular}" fontsize="80%" color="{fontdefault}" text="{printf('%02d.%02d.%d', daynumeric, month, year)} {time}" />
-                <drawimage condition="{new}" name="new" imagetype="icon" path="ico_new" x="{areawidth} - {areaheight}" width="0.9*{areaheight}" height="0.9*{areaheight}" valign="center" />
-                <drawimage condition="{new}++{cutted}" imagetype="icon" path="ico_cutted" x="{areawidth} - 2*{areaheight}" width="0.9*{areaheight}" height="0.9*{areaheight}" valign="center" />
-                <drawimage condition="not{new}++{cutted}" imagetype="icon" path="ico_cutted" x="{areawidth} - {areaheight}" width="0.9*{areaheight}" height="0.9*{areaheight}" valign="center" />
+            <!-- recording -->
+            <area condition="not{folder}++not{current}" x="1%" y="0" width="29%" layer="3">
+                <drawtext x="0" y="{areaheight}*{recposydate}/100" font="{regular}" fontsize="{areaheight}*{recsizedate}/100" color="{fontdefault}" text="{printf('%02d.%02d.%d', daynumeric, month, year)} {time}" />
+                <drawimage condition="{new}" name="new" imagetype="icon" path="ico_new" x="{areawidth} - {areaheight}/2" y="5%" width="0.45*{areaheight}" height="0.45*{areaheight}" />
+                <drawimage condition="{new}++{cutted}" imagetype="icon" path="ico_cutted" x="{areawidth} - {areaheight}" y="5%" width="0.45*{areaheight}" height="0.45*{areaheight}" />
+                <drawimage condition="not{new}++{cutted}" imagetype="icon" path="ico_cutted" x="{areawidth} - {areaheight}/2" y="5%" width="0.45*{areaheight}" height="0.45*{areaheight}" />
             </area>
-            <area condition="not{folder}++{current}" x="1%" y="0" width="29%" height="50%" layer="3">
-                <drawtext x="0" y="15%" font="{regular}" fontsize="80%" color="{fontmenuactive}" text="{printf('%02d.%02d.%d', daynumeric, month, year)} {time}" />
-                <drawimage condition="{new}" name="new" imagetype="icon" path="ico_new_active" x="{areawidth} - {areaheight}" width="0.9*{areaheight}" height="0.9*{areaheight}" valign="center" />
-                <drawimage condition="{new}++{cutted}" imagetype="icon" path="ico_cutted_active" x="{areawidth} - 2*{areaheight}" width="0.9*{areaheight}" height="0.9*{areaheight}" valign="center" />
-                <drawimage condition="not{new}++{cutted}" imagetype="icon" path="ico_cutted_active" x="{areawidth} - {areaheight}" width="0.9*{areaheight}" height="0.9*{areaheight}" valign="center" />
+            <area condition="not{folder}++{current}" x="1%" y="0" width="29%" layer="3">
+                <drawtext x="0" y="{areaheight}*{recposydate}/100" font="{regular}" fontsize="{areaheight}*{recsizedate}/100" color="{fontmenuactive}" text="{printf('%02d.%02d.%d', daynumeric, month, year)} {time}" />
+                <drawimage condition="{new}" name="new" imagetype="icon" path="ico_new_active" x="{areawidth} - {areaheight}/2" y="5%" width="0.45*{areaheight}" height="0.45*{areaheight}" />
+                <drawimage condition="{new}++{cutted}" imagetype="icon" path="ico_cutted_active" x="{areawidth} - {areaheight}" y="5%" width="0.45*{areaheight}" height="0.45*{areaheight}" />
+                <drawimage condition="not{new}++{cutted}" imagetype="icon" path="ico_cutted_active" x="{areawidth} - {areaheight}/2" y="5%" width="0.45*{areaheight}" height="0.45*{areaheight}" />
             </area>
-            <areascroll condition="not{current}++not{folder}" scrollelement="rectitle" mode="forthandback" orientation="horizontal" delay="1000" scrollspeed="medium" x="1%" y="45%" width="29%" height="50%" layer="3">
-                <drawtext name="rectitle" x="0" width="100%" y="0" font="{regular}" fontsize="100%" color="{fontdefault}" text="{name}" />
+            <areascroll condition="not{current}++not{folder}" scrollelement="rectitle" mode="forthandback" orientation="horizontal" delay="1000" scrollspeed="medium" x="1%" width="29%" layer="3">
+                <drawtext name="rectitle" x="0" width="100%" y="{areaheight}*{recposytitle}/100" font="{regular}" fontsize="{areaheight}*{recsizetitle}/100" color="{fontdefault}" text="{name}" />
             </areascroll>
-            <areascroll condition="{current}++not{folder}" scrollelement="rectitle" mode="forthandback" orientation="horizontal" delay="1000" scrollspeed="medium" x="1%" y="45%" width="29%" height="50%" layer="3">
-                <drawtext name="rectitle" x="0" width="100%" y="0" font="{regular}" fontsize="100%" color="{fontmenuactive}" text="{name}" />
+            <areascroll condition="{current}++not{folder}" scrollelement="rectitle" mode="forthandback" orientation="horizontal" delay="1000" scrollspeed="medium" x="1%" width="29%" layer="3">
+                <drawtext name="rectitle" x="0" width="100%" y="{areaheight}*{recposytitle}/100" font="{regular}" fontsize="{areaheight}*{recsizetitle}/100" color="{fontmenuactive}" text="{name}" />
             </areascroll>
         </listelement>
 
@@ -48,19 +71,97 @@
                 <drawimage imagetype="image" path="{posterpath}" x="0" valign="center" width="{areawidth}" height="{areawidth} * {posterheight} / {posterwidth}" />
             </area>
             <areascroll condition="{hasposter}" orientation="vertical" mode="forthandback" delay="3000" scrollspeed="medium" x="47%" y="76%" width="49%" height="20%" layer="3">
-                <drawtext name="datetime" x="0" y="0" font="{regular}" width="100%" fontsize="20%" color="{fontdefault}" text="{date} {time}, {duration} min" />
-                <drawtext name="title" x="0" y="{height(datetime)}" font="{regular}" width="100%" fontsize="25%" color="{fontdefault}" text="{epgname}" />
-                <drawtextbox name="shorttext" x="0" y="{posy(title)} + {height(title)}" width="100%" font="{regular}" fontsize="20%" color="{fontdefault}" text="{shorttext}" />
-                <drawtextbox x="0" y="{posy(shorttext)} + {height(shorttext)} + 10" width="100%" font="{regular}" fontsize="20%" color="{fontdefault}" text="{description}" />
+                <drawtext name="datetime" x="0" y="0" font="{regular}" width="100%" fontsize="{areaheight}*{recsizecurrenttext}/100" color="{fontdefault}" text="{date} {time}, {duration} min" />
+                <drawtext name="title" x="0" y="{height(datetime)}" font="{regular}" width="100%" fontsize="{areaheight}*{recsizecurrenttitle}/100" color="{fontdefault}" text="{epgname}" />
+                <drawtextbox name="shorttext" x="0" y="{posy(title)} + {height(title)}" width="100%" font="{regular}" fontsize="{areaheight}*{recsizecurrenttext}/100" color="{fontdefault}" text="{shorttext}" />
+                <drawtextbox x="0" y="{posy(shorttext)} + {height(shorttext)} + 10" width="100%" font="{regular}" fontsize="{areaheight}*{recsizecurrenttext}/100" color="{fontdefault}" text="{description}" />
             </areascroll>
             <areascroll condition="not{hasposter}" orientation="vertical" mode="forthandback" delay="3000" scrollspeed="medium" x="39%" y="76%" width="57%" height="20%" layer="3">
-                <drawtext name="datetime" x="0" y="0" font="{regular}" width="100%" fontsize="20%" color="{fontdefault}" text="{date} {time}, {duration} min" />
-                <drawtext name="title" x="0" y="{height(datetime)}" font="{regular}" width="100%" fontsize="25%" color="{fontdefault}" text="{epgname}" />
-                <drawtextbox name="shorttext" x="0" y="{posy(title)}+{height(title)}" width="100%" font="{regular}" fontsize="20%" color="{fontdefault}" text="{shorttext}" />
-                <drawtextbox x="0" y="{posy(shorttext)} + {height(shorttext)} + 10" width="100%" font="{regular}" fontsize="20%" color="{fontdefault}" text="{description}" />
+                <drawtext name="datetime" x="0" y="0" font="{regular}" width="100%" fontsize="{areaheight}*{recsizecurrenttext}/100" color="{fontdefault}" text="{date} {time}, {duration} min" />
+                <drawtext name="title" x="0" y="{height(datetime)}" font="{regular}" width="100%" fontsize="{areaheight}*{recsizecurrenttitle}/100" color="{fontdefault}" text="{epgname}" />
+                <drawtextbox name="shorttext" x="0" y="{posy(title)}+{height(title)}" width="100%" font="{regular}" fontsize="{areaheight}*{recsizecurrenttext}/100" color="{fontdefault}" text="{shorttext}" />
+                <drawtextbox x="0" y="{posy(shorttext)} + {height(shorttext)} + 10" width="100%" font="{regular}" fontsize="{areaheight}*{recsizecurrenttext}/100" color="{fontdefault}" text="{description}" />
             </areascroll>
         </currentelement>
-
     </menuitems>
 
+    <menuitems x="2%" y="9%" condition="eq({indexrecmenustyle}, 1)" orientation="vertical" width="95%" height="82%" align="center" numlistelements="{numitemsrecwide}">
+        <listelement>
+            <area x="0" y="0" width="100%" height="100%" layer="2">
+                <drawrectangle condition="not{current}" x="0" y="0" width="100%" height="100%" color="{menuback}" />
+                <drawrectangle condition="not{current}" x="0" y="{areaheight}-1" width="100%" height="1" color="{menubackline}" />
+                <drawrectangle condition="{current}" x="0" y="0" width="100%" height="100%" color="{menubackactive}" />
+            </area>
+            <!-- recording folder -->
+            <areacontainer condition="{folder}">
+                <area x="1%" width="6%" layer="3">
+                    <drawimage condition="not{current}" imagetype="icon" path="ico_recfolder" x="0" width="0.8*{areaheight}" height="0.9*{areaheight}" valign="center" />
+                    <drawimage condition="{current}" imagetype="icon" path="ico_recfolder_active" x="0" width="0.8*{areaheight}" height="0.9*{areaheight}" valign="center" />
+                </area>
+                <areascroll scrollelement="foldertext" mode="forthandback" orientation="horizontal" delay="1000" scrollspeed="medium" x="6%" y="0" width="93%" height="100%" layer="3">
+                    <drawtext condition="not{current}" x="0" valign="center" font="{regular}" fontsize="{areaheight}*{recsizewide}/100" color="{fontdefault}" text="{name} ({numrecordingsfolder} recordings, {newrecordingsfolder} new)" />
+                    <drawtext condition="{current}" x="0" valign="center" font="{regular}" fontsize="{areaheight}*{recsizewide}/100" color="{fontmenuactive}" text="{name} ({numrecordingsfolder} recordings, {newrecordingsfolder} new)" />
+                </areascroll>
+            </areacontainer>
+            <areacontainer condition="not{folder}">
+                <area condition="not{current}" x="94%" width="6%" layer="3">
+                    <drawimage condition="{new}" name="new" imagetype="icon" path="ico_new" x="{areawidth} - 0.6*{areaheight}" width="0.6*{areaheight}" height="0.6*{areaheight}" valign="center" />
+                    <drawimage condition="{cutted}" imagetype="icon" path="ico_cutted" x="{areawidth} - 1.3*{areaheight}" width="0.6*{areaheight}" height="0.6*{areaheight}" valign="center" />
+                </area>
+                <area condition="{current}" x="94%" width="6%" layer="3">
+                    <drawimage condition="{new}" name="new" imagetype="icon" path="ico_new_active" x="{areawidth} - 0.6*{areaheight}" width="0.6*{areaheight}" height="0.6*{areaheight}" valign="center" />
+                    <drawimage condition="{cutted}" imagetype="icon" path="ico_cutted_active" x="{areawidth} - 1.3*{areaheight}" width="0.6*{areaheight}" height="0.6*{areaheight}" valign="center" />
+                </area>
+                <areascroll condition="not{current}" scrollelement="rectitle" mode="forthandback" orientation="horizontal" delay="1000" scrollspeed="medium" x="1%" width="93%" layer="3">
+                    <drawtext name="rectitle" x="0" width="100%" valign="center" font="{regular}" fontsize="{areaheight}*{recsizewide}/100" color="{fontdefault}" text="{printf('%02d.%02d.%d', daynumeric, month, year)} {time}  {name}" />
+                </areascroll>
+                <areascroll condition="{current}" scrollelement="rectitle" mode="forthandback" orientation="horizontal" delay="1000" scrollspeed="medium" x="1%" width="93%" layer="3">
+                    <drawtext name="rectitle" x="0" width="100%" valign="center" font="{regular}" fontsize="{areaheight}*{recsizewide}/100" color="{fontmenuactive}" text="{printf('%02d.%02d.%d', daynumeric, month, year)} {time}  {name}" />
+                </areascroll>
+            </areacontainer>
+        </listelement>
+
+        <currentelement delay="1000" fadetime="200">
+            <areacontainer condition="{recshowcurrent} ++ lt({numitem}, 11)">
+                <area x="20%" y="{menuitemy}+{menuitemheight}" width="80%" height="31%" layer="4">
+                    <fill color="{messageback}" />
+                </area>
+                <area condition="{hasposter}" x="21%" y="{menuitemy}+{menuitemheight}" width="12%" height="30%" layer="5">
+                    <drawimage imagetype="image" path="{posterpath}" x="0" valign="center" width="{areawidth}" height="{areawidth} * {posterheight} / {posterwidth}" />
+                </area>
+                <areascroll condition="{hasposter}" orientation="vertical" mode="forthandback" delay="3000" scrollspeed="medium" x="34%" y="{menuitemy}+{menuitemheight} + {areaheight}*0.01" width="65%" height="29%" layer="5">
+                    <drawtext name="datetime" x="0" y="0" font="{regular}" width="100%" fontsize="{areaheight}*{recsizecurrenttext}/100" color="{fontdefault}" text="{date} {time}, {duration} min" />
+                    <drawtext name="title" x="0" y="{height(datetime)}" font="{regular}" width="100%" fontsize="{areaheight}*{recsizecurrenttitle}/100" color="{fontdefault}" text="{epgname}" />
+                    <drawtextbox name="shorttext" x="0" y="{posy(title)} + {height(title)}" width="100%" font="{regular}" fontsize="{areaheight}*{recsizecurrenttext}/100" color="{fontdefault}" text="{shorttext}" />
+                    <drawtextbox x="0" y="{posy(shorttext)} + {height(shorttext)} + 10" width="100%" font="{regular}" fontsize="{areaheight}*{recsizecurrenttext}/100" color="{fontdefault}" text="{description}" />
+                </areascroll>
+                <areascroll condition="not{hasposter}" orientation="vertical" mode="forthandback" delay="3000" scrollspeed="medium" x="21%" y="{menuitemy}+{menuitemheight} + {areaheight}*0.01" width="78%" height="29%" layer="5">
+                    <drawtext name="datetime" x="0" y="0" font="{regular}" width="100%" fontsize="{areaheight}*{recsizecurrenttext}/100" color="{fontdefault}" text="{date} {time}, {duration} min" />
+                    <drawtext name="title" x="0" y="{height(datetime)}" font="{regular}" width="100%" fontsize="{areaheight}*{recsizecurrenttitle}/100" color="{fontdefault}" text="{epgname}" />
+                    <drawtextbox name="shorttext" x="0" y="{posy(title)}+{height(title)}" width="100%" font="{regular}" fontsize="{areaheight}*{recsizecurrenttext}/100" color="{fontdefault}" text="{shorttext}" />
+                    <drawtextbox x="0" y="{posy(shorttext)} + {height(shorttext)} + 10" width="100%" font="{regular}" fontsize="{areaheight}*{recsizecurrenttext}/100" color="{fontdefault}" text="{description}" />
+                </areascroll>
+            </areacontainer>
+            <areacontainer condition="{recshowcurrent} ++ gt({numitem}, 10)">
+                <area x="20%" y="{menuitemy} - {areaheight}*0.31" width="80%" height="31%" layer="4">
+                    <fill color="{messageback}" />
+                </area>
+                <area condition="{hasposter}" x="21%" y="{menuitemy} - {areaheight}*0.31" width="12%" height="30%" layer="5">
+                    <drawimage imagetype="image" path="{posterpath}" x="0" valign="center" width="{areawidth}" height="{areawidth} * {posterheight} / {posterwidth}" />
+                </area>
+                <areascroll condition="{hasposter}" orientation="vertical" mode="forthandback" delay="3000" scrollspeed="medium" x="34%" y="{menuitemy} + {areaheight}*0.01 - {areaheight}*0.31" width="65%" height="29%" layer="5">
+                    <drawtext name="datetime" x="0" y="0" font="{regular}" width="100%" fontsize="{areaheight}*{recsizecurrenttext}/100" color="{fontdefault}" text="{date} {time}, {duration} min" />
+                    <drawtext name="title" x="0" y="{height(datetime)}" font="{regular}" width="100%" fontsize="{areaheight}*{recsizecurrenttitle}/100" color="{fontdefault}" text="{epgname}" />
+                    <drawtextbox name="shorttext" x="0" y="{posy(title)} + {height(title)}" width="100%" font="{regular}" fontsize="{areaheight}*{recsizecurrenttext}/100" color="{fontdefault}" text="{shorttext}" />
+                    <drawtextbox x="0" y="{posy(shorttext)} + {height(shorttext)} + 10" width="100%" font="{regular}" fontsize="{areaheight}*{recsizecurrenttext}/100" color="{fontdefault}" text="{description}" />
+                </areascroll>
+                <areascroll condition="not{hasposter}" orientation="vertical" mode="forthandback" delay="3000" scrollspeed="medium" x="21%" y="{menuitemy} + {areaheight}*0.01 - {areaheight}*0.31" width="78%" height="29%" layer="5">
+                    <drawtext name="datetime" x="0" y="0" font="{regular}" width="100%" fontsize="{areaheight}*{recsizecurrenttext}/100" color="{fontdefault}" text="{date} {time}, {duration} min" />
+                    <drawtext name="title" x="0" y="{height(datetime)}" font="{regular}" width="100%" fontsize="{areaheight}*{recsizecurrenttitle}/100" color="{fontdefault}" text="{epgname}" />
+                    <drawtextbox name="shorttext" x="0" y="{posy(title)}+{height(title)}" width="100%" font="{regular}" fontsize="{areaheight}*{recsizecurrenttext}/100" color="{fontdefault}" text="{shorttext}" />
+                    <drawtextbox x="0" y="{posy(shorttext)} + {height(shorttext)} + 10" width="100%" font="{regular}" fontsize="{areaheight}*{recsizecurrenttext}/100" color="{fontdefault}" text="{description}" />
+                </areascroll>
+            </areacontainer>
+        </currentelement>
+    </menuitems>
 </menurecordings>
\ No newline at end of file
diff --git a/skins/estuary4vdr/xmlfiles/displaymenuschedules.xml b/skins/estuary4vdr/xmlfiles/displaymenuschedules.xml
index fd5dac5..0d238bd 100644
--- a/skins/estuary4vdr/xmlfiles/displaymenuschedules.xml
+++ b/skins/estuary4vdr/xmlfiles/displaymenuschedules.xml
@@ -2,13 +2,13 @@
 
     <header>
         <area x="1%" y="0" width="60%" height="7%" layer="2">
-            <drawtext condition="{whatsonnow}||{whatsonnext}||{whatsonfavorites}" x="0" valign="center" font="{regular}" fontsize="100%" color="{fontdefault}" text="{title}" />
+            <drawtext condition="{whatsonnow}||{whatsonnext}||{whatsonfavorites}" x="0" valign="center" font="{regular}" fontsize="{areaheight}*{headerfontsize}/100" color="{fontdefault}" text="{title}" />
             <drawimage name="logo" condition="{whatson}" imagetype="channellogo" path="{channelid}" x="0" width="8%" height="100%" valign="center" />
-            <drawtext condition="{whatson}" x="{posx(logo)} + {width(logo)}+20" valign="center" font="{regular}" fontsize="80%" color="{fontdefault}" text="{channelnumber} - {channelname}" />
+            <drawtext condition="{whatson}" x="{posx(logo)} + {width(logo)}+20" valign="center" font="{regular}" fontsize="{areaheight}*{headerfontsize}/100" color="{fontdefault}" text="{channelnumber} - {channelname}" />
         </area>
     </header>
 
-    <menuitems x="2%" y="9%" orientation="vertical" width="98%" height="82%" align="center" numlistelements="12">
+    <menuitems x="2%" y="9%" orientation="vertical" width="98%" height="82%" align="center" numlistelements="{numitemsschedueles}">
         <listelement>
             <!-- background and progressbar -->
             <area x="0" y="0" width="{areawidth}*0.305" height="100%" layer="2">
@@ -29,68 +29,72 @@
             </area>
             <!-- day or channel separator -->
             <area condition="{separator}" x="1%" width="{areawidth}*0.295" layer="3">
-                <drawtext x="0" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{title}" />
-            </area>      
+                <drawtext x="0" valign="center" font="{regular}" fontsize="{areaheight}*{schedulesseparator}/100" color="{fontdefault}" text="{title}" />
+            </area>
             <!-- element whatson -->
             <area condition="not{separator}++{whatson}++not{current}" x="1%" width="{areawidth}*0.295" layer="3">
-                <drawtext x="0" y="8%" font="{regular}" fontsize="35%" color="{fontdefault}" text="{start} - {stop}" />
+                <drawtext condition="{istoday}" x="0" y="{areaheight}*{schedulesposydate}/100" font="{regular}" fontsize="{areaheight}*{schedulessizedate}/100" color="{fontdefault}" text="{start} - {stop}" />
+                <drawtext condition="not{istoday}" x="0" y="{areaheight}*{schedulesposydate}/100" font="{regular}" fontsize="{areaheight}*{schedulessizedate}/100" color="{fontdefault}" text="{day} {daynumeric}.{month} {start} - {stop}" />
             </area>
             <areascroll condition="not{separator}++{whatson}++not{current}" scrollelement="menutext" mode="forthandback" orientation="horizontal" delay="1000" scrollspeed="medium" x="1%" width="{areawidth}*0.295" layer="3">
-                <drawtext name="menutext" x="0" y="40%" font="{regular}" fontsize="50%" color="{fontdefault}" text="{title}" />
+                <drawtext name="menutext" x="0" y="{areaheight}*{schedulesposytitle}/100" font="{regular}" fontsize="{areaheight}*{schedulessizetitle}/100" color="{fontdefault}" text="{title}" />
             </areascroll>
             <area condition="not{separator}++{whatson}++{current}" x="1%" width="{areawidth}*0.295" layer="3">
-                <drawtext x="0" y="8%" font="{regular}" fontsize="35%" color="{fontmenuactive}" text="{start} - {stop}" />
+                <drawtext condition="{istoday}" x="0" y="{areaheight}*{schedulesposydate}/100" font="{regular}" fontsize="{areaheight}*{schedulessizedate}/100" color="{fontmenuactive}" text="{start} - {stop}" />
+                <drawtext condition="not{istoday}" x="0" y="{areaheight}*{schedulesposydate}/100" font="{regular}" fontsize="{areaheight}*{schedulessizedate}/100" color="{fontmenuactive}" text="{day} {daynumeric}.{month} {start} - {stop}" />
             </area>
             <areascroll condition="not{separator}++{whatson}++{current}" scrollelement="menutext" mode="forthandback" orientation="horizontal" delay="1000" scrollspeed="medium" x="1%" width="{areawidth}*0.295" layer="3">
-                <drawtext name="menutext" x="0" y="40%" font="{regular}" fontsize="50%" color="{fontmenuactive}" text="{title}" />
+                <drawtext name="menutext" x="0" y="{areaheight}*{schedulesposytitle}/100" font="{regular}" fontsize="{areaheight}*{schedulessizetitle}/100" color="{fontmenuactive}" text="{title}" />
             </areascroll>
             <!-- element whatsonnow -->
             <area condition="not{separator}++{whatsonnow}" x="1%" width="6%" layer="3">
                 <drawimage name="logo" imagetype="channellogo" path="{channelid}" width="90%" height="90%" align="center" valign="center" />
             </area>
             <area condition="not{separator}++{whatsonnow}++not{current}" x="8%" width="22%" layer="3">
-                <drawtext x="0" y="5%" font="{regular}" fontsize="35%" color="{fontdefault}" text="{start} - {stop}" />
+                <drawtext x="0" y="{areaheight}*{schedulesposydate}/100" font="{regular}" fontsize="{areaheight}*{schedulessizedate}/100" color="{fontdefault}" text="{start} - {stop}" />
             </area>
             <areascroll condition="not{separator}++{whatsonnow}++not{current}" scrollelement="menutext" mode="forthandback" orientation="horizontal" delay="1000" scrollspeed="medium" x="8%" width="22%" layer="3">
-                <drawtext name="menutext" x="0" y="40%" font="{regular}" fontsize="50%" color="{fontdefault}" text="{title}" />
+                <drawtext name="menutext" y="{areaheight}*{schedulesposytitle}/100" font="{regular}" fontsize="{areaheight}*{schedulessizetitle}/100" color="{fontdefault}" text="{title}" />
             </areascroll>
             <area condition="not{separator}++{whatsonnow}++{current}" x="8%" width="22%" layer="3">
-                <drawtext x="0" y="5%" font="{regular}" fontsize="35%" color="{fontmenuactive}" text="{start} - {stop}" />
+                <drawtext x="0" y="{areaheight}*{schedulesposydate}/100" font="{regular}" fontsize="{areaheight}*{schedulessizedate}/100" color="{fontmenuactive}" text="{start} - {stop}" />
             </area>
             <areascroll condition="not{separator}++{whatsonnow}++{current}" scrollelement="menutext" mode="forthandback" orientation="horizontal" delay="1000" scrollspeed="medium" x="8%" width="22%" layer="3">
-                <drawtext name="menutext" x="0" y="40%" font="{regular}" fontsize="50%" color="{fontmenuactive}" text="{title}" />
+                <drawtext name="menutext" y="{areaheight}*{schedulesposytitle}/100" font="{regular}" fontsize="{areaheight}*{schedulessizetitle}/100" color="{fontmenuactive}" text="{title}" />
             </areascroll>
            <!-- element whatsonnext -->
             <area condition="not{separator}++{whatsonnext}" x="1%" width="6%" layer="3">
                 <drawimage name="logo" imagetype="channellogo" path="{channelid}" width="90%" height="90%" align="center" valign="center" />
             </area>
             <area condition="not{separator}++{whatsonnext}++not{current}" x="8%" width="22%" layer="3">
-                <drawtext x="0" y="5%" font="{regular}" fontsize="35%" color="{fontdefault}" text="{start} - {stop}" />
+                <drawtext x="0" y="{areaheight}*{schedulesposydate}/100" font="{regular}" fontsize="{areaheight}*{schedulessizedate}/100" color="{fontdefault}" text="{start} - {stop}" />
             </area>
             <areascroll condition="not{separator}++{whatsonnext}++not{current}" scrollelement="menutext" mode="forthandback" orientation="horizontal" delay="1000" scrollspeed="medium" x="8%" width="22%" layer="3">
-                <drawtext name="menutext" x="0" y="40%" font="{regular}" fontsize="50%" color="{fontdefault}" text="{title}" />
+                <drawtext name="menutext" x="0" y="{areaheight}*{schedulesposytitle}/100" font="{regular}" fontsize="{areaheight}*{schedulessizetitle}/100" color="{fontdefault}" text="{title}" />
             </areascroll>
             <area condition="not{separator}++{whatsonnext}++{current}" x="8%" width="22%" layer="3">
-                <drawtext x="0" y="5%" font="{regular}" fontsize="35%" color="{fontmenuactive}" text="{start} - {stop}" />
+                <drawtext x="0" y="{areaheight}*{schedulesposydate}/100" font="{regular}" fontsize="{areaheight}*{schedulessizedate}/100" color="{fontmenuactive}" text="{start} - {stop}" />
             </area>
             <areascroll condition="not{separator}++{whatsonnext}++{current}" scrollelement="menutext" mode="forthandback" orientation="horizontal" delay="1000" scrollspeed="medium" x="8%" width="22%" layer="3">
-                <drawtext name="menutext" x="0" y="40%" font="{regular}" fontsize="50%" color="{fontmenuactive}" text="{title}" />
+                <drawtext name="menutext" x="0" y="{areaheight}*{schedulesposytitle}/100" font="{regular}" fontsize="{areaheight}*{schedulessizetitle}/100" color="{fontmenuactive}" text="{title}" />
             </areascroll>
            <!-- element whatsonfavorites -->
             <area condition="not{separator}++{whatsonfavorites}" x="1%" width="6%" layer="3">
                 <drawimage name="logo" imagetype="channellogo" path="{channelid}" width="90%" height="90%" align="center" valign="center" />
             </area>
             <area condition="not{separator}++{whatsonfavorites}++not{current}" x="8%" width="22%" layer="3">
-                <drawtext x="0" y="5%" font="{regular}" fontsize="35%" color="{fontdefault}" text="{start} - {stop}" />
+                <drawtext condition="{istoday}" x="0" y="{areaheight}*{schedulesposydate}/100" font="{regular}" fontsize="{areaheight}*{schedulessizedate}/100" color="{fontdefault}" text="{start} - {stop}" />
+                <drawtext condition="not{istoday}" x="0" y="{areaheight}*{schedulesposydate}/100" font="{regular}" fontsize="{areaheight}*{schedulessizedate}/100" color="{fontdefault}" text="{day} {daynumeric}.{month} {start} - {stop}" />
             </area>
             <areascroll condition="not{separator}++{whatsonfavorites}++not{current}" scrollelement="menutext" mode="forthandback" orientation="horizontal" delay="1000" scrollspeed="medium" x="8%" width="22%" layer="3">
-                <drawtext name="menutext" x="0" y="40%" font="{regular}" fontsize="50%" color="{fontdefault}" text="{title}" />
+                <drawtext name="menutext" x="0" y="{areaheight}*{schedulesposytitle}/100" font="{regular}" fontsize="{areaheight}*{schedulessizetitle}/100" color="{fontdefault}" text="{title}" />
             </areascroll>
             <area condition="not{separator}++{whatsonfavorites}++{current}" x="8%" width="22%" layer="3">
-                <drawtext x="0" y="5%" font="{regular}" fontsize="35%" color="{fontmenuactive}" text="{start} - {stop}" />
+                <drawtext condition="{istoday}" x="0" y="{areaheight}*{schedulesposydate}/100" font="{regular}" fontsize="{areaheight}*{schedulessizedate}/100" color="{fontmenuactive}" text="{start} - {stop}" />
+                <drawtext condition="not{istoday}" x="0" y="{areaheight}*{schedulesposydate}/100" font="{regular}" fontsize="{areaheight}*{schedulessizedate}/100" color="{fontmenuactive}" text="{day} {daynumeric}.{month} {start} - {stop}" />
             </area>
             <areascroll condition="not{separator}++{whatsonfavorites}++{current}" scrollelement="menutext" mode="forthandback" orientation="horizontal" delay="1000" scrollspeed="medium" x="8%" width="22%" layer="3">
-                <drawtext name="menutext" x="0" y="40%" font="{regular}" fontsize="50%" color="{fontmenuactive}" text="{title}" />
+                <drawtext name="menutext" x="0" y="{areaheight}*{schedulesposytitle}/100" font="{regular}" fontsize="{areaheight}*{schedulessizetitle}/100" color="{fontmenuactive}" text="{title}" />
             </areascroll>
         </listelement>
         <currentelement delay="100" fadetime="200">
@@ -98,14 +102,14 @@
                 <drawimage imagetype="image" path="{posterpath}" x="0" valign="center" width="{areawidth}" height="{areawidth} * {posterheight} / {posterwidth}" />
             </area>
             <areascroll condition="{hasposter}" orientation="vertical" mode="forthandback" delay="3000" scrollspeed="medium" x="47%" y="76%" width="49%" height="20%" layer="3">
-                <drawtext x="0" y="0" font="{regular}" width="100%" fontsize="20%" color="{fontdefault}" text="{day} {daynumeric}.{month} {start} - {stop} {title}" />
-                <drawtextbox name="shorttext" x="0" y="21%" width="100%" font="{regular}" fontsize="20%" color="{fontdefault}" text="{shorttext}" />
-                <drawtextbox x="0" y="{posy(shorttext)} + {height(shorttext)}" width="100%" font="{regular}" fontsize="15%" color="{fontdefault}" text="{description}" />
+                <drawtext x="0" y="0" font="{regular}" width="100%" fontsize="{areaheight}*{schedulessizecurrenttitle}/100" color="{fontdefault}" text="{day} {daynumeric}.{month} {start} - {stop} {title}" />
+                <drawtextbox name="shorttext" x="0" y="21%" width="100%" font="{regular}" fontsize="{areaheight}*{schedulessizecurrenttitle}/100" color="{fontdefault}" text="{shorttext}" />
+                <drawtextbox x="0" y="{posy(shorttext)} + {height(shorttext)}" width="100%" font="{regular}" fontsize="{areaheight}*{schedulessizecurrenttext}/100" color="{fontdefault}" text="{description}" />
             </areascroll>
             <areascroll condition="not{hasposter}" orientation="vertical" mode="forthandback" delay="3000" scrollspeed="medium" x="39%" y="76%" width="57%" height="20%" layer="3">
-                <drawtext x="0" y="0" font="{regular}" width="100%" fontsize="20%" color="{fontdefault}" text="{day} {daynumeric}.{month} {start} - {stop} {title}" />
-                <drawtextbox name="shorttext" x="0" y="21%" width="100%" font="{regular}" fontsize="20%" color="{fontdefault}" text="{shorttext}" />
-                <drawtextbox x="0" y="{posy(shorttext)} + {height(shorttext)}" width="100%" font="{regular}" fontsize="15%" color="{fontdefault}" text="{description}" />
+                <drawtext x="0" y="0" font="{regular}" width="100%" fontsize="{areaheight}*{schedulessizecurrenttitle}/100" color="{fontdefault}" text="{day} {daynumeric}.{month} {start} - {stop} {title}" />
+                <drawtextbox name="shorttext" x="0" y="21%" width="100%" font="{regular}" fontsize="{areaheight}*{schedulessizecurrenttitle}/100" color="{fontdefault}" text="{shorttext}" />
+                <drawtextbox x="0" y="{posy(shorttext)} + {height(shorttext)}" width="100%" font="{regular}" fontsize="{areaheight}*{schedulessizecurrenttext}/100" color="{fontdefault}" text="{description}" />
             </areascroll>
         </currentelement>
     </menuitems>
diff --git a/skins/estuary4vdr/xmlfiles/displaymenusetup.xml b/skins/estuary4vdr/xmlfiles/displaymenusetup.xml
index c22ca6b..ec0aefb 100644
--- a/skins/estuary4vdr/xmlfiles/displaymenusetup.xml
+++ b/skins/estuary4vdr/xmlfiles/displaymenusetup.xml
@@ -9,16 +9,16 @@
                 <drawrectangle condition="{current}" x="15%" y="0" width="85%" height="100%" color="{menubackactive}" />
             </area>
             <area x="0" y="0" width="5%" height="100%" layer="3">
-                <drawimage condition="not{current}" imagetype="menuicon" path="{icon}" align="center" valign="center" width="{areaheight}*0.6" height="{areaheight}*0.6"/>
-                <drawimage condition="{current}" imagetype="menuicon" path="{icon}_active" align="center" valign="center" width="{areaheight}*0.6" height="{areaheight}*0.6"/>
+                <drawimage condition="not{current}" imagetype="menuicon" path="{icon}" align="center" valign="center" width="{areaheight}*{mainiconsize}/100" height="{areaheight}*{mainiconsize}/100"/>
+                <drawimage condition="{current}" imagetype="menuicon" path="{icon}_active" align="center" valign="center" width="{areaheight}*{mainiconsize}/100" height="{areaheight}*{mainiconsize}/100"/>
             </area>
             <areascroll condition="{showlistnumbers}" scrollelement="menutext" mode="forthandback" orientation="horizontal" delay="1000" scrollspeed="medium" x="5%" width="25%" layer="4">
-                <drawtext condition="not{current}" x="20" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{number} {label}" />
-                <drawtext condition="{current}" name="menutext" x="20" valign="center" font="{regular}" fontsize="60%" color="{fontmenuactive}" text="{number} {label}" />
+                <drawtext condition="not{current}" x="20" valign="center" font="{regular}" fontsize="{areaheight}*{setupfontsize}/100" color="{fontdefault}" text="{number} {label}" />
+                <drawtext condition="{current}" name="menutext" x="20" valign="center" font="{regular}" fontsize="{areaheight}*{setupfontsize}/100" color="{fontmenuactive}" text="{number} {label}" />
             </areascroll>
             <areascroll condition="not{showlistnumbers}" scrollelement="menutext" mode="forthandback" orientation="horizontal" delay="1000" scrollspeed="medium" x="5%" width="25%" layer="4">
-                <drawtext condition="not{current}" x="20" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{label}" />
-                <drawtext condition="{current}" name="menutext" x="20" valign="center" font="{regular}" fontsize="60%" color="{fontmenuactive}" text="{label}" />
+                <drawtext condition="not{current}" x="20" valign="center" font="{regular}" fontsize="{areaheight}*{setupfontsize}/100" color="{fontdefault}" text="{label}" />
+                <drawtext condition="{current}" name="menutext" x="20" valign="center" font="{regular}" fontsize="{areaheight}*{setupfontsize}/100" color="{fontmenuactive}" text="{label}" />
             </areascroll>
         </listelement>
         <currentelement delay="100" fadetime="200">
diff --git a/skins/estuary4vdr/xmlfiles/displaymenutimers.xml b/skins/estuary4vdr/xmlfiles/displaymenutimers.xml
index 9c2b8da..e25ff90 100644
--- a/skins/estuary4vdr/xmlfiles/displaymenutimers.xml
+++ b/skins/estuary4vdr/xmlfiles/displaymenutimers.xml
@@ -1,6 +1,6 @@
 <menutimers x="0" y="0" width="100%" height="100%" fadetime="0" scaletvx="39%" scaletvy="8%" scaletvwidth="60%" scaletvheight="60%">
 
-    <menuitems x="2%" y="9%" orientation="vertical" width="98%" height="82%" align="center" numlistelements="12">
+    <menuitems x="2%" y="9%" orientation="vertical" width="98%" height="82%" align="center" numlistelements="{numitemstimers}">
         <listelement>
             <area x="0" y="0" width="{areawidth}*0.305" height="100%" layer="2">
                 <drawrectangle condition="not{current}" x="0" y="0" width="100%" height="100%" color="{menuback}" />
@@ -12,16 +12,16 @@
             </area>
             
             <area condition="not{current}" x="7%" width="23%" layer="3">
-                <drawtext x="0" y="8%" font="{regular}" fontsize="45%" color="{fontdefault}" text="{dayname} {day}. {timerstart} - {timerstop}" />
+                <drawtext x="0" y="{areaheight}*{timersposydate}/100" font="{regular}" fontsize="{areaheight}*{timerssizedate}/100" color="{fontdefault}" text="{dayname} {day}. {timerstart} - {timerstop}" />
             </area>
-            <areascroll condition="not{current}" scrollelement="timertext" mode="forthandback" orientation="horizontal" delay="1000" scrollspeed="medium" x="7%" y="50%" width="23%" height="50%" layer="3">
-                <drawtext name="timertext" x="0" valign="center" font="{regular}" fontsize="85%" color="{fontdefault}" text="{title}" />
+            <areascroll condition="not{current}" scrollelement="timertext" mode="forthandback" orientation="horizontal" delay="1000" scrollspeed="medium" x="7%" width="23%" layer="3">
+                <drawtext name="timertext" x="0"  y="{areaheight}*{timersposytitle}/100" font="{regular}" fontsize="{areaheight}*{timerssizetitle}/100" color="{fontdefault}" text="{title}" />
             </areascroll>
             <area condition="{current}" x="7%" width="23%" layer="3">
-                <drawtext x="0" y="8%" font="{regular}" fontsize="45%" color="{fontmenuactive}" text="{dayname} {day}. {timerstart} - {timerstop}" />
+                <drawtext x="0" y="{areaheight}*{timersposydate}/100" font="{regular}" fontsize="{areaheight}*{timerssizedate}/100" color="{fontmenuactive}" text="{dayname} {day}. {timerstart} - {timerstop}" />
             </area>
-            <areascroll condition="{current}" scrollelement="timertext" mode="forthandback" orientation="horizontal" delay="1000" scrollspeed="medium" x="7%" y="50%" width="23%" height="50%" layer="3">
-                <drawtext name="timertext" x="0" valign="center" font="{regular}" fontsize="85%" color="{fontmenuactive}" text="{title}" />
+            <areascroll condition="{current}" scrollelement="timertext" mode="forthandback" orientation="horizontal" delay="1000" scrollspeed="medium" x="7%" width="23%" layer="3">
+                <drawtext name="timertext" x="0" y="{areaheight}*{timersposytitle}/100" font="{regular}" fontsize="{areaheight}*{timerssizetitle}/100" color="{fontmenuactive}" text="{title}" />
             </areascroll>
 
             <area x="20%" y="5%" width="10%" height="40%" layer="4">
@@ -38,14 +38,14 @@
                 <drawimage imagetype="image" path="{posterpath}" x="0" valign="center" width="{areawidth}" height="{areawidth} * {posterheight} / {posterwidth}" />
             </area>
             <areascroll condition="{hasposter}" orientation="vertical" mode="forthandback" delay="3000" scrollspeed="medium" x="47%" y="76%" width="49%" height="20%" layer="3">
-                <drawtext name="scheduling" x="0" y="0" font="{regular}" fontsize="25%" color="{fontdefault}" text="{dayname} {day}. {timerstart} - {timerstop}" />
-                <drawtext name="title" x="0" y="{height(scheduling)}" font="{regular}" width="100%" fontsize="20%" color="{fontdefault}" text="{eventtitle}" />
-                <drawtextbox x="0" y="{posy(title)}+{height(title)}" width="100%" font="{regular}" fontsize="15%" color="{fontdefault}" text="{eventdescription}" />
+                <drawtext name="scheduling" x="0" y="0" font="{regular}" fontsize="{areaheight}*{timerssizecurrenttitle}/100" color="{fontdefault}" text="{dayname} {day}. {timerstart} - {timerstop}" />
+                <drawtext name="title" x="0" y="{height(scheduling)}" font="{regular}" width="100%" fontsize="{areaheight}*{timerssizecurrenttitle}/100" color="{fontdefault}" text="{eventtitle}" />
+                <drawtextbox x="0" y="{posy(title)}+{height(title)}" width="100%" font="{regular}" fontsize="{areaheight}*{timerssizecurrenttext}/100" color="{fontdefault}" text="{eventdescription}" />
             </areascroll>
             <areascroll condition="not{hasposter}" orientation="vertical" mode="forthandback" delay="3000" scrollspeed="medium" x="39%" y="76%" width="57%" height="20%" layer="3">
-                <drawtext name="scheduling" x="0" y="0" font="{regular}" fontsize="25%" color="{fontdefault}" text="{dayname} {day}. {timerstart} - {timerstop}" />
-                <drawtext name="title" x="0" y="{height(scheduling)}" font="{regular}" width="100%" fontsize="20%" color="{fontdefault}" text="{eventtitle}" />
-                <drawtextbox x="0" y="{posy(title)}+{height(title)}" width="100%" font="{regular}" fontsize="15%" color="{fontdefault}" text="{eventdescription}" />
+                <drawtext name="scheduling" x="0" y="0" font="{regular}" fontsize="{areaheight}*{timerssizecurrenttitle}/100" color="{fontdefault}" text="{dayname} {day}. {timerstart} - {timerstop}" />
+                <drawtext name="title" x="0" y="{height(scheduling)}" font="{regular}" width="100%" fontsize="{areaheight}*{timerssizecurrenttitle}/100" color="{fontdefault}" text="{eventtitle}" />
+                <drawtextbox x="0" y="{posy(title)}+{height(title)}" width="100%" font="{regular}" fontsize="{areaheight}*{timerssizecurrenttext}/100" color="{fontdefault}" text="{eventdescription}" />
             </areascroll>
         </currentelement>
     </menuitems>
diff --git a/skins/estuary4vdr/xmlfiles/displaymessage.xml b/skins/estuary4vdr/xmlfiles/displaymessage.xml
index 27eb043..0f1a09d 100644
--- a/skins/estuary4vdr/xmlfiles/displaymessage.xml
+++ b/skins/estuary4vdr/xmlfiles/displaymessage.xml
@@ -17,7 +17,7 @@
             <drawimage condition="{error}" imagetype="icon" path="error" width="{areaheight}*0.8" height="80%" x="5%" valign="center" />

         </area>

         <area x="11%" y="0" width="88%" height="100%" layer="3">

-            <drawtext align="center" valign="center" width="100%" fontsize="60%" font="{regular}" color="{fontdefault}" text="{text}" />

+            <drawtext align="center" valign="center" width="100%" fontsize="{areaheight}*{messagesize}/100" font="{regular}" color="{fontdefault}" text="{text}" />

         </area>

     </message>

 

diff --git a/skins/estuary4vdr/xmlfiles/displayreplay.xml b/skins/estuary4vdr/xmlfiles/displayreplay.xml
index 23abbce..c9e74c2 100644
--- a/skins/estuary4vdr/xmlfiles/displayreplay.xml
+++ b/skins/estuary4vdr/xmlfiles/displayreplay.xml
@@ -16,15 +16,15 @@
     </backgroundmodeonly>
 
     <datetime>
-        <area x="75%" y="75%" width="13%" height="5%" layer="2">
-            <drawtext align="right" valign="center" fontsize="100%" font="{regular}" color="{fontdefault}" text="{daynameshort} {day}.{monthnameshort}" />
+        <area x="75%" y="75%" width="13%" height="6%" layer="2">
+            <drawtext align="right" y="0" fontsize="{areaheight}*{replaydatetimesize}/100" font="{regular}" color="{fontdefault}" text="{daynameshort} {day}.{monthnameshort}" />
         </area>
     </datetime>
 
     <time>
-        <area x="89%" y="75%" width="11%" height="5%" layer="2">
-            <drawtext name="clock" x="0" valign="center" fontsize="100%" font="{regular}" color="{fontdefault}" text="{hour}:{printf('%02d', min)}" />
-            <drawtext name="clocksec" x="{posx(clock)} + {width(clock)}" y="{areaheight}/2 -  {height(clocksec)}/2 + {height(clock)}/2 - {height(clocksec)}/2 - 5" fontsize="80%" font="{regular}" color="{fontdefault}" text=":{printf('%02d', sec)}" />
+        <area x="89%" y="75%" width="11%" height="6%" layer="2">
+            <drawtext name="clock" x="0" y="0" fontsize="{areaheight}*{replaydatetimesize}/100" font="{regular}" color="{fontdefault}" text="{hour}:{printf('%02d', min)}" />
+            <drawtext name="clocksec" x="{posx(clock)} + {width(clock)}" y="{height(clock)} - {height(clocksec)} - 1" fontsize="{areaheight}*{replaydatetimesize}*0.8/100" font="{regular}" color="{fontdefault}" text=":{printf('%02d', sec)}" />
         </area>
     </time>
 
@@ -38,9 +38,9 @@
     </scrapercontent>
 
     <rectitle>
-        <area x="12%" y="75%" width="63%" height="5%" layer="2">
-            <drawtext name="title" x="0" valign="center" fontsize="100%" font="{regular}" color="{fontdefault}" text="{rectitle}" />
-            <drawtext condition="isset{title} ++ isset{recsubtitle}" x="{width(title)}" valign="center" fontsize="100%" font="{regular}" color="{fontdefault}" text=" - {recsubtitle}" />
+        <area x="12%" y="75%" width="63%" height="6%" layer="2">
+            <drawtext name="title" x="0" y="0" fontsize="{areaheight}*{replaytitlesize}/100" font="{regular}" color="{fontdefault}" text="{rectitle}" />
+            <drawtext condition="isset{title} ++ isset{recsubtitle}" x="{width(title)}" y="0" fontsize="{areaheight}*{replaytitlesize}/100" font="{regular}" color="{fontdefault}" text=" - {recsubtitle}" />
         </area>
     </rectitle>
 
@@ -68,21 +68,21 @@
     </recinfo>
 
     <currenttime>
-        <area x="12%" y="86%" width="15%" height="4%" layer="2">
-            <drawtext x="0" valign="center" fontsize="100%" font="{regular}" color="{fontdefault}" text="{reccurrent}" />
+        <area x="12%" y="86%" width="15%" height="5%" layer="2">
+            <drawtext x="0" y="0" fontsize="{areaheight}*{replaycurrenttotaltimesize}/100" font="{regular}" color="{fontdefault}" text="{reccurrent}" />
         </area>
     </currenttime>
 
     <totaltime>
-        <area x="80%" y="86%" width="19%" height="4%" layer="2">
-            <drawtext condition="not{timeshift}" align="right" valign="center" fontsize="100%" font="{regular}" color="{fontdefault}" text="{rectotal}" />
-            <drawtext condition="{timeshift}" align="right" valign="center" font="{regular}" fontsize="100%" color="{fontdefault}" text="{timeshifttotal} ({rectotal})" />
+        <area x="80%" y="86%" width="19%" height="5%" layer="2">
+            <drawtext condition="not{timeshift}" align="right" y="0" fontsize="{areaheight}*{replaycurrenttotaltimesize}/100" font="{regular}" color="{fontdefault}" text="{rectotal}" />
+            <drawtext condition="{timeshift}" align="right" y="0" font="{regular}" fontsize="{areaheight}*{replaycurrenttotaltimesize}/100" color="{fontdefault}" text="{timeshifttotal} ({rectotal})" />
         </area>
     </totaltime>
 
     <endtime>
-        <area x="80%" y="90%" width="19%" height="3%" layer="2">
-            <drawtext align="right" valign="center" fontsize="100%" font="{regular}" color="{fontdefault}" text="{tr(end)}: {recend}" />
+        <area x="80%" y="90%" width="19%" height="5%" layer="2">
+            <drawtext align="right" y="0" fontsize="{areaheight}*{replayendtimesize}/100" font="{regular}" color="{fontdefault}" text="{tr(end)}: {recend}" />
         </area>
     </endtime>
 
@@ -176,7 +176,7 @@
             <drawimage condition="{info}" imagetype="icon" path="info" width="{areaheight}*0.8" height="80%" x="5%" valign="center" />
             <drawimage condition="{warning}" imagetype="icon" path="warning" width="{areaheight}*0.8" height="80%" x="5%" valign="center" />
             <drawimage condition="{error}" imagetype="icon" path="error" width="{areaheight}*0.8" height="80%" x="5%" valign="center" />
-            <drawtext align="center" valign="center" fontsize="40%" font="{regular}" color="{fontdefault}" text="{text}" />
+            <drawtext align="center" valign="center" fontsize="{areaheight}*{messagemenusize}/100" font="{regular}" color="{fontdefault}" text="{text}" />
         </area>      
     </message>
 
diff --git a/skins/estuary4vdr/xmlfiles/plug-setup-skinpreview.xml b/skins/estuary4vdr/xmlfiles/plug-setup-skinpreview.xml
index 0f5ec7d..17bce2c 100644
--- a/skins/estuary4vdr/xmlfiles/plug-setup-skinpreview.xml
+++ b/skins/estuary4vdr/xmlfiles/plug-setup-skinpreview.xml
@@ -24,7 +24,7 @@
         </area>
     </detailheader>
 
-    <colorbuttons debug="true">
+    <colorbuttons>
         <!--red-->
         <area condition="{red1}" x="0" y="94%" width="25%" height="6%" layer="2">
             <drawimage imagetype="skinpart" path="button_red" x="0" y="0" width="100%" height="100%"/>
diff --git a/skins/estuary4vdr/xmlfiles/plug-tvguideng-detail.xml b/skins/estuary4vdr/xmlfiles/plug-tvguideng-detail.xml
index d9a26ea..0da0e43 100644
--- a/skins/estuary4vdr/xmlfiles/plug-tvguideng-detail.xml
+++ b/skins/estuary4vdr/xmlfiles/plug-tvguideng-detail.xml
@@ -30,28 +30,28 @@
             <drawimage imagetype="skinpart" path="button_red" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{red1}" x="0" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{red}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{red}" />
         </area>
         <!--green-->
         <area condition="{green1}" x="0" y="94%" width="25%" height="6%" layer="2">
             <drawimage imagetype="skinpart" path="button_green" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{green1}" x="0" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{green}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{green}" />
         </area>
         <!--yellow-->
         <area condition="{yellow1}" x="0" y="94%" width="25%" height="6%" layer="2">
             <drawimage imagetype="skinpart" path="button_yellow" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{yellow1}" x="0" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{yellow}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{yellow}" />
         </area>
         <!--blue-->
         <area condition="{blue1}" x="0" y="94%" width="25%" height="6%" layer="2">
             <drawimage imagetype="skinpart" path="button_blue" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{blue1}" x="0" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{blue}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{blue}" />
         </area>
 
         <!--red-->
@@ -59,28 +59,28 @@
             <drawimage imagetype="skinpart" path="button_red" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{red2}" x="25%" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{red}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{red}" />
         </area>
         <!--green-->
         <area condition="{green2}" x="25%" y="94%" width="25%" height="6%" layer="2">
             <drawimage imagetype="skinpart" path="button_green" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{green2}" x="25%" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{green}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{green}" />
         </area>
         <!--yellow-->
         <area condition="{yellow2}" x="25%" y="94%" width="25%" height="6%" layer="2">
             <drawimage imagetype="skinpart" path="button_yellow" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{yellow2}" x="25%" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{yellow}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{yellow}" />
         </area>
         <!--blue-->
         <area condition="{blue2}" x="25%" y="94%" width="25%" height="6%" layer="2">
             <drawimage imagetype="skinpart" path="button_blue" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{blue2}" x="25%" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{blue}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{blue}" />
         </area>
 
         <!--red-->
@@ -88,28 +88,28 @@
             <drawimage imagetype="skinpart" path="button_red" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{red3}" x="50%" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{red}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{red}" />
         </area>
         <!--green-->
         <area condition="{green3}" x="50%" y="94%" width="25%" height="6%" layer="2">
             <drawimage imagetype="skinpart" path="button_green" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{green3}" x="50%" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{green}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{green}" />
         </area>
         <!--yellow-->
         <area condition="{yellow3}" x="50%" y="94%" width="25%" height="6%" layer="2">
             <drawimage imagetype="skinpart" path="button_yellow" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{yellow3}" x="50%" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{yellow}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{yellow}" />
         </area>
         <!--blue-->
         <area condition="{blue3}" x="50%" y="94%" width="25%" height="6%" layer="2">
             <drawimage imagetype="skinpart" path="button_blue" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{blue3}" x="50%" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{blue}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{blue}" />
         </area>
 
         <!--red-->
@@ -117,28 +117,28 @@
             <drawimage imagetype="skinpart" path="button_red" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{red4}" x="75%" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{red}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{red}" />
         </area>
         <!--green-->
         <area condition="{green4}" x="75%" y="94%" width="25%" height="6%" layer="2">
             <drawimage imagetype="skinpart" path="button_green" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{green4}" x="75%" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{green}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{green}" />
         </area>
         <!--yellow-->
         <area condition="{yellow4}" x="75%" y="94%" width="25%" height="6%" layer="2">
             <drawimage imagetype="skinpart" path="button_yellow" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{yellow4}" x="75%" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{yellow}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{yellow}" />
         </area>
         <!--blue-->
         <area condition="{blue4}" x="75%" y="94%" width="25%" height="6%" layer="2">
             <drawimage imagetype="skinpart" path="button_blue" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{blue4}" x="75%" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{blue}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{blue}" />
         </area>
     </viewelement>
 
@@ -163,33 +163,33 @@
 
     <!-- TAB EPGINFO -->
     <tab name="EPG Info" x="3%" y="23%" width="94%" height="61%" layer="4" scrollheight="{areaheight}/4">
-        <drawtextbox condition="not{isseries}++not{ismovie}" name="shorttext" x="0" y="1%" width="96%" font="{regular}" fontsize="8%" color="{fontdefault}" text="{shorttext}" />
-        <drawtextbox condition="not{isseries}++not{ismovie}" x="0" y="{posy(shorttext)} + {height(shorttext)} + 5" width="96%" font="{regular}" fontsize="6%" color="{fontdefault}" text="{description}" />
+        <drawtextbox condition="not{isseries}++not{ismovie}" name="shorttext" x="0" y="1%" width="96%" font="{regular}" fontsize="{areaheight}*{detailtextheadersize}/100" color="{fontdefault}" text="{shorttext}" />
+        <drawtextbox condition="not{isseries}++not{ismovie}" x="0" y="{posy(shorttext)} + {height(shorttext)} + 5" width="96%" font="{regular}" fontsize="{areaheight}*{detailtextsize}/100" color="{fontdefault}" text="{description}" />
 
         <drawimage condition="{isseries}" name="seriesbanner" imagetype="image" path="{seriesbanner1path}" x="{areawidth}*0.5" y="0" width="{areawidth}*0.5" height="{areawidth} * 0.5 * {seriesbanner1height} / {seriesbanner1width}"/>
-        <drawtextbox condition="{isseries}" name="shorttext" x="0" y="0" width="49%" font="{regular}" fontsize="8%" color="{fontdefault}" text="{shorttext}" />
-        <drawtextbox condition="{isseries}" x="0" y="{height(shorttext)} + 5" width="96%" float="topright" floatwidth="{areawidth}*0.5" floatheight="{areawidth} * 0.5 * {seriesbanner1height} / {seriesbanner1width} - {height(shorttext)}" font="{regular}" fontsize="6%" color="{fontdefault}" text="{description}" />
+        <drawtextbox condition="{isseries}" name="shorttext" x="0" y="0" width="49%" font="{regular}" fontsize="{areaheight}*{detailtextheadersize}/100" color="{fontdefault}" text="{shorttext}" />
+        <drawtextbox condition="{isseries}" x="0" y="{height(shorttext)} + 5" width="96%" float="topright" floatwidth="{areawidth}*0.5" floatheight="{areawidth} * 0.5 * {seriesbanner1height} / {seriesbanner1width} - {height(shorttext)}" font="{regular}" fontsize="{areaheight}*{detailtextsize}/100" color="{fontdefault}" text="{description}" />
 
         <drawimage condition="{ismovie}" name="movieposter" imagetype="image" path="{posterpath}" x="{areawidth}*0.8" y="0" width="{areawidth}*0.2" height="{areawidth} * 0.2 * {posterheight} / {posterwidth}" />
-        <drawtextbox condition="{ismovie}" name="shorttextmovie" x="0" y="0" width="75%" font="{regular}" fontsize="8%" color="{fontdefault}" text="{shorttext}" />
-        <drawtextbox condition="{ismovie}" x="0" y="{height(shorttextmovie)} + 5" width="96%" float="topright" floatwidth="{width(movieposter)} + 10" floatheight="{height(movieposter)} - {height(shorttextmovie)}" font="{regular}" fontsize="6%" color="{fontdefault}" text="{description}" />
+        <drawtextbox condition="{ismovie}" name="shorttextmovie" x="0" y="0" width="75%" font="{regular}" fontsize="{areaheight}*{detailtextheadersize}/100" color="{fontdefault}" text="{shorttext}" />
+        <drawtextbox condition="{ismovie}" x="0" y="{height(shorttextmovie)} + 5" width="96%" float="topright" floatwidth="{width(movieposter)} + 10" floatheight="{height(movieposter)} - {height(shorttextmovie)}" font="{regular}" fontsize="{areaheight}*{detailtextsize}/100" color="{fontdefault}" text="{description}" />
     </tab>
     <!-- TAB RERUNS -->
     <tab condition="{hasreruns}" name="{tr(reruns)}" x="3%" y="23%" width="94%" height="61%" layer="4" scrollheight="{areaheight}/4">
-        <drawtext align="center" y="1%" name="title" font="{regular}" fontsize="8%" color="{fontdefault}" text="{tr(rerunsof)} '{title}'" />
+        <drawtext align="center" y="1%" name="title" font="{regular}" fontsize="{areaheight}*{detailtextheadersize}/100" color="{fontdefault}" text="{tr(rerunsof)} '{title}'" />
         <loop name="reruns" x="0" y="{height(title)} + 30" width="{areawidth}" rowheight="3%" orientation="vertical">
             <drawimage name="logo" condition="{reruns[channellogoexists]}" imagetype="channellogo" path="{reruns[channelid]}" x="0" width="10%" height="8%" />
-            <drawtext name="channelname" condition="not{reruns[channellogoexists]}" x="-5" font="{regular}" fontsize="5%" color="{fontdefault}" text="{reruns[channelname]}" />
-            <drawtext condition="{reruns[channellogoexists]}" x="{width(logo)}+20" y="-5" width="{areawidth} - {width(logo)} - 20" font="{regular}" fontsize="6%" color="{fontdefault}" text="{reruns[day]} {reruns[date]} {reruns[start]} - {reruns[stop]}: {reruns[title]}  {reruns[shorttext]}" />
-            <drawtext condition="not{reruns[channellogoexists]}" x="{width(channelname)}+20" y="-5" width="{areawidth} - {width(logo)} - 20" font="{regular}" fontsize="6%" color="{fontdefault}" text="{reruns[day]} {reruns[date]} {reruns[start]} - {reruns[stop]}: {reruns[title]}  {reruns[shorttext]}" />
+            <drawtext name="channelname" condition="not{reruns[channellogoexists]}" x="-5" font="{regular}" fontsize="{areaheight}*{detailactors}/100" color="{fontdefault}" text="{reruns[channelname]}" />
+            <drawtext condition="{reruns[channellogoexists]}" x="{width(logo)}+20" y="-5" width="{areawidth} - {width(logo)} - 20" font="{regular}" fontsize="{areaheight}*{detailtextsize}/100" color="{fontdefault}" text="{reruns[day]} {reruns[date]} {reruns[start]} - {reruns[stop]}: {reruns[title]}  {reruns[shorttext]}" />
+            <drawtext condition="not{reruns[channellogoexists]}" x="{width(channelname)}+20" y="-5" width="{areawidth} - {width(logo)} - 20" font="{regular}" fontsize="{areaheight}*{detailtextsize}/100" color="{fontdefault}" text="{reruns[day]} {reruns[date]} {reruns[start]} - {reruns[stop]}: {reruns[title]}  {reruns[shorttext]}" />
         </loop>
     </tab>
     <!-- TAB ACTORS -->
     <tab condition="{isseries}||{ismovie}" name="{tr(actors)}" x="3%" y="23%" width="94%" height="61%" layer="4" scrollheight="{areaheight}/4">
-        <drawtext align="center" name="title" y="0" font="{regular}" fontsize="12%" color="{fontdefault}" text="{tr(actors)}" />
+        <drawtext align="center" name="title" y="0" font="{regular}" fontsize="{areaheight}*{detailtextheadersize}/100" color="{fontdefault}" text="{tr(actors)}" />
         <loop name="actors" x="0" y="{height(title)} + 10" width="{areawidth}" orientation="horizontal" columnwidth="{areawidth}/7" rowheight="{areawidth}/7*1.65" overflow="linewrap" >
             <drawimage name="thumb" imagetype="image" path="{actors[thumb]}" x="20" y="0" width="{columnwidth}-40" height="{columnwidth} * {actors[thumbheight]} / {actors[thumbwidth]} - 40 * {actors[thumbheight]} / {actors[thumbwidth]}"/>
-            <drawtext align="center" y="{height(thumb)} + 10" width="{columnwidth}" name="actorname" font="{regular}" fontsize="5%" color="{fontdefault}" text="{actors[name]}" />
+            <drawtext align="center" y="{height(thumb)} + 10" width="{columnwidth}" name="actorname" font="{regular}" fontsize="{areaheight}*{detailactors}/100" color="{fontdefault}" text="{actors[name]}" />
             <drawtext align="center" y="{height(thumb)} + 10 + {height(actorname)}" width="{columnwidth}" font="{regular}" fontsize="5%" color="{fontdefault}" text="{actors[role]}" />
         </loop>
     </tab>
@@ -198,12 +198,12 @@
         <drawimage name="banner" imagetype="image" path="{seriesbanner1path}" align="center" y="10" width="{areawidth}*0.7" height="{areawidth} * 0.7 * {seriesbanner1height} / {seriesbanner1width}"/>
         <drawimage name="episodeimage" imagetype="image" path="{episodeimagepath}" x="{areawidth}*0.7" y="{height(banner)} + 20" width="{areawidth}*0.3" height="{areawidth} * 0.3 * {episodeimageheight} / {episodeimagewidth}"/>
         <drawimage name="seasonposter" imagetype="image" path="{seasonposterpath}" x="{areawidth}*0.7" y="{height(banner)} + {height(episodeimage)} + 30" width="{areawidth}*0.3" height="{areawidth} * 0.3 * {seasonposterheight} / {seasonposterwidth}"/>
-        <drawtextbox x="0" y="{height(banner)} + 20" width="96%" float="topright" floatwidth="{width(seasonposter)} + 10" floatheight="{height(episodeimage)} + {height(seasonposter)} + 30" font="{regular}" fontsize="6%" color="{fontdefault}" text="{tr(episode)}: {episodetitle} ({tr(season)} {episodeseason}, {tr(episode)} {episodenumber}) &#10;&#10;{episodeoverview}|&#10;&#10;{tr(gueststars)}: {episodegueststars}||&#10;&#10;{tr(seriesfirstaired)}: {seriesfirstaired}||&#10;{tr(episodefirstaired)}: {episodefirstaired}||&#10;{tr(network)}: {seriesnetwork}||&#10;{tr(genre)}: {seriesgenre}||&#10;{tr(status)}: {seriesstatus}||&#10;{tr(rating)}: {seriesrating}||&#10;{tr(episoderating)}: {episoderating}&#10;|{seriesoverview}&#10;" />
+        <drawtextbox x="0" y="{height(banner)} + 20" width="96%" float="topright" floatwidth="{width(seasonposter)} + 10" floatheight="{height(episodeimage)} + {height(seasonposter)} + 30" font="{regular}" fontsize="{areaheight}*{detailtextsize}/100" color="{fontdefault}" text="{tr(episode)}: {episodetitle} ({tr(season)} {episodeseason}, {tr(episode)} {episodenumber}) &#10;&#10;{episodeoverview}|&#10;&#10;{tr(gueststars)}: {episodegueststars}||&#10;&#10;{tr(seriesfirstaired)}: {seriesfirstaired}||&#10;{tr(episodefirstaired)}: {episodefirstaired}||&#10;{tr(network)}: {seriesnetwork}||&#10;{tr(genre)}: {seriesgenre}||&#10;{tr(status)}: {seriesstatus}||&#10;{tr(rating)}: {seriesrating}||&#10;{tr(episoderating)}: {episoderating}&#10;|{seriesoverview}&#10;" />
     </tab>
     <!-- TAB MOVIEDBINFO -->
     <tab condition="{ismovie}" name="MovieDBInfo" x="3%" y="23%" width="94%" height="61%" layer="4" scrollheight="{areaheight}/4">
         <drawimage name="poster" imagetype="image" path="{posterpath}" x="70%" y="10" width="{areawidth}*0.3" height="{areawidth} * 0.3 * {posterheight} / {posterwidth}"/>
-        <drawtextbox x="0" y="10" width="96%" float="topright" floatwidth="{width(poster)} + 10" floatheight="{height(poster)} + 20" font="{regular}" fontsize="6%" color="{fontdefault}" text="{tr(originaltitle)}: {movieoriginalTitle}&#10;&#10;|{tr(genre)}: {moviegenres}&#10;&#10;||{movietagline}&#10;&#10;|{movieoverview}&#10;&#10;|{tr(budget)}: {moviebudget}&#10;||{tr(revenue)}: {movierevenue}&#10;&#10;||{tr(adult)}: {movieadult}&#10;||{tr(releasedate)}: {moviereleasedate}&#10;||{tr(runtime)}: {movieruntime} min&#10;||&#10;{tr(popularity)}: {moviepopularity}&#10;||&#10;{tr(voteaverage)}: {movievoteaverage}&#10;||&#10;{tr(homepage)}: {moviehomepage}|&#10;" />
+        <drawtextbox x="0" y="10" width="96%" float="topright" floatwidth="{width(poster)} + 10" floatheight="{height(poster)} + 20" font="{regular}" fontsize="{areaheight}*{detailtextsize}/100" color="{fontdefault}" text="{tr(originaltitle)}: {movieoriginalTitle}&#10;&#10;|{tr(genre)}: {moviegenres}&#10;&#10;||{movietagline}&#10;&#10;|{movieoverview}&#10;&#10;|{tr(budget)}: {moviebudget}&#10;||{tr(revenue)}: {movierevenue}&#10;&#10;||{tr(adult)}: {movieadult}&#10;||{tr(releasedate)}: {moviereleasedate}&#10;||{tr(runtime)}: {movieruntime} min&#10;||&#10;{tr(popularity)}: {moviepopularity}&#10;||&#10;{tr(voteaverage)}: {movievoteaverage}&#10;||&#10;{tr(homepage)}: {moviehomepage}|&#10;" />
     </tab>
     <!-- TAB SERIESGALERY -->
     <tab condition="{isseries}" name="{tr(seriesgalery)}" x="3%" y="23%" width="94%" height="61%" layer="4" scrollheight="{areaheight}*0.61">
@@ -232,13 +232,13 @@
                 <drawrectangle condition="not{tabs[current]}" x="0" y="0" width="{width(label)}" height="100%" color="{menuback}" />
                 <drawrectangle x="{columnwidth}-1" y="0" width="1" height="100%" color="{menubackline}" />
                 <drawrectangle condition="{tabs[current]}" x="0" y="0" width="{width(label)}" height="100%" color="{menubackactive}" />
-                <drawtext name="label" x="0" valign="center" font="{regular}" fontsize="60%" color="00000000" text="  {tabs[title]}  " />
+                <drawtext name="label" x="0" valign="center" font="{regular}" fontsize="{areaheight}*{tablabels}/100" color="00000000" text="  {tabs[title]}  " />
             </loop>
         </area>
         <area x="2%" y="85%" width="{areawidth} - 60" height="6%" layer="4">
             <loop name="tabs" x="0" y="0" orientation="horizontal">
-                <drawtext condition="not{tabs[current]}" x="0" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="  {tabs[title]}  " />
-                <drawtext condition="{tabs[current]}" x="0" valign="center" font="{regular}" fontsize="60%" color="{fontmenuactive}" text="  {tabs[title]}  " />
+                <drawtext condition="not{tabs[current]}" x="0" valign="center" font="{regular}" fontsize="{areaheight}*{tablabels}/100" color="{fontdefault}" text="  {tabs[title]}  " />
+                <drawtext condition="{tabs[current]}" x="0" valign="center" font="{regular}" fontsize="{areaheight}*{tablabels}/100" color="{fontmenuactive}" text="  {tabs[title]}  " />
             </loop>
         </area>
     </tablabels>
diff --git a/skins/estuary4vdr/xmlfiles/plug-tvguideng-root.xml b/skins/estuary4vdr/xmlfiles/plug-tvguideng-root.xml
index 6eadc56..2c5f18a 100644
--- a/skins/estuary4vdr/xmlfiles/plug-tvguideng-root.xml
+++ b/skins/estuary4vdr/xmlfiles/plug-tvguideng-root.xml
@@ -9,7 +9,7 @@
         </area>
         <area x="2%" y="0" width="30%" height="7%" layer="2">
             <drawimage name="icon" imagetype="icon" path="tvguideng" x="0" valign="center" width="{areaheight}*0.8" height="{areaheight}*0.8"/>
-            <drawtext x="{width(icon)} + 20" valign="center" font="{regular}" fontsize="80%" color="{fontdefault}" text="TV Guide" />
+            <drawtext x="{width(icon)} + 20" valign="center" font="{regular}" fontsize="{areaheight}*{headerfontsize}/100" color="{fontdefault}" text="TV Guide" />
         </area>
         <area x="0" y="0" width="100%" height="100%" layer="2">
             <drawrectangle x="2%" y="10%" width="96%" height="65%" color="{menuback}" />
@@ -27,7 +27,7 @@
         </area>
         <area x="2%" y="0" width="30%" height="7%" layer="2">
             <drawimage name="icon" imagetype="icon" path="tvguideng" x="0" valign="center" width="{areaheight}*0.8" height="{areaheight}*0.8"/>
-            <drawtext x="{width(icon)} + 20" valign="center" font="{regular}" fontsize="80%" color="{fontdefault}" text="TV Guide" />
+            <drawtext x="{width(icon)} + 20" valign="center" font="{regular}" fontsize="{areaheight}*{headerfontsize}/100" color="{fontdefault}" text="TV Guide" />
         </area>
         <area x="0" y="0" width="100%" height="100%" layer="2">
             <drawrectangle x="2%" y="9%" width="96%" height="68%" color="{menuback}" />
@@ -42,20 +42,20 @@
     </viewelement>
 
     <viewelement name="header_hor">
-        <area x="18%" y="78%" width="50%" height="3%" layer="3">
-            <drawtext x="0" y="0" font="{regular}" fontsize="100%" width="100%" color="{fontdefault}" text="{day} {date} {start} - {stop}: {title}" />
+        <area x="18%" y="78%" width="50%" height="4%" layer="3">
+            <drawtext x="0" y="0" font="{regular}" fontsize="{areaheight}*{tvgcurrenttitlesize}/100" width="100%" color="{fontdefault}" text="{day} {date} {start} - {stop}: {title}" />
         </area>
         <areascroll orientation="vertical" mode="forthandback" delay="3000" scrollspeed="medium" x="18%" y="{areaheight}*0.815" width="71%" height="9%" layer="3">
-            <drawtextbox x="0" y="0" font="{regular}" width="100%" fontsize="28%" color="{fontdefault}" text="{description}" />
+            <drawtextbox x="0" y="0" font="{regular}" width="100%" fontsize="{areaheight}*{tvgcurrenttextsize}/100" color="{fontdefault}" text="{description}" />
         </areascroll>
     </viewelement>
 
     <viewelement name="header_ver">
-        <area x="7%" y="79%" width="80%" height="3%" layer="3">
-            <drawtext x="0" y="0" font="{regular}" fontsize="100%" width="100%" color="{fontdefault}" text="{day} {date} {start} - {stop}: {title}" />
+        <area x="7%" y="79%" width="80%" height="4%" layer="3">
+            <drawtext x="0" y="0" font="{regular}" fontsize="{areaheight}*{tvgcurrenttitlesize}/100" width="100%" color="{fontdefault}" text="{day} {date} {start} - {stop}: {title}" />
         </area>
         <areascroll orientation="vertical" mode="forthandback" delay="3000" scrollspeed="medium" x="7%" y="{areaheight}*0.825" width="71%" height="8%" layer="3">
-            <drawtextbox x="0" y="0" font="{regular}" width="100%" fontsize="28%" color="{fontdefault}" text="{description}" />
+            <drawtextbox x="0" y="0" font="{regular}" width="100%" fontsize="{areaheight}*{tvgcurrenttextsize}/100" color="{fontdefault}" text="{description}" />
         </areascroll>
     </viewelement>
 
@@ -65,28 +65,28 @@
             <drawimage imagetype="skinpart" path="button_red" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{red1}" x="0" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{red}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{red}" />
         </area>
         <!--green-->
         <area condition="{green1}" x="0" y="94%" width="25%" height="6%" layer="2">
             <drawimage imagetype="skinpart" path="button_green" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{green1}" x="0" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{green}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{green}" />
         </area>
         <!--yellow-->
         <area condition="{yellow1}" x="0" y="94%" width="25%" height="6%" layer="2">
             <drawimage imagetype="skinpart" path="button_yellow" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{yellow1}" x="0" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{yellow}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{yellow}" />
         </area>
         <!--blue-->
         <area condition="{blue1}" x="0" y="94%" width="25%" height="6%" layer="2">
             <drawimage imagetype="skinpart" path="button_blue" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{blue1}" x="0" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{blue}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{blue}" />
         </area>
 
         <!--red-->
@@ -94,28 +94,28 @@
             <drawimage imagetype="skinpart" path="button_red" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{red2}" x="25%" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{red}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{red}" />
         </area>
         <!--green-->
         <area condition="{green2}" x="25%" y="94%" width="25%" height="6%" layer="2">
             <drawimage imagetype="skinpart" path="button_green" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{green2}" x="25%" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{green}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{green}" />
         </area>
         <!--yellow-->
         <area condition="{yellow2}" x="25%" y="94%" width="25%" height="6%" layer="2">
             <drawimage imagetype="skinpart" path="button_yellow" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{yellow2}" x="25%" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{yellow}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{yellow}" />
         </area>
         <!--blue-->
         <area condition="{blue2}" x="25%" y="94%" width="25%" height="6%" layer="2">
             <drawimage imagetype="skinpart" path="button_blue" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{blue2}" x="25%" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{blue}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{blue}" />
         </area>
 
         <!--red-->
@@ -123,28 +123,28 @@
             <drawimage imagetype="skinpart" path="button_red" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{red3}" x="50%" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{red}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{red}" />
         </area>
         <!--green-->
         <area condition="{green3}" x="50%" y="94%" width="25%" height="6%" layer="2">
             <drawimage imagetype="skinpart" path="button_green" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{green3}" x="50%" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{green}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{green}" />
         </area>
         <!--yellow-->
         <area condition="{yellow3}" x="50%" y="94%" width="25%" height="6%" layer="2">
             <drawimage imagetype="skinpart" path="button_yellow" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{yellow3}" x="50%" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{yellow}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{yellow}" />
         </area>
         <!--blue-->
         <area condition="{blue3}" x="50%" y="94%" width="25%" height="6%" layer="2">
             <drawimage imagetype="skinpart" path="button_blue" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{blue3}" x="50%" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{blue}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{blue}" />
         </area>
 
         <!--red-->
@@ -152,28 +152,28 @@
             <drawimage imagetype="skinpart" path="button_red" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{red4}" x="75%" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{red}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{red}" />
         </area>
         <!--green-->
         <area condition="{green4}" x="75%" y="94%" width="25%" height="6%" layer="2">
             <drawimage imagetype="skinpart" path="button_green" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{green4}" x="75%" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{green}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{green}" />
         </area>
         <!--yellow-->
         <area condition="{yellow4}" x="75%" y="94%" width="25%" height="6%" layer="2">
             <drawimage imagetype="skinpart" path="button_yellow" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{yellow4}" x="75%" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{yellow}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{yellow}" />
         </area>
         <!--blue-->
         <area condition="{blue4}" x="75%" y="94%" width="25%" height="6%" layer="2">
             <drawimage imagetype="skinpart" path="button_blue" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{blue4}" x="75%" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{blue}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{blue}" />
         </area>
     </viewelement>
 
@@ -183,28 +183,28 @@
             <drawimage imagetype="skinpart" path="button_red" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{red1}" x="0" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{red}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{red}" />
         </area>
         <!--green-->
         <area condition="{green1}" x="0" y="94%" width="25%" height="6%" layer="2">
             <drawimage imagetype="skinpart" path="button_green" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{green1}" x="0" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{green}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{green}" />
         </area>
         <!--yellow-->
         <area condition="{yellow1}" x="0" y="94%" width="25%" height="6%" layer="2">
             <drawimage imagetype="skinpart" path="button_yellow" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{yellow1}" x="0" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{yellow}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{yellow}" />
         </area>
         <!--blue-->
         <area condition="{blue1}" x="0" y="94%" width="25%" height="6%" layer="2">
             <drawimage imagetype="skinpart" path="button_blue" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{blue1}" x="0" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{blue}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{blue}" />
         </area>
 
         <!--red-->
@@ -212,28 +212,28 @@
             <drawimage imagetype="skinpart" path="button_red" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{red2}" x="25%" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{red}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{red}" />
         </area>
         <!--green-->
         <area condition="{green2}" x="25%" y="94%" width="25%" height="6%" layer="2">
             <drawimage imagetype="skinpart" path="button_green" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{green2}" x="25%" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{green}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{green}" />
         </area>
         <!--yellow-->
         <area condition="{yellow2}" x="25%" y="94%" width="25%" height="6%" layer="2">
             <drawimage imagetype="skinpart" path="button_yellow" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{yellow2}" x="25%" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{yellow}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{yellow}" />
         </area>
         <!--blue-->
         <area condition="{blue2}" x="25%" y="94%" width="25%" height="6%" layer="2">
             <drawimage imagetype="skinpart" path="button_blue" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{blue2}" x="25%" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{blue}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{blue}" />
         </area>
 
         <!--red-->
@@ -241,28 +241,28 @@
             <drawimage imagetype="skinpart" path="button_red" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{red3}" x="50%" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{red}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{red}" />
         </area>
         <!--green-->
         <area condition="{green3}" x="50%" y="94%" width="25%" height="6%" layer="2">
             <drawimage imagetype="skinpart" path="button_green" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{green3}" x="50%" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{green}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{green}" />
         </area>
         <!--yellow-->
         <area condition="{yellow3}" x="50%" y="94%" width="25%" height="6%" layer="2">
             <drawimage imagetype="skinpart" path="button_yellow" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{yellow3}" x="50%" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{yellow}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{yellow}" />
         </area>
         <!--blue-->
         <area condition="{blue3}" x="50%" y="94%" width="25%" height="6%" layer="2">
             <drawimage imagetype="skinpart" path="button_blue" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{blue3}" x="50%" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{blue}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{blue}" />
         </area>
 
         <!--red-->
@@ -270,28 +270,28 @@
             <drawimage imagetype="skinpart" path="button_red" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{red4}" x="75%" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{red}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{red}" />
         </area>
         <!--green-->
         <area condition="{green4}" x="75%" y="94%" width="25%" height="6%" layer="2">
             <drawimage imagetype="skinpart" path="button_green" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{green4}" x="75%" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{green}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{green}" />
         </area>
         <!--yellow-->
         <area condition="{yellow4}" x="75%" y="94%" width="25%" height="6%" layer="2">
             <drawimage imagetype="skinpart" path="button_yellow" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{yellow4}" x="75%" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{yellow}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{yellow}" />
         </area>
         <!--blue-->
         <area condition="{blue4}" x="75%" y="94%" width="25%" height="6%" layer="2">
             <drawimage imagetype="skinpart" path="button_blue" x="0" y="0" width="100%" height="100%"/>
         </area>
         <area condition="{blue4}" x="75%" y="94%" width="25%" height="6%" layer="3">
-            <drawtext align="center" valign="center" font="{regular}" fontsize="60%" color="{fontdefault}" text="{blue}" />
+            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{blue}" />
         </area>
     </viewelement>
 
@@ -407,11 +407,18 @@
         <area condition="{current}" layer="3">
             <fill color="{menubackactive}" />
         </area>
-        <area layer="4">
-            <drawtext condition="not{current}" x="10" width="96%" y="15%" font="regular" color="{fontdefault}" fontsize="30%" text="{start} - {stop}" />
-            <drawtext condition="not{current}" x="10" width="96%" y="45%" font="regular" color="{fontdefault}" fontsize="45%" text="{title}" />
-            <drawtext condition="{current}" x="10" width="96%" y="15%" font="regular" color="{fontmenuactive}" fontsize="30%" text="{start} - {stop}" />
-            <drawtext condition="{current}" x="10" width="96%" y="45%" font="regular" color="{fontmenuactive}" fontsize="45%" text="{title}" />
+        <area condition="{tvgshowtime}" layer="4">
+            <drawtext condition="not{current}" x="10" width="96%" y="{areaheight}*{tvghorgriddateposy}/100" font="regular" color="{fontdefault}" fontsize="{areaheight}*{tvghorgriddatesize}/100" text="{start} - {stop}" />
+            <drawtext condition="not{current}" x="10" width="96%" y="{areaheight}*{tvghorgridtitleposy}/100" font="regular" color="{fontdefault}" fontsize="{areaheight}*{tvghorgridtitlesize}/100" text="{title}" />
+            <drawtext condition="{current}" x="10" width="96%" y="{areaheight}*{tvghorgriddateposy}/100" font="regular" color="{fontmenuactive}" fontsize="{areaheight}*{tvghorgriddatesize}/100" text="{start} - {stop}" />
+            <drawtext condition="{current}" x="10" width="96%" y="{areaheight}*{tvghorgridtitleposy}/100" font="regular" color="{fontmenuactive}" fontsize="{areaheight}*{tvghorgridtitlesize}/100" text="{title}" />
+            <drawrectangle x="0" y="{areaheight}-2" width="100%" height="2" color="{menubackline}" />
+            <drawrectangle x="{areawidth}-2" y="0" width="2" height="100%" color="{menubackline}" />
+            <drawimage condition="{timer}" imagetype="icon" path="ico_rec_selected" x="{areawidth} - {areaheight}*0.4 - 5" y="5" width="0.4*{areaheight}" height="0.4*{areaheight}" />
+        </area>
+        <area condition="not{tvgshowtime}" layer="4">
+            <drawtext condition="not{current}" x="10" width="96%" valign="center" font="regular" color="{fontdefault}" fontsize="{areaheight}*{tvghorgridtitlesize}/100" text="{title}" />
+            <drawtext condition="{current}" x="10" width="96%" valign="center"  font="regular" color="{fontmenuactive}" fontsize="{areaheight}*{tvghorgridtitlesize}/100" text="{title}" />
             <drawrectangle x="0" y="{areaheight}-2" width="100%" height="2" color="{menubackline}" />
             <drawrectangle x="{areawidth}-2" y="0" width="2" height="100%" color="{menubackline}" />
             <drawimage condition="{timer}" imagetype="icon" path="ico_rec_selected" x="{areawidth} - {areaheight}*0.4 - 5" y="5" width="0.4*{areaheight}" height="0.4*{areaheight}" />
@@ -422,11 +429,17 @@
         <area condition="{current}" layer="3">
             <fill color="{menubackactive}" />
         </area>
-        <area layer="4">
-            <drawtext condition="not{current}" x="2%" width="97%" y="3" font="regular" color="{fontdefault}" fontsize="{areawidth}*0.11" text="{start} - {stop}" />
-            <drawtextbox condition="not{current}" x="2%" width="97%" y="{areawidth}*0.15" height="{areawidth}*0.85" font="regular" color="{fontdefault}" fontsize="{areawidth}*0.10" text="{title}" />
-            <drawtext condition="{current}" x="2%" width="97%" y="3" font="regular" color="{fontmenuactive}" fontsize="{areawidth}*0.10" text="{start} - {stop}" />
-            <drawtextbox condition="{current}" x="2%" width="97%" y="{areawidth}*0.15" height="{areawidth}*0.85" font="regular" color="{fontmenuactive}" fontsize="{areawidth}*0.10" text="{title}" />
+        <area condition="{tvgshowtime}" layer="4">
+            <drawtext condition="not{current}" x="2%" width="97%" y="{areawidth}*{tvgvergriddateposy}/100" font="regular" color="{fontdefault}" fontsize="{areawidth}*{tvgvergriddatesize}/100" text="{start} - {stop}" />
+            <drawtextbox condition="not{current}" x="2%" width="97%" y="{areawidth}*{tvgvergridtitleposy}/100" height="{areawidth}*0.85" font="regular" color="{fontdefault}" fontsize="{areawidth}*{tvgvergridtitlesize}/100" text="{title}" />
+            <drawtext condition="{current}" x="2%" width="97%" y="{areawidth}*{tvgvergriddateposy}/100" font="regular" color="{fontmenuactive}" fontsize="{areawidth}*{tvgvergriddatesize}/100" text="{start} - {stop}" />
+            <drawtextbox condition="{current}" x="2%" width="97%" y="{areawidth}*{tvgvergridtitleposy}/100" height="{areawidth}*0.85" font="regular" color="{fontmenuactive}" fontsize="{areawidth}*{tvgvergridtitlesize}/100" text="{title}" />
+            <drawrectangle x="0" y="{areaheight}-2" width="100%" height="2" color="{menubackline}" />
+            <drawrectangle x="{areawidth}-2" y="0" width="2" height="100%" color="{menubackline}" />
+        </area>
+        <area condition="not{tvgshowtime}" layer="4">
+            <drawtextbox condition="not{current}" x="2%" width="97%" y="{areawidth}*{tvgvergridtitleposy}/100" height="{areawidth}*0.85" font="regular" color="{fontdefault}" fontsize="{areawidth}*{tvgvergridtitlesize}/100" text="{title}" />
+            <drawtextbox condition="{current}" x="2%" width="97%" y="{areawidth}*{tvgvergridtitleposy}/100" height="{areawidth}*0.85" font="regular" color="{fontmenuactive}" fontsize="{areawidth}*{tvgvergridtitlesize}/100" text="{title}" />
             <drawrectangle x="0" y="{areaheight}-2" width="100%" height="2" color="{menubackline}" />
             <drawrectangle x="{areawidth}-2" y="0" width="2" height="100%" color="{menubackline}" />
         </area>