.credit-quanty{color:#F53803;--sz:20px;font-size:var(--sz);display:flex;gap:6px;align-items:center;}
.credit-quanty.z1{--sz:18px;}
.credit-quanty.z1>span{font-weight:normal;}
.credit-quanty>span{font-weight:bold;}
.credit-quanty>img{height:calc(var(--sz) - var(--sz) / 5);}
.credit-balance{display:flex;gap:10px;align-items:center;font-size:24px;margin-bottom:20px;}
#credit-progress{--co:#006599;border:1px solid var(--co);-webkit-border-radius:10px;border-radius:10px;padding:10px;margin-top:10px;}
#credit-progress:empty{display:none;}
#credit-progress>.credit-progress{margin:0;}
#credit-progress.academy,#credit-progress.academy>.credit-progress{--co:#1FB69B;}
#credit-progress.academy{background:#1fb69b10;}
#credit-progress.audio,#credit-progress.audio>.credit-progress{--co:#FFAE00;}
#credit-progress.audio{background:#ffae0010;}
#credit-progress.audio.student{display:none;}
.credit-progress{position:relative;display:grid;margin:20px 0;--co:#006599;}
.credit-progress>h3{display:flex;margin:0;padding:0;font-size:1em;align-items:end;}
.credit-progress>h3>b{display:flex;font-weight:normal;align-items:center;gap:6px;}
.credit-progress>h3>b .credit-quanty{font-size:18px;}
.credit-progress>h3>b .credit-quanty>img{height:14px;}
.credit-progress>h3>span{color:#F53803;font-size:18px;font-weight:bold;-webkit-flex-grow:1;flex-grow:1;text-align:right;}
.credit-progress>p{background:#DDD;margin:4px 0;-webkit-border-radius:3px;border-radius:3px;}
.credit-progress>p>b{display:block;height:5px;background:var(--co);-webkit-border-radius:3px;border-radius:3px;position:relative;}
.credit-progress>p>b:after{content:'';display:block;width:9px;height:9px;-webkit-border-radius:50%;border-radius:50%;position:absolute;border:2px solid #FFF;right:-6px;top:-4px;background:var(--co);-webkit-box-shadow:0 0 5px rgba(0,0,0,0.3);box-shadow:0 0 5px rgba(0,0,0,0.3);}
.credit-progress>div{display:flex;-webkit-justify-content:space-between;justify-content:space-between;font-size:12px;font-family:Monospace;color:#000;}
img.new-credit{position:absolute;z-index:99999;-webkit-transform-origin:center center;transform-origin:center center;}
.your-rank{display:flex;gap:10px;align-items:end;position:absolute;right:0;bottom:0;white-space:nowrap;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));min-width:450px;-webkit-justify-content:end;justify-content:end;}
.your-rank>a{position:relative;font-size:9px !important;color:#616161;-webkit-border-radius:10px;border-radius:10px;background:#FFF;padding:5px;-webkit-box-shadow:0 -5px 5px rgba(0,0,0,0.1);box-shadow:0 -5px 5px rgba(0,0,0,0.1);}
.your-rank>a>span{display:block;text-align:center;margin-bottom:10px;}
.your-rank>a>span>img{display:block;margin:-5px auto;height:24px;}
.your-rank>a>span>b{font-weight:normal;}
.your-rank>a>span>span{font-size:14px !important;font-weight:bold;display:block;color:var(--co) !important;line-height:14px;}
.your-rank>a>div{display:flex;align-items:center;gap:10px;-webkit-justify-content:center;justify-content:center;}
.your-rank>a>div>div{text-align:center;padding:0;}
.your-rank>a>div>div>b{display:block;font-size:20px;font-weight:normal;color:#1D1D1D;}
.your-rank>a>div>div>button{display:block;background:var(--co);color:#FFF !important;-webkit-border-radius:20px;border-radius:20px;line-height:28px;height:30px;padding:0 10px;font-size:12px !important;}
.credit-confirm{position:relative;--pad:20px;}
.credit-confirm>div{position:relative;padding:0;margin:0;}
.credit-confirm>div:first-child>img{display:block;}
.credit-confirm>div:last-child>h3{margin:10px 0;font-size:22px;padding:calc(var(--pad) / 2) var(--pad);}
.credit-confirm>div:last-child>div.balance{float:right;background:var(--bg);border:1px solid var(--co);-webkit-border-radius:5px;border-radius:5px;padding:5px 10px;}
.credit-confirm>div:last-child>div.balance>p{margin:0;}
.credit-confirm>div:last-child>div.balance>p>span.credit-quanty{-webkit-justify-content:end;justify-content:end;}
.credit-confirm>div:last-child>div.price-balance{display:flex;margin:0 var(--pad);align-items:center;-webkit-justify-content:space-between;justify-content:space-between;gap:var(--pad);}
.credit-confirm>div:last-child>div.price-balance>div{display:flex;gap:5px;align-items:center;white-space:nowrap;border:1px solid var(--co);background:var(--bg);padding:5px 10px;-webkit-border-radius:5px;border-radius:5px;}
.credit-confirm>div:last-child>div.confirm-body{padding:calc(var(--pad) / 2) var(--pad);}
.credit-confirm>div:last-child>div.confirm-body>p>img{max-width:40px;display:block;margin-bottom:5px;}
.credit-confirm>div:last-child>div.confirm-body span.credit-quanty{display:inline-flex;vertical-align:middle;}
.credit-confirm>div:last-child>div.btns{padding:8px;text-align:center;border-top:1px solid var(--co);background:var(--bg);margin:0;display:flex;gap:10px;align-items:center;-webkit-justify-content:center;justify-content:center;-webkit-flex-wrap:wrap;flex-wrap:wrap;}
.credit-confirm>div:last-child>div.btns>a,.credit-confirm>div:last-child>div.btns>button{-webkit-border-radius:5px;border-radius:5px;height:30px;cursor:pointer;-webkit-box-sizing:border-box;box-sizing:border-box;}
.credit-confirm>div:last-child>div.btns>a{background:url("https://lib.zangia.mn/img/academy/logo.svg") center center no-repeat #FFF;width:140px;border:1px solid var(--co);-webkit-transition:all 200ms ease-in-out;transition:all 200ms ease-in-out;}
.credit-confirm>div:last-child>div.btns>a.audio{background-image:url("https://lib.zangia.mn/img/audio/logo.svg");}
.credit-confirm>div:last-child>div.btns>a:hover{-webkit-box-shadow:3px 3px 5px rgba(0,0,0,0.2);box-shadow:3px 3px 5px rgba(0,0,0,0.2);}
.credit-confirm>div:last-child>div.btns>button{background:var(--co);color:#FFF;padding:0 15px;border-color:var(--co) !important;}
.credit-confirm>div:last-child>div.btns>button.cancel{border:1px solid var(--co);background:#FFF;color:var(--co);}
.academy .credit-confirm{display:grid;--co:#1FB69B;--bg:#1FB69B10;}
.academy .credit-confirm>div:first-child>img{width:100%;border-bottom:1px solid var(--co);}
.payment>div.audio:not(.lesson){max-width:800px;}
.payment>div.audio:not(.lesson) .credit-confirm{display:flex;}
.payment>div.audio:not(.lesson) .credit-confirm>div:first-child>img{height:360px;border-right:1px solid var(--co);}
.payment>div.audio:not(.lesson) .credit-confirm>div:last-child{display:grid;grid-template-rows:max-content max-content auto max-content;}
.payment>div.audio .credit-confirm{--co:#FFAE00;--bg:#FFAE0010;}
span.in,span.out{text-align:center !important;}
@media (max-width:800px){
	.your-rank{min-width:inherit;position:static;grid-template-columns:1fr;}
	.your-rank>a{-webkit-box-shadow:none;box-shadow:none;border:1px solid #DDD;padding:10px 0;}
	.your-rank>a>div{gap:20px;}
	.your-rank>a>div>div:last-child{border-left:1px solid #1D1D1D;padding-left:20px;}
}
@media (max-width:400px){
	.credit-confirm{--pad:10px;}
	.credit-confirm>div:last-child>div.price-balance{display:grid;width:100%;}
	.credit-confirm>div:last-child>div.price-balance>div{width:100%;}
}