/*  #Reset & Basics 
================================================== */

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,  footer, header, hgroup, 
menu, nav, section, summary, time, mark, audio, video {
  margin:0;
  padding:0;
  border:0;
  outline:0;
  font-size:100%;
  vertical-align:baseline;
  background:transparent;
}                  
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { 
    display:block;
}
nav ul { list-style:none; }
blockquote, q { quotes:none; }
blockquote:before, blockquote:after,
q:before, q:after { content:''; content:none; }
a { margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent; }
ins { background-color:#ff9; color:#000; text-decoration:none; }
mark { background-color:#ff9; color:#000; font-style:italic; font-weight:bold; }
del { text-decoration: line-through; }
abbr[title], dfn[title] { border-bottom:1px dotted; cursor:help; }
table { border-collapse:collapse; border-spacing:0; }
hr { display:block; height:1px; border:0; border-top:1px solid #ccc; margin:1em 0; padding:0; }
/*input, select { vertical-align:middle; }*/


body { *font-size:small; } 
/*select, input, textarea, button { font:99% sans-serif; }*/
pre, code, kbd, samp { font-family: monospace, sans-serif; }

body, select, input, textarea {   color: #444; }
h1,h2,h3,h4,h5,h6 { font-weight: bold; }
html { overflow-y: scroll; }

nav ul, nav li { margin: 0; } 
small { font-size: 85%; }
strong, th { font-weight: bold; }
td, td img { vertical-align: top; } 
sub { vertical-align: sub; font-size: smaller; }
sup { vertical-align: super; font-size: smaller; }
textarea { overflow: auto; } 
.ie6 legend, .ie7 legend { margin-left: -7px; } 
/*input[type="radio"] { vertical-align: text-bottom; }
input[type="checkbox"] { vertical-align: bottom; }*/
.ie7 input[type="checkbox"] { vertical-align: baseline; }
.ie6 input { vertical-align: text-bottom; }
label, input[type=button], input[type=submit], button { cursor: pointer; }
/*button, input, select, textarea { margin: 0; }*/
input:valid, textarea:valid   {  }
input:invalid, textarea:invalid { border-radius: 1px;  -moz-box-shadow: 0px 0px 5px red; -webkit-box-shadow: 0px 0px 5px red;  box-shadow: 0px 0px 5px red; }
.no-boxshadow input:invalid, 
.no-boxshadow textarea:invalid { background-color: #f0dddd; }

/*::-moz-selection{ background: #FF5E99; color:#fff; text-shadow: none; }
::selection { background:#FF5E99; color:#fff; text-shadow: none; } 
a:link { -webkit-tap-highlight-color: #FF5E99; }*/ 

button {  width: auto; overflow: visible; }
.ie7 img { -ms-interpolation-mode: bicubic; }

.ir { display: block; text-indent: -999em; overflow: hidden; background-repeat: no-repeat; text-align: left; direction: ltr; }
.hidden { display: none; visibility: hidden; } 
.visuallyhidden { position: absolute !important; clip: rect(1px 1px 1px 1px);  clip: rect(1px, 1px, 1px, 1px); }
.invisible { visibility: hidden; }

code, pre {
  padding: 0 3px 2px;
  font-family: Monaco, Andale Mono, Courier New, monospace;
  font-size: 12px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}
code {
  background-color: #fee9cc;
  color: rgba(0, 0, 0, 0.75);
  padding: 1px 3px;
}
pre {
  background-color: #f5f5f5;
  display: block;
  padding: 9px;
  margin: 0 0 18px;
  line-height: 18px;
  font-size: 12px;
  border: 1px solid #ccc;
  border: 1px solid rgba(0, 0, 0, 0.15);
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  white-space: pre;
  white-space: pre-wrap;
  word-wrap: break-word;
}

.pull-right {
	float: right;
	margin-left: 20px;
}


.pull-left {
	float: left;
	margin-right: 20px;
}

.reversed-links a {
	text-decoration: none;
}

.reversed-links a:hover {
	text-decoration: underline;
}

sup,
sub {
	height: 0;
	line-height: 1;
	vertical-align: baseline;
	_vertical-align: bottom;
	position: relative;
	
}

sup {
	bottom: 1ex;
}

sub {
	top: .5ex;
}

/* #Font-Face
================================================== */
/* 	This is the proper syntax for an @font-face file
		Just create a "fonts" folder at the root,
		copy your FontName into code below and remove
		comment brackets */

/*	@font-face {
	    font-family: 'FontName';
	    src: url('../fonts/FontName.eot');
	    src: url('../fonts/FontName.eot?iefix') format('eot'),
	         url('../fonts/FontName.woff') format('woff'),
	         url('../fonts/FontName.ttf') format('truetype'),
	         url('../fonts/FontName.svg#webfontZam02nTh') format('svg');
	    font-weight: normal;
	    font-style: normal; }
*/

/* #Clearfix
================================================== */

.clearfix:after, .section:after, .row:after, 
#mainnav-wrapper:after, #mainnav:after, 
#content-wrapper:after, #centering-content-wrapper:after,
#footer-wrapper:after, #footer:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

.clearfix, .section, .row, 
#mainnav-wrapper, #mainnav,
#content-wrapper, #centering-content-wrapper,
#footer-wrapper, #footer {
	zoom: 1;
}

div.clearer {
	clear: both;
}

/* #Overall Basic Styles
================================================== */

body {
	background: #fff;
	font: 16px/22px Arial, "Helvetica Neue", Helvetica, sans-serif;
	color: #6d6e71;
	-webkit-font-smoothing: antialiased; /* Fix for webkit rendering */
	-webkit-text-size-adjust: 100%;
 }


/* #Links
================================================== */
	a:hover, a:active { outline: none; }
	a, a:active, a:visited { color: #607890; }
	a:hover { color: #036; }


/* #Typography - Base
================================================== */

p, ul, ol, dl, dd, blockquote, pre, code, table, tt { 
	margin: 0 0 20px 0;
	line-height: 22px;
}

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { font-weight: inherit; }

h1, h2, h3, h4, h5, h6 {
	font-weight: normal;
}


/* #Lists
================================================== */
	ul, ol { margin-left: 0; margin-bottom: 30px; }
	ul { list-style: none outside; }
	ol { list-style: decimal; }
	ol, ul.square, ul.circle, ul.disc { margin-left: 30px; }
	ul.square { list-style: square outside; }
	ul.circle { list-style: circle outside; }
	ul.disc { list-style: disc outside; }
	ul ul, ul ol,
	ol ol, ol ul { margin: 0 0 0 25px; }
	ul ul li, ul ol li,
	ol ol li, ol ul li { }
	li { line-height: 22px; }
	li p { line-height: 22px; }

li { 
	margin: .5em 0;
}

ul.default, ul.default ul {
	margin-left: 25px;
	list-style: disc outside none;
}

dt {
	font-weight: bold;
}

/* #Typography
================================================== */

h1 {
	font-size: 30px;
	line-height: 38px;
	color: #46acdd;
	margin: 0 0 20px 0;
	font-style: normal;
}

span.embellish {
	display: block;
	font-size: 25px;
	line-height: 30px;
	text-transform: uppercase;
	color: #46acdd;
	margin-bottom: 10px;
}

.related {
	font-size: 25px;
}

h2 {
	font-size: 26px;
	line-height: 30px;
	color: #46acdd;
	margin: 30px 0 20px 0;
	font-style: normal;
}

div.primary-content h2:first-child {
	margin-top: 0;
}

h1 + h2 {
	margin-top: -10px;
}

h3 {
	font-size: 24px;
	line-height: 30px;
	color: #46acdd;
	margin: 30px 0 10px 0;
	font-style: normal;
}

h3.caption + div.video-container {
	margin-top: 0px;
}

h1 + h3 {
	margin-top: 0px;
}


h3:first-child {
	margin-top: 0;
}

div.row div.primary-content:first-child h3:first-child {
	margin-top: 20px;
}

.secondary-content h3 {
	font-size: 18px;
	line-height: 21px;
}

h4 {
	font-size: 18px;
	line-height: 21px;
	color: #46acdd;
	margin: 30px 0 10px 0;
	font-style: normal;
}

h5 {
	font-size: 16px;
	line-height: 18px;
	color: #46acdd;
	margin: 30px 0 10px 0;
	font-style: normal;
}

h6 {
	font-size: 14px;
	line-height: 18px;
	color: #46acdd;
	margin: 30px 0 10px 0;
	font-style: normal;
}

p + h1, p + h2, p + h3, p + h4, p + h5, p + h6,
dl + h1, dl + h2, dl + h3, dl + h4, dl + h5, dl + h6,
ul + h1, ul + h2, ul + h3, ul + h4, ul + h5, ul + h6,
ol + h1, ol + h2, ol + h3, ol + h4, ol + h5, ol + h6  {
	margin-top: 30px;
}

h1 + table, h2 + table, h3 + table, h4 + table, h5 + table, h6 + table {
	margin-top: 30px;
}

/* #Grids
================================================== */

.full { width: 980px; }
.half { width: 490px; }

.span-one-half { width: 490px; }
.span-one-third { width: 327px; }
.span-two-thirds { width: 653px; }
.span-one-fourth { width: 245px; }
.span-three-fourths { width: 735px; }

.span-two-thirds.last-column { width: 653px; }
.span-two-thirds.first-column { width: 653px; }
.span-one-third.last-column, .with-thirds .last-column { width: 326px; }

.last-column { margin-right: 0 !important; padding-right: 0 !important; }
.first-column { margin-left: 0 !important; padding-left: 0 !important; }

.pulled-right .pulled-column {
	float: right;
}

.pulled-right .primary-column {
	overflow: hidden;
	padding-right: 20px;
}

.pulled-left .primary-column {
	overflow: hidden;
	padding-left: 20px;
}

.pulled-left .pulled-column {
	float: left;
}

.flow-around .primary-column {
	overflow: visible !important;
}

.flow-around .pulled-column { 
	margin-left: 20px;
}

.flow-around.pulled-left .primary-column {
	padding-left: 0;
}

.flow-around.pulled-left .pulled-column {
	margin-left: 0;
	margin-right: 20px;
}

/* #Layout
================================================== */

.container  { position: relative; width: 980px; margin: 0 auto; padding: 0; }
.column, .columns  { float: left; display: inline; }
.row  { margin-bottom: 20px; clear: both; }
.row:first-child { margin-top: 30px; }

.mobile {
	display: none;
}

.section {
	margin-top: 60px;
	margin-bottom: 60px;
}

#header, #centering-content-wrapper, #footer {
	width: 980px;
	margin: 0 auto;
	padding: 0;
}

#centering-content-wrapper {
}

#header-wrapper {
}

#content-wrapper {
	background-image: url(../images/common/triangles.png);
	background-position: -20px 130%;
	/*background-position: bottom left;
	background-attachment: fixed;*/
	background-repeat: no-repeat;
}

#footer-wrapper {
}

#header-wrapper, #footer-wrapper, .facebook-comments {
	background: #f5f5f5 url(../images/common/diag-g.png);
}

