/* BOX SIZING */

.m-ui .border-box,
.m-ui .b-box {
    box-sizing: border-box !important;
    -webkit-box-sizing: border-box !important;
}
.m-ui .content-box,
.m-ui .c-box {
    box-sizing: content-box !important;
    -webkit-box-sizing: content-box !important;
}



/* OPACITY */

.m-ui .opacity-0  { opacity: 0 !important; }
.m-ui .opacity-0-1 { opacity: 0.1 !important; }
.m-ui .opacity-0-2 { opacity: 0.2 !important; }
.m-ui .opacity-0-3 { opacity: 0.3 !important; }
.m-ui .opacity-0-4 { opacity: 0.4 !important; }
.m-ui .opacity-0-5 { opacity: 0.5 !important; }
.m-ui .opacity-0-6 { opacity: 0.6 !important; }
.m-ui .opacity-0-7 { opacity: 0.7 !important; }
.m-ui .opacity-0-8 { opacity: 0.8 !important; }
.m-ui .opacity-0-9 { opacity: 0.9 !important; }
.m-ui .opacity-1  { opacity: 1 !important; }



/* CURSOR */

.m-ui .cursor-pointer,
.m-ui .c-pointer {
    cursor: pointer !important;
}
.m-ui .cursor-defaul,
.m-ui .c-defaul {
    cursor: defaul !important;
}
.m-ui .cursor-text,
.m-ui .c-text {
    cursor: text !important;
}



/* RADIUSES */

.m-ui .br-off,
.m-ui .br-none {
    border-radius: 0 !important;
}

/* Radiuses -> border-radiuses --- values from 0 to 50 px | pr */

