/*.mud-stepper .mud-stepper-nav.mud-stepper-nav-scrollable.mud-stepper-step-custom .mud-stepper-nav-connector
{
  min-width: 96px;
}*/

.mud-field-validate-small .mud-input-slot.mud-input-root.mud-input-root-text
{
  display: none;
}

.mud-stepper .mud-stepper-nav.mud-stepper-nav-scrollable.mud-stepper-step-custom > button
{
  min-width: 200px !important;
}

.tooltip-container {
    position: relative;
    display: inline-block;
}

.tooltip-text {
    position: fixed;
    bottom: auto;
    left: auto;
    opacity: 0;
    visibility: hidden;

    padding: 4px 8px;
    text-align: center;
    align-items: center;
    justify-content: center;
    border-radius: var(--mud-default-borderradius);

    transition-delay: 251ms;
    color: var(--mud-palette-dark-text);
    background-color: var(--mud-palette-gray-darker);

    max-width: 600px;
    z-index: 99999;
}

.tooltip-container:hover .tooltip-text {
    visibility: visible;
    opacity: 1;
}

/*fix height inssue with auto grow*/
.mud-input-auto-grow.mud-input-filled:has(> textarea),
.mud-input-auto-grow.mud-input-outlined:has(> textarea) {
    min-height: 56px;
}

.mud-input-outlined-with-label .mud-input-auto-grow~.mud-input-label-inputcontrol,
.mud-input-filled-with-label .mud-input-auto-grow~.mud-input-label-inputcontrol {
    /*transform: translate(14px, 10px) scale(1);*/
}

/***/

.mud-autocomplete-select-all {
    position: sticky;
    top: 0;
    z-index: 1;
    background-color: var(--mud-palette-background-gray);
}

.mud-autocomplete-before-items {
    position: sticky;
    top: 0;
    z-index: 1;
    background-color: var(--mud-palette-background-gray);
}

.mud-autocomplete-after-items {
    position: sticky;
    bottom: 0;
    z-index: 1;
    background-color: var(--mud-palette-background-gray);
}

.mud-dialog-height-full {
    height: calc(100% - 64px);
}

.mud-invert-colours {
    color: var(--mud-palette-primary-text) !important;
    background-color: var(--mud-palette-primary) !important;
}

/*inverted colour expansion panel*/
.mud-expand-panel .mud-expand-panel-inverted-header.mud-expand-panel-header {
    color: var(--mud-palette-primary-text);
    background-color: var(--mud-palette-primary);
    border-top-right-radius: 4px;
    border-top-left-radius: 4px;
    padding-left: 16px;
    padding-top: 8px;
    padding-bottom: 8px;
}

.mud-expand-panel-inverted-header.mud-expand-panel-header,
div.mud-collapse-container .mud-expand-panel-gutters.mud-expand-panel-content {
    padding-right: 16px;
    padding-left: 16px;
}

/*
.mud-expand-panel-inverted .mud-expand-panel .mud-expand-panel-header {
    color: var(--mud-palette-primary-text);
    background-color: var(--mud-palette-primary);
    border-top-right-radius: 4px;
    border-top-left-radius: 4px;
    padding: 8px;
}

.mud-expand-panel-inverted .mud-collapse-wrapper {
    padding-top: 16px;
}*/


/*fix muddatgrid toolbar*/
[role=toolbar].mud-table-toolbar {
    height: auto;
}

/*attendance grid*/
.smalltext {
    font-size: .6rem !important;
    padding: 2px !important;
}

.attendance.mud-simple-table table {
    width: fit-content;
    white-space: nowrap;
    border: 1px solid var(--mud-palette-table-lines);
}

.attendance .mark {
    text-align: center !important;
    padding: 0px !important;
    margin: 0px;
    /* font-size: .675rem;*/
}


.attendance .emptyweek {
    background-color: var(--mud-palette-background-gray);
}

.attendance .r-90 {
    writing-mode: vertical-rl;
    white-space: nowrap;
    padding: 5px 0 5px 0 !important;
    min-width: 13px;
    max-width: 12px;
    font-size: .6rem;
    border: 1px solid var(--mud-palette-table-lines) !important;
}


.mud-inverted-toolbar>[role="toolbar"] {
    border-top-right-radius: var(--mud-default-borderradius) !important;
    border-top-left-radius: var(--mud-default-borderradius) !important;
    color: var(--mud-palette-primary-text) !important;
    background-color: var(--mud-palette-primary) !important;
}

.mud-inverted-toolbar>[role="toolbar"] .mud-input.mud-input-underline:before {
    border-bottom: 1px solid var(--mud-palette-primary-text);
}

@media (hover: hover) and (pointer: fine) {
    .mud-inverted-toolbar>[role="toolbar"] .mud-input.mud-input-underline:hover:not(.mud-disabled):before {
        border-bottom: 1px solid var(--mud-palette-primary-text)
    }
}

.mud-inverted-toolbar>[role="toolbar"] .mud-input,
.mud-inverted-toolbar>[role="toolbar"] .mud-button-root,
.mud-inverted-toolbar>[role="toolbar"] .mud-icon-root,
.mud-inverted-toolbar>[role="toolbar"] .mud-primary-text {
    color: var(--mud-palette-primary-text) !important;
    background-color: var(--mud-palette-primary) !important;
}

