@import url(//fonts.googleapis.com/css?family=Open+Sans:300,400,600,700);

.remove-default-appearance {
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    -o-appearance: none;
    appearance: none;
}

.fw-normal {
    font-weight: 400;
}

.fw-medium {
    font-weight: 500;
}

.fw-bold {
    font-weight: 700;
}

.fw-xbold {
    font-weight: 900;
}

.image-section.subpage-image {
    margin-bottom: 15px;
}

img {
    max-width: 100%;
    height: auto;
}

.google-map {
    min-height: 300px;
    height: 400px;
}

.padding-section {
    padding: 60px 0;
}

.no-padding {
    padding: 0;
}

.no-padding-top {
    padding-top: 0;
}

.no-padding-left {
    padding-left: 0;
}

.no-padding-bottom {
    padding-bottom: 0;
}

.no-padding-right {
    padding-right: 0;
}

.margin-section {
    margin: 60px 0;
}

.no-margin {
    margin: 0;
}

.no-margin-top {
    margin-top: 0;
}

.no-margin-left {
    margin-left: 0;
}

.no-margin-bottom {
    margin-bottom: 0;
}

.no-margin-right {
    margin-right: 0;
}

.video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 0;
    height: 0;
    overflow: hidden;
}

    .video-container iframe, .video-container object, .video-container embed {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }

.btn {
    text-align: center;
    font-size: 16px;
    transition: all 0.5s;
}

    .btn.btn-success {
        background-color: #786E87;
        border-radius: 0;
        border: none;
        padding: 20px 30px 20px 30px;
        font-size: 26px;
        text-transform: lowercase;
    }

        .btn.btn-success:hover, .btn.btn-success:focus, .btn.btn-success a, .btn.btn-success a:hover, .btn.btn-success a:focus {
            text-decoration: none;
        }

        .btn.btn-success:after {
            content: "\f002";
            font-family: FontAwesome;
            margin-left: 25px;
        }

    .btn.btn-default:hover, .btn.btn-default:focus, .btn.btn-default a, .btn.btn-default a:hover, .btn.btn-default a:focus {
        text-decoration: none;
    }

    .btn.btn-info {
        background-color: #786E87;
        text-decoration: none;
        color: white;
        border: 1px solid #786E87;
    }

        .btn.btn-info:hover, .btn.btn-info:focus, .btn.btn-info:active {
            color: white;
            text-decoration: none;
            background-color: #534c5d;
        }

    .btn.btn-primary {
        color: #fff;
    }

        .btn.btn-primary:hover, .btn.btn-primary:focus, .btn.btn-primary a, .btn.btn-primary a:hover, .btn.btn-primary a:focus {
            text-decoration: none;
        }

        .btn.btn-primary:hover, .btn.btn-primary:focus, .btn.btn-primary:active {
            color: #fff;
        }

.remove-default-appearance {
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    -o-appearance: none;
    appearance: none;
}

h1, .h1-style {
    font-family: "Open Sans","Arial",sans-serif;
    font-size: 50px;
    color: #5c5c5c;
    line-height: 1.2;
    font-weight: 400;
    text-transform: none;
    letter-spacing: 0;
    margin: 10px 0 40px 0;
    padding-top: 0;
}

    h1 a, h1a, .h1-style a, .h1-stylea {
        color: #786E87;
    }

        h1 a:hover, h1 a:focus, h1a:hover, h1a:focus, .h1-style a:hover, .h1-style a:focus, .h1-stylea:hover, .h1-stylea:focus {
            text-decoration: underline;
            color: #5f576b;
        }

h2, .h2-style {
    font-family: "Open Sans","Arial",sans-serif;
    font-size: 28px;
    color: #5c5c5c;
    line-height: 1.2;
    font-weight: 400;
    text-transform: none;
    letter-spacing: 0;
}

    h2 a, h2a, .h2-style a, .h2-stylea {
        color: #5c5c5c;
    }

        h2 a:hover, h2 a:focus, h2a:hover, h2a:focus, .h2-style a:hover, .h2-style a:focus, .h2-stylea:hover, .h2-stylea:focus {
            text-decoration: underline;
            color: #434343;
        }

h3, .h3-style {
    font-family: "Open Sans","Arial",sans-serif;
    font-size: 22px;
    color: #5c5c5c;
    line-height: 1.2;
    font-weight: 400;
    text-transform: none;
    letter-spacing: 0;
}

    h3 a, h3a, .h3-style a, .h3-stylea {
        color: #786E87;
    }

        h3 a:hover, h3 a:focus, h3a:hover, h3a:focus, .h3-style a:hover, .h3-style a:focus, .h3-stylea:hover, .h3-stylea:focus {
            text-decoration: underline;
            color: #5f576b;
        }

h4, .h4-style {
    font-family: "Open Sans","Arial",sans-serif;
    font-size: 18px;
    color: #5c5c5c;
    line-height: 1.2;
    font-weight: 400;
    text-transform: none;
    letter-spacing: 0;
}

    h4 a, h4a, .h4-style a, .h4-stylea {
        color: #786E87;
    }

        h4 a:hover, h4 a:focus, h4a:hover, h4a:focus, .h4-style a:hover, .h4-style a:focus, .h4-stylea:hover, .h4-stylea:focus {
            text-decoration: underline;
            color: #5f576b;
        }

h5, .h5-style {
    font-family: "Open Sans","Arial",sans-serif;
    font-size: 18px;
    color: #000;
    line-height: 1.2;
    font-weight: normal;
    text-transform: none;
    letter-spacing: 0;
}

    h5 a, h5a, .h5-style a, .h5-stylea {
        color: #000;
    }

        h5 a:hover, h5 a:focus, h5a:hover, h5a:focus, .h5-style a:hover, .h5-style a:focus, .h5-stylea:hover, .h5-stylea:focus {
            text-decoration: underline;
            color: #000;
        }