/*.facebook-comments {
	min-height: 150px;
	padding: 20px;
	text-align: center;
}*/

.facebook-comments {
	min-height: none;
	padding: 0;
	background: none;
}

.not-staged {
	min-height: none;
	padding: 0;
	background: none;
}

.fb-comments, .fb-comments span, .fb-comments iframe {
    width: 100% !important;
}

#fbcomments, .fb-comments, .fb-comments iframe[style], .fb-comments span {
width: 100% !important;
}

body.home div.facebook-comments {
	width: 950px;
}
	


#header, #footer  {
	padding-top: 1px;
	padding-bottom: 1px;
	min-height: 171px;
}

.js .valign, .js .hero-content h1, .js .hero-content h2 {
	opacity: 0;
}

.hero {
	background: #e6ece5;
}

.hero-slide {
	background-color: #e6ece5;
	/*min-height: 567px;*/
	background-image: url(../images/bg/stock-1.jpg);
	background-position: center;
	background-repeat: no-repeat;
	/*background-size: cover;*/	
}

/* ARTICLE HERO IMAGES */

body.grey-hero .hero-slide {
	background-color: #d4d4d4;
}

body.power-of-consumption .hero-slide {	
	background-image: url(../images/issue-3-vol-5/unleashing-hero-468.jpg);
	background-size: cover;
}

