/* General */

body {
	margin: 0;
}
:focus {
	outline: none;
}
.m-top-2 {
	margin-top:2px;
}
.opacity-social {
	width: 100%;
	background-color: black;
	height: 189px;
	position: absolute;
	z-index: -1;
	border-radius: 10px;
	top: 0;
	left: 0;
	transition: all 4s ease;
}
.container {
	color: #ffffff;
	background-color: #424242;
	border-radius:10px;
    font-family: 'Figtree', sans-serif;
	padding: 10px;
	box-sizing:border-box;
	height: 190px;
}
#content {
	height: 190px;
	position: relative;
}
.content-reprod {
	width: 100%
}
/* Logo */
.logo {
	position: absolute;
	right: 17px;
	width: 47px;
	z-index: 2;
}
.logo-xs {
	display: none;
    width: 17px;
}
.audio-title {
	color: #ffffff;
	font-size: 16px;
	font-weight: 600;
	margin-top: 0;
}
.programa-name {
	font-size: 12px;
	opacity: 0.6;
	margin-top: 0px;
}

/* Image Podcast */
.img-podcast img {
	height: 171px;
	width: 171px;
	border-radius:10px;
	margin-right: 12px;
	transform-origin: bottom left;
	transition: all 1s ease;
	box-shadow: 0 8px 8px 0 rgb(0 0 0 / 15%), 0 0 32px 0 rgb(0 0 0 / 35%);
	opacity: 1;
	will-change: transform,box-shadow,border-radius,opacity;
	transform: scale(1) translate3d(0, 0, 0);
}
.img-podcast img:hover {
	opacity: .75;
}
.mini-reproductor .img-podcast img{
	transform: scale(1) translate3d(0, 0, 0);
	transform-origin: bottom left;
}
.info-podcast{
	display: flex;
	flex-direction: column;
	width: 100%;
	justify-content: space-between;
}

/* Controls */
.controles {
	display: flex;
	justify-content: center;
	margin-bottom: 15px;
}
.controles .jp-controls {
	margin:0 17px;
}
.controles .item-control {
	margin: 0 17px;
}

/* Buttons */
.btn-outline {
	border:solid 1px rgb(255 255 255 / 0.5);
	border-radius:15px;
	color: #ffffff;
	font-size: 10px;
	padding: 4px 8px;
	text-decoration: none;
	width: min-content;
	text-align: center;
}
.btn-outline:hover {
	text-decoration: none;
}
.btn-white {
	border:solid 1px rgb(255 255 255 / 0.5);
	border-radius:15px;
	font-size: 10px;
	padding: 4px 8px;
	text-decoration: none;
	text-align: center;
	background-color: #ffffff;
	margin-left: 10px;
}
.btn-white:hover {
	text-decoration: none;
}
.btn-rounded-solid {
	background-color: #ffffff;
	color: black;
	border-radius:50px;
	font-size: 14px;
	padding: 10px 20px;
	display: inline-block;
	border-color: transparent;
	text-decoration: none;
}
.btn-rounded-solid:focus {
	outline: none;
}
.btn-rounded-outline {
	border-radius:50px;
	font-size: 14px;
	padding: 9px 20px;
	display: inline-block;
	border:solid 1px #ffffff;
	color: #ffffff;
	text-decoration: none;
}
.btn-rounded-solid:focus {
	outline: none;
}
.btn-opacity{
	display: inline-block;
	border-radius: 50px;
	background-color: white;
}
.btn-rounded {
	font-size: 14px;
	color: white;
	padding: 10px 20px;
	display: inline-block;
	border-color: transparent;
	text-decoration: none;
}
.box-front-buttons .btn-rounded-solid {
	background: #F45F31;
	color: white;
}

.box-front-buttons{
	position: absolute;
	z-index: 5;
	width: 100%;
	height: 190px;
    font-family: 'Figtree', sans-serif;
	backdrop-filter:blur(4px);
	-webkit-backdrop-filter: blur(4px);
	border-radius:10px;
	display: block;

}
.box-front-buttons > .d-flex{
	display: flex;
	flex-direction: column;
	justify-content: center;
	height: 100%;
}
.bg-blur{
	position: absolute;
	z-index: 4;
	border-radius: 10px;
	width: 100%;
	height: 190px;
	opacity: 0.4;
	background-color: black;
}
.box-front-buttons + .container{
	filter: blur(6px);
}
.box-front-buttons .btn-white{
	margin-left: 0;
}
.box-front-buttons .btn-rounded-solid{
	width:max-content;
	align-self: center;
	margin-bottom: 10px;
	padding:8px 20px;
	font-size: 18px;
}
.box-front-buttons .btn-rounded-disabled{
	align-self: center;
	margin-top: 10px;
	background-color: black;
}