h6, .h6-style {
    font-family: "Open Sans","Arial",sans-serif;
    font-size: 13px;
    color: #5c5c5c;
    line-height: 1.4;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

    h6 a, h6a, .h6-style a, .h6-stylea {
        color: #5c5c5c;
    }

        h6 a:hover, h6 a:focus, h6a:hover, h6a:focus, .h6-style a:hover, .h6-style a:focus, .h6-stylea:hover, .h6-stylea:focus {
            text-decoration: underline;
            color: #434343;
        }

.larger-text {
    font-family: "Open Sans","Arial",sans-serif;
    font-size: 40px;
    color: #000;
    line-height: 1.2;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0;
}

blockquote {
    border: 0;
    margin: 35px 0;
    padding: 25px 0;
    border-bottom: 1px solid #786E87;
    border-top: 3px double #786E87;
}

    blockquote h1, blockquote h2, blockquote h3, blockquote h4, blockquote h5, blockquote h6, blockquote p, blockquote a, blockquote span, blockquote ul, blockquote ol, blockquote li, blockquote input, blockquote button {
        font-size: 22px;
        color: #786E87;
        font-family: "Open Sans","Arial",sans-serif;
        line-height: 1.2;
    }

.body-section a, .body-sectiona {
    color: #948d83;
}

    .body-section a:hover, .body-section a:focus, .body-sectiona:hover, .body-sectiona:focus {
        text-decoration: underline;
        color: #7a736a;
    }

.body-section a {
    text-decoration: underline;
}

ul, ol {
    line-height: 1.4;
    padding-left: 25px;
    margin-bottom: 25px;
}

p {
    line-height: 1.4;
    font-family: "Open Sans","Arial",sans-serif;
    font-size: 16px;
    margin-bottom: 30px;
}

.tabs-container ul.nav.nav-tabs li a:focus {
    outline: none;
}

.navbar-inner {
    background: none;
    filter: none;
    box-shadow: none;
    border-radius: 0px;
    border: none;
    padding: 0px;
    min-height: 0px;
}

.navbar-default {
    border-color: transparent;
}

.navbar {
    background: transparent;
    margin-bottom: 0px;
    min-height: 1px;
}

    .navbar .nav > li {
        float: left;
    }

        .navbar .nav > li > a {
            padding: 0px;
            text-shadow: none;
        }

            .navbar .nav > li > a i, .navbar .nav > li > a b {
                border-bottom-color: #5c5c5c;
                border-top-color: #5c5c5c;
            }

.navbar-nav {
    margin-left: 0px;
    margin-right: 0px;
}

.navbar .nav > li > a:focus, .navbar .nav > li > a:hover {
    color: #333333;
    text-decoration: none;
    background-color: transparent;
}

.navbar .nav .active > a {
    color: #333333;
    background: none;
    box-shadow: none;
}

    .navbar .nav .active > a:hover {
        background: none;
        box-shadow: none;
    }

.navbar .nav li.dropdown.open > .dropdown-toggle, .navbar .nav li.dropdown.active > .dropdown-toggle, .navbar .nav li.dropdown.open.active > .dropdown-toggle {
    box-shadow: none;
}

.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus, .dropdown-submenu:hover > a, .dropdown-submenu:focus > a {
    background-image: none;
    background-repeat: repeat-x;
    text-decoration: none;
    filter: none;
}

.navbar-collapse {
    padding-right: 0px;
    padding-left: 0px;
}

.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:focus, .navbar-default .navbar-nav > .active > a:hover {
    background-color: transparent;
}

.navbar .nav > li.active > a, .navbar .nav > li.active > a:hover, .navbar .nav > li.dropdown.active > .dropdown-toggle {
    box-shadow: none;
}

.navbar .nav > li.dropdown.open > .dropdown-toggle {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    border-color: rgba(0,0,0,0.2);
    border-image: none;
    border-radius: 0;
    position: relative;
}

.navbar .nav > li .dropdown-menu {
    border-radius: 0;
    margin: 0;
    padding: 0;
}

    .navbar .nav > li .dropdown-menu:after, .navbar .nav > li .dropdown-menu:before {
        display: none;
    }

    .navbar .nav > li .dropdown-menu li {
        display: block;
        width: 100%;
        text-align: left;
    }

        .navbar .nav > li .dropdown-menu li a {
            padding: 3px 10px;
            font-size: 14px;
        }

            .navbar .nav > li .dropdown-menu li a:hover {
                color: #2a2a2a;
            }

.dropdown-menu .sub-menu {
    left: 100%;
    position: absolute;
    top: 0;
    visibility: hidden;
    margin-top: -1px;
}

.dropdown-menu li:hover > .sub-menu {
    visibility: visible;
}

.dropdown:hover > .dropdown-menu {
    display: block;
}

.nav-tabs .dropdown-menu, .nav-pills .dropdown-menu, .navbar .dropdown-menu {
    margin-top: 0;
}

.navbar .sub-menu:before {
    border-bottom: 7px solid transparent;
    border-left: none;
    border-right: 7px solid rgba(0,0,0,0.2);
    border-top: 7px solid transparent;
    left: -7px;
    top: 10px;
}

.navbar .sub-menu:after {
    border-top: 6px solid transparent;
    border-left: none;
    border-right: 6px solid #fff;
    border-bottom: 6px solid transparent;
    top: 11px;
    left: -6px;
}

.dropdown-submenu {
    position: relative;
}

    .dropdown-submenu > .dropdown-menu {
        top: 0;
        left: 100%;
        margin-top: -6px;
        margin-left: -1px;
        -webkit-border-radius: 0 6px 6px 6px;
        -moz-border-radius: 0 6px 6px 6px;
        border-radius: 0 6px 6px 6px;
    }

    .dropdown-submenu:hover > .dropdown-menu {
        display: block;
    }

    .dropdown-submenu > a:after {
        display: block;
        content: " ";
        float: right;
        width: 0;
        height: 0;
        border-color: transparent;
        border-style: solid;
        border-width: 5px 0 5px 5px;
        border-left-color: #cccccc;
        margin-top: 5px;
        margin-right: -10px;
    }

    .dropdown-submenu:hover > a:after {
        border-left-color: #ffffff;
    }

    .dropdown-submenu.pull-left {
        float: none;
    }

        .dropdown-submenu.pull-left > .dropdown-menu {
            left: -100%;
            margin-left: 10px;
            -webkit-border-radius: 6px 0 6px 6px;
            -moz-border-radius: 6px 0 6px 6px;
            border-radius: 6px 0 6px 6px;
        }

.dropdown-menu .sub-menu {
    left: 100%;
    position: absolute;
    top: 0;
    visibility: hidden;
    margin-top: -1px;
}

.nav-tabs .dropdown-menu, .nav-pills .dropdown-menu, .navbar .dropdown-menu {
    margin-top: 0;
}

.navbar .sub-menu:before {
    border-bottom: 7px solid transparent;
    border-left: none;
    border-right: 7px solid rgba(0,0,0,0.2);
    border-top: 7px solid transparent;
    left: -7px;
    top: 10px;
}

.navbar .sub-menu:after {
    border-top: 6px solid transparent;
    border-left: none;
    border-right: 6px solid #fff;
    border-bottom: 6px solid transparent;
    top: 11px;
    left: -6px;
}

table.table {
    border-spacing: 2px;
    border-collapse: separate;
}

    table.table > tbody > tr > td {
        border: 0;
        padding: 0.7em;
        font-size: 0.875rem;
    }

@media (max-width: 543px) {
    table.table > tbody > tr > td {
        padding: 0.4em;
        font-size: 0.7rem;
    }
}

.panel-group .panel-heading + .panel-collapse > .list-group, .panel-group .panel-heading + .panel-collapse > .panel-body {
    border: 0;
}

.panel-group .panel {
    border: 0;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}

    .panel-group .panel .panel-heading {
        padding: 0;
        margin: 0;
        background: transparent;
        border: 0;
    }

        .panel-group .panel .panel-heading h4 {
            font-family: "Open Sans","Arial",sans-serif;
            font-size: 22px;
            color: #5c5c5c;
            line-height: 1.2;
            font-weight: 400;
            text-transform: none;
            letter-spacing: 0;
            font-size: 30px;
            line-height: 1.5;
        }

            .panel-group .panel .panel-heading h4 a, .panel-group .panel .panel-heading h4a {
                color: #786E87;
            }

                .panel-group .panel .panel-heading h4 a:hover, .panel-group .panel .panel-heading h4 a:focus, .panel-group .panel .panel-heading h4a:hover, .panel-group .panel .panel-heading h4a:focus {
                    text-decoration: underline;
                    color: #5f576b;
                }

                .panel-group .panel .panel-heading h4 a:hover, .panel-group .panel .panel-heading h4 a:focus, .panel-group .panel .panel-heading h4 a a, .panel-group .panel .panel-heading h4 a a:hover, .panel-group .panel .panel-heading h4 a a:focus {
                    text-decoration: none;
                }

    .panel-group .panel .panel-body {
        padding-left: 0;
        padding-right: 0;
    }

.slick-loading .slick-list {
    background: #fff url("/Landing-Site/content/themes/nucleo-ucbookshop/assets/images/ajax-loader.gif") center center no-repeat;
}

@font-face {
    font-family: "slick";
    src: url("/Landing-Site/content/themes/nucleo-ucbookshop/assets/fonts/slick.eot");
    src: url("/Landing-Site/content/themes/nucleo-ucbookshop/assets/fonts/slick.eot#iefix") format("embedded-opentype"),url("/Landing-Site/content/themes/nucleo-ucbookshop/assets/fonts/slick.woff") format("woff"),url("/Landing-Site/content/themes/nucleo-ucbookshop/assets/fonts/slick.ttf") format("truetype"),url("/Landing-Site/content/themes/nucleo-ucbookshop/assets/fonts/slick.svg#slick") format("svg");
    font-weight: normal;
    font-style: normal;
}

.slick-prev, .slick-next {
    position: absolute;
    display: block;
    height: 20px;
    width: 20px;
    line-height: 0px;
    font-size: 0px;
    cursor: pointer;
    background: transparent;
    color: transparent;
    top: 50%;
    margin-top: -10px;
    padding: 0;
    border: none;
    outline: none;
}

    .slick-prev:hover, .slick-prev:focus, .slick-next:hover, .slick-next:focus {
        outline: none;
        background: transparent;
        color: transparent;
    }

        .slick-prev:hover:before, .slick-prev:focus:before, .slick-next:hover:before, .slick-next:focus:before {
            opacity: 1;
        }

    .slick-prev.slick-disabled:before, .slick-next.slick-disabled:before {
        opacity: 0.25;
    }

    .slick-prev:before, .slick-next:before {
        font-family: "slick";
        font-size: 20px;
        line-height: 1;
        color: #000;
        opacity: 0.75;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    }

.slick-prev {
    left: -25px;
}

[dir="rtl"] .slick-prev {
    left: auto;
    right: -25px;
}

.slick-prev:before {
    content: "←";
}

[dir="rtl"] .slick-prev:before {
    content: "→";
}

.slick-next {
    right: -25px;
}

[dir="rtl"] .slick-next {
    left: -25px;
    right: auto;
}

.slick-next:before {
    content: "→";
}

[dir="rtl"] .slick-next:before {
    content: "←";
}

.slick-slider {
    margin-bottom: 30px;
}

.slick-dots {
    position: absolute;
    bottom: -45px;
    list-style: none;
    display: block;
    text-align: center;
    padding: 0;
    width: 100%;
}

    .slick-dots li {
        position: relative;
        display: inline-block;
        height: 20px;
        width: 20px;
        margin: 0 5px;
        padding: 0;
        cursor: pointer;
    }

        .slick-dots li button {
            border: 0;
            background: transparent;
            display: block;
            height: 20px;
            width: 20px;
            outline: none;
            line-height: 0px;
            font-size: 0px;
            color: transparent;
            padding: 5px;
            cursor: pointer;
        }

            .slick-dots li button:hover, .slick-dots li button:focus {
                outline: none;
            }

                .slick-dots li button:hover:before, .slick-dots li button:focus:before {
                    opacity: 1;
                }

            .slick-dots li button:before {
                position: absolute;
                top: 0;
                left: 0;
                content: "•";
                width: 20px;
                height: 20px;
                font-family: "slick";
                font-size: 6px;
                line-height: 20px;
                text-align: center;
                color: #000;
                opacity: 0.25;
                -webkit-font-smoothing: antialiased;
                -moz-osx-font-smoothing: grayscale;
            }

        .slick-dots li.slick-active button:before {
            color: #000;
            opacity: 0.75;
        }

.slick-slide:focus {
    outline: none;
}

.slick-container {
    padding: 0;
    z-index: 5;
}

.slick {
    text-align: center;
    padding: 0;
    margin: 0px;
}

.slick-dots {
    bottom: 0;
}

.slick-prev, .slick-next {
    z-index: 6;
}

    .slick-prev:before, .slick-next:before {
        font-family: FontAwesome;
        font-size: 21px;
        color: #786E87;
    }

.slick-next {
    right: -25px;
}

    .slick-next:before {
        content: "\f105";
    }

.slick-prev {
    left: -25px;
}

    .slick-prev:before {
        content: "\f104";
    }

.slick-dots li button:before {
    content: "\f111";
    font-family: FontAwesome;
    font-size: 18px;
    color: #fff;
}

.slick-dots li.slick-active button:before {
    color: #fff;
    content: "\f10c";
}

.ninja-forms-cont {
    margin-top: 20px;
}

    .ninja-forms-cont p {
        margin-bottom: 10px;
    }

    .ninja-forms-cont label {
        margin-bottom: 3px;
        font-size: 14px;
        color: #5c5c5c;
    }

    .ninja-forms-cont .field-wrap.label-left .ninja-forms-field, .ninja-forms-cont .field-wrap.label-left .ninja-forms-star-rating-control {
        margin: 0;
    }

    .ninja-forms-cont .ninja-forms-form-wrap label {
        font-weight: normal;
    }

    .ninja-forms-cont .field-wrap {
        margin-bottom: 20px;
    }

    .ninja-forms-cont input[type="text"], .ninja-forms-cont textarea, .ninja-forms-cont .ninja-forms-field.country, .ninja-forms-cont select {
        background: #fff;
        border: 1px solid #ddd;
        padding: 10px 8px;
        font-size: 14px;
        color: #000;
        display: block;
        -webkit-transition: all 0.5s;
        -moz-transition: all 0.5s;
        -o-transition: all 0.5s;
        transition: all 0.5s;
    }

        .ninja-forms-cont input[type="text"]:hover, .ninja-forms-cont input[type="text"]:focus, .ninja-forms-cont textarea:hover, .ninja-forms-cont textarea:focus, .ninja-forms-cont .ninja-forms-field.country:hover, .ninja-forms-cont .ninja-forms-field.country:focus, .ninja-forms-cont select:hover, .ninja-forms-cont select:focus {
            border-color: #c4c4c4;
        }

        .ninja-forms-cont input[type="text"]:focus, .ninja-forms-cont textarea:focus, .ninja-forms-cont .ninja-forms-field.country:focus, .ninja-forms-cont select:focus {
            border-color: #aaa;
            outline: none !important;
        }

    .ninja-forms-cont select {
        -webkit-appearance: none;
        background-color: #5c5c5c;
        background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZlcnNpb249IjEuMSIgeD0iMTJweCIgeT0iMHB4IiB3aWR0aD0iMjRweCIgaGVpZ2h0PSIzcHgiIHZpZXdCb3g9IjAgMCA2IDMiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDYgMyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+PHBvbHlnb24gcG9pbnRzPSI1Ljk5MiwwIDIuOTkyLDMgLTAuMDA4LDAgIi8+PC9zdmc+");
        background-position: 100% center;
        background-repeat: no-repeat;
        -webkit-border-radius: 0px;
        -moz-border-radius: 0px;
        -ms-border-radius: 0px;
        -o-border-radius: 0px;
        border-radius: 0px;
    }

    .ninja-forms-cont .ninja-forms-field.country {
        width: 100%;
    }

    .ninja-forms-cont .spam-wrap input[type="text"] {
        width: 100%;
    }

    .ninja-forms-cont .ninja-forms-required-items {
        display: none;
    }

    .ninja-forms-cont .submit-wrap input[type="submit"], .ninja-forms-cont .nf-modal-link, .ninja-forms-cont .ninja-forms-mp-nav.ninja-forms-mp-prev, .ninja-forms-cont .ninja-forms-mp-nav.ninja-forms-mp-next {
        background: #786E87;
        padding: 12px 30px;
        color: #fff;
        border: 0px;
        -webkit-transition: all 0.5s;
        -moz-transition: all 0.5s;
        -o-transition: all 0.5s;
        transition: all 0.5s;
        -webkit-border-radius: 50px;
        -moz-border-radius: 50px;
        -ms-border-radius: 50px;
        -o-border-radius: 50px;
        border-radius: 50px;
    }

        .ninja-forms-cont .submit-wrap input[type="submit"]:hover, .ninja-forms-cont .submit-wrap input[type="submit"]:active, .ninja-forms-cont .nf-modal-link:hover, .ninja-forms-cont .nf-modal-link:active, .ninja-forms-cont .ninja-forms-mp-nav.ninja-forms-mp-prev:hover, .ninja-forms-cont .ninja-forms-mp-nav.ninja-forms-mp-prev:active, .ninja-forms-cont .ninja-forms-mp-nav.ninja-forms-mp-next:hover, .ninja-forms-cont .ninja-forms-mp-nav.ninja-forms-mp-next:active {
            color: #fff;
            background: #5f576b;
        }

    .ninja-forms-cont .ninja-forms-mp-nav.ninja-forms-mp-prev {
        background-color: #767676;
    }

        .ninja-forms-cont .ninja-forms-mp-nav.ninja-forms-mp-prev:hover, .ninja-forms-cont .ninja-forms-mp-nav.ninja-forms-mp-prev:focus, .ninja-forms-cont .ninja-forms-mp-nav.ninja-forms-mp-prev:active {
            background: #5c5c5c;
        }

    .ninja-forms-cont .textarea-wrap textarea {
        margin-bottom: -5px;
        height: 150px;
    }

    .ninja-forms-cont .list-radio-wrap.label-block-wrap label {
        display: block;
        float: none;
        margin-bottom: 1em;
    }

    .ninja-forms-cont .list-radio-wrap.label-block-wrap ul li label {
        display: inline-block;
        margin-bottom: 0;
        vertical-align: top;
    }

        .ninja-forms-cont .list-radio-wrap.label-block-wrap ul li label input {
            vertical-align: text-top;
            margin-right: 5px !important;
        }

    .ninja-forms-cont .list-checkbox-wrap .label-left label, .ninja-forms-cont .list-checkbox-wrap .label-left ul, .ninja-forms-cont .list-checkbox-wrap .label-left ul li, .ninja-forms-cont .list-checkbox-wrap .label-right label, .ninja-forms-cont .list-checkbox-wrap .label-right ul, .ninja-forms-cont .list-checkbox-wrap .label-right ul li, .ninja-forms-cont .list-checkbox-wrap .label-left label, .ninja-forms-cont .list-checkbox-wrap .label-left ul, .ninja-forms-cont .list-checkbox-wrap .label-left ul li, .ninja-forms-cont .list-checkbox-wrap .label-right label, .ninja-forms-cont .list-checkbox-wrap .label-right ul, .ninja-forms-cont .list-checkbox-wrap .label-right ul li, .ninja-forms-cont .list-checkbox-wrap label, .ninja-forms-cont .list-checkbox-wrap ul, .ninja-forms-cont .list-checkbox-wrap li {
        display: block;
        float: none !important;
    }

        .ninja-forms-cont .list-checkbox-wrap ul li {
            padding: 3px 0 !important;
        }

            .ninja-forms-cont .list-checkbox-wrap ul li label input {
                margin-right: 5px !important;
            }

@media (min-width: 1200px) {
    .fx-example-highlight-colour-xl {
        background: #6A95B5;
        color: #fff;
    }

    .fx-xl-display-block {
        display: block;
    }

    .fx-xl-display-block-inline {
        display: inline-block;
    }

    .fx-xl-display {
        display: -webkit-flex;
        display: -moz-flex;
        display: -ms-flexbox;
        display: -ms-flex;
        display: flex;
    }

    .fx-xl-display-inline {
        display: -webkit-inline-flex;
        display: -moz-inline-flex;
        display: -ms-inline-flexbox;
        display: -ms-inline-flex;
        display: inline-flex;
    }

    .fx-xl-direction {
        -webkit-flex-direction: row;
        -moz-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
    }

    .fx-xl-direction-reverse {
        -webkit-flex-direction: row-reverse;
        -moz-flex-direction: row-reverse;
        -ms-flex-direction: row-reverse;
        flex-direction: row-reverse;
    }

    .fx-xl-direction-column {
        -webkit-flex-direction: column;
        -moz-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .fx-xl-direction-column-reverse {
        -webkit-flex-direction: column-reverse;
        -moz-flex-direction: column-reverse;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse;
    }

    .fx-xl-wrap {
        -webkit-flex-wrap: wrap;
        -moz-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    .fx-xl-wrap-nowrap {
        -webkit-flex-wrap: nowrap;
        -moz-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
    }

    .fx-xl-wrap-reverse {
        -webkit-flex-wrap: wrap-reverse;
        -moz-flex-wrap: wrap-reverse;
        -ms-flex-wrap: wrap-reverse;
        flex-wrap: wrap-reverse;
    }

    .fx-xl-justify-flex-start {
        -webkit-justify-content: flex-start;
        -moz-justify-content: flex-start;
        -ms-justify-content: flex-start;
        justify-content: flex-start;
    }

    .fx-xl-justify-flex-end {
        -webkit-justify-content: flex-end;
        -moz-justify-content: flex-end;
        -ms-justify-content: flex-end;
        justify-content: flex-end;
    }

    .fx-xl-justify-center {
        -webkit-justify-content: center;
        -moz-justify-content: center;
        -ms-justify-content: center;
        justify-content: center;
    }

    .fx-xl-justify-space-between {
        -webkit-justify-content: space-between;
        -moz-justify-content: space-between;
        -ms-justify-content: space-between;
        justify-content: space-between;
    }

    .fx-xl-justify-space-around {
        -webkit-justify-content: space-around;
        -moz-justify-content: space-around;
        -ms-justify-content: space-around;
        justify-content: space-around;
    }

    .fx-xl-align-content-flex-start {
        -webkit-align-content: flex-start;
        -moz-align-content: flex-start;
        -ms-align-content: flex-start;
        align-content: flex-start;
    }

    .fx-xl-align-content-flex-end {
        -webkit-align-content: flex-end;
        -moz-align-content: flex-end;
        -ms-align-content: flex-end;
        align-content: flex-end;
    }

    .fx-xl-align-content-center {
        -webkit-align-content: center;
        -moz-align-content: center;
        -ms-align-content: center;
        align-content: center;
    }

    .fx-xl-align-content-space-between {
        -webkit-align-content: space-between;
        -moz-align-content: space-between;
        -ms-align-content: space-between;
        align-content: space-between;
    }

    .fx-xl-align-content-space-around {
        -webkit-align-content: space-around;
        -moz-align-content: space-around;
        -ms-align-content: space-around;
        align-content: space-around;
    }

    .fx-xl-align-content-stretch {
        -webkit-align-content: stretch;
        -moz-align-content: stretch;
        -ms-align-content: stretch;
        align-content: stretch;
    }

    .fx-xl-align-items-flex-start {
        -webkit-align-items: flex-start;
        -moz-align-items: flex-start;
        -ms-align-items: flex-start;
        align-items: flex-start;
    }

    .fx-xl-align-items-flex-end {
        -webkit-align-items: flex-end;
        -moz-align-items: flex-end;
        -ms-align-items: flex-end;
        align-items: flex-end;
    }

    .fx-xl-align-items-center {
        -webkit-align-items: center;
        -moz-align-items: center;
        -ms-align-items: center;
        align-items: center;
    }

    .fx-xl-align-items-baseline {
        -webkit-align-items: baseline;
        -moz-align-items: baseline;
        -ms-align-items: baseline;
        align-items: baseline;
    }

    .fx-xl-align-items-stretch {
        -webkit-align-items: stretch;
        -moz-align-items: stretch;
        -ms-align-items: stretch;
        align-items: stretch;
    }

    .fx-xl-order-0 {
        -webkit-order: 0;
        -moz-order: 0;
        -ms-order: 0;
        order: 0;
    }

    .fx-xl-order-1 {
        -webkit-order: 1;
        -moz-order: 1;
        -ms-order: 1;
        order: 1;
    }

    .fx-xl-order-2 {
        -webkit-order: 2;
        -moz-order: 2;
        -ms-order: 2;
        order: 2;
    }

    .fx-xl-order-3 {
        -webkit-order: 3;
        -moz-order: 3;
        -ms-order: 3;
        order: 3;
    }

    .fx-xl-order-4 {
        -webkit-order: 4;
        -moz-order: 4;
        -ms-order: 4;
        order: 4;
    }

    .fx-xl-order-5 {
        -webkit-order: 5;
        -moz-order: 5;
        -ms-order: 5;
        order: 5;
    }

    .fx-xl-order-6 {
        -webkit-order: 6;
        -moz-order: 6;
        -ms-order: 6;
        order: 6;
    }

    .fx-xl-order-7 {
        -webkit-order: 7;
        -moz-order: 7;
        -ms-order: 7;
        order: 7;
    }

    .fx-xl-order-8 {
        -webkit-order: 8;
        -moz-order: 8;
        -ms-order: 8;
        order: 8;
    }

    .fx-xl-order-9 {
        -webkit-order: 9;
        -moz-order: 9;
        -ms-order: 9;
        order: 9;
    }

    .fx-xl-order-10 {
        -webkit-order: 10;
        -moz-order: 10;
        -ms-order: 10;
        order: 10;
    }

    .fx-xl-grow-0 {
        -webkit-flex-grow: 0;
        -moz-flex-grow: 0;
        -ms-flex-grow: 0;
        flex-grow: 0;
    }

    .fx-xl-grow-1 {
        -webkit-flex-grow: 1;
        -moz-flex-grow: 1;
        -ms-flex-grow: 1;
        flex-grow: 1;
    }

    .fx-xl-grow-2 {
        -webkit-flex-grow: 2;
        -moz-flex-grow: 2;
        -ms-flex-grow: 2;
        flex-grow: 2;
    }

    .fx-xl-grow-3 {
        -webkit-flex-grow: 3;
        -moz-flex-grow: 3;
        -ms-flex-grow: 3;
        flex-grow: 3;
    }

    .fx-xl-grow-4 {
        -webkit-flex-grow: 4;
        -moz-flex-grow: 4;
        -ms-flex-grow: 4;
        flex-grow: 4;
    }

    .fx-xl-grow-5 {
        -webkit-flex-grow: 5;
        -moz-flex-grow: 5;
        -ms-flex-grow: 5;
        flex-grow: 5;
    }

    .fx-xl-grow-6 {
        -webkit-flex-grow: 6;
        -moz-flex-grow: 6;
        -ms-flex-grow: 6;
        flex-grow: 6;
    }

    .fx-xl-grow-7 {
        -webkit-flex-grow: 7;
        -moz-flex-grow: 7;
        -ms-flex-grow: 7;
        flex-grow: 7;
    }

    .fx-xl-grow-8 {
        -webkit-flex-grow: 8;
        -moz-flex-grow: 8;
        -ms-flex-grow: 8;
        flex-grow: 8;
    }

    .fx-xl-grow-9 {
        -webkit-flex-grow: 9;
        -moz-flex-grow: 9;
        -ms-flex-grow: 9;
        flex-grow: 9;
    }

    .fx-xl-grow-10 {
        -webkit-flex-grow: 10;
        -moz-flex-grow: 10;
        -ms-flex-grow: 10;
        flex-grow: 10;
    }

    .fx-xl-shrink-0 {
        -webkit-flex-shrink: 0;
        -moz-flex-shrink: 0;
        -ms-flex-shrink: 0;
        flex-shrink: 0;
    }

    .fx-xl-shrink-1 {
        -webkit-flex-shrink: 1;
        -moz-flex-shrink: 1;
        -ms-flex-shrink: 1;
        flex-shrink: 1;
    }

    .fx-xl-shrink-2 {
        -webkit-flex-shrink: 2;
        -moz-flex-shrink: 2;
        -ms-flex-shrink: 2;
        flex-shrink: 2;
    }

    .fx-xl-shrink-3 {
        -webkit-flex-shrink: 3;
        -moz-flex-shrink: 3;
        -ms-flex-shrink: 3;
        flex-shrink: 3;
    }

    .fx-xl-shrink-4 {
        -webkit-flex-shrink: 4;
        -moz-flex-shrink: 4;
        -ms-flex-shrink: 4;
        flex-shrink: 4;
    }

    .fx-xl-shrink-5 {
        -webkit-flex-shrink: 5;
        -moz-flex-shrink: 5;
        -ms-flex-shrink: 5;
        flex-shrink: 5;
    }

    .fx-xl-shrink-6 {
        -webkit-flex-shrink: 6;
        -moz-flex-shrink: 6;
        -ms-flex-shrink: 6;
        flex-shrink: 6;
    }

    .fx-xl-shrink-7 {
        -webkit-flex-shrink: 7;
        -moz-flex-shrink: 7;
        -ms-flex-shrink: 7;
        flex-shrink: 7;
    }

    .fx-xl-shrink-8 {
        -webkit-flex-shrink: 8;
        -moz-flex-shrink: 8;
        -ms-flex-shrink: 8;
        flex-shrink: 8;
    }

    .fx-xl-shrink-9 {
        -webkit-flex-shrink: 9;
        -moz-flex-shrink: 9;
        -ms-flex-shrink: 9;
        flex-shrink: 9;
    }

    .fx-xl-shrink-10 {
        -webkit-flex-shrink: 10;
        -moz-flex-shrink: 10;
        -ms-flex-shrink: 10;
        flex-shrink: 10;
    }

    .fx-xl-align-self-flex-start {
        -webkit-align-self: flex-start;
        -moz-align-self: flex-start;
        -ms-align-self: flex-start;
        align-self: flex-start;
    }

    .fx-xl-align-self-flex-end {
        -webkit-align-self: flex-end;
        -moz-align-self: flex-end;
        -ms-align-self: flex-end;
        align-self: flex-end;
    }

    .fx-xl-align-self-center {
        -webkit-align-self: center;
        -moz-align-self: center;
        -ms-align-self: center;
        align-self: center;
    }

    .fx-xl-align-self-baseline {
        -webkit-align-self: baseline;
        -moz-align-self: baseline;
        -ms-align-self: baseline;
        align-self: baseline;
    }

    .fx-xl-align-self-stretch {
        -webkit-align-self: stretch;
        -moz-align-self: stretch;
        -ms-align-self: stretch;
        align-self: stretch;
    }
}

@media (min-width: 992px) {
    .fx-example-highlight-colour-lg {
        background: #6A95B5;
        color: #fff;
    }

    .fx-lg-display-block {
        display: block;
    }

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

    .fx-lg-display {
        display: -webkit-flex;
        display: -moz-flex;
        display: -ms-flexbox;
        display: -ms-flex;
        display: flex;
    }

    .fx-lg-display-inline {
        display: -webkit-inline-flex;
        display: -moz-inline-flex;
        display: -ms-inline-flexbox;
        display: -ms-inline-flex;
        display: inline-flex;
    }

    .fx-lg-direction {
        -webkit-flex-direction: row;
        -moz-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
    }

    .fx-lg-direction-reverse {
        -webkit-flex-direction: row-reverse;
        -moz-flex-direction: row-reverse;
        -ms-flex-direction: row-reverse;
        flex-direction: row-reverse;
    }

    .fx-lg-direction-column {
        -webkit-flex-direction: column;
        -moz-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .fx-lg-direction-column-reverse {
        -webkit-flex-direction: column-reverse;
        -moz-flex-direction: column-reverse;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse;
    }

    .fx-lg-wrap {
        -webkit-flex-wrap: wrap;
        -moz-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    .fx-lg-wrap-nowrap {
        -webkit-flex-wrap: nowrap;
        -moz-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
    }

    .fx-lg-wrap-reverse {
        -webkit-flex-wrap: wrap-reverse;
        -moz-flex-wrap: wrap-reverse;
        -ms-flex-wrap: wrap-reverse;
        flex-wrap: wrap-reverse;
    }

    .fx-lg-justify-flex-start {
        -webkit-justify-content: flex-start;
        -moz-justify-content: flex-start;
        -ms-justify-content: flex-start;
        justify-content: flex-start;
    }

    .fx-lg-justify-flex-end {
        -webkit-justify-content: flex-end;
        -moz-justify-content: flex-end;
        -ms-justify-content: flex-end;
        justify-content: flex-end;
    }

    .fx-lg-justify-center {
        -webkit-justify-content: center;
        -moz-justify-content: center;
        -ms-justify-content: center;
        justify-content: center;
    }

    .fx-lg-justify-space-between {
        -webkit-justify-content: space-between;
        -moz-justify-content: space-between;
        -ms-justify-content: space-between;
        justify-content: space-between;
    }

    .fx-lg-justify-space-around {
        -webkit-justify-content: space-around;
        -moz-justify-content: space-around;
        -ms-justify-content: space-around;
        justify-content: space-around;
    }

    .fx-lg-align-content-flex-start {
        -webkit-align-content: flex-start;
        -moz-align-content: flex-start;
        -ms-align-content: flex-start;
        align-content: flex-start;
    }

    .fx-lg-align-content-flex-end {
        -webkit-align-content: flex-end;
        -moz-align-content: flex-end;
        -ms-align-content: flex-end;
        align-content: flex-end;
    }

    .fx-lg-align-content-center {
        -webkit-align-content: center;
        -moz-align-content: center;
        -ms-align-content: center;
        align-content: center;
    }

    .fx-lg-align-content-space-between {
        -webkit-align-content: space-between;
        -moz-align-content: space-between;
        -ms-align-content: space-between;
        align-content: space-between;
    }

    .fx-lg-align-content-space-around {
        -webkit-align-content: space-around;
        -moz-align-content: space-around;
        -ms-align-content: space-around;
        align-content: space-around;
    }

    .fx-lg-align-content-stretch {
        -webkit-align-content: stretch;
        -moz-align-content: stretch;
        -ms-align-content: stretch;
        align-content: stretch;
    }

    .fx-lg-align-items-flex-start {
        -webkit-align-items: flex-start;
        -moz-align-items: flex-start;
        -ms-align-items: flex-start;
        align-items: flex-start;
    }

    .fx-lg-align-items-flex-end {
        -webkit-align-items: flex-end;
        -moz-align-items: flex-end;
        -ms-align-items: flex-end;
        align-items: flex-end;
    }

    .fx-lg-align-items-center {
        -webkit-align-items: center;
        -moz-align-items: center;
        -ms-align-items: center;
        align-items: center;
    }

    .fx-lg-align-items-baseline {
        -webkit-align-items: baseline;
        -moz-align-items: baseline;
        -ms-align-items: baseline;
        align-items: baseline;
    }

    .fx-lg-align-items-stretch {
        -webkit-align-items: stretch;
        -moz-align-items: stretch;
        -ms-align-items: stretch;
        align-items: stretch;
    }

    .fx-lg-order-0 {
        -webkit-order: 0;
        -moz-order: 0;
        -ms-order: 0;
        order: 0;
    }

    .fx-lg-order-1 {
        -webkit-order: 1;
        -moz-order: 1;
        -ms-order: 1;
        order: 1;
    }

    .fx-lg-order-2 {
        -webkit-order: 2;
        -moz-order: 2;
        -ms-order: 2;
        order: 2;
    }

    .fx-lg-order-3 {
        -webkit-order: 3;
        -moz-order: 3;
        -ms-order: 3;
        order: 3;
    }

    .fx-lg-order-4 {
        -webkit-order: 4;
        -moz-order: 4;
        -ms-order: 4;
        order: 4;
    }

    .fx-lg-order-5 {
        -webkit-order: 5;
        -moz-order: 5;
        -ms-order: 5;
        order: 5;
    }

    .fx-lg-order-6 {
        -webkit-order: 6;
        -moz-order: 6;
        -ms-order: 6;
        order: 6;
    }

    .fx-lg-order-7 {
        -webkit-order: 7;
        -moz-order: 7;
        -ms-order: 7;
        order: 7;
    }

    .fx-lg-order-8 {
        -webkit-order: 8;
        -moz-order: 8;
        -ms-order: 8;
        order: 8;
    }

    .fx-lg-order-9 {
        -webkit-order: 9;
        -moz-order: 9;
        -ms-order: 9;
        order: 9;
    }

    .fx-lg-order-10 {
        -webkit-order: 10;
        -moz-order: 10;
        -ms-order: 10;
        order: 10;
    }

    .fx-lg-grow-0 {
        -webkit-flex-grow: 0;
        -moz-flex-grow: 0;
        -ms-flex-grow: 0;
        flex-grow: 0;
    }

    .fx-lg-grow-1 {
        -webkit-flex-grow: 1;
        -moz-flex-grow: 1;
        -ms-flex-grow: 1;
        flex-grow: 1;
    }

    .fx-lg-grow-2 {
        -webkit-flex-grow: 2;
        -moz-flex-grow: 2;
        -ms-flex-grow: 2;
        flex-grow: 2;
    }

    .fx-lg-grow-3 {
        -webkit-flex-grow: 3;
        -moz-flex-grow: 3;
        -ms-flex-grow: 3;
        flex-grow: 3;
    }

    .fx-lg-grow-4 {
        -webkit-flex-grow: 4;
        -moz-flex-grow: 4;
        -ms-flex-grow: 4;
        flex-grow: 4;
    }

    .fx-lg-grow-5 {
        -webkit-flex-grow: 5;
        -moz-flex-grow: 5;
        -ms-flex-grow: 5;
        flex-grow: 5;
    }

    .fx-lg-grow-6 {
        -webkit-flex-grow: 6;
        -moz-flex-grow: 6;
        -ms-flex-grow: 6;
        flex-grow: 6;
    }

    .fx-lg-grow-7 {
        -webkit-flex-grow: 7;
        -moz-flex-grow: 7;
        -ms-flex-grow: 7;
        flex-grow: 7;
    }

    .fx-lg-grow-8 {
        -webkit-flex-grow: 8;
        -moz-flex-grow: 8;
        -ms-flex-grow: 8;
        flex-grow: 8;
    }

    .fx-lg-grow-9 {
        -webkit-flex-grow: 9;
        -moz-flex-grow: 9;
        -ms-flex-grow: 9;
        flex-grow: 9;
    }

    .fx-lg-grow-10 {
        -webkit-flex-grow: 10;
        -moz-flex-grow: 10;
        -ms-flex-grow: 10;
        flex-grow: 10;
    }

    .fx-lg-shrink-0 {
        -webkit-flex-shrink: 0;
        -moz-flex-shrink: 0;
        -ms-flex-shrink: 0;
        flex-shrink: 0;
    }

    .fx-lg-shrink-1 {
        -webkit-flex-shrink: 1;
        -moz-flex-shrink: 1;
        -ms-flex-shrink: 1;
        flex-shrink: 1;
    }

    .fx-lg-shrink-2 {
        -webkit-flex-shrink: 2;
        -moz-flex-shrink: 2;
        -ms-flex-shrink: 2;
        flex-shrink: 2;
    }

    .fx-lg-shrink-3 {
        -webkit-flex-shrink: 3;
        -moz-flex-shrink: 3;
        -ms-flex-shrink: 3;
        flex-shrink: 3;
    }

    .fx-lg-shrink-4 {
        -webkit-flex-shrink: 4;
        -moz-flex-shrink: 4;
        -ms-flex-shrink: 4;
        flex-shrink: 4;
    }

    .fx-lg-shrink-5 {
        -webkit-flex-shrink: 5;
        -moz-flex-shrink: 5;
        -ms-flex-shrink: 5;
        flex-shrink: 5;
    }

    .fx-lg-shrink-6 {
        -webkit-flex-shrink: 6;
        -moz-flex-shrink: 6;
        -ms-flex-shrink: 6;
        flex-shrink: 6;
    }

    .fx-lg-shrink-7 {
        -webkit-flex-shrink: 7;
        -moz-flex-shrink: 7;
        -ms-flex-shrink: 7;
        flex-shrink: 7;
    }

    .fx-lg-shrink-8 {
        -webkit-flex-shrink: 8;
        -moz-flex-shrink: 8;
        -ms-flex-shrink: 8;
        flex-shrink: 8;
    }

    .fx-lg-shrink-9 {
        -webkit-flex-shrink: 9;
        -moz-flex-shrink: 9;
        -ms-flex-shrink: 9;
        flex-shrink: 9;
    }

    .fx-lg-shrink-10 {
        -webkit-flex-shrink: 10;
        -moz-flex-shrink: 10;
        -ms-flex-shrink: 10;
        flex-shrink: 10;
    }

    .fx-lg-align-self-flex-start {
        -webkit-align-self: flex-start;
        -moz-align-self: flex-start;
        -ms-align-self: flex-start;
        align-self: flex-start;
    }

    .fx-lg-align-self-flex-end {
        -webkit-align-self: flex-end;
        -moz-align-self: flex-end;
        -ms-align-self: flex-end;
        align-self: flex-end;
    }

    .fx-lg-align-self-center {
        -webkit-align-self: center;
        -moz-align-self: center;
        -ms-align-self: center;
        align-self: center;
    }

    .fx-lg-align-self-baseline {
        -webkit-align-self: baseline;
        -moz-align-self: baseline;
        -ms-align-self: baseline;
        align-self: baseline;
    }

    .fx-lg-align-self-stretch {
        -webkit-align-self: stretch;
        -moz-align-self: stretch;
        -ms-align-self: stretch;
        align-self: stretch;
    }
}

@media (min-width: 768px) {
    .fx-example-highlight-colour-md {
        background: #6A95B5;
        color: #fff;
    }

    .fx-md-display-block {
        display: block;
    }

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

    .fx-md-display {
        display: -webkit-flex;
        display: -moz-flex;
        display: -ms-flexbox;
        display: -ms-flex;
        display: flex;
    }

    .fx-md-display-inline {
        display: -webkit-inline-flex;
        display: -moz-inline-flex;
        display: -ms-inline-flexbox;
        display: -ms-inline-flex;
        display: inline-flex;
    }

    .fx-md-direction {
        -webkit-flex-direction: row;
        -moz-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
    }

    .fx-md-direction-reverse {
        -webkit-flex-direction: row-reverse;
        -moz-flex-direction: row-reverse;
        -ms-flex-direction: row-reverse;
        flex-direction: row-reverse;
    }

    .fx-md-direction-column {
        -webkit-flex-direction: column;
        -moz-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .fx-md-direction-column-reverse {
        -webkit-flex-direction: column-reverse;
        -moz-flex-direction: column-reverse;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse;
    }

    .fx-md-wrap {
        -webkit-flex-wrap: wrap;
        -moz-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    .fx-md-wrap-nowrap {
        -webkit-flex-wrap: nowrap;
        -moz-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
    }

    .fx-md-wrap-reverse {
        -webkit-flex-wrap: wrap-reverse;
        -moz-flex-wrap: wrap-reverse;
        -ms-flex-wrap: wrap-reverse;
        flex-wrap: wrap-reverse;
    }

    .fx-md-justify-flex-start {
        -webkit-justify-content: flex-start;
        -moz-justify-content: flex-start;
        -ms-justify-content: flex-start;
        justify-content: flex-start;
    }

    .fx-md-justify-flex-end {
        -webkit-justify-content: flex-end;
        -moz-justify-content: flex-end;
        -ms-justify-content: flex-end;
        justify-content: flex-end;
    }

    .fx-md-justify-center {
        -webkit-justify-content: center;
        -moz-justify-content: center;
        -ms-justify-content: center;
        justify-content: center;
    }

    .fx-md-justify-space-between {
        -webkit-justify-content: space-between;
        -moz-justify-content: space-between;
        -ms-justify-content: space-between;
        justify-content: space-between;
    }

    .fx-md-justify-space-around {
        -webkit-justify-content: space-around;
        -moz-justify-content: space-around;
        -ms-justify-content: space-around;
        justify-content: space-around;
    }

    .fx-md-align-content-flex-start {
        -webkit-align-content: flex-start;
        -moz-align-content: flex-start;
        -ms-align-content: flex-start;
        align-content: flex-start;
    }

    .fx-md-align-content-flex-end {
        -webkit-align-content: flex-end;
        -moz-align-content: flex-end;
        -ms-align-content: flex-end;
        align-content: flex-end;
    }

    .fx-md-align-content-center {
        -webkit-align-content: center;
        -moz-align-content: center;
        -ms-align-content: center;
        align-content: center;
    }

    .fx-md-align-content-space-between {
        -webkit-align-content: space-between;
        -moz-align-content: space-between;
        -ms-align-content: space-between;
        align-content: space-between;
    }

    .fx-md-align-content-space-around {
        -webkit-align-content: space-around;
        -moz-align-content: space-around;
        -ms-align-content: space-around;
        align-content: space-around;
    }

    .fx-md-align-content-stretch {
        -webkit-align-content: stretch;
        -moz-align-content: stretch;
        -ms-align-content: stretch;
        align-content: stretch;
    }

    .fx-md-align-items-flex-start {
        -webkit-align-items: flex-start;
        -moz-align-items: flex-start;
        -ms-align-items: flex-start;
        align-items: flex-start;
    }

    .fx-md-align-items-flex-end {
        -webkit-align-items: flex-end;
        -moz-align-items: flex-end;
        -ms-align-items: flex-end;
        align-items: flex-end;
    }

    .fx-md-align-items-center {
        -webkit-align-items: center;
        -moz-align-items: center;
        -ms-align-items: center;
        align-items: center;
    }

    .fx-md-align-items-baseline {
        -webkit-align-items: baseline;
        -moz-align-items: baseline;
        -ms-align-items: baseline;
        align-items: baseline;
    }

    .fx-md-align-items-stretch {
        -webkit-align-items: stretch;
        -moz-align-items: stretch;
        -ms-align-items: stretch;
        align-items: stretch;
    }

    .fx-md-order-0 {
        -webkit-order: 0;
        -moz-order: 0;
        -ms-order: 0;
        order: 0;
    }

    .fx-md-order-1 {
        -webkit-order: 1;
        -moz-order: 1;
        -ms-order: 1;
        order: 1;
    }

    .fx-md-order-2 {
        -webkit-order: 2;
        -moz-order: 2;
        -ms-order: 2;
        order: 2;
    }

    .fx-md-order-3 {
        -webkit-order: 3;
        -moz-order: 3;
        -ms-order: 3;
        order: 3;
    }

    .fx-md-order-4 {
        -webkit-order: 4;
        -moz-order: 4;
        -ms-order: 4;
        order: 4;
    }

    .fx-md-order-5 {
        -webkit-order: 5;
        -moz-order: 5;
        -ms-order: 5;
        order: 5;
    }

    .fx-md-order-6 {
        -webkit-order: 6;
        -moz-order: 6;
        -ms-order: 6;
        order: 6;
    }

    .fx-md-order-7 {
        -webkit-order: 7;
        -moz-order: 7;
        -ms-order: 7;
        order: 7;
    }

    .fx-md-order-8 {
        -webkit-order: 8;
        -moz-order: 8;
        -ms-order: 8;
        order: 8;
    }

    .fx-md-order-9 {
        -webkit-order: 9;
        -moz-order: 9;
        -ms-order: 9;
        order: 9;
    }

    .fx-md-order-10 {
        -webkit-order: 10;
        -moz-order: 10;
        -ms-order: 10;
        order: 10;
    }

    .fx-md-grow-0 {
        -webkit-flex-grow: 0;
        -moz-flex-grow: 0;
        -ms-flex-grow: 0;
        flex-grow: 0;
    }

    .fx-md-grow-1 {
        -webkit-flex-grow: 1;
        -moz-flex-grow: 1;
        -ms-flex-grow: 1;
        flex-grow: 1;
    }

    .fx-md-grow-2 {
        -webkit-flex-grow: 2;
        -moz-flex-grow: 2;
        -ms-flex-grow: 2;
        flex-grow: 2;
    }

    .fx-md-grow-3 {
        -webkit-flex-grow: 3;
        -moz-flex-grow: 3;
        -ms-flex-grow: 3;
        flex-grow: 3;
    }

    .fx-md-grow-4 {
        -webkit-flex-grow: 4;
        -moz-flex-grow: 4;
        -ms-flex-grow: 4;
        flex-grow: 4;
    }

    .fx-md-grow-5 {
        -webkit-flex-grow: 5;
        -moz-flex-grow: 5;
        -ms-flex-grow: 5;
        flex-grow: 5;
    }

    .fx-md-grow-6 {
        -webkit-flex-grow: 6;
        -moz-flex-grow: 6;
        -ms-flex-grow: 6;
        flex-grow: 6;
    }

    .fx-md-grow-7 {
        -webkit-flex-grow: 7;
        -moz-flex-grow: 7;
        -ms-flex-grow: 7;
        flex-grow: 7;
    }

    .fx-md-grow-8 {
        -webkit-flex-grow: 8;
        -moz-flex-grow: 8;
        -ms-flex-grow: 8;
        flex-grow: 8;
    }

    .fx-md-grow-9 {
        -webkit-flex-grow: 9;
        -moz-flex-grow: 9;
        -ms-flex-grow: 9;
        flex-grow: 9;
    }

    .fx-md-grow-10 {
        -webkit-flex-grow: 10;
        -moz-flex-grow: 10;
        -ms-flex-grow: 10;
        flex-grow: 10;
    }

    .fx-md-shrink-0 {
        -webkit-flex-shrink: 0;
        -moz-flex-shrink: 0;
        -ms-flex-shrink: 0;
        flex-shrink: 0;
    }

    .fx-md-shrink-1 {
        -webkit-flex-shrink: 1;
        -moz-flex-shrink: 1;
        -ms-flex-shrink: 1;
        flex-shrink: 1;
    }

    .fx-md-shrink-2 {
        -webkit-flex-shrink: 2;
        -moz-flex-shrink: 2;
        -ms-flex-shrink: 2;
        flex-shrink: 2;
    }

    .fx-md-shrink-3 {
        -webkit-flex-shrink: 3;
        -moz-flex-shrink: 3;
        -ms-flex-shrink: 3;
        flex-shrink: 3;
    }

    .fx-md-shrink-4 {
        -webkit-flex-shrink: 4;
        -moz-flex-shrink: 4;
        -ms-flex-shrink: 4;
        flex-shrink: 4;
    }

    .fx-md-shrink-5 {
        -webkit-flex-shrink: 5;
        -moz-flex-shrink: 5;
        -ms-flex-shrink: 5;
        flex-shrink: 5;
    }

    .fx-md-shrink-6 {
        -webkit-flex-shrink: 6;
        -moz-flex-shrink: 6;
        -ms-flex-shrink: 6;
        flex-shrink: 6;
    }

    .fx-md-shrink-7 {
        -webkit-flex-shrink: 7;
        -moz-flex-shrink: 7;
        -ms-flex-shrink: 7;
        flex-shrink: 7;
    }

    .fx-md-shrink-8 {
        -webkit-flex-shrink: 8;
        -moz-flex-shrink: 8;
        -ms-flex-shrink: 8;
        flex-shrink: 8;
    }

    .fx-md-shrink-9 {
        -webkit-flex-shrink: 9;
        -moz-flex-shrink: 9;
        -ms-flex-shrink: 9;
        flex-shrink: 9;
    }

    .fx-md-shrink-10 {
        -webkit-flex-shrink: 10;
        -moz-flex-shrink: 10;
        -ms-flex-shrink: 10;
        flex-shrink: 10;
    }

    .fx-md-align-self-flex-start {
        -webkit-align-self: flex-start;
        -moz-align-self: flex-start;
        -ms-align-self: flex-start;
        align-self: flex-start;
    }

    .fx-md-align-self-flex-end {
        -webkit-align-self: flex-end;
        -moz-align-self: flex-end;
        -ms-align-self: flex-end;
        align-self: flex-end;
    }

    .fx-md-align-self-center {
        -webkit-align-self: center;
        -moz-align-self: center;
        -ms-align-self: center;
        align-self: center;
    }

    .fx-md-align-self-baseline {
        -webkit-align-self: baseline;
        -moz-align-self: baseline;
        -ms-align-self: baseline;
        align-self: baseline;
    }

    .fx-md-align-self-stretch {
        -webkit-align-self: stretch;
        -moz-align-self: stretch;
        -ms-align-self: stretch;
        align-self: stretch;
    }
}

@media (min-width: 544px) {
    .fx-example-highlight-colour-sm {
        background: #6A95B5;
        color: #fff;
    }

    .fx-sm-display-block {
        display: block;
    }

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

    .fx-sm-display {
        display: -webkit-flex;
        display: -moz-flex;
        display: -ms-flexbox;
        display: -ms-flex;
        display: flex;
    }

    .fx-sm-display-inline {
        display: -webkit-inline-flex;
        display: -moz-inline-flex;
        display: -ms-inline-flexbox;
        display: -ms-inline-flex;
        display: inline-flex;
    }

    .fx-sm-direction {
        -webkit-flex-direction: row;
        -moz-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
    }

    .fx-sm-direction-reverse {
        -webkit-flex-direction: row-reverse;
        -moz-flex-direction: row-reverse;
        -ms-flex-direction: row-reverse;
        flex-direction: row-reverse;
    }

    .fx-sm-direction-column {
        -webkit-flex-direction: column;
        -moz-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .fx-sm-direction-column-reverse {
        -webkit-flex-direction: column-reverse;
        -moz-flex-direction: column-reverse;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse;
    }

    .fx-sm-wrap {
        -webkit-flex-wrap: wrap;
        -moz-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    .fx-sm-wrap-nowrap {
        -webkit-flex-wrap: nowrap;
        -moz-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
    }

    .fx-sm-wrap-reverse {
        -webkit-flex-wrap: wrap-reverse;
        -moz-flex-wrap: wrap-reverse;
        -ms-flex-wrap: wrap-reverse;
        flex-wrap: wrap-reverse;
    }

    .fx-sm-justify-flex-start {
        -webkit-justify-content: flex-start;
        -moz-justify-content: flex-start;
        -ms-justify-content: flex-start;
        justify-content: flex-start;
    }

    .fx-sm-justify-flex-end {
        -webkit-justify-content: flex-end;
        -moz-justify-content: flex-end;
        -ms-justify-content: flex-end;
        justify-content: flex-end;
    }

    .fx-sm-justify-center {
        -webkit-justify-content: center;
        -moz-justify-content: center;
        -ms-justify-content: center;
        justify-content: center;
    }

    .fx-sm-justify-space-between {
        -webkit-justify-content: space-between;
        -moz-justify-content: space-between;
        -ms-justify-content: space-between;
        justify-content: space-between;
    }

    .fx-sm-justify-space-around {
        -webkit-justify-content: space-around;
        -moz-justify-content: space-around;
        -ms-justify-content: space-around;
        justify-content: space-around;
    }

    .fx-sm-align-content-flex-start {
        -webkit-align-content: flex-start;
        -moz-align-content: flex-start;
        -ms-align-content: flex-start;
        align-content: flex-start;
    }

    .fx-sm-align-content-flex-end {
        -webkit-align-content: flex-end;
        -moz-align-content: flex-end;
        -ms-align-content: flex-end;
        align-content: flex-end;
    }

    .fx-sm-align-content-center {
        -webkit-align-content: center;
        -moz-align-content: center;
        -ms-align-content: center;
        align-content: center;
    }

    .fx-sm-align-content-space-between {
        -webkit-align-content: space-between;
        -moz-align-content: space-between;
        -ms-align-content: space-between;
        align-content: space-between;
    }

    .fx-sm-align-content-space-around {
        -webkit-align-content: space-around;
        -moz-align-content: space-around;
        -ms-align-content: space-around;
        align-content: space-around;
    }

    .fx-sm-align-content-stretch {
        -webkit-align-content: stretch;
        -moz-align-content: stretch;
        -ms-align-content: stretch;
        align-content: stretch;
    }

    .fx-sm-align-items-flex-start {
        -webkit-align-items: flex-start;
        -moz-align-items: flex-start;
        -ms-align-items: flex-start;
        align-items: flex-start;
    }

    .fx-sm-align-items-flex-end {
        -webkit-align-items: flex-end;
        -moz-align-items: flex-end;
        -ms-align-items: flex-end;
        align-items: flex-end;
    }

    .fx-sm-align-items-center {
        -webkit-align-items: center;
        -moz-align-items: center;
        -ms-align-items: center;
        align-items: center;
    }

    .fx-sm-align-items-baseline {
        -webkit-align-items: baseline;
        -moz-align-items: baseline;
        -ms-align-items: baseline;
        align-items: baseline;
    }

    .fx-sm-align-items-stretch {
        -webkit-align-items: stretch;
        -moz-align-items: stretch;
        -ms-align-items: stretch;
        align-items: stretch;
    }

    .fx-sm-order-0 {
        -webkit-order: 0;
        -moz-order: 0;
        -ms-order: 0;
        order: 0;
    }

    .fx-sm-order-1 {
        -webkit-order: 1;
        -moz-order: 1;
        -ms-order: 1;
        order: 1;
    }

    .fx-sm-order-2 {
        -webkit-order: 2;
        -moz-order: 2;
        -ms-order: 2;
        order: 2;
    }

    .fx-sm-order-3 {
        -webkit-order: 3;
        -moz-order: 3;
        -ms-order: 3;
        order: 3;
    }

    .fx-sm-order-4 {
        -webkit-order: 4;
        -moz-order: 4;
        -ms-order: 4;
        order: 4;
    }

    .fx-sm-order-5 {
        -webkit-order: 5;
        -moz-order: 5;
        -ms-order: 5;
        order: 5;
    }

    .fx-sm-order-6 {
        -webkit-order: 6;
        -moz-order: 6;
        -ms-order: 6;
        order: 6;
    }

    .fx-sm-order-7 {
        -webkit-order: 7;
        -moz-order: 7;
        -ms-order: 7;
        order: 7;
    }

    .fx-sm-order-8 {
        -webkit-order: 8;
        -moz-order: 8;
        -ms-order: 8;
        order: 8;
    }

    .fx-sm-order-9 {
        -webkit-order: 9;
        -moz-order: 9;
        -ms-order: 9;
        order: 9;
    }

    .fx-sm-order-10 {
        -webkit-order: 10;
        -moz-order: 10;
        -ms-order: 10;
        order: 10;
    }

    .fx-sm-grow-0 {
        -webkit-flex-grow: 0;
        -moz-flex-grow: 0;
        -ms-flex-grow: 0;
        flex-grow: 0;
    }

    .fx-sm-grow-1 {
        -webkit-flex-grow: 1;
        -moz-flex-grow: 1;
        -ms-flex-grow: 1;
        flex-grow: 1;
    }

    .fx-sm-grow-2 {
        -webkit-flex-grow: 2;
        -moz-flex-grow: 2;
        -ms-flex-grow: 2;
        flex-grow: 2;
    }

    .fx-sm-grow-3 {
        -webkit-flex-grow: 3;
        -moz-flex-grow: 3;
        -ms-flex-grow: 3;
        flex-grow: 3;
    }

    .fx-sm-grow-4 {
        -webkit-flex-grow: 4;
        -moz-flex-grow: 4;
        -ms-flex-grow: 4;
        flex-grow: 4;
    }

    .fx-sm-grow-5 {
        -webkit-flex-grow: 5;
        -moz-flex-grow: 5;
        -ms-flex-grow: 5;
        flex-grow: 5;
    }

    .fx-sm-grow-6 {
        -webkit-flex-grow: 6;
        -moz-flex-grow: 6;
        -ms-flex-grow: 6;
        flex-grow: 6;
    }

    .fx-sm-grow-7 {
        -webkit-flex-grow: 7;
        -moz-flex-grow: 7;
        -ms-flex-grow: 7;
        flex-grow: 7;
    }

    .fx-sm-grow-8 {
        -webkit-flex-grow: 8;
        -moz-flex-grow: 8;
        -ms-flex-grow: 8;
        flex-grow: 8;
    }

    .fx-sm-grow-9 {
        -webkit-flex-grow: 9;
        -moz-flex-grow: 9;
        -ms-flex-grow: 9;
        flex-grow: 9;
    }

    .fx-sm-grow-10 {
        -webkit-flex-grow: 10;
        -moz-flex-grow: 10;
        -ms-flex-grow: 10;
        flex-grow: 10;
    }

    .fx-sm-shrink-0 {
        -webkit-flex-shrink: 0;
        -moz-flex-shrink: 0;
        -ms-flex-shrink: 0;
        flex-shrink: 0;
    }

    .fx-sm-shrink-1 {
        -webkit-flex-shrink: 1;
        -moz-flex-shrink: 1;
        -ms-flex-shrink: 1;
        flex-shrink: 1;
    }

    .fx-sm-shrink-2 {
        -webkit-flex-shrink: 2;
        -moz-flex-shrink: 2;
        -ms-flex-shrink: 2;
        flex-shrink: 2;
    }

    .fx-sm-shrink-3 {
        -webkit-flex-shrink: 3;
        -moz-flex-shrink: 3;
        -ms-flex-shrink: 3;
        flex-shrink: 3;
    }

    .fx-sm-shrink-4 {
        -webkit-flex-shrink: 4;
        -moz-flex-shrink: 4;
        -ms-flex-shrink: 4;
        flex-shrink: 4;
    }

    .fx-sm-shrink-5 {
        -webkit-flex-shrink: 5;
        -moz-flex-shrink: 5;
        -ms-flex-shrink: 5;
        flex-shrink: 5;
    }

    .fx-sm-shrink-6 {
        -webkit-flex-shrink: 6;
        -moz-flex-shrink: 6;
        -ms-flex-shrink: 6;
        flex-shrink: 6;
    }

    .fx-sm-shrink-7 {
        -webkit-flex-shrink: 7;
        -moz-flex-shrink: 7;
        -ms-flex-shrink: 7;
        flex-shrink: 7;
    }

    .fx-sm-shrink-8 {
        -webkit-flex-shrink: 8;
        -moz-flex-shrink: 8;
        -ms-flex-shrink: 8;
        flex-shrink: 8;
    }

    .fx-sm-shrink-9 {
        -webkit-flex-shrink: 9;
        -moz-flex-shrink: 9;
        -ms-flex-shrink: 9;
        flex-shrink: 9;
    }

    .fx-sm-shrink-10 {
        -webkit-flex-shrink: 10;
        -moz-flex-shrink: 10;
        -ms-flex-shrink: 10;
        flex-shrink: 10;
    }

    .fx-sm-align-self-flex-start {
        -webkit-align-self: flex-start;
        -moz-align-self: flex-start;
        -ms-align-self: flex-start;
        align-self: flex-start;
    }

    .fx-sm-align-self-flex-end {
        -webkit-align-self: flex-end;
        -moz-align-self: flex-end;
        -ms-align-self: flex-end;
        align-self: flex-end;
    }

    .fx-sm-align-self-center {
        -webkit-align-self: center;
        -moz-align-self: center;
        -ms-align-self: center;
        align-self: center;
    }

    .fx-sm-align-self-baseline {
        -webkit-align-self: baseline;
        -moz-align-self: baseline;
        -ms-align-self: baseline;
        align-self: baseline;
    }

    .fx-sm-align-self-stretch {
        -webkit-align-self: stretch;
        -moz-align-self: stretch;
        -ms-align-self: stretch;
        align-self: stretch;
    }
}

@media (min-width: 0px) {
    .fx-example-highlight-colour-xs {
        background: #6A95B5;
        color: #fff;
    }

    .fx-xs-display-block {
        display: block;
    }

    .fx-xs-display-block-inline {
        display: inline-block;
    }

    .fx-xs-display {
        display: -webkit-flex;
        display: -moz-flex;
        display: -ms-flexbox;
        display: -ms-flex;
        display: flex;
    }

    .fx-xs-display-inline {
        display: -webkit-inline-flex;
        display: -moz-inline-flex;
        display: -ms-inline-flexbox;
        display: -ms-inline-flex;
        display: inline-flex;
    }

    .fx-xs-direction {
        -webkit-flex-direction: row;
        -moz-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
    }

    .fx-xs-direction-reverse {
        -webkit-flex-direction: row-reverse;
        -moz-flex-direction: row-reverse;
        -ms-flex-direction: row-reverse;
        flex-direction: row-reverse;
    }

    .fx-xs-direction-column {
        -webkit-flex-direction: column;
        -moz-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .fx-xs-direction-column-reverse {
        -webkit-flex-direction: column-reverse;
        -moz-flex-direction: column-reverse;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse;
    }

    .fx-xs-wrap {
        -webkit-flex-wrap: wrap;
        -moz-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    .fx-xs-wrap-nowrap {
        -webkit-flex-wrap: nowrap;
        -moz-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
    }

    .fx-xs-wrap-reverse {
        -webkit-flex-wrap: wrap-reverse;
        -moz-flex-wrap: wrap-reverse;
        -ms-flex-wrap: wrap-reverse;
        flex-wrap: wrap-reverse;
    }

    .fx-xs-justify-flex-start {
        -webkit-justify-content: flex-start;
        -moz-justify-content: flex-start;
        -ms-justify-content: flex-start;
        justify-content: flex-start;
    }

    .fx-xs-justify-flex-end {
        -webkit-justify-content: flex-end;
        -moz-justify-content: flex-end;
        -ms-justify-content: flex-end;
        justify-content: flex-end;
    }

    .fx-xs-justify-center {
        -webkit-justify-content: center;
        -moz-justify-content: center;
        -ms-justify-content: center;
        justify-content: center;
    }

    .fx-xs-justify-space-between {
        -webkit-justify-content: space-between;
        -moz-justify-content: space-between;
        -ms-justify-content: space-between;
        justify-content: space-between;
    }

    .fx-xs-justify-space-around {
        -webkit-justify-content: space-around;
        -moz-justify-content: space-around;
        -ms-justify-content: space-around;
        justify-content: space-around;
    }

    .fx-xs-align-content-flex-start {
        -webkit-align-content: flex-start;
        -moz-align-content: flex-start;
        -ms-align-content: flex-start;
        align-content: flex-start;
    }

    .fx-xs-align-content-flex-end {
        -webkit-align-content: flex-end;
        -moz-align-content: flex-end;
        -ms-align-content: flex-end;
        align-content: flex-end;
    }

    .fx-xs-align-content-center {
        -webkit-align-content: center;
        -moz-align-content: center;
        -ms-align-content: center;
        align-content: center;
    }

    .fx-xs-align-content-space-between {
        -webkit-align-content: space-between;
        -moz-align-content: space-between;
        -ms-align-content: space-between;
        align-content: space-between;
    }

    .fx-xs-align-content-space-around {
        -webkit-align-content: space-around;
        -moz-align-content: space-around;
        -ms-align-content: space-around;
        align-content: space-around;
    }

    .fx-xs-align-content-stretch {
        -webkit-align-content: stretch;
        -moz-align-content: stretch;
        -ms-align-content: stretch;
        align-content: stretch;
    }

    .fx-xs-align-items-flex-start {
        -webkit-align-items: flex-start;
        -moz-align-items: flex-start;
        -ms-align-items: flex-start;
        align-items: flex-start;
    }

    .fx-xs-align-items-flex-end {
        -webkit-align-items: flex-end;
        -moz-align-items: flex-end;
        -ms-align-items: flex-end;
        align-items: flex-end;
    }

    .fx-xs-align-items-center {
        -webkit-align-items: center;
        -moz-align-items: center;
        -ms-align-items: center;
        align-items: center;
    }

    .fx-xs-align-items-baseline {
        -webkit-align-items: baseline;
        -moz-align-items: baseline;
        -ms-align-items: baseline;
        align-items: baseline;
    }

    .fx-xs-align-items-stretch {
        -webkit-align-items: stretch;
        -moz-align-items: stretch;
        -ms-align-items: stretch;
        align-items: stretch;
    }

    .fx-xs-order-0 {
        -webkit-order: 0;
        -moz-order: 0;
        -ms-order: 0;
        order: 0;
    }

    .fx-xs-order-1 {
        -webkit-order: 1;
        -moz-order: 1;
        -ms-order: 1;
        order: 1;
    }

    .fx-xs-order-2 {
        -webkit-order: 2;
        -moz-order: 2;
        -ms-order: 2;
        order: 2;
    }

    .fx-xs-order-3 {
        -webkit-order: 3;
        -moz-order: 3;
        -ms-order: 3;
        order: 3;
    }

    .fx-xs-order-4 {
        -webkit-order: 4;
        -moz-order: 4;
        -ms-order: 4;
        order: 4;
    }

    .fx-xs-order-5 {
        -webkit-order: 5;
        -moz-order: 5;
        -ms-order: 5;
        order: 5;
    }

    .fx-xs-order-6 {
        -webkit-order: 6;
        -moz-order: 6;
        -ms-order: 6;
        order: 6;
    }

    .fx-xs-order-7 {
        -webkit-order: 7;
        -moz-order: 7;
        -ms-order: 7;
        order: 7;
    }

    .fx-xs-order-8 {
        -webkit-order: 8;
        -moz-order: 8;
        -ms-order: 8;
        order: 8;
    }

    .fx-xs-order-9 {
        -webkit-order: 9;
        -moz-order: 9;
        -ms-order: 9;
        order: 9;
    }

    .fx-xs-order-10 {
        -webkit-order: 10;
        -moz-order: 10;
        -ms-order: 10;
        order: 10;
    }

    .fx-xs-grow-0 {
        -webkit-flex-grow: 0;
        -moz-flex-grow: 0;
        -ms-flex-grow: 0;
        flex-grow: 0;
    }

    .fx-xs-grow-1 {
        -webkit-flex-grow: 1;
        -moz-flex-grow: 1;
        -ms-flex-grow: 1;
        flex-grow: 1;
    }

    .fx-xs-grow-2 {
        -webkit-flex-grow: 2;
        -moz-flex-grow: 2;
        -ms-flex-grow: 2;
        flex-grow: 2;
    }

    .fx-xs-grow-3 {
        -webkit-flex-grow: 3;
        -moz-flex-grow: 3;
        -ms-flex-grow: 3;
        flex-grow: 3;
    }

    .fx-xs-grow-4 {
        -webkit-flex-grow: 4;
        -moz-flex-grow: 4;
        -ms-flex-grow: 4;
        flex-grow: 4;
    }

    .fx-xs-grow-5 {
        -webkit-flex-grow: 5;
        -moz-flex-grow: 5;
        -ms-flex-grow: 5;
        flex-grow: 5;
    }

    .fx-xs-grow-6 {
        -webkit-flex-grow: 6;
        -moz-flex-grow: 6;
        -ms-flex-grow: 6;
        flex-grow: 6;
    }

    .fx-xs-grow-7 {
        -webkit-flex-grow: 7;
        -moz-flex-grow: 7;
        -ms-flex-grow: 7;
        flex-grow: 7;
    }

    .fx-xs-grow-8 {
        -webkit-flex-grow: 8;
        -moz-flex-grow: 8;
        -ms-flex-grow: 8;
        flex-grow: 8;
    }

    .fx-xs-grow-9 {
        -webkit-flex-grow: 9;
        -moz-flex-grow: 9;
        -ms-flex-grow: 9;
        flex-grow: 9;
    }

    .fx-xs-grow-10 {
        -webkit-flex-grow: 10;
        -moz-flex-grow: 10;
        -ms-flex-grow: 10;
        flex-grow: 10;
    }

    .fx-xs-shrink-0 {
        -webkit-flex-shrink: 0;
        -moz-flex-shrink: 0;
        -ms-flex-shrink: 0;
        flex-shrink: 0;
    }

    .fx-xs-shrink-1 {
        -webkit-flex-shrink: 1;
        -moz-flex-shrink: 1;
        -ms-flex-shrink: 1;
        flex-shrink: 1;
    }

    .fx-xs-shrink-2 {
        -webkit-flex-shrink: 2;
        -moz-flex-shrink: 2;
        -ms-flex-shrink: 2;
        flex-shrink: 2;
    }

    .fx-xs-shrink-3 {
        -webkit-flex-shrink: 3;
        -moz-flex-shrink: 3;
        -ms-flex-shrink: 3;
        flex-shrink: 3;
    }

    .fx-xs-shrink-4 {
        -webkit-flex-shrink: 4;
        -moz-flex-shrink: 4;
        -ms-flex-shrink: 4;
        flex-shrink: 4;
    }

    .fx-xs-shrink-5 {
        -webkit-flex-shrink: 5;
        -moz-flex-shrink: 5;
        -ms-flex-shrink: 5;
        flex-shrink: 5;
    }

    .fx-xs-shrink-6 {
        -webkit-flex-shrink: 6;
        -moz-flex-shrink: 6;
        -ms-flex-shrink: 6;
        flex-shrink: 6;
    }

    .fx-xs-shrink-7 {
        -webkit-flex-shrink: 7;
        -moz-flex-shrink: 7;
        -ms-flex-shrink: 7;
        flex-shrink: 7;
    }

    .fx-xs-shrink-8 {
        -webkit-flex-shrink: 8;
        -moz-flex-shrink: 8;
        -ms-flex-shrink: 8;
        flex-shrink: 8;
    }

    .fx-xs-shrink-9 {
        -webkit-flex-shrink: 9;
        -moz-flex-shrink: 9;
        -ms-flex-shrink: 9;
        flex-shrink: 9;
    }

    .fx-xs-shrink-10 {
        -webkit-flex-shrink: 10;
        -moz-flex-shrink: 10;
        -ms-flex-shrink: 10;
        flex-shrink: 10;
    }

    .fx-xs-align-self-flex-start {
        -webkit-align-self: flex-start;
        -moz-align-self: flex-start;
        -ms-align-self: flex-start;
        align-self: flex-start;
    }

    .fx-xs-align-self-flex-end {
        -webkit-align-self: flex-end;
        -moz-align-self: flex-end;
        -ms-align-self: flex-end;
        align-self: flex-end;
    }

    .fx-xs-align-self-center {
        -webkit-align-self: center;
        -moz-align-self: center;
        -ms-align-self: center;
        align-self: center;
    }

    .fx-xs-align-self-baseline {
        -webkit-align-self: baseline;
        -moz-align-self: baseline;
        -ms-align-self: baseline;
        align-self: baseline;
    }

    .fx-xs-align-self-stretch {
        -webkit-align-self: stretch;
        -moz-align-self: stretch;
        -ms-align-self: stretch;
        align-self: stretch;
    }
}

@media (min-width: 0px) {
    .fx-example-highlight-colour-df-xl {
        background: #6A95B5;
        color: #fff;
    }

    .fx-df-xl-display-block {
        display: block;
    }

    .fx-df-xl-display-block-inline {
        display: inline-block;
    }

    .fx-df-xl-display {
        display: -webkit-flex;
        display: -moz-flex;
        display: -ms-flexbox;
        display: -ms-flex;
        display: flex;
    }

    .fx-df-xl-display-inline {
        display: -webkit-inline-flex;
        display: -moz-inline-flex;
        display: -ms-inline-flexbox;
        display: -ms-inline-flex;
        display: inline-flex;
    }

    .fx-df-xl-direction {
        -webkit-flex-direction: row;
        -moz-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
    }

    .fx-df-xl-direction-reverse {
        -webkit-flex-direction: row-reverse;
        -moz-flex-direction: row-reverse;
        -ms-flex-direction: row-reverse;
        flex-direction: row-reverse;
    }

    .fx-df-xl-direction-column {
        -webkit-flex-direction: column;
        -moz-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .fx-df-xl-direction-column-reverse {
        -webkit-flex-direction: column-reverse;
        -moz-flex-direction: column-reverse;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse;
    }

    .fx-df-xl-wrap {
        -webkit-flex-wrap: wrap;
        -moz-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    .fx-df-xl-wrap-nowrap {
        -webkit-flex-wrap: nowrap;
        -moz-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
    }

    .fx-df-xl-wrap-reverse {
        -webkit-flex-wrap: wrap-reverse;
        -moz-flex-wrap: wrap-reverse;
        -ms-flex-wrap: wrap-reverse;
        flex-wrap: wrap-reverse;
    }

    .fx-df-xl-justify-flex-start {
        -webkit-justify-content: flex-start;
        -moz-justify-content: flex-start;
        -ms-justify-content: flex-start;
        justify-content: flex-start;
    }

    .fx-df-xl-justify-flex-end {
        -webkit-justify-content: flex-end;
        -moz-justify-content: flex-end;
        -ms-justify-content: flex-end;
        justify-content: flex-end;
    }

    .fx-df-xl-justify-center {
        -webkit-justify-content: center;
        -moz-justify-content: center;
        -ms-justify-content: center;
        justify-content: center;
    }

    .fx-df-xl-justify-space-between {
        -webkit-justify-content: space-between;
        -moz-justify-content: space-between;
        -ms-justify-content: space-between;
        justify-content: space-between;
    }

    .fx-df-xl-justify-space-around {
        -webkit-justify-content: space-around;
        -moz-justify-content: space-around;
        -ms-justify-content: space-around;
        justify-content: space-around;
    }

    .fx-df-xl-align-content-flex-start {
        -webkit-align-content: flex-start;
        -moz-align-content: flex-start;
        -ms-align-content: flex-start;
        align-content: flex-start;
    }

    .fx-df-xl-align-content-flex-end {
        -webkit-align-content: flex-end;
        -moz-align-content: flex-end;
        -ms-align-content: flex-end;
        align-content: flex-end;
    }

    .fx-df-xl-align-content-center {
        -webkit-align-content: center;
        -moz-align-content: center;
        -ms-align-content: center;
        align-content: center;
    }

    .fx-df-xl-align-content-space-between {
        -webkit-align-content: space-between;
        -moz-align-content: space-between;
        -ms-align-content: space-between;
        align-content: space-between;
    }

    .fx-df-xl-align-content-space-around {
        -webkit-align-content: space-around;
        -moz-align-content: space-around;
        -ms-align-content: space-around;
        align-content: space-around;
    }

    .fx-df-xl-align-content-stretch {
        -webkit-align-content: stretch;
        -moz-align-content: stretch;
        -ms-align-content: stretch;
        align-content: stretch;
    }

    .fx-df-xl-align-items-flex-start {
        -webkit-align-items: flex-start;
        -moz-align-items: flex-start;
        -ms-align-items: flex-start;
        align-items: flex-start;
    }

    .fx-df-xl-align-items-flex-end {
        -webkit-align-items: flex-end;
        -moz-align-items: flex-end;
        -ms-align-items: flex-end;
        align-items: flex-end;
    }

    .fx-df-xl-align-items-center {
        -webkit-align-items: center;
        -moz-align-items: center;
        -ms-align-items: center;
        align-items: center;
    }

    .fx-df-xl-align-items-baseline {
        -webkit-align-items: baseline;
        -moz-align-items: baseline;
        -ms-align-items: baseline;
        align-items: baseline;
    }

    .fx-df-xl-align-items-stretch {
        -webkit-align-items: stretch;
        -moz-align-items: stretch;
        -ms-align-items: stretch;
        align-items: stretch;
    }

    .fx-df-xl-order-0 {
        -webkit-order: 0;
        -moz-order: 0;
        -ms-order: 0;
        order: 0;
    }

    .fx-df-xl-order-1 {
        -webkit-order: 1;
        -moz-order: 1;
        -ms-order: 1;
        order: 1;
    }

    .fx-df-xl-order-2 {
        -webkit-order: 2;
        -moz-order: 2;
        -ms-order: 2;
        order: 2;
    }

    .fx-df-xl-order-3 {
        -webkit-order: 3;
        -moz-order: 3;
        -ms-order: 3;
        order: 3;
    }

    .fx-df-xl-order-4 {
        -webkit-order: 4;
        -moz-order: 4;
        -ms-order: 4;
        order: 4;
    }

    .fx-df-xl-order-5 {
        -webkit-order: 5;
        -moz-order: 5;
        -ms-order: 5;
        order: 5;
    }

    .fx-df-xl-order-6 {
        -webkit-order: 6;
        -moz-order: 6;
        -ms-order: 6;
        order: 6;
    }

    .fx-df-xl-order-7 {
        -webkit-order: 7;
        -moz-order: 7;
        -ms-order: 7;
        order: 7;
    }

    .fx-df-xl-order-8 {
        -webkit-order: 8;
        -moz-order: 8;
        -ms-order: 8;
        order: 8;
    }

    .fx-df-xl-order-9 {
        -webkit-order: 9;
        -moz-order: 9;
        -ms-order: 9;
        order: 9;
    }

    .fx-df-xl-order-10 {
        -webkit-order: 10;
        -moz-order: 10;
        -ms-order: 10;
        order: 10;
    }

    .fx-df-xl-grow-0 {
        -webkit-flex-grow: 0;
        -moz-flex-grow: 0;
        -ms-flex-grow: 0;
        flex-grow: 0;
    }

    .fx-df-xl-grow-1 {
        -webkit-flex-grow: 1;
        -moz-flex-grow: 1;
        -ms-flex-grow: 1;
        flex-grow: 1;
    }

    .fx-df-xl-grow-2 {
        -webkit-flex-grow: 2;
        -moz-flex-grow: 2;
        -ms-flex-grow: 2;
        flex-grow: 2;
    }

    .fx-df-xl-grow-3 {
        -webkit-flex-grow: 3;
        -moz-flex-grow: 3;
        -ms-flex-grow: 3;
        flex-grow: 3;
    }

    .fx-df-xl-grow-4 {
        -webkit-flex-grow: 4;
        -moz-flex-grow: 4;
        -ms-flex-grow: 4;
        flex-grow: 4;
    }

    .fx-df-xl-grow-5 {
        -webkit-flex-grow: 5;
        -moz-flex-grow: 5;
        -ms-flex-grow: 5;
        flex-grow: 5;
    }

    .fx-df-xl-grow-6 {
        -webkit-flex-grow: 6;
        -moz-flex-grow: 6;
        -ms-flex-grow: 6;
        flex-grow: 6;
    }

    .fx-df-xl-grow-7 {
        -webkit-flex-grow: 7;
        -moz-flex-grow: 7;
        -ms-flex-grow: 7;
        flex-grow: 7;
    }

    .fx-df-xl-grow-8 {
        -webkit-flex-grow: 8;
        -moz-flex-grow: 8;
        -ms-flex-grow: 8;
        flex-grow: 8;
    }

    .fx-df-xl-grow-9 {
        -webkit-flex-grow: 9;
        -moz-flex-grow: 9;
        -ms-flex-grow: 9;
        flex-grow: 9;
    }

    .fx-df-xl-grow-10 {
        -webkit-flex-grow: 10;
        -moz-flex-grow: 10;
        -ms-flex-grow: 10;
        flex-grow: 10;
    }

    .fx-df-xl-shrink-0 {
        -webkit-flex-shrink: 0;
        -moz-flex-shrink: 0;
        -ms-flex-shrink: 0;
        flex-shrink: 0;
    }

    .fx-df-xl-shrink-1 {
        -webkit-flex-shrink: 1;
        -moz-flex-shrink: 1;
        -ms-flex-shrink: 1;
        flex-shrink: 1;
    }

    .fx-df-xl-shrink-2 {
        -webkit-flex-shrink: 2;
        -moz-flex-shrink: 2;
        -ms-flex-shrink: 2;
        flex-shrink: 2;
    }

    .fx-df-xl-shrink-3 {
        -webkit-flex-shrink: 3;
        -moz-flex-shrink: 3;
        -ms-flex-shrink: 3;
        flex-shrink: 3;
    }

    .fx-df-xl-shrink-4 {
        -webkit-flex-shrink: 4;
        -moz-flex-shrink: 4;
        -ms-flex-shrink: 4;
        flex-shrink: 4;
    }

    .fx-df-xl-shrink-5 {
        -webkit-flex-shrink: 5;
        -moz-flex-shrink: 5;
        -ms-flex-shrink: 5;
        flex-shrink: 5;
    }

    .fx-df-xl-shrink-6 {
        -webkit-flex-shrink: 6;
        -moz-flex-shrink: 6;
        -ms-flex-shrink: 6;
        flex-shrink: 6;
    }

    .fx-df-xl-shrink-7 {
        -webkit-flex-shrink: 7;
        -moz-flex-shrink: 7;
        -ms-flex-shrink: 7;
        flex-shrink: 7;
    }

    .fx-df-xl-shrink-8 {
        -webkit-flex-shrink: 8;
        -moz-flex-shrink: 8;
        -ms-flex-shrink: 8;
        flex-shrink: 8;
    }

    .fx-df-xl-shrink-9 {
        -webkit-flex-shrink: 9;
        -moz-flex-shrink: 9;
        -ms-flex-shrink: 9;
        flex-shrink: 9;
    }

    .fx-df-xl-shrink-10 {
        -webkit-flex-shrink: 10;
        -moz-flex-shrink: 10;
        -ms-flex-shrink: 10;
        flex-shrink: 10;
    }

    .fx-df-xl-align-self-flex-start {
        -webkit-align-self: flex-start;
        -moz-align-self: flex-start;
        -ms-align-self: flex-start;
        align-self: flex-start;
    }

    .fx-df-xl-align-self-flex-end {
        -webkit-align-self: flex-end;
        -moz-align-self: flex-end;
        -ms-align-self: flex-end;
        align-self: flex-end;
    }

    .fx-df-xl-align-self-center {
        -webkit-align-self: center;
        -moz-align-self: center;
        -ms-align-self: center;
        align-self: center;
    }

    .fx-df-xl-align-self-baseline {
        -webkit-align-self: baseline;
        -moz-align-self: baseline;
        -ms-align-self: baseline;
        align-self: baseline;
    }

    .fx-df-xl-align-self-stretch {
        -webkit-align-self: stretch;
        -moz-align-self: stretch;
        -ms-align-self: stretch;
        align-self: stretch;
    }
}

@media (max-width: 1200px) {
    .fx-example-highlight-colour-df-lg {
        background: #6A95B5;
        color: #fff;
    }

    .fx-df-lg-display-block {
        display: block;
    }

    .fx-df-lg-display-block-inline {
        display: inline-block;
    }

    .fx-df-lg-display {
        display: -webkit-flex;
        display: -moz-flex;
        display: -ms-flexbox;
        display: -ms-flex;
        display: flex;
    }

    .fx-df-lg-display-inline {
        display: -webkit-inline-flex;
        display: -moz-inline-flex;
        display: -ms-inline-flexbox;
        display: -ms-inline-flex;
        display: inline-flex;
    }

    .fx-df-lg-direction {
        -webkit-flex-direction: row;
        -moz-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
    }

    .fx-df-lg-direction-reverse {
        -webkit-flex-direction: row-reverse;
        -moz-flex-direction: row-reverse;
        -ms-flex-direction: row-reverse;
        flex-direction: row-reverse;
    }

    .fx-df-lg-direction-column {
        -webkit-flex-direction: column;
        -moz-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .fx-df-lg-direction-column-reverse {
        -webkit-flex-direction: column-reverse;
        -moz-flex-direction: column-reverse;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse;
    }

    .fx-df-lg-wrap {
        -webkit-flex-wrap: wrap;
        -moz-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    .fx-df-lg-wrap-nowrap {
        -webkit-flex-wrap: nowrap;
        -moz-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
    }

    .fx-df-lg-wrap-reverse {
        -webkit-flex-wrap: wrap-reverse;
        -moz-flex-wrap: wrap-reverse;
        -ms-flex-wrap: wrap-reverse;
        flex-wrap: wrap-reverse;
    }

    .fx-df-lg-justify-flex-start {
        -webkit-justify-content: flex-start;
        -moz-justify-content: flex-start;
        -ms-justify-content: flex-start;
        justify-content: flex-start;
    }

    .fx-df-lg-justify-flex-end {
        -webkit-justify-content: flex-end;
        -moz-justify-content: flex-end;
        -ms-justify-content: flex-end;
        justify-content: flex-end;
    }

    .fx-df-lg-justify-center {
        -webkit-justify-content: center;
        -moz-justify-content: center;
        -ms-justify-content: center;
        justify-content: center;
    }

    .fx-df-lg-justify-space-between {
        -webkit-justify-content: space-between;
        -moz-justify-content: space-between;
        -ms-justify-content: space-between;
        justify-content: space-between;
    }

    .fx-df-lg-justify-space-around {
        -webkit-justify-content: space-around;
        -moz-justify-content: space-around;
        -ms-justify-content: space-around;
        justify-content: space-around;
    }

    .fx-df-lg-align-content-flex-start {
        -webkit-align-content: flex-start;
        -moz-align-content: flex-start;
        -ms-align-content: flex-start;
        align-content: flex-start;
    }

    .fx-df-lg-align-content-flex-end {
        -webkit-align-content: flex-end;
        -moz-align-content: flex-end;
        -ms-align-content: flex-end;
        align-content: flex-end;
    }

    .fx-df-lg-align-content-center {
        -webkit-align-content: center;
        -moz-align-content: center;
        -ms-align-content: center;
        align-content: center;
    }

    .fx-df-lg-align-content-space-between {
        -webkit-align-content: space-between;
        -moz-align-content: space-between;
        -ms-align-content: space-between;
        align-content: space-between;
    }

    .fx-df-lg-align-content-space-around {
        -webkit-align-content: space-around;
        -moz-align-content: space-around;
        -ms-align-content: space-around;
        align-content: space-around;
    }

    .fx-df-lg-align-content-stretch {
        -webkit-align-content: stretch;
        -moz-align-content: stretch;
        -ms-align-content: stretch;
        align-content: stretch;
    }

    .fx-df-lg-align-items-flex-start {
        -webkit-align-items: flex-start;
        -moz-align-items: flex-start;
        -ms-align-items: flex-start;
        align-items: flex-start;
    }

    .fx-df-lg-align-items-flex-end {
        -webkit-align-items: flex-end;
        -moz-align-items: flex-end;
        -ms-align-items: flex-end;
        align-items: flex-end;
    }

    .fx-df-lg-align-items-center {
        -webkit-align-items: center;
        -moz-align-items: center;
        -ms-align-items: center;
        align-items: center;
    }

    .fx-df-lg-align-items-baseline {
        -webkit-align-items: baseline;
        -moz-align-items: baseline;
        -ms-align-items: baseline;
        align-items: baseline;
    }

    .fx-df-lg-align-items-stretch {
        -webkit-align-items: stretch;
        -moz-align-items: stretch;
        -ms-align-items: stretch;
        align-items: stretch;
    }

    .fx-df-lg-order-0 {
        -webkit-order: 0;
        -moz-order: 0;
        -ms-order: 0;
        order: 0;
    }

    .fx-df-lg-order-1 {
        -webkit-order: 1;
        -moz-order: 1;
        -ms-order: 1;
        order: 1;
    }

    .fx-df-lg-order-2 {
        -webkit-order: 2;
        -moz-order: 2;
        -ms-order: 2;
        order: 2;
    }

    .fx-df-lg-order-3 {
        -webkit-order: 3;
        -moz-order: 3;
        -ms-order: 3;
        order: 3;
    }

    .fx-df-lg-order-4 {
        -webkit-order: 4;
        -moz-order: 4;
        -ms-order: 4;
        order: 4;
    }

    .fx-df-lg-order-5 {
        -webkit-order: 5;
        -moz-order: 5;
        -ms-order: 5;
        order: 5;
    }

    .fx-df-lg-order-6 {
        -webkit-order: 6;
        -moz-order: 6;
        -ms-order: 6;
        order: 6;
    }

    .fx-df-lg-order-7 {
        -webkit-order: 7;
        -moz-order: 7;
        -ms-order: 7;
        order: 7;
    }

    .fx-df-lg-order-8 {
        -webkit-order: 8;
        -moz-order: 8;
        -ms-order: 8;
        order: 8;
    }

    .fx-df-lg-order-9 {
        -webkit-order: 9;
        -moz-order: 9;
        -ms-order: 9;
        order: 9;
    }

    .fx-df-lg-order-10 {
        -webkit-order: 10;
        -moz-order: 10;
        -ms-order: 10;
        order: 10;
    }

    .fx-df-lg-grow-0 {
        -webkit-flex-grow: 0;
        -moz-flex-grow: 0;
        -ms-flex-grow: 0;
        flex-grow: 0;
    }

    .fx-df-lg-grow-1 {
        -webkit-flex-grow: 1;
        -moz-flex-grow: 1;
        -ms-flex-grow: 1;
        flex-grow: 1;
    }

    .fx-df-lg-grow-2 {
        -webkit-flex-grow: 2;
        -moz-flex-grow: 2;
        -ms-flex-grow: 2;
        flex-grow: 2;
    }

    .fx-df-lg-grow-3 {
        -webkit-flex-grow: 3;
        -moz-flex-grow: 3;
        -ms-flex-grow: 3;
        flex-grow: 3;
    }

    .fx-df-lg-grow-4 {
        -webkit-flex-grow: 4;
        -moz-flex-grow: 4;
        -ms-flex-grow: 4;
        flex-grow: 4;
    }

    .fx-df-lg-grow-5 {
        -webkit-flex-grow: 5;
        -moz-flex-grow: 5;
        -ms-flex-grow: 5;
        flex-grow: 5;
    }

    .fx-df-lg-grow-6 {
        -webkit-flex-grow: 6;
        -moz-flex-grow: 6;
        -ms-flex-grow: 6;
        flex-grow: 6;
    }

    .fx-df-lg-grow-7 {
        -webkit-flex-grow: 7;
        -moz-flex-grow: 7;
        -ms-flex-grow: 7;
        flex-grow: 7;
    }

    .fx-df-lg-grow-8 {
        -webkit-flex-grow: 8;
        -moz-flex-grow: 8;
        -ms-flex-grow: 8;
        flex-grow: 8;
    }

    .fx-df-lg-grow-9 {
        -webkit-flex-grow: 9;
        -moz-flex-grow: 9;
        -ms-flex-grow: 9;
        flex-grow: 9;
    }

    .fx-df-lg-grow-10 {
        -webkit-flex-grow: 10;
        -moz-flex-grow: 10;
        -ms-flex-grow: 10;
        flex-grow: 10;
    }

    .fx-df-lg-shrink-0 {
        -webkit-flex-shrink: 0;
        -moz-flex-shrink: 0;
        -ms-flex-shrink: 0;
        flex-shrink: 0;
    }

    .fx-df-lg-shrink-1 {
        -webkit-flex-shrink: 1;
        -moz-flex-shrink: 1;
        -ms-flex-shrink: 1;
        flex-shrink: 1;
    }

    .fx-df-lg-shrink-2 {
        -webkit-flex-shrink: 2;
        -moz-flex-shrink: 2;
        -ms-flex-shrink: 2;
        flex-shrink: 2;
    }

    .fx-df-lg-shrink-3 {
        -webkit-flex-shrink: 3;
        -moz-flex-shrink: 3;
        -ms-flex-shrink: 3;
        flex-shrink: 3;
    }

    .fx-df-lg-shrink-4 {
        -webkit-flex-shrink: 4;
        -moz-flex-shrink: 4;
        -ms-flex-shrink: 4;
        flex-shrink: 4;
    }

    .fx-df-lg-shrink-5 {
        -webkit-flex-shrink: 5;
        -moz-flex-shrink: 5;
        -ms-flex-shrink: 5;
        flex-shrink: 5;
    }

    .fx-df-lg-shrink-6 {
        -webkit-flex-shrink: 6;
        -moz-flex-shrink: 6;
        -ms-flex-shrink: 6;
        flex-shrink: 6;
    }

    .fx-df-lg-shrink-7 {
        -webkit-flex-shrink: 7;
        -moz-flex-shrink: 7;
        -ms-flex-shrink: 7;
        flex-shrink: 7;
    }

    .fx-df-lg-shrink-8 {
        -webkit-flex-shrink: 8;
        -moz-flex-shrink: 8;
        -ms-flex-shrink: 8;
        flex-shrink: 8;
    }

    .fx-df-lg-shrink-9 {
        -webkit-flex-shrink: 9;
        -moz-flex-shrink: 9;
        -ms-flex-shrink: 9;
        flex-shrink: 9;
    }

    .fx-df-lg-shrink-10 {
        -webkit-flex-shrink: 10;
        -moz-flex-shrink: 10;
        -ms-flex-shrink: 10;
        flex-shrink: 10;
    }

    .fx-df-lg-align-self-flex-start {
        -webkit-align-self: flex-start;
        -moz-align-self: flex-start;
        -ms-align-self: flex-start;
        align-self: flex-start;
    }

    .fx-df-lg-align-self-flex-end {
        -webkit-align-self: flex-end;
        -moz-align-self: flex-end;
        -ms-align-self: flex-end;
        align-self: flex-end;
    }

    .fx-df-lg-align-self-center {
        -webkit-align-self: center;
        -moz-align-self: center;
        -ms-align-self: center;
        align-self: center;
    }

    .fx-df-lg-align-self-baseline {
        -webkit-align-self: baseline;
        -moz-align-self: baseline;
        -ms-align-self: baseline;
        align-self: baseline;
    }

    .fx-df-lg-align-self-stretch {
        -webkit-align-self: stretch;
        -moz-align-self: stretch;
        -ms-align-self: stretch;
        align-self: stretch;
    }
}

@media (max-width: 992px) {
    .fx-example-highlight-colour-df-md {
        background: #6A95B5;
        color: #fff;
    }

    .fx-df-md-display-block {
        display: block;
    }

    .fx-df-md-display-block-inline {
        display: inline-block;
    }

    .fx-df-md-display {
        display: -webkit-flex;
        display: -moz-flex;
        display: -ms-flexbox;
        display: -ms-flex;
        display: flex;
    }

    .fx-df-md-display-inline {
        display: -webkit-inline-flex;
        display: -moz-inline-flex;
        display: -ms-inline-flexbox;
        display: -ms-inline-flex;
        display: inline-flex;
    }

    .fx-df-md-direction {
        -webkit-flex-direction: row;
        -moz-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
    }

    .fx-df-md-direction-reverse {
        -webkit-flex-direction: row-reverse;
        -moz-flex-direction: row-reverse;
        -ms-flex-direction: row-reverse;
        flex-direction: row-reverse;
    }

    .fx-df-md-direction-column {
        -webkit-flex-direction: column;
        -moz-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .fx-df-md-direction-column-reverse {
        -webkit-flex-direction: column-reverse;
        -moz-flex-direction: column-reverse;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse;
    }

    .fx-df-md-wrap {
        -webkit-flex-wrap: wrap;
        -moz-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    .fx-df-md-wrap-nowrap {
        -webkit-flex-wrap: nowrap;
        -moz-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
    }

    .fx-df-md-wrap-reverse {
        -webkit-flex-wrap: wrap-reverse;
        -moz-flex-wrap: wrap-reverse;
        -ms-flex-wrap: wrap-reverse;
        flex-wrap: wrap-reverse;
    }

    .fx-df-md-justify-flex-start {
        -webkit-justify-content: flex-start;
        -moz-justify-content: flex-start;
        -ms-justify-content: flex-start;
        justify-content: flex-start;
    }

    .fx-df-md-justify-flex-end {
        -webkit-justify-content: flex-end;
        -moz-justify-content: flex-end;
        -ms-justify-content: flex-end;
        justify-content: flex-end;
    }

    .fx-df-md-justify-center {
        -webkit-justify-content: center;
        -moz-justify-content: center;
        -ms-justify-content: center;
        justify-content: center;
    }

    .fx-df-md-justify-space-between {
        -webkit-justify-content: space-between;
        -moz-justify-content: space-between;
        -ms-justify-content: space-between;
        justify-content: space-between;
    }

    .fx-df-md-justify-space-around {
        -webkit-justify-content: space-around;
        -moz-justify-content: space-around;
        -ms-justify-content: space-around;
        justify-content: space-around;
    }

    .fx-df-md-align-content-flex-start {
        -webkit-align-content: flex-start;
        -moz-align-content: flex-start;
        -ms-align-content: flex-start;
        align-content: flex-start;
    }

    .fx-df-md-align-content-flex-end {
        -webkit-align-content: flex-end;
        -moz-align-content: flex-end;
        -ms-align-content: flex-end;
        align-content: flex-end;
    }

    .fx-df-md-align-content-center {
        -webkit-align-content: center;
        -moz-align-content: center;
        -ms-align-content: center;
        align-content: center;
    }

    .fx-df-md-align-content-space-between {
        -webkit-align-content: space-between;
        -moz-align-content: space-between;
        -ms-align-content: space-between;
        align-content: space-between;
    }

    .fx-df-md-align-content-space-around {
        -webkit-align-content: space-around;
        -moz-align-content: space-around;
        -ms-align-content: space-around;
        align-content: space-around;
    }

    .fx-df-md-align-content-stretch {
        -webkit-align-content: stretch;
        -moz-align-content: stretch;
        -ms-align-content: stretch;
        align-content: stretch;
    }

    .fx-df-md-align-items-flex-start {
        -webkit-align-items: flex-start;
        -moz-align-items: flex-start;
        -ms-align-items: flex-start;
        align-items: flex-start;
    }

    .fx-df-md-align-items-flex-end {
        -webkit-align-items: flex-end;
        -moz-align-items: flex-end;
        -ms-align-items: flex-end;
        align-items: flex-end;
    }

    .fx-df-md-align-items-center {
        -webkit-align-items: center;
        -moz-align-items: center;
        -ms-align-items: center;
        align-items: center;
    }

    .fx-df-md-align-items-baseline {
        -webkit-align-items: baseline;
        -moz-align-items: baseline;
        -ms-align-items: baseline;
        align-items: baseline;
    }

    .fx-df-md-align-items-stretch {
        -webkit-align-items: stretch;
        -moz-align-items: stretch;
        -ms-align-items: stretch;
        align-items: stretch;
    }

    .fx-df-md-order-0 {
        -webkit-order: 0;
        -moz-order: 0;
        -ms-order: 0;
        order: 0;
    }

    .fx-df-md-order-1 {
        -webkit-order: 1;
        -moz-order: 1;
        -ms-order: 1;
        order: 1;
    }

    .fx-df-md-order-2 {
        -webkit-order: 2;
        -moz-order: 2;
        -ms-order: 2;
        order: 2;
    }

    .fx-df-md-order-3 {
        -webkit-order: 3;
        -moz-order: 3;
        -ms-order: 3;
        order: 3;
    }

    .fx-df-md-order-4 {
        -webkit-order: 4;
        -moz-order: 4;
        -ms-order: 4;
        order: 4;
    }

    .fx-df-md-order-5 {
        -webkit-order: 5;
        -moz-order: 5;
        -ms-order: 5;
        order: 5;
    }

    .fx-df-md-order-6 {
        -webkit-order: 6;
        -moz-order: 6;
        -ms-order: 6;
        order: 6;
    }

    .fx-df-md-order-7 {
        -webkit-order: 7;
        -moz-order: 7;
        -ms-order: 7;
        order: 7;
    }

    .fx-df-md-order-8 {
        -webkit-order: 8;
        -moz-order: 8;
        -ms-order: 8;
        order: 8;
    }

    .fx-df-md-order-9 {
        -webkit-order: 9;
        -moz-order: 9;
        -ms-order: 9;
        order: 9;
    }

    .fx-df-md-order-10 {
        -webkit-order: 10;
        -moz-order: 10;
        -ms-order: 10;
        order: 10;
    }

    .fx-df-md-grow-0 {
        -webkit-flex-grow: 0;
        -moz-flex-grow: 0;
        -ms-flex-grow: 0;
        flex-grow: 0;
    }

    .fx-df-md-grow-1 {
        -webkit-flex-grow: 1;
        -moz-flex-grow: 1;
        -ms-flex-grow: 1;
        flex-grow: 1;
    }

    .fx-df-md-grow-2 {
        -webkit-flex-grow: 2;
        -moz-flex-grow: 2;
        -ms-flex-grow: 2;
        flex-grow: 2;
    }

    .fx-df-md-grow-3 {
        -webkit-flex-grow: 3;
        -moz-flex-grow: 3;
        -ms-flex-grow: 3;
        flex-grow: 3;
    }

    .fx-df-md-grow-4 {
        -webkit-flex-grow: 4;
        -moz-flex-grow: 4;
        -ms-flex-grow: 4;
        flex-grow: 4;
    }

    .fx-df-md-grow-5 {
        -webkit-flex-grow: 5;
        -moz-flex-grow: 5;
        -ms-flex-grow: 5;
        flex-grow: 5;
    }

    .fx-df-md-grow-6 {
        -webkit-flex-grow: 6;
        -moz-flex-grow: 6;
        -ms-flex-grow: 6;
        flex-grow: 6;
    }

    .fx-df-md-grow-7 {
        -webkit-flex-grow: 7;
        -moz-flex-grow: 7;
        -ms-flex-grow: 7;
        flex-grow: 7;
    }

    .fx-df-md-grow-8 {
        -webkit-flex-grow: 8;
        -moz-flex-grow: 8;
        -ms-flex-grow: 8;
        flex-grow: 8;
    }

    .fx-df-md-grow-9 {
        -webkit-flex-grow: 9;
        -moz-flex-grow: 9;
        -ms-flex-grow: 9;
        flex-grow: 9;
    }

    .fx-df-md-grow-10 {
        -webkit-flex-grow: 10;
        -moz-flex-grow: 10;
        -ms-flex-grow: 10;
        flex-grow: 10;
    }

    .fx-df-md-shrink-0 {
        -webkit-flex-shrink: 0;
        -moz-flex-shrink: 0;
        -ms-flex-shrink: 0;
        flex-shrink: 0;
    }

    .fx-df-md-shrink-1 {
        -webkit-flex-shrink: 1;
        -moz-flex-shrink: 1;
        -ms-flex-shrink: 1;
        flex-shrink: 1;
    }

    .fx-df-md-shrink-2 {
        -webkit-flex-shrink: 2;
        -moz-flex-shrink: 2;
        -ms-flex-shrink: 2;
        flex-shrink: 2;
    }

    .fx-df-md-shrink-3 {
        -webkit-flex-shrink: 3;
        -moz-flex-shrink: 3;
        -ms-flex-shrink: 3;
        flex-shrink: 3;
    }

    .fx-df-md-shrink-4 {
        -webkit-flex-shrink: 4;
        -moz-flex-shrink: 4;
        -ms-flex-shrink: 4;
        flex-shrink: 4;
    }

    .fx-df-md-shrink-5 {
        -webkit-flex-shrink: 5;
        -moz-flex-shrink: 5;
        -ms-flex-shrink: 5;
        flex-shrink: 5;
    }

    .fx-df-md-shrink-6 {
        -webkit-flex-shrink: 6;
        -moz-flex-shrink: 6;
        -ms-flex-shrink: 6;
        flex-shrink: 6;
    }

    .fx-df-md-shrink-7 {
        -webkit-flex-shrink: 7;
        -moz-flex-shrink: 7;
        -ms-flex-shrink: 7;
        flex-shrink: 7;
    }

    .fx-df-md-shrink-8 {
        -webkit-flex-shrink: 8;
        -moz-flex-shrink: 8;
        -ms-flex-shrink: 8;
        flex-shrink: 8;
    }

    .fx-df-md-shrink-9 {
        -webkit-flex-shrink: 9;
        -moz-flex-shrink: 9;
        -ms-flex-shrink: 9;
        flex-shrink: 9;
    }

    .fx-df-md-shrink-10 {
        -webkit-flex-shrink: 10;
        -moz-flex-shrink: 10;
        -ms-flex-shrink: 10;
        flex-shrink: 10;
    }

    .fx-df-md-align-self-flex-start {
        -webkit-align-self: flex-start;
        -moz-align-self: flex-start;
        -ms-align-self: flex-start;
        align-self: flex-start;
    }

    .fx-df-md-align-self-flex-end {
        -webkit-align-self: flex-end;
        -moz-align-self: flex-end;
        -ms-align-self: flex-end;
        align-self: flex-end;
    }

    .fx-df-md-align-self-center {
        -webkit-align-self: center;
        -moz-align-self: center;
        -ms-align-self: center;
        align-self: center;
    }

    .fx-df-md-align-self-baseline {
        -webkit-align-self: baseline;
        -moz-align-self: baseline;
        -ms-align-self: baseline;
        align-self: baseline;
    }

    .fx-df-md-align-self-stretch {
        -webkit-align-self: stretch;
        -moz-align-self: stretch;
        -ms-align-self: stretch;
        align-self: stretch;
    }
}

@media (max-width: 768px) {
    .fx-example-highlight-colour-df-sm {
        background: #6A95B5;
        color: #fff;
    }

    .fx-df-sm-display-block {
        display: block;
    }

    .fx-df-sm-display-block-inline {
        display: inline-block;
    }

    .fx-df-sm-display {
        display: -webkit-flex;
        display: -moz-flex;
        display: -ms-flexbox;
        display: -ms-flex;
        display: flex;
    }

    .fx-df-sm-display-inline {
        display: -webkit-inline-flex;
        display: -moz-inline-flex;
        display: -ms-inline-flexbox;
        display: -ms-inline-flex;
        display: inline-flex;
    }

    .fx-df-sm-direction {
        -webkit-flex-direction: row;
        -moz-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
    }

    .fx-df-sm-direction-reverse {
        -webkit-flex-direction: row-reverse;
        -moz-flex-direction: row-reverse;
        -ms-flex-direction: row-reverse;
        flex-direction: row-reverse;
    }

    .fx-df-sm-direction-column {
        -webkit-flex-direction: column;
        -moz-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .fx-df-sm-direction-column-reverse {
        -webkit-flex-direction: column-reverse;
        -moz-flex-direction: column-reverse;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse;
    }

    .fx-df-sm-wrap {
        -webkit-flex-wrap: wrap;
        -moz-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    .fx-df-sm-wrap-nowrap {
        -webkit-flex-wrap: nowrap;
        -moz-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
    }

    .fx-df-sm-wrap-reverse {
        -webkit-flex-wrap: wrap-reverse;
        -moz-flex-wrap: wrap-reverse;
        -ms-flex-wrap: wrap-reverse;
        flex-wrap: wrap-reverse;
    }

    .fx-df-sm-justify-flex-start {
        -webkit-justify-content: flex-start;
        -moz-justify-content: flex-start;
        -ms-justify-content: flex-start;
        justify-content: flex-start;
    }

    .fx-df-sm-justify-flex-end {
        -webkit-justify-content: flex-end;
        -moz-justify-content: flex-end;
        -ms-justify-content: flex-end;
        justify-content: flex-end;
    }

    .fx-df-sm-justify-center {
        -webkit-justify-content: center;
        -moz-justify-content: center;
        -ms-justify-content: center;
        justify-content: center;
    }

    .fx-df-sm-justify-space-between {
        -webkit-justify-content: space-between;
        -moz-justify-content: space-between;
        -ms-justify-content: space-between;
        justify-content: space-between;
    }

    .fx-df-sm-justify-space-around {
        -webkit-justify-content: space-around;
        -moz-justify-content: space-around;
        -ms-justify-content: space-around;
        justify-content: space-around;
    }

    .fx-df-sm-align-content-flex-start {
        -webkit-align-content: flex-start;
        -moz-align-content: flex-start;
        -ms-align-content: flex-start;
        align-content: flex-start;
    }

    .fx-df-sm-align-content-flex-end {
        -webkit-align-content: flex-end;
        -moz-align-content: flex-end;
        -ms-align-content: flex-end;
        align-content: flex-end;
    }

    .fx-df-sm-align-content-center {
        -webkit-align-content: center;
        -moz-align-content: center;
        -ms-align-content: center;
        align-content: center;
    }

    .fx-df-sm-align-content-space-between {
        -webkit-align-content: space-between;
        -moz-align-content: space-between;
        -ms-align-content: space-between;
        align-content: space-between;
    }

    .fx-df-sm-align-content-space-around {
        -webkit-align-content: space-around;
        -moz-align-content: space-around;
        -ms-align-content: space-around;
        align-content: space-around;
    }

    .fx-df-sm-align-content-stretch {
        -webkit-align-content: stretch;
        -moz-align-content: stretch;
        -ms-align-content: stretch;
        align-content: stretch;
    }

    .fx-df-sm-align-items-flex-start {
        -webkit-align-items: flex-start;
        -moz-align-items: flex-start;
        -ms-align-items: flex-start;
        align-items: flex-start;
    }

    .fx-df-sm-align-items-flex-end {
        -webkit-align-items: flex-end;
        -moz-align-items: flex-end;
        -ms-align-items: flex-end;
        align-items: flex-end;
    }

    .fx-df-sm-align-items-center {
        -webkit-align-items: center;
        -moz-align-items: center;
        -ms-align-items: center;
        align-items: center;
    }

    .fx-df-sm-align-items-baseline {
        -webkit-align-items: baseline;
        -moz-align-items: baseline;
        -ms-align-items: baseline;
        align-items: baseline;
    }

    .fx-df-sm-align-items-stretch {
        -webkit-align-items: stretch;
        -moz-align-items: stretch;
        -ms-align-items: stretch;
        align-items: stretch;
    }

    .fx-df-sm-order-0 {
        -webkit-order: 0;
        -moz-order: 0;
        -ms-order: 0;
        order: 0;
    }

    .fx-df-sm-order-1 {
        -webkit-order: 1;
        -moz-order: 1;
        -ms-order: 1;
        order: 1;
    }

    .fx-df-sm-order-2 {
        -webkit-order: 2;
        -moz-order: 2;
        -ms-order: 2;
        order: 2;
    }

    .fx-df-sm-order-3 {
        -webkit-order: 3;
        -moz-order: 3;
        -ms-order: 3;
        order: 3;
    }

    .fx-df-sm-order-4 {
        -webkit-order: 4;
        -moz-order: 4;
        -ms-order: 4;
        order: 4;
    }

    .fx-df-sm-order-5 {
        -webkit-order: 5;
        -moz-order: 5;
        -ms-order: 5;
        order: 5;
    }

    .fx-df-sm-order-6 {
        -webkit-order: 6;
        -moz-order: 6;
        -ms-order: 6;
        order: 6;
    }

    .fx-df-sm-order-7 {
        -webkit-order: 7;
        -moz-order: 7;
        -ms-order: 7;
        order: 7;
    }

    .fx-df-sm-order-8 {
        -webkit-order: 8;
        -moz-order: 8;
        -ms-order: 8;
        order: 8;
    }

    .fx-df-sm-order-9 {
        -webkit-order: 9;
        -moz-order: 9;
        -ms-order: 9;
        order: 9;
    }

    .fx-df-sm-order-10 {
        -webkit-order: 10;
        -moz-order: 10;
        -ms-order: 10;
        order: 10;
    }

    .fx-df-sm-grow-0 {
        -webkit-flex-grow: 0;
        -moz-flex-grow: 0;
        -ms-flex-grow: 0;
        flex-grow: 0;
    }

    .fx-df-sm-grow-1 {
        -webkit-flex-grow: 1;
        -moz-flex-grow: 1;
        -ms-flex-grow: 1;
        flex-grow: 1;
    }

    .fx-df-sm-grow-2 {
        -webkit-flex-grow: 2;
        -moz-flex-grow: 2;
        -ms-flex-grow: 2;
        flex-grow: 2;
    }

    .fx-df-sm-grow-3 {
        -webkit-flex-grow: 3;
        -moz-flex-grow: 3;
        -ms-flex-grow: 3;
        flex-grow: 3;
    }

    .fx-df-sm-grow-4 {
        -webkit-flex-grow: 4;
        -moz-flex-grow: 4;
        -ms-flex-grow: 4;
        flex-grow: 4;
    }

    .fx-df-sm-grow-5 {
        -webkit-flex-grow: 5;
        -moz-flex-grow: 5;
        -ms-flex-grow: 5;
        flex-grow: 5;
    }

    .fx-df-sm-grow-6 {
        -webkit-flex-grow: 6;
        -moz-flex-grow: 6;
        -ms-flex-grow: 6;
        flex-grow: 6;
    }

    .fx-df-sm-grow-7 {
        -webkit-flex-grow: 7;
        -moz-flex-grow: 7;
        -ms-flex-grow: 7;
        flex-grow: 7;
    }

    .fx-df-sm-grow-8 {
        -webkit-flex-grow: 8;
        -moz-flex-grow: 8;
        -ms-flex-grow: 8;
        flex-grow: 8;
    }

    .fx-df-sm-grow-9 {
        -webkit-flex-grow: 9;
        -moz-flex-grow: 9;
        -ms-flex-grow: 9;
        flex-grow: 9;
    }

    .fx-df-sm-grow-10 {
        -webkit-flex-grow: 10;
        -moz-flex-grow: 10;
        -ms-flex-grow: 10;
        flex-grow: 10;
    }

    .fx-df-sm-shrink-0 {
        -webkit-flex-shrink: 0;
        -moz-flex-shrink: 0;
        -ms-flex-shrink: 0;
        flex-shrink: 0;
    }

    .fx-df-sm-shrink-1 {
        -webkit-flex-shrink: 1;
        -moz-flex-shrink: 1;
        -ms-flex-shrink: 1;
        flex-shrink: 1;
    }

    .fx-df-sm-shrink-2 {
        -webkit-flex-shrink: 2;
        -moz-flex-shrink: 2;
        -ms-flex-shrink: 2;
        flex-shrink: 2;
    }

    .fx-df-sm-shrink-3 {
        -webkit-flex-shrink: 3;
        -moz-flex-shrink: 3;
        -ms-flex-shrink: 3;
        flex-shrink: 3;
    }

    .fx-df-sm-shrink-4 {
        -webkit-flex-shrink: 4;
        -moz-flex-shrink: 4;
        -ms-flex-shrink: 4;
        flex-shrink: 4;
    }

    .fx-df-sm-shrink-5 {
        -webkit-flex-shrink: 5;
        -moz-flex-shrink: 5;
        -ms-flex-shrink: 5;
        flex-shrink: 5;
    }

    .fx-df-sm-shrink-6 {
        -webkit-flex-shrink: 6;
        -moz-flex-shrink: 6;
        -ms-flex-shrink: 6;
        flex-shrink: 6;
    }

    .fx-df-sm-shrink-7 {
        -webkit-flex-shrink: 7;
        -moz-flex-shrink: 7;
        -ms-flex-shrink: 7;
        flex-shrink: 7;
    }

    .fx-df-sm-shrink-8 {
        -webkit-flex-shrink: 8;
        -moz-flex-shrink: 8;
        -ms-flex-shrink: 8;
        flex-shrink: 8;
    }

    .fx-df-sm-shrink-9 {
        -webkit-flex-shrink: 9;
        -moz-flex-shrink: 9;
        -ms-flex-shrink: 9;
        flex-shrink: 9;
    }

    .fx-df-sm-shrink-10 {
        -webkit-flex-shrink: 10;
        -moz-flex-shrink: 10;
        -ms-flex-shrink: 10;
        flex-shrink: 10;
    }

    .fx-df-sm-align-self-flex-start {
        -webkit-align-self: flex-start;
        -moz-align-self: flex-start;
        -ms-align-self: flex-start;
        align-self: flex-start;
    }

    .fx-df-sm-align-self-flex-end {
        -webkit-align-self: flex-end;
        -moz-align-self: flex-end;
        -ms-align-self: flex-end;
        align-self: flex-end;
    }

    .fx-df-sm-align-self-center {
        -webkit-align-self: center;
        -moz-align-self: center;
        -ms-align-self: center;
        align-self: center;
    }

    .fx-df-sm-align-self-baseline {
        -webkit-align-self: baseline;
        -moz-align-self: baseline;
        -ms-align-self: baseline;
        align-self: baseline;
    }

    .fx-df-sm-align-self-stretch {
        -webkit-align-self: stretch;
        -moz-align-self: stretch;
        -ms-align-self: stretch;
        align-self: stretch;
    }
}

@media (max-width: 544px) {
    .fx-example-highlight-colour-df-xs {
        background: #6A95B5;
        color: #fff;
    }

    .fx-df-xs-display-block {
        display: block;
    }

    .fx-df-xs-display-block-inline {
        display: inline-block;
    }

    .fx-df-xs-display {
        display: -webkit-flex;
        display: -moz-flex;
        display: -ms-flexbox;
        display: -ms-flex;
        display: flex;
    }

    .fx-df-xs-display-inline {
        display: -webkit-inline-flex;
        display: -moz-inline-flex;
        display: -ms-inline-flexbox;
        display: -ms-inline-flex;
        display: inline-flex;
    }

    .fx-df-xs-direction {
        -webkit-flex-direction: row;
        -moz-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
    }

    .fx-df-xs-direction-reverse {
        -webkit-flex-direction: row-reverse;
        -moz-flex-direction: row-reverse;
        -ms-flex-direction: row-reverse;
        flex-direction: row-reverse;
    }

    .fx-df-xs-direction-column {
        -webkit-flex-direction: column;
        -moz-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .fx-df-xs-direction-column-reverse {
        -webkit-flex-direction: column-reverse;
        -moz-flex-direction: column-reverse;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse;
    }

    .fx-df-xs-wrap {
        -webkit-flex-wrap: wrap;
        -moz-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    .fx-df-xs-wrap-nowrap {
        -webkit-flex-wrap: nowrap;
        -moz-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
    }

    .fx-df-xs-wrap-reverse {
        -webkit-flex-wrap: wrap-reverse;
        -moz-flex-wrap: wrap-reverse;
        -ms-flex-wrap: wrap-reverse;
        flex-wrap: wrap-reverse;
    }

    .fx-df-xs-justify-flex-start {
        -webkit-justify-content: flex-start;
        -moz-justify-content: flex-start;
        -ms-justify-content: flex-start;
        justify-content: flex-start;
    }

    .fx-df-xs-justify-flex-end {
        -webkit-justify-content: flex-end;
        -moz-justify-content: flex-end;
        -ms-justify-content: flex-end;
        justify-content: flex-end;
    }

    .fx-df-xs-justify-center {
        -webkit-justify-content: center;
        -moz-justify-content: center;
        -ms-justify-content: center;
        justify-content: center;
    }

    .fx-df-xs-justify-space-between {
        -webkit-justify-content: space-between;
        -moz-justify-content: space-between;
        -ms-justify-content: space-between;
        justify-content: space-between;
    }

    .fx-df-xs-justify-space-around {
        -webkit-justify-content: space-around;
        -moz-justify-content: space-around;
        -ms-justify-content: space-around;
        justify-content: space-around;
    }

    .fx-df-xs-align-content-flex-start {
        -webkit-align-content: flex-start;
        -moz-align-content: flex-start;
        -ms-align-content: flex-start;
        align-content: flex-start;
    }

    .fx-df-xs-align-content-flex-end {
        -webkit-align-content: flex-end;
        -moz-align-content: flex-end;
        -ms-align-content: flex-end;
        align-content: flex-end;
    }

    .fx-df-xs-align-content-center {
        -webkit-align-content: center;
        -moz-align-content: center;
        -ms-align-content: center;
        align-content: center;
    }

    .fx-df-xs-align-content-space-between {
        -webkit-align-content: space-between;
        -moz-align-content: space-between;
        -ms-align-content: space-between;
        align-content: space-between;
    }

    .fx-df-xs-align-content-space-around {
        -webkit-align-content: space-around;
        -moz-align-content: space-around;
        -ms-align-content: space-around;
        align-content: space-around;
    }

    .fx-df-xs-align-content-stretch {
        -webkit-align-content: stretch;
        -moz-align-content: stretch;
        -ms-align-content: stretch;
        align-content: stretch;
    }

    .fx-df-xs-align-items-flex-start {
        -webkit-align-items: flex-start;
        -moz-align-items: flex-start;
        -ms-align-items: flex-start;
        align-items: flex-start;
    }

    .fx-df-xs-align-items-flex-end {
        -webkit-align-items: flex-end;
        -moz-align-items: flex-end;
        -ms-align-items: flex-end;
        align-items: flex-end;
    }

    .fx-df-xs-align-items-center {
        -webkit-align-items: center;
        -moz-align-items: center;
        -ms-align-items: center;
        align-items: center;
    }

    .fx-df-xs-align-items-baseline {
        -webkit-align-items: baseline;
        -moz-align-items: baseline;
        -ms-align-items: baseline;
        align-items: baseline;
    }

    .fx-df-xs-align-items-stretch {
        -webkit-align-items: stretch;
        -moz-align-items: stretch;
        -ms-align-items: stretch;
        align-items: stretch;
    }

    .fx-df-xs-order-0 {
        -webkit-order: 0;
        -moz-order: 0;
        -ms-order: 0;
        order: 0;
    }

    .fx-df-xs-order-1 {
        -webkit-order: 1;
        -moz-order: 1;
        -ms-order: 1;
        order: 1;
    }

    .fx-df-xs-order-2 {
        -webkit-order: 2;
        -moz-order: 2;
        -ms-order: 2;
        order: 2;
    }

    .fx-df-xs-order-3 {
        -webkit-order: 3;
        -moz-order: 3;
        -ms-order: 3;
        order: 3;
    }

    .fx-df-xs-order-4 {
        -webkit-order: 4;
        -moz-order: 4;
        -ms-order: 4;
        order: 4;
    }

    .fx-df-xs-order-5 {
        -webkit-order: 5;
        -moz-order: 5;
        -ms-order: 5;
        order: 5;
    }

    .fx-df-xs-order-6 {
        -webkit-order: 6;
        -moz-order: 6;
        -ms-order: 6;
        order: 6;
    }

    .fx-df-xs-order-7 {
        -webkit-order: 7;
        -moz-order: 7;
        -ms-order: 7;
        order: 7;
    }

    .fx-df-xs-order-8 {
        -webkit-order: 8;
        -moz-order: 8;
        -ms-order: 8;
        order: 8;
    }

    .fx-df-xs-order-9 {
        -webkit-order: 9;
        -moz-order: 9;
        -ms-order: 9;
        order: 9;
    }

    .fx-df-xs-order-10 {
        -webkit-order: 10;
        -moz-order: 10;
        -ms-order: 10;
        order: 10;
    }

    .fx-df-xs-grow-0 {
        -webkit-flex-grow: 0;
        -moz-flex-grow: 0;
        -ms-flex-grow: 0;
        flex-grow: 0;
    }

    .fx-df-xs-grow-1 {
        -webkit-flex-grow: 1;
        -moz-flex-grow: 1;
        -ms-flex-grow: 1;
        flex-grow: 1;
    }

    .fx-df-xs-grow-2 {
        -webkit-flex-grow: 2;
        -moz-flex-grow: 2;
        -ms-flex-grow: 2;
        flex-grow: 2;
    }

    .fx-df-xs-grow-3 {
        -webkit-flex-grow: 3;
        -moz-flex-grow: 3;
        -ms-flex-grow: 3;
        flex-grow: 3;
    }

    .fx-df-xs-grow-4 {
        -webkit-flex-grow: 4;
        -moz-flex-grow: 4;
        -ms-flex-grow: 4;
        flex-grow: 4;
    }

    .fx-df-xs-grow-5 {
        -webkit-flex-grow: 5;
        -moz-flex-grow: 5;
        -ms-flex-grow: 5;
        flex-grow: 5;
    }

    .fx-df-xs-grow-6 {
        -webkit-flex-grow: 6;
        -moz-flex-grow: 6;
        -ms-flex-grow: 6;
        flex-grow: 6;
    }

    .fx-df-xs-grow-7 {
        -webkit-flex-grow: 7;
        -moz-flex-grow: 7;
        -ms-flex-grow: 7;
        flex-grow: 7;
    }

    .fx-df-xs-grow-8 {
        -webkit-flex-grow: 8;
        -moz-flex-grow: 8;
        -ms-flex-grow: 8;
        flex-grow: 8;
    }

    .fx-df-xs-grow-9 {
        -webkit-flex-grow: 9;
        -moz-flex-grow: 9;
        -ms-flex-grow: 9;
        flex-grow: 9;
    }

    .fx-df-xs-grow-10 {
        -webkit-flex-grow: 10;
        -moz-flex-grow: 10;
        -ms-flex-grow: 10;
        flex-grow: 10;
    }

    .fx-df-xs-shrink-0 {
        -webkit-flex-shrink: 0;
        -moz-flex-shrink: 0;
        -ms-flex-shrink: 0;
        flex-shrink: 0;
    }

    .fx-df-xs-shrink-1 {
        -webkit-flex-shrink: 1;
        -moz-flex-shrink: 1;
        -ms-flex-shrink: 1;
        flex-shrink: 1;
    }

    .fx-df-xs-shrink-2 {
        -webkit-flex-shrink: 2;
        -moz-flex-shrink: 2;
        -ms-flex-shrink: 2;
        flex-shrink: 2;
    }

    .fx-df-xs-shrink-3 {
        -webkit-flex-shrink: 3;
        -moz-flex-shrink: 3;
        -ms-flex-shrink: 3;
        flex-shrink: 3;
    }

    .fx-df-xs-shrink-4 {
        -webkit-flex-shrink: 4;
        -moz-flex-shrink: 4;
        -ms-flex-shrink: 4;
        flex-shrink: 4;
    }

    .fx-df-xs-shrink-5 {
        -webkit-flex-shrink: 5;
        -moz-flex-shrink: 5;
        -ms-flex-shrink: 5;
        flex-shrink: 5;
    }

    .fx-df-xs-shrink-6 {
        -webkit-flex-shrink: 6;
        -moz-flex-shrink: 6;
        -ms-flex-shrink: 6;
        flex-shrink: 6;
    }

    .fx-df-xs-shrink-7 {
        -webkit-flex-shrink: 7;
        -moz-flex-shrink: 7;
        -ms-flex-shrink: 7;
        flex-shrink: 7;
    }

    .fx-df-xs-shrink-8 {
        -webkit-flex-shrink: 8;
        -moz-flex-shrink: 8;
        -ms-flex-shrink: 8;
        flex-shrink: 8;
    }

    .fx-df-xs-shrink-9 {
        -webkit-flex-shrink: 9;
        -moz-flex-shrink: 9;
        -ms-flex-shrink: 9;
        flex-shrink: 9;
    }

    .fx-df-xs-shrink-10 {
        -webkit-flex-shrink: 10;
        -moz-flex-shrink: 10;
        -ms-flex-shrink: 10;
        flex-shrink: 10;
    }

    .fx-df-xs-align-self-flex-start {
        -webkit-align-self: flex-start;
        -moz-align-self: flex-start;
        -ms-align-self: flex-start;
        align-self: flex-start;
    }

    .fx-df-xs-align-self-flex-end {
        -webkit-align-self: flex-end;
        -moz-align-self: flex-end;
        -ms-align-self: flex-end;
        align-self: flex-end;
    }

    .fx-df-xs-align-self-center {
        -webkit-align-self: center;
        -moz-align-self: center;
        -ms-align-self: center;
        align-self: center;
    }

    .fx-df-xs-align-self-baseline {
        -webkit-align-self: baseline;
        -moz-align-self: baseline;
        -ms-align-self: baseline;
        align-self: baseline;
    }

    .fx-df-xs-align-self-stretch {
        -webkit-align-self: stretch;
        -moz-align-self: stretch;
        -ms-align-self: stretch;
        align-self: stretch;
    }
}

@media (min-width: 1200px) {
    .fx-example-highlight-colour-ss-xl {
        background: #6A95B5;
        color: #fff;
    }

    .fx-ss-xl-display-block {
        display: block;
    }

    .fx-ss-xl-display-block-inline {
        display: inline-block;
    }

    .fx-ss-xl-display {
        display: -webkit-flex;
        display: -moz-flex;
        display: -ms-flexbox;
        display: -ms-flex;
        display: flex;
    }

    .fx-ss-xl-display-inline {
        display: -webkit-inline-flex;
        display: -moz-inline-flex;
        display: -ms-inline-flexbox;
        display: -ms-inline-flex;
        display: inline-flex;
    }

    .fx-ss-xl-direction {
        -webkit-flex-direction: row;
        -moz-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
    }

    .fx-ss-xl-direction-reverse {
        -webkit-flex-direction: row-reverse;
        -moz-flex-direction: row-reverse;
        -ms-flex-direction: row-reverse;
        flex-direction: row-reverse;
    }

    .fx-ss-xl-direction-column {
        -webkit-flex-direction: column;
        -moz-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .fx-ss-xl-direction-column-reverse {
        -webkit-flex-direction: column-reverse;
        -moz-flex-direction: column-reverse;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse;
    }

    .fx-ss-xl-wrap {
        -webkit-flex-wrap: wrap;
        -moz-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    .fx-ss-xl-wrap-nowrap {
        -webkit-flex-wrap: nowrap;
        -moz-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
    }

    .fx-ss-xl-wrap-reverse {
        -webkit-flex-wrap: wrap-reverse;
        -moz-flex-wrap: wrap-reverse;
        -ms-flex-wrap: wrap-reverse;
        flex-wrap: wrap-reverse;
    }

    .fx-ss-xl-justify-flex-start {
        -webkit-justify-content: flex-start;
        -moz-justify-content: flex-start;
        -ms-justify-content: flex-start;
        justify-content: flex-start;
    }

    .fx-ss-xl-justify-flex-end {
        -webkit-justify-content: flex-end;
        -moz-justify-content: flex-end;
        -ms-justify-content: flex-end;
        justify-content: flex-end;
    }

    .fx-ss-xl-justify-center {
        -webkit-justify-content: center;
        -moz-justify-content: center;
        -ms-justify-content: center;
        justify-content: center;
    }

    .fx-ss-xl-justify-space-between {
        -webkit-justify-content: space-between;
        -moz-justify-content: space-between;
        -ms-justify-content: space-between;
        justify-content: space-between;
    }

    .fx-ss-xl-justify-space-around {
        -webkit-justify-content: space-around;
        -moz-justify-content: space-around;
        -ms-justify-content: space-around;
        justify-content: space-around;
    }

    .fx-ss-xl-align-content-flex-start {
        -webkit-align-content: flex-start;
        -moz-align-content: flex-start;
        -ms-align-content: flex-start;
        align-content: flex-start;
    }

    .fx-ss-xl-align-content-flex-end {
        -webkit-align-content: flex-end;
        -moz-align-content: flex-end;
        -ms-align-content: flex-end;
        align-content: flex-end;
    }

    .fx-ss-xl-align-content-center {
        -webkit-align-content: center;
        -moz-align-content: center;
        -ms-align-content: center;
        align-content: center;
    }

    .fx-ss-xl-align-content-space-between {
        -webkit-align-content: space-between;
        -moz-align-content: space-between;
        -ms-align-content: space-between;
        align-content: space-between;
    }

    .fx-ss-xl-align-content-space-around {
        -webkit-align-content: space-around;
        -moz-align-content: space-around;
        -ms-align-content: space-around;
        align-content: space-around;
    }

    .fx-ss-xl-align-content-stretch {
        -webkit-align-content: stretch;
        -moz-align-content: stretch;
        -ms-align-content: stretch;
        align-content: stretch;
    }

    .fx-ss-xl-align-items-flex-start {
        -webkit-align-items: flex-start;
        -moz-align-items: flex-start;
        -ms-align-items: flex-start;
        align-items: flex-start;
    }

    .fx-ss-xl-align-items-flex-end {
        -webkit-align-items: flex-end;
        -moz-align-items: flex-end;
        -ms-align-items: flex-end;
        align-items: flex-end;
    }

    .fx-ss-xl-align-items-center {
        -webkit-align-items: center;
        -moz-align-items: center;
        -ms-align-items: center;
        align-items: center;
    }

    .fx-ss-xl-align-items-baseline {
        -webkit-align-items: baseline;
        -moz-align-items: baseline;
        -ms-align-items: baseline;
        align-items: baseline;
    }

    .fx-ss-xl-align-items-stretch {
        -webkit-align-items: stretch;
        -moz-align-items: stretch;
        -ms-align-items: stretch;
        align-items: stretch;
    }

    .fx-ss-xl-order-0 {
        -webkit-order: 0;
        -moz-order: 0;
        -ms-order: 0;
        order: 0;
    }

    .fx-ss-xl-order-1 {
        -webkit-order: 1;
        -moz-order: 1;
        -ms-order: 1;
        order: 1;
    }

    .fx-ss-xl-order-2 {
        -webkit-order: 2;
        -moz-order: 2;
        -ms-order: 2;
        order: 2;
    }

    .fx-ss-xl-order-3 {
        -webkit-order: 3;
        -moz-order: 3;
        -ms-order: 3;
        order: 3;
    }

    .fx-ss-xl-order-4 {
        -webkit-order: 4;
        -moz-order: 4;
        -ms-order: 4;
        order: 4;
    }

    .fx-ss-xl-order-5 {
        -webkit-order: 5;
        -moz-order: 5;
        -ms-order: 5;
        order: 5;
    }

    .fx-ss-xl-order-6 {
        -webkit-order: 6;
        -moz-order: 6;
        -ms-order: 6;
        order: 6;
    }

    .fx-ss-xl-order-7 {
        -webkit-order: 7;
        -moz-order: 7;
        -ms-order: 7;
        order: 7;
    }

    .fx-ss-xl-order-8 {
        -webkit-order: 8;
        -moz-order: 8;
        -ms-order: 8;
        order: 8;
    }

    .fx-ss-xl-order-9 {
        -webkit-order: 9;
        -moz-order: 9;
        -ms-order: 9;
        order: 9;
    }

    .fx-ss-xl-order-10 {
        -webkit-order: 10;
        -moz-order: 10;
        -ms-order: 10;
        order: 10;
    }

    .fx-ss-xl-grow-0 {
        -webkit-flex-grow: 0;
        -moz-flex-grow: 0;
        -ms-flex-grow: 0;
        flex-grow: 0;
    }

    .fx-ss-xl-grow-1 {
        -webkit-flex-grow: 1;
        -moz-flex-grow: 1;
        -ms-flex-grow: 1;
        flex-grow: 1;
    }

    .fx-ss-xl-grow-2 {
        -webkit-flex-grow: 2;
        -moz-flex-grow: 2;
        -ms-flex-grow: 2;
        flex-grow: 2;
    }

    .fx-ss-xl-grow-3 {
        -webkit-flex-grow: 3;
        -moz-flex-grow: 3;
        -ms-flex-grow: 3;
        flex-grow: 3;
    }

    .fx-ss-xl-grow-4 {
        -webkit-flex-grow: 4;
        -moz-flex-grow: 4;
        -ms-flex-grow: 4;
        flex-grow: 4;
    }

    .fx-ss-xl-grow-5 {
        -webkit-flex-grow: 5;
        -moz-flex-grow: 5;
        -ms-flex-grow: 5;
        flex-grow: 5;
    }

    .fx-ss-xl-grow-6 {
        -webkit-flex-grow: 6;
        -moz-flex-grow: 6;
        -ms-flex-grow: 6;
        flex-grow: 6;
    }

    .fx-ss-xl-grow-7 {
        -webkit-flex-grow: 7;
        -moz-flex-grow: 7;
        -ms-flex-grow: 7;
        flex-grow: 7;
    }

    .fx-ss-xl-grow-8 {
        -webkit-flex-grow: 8;
        -moz-flex-grow: 8;
        -ms-flex-grow: 8;
        flex-grow: 8;
    }

    .fx-ss-xl-grow-9 {
        -webkit-flex-grow: 9;
        -moz-flex-grow: 9;
        -ms-flex-grow: 9;
        flex-grow: 9;
    }

    .fx-ss-xl-grow-10 {
        -webkit-flex-grow: 10;
        -moz-flex-grow: 10;
        -ms-flex-grow: 10;
        flex-grow: 10;
    }

    .fx-ss-xl-shrink-0 {
        -webkit-flex-shrink: 0;
        -moz-flex-shrink: 0;
        -ms-flex-shrink: 0;
        flex-shrink: 0;
    }

    .fx-ss-xl-shrink-1 {
        -webkit-flex-shrink: 1;
        -moz-flex-shrink: 1;
        -ms-flex-shrink: 1;
        flex-shrink: 1;
    }

    .fx-ss-xl-shrink-2 {
        -webkit-flex-shrink: 2;
        -moz-flex-shrink: 2;
        -ms-flex-shrink: 2;
        flex-shrink: 2;
    }

    .fx-ss-xl-shrink-3 {
        -webkit-flex-shrink: 3;
        -moz-flex-shrink: 3;
        -ms-flex-shrink: 3;
        flex-shrink: 3;
    }

    .fx-ss-xl-shrink-4 {
        -webkit-flex-shrink: 4;
        -moz-flex-shrink: 4;
        -ms-flex-shrink: 4;
        flex-shrink: 4;
    }

    .fx-ss-xl-shrink-5 {
        -webkit-flex-shrink: 5;
        -moz-flex-shrink: 5;
        -ms-flex-shrink: 5;
        flex-shrink: 5;
    }

    .fx-ss-xl-shrink-6 {
        -webkit-flex-shrink: 6;
        -moz-flex-shrink: 6;
        -ms-flex-shrink: 6;
        flex-shrink: 6;
    }

    .fx-ss-xl-shrink-7 {
        -webkit-flex-shrink: 7;
        -moz-flex-shrink: 7;
        -ms-flex-shrink: 7;
        flex-shrink: 7;
    }

    .fx-ss-xl-shrink-8 {
        -webkit-flex-shrink: 8;
        -moz-flex-shrink: 8;
        -ms-flex-shrink: 8;
        flex-shrink: 8;
    }

    .fx-ss-xl-shrink-9 {
        -webkit-flex-shrink: 9;
        -moz-flex-shrink: 9;
        -ms-flex-shrink: 9;
        flex-shrink: 9;
    }

    .fx-ss-xl-shrink-10 {
        -webkit-flex-shrink: 10;
        -moz-flex-shrink: 10;
        -ms-flex-shrink: 10;
        flex-shrink: 10;
    }

    .fx-ss-xl-align-self-flex-start {
        -webkit-align-self: flex-start;
        -moz-align-self: flex-start;
        -ms-align-self: flex-start;
        align-self: flex-start;
    }

    .fx-ss-xl-align-self-flex-end {
        -webkit-align-self: flex-end;
        -moz-align-self: flex-end;
        -ms-align-self: flex-end;
        align-self: flex-end;
    }

    .fx-ss-xl-align-self-center {
        -webkit-align-self: center;
        -moz-align-self: center;
        -ms-align-self: center;
        align-self: center;
    }

    .fx-ss-xl-align-self-baseline {
        -webkit-align-self: baseline;
        -moz-align-self: baseline;
        -ms-align-self: baseline;
        align-self: baseline;
    }

    .fx-ss-xl-align-self-stretch {
        -webkit-align-self: stretch;
        -moz-align-self: stretch;
        -ms-align-self: stretch;
        align-self: stretch;
    }
}

@media (max-width: 1200px) and (min-width: 992px) {
    .fx-example-highlight-colour-ss-lg {
        background: #6A95B5;
        color: #fff;
    }

    .fx-ss-lg-display-block {
        display: block;
    }

    .fx-ss-lg-display-block-inline {
        display: inline-block;
    }

    .fx-ss-lg-display {
        display: -webkit-flex;
        display: -moz-flex;
        display: -ms-flexbox;
        display: -ms-flex;
        display: flex;
    }

    .fx-ss-lg-display-inline {
        display: -webkit-inline-flex;
        display: -moz-inline-flex;
        display: -ms-inline-flexbox;
        display: -ms-inline-flex;
        display: inline-flex;
    }

    .fx-ss-lg-direction {
        -webkit-flex-direction: row;
        -moz-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
    }

    .fx-ss-lg-direction-reverse {
        -webkit-flex-direction: row-reverse;
        -moz-flex-direction: row-reverse;
        -ms-flex-direction: row-reverse;
        flex-direction: row-reverse;
    }

    .fx-ss-lg-direction-column {
        -webkit-flex-direction: column;
        -moz-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .fx-ss-lg-direction-column-reverse {
        -webkit-flex-direction: column-reverse;
        -moz-flex-direction: column-reverse;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse;
    }

    .fx-ss-lg-wrap {
        -webkit-flex-wrap: wrap;
        -moz-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    .fx-ss-lg-wrap-nowrap {
        -webkit-flex-wrap: nowrap;
        -moz-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
    }

    .fx-ss-lg-wrap-reverse {
        -webkit-flex-wrap: wrap-reverse;
        -moz-flex-wrap: wrap-reverse;
        -ms-flex-wrap: wrap-reverse;
        flex-wrap: wrap-reverse;
    }

    .fx-ss-lg-justify-flex-start {
        -webkit-justify-content: flex-start;
        -moz-justify-content: flex-start;
        -ms-justify-content: flex-start;
        justify-content: flex-start;
    }

    .fx-ss-lg-justify-flex-end {
        -webkit-justify-content: flex-end;
        -moz-justify-content: flex-end;
        -ms-justify-content: flex-end;
        justify-content: flex-end;
    }

    .fx-ss-lg-justify-center {
        -webkit-justify-content: center;
        -moz-justify-content: center;
        -ms-justify-content: center;
        justify-content: center;
    }

    .fx-ss-lg-justify-space-between {
        -webkit-justify-content: space-between;
        -moz-justify-content: space-between;
        -ms-justify-content: space-between;
        justify-content: space-between;
    }

    .fx-ss-lg-justify-space-around {
        -webkit-justify-content: space-around;
        -moz-justify-content: space-around;
        -ms-justify-content: space-around;
        justify-content: space-around;
    }

    .fx-ss-lg-align-content-flex-start {
        -webkit-align-content: flex-start;
        -moz-align-content: flex-start;
        -ms-align-content: flex-start;
        align-content: flex-start;
    }

    .fx-ss-lg-align-content-flex-end {
        -webkit-align-content: flex-end;
        -moz-align-content: flex-end;
        -ms-align-content: flex-end;
        align-content: flex-end;
    }

    .fx-ss-lg-align-content-center {
        -webkit-align-content: center;
        -moz-align-content: center;
        -ms-align-content: center;
        align-content: center;
    }

    .fx-ss-lg-align-content-space-between {
        -webkit-align-content: space-between;
        -moz-align-content: space-between;
        -ms-align-content: space-between;
        align-content: space-between;
    }

    .fx-ss-lg-align-content-space-around {
        -webkit-align-content: space-around;
        -moz-align-content: space-around;
        -ms-align-content: space-around;
        align-content: space-around;
    }

    .fx-ss-lg-align-content-stretch {
        -webkit-align-content: stretch;
        -moz-align-content: stretch;
        -ms-align-content: stretch;
        align-content: stretch;
    }

    .fx-ss-lg-align-items-flex-start {
        -webkit-align-items: flex-start;
        -moz-align-items: flex-start;
        -ms-align-items: flex-start;
        align-items: flex-start;
    }

    .fx-ss-lg-align-items-flex-end {
        -webkit-align-items: flex-end;
        -moz-align-items: flex-end;
        -ms-align-items: flex-end;
        align-items: flex-end;
    }

    .fx-ss-lg-align-items-center {
        -webkit-align-items: center;
        -moz-align-items: center;
        -ms-align-items: center;
        align-items: center;
    }

    .fx-ss-lg-align-items-baseline {
        -webkit-align-items: baseline;
        -moz-align-items: baseline;
        -ms-align-items: baseline;
        align-items: baseline;
    }

    .fx-ss-lg-align-items-stretch {
        -webkit-align-items: stretch;
        -moz-align-items: stretch;
        -ms-align-items: stretch;
        align-items: stretch;
    }

    .fx-ss-lg-order-0 {
        -webkit-order: 0;
        -moz-order: 0;
        -ms-order: 0;
        order: 0;
    }

    .fx-ss-lg-order-1 {
        -webkit-order: 1;
        -moz-order: 1;
        -ms-order: 1;
        order: 1;
    }

    .fx-ss-lg-order-2 {
        -webkit-order: 2;
        -moz-order: 2;
        -ms-order: 2;
        order: 2;
    }

    .fx-ss-lg-order-3 {
        -webkit-order: 3;
        -moz-order: 3;
        -ms-order: 3;
        order: 3;
    }

    .fx-ss-lg-order-4 {
        -webkit-order: 4;
        -moz-order: 4;
        -ms-order: 4;
        order: 4;
    }

    .fx-ss-lg-order-5 {
        -webkit-order: 5;
        -moz-order: 5;
        -ms-order: 5;
        order: 5;
    }

    .fx-ss-lg-order-6 {
        -webkit-order: 6;
        -moz-order: 6;
        -ms-order: 6;
        order: 6;
    }

    .fx-ss-lg-order-7 {
        -webkit-order: 7;
        -moz-order: 7;
        -ms-order: 7;
        order: 7;
    }

    .fx-ss-lg-order-8 {
        -webkit-order: 8;
        -moz-order: 8;
        -ms-order: 8;
        order: 8;
    }

    .fx-ss-lg-order-9 {
        -webkit-order: 9;
        -moz-order: 9;
        -ms-order: 9;
        order: 9;
    }

    .fx-ss-lg-order-10 {
        -webkit-order: 10;
        -moz-order: 10;
        -ms-order: 10;
        order: 10;
    }

    .fx-ss-lg-grow-0 {
        -webkit-flex-grow: 0;
        -moz-flex-grow: 0;
        -ms-flex-grow: 0;
        flex-grow: 0;
    }

    .fx-ss-lg-grow-1 {
        -webkit-flex-grow: 1;
        -moz-flex-grow: 1;
        -ms-flex-grow: 1;
        flex-grow: 1;
    }

    .fx-ss-lg-grow-2 {
        -webkit-flex-grow: 2;
        -moz-flex-grow: 2;
        -ms-flex-grow: 2;
        flex-grow: 2;
    }

    .fx-ss-lg-grow-3 {
        -webkit-flex-grow: 3;
        -moz-flex-grow: 3;
        -ms-flex-grow: 3;
        flex-grow: 3;
    }

    .fx-ss-lg-grow-4 {
        -webkit-flex-grow: 4;
        -moz-flex-grow: 4;
        -ms-flex-grow: 4;
        flex-grow: 4;
    }

    .fx-ss-lg-grow-5 {
        -webkit-flex-grow: 5;
        -moz-flex-grow: 5;
        -ms-flex-grow: 5;
        flex-grow: 5;
    }

    .fx-ss-lg-grow-6 {
        -webkit-flex-grow: 6;
        -moz-flex-grow: 6;
        -ms-flex-grow: 6;
        flex-grow: 6;
    }

    .fx-ss-lg-grow-7 {
        -webkit-flex-grow: 7;
        -moz-flex-grow: 7;
        -ms-flex-grow: 7;
        flex-grow: 7;
    }

    .fx-ss-lg-grow-8 {
        -webkit-flex-grow: 8;
        -moz-flex-grow: 8;
        -ms-flex-grow: 8;
        flex-grow: 8;
    }

    .fx-ss-lg-grow-9 {
        -webkit-flex-grow: 9;
        -moz-flex-grow: 9;
        -ms-flex-grow: 9;
        flex-grow: 9;
    }

    .fx-ss-lg-grow-10 {
        -webkit-flex-grow: 10;
        -moz-flex-grow: 10;
        -ms-flex-grow: 10;
        flex-grow: 10;
    }

    .fx-ss-lg-shrink-0 {
        -webkit-flex-shrink: 0;
        -moz-flex-shrink: 0;
        -ms-flex-shrink: 0;
        flex-shrink: 0;
    }

    .fx-ss-lg-shrink-1 {
        -webkit-flex-shrink: 1;
        -moz-flex-shrink: 1;
        -ms-flex-shrink: 1;
        flex-shrink: 1;
    }

    .fx-ss-lg-shrink-2 {
        -webkit-flex-shrink: 2;
        -moz-flex-shrink: 2;
        -ms-flex-shrink: 2;
        flex-shrink: 2;
    }

    .fx-ss-lg-shrink-3 {
        -webkit-flex-shrink: 3;
        -moz-flex-shrink: 3;
        -ms-flex-shrink: 3;
        flex-shrink: 3;
    }

    .fx-ss-lg-shrink-4 {
        -webkit-flex-shrink: 4;
        -moz-flex-shrink: 4;
        -ms-flex-shrink: 4;
        flex-shrink: 4;
    }

    .fx-ss-lg-shrink-5 {
        -webkit-flex-shrink: 5;
        -moz-flex-shrink: 5;
        -ms-flex-shrink: 5;
        flex-shrink: 5;
    }

    .fx-ss-lg-shrink-6 {
        -webkit-flex-shrink: 6;
        -moz-flex-shrink: 6;
        -ms-flex-shrink: 6;
        flex-shrink: 6;
    }

    .fx-ss-lg-shrink-7 {
        -webkit-flex-shrink: 7;
        -moz-flex-shrink: 7;
        -ms-flex-shrink: 7;
        flex-shrink: 7;
    }

    .fx-ss-lg-shrink-8 {
        -webkit-flex-shrink: 8;
        -moz-flex-shrink: 8;
        -ms-flex-shrink: 8;
        flex-shrink: 8;
    }

    .fx-ss-lg-shrink-9 {
        -webkit-flex-shrink: 9;
        -moz-flex-shrink: 9;
        -ms-flex-shrink: 9;
        flex-shrink: 9;
    }

    .fx-ss-lg-shrink-10 {
        -webkit-flex-shrink: 10;
        -moz-flex-shrink: 10;
        -ms-flex-shrink: 10;
        flex-shrink: 10;
    }

    .fx-ss-lg-align-self-flex-start {
        -webkit-align-self: flex-start;
        -moz-align-self: flex-start;
        -ms-align-self: flex-start;
        align-self: flex-start;
    }

    .fx-ss-lg-align-self-flex-end {
        -webkit-align-self: flex-end;
        -moz-align-self: flex-end;
        -ms-align-self: flex-end;
        align-self: flex-end;
    }

    .fx-ss-lg-align-self-center {
        -webkit-align-self: center;
        -moz-align-self: center;
        -ms-align-self: center;
        align-self: center;
    }

    .fx-ss-lg-align-self-baseline {
        -webkit-align-self: baseline;
        -moz-align-self: baseline;
        -ms-align-self: baseline;
        align-self: baseline;
    }

    .fx-ss-lg-align-self-stretch {
        -webkit-align-self: stretch;
        -moz-align-self: stretch;
        -ms-align-self: stretch;
        align-self: stretch;
    }
}

@media (max-width: 992px) and (min-width: 768px) {
    .fx-example-highlight-colour-ss-md {
        background: #6A95B5;
        color: #fff;
    }

    .fx-ss-md-display-block {
        display: block;
    }

    .fx-ss-md-display-block-inline {
        display: inline-block;
    }

    .fx-ss-md-display {
        display: -webkit-flex;
        display: -moz-flex;
        display: -ms-flexbox;
        display: -ms-flex;
        display: flex;
    }

    .fx-ss-md-display-inline {
        display: -webkit-inline-flex;
        display: -moz-inline-flex;
        display: -ms-inline-flexbox;
        display: -ms-inline-flex;
        display: inline-flex;
    }

    .fx-ss-md-direction {
        -webkit-flex-direction: row;
        -moz-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
    }

    .fx-ss-md-direction-reverse {
        -webkit-flex-direction: row-reverse;
        -moz-flex-direction: row-reverse;
        -ms-flex-direction: row-reverse;
        flex-direction: row-reverse;
    }

    .fx-ss-md-direction-column {
        -webkit-flex-direction: column;
        -moz-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .fx-ss-md-direction-column-reverse {
        -webkit-flex-direction: column-reverse;
        -moz-flex-direction: column-reverse;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse;
    }

    .fx-ss-md-wrap {
        -webkit-flex-wrap: wrap;
        -moz-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    .fx-ss-md-wrap-nowrap {
        -webkit-flex-wrap: nowrap;
        -moz-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
    }

    .fx-ss-md-wrap-reverse {
        -webkit-flex-wrap: wrap-reverse;
        -moz-flex-wrap: wrap-reverse;
        -ms-flex-wrap: wrap-reverse;
        flex-wrap: wrap-reverse;
    }

    .fx-ss-md-justify-flex-start {
        -webkit-justify-content: flex-start;
        -moz-justify-content: flex-start;
        -ms-justify-content: flex-start;
        justify-content: flex-start;
    }

    .fx-ss-md-justify-flex-end {
        -webkit-justify-content: flex-end;
        -moz-justify-content: flex-end;
        -ms-justify-content: flex-end;
        justify-content: flex-end;
    }

    .fx-ss-md-justify-center {
        -webkit-justify-content: center;
        -moz-justify-content: center;
        -ms-justify-content: center;
        justify-content: center;
    }

    .fx-ss-md-justify-space-between {
        -webkit-justify-content: space-between;
        -moz-justify-content: space-between;
        -ms-justify-content: space-between;
        justify-content: space-between;
    }

    .fx-ss-md-justify-space-around {
        -webkit-justify-content: space-around;
        -moz-justify-content: space-around;
        -ms-justify-content: space-around;
        justify-content: space-around;
    }

    .fx-ss-md-align-content-flex-start {
        -webkit-align-content: flex-start;
        -moz-align-content: flex-start;
        -ms-align-content: flex-start;
        align-content: flex-start;
    }

    .fx-ss-md-align-content-flex-end {
        -webkit-align-content: flex-end;
        -moz-align-content: flex-end;
        -ms-align-content: flex-end;
        align-content: flex-end;
    }

    .fx-ss-md-align-content-center {
        -webkit-align-content: center;
        -moz-align-content: center;
        -ms-align-content: center;
        align-content: center;
    }

    .fx-ss-md-align-content-space-between {
        -webkit-align-content: space-between;
        -moz-align-content: space-between;
        -ms-align-content: space-between;
        align-content: space-between;
    }

    .fx-ss-md-align-content-space-around {
        -webkit-align-content: space-around;
        -moz-align-content: space-around;
        -ms-align-content: space-around;
        align-content: space-around;
    }

    .fx-ss-md-align-content-stretch {
        -webkit-align-content: stretch;
        -moz-align-content: stretch;
        -ms-align-content: stretch;
        align-content: stretch;
    }

    .fx-ss-md-align-items-flex-start {
        -webkit-align-items: flex-start;
        -moz-align-items: flex-start;
        -ms-align-items: flex-start;
        align-items: flex-start;
    }

    .fx-ss-md-align-items-flex-end {
        -webkit-align-items: flex-end;
        -moz-align-items: flex-end;
        -ms-align-items: flex-end;
        align-items: flex-end;
    }

    .fx-ss-md-align-items-center {
        -webkit-align-items: center;
        -moz-align-items: center;
        -ms-align-items: center;
        align-items: center;
    }

    .fx-ss-md-align-items-baseline {
        -webkit-align-items: baseline;
        -moz-align-items: baseline;
        -ms-align-items: baseline;
        align-items: baseline;
    }

    .fx-ss-md-align-items-stretch {
        -webkit-align-items: stretch;
        -moz-align-items: stretch;
        -ms-align-items: stretch;
        align-items: stretch;
    }

    .fx-ss-md-order-0 {
        -webkit-order: 0;
        -moz-order: 0;
        -ms-order: 0;
        order: 0;
    }

    .fx-ss-md-order-1 {
        -webkit-order: 1;
        -moz-order: 1;
        -ms-order: 1;
        order: 1;
    }

    .fx-ss-md-order-2 {
        -webkit-order: 2;
        -moz-order: 2;
        -ms-order: 2;
        order: 2;
    }

    .fx-ss-md-order-3 {
        -webkit-order: 3;
        -moz-order: 3;
        -ms-order: 3;
        order: 3;
    }

    .fx-ss-md-order-4 {
        -webkit-order: 4;
        -moz-order: 4;
        -ms-order: 4;
        order: 4;
    }

    .fx-ss-md-order-5 {
        -webkit-order: 5;
        -moz-order: 5;
        -ms-order: 5;
        order: 5;
    }

    .fx-ss-md-order-6 {
        -webkit-order: 6;
        -moz-order: 6;
        -ms-order: 6;
        order: 6;
    }

    .fx-ss-md-order-7 {
        -webkit-order: 7;
        -moz-order: 7;
        -ms-order: 7;
        order: 7;
    }

    .fx-ss-md-order-8 {
        -webkit-order: 8;
        -moz-order: 8;
        -ms-order: 8;
        order: 8;
    }

    .fx-ss-md-order-9 {
        -webkit-order: 9;
        -moz-order: 9;
        -ms-order: 9;
        order: 9;
    }

    .fx-ss-md-order-10 {
        -webkit-order: 10;
        -moz-order: 10;
        -ms-order: 10;
        order: 10;
    }

    .fx-ss-md-grow-0 {
        -webkit-flex-grow: 0;
        -moz-flex-grow: 0;
        -ms-flex-grow: 0;
        flex-grow: 0;
    }

    .fx-ss-md-grow-1 {
        -webkit-flex-grow: 1;
        -moz-flex-grow: 1;
        -ms-flex-grow: 1;
        flex-grow: 1;
    }

    .fx-ss-md-grow-2 {
        -webkit-flex-grow: 2;
        -moz-flex-grow: 2;
        -ms-flex-grow: 2;
        flex-grow: 2;
    }

    .fx-ss-md-grow-3 {
        -webkit-flex-grow: 3;
        -moz-flex-grow: 3;
        -ms-flex-grow: 3;
        flex-grow: 3;
    }

    .fx-ss-md-grow-4 {
        -webkit-flex-grow: 4;
        -moz-flex-grow: 4;
        -ms-flex-grow: 4;
        flex-grow: 4;
    }

    .fx-ss-md-grow-5 {
        -webkit-flex-grow: 5;
        -moz-flex-grow: 5;
        -ms-flex-grow: 5;
        flex-grow: 5;
    }

    .fx-ss-md-grow-6 {
        -webkit-flex-grow: 6;
        -moz-flex-grow: 6;
        -ms-flex-grow: 6;
        flex-grow: 6;
    }

    .fx-ss-md-grow-7 {
        -webkit-flex-grow: 7;
        -moz-flex-grow: 7;
        -ms-flex-grow: 7;
        flex-grow: 7;
    }

    .fx-ss-md-grow-8 {
        -webkit-flex-grow: 8;
        -moz-flex-grow: 8;
        -ms-flex-grow: 8;
        flex-grow: 8;
    }

    .fx-ss-md-grow-9 {
        -webkit-flex-grow: 9;
        -moz-flex-grow: 9;
        -ms-flex-grow: 9;
        flex-grow: 9;
    }

    .fx-ss-md-grow-10 {
        -webkit-flex-grow: 10;
        -moz-flex-grow: 10;
        -ms-flex-grow: 10;
        flex-grow: 10;
    }

    .fx-ss-md-shrink-0 {
        -webkit-flex-shrink: 0;
        -moz-flex-shrink: 0;
        -ms-flex-shrink: 0;
        flex-shrink: 0;
    }

    .fx-ss-md-shrink-1 {
        -webkit-flex-shrink: 1;
        -moz-flex-shrink: 1;
        -ms-flex-shrink: 1;
        flex-shrink: 1;
    }

    .fx-ss-md-shrink-2 {
        -webkit-flex-shrink: 2;
        -moz-flex-shrink: 2;
        -ms-flex-shrink: 2;
        flex-shrink: 2;
    }

    .fx-ss-md-shrink-3 {
        -webkit-flex-shrink: 3;
        -moz-flex-shrink: 3;
        -ms-flex-shrink: 3;
        flex-shrink: 3;
    }

    .fx-ss-md-shrink-4 {
        -webkit-flex-shrink: 4;
        -moz-flex-shrink: 4;
        -ms-flex-shrink: 4;
        flex-shrink: 4;
    }

    .fx-ss-md-shrink-5 {
        -webkit-flex-shrink: 5;
        -moz-flex-shrink: 5;
        -ms-flex-shrink: 5;
        flex-shrink: 5;
    }

    .fx-ss-md-shrink-6 {
        -webkit-flex-shrink: 6;
        -moz-flex-shrink: 6;
        -ms-flex-shrink: 6;
        flex-shrink: 6;
    }

    .fx-ss-md-shrink-7 {
        -webkit-flex-shrink: 7;
        -moz-flex-shrink: 7;
        -ms-flex-shrink: 7;
        flex-shrink: 7;
    }

    .fx-ss-md-shrink-8 {
        -webkit-flex-shrink: 8;
        -moz-flex-shrink: 8;
        -ms-flex-shrink: 8;
        flex-shrink: 8;
    }

    .fx-ss-md-shrink-9 {
        -webkit-flex-shrink: 9;
        -moz-flex-shrink: 9;
        -ms-flex-shrink: 9;
        flex-shrink: 9;
    }

    .fx-ss-md-shrink-10 {
        -webkit-flex-shrink: 10;
        -moz-flex-shrink: 10;
        -ms-flex-shrink: 10;
        flex-shrink: 10;
    }

    .fx-ss-md-align-self-flex-start {
        -webkit-align-self: flex-start;
        -moz-align-self: flex-start;
        -ms-align-self: flex-start;
        align-self: flex-start;
    }

    .fx-ss-md-align-self-flex-end {
        -webkit-align-self: flex-end;
        -moz-align-self: flex-end;
        -ms-align-self: flex-end;
        align-self: flex-end;
    }

    .fx-ss-md-align-self-center {
        -webkit-align-self: center;
        -moz-align-self: center;
        -ms-align-self: center;
        align-self: center;
    }

    .fx-ss-md-align-self-baseline {
        -webkit-align-self: baseline;
        -moz-align-self: baseline;
        -ms-align-self: baseline;
        align-self: baseline;
    }

    .fx-ss-md-align-self-stretch {
        -webkit-align-self: stretch;
        -moz-align-self: stretch;
        -ms-align-self: stretch;
        align-self: stretch;
    }
}

@media (max-width: 768px) and (min-width: 544px) {
    .fx-example-highlight-colour-ss-sm {
        background: #6A95B5;
        color: #fff;
    }

    .fx-ss-sm-display-block {
        display: block;
    }

    .fx-ss-sm-display-block-inline {
        display: inline-block;
    }

    .fx-ss-sm-display {
        display: -webkit-flex;
        display: -moz-flex;
        display: -ms-flexbox;
        display: -ms-flex;
        display: flex;
    }

    .fx-ss-sm-display-inline {
        display: -webkit-inline-flex;
        display: -moz-inline-flex;
        display: -ms-inline-flexbox;
        display: -ms-inline-flex;
        display: inline-flex;
    }

    .fx-ss-sm-direction {
        -webkit-flex-direction: row;
        -moz-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
    }

    .fx-ss-sm-direction-reverse {
        -webkit-flex-direction: row-reverse;
        -moz-flex-direction: row-reverse;
        -ms-flex-direction: row-reverse;
        flex-direction: row-reverse;
    }

    .fx-ss-sm-direction-column {
        -webkit-flex-direction: column;
        -moz-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .fx-ss-sm-direction-column-reverse {
        -webkit-flex-direction: column-reverse;
        -moz-flex-direction: column-reverse;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse;
    }

    .fx-ss-sm-wrap {
        -webkit-flex-wrap: wrap;
        -moz-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    .fx-ss-sm-wrap-nowrap {
        -webkit-flex-wrap: nowrap;
        -moz-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
    }

    .fx-ss-sm-wrap-reverse {
        -webkit-flex-wrap: wrap-reverse;
        -moz-flex-wrap: wrap-reverse;
        -ms-flex-wrap: wrap-reverse;
        flex-wrap: wrap-reverse;
    }

    .fx-ss-sm-justify-flex-start {
        -webkit-justify-content: flex-start;
        -moz-justify-content: flex-start;
        -ms-justify-content: flex-start;
        justify-content: flex-start;
    }

    .fx-ss-sm-justify-flex-end {
        -webkit-justify-content: flex-end;
        -moz-justify-content: flex-end;
        -ms-justify-content: flex-end;
        justify-content: flex-end;
    }

    .fx-ss-sm-justify-center {
        -webkit-justify-content: center;
        -moz-justify-content: center;
        -ms-justify-content: center;
        justify-content: center;
    }

    .fx-ss-sm-justify-space-between {
        -webkit-justify-content: space-between;
        -moz-justify-content: space-between;
        -ms-justify-content: space-between;
        justify-content: space-between;
    }

    .fx-ss-sm-justify-space-around {
        -webkit-justify-content: space-around;
        -moz-justify-content: space-around;
        -ms-justify-content: space-around;
        justify-content: space-around;
    }

    .fx-ss-sm-align-content-flex-start {
        -webkit-align-content: flex-start;
        -moz-align-content: flex-start;
        -ms-align-content: flex-start;
        align-content: flex-start;
    }

    .fx-ss-sm-align-content-flex-end {
        -webkit-align-content: flex-end;
        -moz-align-content: flex-end;
        -ms-align-content: flex-end;
        align-content: flex-end;
    }

    .fx-ss-sm-align-content-center {
        -webkit-align-content: center;
        -moz-align-content: center;
        -ms-align-content: center;
        align-content: center;
    }

    .fx-ss-sm-align-content-space-between {
        -webkit-align-content: space-between;
        -moz-align-content: space-between;
        -ms-align-content: space-between;
        align-content: space-between;
    }

    .fx-ss-sm-align-content-space-around {
        -webkit-align-content: space-around;
        -moz-align-content: space-around;
        -ms-align-content: space-around;
        align-content: space-around;
    }

    .fx-ss-sm-align-content-stretch {
        -webkit-align-content: stretch;
        -moz-align-content: stretch;
        -ms-align-content: stretch;
        align-content: stretch;
    }

    .fx-ss-sm-align-items-flex-start {
        -webkit-align-items: flex-start;
        -moz-align-items: flex-start;
        -ms-align-items: flex-start;
        align-items: flex-start;
    }

    .fx-ss-sm-align-items-flex-end {
        -webkit-align-items: flex-end;
        -moz-align-items: flex-end;
        -ms-align-items: flex-end;
        align-items: flex-end;
    }

    .fx-ss-sm-align-items-center {
        -webkit-align-items: center;
        -moz-align-items: center;
        -ms-align-items: center;
        align-items: center;
    }

    .fx-ss-sm-align-items-baseline {
        -webkit-align-items: baseline;
        -moz-align-items: baseline;
        -ms-align-items: baseline;
        align-items: baseline;
    }

    .fx-ss-sm-align-items-stretch {
        -webkit-align-items: stretch;
        -moz-align-items: stretch;
        -ms-align-items: stretch;
        align-items: stretch;
    }

    .fx-ss-sm-order-0 {
        -webkit-order: 0;
        -moz-order: 0;
        -ms-order: 0;
        order: 0;
    }

    .fx-ss-sm-order-1 {
        -webkit-order: 1;
        -moz-order: 1;
        -ms-order: 1;
        order: 1;
    }

    .fx-ss-sm-order-2 {
        -webkit-order: 2;
        -moz-order: 2;
        -ms-order: 2;
        order: 2;
    }

    .fx-ss-sm-order-3 {
        -webkit-order: 3;
        -moz-order: 3;
        -ms-order: 3;
        order: 3;
    }

    .fx-ss-sm-order-4 {
        -webkit-order: 4;
        -moz-order: 4;
        -ms-order: 4;
        order: 4;
    }

    .fx-ss-sm-order-5 {
        -webkit-order: 5;
        -moz-order: 5;
        -ms-order: 5;
        order: 5;
    }

    .fx-ss-sm-order-6 {
        -webkit-order: 6;
        -moz-order: 6;
        -ms-order: 6;
        order: 6;
    }

    .fx-ss-sm-order-7 {
        -webkit-order: 7;
        -moz-order: 7;
        -ms-order: 7;
        order: 7;
    }

    .fx-ss-sm-order-8 {
        -webkit-order: 8;
        -moz-order: 8;
        -ms-order: 8;
        order: 8;
    }

    .fx-ss-sm-order-9 {
        -webkit-order: 9;
        -moz-order: 9;
        -ms-order: 9;
        order: 9;
    }

    .fx-ss-sm-order-10 {
        -webkit-order: 10;
        -moz-order: 10;
        -ms-order: 10;
        order: 10;
    }

    .fx-ss-sm-grow-0 {
        -webkit-flex-grow: 0;
        -moz-flex-grow: 0;
        -ms-flex-grow: 0;
        flex-grow: 0;
    }

    .fx-ss-sm-grow-1 {
        -webkit-flex-grow: 1;
        -moz-flex-grow: 1;
        -ms-flex-grow: 1;
        flex-grow: 1;
    }

    .fx-ss-sm-grow-2 {
        -webkit-flex-grow: 2;
        -moz-flex-grow: 2;
        -ms-flex-grow: 2;
        flex-grow: 2;
    }

    .fx-ss-sm-grow-3 {
        -webkit-flex-grow: 3;
        -moz-flex-grow: 3;
        -ms-flex-grow: 3;
        flex-grow: 3;
    }

    .fx-ss-sm-grow-4 {
        -webkit-flex-grow: 4;
        -moz-flex-grow: 4;
        -ms-flex-grow: 4;
        flex-grow: 4;
    }

    .fx-ss-sm-grow-5 {
        -webkit-flex-grow: 5;
        -moz-flex-grow: 5;
        -ms-flex-grow: 5;
        flex-grow: 5;
    }

    .fx-ss-sm-grow-6 {
        -webkit-flex-grow: 6;
        -moz-flex-grow: 6;
        -ms-flex-grow: 6;
        flex-grow: 6;
    }

    .fx-ss-sm-grow-7 {
        -webkit-flex-grow: 7;
        -moz-flex-grow: 7;
        -ms-flex-grow: 7;
        flex-grow: 7;
    }

    .fx-ss-sm-grow-8 {
        -webkit-flex-grow: 8;
        -moz-flex-grow: 8;
        -ms-flex-grow: 8;
        flex-grow: 8;
    }

    .fx-ss-sm-grow-9 {
        -webkit-flex-grow: 9;
        -moz-flex-grow: 9;
        -ms-flex-grow: 9;
        flex-grow: 9;
    }

    .fx-ss-sm-grow-10 {
        -webkit-flex-grow: 10;
        -moz-flex-grow: 10;
        -ms-flex-grow: 10;
        flex-grow: 10;
    }

    .fx-ss-sm-shrink-0 {
        -webkit-flex-shrink: 0;
        -moz-flex-shrink: 0;
        -ms-flex-shrink: 0;
        flex-shrink: 0;
    }

    .fx-ss-sm-shrink-1 {
        -webkit-flex-shrink: 1;
        -moz-flex-shrink: 1;
        -ms-flex-shrink: 1;
        flex-shrink: 1;
    }

    .fx-ss-sm-shrink-2 {
        -webkit-flex-shrink: 2;
        -moz-flex-shrink: 2;
        -ms-flex-shrink: 2;
        flex-shrink: 2;
    }

    .fx-ss-sm-shrink-3 {
        -webkit-flex-shrink: 3;
        -moz-flex-shrink: 3;
        -ms-flex-shrink: 3;
        flex-shrink: 3;
    }

    .fx-ss-sm-shrink-4 {
        -webkit-flex-shrink: 4;
        -moz-flex-shrink: 4;
        -ms-flex-shrink: 4;
        flex-shrink: 4;
    }

    .fx-ss-sm-shrink-5 {
        -webkit-flex-shrink: 5;
        -moz-flex-shrink: 5;
        -ms-flex-shrink: 5;
        flex-shrink: 5;
    }

    .fx-ss-sm-shrink-6 {
        -webkit-flex-shrink: 6;
        -moz-flex-shrink: 6;
        -ms-flex-shrink: 6;
        flex-shrink: 6;
    }

    .fx-ss-sm-shrink-7 {
        -webkit-flex-shrink: 7;
        -moz-flex-shrink: 7;
        -ms-flex-shrink: 7;
        flex-shrink: 7;
    }

    .fx-ss-sm-shrink-8 {
        -webkit-flex-shrink: 8;
        -moz-flex-shrink: 8;
        -ms-flex-shrink: 8;
        flex-shrink: 8;
    }

    .fx-ss-sm-shrink-9 {
        -webkit-flex-shrink: 9;
        -moz-flex-shrink: 9;
        -ms-flex-shrink: 9;
        flex-shrink: 9;
    }

    .fx-ss-sm-shrink-10 {
        -webkit-flex-shrink: 10;
        -moz-flex-shrink: 10;
        -ms-flex-shrink: 10;
        flex-shrink: 10;
    }

    .fx-ss-sm-align-self-flex-start {
        -webkit-align-self: flex-start;
        -moz-align-self: flex-start;
        -ms-align-self: flex-start;
        align-self: flex-start;
    }

    .fx-ss-sm-align-self-flex-end {
        -webkit-align-self: flex-end;
        -moz-align-self: flex-end;
        -ms-align-self: flex-end;
        align-self: flex-end;
    }

    .fx-ss-sm-align-self-center {
        -webkit-align-self: center;
        -moz-align-self: center;
        -ms-align-self: center;
        align-self: center;
    }

    .fx-ss-sm-align-self-baseline {
        -webkit-align-self: baseline;
        -moz-align-self: baseline;
        -ms-align-self: baseline;
        align-self: baseline;
    }

    .fx-ss-sm-align-self-stretch {
        -webkit-align-self: stretch;
        -moz-align-self: stretch;
        -ms-align-self: stretch;
        align-self: stretch;
    }
}

@media (max-width: 544px) and (min-width: 0px) {
    .fx-example-highlight-colour-ss-xs {
        background: #6A95B5;
        color: #fff;
    }

    .fx-ss-xs-display-block {
        display: block;
    }

    .fx-ss-xs-display-block-inline {
        display: inline-block;
    }

    .fx-ss-xs-display {
        display: -webkit-flex;
        display: -moz-flex;
        display: -ms-flexbox;
        display: -ms-flex;
        display: flex;
    }

    .fx-ss-xs-display-inline {
        display: -webkit-inline-flex;
        display: -moz-inline-flex;
        display: -ms-inline-flexbox;
        display: -ms-inline-flex;
        display: inline-flex;
    }

    .fx-ss-xs-direction {
        -webkit-flex-direction: row;
        -moz-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
    }

    .fx-ss-xs-direction-reverse {
        -webkit-flex-direction: row-reverse;
        -moz-flex-direction: row-reverse;
        -ms-flex-direction: row-reverse;
        flex-direction: row-reverse;
    }

    .fx-ss-xs-direction-column {
        -webkit-flex-direction: column;
        -moz-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .fx-ss-xs-direction-column-reverse {
        -webkit-flex-direction: column-reverse;
        -moz-flex-direction: column-reverse;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse;
    }

    .fx-ss-xs-wrap {
        -webkit-flex-wrap: wrap;
        -moz-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    .fx-ss-xs-wrap-nowrap {
        -webkit-flex-wrap: nowrap;
        -moz-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
    }

    .fx-ss-xs-wrap-reverse {
        -webkit-flex-wrap: wrap-reverse;
        -moz-flex-wrap: wrap-reverse;
        -ms-flex-wrap: wrap-reverse;
        flex-wrap: wrap-reverse;
    }

    .fx-ss-xs-justify-flex-start {
        -webkit-justify-content: flex-start;
        -moz-justify-content: flex-start;
        -ms-justify-content: flex-start;
        justify-content: flex-start;
    }

    .fx-ss-xs-justify-flex-end {
        -webkit-justify-content: flex-end;
        -moz-justify-content: flex-end;
        -ms-justify-content: flex-end;
        justify-content: flex-end;
    }

    .fx-ss-xs-justify-center {
        -webkit-justify-content: center;
        -moz-justify-content: center;
        -ms-justify-content: center;
        justify-content: center;
    }

    .fx-ss-xs-justify-space-between {
        -webkit-justify-content: space-between;
        -moz-justify-content: space-between;
        -ms-justify-content: space-between;
        justify-content: space-between;
    }

    .fx-ss-xs-justify-space-around {
        -webkit-justify-content: space-around;
        -moz-justify-content: space-around;
        -ms-justify-content: space-around;
        justify-content: space-around;
    }

    .fx-ss-xs-align-content-flex-start {
        -webkit-align-content: flex-start;
        -moz-align-content: flex-start;
        -ms-align-content: flex-start;
        align-content: flex-start;
    }

    .fx-ss-xs-align-content-flex-end {
        -webkit-align-content: flex-end;
        -moz-align-content: flex-end;
        -ms-align-content: flex-end;
        align-content: flex-end;
    }

    .fx-ss-xs-align-content-center {
        -webkit-align-content: center;
        -moz-align-content: center;
        -ms-align-content: center;
        align-content: center;
    }

    .fx-ss-xs-align-content-space-between {
        -webkit-align-content: space-between;
        -moz-align-content: space-between;
        -ms-align-content: space-between;
        align-content: space-between;
    }

    .fx-ss-xs-align-content-space-around {
        -webkit-align-content: space-around;
        -moz-align-content: space-around;
        -ms-align-content: space-around;
        align-content: space-around;
    }

    .fx-ss-xs-align-content-stretch {
        -webkit-align-content: stretch;
        -moz-align-content: stretch;
        -ms-align-content: stretch;
        align-content: stretch;
    }

    .fx-ss-xs-align-items-flex-start {
        -webkit-align-items: flex-start;
        -moz-align-items: flex-start;
        -ms-align-items: flex-start;
        align-items: flex-start;
    }

    .fx-ss-xs-align-items-flex-end {
        -webkit-align-items: flex-end;
        -moz-align-items: flex-end;
        -ms-align-items: flex-end;
        align-items: flex-end;
    }

    .fx-ss-xs-align-items-center {
        -webkit-align-items: center;
        -moz-align-items: center;
        -ms-align-items: center;
        align-items: center;
    }

    .fx-ss-xs-align-items-baseline {
        -webkit-align-items: baseline;
        -moz-align-items: baseline;
        -ms-align-items: baseline;
        align-items: baseline;
    }

    .fx-ss-xs-align-items-stretch {
        -webkit-align-items: stretch;
        -moz-align-items: stretch;
        -ms-align-items: stretch;
        align-items: stretch;
    }

    .fx-ss-xs-order-0 {
        -webkit-order: 0;
        -moz-order: 0;
        -ms-order: 0;
        order: 0;
    }

    .fx-ss-xs-order-1 {
        -webkit-order: 1;
        -moz-order: 1;
        -ms-order: 1;
        order: 1;
    }

    .fx-ss-xs-order-2 {
        -webkit-order: 2;
        -moz-order: 2;
        -ms-order: 2;
        order: 2;
    }

    .fx-ss-xs-order-3 {
        -webkit-order: 3;
        -moz-order: 3;
        -ms-order: 3;
        order: 3;
    }

    .fx-ss-xs-order-4 {
        -webkit-order: 4;
        -moz-order: 4;
        -ms-order: 4;
        order: 4;
    }

    .fx-ss-xs-order-5 {
        -webkit-order: 5;
        -moz-order: 5;
        -ms-order: 5;
        order: 5;
    }

    .fx-ss-xs-order-6 {
        -webkit-order: 6;
        -moz-order: 6;
        -ms-order: 6;
        order: 6;
    }

    .fx-ss-xs-order-7 {
        -webkit-order: 7;
        -moz-order: 7;
        -ms-order: 7;
        order: 7;
    }

    .fx-ss-xs-order-8 {
        -webkit-order: 8;
        -moz-order: 8;
        -ms-order: 8;
        order: 8;
    }

    .fx-ss-xs-order-9 {
        -webkit-order: 9;
        -moz-order: 9;
        -ms-order: 9;
        order: 9;
    }

    .fx-ss-xs-order-10 {
        -webkit-order: 10;
        -moz-order: 10;
        -ms-order: 10;
        order: 10;
    }

    .fx-ss-xs-grow-0 {
        -webkit-flex-grow: 0;
        -moz-flex-grow: 0;
        -ms-flex-grow: 0;
        flex-grow: 0;
    }

    .fx-ss-xs-grow-1 {
        -webkit-flex-grow: 1;
        -moz-flex-grow: 1;
        -ms-flex-grow: 1;
        flex-grow: 1;
    }

    .fx-ss-xs-grow-2 {
        -webkit-flex-grow: 2;
        -moz-flex-grow: 2;
        -ms-flex-grow: 2;
        flex-grow: 2;
    }

    .fx-ss-xs-grow-3 {
        -webkit-flex-grow: 3;
        -moz-flex-grow: 3;
        -ms-flex-grow: 3;
        flex-grow: 3;
    }

    .fx-ss-xs-grow-4 {
        -webkit-flex-grow: 4;
        -moz-flex-grow: 4;
        -ms-flex-grow: 4;
        flex-grow: 4;
    }

    .fx-ss-xs-grow-5 {
        -webkit-flex-grow: 5;
        -moz-flex-grow: 5;
        -ms-flex-grow: 5;
        flex-grow: 5;
    }

    .fx-ss-xs-grow-6 {
        -webkit-flex-grow: 6;
        -moz-flex-grow: 6;
        -ms-flex-grow: 6;
        flex-grow: 6;
    }

    .fx-ss-xs-grow-7 {
        -webkit-flex-grow: 7;
        -moz-flex-grow: 7;
        -ms-flex-grow: 7;
        flex-grow: 7;
    }

    .fx-ss-xs-grow-8 {
        -webkit-flex-grow: 8;
        -moz-flex-grow: 8;
        -ms-flex-grow: 8;
        flex-grow: 8;
    }

    .fx-ss-xs-grow-9 {
        -webkit-flex-grow: 9;
        -moz-flex-grow: 9;
        -ms-flex-grow: 9;
        flex-grow: 9;
    }

    .fx-ss-xs-grow-10 {
        -webkit-flex-grow: 10;
        -moz-flex-grow: 10;
        -ms-flex-grow: 10;
        flex-grow: 10;
    }

    .fx-ss-xs-shrink-0 {
        -webkit-flex-shrink: 0;
        -moz-flex-shrink: 0;
        -ms-flex-shrink: 0;
        flex-shrink: 0;
    }

    .fx-ss-xs-shrink-1 {
        -webkit-flex-shrink: 1;
        -moz-flex-shrink: 1;
        -ms-flex-shrink: 1;
        flex-shrink: 1;
    }

    .fx-ss-xs-shrink-2 {
        -webkit-flex-shrink: 2;
        -moz-flex-shrink: 2;
        -ms-flex-shrink: 2;
        flex-shrink: 2;
    }

    .fx-ss-xs-shrink-3 {
        -webkit-flex-shrink: 3;
        -moz-flex-shrink: 3;
        -ms-flex-shrink: 3;
        flex-shrink: 3;
    }

    .fx-ss-xs-shrink-4 {
        -webkit-flex-shrink: 4;
        -moz-flex-shrink: 4;
        -ms-flex-shrink: 4;
        flex-shrink: 4;
    }

    .fx-ss-xs-shrink-5 {
        -webkit-flex-shrink: 5;
        -moz-flex-shrink: 5;
        -ms-flex-shrink: 5;
        flex-shrink: 5;
    }

    .fx-ss-xs-shrink-6 {
        -webkit-flex-shrink: 6;
        -moz-flex-shrink: 6;
        -ms-flex-shrink: 6;
        flex-shrink: 6;
    }

    .fx-ss-xs-shrink-7 {
        -webkit-flex-shrink: 7;
        -moz-flex-shrink: 7;
        -ms-flex-shrink: 7;
        flex-shrink: 7;
    }

    .fx-ss-xs-shrink-8 {
        -webkit-flex-shrink: 8;
        -moz-flex-shrink: 8;
        -ms-flex-shrink: 8;
        flex-shrink: 8;
    }

    .fx-ss-xs-shrink-9 {
        -webkit-flex-shrink: 9;
        -moz-flex-shrink: 9;
        -ms-flex-shrink: 9;
        flex-shrink: 9;
    }

    .fx-ss-xs-shrink-10 {
        -webkit-flex-shrink: 10;
        -moz-flex-shrink: 10;
        -ms-flex-shrink: 10;
        flex-shrink: 10;
    }

    .fx-ss-xs-align-self-flex-start {
        -webkit-align-self: flex-start;
        -moz-align-self: flex-start;
        -ms-align-self: flex-start;
        align-self: flex-start;
    }

    .fx-ss-xs-align-self-flex-end {
        -webkit-align-self: flex-end;
        -moz-align-self: flex-end;
        -ms-align-self: flex-end;
        align-self: flex-end;
    }

    .fx-ss-xs-align-self-center {
        -webkit-align-self: center;
        -moz-align-self: center;
        -ms-align-self: center;
        align-self: center;
    }

    .fx-ss-xs-align-self-baseline {
        -webkit-align-self: baseline;
        -moz-align-self: baseline;
        -ms-align-self: baseline;
        align-self: baseline;
    }

    .fx-ss-xs-align-self-stretch {
        -webkit-align-self: stretch;
        -moz-align-self: stretch;
        -ms-align-self: stretch;
        align-self: stretch;
    }
}

.social {
    display: inline-block;
    margin-left: 16px;
    vertical-align: top;
}

@media (max-width: 1024px) {
    .social {
        position: absolute;
        top: 0;
        right: 15px;
    }
}

.social ul {
    list-style-type: none;
    padding: 0px;
    margin: 0px;
}

    .social ul li {
        padding: 0px;
        margin: 0px;
        display: block;
        float: left;
    }

        .social ul li a {
            display: block;
            min-width: 39px;
            height: auto;
            background: #ccc;
            text-align: center;
            float: left;
            background: #ccc;
            -webkit-transition: background-color 0.5s;
            -moz-transition: background-color 0.5s;
            -o-transition: background-color 0.5s;
            transition: background-color 0.5s;
            -webkit-transition: all 0.5s;
            -moz-transition: all 0.5s;
            -o-transition: all 0.5s;
            transition: all 0.5s;
            -webkit-border-radius: 100%;
            -moz-border-radius: 100%;
            -ms-border-radius: 100%;
            -o-border-radius: 100%;
            border-radius: 100%;
        }

            .social ul li a:hover, .social ul li a:focus {
                background: #b3b3b3;
            }

            .social ul li a a, .social ul li aa {
                color: #fff;
            }

                .social ul li a a:hover, .social ul li a a:focus, .social ul li aa:hover, .social ul li aa:focus {
                    text-decoration: underline;
                    color: #e6e6e6;
                }

            .social ul li a i {
                font-size: 16px;
                padding: 12px 0 10px;
                color: #fff;
                -webkit-transition: all 0.5s;
                -moz-transition: all 0.5s;
                -o-transition: all 0.5s;
                transition: all 0.5s;
            }

            .social ul li a:hover i, .social ul li a:focus i, .social ul li a:active i {
                color: #fff;
            }

.top-navigation ul {
    padding: 0;
    margin: 0;
}

    .top-navigation ul li {
        display: inline-block;
    }

        .top-navigation ul li a {
            -webkit-transition: all 0.5s;
            -moz-transition: all 0.5s;
            -o-transition: all 0.5s;
            transition: all 0.5s;
        }

            .top-navigation ul li a:hover, .top-navigation ul li a:focus, .top-navigation ul li a a, .top-navigation ul li a a:hover, .top-navigation ul li a a:focus {
                text-decoration: none;
            }

            .top-navigation ul li a:hover, .top-navigation ul li a:focus, .top-navigation ul li a:active {
                color: #fff;
            }

        .top-navigation ul li + li {
            padding-left: 8px;
        }

.shopping-cart {
    font-size: 18px;
    color: white;
    margin: 0 7px;
    -webkit-transition: 0.3s;
    -moz-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
}

    .shopping-cart:hover, .shopping-cart:focus, .shopping-cart:active {
        color: #786E87;
    }

.navigation-section {
    font-size: 15px;
    float: none;
    display: flex;
    flex-grow: 1;
}

    .navigation-section .nav-bar {
        float: none;
        margin: 0 auto;
        display: table;
        text-align: center;
    }

    .navigation-section .navbar {
        -webkit-flex-grow: 1;
        -moz-flex-grow: 1;
        -ms-flex-grow: 1;
        flex-grow: 1;
    }

        .navigation-section .navbar .nav {
            border: 0;
            float: right;
        }

            .navigation-section .navbar .nav > li {
                margin: 0;
                padding: 0;
            }

                .navigation-section .navbar .nav > li:last-child > a:after {
                    display: none;
                }

                .navigation-section .navbar .nav > li > a {
                    color: white;
                    text-transform: lowercase;
                    font-size: 14px;
                    display: block;
                    padding: 15px 30px;
                    margin: 0;
                    font-family: "Open Sans","Arial",sans-serif;
                    position: relative;
                    -webkit-border-radius: 0px;
                    -moz-border-radius: 0px;
                    -ms-border-radius: 0px;
                    -o-border-radius: 0px;
                    border-radius: 0px;
                    -webkit-transition: all 0.5s;
                    -moz-transition: all 0.5s;
                    -o-transition: all 0.5s;
                    transition: all 0.5s;
                }

@media (min-width: 1200px) {
    .navigation-section .navbar .nav > li > a {
        font-size: 18px;
    }
}

.navigation-section .navbar .nav > li > a.shopping-cart {
    font-size: 18px;
}

.navigation-section .navbar .nav > li > a:before {
    content: "";
    height: 1px;
    background: white;
    position: absolute;
    bottom: 0;
    width: 0%;
    left: 0;
    right: 0;
    margin: 0 auto;
    -webkit-transition: 200ms;
    -moz-transition: 200ms;
    -o-transition: 200ms;
    transition: 200ms;
}

@media (max-width: 1024px) {
    .navigation-section .navbar .nav > li > a {
        font-size: 18px;
    }
}

.navigation-section .navbar .nav > li > a:hover, .navigation-section .navbar .nav > li > a:focus {
    text-decoration: none;
    color: white;
}

    .navigation-section .navbar .nav > li > a:hover:before, .navigation-section .navbar .nav > li > a:focus:before {
        width: 50%;
    }

.navigation-section .navbar .nav > li > a .caret {
    border: 0;
    margin-top: -1px;
    vertical-align: top;
}

    .navigation-section .navbar .nav > li > a .caret:after {
        content: '\f078';
        font-family: FontAwesome;
        font-size: 10px;
        color: #d0d0d0;
    }

.navbar .nav li {
    display: block;
}

    .navbar .nav li.breaker {
        display: block;
    }

        .navbar .nav li.breaker:after {
            content: "";
            width: 100%;
            height: 1px;
            background: #e8e4e4;
            display: block;
            margin: 8px 0px;
        }

    .navbar .nav li .dropdown-menu {
        -webkit-box-shadow: 0 2px 4px rgba(0,0,0,0.1);
        -moz-box-shadow: 0 2px 4px rgba(0,0,0,0.1);
        box-shadow: 0 2px 4px rgba(0,0,0,0.1);
        background: #fff;
        margin: 0;
        padding: 10px 0;
    }

        .navbar .nav li .dropdown-menu li {
            margin: 0;
            padding: 0;
        }

            .navbar .nav li .dropdown-menu li a {
                padding: 4px 15px;
                font-size: 14px;
                color: #786E87;
                text-transform: none;
            }

                .navbar .nav li .dropdown-menu li a:hover, .navbar .nav li .dropdown-menu li a:focus, .navbar .nav li .dropdown-menu li a:active {
                    background: #786E87;
                    color: white;
                }

.personal-page-menu ul {
    list-style-type: none;
    padding: 0;
    margin: 0;
}

    .personal-page-menu ul li {
        margin-bottom: 0.3em;
    }

        .personal-page-menu ul li a {
            line-height: 1;
        }

            .personal-page-menu ul li a:hover, .personal-page-menu ul li a:focus, .personal-page-menu ul li a a, .personal-page-menu ul li a a:hover, .personal-page-menu ul li a a:focus {
                text-decoration: none;
            }

            .personal-page-menu ul li a:after {
                content: '\f054';
                font-family: FontAwesome;
                font-size: 13px;
                padding-left: 0.5em;
            }

.mobile-menu-button {
    text-align: center;
    cursor: pointer;
    padding: 20px 0;
    font-size: 16px;
    background: #786E87;
    display: block;
    margin-top: 15px;
    color: #fff;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}

    .mobile-menu-button:hover, .mobile-menu-button:focus, .mobile-menu-button a, .mobile-menu-button a:hover, .mobile-menu-button a:focus {
        text-decoration: none;
    }

    .mobile-menu-button:hover, .mobile-menu-button:focus {
        color: #fff;
    }

@media (max-width: 991px) {
    .mobile-menu-button {
        float: none;
        width: auto;
        display: inline-block !important;
        margin: 0 auto;
        clear: both;
        text-align: center;
        padding: 10px;
        background-color: white;
        color: #786E87;
        margin-bottom: 15px;
    }
}

.mobile-side-menu {
    text-align: left;
    padding: 35px;
    font-family: "Open Sans","Arial",sans-serif;
    position: fixed;
    height: 100%;
    right: 0;
    bottom: -100%;
    z-index: 10000;
    background: #786E87;
    width: 100%;
    overflow-y: auto;
    -webkit-box-shadow: 0px 1px 3px rgba(0,0,0,0.1);
    -moz-box-shadow: 0px 1px 3px rgba(0,0,0,0.1);
    box-shadow: 0px 1px 3px rgba(0,0,0,0.1);
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}

    .mobile-side-menu .close-mobile-side-menu {
        display: block;
        margin: -35px -35px 10px;
        background: #D3CBBF;
        padding: 20px;
        text-transform: uppercase;
        color: #786E87;
        border-bottom: 1px solid #000;
        border-color: rgba(255,255,255,0.2);
        cursor: pointer;
        -webkit-transition: all 0.5s;
        -moz-transition: all 0.5s;
        -o-transition: all 0.5s;
        transition: all 0.5s;
    }

        .mobile-side-menu .close-mobile-side-menu i {
            border: 1px solid #fff;
            border-color: #786E87;
            padding: 9px 10px;
            text-align: center;
            min-width: 25px;
            min-height: 20px;
            margin-right: 8px;
            -webkit-border-radius: 25px;
            -moz-border-radius: 25px;
            -ms-border-radius: 25px;
            -o-border-radius: 25px;
            border-radius: 25px;
            -webkit-transition: all 0.5s;
            -moz-transition: all 0.5s;
            -o-transition: all 0.5s;
            transition: all 0.5s;
        }

        .mobile-side-menu .close-mobile-side-menu:hover, .mobile-side-menu .close-mobile-side-menu:focus {
            color: #5c5c5c;
            text-decoration: none;
        }

            .mobile-side-menu .close-mobile-side-menu:hover i, .mobile-side-menu .close-mobile-side-menu:focus i {
                color: #fff;
                background: #5c5c5c;
                border-color: #434343;
                margin-right: 15px;
            }

    .mobile-side-menu .mobile-nav-logo {
        margin-left: -10px;
        display: block;
        padding: 10px 0;
    }

        .mobile-side-menu .mobile-nav-logo img {
            max-width: 60%;
        }

    .mobile-side-menu.active {
        bottom: 0px;
    }

    .mobile-side-menu .social {
        float: none !important;
        margin: 15px 0;
    }

        .mobile-side-menu .social ul.socialmedia-list {
            margin-left: -20px;
        }

            .mobile-side-menu .social ul.socialmedia-list li a {
                margin-left: 2px;
                background: #444;
                width: 30px;
                height: 30px;
            }

                .mobile-side-menu .social ul.socialmedia-list li a i {
                    padding: 5px 0;
                }

            .mobile-side-menu .social ul.socialmedia-list li span {
                display: none;
            }

    .mobile-side-menu ul.menu {
        margin: 0px -35px 0;
        padding: 0;
        list-style-type: none;
    }

        .mobile-side-menu ul.menu li {
            padding: 0;
        }

            .mobile-side-menu ul.menu li a {
                color: white;
                padding: 10px 25px;
                display: block;
                text-transform: uppercase;
                font-size: 12px;
                border-bottom: 1px solid #fff;
                border-color: rgba(255,255,255,0.1);
                -webkit-transition: all 0.5s;
                -moz-transition: all 0.5s;
                -o-transition: all 0.5s;
                transition: all 0.5s;
            }

                .mobile-side-menu ul.menu li a:hover, .mobile-side-menu ul.menu li a:focus {
                    text-decoration: none;
                    color: #fff;
                    border-color: #786E87;
                }

            .mobile-side-menu ul.menu li.current-menu-item:before, .mobile-side-menu ul.menu li:hover:before {
                border-color: #5c5c5c;
            }

    .mobile-side-menu ul.sub-menu {
        padding: 0px;
        margin: 0px;
        list-style-type: none;
    }

        .mobile-side-menu ul.sub-menu li {
            padding: 0px 0px 0px 10px;
            border: 0px;
            margin: 0px;
        }

            .mobile-side-menu ul.sub-menu li:before {
                display: none;
            }

            .mobile-side-menu ul.sub-menu li a {
                font-size: 11px;
                margin: 0px 0px 0px -9px;
                padding: 7px 35px;
            }

html, body {
    padding: 0;
    margin: 0;
    line-height: 1.4;
    font-family: "Open Sans","Arial",sans-serif;
    font-size: 16px;
    color: #5c5c5c;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flexbox;
    display: -ms-flex;
    display: flex;
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    min-height: 100vh;
}

    html #wrap, body #wrap {
        display: block;
        margin: 0;
        padding: 0;
        -webkit-flex: 1;
        -moz-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }

.panel-group #search-form {
    float: left;
}

@media (max-width: 1024px) {
    .panel-group #search-form input, .panel-group #search-form select, .panel-group #search-form button {
        border: 2px solid #786E87;
    }
}

.form-bg.content-page {
    position: relative;
    z-index: 20;
    text-align: center;
    display: table;
    margin: 0 auto;
    background-color: white;
}

    .form-bg.content-page #mobile-unit-tooltip {
        color: #786E87;
    }

    .form-bg.content-page #unit-tooltip {
        top: 23%;
    }

    .form-bg.content-page .second-hand {
        margin-top: 5px;
        float: right;
        clear: both;
    }

        .form-bg.content-page .second-hand label {
            color: #786E87;
        }

.form-bg .border-wrap {
    border: 4px solid #786E87;
    float: left;
}

.page-intro {
    min-height: 550px;
    position: relative;
    width: 100%;
    top: 0;
    left: 0;
    right: 0;
    background-position: bottom left;
    background-repeat: no-repeat;
    background-size: cover;
}

    .page-intro.sub-page {
        min-height: 164px;
    }

    .page-intro.sub {
        min-height: auto;
        position: static;
    }

        .page-intro.sub:before {
            display: none;
        }

        .page-intro.sub .page-intro__content {
            position: static;
            top: 0;
        }

    .page-intro:before {
        content: "";
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        background-color: rgba(0,0,0,0.33);
    }

    .page-intro .form-bg {
        position: relative;
        z-index: 20;
        text-align: center;
        display: table;
        margin: 0 auto;
        border: 4px solid #786E87;
        background-color: white;
    }

@media (max-width: 1024px) {
    .page-intro .form-bg {
        background-color: transparent;
        border: none;
    }
}

.page-intro .second-hand {
    text-align: center;
}

.page-intro .book-search ::-webkit-input-placeholder {
    color: #786E87;
}

.page-intro .book-search ::-moz-placeholder {
    color: #786E87;
}

.page-intro .book-search :-ms-input-placeholder {
    color: #786E87;
}

.page-intro .book-search :-moz-placeholder {
    color: #786E87;
}

.page-intro .book-search input[type="text"] {
    background: transparent;
    border: none;
    padding: 15px;
    height: 57px;
    float: left;
    color: black;
}

.page-intro .book-search select {
    background: transparent;
    border: none;
    padding: 15px;
    height: 57px;
    float: left;
    color: #786E87;
}

.page-intro .book-search .submit {
    float: left;
    display: block;
    line-height: 57px;
    width: 57px;
    text-align: center;
    background: transparent;
    cursor: pointer;
    border: 0;
    height: 57px;
    color: #786E87;
}

.page-intro .page-intro__content {
    position: relative;
    z-index: 10;
    top: 137.5px;
}

@media (max-width: 1024px) {
    .page-intro .page-intro__content {
        top: 20px;
        margin: 0 15px;
    }

        .page-intro .page-intro__content h1 {
            margin: 0 !important;
            padding-bottom: 20px;
            font-size: 23px !important;
        }

        .page-intro .page-intro__content #search-form {
            background-color: transparent;
            border: none;
        }

            .page-intro .page-intro__content #search-form input[type="text"] {
                width: 100%;
                background-color: white;
                margin-bottom: 10px;
            }

            .page-intro .page-intro__content #search-form select {
                width: 100%;
                background-color: white;
                margin-bottom: 10px;
            }

            .page-intro .page-intro__content #search-form .submit {
                width: 57px;
                margin-bottom: 10px;
                background-color: white;
                float: right;
            }
}

.page-intro .page-intro__content.sub-page h1, .page-intro .page-intro__content.sub-page h2, .page-intro .page-intro__content.sub-page h3, .page-intro .page-intro__content.sub-page h4, .page-intro .page-intro__content.sub-page h5, .page-intro .page-intro__content.sub-page h6, .page-intro .page-intro__content.sub-page p, .page-intro .page-intro__content.sub-page a, .page-intro .page-intro__content.sub-page span, .page-intro .page-intro__content.sub-page div, .page-intro .page-intro__content.sub-page small, .page-intro .page-intro__content.sub-page big, .page-intro .page-intro__content.sub-page blockquote {
    text-align: center;
}

.page-intro .page-intro__content h1, .page-intro .page-intro__content h2, .page-intro .page-intro__content h3, .page-intro .page-intro__content h4, .page-intro .page-intro__content h5, .page-intro .page-intro__content h6, .page-intro .page-intro__content p, .page-intro .page-intro__content a, .page-intro .page-intro__content span, .page-intro .page-intro__content div, .page-intro .page-intro__content small, .page-intro .page-intro__content big, .page-intro .page-intro__content blockquote {
    color: white;
}

.page-intro .page-intro__content h1 {
    margin-top: 60px;
    font-size: 42px;
}

.header-section {
    padding: 30px 0 0;
}

    .header-section .logo {
        display: inline-block;
        margin-bottom: 15px;
    }

@media (max-width: 1024px) {
    .header-section .logo {
        float: none;
        display: block;
        width: 100%;
        text-align: center;
        margin-top: 20px;
    }

        .header-section .logo a img {
            margin: 0 auto;
        }
}

.gallery .gallery-caption {
    display: none;
}

.fr-touch-close {
    right: 14px !important;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2), not all {
    .fr-window-fresco .fr-side-button-icon, .fr-window-fresco .fr-close-icon, .fr-window-fresco .fr-touch-close .fr-touch-button-icon, .fr-window-fresco .fr-touch-caption-more .fr-touch-button-icon, .fr-window-fresco .fr-side-button-icon {
        background-image: url(skins/fresco/sprite.png) !important;
        background-size: 500px 500px;
    }
}

.fr-touch-caption-text-wrapper {
    overflow: visible !important;
    height: auto !important;
}

.fr-box-wrapper, .fr-ui-wrapper, .fr-ui-toggle {
    -webkit-opacity: 1 !important;
    -moz-opacity: 1 !important;
    opacity: 1 !important;
    display: block !important;
}

.fr-box-wrapper, .fr-ui-wrapper {
    overflow: visible !important;
}

.fr-info {
    top: 100% !important;
}

.fr-caption {
    font-size: 15px !important;
}

.breadcrumbs {
    position: relative;
    padding: 12px 0 1.2em;
}

    .breadcrumbs a {
        color: #5c5c5c;
    }

    .breadcrumbs span.delimiter {
        display: inline-block;
        padding: 0 5px;
    }

.body-section {
    padding: 30px 0;
}

    .body-section.home {
        padding: 30px 0 30px 0;
    }

.disclaimer-shortcode-text, .important-notes-inner p {
    font-size: 14px;
    line-height: 1.1;
    display: inline-block;
}

.custom-col-md-5 {
    min-height: 1px;
    position: relative;
    display: block;
    float: left;
    margin-left: 15px;
    margin-right: 15px;
    width: calc(20% - 30px);
}

@media (max-width: 991px) {
    .custom-col-md-5 {
        width: calc(100% - 30px);
    }
}

#gallery-3 {
    text-align: center;
}

    #gallery-3 br {
        display: none;
    }

    #gallery-3 dl.gallery-item {
        width: 10%;
        float: none;
        display: inline-block;
    }

        #gallery-3 dl.gallery-item a img {
            width: 100px;
        }

.general-sidebar .widget {
    border-bottom: 1px solid #ddd;
    margin-bottom: 15px;
    padding-bottom: 15px;
}

    .general-sidebar .widget h3 {
        font-family: "Open Sans","Arial",sans-serif;
        font-size: 14px;
        color: #B2B2B2;
        line-height: 1.4;
        font-weight: normal;
        text-transform: uppercase;
        letter-spacing: 0.1em;
        margin-bottom: 1em;
    }

        .general-sidebar .widget h3 a, .general-sidebar .widget h3a {
            color: #B2B2B2;
        }

            .general-sidebar .widget h3 a:hover, .general-sidebar .widget h3 a:focus, .general-sidebar .widget h3a:hover, .general-sidebar .widget h3a:focus {
                text-decoration: underline;
                color: #999;
            }

    .general-sidebar .widget ul {
        list-style-type: none;
        margin: 0;
        padding: 0;
    }

        .general-sidebar .widget ul ul {
            padding-left: 15px;
        }

        .general-sidebar .widget ul li {
            padding: 0;
            margin: 0;
        }

            .general-sidebar .widget ul li a {
                padding: 0.5em 0;
                display: block;
                -webkit-transition: all 0.5s;
                -moz-transition: all 0.5s;
                -o-transition: all 0.5s;
                transition: all 0.5s;
            }

    .general-sidebar .widget.widget_recent_entries ul li a, .general-sidebar .widget.widget_categories ul li a, .general-sidebar .widget.widget_archive ul li a {
        display: block;
        background: #e6e6e6;
        padding: 0.5em;
        margin-bottom: 2px;
        font-size: 13px;
    }

        .general-sidebar .widget.widget_recent_entries ul li a:hover, .general-sidebar .widget.widget_recent_entries ul li a:focus, .general-sidebar .widget.widget_recent_entries ul li a a, .general-sidebar .widget.widget_recent_entries ul li a a:hover, .general-sidebar .widget.widget_recent_entries ul li a a:focus, .general-sidebar .widget.widget_categories ul li a:hover, .general-sidebar .widget.widget_categories ul li a:focus, .general-sidebar .widget.widget_categories ul li a a, .general-sidebar .widget.widget_categories ul li a a:hover, .general-sidebar .widget.widget_categories ul li a a:focus, .general-sidebar .widget.widget_archive ul li a:hover, .general-sidebar .widget.widget_archive ul li a:focus, .general-sidebar .widget.widget_archive ul li a a, .general-sidebar .widget.widget_archive ul li a a:hover, .general-sidebar .widget.widget_archive ul li a a:focus {
            text-decoration: none;
        }

        .general-sidebar .widget.widget_recent_entries ul li a:hover, .general-sidebar .widget.widget_recent_entries ul li a:focus, .general-sidebar .widget.widget_recent_entries ul li a:active, .general-sidebar .widget.widget_categories ul li a:hover, .general-sidebar .widget.widget_categories ul li a:focus, .general-sidebar .widget.widget_categories ul li a:active, .general-sidebar .widget.widget_archive ul li a:hover, .general-sidebar .widget.widget_archive ul li a:focus, .general-sidebar .widget.widget_archive ul li a:active {
            background: #cdcdcd;
        }

.payment-link:hover, .payment-link:focus, .payment-link:active {
    text-decoration: none;
}

.payment-link img {
    text-decoration: none;
}

.footer-section {
    display: block;
}

    .footer-section .footer-content {
        text-align: center;
        font-size: 13px;
        color: black;
    }

@media (max-width: 1024px) {
    .footer-section .footer-content {
        margin: 15px 0;
    }
}

.footer-section .footer-content p, .footer-section .footer-content a {
    font-size: 13px;
    color: black;
}

.footer-section .footer-info {
    margin: 15px 0;
}

.footer-section .parent-logo {
    float: left;
}

    .footer-section .parent-logo img {
        height: 113px;
    }

@media (max-width: 1024px) {
    .footer-section .parent-logo {
        display: block;
        float: none;
        width: 100%;
    }

        .footer-section .parent-logo img {
            margin: 0 auto;
        }
}

.footer-section .payments-accepted {
    text-align: center;
    margin-top: 20px;
}

    .footer-section .payments-accepted img {
        height: 32px;
        margin: 0 10px;
    }

@media (max-width: 1024px) {
    .footer-section .payments-accepted img {
        display: inline-block;
    }
}

.footer-section h4 {
    font-family: "Open Sans","Arial",sans-serif;
    font-size: 22px;
    color: #fff;
    line-height: 1.4;
    font-weight: 400;
    text-transform: none;
    letter-spacing: 0;
    margin-bottom: 20px;
}

.footer-section p {
    color: #5c5c5c;
}

.footer-section a {
    color: #786E87;
}

.footer-section .footer-top {
    padding: 30px 0;
    background: #D3CBBF;
}

.footer-section .footer-bottom {
    background: #2a2a2a;
    padding: 30px 0;
}

    .footer-section .footer-bottom p {
        padding: 0;
        margin: 0;
        font-size: 0.750rem;
    }

    .footer-section .footer-bottom .copyright-info {
        border-top: 1px solid #5c5c5c;
        padding: 15px 0 3px;
    }

        .footer-section .footer-bottom .copyright-info p {
            display: inline-block;
        }

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    html #wrap, body #wrap {
        -webkit-flex: 1 0 auto;
        -moz-flex: 1 0 auto;
        -ms-flex: 1 0 auto;
        flex: 1 0 auto;
    }
}

@media (max-width: 991px) {
    img {
        display: block;
        max-width: 100%;
        height: auto;
    }

    html, body {
        min-height: 0;
        height: auto;
        display: block !important;
    }

        html #wrap, body #wrap {
            display: block !important;
        }
}

#wrap .search {
    float: right;
    display: inline-block;
    vertical-align: top;
    position: relative;
    width: 180px;
    min-width: 180px;
    padding-top: 1px;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}

@media (max-width: 1199px) {
    #wrap .search {
        width: 90px;
        min-width: 90px;
    }
}

@media (max-width: 767px) {
    #wrap .search {
        position: absolute;
        top: 2px;
        right: 5px;
    }
}

#wrap .search .form-control {
    height: 3em;
    width: 100%;
    -webkit-appearance: none !important;
    background: #e6e6e6;
    border-color: #ddd;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    -ms-border-radius: 30px;
    -o-border-radius: 30px;
    border-radius: 30px;
}

    #wrap .search .form-control input {
        -webkit-appearance: none;
        border-radius: 0;
    }

#wrap .search .btn {
    position: absolute;
    top: 0;
    right: 0;
    font-size: 14px;
    padding: 11px 15px;
    color: #828282;
    background: transparent;
    border: 0;
    min-width: 0px;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    -ms-border-radius: 30px;
    -o-border-radius: 30px;
    border-radius: 30px;
}

    #wrap .search .btn:hover, #wrap .search .btn:focus, #wrap .search .btn:active {
        outline: 0 none;
        background: #e6e6e6;
        color: #fff;
        -webkit-box-shadow: 0 0 0 transparent;
        -moz-box-shadow: 0 0 0 transparent;
        box-shadow: 0 0 0 transparent;
    }

@media (max-width: 1199px) {
    #wrap .search .btn {
        display: none;
    }
}

#wrap .hero_image .search {
    display: block;
    width: 100%;
    float: none;
}

@media (max-width: 767px) {
    #wrap .hero_image .search {
        position: static;
    }
}

#wrap .hero_image .search .input-group {
    display: block;
}

    #wrap .hero_image .search .input-group span.input-group-btn {
        position: absolute;
        top: 0;
        right: 0;
    }

    #wrap .hero_image .search .input-group input {
        color: #5c5c5c;
    }

#wrap .contact-us-faq-section .search {
    float: none;
    width: 100%;
    min-width: 0;
}

@media (max-width: 991px) {
    #wrap .contact-us-faq-section .search {
        width: calc(100% - 10px);
    }
}

#wrap .contact-us-faq-section .search .input-group {
    display: block;
}

    #wrap .contact-us-faq-section .search .input-group span.input-group-btn {
        position: absolute;
        top: 0;
        right: 0;
    }

    #wrap .contact-us-faq-section .search .input-group input.form-control.search-input {
        background-color: #fff;
    }

