.pointer-events-none{
    pointer-events: none;
}

.pointer-events-all{
    pointer-events: all;
}

.align-baseline {
    vertical-align: baseline
}

.align-top {
    vertical-align: top
}

.align-middle {
    vertical-align: middle
}

.align-bottom {
    vertical-align: bottom
}

.border {
    border-style: solid;
    border-width: var(--border-width)
}

.border-top {
    border-top-style: solid;
    border-top-width: var(--border-width)
}

.border-right {
    border-right-style: solid;
    border-right-width: var(--border-width)
}

.border-bottom {
    border-bottom-style: solid;
    border-bottom-width: var(--border-width)
}

.border-left {
    border-left-style: solid;
    border-left-width: var(--border-width)
}

.border-none {
    border: 0
}

.rounded {
    border-radius: var(--border-radius)
}

.circle {
    border-radius: 50%
}

.rounded-top {
    border-radius: var(--border-radius) var(--border-radius) 0 0
}

.rounded-right {
    border-radius: 0 var(--border-radius) var(--border-radius) 0
}

.rounded-bottom {
    border-radius: 0 0 var(--border-radius) var(--border-radius)
}

.rounded-left {
    border-radius: var(--border-radius) 0 0 var(--border-radius)
}

.not-rounded {
    border-radius: 0
}

.flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    flex-direction: row;
}

.flex-column {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}
.flex-column-reverse {
    display: flex;
    flex-direction: column-reverse
}
.flex-row-reverse {
    display: flex;
    flex-direction: row-reverse
}