.m-ui .br-0px { border-radius: 0px !important; } .m-ui .br-0pr { border-radius: 0% !important; }
.m-ui .br-1px { border-radius: 1px !important; } .m-ui .br-1pr { border-radius: 1% !important; }
.m-ui .br-2px { border-radius: 2px !important; } .m-ui .br-2pr { border-radius: 2% !important; }
.m-ui .br-3px { border-radius: 3px !important; } .m-ui .br-3pr { border-radius: 3% !important; }
.m-ui .br-4px { border-radius: 4px !important; } .m-ui .br-4pr { border-radius: 4% !important; }
.m-ui .br-5px { border-radius: 5px !important; } .m-ui .br-5pr { border-radius: 5% !important; }
.m-ui .br-6px { border-radius: 6px !important; } .m-ui .br-6pr { border-radius: 6% !important; }
.m-ui .br-7px { border-radius: 7px !important; } .m-ui .br-7pr { border-radius: 7% !important; }
.m-ui .br-8px { border-radius: 8px !important; } .m-ui .br-8pr { border-radius: 8% !important; }
.m-ui .br-9px { border-radius: 9px !important; } .m-ui .br-9pr { border-radius: 9% !important; }
.m-ui .br-10px { border-radius: 10px !important; } .m-ui .br-10pr { border-radius: 10% !important; }
.m-ui .br-11px { border-radius: 11px !important; } .m-ui .br-11pr { border-radius: 11% !important; }
.m-ui .br-12px { border-radius: 12px !important; } .m-ui .br-12pr { border-radius: 12% !important; }
.m-ui .br-13px { border-radius: 13px !important; } .m-ui .br-13pr { border-radius: 13% !important; }
.m-ui .br-14px { border-radius: 14px !important; } .m-ui .br-14pr { border-radius: 14% !important; }
.m-ui .br-15px { border-radius: 15px !important; } .m-ui .br-15pr { border-radius: 15% !important; }
.m-ui .br-16px { border-radius: 16px !important; } .m-ui .br-16pr { border-radius: 16% !important; }
.m-ui .br-17px { border-radius: 17px !important; } .m-ui .br-17pr { border-radius: 17% !important; }
.m-ui .br-18px { border-radius: 18px !important; } .m-ui .br-18pr { border-radius: 18% !important; }
.m-ui .br-19px { border-radius: 19px !important; } .m-ui .br-19pr { border-radius: 19% !important; }
.m-ui .br-20px { border-radius: 20px !important; } .m-ui .br-20pr { border-radius: 20% !important; }
.m-ui .br-21px { border-radius: 21px !important; } .m-ui .br-21pr { border-radius: 21% !important; }
.m-ui .br-22px { border-radius: 22px !important; } .m-ui .br-22pr { border-radius: 22% !important; }
.m-ui .br-23px { border-radius: 23px !important; } .m-ui .br-23pr { border-radius: 23% !important; }
.m-ui .br-24px { border-radius: 24px !important; } .m-ui .br-24pr { border-radius: 24% !important; }
.m-ui .br-25px { border-radius: 25px !important; } .m-ui .br-25pr { border-radius: 25% !important; }
.m-ui .br-26px { border-radius: 26px !important; } .m-ui .br-26pr { border-radius: 26% !important; }
.m-ui .br-27px { border-radius: 27px !important; } .m-ui .br-27pr { border-radius: 27% !important; }
.m-ui .br-28px { border-radius: 28px !important; } .m-ui .br-28pr { border-radius: 28% !important; }
.m-ui .br-29px { border-radius: 29px !important; } .m-ui .br-29pr { border-radius: 29% !important; }
.m-ui .br-30px { border-radius: 30px !important; } .m-ui .br-30pr { border-radius: 30% !important; }
.m-ui .br-31px { border-radius: 31px !important; } .m-ui .br-31pr { border-radius: 31% !important; }
.m-ui .br-32px { border-radius: 32px !important; } .m-ui .br-32pr { border-radius: 32% !important; }
.m-ui .br-33px { border-radius: 33px !important; } .m-ui .br-33pr { border-radius: 33% !important; }
.m-ui .br-34px { border-radius: 34px !important; } .m-ui .br-34pr { border-radius: 34% !important; }
.m-ui .br-35px { border-radius: 35px !important; } .m-ui .br-35pr { border-radius: 35% !important; }
.m-ui .br-36px { border-radius: 36px !important; } .m-ui .br-36pr { border-radius: 36% !important; }
.m-ui .br-37px { border-radius: 37px !important; } .m-ui .br-37pr { border-radius: 37% !important; }
.m-ui .br-38px { border-radius: 38px !important; } .m-ui .br-38pr { border-radius: 38% !important; }
.m-ui .br-39px { border-radius: 39px !important; } .m-ui .br-39pr { border-radius: 39% !important; }
.m-ui .br-40px { border-radius: 40px !important; } .m-ui .br-40pr { border-radius: 40% !important; }
.m-ui .br-41px { border-radius: 41px !important; } .m-ui .br-41pr { border-radius: 41% !important; }
.m-ui .br-42px { border-radius: 42px !important; } .m-ui .br-42pr { border-radius: 42% !important; }
.m-ui .br-43px { border-radius: 43px !important; } .m-ui .br-43pr { border-radius: 43% !important; }
.m-ui .br-44px { border-radius: 44px !important; } .m-ui .br-44pr { border-radius: 44% !important; }
.m-ui .br-45px { border-radius: 45px !important; } .m-ui .br-45pr { border-radius: 45% !important; }
.m-ui .br-46px { border-radius: 46px !important; } .m-ui .br-46pr { border-radius: 46% !important; }
.m-ui .br-47px { border-radius: 47px !important; } .m-ui .br-47pr { border-radius: 47% !important; }
.m-ui .br-48px { border-radius: 48px !important; } .m-ui .br-48pr { border-radius: 48% !important; }
.m-ui .br-49px { border-radius: 49px !important; } .m-ui .br-49pr { border-radius: 49% !important; }
.m-ui .br-50px { border-radius: 50px !important; } .m-ui .br-50pr { border-radius: 50% !important; }



/* BORDERS */

.m-ui .border-none,
.m-ui .border-off {
    border: none !important;
}

/* Border-style */

.m-ui .bt-solid { border-style: solid !important; }
.m-ui .bt-dashed { border-style: dashed !important; }


/* Border size */

/* Border size --- values from 0 to 10 px */