.mud-inverted-toolbar>[role="toolbar"] .mud-button-root {
    color: var(--mud-palette-primary-text) !important;
    background-color: var(--mud-palette-primary) !important;
}

.custom-tab-height {
    border-bottom-right-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
}

.deleted {
    text-decoration: line-through;
}

/*amend pager and header for flexibility*/
.mud-table>.mud-table-pagination:has(.pager-modified) {
    display: block;
}

.mud-table>.mud-toolbar:has(.toolbar-modified) {
    height: auto !important;
    flex-wrap: wrap;
}

dl.bullet dd {
    display: list-item;
    list-style-type: disc;
    margin-left: 2rem;
}

@media print {
    .pagebreak {
        page-break-before: always;
    }

    /* page-break-after works, as well */
}

/*extra dense mudiconbutton extra dense*/
.mud-icon-button.mud-extra-dense {
    padding: 4px;
    height: min-content;
    width: min-content;
}

.mud-table.mud-table-extra-dense * .mud-table-row .mud-table-cell:last-child {
    padding-right: 4px;
    padding-inline-end: 4px;
}


.mud-invert-colours {
    color: var(--mud-palette-primary-text) !important;
    background-color: var(--mud-palette-primary) !important
}

a,
.btn-link {
    color: #2b3b62;
    font-weight: 700
}

.validation-errors {
    padding: 1rem;
    color: var(--mud-palette-error);
    list-style: disc
}

.flex-break {
    flex-basis: 100%;
    width: 0px;
    height: 0px;
    overflow: hidden
}

.mud-nav-link-control .mud-nav-link,
.mud-nav-link-control .mud-nav-link.active {
    padding-left: 1rem !important;
    background-color: rgba(0, 0, 0, 0) !important
}

.mud-table.mud-table-extra-dense.mud-simple-table * tr td,
.mud-table.mud-table-extra-dense * .mud-table-row .mud-table-cell {
    padding: 4px
}

.mud-table.mud-table-extra-dense * .mud-table-body>.mud-table-row>.mud-table-cell:has(>button:not(.mud-link)) {
    padding-right: 16px;
    padding-left: 16px
}

.mud-data-grid.mud-table-dense-header .mud-table-cell .column-header {
    display: block
}

.mud-data-grid.mud-table-dense-header .mud-table-cell .column-header .column-options {
    display: flex
}

.mud-table.mud-table-overflow {
    display: table
}

.mud-appbar .mud-autocomplete,
.mud-drawer .mud-autocomplete {
    flex-grow: 0;
    padding: 1rem
}

.mud-appbar .mud-autocomplete {
    width: 25rem
}

.mud-appbar .mud-autocomplete .mud-popover-open {
    z-index: 9999
}

.mud-appbar .mud-autocomplete .mud-icon-default {
    color: var(--mud-palette-primary-text) !important
}

.mud-appbar .mud-autocomplete .mud-input {
    background-color: var(--mud-palette-primary-lighten) !important;
    color: var(--mud-palette-primary-text) !important;
    border-radius: var(--mud-default-borderradius)
}

.mud-appbar .mud-autocomplete .mud-input-outlined-border {
    display: none !important
}

.double-height-label.mud-input-control>.mud-input-control-input-container>div.mud-input.mud-input-text {
    margin-top: 22px
}

.triple-height-label.mud-input-control>.mud-input-control-input-container>div.mud-input.mud-input-text {
    margin-top: 32px
}

.mud-no-label .mud-input,
.mud-no-label .mud-input-control {
    margin-top: 0 !important
}

.w-100 {
    width: 100% !important
}

.w-auto {
    width: auto !important
}

.h-25 {
    height: 25% !important
}

.h-50 {
    height: 50% !important
}

.h-75 {
    height: 75% !important
}

.h-100 {
    height: 100% !important
}

.h-auto {
    height: auto !important
}

/*grid auto-fill*/

.g {
  display: grid;
  grid-template-columns: repeat(auto-fill, 100%);
}


.g-2 {
    display: grid;
    grid-template-columns: repeat(1, minmax(min-content, 100%)) minmax(min-content, auto)
}

.g-col-2 {
    grid-column-end: span 2
}

.g-row-2 {
    grid-row-end: span 2
}

.g-3 {
    display: grid;
    grid-template-columns: repeat(2, minmax(min-content, 100%)) minmax(min-content, auto)
}

.g-col-3 {
    grid-column-end: span 3
}

.g-row-3 {
    grid-row-end: span 3
}

.g-4 {
    display: grid;
    grid-template-columns: repeat(3, minmax(min-content, 100%)) minmax(min-content, auto)
}

.g-col-4 {
    grid-column-end: span 4
}

.g-row-4 {
    grid-row-end: span 4
}

.g-5 {
    display: grid;
    grid-template-columns: repeat(4, minmax(min-content, 100%)) minmax(min-content, auto)
}

.g-col-5 {
    grid-column-end: span 5
}

.g-row-5 {
    grid-row-end: span 5
}

.g-6 {
    display: grid;
    grid-template-columns: repeat(5, minmax(min-content, 100%)) minmax(min-content, auto)
}

