#ohloh_streamgraph
  &.languages
    height: 300px !important
  #ohloh_stream
    width: 940px !important
  width: 715px
  height: 350px !important
  float: left
  margin-left: 15px
  margin-right: 10px
  .highlight
    stroke: #663300
    stroke-width: 2px
  .x_axis
    path
      fill: none
  .x_axis
    text
      font-size: 10px
      fill: #666666
  svg#ohloh_stream
    height: 300px !important

.streamgraph_IE_not_supported
  @include ie-not-supported-text-color
  width: 900px !important
  background: asset_url('sample_streamgraph.png') no-repeat !important
  font-weight: bold

#streamgraph_legend
  width: 150px
  overflow: auto
  white-space: nowrap
  float: right
  margin-right: 15px
  border: solid #c3c3c3 thin
  padding-top: 5px

#streamgraph_legend
  div
    dislplay: inline-block
  p
    @include site-link-color
    padding-left: 10px
    margin: 0 0 -2px 0
    dislplay: inline

.streamgraph_legend_color
  width: 16px
  height: 12px
  border: solid #cccccc thin
  float: left
  margin: 4px 4px 0 4px
  border-radius: 3px
  clear: left

.full
  .background-watermark
    background: asset_url('charts/watermark_860.png') no-repeat center

.regular
  .background-watermark
    background: asset_url('charts/watermark_692.png') no-repeat center left
@media only all and (min-width: 320px) and (max-width: 480px)
  #ohloh_streamgraph
    &.languages
      height: 150px !important
    #ohloh_stream
      width: auto !important
    width: auto !important
  #streamgraph_legend
    font-size: 13px !important
@media (min-width: 540px) and (max-width: 1024px)
  #ohloh_streamgraph
    #ohloh_stream
      width: auto !important
    width: auto !important
  #streamgraph_legend
    margin-right: 48px