#wrap .no-seach-results-search-container {
    margin-top: -2em;
    margin-bottom: 3em;
}

    #wrap .no-seach-results-search-container .search {
        float: none;
        width: 70%;
        min-width: 70%;
    }

        #wrap .no-seach-results-search-container .search .input-group {
            display: block;
        }

#wrap .search ::-webkit-input-placeholder {
    color: #5c5c5c;
}

#wrap .search :-moz-placeholder {
    color: #5c5c5c;
    opacity: 1;
}

#wrap .search ::-moz-placeholder {
    color: #5c5c5c;
    opacity: 1;
}

#wrap .search :-ms-input-placeholder {
    color: #5c5c5c;
}

#wrap .search [type="search"] {
    -moz-appearance: textfield;
    -webkit-appearance: textfield;
    appearance: textfield;
}

#wrap .search textarea:focus, #wrap .search input[type="text"]:focus, #wrap .search input[type="password"]:focus, #wrap .search input[type="datetime"]:focus, #wrap .search input[type="datetime-local"]:focus, #wrap .search input[type="date"]:focus, #wrap .search input[type="month"]:focus, #wrap .search input[type="time"]:focus, #wrap .search input[type="week"]:focus, #wrap .search input[type="number"]:focus, #wrap .search input[type="email"]:focus, #wrap .search input[type="url"]:focus, #wrap .search input[type="search"]:focus, #wrap .search input[type="tel"]:focus, #wrap .search input[type="color"]:focus, #wrap .search .uneditable-input:focus {
    border-color: #d2d2d2;
    outline: 0 none;
    -webkit-box-shadow: 0 0 0 transparent;
    -moz-box-shadow: 0 0 0 transparent;
    box-shadow: 0 0 0 transparent;
}