.g-col-6 {
    grid-column-end: span 6
}

.g-row-6 {
    grid-row-end: span 6
}

.g-7 {
    display: grid;
    grid-template-columns: repeat(6, minmax(min-content, 100%)) minmax(min-content, auto)
}

.g-col-7 {
    grid-column-end: span 7
}

.g-row-7 {
    grid-row-end: span 7
}

.g-8 {
    display: grid;
    grid-template-columns: repeat(7, minmax(min-content, 100%)) minmax(min-content, auto)
}

.g-col-8 {
    grid-column-end: span 8
}

.g-row-8 {
    grid-row-end: span 8
}

.g-9 {
    display: grid;
    grid-template-columns: repeat(8, minmax(min-content, 100%)) minmax(min-content, auto)
}

.g-col-9 {
    grid-column-end: span 9
}

.g-row-9 {
    grid-row-end: span 9
}

.g-10 {
    display: grid;
    grid-template-columns: repeat(9, minmax(min-content, 100%)) minmax(min-content, auto)
}

.g-col-10 {
    grid-column-end: span 10
}

.g-row-10 {
    grid-row-end: span 10
}

.g-11 {
    display: grid;
    grid-template-columns: repeat(10, minmax(min-content, 100%)) minmax(min-content, auto)
}

.g-col-11 {
    grid-column-end: span 11
}

.g-row-11 {
    grid-row-end: span 11
}

.g-12 {
    display: grid;
    grid-template-columns: repeat(11, minmax(min-content, 100%)) minmax(min-content, auto)
}

.g-col-12 {
    grid-column-end: span 12
}

.g-row-12 {
    grid-row-end: span 12
}

.g-start-1 {
    grid-column-start: 1
}

.g-start-2 {
    grid-column-start: 2
}

.g-start-3 {
    grid-column-start: 3
}

.g-start-4 {
    grid-column-start: 4
}

.g-start-5 {
    grid-column-start: 5
}

.g-start-6 {
    grid-column-start: 6
}

.g-start-7 {
    grid-column-start: 7
}

.g-start-8 {
    grid-column-start: 8
}

.g-start-9 {
    grid-column-start: 9
}

.g-start-10 {
    grid-column-start: 10
}

.g-start-11 {
    grid-column-start: 11
}

.g-start-12 {
    grid-column-start: 12
}

.gap-row-0 {
    row-gap: 0
}

.gap-col-0 {
    -moz-column-gap: 0;
    column-gap: 0
}

.gap-row-1,
.g-2,
.g-3,
.g-4,
.g-5,
.g-6,
.g-7,
.g-8,
.g-9,
.g-10,
.g-11,
.g-12 {
    row-gap: 0.25rem
}

.gap-col-1,
.g-2,
.g-3,
.g-4,
.g-5,
.g-6,
.g-7,
.g-8,
.g-9,
.g-10,
.g-11,
.g-12 {
    -moz-column-gap: 0.25rem;
    column-gap: 0.25rem
}

.gap-row-2 {
    row-gap: 0.5rem
}

.gap-col-2 {
    -moz-column-gap: 0.5rem;
    column-gap: 0.5rem
}

.gap-row-3 {
    row-gap: 1rem
}

.gap-col-3 {
    -moz-column-gap: 1rem;
    column-gap: 1rem
}

.gap-row-4 {
    row-gap: 1.5rem
}

.gap-col-4 {
    -moz-column-gap: 1.5rem;
    column-gap: 1.5rem
}

.gap-row-5 {
    row-gap: 3rem
}

.gap-col-5 {
    -moz-column-gap: 3rem;
    column-gap: 3rem
}

.g-xs-2 {
    display: grid;
    grid-template-columns: repeat(2, max-content)
}

.g-xs-col-2 {
    grid-column-end: span 2
}

.g-xs-row-2 {
    grid-row-end: span 2
}

.g-xs-3 {
    display: grid;
    grid-template-columns: repeat(3, max-content)
}

.g-xs-col-3 {
    grid-column-end: span 3
}

.g-xs-row-3 {
    grid-row-end: span 3
}

.g-xs-4 {
    display: grid;
    grid-template-columns: repeat(4, max-content)
}

.g-xs-col-4 {
    grid-column-end: span 4
}

.g-xs-row-4 {
    grid-row-end: span 4
}

.g-xs-5 {
    display: grid;
    grid-template-columns: repeat(5, max-content)
}

.g-xs-col-5 {
    grid-column-end: span 5
}

.g-xs-row-5 {
    grid-row-end: span 5
}

.g-xs-6 {
    display: grid;
    grid-template-columns: repeat(6, max-content)
}

.g-xs-col-6 {
    grid-column-end: span 6
}

.g-xs-row-6 {
    grid-row-end: span 6
}

.g-xs-7 {
    display: grid;
    grid-template-columns: repeat(7, max-content)
}

.g-xs-col-7 {
    grid-column-end: span 7
}

.g-xs-row-7 {
    grid-row-end: span 7
}

.g-xs-8 {
    display: grid;
    grid-template-columns: repeat(8, max-content)
}

.g-xs-col-8 {
    grid-column-end: span 8
}

.g-xs-row-8 {
    grid-row-end: span 8
}

