div.action-bar.sticky {
	position: fixed;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 55px;
	background: #FFF;
	z-index: 9999;
	box-shadow: 0 -1px 5px rgba(50,50,50,0.1);
	transition: 200ms;
}

div.action-bar.sticky .container {
	position: relative;
}

div.action-bar.sticky .ecoscore {
	width: 90px;
	height: 90px;
	line-height: 90px;
	box-shadow: 1px 1px 5px rgba(100,100,100,0.2);
	border-radius: 50%;
	position: absolute;
	z-index: 101;
	top: -70px;
	left: -120px;
	text-align: center;
	background-color: #FFF;
	transition: 1.25s;
}

div.action-bar.sticky .ecoscore > span {
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	background-size: 75% auto;
	background-repeat: no-repeat;
	background-position: 53% center;
	-webkit-filter: grayscale(100%);
	filter: grayscale(100%);
	opacity: 0.3;
}

div.action-bar.sticky .ecoscore > span.score-icon-a {
	background-image: url('images/arrow-part-left.png');
}

div.action-bar.sticky .ecoscore > span.score-icon-b {
	background-image: url('images/arrow-part-right.png');
}

div.action-bar.sticky .ecoscore > span.score-icon-c {
	background-image: url('images/arrow-part-bottom.png');
}

div.action-bar.sticky .ecoscore.rollto.reads {
	transform: rotate(360deg);
	left: 80px;
	transition: 1s;
}

div.action-bar.sticky .ecoscore.rollto.hearts {
	transform: rotate(720deg);
	left: 340px;
	transition: 1.25s;
}

div.action-bar.sticky .ecoscore.rollto.shares {
	transform: rotate(1080deg);
	left: 830px;
	transition: 1.5s;
}

div.action-bar.sticky .ecoscore .score {
	font-weight: bold;
	color: #d75b35;
	text-align: center;
	font-size: 15px;
	display: inline-block;
}

div.action-bar.sticky .ecoscore.rollto .score {
	opacity: 1;
	transition: 0ms;
}

@-webkit-keyframes bounce {
    0%, 100% {
		font-size: 12px;
  	  /*transform: translateY(0);*/
    }
    50% {
		font-size: 24px;
  	  /*transform: translateY(-5px);*/
    }
}
@keyframes bounce {
    0%, 100% {
		font-size: 12px;
  	  /*transform: translateY(0);*/
    }
    50% {
		font-size: 24px;
  	  /*transform: translateY(-5px);*/
    }
}

div.action-bar.sticky .ecoscore.rollto .score.slam {
	opacity: 1;
	transition-timing-function: ease-in;
    -webkit-animation-duration: .45s;
    animation-duration: .45s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
    animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
	
	-webkit-animation-name: bounce;
	animation-name: bounce;
}

.medialink.shortlink {
	white-space: nowrap;
}

div.action-bar.sticky .ecoscore > span.completed {
	-webkit-filter: grayscale(0%);
	filter: grayscale(0%);
	opacity: 1;
}

div.action-bar.sticky .article-meta {
	width: 25%;
	float: left;
	border-right: 1px solid #CCC;
	text-align: center;
	display: flex;
	align-items: center;
	justify-content: center;
	text-decoration: none;
	background: #FFF;
	position: relative;
}

div.action-bar.sticky .article-meta .meta-icon {
	display: inline-block;
	width: auto;
	margin-right: 5px;
	height: 33px;
	margin-top: 0px;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center right;
	flex: 1;
	-webkit-filter: grayscale(100%);
	filter: grayscale(100%);
}

div.action-bar.sticky .article-meta.completed .meta-icon {
	-webkit-filter: none;
	filter: none;
}

div.action-bar.sticky .article-meta .meta-value {
	display: inline-block;
	width: auto;
	height: 60px;
	text-align: left;
	flex: 1;
	font-size: 14px;
	line-height: 60px;
	color: #666;
	transition: 500ms;
}

