.tac { text-align: center; }
.tacf { text-align: center !important; }
.tal { text-align: left; }
.talf { text-align: left !important; }
.tar { text-align: right; }
.tarf { text-align: right !important; }



.pad-0 { padding: 0; }
.pad-1 { padding: 1px; }
.pad-2 { padding: 2px; }
.pad-5 { padding: 5px; }
.pad-10 { padding: 10px; }
.pad-15 { padding: 15px; }

.pad-0-5 { padding: 0 5px; }
.pad-0-10 { padding: 0 10px; }
.pad-0-15 { padding: 0 5px; }

.pad-5-0 { padding: 5px 0; }
.pad-10-0 { padding: 10px 0; }
.pad-15-0 { padding: 5px 0; }



.mar-0-5 { margin: 0 5px; }
.mar-0-10 { margin: 0 10px; }
.mar-0-15 { margin: 0 5px; }

.mar-0 { margin: 0; }
.mar-1 { margin: 1px; }
.mar-2 { margin: 2px; }
.mar-5 { margin: 5px; }
.mar-10 { margin: 10px; }
.mar-15 { margin: 15px; }

.mar-items-0 > div { margin: 0; }
.mar-items-0-5 > div { margin: 0 5px; }
.mar-items-0-10 > div { margin: 0 10px; }
.mar-items-0-15 > div { margin: 0 15px; }



.font-huge { font-size: var(--font-size-huge); }
.font-large { font-size: var(--font-size-large); }
.font-normal { font-size: var(--font-size-normal); }
.font-small { font-size: var(--font-size-small); }
.font-tiny { font-size: var(--font-size-tiny); }

.font-up-4 { font-size: var(--font-up-4); }
.font-up-3 { font-size: var(--font-up-3); }
.font-up-2 { font-size: var(--font-up-2); }
.font-up-1 { font-size: var(--font-up-1); }
.font-down-1 { font-size: var(--font-down-1); }
.font-down-2 { font-size: var(--font-down-2); }
.font-down-3 { font-size: var(--font-down-3); }
.font-down-4 { font-size: var(--font-down-4); }




.no-scroll { overflow: hidden; }
.auto-scroll { overflow: auto; }



.max-height { height: 100%; }



.fade-in { animation-name: fadeIn; animation-duration: 0.5s; }
@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}