.g-xs-9 {
    display: grid;
    grid-template-columns: repeat(9, max-content)
}

.g-xs-col-9 {
    grid-column-end: span 9
}

.g-xs-row-9 {
    grid-row-end: span 9
}

.g-xs-10 {
    display: grid;
    grid-template-columns: repeat(10, max-content)
}

.g-xs-col-10 {
    grid-column-end: span 10
}

.g-xs-row-10 {
    grid-row-end: span 10
}

.g-xs-11 {
    display: grid;
    grid-template-columns: repeat(11, max-content)
}

.g-xs-col-11 {
    grid-column-end: span 11
}

.g-xs-row-11 {
    grid-row-end: span 11
}

.g-xs-12 {
    display: grid;
    grid-template-columns: repeat(12, max-content)
}

.g-xs-col-12 {
    grid-column-end: span 12
}

.g-xs-row-12 {
    grid-row-end: span 12
}

.g-xs-start-1 {
    grid-column-start: 1
}

.g-xs-start-2 {
    grid-column-start: 2
}

.g-xs-start-3 {
    grid-column-start: 3
}

.g-xs-start-4 {
    grid-column-start: 4
}

.g-xs-start-5 {
    grid-column-start: 5
}

.g-xs-start-6 {
    grid-column-start: 6
}

.g-xs-start-7 {
    grid-column-start: 7
}

.g-xs-start-8 {
    grid-column-start: 8
}

.g-xs-start-9 {
    grid-column-start: 9
}

.g-xs-start-10 {
    grid-column-start: 10
}

.g-xs-start-11 {
    grid-column-start: 11
}

.g-xs-start-12 {
    grid-column-start: 12
}

.gap-row-xs-0 {
    row-gap: 0
}

.gap-col-xs-0 {
    -moz-column-gap: 0;
    column-gap: 0
}

.gap-row-xs-1 {
    row-gap: 0.25rem
}

.gap-col-xs-1 {
    -moz-column-gap: 0.25rem;
    column-gap: 0.25rem
}

.gap-row-xs-2 {
    row-gap: 0.5rem
}

.gap-col-xs-2 {
    -moz-column-gap: 0.5rem;
    column-gap: 0.5rem
}

.gap-row-xs-3 {
    row-gap: 1rem
}

.gap-col-xs-3 {
    -moz-column-gap: 1rem;
    column-gap: 1rem
}

.gap-row-xs-4 {
    row-gap: 1.5rem
}

.gap-col-xs-4 {
    -moz-column-gap: 1.5rem;
    column-gap: 1.5rem
}

.gap-row-xs-5 {
    row-gap: 3rem
}

.gap-col-xs-5 {
    -moz-column-gap: 3rem;
    column-gap: 3rem
}

@media(min-width: 576px) {
    .g-sm-2 {
        display: grid;
        grid-template-columns: repeat(2, max-content)
    }

    .g-sm-col-2 {
        grid-column-end: span 2
    }

    .g-sm-row-2 {
        grid-row-end: span 2
    }

    .g-sm-3 {
        display: grid;
        grid-template-columns: repeat(3, max-content)
    }

    .g-sm-col-3 {
        grid-column-end: span 3
    }

    .g-sm-row-3 {
        grid-row-end: span 3
    }

    .g-sm-4 {
        display: grid;
        grid-template-columns: repeat(4, max-content)
    }

    .g-sm-col-4 {
        grid-column-end: span 4
    }

    .g-sm-row-4 {
        grid-row-end: span 4
    }

    .g-sm-5 {
        display: grid;
        grid-template-columns: repeat(5, max-content)
    }

    .g-sm-col-5 {
        grid-column-end: span 5
    }

    .g-sm-row-5 {
        grid-row-end: span 5
    }

    .g-sm-6 {
        display: grid;
        grid-template-columns: repeat(6, max-content)
    }

    .g-sm-col-6 {
        grid-column-end: span 6
    }

    .g-sm-row-6 {
        grid-row-end: span 6
    }

    .g-sm-7 {
        display: grid;
        grid-template-columns: repeat(7, max-content)
    }

    .g-sm-col-7 {
        grid-column-end: span 7
    }

    .g-sm-row-7 {
        grid-row-end: span 7
    }

    .g-sm-8 {
        display: grid;
        grid-template-columns: repeat(8, max-content)
    }

    .g-sm-col-8 {
        grid-column-end: span 8
    }

    .g-sm-row-8 {
        grid-row-end: span 8
    }

    .g-sm-9 {
        display: grid;
        grid-template-columns: repeat(9, max-content)
    }

    .g-sm-col-9 {
        grid-column-end: span 9
    }

    .g-sm-row-9 {
        grid-row-end: span 9
    }

    .g-sm-10 {
        display: grid;
        grid-template-columns: repeat(10, max-content)
    }

    .g-sm-col-10 {
        grid-column-end: span 10
    }

    .g-sm-row-10 {
        grid-row-end: span 10
    }

    .g-sm-11 {
        display: grid;
        grid-template-columns: repeat(11, max-content)
    }

    .g-sm-col-11 {
        grid-column-end: span 11
    }

    .g-sm-row-11 {
        grid-row-end: span 11
    }

    .g-sm-12 {
        display: grid;
        grid-template-columns: repeat(12, max-content)
    }

    .g-sm-col-12 {
        grid-column-end: span 12
    }

    .g-sm-row-12 {
        grid-row-end: span 12
    }

    .g-sm-start-1 {
        grid-column-start: 1
    }

    .g-sm-start-2 {
        grid-column-start: 2
    }

    .g-sm-start-3 {
        grid-column-start: 3
    }

    .g-sm-start-4 {
        grid-column-start: 4
    }

    .g-sm-start-5 {
        grid-column-start: 5
    }

    .g-sm-start-6 {
        grid-column-start: 6
    }

    .g-sm-start-7 {
        grid-column-start: 7
    }

    .g-sm-start-8 {
        grid-column-start: 8
    }

    .g-sm-start-9 {
        grid-column-start: 9
    }

    .g-sm-start-10 {
        grid-column-start: 10
    }

    .g-sm-start-11 {
        grid-column-start: 11
    }

    .g-sm-start-12 {
        grid-column-start: 12
    }

    .gap-row-sm-0 {
        row-gap: 0
    }

    .gap-col-sm-0 {
        -moz-column-gap: 0;
        column-gap: 0
    }

    .gap-row-sm-1 {
        row-gap: 0.25rem
    }

    .gap-col-sm-1 {
        -moz-column-gap: 0.25rem;
        column-gap: 0.25rem
    }

    .gap-row-sm-2 {
        row-gap: 0.5rem
    }

    .gap-col-sm-2 {
        -moz-column-gap: 0.5rem;
        column-gap: 0.5rem
    }

    .gap-row-sm-3 {
        row-gap: 1rem
    }

    .gap-col-sm-3 {
        -moz-column-gap: 1rem;
        column-gap: 1rem
    }

    .gap-row-sm-4 {
        row-gap: 1.5rem
    }

    .gap-col-sm-4 {
        -moz-column-gap: 1.5rem;
        column-gap: 1.5rem
    }

    .gap-row-sm-5 {
        row-gap: 3rem
    }

    .gap-col-sm-5 {
        -moz-column-gap: 3rem;
        column-gap: 3rem
    }
}

