/*  ==========================================================================
    UTILITIES
    ========================================================================== */


/*
    Display
    ==================================== */


.u-inline                   { display: inline !important; }
.u-inlineBlock              { display: inline-block !important; _display:inline !important; *display:inline !important; zoom: 1; }
.u-block                    { display: block !important; }
.u-table                    { display: table !important; }
.u-tableCell                { display: table-cell !important; }


/*
    Layout
    ==================================== */


.u-cf:before, .u-cf:after   { content: " "; display: table; }
.u-cf:after                 { clear: both; }
.u-nbfc                     { overflow: hidden; }
.u-nbfcAlt                  { display: table-cell; width: 10000px; }
.u-pullLeft                 { float: left !important; _display: inline !important; }
.u-pullRight                { float: right !important; _display: inline !important; }
.u-objLeft                  { float: left !important; margin-right: 10px; }
.u-objRight                 { float: right !important; margin-left: 10px; }
.u-objLeft img, .u-objRight img
                            { display: block; max-width: none; }
.u-objectCenter             { margin: 0 auto; }
.u-alignTop                 { vertical-align: top !important; }
.u-alignMiddle              { vertical-align: middle !important; }
.u-alignBaseline            { vertical-align: baseline !important; }
.u-alignBottom              { vertical-align: bottom !important; }

.u-positionStatic           { position: static !important; }


/*
    Dimensions
    ==================================== */


.u-sizeFit                  { display: block; float: left; width: auto !important; }
.u-sizeFill                 { display: block; overflow: hidden; width: auto !important; }
.u-sizeFillAlt              { display: table-cell; max-width: 100%; width: 10000px; }
.u-sizeFull                 { display: block; width: 100%; }



/*
    State
    ==================================== */


.u-isHidden                 { display: none !important; visibility: hidden !important; }
.u-isHiddenVisually         { position: absolute !important; overflow: hidden; width: 1px; height: 1px; border: 0; clip: rect(1px,1px,1px,1px); padding: 0; }
.u-isVisible                { visibility: visible; }
.u-isInvisible              { visibility: hidden; }
.u-isActionable             { cursor: pointer; }
.u-isDraggable              { cursor: move; }
.u-isDisabled               { cursor: default; }
.u-isLoading                { opacity: .6; }
html.js .js-isHidden        { display: none; }



/*
    Text and Fonts
    ==================================== */


.u-textTruncate             { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; word-wrap: normal; }
.u-textBreak                { word-break: break-word; word-wrap: break-word; }
.u-textCenter               { text-align: center; }
.u-textLeft                 { text-align: left; }
.u-textRight                { text-align: right; }
.u-fontStrong               { font-weight: 600 !important; }
.u-fontItalic               { font-style: italic !important; }
.u-fontDefault              { font-weight: normal !important; font-style: normal !important; text-transform: none !important; }
.u-textUppercase            { text-transform: uppercase !important; }
.u-textLowercase            { text-transform: lowercase !important; }
.u-textUnderline            { text-decoration: underline !important; }
.u-textReplace              { text-indent: -100%; white-space: nowrap; overflow: hidden; }



/*
    Responsive Breakpoints
    ====================================

    $bp-radix:             0;
    $bp-alpha:           480;
    $bp-beta:            600;
    $bp-gamma:           990;
    $bp-delta:          1024;
    $bp-epsilon:        1200;
    $bp-zeta:           1280;

    (.bp-xs) XS:       <=480 (<=bp-alpha)
    (.bp-s)   S:         481 (bp-alpha + 1)     - 599 (bp-beta - 1)
    (.bp-m)   M:         600 (bp-beta)          - <=989 (bp-gamma - 1)
    (.bp-l)   L:         990 (bp-gamma)         - <=1279 (bp-epsilon - 1)
    (.bp-xl) XL:       =1200 (>=bp-epsilon) 
    
*/



/*
    Visibility Depending on Resolution
    ==================================== */


/*
    XL display targeting
*/
@media only screen and (min-width: $bp-epsilon + px) {
    .bp-s-isVisible, .bp-m-isVisible, .bp-m-down-isVisible, .bp-l-isVisible, .bp-l-up-isHidden, .bp-xl-isHidden
        { display: none !important; }
}

/*
    L (default) display targeting
*/
@media only screen and (min-width: ($bp-gamma) + px) and (max-width: ($bp-epsilon - 1) + px) {
    .bp-s-isVisible, .bp-m-isVisible, .bp-m-down-isVisible, .bp-l-isHidden, .bp-l-up-isHidden, .bp-xl-isVisible { display: none !important; }
}

/*
    M display targeting
*/
@media only screen and (min-width: ($bp-beta) + px) and (max-width: ($bp-gamma - 1) + px) {
    .bp-s-isVisible, .bp-m-isHidden, .bp-m-down-isHidden, .bp-l-isVisible, .bp-l-up-isVisible, .bp-xl-isVisible
    { display: none !important; }
}

/*
    S display targeting
*/
@media only screen and (min-width: ($bp-alpha + 1) + px) and (max-width: ($bp-beta - 1) + px) {
    .bp-s-isHidden, .bp-m-isVisible, .bp-m-down-isHidden, .bp-l-isVisible, .bp-l-up-isVisible, .bp-xl-isVisible
    { display: none !important; }
}

/*
    XS display targeting
*/
@media only screen and (max-width: $bp-alpha + px) {
    .bp-s-isHidden, .bp-m-isVisible, .bp-m-down-isHidden, .bp-l-isVisible, .bp-l-up-isVisible, .bp-xl-isVisible
    { display: none !important; }
}



/*
    Visibility Depending on Orientation
    ==================================== */


@media screen and (orientation: landscape) {
    .bp-landscape-isHidden, .bp-portrait-isVisible
    { display: none !important; }
}

@media screen and (orientation: portrait) {
    .bp-portrait-isHidden, .bp-landscape-isVisible
    { display: none !important; }
}