/* =========== © 2025 Centroarts.com - https://5play.org =========== */

.header-second, .header-first .qs-toggle { display: none !important; }
.header-first { position: relative; z-index: 99; background-color: transparent; }
.content-5p {
	padding-top: var(--header-h); margin-top: calc(var(--header-h)/-1);
	overflow: hidden; min-height: 100vh;
}
.page-cdn {
	--wrp-w: 580px;
	--appicon-size: 200px;
	--title-fs: var(--fs-title-file);
	--title-lh: 32px;
	--title-mb: 8px;

	padding: var(--sect-gap) 0; text-align: center;
}
@media (min-width: 576px) {
	.page-cdn { --appicon-size: 220px; }
}
@media (min-width: 992px) {
	.page-cdn {
		--title-lh: 40px;
		--title-mb: 12px;
		padding: 80px 0;
	}
}

.page-cdn .appicon { position: relative; z-index: 1; margin: 0 auto; margin-bottom: 32px; }
.page-cdn .appicon::after {
    content: ""; border-radius: 50%;
    position: absolute; inset: -8%;
    transform: translateY(15%); z-index: -1;
    background-image: radial-gradient(50% 50% at 50% 50%, hsla(0, 0%, 0%, .2) 0%, hsla(0, 0%, 0%, 0) 100%);
    pointer-events: none;
}
.page-cdn .appicon .mask {
    --mask-w: 500px;
    --mask-h: 500px;
    --mask-bg: transparent;
    --mask-size: 100% 100%;
    --mask-img: url(../img/icons/star-mask.svg);
	
    position: absolute; z-index: -1; pointer-events: none;
    left: calc(50% - var(--mask-w) / 2);
    top: calc(50% - var(--mask-h) / 2.25);
    background-image: radial-gradient(41.88% 41.88% at 50% 50%, hsla(var(--c-primary),0.2) 0%, hsla(var(--c-primary),0) 100%);
}

.page-cdn .title { text-wrap: balance; overflow-wrap: break-word; }
.page-cdn .md5 { opacity: .7; overflow-wrap: break-word; font-size: var(--fs-2); margin-bottom: var(--title-mb); }
.cdn-meta {
	display: flex; justify-content: center; gap: 12px;
	flex-wrap: wrap; opacity: .7; font-size: var(--fs-2);
}

.page-cdn .btn-group { gap: 8px; margin-top: var(--sect-gap); }
@media (min-width: 576px) {
	.page-cdn .btn-group { gap: 12px; }
}
.page-cdn .btn-group .btn { flex: 1; min-width: 240px; }
.page-cdn .counter-active .btn-blue { flex: 0 0 100% !important; }
.page-cdn .btn-line { flex: 0 0 100% !important; }

.page-cdn .btn-group .btn.downloading { pointer-events: none; user-select: none; opacity: .6; animation: blind-btn 1s infinite linear; }
.page-cdn .btn-group .btn.downloading .btn-cont { display: none; }
.page-cdn .btn-group .btn.downloading::before { content: attr(data-title); display: block; padding: 0 6px; }

.page-cdn .faq-list { text-align: left; margin-top: var(--group-gap); }

.download-counter {
	display: none; cursor: default; user-select: none; pointer-events: none;
	background-color: hsla(var(--c-yellow), 0.3);
	overflow: hidden;
}
.download-counter::before {
	content: ""; position: absolute; z-index: -1; inset: 0; right: auto;
	background-color: hsl(var(--c-yellow)); opacity: .2;
	width: 100%; margin-left: -100%; transform: translateX(var(--counter-progress));
	transition: transform .25s linear;
	animation: blind 1s infinite linear;
}
.counter-active .download-counter { display: block; }

@keyframes blind {
	0% { opacity: .2; }
	50% { opacity: .4; }
	100% { opacity: .2; }
}
@keyframes blind-btn {
	0% { opacity: .6; }
	50% { opacity: .8; }
	100% { opacity: .6; }
}