@media(min-width: 768px) {
    .g-md-2 {
        display: grid;
        grid-template-columns: repeat(2, max-content)
    }

    .g-md-col-2 {
        grid-column-end: span 2
    }

    .g-md-row-2 {
        grid-row-end: span 2
    }

    .g-md-3 {
        display: grid;
        grid-template-columns: repeat(3, max-content)
    }

    .g-md-col-3 {
        grid-column-end: span 3
    }

    .g-md-row-3 {
        grid-row-end: span 3
    }

    .g-md-4 {
        display: grid;
        grid-template-columns: repeat(4, max-content)
    }

    .g-md-col-4 {
        grid-column-end: span 4
    }

    .g-md-row-4 {
        grid-row-end: span 4
    }

    .g-md-5 {
        display: grid;
        grid-template-columns: repeat(5, max-content)
    }

    .g-md-col-5 {
        grid-column-end: span 5
    }

    .g-md-row-5 {
        grid-row-end: span 5
    }

    .g-md-6 {
        display: grid;
        grid-template-columns: repeat(6, max-content)
    }

    .g-md-col-6 {
        grid-column-end: span 6
    }

    .g-md-row-6 {
        grid-row-end: span 6
    }

    .g-md-7 {
        display: grid;
        grid-template-columns: repeat(7, max-content)
    }

    .g-md-col-7 {
        grid-column-end: span 7
    }

    .g-md-row-7 {
        grid-row-end: span 7
    }

    .g-md-8 {
        display: grid;
        grid-template-columns: repeat(8, max-content)
    }

    .g-md-col-8 {
        grid-column-end: span 8
    }

    .g-md-row-8 {
        grid-row-end: span 8
    }

    .g-md-9 {
        display: grid;
        grid-template-columns: repeat(9, max-content)
    }

    .g-md-col-9 {
        grid-column-end: span 9
    }

    .g-md-row-9 {
        grid-row-end: span 9
    }

    .g-md-10 {
        display: grid;
        grid-template-columns: repeat(10, max-content)
    }

    .g-md-col-10 {
        grid-column-end: span 10
    }

    .g-md-row-10 {
        grid-row-end: span 10
    }

    .g-md-11 {
        display: grid;
        grid-template-columns: repeat(11, max-content)
    }

    .g-md-col-11 {
        grid-column-end: span 11
    }

    .g-md-row-11 {
        grid-row-end: span 11
    }

    .g-md-12 {
        display: grid;
        grid-template-columns: repeat(12, max-content)
    }

    .g-md-col-12 {
        grid-column-end: span 12
    }

    .g-md-row-12 {
        grid-row-end: span 12
    }

    .g-md-start-1 {
        grid-column-start: 1
    }

    .g-md-start-2 {
        grid-column-start: 2
    }

    .g-md-start-3 {
        grid-column-start: 3
    }

    .g-md-start-4 {
        grid-column-start: 4
    }

    .g-md-start-5 {
        grid-column-start: 5
    }

    .g-md-start-6 {
        grid-column-start: 6
    }

    .g-md-start-7 {
        grid-column-start: 7
    }

    .g-md-start-8 {
        grid-column-start: 8
    }

    .g-md-start-9 {
        grid-column-start: 9
    }

    .g-md-start-10 {
        grid-column-start: 10
    }

    .g-md-start-11 {
        grid-column-start: 11
    }

    .g-md-start-12 {
        grid-column-start: 12
    }

    .gap-row-md-0 {
        row-gap: 0
    }

    .gap-col-md-0 {
        -moz-column-gap: 0;
        column-gap: 0
    }

    .gap-row-md-1 {
        row-gap: 0.25rem
    }

    .gap-col-md-1 {
        -moz-column-gap: 0.25rem;
        column-gap: 0.25rem
    }

    .gap-row-md-2 {
        row-gap: 0.5rem
    }

    .gap-col-md-2 {
        -moz-column-gap: 0.5rem;
        column-gap: 0.5rem
    }

    .gap-row-md-3 {
        row-gap: 1rem
    }

    .gap-col-md-3 {
        -moz-column-gap: 1rem;
        column-gap: 1rem
    }

    .gap-row-md-4 {
        row-gap: 1.5rem
    }

    .gap-col-md-4 {
        -moz-column-gap: 1.5rem;
        column-gap: 1.5rem
    }

    .gap-row-md-5 {
        row-gap: 3rem
    }

    .gap-col-md-5 {
        -moz-column-gap: 3rem;
        column-gap: 3rem
    }
}

