   render: ->
     avgSession = Math.round(@props.stats.characterMinutes / @props.stats.characterSessionsStarted)
     dom.div {className: 'row'},
-      dom.div {className: 'col-md-4'},
+      dom.div {className: 'col-md-3'},
         React.createElement(CharacterAvatar, {id: @props.character.id})
-      dom.div {className: 'col-md-8'},
-        React.createElement CalloutStat, {value: @props.stats.characterMinutes, description: 'Time Played', formatter: humanizeMinutes}
-        React.createElement CalloutStat, {value: @props.stats.daysOfActivity, description: 'Active Days'}
-        React.createElement CalloutStat, {value: @props.stats.characterSessionsStarted, description: 'Logins'}
-        React.createElement CalloutStat, {value: avgSession, description: 'Average Session Length', formatter: humanizeMinutes}
+      dom.div {className: 'col-md-9'},
+        dom.div {className: 'row'},
+          dom.div {className: 'col-md-8'},
+            React.createElement CalloutStat, {
+              value: @props.stats.characterMinutes,
+              description: 'Time Played',
+              formatter: humanizeMinutes
+            }
+            React.createElement CalloutStat, {
+              value: avgSession,
+              description: 'Average Session Length',
+              formatter: humanizeMinutes
+            }
+          dom.div {className: 'col-md-4'},
+            React.createElement CalloutStat, {
+              value: @props.stats.characterSessionsStarted,
+              description: 'Logins'
+            }
+            React.createElement CalloutStat, {
+              value: @props.stats.daysOfActivity,
+              description: 'Active Days'
+            }
 )
 
 CharacterAvatar = React.createClass(


      rawStatsList = React.createElement(RawStatsList, {stats: @state.stats})

      dom.div {className: 'container translucent'},

        React.createElement(SSOLoginButton, {linkText: 'Switch Character/Account'})

        title

        charInfoPanel

        # Residence / Distance

        dom.div {className: 'row'},
          dom.div {className: 'col-md-6'}, travelJumpsPanel
          dom.div {className: 'col-md-6'}, travelDistancePanel

        dom.div {className: 'row'},
          dom.div {className: 'col-md-12'}, distanceAnalogy

        # PVP

        dom.div {className: 'row'},
          dom.div {className: 'col-md-6'}, killsPanel
          dom.div {className: 'col-md-6'}, deathsPanel

        dom.div {className: 'row'},
          dom.div {className: 'col-md-6'}, weaponUsagePanel
          dom.div {className: 'col-md-6'}, damageTakenPanel

        dom.div {className: 'row'},
          dom.div {className: 'col-md-12'}, damageAnalogy

        dom.div {className: 'row'},
          dom.div {className: 'col-md-3'}, pvpModulesUsage
          dom.div {className: 'col-md-3'}, pvpModulesAgainst
          dom.div {className: 'col-md-3'}, miscPvpStats
          dom.div {className: 'col-md-3'}, miscTooPvpStats

        # TODO: without spacer columns, things overlap for some reason.  fix that!
        dom.div {className: 'row'},
          dom.div {className: 'col-md-3'}, repsGivenPanel
          dom.div {className: 'col-md-1'}, ''
          dom.div {className: 'col-md-3'}, repsReceivedPanel
          dom.div {className: 'col-md-1'}, ''
          dom.div {className: 'col-md-3'}, selfRepPanel

        # PVE Stats

        dom.div {className: 'row'},
          dom.div {className: 'col-md-12'}, miscModules

        dom.div {className: 'row'},
          dom.div {className: 'col-md-12'}, pveStats

        # ISK / Markets
        dom.div {className: 'row'},
          dom.div {className: 'col-md-6'}, totalIskPanel
          dom.div {className: 'col-md-6'}, marketIskPanel

        dom.div {className: 'row'},
          dom.div {className: 'col-md-12'}, marketPanel

        # Industry
        dom.div {className: 'row'},
          dom.div {className: 'col-md-6'}, miningPanel
          dom.div {className: 'col-md-6'}, industryJobs

        # Mining
        dom.div {className: 'row'},
          dom.div {className: 'col-md-12'}, blueprints


        # Social
        dom.div {className: 'row'},
          dom.div {className: 'col-md-6'}, contactsSelfPanel
          dom.div {className: 'col-md-6'}, contactsOtherPanel

        dom.div {className: 'row'},
          dom.div {className: 'col-md-12'}, socialMiscPanel

        dom.div {className: 'row'}
          dom.div {className: 'col-md-12'}, miscStats

        # Misc

        #rawStatsList
)

SSOLoginButton = React.createClass(


          dom.div null, "No data for #{@state.year}"

      charInfoPanel = React.createElement(CharacterInfoPanel, {
        character: @state.character
        corp: @state.corp
        facts: facts
        stats: @state.stats
      })

      travelJumpsPanel = React.createElement(TravelJumpsPanel, {stats: @state.stats})
      travelDistancePanel = React.createElement(TravelDistancePanel, {stats: @state.stats})
