:root {
    --position-xs: 2px;
    --position-s: 4px;
    --position-m: 8px;
    --position-l: 12px;
    --position-xl: 16px;
    --position-xxl: 32px;
    --position-xxxl: 64px;
}


/*ins-border*/

[class*="ins-border"] {
    --ins-border-width: 1px;
    border: 0 solid var(--border)!important;
    border-width: var(--ins-border-width) !important;
}

.ins-border-xs {
    --ins-border-width: 1px;
    border-width: var(--ins-border-width) !important;
}

.ins-border-s {
    --ins-border-width: 2px;
    border-width: var(--ins-border-width) !important;
}

.ins-border-m {
    --ins-border-width: 4px;
    border-width: var(--ins-border-width)!important;
}

.ins-border-l {
    --ins-border-width: 6px;
    border-width: var(--ins-border-width)!important;
}

.ins-border-xl {
    --ins-border-width: 10px;
    border-width: var(--ins-border-width)!important;
}

.ins-border-xxl {
    --ins-border-width: 15px;
    border-width: var(--ins-border-width)!important;
}

.ins-border-xxxl {
    --ins-border-width: 20px;
    border-width: var(--ins-border-width)!important;
}

.ins-border-xxxxl {
    --ins-border-width: 30px;
    border-width: var(--ins-border-width)!important;
}

.ins-border {
    border-width: var(--ins-border-width)!important;
}

.ins-border-h {
    border-bottom-width: 0;
    border-top-width: 0;
    border-right-width: var(--ins-border-width);
    border-left-width: var(--ins-border-width);
}

.ins-border-v {
    border-right-width: 0;
    border-left-width: 0;
    border-top-width: var(--ins-border-width);
    border-top-width: var(--ins-border-width);
}

.ins-border-right {
    border-bottom-width: 0;
    border-top-width: 0;
    border-right-width: 0;
    border-left-width: 0;
    border-right-width: var(--ins-border-width);
}

.ins-border-left {
    border-bottom-width: 0;
    border-top-width: 0;
    border-right-width: 0;
    border-left-width: 0;
    border-left-width: var(--ins-border-width);
}

.ins-border-top {
    border-bottom-width: 0;
    border-right-width: 0;
    border-left-width: 0;
    border-top-width: var(--ins-border-width);
}

.ins-border-bottom {
    border-top-width: 0;
    border-right-width: 0;
    border-left-width: 0;
    border-bottom-width: var(--ins-border-width);
}

.ins-border-o {
    border: 0 !important;
}

.ins-border-right-o {
    border-right-width: 0 !important;
}

.ins-border-left-o {
    border-left-width: 0 !important;
}

.ins-border-top-o {
    border-top-width: 0 !important;
}

.ins-border-bottom-o {
    border-top-width: 0 !important;
}


/** Padding */

.ins-padding-xs {
    padding: var(--position-s);
}

.ins-padding-s {
    padding: var(--position-s);
}

.ins-padding-m {
    padding: var(--position-m);
}

.ins-padding-l {
    padding: var(--position-l) !important;
}

.ins-padding-xl {
    padding: var(--position-xl);
}

.ins-padding-xxl {
    padding: var(--position-xxl);
}

.ins-padding-xxxl {
    padding: var(--position-xxxl);
}

.ins-padding-top {
    padding-bottom: 0;
    padding-left: 0;
    padding-right: 0;
}

.ins-padding-bottom {
    padding-top: 0;
    padding-left: 0;
    padding-right: 0;
}

.ins-padding-left {
    padding-top: 0;
    padding-bottom: 0;
    padding-right: 0;
}

.ins-padding-right {
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 0;
}

.ins-padding-o {
    padding: 0 !important;
}

.ins-padding-h-o {
    padding-left: 0;
    padding-right: 0;
}

.ins-padding-v-o {
    padding-top: 0;
    padding-bottom: 0;
}