body.who-moved-my-buyer .hero-slide {	
	background-image: url(../images/issue-3-vol-5/moved-hero-468.jpg);
	background-size: cover;
}

body.issue-3-vol-5 .hero-slide {	
	background-image: url(../images/issue-3-vol-5/dawn-hero-468.jpg);
	background-size: cover;
}

body.consumption-revolution .hero-slide {	
	background-image: url(../images/issue-3-vol-5/dawn-2-hero-468.jpg);
	background-size: cover;
}

body.era-of-consumption .hero-slide {	
	background-image: url(../images/issue-3-vol-5/wind-hero-468.jpg);
	background-size: cover;
}

body.ing-direct .hero-slide {	
	background-image: url(../images/issue-3-vol-5/ing-direct-hero-468.jpg);
	background-size: cover;
}


body.grey-hero .hero-content {	
	background: rgba(69, 62, 61, .8);	
}

.ie8 body.grey-hero .hero-content, .ie7  body.grey-hero .hero-content {
	background-color: #453e3d;
}

/* ----- */

.index-head {
	margin-bottom: 30px;
}

.index-head img {
	float: left;
}

.hero .container {
	
}

.hero-content {
	background: rgba(105, 190, 40, .8);	
	color: #fff;
	margin-left: 45%;
	float: right;
	min-height: 400px;
	padding: 30px 30px;
	-moz-box-shadow:  0 -1px 15px rgba(0, 0, 0, 0.1) inset;
	-webkit-box-shadow:  0 -1px 15px rgba(0, 0, 0, 0.1) inset;
	box-shadow:  0 -1px 15px rgba(0, 0, 0, 0.1) inset;
}

.ie8 .hero-content, .ie7 .hero-content {
	background-color: #7fc44b;
}

.hero-content h1 {
	font-size: 44px;
	line-height: 1.1em;
	max-height: 300px;
	margin: 0;
	font-weight: bold;
	color: #fff;
	margin-bottom: .8em;
}


.hero-content.issue {
	min-height: 1px;
}

.hero-content.issue h1 {
	font-size: 28px;
	margin-bottom: 1em;
	line-height: 1.2em;
}

.hero-content.issue h2 {
	font-size: 18px;
	line-height: 1.5em;
}

.hero-content h2 {
	font-size: 30px;
	line-height: 1.3em;
	/*max-height: 100px;*/
	color: #fff;
	margin-bottom: 0;
}

.hero-content h2.smaller {
	font-size: 28px;
}

.columnize .primary-content, .columnize .secondary-content {
	float: left;
}

.primary-content {
	width: 668px;
	padding-right: 10px;
}

.secondary-content {
	width: 282px;
	padding-left: 20px;
	padding-top: 20px;
}

.sidebar-left .primary-content {
	float: right;
	padding-right: 0;
	width: 678px;
}

.sidebar-left .secondary-content {
	padding-left: 0;
	padding-right: 20px;
}

.primary-content .two-wide, .primary-content .three-wide {
	margin-right: -10px;
}

.two-wide .column {
	width: 480px;
	margin-right: 20px;
}

.three-wide .column {
	width: 313px;
	margin-right: 20px;
}