.search-page div[class^="post-"] h2 {
    font-size: 23px;
}

    .search-page div[class^="post-"] h2 a {
        color: #5c5c5c;
    }

.header-section {
    position: relative;
    z-index: 9999;
}

    .header-section .container {
        display: -webkit-flex;
        display: -moz-flex;
        display: -ms-flexbox;
        display: -ms-flex;
        display: flex;
        -webkit-align-items: center;
        -moz-align-items: center;
        -ms-align-items: center;
        align-items: center;
    }

@media (max-width: 1024px) {
    .header-section .container {
        display: block;
        text-align: center;
    }
}

.header-section .logo {
    float: left;
}

.header-section .social .socialmedia-list .item a {
    background-color: transparent;
}

    .header-section .social .socialmedia-list .item a i {
        font-size: 30px;
    }

.navigation-section {
    font-size: 15px;
    float: left;
    margin: 0 30px;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flexbox;
    display: -ms-flex;
    display: flex;
    -webkit-flex-grow: 1;
    -moz-flex-grow: 1;
    -ms-flex-grow: 1;
    flex-grow: 1;
}

@media (max-width: 1024px) {
    .navigation-section {
        display: table;
        margin: 0 auto;
        float: none;
    }
}

.fourofour {
    text-align: center;
    margin: 100px auto auto auto;
}

    .fourofour h1 {
        font-size: 50px;
        line-height: 1;
        color: #434343;
    }

