/* CSS Document */
/*!
 * dsignPOETRY labs.
 * CSS: 7998-percent-feeling-good.css
 * File In Use: https://www.dsignpoetry.com
 * Version: 16.02.19
 * Theme Author: DoggieStudio dsignPOETRY labs - Another DoggieStudio Production Since 1984 ★ (adps1984 foundation) ★
 * Orign Fit: Bootstrap 5.3.x & Unify 3.2.2
 * 
 * Copyright © 1984-2023 dsignPOETRY (DP) and DoggieStudio (DS) licensed by adps1984 foundation. All rights reserved.
 *
 * Date: 2022.12.30 (BS update)
 *
 * Included: Bootstrap 5.3.x
*/
/* -------------------------------------------------------------------------------------------------------------------------
   Lets Begin The Experimental Item 7998
** ------------------------------------------------------------------------------------------------------------------------- */
body {
    font-family: Consolas, "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", Monaco, "Courier New", "monospace";
	background: #1e1e24;
	overflow: hidden;
    min-height: 100vh;
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center; }

@property --percent {
    syntax: "<number>";
    initial-value: 0;
    inherits: false;
}

@property --temp {
    syntax: "<number>";
    initial-value: 0;
    inherits: false;
}

@property --v1 {
    syntax: "<integer>";
    initial-value: 0;
    inherits: false;
}

@property --v2 {
    syntax: "<integer>";
    initial-value: 0;
    inherits: false;
}

.percent {
    font-family: Consolas, "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", Monaco, "Courier New", "monospace";
	color: #fc3500;
    padding: 2rem;
    transition: --percent 1s;
    --temp: calc(var(--percent) * 100);
    --v1: max(var(--temp) - 0.5, 0);
    --v2: max((var(--temp) - var(--v1)) * 100 - 0.5, 0);
    counter-reset: v1 var(--v1) v2 var(--v2);
}

.percent::before {
    content: counter(v1) "."counter(v2, decimal-leading-zero) "%";
}