.columnize .primary-content .two-wide .column {
	width: 329px;
	margin-right: 20px;
}

.columnize .primary-content .three-wide .column {
	width: 212px;
	margin-right: 20px;
}

.tiles .column {
	float: left;
	margin-right: 20px;
	margin-bottom: 30px;
	width: 300px;
	height: 300px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	
}

.tiles .tile {
	height: 100%;
	width: 100%;
	position: relative;
	overflow: hidden;
}

.tiles .tile-image img {
	height: 100%;
	width: 100%;
	opacity: .8;

	-webkit-transition: opacity .5s ease;
  -moz-transition: opacity .5s ease;
  -o-transition: opacity .5s ease;
  -ms-transition: opacity .5s ease;
  transition: opacity .5s ease;

}

.tile span.article-title {
	position: absolute;
	bottom: 0;
	left: 0;
	font-size: 18px;
	width: 100%;
	color: #fff;
	height: 100%;
	margin-bottom: -60%;
	background: rgba(0, 0, 0, .4);
	display: block;
	
	-webkit-transition: all .5s ease;
  -moz-transition: all .5s ease;
  -o-transition: all .5s ease;
  -ms-transition: all .5s ease;
  transition: all .5s ease;
	
}

.ie8 .tile span.article-title {
	background: #444;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=75)";
    filter: alpha(opacity=75);
}

.tile span.article-title b {
	font-weight: normal;
	max-height: 85px !important;
	line-height: 1.4em;
	/*overflow: hidden;*/
	display: block;
}

.tile span.article-title i {
	font-style: normal;
	display: block;
	border-top: 1px solid #fff;
	padding-top: 20px;
	line-height: 1.4em;
	margin-top: 20px;
	font-size: .95em;
	opacity: 0;
	
	-webkit-transition: all .5s ease;
  -moz-transition: all .5s ease;
  -o-transition: all .5s ease;
  -ms-transition: all .5s ease;
  transition: all .5s ease;
	
}

.ie8 .tile span.article-title i {
	visibility: hidden;
}

.tile span.pad {
	padding: 20px;
	display: block;
}

.tile a {
	-webkit-tap-highlight-color: rgba(0,0,0,0);
}

.tile a:hover span.article-title { 
	margin-bottom: 0;
	/*background: rgba(0, 0, 0, .4);*/
	background: rgba(70, 172, 221, .8);
}

.ie8 .tile a:hover span.article-title {  
	background: #46acdd;
}

.tile a:hover .tile-image img {
	opacity: 1;
}

.tile a:hover span.article-title i {
	opacity: 1;
	visibility: visible;
}

.tiles .column .clear {
	clear: both;
}

.tiles {
	/*margin-right: -20px;*/
}

.column.share {
	float: right;
	margin-right: 40px;
}

.column.share .tile {
	background: #f4f4f4;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
}

div.pad {
	padding: 20px;
}

.tiles.videos .column {
	height: auto;
}

.tiles.videos.fixed-height .column {
	height: 150px;
}

.tiles.videos p.in-tile {
	position: absolute;
	top: 30px;
	width: 100%;
	text-align: center;
}

.tiles.videos p.in-tile img.play-button {
	width: 40px;
	opacity: .8;
}

.tiles.videos div.captions p {
	display: none;
}

.tiles.videos div.video-container {
	margin-top: 0;
}

.tiles.videos div.captions {
	height: 35px;
	overflow: hidden;
}

p.no-margin {
	margin: 0;
}


.tiles.videos .tile-image img {
	display: block;
	/*opacity: .7;*/
}

.tiles.videos span.article-title {
	height: auto;
	font-size: 14px;
	line-height: 17px;
	margin-bottom: 0;
	background: rgba(0, 0, 0, .4) !important;
}

.ie8 .tiles.videos .tile a:hover span.article-title {  
	background: #000;
}

.tiles.videos span.article-title span.pad {
	padding-top: 5px;
	padding-bottom: 5px;
}	

.tiles.videos span.article-title b {
	background: url(../images/common/play-button.png) 100% 50% no-repeat;
	background-size: 30px 30px;
	padding: 5px 35px 5px 0;
}

.ie8 .tiles.videos span.article-title b, .ie7 .tiles.videos span.article-title b {
	background: none;
}

.tiles.videos span.pad {
	padding: 10px 20px;
}

.tiles.videos span.article-title i {
	display: none;
}

/*
.tiles div.column:nth-child(4n) {
	clear: both;
}
*/

.home #toc {
	display: none;
}

#toc {
	background: #444;
	color: #fff;
	border-bottom: 1px solid #5c5c5c;
	/*margin-bottom: 10px;*/
	
	/*position: fixed;
	top: 0;
	z-index: 100;
	width: 100%;
	*/
}

.fixed {
	position: fixed;
	top: 0;
	z-index: 100;
}

.toc h4 {
	text-transform: uppercase;
	margin: 0 0 15px 0;
	font-size: 14px;
	line-height: 18px;
	color: #fff;
	font-weight: bold;
}

#toc a {
	text-decoration: none;
	color: #fff;
}

#toc.open div.pad {
	height: auto;
}

.toc ul {
	margin-left: 0;
	margin-bottom: 0;
	width: 100%;
}