.ins-padding-h {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.ins-padding-v {
    padding-left: 0;
    padding-right: 0;
}

.ins-padding-bottom-o {
    padding-bottom: 0;
}

.ins-padding-right-o {
    padding-right: 0;
}

.ins-padding-top-o {
    padding-top: 0;
}

.ins-padding-left-o {
    padding-left: 0;
}


/** Padding-end */


/** margin-end */

.ins-margin-s {
    margin: var(--position-s) !important;
}

.ins-margin-m {
    margin: var(--position-m) !important;
}

.ins-margin-l {
    margin: var(--position-l) !important;
}

.ins-margin-xl {
    margin: var(--position-xl) !important;
}

.ins-margin-xxl {
    margin: var(--position-xxl) !important;
}

.ins-margin-xxxl {
    margin: var(--position-xxxl) !important;
}

.ins-margin-o {
    margin: 0 !important;
}

.ins-margin-h-o {
    margin-left: 0;
    margin-right: 0;
}

.ins-margin-v-o {
    margin-top: 0;
    margin-bottom: 0;
}

.ins-margin-top {
    margin-bottom: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.ins-margin-bottom {
    margin-top: 0;
    margin-left: 0;
    margin-right: 0;
}

.ins-margin-left {
    margin-top: 0;
    margin-bottom: 0;
    margin-right: 0;
}

.ins-margin-right {
    margin-top: 0;
    margin-bottom: 0;
    margin-left: 0;
}

.ins-margin-h {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

.ins-margin-v {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.ins-margin-bottom-o {
    margin-bottom: 0;
}

.ins-margin-right-o {
    margin-right: 0;
}

.ins-margin-top-o {
    margin-top: 0;
}

.ins-margin-left-o {
    margin-left: 0;
}


/**ins-margin-end */


/**ins-border */


/**ins-font-end */

.ins-font-xs {
    font-size: 3px !important;
}

.ins-font-s {
    font-size: 6px !important;
}

.ins-font-m {
    font-size: 12px !important;
}

.ins-font-l {
    font-size: 18px !important;
}

.ins-font-xl {
    font-size: 24px !important;
}

.ins-font-xxl {
    font-size: 32px !important;
}

.ins-font-xxxl {
    font-size: 40px !important;
}

.ins-font-xxxxl {
    font-size: 60px !important;
}


/**ins-font-end */


/** Radius */

.ins-radius-s {
    border-radius: var(--ins-radius-s) !important;
}

.ins-radius-m {
    border-radius: var(--ins-radius-s) !important;
}

.ins-radius-l {
    border-radius: var(--ins-radius-l) !important;
}

.ins-radius-xl {
    border-radius: var(--ins-radius-xl) !important;
}

.ins-radius-xxl {
    border-radius: var(--ins-radius-xxl) !important;
}

.ins-radius-xxl {
    border-radius: var(--ins-radius-xxl) !important;
}

.ins-radius-xxxl {
    border-radius: var(--ins-radius-xxxl) !important;
}

.ins-radius-o {
    border-radius: 0;
}

.ins-radius-top-o {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.ins-radius-bottom-o {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

.ins-radius-left-o {
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
}

.ins-radius-right-o {
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

.ins-radius-top {
    border-bottom-left-radius: 0!important;
    border-bottom-right-radius: 0!important;
}

.ins-radius-bottom {
    border-top-left-radius: 0!important;
    border-top-right-radius: 0!important;
}

.ins-radius-left {
    border-top-right-radius: 0!important;
    border-bottom-right-radius: 0!important;
}

.ins-radius-right {
    border-top-left-radius: 0!important;
    border-bottom-left-radius: 0!important;
}

.ins-radius-bottom-left-o {
    border-bottom-left-radius: 0!important;
}

.ins-radius-bottom-right-o {
    border-bottom-right-radius: 0!important;
}

.ins-radius-top-right-o {
    border-top-right-radius: 0 !important;
}

.ins-radius-top-left-o {
    border-top-left-radius: 0 !important;
}

.border-bottom-left {
    border-bottom-right-radius: 0;
    border-top-right-radius: 0;
    border-top-left-radius: 0;
}

.ins-radius-bottom-right {
    border-bottom-left-radius: 0;
    border-top-right-radius: 0;
    border-top-left-radius: 0;
}

.ins-radius-top-right {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    border-top-left-radius: 0;
}

.ins-radius-top-left {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    border-top-right-radius: 0;
}

.ins-radius-top-right-x {
    border-top-left-radius: 0;
    border-bottom-right-radius: 0;
}

.ins-radius-top-left-x {
    border-top-right-radius: 0;
    border-bottom-left-radius: 0;
}

.ins-line-height-xs {
    line-height: 0.5;
}

.ins-line-height-s {
    line-height: 0.7;
}

.ins-line-height-m {
    line-height: 1;
}

.ins-line-height-l {
    line-height: 1.5;
}

.ins-line-height-xl {
    line-height: 2;
}

.ins-line-height-xxl {
    line-height: 3;
}

.ins-line-height-xxxl {
    line-height: 4;
}

.ins-line-height-xxxxl {
    line-height: 5;
}