@media (max-width: 767px) {
    .fourofour h1 {
        font-size: 50px;
    }
}

.fourofour p {
    font-size: 15px;
    color: #5c5c5c;
}

.fourofour a {
    font-size: 15px;
}

#wrap .fourofour .search {
    width: 100%;
}

    #wrap .fourofour .search .input-group {
        display: block;
    }

#unit-tooltip {
    background: #786E87;
    position: absolute;
    width: 20px;
    top: 33%;
    height: 20px;
    border-radius: 50%;
}

@media (max-width: 1024px) {
    #unit-tooltip {
        visibility: hidden !important;
    }
}

#mobile-unit-tooltip {
    display: none;
    float: left;
    font-size: 14px;
}

@media (max-width: 1024px) {
    #mobile-unit-tooltip {
        display: block;
    }
}

.tooltip .tooltip-inner {
    padding: 10px 8px !important;
}

.tooltip hr {
    color: #333;
    border-top: 1px solid;
    margin: 6px 0px;
}

.tooltip small {
    font-size: 11px;
}

.tooltip a {
    display: block;
    margin-top: 6px;
}

@media (max-width: 1024px) {
    .call-to-actions .action {
        margin-top: 10px;
    }
}

.call-to-actions .action .button-container {
    display: block;
    position: relative;
}