.toc ul ul {
	margin-left: 20px;
	display: none;
}

.toc ul li {
	font-size: 14px;
	line-height: 16px;
	margin-bottom: 15px;
}

.toc ul li a {
	display: block;
}

.toc ul li {
	list-style-type: none;
}

.current-page {
	padding-top: 12px;
	height: 33px;
	cursor: pointer;
}

.current-page p {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.current-page p i {
	font-size: 18px;
	margin-right: 4px;
}

#toc p {
	font-size: 14px;
	line-height: 16px;
	margin: 0;
}

.mobile .handle {
	float: right;
}

.mobile span.fa-bars {
	position: absolute;
	top: 10px;
	right: 10px;
	font-size: 30px;
	line-height: 30px;
	cursor: pointer;
}

#toc .toc {
	clear: both;
	border-top: 1px solid #5c5c5c;
    padding: 10px 10px 0px 10px;
    margin-left: -10px;
    margin-right: -50px;
}

/* REVERSED top TOC */

#toc {
	background: #f6f6f6;
	color: #444;
	border-bottom: 1px solid #e2dede;
	border-top: 1px solid #e2dede;
}

#toc a {
	color: #444;
}

#toc a:hover {
	text-decoration: underline;
}

#toc div.toc {
	border-top: 1px solid #e2dede;
}

#toc div.pad {
	position: relative;
	padding: 5px 50px 5px 10px;
	height: 40px;
	overflow: hidden;
}

#toc div.toc h4 {
	margin-bottom: 10px;
	padding-left: 20px;
}

#toc div.toc li {
	padding-left: 20px;
}

h4 span.issue {
	text-transform: uppercase;
	font-size: 12px;
	display: block;	
}

.secondary-content h4 span.issue {
	font-weight: normal;
}

div.toc li {
	border-top: 1px solid #e2dede;
	/* 5c5c5c for dark*/
	padding-top: 10px;
	font-size: 13px;
	margin-bottom: 10px;
}

.secondary-content div.toc {
	padding: 0px 16px 0px 16px;
	margin-top: 30px;
	margin-bottom: 30px;
	background: #fff;
}

.secondary-content div.toc h4 {
	border-bottom: 1px solid #dfdfdf;
	color: #fff;
	margin: 0;
}

.secondary-content div.toc h4 a {
	color: #fff;
	display: block;
	padding: 12px 16px 12px 16px;
	margin: 0 -16px 0px -16px;
	background: #4f8daa;
	-webkit-border-top-left-radius: 3px;
-webkit-border-top-right-radius: 3px;
-moz-border-radius-topleft: 3px;
-moz-border-radius-topright: 3px;
border-top-left-radius: 3px;
border-top-right-radius: 3px;
text-decoration: none;
}

.secondary-content div.toc h4 a:hover {
	background: #6aaccb;
	text-decoration: none;
}

.secondary-content div.toc ul li:last-child a {
border-bottom: 1px solid #dfdfdf;
	-webkit-border-bottom-right-radius: 3px;
-webkit-border-bottom-left-radius: 3px;
-moz-border-radius-bottomright: 3px;
-moz-border-radius-bottomleft: 3px;
border-bottom-right-radius: 3px;
border-bottom-left-radius: 3px;
}

.secondary-content div.toc a {
	text-decoration: none;
	color: #444;
}


.secondary-content div.toc a:hover {
	text-decoration: underline;
}

.secondary-content div.toc li:first-child {
	border-top: 0;
	padding-top: 0;
}

.secondary-content div.toc li {
	padding: 0;
	margin: 0 -16px;
}

.secondary-content div.toc li a {
	padding: 10px 16px;
	border: 1px solid #dfdfdf;
	border-top: 0;
	border-bottom: 0;
}

.secondary-content div.toc li a:hover {
	text-decoration: none;
	background: #f6f6f6;
}
	
.secondary-content div.toc:first-child {
	margin-top: -20px;
	margin-bottom: 60px;
}

.secondary-content div.toc {
	margin-top: 20px;
	margin-bottom: 60px;
}

/* toc on states */

body.consumption-revolution li.article-consumption-revolution a,
body.who-moved-my-buyer li.article-who-moved-my-buyer a,
body.case-in-point li.article-case-in-point a,
body.era-of-consumption li.article-era-of-consumption a,
body.case-study li.article-case-study a,
body.power-of-consumption li.article-power-of-consumption a,
body.reinventing-wheel li.article-reinventing-wheel a,
.toc-wrapper ul li.current a {
	font-weight: bold;
	background: #f6f6f6;
}



/* #Other
================================================== */


#header-wrapper p {
	margin: 0;
}

#logo {
	padding: 5px; 
	background: #fff; 
	vertical-align: middle; 
	margin-right: 10px;
	display: block;
}

div.intro {
	text-align: center;
	margin-bottom: 50px;
	padding: 0 20px;
}

div.intro h1 {
	font-size: 48px;
	line-height: 52px;
	color: #666666;
	margin: 0px 0 30px 0;
	font-weight: bold;
}

div.intro h2 {
	font-size: 30px;
	line-height: 36px;
	color: #46acdd;
	margin: 20px 0 20px 0;
	font-style: normal;
}


