* {  
  margin: 0;
  padding: 0;
}

body { 
  font-family: 'Open Sans', sans-serif;
  width:90%;
  max-width: 600px;
  margin:10% auto;
  background: #30333B;
  color:#E7E6E0;
}

h2 { font-weight:600; }

p { line-height:180%; font-size:16px; text-align:justify;}

p a { text-decoration:none; font-size:16px; color:#FF6600; }
  p a:hover { border-bottom: 1px solid #FF6600; }

#social { margin:0 auto; width: 280px; }

#social .project {
  max-height:90px;  
  display: inline-block;  
  margin-top:0px;
  
  filter: url("data:image/svg+xml;utf8,<svg%20xmlns='http://www.w3.org/2000/svg'><filter%20id='grayscale'><feColorMatrix%20type='matrix'%20values='0.3333%200.3333%200.3333%200%200%200.3333%200.3333%200.3333%200%200%200.3333%200.3333%200.3333%200%200%200%200%200%201%200'/></filter></svg>#grayscale"); /* Firefox 3.5+ */
  filter: gray; /* IE6+ */
  filter: grayscale(100%); /* Current draft standard */
  -webkit-filter: grayscale(100%); /* New WebKit */
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%); 
  -o-filter: grayscale(100%);
}

#social .project:hover { filter:none; -webkit-filter: grayscale(0); }