.call-to-actions .action a.title {
    display: block;
    text-align: center;
    text-decoration: none;
    color: black;
    text-transform: lowercase;
    font-weight: bold;
    font-size: 22px;
    padding: 0 0 10px 0;
}

@media (max-width: 1024px) {
    .call-to-actions .action a.title {
        font-size: 18px;
    }
}

.call-to-actions .action a.button {
    color: white;
    position: absolute;
    top: 33%;
    background: rgba(120,110,135,0.85);
    text-align: center;
    width: 100%;
    text-transform: lowercase;
    padding: 11px 0;
    min-height: 45px;
    font-size: 18px;
    text-decoration: none;
}

.call-to-actions .action img {
    width: 100%;
}

.call-to-actions .action p {
    text-align: center;
    font-size: 13px;
}

.latest-blog-posts {
    margin-bottom: 3em;
}

    .latest-blog-posts > .container > .row {
        display: -webkit-flex;
        display: -moz-flex;
        display: -ms-flexbox;
        display: -ms-flex;
        display: flex;
        -webkit-align-items: stretch;
        -moz-align-items: stretch;
        -ms-align-items: stretch;
        align-items: stretch;
        -webkit-justify-content: center;
        -moz-justify-content: center;
        -ms-justify-content: center;
        justify-content: center;
        -webkit-align-content: center;
        -moz-align-content: center;
        -ms-align-content: center;
        align-content: center;
    }