.two-wide .column img, .three-wide .column img, p.image img {
	max-width: 100%;
}

p.image {
	text-align: center;
}


.sidebar-quote p {
	color: #69be28;
	font-size: 22px;
	line-height: 26px;
	margin: 0;
}

.sidebar-quote span.attribution {
	display: block;
	font-size: 16px;
	line-height: 18px;
	font-weight: bold;
	margin-top: 10px;
}

.sidebar-quote {
	padding-left: 10px;
	border-left: 4px solid #69be28;
	margin: 25px 0;
}

.secondary-content .sidebar-quote {
	margin-top: 30px;
	margin-bottom: 30px;
}

.sidebar-left .pulled-out {
	margin-left: -300px;
}

.pulled-out {
	position: absolute;
	width: 272px;
	margin-left: 698px;
}

p.button + div.sharing, div.bio-callout + div.sharing {
	margin-top: 60px;
}

/*.bio-callout.pulled-out {
	width: 240px;
}*/

.pulled-out img {
	max-width: 100%;
}

div.zoomed {
	position: relative;
}

span.icon-zoom-in {
	position: absolute;
	bottom: 15px;
	right: 8px;
	font-size: 13px;
	cursor: pointer;
	background: #fff;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	padding: 4px;
	opacity: .7;
	color: #222;
}


div.captions {
	margin-top: -22px;
	margin-bottom: 30px;
}

.tiles div.captions {
	margin-bottom: 0;
}

div.captions h4 {
	margin-top: 0;
	margin-bottom: 5px;
	color: #444;
	font-size: 15px;
	line-height: 18px;
}

div.captions p {
	font-size: 13px;
	line-height: 17px;
}

p.caption, h4.caption {
	font-size: 18px;
	line-height: 24px;
	margin-left: 5px;
	margin-right: 5px;
}

h4.caption {
	text-align: center;
	color: #6d6e71;
}	

p.caption a {
	color: #6fbee4;
	text-decoration: none;
}

p.caption a:hover {
	text-decoration: underline;
}

p.button {
	margin: 10px 0;
	padding: 0;
}

p.button a {
	text-decoration: none;
	color: #fff;
	line-height: 18px;
}

p.button a span {
	display: block;
	padding: 20px 20px 20px 60px;
	background-color: #69be28;
	height: 17px;
	-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
}	

p.view-more {
	text-align: center;
}

p.view-more a span {
	text-align: center;
	height: auto;
	padding: 0;
	font-size: 16px;
}

p.button a span em {
	font-style: normal;
	display: block;
	font-size: 13px;
	margin-top: -10px;
}

p.button.print-article {
	display: none;
}

p.button a:hover span {
	background-color: #4e9716;
}

p.view-more a span {
	background-color: #858585;
}

p.view-more a span b  {
	font-style: normal;
	background-image: url(../images/common/view-arrow.png);
	display: inline-block;
	background-repeat: no-repeat;
	background-position: 90% 48%;
	padding: 15px 55px 15px 25px;
}

p.previous a span b  {
	background-image: url(../images/common/view-arrow-prev.png);
	background-position: 10% 48%;
	padding: 15px 25px 15px 55px;
}


p.button.download-file a span {
	background-image: url(../images/common/download-icon.png);
	background-repeat: no-repeat;
	background-position: 21px 50%;
}

p.button.email-this a span {
	background-image: url(../images/common/email-icon.png);
	background-repeat: no-repeat;
	background-position: 18px 50%;
}

p.button.subscribe a span, p.button.newsletter a span {
	background-image: url(../images/common/subscribe-icon.png);
	background-repeat: no-repeat;
	background-position: 18px 50%;
}

p.button.print-article a span {
	background-image: url(../images/common/print-icon.png);
	background-repeat: no-repeat;
	background-position: 20px 50%;
}

p.button.contact-us a span {
	background-image: url(../images/common/contact-icon.png);
	background-repeat: no-repeat;
	background-position: 18px 50%;
}

p.button.email-this a span {
	background-color: #46acdd;
}

p.button.email-this a:hover span {
	background-color: #207ca8;
}

p.button.view-more a:hover span {
	background-color: #6b6b6b;
}

p.button.subscribe a span, p.button.newsletter a span  {
	background-color: #6d6e71;
}

p.button.subscribe a:hover span, p.button.newsletter a:hover span  {
	background-color: #363940;
}

p.button.print-article a span {
	background-color: #6d6e71;
}

p.button.print-article a:hover span {
	background-color: #363940;
}

p.button.contact-us a span {
	background-color: #929292;
}

p.button.contact-us a:hover span {
	background-color: #565656;
}

.hero-buttons p.button {
	text-align: center;
	float: left;
}

.hero-buttons p.button a {
	color: #fafaf1;
}

.hero-buttons p.button a {
}

.hero-buttons p.button a span {
	background-color: rgba(128, 129, 131, 0.4);
	padding: 15px 12px 12px 12px;
	display: block;
	width: 200px;
	height: auto;
	margin-right: 10px;
	line-height: 15px;
	font-size: 14px;
	text-transform: uppercase;
	font-weight: bold;
}

.ie8 .hero-buttons p.button a span {
	background-color: #808183;
}

.hero-buttons p.button {
	line-height: 15px;
}

