/**
--Essential Insights Landing Template and Components--
Authors: Harini Kandadai, RamaKrishna Palagummi, Corey Roth
**/

/** Masthead **/
.masthead {
	padding: 20px 0 20px;
	display: block;
	border-bottom: 1px solid #CCCCCC;
	margin: 0 auto 30px;
	width: 100%;
}

.masthead h1 {
	font-weight: 700;
	font-style:  italic;
	font-size:   2.25em;
	line-height: 1.55;
	letter-spacing: -0.0125em;
	margin: 0;
}

.masthead_filter {
	text-align: right;
	padding-top: 12px;
}

.audience-filter_label {
	font-size:   1.1em;
	font-style:  italic;
	color:       #333333;
	font-weight: 400;
	line-height: 34px;
	margin-right:   20px;
	padding-bottom: 0;
}

#audience-filter {
	border: 0 none;
	background: #ebebeb;
	font-size: 1.1em;
}

/** Signup **/
.essential-signup {
	margin: 0 auto 60px;
	text-align: center;
	max-width: 100%;
	padding: 0 5.5%;
	position: relative;
}

.essential-signup_cta {
	font-size: 1.125em;
	font-weight: 300;
	text-align: left;
}

.essential-signup_cta, .essential-signup_form {
	display: inline-block;
	position: relative;
	z-index: 3;
}

.essential-signup_form {
	float: right;
}

.essential-signup_cta .callout {
	font-size: 2.25em;
	letter-spacing: -0.0125em;
	margin: 0 0 5px;
	padding-top: 0;
	line-height: 90%;
}

.essential-signup_cta a {
	font-weight: 700;
	color: #000000;
	white-space: nowrap;
}

.essential-signup_cta a:after {
	content: "\0000a0\00BB";
	color: #e41f35;
}

.essential-signup_cta a:hover {
	color: #e41f35;
	text-decoration: none;
}

.red {
	color: #e41f35;
	white-space: nowrap;
}

#essential-email {
	width: 250px;
	background: #ebebeb;
	border-radius: 4px;
	border: 0 none;
	font-size: 1.1em;
	color: #333333;
	padding: 0 15px;
	height: 34px;
	margin-right: 10px;
}

#essential-email::-webkit-input-placeholder { /* WebKit, Blink, Edge */
    color:    #333333;
}

#essential-email:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
   color:    #333333;
   opacity:  1;
}

#essential-email::-moz-placeholder { /* Mozilla Firefox 19+ */
   color:    #333333;
   opacity:  1;
}

#essential-email:-ms-input-placeholder { /* Internet Explorer 10-11 */
   color:    #333333;
}

.cta-button, a.cta-button {
	background:     #e41f35;
	border-radius:  5px;
	font-weight:    700;
	letter-spacing: 0.025em;
	color:          #FFFFFF;
	font-size:      1.1em;
	border: 0 none;
	padding: 10px 20px;
	display: inline-block;
	transition: all .1s ease;
}

.cta-button:hover, a.cta-button:hover {
	color: #fff;
	background: #b6192a;
	text-decoration: none;
}

.cta-button:after, a.cta-button:after {
	display: none;
}