@media (max-width: 767px) {
    .latest-blog-posts > .container > .row {
        -webkit-flex-wrap: wrap;
        -moz-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }
}

.latest-blog-posts > .container > .row .latest-blog-post {
    display: block;
    padding: 0;
    background: #e6e6e6;
    border-right: 15px solid #fff;
    border-left: 15px solid #fff;
    text-align: center;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}

    .latest-blog-posts > .container > .row .latest-blog-post:hover, .latest-blog-posts > .container > .row .latest-blog-post:focus, .latest-blog-posts > .container > .row .latest-blog-post a, .latest-blog-posts > .container > .row .latest-blog-post a:hover, .latest-blog-posts > .container > .row .latest-blog-post a:focus {
        text-decoration: none;
    }

@media (max-width: 767px) {
    .latest-blog-posts > .container > .row .latest-blog-post {
        margin-left: -1px;
        margin-bottom: 2em;
    }
}

@media (max-width: 767px) {
    .latest-blog-posts > .container > .row .latest-blog-post {
        margin-bottom: 1em;
    }

        .latest-blog-posts > .container > .row .latest-blog-post img {
            max-width: none;
            width: 100%;
        }
}

.latest-blog-posts > .container > .row .latest-blog-post:hover, .latest-blog-posts > .container > .row .latest-blog-post:focus, .latest-blog-posts > .container > .row .latest-blog-post:active {
    background: #e6e6e6;
}