.hero-buttons p.button a i {
	font-style: normal;
	font-size: 1.6em;
	margin-right: 10px;
	margin-top: -5px;
	vertical-align: middle;
	display: inline-block;
}

.hero-buttons p.button a b {
	font-style: normal;
	margin-top: -4px;
	display: inline-block;
	
}

p.download-to {
	margin-bottom: 5px;
	font-weight: bold;
}

.hero-buttons {
	margin-top: 30px;
}

.hero-buttons p.button a:hover span {
	background-color: rgba(128, 129, 131, 0.8);
}

.addthis_toolbox {
	margin-bottom: 30px;
	min-height: 32px;
}

.addthis_toolbox p span {
	float: left;
	margin-right: 10px;
	
}

.num-shares {
	/*color: #6d6e71 !important;*/
	color: #808183 !important;
	font-size: 18px;
}

.share-counter {
	/*color: #6d6e71 !important;*/
	color: #808183 !important;
	font-size: 48px;
	display: inline-block !important;
}

.video-container {
    position: relative;
    padding-bottom: 56.25%;
    /*padding-top: 30px;*/
    padding-top: 0px; 
    height: 0; 
    overflow: hidden;
    margin: 30px 0;
}

div.row .two-wide .video-container, div.row .three-wide .video-container {
	margin-top: 0;
}


.button-wrapper {
	position: relative;
	/*margin-top: -30px;*/
	overflow: hidden;
}

.video-container iframe,
.video-container object,
.video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;  
}

.video-container img.poster-image {
	max-width: 100%;
	cursor: pointer;
	-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
}

.video-container img {
	cursor: pointer;

}

.play-button {
	z-index: 50;
	cursor: pointer;
	opacity: .8;
}

.pb {
	background: url(../images/common/play-button.png);
}

.tiles .play-button {
	width: 60px;
}

.button-wrapper:hover .play-button {
	opacity: 1;
}

.secondary-content .play-button {
	width: 60px;
}

.columnize .primary-content .play-button {
	width: 100px;
}


.video-container p.center {
	margin: 0;
	padding: 0;
	text-align: center;
	position: absolute;
	width: 100%;	
	cursor: pointer;
}

p.mini-intro {
	color: #6d6e71;
	font-weight: bold;
	font-size: 22px;
	line-height: 26px;
}

div.bio-callout {
	padding: 16px;
	margin-top: 30px;
	margin-bottom: 30px;
	background: #f6f6f6;
	-webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  
}

div.bio-callout:first-child {
	margin-top: -20px;
	margin-bottom: 50px;
}

div.bio {
	color: #6d6e71;
}

div.bio-callout.bordered {
	border: 1px solid #dfdfdf;
	
}

.media {
	float: left;
	margin-right: 10px;
}

div.bio .media img {
	-webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}

.content {
	overflow: hidden;
}

div.wrapped div.content {
	overflow: visible;
}

div.bio-content {
	clear: both;
	margin-top: 10px;
}

div.wrapped div.bio-content {
	clear: none;
}

div.bio div.bio-content p, div.bio-callout.wrapped div.bio-content p {
	font-size: 13px;
	line-height: 18px;
}

div.wrapped div.media p {
	margin-bottom: 0;
}

div.bio p {
	margin: 0 0 5px 0;
	font-size: 14px;
	line-height: 20px;
}

div.bio-callout div.content p {
	font-size: 14px;
	line-height: 18px;
}

div.bio h4, div.bio-callout h4 {
	margin: 0 0 15px 0;
	font-size: 18px;
	color: #444;
	font-weight: bold;
}

div.bio div.content h4  {
	margin-bottom: 5px;
}

div.bio div.content p.byline {
	border-bottom: 1px solid #dbdbdd;
	padding-bottom: 5px;
	margin-bottom: 5px;
}

div.bio-content p.button:first-child {
	
}

div.bio span.name {
	font-size: 15px;
	line-height: 17px;
	margin-bottom: 4px;
	display: block;
}

div.bio span.title {
	font-size: 11px;
	line-height: 15px;
	display: block;
}

div.bio span.location {
	font-size: 11px;
	line-height: 15px;
	display: block;
}

p.chicklets {
	padding-top: 5px;
	float: left;
}

p.chicklets a {
	color: #fff;
	font-size: 16px;
	display: block;
	float: left;
	background: #69be28;
	padding: 3px;
	-webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  text-decoration: none;
  margin-right: 5px;
}

p.chicklets a:hover {
	background: #4f9d14;
}

.customSelect { 
	padding: 12px 40px 12px 20px;
	width: 150px;
	background: rgba(0, 0, 0, 0.4) url(../images/common/down-arrow.png) 90% 50% no-repeat;
	height: 17px;
	-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
color: #c4c3c1;
font-size: 15px;
line-height: 15px;
}

.ie8 .customSelect { 
	background: #000 url(../images/common/down-arrow.png) 90% 50% no-repeat;
}

.issue-select {
	margin-top: 10px;
	float: right;
}

/* remove when more than one issue! */
.issue-select { display: none; }

.issue-select .hasCustomSelect {
	margin: 0;
}

.issue-select .hasCustomSelect option {
	/*padding: 3px;*/
}

