body {
    font: normal 18px/1.5em Arial, Helvetica, sans-serif;
    font-style: normal;
    float: left;
    width: 100%;
    background-color: #fff
    }

img {
    max-width: 100%;
    height: auto;
    vertical-align: middle
    }

.interactive_container {
    width: 950px;
    margin: 0 auto;
/*	position:relative;*/
    }

.interactive_container h1 {
    font-size: 29px;
    color: #0f533e;
    font-weight: normal;
    text-transform: uppercase;
    margin-bottom: 0;
    width: 570px;
    float: left
    }

.interactive_container h2 {
    font-size: 15px;
    font-weight: 100;
    color: #0f533e;
    text-transform: uppercase;
    margin-top: 0;
    margin-bottom: 0;
    width: 570px;
    float: left
    }


/*----------------------------------------------
	Intro
----------------------------------------------*/

#intro-container {
	position: absolute;
	height: 620px;
	width: 960px;
/*	background-color:rgba(255,255,255, 0.6);*/
}

#intro-container .intro {
	margin-top: 280px;
	background-color: white;
	width: 450px;
	font-size: 14px;
	line-height: 1.4em;
	margin-left: 48px;
	padding: 15px;
}

/*----------------------------------------------
	Controls
----------------------------------------------*/
.interactive_container .controls, .interactive_container .category-controls {
    float: right;
    width: 356px
    }

.interactive_container .controls {
    margin-top: 6px
    }

.interactive_container .controls ul {
    float: left;
    padding: 0;
    margin-top: 32px;
	position: relative;
	z-index: 1000;
    }

.interactive_container .controls li {
    list-style-type: none;
    float: left;
    margin-right: 5px
    }


.interactive_container .controls li a {
    text-decoration: none
    }

.interactive_container label {
    font-size: 12px;
    text-transform: uppercase;
    color: #5e5e5e;
    position: relative;
    top: 7px;
    font-weight: bold
    }

.interactive_container .form {
    float: left;
    margin-left: 12px
    }

.interactive_container .company-form, .interactive_container .company-form select {
    width: 125px
    }

.interactive_container .zoom-form {
    width: 76px
    }

#help-screen {
	width:960px;
	height:632px;
	z-index:999;
	position:relative;
	padding:10px 0 0;
	background-color:rgba(255,255,255,0.7);
	display:none;
}

#help-screen .text {
	background:url("../img/help.hires.png") no-repeat;
	width:950px;
	height:548px;
	background-size:contain;
}


/*----------------------------------------------
	Chart
----------------------------------------------*/
.interactive_container #canvas {
    float: left;
    width:580px;
    height:558px;
    }



.interactive_container .chart-labels {
    float: left;
    position: relative;
    }

.interactive_container .chart-labels ul {
    padding: 0;
    margin: 0
    }

.interactive_container .chart-labels li {
    float: left;
    list-style-type: none;
    font-family: "Open Sans Condensed", Arial, Helvetica, sans-serif;
    font-size: 13px;
    font-weight: 700;
    color: #5e5e5e;
    }

/*----------------------------------------------
	Chart Table styles
----------------------------------------------*/

#chart-table {
	position:absolute;
	left:33px;
	background-color:#fff;
	border:1px solid #ccc;
	font-size:13px;
	font-family: "Open Sans Condensed", Arial, Helvetica, sans-serif;
	color:#5e5e5e;
	display:none;
	border:1px solid #ccc;
}


#chart-table table {
	table-layout: fixed;
	width:572px;
}

#chart-table table thead {
	background-color:#444;
	color:#fff;
}

#chart-table table tr {
	border-bottom:1px solid #ccc;
}

#chart-table table th {
	text-align:right;
	padding:0 6px;
}

#chart-table table td {
	text-align:right;
	/*padding:0 6px;*/
    padding-top: 0px;
    padding-bottom: 0px;
    padding-left: 4px;
    padding-right: 6px;
	line-height: 1.55em;
}

