
/*#################################
SEN UI | FUTR
#################################*/

@import url('https://fonts.googleapis.com/css2?family=Poppins&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Amatic+SC:wght@400;700&family=Borel&family=Cinzel+Decorative&family=Comfortaa:wght@300;400;500;600;700&family=IBM+Plex+Mono:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&family=Lora:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Parisienne&family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;0,800;0,900;1,400;1,500;1,700;1,800;1,900&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Press+Start+2P&family=Prompt:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Quicksand:wght@300;400;500;600;700&family=Sacramento&family=Silkscreen:wght@400;700&family=Space+Mono:ital,wght@0,400;0,700;1,400;1,700&family=Unbounded:wght@200;300;400;500;600;700;800;900&family=VT323&family=Pixelify+Sans:wght@400;500&Josefin+Sans:ital,wght@0,100;0,200;1,100&display=swap');

/*#################################
#################################*/
@media screen {
::-webkit-scrollbar {width: 5px;height: 8px;}::-webkit-scrollbar-­corner {background: none;} ::-webkit-scrollbar-­thumb {background: #ffffff;}::-webkit-scrollbar-­track {background-color: transparent;}
body {margin: 0px;background-color: var(--b);color: var(--m) !important;display: flex; flex-wrap: wrap; width:100%; max-width: 100%; height:100vh; min-height: 100vh; flex-flow: column;} 
* {font-size:16px;line-height: 1.3em; font-weight: 400; font-family: "Poppins", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
word-wrap: break-word; margin:0px; border: 0px;outline: none; border-radius: 0px; border-style: none; text-decoration: none; text-rendering: optimizeLegibility; text-transform: none; 
--bdr:15px;
--sh:2.5px 2.5px 0px 2px;

--r: #dd4162;  --l: #4162dd;  --y: #ddb641;  --g: #41dd6d;  --p:#de90a0 ;  --v: #8f41dd;  --m: #fafafa;  --b: #17171b;
--r2: #a5243f;  --l2: #2440a5;  --y2: #a58924;  --g2: #24a558;  --p2: #b36f76; --v2: #6c24a5;  --m2: #d1d1d1;  --b2: #332e3d;

} 

[m] {color: var(--m);} svg[m] {fill: var(--m);} [mbg], h1 a {background-color: var(--m);} [mol] {outline: var(--m) solid 1.5px;} [msh] {box-shadow: var(--sh) var(--m);}

[b],h1 a {color:var(--b);} svg[b] {fill: var(--b);} [bbg], p a {background-color:var(--b);} [bol] {outline: var(--b) solid 1.5px;} [bsh] {box-shadow: var(--sh) var(--b );}

[r] {color:var(--r);} svg[r] {fill: var(--r);} [rbg],h2 a{background-color:var(--r);}[rol] {outline: var(--r) solid 1.5px;} [rsh] {box-shadow: var(--sh) var(--r);}

[y] {color:var(--y);} svg[y] {fill: var(--y);} [ybg], h3 a {background-color:var(--y);} [yol] {outline:var(--y) solid 1.5px;} [ysh] {box-shadow: var(--sh) var(--y );}

[l] {color:var(--l);} svg[l] {fill: var(--l);} [lbg], h4 a {background-color:var(--l); } [lol] {outline:var(--l) solid 1.5px;} [lsh] {box-shadow: var(--sh) var(--l );}

[g] {color:var(--g);} svg[g] {fill: var(--g);} [gbg], h5 a {background-color:var(--g);} [gol] {outline:var(--g) solid 1.5px;} [gsh] {box-shadow: var(--sh) var(--g );}

[p] {color:var(--p);} svg[p] {fill: var(--p);} [pbg], h6 a {background-color:var(--p);} [pol] {outline:var(--p) solid 1.5px;} [psh] {box-shadow: var(--sh) var(--p );}

[v] {color:var(--v);} svg[v] {fill: var(--v);} [vbg] {background-color:var(--v);} [vol] {outline:var(--v) solid 1.5px;} [vsh] {box-shadow: var(--sh) var(--v);}


[m2] {color: var(--m2);} svg[m2] {fill: var(--m2);} [mbg2] {background-color: var(--m2);} [mol2] {outline: var(--m2) solid 1px;} [msh2] {box-shadow: var(--sh) var(--m2);}

[b2] {color:var(--b2);} svg[b2] {fill: var(--b2);} [bbg2] {background-color:var(--b2);} [bol2] {outline: var(--b2) solid 1px;} [bsh2] {box-shadow: var(--sh) var(--b2);}

[r2] {color:var(--r2);} svg[r2] {fill: var(--r2);} [rbg2] {background-color:var(--r2);}[rol2] {outline: var(--r2) solid 1px;} [rsh2] {box-shadow: var(--sh) var(--r2);}

[y2] {color:var(--y2);} svg[y2] {fill: var(--y2);} [ybg2] {background-color:var(--y2);} [yol2] {outline:var(--y2) solid 1px;} [ysh2] {box-shadow: var(--sh) var(--y2);}

[l2] {color:var(--l2);} svg[l2] {fill: var(--l2);} [lbg2] {background-color:var(--l2); } [lol2] {outline:var(--l2) solid 1px;} [lsh2] {box-shadow: var(--sh) var(--l2);}

[g2] {color:var(--g2);} svg[g2] {fill: var(--g2);} [gbg2] {background-color:var(--g2);} [gol2] {outline:var(--g2) solid 1px;} [gsh2] {box-shadow: var(--sh) var(--g2);}

[p2] {color:var(--p2);} svg[p2] {fill: var(--p2);} [pbg2] {background-color:var(--p2);} [pol2] {outline:var(--p2) solid 1px;} [psh2] {box-shadow: var(--sh) var(--p2);}

[v2] {color:var(--v2);} svg[v2] {fill: var(--v2);} [vbg2] {background-color:var(--v2);} [vol2] {outline:var(--v2) solid 1px;} [vsh2] {box-shadow: var(--sh) var(--v2);}

body[duo] a {
--sh:0px 4px 0px 2.5px ;
scale: 1;
transform: translateY(-5px);
}


body[duo] a[a] {
--sh:0px 2px 0px 2px ;
scale: 1;
transform: translateY(0px); 
}

body[duo] a:hover,body[duo] a:active {
--sh:0px 2px 0px 2px ;
scale: 1;
transform: translateY(0px);
opacity: 75%;
}


body[txt="r"] * { color: var(--r); } body[txt="r2"] * { color: var(--r2); } 
body[txt="b"] * { color: var(--b); } body[txt="b2"] * { color: var(--b2); }
body[txt="l"] * { color: var(--l); } body[txt="l2"] * { color: var(--l2); }
body[txt="g"] * { color: var(--g); } body[txt="g2"] * { color: var(--g2); }
body[txt="m"] * { color: var(--m); } body[txt="m2"] * { color: var(--m2); } 
body[txt="v"] * { color: var(--v); } body[txt="v2"] * { color: var(--v2); }
body[txt="p"] * { color: var(--p); } body[txt="p2"] * { color: var(--p2); }
body[txt="y"] * { color: var(--y); } body[txt="y2"] * { color: var(--y2); }

body[pop="r"] *[pop] { background-color: var(--r); }
body[pop="b"] *[pop] { background-color: var(--b); }
body[pop="l"] *[pop] { background-color: var(--l); }
body[pop="g"] *[pop] { background-color: var(--g); }
body[pop="m"] *[pop] { background-color: var(--m); }
body[pop="v"] *[pop] { background-color: var(--v); }
body[pop="p"] *[pop] { background-color: var(--p); }
body[pop="y"] *[pop] { background-color: var(--y); }

body[pop="r2"] *[pop] { background-color: var(--r2); }
body[pop="b2"] *[pop] { background-color: var(--b2); }
body[pop="l2"] *[pop] { background-color: var(--l2); }
body[pop="g2"] *[pop] { background-color: var(--g2); }
body[pop="m2"] *[pop] { background-color: var(--m2); }
body[pop="v2"] *[pop] { background-color: var(--v2); }
body[pop="p2"] *[pop] { background-color: var(--p2); }
body[pop="y2"] *[pop] { background-color: var(--y2); }

body[min="r2"] *[min] { background-color: var(--r2); }
body[min="b2"] *[min] { background-color: var(--b2); }
body[min="l2"] *[min] { background-color: var(--l2); }
body[min="g2"] *[min] { background-color: var(--g2); }
body[min="m2"] *[min] { background-color: var(--m2); }
body[min="v2"] *[min] { background-color: var(--v2); }
body[min="p2"] *[min] { background-color: var(--p2); }
body[min="y2"] *[min] { background-color: var(--y2); }

body[min="r"] *[min] { background-color: var(--r); }
body[min="b"] *[min] { background-color: var(--b); }
body[min="l"] *[min] { background-color: var(--l); }
body[min="g"] *[min] { background-color: var(--g); }
body[min="m"] *[min] { background-color: var(--m); }
body[min="v"] *[min] { background-color: var(--v); }
body[min="p"] *[min] { background-color: var(--p); }
body[min="y"] *[min] { background-color: var(--y); }
}

bg {z-index: -1;top:0;left:0;right:0;bottom:0;position:fixed;display:block;}
setup,warn,md,js,[hide],[hide] *, .hide, .hide * 
{display:none; visibility:hidden; 
width:0;height:0;
size:0;opacity:0%;font-size:0;
color:transparent;
background:transparent;position:fixed;
top:0;z-index:-2;}
screen {z-index: 1;top:0;left:0;right:0;bottom:0;position:fixed;display:block;}

screen#logo,screen[logo] {top: 0px;right: 0px;left: 0px;bottom: 0px;width: 0%;height: 0%;z-index: 0;position: fixed;font-size: .3in;size: 0%;animation: logoscreen 2s;opacity: 0%;display: grid;place-content: center;justify-content: center;flex-wrap: wrap;overflow-y: scroll;}screen#logo * {display: grid;place-content: center;justify-content: center;flex-wrap: wrap;z-index: 4;}@keyframes logoscreen {0%,50%{z-index: 4;width: auto;height: auto;opacity: 100%;size: auto;}100% {z-index: 4;width: auto;height: auto;opacity: 0%;size: auto;}}

[overlay] {z-index: 2;top:0;left:0;right:0;bottom:0;position:fixed;display:block;}

[none]{
outline: none;
box-shadow:none;
background-color: none;
}
[set]{
width: max-content;
height: max-content;
}
[scroll]{
overflow-y: scroll;
}
[scrollx]{
overflow-x: scroll;
}
[sticky] { position: sticky; }
[fixed] { position: fixed; }

i[big]{    
font-size:29.5px;
letter-spacing: -0.5px;
}
i[mid]{    
font-size:22.25px;
letter-spacing: -0.5px;
}
p {
padding: 0.1in;
letter-spacing: -0.2px;
font-weight: 400;
font-variant-ligatures:additional-ligatures;
}
p[mid], h1:not(:has(a)), h3:not(:has(a)){
font-size: larger;
letter-spacing: -0.35px;
}
p[big], h2:not(:has(a)), h4:not(:has(a)){    
font-size:x-large;
letter-spacing: -0.5px;
}
p[caps] {text-transform: capitalize;}
p[italic] {font-style: italic;}
p[bold] {font-weight: 700;}
p[light] {font-weight: lighter;}

img {width:18em;height:auto;max-width:18em;}
img[icon] {width:3em; border-radius:50%; height:3em;}
img[avatar] {width:8em; border-radius:25px; height:auto;}

nav {
flex-flow: row;
left: 0;
right: 0;
bottom: 0;
display: flex;
flex:1;
flex-wrap: wrap;
margin: 0.1in;
gap: 2.5px;
padding: 0.1in;
justify-content: center; 
place-items: center;
position: fixed;
}

cont,bon {
display: flex;
flex:1;
flex-wrap: wrap;
margin: 0.1in;
gap: 2.5px;
padding: 0.01em;
justify-content: center; 
place-items: center;
transition: outline, box-shadow,0.5s; 
}

cont cont,bon bon {
flex-flow: row;
flex-wrap: wrap;
height: 1in;
min-width: 1in;
}
cont[small],bon[small]{
height: 0.5in;
max-height: 0.5in;
}
cont[mid],bon[mid]{
height: 25vh;
max-height: 25vh;
}
cont[big],bon[big]{
height:50vh;
max-height:50vh;
}

list > cont,list > bon{
display: flex;
flex: unset;
max-width: auto;
width: 89vw;
height: max-content;
max-height: 0.5in;
margin: 0.1in;
gap: 2.5px;
padding: 0.1em 0.25em;
}

list > cont p,list > bon p {display: flex;
justify-content: flex-start;
place-content: flex-start;
flex-grow: 1;
flex-wrap: wrap;
}


cont[bar],bon[bar] {
height: max-content;
min-height: 0.4in;
margin: 0;
}
bon[bar][fixed][top],
bon[bar][sticky][top],
cont[bar][fixed][top],
cont[bar][sticky][top],nav[top] {
flex-flow: row;
top: 0;
left: 0;
right: 0;
bottom: unset;
}
bon[bar][fixed][left],nav[left],
cont[bar][fixed][left],nav[left] {
top: 0;
left: 0;
right: unset;
bottom: 0;
flex-flow: column;
max-width: 0.4in;
height: auto;
max-height: 100vh;
margin: 0.1in;
}
bon[bar][fixed][right],nav[right],
cont[bar][fixed][right],nav[right] {
top: 0;
left: unset;
right: 0;
bottom: 0;
flex-flow: column;
max-width: 0.4in;
height: auto;
max-height: 100vh;
margin: 0.1in;

}
bon[bar][fixed][bottom],
cont[bar][fixed][bottom] {
flex-flow: row;
left: 0;
right: 0;
bottom: 0;
top: unset;
}


select {
background-color: var(--b);
color: var(--m);padding: 10px; 
border-radius: var(--bdr); 
cursor: pointer;
}

select::-ms-expand { display: none; }


a,btn,button, .markdown-body a, .markdown-body button{
padding: 1rem;
transition: padding, opacity, 0.5s;
display: flex; gap: 9px; justify-content: center;
place-items: center; flex-wrap: wrap; gap: 0.1fr; 
background-color: var(--b);
color: var(--m);
border-radius: var(--bdr);
flex-flow: row;
flex-wrap: nowrap;
gap: 2.5px;
transition: scale 0.59s; 
}
a:hover,btn:hover,button:hover, .markdown-body a:hover, .markdown-body button:hover {
scale: 1.05;
opacity: 89.3%;
transition: scale 0.59s; 
}

a>p {
padding: 0;
}

h1 a,h2 a,h3 a,h4 a,h5 a,h6 a,p a {
width: max-content;
max-width: max-content;
}
.highlight .s {color: var(--r) !important;}

.highlight .o, .highlight .kd {color: var(--m) !important;}

.highlight .nt {color: var(--l) !important;}
.highlight .nb {color: var(--l2) !important;}

.highlight .na {color: var(--g) !important;}

.highlight {background-color: var(--b) !important;}
.markdown-body pre {
border-radius: var(--bdr);
}
.markdown-body .highlight pre, .markdown-body pre {
background-color: var(--b2) !important;
}
textarea, input {
margin: 0.1in;
padding: 0.1in;
background-color: var(--b);
color: var(--m);
border-radius: var(--bdr);
height: 0.43in;
resize: vertical;
}
textarea::-webkit-resizer {
background-color: #fafafa;
border-radius: 50%;
border: 0px;
}
textarea[small] {
height: 0.43in;
}
textarea[mid] {
height: 1in;
}
textarea[big] {
height: 3.5in;
}

progress {
width: 100%;
height: 30px;
-webkit-appearance: none;
appearance: none;
}

progress::-webkit-progress-bar {
background-color: transparent;
border-radius: 25px;
height: 19px;
margin: 5px;
overflow: hidden;
}

progress::-webkit-progress-value {

height: 23px;
background: linear-gradient(45deg, #ff6b6b, #f06595, #a29bfe, #6c5ce7);
background-size: 300% 300%;
animation: moveGradient 10s linear infinite;
border-radius: 25px;
}

progress::-moz-progress-bar {

height: 23px;
background: linear-gradient(45deg, #ff6b6b, #f06595, #a29bfe, #6c5ce7);
background-size: 300% 300%;
animation: moveGradient 10s linear infinite;
border-radius: 25px;
}

progress[value]::-ms-fill {

height: 23px;
background: linear-gradient(45deg, #ff6b6b, #f06595, #a29bfe, #6c5ce7);
background-size: 300% 300%;
animation: moveGradient 10s linear infinite;
border-radius: 25px;
}

/*#################################
#################################*/

@media screen {
[lock] { user-select: none; }
[sticky] { position: sticky; }
[float] { position: fixed; }
[item] { display: flex; gap: 9px; justify-content: center; place-items: center; flex-wrap: wrap; gap: 0.1fr; }
[item-left] { display: flex; gap: 9px; justify-content: flex-start; place-content: flex-start; flex-grow: 1; flex-wrap: wrap; }
[item-right] { display: flex; gap: 9px; justify-content: flex-end; place-content: flex-end; flex-grow: 1; flex-wrap: wrap; }
[center] { display: grid; justify-content: center; justify-items: center; place-content: center; }
[left],list { display: grid; gap: 9px; justify-content: left; justify-items: left; place-content: left; }
[right] { display: grid; gap: 9px; justify-content: right; justify-items: right; place-content: right; }
[row],row { display: flex; gap: 9px; flex-direction: row; justify-content: center; place-items: center; flex-wrap: wrap; }
[column],column, [col],col { display: flex; gap: 9px; flex-direction: column; justify-content: center; place-items: center; flex-wrap: wrap; }
[last-first], [l-f], [left-to-right], [left-right] { display: flex; flex-direction: column-reverse; }
[row-last-first], [row-l-f], [row-left-to-right], [row-left-right], [last-first-row], [l-f-row], [left-to-right-row], [left-right-row] { display: flex; flex-direction: row-reverse; }
[grid] {gap: 9px; display: grid; justify-content: center; place-content: center; grid-template-columns: 2.5fr; grid-auto-rows: max-content; }
grid, [grid2], [grid="2"] {display: grid; justify-content: center;place-content: center;gap: 5px;grid-template-columns: auto auto; grid-auto-rows: max-content;}
[grid3],[grid="3"] {display: grid; justify-content: center;place-content: center;gap:5px;grid-template-columns:auto auto auto ; grid-auto-rows: max-content;}
[grid4],[grid="4"] {display: grid; justify-content: center;place-content: center;gap: 5px;grid-template-columns:auto auto auto auto ; grid-auto-rows: max-content;}
[stay] { flex-wrap: nowrap; }
[flow] { flex-wrap: wrap;}
[flex]{flex-grow: 1}
mansory {
overflow-y: scroll;
display: grid; 
grid-template-columns: auto auto; 
gap: 5px; 
}

mansory > *:nth-child(2n) {
height: 2in; 
max-height: 2in; 
grid-row: span 2; 
}

[big-my] {
margin-top: 3rem;
margin-bottom: 3rem;
}

[mid-my] {
margin-top: 2rem;
margin-bottom: 2rem;
}

[small-my] {
margin-top: 1rem;
margin-bottom: 1rem;
}

[small-mt],
[small-top-margin],
[small-margin-top],
[top-margin-small],
[margin-top-small] {
margin-top: 1rem;
}

[mid-mt],
[mid-top-margin],
[mid-margin-top],
[top-margin-mid],
[margin-top-mid] {
margin-top: 2rem;
}

[big-mt],
[big-top-margin],
[big-margin-top],
[top-margin-big],
[margin-top-big] {
margin-top: 3rem;
}

[small-ml],
[small-left-margin],
[small-margin-left],
[left-margin-small],
[margin-left-small] {
margin-left: 1rem;
}

[mid-ml],
[mid-left-margin],
[mid-margin-left],
[left-margin-mid],
[margin-left-mid] {
margin-left: 2rem;
}

[big-ml],
[big-left-margin],
[big-margin-left],
[left-margin-big],
[margin-left-big] {
margin-left: 3rem;
}

[big-mx] {
margin-left: 3rem;
margin-right: 3rem;
}

[mid-mx] {
margin-left: 2rem;
margin-right: 2rem;
}

[small-mx] {
margin-left: 1rem;
margin-right: 1rem;
}

[small-m],
[small-margin],
[margin-small] {
margin: 1rem;
}

[mid-m],
[mid-margin],
[margin-mid] {
margin: 2rem;
}

[big-m],
[big-margin],
[margin-big] {
margin: 3rem;
}

[small-mr],
[small-right-margin],
[small-margin-right],
[right-margin-small],
[margin-right-small] {
margin-right: 1rem;
}

[mid-mr],
[mid-right-margin],
[mid-margin-right],
[right-margin-mis],
[margin-right-mid] {
margin-right: 2rem;
}

[big-mr],
[big-right-margin],
[big-margin-right],
[right-margin-big],
[margin-right-big] {
margin-right: 3rem;
}

[small-mb],
[small-bottom-margin],
[small-margin-bottom],
[bottom-margin-small],
[margin-bottom-small] {
margin-bottom: 1rem;
}

[mid-mb],
[mid-bottom-margin],
[mid-margin-bottom],
[bottom-margin-mid],
[margin-bottom-mid] {
margin-bottom: 2rem;
}

[big-mb],
[big-bottom-margin],
[big-margin-bottom],
[bottom-margin-big],
[margin-bottom-big] {
margin-bottom: 3rem;
}

[big-py] {
padding-top: 3rem;
padding-bottom: 3rem;
}

[mid-py] {
padding-top: 2rem;
padding-bottom: 2rem;
}

[small-py] {
padding-top: 1rem;
padding-bottom: 1rem;
}

[small-pt],
[small-padding-top],
[small-top-padding],
[top-padding-small],
[padding-top-small] {
padding-top: 1rem;
}

[mid-pt] {
padding-top: 2rem;
}

[big-pt] {
padding-top: 3rem;
}

[small-pl] {
padding-left: 1rem;
}

[mid-pl] {
padding-left: 2rem;
}

[big-pl] {
padding-left: 3rem;
}

[small-p] {
padding: 1rem;
}

[mid-p] {
padding: 2rem;
}

[big-p] {
padding: 3rem;
}

[big-px] {
padding-left: 3rem;
padding-right: 3rem;
}

[mid-px] {
padding-left: 2rem;
padding-right: 2rem;
}

[small-px] {
padding-left: 1rem;
padding-right: 1rem;
}



[small-pr] {
padding-right: 1rem;
}

[mid-pr] {
padding-right: 2rem;
}

[big-pr] {
padding-right: 3rem;
}

[small-pb] {
padding-bottom: 1rem;
}

[mid-pb] {
padding-bottom: 2rem;
}

[big-pb] {
padding-bottom: 3rem;
}

[big-my2] {
margin-top: 13n;
margin-bottom: 3in;
}

[mid-my2] {
margin-top: 2in;
margin-bottom: 2in;
}

[small-my2] {
margin-top: 1in;
margin-bottom: 1in;
}


[small-mt2] {
margin-top: 1in;
}

[mid-mt2] {
margin-top: 2in;
}

[big-mt2] {
margin-top: 3in;
}

[small-ml2] {
margin-left: 1in;
}

[mid-ml2] {
margin-left: 2in;
}

[big-ml2] {
margin-left: 3in;
}

[small-m2] {
margin: 1in;
}

[mid-m2] {
margin: 2in;
}

[big-m2] {
margin: 3in;
}

[small-mr2] {
margin-right: 1in;
}

[mid-mr2] {
margin-right: 2in;
}

[big-mr2] {
margin-right: 3in;
}

[small-mb2] {
margin-bottom: 1in;
}

[mid-mb2] {
margin-bottom: 2in;
}

[big-mb2] {
margin-bottom: 3in;
}

[small-p2] {
padding: 1in;
}

[mid-p2] {
padding: 2in;
}

[big-p2] {
padding: 3in;
}

[small-pt2] {
padding-top: 1in;
}

[mid-pt2] {
padding-top: 2in;
}

[big-pt2] {
padding-top: 3in;
}

[small-pl2] {
padding-left: 1in;
}

[mid-pl2] {
padding-left: 2in;
}

[big-pl2] {
padding-left: 3in;
}

[small-p2] {
padding: 1in;
}

[mid-p2] {
padding: 2in;
}

[big-p2] {
padding: 3in;
}

[small-pr2] {
padding-right: 1in;
}

[mid-pr2] {
padding-right: 2in;
}

[big-pr2] {
padding-right: 3in;
}

[small-pb2] {
padding-bottom: 1in;
}

[mid-pb2] {
padding-bottom: 2in;
}

[big-pb2] {
padding-bottom: 3in;
} 

[no-p] {padding: 0;}
[no-pt] {padding-top: 0;}
[no-pl] {padding-left: 0;}
[no-pr] {padding-right: 0;}
[no-pb] {padding-bottom: 0;}
[no-m] {margin: 0;}
[no-mt] {margin-top: 0;}
[no-ml] {margin-left: 0;}
[no-mr] {margin-right: 0;}
[no-mb] {margin: 0;}

[layer="-1"] {z-index: -1;} [layer="0"] {z-index: 0;}
[layer="1" ] {z-index: 1;}  [layer="2"] {z-index: 2;}
[layer="3" ] {z-index: 3;} [layer="4" ] {z-index: 4;}
[layer="5" ] {z-index: 5;} 

body[bdr="0"] * {border-radius: 0px;}
body[bdr="5"] * {border-radius: 5px;}
body[bdr="10"] * {border-radius: 10px;}
body[bdr="15"] * {border-radius: 15px;}
body[bdr="20"] * {border-radius: 20px;}
body[bdr="25"] * {border-radius: 25px;}
body[bdr="50"] * {border-radius: 50px;}
body[bdr="100"] * {border-radius: 100px;}

[bdr="0"] {border-radius: 0px;}
[bdr="5"] {border-radius: 5px;}
[bdr="10"] {border-radius: 10px;}
[bdr="15"] {border-radius: 15px;}
[bdr="20"] {border-radius: 20px;}
[bdr="25"] {border-radius: 25px;}
[bdr="50"] {border-radius: 50px;}
[bdr="100"] {border-radius: 100px;}

[lbdr="0"] {border-bottom-left-radius:0;border-top-left-radius:0;}
[lbdr="10"] {border-bottom-left-radius:10px;border-top-left-radius:10px;}
[lbdr="15"] {border-bottom-left-radius:15px;border-top-left-radius:15px;}
[lbdr="25"] {border-bottom-left-radius:25px;border-top-left-radius:25px;}
[lbdr="50"] {border-bottom-left-radius:50px;border-top-left-radius:50px;}
[lbdr="100"] {border-bottom-left-radius:100px;border-top-left-radius:100px;}

[rbdr="0"] {border-bottom-right-radius:0;border-top-right-radius:0;}
[rbdr="10"] {border-bottom-right-radius:10px;border-top-right-radius:10px;}
[rbdr="15"] {border-bottom-right-radius:15px;border-top-right-radius:15px;}
[rbdr="25"] {border-bottom-right-radius:25px;border-top-right-radius:25px;}
[rbdr="50"] {border-bottom-right-radius:50px;border-top-right-radius:50px;}
[rbdr="100"] {border-bottom-right-radius:100px;border-top-right-radius:100px;}

[tbdr="0"] {border-top-left-radius:0;border-top-right-radius:0;}
[tbdr="10"] {border-top-left-radius:10px;border-top-right-radius:10px;}
[tbdr="15"] {border-top-left-radius:15px;border-top-right-radius:15px;}
[tbdr="25"] {border-top-left-radius:25px;border-top-right-radius:25px;}
[tbdr="50"] {border-top-left-radius:50px;border-top-right-radius:50px;}
[tbdr="100"] {border-top-left-radius:100px;border-top-right-radius:100px;}


[bbdr="0"] {border-bottom-right-radius:0;border-bottom-left-radius:0;}
[bbdr="10"] {border-bottom-right-radius:10px;border-bottom-left-radius:10px;}
[bbdr="15"] {border-bottom-right-radius:15px;border-bottom-left-radius:15px;}
[bbdr="25"] {border-bottom-right-radius:25px;border-bottom-left-radius:25px;}
[bbdr="50"] {border-bottom-right-radius:50px;border-bottom-left-radius:50px;}
[bbdr="100"] {border-bottom-right-radius:100px;border-bottom-left-radius:100px;}

[flip] {transform: rotate(180deg);}
[rotate] {transform: rotate(90deg);}
p[rotate]{transform: rotate(90deg), translateX(0.025em);}


}    

@media screen {

[agr], [agr] * {font-family: "Agr";}
[amatic],[amatic] * { font-family: 'Amatic SC', cursive; }

[borel],[borel] *{ font-family: 'Borel', cursive; }

[cinzel],[cinzel] * { font-family: 'Cinzel Decorative', cursive; }

[comfort],[comfortaa], [comfort] *,[comfortaa] * {font-family: 'Comfortaa', cursive; }

[ibm] ,[ibm] *{ font-family: 'IBM Plex Mono', monospace; }

[lora] ,[lora] *{ font-family: 'Lora', serif; }

[mont],[montserrat],[mont] *,[montserrat] * {font-family: 'Montserrat', sans-serif};

[pari],[parisienne],[pari] *,[parisienne] * { font-family: 'Parisienne', cursive; }

[play],[playfair],[play] *,[playfair] * {font-family: 'Playfair Display', serif; }

[pop],[poppins],[pop] *,[poppins] *{font-family: 'Poppins', sans-serif;}

[press],[press] *{font-family: 'Press Start 2P', cursive;}

[prompt] , [prompt] * { font-family: 'Prompt', sans-serif; }

[quick] , [quick] *{ font-family: 'Quicksand', sans-serif; }

[sacra],[sacramento], [sacra] *,[sacramento] * { font-family: 'Sacramento', cursive; }
[silk] , [silkscreen],[silk] *,[silkscreen] * { font-family: 'Silkscreen', cursive; }

[spacemono],[spacemono] * {font-family: 'Space Mono', monospace;}

[unbound] {font-family: 'Unbounded', cursive;}

[vt323],[vt],[vt323] *,[vt] * { font-family: 'VT323', monospace;}

[pixel],[pixel] * { font-family: 'Pixelify Sans', sans-serif; }

[jose],[jose] * { font-family: 'Josefin Sans', sans-serif; }
}

/*#################################
#################################*/
textarea {
margin: 0.1in;
padding: 0.1in;
background-color: var(--b);
color: var(--m);
border-radius: var(--bdr);
height: 0.43in;
resize: vertical;
}
textarea::-webkit-resizer {
background-color: #fafafa;
border-radius: 50%;
border: 0px;
}
textarea[small] {
height: 0.43in;
}
textarea[mid] {
height: 1in;
}
textarea[big] {
height: 3.5in;
}

input[type='date'], input[type='number'] {
margin: 0.1in;
padding: 0.1in;
background-color: var(--b); 
color: var(--m);
border-radius: var(--bdr);
}

