/* 
   TwitOrNot 2.0
   b:G | studio → ideato Srl
   http://federicomoretti.name/
   Creative Commons BY-ND 3.0 · Federico Moretti
*/
 @media screen {
  *, html, html * { margin: 0; padding: 0; }
  body { margin: 0 auto; background-color: #1a1b1f; color: white; font: normal normal normal .75em 'Lucida Grande', sans-serif; text-align: center; }
  abbr, acronym { cursor: help; }
  fieldset, form { border: none; }
  hr { clear: both; height: 0; border: 0; }
  p.skip, h1#header span, div#navigation a.oauth span, div.vote abbr, p#top { display: none; }
  div#contents { margin: .5em 10%; }
  h1#header { background: black url('/images/header.gif') no-repeat left top; width: 240px; height: 60px; text-align: left; }
  h1#header a, h1#header span.static { display: block; width: 240px; height: 60px; }
  div#navigation { margin: .5em 0; padding-bottom: 1em; }
  div#navigation ul { float: left; margin-right: 151px; height: 24px; text-align: left; }
  div#navigation li { display: inline; padding-right: 1.5em; font-size: 1.2em; list-style: none; }
  div#navigation span.active { border-bottom: 3px solid #9c3; }
  div#navigation a { color: white; text-decoration: none; }
  div#navigation a:focus, div#navigation a:hover { border-bottom: 3px solid #34ccff; }
  div#navigation a.oauth { display: inline; float: right; background: url('/images/oauth.gif') no-repeat left center; width: 151px; height: 24px; border: none !important; }
  div#navigation a.logout { display: inline; float: right; margin-right: .5em;}
  .graybox, .chartbox { margin: 1em 0; background: #3d3c41 url('/images/dark-left-top-corner.gif') no-repeat left top; text-align: left; }
  .graybox div, .chartbox div { background: transparent url('/images/dark-right-top-corner.gif') no-repeat right top; }
  .graybox div div, .chartbox div div { background: transparent url('/images/dark-left-bottom-corner.gif') no-repeat left bottom; }
  .graybox div div div, .chartbox div div div { background: transparent url('/images/dark-right-bottom-corner.gif') no-repeat right bottom; }
  .graybox h2, .graybox h3, .chartbox h3  { padding: .5em .5em 0 .5em; font-weight: normal; letter-spacing: -1px; }  
  .graybox p, .graybox form { padding: .5em; }
  .chartbox ol { padding: .5em; }
  .chartbox ol li { margin-right: 1.5em; font-size: 1.2em; list-style: decimal; list-style-position: inside; }
  .chartbox a, .graybox a, p.tweet a, p#explanation a { color: #34ccff; font-weight: bold; text-decoration: none; }
  .chartbox a:hover, .chartbox a:focus,.graybox a:focus, .graybox a:hover, p.tweet a:focus, p.tweet a.hover, p.avatar a, p#explanation a:focus, p#explanation a:hover { text-decoration: underline; }
  div#main { float: left; width: 70%; }
  div.vote { display: table; background: transparent url('/images/versus.gif') no-repeat center center; }
  div.left, div.right { display: table-cell; width: 50%; vertical-align: bottom; }
  div.left div { margin-right: 48px; background: white url('/images/light-left-top-corner.gif') no-repeat left top; }
  div.left div div { margin-right: 0; background: transparent url('/images/light-right-top-corner.gif') no-repeat right top; }
  div.left div div div { margin-right: 0; background: transparent url('/images/light-right-bottom-corner.gif') no-repeat right bottom; }
  div.left div div div div { margin-right: 0; background: transparent url('/images/light-left-bottom-corner.gif') no-repeat left bottom; min-width: 100% /* WebKit */; width: auto !important; width: 100% /* Internet Explorer */; min-height: 10px; height: auto !important; height: 10px /* Internet Explorer 6 */; }
  div.left p.avatar { margin-right: 48px; }
  div.right div { margin-left: 48px; background: white url('/images/light-left-top-corner.gif') no-repeat left top; }
  div.right div div { margin-left: 0; background: transparent url('/images/light-right-top-corner.gif') no-repeat right top; }
  div.right div div div { margin-left: 0; background: transparent url('/images/light-right-bottom-corner.gif') no-repeat right bottom; }
  div.right div div div div { margin-left: 0; background: transparent url('/images/light-left-bottom-corner.gif') no-repeat left bottom; min-width: 100% /* WebKit */; width: auto !important; width: 100% /* Internet Explorer */; min-height: 10px; height: auto !important; height: 10px /* Internet Explorer 6 */; }
  div.right p.avatar { margin-left: 48px; }
  p.tweet { padding: .5em; color: black; font: 1.77em normal normal bold Georgia, serif; text-align: left; }
  p.tweet a, p#explanation a { font-weight: normal; }
  p.avatar { padding-top: 15px; background: transparent url('/images/arrow.gif') no-repeat center top; text-align: center; }
  p.avatar a, p.avatar a img, p.avatar img { color: #34ccff; text-decoration: none; border: none; }
  div.button p { padding: .5em 24px; background: #1a1b1f url('/images/blank.gif') repeat center center; text-align: center; }
  div.button a, div#footer a, div#sidebar a { color: #9c3; font-style: italic; font-weight: bold; text-decoration: none; }
  div.button a:focus, div.button a:hover, div#footer a:focus, div#footer a:hover, div#sidebar a:focus, div#sidebar a:hover { text-decoration: underline; }
  p#explanation { margin-bottom: .5em; min-height: 16px; height: auto !important; height: 16px /* Internet Explorer */; text-align: left; }
  p#explanation img { vertical-align: middle; }
  form { margin: 1.5em 0; }
  #search label { font-style: italic;  }
  #tuser_username { float: left; margin: 0 .5em; padding: .5em; background-color: white; color: #aaa !important; color: black /* Internet Explorer */; font-size: 1em; border: 1px solid #999; border-radius: 3px; -khtml-border-radius: 3px /* KHTML */; -moz-border-radius: 3px /* Gecko */; -webkit-border-radius: 3px /* WebKit */; }
  #tuser_username:focus { color: black !important; }
  #tuser_submit { padding: .5em; background-color: #eee; color: #333; font-size: 1em; text-transform: lowercase; border: 1px solid #999; border-radius: 3px; -khtml-border-radius: 3px /* KHTML */; -moz-border-radius: 3px /* Gecko */; -webkit-border-radius: 3px /* WebKit */; }
  #tuser_submit:focus, #tuser_submit:hover { background-color: #ccc; }
  div#sidebar { float: right; width: 25%; }
  div#sidebar h3 { margin-bottom: .25em; font-size: 1.1em; font-weight: normal; letter-spacing: -1px; }
  div#sidebar ol { list-style-type: decimal; font-family: Georgia, serif; text-align: left; }
  div#sidebar li { margin-left: 1.5em; padding: .25em 0; line-height: 1em; padding-left: .5em; }
  div#sidebar a { font-family: 'Lucida Grande', sans-serif; font-style: normal; font-weight: normal; }
  div#footer { clear: both; margin: .5em 0; font-size: 11px; text-align:center; text-transform: lowercase; }
  div#footer a { font-style: normal; font-weight: normal; }
  div#footer acronym { border-bottom: 1px solid #333; }
  .tweetit { padding: .25em 0; font-style: normal; font-weight: normal; font-size: 11px; text-align:center; }
  .chartbox .tweetit { display: none; }
 }
