/* --cf calculations */
:root { --cf: 1px; }
@media screen and (max-width: 1199px) {
    :root { --cf: calc(100vw / 1200); }
}
@media screen and (max-width: 991px) {
    :root { --cf: calc(100vw / 992); }
}
@media screen and (max-width: 767px) {
    :root { --cf: calc(100vw / 768); }
}
@media screen and (max-width: 575px) {
    :root { --cf: calc(100vw / 576); }
}



* {
    font-size: calc(var(--fs, 1rem) * var(--cf));
    font-weight: calc(var(--fw, 500));
    text-indent: calc(var(--ti, unset) * var(--cf)) !important;
    border-radius: calc(var(--br, unset) * var(--cf));
}


/* Widths & Heights */
.w { width: calc(var(--w, unset) * var(--cf)); }
.h { height: calc(var(--h, unset) * var(--cf)); }


/* Absolute Positioning */
.top { top: calc(var(--top, 0) * var(--cf)) }
.bottom { bottom: calc(var(--bottom, 0) * var(--cf)) }
.left { left: calc(var(--left, 0) * var(--cf)) }
.right { right: calc(var(--right, 0) * var(--cf)) }

/* Paddings & Margins */
.p { padding: calc(var(--p, unset) * var(--cf)) }
.pt { padding-top: calc(var(--pt, unset) * var(--cf))}
.pb { padding-bottom: calc(var(--pb, unset) * var(--cf))}
.pl { padding-left: calc(var(--pl, unset) * var(--cf))}
.pr { padding-right: calc(var(--pr, unset) * var(--cf))}
.ptb { padding-top: calc(var(--ptb, unset) * var(--cf)); padding-bottom: calc(var(--ptb, unset) * var(--cf)) }
.plr { padding-left: calc(var(--plr, unset) * var(--cf)); padding-right: calc(var(--plr, unset) * var(--cf)) }

.m { margin: calc(var(--m, unset) * var(--cf)) !important}
.mt { margin-top: calc(var(--mt, unset) * var(--cf)) !important}
.mb { margin-bottom: calc(var(--mb, unset) * var(--cf)) !important}
.ml { margin-left: calc(var(--ml, unset) * var(--cf)) !important}
.mr { margin-right: calc(var(--mr, unset) * var(--cf)) !important}
.mtb { margin-top: calc(var(--mtb, unset) * var(--cf)); margin-bottom: calc(var(--mtb, unset) * var(--cf)) !important}
.mlr { margin-left: calc(var(--mlr, unset) * var(--cf)); margin-right: calc(var(--mlr, unset) * var(--cf)) !important}

.mh { min-height: calc(var(--mh, unset) * var(--cf)); }
.xh { max-height: calc(var(--xh, unset) * var(--cf)); }
.xhm { max-height: calc(100vh - (var(--xhm, unset) * var(--cf))); }

.mw { min-width: calc(var(--mw, unset) * var(--cf)); }
.xw { max-width: calc(var(--xw, unset) * var(--cf)); }


/* p, textarea, input, label {
    line-height: calc(var(--lh) * 1px) !important;
} */

/* @media screen and (max-width: 575px) {
    .baseWidth { min-width: 100vw; }

    .pr { padding-right: calc(var(--mpr, calc(var(--pr, unset))) * var(--cf)) !important}

    .mt { margin-top: calc(var(--mmt, calc(var(--mt, unset))) * var(--cf)) !important}
} */