#chart-table table .title {
	width:122px;
	text-align:left;
	font-weight:bold;
	font-size:12px;
    padding-right: 4px;
}




#chart-table .template-row,
#chart-table .year-template,
#chart-table .year-value-template {
	display:none;
}

/*----------------------------------------------
	Table styles
----------------------------------------------*/
.company-table {
    font-family: "Open Sans Condensed", Arial, Helvetica, sans-serif;
    font-size: 13px;
    color: #5e5e5e;
    max-width: 356px;
    /*	max-height:291px;*/
    /*	overflow:scroll;
    */
    float: right;
	clear: both;
    }

.company-table .template-row {
    display: none
    }

.company-table .year-change {
    float: right;
    border-bottom: 1px solid #999;
    width: 236px;
    font-weight: bold
    }

.ie9 .company-table .year-change {
    width: 225px;
    }

.company-table table {
    table-layout: fixed;
    width: 356px
    }

.company-table table thead {
    border-bottom: 1px solid #999
    }

.company-table table th {
    line-height: 1em;
    font-weight: 700;
    text-align: left;
    vertical-align: bottom
    }

.company-table table tbody {
    line-height: 1.2em;
    font-weight: normal
    }

.company-table table tbody tr {
    border-bottom: 1px solid #ccc;
    display: block;
	padding:6px 0;
	height: auto;
    }

.company-table table tbody tr:hover {
    background-color: #d1d3d4
    }

.company-table table tr .rank {
    width: 27px;
    font-weight: bold;
    text-align: right;
    padding-right: 7px;
    }

.fixedHeader .rank {
    width:24px !important;
}

.company-table table tr .company {
    width: 78px;
    }

.fixedHeader .company {
    width:70px !important;
}

.company-table table tr .revenue {
    width: 46px;
    text-align: right;
    }

.fixedHeader .revenue {
    width:54px !important;
}


.company-table table tr .ebit {
    width: 45px;
    text-align: right;
    }

.company-table table tr .tsr {
    width: 45px;
    text-align: right;
    }

.company-table table tr .rnd {
    /*text-align: center*/
    width:55px;
    padding-right: 28px;
    text-align: right;
}

/* Special treatment for R&D spending header */
#rnd-header {
  text-align: center;
  padding-left: 11px;
  padding-right: 19px;
}

.scrollContent td.rnd {
    padding-right: 0px !important;
    width: 70px;
}
/*.company-table table tr .rnd {
    text-align: center;
}*/

.ie9 .company-table table tr .rnd {
    width: 60px;
    text-align: right;
}

.fixedHeader .rnd {
    width:70px !important;
}

.ie9 .fixedHeader .rank {
    width:27px !important;
}

.ie9 .fixedHeader .company {
    width:78px !important;
}

.ie9 .fixedHeader .revenue {
    width:57px !important;
}

.ie9 .company-table table tr .revenue {
    width:56px !important;
}

.ie9 .fixedHeader .rnd {
    width:60px !important;
    text-align: right;
}

.ie9 .company-table table th.tsr {
    width:43px !important;
}

.ie9 .scrollContent td.rnd {
    padding-right: 24px !important;
    /*width: 70px;*/
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .company-table table th.revenue {
        width: 42px !important;
        text-align: right;
    }


    .company-table table tr .rnd {
        text-align: right;
        width:54px;
    }

    .company-table table th.rnd {
        text-align: center;
    }

    .company-table table tr .tsr {
        width: 40px;
    }

}





/* define height and width of scrollable area. Add 16px to width for scrollbar          */
div.tableContainer {
    clear: both;
    height: 236px;
    overflow-y: scroll;
	-webkit-overflow-scrolling: touch;
    width: 356px
    }

/* Reset overflow value to hidden for all non-IE browsers. */
html > body div.tableContainer {
    overflow-y: hidden;
    width: 356px;
    margin-bottom: 12px
    }

html.ie9 > body div.tableContainer {
    overflow-y:scroll;
    overflow-x: hidden;
}

