/* ==========================================================================
   # WIDTHS
   ========================================================================== */

/**
 * Utility classes to set grid widths on specific items
 */
.u-mw--mc {
    max-width: max-content !important;
}

.u-w--small {
    width: min(36rem, 100%) !important;
}

.u-w--medium {
    width: min(48rem, 100%) !important;
}

.u-w--large {
    width: min(64rem, 100%) !important;
}

.u-w--xlarge {
    width: min(80rem, 100%) !important;
}

.u-w--xxlarge {
    width: min(96rem, 100%) !important;
}

.u-mw--medium {
    max-width: 48rem;
}

.u-1\/4 {
    width: 25% !important;
}

.u-1\/2 {
    width: 50% !important;
}

.u-3\/4 {
    width: 75% !important;
}

.u-1\/1 {
    width: 100% !important;
}


/**
 * max width
 */
.u-max-1\/2 {
    max-width: 50% !important;
}