* { color: blue; }
E { color: blue; }

E:not(:link) { color: blue; }
E:not(:link):not(:visited) { color: blue; }
E:not(:link, :visited) { color: blue; }
E:matches(:hover, :focus) { color: blue; }

E.warning { color: blue; }
E#id { color: blue; }
E[foo] { color: blue; }
E[foo="barbar"] { color: blue; }
E[foo="barbar" i] { color: blue; }
E[foo~="hello#$@%@$#^"] { color: blue; }
E[foo^="color: green;"] { color: blue; }
E[foo$="239023"] { color: blue; }
E[foo*="29302"] { color: blue; }
E[foo|="239032"] { color: blue; }

[foo] { color: blue; }
[foo] .helloWorld { color: blue; }
[foo].helloWorld { color: blue; }
[foo="barbar"] { color: blue; }
[foo~="hello#$@%@$#^"] { color: blue; }
[foo^="color: green;"] { color: blue; }
[foo$="239023"] { color: blue; }
[foo*="29302"] { color: blue; }
[foo|="239032"] { color: blue; }

E:dir(ltr) { color: blue; }
E:lang(en) { color: blue; }
E:lang(en, fr) { color: blue; }

E:any-link { color: blue; }
E:link { color: blue; }
E:visited { color: blue; }
E:local-link { color: blue; }
E:local-link(0) { color: red; }
E:local-link(1) { color: white; }
E:local-link(2) { color: red; }
E:target { color: blue; }
E:scope { color: blue; }

E:current { color: blue; }
E:current(:link) { color: blue; }
E:past { color: blue; }
E:future { color: blue; }

E:active { color: blue; }
E:hover { color: blue; }
E:focus { color: blue; }
E:enabled { color: blue; }
E:disabled { color: blue; }
E:indeterminate { color: blue; }
E:default { color: blue; }
E:in-range { color: blue; }
E:out-of-range { color: blue; }
E:required { color: blue; }
E:optional { color: blue; }
E:read-only { color: blue; }
E:read-write { color: blue; }

E:root { color: blue; }
E:empty { color: blue; }
E:first-child { color: blue; }
E:nth-child(odd) { color: blue; }
E:nth-child(2n+1) { color: blue; }
E:nth-child(5) { color: blue; }
E:last-child { color: blue; }
E:nth-last-child(-n+2) { color: blue; }
E:only-child { color: blue; }
E:first-of-type { color: blue; }
E:nth-of-type(2n) { color: blue; }
E:last-of-type { color: blue; }
E:nth-last-of-type(n) { color: blue; }
E:only-of-type { color: blue; }
E:nth-match(odd) { color: blue; }
E:nth-last-match(odd) { color: blue; }

E:column(n) { color: blue; }
E:nth-column(n) { color: blue; }
E:nth-last-column(n) { color: blue; }

E F { color: blue; }
E > F { color: blue; }
E + F { color: blue; }
E ~ F { color: blue; }
E /foo/ F { color: blue; }
E! > F { color: blue; }

// namespaces
[foo|att=val] { color: blue }
[*|att] { color: yellow }
[|att] { color: green }
[att] { color: green }

// CSS2.1
E::first-line { color: blue; }
E::first-letter { color: blue; }
E::before { color: blue; }
E::after { color: blue; }

// CSS3 UI (at risk)
E::choices { color: blue; }
E::value { color: blue; }
E::repeat-index { color: blue; }
E::repeat-item { color: blue; }

E:first { color: blue; }
E:first-line { color: blue; }
E:first-letter { color: blue; }
E:before{ color: blue; }
E:after { color: blue; }
E:checked { color: blue; }
E:invalid { color: blue; }
E:valid { color: blue; }
E:left { color: blue; }
E:right { color: blue; }

// -moz experimental
E:any(ol) { color: blue; }
E::selection { color: blue; }

// one of these is nested property,
// the other is a css block.
div {
  font:something {
    size: 30em;
  }

  font: something {
    size: 30em;
  }

}

// self selector

.something {
    &.world {
        color: blue;
    }

    & .mold {
        height: 200px;
    }

    .dog & {
        color: blue;
    }
}

.simple {
    .dad & .wolf {
        color: blue;
    }

    .rad&.bad {
        color: blue;
    }

}

div {
    .something & .what {
        &.world {
            color: blue;
        }
    }
}

div {
    &.foo & {
        color: blue;
    }
}

.main, div {
    .message div {
        .title {
            .nice-fonts & {
                font-size: 24px;
            }
        }
    }
}

$name: escape;
.#{$name}\% {
    color: red;
}

.escape-plan\% {
    color: green;
}