/* define width of table. IE browsers only                 */
div.tableContainer table {
    float: left;
    width: 356px
    }

/* define width of table. Add 16px to width for scrollbar.           */
/* All other non-IE browsers.                                        */
html > body div.tableContainer table {
    width: 356px
    }

/* set table header to a fixed position. WinIE 6.x only                                       */
/* In WinIE 6.x, any element with a position property set to relative and is a child of       */
/* an element that has an overflow property set, the relative value translates into fixed.    */
/* Ex: parent element DIV with a class of tableContainer has an overflow property set to auto */
div.tableContainer thead.fixedHeader tr {
    position: relative
    }

/* set THEAD element to have block level attributes. All other non-IE browsers            */
/* this enables overflow to work on TBODY element. All other non-IE, non-Mozilla browsers */
html > body div.tableContainer thead.fixedHeader tr {
    display: block
    }

/* make the A elements pretty. makes for nice clickable headers                */
div.tableContainer thead.fixedHeader a, div.tableContainer thead.fixedHeader a:link, div.tableContainer thead.fixedHeader a:visited {
    color: #FFF;
    display: block;
    text-decoration: none;
    width: 100%
    }

/* make the A elements pretty. makes for nice clickable headers                */
/* WARNING: swapping the background on hover may cause problems in WinIE 6.x   */
div.tableContainer thead.fixedHeader a:hover {
    color: #FFF;
    display: block;
    text-decoration: underline;
    width: 100%
    }

/* define the table content to be scrollable                                              */
/* set TBODY element to have block level attributes. All other non-IE browsers            */
/* this enables overflow to work on TBODY element. All other non-IE, non-Mozilla browsers */
/* induced side effect is that child TDs no longer accept width: auto                     */
html > body tbody.scrollContent {
    display: block;
    height: 236px;
    overflow-y: scroll;
    width: 100%;
	-webkit-overflow-scrolling: touch;
    }

div.tableContainer tbody.scrollContent tr.alternateRow td {
    background: #EEE;
    border-bottom: none;
    border-left: none;
    border-right: 1px solid #CCC;
    border-top: 1px solid #DDD;
    padding: 2px 3px 3px 4px
    }

/*----------------------------------------------
	Tab Controls
----------------------------------------------*/
.tab_control {
    padding: 0;
    border-bottom: 2px solid #186951;
    display: inline-block;
    width: 356px;
    margin: 9px 0 0 0
    }

.tab_control li {
    list-style-type: none;
    float: left;
    margin-right: 3px;
    font-size: 12px;
    text-transform: uppercase
    }

.tab_control li a {
    padding: 3px 12px 0;
    text-decoration: none;
    text-align: center;
    display: block;
    font-weight: bold;
    background-color: #f3f7f6;
    color: #5e5e5e;
    -webkit-border-top-right-radius: 3px;
    -moz-border-radius-topright: 3px;
    border-top-right-radius: 3px;
    -webkit-border-top-left-radius: 3px;
    -moz-border-radius-topleft: 3px;
    border-top-left-radius: 3px
    }

.tab_control li a:hover {
    color: #186951
    }

.tab_control li.selected a {
    background-color: #186951;
    color: #fff;
    -webkit-border-top-right-radius: 3px;
    -moz-border-radius-topright: 3px;
    border-top-right-radius: 3px;
    -webkit-border-top-left-radius: 3px;
    -moz-border-radius-topleft: 3px;
    border-top-left-radius: 3px
    }

.category-controls .tab {
    width: 356px;
    height: 194px;
    background-color: #f3f7f6;
    overflow-y: scroll;
	-webkit-overflow-scrolling: touch;
    margin-top: -8px;
    display: none
    }

/*For sub tabs*/
.category-controls .tab .tab {
    height: 150px
    }

.category-controls .tab p, .category-controls .tab dl {
    font-size: 13px;
    line-height: 1.25em;
    padding: 0 12px;
    color: #5e5e5e
    }