.m-ui .bw-0px, .m-ui .border-width-0px { border-width: 0px !important; border-style: solid;}
.m-ui .bw-1px, .m-ui .border-width-1px { border-width: 1px !important; border-style: solid;}
.m-ui .bw-2px, .m-ui .border-width-2px { border-width: 2px !important; border-style: solid;}
.m-ui .bw-3px, .m-ui .border-width-3px { border-width: 3px !important; border-style: solid;}
.m-ui .bw-4px, .m-ui .border-width-4px { border-width: 4px !important; border-style: solid;}
.m-ui .bw-5px, .m-ui .border-width-5px { border-width: 5px !important; border-style: solid;}
.m-ui .bw-6px, .m-ui .border-width-6px { border-width: 6px !important; border-style: solid;}
.m-ui .bw-7px, .m-ui .border-width-7px { border-width: 7px !important; border-style: solid;}
.m-ui .bw-8px, .m-ui .border-width-8px { border-width: 8px !important; border-style: solid;}
.m-ui .bw-9px, .m-ui .border-width-9px { border-width: 9px !important; border-style: solid;}
.m-ui .bw-10px, .m-ui .border-width-10px { border-width: 10px !important; border-style: solid;}

/* Border-top size --- values from 0 to 10 px */

.m-ui .bw-top-0px { border-top-width: 0px !important; border-style: solid;}
.m-ui .bw-top-1px { border-top-width: 1px !important; border-style: solid;}
.m-ui .bw-top-2px { border-top-width: 2px !important; border-style: solid;}
.m-ui .bw-top-3px { border-top-width: 3px !important; border-style: solid;}
.m-ui .bw-top-4px { border-top-width: 4px !important; border-style: solid;}
.m-ui .bw-top-5px { border-top-width: 5px !important; border-style: solid;}
.m-ui .bw-top-6px { border-top-width: 6px !important; border-style: solid;}
.m-ui .bw-top-7px { border-top-width: 7px !important; border-style: solid;}
.m-ui .bw-top-8px { border-top-width: 8px !important; border-style: solid;}
.m-ui .bw-top-9px { border-top-width: 9px !important; border-style: solid;}
.m-ui .bw-top-10px { border-top-width: 10px !important; border-style: solid;}

/* Border-bottom size --- values from 0 to 10 px */

.m-ui .bw-bottom-0px { border-bottom-width: 0px !important; border-style: solid;}
.m-ui .bw-bottom-1px { border-bottom-width: 1px !important; border-style: solid;}
.m-ui .bw-bottom-2px { border-bottom-width: 2px !important; border-style: solid;}
.m-ui .bw-bottom-3px { border-bottom-width: 3px !important; border-style: solid;}
.m-ui .bw-bottom-4px { border-bottom-width: 4px !important; border-style: solid;}
.m-ui .bw-bottom-5px { border-bottom-width: 5px !important; border-style: solid;}
.m-ui .bw-bottom-6px { border-bottom-width: 6px !important; border-style: solid;}
.m-ui .bw-bottom-7px { border-bottom-width: 7px !important; border-style: solid;}
.m-ui .bw-bottom-8px { border-bottom-width: 8px !important; border-style: solid;}
.m-ui .bw-bottom-9px { border-bottom-width: 9px !important; border-style: solid;}
.m-ui .bw-bottom-10px { border-bottom-width: 10px !important; border-style: solid;}

/* Border-right size --- values from 0 to 10 px */

.m-ui .bw-right-0px { border-right-width: 0px !important; border-style: solid;}
.m-ui .bw-right-1px { border-right-width: 1px !important; border-style: solid;}
.m-ui .bw-right-2px { border-right-width: 2px !important; border-style: solid;}
.m-ui .bw-right-3px { border-right-width: 3px !important; border-style: solid;}
.m-ui .bw-right-4px { border-right-width: 4px !important; border-style: solid;}
.m-ui .bw-right-5px { border-right-width: 5px !important; border-style: solid;}
.m-ui .bw-right-6px { border-right-width: 6px !important; border-style: solid;}
.m-ui .bw-right-7px { border-right-width: 7px !important; border-style: solid;}
.m-ui .bw-right-8px { border-right-width: 8px !important; border-style: solid;}
.m-ui .bw-right-9px { border-right-width: 9px !important; border-style: solid;}
.m-ui .bw-right-10px { border-right-width: 10px !important; border-style: solid;}

/* Border-left size --- values from 0 to 10 px */

