/* MD_MediaPlayers.source.css */

/* PLAYER ON */
#ao-main.player_on{
	padding-bottom: 80px;
}

/* PLAY + DURATION BUTTON */
.aos-PlayAudio i {
	max-width:25px;
	margin-right:6px;
}

.aos-PlayAudio i {
	max-width:25px;
	margin-right:6px;
}
.aos-PlayAudio svg {
	margin-right:6px;
}

.aos-PlayAudio > span {
	padding-right:8px;
}

.aos-ArticleTeaser .aos-PlayAudio{
	display: table;
}

.aos-PodcastHeader .aos-PlayAudio i,
.aos-PodcastHeader .aos-PlayAudio svg {
	margin-right:15px;
}

.aos-PlayAudio.playing i,
.aos-PlayAudio:not(.playing) svg,
.aos-PlayAudio.playing .playMessage,
.aos-PlayAudio:not(.playing) .pauseMessage {
	display:none;
}

.aos-PlayIcon.playing:not(.pause):not(.aos-PlayVideo),
.aos-PlayIcon.pause:not(.playing):not(.aos-PlayVideo){
	display:none;
}
.aos-PlayIcon.playing.pause {
	display:block;
}


/* AUDIO PLAYER */
#aos-MainPodcastPlayer {
	position: fixed;
	bottom:0;
	left: 0;
	z-index: 2;
}

#aos-MainPodcastPlayer.single .jp-prev, 
#aos-MainPodcastPlayer.single.jp-next {
    display: none;
}

@media screen and (max-width:799px) { 
	#aos-MainPodcastPlayer .jp-type-single{
		max-width: 100% !important;
	}
}

@media screen and (max-width:479px) { 	
	.aos-PodcastHeader .aos-PlayAudio {
		min-width:100%;
	}
}

/* Playing Icon (Animated) */ 
.leftCol {
    animation: leftLine 1.5s linear infinite;
    /*stroke: #134a68;*/
    stroke-dasharray: 16;
}
.centerCol {
    animation: middleLine 1.5s linear infinite;
    /*stroke: #134a68;*/
    stroke-dasharray: 16;
}
.leftCol {
    animation: rightLine 1.5s linear infinite;
   /* stroke: #134a68;*/
    stroke-dasharray: 16;
}

@keyframes leftLine{
	0%{stroke-dashoffset:14}
	4%{stroke-dashoffset:12}
	8%{stroke-dashoffset:10}
	16%{stroke-dashoffset:8}
	20%{stroke-dashoffset:6}
	24%{stroke-dashoffset:7}
	28%{stroke-dashoffset:8}
	32%{stroke-dashoffset:10}
	36%{stroke-dashoffset:8}
	40%{stroke-dashoffset:8}
	44%{stroke-dashoffset:6}
	48%{stroke-dashoffset:4}
	52%{stroke-dashoffset:2}
	56%{stroke-dashoffset:3}
	60%{stroke-dashoffset:3}
	64%{stroke-dashoffset:4}
	68%{stroke-dashoffset:6}
	72%{stroke-dashoffset:5}
	76%{stroke-dashoffset:4}
	80%{stroke-dashoffset:3}
	84%{stroke-dashoffset:2}
	88%{stroke-dashoffset:6}
	92%{stroke-dashoffset:10}
	96%{stroke-dashoffset:12}
	to{stroke-dashoffset:14}
}
@keyframes middleLine{
	0%{stroke-dashoffset:2}
	4%{stroke-dashoffset:4}
	8%{stroke-dashoffset:6}
	16%{stroke-dashoffset:7}
	20%{stroke-dashoffset:7}
	24%{stroke-dashoffset:7}
	28%{stroke-dashoffset:6}
	32%{stroke-dashoffset:8}
	36%{stroke-dashoffset:4}
	40%{stroke-dashoffset:4}
	44%{stroke-dashoffset:2}
	48%{stroke-dashoffset:6}
	52%{stroke-dashoffset:8}
	56%{stroke-dashoffset:10}
	60%{stroke-dashoffset:9}
	64%{stroke-dashoffset:6}
	68%{stroke-dashoffset:5}
	72%{stroke-dashoffset:4}
	76%{stroke-dashoffset:3}
	80%{stroke-dashoffset:3}
	84%{stroke-dashoffset:4}
	88%{stroke-dashoffset:4}
	92%{stroke-dashoffset:8}
	96%{stroke-dashoffset:6}
	to{stroke-dashoffset:8}
}
@keyframes rightLine{
	0%{stroke-dashoffset:12}
	4%{stroke-dashoffset:8}
	8%{stroke-dashoffset:6}
	16%{stroke-dashoffset:4}
	20%{stroke-dashoffset:2}
	24%{stroke-dashoffset:2}
	28%{stroke-dashoffset:6}
	32%{stroke-dashoffset:8}
	36%{stroke-dashoffset:10}
	40%{stroke-dashoffset:12}
	44%{stroke-dashoffset:14}
	48%{stroke-dashoffset:12}
	52%{stroke-dashoffset:8}
	56%{stroke-dashoffset:6}
	60%{stroke-dashoffset:4}
	64%{stroke-dashoffset:4}
	68%{stroke-dashoffset:5}
	72%{stroke-dashoffset:4}
	76%{stroke-dashoffset:6}
	80%{stroke-dashoffset:4}
	84%{stroke-dashoffset:2}
	88%{stroke-dashoffset:2}
	92%{stroke-dashoffset:4}
	96%{stroke-dashoffset:6}
	to{stroke-dashoffset:8}
}


