/* -------------------- Margin -------------------- */
/* ----- Top ----- */
.mt-0 {
    margin-top: 0;
}

.mt-1 {
    margin-top: 0.25rem;
}

.mt-2 {
    margin-top: 0.5rem;
}

.mt-3 {
    margin-top: 1rem;
}

.mt-4 {
    margin-top: 2rem;
}

.mt-5 {
    margin-top: 3rem;
}

/* ----- Right ----- */
.mr-0 {
    margin-right: 0;
}

.mr-1 {
    margin-right: 0.25rem;
}

.mr-2 {
    margin-right: 0.5rem;
}

.mr-3 {
    margin-right: 1rem;
}

.mr-4 {
    margin-right: 2rem;
}

.mr-5 {
    margin-right: 3rem;
}

/* ----- Top ----- */
.mb-0 {
    margin-bottom: 0;
}

.mb-1 {
    margin-bottom: 0.25rem;
}

.mb-2 {
    margin-bottom: 0.5rem;
}

.mb-3 {
    margin-bottom: 1rem;
}

.mb-4 {
    margin-bottom: 2rem;
}

.mb-5 {
    margin-bottom: 3rem;
}

/* ----- Left ----- */
.ml-0 {
    margin-left: 0;
}

.ml-1 {
    margin-left: 0.25rem;
}

.ml-2 {
    margin-left: 0.5rem;
}

.ml-3 {
    margin-left: 1rem;
}

.ml-4 {
    margin-left: 2rem;
}

.ml-5 {
    margin-left: 3rem;
}
/* ------------------------------------------------------ */


/* -------------------- Padding -------------------- */
/* ----- Top ----- */
.pt-0 {
    padding-top: 0;
}

.pt-1 {
    padding-top: 0.25rem;
}

.pt-2 {
    padding-top: 0.5rem;
}

.pt-3 {
    padding-top: 1rem;
}

.pt-4 {
    padding-top: 2rem;
}

.pt-5 {
    padding-top: 3rem;
}

/* ----- Right ----- */
.pr-0 {
    padding-right: 0;
}

.pr-1 {
    padding-right: 0.25rem;
}

.pr-2 {
    padding-right: 0.5rem;
}

.pr-3 {
    padding-right: 1rem;
}

.pr-4 {
    padding-right: 2rem;
}

.pr-5 {
    padding-right: 3rem;
}

/* ----- Top ----- */
.pb-0 {
    padding-bottom: 0;
}

.pb-1 {
    padding-bottom: 0.25rem;
}

.pb-2 {
    padding-bottom: 0.5rem;
}

.pb-3 {
    padding-bottom: 1rem;
}

.pb-4 {
    padding-bottom: 2rem;
}

.pb-5 {
    padding-bottom: 3rem;
}

/* ----- Left ----- */
.pl-0 {
    padding-left: 0;
}

.pl-1 {
    padding-left: 0.25rem;
}

.pl-2 {
    padding-left: 0.5rem;
}

.pl-3 {
    padding-left: 1rem;
}

.pl-4 {
    padding-left: 2rem;
}

.pl-5 {
    padding-left: 3rem;
}
/* ------------------------------------------------------ */

/* -------------------- Width/Height Utils -------------------- */
/* ----- Width ----- */
.w-1 {
    width: 0.25rem;
}

.w-2 {
    width: 0.5rem;
}

.w-3 {
    width: 0.75rem;
}

.w-4 {
    width: 1rem;
}

.w-5 {
    width: 1.25rem;
}

.w-6 {
    width: 1.5rem;
}
/* ----- ----- ----- */

/* ----- height ----- */
.h-1 {
    height: 0.25rem;
}

.h-2 {
    height: 0.5rem
}

.h-3 {
    height: 0.75rem
}

.h-4 {
    height: 1rem
}

.h-5 {
    height: 1.25rem;
}

.h-6 {
    height: 1.5rem;
}
/* ----- ----- ----- */
/* ------------------------------------------------------ */

/* -------------------- Flex centering -------------------- */
.flex-center {
    justify-content: center;
    align-items: center;
}

.justify-content-center,
.main-axis__center {
    justify-content: center;
}

.cross-axis__center {
    align-items: center;
}

.space-around {
    justify-content: space-around;
}
/* ------------------------------------------------------ */

/* -------------------- Fills -------------------- */
.fill-red {
    fill: red;
}

.fill-green {
    fill: green;
}

.fill-white {
    fill: white;
}

.fill-disabled {
    fill: #9ca3af;
}
/* ------------------------------------------------------ */

.spacer-line-top {
    border-top: 2px solid black;
}

.light-bg {
    background: lightgoldenrodyellow;
}

.w-100 {
    width: 100%;
}

.w-50 {
    width: 50%;
}