.m-ui .bw-left-0px { border-left-width: 0px !important; border-style: solid;}
.m-ui .bw-left-1px { border-left-width: 1px !important; border-style: solid;}
.m-ui .bw-left-2px { border-left-width: 2px !important; border-style: solid;}
.m-ui .bw-left-3px { border-left-width: 3px !important; border-style: solid;}
.m-ui .bw-left-4px { border-left-width: 4px !important; border-style: solid;}
.m-ui .bw-left-5px { border-left-width: 5px !important; border-style: solid;}
.m-ui .bw-left-6px { border-left-width: 6px !important; border-style: solid;}
.m-ui .bw-left-7px { border-left-width: 7px !important; border-style: solid;}
.m-ui .bw-left-8px { border-left-width: 8px !important; border-style: solid;}
.m-ui .bw-left-9px { border-left-width: 9px !important; border-style: solid;}
.m-ui .bw-left-10px { border-left-width: 10px !important; border-style: solid;}

/* Border-color */

.m-ui .bc-transparent,
.m-ui .bc-none,
.m-ui .bc-off {
    background-color: transparent !important;
}

.m-ui .bc-white { border-color: var(--m-white) !important; }
.m-ui .bc-black { border-color: var(--m-black) !important; }

.m-ui .bc-grey { border-color: var(--m-grey) !important; }
.m-ui .bc-d-grey { border-color: var(--m-dark-grey) !important; }
.m-ui .bc-sd-grey { border-color: var(--m-semidark-grey) !important; }
.m-ui .bc-l-grey { border-color: var(--m-light-grey) !important; }
.m-ui .bc-sl-grey { border-color: var(--m-semilight-grey) !important; }
.m-ui .bc-red { border-color: var(--m-red) !important; }
.m-ui .bc-d-red { border-color: var(--m-dark-red) !important; }
.m-ui .bc-sd-red { border-color: var(--m-semidark-red) !important; }
.m-ui .bc-l-red { border-color: var(--m-light-red) !important; }
.m-ui .bc-sl-red { border-color: var(--m-semilight-red) !important; }
.m-ui .bc-pink { border-color: var(--m-pink) !important; }
.m-ui .bc-d-pink { border-color: var(--m-dark-pink) !important; }
.m-ui .bc-sd-pink { border-color: var(--m-semidark-pink) !important; }
.m-ui .bc-l-pink { border-color: var(--m-light-pink) !important; }
.m-ui .bc-sl-pink { border-color: var(--m-semilight-pink) !important; }
.m-ui .bc-purple { border-color: var(--m-purple) !important; }
.m-ui .bc-d-purple { border-color: var(--m-dark-purple) !important; }
.m-ui .bc-sd-purple { border-color: var(--m-semidark-purple) !important; }
.m-ui .bc-l-purple { border-color: var(--m-light-purple) !important; }
.m-ui .bc-sl-purple { border-color: var(--m-semilight-purple) !important; }
.m-ui .bc-violet { border-color: var(--m-violet) !important; }
.m-ui .bc-d-violet { border-color: var(--m-dark-violet) !important; }
.m-ui .bc-sd-violet { border-color: var(--m-semidark-violet) !important; }
.m-ui .bc-l-violet { border-color: var(--m-light-violet) !important; }
.m-ui .bc-sl-violet { border-color: var(--m-semilight-violet) !important; }
.m-ui .bc-sapphire { border-color: var(--m-sapphire) !important; }
.m-ui .bc-d-sapphire { border-color: var(--m-dark-sapphire) !important; }
.m-ui .bc-sd-sapphire { border-color: var(--m-semidark-sapphire) !important; }
.m-ui .bc-l-sapphire { border-color: var(--m-light-sapphire) !important; }
.m-ui .bc-sl-sapphire { border-color: var(--m-semilight-sapphire) !important; }
.m-ui .bc-blue { border-color: var(--m-blue) !important; }
.m-ui .bc-d-blue { border-color: var(--m-dark-blue) !important; }
.m-ui .bc-sd-blue { border-color: var(--m-semidark-blue) !important; }
.m-ui .bc-l-blue { border-color: var(--m-light-blue) !important; }
.m-ui .bc-sl-blue { border-color: var(--m-semilight-blue) !important; }
.m-ui .bc-turquoise { border-color: var(--m-turquoise) !important; }
.m-ui .bc-d-turquoise { border-color: var(--m-dark-turquoise) !important; }
.m-ui .bc-sd-turquoise { border-color: var(--m-semidark-turquoise) !important; }
.m-ui .bc-l-turquoise { border-color: var(--m-light-turquoise) !important; }
.m-ui .bc-sl-turquoise { border-color: var(--m-semilight-turquoise) !important; }
.m-ui .bc-teal { border-color: var(--m-teal) !important; }
.m-ui .bc-d-teal { border-color: var(--m-dark-teal) !important; }
.m-ui .bc-sd-teal { border-color: var(--m-semidark-teal) !important; }
.m-ui .bc-l-teal { border-color: var(--m-light-teal) !important; }
.m-ui .bc-sl-teal { border-color: var(--m-semilight-teal) !important; }
.m-ui .bc-green { border-color: var(--m-green) !important; }
.m-ui .bc-d-green { border-color: var(--m-dark-green) !important; }
.m-ui .bc-sd-green { border-color: var(--m-semidark-green) !important; }
.m-ui .bc-l-green { border-color: var(--m-light-green) !important; }
.m-ui .bc-sl-green { border-color: var(--m-semilight-green) !important; }
.m-ui .bc-yellow { border-color: var(--m-yellow) !important; }
.m-ui .bc-d-yellow { border-color: var(--m-dark-yellow) !important; }
.m-ui .bc-sd-yellow { border-color: var(--m-semidark-yellow) !important; }
.m-ui .bc-l-yellow { border-color: var(--m-light-yellow) !important; }
.m-ui .bc-sl-yellow { border-color: var(--m-semilight-yellow) !important; }
.m-ui .bc-orange { border-color: var(--m-orange) !important; }
.m-ui .bc-d-orange { border-color: var(--m-dark-orange) !important; }
.m-ui .bc-sd-orange { border-color: var(--m-semidark-orange) !important; }
.m-ui .bc-l-orange { border-color: var(--m-light-orange) !important; }
.m-ui .bc-sl-orange { border-color: var(--m-semilight-orange) !important; }
.m-ui .bc-pumpkin { border-color: var(--m-pumpkin) !important; }
.m-ui .bc-d-pumpkin { border-color: var(--m-dark-pumpkin) !important; }
.m-ui .bc-sd-pumpkin { border-color: var(--m-semidark-pumpkin) !important; }
.m-ui .bc-l-pumpkin { border-color: var(--m-light-pumpkin) !important; }
.m-ui .bc-sl-pumpkin { border-color: var(--m-semilight-pumpkin) !important; }