div.action-bar.sticky .article-meta .progress {
	display: block;
	position: absolute;
    background: linear-gradient(to right, #F9EC31 var(--scroll), transparent 0);
    background-repeat: no-repeat;
	top: 0;
	left: 0;
	width: 0;
	height: 100%;
	background: #FBE995;
	z-index: -1;
	transition: 500ms;
}

div.action-bar.sticky .article-meta .progress.filled {
	width: 100%;
	transition: 500ms;
}

div.action-bar.sticky .article-meta .meta-value.typeout {
	transition: flex 1500ms;
	font-size: 10px;
}

div.action-bar.sticky .article-meta .meta-icon.typeout {
	background-position: center center;
}

div.action-bar.sticky .article-meta.reads .meta-icon {
	height: 45px;
	margin-top: 0px;
	background-image: url('../../images/eco-reads-icon.png');
}
div.action-bar.sticky .article-meta.reads {
	z-index: 99;
} 
div.action-bar.sticky .article-meta.reads .progress {
	width: 3%;
	transition: none;
}

div.action-bar.sticky .article-meta.completed .progress {
	width: 100%;
}

div.action-bar.sticky .article-meta.hearts .meta-icon {
	background-image: url('../../images/heart-on-state-mag.png');
}
div.action-bar.sticky .article-meta.hearts{
	z-index: 98;
} 

div.action-bar.sticky .article-meta.shares .meta-icon {
	background-image: url('../../images/eco-share-icon.png');
}
div.action-bar.sticky .article-meta.shares {
	z-index: 97;
} 

div.action-bar.sticky .article-meta.comments .meta-icon {
	background-image: url('../../images/eco-comments-icon.png');
}
div.action-bar.sticky .article-meta.comments {
	z-index: 96;
} 

/* Share tooltip */
div.action-bar.sticky .article-meta.shares .tooltip {
	transform: scale(0);
    transform-origin: 0% 100%;
	transition: 300ms;
}

div.action-bar.sticky .article-meta.shares .tooltip {
	position: absolute;
	top: -58px;
	left: 25px;
	width: 200px;
	background: #FFF;
	border: 1px solid #AAABAA;
	box-shadow: 0px 1px 4px rgba(0,0,0,0.2);
	padding: 15px;
	font-size: 12px;
	line-height: 17px;
	color: #333;
	z-index: 30;
	text-align: left;
	overflow: hidden;
}

div.action-bar.sticky .article-meta.shares .tooltip > span {
	display: block;
}

div.action-bar.sticky .article-meta.shares .tooltip > span > i {
	display: inline-block;
	width: 15px;
}
div.action-bar.sticky .article-meta.shares .tooltip > span span:hover {
	text-decoration: underline;
}

div.action-bar.sticky .article-meta.shares .tooltip .icon {
	display: block;
	position: absolute;
	bottom: -10px;
	right: -15px;
	opacity: 0.4;
	background: url('../images/gr-share-icon.png') center no-repeat transparent;
	background-size: contain;
	width: 60px;
	height: 60px;
}

div.action-bar.sticky .article-meta.shares .tooltip:before {
	content: " ";
	display: block;
	width: 10px;
	height: 10px;
	position: absolute;
	top: -6px;
	left: 10px;
	border-left: 1px solid #AAABAA;
	border-top: 1px solid #AAABAA;
	background: #FFF;
	transform: rotate(45deg);
}

/* mobile share box */
/*div.action-bar.sticky.open-share .article-meta.shares {
	overflow: hidden;
	bottom: -50px;
	height: 100px;
	padding-top: 60px;
}*/

div.action-bar.sticky .article-meta.shares .share-row-wrapper {
	position: fixed;
	bottom: 65px;
	left: 0;
	width: 100%;
	height: 0px;
	margin: 0;
	overflow: hidden;
	transition: 200ms;
}

div.action-bar.sticky.open-share .article-meta.shares .share-row-wrapper {
	height: 60px;
}

div.action-bar.sticky.open-share {
	padding-top: 50px;
	transition: 200ms;
	bottom: 50px;
}

.score-meta .scorepick .score {
	font-size: 12px;
	font-weight: bold;
	color: #d75b35;
	text-align: center;
	display: inline-block;
	width: 40px;
	height: 40px;
	line-height: 40px;
	background: url('../../images/eco-score-icon.png') center no-repeat transparent;
	background-size: contain;
	padding: 0;
	margin: 0px 10px 15px 0;
	cursor: pointer;
}
.score-meta .editors-pick {
	display: inline-block;
	margin: 0 0 0 10px;
	padding: 0;
	font-size: 12px;
	line-height: 12px;
	position: relative;
	top: 5px;
}
.score-meta .editors-pick .icon {
	display: inline-block;
	width: 24px;
	height: 24px;
	background-image: url('../../images/eco-star-icon.png');
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	margin-right: 2px;
}
.score-meta .editors-pick-copy {
	position: relative;
	top: -6px;
	font-size: 11px;
}
.score-meta .academy-author {
	display: inline-block;
	margin: 0 0 0 10px;
	padding: 0;
	font-size: 11px;
	line-height: 11px;
	position: relative;
	top: -1px;
}
.score-meta .ecosystem-winner {
	display: inline-block;
	margin: 0 0 0 10px;
	padding: 0;
	font-size: 11px;
	line-height: 11px;
	position: relative;
	top: -1px;
}
.score-meta .ecosystem-winner i {
	font-size: 22px;
	color: #F6891E;
	position: relative;
	top: 3px;
	display: inline-block;
	margin-right: 4px;
}
.score-meta .academy-author a {
	color: #333;
	text-decoration: none;
}
.score-meta .academy-author span {
	display: inline-block;
	width: 24px;
	height: 24px;
	background-image: url('/wp-content/themes/elephant_eco/images/academy_member.png');
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	position: relative;
	top: 8px;
}
.score-meta .academy-author span.wyho,
.score-meta .academy-author span.academy-alumni {
	background-image: url('/wp-content/themes/elephant_eco/images/feather.png');
}

.score-meta .ecosystem-winner span {
	display: inline-block;
	width: 24px;
	height: 24px;
	background-image: url('/wp-content/themes/elephant_eco/images/winner-ribbon.png');
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	position: relative;
	top: 8px;
}

/*@media screen and (max-width: 1030px){
	div.action-bar.sticky .article-meta {
		position: absolute;
		width: 100%;
		float: none;
	}
}*/

div.action-bar.sticky .article-meta.boost {
	position: absolute;
	left: -125px;
	bottom: 80px;
	width: 100px;
	text-align: center;
	background: transparent;
	border: 0px;
	height: 115px;
}

div.action-bar.sticky .article-meta.boost .boost-btn {
	display: inline-block;
	height: 30px;
	position: absolute;
	bottom: 0;
	font-size: 13px;
	font-style: italic;
	line-height: 16px;
	color: #FFF;
	font-weight: 300;
	background: #006FBC;
	border: 1px solid #006FBC;
	padding: 5px 0px;
	width: 90px;
	text-align: center;
	transition: 250ms;
}

div.action-bar.sticky .article-meta.boost .boost-btn:hover {
	color: #006FBC;
	background: #FFF;
	text-decoration: none;
	transition: 250ms;
}

div.action-bar.sticky .article-meta.boost .meta-icon {
	height: 45px;
	margin-top: 0px;
	background-image: url('/wp-content/plugins/elephant-products/boost-blue.png');
	background-position: center;
	-webkit-filter: grayscale(0%);
	filter: grayscale(0%);
}

#sticky-bar-catch div.action-bar.sticky .article-meta.boost .boost-btn {
	display: none;
}