@media(min-width: 992px) {
    .g-lg-2 {
        display: grid;
        grid-template-columns: repeat(2, max-content)
    }

    .g-lg-col-2 {
        grid-column-end: span 2
    }

    .g-lg-row-2 {
        grid-row-end: span 2
    }

    .g-lg-3 {
        display: grid;
        grid-template-columns: repeat(3, max-content)
    }

    .g-lg-col-3 {
        grid-column-end: span 3
    }

    .g-lg-row-3 {
        grid-row-end: span 3
    }

    .g-lg-4 {
        display: grid;
        grid-template-columns: repeat(4, max-content)
    }

    .g-lg-col-4 {
        grid-column-end: span 4
    }

    .g-lg-row-4 {
        grid-row-end: span 4
    }

    .g-lg-5 {
        display: grid;
        grid-template-columns: repeat(5, max-content)
    }

    .g-lg-col-5 {
        grid-column-end: span 5
    }

    .g-lg-row-5 {
        grid-row-end: span 5
    }

    .g-lg-6 {
        display: grid;
        grid-template-columns: repeat(6, max-content)
    }

    .g-lg-col-6 {
        grid-column-end: span 6
    }

    .g-lg-row-6 {
        grid-row-end: span 6
    }

    .g-lg-7 {
        display: grid;
        grid-template-columns: repeat(7, max-content)
    }

    .g-lg-col-7 {
        grid-column-end: span 7
    }

    .g-lg-row-7 {
        grid-row-end: span 7
    }

    .g-lg-8 {
        display: grid;
        grid-template-columns: repeat(8, max-content)
    }

    .g-lg-col-8 {
        grid-column-end: span 8
    }

    .g-lg-row-8 {
        grid-row-end: span 8
    }

    .g-lg-9 {
        display: grid;
        grid-template-columns: repeat(9, max-content)
    }

    .g-lg-col-9 {
        grid-column-end: span 9
    }

    .g-lg-row-9 {
        grid-row-end: span 9
    }

    .g-lg-10 {
        display: grid;
        grid-template-columns: repeat(10, max-content)
    }

    .g-lg-col-10 {
        grid-column-end: span 10
    }

    .g-lg-row-10 {
        grid-row-end: span 10
    }

    .g-lg-11 {
        display: grid;
        grid-template-columns: repeat(11, max-content)
    }

    .g-lg-col-11 {
        grid-column-end: span 11
    }

    .g-lg-row-11 {
        grid-row-end: span 11
    }

    .g-lg-12 {
        display: grid;
        grid-template-columns: repeat(12, max-content)
    }

    .g-lg-col-12 {
        grid-column-end: span 12
    }

    .g-lg-row-12 {
        grid-row-end: span 12
    }

    .g-lg-start-1 {
        grid-column-start: 1
    }

    .g-lg-start-2 {
        grid-column-start: 2
    }

    .g-lg-start-3 {
        grid-column-start: 3
    }

    .g-lg-start-4 {
        grid-column-start: 4
    }

    .g-lg-start-5 {
        grid-column-start: 5
    }

    .g-lg-start-6 {
        grid-column-start: 6
    }

    .g-lg-start-7 {
        grid-column-start: 7
    }

    .g-lg-start-8 {
        grid-column-start: 8
    }

    .g-lg-start-9 {
        grid-column-start: 9
    }

    .g-lg-start-10 {
        grid-column-start: 10
    }

    .g-lg-start-11 {
        grid-column-start: 11
    }

    .g-lg-start-12 {
        grid-column-start: 12
    }

    .gap-row-lg-0 {
        row-gap: 0
    }

    .gap-col-lg-0 {
        -moz-column-gap: 0;
        column-gap: 0
    }

    .gap-row-lg-1 {
        row-gap: 0.25rem
    }

    .gap-col-lg-1 {
        -moz-column-gap: 0.25rem;
        column-gap: 0.25rem
    }

    .gap-row-lg-2 {
        row-gap: 0.5rem
    }

    .gap-col-lg-2 {
        -moz-column-gap: 0.5rem;
        column-gap: 0.5rem
    }

    .gap-row-lg-3 {
        row-gap: 1rem
    }

    .gap-col-lg-3 {
        -moz-column-gap: 1rem;
        column-gap: 1rem
    }

    .gap-row-lg-4 {
        row-gap: 1.5rem
    }

    .gap-col-lg-4 {
        -moz-column-gap: 1.5rem;
        column-gap: 1.5rem
    }

    .gap-row-lg-5 {
        row-gap: 3rem
    }

    .gap-col-lg-5 {
        -moz-column-gap: 3rem;
        column-gap: 3rem
    }
}