.visually-hidden {
	position: absolute;
	left: -10000px;
	top: auto;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

/** Article Grid View **/
.article-grid {
	margin-bottom: 60px;
}

/** Base Article Summary **/
.article-summary {
	margin-bottom: 10px;
	width: 100%;
	display: block;
}

.article-summary:after {
	content: "";
	display: table;
	clear: both;
}

.article-summary a {
	color: #333333;
}

.article-summary a:hover {
	text-decoration: none;
	color: #e41f35;
}

.article-summary img {
	max-width: 100%;
	border-radius: 5px;
	margin-bottom: 15px;
}

.article-summary_title {
	font-size:   1.25em;
	font-weight: 700;
	line-height: 1.1;
	margin: 0 0 10px;
}

.article-summary_author {
	font-size:   0.875em;
	font-weight: 400;
	line-height: 1.35em;
	margin-bottom: 10px;
}

.article-summary_author a {
	font-weight: 700;
}

.article-summary_desc {
	line-height: 1.5;
	padding: 0;
	font-weight: 400;
}

p.article-summary_desc.article-summary_charjs {
	font-size: .95em;
}

/** Featured Article **/
.featured-article .article-summary_title {
	font-size: 1.875em;
}

.featured-article .article-summary_author {
	margin-bottom: 20px;
}

/** List Article **/
.article-list {
	margin-right: 20px;
}

.list-article {
	margin-bottom: 30px;
}

.list-article:after {
	content: "";
	display: table;
	clear: both;
}

.list-article a + .article-summary_copy {
	display: inline-block;
	float: left;
	width: calc(100% - 260px);
}

.list-article img {
	width: 240px;
	display: inline-block;
	float: left;
	margin: 0 20px 20px 0;
}

.list-article .article-summary_title {
	font-size: 1.625em;
}

/** Load More **/
.article-list_more {
	text-align: center;
}

.article-list_button {
	background:     #5d5d5d;
	line-height: 2.2em;
	height: auto;
	padding: 4px 20px 0 20px;
}

.article-list_button:hover {
	background: #000000;
}

.article-list_button .plus-ico {
	width: 17px;
	height: 17px;
	line-height: 34px;
}

.plus-ico img {
	max-width: 100%;
	width: 17px;
	height: 17px;
	position: relative;
	top: -4px;
	margin-right: 10px;
}

.loading .plus-ico img {
	animation: spinner 1600ms linear infinite both;
	-webkit-animation: spinner 1600ms linear infinite both;
}

.loading.article-list_button {
	animation: pulsate 1600ms ease infinite both;
}

@keyframes pulsate {
	0%   {background: #333333;}
	50%  {background: #000000;}
	100% {background: #333333;}
}

@keyframes spinner {
	0% {
  		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  		transform:         matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
	}

	10% {
  		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  		transform:         matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
	}
	28.57% {
  		-webkit-transform: matrix3d(0.103, 0.995, 0, 0, -0.995, 0.103, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  		transform:         matrix3d(0.103, 0.995, 0, 0, -0.995, 0.103, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
	}
	42.84% {
  		-webkit-transform: matrix3d(-0.627, 0.779, 0, 0, -0.779, -0.627, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  		transform:         matrix3d(-0.627, 0.779, 0, 0, -0.779, -0.627, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
	}
	57.12% {
  		-webkit-transform: matrix3d(-0.893, 0.45, 0, 0, -0.45, -0.893, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  		transform:         matrix3d(-0.893, 0.45, 0, 0, -0.45, -0.893, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
	}
	71.4% {
  		-webkit-transform: matrix3d(-0.97, 0.241, 0, 0, -0.241, -0.97, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  		transform:         matrix3d(-0.97, 0.241, 0, 0, -0.241, -0.97, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
	}
	90% {
  		-webkit-transform: matrix3d(-1, 0.016, 0, 0, -0.016, -1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  		transform:         matrix3d(-1, 0.016, 0, 0, -0.016, -1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  	}
	100% {
  		-webkit-transform: matrix3d(-1, 0.016, 0, 0, -0.016, -1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  		transform:         matrix3d(-1, 0.016, 0, 0, -0.016, -1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  	}
}

@-webkit-keyframes spinner {
	0% {
  		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  		transform:         matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
	}

	10% {
  		-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  		transform:         matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
	}
	28.57% {
  		-webkit-transform: matrix3d(0.103, 0.995, 0, 0, -0.995, 0.103, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  		transform:         matrix3d(0.103, 0.995, 0, 0, -0.995, 0.103, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
	}
	42.84% {
  		-webkit-transform: matrix3d(-0.627, 0.779, 0, 0, -0.779, -0.627, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  		transform:         matrix3d(-0.627, 0.779, 0, 0, -0.779, -0.627, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
	}
	57.12% {
  		-webkit-transform: matrix3d(-0.893, 0.45, 0, 0, -0.45, -0.893, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  		transform:         matrix3d(-0.893, 0.45, 0, 0, -0.45, -0.893, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
	}
	71.4% {
  		-webkit-transform: matrix3d(-0.97, 0.241, 0, 0, -0.241, -0.97, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  		transform:         matrix3d(-0.97, 0.241, 0, 0, -0.241, -0.97, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
	}
	90% {
  		-webkit-transform: matrix3d(-1, 0.016, 0, 0, -0.016, -1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  		transform:         matrix3d(-1, 0.016, 0, 0, -0.016, -1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  	}
	100% {
  		-webkit-transform: matrix3d(-1, 0.016, 0, 0, -0.016, -1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  		transform:         matrix3d(-1, 0.016, 0, 0, -0.016, -1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  	}
}

.list-button_text {
	position: relative;
	top: -2px;
}

.article-list_remaining {
	font-size:   0.875em;
	font-style:  italic;
	font-weight: 400;
	color:       #1a1a1a;
	line-height: 34px;
	margin-left: 10px;
	display: inline-block;
	position: relative;
	top: -2px;
}

/** Trending Articles **/
.trending-articles {
	margin-bottom: 30px;
}

.trending-articles_title {
	font-size:   1.875em;
	font-weight: 300;
	line-height: 1.1;
	letter-spacing: -0.0125em;
	color:       #e41f35;
	margin-bottom: 25px;
}

/** Trendy Article **/
.trending {
	padding-left: 25px;
	margin-bottom: 10px;
}

.trending .article-summary_title {
	font-size: 1.1875em;
	line-height: 1.25;
	display: inline;
}

.trending .article-summary_counter {
	font-weight: 300;
	margin-right: 10px;
	margin-left: -25px;
	display: inline;
}