@media screen and (min-width: 769px){
	/* only do hover for tooltip on desktop */
	div.action-bar.sticky .article-meta.shares:hover .tooltip {
		transition: 300ms cubic-bezier(0.1,0.1,0,1.8);
		transform: scale(1);
	}
}

@media screen and (max-width: 768px){
	#sticky-bar-catch div.action-bar.sticky .article-meta.boost .meta-icon {
		top: -2px;
	}
	
	div.action-bar.sticky .article-meta.boost {
		display: flex;
		position: relative;
		left: 0px;
		bottom: 0px;
		width: 100px;
		text-align: center;
		background: transparent;
		border: 0px;
		height: 115px;
	}
	div.action-bar.sticky .boost-btn {
		display: none;
	}
	div.action-bar.sticky .article-meta {
		width: 24.25%;
		min-height: 55px;
	}
	div.action-bar.sticky .article-meta.reads {
		display: none;
	}
	div.action-bar.sticky .article-meta.boost:after {
		content: "BOOST";
		position: absolute;
		top: 40px;
		left: 0;
		font-size: 11px;
		color: #999;
		line-height: 11px;
		width: 100%;
		text-align: center;
		font-weight: bold;
	}
	div.action-bar.sticky .article-meta.hearts:after {
		content: "HEART";
		position: absolute;
		top: 40px;
		left: 0;
		font-size: 11px;
		color: #999;
		line-height: 11px;
		width: 100%;
		text-align: center;
		font-weight: bold;
	}
	div.action-bar.sticky .article-meta.shares:after {
		content: "SHARE";
		position: absolute;
		top: 40px;
		left: 0;
		font-size: 11px;
		color: #999;
		line-height: 11px;
		width: 100%;
		text-align: center;
		font-weight: bold;
	}
	div.action-bar.sticky .article-meta.comments:after {
		content: "COMMENT";
		position: absolute;
		top: 40px;
		left: 0;
		font-size: 11px;
		color: #999;
		line-height: 11px;
		width: 100%;
		text-align: center;
		font-weight: bold;
	}
	div.action-bar.sticky .article-meta .meta-value,
	div.action-bar.sticky .article-meta .progress {
		display: none;
	}
	div.action-bar.sticky .article-meta .meta-icon {
		background-position: center 0px;
		background-size: auto 80%;
	}
	div.action-bar.sticky .article-meta.boost .meta-icon {
		background-position: center 5px;
		position: relative;
		top: -30px;
		background-size: auto 66%;
	}
	div.action-bar.sticky .article-meta.reads .meta-icon
	div.action-bar.sticky .article-meta.completed {
		/*display: none;*/
	}
	div.action-bar.sticky.alldone, 
	div.action-bar.sticky.alldone .article-meta .meta-value {
		line-height: 45px;
		height: 45px;
		font-size: 11px;
	}
	div.action-bar.sticky.alldone .article-meta,
	div.action-bar.sticky.alldone .article-meta.completed {
		position: relative;
		display: flex;
		width: 25%;
		float: left;
		border-right: 1px solid rgba(200,200,200,0.25);
	}
	div.action-bar.sticky.alldone .article-meta:last-child {
		border-right: 0px;
	}
	div.action-bar.sticky.alldone .article-meta .meta-icon {
		min-width: 30px;
		height: 26px;
	}
	div.action-bar.sticky.alldone .article-meta.reads .meta-icon {
		height: 30px;
	}
	div.action-bar.sticky .article-meta {
		border-right: 0;
	}
	div.action-bar.sticky .article-meta .meta-value.typeout {
		font-size: 11px;
	}
	.ej-post-meta .meta-author .via a {
		font-size: 11px;
	}
	.ej-post-meta .meta-author .meta-date {
		font-size: 11px;
	}
	div.action-bar.sticky .ecoscore.rollto.reads,
	div.action-bar.sticky .ecoscore.rollto.hearts,
	div.action-bar.sticky .ecoscore.rollto.shares {
		transform: rotate(360deg);
		left: calc(50% - 45px);
		transition: 1s;
	}
}