.category-controls .tab dt {
    font-weight: bold;
    float: left;
    margin-right: 12px;
    width: 86px;
    text-align: right;
    margin-bottom: 6px
    }

.category-controls .tab dd {
    margin-bottom: 6px;
	margin-left:98px;
    }

.category-controls .selected {
    display: block
    }

.category-controls .tab ul {
    padding: 0;
    margin: 12px 0 0
    }

.category-controls .tab ul.category-nav {
    margin-top: 18px
    }

.category-controls .tab ul.category-nav > li {
    list-style-type: none;
    float: left;
    text-align: center;
    margin-bottom: 12px
    }

.category-controls .tab ul.category-nav > li a {
	text-decoration: none;
	color: #5e5e5e;
	font-size: 13px;
	text-align: center;
	width: 100px;
	display: block;
	font-family: "Open Sans Condensed", Arial, Helvetica, sans-serif;
	font-weight: 700;
	margin: 0 auto;
    }

.category-controls .tab ul.category-nav > li a span {
    margin: 0 auto;
    display: block
    }

.category-controls .stories-tab ul.category-nav li {
	width:160px;
}

.category-controls .industries-tab ul.category-nav > li a {
    width: 71px;
    height: 72px;
    line-height: 1.2em
    }


.category-controls .industries-tab,
.category-controls .stories-tab,
.category-controls .notes-tab {
	overflow:hidden;
}

/*.category-controls .tab .tab {
	width:330px;
}
*/

#help-tooltip {
    display: none;
	width: 70px;
	background-color: #fff;
	font-family: "Open Sans Condensed", Arial, Helvetica, sans-serif;
	font-weight:300;
	font-size:13px;
	line-height:1.3em;
	padding:6px 9px 6px;
	border:1px solid #ccc;


}

#help-tooltip p {
	margin:0;
	padding:0;
}

/*----------------------------------------------
	Tooltip
----------------------------------------------*/
#chart-tooltip {
    background-color: #f8f8f8;
    border: 2px solid #444;
    /*	float:left;*/
    position: absolute;
    left: 0;
    top: 0;
    display: none;
    width: 180px;
    color: #5e5e5e;
	z-index:10000;
    }

#chart-tooltip p {
    font-size: 12px;
    line-height: 1.3em;
    padding: 3px 9px;
    font-family: "Open Sans Condensed", Arial, Helvetica, sans-serif;
    font-weight: 700;
    margin: 0;
    border-bottom: 1px solid #999
    }

#chart-tooltip p.name {
    background-color: #444;
    color: #fff;
    font-size: 14px;
    border-bottom: none
    }

#chart-tooltip p.intensity {
    border-bottom: 0
    }

#chart-tooltip .value {
    font-weight: 300;
    float: right;
    padding-left: 12px
    }

#chart-tooltip .name .value {
    float: none;
    font-weight: 700;
    text-align: left;
    padding-left: 0
    }

#chart-tooltip .name .year {
    font-weight: 700;
    float: right;
    }

/*----------------------------------------------
	Embed
----------------------------------------------*/
.embed-tooltip {
    display: none;
    position: absolute;
    top:350px;
    background-color:#808285;
    width:900px;
    margin-left:30px;
}

.embed-tooltip h3 {
    color:#fff;
    font-size:14px;
    margin:6px 12px;
    font-weight: normal;
    line-height: 1.5em;
}

.embed-tooltip a {
    color:#034633;
    text-decoration: none;
}

.embed-tooltip a:hover {
    text-decoration: underline;
}


.embed-tooltip .close-btn {
    float: right;
    background-color: #fff;
    color: #aaa;
    border-radius: 24px;
    margin: 8px 12px;
    font-size: 13px;
    font-weight: bold;
    text-align: center;
    padding: 4px 6px;
    line-height: 1em;
    text-decoration: none;
}

.embed-tooltip input {
    background-color: #fff;
    padding:12px;
    margin:6px 12px 12px;
    font-size:14px;
    display: block;
    width:838px;
}