.ie8 .customSelect {
	background-color: #000000;
}

.customSelect.customSelectHover {
	background-color: rgba(0, 0, 0, 0.8);
	cursor: pointer;
}

.customSelect.customSelectOpen {
/* Styles for when the select box is open */
}

.customSelect.customSelectFocus {
/* Styles for when the select box is in focus */
}

.customSelect.customSelectDisabledOption {
/* Styles for when the selected item is a disabled one */
}

.customSelect.customSelectDisabled {
/* Styles for when the select box itself is disabled */
}

.customSelectInner {
/* You can style the inner box too */
}




/* #Nav
================================================== */

.usernav, .utilnav, .extranav, .site-search, .mainnav {
	margin: 0;
	padding: 0;
}

/* #Inline Labels
================================================== */
.label {
  padding: 3px 3px 2px;
 font-size: 11px;
 line-height: 18px;
  font-weight: bold;
  color: #ffffff;
  text-transform: uppercase;
  white-space: nowrap;
  background-color: #bfbfbf;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  text-shadow: none;
}
.label.important {
  background-color: #c43c35;
}
.label.warning {
  background-color: #f89406;
}
.label.success {
  background-color: #46a546;
}
.label.notice {
  background-color: #62cffc;
}



/* #Tables
================================================== */

table {
  width: 100%;
  margin-bottom: 18px;
  padding: 0;
  border-collapse: collapse;
}
table th, table td {
  padding: 10px 10px 9px;
  line-height: 18px;
  text-align: left;
}
table th {
  padding-top: 9px;
  font-weight: bold;
  vertical-align: middle;
}
table td {
  vertical-align: top;
  border-top: 1px solid #ddd;
}
table tbody th {
  border-top: 1px solid #ddd;
  vertical-align: top;
}
.condensed-table th, .condensed-table td {
  padding: 5px 5px 4px;
}
.bordered-table {
  border: 1px solid #ddd;
  border-collapse: separate;
  *border-collapse: collapse;
  /* IE7, collapse table to remove spacing */

  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}
.bordered-table th + th, .bordered-table td + td, .bordered-table th + td {
  border-left: 1px solid #ddd;
}
.bordered-table thead tr:first-child th:first-child, .bordered-table tbody tr:first-child td:first-child {
  -webkit-border-radius: 4px 0 0 0;
  -moz-border-radius: 4px 0 0 0;
  border-radius: 4px 0 0 0;
}
.bordered-table thead tr:first-child th:last-child, .bordered-table tbody tr:first-child td:last-child {
  -webkit-border-radius: 0 4px 0 0;
  -moz-border-radius: 0 4px 0 0;
  border-radius: 0 4px 0 0;
}
.bordered-table tbody tr:last-child td:first-child {
  -webkit-border-radius: 0 0 0 4px;
  -moz-border-radius: 0 0 0 4px;
  border-radius: 0 0 0 4px;
}
.bordered-table tbody tr:last-child td:last-child {
  -webkit-border-radius: 0 0 4px 0;
  -moz-border-radius: 0 0 4px 0;
  border-radius: 0 0 4px 0;
}

.zebra-striped tbody tr:nth-child(odd) td, .zebra-striped tbody tr:nth-child(odd) th {
  background-color: #f9f9f9;
}
.zebra-striped tbody tr:hover td, .zebra-striped tbody tr:hover th {
  background-color: #f5f5f5;
}

/* #Forms
================================================== */

	form {
		margin-bottom: 18px; }
	fieldset {
		margin-bottom: 18px; }
	input[type="text"],
	input[type="password"],
	input[type="email"],
	textarea,
	select {
		border: 1px solid #ccc;
		padding: 6px 4px;
		outline: none;
		-moz-border-radius: 2px;
		-webkit-border-radius: 2px;
		border-radius: 2px;
		font: 13px "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
		color: #777;
		margin: 0;
		width: 210px;
		max-width: 100%;
		display: block;
		margin-bottom: 18px;
		background: #fff; }
	select {
		padding: 0; }
	input[type="text"]:focus,
	input[type="password"]:focus,
	input[type="email"]:focus,
	textarea:focus {
		border: 1px solid #aaa;
 		color: #444;
 		-moz-box-shadow: 0 0 3px rgba(0,0,0,.2);
		-webkit-box-shadow: 0 0 3px rgba(0,0,0,.2);
		box-shadow:  0 0 3px rgba(0,0,0,.2); }
	textarea {
		min-height: 60px; }
	label,
	legend {
		display: block;
		font-weight: bold;
		font-size: 13px;  }
	select {
		width: 220px; }
	input[type="checkbox"] {
		display: inline; }
	label span,
	legend span {
		font-weight: normal;
		font-size: 13px;
		line-height: 18px;
		color: #444; }


/* #Print
================================================== */

@media print {
  * { background: transparent !important; color: #444 !important; text-shadow: none !important; }
  a, a:visited { color: #444 !important; text-decoration: underline; }
  a:after { content: " (" attr(href) ")"; } 
  abbr:after { content: " (" attr(title) ")"; }
  .ir a:after { content: ""; }  
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  thead { display: table-header-group; }  
  tr, img { page-break-inside: avoid; }
  @page { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3{ page-break-after: avoid; }
}