.latest-blog-posts > .container > .row .latest-blog-post .content {
    display: block;
    padding: 1.5em 2em 2em;
    color: #fff;
}

    .latest-blog-posts > .container > .row .latest-blog-post .content .title {
        font-family: "Open Sans","Arial",sans-serif;
        font-size: 22px;
        color: #5c5c5c;
        line-height: 1.2;
        font-weight: 400;
        text-transform: none;
        letter-spacing: 0;
        margin-bottom: 0.5em;
        color: #fff;
        display: block;
    }

        .latest-blog-posts > .container > .row .latest-blog-post .content .title a, .latest-blog-posts > .container > .row .latest-blog-post .content .titlea {
            color: #786E87;
        }

            .latest-blog-posts > .container > .row .latest-blog-post .content .title a:hover, .latest-blog-posts > .container > .row .latest-blog-post .content .title a:focus, .latest-blog-posts > .container > .row .latest-blog-post .content .titlea:hover, .latest-blog-posts > .container > .row .latest-blog-post .content .titlea:focus {
                text-decoration: underline;
                color: #5f576b;
            }

.latest-news-container p {
    margin: 0;
    padding: 0;
}

    .latest-news-container p.title {
        font-family: "Open Sans","Arial",sans-serif;
        color: #fff;
        text-transform: uppercase;
        padding: 0;
        margin: 0;
    }

        .latest-news-container p.title a {
            color: #fff;
        }

            .latest-news-container p.title a:hover, .latest-news-container p.title a:focus, .latest-news-container p.title a:active {
                text-decoration: none;
            }

.latest-news-container .latest-news-container-inner + .latest-news-container-inner {
    padding-top: 10px;
    margin-top: 10px;
    border-top: 1px dotted rgba(255,255,255,0.3);
}

.recent-blog-posts:hover, .recent-blog-posts:focus, .recent-blog-posts a, .recent-blog-posts a:hover, .recent-blog-posts a:focus {
    text-decoration: none;
}

.recent-blog-posts a {
    color: #786E87;
}

.blog-headings h1 a {
    color: #786E87;
}

.blog-container {
    padding-right: 45px;
    margin-bottom: 30px;
}

    .blog-container .blog-publish-details {
        margin-bottom: 8px;
    }

        .blog-container .blog-publish-details .date {
            text-transform: uppercase;
            color: #5c5c5c;
            font-size: 12px;
            font-weight: normal;
            margin-top: 8px;
            display: block;
        }

        .blog-container .blog-publish-details .author {
            color: #5c5c5c;
            font-size: 12px;
        }

        .blog-container .blog-publish-details a {
            font-weight: normal;
            text-decoration: none;
            color: #5c5c5c;
        }

    .blog-container .post, .blog-container .page {
        border-bottom: 1px solid #ddd;
        padding-bottom: 8px;
    }

    .blog-container .blog-content .image-thumb-loop {
        float: right;
        display: inline;
    }

    .blog-container .image-thumb-loop {
        margin-bottom: 9px;
        display: inline-block;
        float: right;
        width: auto;
    }

        .blog-container .image-thumb-loop.floating {
            padding: 0 0 15px 15px;
        }

        .blog-container .image-thumb-loop.no-float {
            padding: 0;
            float: none;
            display: block;
        }

@media (max-width: 767px) {
    .blog-container .image-thumb-loop {
        float: none;
        padding: 0;
        display: block;
    }
}

.blog-container .image-thumb-loop img {
    width: auto;
}

.single-post .blog-container .post, .single-post .blog-container .page {
    border-bottom: 0;
}

.pagination {
    text-transform: uppercase;
    font-weight: normal;
}

    .pagination span.current {
        color: #786E87;
        padding: 0 3px;
    }

    .pagination a {
        padding: 0 3px;
        color: #BEC5CA;
    }

        .pagination a:hover, .pagination a:focus, .pagination a a, .pagination a a:hover, .pagination a a:focus {
            text-decoration: none;
        }

.share-buttons ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

    .share-buttons ul li {
        display: inline-block;
    }

        .share-buttons ul li a {
            font-weight: normal;
            -webkit-transition: all 0.5s;
            -moz-transition: all 0.5s;
            -o-transition: all 0.5s;
            transition: all 0.5s;
        }

            .share-buttons ul li a:hover, .share-buttons ul li a:focus, .share-buttons ul li a a, .share-buttons ul li a a:hover, .share-buttons ul li a a:focus {
                text-decoration: none;
            }

.share-buttons .top-share-buttons {
    margin-top: 25px;
    margin-bottom: 15px;
}

    .share-buttons .top-share-buttons ul li a {
        padding: 5px 20px;
        border: 1px solid #ddd;
        display: block;
        font-size: 12px;
        color: #5c5c5c;
        -webkit-border-radius: 4px;
        -moz-border-radius: 4px;
        -ms-border-radius: 4px;
        -o-border-radius: 4px;
        border-radius: 4px;
    }

        .share-buttons .top-share-buttons ul li a i {
            padding-right: 5px;
            font-size: 15px;
        }

        .share-buttons .top-share-buttons ul li a:hover, .share-buttons .top-share-buttons ul li a:focus {
            background: #5c5c5c;
            color: #fff;
            border-color: #ddd;
        }

.share-buttons .bottom-share-buttons {
    margin: 10px 0;
}

    .share-buttons .bottom-share-buttons ul li + li {
        padding-left: 25px;
    }

    .share-buttons .bottom-share-buttons ul li a {
        display: block;
        text-transform: uppercase;
        font-size: 12px;
        color: #929ea6;
    }

        .share-buttons .bottom-share-buttons ul li a i {
            color: #5C6E7B;
            padding-right: 6px;
            font-size: 15px;
            vertical-align: top;
        }

.maintenance-icon {
    text-align: center;
    display: block;
    font-size: 150px;
    color: #bbbaba;
}

.panel-group {
    margin-top: 30px;
}

    .panel-group h4.panel-title {
        display: block;
        background: #efeded;
        border: 1px solid #ddd;
    }

        .panel-group h4.panel-title a.accordion-toggle {
            display: block;
            font-size: 17px;
            padding: 10px;
            position: relative;
            padding-right: 40px;
            text-decoration: none;
        }

            .panel-group h4.panel-title a.accordion-toggle:hover, .panel-group h4.panel-title a.accordion-toggle:focus, .panel-group h4.panel-title a.accordion-toggle:active {
                text-decoration: none;
            }

@media (max-width: 991px) {
    .panel-group h4.panel-title a.accordion-toggle {
        font-size: 14px;
    }
}

.panel-group h4.panel-title a.accordion-toggle.collapsed:after {
    content: "\f078";
    font-family: FontAwesome;
    float: right;
    margin: 0 6px;
    position: absolute;
    right: 10px;
    top: 10px;
}

.panel-group h4.panel-title a.accordion-toggle:after {
    content: "\f077";
    font-family: FontAwesome;
    float: right;
    margin: 0 6px;
    position: absolute;
    right: 10px;
    top: 10px;
}