.embed {
    clear:both;
    float:right;
    text-align: center;
    margin-right:24px;
}

.embed a {
    text-decoration: none;
    line-height: 1.5em;
    font-size: 12px;
    color: #aaaaaa;
    width: 24px;
    height: 24px;
    display: block;
}

.embed a:hover {
    color:#1d6a53;
}
.embed span {
    clear:both;
    display:block;
    font-size:24px;
    font-weight: bold;
}
/*----------------------------------------------
	Icons
----------------------------------------------*/
a .icon-sm, a .icon-med, a .icon-lg {
    background: url(../img/sprites.hires.png) no-repeat;
    -webkit-background-size: 512px 256px;
    background-size: 512px 256px;
    display: block;
    }

a .icon-sm {
    width: 26px;
    height: 26px;
    }

a .icon-med {
    width: 36px;
    height: 36px
    }

a .icon-lg {
    width: 42px;
    height: 42px
    }

a .home-icon {
	background-position:0 0;
	}

a:hover .home-icon, li.selected a .home-icon {
	background-position:-26px 0;
    }

a .help-icon {
	background-position:-52px 0;
    }

a:hover .help-icon, li.selected a .help-icon {
	background-position:-78px 0;
    }

a .all-icon, a .top-icon {
    font-family: "Open Sans Condensed", Arial, Helvetica, sans-serif;
	background-position:-104px 0;
    font-size: 11px;
    font-weight: bold;
    text-transform: uppercase;
    color: #fff;
    text-align: center;
    line-height: 24px
    }

a:hover .all-icon,
a:hover .top-icon,
li.selected a .all-icon,
li.selected a .top-icon {
	background-position:-130px 0;
    }

a .innovators-icon {
	background-position:-0 -101px;
    }

a:hover .innovators-icon, li.selected a .innovators-icon {
	background-position:-42px -101px;
    }

a .new-entrants-icon {
	background-position:-83px -101px;
    }

a:hover .new-entrants-icon, li.selected a .new-entrants-icon {
	background-position:-125px -101px;
    }

a .distrupters-icon {
	background-position:-166px -101px;
    }

a:hover .distrupters-icon, li.selected a .distrupters-icon {
	background-position:-208px -101px;
    }

a .returnees-icon {
	background-position:-249px -101px;
    }

a:hover .returnees-icon, li.selected a .returnees-icon {
	background-position:-291px -101px;
    }

a .automotive-icon {
	background-position:0 -27px;
    }

a:hover .automotive-icon, li.selected a .automotive-icon {
	background-position:-38px -27px;
    }

a .consumer-icon {
	background-position:-76px -27px;
    }

a:hover .consumer-icon, li.selected a .consumer-icon {
	background-position:-114px -27px;
    }

a .energy-icon {
	background-position:-151px -27px;
    }

a:hover .energy-icon, li.selected a .energy-icon {
	background-position:-189px -27px;
    }

a .financial-icon {
	background-position: -227px -27px;
    }

a:hover .financial-icon, li.selected a .financial-icon {
	background-position:-264px -27px;
    }

a .health-icon {
	background-position: -302px -27px;
    }

a:hover .health-icon, li.selected a .health-icon {
	background-position:-340px -27px;
    }

a .industrial-icon {
	background-position:-377px -27px;
    }

a:hover .industrial-icon, li.selected a .industrial-icon {
	background-position:-415px -27px;
    }

a .media-icon {
	background-position:0 -64px;
    }

a:hover .media-icon, li.selected a .media-icon {
	background-position:-38px -64px;
    }

a .tech-icon {
	background-position:-76px -64px;
    }

a:hover .tech-icon, li.selected a .tech-icon {
	background-position:-114px -64px;
    }

a .transportation-icon {
	background-position:-151px -64px;
    }

a:hover .transportation-icon, li.selected a .transportation-icon {
	background-position:-189px -64px;
    }