/* BACKGROUND */

.m-ui .bg-none,
.m-ui .bg-off {
    background: none !important;
}

/* Background --> Image */

.m-ui .bg-img {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

.m-ui .bg-img-fixed {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    background-attachment: fixed;
}

/* Background --> Image --> Repeat */

.m-ui .bg-repeat {
    background-repeat: repeat !important;
}
.m-ui .bg-repeat-x {
    background-repeat: repeat-x !important;
}
.m-ui .bg-repeat-y {
    background-repeat: repeat-y !important;
}
.m-ui .bg-norepeat,
.m-ui .bg-no-repeat {
    background-repeat: no-repeat !important;
}

/* Background --> Image --> Position */
.m-ui .bg-center {
    background-position: center !important;
}
.m-ui .bg-top {
    background-position: top center !important;
}
.m-ui .bg-right {
    background-position: center right !important;
}
.m-ui .bg-left {
    background-position: center left !important;
}
.m-ui .bg-bottom {
    background-position: bottom center !important;
}

.m-ui .bg-top-right,
.m-ui .bg-tr {
    background-position: top right !important;
}
.m-ui .bg-top-left,
.m-ui .bg-tl {
    background-position: top left !important;
}

.m-ui .bg-bottom-right,
.m-ui .bg-br {
    background-position: bottom right !important;
}
.m-ui .bg-bottom-left,
.m-ui .bg-bl {
    background-position: bottom left !important;
}



/* Background --> Image --> Size */

.m-ui .bg-cover {
    background-size: cover !important;
}
.m-ui .bg-contain {
    background-size: contain !important;
}

.m-ui .bg-0px { background-size: 0px !important; } .m-ui .bg-0pr { background-size: 0% !important; }
.m-ui .bg-5px { background-size: 5px !important; } .m-ui .bg-5pr { background-size: 5% !important; }
.m-ui .bg-10px { background-size: 10px !important; } .m-ui .bg-10pr { background-size: 10% !important; }
.m-ui .bg-15px { background-size: 15px !important; } .m-ui .bg-15pr { background-size: 15% !important; }
.m-ui .bg-20px { background-size: 20px !important; } .m-ui .bg-20pr { background-size: 20% !important; }
.m-ui .bg-25px { background-size: 25px !important; } .m-ui .bg-25pr { background-size: 25% !important; }
.m-ui .bg-30px { background-size: 30px !important; } .m-ui .bg-30pr { background-size: 30% !important; }
.m-ui .bg-35px { background-size: 35px !important; } .m-ui .bg-35pr { background-size: 35% !important; }
.m-ui .bg-40px { background-size: 40px !important; } .m-ui .bg-40pr { background-size: 40% !important; }
.m-ui .bg-45px { background-size: 45px !important; } .m-ui .bg-45pr { background-size: 45% !important; }
.m-ui .bg-50px { background-size: 50px !important; } .m-ui .bg-50pr { background-size: 50% !important; }
.m-ui .bg-55px { background-size: 55px !important; } .m-ui .bg-55pr { background-size: 55% !important; }
.m-ui .bg-60px { background-size: 60px !important; } .m-ui .bg-60pr { background-size: 60% !important; }
.m-ui .bg-65px { background-size: 65px !important; } .m-ui .bg-65pr { background-size: 65% !important; }
.m-ui .bg-70px { background-size: 70px !important; } .m-ui .bg-70pr { background-size: 70% !important; }
.m-ui .bg-75px { background-size: 75px !important; } .m-ui .bg-75pr { background-size: 75% !important; }
.m-ui .bg-80px { background-size: 80px !important; } .m-ui .bg-80pr { background-size: 80% !important; }
.m-ui .bg-85px { background-size: 85px !important; } .m-ui .bg-85pr { background-size: 85% !important; }
.m-ui .bg-90px { background-size: 90px !important; } .m-ui .bg-90pr { background-size: 90% !important; }
.m-ui .bg-95px { background-size: 95px !important; } .m-ui .bg-95pr { background-size: 95% !important; }
.m-ui .bg-100px { background-size: 100px !important; } .m-ui .bg-100pr { background-size: 100% !important; }



/* Background -> Color */

.m-ui .bg-transparent,
.m-ui .bg-color-none {
    background-color: transparent !important;
}

.m-ui .bg-white { background-color: var(--m-white) !important; }
.m-ui .bg-black { background-color: var(--m-black) !important; }

.m-ui .bg-grey { background-color: var(--m-grey) !important; }
.m-ui .bg-d-grey { background-color: var(--m-dark-grey) !important; }
.m-ui .bg-sd-grey { background-color: var(--m-semidark-grey) !important; }
.m-ui .bg-l-grey { background-color: var(--m-light-grey) !important; }
.m-ui .bg-sl-grey { background-color: var(--m-semilight-grey) !important; }
.m-ui .bg-ul-grey { background-color: var(--m-ultralight-grey) !important; }
.m-ui .bg-red { background-color: var(--m-red) !important; }
.m-ui .bg-d-red { background-color: var(--m-dark-red) !important; }
.m-ui .bg-sd-red { background-color: var(--m-semidark-red) !important; }
.m-ui .bg-l-red { background-color: var(--m-light-red) !important; }
.m-ui .bg-sl-red { background-color: var(--m-semilight-red) !important; }
.m-ui .bg-pink { background-color: var(--m-pink) !important; }
.m-ui .bg-d-pink { background-color: var(--m-dark-pink) !important; }
.m-ui .bg-sd-pink { background-color: var(--m-semidark-pink) !important; }
.m-ui .bg-l-pink { background-color: var(--m-light-pink) !important; }
.m-ui .bg-sl-pink { background-color: var(--m-semilight-pink) !important; }
.m-ui .bg-purple { background-color: var(--m-purple) !important; }
.m-ui .bg-d-purple { background-color: var(--m-dark-purple) !important; }
.m-ui .bg-sd-purple { background-color: var(--m-semidark-purple) !important; }
.m-ui .bg-l-purple { background-color: var(--m-light-purple) !important; }
.m-ui .bg-sl-purple { background-color: var(--m-semilight-purple) !important; }
.m-ui .bg-violet { background-color: var(--m-violet) !important; }
.m-ui .bg-d-violet { background-color: var(--m-dark-violet) !important; }
.m-ui .bg-sd-violet { background-color: var(--m-semidark-violet) !important; }
.m-ui .bg-l-violet { background-color: var(--m-light-violet) !important; }
.m-ui .bg-sl-violet { background-color: var(--m-semilight-violet) !important; }
.m-ui .bg-sapphire { background-color: var(--m-sapphire) !important; }
.m-ui .bg-d-sapphire { background-color: var(--m-dark-sapphire) !important; }
.m-ui .bg-sd-sapphire { background-color: var(--m-semidark-sapphire) !important; }
.m-ui .bg-l-sapphire { background-color: var(--m-light-sapphire) !important; }
.m-ui .bg-sl-sapphire { background-color: var(--m-semilight-sapphire) !important; }
.m-ui .bg-blue { background-color: var(--m-blue) !important; }
.m-ui .bg-d-blue { background-color: var(--m-dark-blue) !important; }
.m-ui .bg-sd-blue { background-color: var(--m-semidark-blue) !important; }
.m-ui .bg-l-blue { background-color: var(--m-light-blue) !important; }
.m-ui .bg-sl-blue { background-color: var(--m-semilight-blue) !important; }
.m-ui .bg-turquoise { background-color: var(--m-turquoise) !important; }
.m-ui .bg-d-turquoise { background-color: var(--m-dark-turquoise) !important; }
.m-ui .bg-sd-turquoise { background-color: var(--m-semidark-turquoise) !important; }
.m-ui .bg-l-turquoise { background-color: var(--m-light-turquoise) !important; }
.m-ui .bg-sl-turquoise { background-color: var(--m-semilight-turquoise) !important; }
.m-ui .bg-teal { background-color: var(--m-teal) !important; }
.m-ui .bg-d-teal { background-color: var(--m-dark-teal) !important; }
.m-ui .bg-sd-teal { background-color: var(--m-semidark-teal) !important; }
.m-ui .bg-l-teal { background-color: var(--m-light-teal) !important; }
.m-ui .bg-sl-teal { background-color: var(--m-semilight-teal) !important; }
.m-ui .bg-green { background-color: var(--m-green) !important; }
.m-ui .bg-d-green { background-color: var(--m-dark-green) !important; }
.m-ui .bg-sd-green { background-color: var(--m-semidark-green) !important; }
.m-ui .bg-l-green { background-color: var(--m-light-green) !important; }
.m-ui .bg-sl-green { background-color: var(--m-semilight-green) !important; }
.m-ui .bg-yellow { background-color: var(--m-yellow) !important; }
.m-ui .bg-d-yellow { background-color: var(--m-dark-yellow) !important; }
.m-ui .bg-sd-yellow { background-color: var(--m-semidark-yellow) !important; }
.m-ui .bg-l-yellow { background-color: var(--m-light-yellow) !important; }
.m-ui .bg-sl-yellow { background-color: var(--m-semilight-yellow) !important; }
.m-ui .bg-orange { background-color: var(--m-orange) !important; }
.m-ui .bg-d-orange { background-color: var(--m-dark-orange) !important; }
.m-ui .bg-sd-orange { background-color: var(--m-semidark-orange) !important; }
.m-ui .bg-l-orange { background-color: var(--m-light-orange) !important; }
.m-ui .bg-sl-orange { background-color: var(--m-semilight-orange) !important; }
.m-ui .bg-pumpkin { background-color: var(--m-pumpkin) !important; }
.m-ui .bg-d-pumpkin { background-color: var(--m-dark-pumpkin) !important; }
.m-ui .bg-sd-pumpkin { background-color: var(--m-semidark-pumpkin) !important; }
.m-ui .bg-l-pumpkin { background-color: var(--m-light-pumpkin) !important; }
.m-ui .bg-sl-pumpkin { background-color: var(--m-semilight-pumpkin) !important; }