@media(min-width: 1200px) {
    .g-xl-2 {
        display: grid;
        grid-template-columns: repeat(2, max-content)
    }

    .g-xl-col-2 {
        grid-column-end: span 2
    }

    .g-xl-row-2 {
        grid-row-end: span 2
    }

    .g-xl-3 {
        display: grid;
        grid-template-columns: repeat(3, max-content)
    }

    .g-xl-col-3 {
        grid-column-end: span 3
    }

    .g-xl-row-3 {
        grid-row-end: span 3
    }

    .g-xl-4 {
        display: grid;
        grid-template-columns: repeat(4, max-content)
    }

    .g-xl-col-4 {
        grid-column-end: span 4
    }

    .g-xl-row-4 {
        grid-row-end: span 4
    }

    .g-xl-5 {
        display: grid;
        grid-template-columns: repeat(5, max-content)
    }

    .g-xl-col-5 {
        grid-column-end: span 5
    }

    .g-xl-row-5 {
        grid-row-end: span 5
    }

    .g-xl-6 {
        display: grid;
        grid-template-columns: repeat(6, max-content)
    }

    .g-xl-col-6 {
        grid-column-end: span 6
    }

    .g-xl-row-6 {
        grid-row-end: span 6
    }

    .g-xl-7 {
        display: grid;
        grid-template-columns: repeat(7, max-content)
    }

    .g-xl-col-7 {
        grid-column-end: span 7
    }

    .g-xl-row-7 {
        grid-row-end: span 7
    }

    .g-xl-8 {
        display: grid;
        grid-template-columns: repeat(8, max-content)
    }

    .g-xl-col-8 {
        grid-column-end: span 8
    }

    .g-xl-row-8 {
        grid-row-end: span 8
    }

    .g-xl-9 {
        display: grid;
        grid-template-columns: repeat(9, max-content)
    }

    .g-xl-col-9 {
        grid-column-end: span 9
    }

    .g-xl-row-9 {
        grid-row-end: span 9
    }

    .g-xl-10 {
        display: grid;
        grid-template-columns: repeat(10, max-content)
    }

    .g-xl-col-10 {
        grid-column-end: span 10
    }

    .g-xl-row-10 {
        grid-row-end: span 10
    }

    .g-xl-11 {
        display: grid;
        grid-template-columns: repeat(11, max-content)
    }

    .g-xl-col-11 {
        grid-column-end: span 11
    }

    .g-xl-row-11 {
        grid-row-end: span 11
    }

    .g-xl-12 {
        display: grid;
        grid-template-columns: repeat(12, max-content)
    }

    .g-xl-col-12 {
        grid-column-end: span 12
    }

    .g-xl-row-12 {
        grid-row-end: span 12
    }

    .g-xl-start-1 {
        grid-column-start: 1
    }

    .g-xl-start-2 {
        grid-column-start: 2
    }

    .g-xl-start-3 {
        grid-column-start: 3
    }

    .g-xl-start-4 {
        grid-column-start: 4
    }

    .g-xl-start-5 {
        grid-column-start: 5
    }

    .g-xl-start-6 {
        grid-column-start: 6
    }

    .g-xl-start-7 {
        grid-column-start: 7
    }

    .g-xl-start-8 {
        grid-column-start: 8
    }

    .g-xl-start-9 {
        grid-column-start: 9
    }

    .g-xl-start-10 {
        grid-column-start: 10
    }

    .g-xl-start-11 {
        grid-column-start: 11
    }

    .g-xl-start-12 {
        grid-column-start: 12
    }

    .gap-row-xl-0 {
        row-gap: 0
    }

    .gap-col-xl-0 {
        -moz-column-gap: 0;
        column-gap: 0
    }

    .gap-row-xl-1 {
        row-gap: 0.25rem
    }

    .gap-col-xl-1 {
        -moz-column-gap: 0.25rem;
        column-gap: 0.25rem
    }

    .gap-row-xl-2 {
        row-gap: 0.5rem
    }

    .gap-col-xl-2 {
        -moz-column-gap: 0.5rem;
        column-gap: 0.5rem
    }

    .gap-row-xl-3 {
        row-gap: 1rem
    }

    .gap-col-xl-3 {
        -moz-column-gap: 1rem;
        column-gap: 1rem
    }

    .gap-row-xl-4 {
        row-gap: 1.5rem
    }

    .gap-col-xl-4 {
        -moz-column-gap: 1.5rem;
        column-gap: 1.5rem
    }

    .gap-row-xl-5 {
        row-gap: 3rem
    }

    .gap-col-xl-5 {
        -moz-column-gap: 3rem;
        column-gap: 3rem
    }
}