.flex-wrap {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.gap1{gap: var(--space-1);}
.gap2{gap: var(--space-2);}
.gap3{gap: var(--space-3);}
.gap4{gap: var(--space-4);}

.items-start {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.items-end {
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end
}

.items-center {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.items-baseline {
    -webkit-box-align: baseline;
    -ms-flex-align: baseline;
    align-items: baseline
}

.items-stretch {
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch
}

.self-start {
    -ms-flex-item-align: start;
    align-self: flex-start
}

.self-end {
    -ms-flex-item-align: end;
    align-self: flex-end
}

.self-center {
    -ms-flex-item-align: center;
    align-self: center
}

.self-baseline {
    -ms-flex-item-align: baseline;
    align-self: baseline
}

.self-stretch {
    -ms-flex-item-align: stretch;
    align-self: stretch
}

.justify-start {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.justify-end {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.justify-center {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.justify-between {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.justify-around {
    -ms-flex-pack: distribute;
    justify-content: space-around
}

.justify-evenly {
    -webkit-box-pack: space-evenly;
    -ms-flex-pack: space-evenly;
    justify-content: space-evenly
}

.content-start {
    -ms-flex-line-pack: start;
    align-content: flex-start
}

.content-end {
    -ms-flex-line-pack: end;
    align-content: flex-end
}

.content-center {
    -ms-flex-line-pack: center;
    align-content: center
}

.content-between {
    -ms-flex-line-pack: justify;
    align-content: space-between
}

.content-around {
    -ms-flex-line-pack: distribute;
    align-content: space-around
}

.content-stretch {
    -ms-flex-line-pack: stretch;
    align-content: stretch
}

.flex-auto {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    min-width: 0;
    min-height: 0
}

.flex-none {
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none
}

.order-0 {
    -webkit-box-ordinal-group: 1;
    -ms-flex-order: 0;
    order: 0
}

.order-1 {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1
}

.order-2 {
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2
}

.order-3 {
    -webkit-box-ordinal-group: 4;
    -ms-flex-order: 3;
    order: 3
}

.order-last {
    -webkit-box-ordinal-group: 100000;
    -ms-flex-order: 99999;
    order: 99999
}

.col {
    float: left
}

.col,
.col-right {
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.col-right {
    float: right
}

.col-1 {
    width: 8.33333%
}

.col-2 {
    width: 16.66667%
}

.col-3 {
    width: 25%
}

.col-4 {
    width: 33.33333%
}

.col-5 {
    width: 41.66667%
}

.col-6 {
    width: 50%
}

.col-7 {
    width: 58.33333%
}

.col-8 {
    width: 66.66667%
}

.col-9 {
    width: 75%
}

.col-10 {
    width: 83.33333%
}

.col-11 {
    width: 91.66667%
}

.col-12 {
    width: 100%
}

.hide {
    display: none;
}

.display-none {
    display: none !important
}

.inline {
    display: inline
}

.block {
    display: block
}

.inline-block {
    display: inline-block
}

.table {
    display: table
}

.table-cell {
    display: table-cell
}

.overflow-hidden {
    overflow: hidden
}

.overflow-scroll {
    overflow: scroll
}

.overflow-auto {
    overflow: auto
}

.clearfix:after,
.clearfix:before {
    content: " ";
    display: table
}

.clearfix:after {
    clear: both
}

.left {
    float: left
}

.right {
    float: right
}

.fit {
    max-width: 100%
}

.max-width-1 {
    max-width: var(--width-1)
}

.max-width-2 {
    max-width: var(--width-2)
}

.max-width-3 {
    max-width: var(--width-3)
}

.max-width-4 {
    max-width: var(--width-4)
}
.max-width-5{
    max-width: var(--width-5)
}
.max-width-6{
    max-width: var(--width-6)
}

.border-box {
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.m0 {
    margin: 0
}

.mt0 {
    margin-top: 0
}

.mr0 {
    margin-right: 0
}

.mb0 {
    margin-bottom: 0
}

.ml0,
.mx0 {
    margin-left: 0
}

.mx0 {
    margin-right: 0
}

.my0 {
    margin-top: 0;
    margin-bottom: 0
}

.m1 {
    margin: var(--space-1)
}

.mt1 {
    margin-top: var(--space-1)
}

.mr1 {
    margin-right: var(--space-1)
}

.mb1 {
    margin-bottom: var(--space-1)
}

.ml1,
.mx1 {
    margin-left: var(--space-1)
}

.mx1 {
    margin-right: var(--space-1)
}

.my1 {
    margin-top: var(--space-1);
    margin-bottom: var(--space-1)
}

.m2 {
    margin: var(--space-2)
}

.mt2 {
    margin-top: var(--space-2)
}

.mr2 {
    margin-right: var(--space-2)
}

.mb2 {
    margin-bottom: var(--space-2)
}

.ml2,
.mx2 {
    margin-left: var(--space-2)
}

.mx2 {
    margin-right: var(--space-2)
}

.my2 {
    margin-top: var(--space-2);
    margin-bottom: var(--space-2)
}

.m3 {
    margin: var(--space-3)
}

.mt3 {
    margin-top: var(--space-3)
}

.mr3 {
    margin-right: var(--space-3)
}

.mb3 {
    margin-bottom: var(--space-3)
}

.ml3,
.mx3 {
    margin-left: var(--space-3)
}

.mx3 {
    margin-right: var(--space-3)
}

.my3 {
    margin-top: var(--space-3);
    margin-bottom: var(--space-3)
}

.m4 {
    margin: var(--space-4)
}

.mt4 {
    margin-top: var(--space-4)
}

.mr4 {
    margin-right: var(--space-4)
}

.mb4 {
    margin-bottom: var(--space-4)
}

.ml4,
.mx4 {
    margin-left: var(--space-4)
}

.mx4 {
    margin-right: var(--space-4)
}

.my4 {
    margin-top: var(--space-4);
    margin-bottom: var(--space-4)
}

.m5 {
    margin: var(--space-5)
}

.mt5 {
    margin-top: var(--space-5)
}

.mr5 {
    margin-right: var(--space-5)
}

.mb5 {
    margin-bottom: var(--space-5)
}

.ml5,
.mx5 {
    margin-left: var(--space-5)
}

.mx5 {
    margin-right: var(--space-5)
}

.my5 {
    margin-top: var(--space-5);
    margin-bottom: var(--space-5)
}

.mxn1 {
    margin-left: calc(var(--space-1)*-1);
    margin-right: calc(var(--space-1)*-1)
}

.mxn2 {
    margin-left: calc(var(--space-2)*-1);
    margin-right: calc(var(--space-2)*-1)
}

.mxn3 {
    margin-left: calc(var(--space-3)*-1);
    margin-right: calc(var(--space-3)*-1)
}

.mxn4 {
    margin-left: calc(var(--space-4)*-1);
    margin-right: calc(var(--space-4)*-1)
}

.m-auto {
    margin: auto
}

.mt-auto {
    margin-top: auto
}

.mr-auto {
    margin-right: auto
}

.mb-auto {
    margin-bottom: auto
}

.ml-auto,
.mx-auto {
    margin-left: auto
}

.mx-auto {
    margin-right: auto
}

.my-auto {
    margin-top: auto;
    margin-bottom: auto
}

.p0 {
    padding: 0
}

.pt0 {
    padding-top: 0
}

.pr0 {
    padding-right: 0
}

.pb0 {
    padding-bottom: 0
}

.pl0,
.px0 {
    padding-left: 0
}

.px0 {
    padding-right: 0
}

.py0 {
    padding-top: 0;
    padding-bottom: 0
}

.p1 {
    padding: var(--space-1)
}

.pt1 {
    padding-top: var(--space-1)
}

.pr1 {
    padding-right: var(--space-1)
}

.pb1 {
    padding-bottom: var(--space-1)
}

.pl1 {
    padding-left: var(--space-1)
}

.py1 {
    padding-top: var(--space-1);
    padding-bottom: var(--space-1)
}

.px1 {
    padding-left: var(--space-1);
    padding-right: var(--space-1)
}

.p2 {
    padding: var(--space-2)
}

.pt2 {
    padding-top: var(--space-2)
}

.pr2 {
    padding-right: var(--space-2)
}

.pb2 {
    padding-bottom: var(--space-2)
}

.pl2 {
    padding-left: var(--space-2)
}

.py2 {
    padding-top: var(--space-2);
    padding-bottom: var(--space-2)
}

.px2 {
    padding-left: var(--space-2);
    padding-right: var(--space-2)
}

.p3 {
    padding: var(--space-3)
}

.pt3 {
    padding-top: var(--space-3)
}

.pr3 {
    padding-right: var(--space-3)
}

.pb3 {
    padding-bottom: var(--space-3)
}

.pl3 {
    padding-left: var(--space-3)
}

.py3 {
    padding-top: var(--space-3);
    padding-bottom: var(--space-3)
}

.px3 {
    padding-left: var(--space-3);
    padding-right: var(--space-3)
}

.p4 {
    padding: var(--space-4)
}

.pt4 {
    padding-top: var(--space-4)
}

.pr4 {
    padding-right: var(--space-4)
}

.pb4 {
    padding-bottom: var(--space-4)
}

.pl4 {
    padding-left: var(--space-4)
}

.py4 {
    padding-top: var(--space-4);
    padding-bottom: var(--space-4)
}

.px4 {
    padding-left: var(--space-4);
    padding-right: var(--space-4)
}

.p5 {
    padding: var(--space-5)
}

.pt5 {
    padding-top: var(--space-5)
}

.pr5 {
    padding-right: var(--space-5)
}

.pb5 {
    padding-bottom: var(--space-5)
}

.pl5 {
    padding-left: var(--space-5)
}

.py5 {
    padding-top: var(--space-5);
    padding-bottom: var(--space-5)
}

.px5 {
    padding-left: var(--space-5);
    padding-right: var(--space-5)
}

.relative {
    position: relative
}

.absolute {
    position: absolute
}

.fixed {
    position: fixed
}

.top-0 {
    top: 0
}

.right-0 {
    right: 0
}

.bottom-0 {
    bottom: 0
}

.left-0 {
    left: 0
}

.z1 {
    z-index: var(--z1)
}

.z2 {
    z-index: var(--z2)
}

.z3 {
    z-index: var(--z3)
}

.z4 {
    z-index: var(--z4)
}

.h00 {
    font-size: var(--h00)
}

.h0 {
    font-size: var(--h0)
}

.h1 {
    font-size: var(--h1)
}

.h2 {
    font-size: var(--h2)
}

.h3 {
    font-size: var(--h3)
}

.h4 {
    font-size: var(--h4)
}

.h5 {
    font-size: var(--h5)
}

.h6 {
    font-size: var(--h6)
}

.h7 {
    font-size: var(--h7)
}

.font-family-inherit {
    font-family: inherit
}

.font-size-inherit {
    font-size: inherit
}

.text-decoration-none {
    text-decoration: none
}

.bold {
    font-weight: var(--bold-font-weight, bold)
}

.regular {
    font-weight: 400
}

.italic {
    font-style: italic
}

.caps {
    text-transform: uppercase;
    letter-spacing: var(--caps-letter-spacing)
}

.left-align {
    text-align: left
}

.center {
    text-align: center
}

.right-align {
    text-align: right
}

.justify {
    text-align: justify
}

.nowrap {
    white-space: nowrap
}

.break-word {
    word-wrap: break-word
}

.line-height-1 {
    line-height: var(--line-height-1)
}

.line-height-2 {
    line-height: var(--line-height-2)
}

.line-height-3 {
    line-height: var(--line-height-3)
}

.line-height-4 {
    line-height: var(--line-height-4)
}

.list-style-none {
    list-style: none
}

.underline {
    text-decoration: underline
}

.truncate {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.list-reset {
    list-style: none;
    padding-left: 0
}

.cover {
    -o-object-fit: cover;
    object-fit: cover
}

.contain {
    -o-object-fit: contain;
    object-fit: contain
}


@media (min-width:40em) {
    .sm-flex {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        flex-direction: row;
    }
    .sm-flex-column{
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        flex-direction: column;
    }
    .sm-flex-column-reverse{
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        flex-direction: column-reverse;
    }
    .sm-flex-row-reverse{
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        flex-direction: row-reverse;
    }

    .sm-col {
        float: left
    }

    .sm-col,
    .sm-col-right {
        -webkit-box-sizing: border-box;
        box-sizing: border-box
    }

    .sm-col-right {
        float: right
    }

    .sm-col-1 {
        width: 8.33333%
    }

    .sm-col-2 {
        width: 16.66667%
    }

    .sm-col-3 {
        width: 25%
    }

    .sm-col-4 {
        width: 33.33333%
    }

    .sm-col-5 {
        width: 41.66667%
    }

    .sm-col-6 {
        width: 50%
    }

    .sm-col-7 {
        width: 58.33333%
    }

    .sm-col-8 {
        width: 66.66667%
    }

    .sm-col-9 {
        width: 75%
    }

    .sm-col-10 {
        width: 83.33333%
    }

    .sm-col-11 {
        width: 91.66667%
    }

    .sm-col-12 {
        width: 100%
    }

    .sm-border {
        border-style: solid;
        border-width: var(--border-width)
    }

    .sm-border-top {
        border-top-style: solid;
        border-top-width: var(--border-width)
    }

    .sm-border-right {
        border-right-style: solid;
        border-right-width: var(--border-width)
    }

    .sm-border-bottom {
        border-bottom-style: solid;
        border-bottom-width: var(--border-width)
    }

    .sm-border-left {
        border-left-style: solid;
        border-left-width: var(--border-width)
    }

    .sm-border-none {
        border: 0
    }

    .sm-border-top-none {
        border-top: 0
    }

    .sm-border-right-none {
        border-right: 0
    }

    .sm-border-bottom-none {
        border-bottom: 0
    }

    .sm-border-left-none {
        border-left: 0
    }

    .sm-rounded {
        border-radius: var(--border-radius)
    }

    .sm-circle {
        border-radius: 50%
    }

    .sm-rounded-top {
        border-radius: var(--border-radius) var(--border-radius) 0 0
    }

    .sm-rounded-right {
        border-radius: 0 var(--border-radius) var(--border-radius) 0
    }

    .sm-rounded-bottom {
        border-radius: 0 0 var(--border-radius) var(--border-radius)
    }

    .sm-rounded-left {
        border-radius: var(--border-radius) 0 0 var(--border-radius)
    }

    .sm-not-rounded {
        border-radius: 0
    }

    .sm-inline {
        display: inline
    }

    .sm-block {
        display: block
    }

    .sm-inline-block {
        display: inline-block
    }

    .sm-table {
        display: table
    }

    .sm-table-cell {
        display: table-cell
    }

    .sm-overflow-hidden {
        overflow: hidden
    }

    .sm-overflow-scroll {
        overflow: scroll
    }

    .sm-overflow-auto {
        overflow: auto
    }

    .sm-left {
        float: left
    }

    .sm-right {
        float: right
    }

    .sm-m0 {
        margin: 0
    }

    .sm-mt0 {
        margin-top: 0
    }

    .sm-mr0 {
        margin-right: 0
    }

    .sm-mb0 {
        margin-bottom: 0
    }

    .sm-ml0,
    .sm-mx0 {
        margin-left: 0
    }

    .sm-mx0 {
        margin-right: 0
    }

    .sm-my0 {
        margin-top: 0;
        margin-bottom: 0
    }

    .sm-m1 {
        margin: var(--space-1)
    }

    .sm-mt1 {
        margin-top: var(--space-1)
    }

    .sm-mr1 {
        margin-right: var(--space-1)
    }

    .sm-mb1 {
        margin-bottom: var(--space-1)
    }

    .sm-ml1,
    .sm-mx1 {
        margin-left: var(--space-1)
    }

    .sm-mx1 {
        margin-right: var(--space-1)
    }

    .sm-my1 {
        margin-top: var(--space-1);
        margin-bottom: var(--space-1)
    }

    .sm-m2 {
        margin: var(--space-2)
    }

    .sm-mt2 {
        margin-top: var(--space-2)
    }

    .sm-mr2 {
        margin-right: var(--space-2)
    }

    .sm-mb2 {
        margin-bottom: var(--space-2)
    }

    .sm-ml2,
    .sm-mx2 {
        margin-left: var(--space-2)
    }

    .sm-mx2 {
        margin-right: var(--space-2)
    }

    .sm-my2 {
        margin-top: var(--space-2);
        margin-bottom: var(--space-2)
    }

    .sm-m3 {
        margin: var(--space-3)
    }

    .sm-mt3 {
        margin-top: var(--space-3)
    }

    .sm-mr3 {
        margin-right: var(--space-3)
    }

    .sm-mb3 {
        margin-bottom: var(--space-3)
    }

    .sm-ml3,
    .sm-mx3 {
        margin-left: var(--space-3)
    }

    .sm-mx3 {
        margin-right: var(--space-3)
    }

    .sm-my3 {
        margin-top: var(--space-3);
        margin-bottom: var(--space-3)
    }

    .sm-m4 {
        margin: var(--space-4)
    }

    .sm-mt4 {
        margin-top: var(--space-4)
    }

    .sm-mr4 {
        margin-right: var(--space-4)
    }

    .sm-mb4 {
        margin-bottom: var(--space-4)
    }

    .sm-ml4,
    .sm-mx4 {
        margin-left: var(--space-4)
    }

    .sm-mx4 {
        margin-right: var(--space-4)
    }

    .sm-my4 {
        margin-top: var(--space-4);
        margin-bottom: var(--space-4)
    }

    .sm-m5 {
        margin: var(--space-5)
    }
    
    .sm-mt5 {
        margin-top: var(--space-5)
    }
    
    .sm-mr5 {
        margin-right: var(--space-5)
    }
    
    .sm-mb5 {
        margin-bottom: var(--space-5)
    }
    
    .sm-ml5,
    .sm-mx5 {
        margin-left: var(--space-5)
    }
    
    .sm-mx5 {
        margin-right: var(--space-5)
    }
    
    .sm-my5 {
        margin-top: var(--space-5);
        margin-bottom: var(--space-5)
    }
    

    .sm-mxn1 {
        margin-left: -var(--space-1);
        margin-right: -var(--space-1)
    }

    .sm-mxn2 {
        margin-left: -var(--space-2);
        margin-right: -var(--space-2)
    }

    .sm-mxn3 {
        margin-left: -var(--space-3);
        margin-right: -var(--space-3)
    }

    .sm-mxn4 {
        margin-left: -var(--space-4);
        margin-right: -var(--space-4)
    }

    .sm-ml-auto {
        margin-left: auto
    }

    .sm-mr-auto,
    .sm-mx-auto {
        margin-right: auto
    }

    .sm-mx-auto {
        margin-left: auto
    }

    .sm-p0 {
        padding: 0
    }

    .sm-pt0 {
        padding-top: 0
    }

    .sm-pr0 {
        padding-right: 0
    }

    .sm-pb0 {
        padding-bottom: 0
    }

    .sm-pl0,
    .sm-px0 {
        padding-left: 0
    }

    .sm-px0 {
        padding-right: 0
    }

    .sm-py0 {
        padding-top: 0;
        padding-bottom: 0
    }

    .sm-p1 {
        padding: var(--space-1)
    }

    .sm-pt1 {
        padding-top: var(--space-1)
    }

    .sm-pr1 {
        padding-right: var(--space-1)
    }

    .sm-pb1 {
        padding-bottom: var(--space-1)
    }

    .sm-pl1,
    .sm-px1 {
        padding-left: var(--space-1)
    }

    .sm-px1 {
        padding-right: var(--space-1)
    }

    .sm-py1 {
        padding-top: var(--space-1);
        padding-bottom: var(--space-1)
    }

    .sm-p2 {
        padding: var(--space-2)
    }

    .sm-pt2 {
        padding-top: var(--space-2)
    }

    .sm-pr2 {
        padding-right: var(--space-2)
    }

    .sm-pb2 {
        padding-bottom: var(--space-2)
    }

    .sm-pl2,
    .sm-px2 {
        padding-left: var(--space-2)
    }

    .sm-px2 {
        padding-right: var(--space-2)
    }

    .sm-py2 {
        padding-top: var(--space-2);
        padding-bottom: var(--space-2)
    }

    .sm-p3 {
        padding: var(--space-3)
    }

    .sm-pt3 {
        padding-top: var(--space-3)
    }

    .sm-pr3 {
        padding-right: var(--space-3)
    }

    .sm-pb3 {
        padding-bottom: var(--space-3)
    }

    .sm-pl3,
    .sm-px3 {
        padding-left: var(--space-3)
    }

    .sm-px3 {
        padding-right: var(--space-3)
    }

    .sm-py3 {
        padding-top: var(--space-3);
        padding-bottom: var(--space-3)
    }

    .sm-p4 {
        padding: var(--space-4)
    }

    .sm-pt4 {
        padding-top: var(--space-4)
    }

    .sm-pr4 {
        padding-right: var(--space-4)
    }

    .sm-pb4 {
        padding-bottom: var(--space-4)
    }

    .sm-pl4,
    .sm-px4 {
        padding-left: var(--space-4)
    }

    .sm-px4 {
        padding-right: var(--space-4)
    }

    .sm-py4 {
        padding-top: var(--space-4);
        padding-bottom: var(--space-4)
    }

    .sm-p5 {
        padding: var(--space-5)
    }
    
    .sm-pt5 {
        padding-top: var(--space-5)
    }
    
    .sm-pr5 {
        padding-right: var(--space-5)
    }
    
    .sm-pb5 {
        padding-bottom: var(--space-5)
    }
    
    .sm-pl5 {
        padding-left: var(--space-5)
    }
    
    .sm-py5 {
        padding-top: var(--space-5);
        padding-bottom: var(--space-5)
    }
    
    .sm-px5 {
        padding-left: var(--space-5);
        padding-right: var(--space-5)
    }

    .sm-relative {
        position: relative
    }

    .sm-absolute {
        position: absolute
    }

    .sm-fixed {
        position: fixed
    }

    .sm-top-0 {
        top: 0
    }

    .sm-right-0 {
        right: 0
    }

    .sm-bottom-0 {
        bottom: 0
    }

    .sm-left-0 {
        left: 0
    }

    .sm-h00 {
        font-size: var(--h00)
    }

    .sm-h0 {
        font-size: var(--h0)
    }

    .sm-h1 {
        font-size: var(--h1)
    }

    .sm-h2 {
        font-size: var(--h2)
    }

    .sm-h3 {
        font-size: var(--h3)
    }

    .sm-h4 {
        font-size: var(--h4)
    }

    .sm-h5 {
        font-size: var(--h5)
    }

    .sm-h6 {
        font-size: var(--h6)
    }

    .sm-h7 {
        font-size: var(--h7)
    }

    .sm-left-align {
        text-align: left
    }

    .sm-center {
        text-align: center
    }

    .sm-right-align {
        text-align: right
    }

    .sm-justify {
        text-align: justify
    }

    .sm-hide {
        display: none !important
    }

    .sm-mt-auto {
        margin-top: auto;
    }

    .sm-mb-auto {
        margin-bottom: auto;
    }

    .sm-mr-auto {
        margin-right: auto;
    }

    .sm-ml-auto {
        margin-left: auto;
    }
}

@media (min-width:52em) {
    .md-hide {
        display: none !important
    }

    .md-flex {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        flex-direction: row;
    }
    .md-flex-column{
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        flex-direction: column;
    }
    .md-flex-column-reverse{
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        flex-direction: column-reverse;
    }
    .md-flex-row-reverse{
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        flex-direction: row-reverse;
    }

    .md-col {
        float: left
    }

    .md-col,
    .md-col-right {
        -webkit-box-sizing: border-box;
        box-sizing: border-box
    }

    .md-col-right {
        float: right
    }

    .md-col-1 {
        width: 8.33333%
    }

    .md-col-2 {
        width: 16.66667%
    }

    .md-col-3 {
        width: 25%
    }

    .md-col-4 {
        width: 33.33333%
    }

    .md-col-5 {
        width: 41.66667%
    }

    .md-col-6 {
        width: 50%
    }

    .md-col-7 {
        width: 58.33333%
    }

    .md-col-8 {
        width: 66.66667%
    }

    .md-col-9 {
        width: 75%
    }

    .md-col-10 {
        width: 83.33333%
    }

    .md-col-11 {
        width: 91.66667%
    }

    .md-col-12 {
        width: 100%
    }

    .md-border {
        border-style: solid;
        border-width: var(--border-width)
    }

    .md-border-top {
        border-top-style: solid;
        border-top-width: var(--border-width)
    }

    .md-border-right {
        border-right-style: solid;
        border-right-width: var(--border-width)
    }

    .md-border-bottom {
        border-bottom-style: solid;
        border-bottom-width: var(--border-width)
    }

    .md-border-left {
        border-left-style: solid;
        border-left-width: var(--border-width)
    }

    .md-border-none {
        border: 0
    }

    .md-border-top-none {
        border-top: 0
    }

    .md-border-right-none {
        border-right: 0
    }

    .md-border-bottom-none {
        border-bottom: 0
    }

    .md-border-left-none {
        border-left: 0
    }

    .md-rounded {
        border-radius: var(--border-radius)
    }

    .md-circle {
        border-radius: 50%
    }

    .md-rounded-top {
        border-radius: var(--border-radius) var(--border-radius) 0 0
    }

    .md-rounded-right {
        border-radius: 0 var(--border-radius) var(--border-radius) 0
    }

    .md-rounded-bottom {
        border-radius: 0 0 var(--border-radius) var(--border-radius)
    }

    .md-rounded-left {
        border-radius: var(--border-radius) 0 0 var(--border-radius)
    }

    .md-not-rounded {
        border-radius: 0
    }

    .md-inline {
        display: inline
    }

    .md-block {
        display: block
    }

    .md-inline-block {
        display: inline-block
    }

    .md-table {
        display: table
    }

    .md-table-cell {
        display: table-cell
    }

    .md-overflow-hidden {
        overflow: hidden
    }

    .md-overflow-scroll {
        overflow: scroll
    }

    .md-overflow-auto {
        overflow: auto
    }

    .md-left {
        float: left
    }

    .md-right {
        float: right
    }

    .md-m0 {
        margin: 0
    }

    .md-mt0 {
        margin-top: 0
    }

    .md-mr0 {
        margin-right: 0
    }

    .md-mb0 {
        margin-bottom: 0
    }

    .md-ml0,
    .md-mx0 {
        margin-left: 0
    }

    .md-mx0 {
        margin-right: 0
    }

    .md-my0 {
        margin-top: 0;
        margin-bottom: 0
    }

    .md-m1 {
        margin: var(--space-1)
    }

    .md-mt1 {
        margin-top: var(--space-1)
    }

    .md-mr1 {
        margin-right: var(--space-1)
    }

    .md-mb1 {
        margin-bottom: var(--space-1)
    }

    .md-ml1,
    .md-mx1 {
        margin-left: var(--space-1)
    }

    .md-mx1 {
        margin-right: var(--space-1)
    }

    .md-my1 {
        margin-top: var(--space-1);
        margin-bottom: var(--space-1)
    }

    .md-m2 {
        margin: var(--space-2)
    }

    .md-mt2 {
        margin-top: var(--space-2)
    }

    .md-mr2 {
        margin-right: var(--space-2)
    }

    .md-mb2 {
        margin-bottom: var(--space-2)
    }

    .md-ml2,
    .md-mx2 {
        margin-left: var(--space-2)
    }

    .md-mx2 {
        margin-right: var(--space-2)
    }

    .md-my2 {
        margin-top: var(--space-2);
        margin-bottom: var(--space-2)
    }

    .md-m3 {
        margin: var(--space-3)
    }

    .md-mt3 {
        margin-top: var(--space-3)
    }

    .md-mr3 {
        margin-right: var(--space-3)
    }

    .md-mb3 {
        margin-bottom: var(--space-3)
    }

    .md-ml3,
    .md-mx3 {
        margin-left: var(--space-3)
    }

    .md-mx3 {
        margin-right: var(--space-3)
    }

    .md-my3 {
        margin-top: var(--space-3);
        margin-bottom: var(--space-3)
    }

    .md-m4 {
        margin: var(--space-4)
    }

    .md-mt4 {
        margin-top: var(--space-4)
    }

    .md-mr4 {
        margin-right: var(--space-4)
    }

    .md-mb4 {
        margin-bottom: var(--space-4)
    }

    .md-ml4,
    .md-mx4 {
        margin-left: var(--space-4)
    }

    .md-mx4 {
        margin-right: var(--space-4)
    }

    .md-my4 {
        margin-top: var(--space-4);
        margin-bottom: var(--space-4)
    }

    .md-m5 {
        margin: var(--space-5)
    }
    
    .md-mt5 {
        margin-top: var(--space-5)
    }
    
    .md-mr5 {
        margin-right: var(--space-5)
    }
    
    .md-mb5 {
        margin-bottom: var(--space-5)
    }
    
    .md-ml5,
    .md-mx5 {
        margin-left: var(--space-5)
    }
    
    .md-mx5 {
        margin-right: var(--space-5)
    }
    
    .md-my5 {
        margin-top: var(--space-5);
        margin-bottom: var(--space-5)
    }

    .md-mxn1 {
        margin-left: -var(--space-1);
        margin-right: -var(--space-1)
    }

    .md-mxn2 {
        margin-left: -var(--space-2);
        margin-right: -var(--space-2)
    }

    .md-mxn3 {
        margin-left: -var(--space-3);
        margin-right: -var(--space-3)
    }

    .md-mxn4 {
        margin-left: -var(--space-4);
        margin-right: -var(--space-4)
    }

    .md-ml-auto {
        margin-left: auto
    }

    .md-mr-auto,
    .md-mx-auto {
        margin-right: auto
    }

    .md-mx-auto {
        margin-left: auto
    }

    .md-p0 {
        padding: 0
    }

    .md-pt0 {
        padding-top: 0
    }

    .md-pr0 {
        padding-right: 0
    }

    .md-pb0 {
        padding-bottom: 0
    }

    .md-pl0,
    .md-px0 {
        padding-left: 0
    }

    .md-px0 {
        padding-right: 0
    }

    .md-py0 {
        padding-top: 0;
        padding-bottom: 0
    }

    .md-p1 {
        padding: var(--space-1)
    }

    .md-pt1 {
        padding-top: var(--space-1)
    }

    .md-pr1 {
        padding-right: var(--space-1)
    }

    .md-pb1 {
        padding-bottom: var(--space-1)
    }

    .md-pl1,
    .md-px1 {
        padding-left: var(--space-1)
    }

    .md-px1 {
        padding-right: var(--space-1)
    }

    .md-py1 {
        padding-top: var(--space-1);
        padding-bottom: var(--space-1)
    }

    .md-p2 {
        padding: var(--space-2)
    }

    .md-pt2 {
        padding-top: var(--space-2)
    }

    .md-pr2 {
        padding-right: var(--space-2)
    }

    .md-pb2 {
        padding-bottom: var(--space-2)
    }

    .md-pl2,
    .md-px2 {
        padding-left: var(--space-2)
    }

    .md-px2 {
        padding-right: var(--space-2)
    }

    .md-py2 {
        padding-top: var(--space-2);
        padding-bottom: var(--space-2)
    }

    .md-p3 {
        padding: var(--space-3)
    }

    .md-pt3 {
        padding-top: var(--space-3)
    }

    .md-pr3 {
        padding-right: var(--space-3)
    }

    .md-pb3 {
        padding-bottom: var(--space-3)
    }

    .md-pl3,
    .md-px3 {
        padding-left: var(--space-3)
    }

    .md-px3 {
        padding-right: var(--space-3)
    }

    .md-py3 {
        padding-top: var(--space-3);
        padding-bottom: var(--space-3)
    }

    .md-p4 {
        padding: var(--space-4)
    }

    .md-pt4 {
        padding-top: var(--space-4)
    }

    .md-pr4 {
        padding-right: var(--space-4)
    }

    .md-pb4 {
        padding-bottom: var(--space-4)
    }

    .md-pl4,
    .md-px4 {
        padding-left: var(--space-4)
    }

    .md-px4 {
        padding-right: var(--space-4)
    }

    .md-py4 {
        padding-top: var(--space-4);
        padding-bottom: var(--space-4)
    }

    .md-p5 {
        padding: var(--space-5)
    }
    
    .md-pt5 {
        padding-top: var(--space-5)
    }
    
    .md-pr5 {
        padding-right: var(--space-5)
    }
    
    .md-pb5 {
        padding-bottom: var(--space-5)
    }
    
    .md-pl5 {
        padding-left: var(--space-5)
    }
    
    .md-py5 {
        padding-top: var(--space-5);
        padding-bottom: var(--space-5)
    }
    
    .md-px5 {
        padding-left: var(--space-5);
        padding-right: var(--space-5)
    }

    .md-relative {
        position: relative
    }

    .md-absolute {
        position: absolute
    }

    .md-fixed {
        position: fixed
    }

    .md-top-0 {
        top: 0
    }

    .md-right-0 {
        right: 0
    }

    .md-bottom-0 {
        bottom: 0
    }

    .md-left-0 {
        left: 0
    }

    .md-h00 {
        font-size: var(--h00)
    }

    .md-h0 {
        font-size: var(--h0)
    }

    .md-h1 {
        font-size: var(--h1)
    }

    .md-h2 {
        font-size: var(--h2)
    }

    .md-h3 {
        font-size: var(--h3)
    }

    .md-h4 {
        font-size: var(--h4)
    }

    .md-h5 {
        font-size: var(--h5)
    }

    .md-h6 {
        font-size: var(--h6)
    }

    .md-h7 {
        font-size: var(--h7)
    }

    .md-left-align {
        text-align: left
    }

    .md-center {
        text-align: center
    }

    .md-right-align {
        text-align: right
    }

    .md-justify {
        text-align: justify
    }

    .md-mt-auto {
        margin-top: auto;
    }
    
    .md-mb-auto {
        margin-bottom: auto;
    }
    
    .md-mr-auto {
        margin-right: auto;
    }
    
    .md-ml-auto {
        margin-left: auto;
    }
}

@media (min-width:64em) {
    .lg-flex {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        flex-direction: row;
    }
    .lg-flex-column{
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        flex-direction: column;
    }
    .lg-flex-column-reverse{
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        flex-direction: column-reverse;
    }
    .lg-flex-row-reverse{
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        flex-direction: row-reverse;
    }

    .lg-col {
        float: left
    }

    .lg-col,
    .lg-col-right {
        -webkit-box-sizing: border-box;
        box-sizing: border-box
    }

    .lg-col-right {
        float: right
    }

    .lg-col-1 {
        width: 8.33333%
    }

    .lg-col-2 {
        width: 16.66667%
    }

    .lg-col-3 {
        width: 25%
    }

    .lg-col-4 {
        width: 33.33333%
    }

    .lg-col-5 {
        width: 41.66667%
    }

    .lg-col-6 {
        width: 50%
    }

    .lg-col-7 {
        width: 58.33333%
    }

    .lg-col-8 {
        width: 66.66667%
    }

    .lg-col-9 {
        width: 75%
    }

    .lg-col-10 {
        width: 83.33333%
    }

    .lg-col-11 {
        width: 91.66667%
    }

    .lg-col-12 {
        width: 100%
    }

    .lg-hide {
        display: none !important
    }

    .lg-border {
        border-style: solid;
        border-width: var(--border-width)
    }

    .lg-border-top {
        border-top-style: solid;
        border-top-width: var(--border-width)
    }

    .lg-border-right {
        border-right-style: solid;
        border-right-width: var(--border-width)
    }

    .lg-border-bottom {
        border-bottom-style: solid;
        border-bottom-width: var(--border-width)
    }

    .lg-border-left {
        border-left-style: solid;
        border-left-width: var(--border-width)
    }

    .lg-border-none {
        border: 0
    }

    .lg-border-top-none {
        border-top: 0
    }

    .lg-border-right-none {
        border-right: 0
    }

    .lg-border-bottom-none {
        border-bottom: 0
    }

    .lg-border-left-none {
        border-left: 0
    }

    .lg-rounded {
        border-radius: var(--border-radius)
    }

    .lg-circle {
        border-radius: 50%
    }

    .lg-rounded-top {
        border-radius: var(--border-radius) var(--border-radius) 0 0
    }

    .lg-rounded-right {
        border-radius: 0 var(--border-radius) var(--border-radius) 0
    }

    .lg-rounded-bottom {
        border-radius: 0 0 var(--border-radius) var(--border-radius)
    }

    .lg-rounded-left {
        border-radius: var(--border-radius) 0 0 var(--border-radius)
    }

    .lg-not-rounded {
        border-radius: 0
    }

    .lg-inline {
        display: inline
    }

    .lg-block {
        display: block
    }

    .lg-inline-block {
        display: inline-block
    }

    .lg-table {
        display: table
    }

    .lg-table-cell {
        display: table-cell
    }

    .lg-overflow-hidden {
        overflow: hidden
    }

    .lg-overflow-scroll {
        overflow: scroll
    }

    .lg-overflow-auto {
        overflow: auto
    }

    .lg-left {
        float: left
    }

    .lg-right {
        float: right
    }

    .lg-m0 {
        margin: 0
    }

    .lg-mt0 {
        margin-top: 0
    }

    .lg-mr0 {
        margin-right: 0
    }

    .lg-mb0 {
        margin-bottom: 0
    }

    .lg-ml0,
    .lg-mx0 {
        margin-left: 0
    }

    .lg-mx0 {
        margin-right: 0
    }

    .lg-my0 {
        margin-top: 0;
        margin-bottom: 0
    }

    .lg-m1 {
        margin: var(--space-1)
    }

    .lg-mt1 {
        margin-top: var(--space-1)
    }

    .lg-mr1 {
        margin-right: var(--space-1)
    }

    .lg-mb1 {
        margin-bottom: var(--space-1)
    }

    .lg-ml1,
    .lg-mx1 {
        margin-left: var(--space-1)
    }

    .lg-mx1 {
        margin-right: var(--space-1)
    }

    .lg-my1 {
        margin-top: var(--space-1);
        margin-bottom: var(--space-1)
    }

    .lg-m2 {
        margin: var(--space-2)
    }

    .lg-mt2 {
        margin-top: var(--space-2)
    }

    .lg-mr2 {
        margin-right: var(--space-2)
    }

    .lg-mb2 {
        margin-bottom: var(--space-2)
    }

    .lg-ml2,
    .lg-mx2 {
        margin-left: var(--space-2)
    }

    .lg-mx2 {
        margin-right: var(--space-2)
    }

    .lg-my2 {
        margin-top: var(--space-2);
        margin-bottom: var(--space-2)
    }

    .lg-m3 {
        margin: var(--space-3)
    }

    .lg-mt3 {
        margin-top: var(--space-3)
    }

    .lg-mr3 {
        margin-right: var(--space-3)
    }

    .lg-mb3 {
        margin-bottom: var(--space-3)
    }

    .lg-ml3,
    .lg-mx3 {
        margin-left: var(--space-3)
    }

    .lg-mx3 {
        margin-right: var(--space-3)
    }

    .lg-my3 {
        margin-top: var(--space-3);
        margin-bottom: var(--space-3)
    }

    .lg-m4 {
        margin: var(--space-4)
    }

    .lg-mt4 {
        margin-top: var(--space-4)
    }

    .lg-mr4 {
        margin-right: var(--space-4)
    }

    .lg-mb4 {
        margin-bottom: var(--space-4)
    }

    .lg-ml4,
    .lg-mx4 {
        margin-left: var(--space-4)
    }

    .lg-mx4 {
        margin-right: var(--space-4)
    }

    .lg-my4 {
        margin-top: var(--space-4);
        margin-bottom: var(--space-4)
    }

    .lg-m5 {
        margin: var(--space-5)
    }
    
    .lg-mt5 {
        margin-top: var(--space-5)
    }
    
    .lg-mr5 {
        margin-right: var(--space-5)
    }
    
    .lg-mb5 {
        margin-bottom: var(--space-5)
    }
    
    .lg-ml5,
    .lg-mx5 {
        margin-left: var(--space-5)
    }
    
    .lg-mx5 {
        margin-right: var(--space-5)
    }
    
    .lg-my5 {
        margin-top: var(--space-5);
        margin-bottom: var(--space-5)
    }

    .lg-mxn1 {
        margin-left: -var(--space-1);
        margin-right: -var(--space-1)
    }

    .lg-mxn2 {
        margin-left: -var(--space-2);
        margin-right: -var(--space-2)
    }

    .lg-mxn3 {
        margin-left: -var(--space-3);
        margin-right: -var(--space-3)
    }

    .lg-mxn4 {
        margin-left: -var(--space-4);
        margin-right: -var(--space-4)
    }

    .lg-ml-auto {
        margin-left: auto
    }

    .lg-mr-auto,
    .lg-mx-auto {
        margin-right: auto
    }

    .lg-mx-auto {
        margin-left: auto
    }

    .lg-p0 {
        padding: 0
    }

    .lg-pt0 {
        padding-top: 0
    }

    .lg-pr0 {
        padding-right: 0
    }

    .lg-pb0 {
        padding-bottom: 0
    }

    .lg-pl0,
    .lg-px0 {
        padding-left: 0
    }

    .lg-px0 {
        padding-right: 0
    }

    .lg-py0 {
        padding-top: 0;
        padding-bottom: 0
    }

    .lg-p1 {
        padding: var(--space-1)
    }

    .lg-pt1 {
        padding-top: var(--space-1)
    }

    .lg-pr1 {
        padding-right: var(--space-1)
    }

    .lg-pb1 {
        padding-bottom: var(--space-1)
    }

    .lg-pl1,
    .lg-px1 {
        padding-left: var(--space-1)
    }

    .lg-px1 {
        padding-right: var(--space-1)
    }

    .lg-py1 {
        padding-top: var(--space-1);
        padding-bottom: var(--space-1)
    }

    .lg-p2 {
        padding: var(--space-2)
    }

    .lg-pt2 {
        padding-top: var(--space-2)
    }

    .lg-pr2 {
        padding-right: var(--space-2)
    }

    .lg-pb2 {
        padding-bottom: var(--space-2)
    }

    .lg-pl2,
    .lg-px2 {
        padding-left: var(--space-2)
    }

    .lg-px2 {
        padding-right: var(--space-2)
    }

    .lg-py2 {
        padding-top: var(--space-2);
        padding-bottom: var(--space-2)
    }

    .lg-p3 {
        padding: var(--space-3)
    }

    .lg-pt3 {
        padding-top: var(--space-3)
    }

    .lg-pr3 {
        padding-right: var(--space-3)
    }

    .lg-pb3 {
        padding-bottom: var(--space-3)
    }

    .lg-pl3,
    .lg-px3 {
        padding-left: var(--space-3)
    }

    .lg-px3 {
        padding-right: var(--space-3)
    }

    .lg-py3 {
        padding-top: var(--space-3);
        padding-bottom: var(--space-3)
    }

    .lg-p4 {
        padding: var(--space-4)
    }

    .lg-pt4 {
        padding-top: var(--space-4)
    }

    .lg-pr4 {
        padding-right: var(--space-4)
    }

    .lg-pb4 {
        padding-bottom: var(--space-4)
    }

    .lg-pl4,
    .lg-px4 {
        padding-left: var(--space-4)
    }

    .lg-px4 {
        padding-right: var(--space-4)
    }

    .lg-py4 {
        padding-top: var(--space-4);
        padding-bottom: var(--space-4)
    }

    .lg-p5 {
        padding: var(--space-5)
    }
    
    .lg-pt5 {
        padding-top: var(--space-5)
    }
    
    .lg-pr5 {
        padding-right: var(--space-5)
    }
    
    .lg-pb5 {
        padding-bottom: var(--space-5)
    }
    
    .lg-pl5 {
        padding-left: var(--space-5)
    }
    
    .lg-py5 {
        padding-top: var(--space-5);
        padding-bottom: var(--space-5)
    }
    
    .lg-px5 {
        padding-left: var(--space-5);
        padding-right: var(--space-5)
    }

    .lg-relative {
        position: relative
    }

    .lg-absolute {
        position: absolute
    }

    .lg-fixed {
        position: fixed
    }

    .lg-top-0 {
        top: 0
    }

    .lg-right-0 {
        right: 0
    }

    .lg-bottom-0 {
        bottom: 0
    }

    .lg-left-0 {
        left: 0
    }

    .lg-h00 {
        font-size: var(--h00)
    }

    .lg-h0 {
        font-size: var(--h0)
    }

    .lg-h1 {
        font-size: var(--h1)
    }

    .lg-h2 {
        font-size: var(--h2)
    }

    .lg-h3 {
        font-size: var(--h3)
    }

    .lg-h4 {
        font-size: var(--h4)
    }

    .lg-h5 {
        font-size: var(--h5)
    }

    .lg-h6 {
        font-size: var(--h6)
    }

    .lg-h7 {
        font-size: var(--h7)
    }

    .lg-left-align {
        text-align: left
    }

    .lg-center {
        text-align: center
    }

    .lg-right-align {
        text-align: right
    }

    .lg-justify {
        text-align: justify
    }

    .lg-mt-auto {
        margin-top: auto;
    }
    
    .lg-mb-auto {
        margin-bottom: auto;
    }
    
    .lg-mr-auto {
        margin-right: auto;
    }
    
    .lg-ml-auto {
        margin-left: auto;
    }
}