var x = new CSS('HTML5');
// `x` is my Style it started off from the default HTML5 CSS stylesheet.
// `x(selector)` will allow us to access the style of the `selector` CSS selector.

x.import('file.css'); // let's import some more rules

console.log( x('a').fontSize ); // Prints the default font-size property for 'a' elements

x('.myClass > p').display = 'block'; // CSS: .myClass > p { display: block; };

var c1 = x('body > div .class1'); // Just for commodity...
c1.width = x('.class2 > div').width; // Cannot be done in CSS/LESS/SASS :(
// It should fall back properly, of course, or give error if that property is not found

x('.class3').set( c1.deepCopy() ); // Bringing in nested selectors
x('.class4').set( c1.copy() ); // Only copying properties

// Introspection! F**k yeah!
c1.forEachProperty( function(property){ ... } );
c1.forEachChild( function(selector){ ... } );
c1.forEachDescendant( function(selector){ ... } );
x.forEachElement( function(selector){ ... } );

var c1Rule = c1.generate(); // Generating the CSS rule for a specific selector

x.delete('.class1'); // We no longer need/want `.class1` in our stylesheet
x.deepDelete('.class1'); // Removing also its nested selectors

// Let's now generate our final stylesheet.
// The `generate` function might take care of optimizing the stylesheet.
var stylesheet = x.generate();