@media(min-width: 1400px) {
    .g-xxl-2 {
        display: grid;
        grid-template-columns: repeat(2, max-content)
    }

    .g-xxl-col-2 {
        grid-column-end: span 2
    }

    .g-xxl-row-2 {
        grid-row-end: span 2
    }

    .g-xxl-3 {
        display: grid;
        grid-template-columns: repeat(3, max-content)
    }

    .g-xxl-col-3 {
        grid-column-end: span 3
    }

    .g-xxl-row-3 {
        grid-row-end: span 3
    }

    .g-xxl-4 {
        display: grid;
        grid-template-columns: repeat(4, max-content)
    }

    .g-xxl-col-4 {
        grid-column-end: span 4
    }

    .g-xxl-row-4 {
        grid-row-end: span 4
    }

    .g-xxl-5 {
        display: grid;
        grid-template-columns: repeat(5, max-content)
    }

    .g-xxl-col-5 {
        grid-column-end: span 5
    }

    .g-xxl-row-5 {
        grid-row-end: span 5
    }

    .g-xxl-6 {
        display: grid;
        grid-template-columns: repeat(6, max-content)
    }

    .g-xxl-col-6 {
        grid-column-end: span 6
    }

    .g-xxl-row-6 {
        grid-row-end: span 6
    }

    .g-xxl-7 {
        display: grid;
        grid-template-columns: repeat(7, max-content)
    }

    .g-xxl-col-7 {
        grid-column-end: span 7
    }

    .g-xxl-row-7 {
        grid-row-end: span 7
    }

    .g-xxl-8 {
        display: grid;
        grid-template-columns: repeat(8, max-content)
    }

    .g-xxl-col-8 {
        grid-column-end: span 8
    }

    .g-xxl-row-8 {
        grid-row-end: span 8
    }

    .g-xxl-9 {
        display: grid;
        grid-template-columns: repeat(9, max-content)
    }

    .g-xxl-col-9 {
        grid-column-end: span 9
    }

    .g-xxl-row-9 {
        grid-row-end: span 9
    }

    .g-xxl-10 {
        display: grid;
        grid-template-columns: repeat(10, max-content)
    }

    .g-xxl-col-10 {
        grid-column-end: span 10
    }

    .g-xxl-row-10 {
        grid-row-end: span 10
    }

    .g-xxl-11 {
        display: grid;
        grid-template-columns: repeat(11, max-content)
    }

    .g-xxl-col-11 {
        grid-column-end: span 11
    }

    .g-xxl-row-11 {
        grid-row-end: span 11
    }

    .g-xxl-12 {
        display: grid;
        grid-template-columns: repeat(12, max-content)
    }

    .g-xxl-col-12 {
        grid-column-end: span 12
    }

    .g-xxl-row-12 {
        grid-row-end: span 12
    }

    .g-xxl-start-1 {
        grid-column-start: 1
    }

    .g-xxl-start-2 {
        grid-column-start: 2
    }

    .g-xxl-start-3 {
        grid-column-start: 3
    }

    .g-xxl-start-4 {
        grid-column-start: 4
    }

    .g-xxl-start-5 {
        grid-column-start: 5
    }

    .g-xxl-start-6 {
        grid-column-start: 6
    }

    .g-xxl-start-7 {
        grid-column-start: 7
    }

    .g-xxl-start-8 {
        grid-column-start: 8
    }

    .g-xxl-start-9 {
        grid-column-start: 9
    }

    .g-xxl-start-10 {
        grid-column-start: 10
    }

    .g-xxl-start-11 {
        grid-column-start: 11
    }

    .g-xxl-start-12 {
        grid-column-start: 12
    }

    .gap-row-xxl-0 {
        row-gap: 0
    }

    .gap-col-xxl-0 {
        -moz-column-gap: 0;
        column-gap: 0
    }

    .gap-row-xxl-1 {
        row-gap: 0.25rem
    }

    .gap-col-xxl-1 {
        -moz-column-gap: 0.25rem;
        column-gap: 0.25rem
    }

    .gap-row-xxl-2 {
        row-gap: 0.5rem
    }

    .gap-col-xxl-2 {
        -moz-column-gap: 0.5rem;
        column-gap: 0.5rem
    }

    .gap-row-xxl-3 {
        row-gap: 1rem
    }

    .gap-col-xxl-3 {
        -moz-column-gap: 1rem;
        column-gap: 1rem
    }

    .gap-row-xxl-4 {
        row-gap: 1.5rem
    }

    .gap-col-xxl-4 {
        -moz-column-gap: 1.5rem;
        column-gap: 1.5rem
    }

    .gap-row-xxl-5 {
        row-gap: 3rem
    }

    .gap-col-xxl-5 {
        -moz-column-gap: 3rem;
        column-gap: 3rem
    }
}

/*# sourceMappingURL=app.min.css.map */