.nav-gamificacion {margin-top: 0 !important;}
.icono-diamante {height: 20px; width: 20px}
.d-inline-block{display: inline-block;}
.main-background {background-color: #00AED6 !important;}
.contene-perfil-gamificacion {display:flex; flex-direction: row; justify-content: space-between; align-items: center; flex-wrap: wrap;}
.avatar-perfil{margin-top: 0 !important; margin-left: 0 !important;}
.contene-nivel-perfil {display:flex; height: 80px; flex-direction: column; align-items:center; padding: 0px 10px;}
.nivel-gamificacion {margin-top: 10px;}
.icono-actividad {height: 35px; width: 35px; margin-top: auto; margin-bottom: 0;}
.contene-perfil-tienda{gap: 20px; justify-content: space-between !important; align-items: center !important;}
.boton-tienda {height: 40px; flex: 1; max-width: 150px; display: flex; justify-content: space-evenly; align-items: center; color: #396980; font-size: 1.2em; box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 2px 6px 2px; border-radius: 5px;}
.boton-tienda:hover {text-decoration: none;}
.contene-experiencia-perfil {display:flex; height: 80px; flex-grow: 1; padding: 7px 0px;}
.contene-subprogreso{margin-right: 20px; width: 100% !important;}
.barra-experiencia {position:relative; height: 30px; flex-grow: 1; background-color: #F3F3F3; border: solid #CCCCCC 2px;}
.progreso-experiencia {position: relative; height: 100%; width: 100%; transform: scaleX(0); background-color: #00AED6; transform-origin: 0; opacity: 0.7;}
.texto-experiencia {position: absolute; right: 10px; top: 5px; font-size: 1rem;}
.fila-progreso {display: flex; flex-direction: row; justify-content: space-between; align-items: center; gap: 20px;}
.fila-info-progreso {display: flex; flex-direction: row; justify-content: space-between; align-items: center; gap: 10px; margin-bottom: 20px; font-size: 12px; color: #03afd7; padding-left: 10px;}
.fila-info-progreso i {font-size: 25px;}
.fila-nivel {margin-top: 10px; margin-bottom: 10px;}
.titulo-progreso {padding: 10px 10px; width: 120px;}
.barra-atributo-progreso {height: 20px !important; border-radius: 6px;}
.slider-progreso {position:absolute; display: flex; justify-content: center; align-items: center; height: 40px; width: 40px; font-size: 0.8em; border-radius: 100%; transform: translateY(-28px); left: -16px; color: white; box-shadow: rgba(50, 50, 93, 0.375) 0px 2px 5px -1px, rgba(0, 0, 0, 0.45) 0px 1px 3px -1px;}
.fila-energia {border-top: solid 2px #CCCCCC;}
.contenedor-emojis {display: flex; flex: 1; flex-direction: row;}
.feed-emoji {display:flex; width: 25%; height: auto; border-left: solid 2px #F3F3F3; padding: 10px;}
.feed-emoji:last-child{border-right: solid 2px #F3F3F3; padding: 10px;}
.feed-emoji > img {display: flex; margin: auto;}
.icono-mensaje-gamificacion {height: 30px; width: 30px;}

.modal-gamificacion {display: flex; align-items: center; justify-content: center;}
.modal-gamificacion > .modal-dialog {width: auto !important;}
.modal-gamificacion > .modal-dialog > .modal-content > .modal-body { max-height: 80vh; min-width: 200px; max-width: 95vw; overflow:  auto !important;}
/*.modal-gamificacion .modal-header {background-color: #c9c9c9; color: #fff; font-weight: bold;}
.modal-gamificacion .modal-header .close { font-size: 23px; font-weight: bold; color: #fff; filter: alpha(opacity=70); opacity: .7;}
.modal-gamificacion .modal-header .close:hover { font-size: 23px; font-weight: bold; color: #fff; filter: alpha(opacity=100); opacity: 1;}*/
.modal-gamificacion img.thumbnail-modal { border-radius: 50%; border: 0px solid #6a6a6a; padding: 2px;}
.thumbnail-accesorio {height: 150px;}

.caja-cofre {height: 75px; width: 75px; padding: 15px; border: solid #00AED6 3px; border-radius: 50%; overflow: hidden;}
.caja-cofre > img {max-height: 100%;}
.caja-cofre-grande {height: 100px !important; width: 100px !important;}
.fila-incremental {display: flex; gap: 10px; justify-content: center; align-items: center; margin-bottom: 20px;}
.f-wrap {flex-wrap: wrap;}
.cofre-abierto {opacity: 0.5;}
@keyframes anim-escalar-cofre {from{transform: scale(1);} to {transform: scale(1.2);}}
.cofre-anim > img {animation: anim-escalar-cofre linear 0.5s infinite; animation-direction: alternate;}
.contenedor-cofre-grande {display: flex; justify-content: center;}
.contenedor-incremental {padding: 20px 30px;}
.fondo-premio {background-size: 70%; background-position: center; background-repeat: no-repeat; padding: 0 !important;}
.texto-premio {width: 100%; height: 100%; display:flex; justify-content: center; align-items: center; color: #F3F3F3; font-size: 2em; background-color: rgba(0, 0, 0, 0.4);}
.d-oculto {display: none !important;}
/*.tarjeta-tienda {height: 250px; display: flex; flex-direction: column; justify-content: space-evenly; gap: 15px; align-items: center; box-shadow: rgba(50, 50, 93, 0.375) 0px 2px 5px -1px, rgba(0, 0, 0, 0.45) 0px 1px 3px -1px; margin: 10px 15px; padding: 25px 15px; border-radius: 8px;}*/
.tarjeta-tienda {height: 300px; display: flex; flex-direction: column; justify-content: space-evenly; gap: 15px; align-items: center; box-shadow: rgba(50, 50, 93, 0.300) 0px 2px 5px 1px, rgba(0, 0, 0, 0.35) 0px 1px 3px -1px; margin: 10px 15px; padding: 25px 15px; border-radius: 8px;}
.tarjeta-tienda .titulo-tarjeta-tienda {font-weight: bold; font-size: 16px;}
.tarjeta-tienda .precio-tarjeta-tienda {font-size: 16px;}
.sin-decorado {text-decoration: none;}
.sin-decorado:hover, :active{text-decoration: none;}
@keyframes brillar {0% {background-position: right;}}
.anim-gradiente {background-size:300% 100% !important; animation: brillar 2s infinite !important;}
.anim-gradiente-avatar {background: linear-gradient(-45deg,#0000 33%,rgba(255,255,255,0.3) 50%,#0000 66%) #00AED6;}
.anim-gradiente-premio {background: transparent !important;}
.thumbnail-tienda {height: 130px; width: 130px; border-radius: 50%; text-align: center;}
.thumbnail-cuadrado {border-radius: 6px !important; padding: 0 !important; overflow: hidden !important;}
.thumbnail-tienda > img {height: 100%;}
.fila-tienda {display: flex !important; flex-wrap: wrap; justify-content: center; margin-bottom: 15px;}
.busqueda-tienda {display: flex; gap: 5px;}
.info-cartera {border: solid #00AED6 2px; background-color: #CCCCCC; position: fixed; bottom: 5px; left: 5px; padding: 8px; border-radius: 6px;}
.imagen-accesorio {height: 200px !important; width: 200px !important; margin: 20px auto 20px auto; display: flex;}
.icono-diamante-grande {height: 30px; width: 30px;}
.padding-parrafo {padding: 10px 15px;}
.color-alerta {color: #EF7A73;}
.texto-aviso-articulo {position: absolute; color: #F3F3F3; font-size: 0.8em; padding: 5px; border-radius: 4px;}
.texto-stock {background-color: #EF7A73; bottom: 15px; right: 35px;}
.texto-region {background-color: #EF7A73; bottom: 15px; left: 35px;}
.texto-descuento {background-color: #00AED6; top: 15px; left: 35px;}
.texto-online {background-color: #00AED6; top: 15px; right: 35px;}
.tabla-compra-premio {border-spacing: 0 15px;}
.tabla-compra-premio > tr > td{border-bottom: 1px solid #bdbdbd !important;}
.medalla-info {color: white; padding: 5px; border-radius: 4px;}
.medalla-correcto {background-color: #00AED6;}
.medalla-alerta {background-color: #EF7A73;}
.accesorio-tabla {height: 40px !important; width: 40px !important;}
.color-principal {color: #00AED6}
.fila-premio {display: flex; flex-wrap: wrap; gap: 20px; margin-bottom: 20px;}
.columna-premio {display: flex; width: 180px; margin-bottom: 10px; align-items: center; gap: 10px;}
.info-premio {height: 40px; width: 40px; border-radius: 50%; padding: 8px; color: #F3F3F3; display: flex; justify-content: center; align-items: center;}
.info-logro {background-size: 100%; background-repeat: no-repeat; background-position: center; overflow: hidden; padding: 0 !important;}
/* .info-logro-entero{box-shadow: none !important; background-size: 100% !important;} */
.contenedor-recompensa {margin-bottom: 15px; margin-top: 15px;}
.contenedor-recompensa > h2 {margin-bottom: 20px;}
.debug-gamificacion {padding:10px; display:flex; flex-direction: column; bottom: 5px; right: 5px; position:fixed; z-index: 9999999; border: solid black 6px; border-radius: 8px; background-color: #00AED6; color: white; font-weight: bold;}
.btn-compras {position: absolute; top: 15px; right: 20px; height: 50px; width: 50px; display: flex; justify-content: center; align-items: center; padding: 5px !important;}
.imagen-cesta {position:relative; width: 100%; height: 100%;}
#btn-comprar-gemas {cursor: pointer;}
.box-tienda {position: relative !important;}
.globo-secundario {background-color: #56656F !important;}
header .usuario .icono-mensajes .globo-secundario {right:18px !important;}
.info-divisas { display: inline-block; transform: translateY(5px); font-size: 0.7em; margin-left: 8px;}
.info-divisas > img {height: 15px; width: 15px;}
.fila-perfil-progreso {background-color: #fff !important; margin-top: 15px;}
.contene-progreso{display: flex !important; max-width: 100% !important}
.check-visto {height: 30px; width: 30px; margin-left: 8px;}
.margen-top-recompensa {margin-top: -25px !important;}
.margen-bottom-recompensa-matricula {margin-bottom: 25px !important;}
.caja-divisas {display: flex; flex-direction: column; outline: solid #bdbdbd 2px;}
.cabecera-divisas {display: flex; color: #fff; background-color: #bdbdbd ; justify-content: center; padding: 4px; }
.contenedor-divisas {display: flex; flex-direction: column; justify-content: center; align-items: left; width: 75%; margin-left: 25%; gap: 10px; padding-top: 20px; padding-bottom: 20px;}
.imagen-flex {display: flex; margin: auto;}
.contenedor-articulo-compra{max-width: 600px; margin: auto;}
.thumbnail-modal {height: 75px !important; width: 75px !important;}
.modal-pequeno {max-width: 400px;}
.max-width-100 {max-width: 100% !important;}

.btn-trivial {display: flex; margin: 20px auto 20px auto}
.btn-trivial > img {max-width: 100%; height: auto;}
.ranking-info {bottom: 10px !important;}
.ranking-info > span{display: block !important;}
.alinear-vertical {vertical-align:middle !important}
.carousel-video-info-image-trivial {height: 50px !important; width: 50px !important;}

.num_gamificacion {margin-left: 8px; display: inherit;}
#num_gems {font-size: 10.5px; line-height: 20px;}
#num_coins {font-size: 10.5px;line-height: 20px;}


.coins_animation {animation-duration: 2s; animation-name: animacioncoins;}  
@keyframes animacioncoins {
  from {transform: scale(1);color: #414141;} 
  30% {color: #c1ae13;}   
  50% {transform: scale(1.5); color: #c1ae13;}    
  70% {color: #c1ae13;}
  to {transform: scale(1); color: #414141;}
}

.gems_animation {animation-duration: 2s; animation-name: animaciongems;}  
@keyframes animaciongems {
  from {transform: scale(1);color: #414141;} 
  30% {color: #62add3;}   
  50% {transform: scale(1.5); color: #62add3;}    
  70% {color: #62add3;}
  to {transform: scale(1); color: #414141;}
}

/*Nuevo Perfil de usuario */
.contenedor-avatar-perfil {	width: 25%;}
.contenedor-experiencia-perfil {width: 75%;}
.contene-experiencia-perfil { display: flex; height: auto;padding: 2px 0px;}
.texto-experiencia {top: 1px;}
.progreso-experiencia {border-radius: 20px;}
.barra-experiencia {height: 15px; background-color: #E8F9FD;	border: 0px;border-radius: 20px;}
.info-texto-experiencia {width: 100%;font-size: 13px;	color: #b9b9b9;}
.fila-info-progreso {display: flex;flex-direction: row;justify-content: space-between;align-items: center;gap: 10px;margin-bottom: 20px;font-size: 12px;color: #03afd7;padding-left: 10px;}
.fila-info-energia {display: flex;flex-direction: row;justify-content: space-between;align-items: center;gap: 10px;margin-bottom: 20px;font-size: 12px;color: #8cd7c5;padding-left: 10px;}
.feed-emoji {border-left: 0px;}
.feed-emoji:last-child {border-right: 0px;}
.fila-energia {	border-top: 0px;}
.titulo-progreso {text-align: left;	color: #848383;font-size: 12px;}
.titulo-progreso-valor {text-align: right; font-weight: bold; font-size: 12px;}
/*Nuevo Perfil de usuario */

/*media queries*/
@media (max-width: 1500px) 
{
  .contenedor-divisas {width: 80%; margin-left: 20%;} 
}

@media (max-width: 1170px) 
{
  .contenedor-divisas {width: 100%; margin-left: 0%; align-items: center;} 
}

@media(max-width: 576px)
{
  .texto-experiencia {font-size: 0.8rem;}
}