/*************************************
Base for code highlighting
*************************************/
pre {
  width:720px;
  margin:0 0 25px;
}

code {
  padding:2px 5px;
  color:#000;
  background:#D2DCE9;
  background:rgba(0,102,204,0.1);
  -webkit-border-radius:4px;
  -moz-border-radius:4px;
}

pre code {display:block; line-height:1.2; background:#fff; border:1px solid #999; -webkit-box-shadow:rgba(0,0,0,0.15) 0 6px 20px; padding:15px 20px; margin:0; -webkit-border-radius:0; -moz-border-radius:0; color:#333; width:678px; overflow-x:auto; overflow-y:hidden;}

/*************************************
RUBY Highlighting
*************************************/
code.ruby span.comment {
  color: #666;
}

code.ruby span.string {
  color: #A5C261;
}

code.ruby span.brackets {
  color: #E3C2F8;
}

code.ruby span.symbol {
  color: #6D9CBE;
}

code.ruby span.keywords {
  color: #BF7833;
}

 /*************************************
JAVASCRIPT Highlighting
*************************************/
code.javascript span.comment {
  color: #666;
}

code.javascript span.string {
  color: #06C;
}

code.javascript span.brackets {
  color: #E3C2F8;
}

code.javascript span.symbol {
  color: #6D9CBE;
}

code.javascript span.keywords {
  color: #BF7833;
}

/*************************************
HTML Highlighting
*************************************/
code.html span.comment {
  color: #666;
}

code.html span.string {
  color: #093;
}

code.html span.tag {
  color: #0082A3
}

code.html span.attribute {
  color: #333;
}

code.html span.doctype {
  color: #999;
}

code.html span.liquid {
  color:#06C;
}

/*************************************
CSS Highlighting
*************************************/
code.css span.comment {
  color: #666;
}

code.css span.keywords {
  color: #BF7833;
}

code.css span.selectors {
  color: #BF7833;
}

code.css span.properties {
  color: #6D9CBE;
}

code.css span.units {
  color: #A5C261;
}