/* POPUP MINI VIDEO PLAYER*/
#aos-MiniVideoPlayer {
	position: fixed;
	right: 20px;
	bottom: 20px;
	overflow: hidden;
}
#aos-MiniVideoPlayer.active {
	animation: popMiniPlayer .4s linear both;
	resize:horizontal;
	direction: rtl;
	width: 600px;
	min-width: 300px;
	max-width: 1200px;
	z-index: 1111;
}
#aos-MiniVideoPlayer.popout {
	animation: hideMiniPlayer .4s linear both;
}

#aos-MiniVideoPlayer .aos-CloseMiniPlayer,
#aos-MiniVideoPlayer .material-icons.aos-CloseMiniPlayer {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1111;
	padding: 5px;
	background-color: #000;
	color: #FFF;
	font-size: 20px;
	cursor: pointer;
	display: block !important;
	opacity:0;
}
#aos-MiniVideoPlayer:hover .aos-CloseMiniPlayer,
#aos-MiniVideoPlayer:hover .video-js .material-icons.aos-CloseMiniPlayer {	
	animation: popMiniPlayerClose .4s linear both;
}

@media screen and (max-width: 799px){
	#aos-MiniVideoPlayer {
		right: 0;
		bottom: 0;
		width: 100%;
		max-width: 100% !important;
		min-width: 50% !important;
	}
	#aos-MiniVideoPlayer .aos-CloseMiniPlayer,
	.video-js .material-icons.aos-CloseMiniPlayer {
		padding: 1px;		
	}
}

#aos-MiniVideoPlayer:not(.active) .video-js {
	display: none;
}
#aos-MiniVideoPlayer .video-js {
	height:auto;
	position: relative;
}
#aos-MiniVideoPlayer .aos-VideoJS.video-js .vjs-big-play-button {
	line-height: 2em;
	height: 2em;
	width: 2em;
	border: 0;
	border-radius: 0;
}

/* STICKY ARTICLE PLAYER */
.aos-StickyVideoPlayer.sticky::before {
    padding-top: 56.25%;
    display: block;
    content: "";
}

.aos-StickyVideoPlayer.sticky > .smart-embed {
	position: fixed;
	right: 20px;
	bottom: 20px;
	overflow: hidden;
	animation: popMiniPlayer .4s linear both;
	resize:horizontal;
	direction: rtl;
	width: 600px;
	min-width: 300px;
	max-width: 1200px;
	z-index: 1000;
}
@media screen and (max-width: 599px){
	.aos-StickyVideoPlayer.sticky > .smart-embed {
		right: 0;
		bottom: 0;
		width: 100%;
		max-width: 100%;
		min-width: 100%;
		resize:none;
	}
}

.aos-StickyVideoPlayer.popout > .smart-embed {
	animation: hideMiniPlayer .4s linear both;
}

.aos-StickyVideoPlayer .material-icons.aos-CloseStickyVideo {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 20;
	padding: 5px;
	background-color: #000;
	color: #FFF;
	font-size: 20px;
	cursor: pointer;
	display: block !important;
	opacity:0;
}
.aos-StickyVideoPlayer.sticky:hover .material-icons.aos-CloseStickyVideo {	
	animation: popMiniPlayerClose .4s linear both;
}

/* ANIMATIONS */
@keyframes popMiniPlayer {
    0% {
      transform: translateY(100%);
    }
    100% {
      transform: translateY(0);
    }
}
@keyframes hideMiniPlayer {
    0% {
      transform: translateY(0);
    }
    100% {
      transform: translateY(calc(100% + 20px));
    }
}
@keyframes popMiniPlayerClose {
    0% {
      opacity:0;
    }
    100% {
      opacity:1;
    }
}