diff --git a/haxe/ui/styles/StyleSheet.hx b/haxe/ui/styles/StyleSheet.hx
index 09195ec18..6966f56f3 100644
--- a/haxe/ui/styles/StyleSheet.hx
+++ b/haxe/ui/styles/StyleSheet.hx
@@ -2,9 +2,11 @@ package haxe.ui.styles;
 
 import haxe.ui.core.Component;
 import haxe.ui.styles.elements.AnimationKeyFrames;
+import haxe.ui.styles.elements.Directive;
 import haxe.ui.styles.elements.ImportElement;
 import haxe.ui.styles.elements.MediaQuery;
 import haxe.ui.styles.elements.RuleElement;
+import haxe.ui.styles.elements.Selector;
 
 class StyleSheet {
     public var name:String;
@@ -125,18 +127,45 @@ class StyleSheet {
         }
     }
 
+    var directives = new Map<String, Directive>();
+    var selectedSelectors = new Map<String, Selector>();
+
     public function buildStyleFor(c:Component, style:Style = null):Style {
         if (style == null) {
             style = {};
         }
+
+        if (rules.length <= 0) {
+            return style;
+        }
+
+        directives.clear();
+
         for (r in rules) {
             if (!r.match(c)) {
                 continue;
             }
 
-            style.mergeDirectives(r.directives);
+            for (k in r.directives.keys()) {
+                var v = r.directives.get(k);
+                if (!directives.exists(k)) {
+                    directives[k] = v;
+                    selectedSelectors[k] = r.selector;
+                } else {
+                    if (r.selector.hasPrecedenceOrEqualTo(selectedSelectors[k])) {
+                        directives[k] = v;
+                        selectedSelectors[k] = r.selector;
+                        if (k == "background-color") {
+                            directives["background-color-end"] = v;
+                            selectedSelectors["background-color-end"] = r.selector;
+                        }
+                    }
+                }
+            }
         }
 
+        style.mergeDirectives(directives);
+
         return style;
     }
 }
\ No newline at end of file
diff --git a/haxe/ui/styles/elements/Selector.hx b/haxe/ui/styles/elements/Selector.hx
index fd83e34bc..54d1e12c5 100644
--- a/haxe/ui/styles/elements/Selector.hx
+++ b/haxe/ui/styles/elements/Selector.hx
@@ -3,6 +3,10 @@ package haxe.ui.styles.elements;
 class Selector {
     public var parts:Array<SelectorPart> = [];
 
+    private var weightA = 0;
+    private var weightB = 0;
+    private var weightC = 0;
+
     public function new(s:String) {
         s = StringTools.replace(s, ">", " > ");
         var p = s.split(" ");
@@ -45,6 +49,31 @@ class Selector {
             parts.push(current);
             parent = current;
         }
+
+        //  https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity
+        //  Combinators, such as +, >, ~, " ", and ||, may make a selector more specific in what is selected 
+        //  but they don't add any value to the specificity weight.
+        for ( p in parts) {
+            if (p.id != null) {
+                weightA++;
+            }
+            if (p.className != null) {
+                weightB++;
+            }
+            if (p.pseudoClass != null) {
+                weightC++;
+            }
+        }
+    }
+
+    public function hasPrecedenceOrEqualTo(s:Selector) {
+        if (weightA > s.weightA) return true;
+        if (weightA < s.weightA) return false;
+        if (weightB > s.weightB) return true;
+        if (weightB < s.weightB) return false;
+        if (weightC > s.weightC) return true;
+        if (weightC < s.weightC) return false;
+        return true;
     }
 
     public function toString():String {
diff --git a/haxe/ui/themes/ThemeManager.hx b/haxe/ui/themes/ThemeManager.hx
index 3a5091dad..20738aa92 100644
--- a/haxe/ui/themes/ThemeManager.hx
+++ b/haxe/ui/themes/ThemeManager.hx
@@ -164,7 +164,9 @@ class ThemeManager {
             style += "\n" + styleData;
         }
         if (style != null) {
-            addStyleString(style);
+            var p = haxe.io.Path.directory(resourceId);
+            addStyleString(style, p); //haxe.io.Path.directory(resourceId));
+            //priority++;
         } else {
             #if debug
             trace("WARNING: could not find " + resourceId);
@@ -172,8 +174,8 @@ class ThemeManager {
         }
     }
 
-    public function addStyleString(style:String) {
-        Toolkit.styleSheet.parse(style);
+    public function addStyleString(style:String, sheetName:String) {
+        Toolkit.styleSheet.parse(style, sheetName);
     }
 
     private function buildThemeVars(themeName:String, vars:Map<String, String>) {