.btn-rounded-disabled {
	color: #a7a7a7;
	font-size: 13px;
	padding: 5px 10px;
	display: inline-block;
	border-radius:50px;
	text-align: center;
	text-decoration: none;
	width:max-content;
}

.visible-sm {
	display: none;
}
.absolute-right {
	position: absolute;
	right: 17px;
}
ul.jp-controls{
	list-style-type: none;
	margin: 0;
	padding: 0;
}
.play {
	background: url(https://static-1.ivoox.com/img/icons/play_white_26.svg) no-repeat transparent;
	content: "";
	height:26px;
	width: 26px;
	display: flex;
	transition: transform .4s ease;
}
.play:hover {
	transform: scale(1.25);
}
.pause{
	background: url(https://static-1.ivoox.com/img/icons/pause_white.svg) no-repeat transparent;
	content: "";
	height:26px;
	width: 26px;
	display: flex;
	transition: transform .4s ease;
}
.pause:hover {
	transform: scale(1.25);
}
.fr-10{
	background: url(https://static-1.ivoox.com/img/icons/FR_10.svg) no-repeat transparent;
	content: "";
	height: 23px;
	width: 21px;
	display: block;
}
.ff-30{
	background: url(https://static-1.ivoox.com/img/icons/FF_30.svg) no-repeat transparent;
	content: "";
	height: 23px;
	width: 21px;
	display: block;
}
.download{background: url(https://static-1.ivoox.com/img/icons/ico_download_2.svg) no-repeat transparent;
	content: "";
	height: 23px;
	width: 21px;
	display: block;}
	.velocidad{
		background: url(https://static-1.ivoox.com/img/icons/ico_velocidad_1.0.svg) no-repeat transparent;
		content: "";
		height: 23px;
		width: 22px;
		display: block;
	}
	.dots{
		background: url(https://static-1.ivoox.com/img/icons/ico_dots.svg) no-repeat transparent;
		content: "";
		height: 4px;
		width: 16px;
		display: block;
	}
	.d-flex{
		display: flex;
	}
	.align-bottom{
		display: flex;
		flex-direction: column;
		align-content: flex-end;
	}

	/*barra reproductor*/
	div.jp-progress{
		background-color:rgba(255, 255, 255, 0.5);
		height: 4px;
		border-radius:3px;
		width: 95%;
		margin-right: 3px;
	}
	div.jp-play-bar{
		background-color:#ffffff;
		height: 4px;
		border-radius:3px;
	}
	.time{
		width: 95%;
		font-size: 11px;
		justify-content: space-between;
	}
	.current-time{
		align-self: flex-start;
	}
	.duration-time{
		align-self: flex-end;
		margin-right: 30px;
	}
	.justify-space-between{
		justify-content: space-between;
	}
	/*Fin barra reproductor*/

	/*GDPR*/
	.gdpr-box{
		position: absolute;
		height: 190px;
		width: 100%;
		left: 0;
		top: 0;
		z-index: 1;
		text-align: center;
	}
	.gdpr-box a{
		color:#ffffff;
	}

	/*Fin GDPR*/

	/*Social box*/
	.social-box{
		position: absolute;
		height: 190px;
		width: 100%;
		top: 0;
		left: 0;
		padding: 10px 10px 0 10px;
		box-sizing: border-box;
		z-index: 1;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		border-radius:10px;
	}
	#jq_redes_sociales{
		padding: 10px;
		border-radius: 10px;
		box-sizing: border-box;
		height: 190px;
	}
	.close{
		position: absolute;
		right: 10px;
		top: 6px;
	}
	.social-box .botones{
		display: flex;
	}
	.social-box .botones a, .social-box .botones div{
		margin-right: 15px;
	}
	/**/
	.hover-title {
    display: inline;
    pointer-events: auto;
    cursor: pointer;
}

.hover-image {
    visibility: hidden;
}

body:not(.mobile) .hover-title:hover + .hover-image {
    visibility: visible;
    pointer-events: none;
    background-color:#2C2C2E;
    border-radius: 8px;
}

.hover-image {
    display: flex;
    position: fixed;
    top: 6px;
    left: calc(100% - 280px);
    /*transform: translate(-50%, -58px);*/
    z-index: 0;
    pointer-events: none;
    flex-direction: column;
    align-items: center;
    justify-content: center;
   	box-shadow: 0 8px 8px 0 rgb(0 0 0 / 15%), 0 0 32px 0 rgb(0 0 0 / 35%);

/* Change width and height to scale images */
    width: 150px;
    height: 150px;
    padding: 10px;
}

.hover-image img {
    max-width: 100% !important;
    max-height: 100% !important;
    width: 100px !important;
    height: auto !important;
    margin-bottom: 0;
    margin-top: 10px;
    border-radius: 8px;
}
.text-gradient {
    background: #F45F31;
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    -webkit-box-decoration-break: clone;
}
.title-tooltip{
	font-weight: 700;
	font-size: 14px;
	margin-bottom:0;
	margin-top:-8px;
}
.qr-code{
	display: block;
    z-index: 0;
    pointer-events: none;
    width: 100px;
    height: 100px;
}
.qr-code img {
    max-width: 100% !important;
    max-height: 100% !important;
    width: 100px !important;
    height: auto !important;
    margin-bottom: 0;
    border-radius: 8px;
}
	/**/
	.tooltip {
		position: relative;
		display: inline-block;
	}

	.tooltip .tooltiptext, .tooltip .tooltiptext-code {
		visibility: hidden;
		position: absolute;
		width: 110px;
		background-color: #000;
		color: #fff;
		font-size: 10px;
		text-align: center;
		padding: 3px 0;
		border-radius: 6px;
		z-index: 1;
		opacity: 0;
		transition: opacity 0.3s;
	}

	.tooltip .tooltiptext::after, .tooltip .tooltiptext-code::after {
		content: "";
		position: absolute;
		top: -40%;
		left: 50%;
		margin-left: -5px;
		border-width: 5px;
		border-style: solid;
		border-color: transparent transparent #000 transparent;
	}

	.tooltip:hover .tooltiptext, .tooltip:hover .tooltiptext-code {
		visibility: visible;
		opacity: 1;
	}
	.tooltip-bottom {
		top: 98%;
		left: 50%;
		margin-left: -55px;
	}
	.cookies{
		margin-top:0;
		opacity: 0.65;
		margin-bottom: 0;
	}
	.cookies a{
		color: #ffffff;
		text-decoration:none;
		font-size: 10px;
	}
	/*Fin social box*/


	/*Reproductor playing*/
	@keyframes slide {
		0% {
			transform: translatex(100%)
		}
		100% {
			transform: translatex(-150%)
		}
	}
	.mini-reproductor{
		height: 49px;
		display: flex;
		flex-direction: row;
		align-content: flex-end;
		position: absolute;
		top: 142px;
		width: 100%;
		left: 0;
		padding: 10px;
		box-sizing: border-box;
		border-radius: 0 0 10px 10px;
		z-index: 2;
	}
	.mini-reproductor .img-podcast img {
		height: 30px;
		width: 30px;
		border-radius: 4px;
		margin-right: 4px;
	}
	.mini-reproductor .audio-title {
		width: 100%;
		font-size: 12px;
		font-weight: normal;
		animation: slide 20s linear infinite;
		white-space: nowrap;
	}
	.mini-reproductor .gradients {
		display: flex;
		margin-top: 6px;
		height: 19px;
		overflow: hidden;
		width: 24%;
	}
	.mini-reproductor .gradient-title-right {
		height: 18px;
		width: 20px;
		width: 29px;
		margin-left: -24px;
		z-index: 1;
	}
	.mini-reproductor .gradient-title-left {
		height: 18px;
		width: 20px;
		margin-right: -11px;
		z-index: 1;
	}
	.mini-reproductor .controles {
		width: 72%;
		justify-content: space-around;
		margin-bottom: 0;
		align-items: center;
		flex-direction: row;
	}
	.mini-reproductor .controles .line-reprod {
		width: 70%;
		margin-top: 10px;
	}
	.mini-reproductor .controles .item-control {
		margin:0 5px;
	}
	.mini-reproductor .controles .jp-controls {
		margin: 0 10px;
	}
	.mini-reproductor .duration-time {
		margin-right:0;
	}

	/*.classname {
		-webkit-animation-name: cssAnimation;
		-webkit-animation-duration:3s;
		-webkit-animation-iteration-count: 1;
		-webkit-animation-timing-function: ease;
		-webkit-animation-fill-mode: forwards;
	}
	@-webkit-keyframes cssAnimation {
		from {
			-webkit-transform: rotate(0deg) scale(1) skew(0deg) translate(100px);
		}
		to {
			-webkit-transform: rotate(0deg) scale(2) skew(0deg) translate(100px);
		}
	}*/
	/*Fin reproductor playing*/

	/*Banner*/
	.banner {
		position: absolute;
		height: 142px;
		z-index: 2;
		width: 100%;
		left: 0;
		box-sizing: border-box;
		padding: 10px 10px 10px 28px;
		display: flex;
		justify-content: space-between;
		top: 0;
		border-radius: 10px 10px 0 0;
		background: rgba(0,0,0, .5);
	}
	.banner .texto {
		width: 45%;
	}
	.banner h1 {
		font-size: 18px;
	}
	/* Mosaico */
	.banner .mosaico {
		display: flex;
		align-items: center;
		justify-content: space-around;
		width: 50%;
		margin-top: 30px;
		max-width: 300px;
		align-self: flex-end;
	}
	.banner .mosaico div .central {
		border-radius:4px;
		z-index: 6;
	}
	.banner .mosaico .centro {
		z-index: 1;
	}
	.banner .mosaico .centro img {
		-webkit-box-shadow: 0px 0px 9px 1px rgba(0,0,0,0.58);
		-moz-box-shadow: 0px 0px 9px 1px rgba(0,0,0,0.58);
		box-shadow: 0px 0px 9px 1px rgba(0,0,0,0.58);
		width: 88px;
	}
	.banner .mosaico .lateral-2, .banner .mosaico .lateral-3 {
		width: auto;
		overflow: hidden;
	}
	.banner .mosaico .lateral-2.right, .banner .mosaico .lateral-3.right {
		display: flex;
		justify-content: flex-end;
		-webkit-box-shadow: 0px 0px 9px 1px rgba(0,0,0,0.58);
		-moz-box-shadow: 0px 0px 9px 1px rgba(0,0,0,0.58);
		box-shadow: 0px 0px 9px 1px rgba(0,0,0,0.58);
	}
	.banner .mosaico .lateral-2.left, .banner .mosaico .lateral-3.left {
		display: flex;
		justify-content: flex-start;
		-webkit-box-shadow: 0px 0px 9px 1px rgba(0,0,0,0.58);
		-moz-box-shadow: 0px 0px 9px 1px rgba(0,0,0,0.58);
		box-shadow: 0px 0px 9px 1px rgba(0,0,0,0.58);
	}
	.banner .mosaico .lateral-2 img.lvl2 {
		border-radius: 4px;
		width: 68px;
	}
	/* .banner .mosaico .lvl2.left, .banner .mosaico .lvl3.left {

	}
	.banner .mosaico .lvl2.right, .banner .mosaico .lvl3.right {

	}
	.banner .mosaico div .lvl2.right {
		z-index: 3;
	}
	.banner .mosaico div .lvl3.right {
		z-index: 2;
	} */
	.banner .mosaico img.lvl3 {
		border-radius: 4px;
		width: 52px;
	}

	/* Banner 2 */
	.banner-2 {
		z-index: 1;
		overflow: hidden;
	}
	.imagen-banner-2 {
		width: 50%;
		justify-content: center;
		display: flex;
	}
	.banner-2 .img-banner {
		width: 216px;
		height: 216px;
		border-radius:10px;
		transform: rotate(24deg);
		margin-top:-20px;
		-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
		-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
		box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
	}
	.banner-2 .imagen {
		overflow: hidden;
		width: 216px;
		height: 216px;
	}
	.qr-banner-2{
		z-index: 1;
	    border-radius: 8px;
	    position: relative;
	    left: 25px;
	    -webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
		-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
		box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
	}
	/* Fin Banner*/

	@media (min-width: 576px){
		.audio-title {
			width: 85%;
		}
		.btn-actions {
			display: flex;
			width: 70%;
			max-width: 520px;
			align-items: center;
		}
		.btn-actions a {
			width: 40%;
			text-align: center;
		}
		.btn-actions a:first-child {
			margin-right: 15px;
		}
		.btn-actions a:last-child {
			margin-left: 5px;
		}
		.mini-reproductor .gradients {
			display: flex;
			margin-top: 6px;
			height: 19px;
			overflow: hidden;
			width: 100%;
			max-width: 190px;
			position: relative;
		}
		.mini-reproductor .audio-title {
			position: absolute;
			width: 100%;
			text-overflow:unset;
			overflow: initial;
		}
		div.jp-progress {
			width: 100%;
			margin-right: 0px;
		}
		.info-podcast {
			padding-top: 20px;
		}
		.audio-title {
			display: block;
			display: -webkit-box;
			max-width: 100%;
			height: auto;
			max-height: 46px;
			-webkit-line-clamp: 2;
			-webkit-box-orient: vertical;
			overflow: hidden;
			text-overflow: ellipsis;
		}
		.mini-reproductor .controles {
			justify-content: flex-end!important;
		}
		.line-reprod .action-dots {
			margin-left: 10px;
		}
		.mini-reproductor .controles .icon-dots {
			margin-left:5px;
		}
		.mini-reproductor .controles .item-control .velocidad {
			margin-top:2px;
		}
		.mini-reproductor .audio-title {
			width: auto!important;
			font-size: 12px;
			font-weight: normal;
			animation: slide 20s linear infinite;
			white-space: nowrap;
			text-overflow: unset;
			overflow: unset;
		}
		@keyframes slide {
			0% {
				transform: translatex(100%)
			}
			100% {
				transform: translatex(-180%)
			}
		}
	}
	@media (max-width:369px){
		.content-podcast{
			flex-direction: column;
			align-items: center;
		}
		.logo{
			display: none;
		}
		.logo-xs{
			display: block;
			position: absolute;
			right: 8px;
			top: 8px;
			z-index: 2;
		}
		.img-podcast img{
			height: 115px;
			width: 115px;
			border-radius: 10px;
			margin-right: 0;
		}
		.audio-title{
			font-size: 12px;
			margin-bottom: 2px;
		}
		.controles{
			justify-content: flex-start;
			margin-bottom: 6px;
			display: flex;
		}
		.align-bottom div.jp-progress {
			background-color: rgba(255, 255, 255, 0.5);
			height: 4px;
			border-radius: 3px;
			width: 82%;
			/* margin-right: 3px; */
			align-self: center;
			margin:0px auto 5px auto;
		}
		.hide-xs, .fr-10, .ff-30, .download, .programa-name{
			display: none;
		}
		.align-bottom .controles .item-control .velocidad{
			display: none;
		}
		.controles .item-control{
			margin: 0;
		}
		.controles .jp-controls{
			margin:0 5px 0 0;
		}
		.icon-dots{
			margin-top:-5px;
		}
		.align-bottom {
			display: flex;
			align-content: flex-end;
			flex-direction: row;
		}
		.align-bottom .current-time{
			margin-left:0px;
		}
		.align-bottom .duration-time{
			margin-right: 0px;
		}
		.line-reprod{
			width: 100%;
		}
		.gradients{
			display: flex;
			margin-bottom: -10px;
			margin-top: 16px;
			margin-left:auto;
			margin-right: auto;
			height: 19px;
			overflow: hidden;
			width: 72%;
			white-space: nowrap;
		}
		.gradient-title-right{
			height: 18px;
			width: 20px;
			width: 29px;
			margin-left: -24px;
			z-index: 1;
		}
		.gradient-title-left{
			height: 18px;
			width: 20px;
			margin-right: -11px;
			z-index: 1;
		}
		.line-reprod{
			align-self: flex-end;
			margin-bottom: 10px;
		}
		.social-box{
			z-index: 2;
		}
		.social-box .botones{
			margin-bottom: 20px;
		}
		.btn-actions{
			width: fit-content;
			display: flex;
			flex-direction: column;
			margin-top: 10px;

		}
		.btn-actions a{
			margin-bottom: 10px;
		}
		.btn-rounded-solid{
			padding: 8px 20px;
			font-size: 13px;
		}
		.btn-actions a.descarga{
			align-self: stretch;
			text-align: center;
			margin-bottom:0;
			font-size: 13px;
			padding: 7px 20px;
		}
		.action-dots{
			margin-left: 13px;
		}
		.mini-opacity{
			background-color: rgb(0 0 0);
			width: 100%;
			height: 49px;
			position: absolute;
			z-index: -1;
			border-radius: 10px;
			left: 0;
			bottom: 0px;
		}
		.mini-reproductor .img-podcast{
			display: none;
		}
		.mini-reproductor {
			flex-direction: column;
			z-index: 2;
			padding: 5px 10px;
		}
		.mini-reproductor .controles{
			width: auto;
			margin-top: 9px;
			align-items: center;
		}
		.mini-reproductor .gradients{
			margin-top: -2px;
			z-index: 3;
			width: 64%;
			justify-content: center;
			flex-direction: row;
			align-self: center;
			margin-left: 71px;
		}
		.mini-reproductor .controles .line-reprod {
			width: 74%;
			margin-top: 0px;
			margin-bottom:0;
		}
		.mini-reproductor .duration-time {
			margin-right: 11px;
		}
		.mini-reproductor .controles .jp-controls {
			margin: 0 10px 0 0;
		}
		.mini-reproductor .controles .item-control {
			display: none;
		}
		.mini-reproductor .controles .item-control:first-of-type {
			display: block!important;
			margin-right: 10px;
			margin-left: 0;
		}
		.banner {
			padding: 10px 28px;
		}
		.banner .mosaico {
			display: none;
		}
		.banner .texto {
			width: 100%;
		}
		.imagen-banner-2 {
			display: none;
		}
		.duration-time {
			align-self: flex-end;
			margin-right: 25px;
		}
		.time {
			width: 100%;
		}
		.box-front-buttons {
			position: absolute;
			z-index: 5;
			width: 100%;
			height: 190px;
            font-family: 'Figtree', sans-serif;
			backdrop-filter:blur(4px);
			-webkit-backdrop-filter: blur(4px);
			border-radius:10px;
			display: block;
		}
		.box-front-buttons > .d-flex{
			display: flex;
			flex-direction: column;
			justify-content: center;
			height: 100%;
		}
		.bg-blur {
			position: absolute;
			z-index: 4;
			border-radius: 10px;
			width: 100%;
			height: 190px;
			opacity: 0.4;
			background-color: black;
		}
		.box-front-buttons + .container{
			filter: blur(6px);
		}
		.box-front-buttons .btn-white{
			margin-left: 0;
		}
		.box-front-buttons .btn-rounded-solid{
			width:max-content;
			align-self: center;
			margin-bottom: 10px;
			font-size: 18px!important;
		}
		.box-front-buttons .btn-rounded-disabled{
			align-self: center;
			margin-top: 10px;
			background-color: black;
		}
		.qr-code{
			display: none;
		}
	}
	@media (min-width:370px) and (max-width:575px){
		.content-podcast{
			display: block;
		}
		.mini-opacity {
			background-color: rgb(0 0 0);
			width: 100%;
			height: 49px;
			position: absolute;
			z-index: -1;
			border-radius: 10px;
			left: 0;
			bottom: 0px;
		}
		.img-podcast img {
			height: 130px;
			width: 130px;
			border-radius:10px;
			float: left;
			-webkit-box-shadow: 0px 0px 9px 1px rgba(0,0,0,0.58);
			-moz-box-shadow: 0px 0px 9px 1px rgba(0,0,0,0.58);
			box-shadow: 0px 0px 9px 1px rgba(0,0,0,0.58);
		}
		.info-podcast{
			display: block;
			padding-top:20px;
		}
		.audio-title{
			display: block;
			display: -webkit-box;
			max-width: 100%;
			height: 43px;
			-webkit-line-clamp: 2;
			-webkit-box-orient: vertical;
			overflow: hidden;
			text-overflow: ellipsis;
			margin-bottom: 12px;
		}
		.hide-sm, .download{
			display: none!important;
		}
		.visible-sm{
			display: block;
		}
		.flex-col-sm{
			flex-direction: column;
		}
		.flex-col-sm .absolute-right{
			position: relative;
			right: 0;
		}
		.align-bottom{
			display: flex;
			flex-direction: row;
			margin-top: 15px;
			width: 100%
		}
		.controles{
			display: flex;
			width: 100%;
		}

		.controles .item-control:nth-child(2){
			order: 1;
			margin: 2px 13px 0 10px;
		}
		.controles .item-control:nth-child(3){
			order: 2;
			margin: 2px 13px 0 10px;
			display: none;
		}
		.controles .jp-controls{
			order:0;
			margin:0;
		}
		.controles .item-control:nth-child(4){
			order: 4;
			/*margin: 0;*/
			margin:0 28px 0 8px;

		}
		.controles .item-control:first-child, .controles .item-control:nth-child(5){
			display:none;
		}
		.controles .line-reprod{
			order: 2;
			width: 100%;
			margin-top:10px;
		}
		div.jp-progress{
			width: 100%;
		}
		.icon-dots{
			position: absolute;
			right: 10px;
		}
		.time{
			width: 100%!important;
		}
		.duration-time{
			margin-right: 13px;
		}

		/*.mini-reproductor .gradients{
			margin-top: -2px;
			z-index: 3;
			width: 82%;
			justify-content: center;
			align-self: center;
		}*/



		.banner{
			overflow: hidden;
		}
		.mosaico{
			margin-right: -50px;
		}
		.banner .texto{
			width: 64%;
		}
		.social-box{
			z-index: 2;
		}
		.social-box .botones{
			margin-bottom: 20px;
		}


	}
	@media (min-width:370px) and (max-width:395px){
		.controles .item-control:nth-child(4){
			margin:0 -2px 0 1px !important;}

		}
		@media (min-width: 370px) and (max-width: 449px){

			.mini-reproductor .controles .item-control:nth-child(2){
				order:0;
				margin: 4px 5px 0 0;
			}
			.mini-reproductor .controles .item-control:nth-child(6){
				margin: 0 28px 0 5px;
				order:4;
			}
			.mini-reproductor .img-podcast{
				display: none;
			}
			.mini-reproductor{
				flex-direction: column;
				z-index: 2;
				padding: 5px 10px;
			}
			.mini-reproductor .controles{
				width: auto;
				margin-top: -4px;
				align-items: center;
				justify-content: space-between;
			}
			.mini-reproductor .controles .jp-controls{
				margin-left: 0;
			}
			.mini-reproductor .gradients{
				margin-top: -2px;
				z-index: 3;
				width: auto;
				/*justify-content: center;*/
				flex-direction: row;
				/*align-self: center;*/
				margin-left: 104px;
				margin-right:64px;
			}
			.mini-reproductor .audio-title {
				width: 72%!important;
				font-size: 12px;
				font-weight: normal;
				animation: slide 20s linear infinite;
				white-space: nowrap;
				text-overflow: unset;
				overflow: unset;
			}
			.mini-reproductor .controles .line-reprod{
				width: 100%;
			}
			.mini-reproductor .controles .item-control:nth-child(3){
				display: block;
				margin: 2px 10px 0 5px;
			}
			.mini-reproductor .duration-time{
				margin-right:10px;
			}
			.mini-reproductor div.jp-progress{
				width: 97%;
			}
			.mini-reproductor .time{
				width: 95%;
			}
			.mini-reproductor .icon-dots{
				margin-top:-5px;
			}
			@keyframes slide {
				0% {
					transform: translatex(100%)
				}
				100% {
					transform: translatex(-200%)
				}
			}
			.box-front-buttons{
				position: absolute;
				z-index: 5;
				width: 100%;
				height: 190px;
                font-family: 'Figtree', sans-serif;
				backdrop-filter:blur(4px);
				-webkit-backdrop-filter: blur(4px);
				border-radius:10px;
				display: block;

			}
			.box-front-buttons > .d-flex{
				display: flex;
				flex-direction: column;
				justify-content: center;
				height: 100%;
			}
			.bg-blur{
				position: absolute;
				z-index: 4;
				border-radius: 10px;
				width: 100%;
				height: 190px;
				opacity: 0.4;
				background-color: black;
			}
			.box-front-buttons + .container{
				filter: blur(6px);
			}
			.box-front-buttons .btn-white{
				margin-left: 0;
			}
			.box-front-buttons .btn-rounded-solid{
				width:max-content;
				align-self: center;
				margin-bottom: 10px;
				padding:8px 20px;
				font-size: 18px;
			}
			.box-front-buttons .btn-rounded-disabled{
				align-self: center;
				margin-top: 10px;
				background-color: black;
			}
			.qr-code{
				display: none;
			}
		}
		@media (min-width:450px) and (max-width:575px){
			.mini-reproductor .controles .item-control:nth-child(2){
				order:0;
				margin: 3px 5px 0 0;
			}
			.mini-reproductor .controles .item-control:nth-child(6){
				display: block;
				order: 4;
				margin: 0 28px 0 5px;
			}
			.mini-reproductor .img-podcast{
				display: none;
			}
			.btn-actions{
				display: flex;
				width: 94%;
				max-width: 520px;
				align-items: center;
			}
			.social-box .botones {
			    margin-bottom: 0px;
			}
			.btn-actions a{
				width: 67%;
				text-align: center;
			}
			.btn-actions a:first-child{
				margin-right: 5px;
			}
			.btn-actions a:last-child{
				margin-left: 5px;
			}
			.qr-code{
				display: flex!important;
			}
			.qr-code img{
			display: flex;
			align-self: center;
			width: 120px!important;
			}
			.mini-reproductor{
				flex-direction: column;
				z-index: 2;
				padding: 5px 10px;
			}
			.mini-reproductor .controles{
				width: auto;
				margin-top: -4px;
				align-items: center;
				justify-content: space-between;
			}
			.mini-reproductor .controles .jp-controls{
				margin-left: 0;
			}
			.mini-reproductor .gradients {
				margin-top: -2px;
				z-index: 3;
				width: auto;
				/* justify-content: center; */
				/* align-self: center; */
				margin-left: 104px !important;
				margin-right: 68px;
			}
			.mini-reproductor .controles .line-reprod{
				width: 100%;
			}
			.mini-reproductor .controles .item-control:nth-child(2){
				display: block;
			}
			.mini-reproductor .controles .item-control:nth-child(3){
				display: block;
				margin: 2px 10px 0 5px;
			}
			.mini-reproductor .duration-time{
				margin-right:0px;
			}
			.mini-reproductor div.jp-progress{
				width: 97%;
			}
			.mini-reproductor .time{
				width: 97%!important;
			}
			.mini-reproductor .icon-dots{
				margin-top:-5px;
			}
			.mini-reproductor .audio-title {
				width: 64%!important;
				font-size: 12px;
				font-weight: normal;
				animation: slide 25s linear infinite;
				white-space: nowrap;
				text-overflow: unset;
				overflow: unset;
			}
			.imagen-banner-2{
				display: flex;
				justify-content: center;
			}
			.banner-2 .img-banner {
				width: 136px;
				height: 136px;
				border-radius: 10px;
				transform: rotate(24deg);
				margin-top:0;
			}
			@keyframes slide {
				0% {
					transform: translatex(100%)
				}
				100% {
					transform: translatex(-150%)
				}
			}
			.hover-image {
			    left: calc(100% - 238px);
			    z-index: 2;

			}
		}

		@media (min-width:370px) and (max-width:449px){
			.btn-actions{
				display: flex;
				width: 100%;
				max-width: 520px;
				align-items: center;
			}
			.btn-actions a{
				width: 90%;
				text-align: center;
			}
			.btn-actions a:first-child{
				margin-right: 5px;
			}
			.btn-actions a:last-child{
				margin-left: 5px;
			}
			.imagen-banner-2{
				display: none;
				justify-content: center;
			}
			.banner-2 .img-banner {
				width: 136px;
				height: 136px;
				border-radius: 10px;
				transform: rotate(24deg);
				margin-top:0;
			}
		}
		@media (min-width:370px) and (max-width:395px){
			.align-bottom{
				/*	position: absolute;*/
			}
			.icon-dots {
				position: absolute;
				right: 10px;
			}
			div.jp-progress {
				background-color: rgba(255, 255, 255, 0.5);
				height: 4px;
				border-radius: 3px;
				width: 95%;
			}
			.controles {
				display: flex;
				width: 92%;
			}
		}
		@media (max-width:250px){
			.logo{
				display: none;
			}
			.logo-xs {
				display: block;
				position: absolute;
				right: 8px;
				top: 8px;
			}

			.banner .mosaico{
				display: none;
			}
			.banner .texto{
				width: 100%;
			}
			.mini-reproductor .img-podcast{
				display: none;
			}
			.mini-reproductor{
				flex-direction: column;
				z-index: 2;
				padding: 5px 10px;
			}
			.mini-reproductor .controles{
				width: auto;
				margin-top: -2px;
				align-items: center;
			}
			.mini-reproductor .gradients{
				z-index: 3;
				width: 82%;
				justify-content: center;
				margin:-2px 17% 0 17%;
			}
			.mini-reproductor .item-control{
				display: none;
			}
			.mini-reproductor .controles .jp-controls {
				margin: 0 5px 0 0;
			}
		}
		@media (min-width: 575px){
			.line-reprod{
				margin-bottom: 0px;
			}
			.time{width: 100%;}
			.duration-time{
				margin-right: 0;
			}
			.mini-reproductor .controles .line-reprod{
				margin-left: 5px;
				margin-right: 5px;
			}
			.align-bottom{
				margin-bottom: 19px;
			}
			.social-box{
				z-index: 2;
			}
			.social-box .botones{
				/*margin-bottom: 20px;*/
			}
		}
		@media (min-width:800px){
			.banner .mosaico{
				margin: 30px auto 0 auto;
			}
		}
		/* force 2 redo style */

@font-face {
    font-family: 'Figtree';
    font-style: normal;
    font-weight: 100, 900;
    font-display: swap;
    src: url('/v2/css/fonts/Figtree/Figtree-Variable.ttf') format('truetype');
}
@font-face {
    font-family: 'Figtree';
    font-style: italic;
    font-weight: 100, 900;
    font-display: swap;
    src: url('/v2/css/fonts/Figtree/Figtree-Italic-Variable.ttf') format('truetype');
}