/* ===========================================================
                                                              
          MASTER FRONTEND SASS (2019) - MSD HATCHPLAN THEME                    

=========================================================== */
/* ---- SHARED VARIABLES ---- */
/* ===========================================================

	$VARIABLES (v2 2018)

=========================================================== */
/* ================ MEDIA QUERY BREAK-POINTS ================ */
/* INFO: Set the breakpoints for media queries. Can either used fixed pixel widths or scaleable EM widths  */
/* ---- Fixed screen sizes ---- */
/* INFO: Sets a primary width, then min/max values so breakpoints are clearly defined. Min is usually set to the primary value */
/* ---- Scaleable break-points ---- */
/* 320px */
/* 480px */
/* 640px */
/* 768px */
/* 960px */
/* 1024px */
/* 1280px */
/* 1440px */
/* 1600px */
/* ======== SPACING & MARGINS ========*/
/* ---- Margins ---- */
/* ---- Block Minimum Heights ---- */
/* ================ BORDERS ================ */
/* INFO: All border style rules to go here. Set several options then a primary value which used most */
/* ================ OPACITY ================ */
/* INFO: Commonly used opacity values. IE versions set in case of <IE9 */
/* IE Opacity */
/* ================ TRANSITIONS ================ */
/* INFO: Consistent transition times. Several options then the primary */
/* ---- THEMES (include one only) ---- */
/* ===========================================================
                                                              
          MSD HATCHPLAN THEME SASS (2019)                   

=========================================================== */
/* ===========================================================

	MSD HATCHPLAN COLOURS (2019)

=========================================================== */
/* INFO: Include generic MSD colour library */
/* ===========================================================

	MSD HATCHPLAN COLOUR LIBRARY (2019)

    // INFO: A basic colour library for generic colours (Non brand/element-specific, see helpers/colours.scss for those)

=========================================================== */
/* ---- COLOUR VALUES ---- */
/* INFO: A basic colour library, use these as a backup palette to the main brand colours */
/* WHITE */
/* BLACK */
/* GREY */
/* RUBY */
/* RED */
/* ORANGE */
/* AMBER */
/* YELLOW */
/* SAND */
/* GREEN */
/* TEAL */
/* BLUE */
/* ---- MSD BRAND COLOURS ---- */
/* INFO: So you can easily set the corporate brand colour palette for easy use. Use colours from the previously defined colour library */
/* ---- BRAVECTO COLOURS ---- */
/* ---- HATCHPLAN COLOURS ---- */
/* ---- CONDITION COLOURS ---- */
/* ---- BASE COLOURS ---- */
/* INFO: Sets the most used colours on the website, makes changing the colour theme easy (try to use these where possible instead of set colours, also try to set to brand colour values) */
/* ---- LINK COLOURS ---- */
/* INFO: Set the hyperlink styles, usually one primary and one alt style (alt style tends to be used when the background colour is different) */
/* ---- BUTTON COLOURS  ---- */
/* INFO: Button style themes, its a good idea to have at least two themes. Set the bkg colour, text colour and hover-state */
/* ---- ICON COLOURS ---- */
/* ---- SOCIAL MEDIA COLOURS ---- */
/* ===========================================================

	MSD HATCHPLAN VARIABLES (2019)

=========================================================== */
/* ======== SPACING & MARGINS ========*/
/* ---- Margins ---- */
/* ================ BORDERS ================ */
/* INFO: All border style rules to go here. Set several options then a primary value which used most */
/* ================ LISTS ================ */
/* INFO: Standard list indent margin width */
/* ================ FONT SIZES (Calculated) ================ */
/* - Perfect Fifth 1.33, Perfect Forth = 1.25, perfect Third = 1.2 */
/* -------- STATIC FONT SIZES -------- */
/* INFO: Strongly defined font sizes based on pixel size - easier to fit with client requests */
/* ================ FONT TYPES  ================ */
/* INFO: To set a small list of font-families to keep fonts consistent */
/* -------- FONT SETS -------- */
/* ---- ICON FONT SETS ---- */
/* ===========================================================

	$MIXINS (v2 2018)

=========================================================== */
/* ======== COLOURS ======== */
/* ---- LINK COLOUR ---- */
/* ---- INCREMENT COLOUR LIGHTNESS OF CHILD ELEMENTS ---- */
/* ======== GRADIENTS ======== */
/* ---- 2 COLOUR GRADIENT ---- */
/* ---- 3 COLOUR GRADIENT ---- */
/* ======== MASKS ======== */
/* ---- GRADIENT MASK ---- */
/* ---- LUMINANCE MASK (image) ---- */
/* ======== SHADOWS ======== */
/* ======== TEXT COLUMNS  ======== */
/* ======== TRANSITIONS ======== */
/* ======== TRANSFORMS ======== */
/* ---- Prefix Transform (When using prefixed transitions in conjunction with transforms - Safari < 8) ---- */
/* ---- 2D Translate ---- */
/* ---- 3D Translate ---- */
/* ---- Centralize Element (Must be inside block element set to position:relative) ---- */
/* ---- Center vertically and/or horizontally an absolute positioned element ----*/
/* ---- VIEWPORT IMAGE (Must be inside a relatively positioned element) ---- */
/* ---- 2D Scale ---- */
/* ---- 2D Translate & Scale ---- */
/* ---- 3D Scale ---- */
/* ---- Rotate ---- */
/* ---- Skew ---- */
/* ======== ANIMATION ======== */
/* ======== FLEXBOX PROPERTY SETS  ========= */
/* ---- Set on container element ---- */
/* 'Row' (horizontal) or 'Column' (vertical) */
/* How elements are aligned along the main-axis (similar to text-align): 'flex-start', 'flex-end', 'center', 'space-between', 'space-around' */
/* How extra space is handled along the cross-axis: 'flex-start', 'flex-end', 'center', 'stretch', 'baseline' */
/* How extra space is handlded between lines of content when there is extra space on cross-axis: 'flex-start', 'flex-end', 'center', 'stretch', 'space-between', 'space-around' */
/* Should the flexitems wrap? 'nowrap'(default), 'wrap','wrap-reverse' */
/* ---- Set on element ---- */
/* Shorthand for 'flex-grow', 'flex-shrink' & 'flex-basis'. Examples: '1 1 auto' or '2 1 50%'  */
/* ======== USER SELECT ======== */
/* ======== INPUT MODIFIERS ======== */
/* ==== INCREMENTERS ==== */
/* ---- INCREMENT SECTION TOP PADDING ---- */
/* ---- INCREMENT FIXED TOP POSITION ---- */
/* ===========================================================

	$SYMBOLS (v2 2018)

=========================================================== */
/* ======== ARROWS (Triangles) ======== */
/* ---- DOWN ARROW ---- */
/* ======== CROSSES ======== */
/* ---- CLOSE CROSS ---- */
/* ---- PLUS CROSS ---- */
/* ======== CHEVRONS ======== */
/* ---- CHEVRON ---- */
/* ======== BURGER MENU ======== */
/* ======== TRIPLE DOTS MENU ======== */
/* ---- VERTICAL ALIGNMENT ---- */
/* ---- HORIZONTAL ALIGNMENT ---- */
/* ===========================================================

	$RESET (v2 2018)

=========================================================== */
@font-face {
    font-display: swap;
    font-family: 'Invention';
    font-style: normal;
    font-weight: 300;
    src: url("/assets/fonts/Invention/Invention_W_Rg.eot");
    /* IE9 Compat Modes */
    src: url("/assets/fonts/Invention/Invention_W_Rg.eot?#iefix") format("embedded-opentype"), url("/assets/fonts/Invention/Invention_W_Rg.woff2") format("woff2"), url("/assets/fonts/Invention/Invention_W_Rg.woff") format("woff");
}

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
form, label,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video, button {
    border: 0;
    font: inherit;
    list-style: none;
    margin: 0;
    padding: 0;
    text-decoration: none;
    vertical-align: baseline;
    font-family: 'Invention', sans-serif;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
    display: block;
}

* {
    box-sizing: border-box;
    outline: none;
}

BUTTON {
    background: none;
    border: none;
    cursor: pointer;
}

MARK {
    background: none;
}

SUB, SUP {
    text-decoration: none;
}

CODE {
    font-family: 'Invention', sans-serif;
    font-size: 1.1rem;
    color: #058C83;
}

    CODE SPAN {
        color: #414E54;
    }

    CODE EM {
        font-style: normal;
        color: #FBE122;
    }

    CODE MARK {
        background-color: transparent;
        font-style: normal;
        color: #0C2340;
    }

/* ===========================================================

	MSD HATCHPLAN OVERRIDES SASS (2019)

    NOTE: For overriding plugins such as telerik or bootstrap

=========================================================== */
/* ======== KENDO FORM ELEMENTS ======== */
/* ---- KENDO NUMERIC INPUT ---- */
BODY.theme .posting-group-controls--fixed .k-widget.k-numerictextbox INPUT {
    height: 32px !important;
    padding: 6px !important;
}

/* ---- KENDO DROPDOWN ---- */
BODY.theme .field .k-widget.k-dropdown {
    -webkit-box-flex: 1 1 auto;
    -webkit-flex: 1 1 auto;
    -moz-flex: 1 1 auto;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    width: auto !important;
    height: 48px;
    padding: 0;
    margin: 0;
    border: 1px solid #A1AEB4;
    border-radius: 6px;
    background-color: #FFF;
    font-family: 'Invention', sans-serif;
    ;
    font-size: 1.504rem;
    color: #1b1b1b;
    overflow: hidden;
}

    BODY.theme .field .k-widget.k-dropdown:focus {
        background-color: #e6e6e6;
    }

    BODY.theme .field .k-widget.k-dropdown:disabled {
        background: #d3d7e9;
        color: #768A98;
    }

BODY.theme .field LABEL.label--long.label--question + .k-widget.k-dropdown {
    -webkit-box-flex: 0 1 40%;
    -webkit-flex: 0 1 40%;
    -moz-flex: 0 1 40%;
    -ms-flex: 0 1 40%;
    flex: 0 1 40%;
}

BODY.theme .k-dropdown-wrap {
    padding: 10px 6px;
}

    BODY.theme .k-dropdown-wrap.k-state-default {
        background-color: transparent;
        border: none;
    }

BODY.theme UL.k-list LI.k-item,
BODY.theme .k-list-md .k-list-item,
BODY.theme .k-list-md .k-list-optionlabel {
    font-size: 1.28rem;
}

/* ---- KENDO DATEPICKER ---- */
BODY.theme .k-widget.k-timepicker,
BODY.theme .k-widget.k-datepicker {
    width: inherit;
}

BODY.theme .k-picker-wrap {
    border: none;
}

    BODY.theme .k-picker-wrap .k-input {
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
    }

BODY.theme .k-widget.k-timepicker .k-select,
BODY.theme .k-widget.k-datepicker .k-select {
    border-width: 1px 1px 1px 0;
    border-color: #A1AEB4;
    border-radius: 6px;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    background-color: transparent;
    font-family: 'Invention', sans-serif;
    ;
    font-size: 100%;
}

BODY.theme .k-calendar .k-header {
    font-size: 1.28rem;
    font-family: 'Invention', sans-serif;
    ;
}

    BODY.theme .k-calendar .k-header .k-calendar-nav-fast {
        font-size: 1.28rem;
    }

        BODY.theme .k-calendar .k-header .k-calendar-nav-fast.k-button-md {
            font-size: 1.28rem;
        }

BODY.theme .k-calendar .k-calendar-view {
    font-size: 1.28rem;
    font-family: 'Invention', sans-serif;
    ;
}

BODY.theme .k-calendar .k-calendar-footer,
BODY.theme .k-calendar .k-footer {
    font-size: 1.1rem;
    font-family: 'Invention', sans-serif;
    ;
}

    BODY.theme .k-calendar .k-calendar-footer .k-calendar-nav-today,
    BODY.theme .k-calendar .k-footer .k-calendar-nav-today {
        font-size: 1.1rem;
    }

        BODY.theme .k-calendar .k-calendar-footer .k-calendar-nav-today.k-button-md,
        BODY.theme .k-calendar .k-footer .k-calendar-nav-today.k-button-md {
            font-size: 1.1rem;
        }

/* ---- KENDO POPOUTS ---- */
.k-window-content.k-content .notes_content_limitinWindow {
    font-family: 'Invention', sans-serif;
    margin-top: 2px;
    margin-bottom: 6px;
}

.k-window-content.k-content .form-panel.form-panel--fieldsets {
    padding: 24px;
    margin-top: 12px;
    margin-bottom: 12px;
}

/* ---- KENDO TABSTRIPS --------------------------------------------------------------------------------------------------------------- */
BODY.theme .k-tabstrip-items {
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
}

BODY.theme .k-tabstrip-item.k-last {
    margin-right: 0 !important;
}

BODY.theme .k-tabstrip-top > .k-tabstrip-items-wrapper {
    border-bottom: 1px solid #d9d9d9;
}

BODY.theme #DashboardTabStrip .k-tabstrip-items .k-link {
    padding: 17px;
    font-size: 1.5rem;
}

BODY.theme .tab-panel--alt-0 .k-tabstrip-wrapper {
    -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.075);
    -moz-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.075);
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.075);
}

BODY.theme .tab-panel--alt-0 .k-tabstrip-top > .k-content {
    padding: 20px;
    border: none;
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
}

BODY.theme .tab-panel--alt-0 .k-tabstrip-top > .k-tabstrip-items .k-item {
    margin-right: 1rem;
}

BODY.theme .tab-panel--alt-0 .k-item.k-tabstrip-item {
    -webkit-box-flex: 1 1 auto;
    -webkit-flex: 1 1 auto;
    -moz-flex: 1 1 auto;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    border-width: 0;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    margin-left: 4px;
    background-color: #768A98;
    font-family: 'Invention', sans-serif;
    font-size: 1.28rem;
    color: #FFF;
    -webkit-transition: background-color 0.4s ease-out;
    -moz-transition: background-color 0.4s ease-out;
    -ms-transition: background-color 0.4s ease-out;
    -o-transition: background-color 0.4s ease-out;
    transition: background-color 0.4s ease-out;
}

    BODY.theme .tab-panel--alt-0 .k-item.k-tabstrip-item:hover {
        background-color: #5e707d;
    }

    BODY.theme .tab-panel--alt-0 .k-item.k-tabstrip-item.tab--disabled {
        background-color: #dadada;
    }

        BODY.theme .tab-panel--alt-0 .k-item.k-tabstrip-item.tab--disabled:hover {
            background-color: silver;
        }

        BODY.theme .tab-panel--alt-0 .k-item.k-tabstrip-item.tab--disabled:after {
            content: '\ea0e';
            display: inline-block;
            position: absolute;
            top: 4px;
            right: 8px;
            font-family: "IcoMoon Basic";
            color: rgba(65, 78, 84, 0.75);
        }

        BODY.theme .tab-panel--alt-0 .k-item.k-tabstrip-item.tab--disabled .k-link {
            color: rgba(65, 78, 84, 0.66);
        }

        BODY.theme .tab-panel--alt-0 .k-item.k-tabstrip-item.tab--disabled.k-active {
            background-color: rgba(236, 236, 236, 0.75);
        }

            BODY.theme .tab-panel--alt-0 .k-item.k-tabstrip-item.tab--disabled.k-active .k-link {
                color: #414E54;
            }

    BODY.theme .tab-panel--alt-0 .k-item.k-tabstrip-item.tab--errors {
        background-color: #FF2D55;
    }

        BODY.theme .tab-panel--alt-0 .k-item.k-tabstrip-item.tab--errors:hover {
            background-color: #f9002f;
        }

        BODY.theme .tab-panel--alt-0 .k-item.k-tabstrip-item.tab--errors:after {
            content: '\ea07';
            display: inline-block;
            position: absolute;
            top: 4px;
            right: 8px;
            font-family: "IcoMoon Basic";
            color: #FFF;
        }

        BODY.theme .tab-panel--alt-0 .k-item.k-tabstrip-item.tab--errors .k-link {
            color: #FFF;
        }

        BODY.theme .tab-panel--alt-0 .k-item.k-tabstrip-item.tab--errors.k-active {
            background-color: #F5F6FA;
        }

            BODY.theme .tab-panel--alt-0 .k-item.k-tabstrip-item.tab--errors.k-active .k-link {
                color: #FF2D55;
            }

    BODY.theme .tab-panel--alt-0 .k-item.k-tabstrip-item.k-first {
        margin-left: 0;
    }

    BODY.theme .tab-panel--alt-0 .k-item.k-tabstrip-item.k-active {
        background-color: #F5F6FA;
    }

BODY.theme .tab-panel--alt-0 .k-tabstrip-items .k-link {
    display: block;
    padding: 10px 16px;
    white-space: nowrap;
    font-size: 1.28rem;
    color: #FFF;
    text-align: center;
    text-transform: uppercase;
}

BODY.theme .tab-panel--alt-0 .k-tabstrip-items .k-active .k-link {
    color: #1b1b1b;
}

BODY.theme .tab-panel--alt-0 .k-tabstrip > .k-content.k-active {
    background-color: #F5F6FA;
}

BODY.theme .tab-panel--alt-1 .k-tabstrip-wrapper {
    -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.075);
    -moz-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.075);
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.075);
}

BODY.theme .tab-panel--alt-1 .k-tabstrip-top > .k-content {
    padding: 0;
    border: none;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
    background-color: #f5f5f5;
    overflow: hidden;
}

BODY.theme .tab-panel--alt-1 .k-tabstrip-top > .k-tabstrip-items .k-item {
    margin-right: 1rem;
}

BODY.theme .tab-panel--alt-1 .k-item.k-tabstrip-item {
    -webkit-box-flex: 1 1 auto;
    -webkit-flex: 1 1 auto;
    -moz-flex: 1 1 auto;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    border-width: 0;
    margin-bottom: 0;
    padding: 10px 15px;
    font-family: 'Invention', sans-serif;
    font-size: 14px;
    font-weight: 500;
    color: rgba(0, 0, 0, 0.45);
    -webkit-transition: background-color 0.4s ease-out;
    -moz-transition: background-color 0.4s ease-out;
    -ms-transition: background-color 0.4s ease-out;
    -o-transition: background-color 0.4s ease-out;
    transition: background-color 0.4s ease-out;
}

    BODY.theme .tab-panel--alt-1 .k-item.k-tabstrip-item:hover {
        color: #00857C;
    }

    BODY.theme .tab-panel--alt-1 .k-item.k-tabstrip-item .k-link {
        font-weight: 400;
        color: rgba(0, 0, 0, 0.45);
        padding: 0px;
    }

    BODY.theme .tab-panel--alt-1 .k-item.k-tabstrip-item.tab--disabled {
        background-color: #dadada;
    }

        BODY.theme .tab-panel--alt-1 .k-item.k-tabstrip-item.tab--disabled:hover {
            background-color: silver;
        }

        BODY.theme .tab-panel--alt-1 .k-item.k-tabstrip-item.tab--disabled:after {
            content: '\ea0e';
            display: inline-block;
            position: absolute;
            top: 0px;
            right: 0px;
            font-family: "IcoMoon Basic";
            color: rgba(65, 78, 84, 0.75);
        }

        BODY.theme .tab-panel--alt-1 .k-item.k-tabstrip-item.tab--disabled .k-link {
            color: rgba(65, 78, 84, 0.66);
        }

        BODY.theme .tab-panel--alt-1 .k-item.k-tabstrip-item.tab--disabled.k-active {
            background-color: rgba(236, 236, 236, 0.75);
        }

            BODY.theme .tab-panel--alt-1 .k-item.k-tabstrip-item.tab--disabled.k-active .k-link {
                color: #414E54;
            }

    BODY.theme .tab-panel--alt-1 .k-item.k-tabstrip-item.tab--errors {
        background-color: #FF2D55;
    }

        BODY.theme .tab-panel--alt-1 .k-item.k-tabstrip-item.tab--errors:hover {
            background-color: #f9002f;
        }

        BODY.theme .tab-panel--alt-1 .k-item.k-tabstrip-item.tab--errors:after {
            content: '\ea07';
            display: inline-block;
            position: absolute;
            top: 4px;
            right: 8px;
            font-family: "IcoMoon Basic";
            color: #FFF;
        }

        BODY.theme .tab-panel--alt-1 .k-item.k-tabstrip-item.tab--errors .k-link {
            color: #FFF;
        }

        BODY.theme .tab-panel--alt-1 .k-item.k-tabstrip-item.tab--errors.k-active {
            background-color: #FFF;
        }

            BODY.theme .tab-panel--alt-1 .k-item.k-tabstrip-item.tab--errors.k-active:after {
                color: #FF2D55;
            }

            BODY.theme .tab-panel--alt-1 .k-item.k-tabstrip-item.tab--errors.k-active .k-link {
                color: #FF2D55;
            }

    BODY.theme .tab-panel--alt-1 .k-item.k-tabstrip-item.tab--disabled.tab--errors {
        background-color: rgba(255, 45, 85, 0.5);
    }

        BODY.theme .tab-panel--alt-1 .k-item.k-tabstrip-item.tab--disabled.tab--errors:hover {
            background-color: rgba(255, 45, 85, 0.33);
        }

        BODY.theme .tab-panel--alt-1 .k-item.k-tabstrip-item.tab--disabled.tab--errors:after {
            content: '\ea0e \0020 \0020 \ea07';
            display: inline-block;
            position: absolute;
            top: 4px;
            right: 8px;
            font-family: "IcoMoon Basic";
            color: #FFF;
        }

        BODY.theme .tab-panel--alt-1 .k-item.k-tabstrip-item.tab--disabled.tab--errors .k-link {
            color: #FFF;
        }

        BODY.theme .tab-panel--alt-1 .k-item.k-tabstrip-item.tab--disabled.tab--errors.k-active {
            background-color: rgba(236, 236, 236, 0.75);
        }

            BODY.theme .tab-panel--alt-1 .k-item.k-tabstrip-item.tab--disabled.tab--errors.k-active:after {
                color: #FF2D55;
            }

            BODY.theme .tab-panel--alt-1 .k-item.k-tabstrip-item.tab--disabled.tab--errors.k-active .k-link {
                color: #FF2D55;
            }

    BODY.theme .tab-panel--alt-1 .k-item.k-tabstrip-item.k-first {
        margin-left: 0;
    }

    BODY.theme .tab-panel--alt-1 .k-item.k-tabstrip-item.k-active {
        color: #00857C;
    }

        BODY.theme .tab-panel--alt-1 .k-item.k-tabstrip-item.k-active .k-link {
            color: #00857C;
            font-weight: 700;
            position: relative;
        }

            BODY.theme .tab-panel--alt-1 .k-item.k-tabstrip-item.k-active .k-link::after {
                content: "";
                position: absolute;
                left: 0;
                right: 0;
                bottom: -2px;
                height: 2px;
                background-color: #00857C;
                ;
            }

BODY.theme .tab-panel--alt-1 .k-tabstrip-items .k-link {
    display: block;
    padding: 10px 16px;
    white-space: nowrap;
    font-size: 14px;
    color: #FFF;
    text-align: center;
    text-transform: capitalize;
}

    BODY.theme .tab-panel--alt-1 .k-tabstrip-items .k-link:hover {
        color: #00857C;
    }

BODY.theme .tab-panel--alt-2 .k-tabstrip-top > .k-content {
    border-radius: 0;
    background-color: #f5f5f5;
    padding: 0px;
    padding-top: 1px;
    border: none;
    overflow: visible;
}

.k-grid .k-table-alt-row {
    background-color: #fff !important;
}

BODY.theme .tab-panel--alt-2 .k-item.k-tabstrip-item {
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
    margin-bottom: 0;
    margin-left: 2px;
    background-color: #FFF;
    font-family: 'Invention', sans-serif;
    font-size: 1.28rem;
    color: #1b1b1b;
}

    BODY.theme .tab-panel--alt-2 .k-item.k-tabstrip-item.k-first {
        margin-left: 0;
    }

    BODY.theme .tab-panel--alt-2 .k-item.k-tabstrip-item.k-active {
        /* margin-bottom: -3px; */
        background-color: #fff;
    }

BODY.theme .tab-panel--alt-2 .k-tabstrip-items .k-link {
    display: block;
    padding: 15px 16px;
    font-weight: 400;
    font-size: inherit;
    text-align: center;
    color: #1b1b1b;
    text-transform: capitalize;
    letter-spacing: 0.05rem;
    font-size: 15px;
    border: 1px solid #eeecec;
    border-bottom: none;
}

BODY.theme .tab-panel--alt-2 .k-tabstrip-items .k-active .k-link {
    color: #00857C;
    background-color: #fff;
    font-weight: 600;
    border: none;
}

BODY.theme .nested-tab-panel--v1 .k-tabstrip-items {
    background-color: #fff;
}

BODY.theme .nested-tab-panel--v1 .k-tabstrip-top > .k-content {
    border-bottom-color: #08172b;
    border-radius: 0;
    background-color: #0C2340;
}

BODY.theme .nested-tab-panel--v1 .k-item.k-tabstrip-item {
    -webkit-box-flex: 0 1 auto;
    -webkit-flex: 0 1 auto;
    -moz-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    padding: 0 16px;
    border: none;
    border-radius: 0;
    margin-left: 0;
    background-color: #0C2340;
    font-family: 'Invention', sans-serif;
    font-size: 1.1rem;
    color: #FFF;
}

    BODY.theme .nested-tab-panel--v1 .k-item.k-tabstrip-item:hover {
        border: none;
    }

    BODY.theme .nested-tab-panel--v1 .k-item.k-tabstrip-item.k-first {
        margin-left: 0;
    }

    BODY.theme .nested-tab-panel--v1 .k-item.k-tabstrip-item.k-active {
        /* background-color: #0C2340;
        border: none; */
    }

BODY.theme .nested-tab-panel--v1 .k-tabstrip-items .k-link {
    display: block;
    padding: 10px 16px 10px 0;
    font-size: inherit;
    text-align: center;
    color: #FFF;
    text-transform: uppercase;
    letter-spacing: 0.05rem;
}

BODY.theme .nested-tab-panel--v1 .k-tabstrip-items .k-active .k-link {
    color: #00857C;
    text-transform: capitalize;
    font-size: 14px;
    font-weight: bold;
}

    BODY.theme .nested-tab-panel--v1 .k-tabstrip-items .k-active .k-link SPAN.nested-tab__text {
        display: inline-block;
        border-bottom: 3px solid #00857C;
    }

/* ---- KENDO GRID ---- */
BODY.theme .k-grid TABLE {
    font-size: 1.28rem;
}

BODY.theme .k-grid TD {
    font-family: 'Invention', sans-serif;
    font-weight: 500;
}

[aria-label="Go to the last page"] {
    display: none !important;
}

[aria-label="Go to the first page"] {
    display: none !important;
}

BODY.theme .k-pager-numbers-wrap {
    font-size: 14px !important;
}

    BODY.theme .k-pager-numbers-wrap .k-dropdown {
        display: none;
        width: 7.5rem;
        height: 26px;
        margin-top: 4px;
        margin-right: 8px;
        border-color: #A1AEB4;
        border-radius: 2px;
        background-color: #FFF;
        font-size: 1.1rem;
    }

    BODY.theme .k-pager-numbers-wrap .k-pager-numbers {
        margin-top: 2px;
        margin-bottom: 0;
    }

        BODY.theme .k-pager-numbers-wrap .k-pager-numbers BUTTON {
            margin-bottom: 0;
            font-size: 1.28rem;
        }

BODY.theme .k-pager .k-pager-numbers-wrap .k-button,
BODY.theme .k-pager .k-pager-nav {
    border: 1px solid #A1AEB4;
    color: #058C83;
    -webkit-transition: color 0.4s ease;
    -moz-transition: color 0.4s ease;
    -ms-transition: color 0.4s ease;
    -o-transition: color 0.4s ease;
    transition: color 0.4s ease;
    font-size: 1.28rem;
}

    BODY.theme .k-pager .k-pager-numbers-wrap .k-button:hover,
    BODY.theme .k-pager .k-pager-nav:hover {
        color: #07bdb1;
    }

    BODY.theme .k-pager .k-pager-numbers-wrap .k-button:active,
    BODY.theme .k-pager .k-pager-nav:active {
        color: #058C83;
    }

    BODY.theme .k-pager .k-pager-nav.k-state-disabled {
        color: #768A98;
        -webkit-transition: color 0.4s ease;
        -moz-transition: color 0.4s ease;
        -ms-transition: color 0.4s ease;
        -o-transition: color 0.4s ease;
        transition: color 0.4s ease;
    }

        BODY.theme .k-pager .k-pager-nav.k-state-disabled:hover {
            color: #768A98;
        }

        BODY.theme .k-pager .k-pager-nav.k-state-disabled:active {
            color: #768A98;
        }

.k-i-caret-alt-right::before {
    content: "›" !important;
    font-size: 25px !important;
    margin-top: -7px;
}

.k-i-caret-alt-left::before {
    content: "‹" !important;
    font-size: 25px !important;
    margin-top: -7px;
}

BODY.theme .k-pager .k-pager-numbers-wrap .k-button, BODY.theme .k-pager .k-pager-nav {
    color: #909090;
    font-size: 14px;
}

.k-button-overlay, .k-button::before {
    background: #fff !important;
    border: 1px solid #00857C;
}

BODY.theme .k-pager .k-pager-numbers-wrap .k-pager-numbers .k-selected {
    background-color: #fff !important;
    border: 1px solid #00857C;
    color: #00857C !important;
}

BODY.theme .k-pager .k-pager-sizes {
    display: none;
}

.k-pager-info {
    display: none !important;
}

BODY.theme .k-pager .k-pager-sizes .k-dropdown,
BODY.theme .k-pager .k-pager-sizes > SELECT {
    width: 5.5rem;
}

BODY.theme .k-pager-numbers .k-pager-numbers .k-selected,
BODY.theme .k-pager-numbers .k-pager-numbers .k-selected:hover {
    border-color: #058C83;
}

BODY.theme .tab-panel--alt-0 .k-grid {
    background-color: transparent;
}

BODY.theme .tab-panel--alt-0 .k-grouping-header {
    padding: 6px 16px;
    border-bottom-color: #08172b;
    background-color: #0C2340;
    color: #FFF;
}

BODY.theme .tab-panel--alt-0 .k-grid-header {
    background-color: transparent;
    color: #1b1b1b;
}

    BODY.theme .tab-panel--alt-0 .k-grid-header TH {
        border-width: 0 0 2px 0;
        border-color: #1b1b1b;
        font-family: 'Invention', sans-serif;
        font-size: 1.1rem;
        font-weight: 600;
        text-transform: uppercase;
    }

        BODY.theme .tab-panel--alt-0 .k-grid-header TH .k-link {
            text-align: center;
            font-family: 'Invention', sans-serif;
            font-size: inherit;
            font-weight: inherit;
            text-transform: inherit;
        }

BODY.theme .tab-panel--alt-0 TR.k-alt {
    background-color: transparent;
}

BODY.theme .tab-panel--alt-0 .k-grid TD {
    height: 48px;
    border-width: 0 0 1px 0;
    border-color: #414E54;
}

BODY.theme .tab-panel--alt-0 .k-grid.k-widget {
    border: none;
}

BODY.theme .tab-panel--alt-0 .k-header.notes__buttons,
BODY.theme .tab-panel--alt-0 .k-command-cell {
    text-align: center;
}

BODY.theme .tab-panel--alt-1 .k-grid {
    background-color: transparent;
}

BODY.theme .tab-panel--alt-1 .k-grouping-header {
    padding: 6px 16px;
    border-bottom-color: #08172b;
    background-color: #0C2340;
    color: #FFF;
}

BODY.theme .tab-panel--alt-1 .k-grid-header {
    background-color: transparent;
    color: #1b1b1b;
}

    BODY.theme .tab-panel--alt-1 .k-grid-header TH {
        border-width: 0 0 2px 0;
        border-color: #1b1b1b;
        font-family: 'Invention', sans-serif;
        font-size: 1.1rem;
        font-weight: 600;
        text-transform: uppercase;
    }

        BODY.theme .tab-panel--alt-1 .k-grid-header TH .k-link {
            text-align: center;
            font-family: 'Invention', sans-serif;
            font-size: inherit;
            font-weight: inherit;
            text-transform: inherit;
        }

BODY.theme .tab-panel--alt-1 TR.k-alt {
    background-color: transparent;
}

BODY.theme .tab-panel--alt-1 .k-grid TD {
    height: 48px;
    border-width: 0 0 1px 0;
    border-color: #414E54;
}

BODY.theme .tab-panel--alt-1 .k-grid.k-widget {
    border: none;
}

BODY.theme .tab-panel--alt-1 .k-header.notes__buttons,
BODY.theme .tab-panel--alt-1 .k-command-cell {
    text-align: center;
}

.k-tabstrip-items-wrapper .k-item:active, .k-tabstrip-items-wrapper .k-item.k-active, .k-tabstrip-items-wrapper .k-item.k-selected {
    border-color: #f0f0f0 !important;
}

BODY.theme .tab-panel--alt-2 .k-grid {
    border: none;
}

    BODY.theme .tab-panel--alt-2 .k-grid TABLE.k-table {
        border: 0px;
        box-sizing: border-box;
    }

BODY.theme .tab-panel--alt-2 .k-grouping-header {
    padding: 6px 16px;
    border-bottom-color: #08172b;
    background-color: #0C2340;
    color: #FFF;
}

BODY.theme .tab-panel--alt-2 .k-grid-header {
    background-color: #fff;
    color: #000;
}

    BODY.theme .tab-panel--alt-2 .k-grid-header TH {
        border-color: #fff;
        text-align: center;
        vertical-align: middle;
        font-family: 'Invention', sans-serif;
        font-size: 14px !important;
        font-weight: 600;
        text-transform: capitalize;
        padding: 15px;
        border-bottom: 1px solid #F0F0F0;
        position: relative;
        background: #fafafa !important;
    }

        BODY.theme .tab-panel--alt-2 .k-grid-header TH::before {
            content: "";
            height: 20px;
            width: 1px;
            background-color: #f0f0f0;
            position: absolute;
            left: 0;
            top: 50%;
            transform: translateY(-50%);
        }

        BODY.theme .tab-panel--alt-2 .k-grid-header TH[data-title="Case Name"] {
            background: url("/Assets/images/icons/Sorting.png") center right no-repeat #fafafa !important;
        }

        BODY.theme .tab-panel--alt-2 .k-grid-header TH[data-title="Updated On"] {
            background: url("/Assets/images/icons/Sorting.png") center right no-repeat #fafafa !important;
        }

        BODY.theme .tab-panel--alt-2 .k-grid-header TH .k-link {
            padding: 0.75rem 0;
            white-space: normal;
            text-align: center;
            font-family: 'Invention', sans-serif;
            font-size: inherit;
            font-weight: inherit;
            text-transform: inherit;
        }

BODY.theme .tab-panel--alt-2 .k-grid TD {
    height: 48px;
    border: 0;
    border-bottom: 1px solid #f0f0f0;
    position: relative;
    overflow: visible;
}

BODY.theme .tab-panel--alt-2 .k-grid.k-widget {
    border: none;
}

BODY.theme .tab-panel--alt-2 .k-grid-pager {
    border: none;
    justify-content: flex-end;
    background-color: #f5f5f5;
}

BODY.theme .tab-panel--alt-2 .fieldset--panel .k-grid {
    background-color: transparent;
}

BODY.theme .tab-panel--alt-2 .fieldset--panel .k-grouping-header {
    padding: 6px 16px;
    border-bottom-color: #08172b;
    background-color: #0C2340;
    color: #FFF;
}

BODY.theme .tab-panel--alt-2 .fieldset--panel .k-grid-header {
    background-color: transparent;
    color: #1b1b1b;
}

    BODY.theme .tab-panel--alt-2 .fieldset--panel .k-grid-header TH {
        border-width: 0 0 2px 0;
        border-color: #f0f0f0;
        font-family: 'Invention', sans-serif;
        font-size: 1.1rem;
        font-weight: 600;
        text-transform: capitalize;
    }

        BODY.theme .tab-panel--alt-2 .fieldset--panel .k-grid-header TH .k-link {
            text-align: center;
            font-family: 'Invention', sans-serif;
            font-size: inherit;
            font-weight: inherit;
            text-transform: inherit;
        }

BODY.theme .tab-panel--alt-2 .fieldset--panel TR.k-alt {
    background-color: transparent;
}

BODY.theme .tab-panel--alt-2 .fieldset--panel .k-grid TD {
    height: 48px;
    border-bottom: 1px solid #f4f4f4;
}

BODY.theme .tab-panel--alt-2 .fieldset--panel .k-grid.k-widget {
    border: none;
}

BODY.theme .tab-panel--alt-2 .fieldset--panel .k-header.notes__buttons,
BODY.theme .tab-panel--alt-2 .fieldset--panel .k-command-cell {
    text-align: center;
}

/* ---- KENDO FILE UPLOAD ---- */
.k-button.k-upload-button {
    text-transform: uppercase;
}

/* ---- KENDO GRID - EVALUATIONS ---- */
BODY.theme .tab-panel--alt-2 .k-widget.k-tabstrip .k-content.k-state-active {
    padding: 0;
    border-color: #08172b;
}

    BODY.theme .tab-panel--alt-2 .k-widget.k-tabstrip .k-content.k-state-active .grid-wrap {
        margin-bottom: 0;
    }

/* ---- KENDO PANEL BAR (ACCORDION) ------------------------------------------------------------------------------------------- */
BODY.theme UL.k-panelbar {
    border: none;
    font-family: 'Invention', sans-serif;
}

    BODY.theme UL.k-panelbar LI.k-panelbar-item {
        border: none;
    }

        BODY.theme UL.k-panelbar LI.k-panelbar-item .k-link {
            height: 40px;
            border-radius: 4px;
            background-color: #F5F6FA;
            font-family: 'Invention', sans-serif;
            font-size: 1.6rem;
            font-weight: 600;
            color: #1b1b1b;
            text-transform: capitalize;
            letter-spacing: 0.05rem;
            cursor: pointer;
        }

            BODY.theme UL.k-panelbar LI.k-panelbar-item .k-link:hover {
                background-color: #e4e7f2;
            }

            BODY.theme UL.k-panelbar LI.k-panelbar-item .k-link > DIV {
                width: 100%;
                padding-right: 160px;
            }

                BODY.theme UL.k-panelbar LI.k-panelbar-item .k-link > DIV.panel-header-content {
                    height: 100%;
                }

                    BODY.theme UL.k-panelbar LI.k-panelbar-item .k-link > DIV.panel-header-content .flex-column-wrap {
                        height: inherit;
                    }

            BODY.theme UL.k-panelbar LI.k-panelbar-item .k-link.k-selected {
                background-color: #FBE122;
            }

                BODY.theme UL.k-panelbar LI.k-panelbar-item .k-link.k-selected:hover {
                    background-color: #e6cb04;
                }

BODY.theme LI.k-panelbar-item.k-active .panelbar-dock {
    min-height: 86px;
}

BODY.theme LI.k-panelbar-item.k-active A.k-link.k-state--fixed {
    position: fixed;
    top: 84px;
    z-index: 300;
    width: 1020px;
    padding: 8px 12px;
    margin-left: -20px;
    border-radius: 0;
}

BODY.theme LI.k-panelbar-item .k-link.k-selected.k-focus {
    box-shadow: #e6cb04 0 0 3px inset;
}

BODY.theme LI.k-panelbar-item .k-link.k-selected.k-hover {
    background-color: #f2d604;
}

BODY.theme UL.k-panelbar .tab-panel--alt-0 .tab-container {
    margin-top: 20px;
}

BODY.theme UL.k-panelbar .tab-panel--alt-0 .k-item.k-tabstrip-item .k-link,
BODY.theme UL.k-panelbar .tab-panel--alt-1 .k-item.k-tabstrip-item .k-link {
    height: 40px;
    padding-left: 10px;
    padding-right: 10px;
    background-color: #A1AEB4;
    font-size: 1.28rem;
    font-weight: 500;
    color: #FFF;
    text-transform: uppercase;
}

    BODY.theme UL.k-panelbar .tab-panel--alt-0 .k-item.k-tabstrip-item .k-link:hover,
    BODY.theme UL.k-panelbar .tab-panel--alt-1 .k-item.k-tabstrip-item .k-link:hover {
        background-color: #93a2a9;
        -webkit-transition: background-color 0.4s ease-out;
        -moz-transition: background-color 0.4s ease-out;
        -ms-transition: background-color 0.4s ease-out;
        -o-transition: background-color 0.4s ease-out;
        transition: background-color 0.4s ease-out;
    }

BODY.theme UL.k-panelbar .tab-panel--alt-0 .k-item.k-tabstrip-item.k-active,
BODY.theme UL.k-panelbar .tab-panel--alt-1 .k-item.k-tabstrip-item.k-active {
    background-color: #F5F6FA;
}

    BODY.theme UL.k-panelbar .tab-panel--alt-0 .k-item.k-tabstrip-item.k-active .k-link,
    BODY.theme UL.k-panelbar .tab-panel--alt-1 .k-item.k-tabstrip-item.k-active .k-link {
        background-color: #F5F6FA;
        color: #1b1b1b;
    }

BODY.theme UL.k-panelbar .tab-panel--alt-1 .tab-panel__header {
    border-bottom: none;
}

BODY.theme LI.k-panelbar-item .k-content {
    padding: 20px;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    background-color: #F5F6FA;
}

    BODY.theme LI.k-panelbar-item .k-content#panelbar-1 {
        padding: 0;
        background-color: transparent;
    }

        BODY.theme LI.k-panelbar-item .k-content#panelbar-1 .tab-panel__header {
            border-bottom-left-radius: 4px;
            border-bottom-right-radius: 4px;
            margin-bottom: 20px;
            background-color: #F5F6FA;
        }

        BODY.theme LI.k-panelbar-item .k-content#panelbar-1 .k-tabstrip > .k-content {
            border: none;
        }

        BODY.theme LI.k-panelbar-item .k-content#panelbar-1 .k-tabstrip-wrapper {
            box-shadow: none;
        }

    BODY.theme LI.k-panelbar-item .k-content#panelbar-2 {
        padding: 0;
        margin-top: 20px;
        background-color: transparent;
    }

        BODY.theme LI.k-panelbar-item .k-content#panelbar-2 .tab-panel__header {
            border-bottom-left-radius: 4px;
            border-bottom-right-radius: 4px;
            margin-bottom: 20px;
            background-color: #F5F6FA;
        }

        BODY.theme LI.k-panelbar-item .k-content#panelbar-2 .k-tabstrip > .k-content {
            border: none;
        }

        BODY.theme LI.k-panelbar-item .k-content#panelbar-2 .k-tabstrip-wrapper {
            box-shadow: none;
        }

BODY.theme UL.k-panelbar {
    /* ---- ICON ---- */
}

    BODY.theme UL.k-panelbar .k-panelbar-item.k-panelbar-item {
        position: relative;
        margin-bottom: 10px;
    }

        BODY.theme UL.k-panelbar .k-panelbar-item.k-panelbar-item .k-link {
            height: 48px;
        }

        BODY.theme UL.k-panelbar .k-panelbar-item.k-panelbar-item .panel-header-content {
            position: relative;
            top: -40px;
            padding-left: 16px;
        }

    BODY.theme UL.k-panelbar .k-panelbar-expand.k-icon:before,
    BODY.theme UL.k-panelbar .k-panelbar-collapse.k-icon:before {
        display: inline-block;
        background-color: #FFF;
        font-family: "IcoMoon Basic";
        color: #1b1b1b;
    }

    BODY.theme UL.k-panelbar > .k-panelbar-item > .k-link > .k-icon,
    BODY.theme UL.k-panelbar > .k-panelbar-item > .panelbar-dock > .k-link > .k-icon {
        top: 1px;
        right: 1.25rem;
    }

        BODY.theme UL.k-panelbar > .k-panelbar-item > .k-link > .k-icon:before,
        BODY.theme UL.k-panelbar > .k-panelbar-item > .panelbar-dock > .k-link > .k-icon:before {
            width: 24px;
            height: 24px;
            border-radius: 20px;
            font-size: 24px;
        }

    BODY.theme UL.k-panelbar > .k-panelbar-item > .panelbar-dock > .k-link {
        display: flex;
        padding: 10px 12px;
    }

    BODY.theme UL.k-panelbar > .k-panelbar-item > .k-link > .k-icon.k-i-loading:before {
        content: "";
        width: 1em;
        height: 1em;
        background-color: transparent;
        font-size: 24px;
    }

    BODY.theme UL.k-panelbar > .k-panelbar-item > .k-link > .k-icon.k-i-loading.loading-success:before {
        content: "";
        width: 1em;
        height: 1em;
        background-color: transparent;
        font-size: 24px;
    }

    BODY.theme UL.k-panelbar > .k-panelbar-item > .k-link > .k-icon.loading-success:before {
        content: "\ea41";
        width: 24px;
        height: 24px;
        background-color: #FFF;
        font-size: 24px;
    }

    BODY.theme UL.k-panelbar .k-icon.k-panelbar-expand:before {
        content: '\ea43';
    }

    BODY.theme UL.k-panelbar .k-icon.k-panelbar-expand.k-i-loading:before {
        content: '';
        background-color: transparent;
    }

    BODY.theme UL.k-panelbar .k-icon.k-panelbar-collapse:before {
        content: '\ea41';
    }

    BODY.theme UL.k-panelbar .k-icon.k-panelbar-collapse.k-i-loading:before {
        content: '';
        background-color: transparent;
    }

    BODY.theme UL.k-panelbar .panelbar-circle-button {
        display: inline-block;
        position: absolute;
        right: 5rem;
        z-index: 100;
    }

        BODY.theme UL.k-panelbar .panelbar-circle-button I.k-icon {
            width: 24px;
            height: 24px;
            border: 2px solid #1b1b1b;
            border-radius: 20px;
            background-color: #FFF;
            margin-right: 10px;
            font-family: "IcoMoon Basic";
            color: #1b1b1b;
        }

            BODY.theme UL.k-panelbar .panelbar-circle-button I.k-icon:before {
                content: '\e905';
                margin: 3px 0 0 2px;
                font-size: 12px;
                background-color: transparent;
            }

BODY.theme UL.k-widget.k-panelbar LI.k-panelbar-item A {
    position: relative;
}

BODY.theme UL.k-panelbar .panelbar__icon {
    display: inline-block;
    width: 32px;
    height: 32px;
    margin-right: 20px;
    overflow: visible;
}

    BODY.theme UL.k-panelbar .panelbar__icon:before {
        content: '';
        font-family: "IcoMoon Basic";
        font-size: 32px;
        line-height: 1;
        color: #1b1b1b;
    }

    BODY.theme UL.k-panelbar .panelbar__icon.panelbar__icon--report:before,
    BODY.theme UL.k-panelbar .panelbar__icon.panelbar__icon--23218:before {
        content: '\e922';
    }

    BODY.theme UL.k-panelbar .panelbar__icon.panelbar__icon--posting-session:before,
    BODY.theme UL.k-panelbar .panelbar__icon.panelbar__icon--23219:before {
        content: '\ea70';
    }

    BODY.theme UL.k-panelbar .panelbar__icon.panelbar__icon--evaluated-birds:before,
    BODY.theme UL.k-panelbar .panelbar__icon.panelbar__icon--23220:before {
        content: '\ea58';
    }

    BODY.theme UL.k-panelbar .panelbar__icon.panelbar__icon--cocci-lesion:before,
    BODY.theme UL.k-panelbar .panelbar__icon.panelbar__icon--23221:before {
        content: '\e99d';
    }

    BODY.theme UL.k-panelbar .panelbar__icon.panelbar__icon--cocci-index:before,
    BODY.theme UL.k-panelbar .panelbar__icon.panelbar__icon--23222:before {
        content: '\e99c';
    }

    BODY.theme UL.k-panelbar .panelbar__icon.panelbar__icon--observations:before,
    BODY.theme UL.k-panelbar .panelbar__icon.panelbar__icon--23223:before {
        content: '\e9ce';
    }

    BODY.theme UL.k-panelbar .panelbar__icon.panelbar__icon--media:before,
    BODY.theme UL.k-panelbar .panelbar__icon.panelbar__icon--23224:before {
        content: '\e90e';
    }

/* CHECKBOX PADDING CHANGES */
#clinicalColumn0 .check-wrap LABEL {
    padding: 8px 8px 8px 8px;
}

/* ---- KENDO HIERARCHY GRID (OFTEN WITHIN PANEL BAR) ---- */
BODY.theme .k-detail-row .k-hierarchy-cell {
    width: auto;
}

BODY.theme .k-detail-row .field {
    border-bottom: 1px solid #A1AEB4;
}

    BODY.theme .k-detail-row .field INS {
        background-color: transparent;
        color: #414E54;
    }

BODY.theme .k-grid .k-master-row > .k-hierarchy-cell .k-icon {
    width: 20px;
    height: 20px;
    padding: 0;
}

    BODY.theme .k-grid .k-master-row > .k-hierarchy-cell .k-icon:before {
        width: 20px;
        height: 20px;
        border-radius: 16px;
        font-size: 16px;
        font-family: "IcoMoon Basic";
    }

    BODY.theme .k-grid .k-master-row > .k-hierarchy-cell .k-icon.k-i-caret-alt-right:before {
        content: '\ea43';
    }

    BODY.theme .k-grid .k-master-row > .k-hierarchy-cell .k-icon.k-i-caret-alt-down:before {
        content: '\ea41';
    }

BODY.theme .k-grid .k-detail-row .k-hierarchy-cell {
    background-color: #F5F6FA;
}

BODY.theme .k-grid .k-detail-cell {
    background-color: #F5F6FA;
}

/* ----  KENDO NUMERIC FIELDS ---- */
BODY.theme .field.field--emphasised .k-numerictextbox INPUT {
    border: none;
}

BODY.theme .field.field--emphasised .k-numerictextbox .k-select {
    background: transparent;
}

BODY.theme .group-input__subfield .k-widget.k-numerictextbox {
    width: 64px;
}

    BODY.theme .group-input__subfield .k-widget.k-numerictextbox .group-input__textbox {
        height: 36px;
        padding: 4px;
        border: none;
    }

    BODY.theme .group-input__subfield .k-widget.k-numerictextbox .k-numeric-wrap {
        border-top-right-radius: 6px;
        border-bottom-right-radius: 6px;
    }

BODY.theme .group-input__subfield .k-numerictextbox .k-select {
    background: transparent;
}

/* ---- CHECKBOX TREE ---- */
BODY.theme .checkbox-tree-wrap.k-content {
    -webkit-box-flex: 1 1 auto;
    -webkit-flex: 1 1 auto;
    -moz-flex: 1 1 auto;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    max-height: 320px;
    padding: 8px;
    border: 1px solid #A1AEB4;
    border-radius: 4px;
    overflow-y: scroll;
    background-color: #FFF;
}

BODY.theme .k-treeview-md {
    font-size: 1.28rem;
}

/* ---- KENDO LOADING OVERLAY ---- */
BODY.theme .k-loading-mask.k-loading-mask--landing.k-loading-mask--visible {
    position: absolute;
    top: 4px;
    left: 8px;
    width: 24px;
    height: 24px;
}

    BODY.theme .k-loading-mask.k-loading-mask--landing.k-loading-mask--visible .k-loading-image:before {
        width: 0.2em;
        height: 0.2em;
        margin-top: -0.1em;
        margin-left: -0.1em;
    }

    BODY.theme .k-loading-mask.k-loading-mask--landing.k-loading-mask--visible .k-loading-color {
        background-color: transparent;
    }

BODY.theme .k-loading-mask--evaluations.k-loading-mask--visible .k-loading-color {
    opacity: 0.6;
}

/* ---- KENDO DIALOG WINDOWS ---- */
BODY.theme .k-window-titlebar.k-header {
    font-family: 'Invention', sans-serif;
    ;
}

BODY.theme .k-window HEADER.tab-panel__header {
    padding-top: 16px;
    padding-bottom: 16px;
}

    BODY.theme .k-window HEADER.tab-panel__header .tab-switch-container {
        top: 10px;
        right: 0;
    }

/* ============================================================== MEDIA QUERIES ============================================================== */
/* ---- MEDIUM DESKTOP (1440px - 1599px) ---- */
@media only screen and (min-width: 1440px) and (max-width: 1599px) {
    /* ---- KENDO PANEL BAR (ACCORDION) ---- */
    BODY.theme LI.k-panelbar-item.k-active A.k-link.k-state--fixed {
        width: 1061px;
    }
}

/* ---- LAPTOP & SMALL DESKTOP (1280px - 1439px) ---- */
@media only screen and (min-width: 1280px) and (max-width: 1439px) {
    /* ---- KENDO TABSTRIP ---- */
    BODY.theme .tab-panel--alt-1 .k-tabstrip-items .k-link {
        font-size: 1.1rem;
    }
    /* ---- KENDO PANEL BAR (ACCORDION) ---- */
    BODY.theme LI.k-panelbar-item.k-active A.k-link.k-state--fixed {
        width: 937px;
        margin-left: -20px;
    }
}

/* ---- TABLET TO LAPTOP (960px - 1279px) ---- */
@media only screen and (min-width: 960px) and (max-width: 1279px) {
    /* ---- KENDO PANEL BAR (ACCORDION) ---- */
    BODY.theme LI.k-panelbar-item.k-active A.k-link.k-state--fixed {
        width: 100%;
        left: 0;
        margin-left: 0;
    }
    /* ----  KENDO NUMERIC FIELDS ---- */
    BODY.theme .group-input__subfield .k-widget.k-numerictextbox {
        width: 48px;
    }
}

/* ---- SMALL MOBILE TO TABLET (0 - 1279px) ---- */
@media only screen and (max-width: 1279px) {
    /* ---- KENDO TABSTRIP ---- */
    BODY.theme .k-tabstrip-items {
        -webkit-flex-wrap: nowrap;
        flex-wrap: nowrap;
    }

    BODY.theme .tab-panel--alt-0 .k-item.k-tabstrip-item {
        -webkit-box-flex: 1 1 12.5%;
        -webkit-flex: 1 1 12.5%;
        -moz-flex: 1 1 12.5%;
        -ms-flex: 1 1 12.5%;
        flex: 1 1 12.5%;
    }

    BODY.theme .tab-panel--alt-0 .k-tabstrip-top > .k-tabstrip-items .k-item {
        margin-right: 0.75rem;
    }

    BODY.theme .tab-panel--alt-0 .k-tabstrip-items .k-link {
        padding: 10px;
        white-space: normal;
        font-size: 1rem;
    }

    BODY.theme .tab-panel--alt-1 .k-item.k-tabstrip-item {
        -webkit-box-flex: 1 1 12.5%;
        -webkit-flex: 1 1 12.5%;
        -moz-flex: 1 1 12.5%;
        -ms-flex: 1 1 12.5%;
        flex: 1 1 12.5%;
    }

    BODY.theme .tab-panel--alt-1 .k-tabstrip-top > .k-tabstrip-items .k-item {
        margin-right: 0.75rem;
    }

    BODY.theme .tab-panel--alt-1 .k-tabstrip-items .k-link {
        padding: 10px;
        white-space: normal;
        font-size: 1rem;
    }
}

/* ---- MOBILE TO SMALL TABLET (0 - 959px) ---- */
@media only screen and (max-width: 959px) {
    /* ---- KENDO PANEL BAR (ACCORDION) ---- */
    BODY.theme LI.k-panelbar-item.k-active A.k-link.k-state--fixed {
        top: 76px;
        width: 100%;
        left: 0;
        margin-left: 0;
    }

    BODY.theme LI.k-panelbar-item .k-link.k-header {
        font-size: 1.28rem;
    }
    /* ----  KENDO NUMERIC FIELDS ---- */
    BODY.theme .group-input__subfield .k-widget.k-numerictextbox {
        width: 48px;
    }
    /* ---- CHECKBOX TREE ---- */
    .checkbox-tree-wrap.k-content {
        width: 100%;
    }
}

/* ===========================================================

	MSD HATCHPLAN TYPOGRAPHY (2019)

=========================================================== */

/* -------- TYPOGRAPHY MIXINS ------------------------------------------------------------------------------------------------------------------------ */
/* ---- FONT SIZE ---- */
/* ---- FONT STYLE ---- */
/* ---- antialiasing mode font rendering ---- */
/* --------------------------------------------------------------------------------------------------------------------------------------------------- */
/* ---- HTML ELEMENTS ---- */
HTML {
    font-size: 62.5%;
}

MAIN.page-main {
    font-size: 1.28rem;
    line-height: 1.9rem;
    font-family: 'Invention', sans-serif;
    ;
    color: #414E54;
    font-feature-settings: 'liga', 'kern';
    /* http://elliotjaystocks.com/blog/kerning/ */
    font-kerning: normal;
    -webkit-font-smoothing: antialiased;
}

/* ---- COMMON ELEMENTS ---- */
P, UL, OL, DL,
HEADER, FOOTER,
LABEL, ADDRESS, BLOCKQUOTE
INPUT, SELECT, OPTION, TEXTAREA {
    font-family: 'Invention', sans-serif;
    ;
}

SMALL {
    font-size: 1.1rem;
}

B, STRONG {
    font-weight: 700;
}

FIGCAPTION {
    font-size: 1.28rem;
    padding-top: 1.9rem;
    text-align: center;
}

SUB, SUP {
    font-size: 60%;
}

SUP {
    vertical-align: super;
    top: -0.6em;
    line-height: 0;
}

EM {
    font-style: italic;
}

MARK {
    margin: 0 4px;
    background-color: none;
    font-size: 110%;
    color: #e6cb04;
}

/* ---- TEXT HIGHLIGHT ---- */
::selection,
::-moz-selection {
    background: #FBE122;
    color: #FFF;
}

/* ---- LINKS ---- */
A {
    color: #FBE122;
    -webkit-transition: color 0.4s ease;
    -moz-transition: color 0.4s ease;
    -ms-transition: color 0.4s ease;
    -o-transition: color 0.4s ease;
    transition: color 0.4s ease;
    -webkit-transition: color 0.4s ease;
    -moz-transition: color 0.4s ease;
    -ms-transition: color 0.4s ease;
    -o-transition: color 0.4s ease;
    transition: color 0.4s ease;
}

    A:hover {
        color: #fce854;
    }

    A:active {
        color: #FBE122;
    }

    A:hover {
        text-decoration: none;
    }

    A.heavy-link {
        font-weight: 600;
    }

    A.heavy-link--caps {
        text-transform: uppercase;
    }

.underline,
.underline-alt {
    position: relative;
}

    .underline:hover,
    .underline-alt:hover {
        text-decoration: none !important;
    }

    .underline:active,
    .underline-alt:active {
        text-decoration: none !important;
    }

    .underline:focus,
    .underline-alt:focus {
        text-decoration: none !important;
    }

    .underline:before,
    .underline-alt:before {
        content: '';
        position: absolute;
        z-index: 0;
        left: 0;
        bottom: 0;
        width: 100%;
        border-bottom-width: 1px;
        border-bottom-style: solid;
        border-bottom-color: inherit;
        -webkit-transition: border-bottom-color 0.4s ease;
        -moz-transition: border-bottom-color 0.4s ease;
        -ms-transition: border-bottom-color 0.4s ease;
        -o-transition: border-bottom-color 0.4s ease;
        transition: border-bottom-color 0.4s ease;
    }

    .underline:before {
        opacity: 0.5;
    }

    .underline-alt:before {
        opacity: 0.25;
    }

/* ---- QUOTES ---- */
Q {
    font-style: italic;
}

BLOCKQUOTE {
    margin-bottom: 1.9rem;
    font-size: 1.1rem;
    line-height: 1.28rem;
}

    BLOCKQUOTE P.quote__body {
        margin-bottom: 10px;
        font-size: inherit;
        font-style: italic;
        line-height: inherit;
    }

        BLOCKQUOTE P.quote__body:before {
            content: '\0022';
        }

        BLOCKQUOTE P.quote__body:after {
            content: '\0022';
        }

    BLOCKQUOTE P.quote__source {
        margin-bottom: 0;
        font-size: inherit;
        font-style: normal;
        font-weight: 600;
    }

        BLOCKQUOTE P.quote__source:before {
            content: '\2014 \0020';
        }

    /* Marked Quote */
    BLOCKQUOTE.marked-quote {
        padding-left: 24px;
        border-left: 5px solid #058C83;
    }

        BLOCKQUOTE.marked-quote P.quote__body {
            color: #b4b4b4;
        }

            BLOCKQUOTE.marked-quote P.quote__body:before {
                content: '';
            }

            BLOCKQUOTE.marked-quote P.quote__body:after {
                content: '';
            }

    /* Large Quote */
    BLOCKQUOTE.large-quote {
        padding: 24px 0;
        font-family: 'Invention', sans-serif;
        ;
        font-size: 1.6rem;
        font-weight: 700;
        line-height: 2rem;
        text-align: center;
    }

        BLOCKQUOTE.large-quote P.quote__body {
            margin-bottom: 20px;
            font-weight: 600;
            font-style: normal;
            color: #b4b4b4;
        }

        BLOCKQUOTE.large-quote P.quote__source {
            font-size: 1.28rem;
            font-weight: 700;
            color: #8d8d8d;
            text-align: right;
        }

/* ---- FONT SIZES ---- */
.alpha {
    font-size: 3.90625rem;
}

.beta {
    font-size: 3.125rem;
}

.gamma {
    font-size: 2.5rem;
}

.delta {
    font-size: 2rem;
}

.epsilon {
    font-size: 1.6rem;
}

.zeta {
    font-size: 1.28rem;
}

.eta {
    font-size: 1.1rem;
}

.theta {
    font-size: 1rem;
}

.iota {
    font-size: 0.9rem;
}

.omicron {
    font-size: 0.8rem;
}

.omega {
    font-size: 0.7rem;
}

.tera {
    font-size: 9.53674rem;
}

.giga {
    font-size: 7.62939rem;
}

.mega {
    font-size: 6.10352rem;
}

.kilo {
    font-size: 4.88281rem;
}

.zetta {
    font-size: 18.62645rem;
}

.exa {
    font-size: 14.90116rem;
}

.peta {
    font-size: 11.92093rem;
}

/* ---- STANDARD HEADINGS ---- */
H1 {
    font-size: 3.90625rem;
    font-weight: 400;
    line-height: 0.9;
    margin-bottom: 2.60417rem;
    font-family: 'Invention', sans-serif;
    font-style: 400;
    color: #414E54;
    text-transform: capitalize;
}

H2 {
    font-size: 3.125rem;
    font-weight: 400;
    line-height: 0.9;
    margin-bottom: 2.08333rem;
    font-family: 'Invention', sans-serif;
    ;
    font-style: 400;
    color: #414E54;
    text-transform: capitalize;
}

H3 {
    font-size: 2.5rem;
    font-weight: 400;
    line-height: 0.9;
    margin-bottom: 1.66667rem;
    font-family: 'Invention', sans-serif;
    ;
    font-style: 400;
    color: #414E54;
    text-transform: capitalize;
}

H4 {
    font-size: 2rem;
    font-weight: 400;
    line-height: 0.9;
    margin-bottom: 1.33333rem;
    font-family: 'Invention', sans-serif;
    ;
    font-style: 400;
    color: #414E54;
    text-transform: capitalize;
}

H5 {
    font-size: 1.6rem;
    font-weight: 400;
    line-height: 0.9;
    margin-bottom: 1.06667rem;
    font-family: 'Invention', sans-serif;
    ;
    font-style: 400;
    color: #414E54;
    text-transform: capitalize;
}

H6 {
    font-size: 1.28rem;
    font-weight: 400;
    line-height: 0.9;
    margin-bottom: 0.85333rem;
    font-family: 'Invention', sans-serif;
    ;
    font-style: 600;
    color: #0C2340;
    text-transform: capitalize;
}

/* ---- SMALL HEADING SIZES ---- */
H1 SMALL {
    font-size: 50%;
}

H2 SMALL {
    font-size: 60%;
}

H3 SMALL {
    font-size: 70%;
}

H4 SMALL {
    font-size: 80%;
}

H5 SMALL {
    font-size: 85%;
}

H6 SMALL {
    font-size: 90%;
}

/* ---- HEADER TITLE ---- */
HEADER.site-header H1,
HEADER.site-header H2,
HEADER.site-header H3,
HEADER.site-header H4,
HEADER.site-header H5,
HEADER.site-header H6 {
    font-family: 'Invention', sans-serif;
    color: #414E54;
    text-transform: uppercase;
}

    HEADER.site-header H1 SPAN.alt,
    HEADER.site-header H2 SPAN.alt,
    HEADER.site-header H3 SPAN.alt,
    HEADER.site-header H4 SPAN.alt,
    HEADER.site-header H5 SPAN.alt,
    HEADER.site-header H6 SPAN.alt {
        font-family: 'Invention', sans-serif;
        color: #FBE122;
        text-transform: uppercase;
    }

/* ---- HEADING VARIATIONS ---- */
H1.alt,
H1 SPAN.alt,
H2.alt,
H2 SPAN.alt,
H3.alt,
H3 SPAN.alt,
H4.alt,
H4 SPAN.alt,
H5.alt,
H5 SPAN.alt,
H6.alt,
H6 SPAN.alt {
    font-family: 'Invention', sans-serif;
    color: #414E54;
    text-transform: capitalize;
    line-height: 1;
}

    H1.alt SPAN.alt,
    H2.alt SPAN.alt,
    H3.alt SPAN.alt,
    H4.alt SPAN.alt,
    H5.alt SPAN.alt {
        font-family: 'Invention', sans-serif;
        color: #0C2340;
        text-transform: capitalize;
    }

/* ---- PARAGRAPH ---- */
P {
    margin-bottom: 1.9rem;
    font-size: 1.28rem;
    font-weight: 400;
    line-height: 1.9rem;
    color: #414E54;
}

    .large,
    P.large
    P .large {
        font-size: 1.6rem;
        line-height: 2rem;
    }

    P.intro-text {
        font-size: 2rem;
        line-height: 2.5rem;
    }

    .footnotes,
    P.footnotes,
    P .footnotes {
        margin-bottom: 12px;
        font-family: 'Invention', sans-serif;
        font-size: 1.28rem;
        font-weight: 500;
        line-height: 1.4;
        color: #414E54;
    }

    P.space--small {
        margin-bottom: 8px;
    }

    P.space--medium {
        margin-bottom: 32px;
    }

/* ============================================================== MEDIA QUERIES ============================================================== */
/* ---- ALL MOBILE (0 - 959px) ---- */
@media only screen and (max-width: 959px) {
    /*H1                                          {@include heading-font-size($alpha); letter-spacing:0px;}
    H2						                    {@include heading-font-size($beta); letter-spacing:0px;}*/
}

/* ---- LARGE DESKTOP (1600px +) ---- */
/* ---- HIGH PIXEL DENSITY SCREENS ---- */
@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5) {
    P {
        letter-spacing: 0.01em;
        /* Increase letter-spacing on high pixel density screens as they can appear too close */
        word-spacing: 0.01em;
        /* Word-spacing same as letter-spacing for consistency */
    }
}

/* ===========================================================
                                                              
          MSD HATCHPLAN HEADER SASS (2019)                             

=========================================================== */
/* ======== SITE HEADER ======== */
BODY.theme .fixed-header__dock {
    min-height: 86px;
}

BODY.theme HEADER.site-header {
    min-height: 86px;
    z-index: 999;
    padding: 20px;
    background-color: #0C2340;
    -webkit-box-shadow: 0 6px 8px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0 6px 8px rgba(0, 0, 0, 0.1);
    box-shadow: 0 6px 8px rgba(0, 0, 0, 0.1);
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}

    BODY.theme HEADER.site-header .header-col {
        padding: 0px;
    }

    BODY.theme HEADER.site-header.fixed {
        min-height: 52px;
        padding: 6px 20px 8px 20px;
    }

        BODY.theme HEADER.site-header.fixed .header-col {
            padding-top: 4px;
            padding-bottom: 4px;
        }

    BODY.theme HEADER.site-header.site-header--device {
        background: #0C2340;
        background-size: 320px;
    }

        BODY.theme HEADER.site-header.site-header--device .header-col.header-col--user-panel {
            margin-left: auto;
            align-items: center;
        }

    BODY.theme HEADER.site-header .page-limits {
        /*max-width:$screen-largest;*/
    }

BODY.theme IMG.header__logo.header__logo--msd {
    /*display:none;*/
    margin-top: 2px;
}

/* ---- HEADER COLUMNS ---- */
BODY.theme HEADER .header-col {
    padding: 0;
}

    BODY.theme HEADER .header-col.header-col--logo {
        padding: 0;
    }

        BODY.theme HEADER .header-col.header-col--logo H1 {
            margin-top: 12px;
        }

    BODY.theme HEADER .header-col.header-col--nav {
        padding: 0 4px;
        align-items: center;
        display: flex;
    }

    BODY.theme HEADER .header-col.header-col--user-panel {
        padding: 0px;
    }

    BODY.theme HEADER .header-col.header-col--logo-corp {
        padding-top: 14px;
    }

BODY.theme HEADER.fixed .header-col.header-col--logo {
    padding-top: 8px;
}

BODY.theme HEADER.fixed .header-col.header-col--user-panel {
    padding-bottom: 8px;
}

/* ---- HEADER TITLE ---- */
BODY.theme HEADER.site-header H1,
BODY.theme HEADER.site-header H2,
BODY.theme HEADER.site-header H3,
BODY.theme HEADER.site-header H4,
BODY.theme HEADER.site-header H5,
BODY.theme HEADER.site-header H6 {
    display: inline-block;
    font-size: 1.504rem;
    font-weight: 400;
    line-height: 1.1;
    margin-bottom: 0;
    font-family: 'Invention', sans-serif;
    font-style: normal;
    color: #FFF;
    text-transform: uppercase;
    vertical-align: middle;
    letter-spacing: 0.4rem;
    -webkit-transform: scale(1, 0.85);
    /* Chrome, Safari 8+, Opera 15.0+ */
    -webkit-transform: -webkit-scale(1, 0.85);
    /* Safari 7 */
    -webkit-transform: translateZ(0);
    /* Prevent blur on IOS Retina devices */
    -moz-transform: scale(1, 0.85);
    /* Firefox */
    -ms-transform: scale(1, 0.85);
    /* IE 9 */
    -o-transform: scale(1, 0.85);
    /* Opera 10.5 - 15.0 */
    transform: scale(1, 0.85);
}

    BODY.theme HEADER.site-header H1 SPAN,
    BODY.theme HEADER.site-header H2 SPAN,
    BODY.theme HEADER.site-header H3 SPAN,
    BODY.theme HEADER.site-header H4 SPAN,
    BODY.theme HEADER.site-header H5 SPAN,
    BODY.theme HEADER.site-header H6 SPAN {
        color: #FBE122;
    }

/* ---- HEADER LOGO ---- */
BODY.theme IMG.header__logo {
    display: inline-block;
    margin-right: 16px;
    vertical-align: middle;
}

    BODY.theme IMG.header__logo.header__logo--msd {
        max-height: 38px;
    }

    BODY.theme IMG.header__logo.header__logo--mapp365 {
        max-height: 70px;
    }

BODY.theme HEADER.fixed IMG.header__logo.header__logo--msd {
    margin-top: 16px;
}

/* ---- HEADER USER PANEL ---- */
BODY.theme .header-col--user-panel {
    font-family: 'Invention', sans-serif;
    letter-spacing: 0.1rem;
}

BODY.theme .header__login-label {
    color: #FFF;
}

BODY.theme .header__login-link,
BODY.theme .header__locale-link {
    font-size: 16px;
    letter-spacing: 0.25rem;
    font-weight: normal;
    white-space: nowrap;
    color: #fff;
    -webkit-transition: color 0.4s ease;
    -moz-transition: color 0.4s ease;
    -ms-transition: color 0.4s ease;
    -o-transition: color 0.4s ease;
    transition: color 0.4s ease;
    -webkit-transition: background-color 0.4s ease;
    -moz-transition: background-color 0.4s ease;
    -ms-transition: background-color 0.4s ease;
    -o-transition: background-color 0.4s ease;
    transition: background-color 0.4s ease;
}

    BODY.theme .header__login-link:hover,
    BODY.theme .header__locale-link:hover {
    }

    BODY.theme .header__login-link:active,
    BODY.theme .header__locale-link:active {
    }

    BODY.theme .header__login-link:hover,
    BODY.theme .header__locale-link:hover {
    }

BODY.theme .header__locale {
    display: none;
}

/* ---- MOBILE SUPPORT MESSAGE ---- */
.mobile-support-message {
    display: none;
    position: relative;
    padding: 8px 32px 8px 48px;
    font-weight: 600;
    color: #FFF;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -ms-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

    .mobile-support-message.mobile-support-message--hidden {
        display: none;
        height: 0;
        padding-top: 0;
        padding-bottom: 0;
        opacity: 0;
    }

    .mobile-support-message.mobile-support-message--visible {
        display: none;
        height: 64px;
        padding-top: 8px;
        padding-bottom: 8px;
        opacity: 1;
    }

    .mobile-support-message I.icon {
        display: block;
        position: absolute;
        top: 12px;
        left: 16px;
        z-index: 200;
        width: 24px;
        height: 24px;
        color: inherit;
    }

        .mobile-support-message I.icon:before {
            display: block;
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            font-size: 20px;
            color: inherit;
        }

    .mobile-support-message P {
        margin-bottom: 0;
        text-align: left;
        font-size: 1.1rem;
        font-weight: 500;
        color: inherit;
        line-height: 1.4;
    }

.mobile-support-message__close {
    position: absolute;
    z-index: 1600;
    display: inline-block;
    top: 12px;
    right: 12px;
    height: 16px;
    width: 16px;
    border-radius: 50%;
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
}

    .mobile-support-message__close::after, .mobile-support-message__close::before {
        /* lines of 'X' icon */
        content: '';
        position: absolute;
        height: 2px;
        width: 16px;
        left: 50%;
        top: 47.5%;
        background-color: #FFF;
        -webkit-backface-visibility: hidden;
        -moz-backface-visibility: hidden;
        -ms-backface-visibility: hidden;
        -o-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-transition: background-color 0.4s ease;
        -moz-transition: background-color 0.4s ease;
        -ms-transition: background-color 0.4s ease;
        -o-transition: background-color 0.4s ease;
        transition: background-color 0.4s ease;
    }

    .mobile-support-message__close::after {
        -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg);
        -moz-transform: translateX(-50%) translateY(-50%) rotate(45deg);
        -o-transform: translateX(-50%) translateY(-50%) rotate(45deg);
        -ms-transform: translateX(-50%) translateY(-50%) rotate(45deg);
        transform: translateX(-50%) translateY(-50%) rotate(45deg);
    }

    .mobile-support-message__close::before {
        -webkit-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
        -moz-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
        -o-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
        -ms-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
        transform: translateX(-50%) translateY(-50%) rotate(-45deg);
    }

    .mobile-support-message__close:hover::after, .mobile-support-message__close:hover::before {
        background-color: #e6e6e6;
    }

/* ---- CAUTION (Amber) ---- */
.mobile-support-message.mobile-support-message--caution {
    background-color: #ffcc1a;
}

    .mobile-support-message.mobile-support-message--caution .icon:before {
        content: '\ea07';
    }

/* ---- WARNING (Orange) ---- */
.mobile-support-message.mobile-support-message--warning {
    background-color: #e57539;
}

    .mobile-support-message.mobile-support-message--warning .icon:before {
        content: '\ea07';
    }

.mobile-support-message.fixed {
    position: fixed;
    top: 0;
    z-index: 900;
}

/* ======== PAGE HEADER ======== */
BODY.theme HEADER.page-header {
    max-height: 140px;
}

    BODY.theme HEADER.page-header .header-limits {
        padding: 24px 0 12px;
    }

    BODY.theme HEADER.page-header H1.page-title {
        display: inline-block;
        position: relative;
        font-size: 2rem;
        font-weight: 500;
        line-height: 1.1;
        margin-bottom: 16px;
        font-family: 'Invention', sans-serif;
        font-style: normal;
        color: #058C83;
        text-transform: capitalize;
    }

        BODY.theme HEADER.page-header H1.page-title TIME {
            color: #1b1b1b;
        }

        BODY.theme HEADER.page-header H1.page-title.page-title--no-time {
            color: #1b1b1b;
        }

    BODY.theme HEADER.page-header .header-columns {
        /*border-bottom:1px solid darken($septenaryBkgColour, 5%); @include shadow-outset(0,4px,2px,100,100,100,0.08);*/
    }

    BODY.theme HEADER.page-header .buttons--header {
        /*position:absolute;*/
        right: 0;
        margin-top: 0px;
    }

/* ============================================================== MEDIA QUERIES ============================================================== */
/* ---- LARGE TABLET & LAPTOP (960px - 1439px) ---- */
/* ---- MOBILE & TABLET (0 - 1024px) ---- */
/* ---- MOBILE & SMALL TABLET (0 - 959px) ---- */
@media only screen and (max-width: 959px) {
    /* ======== SITE HEADER ======== */
    BODY.theme HEADER.site-header.site-header--device {
        background-size: 240px;
    }

        BODY.theme HEADER.site-header.site-header--device .header-col.header-col--user-panel {
            margin-right: 180px;
        }
    /* ---- HEADER COLUMNS ---- */
    BODY.theme HEADER .header-col.header-col--user-panel {
        padding: 0 16px 16px 16px;
    }
    /* ---- HEADER TITLE ---- */
    BODY.theme HEADER.site-header H1 {
        font-size: 1.1rem;
    }
}

/* ---- MOBILE & SMALL PORTRAIT TABLET (0 - 767px) ---- */
@media screen and (max-width: 767px) {
    /* ======== SITE HEADER ======== */
    BODY.theme HEADER.site-header.site-header--device {
        background-size: 200px;
    }

        BODY.theme HEADER.site-header.site-header--device .header-col.header-col--user-panel {
            margin-right: 140px;
        }

    BODY.theme HEADER.site-header,
    BODY.theme HEADER.site-header.fixed {
        padding: 6px 16px;
    }
    /* ---- HEADER COLUMNS ---- */
    BODY.theme HEADER .header-col.header-col--user-panel {
        padding: 0 12px 16px 12px;
    }

        BODY.theme HEADER .header-col.header-col--user-panel * {
            font-size: 0.8rem;
        }

    BODY.theme HEADER.fixed .header-col.header-col--logo {
        padding-top: 12px;
    }
    /* ---- HEADER TITLE ---- */
    BODY.theme HEADER.site-header H1 {
        font-size: 0.9rem;
        letter-spacing: 0.2rem;
    }
    /* ---- HEADER LOGO ---- */
    BODY.theme IMG.header__logo {
        margin-right: 0;
    }

    BODY.theme HEADER.fixed IMG.header__logo.header__logo--msd,
    BODY.theme HEADER.fixed IMG.header__logo.header__logo--mapp365 {
        margin-top: 8px;
    }
    /* ---- HEADER LINKS ---- */
    BODY.theme .header__login-link.login-link--logout {
        margin-left: 0;
        background: url("/Assets/images/chick_images/icons/LogoutOutlined.png") center center no-repeat;
    }
}

/* ---- MOBILE (0 - 599px) ---- */
@media screen and (max-width: 599px) {
    /* ======== SITE HEADER ======== */
    BODY.theme HEADER.site-header.site-header--device {
        background-size: 160px;
    }

        BODY.theme HEADER.site-header.site-header--device .header-col.header-col--user-panel {
            margin-right: 120px;
        }

        BODY.theme HEADER.site-header.site-header--device.fixed {
            top: 64px;
        }
    /* ---- MOBILE SUPPORT MESSAGE ---- */
    .mobile-support-message,
    .mobile-support-message.mobile-support-message--hidden,
    .mobile-support-message.mobile-support-message--visible {
        display: block;
    }
}

/* ===========================================================
                                                              
          MSD HATCHPLAN NAV SASS (2019)                             

=========================================================== */
/* ---- SIDEBAR BURGER MENU ICON (editable) ---- */
BODY.theme ASIDE.page-side #sidebarTrigger {
    top: 8px;
    right: 8px;
}

BODY.theme ASIDE.page-side .icon.icon--burger-glyph {
    position: absolute;
    z-index: 1600;
    display: block;
    top: 0;
    right: 0;
    width: 24px;
    height: 24px;
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -ms-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

    BODY.theme ASIDE.page-side .icon.icon--burger-glyph::after, BODY.theme ASIDE.page-side .icon.icon--burger-glyph::before {
        /* lines of burger symbol*/
        content: '';
        position: absolute;
        width: 120%;
        height: 3px;
        left: -5%;
        border-top: 3px solid #d9c004;
        border-bottom: 3px solid #d9c004;
        -webkit-backface-visibility: hidden;
        -moz-backface-visibility: hidden;
        -ms-backface-visibility: hidden;
        -o-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-transition: border-color 0.4s ease;
        -moz-transition: border-color 0.4s ease;
        -ms-transition: border-color 0.4s ease;
        -o-transition: border-color 0.4s ease;
        transition: border-color 0.4s ease;
    }

    BODY.theme ASIDE.page-side .icon.icon--burger-glyph::before {
        top: 0;
    }

    BODY.theme ASIDE.page-side .icon.icon--burger-glyph::after {
        top: 12px;
    }

    BODY.theme ASIDE.page-side .icon.icon--burger-glyph:hover::after, BODY.theme ASIDE.page-side .icon.icon--burger-glyph:hover::before {
        border-color: #b49f03;
    }

BODY.theme ASIDE.page-side .icon.icon--cross-glyph {
    position: absolute;
    z-index: 1600;
    display: inline-block;
    top: 0;
    right: 0;
    height: 24px;
    width: 24px;
    border-radius: 50%;
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
}

    BODY.theme ASIDE.page-side .icon.icon--cross-glyph::after, BODY.theme ASIDE.page-side .icon.icon--cross-glyph::before {
        /* lines of 'X' icon */
        content: '';
        position: absolute;
        height: 3px;
        width: 24px;
        left: 50%;
        top: 47.5%;
        background-color: #d9c004;
        -webkit-backface-visibility: hidden;
        -moz-backface-visibility: hidden;
        -ms-backface-visibility: hidden;
        -o-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-transition: background-color 0.4s ease;
        -moz-transition: background-color 0.4s ease;
        -ms-transition: background-color 0.4s ease;
        -o-transition: background-color 0.4s ease;
        transition: background-color 0.4s ease;
    }

    BODY.theme ASIDE.page-side .icon.icon--cross-glyph::after {
        -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg);
        -moz-transform: translateX(-50%) translateY(-50%) rotate(45deg);
        -o-transform: translateX(-50%) translateY(-50%) rotate(45deg);
        -ms-transform: translateX(-50%) translateY(-50%) rotate(45deg);
        transform: translateX(-50%) translateY(-50%) rotate(45deg);
    }

    BODY.theme ASIDE.page-side .icon.icon--cross-glyph::before {
        -webkit-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
        -moz-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
        -o-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
        -ms-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
        transform: translateX(-50%) translateY(-50%) rotate(-45deg);
    }

    BODY.theme ASIDE.page-side .icon.icon--cross-glyph:hover::after, BODY.theme ASIDE.page-side .icon.icon--cross-glyph:hover::before {
        background-color: #b49f03;
    }

/* ---- MAIN NAVIGATION ---- */
NAV.main-nav {
    border-bottom: 1px solid #dadada;
    background-color: #F5F6FA;
}

    NAV.main-nav .nav__link {
        color: #FBE122;
        -webkit-transition: color 0.4s ease;
        -moz-transition: color 0.4s ease;
        -ms-transition: color 0.4s ease;
        -o-transition: color 0.4s ease;
        transition: color 0.4s ease;
    }

        NAV.main-nav .nav__link:hover {
            color: #fce854;
        }

        NAV.main-nav .nav__link:active {
            color: #FBE122;
        }

    NAV.main-nav .nav__item:hover {
        background-color: #0C2340;
    }

        NAV.main-nav .nav__item:hover .nav__link {
            color: #FFF;
        }

    NAV.main-nav .nav__item.current {
        background-color: #FBE122;
    }

        NAV.main-nav .nav__item.current .nav__link {
            color: #FFF;
        }

/* ---- SIDE NAV ---- */
BODY.theme .side-nav__link {
    color: #d9c004;
    -webkit-transition: color 0.4s ease;
    -moz-transition: color 0.4s ease;
    -ms-transition: color 0.4s ease;
    -o-transition: color 0.4s ease;
    transition: color 0.4s ease;
    -webkit-transition: background-color 0.4s ease-in-out;
    -moz-transition: background-color 0.4s ease-in-out;
    -ms-transition: background-color 0.4s ease-in-out;
    -o-transition: background-color 0.4s ease-in-out;
    transition: background-color 0.4s ease-in-out;
}

    BODY.theme .side-nav__link:hover {
        color: #FFF;
    }

    BODY.theme .side-nav__link:active {
        color: #d9c004;
    }

    BODY.theme .side-nav__link:hover {
        background-color: #0C2340;
    }

        BODY.theme .side-nav__link:hover .side-nav__icon {
            color: #b49f03;
        }

            BODY.theme .side-nav__link:hover .side-nav__icon:before {
                color: #FFF;
            }

BODY.theme .side-nav__text {
    color: #d9c004;
}

BODY.theme .side-nav__link:hover .side-nav__text {
    color: #FFF;
}

BODY.theme .sidebar--open .side-nav__text {
    color: #d9c004;
}

/*
.sidebar--open .side-nav__link.side-nav__link--current .side-nav__text,
.sidebar--open .side-nav__link:hover .side-nav__text{color:$anchorTertiaryColour;}
*/
/* ---- BREADCRUMB NAV ---- */
BODY.theme .breadcrumb-nav {
    color: #768A98;
}

BODY.theme .breadcrumb-nav__link {
    color: #058C83;
    -webkit-transition: color 0.4s ease;
    -moz-transition: color 0.4s ease;
    -ms-transition: color 0.4s ease;
    -o-transition: color 0.4s ease;
    transition: color 0.4s ease;
}

    BODY.theme .breadcrumb-nav__link:hover {
        color: #07bdb1;
    }

    BODY.theme .breadcrumb-nav__link:active {
        color: #058C83;
    }

BODY.theme .breadcrumb-nav__current {
    color: inherit;
}

BODY.theme I.breadcrumb-nav__icon.icon {
    color: inherit;
}

BODY.theme SELECT.breadcrumb-nav__link {
    height: 32px;
    padding: 0 16px 0 0;
    background-color: transparent;
    -webkit-appearance: none;
    -moz-appearance: none;
    text-indent: 1px;
    text-overflow: '';
}

/* ---- STEP NAV ---- */
BODY.theme .step-content__nav {
    /* See sass/sections/content.scss */
}

BODY.theme .step-nav__link {
    font-weight: normal;
    letter-spacing: 0.075rem;
    font-size: 16px;
    color: rgba(0, 0, 0, 0.45);
    text-transform: capitalize;
}

/* ===========================================================
                                                              
          MSD HATCHPLAN MAIN SASS (2019)                             

=========================================================== */
/* ---- MAIN STRUCTURE ---- */
BODY.theme MAIN.page-main {
    /* padding-bottom: 32px; */
    background-color: #f5f5f5;
}

    BODY.theme MAIN.page-main .page-limits {
        max-width: 1440px;
    }

/* ---- CONTENT & SECTIONS ---- */
BODY.theme .page-content {
    background-color: transparent;
}

BODY.theme SECTION.section--content {
    background-color: #FFF;
    padding: 20px;
    margin-bottom: 20px;
    border-radius: 6px;
}

    BODY.theme SECTION.section--content:nth-child(even) {
        background-color: #FFF;
    }

    BODY.theme SECTION.section--content:last-of-type {
        margin-bottom: 0;
        overflow: visible;
    }

BODY.theme SECTION.section--alt-1 {
    padding: 20px 0;
    background-color: transparent;
}

    BODY.theme SECTION.section--alt-1:nth-child(even) {
        background-color: transparent;
    }

BODY.theme SECTION .section-limits {
    padding: 0;
}

    BODY.theme SECTION .section-limits:last-of-type {
        padding: 0;
    }

BODY.theme SECTION.section--no-vertical-pad {
    padding-top: 0;
    padding-bottom: 0;
}

BODY.theme SECTION.section--no-top-pad {
    padding-top: 0;
}

BODY.theme H1.section-title,
BODY.theme H2.section-title {
    font-size: 2rem;
    font-weight: 500;
    line-height: 1.1;
    margin-bottom: 24px;
    color: #1b1b1b;
}

    BODY.theme H1.section-title.section-title--bottom-margin,
    BODY.theme H2.section-title.section-title--bottom-margin {
        margin-bottom: 20px !important;
    }

    BODY.theme H1.section-title I.icon,
    BODY.theme H2.section-title I.icon {
        margin-right: 10px;
    }

    BODY.theme H1.section-title TIME,
    BODY.theme H2.section-title TIME {
        margin-left: 10px;
        font-size: 1.28rem;
        font-weight: 400;
        color: #768A98;
    }

BODY.theme H2.section-subtitle,
BODY.theme H3.section-subtitle {
    color: #414E54;
}

    BODY.theme H2.section-subtitle I.icon,
    BODY.theme H3.section-subtitle I.icon {
        margin-right: 10px;
    }

/* ---- CONTENT PANEL ---- */
BODY.theme .content-panel {
    border-radius: 6px;
    -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.075);
    -moz-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.075);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.075);
}

/* ---- CONTENT BOXES ---- */
BODY.theme .content-boxes--primary .box {
    border: 1px solid #A1AEB4;
    background-color: #FFF;
    color: #414E54;
}

BODY.theme .content-boxes--primary .box__header H3 {
    color: #414E54;
}

BODY.theme .content-boxes--primary .box__header H4 {
    color: #414E54;
}

BODY.theme .content-boxes--primary .box__header H5 {
    color: #414E54;
}

BODY.theme .content-boxes--secondary .box {
    background-color: #fff;
    color: #768A98;
}

.no-cssgrid BODY.theme .content-boxes--secondary .box {
    box-shadow: none !important;
}

BODY.theme .content-boxes--secondary .box__header {
    border-color: #08172b;
    border-bottom-color: #08172b;
}

    BODY.theme .content-boxes--secondary .box__header H3 {
        color: #FBE122;
    }

    BODY.theme .content-boxes--secondary .box__header H4 {
        color: #FBE122;
    }

    BODY.theme .content-boxes--secondary .box__header H5 {
        color: #FBE122;
    }

BODY.theme .content-boxes--tertiary .box {
    background-color: #FBE122;
    color: #058C83;
}

BODY.theme .content-boxes--tertiary .box__header {
    border-color: none;
    border-bottom-color: none;
}

    BODY.theme .content-boxes--tertiary .box__header H3 {
        color: #058C83;
    }

    BODY.theme .content-boxes--tertiary .box__header H4 {
        color: #058C83;
    }

    BODY.theme .content-boxes--tertiary .box__header H5 {
        color: #058C83;
    }

BODY.theme .page-content .box {
    border-radius: 2px;
    border-radius: 6px;
}

BODY.theme .box .box__header H3,
BODY.theme .box .box__header H4,
BODY.theme .box .box__header H5 {
    color: #FBE122;
}

/* ---- BOXES WITHIN MENU DIALOGS ---- */
BODY.theme .menu-dialog .box {
    border-radius: 6px;
}

BODY.theme .menu-dialog H3.box__title {
    color: #058C83;
}

/* ---- CUSTOMER/COMPANY BOXES ---- */
BODY.theme .box--customer__viewport {
    /*@include shadow-outset(0,4px,8px,0,0,0,0.15);*/
}

/* ---- BANNER BOXES ---- */
BODY.theme .box.box--banner {
    background-color: #FFF;
    border: 1px solid #A1AEB4;
}

BODY.theme .box--banner__title {
    font-family: 'Invention', sans-serif;
    color: #6d838e;
    text-transform: none;
    font-weight: 600;
    letter-spacing: 0.25rem;
}

BODY.theme .box.box--banner.banner--primary {
    background-color: #FBE122;
    border: none;
}

BODY.theme .banner--primary .box--banner__title {
    font-family: 'Invention', sans-serif;
    color: #058C83;
    text-transform: none;
    font-weight: 400;
    letter-spacing: 0.1rem;
}

BODY.theme .box.box--banner.banner--secondary {
    background-color: #0C2340;
    border: none;
}

BODY.theme .banner--secondary .box--banner__title {
    font-family: 'Invention', sans-serif;
    color: #6ECEB2;
    text-transform: none;
    font-weight: 400;
    letter-spacing: 0.1rem;
}

BODY.theme .box.box--banner.banner--tertiary {
    background-color: #058C83;
    border: none;
}

BODY.theme .banner--tertiary .box--banner__title {
    font-family: 'Invention', sans-serif;
    color: #FFF;
    text-transform: none;
    font-weight: 400;
    letter-spacing: 0.1rem;
}

/* ---- BANNER (Non-box variant) ---- */
BODY.theme .banner {
    background-color: #FFF;
    border: 1px solid #A1AEB4;
}

BODY.theme .banner__title {
    font-family: 'Invention', sans-serif;
    color: #6d838e;
    text-transform: none;
    font-weight: 600;
    letter-spacing: 0.25rem;
}

BODY.theme .banner__image {
    background-color: #e6e6e6;
    color: #414E54;
    text-align: center;
}

BODY.theme .banner.banner--primary {
    background-color: #FBE122;
    border: none;
}

BODY.theme .banner--primary .banner__title {
    font-family: 'Invention', sans-serif;
    color: #058C83;
    text-transform: none;
    font-weight: 400;
    letter-spacing: 0.1rem;
}

BODY.theme .banner--primary .banner__image {
    background-color: #e6cb04;
    color: #1b1b1b;
}

BODY.theme .banner.banner--secondary {
    background-color: #0C2340;
    border: none;
}

BODY.theme .banner--secondary .banner__title {
    font-family: 'Invention', sans-serif;
    color: #6ECEB2;
    text-transform: none;
    font-weight: 400;
    letter-spacing: 0.1rem;
}

BODY.theme .banner--secondary .banner__image {
    background-color: #040c15;
    color: #FFF;
}

BODY.theme .banner.banner--tertiary {
    background-color: #058C83;
    border: none;
}

BODY.theme .banner--tertiary .banner__title {
    font-family: 'Invention', sans-serif;
    color: #FFF;
    text-transform: none;
    font-weight: 400;
    letter-spacing: 0.1rem;
}

BODY.theme .banner--teriary .banner__image {
    background-color: #035b55;
    color: #FFF;
}

/* ---- STEP CONTENT & NAV ---- */
BODY.theme .step-content__title {
    font-family: 'Invention', sans-serif;
    font-style: normal;
    color: #414E54;
    text-transform: capitalize;
}

BODY.theme .step-content__details {
    background-color: #FFF;
}

BODY.theme H4.step-details__title {
    font-family: 'Invention', sans-serif;
    font-style: normal;
    color: #1b1b1b;
    text-transform: capitalize;
}

BODY.theme .step-details__item {
    font-family: 'Invention', sans-serif;
    color: #1b1b1b;
}

/* ---- INFO BOXES ---- */
BODY.theme .info-box.info-box--last-evaluation {
    min-width: 240px;
    padding: 6px;
    border-right: none;
}

BODY.theme .info-box H4.info-box__heading {
    font-size: 1.6rem;
    font-weight: 500;
    line-height: 1.1;
    margin-bottom: 24px;
    font-family: 'Invention', sans-serif;
    ;
    font-style: normal;
    color: #FBE122;
    text-transform: capitalize;
}

BODY.theme .info-box H5.info-box__subheading {
    font-size: 1.28rem;
    font-weight: 600;
    line-height: 1.1;
    margin-bottom: 16px;
    font-family: 'Invention', sans-serif;
    ;
    font-style: normal;
    color: #FFF;
    text-transform: capitalize;
}

BODY.theme ADDRESS.info-box__address {
    padding: 0;
    margin-bottom: 16px;
    border-radius: 0;
    background-color: transparent;
    color: #FFF;
}

BODY.theme .box .info-box {
    color: #FFF;
}

    BODY.theme .box .info-box H4.info-box__heading {
        color: #FBE122;
    }

    BODY.theme .box .info-box H5.info-box__subheading {
        color: inherit;
    }

BODY.theme .box ADDRESS.info-box__address {
    color: #FFF;
}

BODY.theme .box .icon-list {
    font-size: 1.6rem;
    color: #FFF;
}

/* ---- SECTION TITLE LOGO ---- */
BODY.theme .section-title__viewport {
    background-color: #FFF;
    -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
    -moz-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}

/* ---- PANEL ELEMENTS ---- */
BODY.theme .form-panel {
    /* See sass/themes/msdHatchplan/msdhatch-forms.scss */
}

BODY.theme .grid-panel {
    /* See sass/themes/msdHatchplan/msdhatch-tables.scss */
}

BODY.theme .panel__title {
    font-size: 1.504rem;
    font-weight: 500;
    line-height: 1.3;
    margin-bottom: 1.9rem;
    font-family: 'Invention', sans-serif;
    font-style: normal;
    color: #1b1b1b;
    text-transform: capitalize;
    overflow-wrap: break-word;
}

BODY.theme H3.panel__title {
    font-size: 1.6rem;
    letter-spacing: 0.075rem;
}

BODY.theme H4.panel__title {
    font-size: 1.504rem;
    overflow-wrap: break-word;
}

/* ============================================================== MEDIA QUERIES ============================================================== */
/* ---- MOBILE, TABLET & LAPTOP (0 - 1439px) ---- */
@media only screen and (max-width: 1439px) {
    /* ---- MAIN STRUCTURE ---- */
    BODY.theme MAIN.page-main .page-limits {
        max-width: 1280px;
    }
}

/* ---- TABLET, LAPTOP & DESKTOP (960px +) ---- */
/* ===========================================================

	MSD HATCHPLAN TABLES SASS (2019)

=========================================================== */
/* ---- STANDARD TABLE STYLES ---- */
BODY.theme .grid-panel .table-wrap > TABLE,
BODY.theme .grid-panel .grid-wrap > TABLE,
BODY.theme .grid-panel .grid-wrap > .k-grid > TABLE {
    min-width: 960px;
}

    BODY.theme .grid-panel .table-wrap > TABLE.table--large,
    BODY.theme .grid-panel .grid-wrap > TABLE.table--large,
    BODY.theme .grid-panel .grid-wrap > .k-grid > TABLE.table--large {
        /* min-width: 1440px;  */
    }

BODY.theme .table-wrap TABLE.table--condensed {
    min-width: 800px;
}

BODY.theme .table-wrap THEAD TR.thead__tr--data-row {
    background-color: white;
}

    BODY.theme .table-wrap THEAD TR.thead__tr--data-row:hover {
        background-color: white;
    }

    BODY.theme .table-wrap THEAD TR.thead__tr--data-row TH {
        color: #414E54;
        text-align: right;
    }

        BODY.theme .table-wrap THEAD TR.thead__tr--data-row TH.row-heading {
            text-align: left;
        }

BODY.theme .table-wrap TH {
    padding: 16px 8px;
    font-size: 1.1rem;
    font-weight: 400;
    text-transform: uppercase;
    text-align: center;
}

BODY.theme .table-wrap TD {
    padding: 16px 8px;
    font-size: 1.504rem;
    font-weight: 500;
    color: #1b1b1b;
}

    BODY.theme .table-wrap TD.td--actions {
        text-align: center;
        overflow: visible;
    }

        BODY.theme .table-wrap TD.td--actions .dropdown {
            display: block;
            margin: 0px auto;
        }

.category-name {
    text-transform: lowercase;
}

.deleted-item-name {
    background-color: #f5f5f5;
    padding: 5px;
    border-radius: 4px;
    margin-top: 5px;
}

BODY.theme .table-wrap TD.td--actions .dropdown .btn-light {
    font-size: 20px;
}

BODY.theme TD.score-cell {
    font-size: 16px !important;
    font-weight: 600;
}

    BODY.theme TD.score-cell span {
        font-size: 16px !important;
        position: relative;
    }

    BODY.theme TD.score-cell.score-cell--bad {
        color: #000;
    }

    BODY.theme TD.score-cell span::before {
        width: 8px;
        height: 8px;
        content: "";
        position: absolute;
        border-radius: 50%;
        top: 3px;
        left: -12px;
    }

    BODY.theme TD.score-cell.score-cell--bad span::before {
        background-color: #DB1E28;
    }

    BODY.theme TD.score-cell.score-cell--good span::before {
        background-color: #52C41A;
    }

    BODY.theme TD.score-cell.score-cell--moderate span::before {
        background-color: #FAAD14;
    }

    BODY.theme TD.score-cell.score-cell--fair span::before {
        background-color: #688CE8;
    }

    BODY.theme TD.score-cell .score-cell__percentage {
        font-size: 1.1rem;
        color: #414E54;
    }

BODY.theme H2.section-title {
    font-size: 20px !important;
}

BODY.theme TABLE.table--alt-1 {
    background-color: transparent;
}

BODY.theme .table--alt-1 THEAD {
    background-color: transparent;
    color: #1b1b1b;
}

    BODY.theme .table--alt-1 THEAD TH {
        position: relative; /* required for ::before positioning */
        border-width: 0 0 1px 0;
        border-color: #d9d9d9;
        border-style: solid;
        font-family: 'Invention', sans-serif;
        font-size: 13px;
        font-weight: 600;
        color: rgba(0, 0, 0, 0.88);
        text-transform: capitalize;
        /* overflow: hidden;
        text-overflow: ellipsis; */
        background-color: #fafafa;
        text-align: start;
    }

        BODY.theme .table--alt-1 THEAD TH:last-child {
            text-align: center;
        }
        /* Add vertical divider on all TH except the first one */
        BODY.theme .table--alt-1 THEAD TH:not(:first-child)::before {
            content: "";
            position: absolute;
            left: 0;
            top: 10%;
            bottom: 10%;
            width: 1px;
            background-color: #f0f0f0; /* same color as border */
        }

        BODY.theme .table--alt-1 THEAD TH .head-link {
            text-align: center;
            font-family: 'Invention', sans-serif;
            font-size: inherit;
            font-weight: inherit;
            text-transform: inherit;
        }

BODY.theme .table--alt-1 TR {
    background-color: transparent !important;
}

BODY.theme .table--alt-1 TBODY TH,
BODY.theme .table--alt-1 TBODY TD {
    height: 48px;
    border-width: 0 0 1px 0;
    border-color: #fff;
    text-align: start;
}

BODY.theme .table--alt-1 TBODY TD {
    font-size: 1.28rem;
}

BODY.theme .table--alt-0.table--nested {
    border: 1px solid #A1AEB4;
    border-collapse: collapse;
}

    BODY.theme .table--alt-0.table--nested.table--narrow {
        max-width: 500px;
    }

    BODY.theme .table--alt-0.table--nested THEAD TH {
        border-width: 0 0 1px 0;
        background-color: #F5F6FA;
        font-size: 1.28rem;
        text-align: center;
    }

    BODY.theme .table--alt-0.table--nested TBODY TH, BODY.theme .table--alt-0.table--nested TBODY TD {
        height: 32px;
        border-width: 0 0 1px 0;
        border-color: #A1AEB4;
        background-color: white;
        font-size: 1.1rem;
        text-align: center;
    }

BODY.theme .table--alt-1.table--nested THEAD TH {
    border-width: 0 0 1px 0;
    font-size: 1.1rem;
    text-align: center;
}

/* ---- CONDENSED TABLE ---- */
.table-wrap TABLE.table--condensed TBODY TR.row--empty {
    display: none;
}

.table-wrap TABLE.table--condensed TBODY TR.Age.row--empty {
    display: table-row;
}

.table-wrap TABLE.table--condensed TBODY TR.Chick_Count.row--empty {
    display: table-row;
}

/* ======== GRIDS (Enhanced tables) ======== */
/* ---- GRID PANEL ---- */
BODY.theme .grid-panel {
    width: 100%;
    padding: 20px;
    margin-top: 20px;
    background-color: #fff;
    -webkit-transition: all 0.4s ease-out;
    -moz-transition: all 0.4s ease-out;
    -ms-transition: all 0.4s ease-out;
    -o-transition: all 0.4s ease-out;
    transition: all 0.4s ease-out;
}

BODY.theme .grid-panel--closed {
    max-height: 0;
    padding: 0 20px;
    visibility: hidden;
}

    BODY.theme .grid-panel--closed * {
        opacity: 0;
    }

BODY.theme .grid-panel--open {
    max-height: none;
    padding: 20px;
    visibility: visible;
}

    BODY.theme .grid-panel--open * {
        opacity: 1;
    }

BODY.theme .grid-panel .panel__title {
    padding: 15px;
    font-size: 14px;
    border-bottom: 1px solid #d9d9d9;
    margin: 0px;
    font-weight: bold;
    color: rgba(0, 0, 0, 0.88);
}

BODY.theme .grid-panel .grid-wrap {
    /*max-width:860px;*/
}

BODY.theme .side-grid-outer-wrap {
    margin-bottom: 48px;
    padding-bottom: 48px;
    border-bottom: 3px solid #dadfe1;
}

BODY.theme H5.side-grid__title {
    margin-bottom: 24px;
    font-weight: 600;
}

/* ---- SPECIFIC GRIDS (for Kendo style overrides see sass/themes/msdHatchplan/msdHatch-overrides.scss) ---- */
BODY.theme .evaluations__case-name {
    /* min-width: 320px;*/
    min-width: 150px;
    white-space: normal;
    text-overflow: ellipsis;
    font-size: 1.2rem;
}

    BODY.theme .evaluations__case-name .k-cell-inner > .k-link {
        justify-content: left;
        padding-left: 20px !important;
    }

BODY.theme .evaluations__view,
BODY.theme #AdminConfigEvalType {
    text-align: center;
}

    BODY.theme .evaluations__view .k-cell-inner > .k-link,
    BODY.theme #AdminConfigEvalType .k-cell-inner > .k-link {
        justify-content: center;
    }

    BODY.theme .evaluations__view TBODY.k-table-tbody TD.k-table-td,
    BODY.theme #AdminConfigEvalType TBODY.k-table-tbody TD.k-table-td {
        text-align: center;
    }

BODY.theme .evaluations__customer,
BODY.theme .evaluations__update-date,
BODY.theme .evaluations__location,
BODY.theme .evaluations__subcutaneous,
BODY.theme .evaluations__type,
BODY.theme .evaluations__in-ovo,
BODY.theme .evaluations__spray,
BODY.theme .evaluations__chick-quality,
BODY.theme .evaluations__animal-welfare,
BODY.theme .evaluations__acer,
BODY.theme .evaluations__maxima,
BODY.theme .evaluations__tenella,
BODY.theme .evaluations__status,
BODY.theme .evaluations__update-date,
BODY.theme .evaluations__subcutaneous,
BODY.theme .evaluations__in-ovo,
BODY.theme .evaluations__spray,
BODY.theme .evaluations__chick-quality,
BODY.theme .evaluations__animal-welfare {
    max-width: 120px;
    min-width: 80px;
    text-align: center;
}

    BODY.theme .evaluations__customer .k-cell-inner > .k-link,
    BODY.theme .evaluations__update-date .k-cell-inner > .k-link,
    BODY.theme .evaluations__location .k-cell-inner > .k-link,
    BODY.theme .evaluations__subcutaneous .k-cell-inner > .k-link,
    BODY.theme .evaluations__type .k-cell-inner > .k-link,
    BODY.theme .evaluations__in-ovo .k-cell-inner > .k-link,
    BODY.theme .evaluations__spray .k-cell-inner > .k-link,
    BODY.theme .evaluations__chick-quality .k-cell-inner > .k-link,
    BODY.theme .evaluations__animal-welfare .k-cell-inner > .k-link,
    BODY.theme .evaluations__acer .k-cell-inner > .k-link,
    BODY.theme .evaluations__maxima .k-cell-inner > .k-link,
    BODY.theme .evaluations__tenella .k-cell-inner > .k-link,
    BODY.theme .evaluations__status .k-cell-inner > .k-link,
    BODY.theme .evaluations__update-date .k-cell-inner > .k-link,
    BODY.theme .evaluations__subcutaneous .k-cell-inner > .k-link,
    BODY.theme .evaluations__in-ovo .k-cell-inner > .k-link,
    BODY.theme .evaluations__spray .k-cell-inner > .k-link,
    BODY.theme .evaluations__chick-quality .k-cell-inner > .k-link,
    BODY.theme .evaluations__animal-welfare .k-cell-inner > .k-link {
        justify-content: center;
    }

BODY.theme .evaluations__view {
    text-align: center;
}

    BODY.theme .evaluations__view .k-cell-inner > .k-link {
        justify-content: center;
    }

BODY.theme .evaluations__acer,
BODY.theme .evaluations__maxima,
BODY.theme .evaluations__tenella {
    max-width: 120px;
    min-width: 80px;
    text-align: center;
}

    BODY.theme .evaluations__acer .k-cell-inner > .k-link,
    BODY.theme .evaluations__maxima .k-cell-inner > .k-link,
    BODY.theme .evaluations__tenella .k-cell-inner > .k-link {
        justify-content: center;
    }

BODY.theme .k-grid .admin-users__id,
BODY.theme .k-grid .admin-users__first-name,
BODY.theme .k-grid .admin-users__last-name,
BODY.theme .k-grid .admin-users__lfw-id,
BODY.theme .k-grid .admin-users__role-name,
BODY.theme .k-grid .admin-users__view {
    text-align: center;
}

    BODY.theme .k-grid .admin-users__id .k-cell-inner,
    BODY.theme .k-grid .admin-users__first-name .k-cell-inner,
    BODY.theme .k-grid .admin-users__last-name .k-cell-inner,
    BODY.theme .k-grid .admin-users__lfw-id .k-cell-inner,
    BODY.theme .k-grid .admin-users__role-name .k-cell-inner,
    BODY.theme .k-grid .admin-users__view .k-cell-inner {
        justify-content: left;
    }

BODY.theme .k-grid .admin-users__email {
    text-align: center;
}

    BODY.theme .k-grid .admin-users__email .k-cell-inner {
        justify-content: left;
    }

BODY.theme .k-grid .location-grid,
BODY.theme .k-grid .user-subordinate-grid {
    width: 100%;
}

BODY.theme .loadHatcheryPartial0 TABLE.table--nested {
    width: 100%;
}

BODY.theme .admin-companies__name {
    text-align: left;
    padding-left: 16px;
}

BODY.theme .admin-companies__country,
BODY.theme .admin-companies__edit,
BODY.theme .admin-companies__delete {
    text-align: center;
}

    BODY.theme .admin-companies__country .k-cell-inner,
    BODY.theme .admin-companies__edit .k-cell-inner,
    BODY.theme .admin-companies__delete .k-cell-inner {
        justify-content: center;
    }

BODY.theme .admin-countries__country,
BODY.theme .admin-countries__lockedssoculture,
BODY.theme .admin-countries__otherassignedcultures,
BODY.theme .admin-countries__edit {
    text-align: center;
}

    BODY.theme .admin-countries__country .k-cell-inner,
    BODY.theme .admin-countries__lockedssoculture .k-cell-inner,
    BODY.theme .admin-countries__otherassignedcultures .k-cell-inner,
    BODY.theme .admin-countries__edit .k-cell-inner {
        justify-content: center;
    }

BODY.theme .panel__grid--notes TH.notes__select {
    width: 24px;
}

BODY.theme .panel__grid--notes TH.notes__date {
    width: 120px;
}

BODY.theme .panel__grid--notes TH.notes__user {
    width: 160px;
}

BODY.theme .panel__grid--notes TH.notes__action {
    width: 200px;
}

BODY.theme .panel__grid--notes TH.notes__note-name {
    /*width:40%;*/
}

BODY.theme .panel__grid--notes TH.notes__buttons {
    width: 48px;
    text-align: center;
}

BODY.theme .panel__grid--uploads TH.uploads__select {
    width: 24px;
}

BODY.theme .panel__grid--uploads TH.uploads__date {
    width: 120px;
}

BODY.theme .panel__grid--uploads TH.uploads__user {
    width: 160px;
}

BODY.theme .panel__grid--uploads TH.uploads__buttons {
    text-align: center;
}

BODY.theme .summary__conditionType,
BODY.theme .summary__plus1,
BODY.theme .summary__plus2,
BODY.theme .summary__plus3,
BODY.theme .summary__plus4 {
    text-align: center;
}

    BODY.theme .summary__conditionType:last-of-type,
    BODY.theme .summary__plus1:last-of-type,
    BODY.theme .summary__plus2:last-of-type,
    BODY.theme .summary__plus3:last-of-type,
    BODY.theme .summary__plus4:last-of-type {
        text-align: center;
    }

BODY.theme .table--alt-1 TH.summary__plus1 {
    font-size: 1.504rem;
    font-weight: 600;
    color: #3cb390;
}

BODY.theme .table--alt-1 TH.summary__plus2 {
    font-size: 1.504rem;
    font-weight: 600;
    color: #cdb504;
}

BODY.theme .table--alt-1 TH.summary__plus3 {
    font-size: 1.504rem;
    font-weight: 600;
    color: #c0670a;
}

BODY.theme .table--alt-1 TH.summary__plus4 {
    font-size: 1.504rem;
    font-weight: 600;
    color: #e0002b;
}

BODY.theme TD.summary__plus1 {
    font-weight: 600;
    color: #3cb390;
}

BODY.theme TD.summary__plus2 {
    font-weight: 600;
    color: #cdb504;
}

BODY.theme TD.summary__plus3 {
    font-weight: 600;
    color: #c0670a;
}

BODY.theme TD.summary__plus4 {
    font-weight: 600;
    color: #e0002b;
}

BODY.theme .panelbar--posting-session TABLE THEAD TH,
BODY.theme #necropsyPDFPostingSession TABLE THEAD TH {
    font-weight: 700;
}

    BODY.theme .panelbar--posting-session TABLE THEAD TH:nth-child(1),
    BODY.theme #necropsyPDFPostingSession TABLE THEAD TH:nth-child(1) {
        width: 33%;
    }

    BODY.theme .panelbar--posting-session TABLE THEAD TH:nth-child(2),
    BODY.theme #necropsyPDFPostingSession TABLE THEAD TH:nth-child(2) {
        font-weight: 400;
    }

    BODY.theme .panelbar--posting-session TABLE THEAD TH:nth-child(3),
    BODY.theme #necropsyPDFPostingSession TABLE THEAD TH:nth-child(3) {
        font-weight: 600;
    }

    BODY.theme .panelbar--posting-session TABLE THEAD TH:nth-child(4),
    BODY.theme #necropsyPDFPostingSession TABLE THEAD TH:nth-child(4) {
        font-weight: 700;
    }

    BODY.theme .panelbar--posting-session TABLE THEAD TH:nth-child(5),
    BODY.theme #necropsyPDFPostingSession TABLE THEAD TH:nth-child(5) {
        font-weight: 800;
    }

BODY.theme .panelbar--posting-session TABLE TBODY TR:nth-child(1) TD,
BODY.theme #necropsyPDFPostingSession TABLE TBODY TR:nth-child(1) TD {
    color: #2B85BA;
}

BODY.theme .panelbar--posting-session TABLE TBODY TR:nth-child(2) TD,
BODY.theme #necropsyPDFPostingSession TABLE TBODY TR:nth-child(2) TD {
    color: #F48E22;
}

BODY.theme .panelbar--posting-session TABLE TBODY TR:nth-child(3) TD,
BODY.theme #necropsyPDFPostingSession TABLE TBODY TR:nth-child(3) TD {
    color: #F48E22;
}

BODY.theme .panelbar--posting-session TABLE TBODY TR:nth-child(4) TD,
BODY.theme #necropsyPDFPostingSession TABLE TBODY TR:nth-child(4) TD {
    color: #EA1A3E;
}

BODY.theme .panelbar--posting-session TABLE TBODY TH, BODY.theme .panelbar--posting-session TABLE TBODY TD,
BODY.theme #necropsyPDFPostingSession TABLE TBODY TH,
BODY.theme #necropsyPDFPostingSession TABLE TBODY TD {
    font-weight: 700;
}

    BODY.theme .panelbar--posting-session TABLE TBODY TH:nth-child(2), BODY.theme .panelbar--posting-session TABLE TBODY TD:nth-child(2),
    BODY.theme #necropsyPDFPostingSession TABLE TBODY TH:nth-child(2),
    BODY.theme #necropsyPDFPostingSession TABLE TBODY TD:nth-child(2) {
        font-weight: 400;
    }

    BODY.theme .panelbar--posting-session TABLE TBODY TH:nth-child(3), BODY.theme .panelbar--posting-session TABLE TBODY TD:nth-child(3),
    BODY.theme #necropsyPDFPostingSession TABLE TBODY TH:nth-child(3),
    BODY.theme #necropsyPDFPostingSession TABLE TBODY TD:nth-child(3) {
        font-weight: 600;
    }

    BODY.theme .panelbar--posting-session TABLE TBODY TH:nth-child(4), BODY.theme .panelbar--posting-session TABLE TBODY TD:nth-child(4),
    BODY.theme #necropsyPDFPostingSession TABLE TBODY TH:nth-child(4),
    BODY.theme #necropsyPDFPostingSession TABLE TBODY TD:nth-child(4) {
        font-weight: 700;
    }

    BODY.theme .panelbar--posting-session TABLE TBODY TH:nth-child(5), BODY.theme .panelbar--posting-session TABLE TBODY TD:nth-child(5),
    BODY.theme #necropsyPDFPostingSession TABLE TBODY TH:nth-child(5),
    BODY.theme #necropsyPDFPostingSession TABLE TBODY TD:nth-child(5) {
        font-weight: 800;
    }

BODY.theme TABLE.other-observations.table--alt-1 TBODY TH, BODY.theme TABLE.other-observations.table--alt-1 TBODY TD {
    height: 32px;
    padding: 8px;
}

/* ---- TABLE & GRID MODIFIERS ---- */
.table-wrap TR.row--acer-1.col--highlight {
    background-color: rgba(43, 133, 186, 0.33) !important;
}

.table-wrap TR.row--acer-1 TH.row-heading MARK {
    background-color: #6eb4dd;
}

.table-wrap TR.row--acer-1 TH, .table-wrap TR.row--acer-1 TD {
    /*color:lighten($colour-acer, 20%);*/
}

.table-wrap TR.row--acer-2.col--highlight {
    background-color: rgba(43, 133, 186, 0.33) !important;
}

.table-wrap TR.row--acer-2 TH.row-heading MARK {
    background-color: #449fd4;
}

.table-wrap TR.row--acer-2 TH, .table-wrap TR.row--acer-2 TD {
    /*color:lighten($colour-acer, 10%);*/
}

.table-wrap TR.row--acer-3.col--highlight {
    background-color: rgba(43, 133, 186, 0.33) !important;
}

.table-wrap TR.row--acer-3 TH.row-heading MARK {
    background-color: #2B85BA;
}

.table-wrap TR.row--acer-3 TH, .table-wrap TR.row--acer-3 TD {
    /*color:$colour-acer;*/
}

.table-wrap TR.row--acer-4.col--highlight {
    background-color: rgba(43, 133, 186, 0.33) !important;
}

.table-wrap TR.row--acer-4 TH.row-heading MARK {
    background-color: #1d597c;
}

.table-wrap TR.row--acer-4 TH, .table-wrap TR.row--acer-4 TD {
    /*color:darken($colour-acer, 15%);*/
}

.table-wrap TR.row--mivati-1.col--highlight {
    background-color: rgba(128, 93, 175, 0.33) !important;
}

.table-wrap TR.row--mivati-1 TH.row-heading MARK {
    background-color: #b6a1d1;
}

.table-wrap TR.row--mivati-1 TH, .table-wrap TR.row--mivati-1 TD {
    /*color:lighten($colour-mivati, 20%);*/
}

.table-wrap TR.row--mivati-2.col--highlight {
    background-color: rgba(128, 93, 175, 0.33) !important;
}

.table-wrap TR.row--mivati-2 TH.row-heading MARK {
    background-color: #9b7fc0;
}

.table-wrap TR.row--mivati-2 TH, .table-wrap TR.row--mivati-2 TD {
    /*color:lighten($colour-mivati, 10%);*/
}

.table-wrap TR.row--mivati-3.col--highlight {
    background-color: rgba(128, 93, 175, 0.33) !important;
}

.table-wrap TR.row--mivati-3 TH.row-heading MARK {
    background-color: #805DAF;
}

.table-wrap TR.row--mivati-3 TH, .table-wrap TR.row--mivati-3 TD {
    /*color:$colour-mivati;*/
}

.table-wrap TR.row--mivati-4.col--highlight {
    background-color: rgba(128, 93, 175, 0.33) !important;
}

.table-wrap TR.row--mivati-4 TH.row-heading MARK {
    background-color: #5b3f80;
}

.table-wrap TR.row--mivati-4 TH, .table-wrap TR.row--mivati-4 TD {
    /*color:darken($colour-mivati, 15%);*/
}

.table-wrap TR.row--maxima-1.col--highlight {
    background-color: rgba(244, 142, 34, 0.33) !important;
}

.table-wrap TR.row--maxima-1 TH.row-heading MARK {
    background-color: #f9c083;
}

.table-wrap TR.row--maxima-1 TH, .table-wrap TR.row--maxima-1 TD {
    /*color:lighten($colour-maxima, 20%);*/
}

.table-wrap TR.row--maxima-2.col--highlight {
    background-color: rgba(244, 142, 34, 0.33) !important;
}

.table-wrap TR.row--maxima-2 TH.row-heading MARK {
    background-color: #f6a753;
}

.table-wrap TR.row--maxima-2 TH, .table-wrap TR.row--maxima-2 TD {
    /*color:lighten($colour-maxima, 10%);*/
}

.table-wrap TR.row--maxima-3.col--highlight {
    background-color: rgba(244, 142, 34, 0.33) !important;
}

.table-wrap TR.row--maxima-3 TH.row-heading MARK {
    background-color: #F48E22;
}

.table-wrap TR.row--maxima-3 TH, .table-wrap TR.row--maxima-3 TD {
    /*color:$colour-maxima;*/
}

.table-wrap TR.row--maxima-4.col--highlight {
    background-color: rgba(244, 142, 34, 0.33) !important;
}

.table-wrap TR.row--maxima-4 TH.row-heading MARK {
    background-color: #c0670a;
}

.table-wrap TR.row--maxima-4 TH, .table-wrap TR.row--maxima-4 TD {
    /*color:darken($colour-maxima, 15%);*/
}

.table-wrap TR.row--tenella-1.col--highlight {
    background-color: rgba(234, 26, 62, 0.33) !important;
}

.table-wrap TR.row--tenella-1 TH.row-heading MARK {
    background-color: #f3778d;
}

.table-wrap TR.row--tenella-1 TH, .table-wrap TR.row--tenella-1 TD {
    /*color:lighten($colour-tenella, 20%);*/
}

.table-wrap TR.row--tenella-2.col--highlight {
    background-color: rgba(234, 26, 62, 0.33) !important;
}

.table-wrap TR.row--tenella-2 TH.row-heading MARK {
    background-color: #ee4965;
}

.table-wrap TR.row--tenella-2 TH, .table-wrap TR.row--tenella-2 TD {
    /*color:lighten($colour-tenella, 10%);*/
}

.table-wrap TR.row--tenella-3.col--highlight {
    background-color: rgba(234, 26, 62, 0.33) !important;
}

.table-wrap TR.row--tenella-3 TH.row-heading MARK {
    background-color: #EA1A3E;
}

.table-wrap TR.row--tenella-3 TH, .table-wrap TR.row--tenella-3 TD {
    /*color:$colour-tenella;*/
}

.table-wrap TR.row--tenella-4.col--highlight {
    background-color: rgba(234, 26, 62, 0.33) !important;
}

.table-wrap TR.row--tenella-4 TH.row-heading MARK {
    background-color: #a80f2a;
}

.table-wrap TR.row--tenella-4 TH, .table-wrap TR.row--tenella-4 TD {
    /*color:darken($colour-tenella, 15%);*/
}

/* ============================================================== MEDIA QUERIES ============================================================== */
/* ---- LARGE DESKTOP (1600px +) ---- */
@media only screen and (min-width: 1600px) {
    /* ---- GRID PANEL ---- */
    BODY.theme .grid-panel .table-wrap > TABLE,
    BODY.theme .grid-panel .grid-wrap > TABLE {
        /*min-width:980px;*/
    }
}

/* ---- SMALL DESKTOP (1440px - 1599px) ---- */
@media only screen and (min-width: 1440px) and (max-width: 1600px) {
    /* ---- GRID PANEL ---- */
    BODY.theme .grid-panel .table-wrap > TABLE,
    BODY.theme .grid-panel .grid-wrap > TABLE {
        /*min-width:960px;*/
    }
}

/* ---- LAPTOP (1280px +) ---- */
@media only screen and (min-width: 1280px) {
    /* ---- GRID PANEL ---- */
    BODY.theme .side-grid-outer-wrap {
        padding-left: 20px;
    }
}

/* ---- MOBILE TO LARGE TABLET (0 - 1279px) ---- */
@media only screen and (max-width: 1279px) {
    /* ---- GRID PANEL ---- */
    BODY.theme .grid-panel .table-wrap > TABLE,
    BODY.theme .grid-panel .grid-wrap > TABLE {
        /*min-width:920px;*/
    }
    /* ---- SPECIFIC GRIDS ---- */
    BODY.theme .evaluations__case-name {
        max-width: 480px;
    }
}

/* ---- LARGE TABLET (960px - 1279px) ---- */
@media only screen and (min-width: 960px) and (max-width: 1279px) {
    BODY.theme .table--alt-1 THEAD TH {
        font-size: 1rem;
    }
}

/* ---- SMALL TABLET (640px - 959px) ---- */
/* ---- LARGE MOBILE (480px - 639px) ---- */
/* ---- SMALL MOBILE (0 - 479px) ---- */
/* ===========================================================

	MSD HATCHPLAN FORM SASS (2019)

=========================================================== */
/* ---- FORM PANEL ---- */
BODY.theme .form-panel {
    width: 100%;
    padding: 0px 16px;
    background-color: #fff;
    -webkit-transition: all 0.4s ease-out;
    -moz-transition: all 0.4s ease-out;
    -ms-transition: all 0.4s ease-out;
    -o-transition: all 0.4s ease-out;
    transition: all 0.4s ease-out;
}

    body.theme .form-panel:has(fieldset) {
        padding: 0;
    }


    BODY.theme .form-panel.form-panel--alt-1 {
        background-color: #FFF;
    }

    BODY.theme .form-panel .legend-text {
        padding: 0;
        margin-bottom: 1.9rem;
        font-family: 'Invention', sans-serif;
        font-size: 1.504rem;
        font-weight: 500;
    }

    BODY.theme .form-panel.form-panel--filter {
        border-radius: 0;
        background-color: #fff
    }

        BODY.theme .form-panel.form-panel--filter LABEL {
            color: #FFF;
        }

        BODY.theme .form-panel.form-panel--filter * {
            -webkit-transition: all 0.4s ease;
            -moz-transition: all 0.4s ease;
            -ms-transition: all 0.4s ease;
            -o-transition: all 0.4s ease;
            transition: all 0.4s ease;
        }

BODY.theme .form-panel--closed {
    max-height: 0;
    padding: 0 20px;
    visibility: hidden;
}

    BODY.theme .form-panel--closed * {
        opacity: 0;
    }

BODY.theme .form-panel--open {
    max-height: none;
    padding: 20px;
    visibility: visible;
}

    BODY.theme .form-panel--open * {
        opacity: 1;
    }

BODY.theme .form-panel.form-panel--notes,
BODY.theme .form-panel.form-panel--upload {
    margin-bottom: 20px;
}

BODY.theme .tab-panel__content .grid-panel.grid-panel--notes,
BODY.theme .tab-panel__content .grid-panel.grid-panel--uploads {
    padding: 20px;
}

    BODY.theme .tab-panel__content .grid-panel.grid-panel--notes H4.panel__title,
    BODY.theme .tab-panel__content .grid-panel.grid-panel--uploads H4.panel__title {
        margin: 0 0 20px;
    }

/* ---- FIELDSET ---- */
BODY.theme .form-panel.form-panel--fieldsets FIELDSET {
    position: relative;
    padding: 0px 16px;
    margin-bottom: 0px;
    border: 0px;
    overflow: visible;
}

    BODY.theme .form-panel.form-panel--fieldsets FIELDSET:nth-of-type(even) {
        background-color: #fff;
    }

    BODY.theme .form-panel.form-panel--fieldsets FIELDSET:nth-of-type(odd) {
        background-color: #fff;
    }

    BODY.theme .form-panel.form-panel--fieldsets FIELDSET.fieldset--no-legend {
        padding: 16px;
    }

BODY.theme .form-panel.form-panel--fieldsets LEGEND {
    position: relative;
    left: -18px;
    background-color: #E6F3F2;
    display: flex;
    width: calc(100% + 36px);
    margin: 0px;
    height: 58px;
    align-items: center;
    padding: 0px 17px;
    font-family: 'Invention', sans-serif;
    font-size: 14px;
    color: rgba(0, 0, 0, 0.88);
    text-transform: capitalize;
}

BODY.theme .form-panel.form-panel--fieldsets FIELDSET > legend:first-of-type + label {
    color: rgba(0, 0, 0, 0.88);
    font-size: 14px;
    display: flex;
    background-color: #f5f5f5;
    padding: 13px 18px;
    width: calc(100% + 36px);
    position: relative;
    left: -18px;
    margin-bottom: 20px;
    align-items: center;
}

    BODY.theme .form-panel.form-panel--fieldsets fieldset > legend:first-of-type + label:empty {
        padding: 0px;
        height: 0px;
    }

BODY.theme FIELDSET.fieldset--small:last-of-type {
    margin-bottom: 0;
}

BODY.theme FIELDSET.fieldset--emphasised {
    background-color: #0C2340;
    border-color: #040c15;
    border-radius: 6px;
}

BODY.theme FIELDSET.fieldset--small.fieldset--emphasised {
    min-height: 152px;
    padding: 48px 20px;
}

BODY.theme FIELDSET.fieldset--panel {
    border-radius: 0px;
    margin-bottom: 0px;
}

    BODY.theme FIELDSET.fieldset--panel:last-of-type {
        margin-bottom: 0;
    }

BODY.theme FIELDSET.fieldset--full-height {
    height: 100%;
}

/* ---- STANDARD FIELD ---- */
BODY.theme .field {
    margin-bottom: 20px;
}

    BODY.theme .field:last-of-type {
        margin-bottom: 0;
    }

    /* ---- EMPHASISED FIELD ---- */
    BODY.theme .field.field--emphasised {
        -webkit-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-align-items: center;
        align-items: center;
    }

/* ======== STANDARD FORM ELEMENTS ======== */
/* ---- LABELS ---- */
BODY.theme .field--emphasised LABEL {
    padding-left: 0;
    font-size: 1.504rem;
    font-weight: 500;
    color: #FBE122;
    white-space: pre;
}

BODY.theme .field.field--sub-input LABEL.label--question {
    -webkit-box-flex: 1 1 auto;
    -webkit-flex: 1 1 auto;
    -moz-flex: 1 1 auto;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
}

/* ---- BOX BASED INPUTS ---- */
BODY.theme INPUT[type="text"],
BODY.theme INPUT[type="password"],
BODY.theme INPUT[type="email"],
BODY.theme INPUT[type="url"],
BODY.theme INPUT[type="number"],
BODY.theme INPUT[type="time"],
BODY.theme INPUT[type="date"],
BODY.theme INPUT[type="datetime"],
BODY.theme INPUT[type="datetime-local"],
BODY.theme INPUT[type="week"],
BODY.theme INPUT[type="month"],
BODY.theme INPUT[type="search"],
BODY.theme INPUT[type="tel"],
BODY.theme SELECT,
BODY.theme TEXTAREA {
    -webkit-box-flex: 1 1 auto;
    -webkit-flex: 1 1 auto;
    -moz-flex: 1 1 auto;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    height: 36px;
    padding: 6px 12px;
    margin: 0;
    border: 0;
    border-radius: 6px;
    background-color: #e4e7f2;
    font-size: 1.504rem;
    color: #1b1b1b;
}

    BODY.theme INPUT[type="text"]:focus,
    BODY.theme INPUT[type="password"]:focus,
    BODY.theme INPUT[type="email"]:focus,
    BODY.theme INPUT[type="url"]:focus,
    BODY.theme INPUT[type="number"]:focus,
    BODY.theme INPUT[type="time"]:focus,
    BODY.theme INPUT[type="date"]:focus,
    BODY.theme INPUT[type="datetime"]:focus,
    BODY.theme INPUT[type="datetime-local"]:focus,
    BODY.theme INPUT[type="week"]:focus,
    BODY.theme INPUT[type="month"]:focus,
    BODY.theme INPUT[type="search"]:focus,
    BODY.theme INPUT[type="tel"]:focus,
    BODY.theme SELECT:focus,
    BODY.theme TEXTAREA:focus {
        background-color: #d3d7e9;
    }

    BODY.theme INPUT[type="text"]:disabled,
    BODY.theme INPUT[type="password"]:disabled,
    BODY.theme INPUT[type="email"]:disabled,
    BODY.theme INPUT[type="url"]:disabled,
    BODY.theme INPUT[type="number"]:disabled,
    BODY.theme INPUT[type="time"]:disabled,
    BODY.theme INPUT[type="date"]:disabled,
    BODY.theme INPUT[type="datetime"]:disabled,
    BODY.theme INPUT[type="datetime-local"]:disabled,
    BODY.theme INPUT[type="week"]:disabled,
    BODY.theme INPUT[type="month"]:disabled,
    BODY.theme INPUT[type="search"]:disabled,
    BODY.theme INPUT[type="tel"]:disabled,
    BODY.theme SELECT:disabled,
    BODY.theme TEXTAREA:disabled {
        background: #E4E7EB;
        opacity: 0.7;
        color: #414E54;
    }

    BODY.theme INPUT[readonly="readonly"],
    BODY.theme SELECT[readonly="readonly"],
    BODY.theme TEXTAREA[readonly="readonly"] {
        background: #E4E7EB !important;
        opacity: 0.7 !important;
        color: #414E54 !important;
    }

BODY.theme .page-content .field INPUT[type="text"],
BODY.theme .page-content .field INPUT[type="password"],
BODY.theme .page-content .field INPUT[type="email"],
BODY.theme .page-content .field INPUT[type="url"],
BODY.theme .page-content .field INPUT[type="number"],
BODY.theme .page-content .field INPUT[type="time"],
BODY.theme .page-content .field INPUT[type="date"],
BODY.theme .page-content .field INPUT[type="datetime"],
BODY.theme .page-content .field INPUT[type="datetime-local"],
BODY.theme .page-content .field INPUT[type="week"],
BODY.theme .page-content .field INPUT[type="month"],
BODY.theme .page-content .field INPUT[type="search"],
BODY.theme .page-content .field INPUT[type="tel"],
BODY.theme .page-content .field SELECT,
BODY.theme .page-content .field TEXTAREA,
BODY.theme .k-window .field INPUT[type="text"],
BODY.theme .k-window .field INPUT[type="password"],
BODY.theme .k-window .field INPUT[type="email"],
BODY.theme .k-window .field INPUT[type="url"],
BODY.theme .k-window .field INPUT[type="number"],
BODY.theme .k-window .field INPUT[type="time"],
BODY.theme .k-window .field INPUT[type="date"],
BODY.theme .k-window .field INPUT[type="datetime"],
BODY.theme .k-window .field INPUT[type="datetime-local"],
BODY.theme .k-window .field INPUT[type="week"],
BODY.theme .k-window .field INPUT[type="month"],
BODY.theme .k-window .field INPUT[type="search"],
BODY.theme .k-window .field INPUT[type="tel"],
BODY.theme .k-window .field SELECT,
BODY.theme .k-window .field TEXTAREA {
    -webkit-box-flex: 1 1 auto;
    -webkit-flex: 1 1 auto;
    -moz-flex: 1 1 auto;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    height: 32px;
    padding: 10px 6px;
    margin: 0;
    border: 1px solid #949494;
    background-color: #FFF;
    font-family: 'Invention', sans-serif;
    font-size: 14px;
    color: rgba(0, 0, 0, 0.88);
    border-radius: 0px;
}

    BODY.theme .page-content .field INPUT[type="text"]:focus,
    BODY.theme .page-content .field INPUT[type="password"]:focus,
    BODY.theme .page-content .field INPUT[type="email"]:focus,
    BODY.theme .page-content .field INPUT[type="url"]:focus,
    BODY.theme .page-content .field INPUT[type="number"]:focus,
    BODY.theme .page-content .field INPUT[type="time"]:focus,
    BODY.theme .page-content .field INPUT[type="date"]:focus,
    BODY.theme .page-content .field INPUT[type="datetime"]:focus,
    BODY.theme .page-content .field INPUT[type="datetime-local"]:focus,
    BODY.theme .page-content .field INPUT[type="week"]:focus,
    BODY.theme .page-content .field INPUT[type="month"]:focus,
    BODY.theme .page-content .field INPUT[type="search"]:focus,
    BODY.theme .page-content .field INPUT[type="tel"]:focus,
    BODY.theme .page-content .field SELECT:focus,
    BODY.theme .page-content .field TEXTAREA:focus,
    BODY.theme .k-window .field INPUT[type="text"]:focus,
    BODY.theme .k-window .field INPUT[type="password"]:focus,
    BODY.theme .k-window .field INPUT[type="email"]:focus,
    BODY.theme .k-window .field INPUT[type="url"]:focus,
    BODY.theme .k-window .field INPUT[type="number"]:focus,
    BODY.theme .k-window .field INPUT[type="time"]:focus,
    BODY.theme .k-window .field INPUT[type="date"]:focus,
    BODY.theme .k-window .field INPUT[type="datetime"]:focus,
    BODY.theme .k-window .field INPUT[type="datetime-local"]:focus,
    BODY.theme .k-window .field INPUT[type="week"]:focus,
    BODY.theme .k-window .field INPUT[type="month"]:focus,
    BODY.theme .k-window .field INPUT[type="search"]:focus,
    BODY.theme .k-window .field INPUT[type="tel"]:focus,
    BODY.theme .k-window .field SELECT:focus,
    BODY.theme .k-window .field TEXTAREA:focus {
        background-color: #e6e6e6;
    }

    BODY.theme .page-content .field INPUT[type="text"]:disabled,
    BODY.theme .page-content .field INPUT[type="password"]:disabled,
    BODY.theme .page-content .field INPUT[type="email"]:disabled,
    BODY.theme .page-content .field INPUT[type="url"]:disabled,
    BODY.theme .page-content .field INPUT[type="number"]:disabled,
    BODY.theme .page-content .field INPUT[type="time"]:disabled,
    BODY.theme .page-content .field INPUT[type="date"]:disabled,
    BODY.theme .page-content .field INPUT[type="datetime"]:disabled,
    BODY.theme .page-content .field INPUT[type="datetime-local"]:disabled,
    BODY.theme .page-content .field INPUT[type="week"]:disabled,
    BODY.theme .page-content .field INPUT[type="month"]:disabled,
    BODY.theme .page-content .field INPUT[type="search"]:disabled,
    BODY.theme .page-content .field INPUT[type="tel"]:disabled,
    BODY.theme .page-content .field SELECT:disabled,
    BODY.theme .page-content .field TEXTAREA:disabled,
    BODY.theme .k-window .field INPUT[type="text"]:disabled,
    BODY.theme .k-window .field INPUT[type="password"]:disabled,
    BODY.theme .k-window .field INPUT[type="email"]:disabled,
    BODY.theme .k-window .field INPUT[type="url"]:disabled,
    BODY.theme .k-window .field INPUT[type="number"]:disabled,
    BODY.theme .k-window .field INPUT[type="time"]:disabled,
    BODY.theme .k-window .field INPUT[type="date"]:disabled,
    BODY.theme .k-window .field INPUT[type="datetime"]:disabled,
    BODY.theme .k-window .field INPUT[type="datetime-local"]:disabled,
    BODY.theme .k-window .field INPUT[type="week"]:disabled,
    BODY.theme .k-window .field INPUT[type="month"]:disabled,
    BODY.theme .k-window .field INPUT[type="search"]:disabled,
    BODY.theme .k-window .field INPUT[type="tel"]:disabled,
    BODY.theme .k-window .field SELECT:disabled,
    BODY.theme .k-window .field TEXTAREA:disabled {
        background: #E4E7EB;
        opacity: 0.7;
        color: #414E54;
    }

BODY.theme .page-content .field.field--sub-input INPUT,
BODY.theme .k-window .field.field--sub-input INPUT {
    -webkit-box-flex: 0 1 14%;
    -webkit-flex: 0 1 14%;
    -moz-flex: 0 1 14%;
    -ms-flex: 0 1 14%;
    flex: 0 1 14%;
    min-width: 0;
    margin-top: -6px;
}

BODY.theme .k-window .field LABEL.label--question, BODY.theme .k-window .field LABEL.label--long, BODY.theme .k-window .field LABEL.label--question.label--long {
    font-size: 16px;
    color: rgba(0, 0, 0, 0.88);
    font-family: 'Invention', sans-serif;
}

BODY.theme .k-window .field INPUT[type="text"],
BODY.theme .k-window .field INPUT[type="password"],
BODY.theme .k-window .field INPUT[type="email"],
BODY.theme .k-window .field INPUT[type="url"],
BODY.theme .k-window .field INPUT[type="number"],
BODY.theme .k-window .field INPUT[type="time"],
BODY.theme .k-window .field INPUT[type="date"],
BODY.theme .k-window .field INPUT[type="datetime"],
BODY.theme .k-window .field INPUT[type="datetime-local"],
BODY.theme .k-window .field INPUT[type="week"],
BODY.theme .k-window .field INPUT[type="month"],
BODY.theme .k-window .field INPUT[type="search"],
BODY.theme .k-window .field INPUT[type="tel"],
BODY.theme .k-window .field SELECT,
BODY.theme .k-window .field TEXTAREA {
    font-size: 1.28rem;
}

BODY.theme .page-content .field--emphasised INPUT[type="number"] {
    font-family: 'Invention', sans-serif;
    font-size: 18px;
}

/* ---- LABELS ---- */
BODY.theme LABEL {
    font-family: 'Invention', sans-serif;
    font-size: 1.1rem;
    color: #1b1b1b;
    text-align: left;
}

    BODY.theme LABEL.label--non-field {
        font-weight: 500;
    }

BODY.theme .field LABEL {
    -webkit-box-flex: 0 1 75%;
    -webkit-flex: 0 1 75%;
    -moz-flex: 0 1 75%;
    -ms-flex: 0 1 75%;
    flex: 0 1 75%;
    color: rgba(0, 0, 0, 0.88);
    text-transform:capitalize;
    font-size: 15px;
}

BODY.theme .field.field--adjacent LABEL {
    flex: none;
    width: 100%;
}

BODY.theme .field LABEL.label--character--count {
    -webkit-box-flex: 0 1 100%;
    -webkit-flex: 0 1 100%;
    -moz-flex: 0 1 100%;
    -ms-flex: 0 1 100%;
    flex: 0 1 100%;
    font-weight: 700;
    text-transform: uppercase;
    height: auto;
    padding: 0px;
}

BODY.theme .field.field--group-input LABEL {
    -webkit-box-flex: 0 1 30%;
    -webkit-flex: 0 1 30%;
    -moz-flex: 0 1 30%;
    -ms-flex: 0 1 30%;
    flex: 0 1 30%;
}

BODY.theme .field LABEL.label--question {
    -webkit-box-flex: 0 1 75%;
    -webkit-flex: 0 1 75%;
    -moz-flex: 0 1 75%;
    -ms-flex: 0 1 75%;
    flex: 0 1 75%;
}

    BODY.theme .field LABEL.label--question.label--short {
        font-size: 1.1rem;
        font-weight: 700;
        text-transform: uppercase;
    }

    BODY.theme .field LABEL.label--question.label--long {
        font-size: 16px;
        color: rgba(0, 0, 0, 0.88);
        font-weight: normal;
        text-transform: none;
        padding-left: 0px;
    }

BODY.theme .sub-field LABEL.label--reason {
    -webkit-box-flex: 0 1 60%;
    -webkit-flex: 0 1 60%;
    -moz-flex: 0 1 60%;
    -ms-flex: 0 1 60%;
    flex: 0 1 60%;
    font-size: 1.28rem;
    font-weight: 400;
    text-transform: none;
    text-align: right;
}

BODY.theme .flex-column.flex-column--half LABEL {
    -webkit-box-flex: 0 1 33.33%;
    -webkit-flex: 0 1 33.33%;
    -moz-flex: 0 1 33.33%;
    -ms-flex: 0 1 33.33%;
    flex: 0 1 33.33%;
}

/* ---- VALIDATION MESSAGE ---- */
BODY.theme .field.field--errors LABEL {
    position: relative;
    color: #FF2D55;
}

    BODY.theme .field.field--errors LABEL:after {
        content: '\ea07';
        position: absolute;
        top: 0;
        bottom: 0;
        right: 12px;
        height: 20px;
        margin: auto;
        font-family: "IcoMoon Basic";
        font-size: 18px;
        font-weight: 500;
        color: #FF2D55;
    }

BODY.theme .field.field--errors INPUT, BODY.theme .field.field--errors SELECT, BODY.theme .field.field--errors TEXTAREA {
    border: 2px solid #FF2D55;
}

BODY.theme .field INPUT[type="text"].input-validation-error {
    border: 2px solid #FF2D55;
}

BODY.theme .field-validation-error,
BODY.theme .field .validation {
    -webkit-box-flex: 0 1 75%;
    -webkit-flex: 0 1 75%;
    -moz-flex: 0 1 75%;
    -ms-flex: 0 1 75%;
    flex: 0 1 75%;
    /*margin-left:25%;*/
    font-weight: 600;
    color: #FF2D55;
}

    BODY.theme .field-validation-error P,
    BODY.theme .field .validation P {
        margin-bottom: 0;
        font-weight: inherit;
        color: #FF2D55;
    }

BODY.theme .field .k-invalid {
    border: 2px solid #FF2D55 !important;
}

BODY.theme .field .field.field--errors {
    -webkit-box-flex: 0 1 100%;
    -webkit-flex: 0 1 100%;
    -moz-flex: 0 1 100%;
    -ms-flex: 0 1 100%;
    flex: 0 1 100%;
    padding-left: 0%;
    margin-bottom: 0;
}

    BODY.theme .field .field.field--errors .validation {
        -webkit-box-flex: 0 1 100%;
        -webkit-flex: 0 1 100%;
        -moz-flex: 0 1 100%;
        -ms-flex: 0 1 100%;
        flex: 0 1 100%;
        margin: 0;
    }

        BODY.theme .field .field.field--errors .validation > SPAN {
            margin-left: 0;
        }

    BODY.theme .field .field.field--errors .k-tooltip:not(.k-tooltip-closable) {
        font-size: 1rem;
    }

BODY.theme .field.field--major .field.field--errors {
    padding-left: 72%;
}

BODY.theme .field.field--minor .field.field--errors {
    padding-left: 0;
}

BODY.theme DIV.field > SPAN.field-validation-error {
    -webkit-box-flex: 0 1 100%;
    -webkit-flex: 0 1 100%;
    -moz-flex: 0 1 100%;
    -ms-flex: 0 1 100%;
    flex: 0 1 100%;
    padding-left: 60%;
    margin: 0;
}

/* ---- RADIO & CHECKBOXES  ---- */
BODY.theme INPUT[type="radio"] {
    width: auto;
    height: auto;
}

.notes-summary-container INPUT[type="checkbox"].k-checkbox.chkbox + LABEL {
    margin: auto 12px auto 6px;
}

/* ---- RADIO SWITCH BLOCKS ---- */
BODY.theme .radio-switch-block {
    -webkit-box-flex: 1 1 25%;
    -webkit-flex: 1 1 25%;
    -moz-flex: 1 1 25%;
    -ms-flex: 1 1 25%;
    flex: 1 1 25%;
    padding: 0px;
    border: 1px solid #949494;
    border-radius: 0px;
    background-color: #FFF;
}

    BODY.theme .radio-switch-block > INPUT[type="radio"] {
        /* See: /sass/components/forms.scss */
    }

    BODY.theme .radio-switch-block > LABEL {
        -webkit-box-flex: 1 1 auto;
        -webkit-flex: 1 1 auto;
        -moz-flex: 1 1 auto;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
        padding: 10px 12px 6px 12px;
        border: 1px solid transparent;
        border-radius: 6px;
        background-color: #FFF;
        -webkit-transition: all 0.4s ease-out;
        -moz-transition: all 0.4s ease-out;
        -ms-transition: all 0.4s ease-out;
        -o-transition: all 0.4s ease-out;
        transition: all 0.4s ease-out;
        text-align: center;
        text-transform: capitalize;
        font-family: 'Invention', sans-serif;
        font-size: 1.1rem;
        font-weight: 500;
        color: #1b1b1b;
    }

    BODY.theme .radio-switch-block > INPUT[type="radio"] + LABEL {
        /* margin-right: 4px;  */
    }

    BODY.theme .radio-switch-block > INPUT[type="radio"]:checked + LABEL {
        background-color: #00857C;
        border-color: transparent;
        color: #fff;
        border-radius: 0px;
        font-size: 14px;
    }

    BODY.theme .radio-switch-block > INPUT[type="radio"]:focus + LABEL {
        border: 1px solid #00857C;
    }

    BODY.theme .radio-switch-block.radio-switch-block--error {
        border: 2px solid #FF2D55;
    }

/* ---- FIELD IMAGES & MEDIA ---- */
BODY.theme .field.field--images {
    border-bottom: 1px solid #dadfe1;
    padding-bottom: 20px;
    margin-bottom: 20px;
}

    BODY.theme .field.field--images LABEL.label--question {
        -webkit-box-flex: 0 1 75%;
        -webkit-flex: 0 1 75%;
        -moz-flex: 0 1 75%;
        -ms-flex: 0 1 75%;
        flex: 0 1 75%;
    }

        BODY.theme .field.field--images LABEL.label--question.label--short, BODY.theme .field.field--images LABEL.label--question.label--long {
            font-size: 1.504rem;
            font-weight: 500;
            text-transform: none;
        }

    BODY.theme .field.field--images .radio-switch-block {
        -webkit-box-flex: 0 1 25%;
        -webkit-flex: 0 1 25%;
        -moz-flex: 0 1 25;
        -ms-flex: 0 1 25%;
        flex: 0 1 25%;
    }

    BODY.theme .field.field--images .field-media {
        -webkit-box-flex: 0 1 100%;
        -webkit-flex: 0 1 100%;
        -moz-flex: 0 1 100%;
        -ms-flex: 0 1 100%;
        flex: 0 1 100%;
        margin-top: 20px;
    }

/* ---- NOTES TEXTAREA ---- */
BODY.theme .field TEXTAREA.notes-textarea {
    -webkit-box-flex: 1 1 100%;
    -webkit-flex: 1 1 100%;
    -moz-flex: 1 1 100%;
    -ms-flex: 1 1 100%;
    flex: 1 1 100%;
    padding: 20px;
    min-height: 30rem;
    font-size: 1.28rem;
    color: #414E54;
    width: 100%;
}

/* ---- GROUP INPUTS ---- */
BODY.theme .field.field--group-input:last-of-type {
    margin-bottom: 20px;
}

BODY.theme LABEL.group-input__label {
    padding: 8px 12px 8px 8px;
}

BODY.theme TEXTAREA.group-input__textarea {
    -webkit-box-flex: 0 1 70%;
    -webkit-flex: 0 1 70%;
    -moz-flex: 0 1 70%;
    -ms-flex: 0 1 70%;
    flex: 0 1 70%;
    margin-top: 20px;
    margin-left: 30%;
}

BODY.theme .group-input__subfield.group-input__subfield--E_Acervulina-1,
BODY.theme .group-input__subfield.group-input__subfield--good-acer {
    background-color: rgba(43, 133, 186, 0.25);
    border-color: #216791;
}

BODY.theme .group-input__subfield.group-input__subfield--E_Acervulina-2,
BODY.theme .group-input__subfield.group-input__subfield--fair-acer {
    background-color: rgba(43, 133, 186, 0.5);
    border-color: #216791;
}

BODY.theme .group-input__subfield.group-input__subfield--E_Acervulina-3,
BODY.theme .group-input__subfield.group-input__subfield--poor-acer {
    background-color: rgba(43, 133, 186, 0.75);
    border-color: #1d597c;
}

    BODY.theme .group-input__subfield.group-input__subfield--E_Acervulina-3 .group-input__label,
    BODY.theme .group-input__subfield.group-input__subfield--poor-acer .group-input__label {
        color: #FFF;
    }

BODY.theme .group-input__subfield.group-input__subfield--E_Acervulina-4,
BODY.theme .group-input__subfield.group-input__subfield--bad-acer {
    background-color: #2b85ba;
    border-color: #0e2c3e;
}

    BODY.theme .group-input__subfield.group-input__subfield--E_Acervulina-4 .group-input__label,
    BODY.theme .group-input__subfield.group-input__subfield--bad-acer .group-input__label {
        color: #FFF;
    }

BODY.theme .group-input__subfield.group-input__subfield--E_MaximaGrossLesions-1,
BODY.theme .group-input__subfield.group-input__subfield--good-maxima {
    background-color: rgba(244, 142, 34, 0.25);
    border-color: #d8740b;
}

BODY.theme .group-input__subfield.group-input__subfield--E_MaximaGrossLesions-2,
BODY.theme .group-input__subfield.group-input__subfield--fair-maxima {
    background-color: rgba(244, 142, 34, 0.5);
    border-color: #d8740b;
}

BODY.theme .group-input__subfield.group-input__subfield--E_MaximaGrossLesions-3,
BODY.theme .group-input__subfield.group-input__subfield--poor-maxima {
    background-color: rgba(244, 142, 34, 0.75);
    border-color: #c0670a;
}

    BODY.theme .group-input__subfield.group-input__subfield--E_MaximaGrossLesions-3 .group-input__label,
    BODY.theme .group-input__subfield.group-input__subfield--poor-maxima .group-input__label {
        /*color:$baseColourBright;*/
    }

BODY.theme .group-input__subfield.group-input__subfield--E_MaximaGrossLesions-4,
BODY.theme .group-input__subfield.group-input__subfield--bad-maxima {
    background-color: #f48e22;
    border-color: #a85a08;
}

    BODY.theme .group-input__subfield.group-input__subfield--E_MaximaGrossLesions-4 .group-input__label,
    BODY.theme .group-input__subfield.group-input__subfield--bad-maxima .group-input__label {
        color: #FFF;
    }

BODY.theme .group-input__subfield.group-input__subfield--E_MaximaMicroscopicLesions-1,
BODY.theme .group-input__subfield.group-input__subfield--good-maxima-micro {
    background-color: rgba(244, 142, 34, 0.25);
    border-color: #d8740b;
}

BODY.theme .group-input__subfield.group-input__subfield--E_MaximaMicroscopicLesions-2,
BODY.theme .group-input__subfield.group-input__subfield--fair-maxima-micro {
    background-color: rgba(244, 142, 34, 0.5);
    border-color: #d8740b;
}

BODY.theme .group-input__subfield.group-input__subfield--E_MaximaMicroscopicLesions-3,
BODY.theme .group-input__subfield.group-input__subfield--poor-maxima-micro {
    background-color: rgba(244, 142, 34, 0.75);
    border-color: #c0670a;
}

    BODY.theme .group-input__subfield.group-input__subfield--E_MaximaMicroscopicLesions-3 .group-input__label,
    BODY.theme .group-input__subfield.group-input__subfield--poor-maxima-micro .group-input__label {
        /*color:$baseColourBright;*/
    }

BODY.theme .group-input__subfield.group-input__subfield--E_MaximaMicroscopicLesions-4,
BODY.theme .group-input__subfield.group-input__subfield--bad-maxima-micro {
    background-color: #f48e22;
    border-color: #774006;
}

    BODY.theme .group-input__subfield.group-input__subfield--E_MaximaMicroscopicLesions-4 .group-input__label,
    BODY.theme .group-input__subfield.group-input__subfield--bad-maxima-micro .group-input__label {
        color: #FFF;
    }

BODY.theme .group-input__subfield.group-input__subfield--E_Tenella-1,
BODY.theme .group-input__subfield.group-input__subfield--good-tenella {
    background-color: rgba(234, 26, 62, 0.25);
    border-color: #bf1230;
}

BODY.theme .group-input__subfield.group-input__subfield--E_Tenella-2,
BODY.theme .group-input__subfield.group-input__subfield--fair-tenella {
    background-color: rgba(234, 26, 62, 0.5);
    border-color: #bf1230;
}

BODY.theme .group-input__subfield.group-input__subfield--E_Tenella-3,
BODY.theme .group-input__subfield.group-input__subfield--poor-tenella {
    background-color: rgba(234, 26, 62, 0.75);
    border-color: #a80f2a;
}

    BODY.theme .group-input__subfield.group-input__subfield--E_Tenella-3 .group-input__label,
    BODY.theme .group-input__subfield.group-input__subfield--poor-tenella .group-input__label {
        color: #FFF;
    }

BODY.theme .group-input__subfield.group-input__subfield--E_Tenella-4,
BODY.theme .group-input__subfield.group-input__subfield--bad-tenella {
    background-color: #ea1a3e;
    border-color: #910d24;
}

    BODY.theme .group-input__subfield.group-input__subfield--E_Tenella-4 .group-input__label,
    BODY.theme .group-input__subfield.group-input__subfield--bad-tenella .group-input__label {
        color: #FFF;
    }

BODY.theme .group-input__subfield.group-input__subfield--E_Mivati-1,
BODY.theme .group-input__subfield.group-input__subfield--good-mivati {
    background-color: rgba(128, 93, 175, 0.25);
    border-color: #674891;
}

BODY.theme .group-input__subfield.group-input__subfield--E_Mivati-2,
BODY.theme .group-input__subfield.group-input__subfield--fair-mivati {
    background-color: rgba(128, 93, 175, 0.5);
    border-color: #674891;
}

BODY.theme .group-input__subfield.group-input__subfield--E_Mivati-3,
BODY.theme .group-input__subfield.group-input__subfield--poor-mivati {
    background-color: rgba(128, 93, 175, 0.75);
    border-color: #5b3f80;
}

    BODY.theme .group-input__subfield.group-input__subfield--E_Mivati-3 .group-input__label,
    BODY.theme .group-input__subfield.group-input__subfield--poor-mivati .group-input__label {
        color: #FFF;
    }

BODY.theme .group-input__subfield.group-input__subfield--E_Mivati-4,
BODY.theme .group-input__subfield.group-input__subfield--bad-mivati {
    background-color: #805daf;
    border-color: #4f376f;
}

    BODY.theme .group-input__subfield.group-input__subfield--E_Mivati-4 .group-input__label,
    BODY.theme .group-input__subfield.group-input__subfield--bad-mivati .group-input__label {
        color: #FFF;
    }

BODY.theme .group-input__subfield.group-input__subfield--bursa {
    -webkit-transition: opacity 0.2s ease;
    -moz-transition: opacity 0.2s ease;
    -ms-transition: opacity 0.2s ease;
    -o-transition: opacity 0.2s ease;
    transition: opacity 0.2s ease;
}

    BODY.theme .group-input__subfield.group-input__subfield--bursa.group-input__subfield--1, BODY.theme .group-input__subfield.group-input__subfield--bursa.group-input__subfield--2 {
        background-color: rgba(110, 206, 178, 0.25);
        border-color: #3cb390;
    }

    BODY.theme .group-input__subfield.group-input__subfield--bursa.group-input__subfield--3, BODY.theme .group-input__subfield.group-input__subfield--bursa.group-input__subfield--4 {
        background-color: rgba(251, 225, 34, 0.25);
        border-color: #cdb504;
    }

    BODY.theme .group-input__subfield.group-input__subfield--bursa.group-input__subfield--5, BODY.theme .group-input__subfield.group-input__subfield--bursa.group-input__subfield--6 {
        background-color: rgba(244, 142, 34, 0.25);
        border-color: #c0670a;
        opacity: 0;
    }

    BODY.theme .group-input__subfield.group-input__subfield--bursa.group-input__subfield--7, BODY.theme .group-input__subfield.group-input__subfield--bursa.group-input__subfield--8 {
        background-color: rgba(255, 45, 85, 0.25);
        border-color: #e0002b;
        opacity: 0;
    }

BODY.theme .field.field--group-input.group-input--new-line .group-input__subfield--5 {
    opacity: 1;
}

BODY.theme .field.field--group-input.group-input--new-line ~ .field.field--group-input .group-input__subfield--6,
BODY.theme .field.field--group-input.group-input--new-line ~ .field.field--group-input .group-input__subfield--7,
BODY.theme .field.field--group-input.group-input--new-line ~ .field.field--group-input .group-input__subfield--8 {
    opacity: 1;
}

/* ---- POSTING GROUPS ---- */
BODY.theme .field.field--clinical-obs {
    margin-bottom: 0;
}

BODY.theme .posting-group-controls-dock {
    min-height: 153px;
    margin-bottom: 20px;
}

BODY.theme .posting-group-controls .fieldset--emphasised INPUT[type="number"] {
    max-width: 100px;
    font-size: 18px;
}

BODY.theme .posting-group-controls .fieldset--panel {
    margin-top: -10px;
    padding-bottom: 16px;
}

BODY.theme .posting-group-controls .check-wrap {
    flex: 0 1 24.5%;
    flex-wrap: nowrap;
}

    BODY.theme .posting-group-controls .check-wrap LABEL {
        white-space: nowrap;
        font-size: 1rem;
    }

        BODY.theme .posting-group-controls .check-wrap LABEL A {
            color: #058C83;
            -webkit-transition: color 0.4s ease;
            -moz-transition: color 0.4s ease;
            -ms-transition: color 0.4s ease;
            -o-transition: color 0.4s ease;
            transition: color 0.4s ease;
        }

            BODY.theme .posting-group-controls .check-wrap LABEL A:hover {
                color: #07bdb1;
            }

            BODY.theme .posting-group-controls .check-wrap LABEL A:active {
                color: #058C83;
            }

BODY.theme .posting-group-controls.posting-group-controls--fixed {
    position: fixed;
    top: 148px;
    z-index: 300;
    width: 1020px;
    margin-left: -40px;
}

    BODY.theme .posting-group-controls.posting-group-controls--fixed .flex-column {
        padding-right: 0;
    }

        BODY.theme .posting-group-controls.posting-group-controls--fixed .flex-column:nth-child(2) {
            -webkit-box-flex: 1 1 auto !important;
            -webkit-flex: 1 1 auto !important;
            -moz-flex: 1 1 auto !important;
            -ms-flex: 1 1 auto !important;
            flex: 1 1 auto !important;
        }

    BODY.theme .posting-group-controls.posting-group-controls--fixed FIELDSET.fieldset--small.fieldset--emphasised {
        min-height: 48px;
        padding: 8px 20px;
        border-right: none;
        border-radius: 0;
        margin-right: 0;
        margin-left: 0;
    }

        BODY.theme .posting-group-controls.posting-group-controls--fixed FIELDSET.fieldset--small.fieldset--emphasised INPUT[type="number"] {
            height: 36px;
            padding: 6px;
            font-size: 1.28rem;
        }

        BODY.theme .posting-group-controls.posting-group-controls--fixed FIELDSET.fieldset--small.fieldset--emphasised LABEL {
            height: 36px;
            padding: 8px 16px 8px 0;
            font-size: 1.28rem !important;
        }

    BODY.theme .posting-group-controls.posting-group-controls--fixed FIELDSET.fieldset--panel {
        min-height: 48px;
        padding: 8px 8px 6px;
        border-radius: 0;
        margin: 0;
        border-left: none;
        border-color: #08172b;
        background-color: #0C2340;
    }

        BODY.theme .posting-group-controls.posting-group-controls--fixed FIELDSET.fieldset--panel LEGEND {
            display: none;
        }

        BODY.theme .posting-group-controls.posting-group-controls--fixed FIELDSET.fieldset--panel .check-wrap {
            -webkit-box-flex: 1 1 auto;
            -webkit-flex: 1 1 auto;
            -moz-flex: 1 1 auto;
            -ms-flex: 1 1 auto;
            flex: 1 1 auto;
            height: 28px;
            padding-top: 0;
        }

            BODY.theme .posting-group-controls.posting-group-controls--fixed FIELDSET.fieldset--panel .check-wrap LABEL {
                padding: 6px;
                color: #FBE122;
                white-space: nowrap;
            }

                BODY.theme .posting-group-controls.posting-group-controls--fixed FIELDSET.fieldset--panel .check-wrap LABEL A {
                    color: #FBE122;
                    -webkit-transition: color 0.4s ease;
                    -moz-transition: color 0.4s ease;
                    -ms-transition: color 0.4s ease;
                    -o-transition: color 0.4s ease;
                    transition: color 0.4s ease;
                }

                    BODY.theme .posting-group-controls.posting-group-controls--fixed FIELDSET.fieldset--panel .check-wrap LABEL A:hover {
                        color: #fce854;
                    }

                    BODY.theme .posting-group-controls.posting-group-controls--fixed FIELDSET.fieldset--panel .check-wrap LABEL A:active {
                        color: #FBE122;
                    }

/* ---- FARM NOTES (Necropsy Summary) ---- */
BODY.theme .farm-note-wrap INS {
    height: auto;
}

/* ---- VALIDATION ---- */
BODY.theme .k-widget.k-tooltip.k-tooltip-validation.k-invalid-msg.field-validation-error {
    background-color: transparent;
}

/* ---- ADMIN AREA : USERS ---- */
#UserSubordinatesDropDownList {
    -webkit-box-flex: 1 1 auto;
    -webkit-flex: 1 1 auto;
    -moz-flex: 1 1 auto;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
}

.user-subordinates-panel .panel-item {
    margin-bottom: 2px;
}

    .user-subordinates-panel .panel-item I.icon {
        margin-right: 4px;
    }

BODY.theme .admin_Edit_User_Container .field.field--tall.location-grid-container {
    margin-top: -64px;
}

/* ---- ENABLE/ DISABLE SECTION ---- */
/*.overlay-disable-section                                          {position:absolute; z-index:9; top:0; bottom:0; left:0; right:0; background-color:grey;}
.overlay-disable-section.show                                       {display:block;}
.overlay-disable-section.hide                                       {display:none;}
.questions-container                                                {position:relative; padding:0;}*/
/* ============================================================== MEDIA QUERIES ============================================================== */
/* ---- MEDIUM DESKTOP (1440px - 1599px) ---- */
@media only screen and (min-width: 1440px) and (max-width: 1599px) {
    /* ---- POSTING GROUPS ---- */
    BODY.theme .posting-group-controls.posting-group-controls--fixed {
        width: 1061px;
    }
}

/* ---- LARGE LAPTOP & SMALL DESKTOP (1280px - 1439px) ---- */
@media only screen and (min-width: 1280px) and (max-width: 1439px) {
    /* ---- POSTING GROUPS ---- */
    BODY.theme .posting-group-controls.posting-group-controls--fixed {
        width: 937px;
        margin-left: -40px;
    }
    /* ---- LABELS ---- */
    BODY.theme LABEL.label--question LABEL.label--question LABEL.label--question,
    BODY.theme LABEL.label--question LABEL.label--question .radio-switch-block, BODY.theme LABEL.label--question.field--images LABEL.label--question,
    BODY.theme LABEL.label--question.field--images .radio-switch-block,
    BODY.theme .field LABEL.label--question LABEL.label--question,
    BODY.theme .field LABEL.label--question .radio-switch-block,
    BODY.theme .field.field--images LABEL.label--question,
    BODY.theme .field.field--images .radio-switch-block {
        -webkit-box-flex: 0 1 100%;
        -webkit-flex: 0 1 100%;
        -moz-flex: 0 1 100%;
        -ms-flex: 0 1 100%;
        flex: 0 1 100%;
        max-width: 100%;
    }

    BODY.theme LABEL.label--question.field--yes-no-na LABEL.label--question,
    BODY.theme .field.field--yes-no-na LABEL.label--question {
        -webkit-box-flex: 0 1 100%;
        -webkit-flex: 0 1 100%;
        -moz-flex: 0 1 100%;
        -ms-flex: 0 1 100%;
        flex: 0 1 100%;
        max-width: 100%;
    }

    BODY.theme LABEL.label--question.field--yes-no-na.field--images .radio-switch-block,
    BODY.theme .field.field--yes-no-na.field--images .radio-switch-block {
        -webkit-box-flex: 0 1 100%;
        -webkit-flex: 0 1 100%;
        -moz-flex: 0 1 100%;
        -ms-flex: 0 1 100%;
        flex: 0 1 100%;
        max-width: 100%;
    }
}

/* ---- LARGE TABLET (960px - 1439px) ---- */
@media only screen and (min-width: 960px) and (max-width: 1439px) {
    /* ---- POSTING GROUPS ---- */
    BODY.theme .posting-group-controls FIELDSET.fieldset--small.fieldset--emphasised LABEL {
        font-size: 1.28rem;
    }
}

/* ---- LARGE TABLET (960px - 1279px) ---- */
@media only screen and (min-width: 960px) and (max-width: 1279px) {
    /* ---- LABELS ---- */
    BODY.theme LABEL.label--question LABEL.label--question LABEL.label--question, BODY.theme LABEL.label--question.field--images LABEL.label--question,
    BODY.theme .field LABEL.label--question LABEL.label--question,
    BODY.theme .field.field--images LABEL.label--question {
        -webkit-box-flex: 0 1 100%;
        -webkit-flex: 0 1 100%;
        -moz-flex: 0 1 100%;
        -ms-flex: 0 1 100%;
        flex: 0 1 100%;
    }

    BODY.theme LABEL.label--question LABEL.label--question .radio-switch-block, BODY.theme LABEL.label--question.field--images .radio-switch-block,
    BODY.theme .field LABEL.label--question .radio-switch-block,
    BODY.theme .field.field--images .radio-switch-block {
        -webkit-box-flex: 0 1 100%;
        -webkit-flex: 0 1 100%;
        -moz-flex: 0 1 100%;
        -ms-flex: 0 1 100%;
        flex: 0 1 100%;
    }

    BODY.theme LABEL.label--question.field--yes-no-na LABEL.label--question,
    BODY.theme .field.field--yes-no-na LABEL.label--question {
        -webkit-box-flex: 0 1 100%;
        -webkit-flex: 0 1 100%;
        -moz-flex: 0 1 100%;
        -ms-flex: 0 1 100%;
        flex: 0 1 100%;
    }
    /* ---- GROUP INPUTS ---- */
    BODY.theme .field.field--group-input {
        display: -webkit-box;
        /* OLD - iOS 6-, Safari 3.1-6 */
        display: -moz-box;
        /* OLD - Firefox 19- */
        display: -ms-flexbox;
        /* OLD - TWEENER - IE 10 */
        display: -webkit-flex;
        /* RECENT - Chrome */
        display: flex;
        /* NEW - Firefox, Chrome, Opera, IE11 */
        -webkit-flex-direction: row;
        -moz-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-justify-content: flex-start;
        justify-content: flex-start;
        -webkit-align-items: flex-start;
        align-items: flex-start;
        -webkit-align-content: flex-start;
        align-content: flex-start;
    }

        BODY.theme .field.field--group-input .group-input__subfield {
            padding: 0;
            margin-right: 24px;
        }

    BODY.theme LABEL.group-input__label {
        padding: 8px 4px;
    }
    /* ---- POSTING GROUPS ---- */
    BODY.theme .posting-group-controls.posting-group-controls--fixed {
        width: 100%;
        left: 0;
        margin-left: 0;
    }

    BODY.theme .posting-group-controls .check-wrap LABEL {
        font-size: 1rem;
        padding-right: 4px;
    }

    BODY.theme .posting-group-controls FIELDSET.fieldset--panel.fieldset--small {
        padding: 20px;
    }

    BODY.theme .posting-group-controls FIELDSET.fieldset--panel .check-wrap {
        -webkit-box-flex: 1 1 auto;
        -webkit-flex: 1 1 auto;
        -moz-flex: 1 1 auto;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
    }

    BODY.theme .posting-group-controls.posting-group-controls--fixed FIELDSET.fieldset--panel.fieldset--small {
        padding: 8px 8px 6px;
    }

    BODY.theme .posting-group-controls.posting-group-controls--fixed FIELDSET.fieldset--panel .check-wrap {
        -webkit-box-flex: 1 1 auto;
        -webkit-flex: 1 1 auto;
        -moz-flex: 1 1 auto;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
    }
}

/* ---- MOBILE TO PORTRAIT TABLET (0 - 1024px) ---- */
@media only screen and (max-width: 1023px) {
    /* ---- GROUP INPUTS ---- */
    BODY.theme .field.field--group-input > LABEL {
        -webkit-box-flex: 0 1 100%;
        -webkit-flex: 0 1 100%;
        -moz-flex: 0 1 100%;
        -ms-flex: 0 1 100%;
        flex: 0 1 100%;
    }
    /* ---- POSTING GROUP RADIO SWITCH BLOCKS ---- */
    BODY.theme .fieldset--panel .field.field--switch-block {
        -webkit-box-flex: 1 1 100%;
        -webkit-flex: 1 1 100%;
        -moz-flex: 1 1 100%;
        -ms-flex: 1 1 100%;
        flex: 1 1 100%;
        display: -webkit-box;
        /* OLD - iOS 6-, Safari 3.1-6 */
        display: -moz-box;
        /* OLD - Firefox 19- */
        display: -ms-flexbox;
        /* OLD - TWEENER - IE 10 */
        display: -webkit-flex;
        /* RECENT - Chrome */
        display: flex;
        /* NEW - Firefox, Chrome, Opera, IE11 */
        -webkit-flex-direction: row;
        -moz-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-justify-content: flex-start;
        justify-content: flex-start;
        -webkit-align-items: flex-start;
        align-items: flex-start;
        -webkit-align-content: flex-start;
        align-content: flex-start;
    }

        BODY.theme .fieldset--panel .field.field--switch-block LABEL.label--long {
            -webkit-box-flex: 1 1 100%;
            -webkit-flex: 1 1 100%;
            -moz-flex: 1 1 100%;
            -ms-flex: 1 1 100%;
            flex: 1 1 100%;
        }

        BODY.theme .fieldset--panel .field.field--switch-block INPUT.radio-switch-block {
            -webkit-box-flex: 0 1 auto;
            -webkit-flex: 0 1 auto;
            -moz-flex: 0 1 auto;
            -ms-flex: 0 1 auto;
            flex: 0 1 auto;
        }
    /* ---- VALIDATION ALT VERSION ---- */
    BODY.theme .field .field.field--errors,
    BODY.theme .field.field--major .field.field--errors,
    BODY.theme .field.field--minor .field.field--errors {
        padding-left: 0;
    }

        BODY.theme .field .field.field--errors .validation > P > SPAN {
            margin-left: 0;
        }

    BODY.theme DIV.field > SPAN.field-validation-error {
        padding-left: 0;
    }
}

/* ---- MOBILE TO SMALL TABLET (0 - 959px) ---- */
@media only screen and (max-width: 959px) {
    /* ---- FIELDSET ---- */
    BODY.theme FIELDSET.fieldset--small.fieldset--emphasised {
        min-height: 0;
        padding: 24px;
        margin-bottom: 20px;
    }

    BODY.theme .form-panel.form-panel--fieldsets FIELDSET {
        /*padding:$spaceSize-extra 0 $spaceSize-small;*/
    }

    BODY.theme .form-panel.form-panel--fieldsets LEGEND {
        top: 0;
        left: 0;
    }
    /* ---- FIELDS ---- */
    BODY.theme .page-content .field.field--emphasised {
        -webkit-flex-direction: row;
        -moz-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-align-items: flex-start;
        align-items: flex-start;
    }

        BODY.theme .page-content .field.field--emphasised .k-widget.k-numerictextbox {
            width: auto;
            max-width: none;
        }
    /* ---- LABELS ---- */
    BODY.theme .field LABEL.label--question {
        -webkit-box-flex: 1 1 auto;
        -webkit-flex: 1 1 auto;
        -moz-flex: 1 1 auto;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
        height: auto;
        min-height: 40px;
        font-size: 1.28rem;
    }
    /* ---- GROUP INPUTS ---- */
    BODY.theme .field.field--group-input {
        display: -webkit-box;
        /* OLD - iOS 6-, Safari 3.1-6 */
        display: -moz-box;
        /* OLD - Firefox 19- */
        display: -ms-flexbox;
        /* OLD - TWEENER - IE 10 */
        display: -webkit-flex;
        /* RECENT - Chrome */
        display: flex;
        /* NEW - Firefox, Chrome, Opera, IE11 */
        -webkit-flex-direction: row;
        -moz-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-justify-content: flex-start;
        justify-content: flex-start;
        -webkit-align-items: flex-start;
        align-items: flex-start;
        -webkit-align-content: flex-start;
        align-content: flex-start;
    }

        BODY.theme .field.field--group-input .group-input__subfield {
            padding: 0;
            margin-right: 8px;
        }

        BODY.theme .field.field--group-input > LABEL {
            -webkit-box-flex: 0 1 100%;
            -webkit-flex: 0 1 100%;
            -moz-flex: 0 1 100%;
            -ms-flex: 0 1 100%;
            flex: 0 1 100%;
        }

    BODY.theme LABEL.group-input__label {
        padding: 8px 4px;
    }
    /* ---- POSTING GROUPS ---- */
    BODY.theme .posting-group-controls.flex-column-wrap {
        -webkit-flex-direction: column;
        -moz-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
    }

        BODY.theme .posting-group-controls.flex-column-wrap .flex-column {
            padding-right: 0;
        }

    BODY.theme .posting-group-controls FIELDSET.fieldset--panel .field {
        display: -webkit-box;
        /* OLD - iOS 6-, Safari 3.1-6 */
        display: -moz-box;
        /* OLD - Firefox 19- */
        display: -ms-flexbox;
        /* OLD - TWEENER - IE 10 */
        display: -webkit-flex;
        /* RECENT - Chrome */
        display: flex;
        /* NEW - Firefox, Chrome, Opera, IE11 */
        -webkit-flex-direction: row;
        -moz-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-justify-content: flex-start;
        justify-content: flex-start;
        -webkit-align-items: flex-start;
        align-items: flex-start;
        -webkit-align-content: flex-start;
        align-content: flex-start;
    }

    BODY.theme .posting-group-controls FIELDSET.fieldset--panel .check-wrap {
        -webkit-box-flex: 0 1 50%;
        -webkit-flex: 0 1 50%;
        -moz-flex: 0 1 50%;
        -ms-flex: 0 1 50%;
        flex: 0 1 50%;
    }

    BODY.theme .posting-group-controls.posting-group-controls--fixed {
        width: 100%;
        top: 140px;
        left: 0;
        margin-left: 0;
    }

        BODY.theme .posting-group-controls.posting-group-controls--fixed.flex-column-wrap {
            -webkit-flex-direction: row;
            -moz-flex-direction: row;
            -ms-flex-direction: row;
            flex-direction: row;
        }

        BODY.theme .posting-group-controls.posting-group-controls--fixed FIELDSET.fieldset--small.fieldset--emphasised {
            min-height: 52px;
            margin-bottom: 0;
        }

            BODY.theme .posting-group-controls.posting-group-controls--fixed FIELDSET.fieldset--small.fieldset--emphasised .field {
                display: -webkit-box;
                /* OLD - iOS 6-, Safari 3.1-6 */
                display: -moz-box;
                /* OLD - Firefox 19- */
                display: -ms-flexbox;
                /* OLD - TWEENER - IE 10 */
                display: -webkit-flex;
                /* RECENT - Chrome */
                display: flex;
                /* NEW - Firefox, Chrome, Opera, IE11 */
                -webkit-flex-direction: row;
                -moz-flex-direction: row;
                -ms-flex-direction: row;
                flex-direction: row;
                -webkit-flex-wrap: nowrap;
                flex-wrap: nowrap;
                -webkit-justify-content: flex-start;
                justify-content: flex-start;
                -webkit-align-items: flex-start;
                align-items: flex-start;
                -webkit-align-content: flex-start;
                align-content: flex-start;
            }

            BODY.theme .posting-group-controls.posting-group-controls--fixed FIELDSET.fieldset--small.fieldset--emphasised INPUT[type="number"],
            BODY.theme .posting-group-controls.posting-group-controls--fixed FIELDSET.fieldset--small.fieldset--emphasised INPUT[type="text"],
            BODY.theme .posting-group-controls.posting-group-controls--fixed FIELDSET.fieldset--small.fieldset--emphasised .k-widget.k-numerictextbox {
                max-width: 64px;
            }

            BODY.theme .posting-group-controls.posting-group-controls--fixed FIELDSET.fieldset--small.fieldset--emphasised LABEL {
                font-size: 1.1rem;
            }

        BODY.theme .posting-group-controls.posting-group-controls--fixed FIELDSET.fieldset--panel {
            min-height: 48px;
            padding: 8px 8px 6px !important;
            border-radius: 0;
            margin: 0;
            border-left: none;
            border-color: #08172b;
            background-color: #0C2340;
        }

            BODY.theme .posting-group-controls.posting-group-controls--fixed FIELDSET.fieldset--panel .field {
                display: -webkit-box;
                /* OLD - iOS 6-, Safari 3.1-6 */
                display: -moz-box;
                /* OLD - Firefox 19- */
                display: -ms-flexbox;
                /* OLD - TWEENER - IE 10 */
                display: -webkit-flex;
                /* RECENT - Chrome */
                display: flex;
                /* NEW - Firefox, Chrome, Opera, IE11 */
                -webkit-flex-direction: row;
                -moz-flex-direction: row;
                -ms-flex-direction: row;
                flex-direction: row;
                -webkit-flex-wrap: nowrap;
                flex-wrap: nowrap;
                -webkit-justify-content: flex-start;
                justify-content: flex-start;
                -webkit-align-items: flex-start;
                align-items: flex-start;
                -webkit-align-content: flex-start;
                align-content: flex-start;
            }

            BODY.theme .posting-group-controls.posting-group-controls--fixed FIELDSET.fieldset--panel .check-wrap {
                -webkit-box-flex: 1 1 auto;
                -webkit-flex: 1 1 auto;
                -moz-flex: 1 1 auto;
                -ms-flex: 1 1 auto;
                flex: 1 1 auto;
            }

                BODY.theme .posting-group-controls.posting-group-controls--fixed FIELDSET.fieldset--panel .check-wrap LABEL {
                    padding: 7px 4px 0px 3px;
                    font-size: 0.9rem;
                }
    /* ---- SUB FIELD ---- */
    BODY.theme .field.field--sub-input INPUT {
        -webkit-box-flex: 0 0 48px;
        -webkit-flex: 0 0 48px;
        -moz-flex: 0 0 48px;
        -ms-flex: 0 0 48px;
        flex: 0 0 48px;
        width: 100%;
    }
    /* ---- RADIO & CHECKBOXES  ---- */
    .legend-text {
        display: block;
    }

    .notes-summary-container {
        display: block;
        float: none;
        position: absolute;
        width: 100%;
        text-align: right;
        margin-top: -8px;
    }
    /* ---- CHANGE LFW ID BUTTON ---- */
    BODY.theme .buttons.buttons--flex-ends.custom-margin-bottom {
        margin-top: 20px;
    }
}

/* ---- LARGE MOBILE (480px - 767px) ---- */
@media only screen and (min-width: 480px) and (max-width: 767px) {
    /* ---- POSTING GROUPS ---- */
    BODY.theme .posting-group-controls--fixed FIELDSET.fieldset--small.fieldset--emphasised {
        min-height: 52px;
        padding: 8px;
    }

        BODY.theme .posting-group-controls--fixed FIELDSET.fieldset--small.fieldset--emphasised LABEL {
            padding: 8px 8px 8px 0;
            font-size: 0.9rem !important;
        }

    BODY.theme .posting-group-controls--fixed FIELDSET.fieldset--panel .check-wrap LABEL {
        padding: 8px 0 0 4px;
        font-size: 0.7rem;
    }
}

/* ===========================================================

    MSD HATCHPLAN LOGIN SASS (2019)  

=========================================================== */
BODY.body--login.theme {
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- */
    display: -ms-flexbox;
    /* OLD - TWEENER - IE 10 */
    display: -webkit-flex;
    /* RECENT - Chrome */
    display: flex;
    /* NEW - Firefox, Chrome, Opera, IE11 */
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -webkit-align-items: stretch;
    align-items: stretch;
    -webkit-align-content: flex-start;
    align-content: flex-start;
    height: auto;
    min-height: 100%;
    background-color: #0C2340;
}

/* ---- LOGIN PAGE HEADER ---- */
BODY.theme HEADER.site-header.site-header--login {
    -webkit-box-flex: 0 0 100px;
    -webkit-flex: 0 0 100px;
    -moz-flex: 0 0 100px;
    -ms-flex: 0 0 100px;
    flex: 0 0 100px;
    min-height: 0;
    box-shadow: none;
}

    BODY.theme HEADER.site-header.site-header--login.site-header--device {
        background-size: auto;
    }

    BODY.theme HEADER.site-header.site-header--login .header__logo {
        margin-left: 90px;
    }

/* ---- LOGIN PAGE MAIN ---- */
BODY.theme MAIN.page-main.page-main--login {
    -webkit-box-flex: 1 0 auto;
    -webkit-flex: 1 0 auto;
    -moz-flex: 1 0 auto;
    -ms-flex: 1 0 auto;
    flex: 1 0 auto;
    height: unset;
    min-height: 0;
    padding-bottom: 48px;
    padding-left: 48px;
    background-color: #0C2340;
    color: #FFF;
}

BODY.theme H1.login-page__title {
    margin: 80px 0 32px;
    line-height: 1.1;
    font-size: 4.88281rem;
    color: #FFF;
}

    BODY.theme H1.login-page__title SPAN.alt {
        color: #FBE122;
    }

BODY.theme .public-page__title {
    color: #FFF;
}

    BODY.theme .public-page__title SPAN.alt {
        color: #FBE122;
        text-transform: capitalize;
    }

BODY.theme .page-main--login .flex-column.flex-column--login-main {
    -webkit-box-flex: 0 1 33.335%;
    -webkit-flex: 0 1 33.335%;
    -moz-flex: 0 1 33.335%;
    -ms-flex: 0 1 33.335%;
    flex: 0 1 33.335%;
    max-width: 33.335%;
}

BODY.theme .page-main--login .flex-column.flex-column--login-image {
    -webkit-box-flex: 0 1 66.665%;
    -webkit-flex: 0 1 66.665%;
    -moz-flex: 0 1 66.665%;
    -ms-flex: 0 1 66.665%;
    flex: 0 1 66.665%;
    max-width: 66.665%;
}

/* ---- LOGIN PAGE FOOTER ---- */
BODY.theme FOOTER.site-footer.site-footer--login {
    -webkit-box-flex: 0 1 150px;
    -webkit-flex: 0 1 150px;
    -moz-flex: 0 1 150px;
    -ms-flex: 0 1 150px;
    flex: 0 1 150px;
    min-height: 150px;
}

/* ---- LOGIN FORM PANEL ---- */
BODY.theme .form-panel.form-panel--login {
    background-color: rgba(255, 255, 255, 0.33);
}

    BODY.theme .form-panel.form-panel--login .field LABEL {
        -webkit-box-flex: 0 0 100%;
        -webkit-flex: 0 0 100%;
        -moz-flex: 0 0 100%;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        padding-left: 0;
        font-weight: 500;
        text-transform: uppercase;
    }

/* ============================================================== MEDIA QUERIES ============================================================== */
/* ---- LARGE DESKTOP (1600px +) ---- */
/* ---- SMALL DESKTOP (1440px - 1599px) ---- */
@media only screen and (min-width: 1440px) and (max-width: 1600px) {
    /* ---- LOGIN PAGE MAIN ---- */
    BODY.theme MAIN.page-main.page-main--login {
        padding-left: 0px;
    }

    BODY.theme H1.login-page__title {
        margin-top: 32px;
        font-size: 3.90625rem;
    }
}

/* ---- LAPTOP (1280px - 1439px) ---- */
@media only screen and (min-width: 1280px) and (max-width: 1439px) {
    /* ---- LOGIN PAGE MAIN ---- */
    BODY.theme MAIN.page-main.page-main--login {
        padding-left: 100px;
    }

    BODY.theme H1.login-page__title {
        margin-top: 48px;
        font-size: 32px;
    }
}

/* ---- LAPTOP AND ABOVE (1280px +) ---- */
@media only screen and (min-width: 1280px) {
    /* ---- LOGIN PAGE MAIN ---- */
    BODY.theme MAIN.page-main.page-main--login {
        height: auto;
    }
}

/* ---- MOBILE TO LARGE TABLET (0 - 1279px) ---- */
@media only screen and (max-width: 1279px) {
    /* ---- LOGIN PAGE MAIN ---- */
    BODY.theme .page-main.page-main--login .page-limits {
        padding-left: 48px;
    }

    BODY.theme H1.login-page__title {
        font-size: 3.90625rem;
    }
    /* ---- LOGIN PAGE HEADER ---- */
    BODY.theme .site-header.site-header--login .header-columns {
        -webkit-align-items: flex-start;
        align-items: flex-start;
    }
    /* ---- LOGIN PAGE MAIN ---- */
    BODY.theme .page-main--login .flex-column.flex-column--login-main {
        -webkit-box-flex: 0 1 50%;
        -webkit-flex: 0 1 50%;
        -moz-flex: 0 1 50%;
        -ms-flex: 0 1 50%;
        flex: 0 1 50%;
        max-width: 50%;
    }

    BODY.theme .page-main--login .flex-column.flex-column--login-image {
        -webkit-box-flex: 0 1 50%;
        -webkit-flex: 0 1 50%;
        -moz-flex: 0 1 50%;
        -ms-flex: 0 1 50%;
        flex: 0 1 50%;
        max-width: 50%;
    }
    /* ---- LOGIN PAGE FOOTER ---- */
    BODY.theme FOOTER.site-footer.site-footer--login {
        -webkit-box-flex: 0 1 180px;
        -webkit-flex: 0 1 180px;
        -moz-flex: 0 1 180px;
        -ms-flex: 0 1 180px;
        flex: 0 1 180px;
        min-height: 180px;
    }
}

/* ---- LARGE TABLET (960px - 1279px) ---- */
@media only screen and (min-width: 960px) and (max-width: 1279px) {
    /* ---- LOGIN PAGE MAIN ---- */
    BODY.theme .page-main--login .flex-column.flex-column--login-main {
        -webkit-box-flex: 0 1 60%;
        -webkit-flex: 0 1 60%;
        -moz-flex: 0 1 60%;
        -ms-flex: 0 1 60%;
        flex: 0 1 60%;
        max-width: 60%;
    }

    BODY.theme .page-main--login .flex-column.flex-column--login-image {
        -webkit-box-flex: 0 1 40%;
        -webkit-flex: 0 1 40%;
        -moz-flex: 0 1 40%;
        -ms-flex: 0 1 40%;
        flex: 0 1 40%;
        max-width: 40%;
    }
}

/* ---- SMALL TABLET (640px - 959px) ---- */
@media only screen and (min-width: 600px) and (max-width: 959px) {
    /* ---- LOGIN PAGE MAIN ---- */
    BODY.theme .page-main--login .flex-column.flex-column--login-main {
        -webkit-box-flex: 0 1 66.665%;
        -webkit-flex: 0 1 66.665%;
        -moz-flex: 0 1 66.665%;
        -ms-flex: 0 1 66.665%;
        flex: 0 1 66.665%;
        max-width: 66.665%;
    }

    BODY.theme .page-main--login .flex-column.flex-column--login-image {
        -webkit-box-flex: 0 1 33.335%;
        -webkit-flex: 0 1 33.335%;
        -moz-flex: 0 1 33.335%;
        -ms-flex: 0 1 33.335%;
        flex: 0 1 33.335%;
        max-width: 33.335%;
    }
}

/* ---- LARGE MOBILE (480px - 639px) ---- */
@media only screen and (min-width: 480px) and (max-width: 599px) {
    /* ---- LOGIN PAGE MAIN ---- */
    BODY.theme H1.login-page__title {
        font-size: 3.125rem;
    }

    BODY.theme .page-main--login .flex-column.flex-column--login-main {
        -webkit-box-flex: 0 1 75%;
        -webkit-flex: 0 1 75%;
        -moz-flex: 0 1 75%;
        -ms-flex: 0 1 75%;
        flex: 0 1 75%;
        max-width: 75%;
    }

    BODY.theme .page-main--login .flex-column.flex-column--login-image {
        -webkit-box-flex: 0 1 25%;
        -webkit-flex: 0 1 25%;
        -moz-flex: 0 1 25%;
        -ms-flex: 0 1 25%;
        flex: 0 1 25%;
        max-width: 25%;
    }
    /* ---- LOGIN PAGE FOOTER (Merck Theme) ---- */
    BODY.theme .site-footer.site-footer--login {
        -webkit-box-flex: 0 1 auto;
        -webkit-flex: 0 1 auto;
        -moz-flex: 0 1 auto;
        -ms-flex: 0 1 auto;
        flex: 0 1 auto;
        min-height: 0;
    }
}

/* ---- SMALL MOBILE (0 - 479px) ---- */
@media only screen and (max-width: 479px) {
    /* ---- LOGIN PAGE MAIN ---- */
    BODY.theme H1.login-page__title {
        font-size: 2.5rem;
    }

    BODY.theme .page-main--login .flex-column.flex-column--login-main {
        -webkit-box-flex: 0 1 100%;
        -webkit-flex: 0 1 100%;
        -moz-flex: 0 1 100%;
        -ms-flex: 0 1 100%;
        flex: 0 1 100%;
        max-width: 100%;
    }

    BODY.theme .page-main--login .flex-column.flex-column--login-image {
        -webkit-box-flex: 0 1 0%;
        -webkit-flex: 0 1 0%;
        -moz-flex: 0 1 0%;
        -ms-flex: 0 1 0%;
        flex: 0 1 0%;
        max-width: 0%;
    }
    /* ---- LOGIN PAGE FOOTER (Merck Theme) ---- */
    BODY.theme .site-footer.site-footer--login {
        -webkit-box-flex: 0 1 auto;
        -webkit-flex: 0 1 auto;
        -moz-flex: 0 1 auto;
        -ms-flex: 0 1 auto;
        flex: 0 1 auto;
        min-height: 0;
    }
}

/* ===========================================================

    MSD HATCHPLAN (PP365) WELCOME PAGE SASS (2021)  

=========================================================== */
/* ---- WELCOME STRUCTURE ---- */
BODY.theme .section--welcome {
    position: relative;
    min-height: 120px;
    background-color: transparent;
    overflow: hidden;
}

    BODY.theme .section--welcome:nth-child(2n) {
        background-color: transparent;
    }

    BODY.theme .section--welcome .section-limits {
        padding: 32px 20px;
    }

BODY.theme .welcome-container {
}

BODY.theme MAIN.page-main.page-main--login {
    /* background: url("/Assets/images/chick_images/chicken_for_MAPP365_Welcome.png") bottom right -100px no-repeat; */
    background-color: transparent;
    background-size: auto 100%;
}

BODY.theme .welcome-content {
    display: inline-flex;
    text-align: left;
    padding: 0px 70px !important;
}

BODY.theme .welcome-content-wrapper {
    display: inline-block;
}

BODY.theme .text--welcome-text {
    margin-bottom: 32px;
    font-size: 3.125rem;
    color: #bfb8af;
    text-transform: initial;
    line-height: 40px;
}

BODY.theme .text--para1 {
    max-width: 100%;
    margin-bottom: 25px;
    font-size: 14px;
    color: #fff;
    text-transform: initial;
    font-family: 'Invention', sans-serif;
    line-height: 20px;
}

    BODY.theme .text--para1:last-child {
        margin-bottom: 0px;
    }

BODY.theme .text--para3 {
    margin-bottom: 20px;
    font-size: 1.1rem;
    color: #bfb8af;
    text-transform: initial;
    line-height: 16px;
    text-align: right;
}

BODY.theme .country-culture-wrapper.k-dropdownlist {
    border-color: #fff;
    background-color: #fff;
    border-radius: 0px;
    width: 287px;
    height: 40px;
    font-size: 16px;
}

    BODY.theme .country-culture-wrapper.k-dropdownlist .k-i-caret-alt-down {
        background: url("/Assets/images/icons/down.png") center center no-repeat;
    }

        BODY.theme .country-culture-wrapper.k-dropdownlist .k-i-caret-alt-down::before {
            content: "";
        }

BODY.theme .login-button {
    width: 55%;
    max-width: 50%;
    margin-top: 5%;
}

BODY.theme .login-button--text {
    margin-bottom: unset;
    font-size: 1.28rem;
    color: #FFF;
    line-height: unset;
}

BODY.theme .register-button {
    width: 55%;
    margin-top: 5%;
}

BODY.theme .register-button--text {
    margin-bottom: unset;
    font-size: 1.28rem;
    color: #FFF;
    line-height: unset;
}

/* ============================================================== MEDIA QUERIES ============================================================== */
/* ---- LARGE DESKTOP (1600px +) ---- */
@media only screen and (min-width: 1600px) {
    /* ---- WELCOME STRUCTURE ---- */
    BODY.theme MAIN.page-main.page-main--login {
        /*height:85%;*/
        background-size: auto 75%;
    }
}

/* ---- SMALL DESKTOP (1440px - 1599px) ---- */
@media only screen and (min-width: 1440px) and (max-width: 1600px) {
    /* ---- WELCOME STRUCTURE ---- */
    BODY.theme MAIN.page-main.page-main--login {
        /*height:80%;*/
        background-size: auto 75%;
    }
}

/* ---- LAPTOP (1280px - 1439px) ---- */
@media only screen and (min-width: 1280px) and (max-width: 1439px) {
    /* ---- WELCOME STRUCTURE ---- */
    BODY.theme MAIN.page-main.page-main--login {
        background-size: auto 80%;
    }

    BODY.theme .text--welcome-text {
        margin-bottom: 20px;
    }

    BODY.theme .text--para1 {
        margin-bottom: 20px;
    }
}

/* ---- MOBILE TO LARGE TABLET (0 - 1279px) ---- */
@media only screen and (max-width: 1279px) {
    /* ---- WELCOME STRUCTURE ---- */
    BODY.theme .welcome-content-wrapper .buttons.buttons--flex-min {
        display: -webkit-box;
        /* OLD - iOS 6-, Safari 3.1-6 */
        display: -moz-box;
        /* OLD - Firefox 19- */
        display: -ms-flexbox;
        /* OLD - TWEENER - IE 10 */
        display: -webkit-flex;
        /* RECENT - Chrome */
        display: flex;
        /* NEW - Firefox, Chrome, Opera, IE11 */
        -webkit-flex-direction: row;
        -moz-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-flex-wrap: no-wrap;
        flex-wrap: no-wrap;
        -webkit-justify-content: flex-start;
        justify-content: flex-start;
        -webkit-align-items: flex-start;
        align-items: flex-start;
        -webkit-align-content: flex-start;
        align-content: flex-start;
    }

        BODY.theme .welcome-content-wrapper .buttons.buttons--flex-min .button.button--login {
            -webkit-box-flex: 0 1 120px;
            -webkit-flex: 0 1 120px;
            -moz-flex: 0 1 120px;
            -ms-flex: 0 1 120px;
            flex: 0 1 120px;
        }

    BODY.theme MAIN.page-main.page-main--login {
        background-size: auto 75%;
    }

    BODY.theme .text--welcome-text {
        margin-bottom: 20px;
    }

    BODY.theme .text--para1 {
        margin-bottom: 20px;
    }
}

/* ---- LARGE TABLET (960px - 1279px) ---- */
@media only screen and (min-width: 960px) and (max-width: 1279px) {
    /* ---- WELCOME STRUCTURE ---- */
    BODY.theme MAIN.page-main.page-main--login {
        /*height:80%;*/
        background-size: auto 75%;
    }
}

/* ---- LARGE TABLET PORTRAIT (960px - 1279px) ---- */
@media only screen and (min-width: 960px) and (min-height: 1200px) {
    /* ---- WELCOME STRUCTURE ---- */
    BODY.theme MAIN.page-main.page-main--login {
        background-size: auto 60%;
    }
}

/* ---- SMALL TABLET LANDSCAPE (720px height) ---- */
@media only screen and (orientation: landscape) and (max-height: 720px) {
    /* ---- WELCOME STRUCTURE ---- */
    BODY.theme .welcome-container {
        width: 90%;
    }
}

/* ---- MOBILE - SMALL TABLET (0 - 959px) ---- */
@media only screen and (max-width: 959px) {
    /* ---- WELCOME STRUCTURE ---- */
    BODY.theme .welcome-content-wrapper {
        max-width: 72%;
    }

    BODY.theme .welcome-container {
        width: 100%;
    }
}

/* ---- SMALL TABLET (640px - 959px) ---- */
@media only screen and (min-width: 600px) and (max-width: 959px) {
    /* ---- WELCOME STRUCTURE ---- */
    BODY.theme .login-button {
        width: 50%;
        margin-top: 0;
        margin-right: 6px;
    }

    BODY.theme .register-button {
        width: 50%;
        margin-top: 0 !important;
    }

    BODY.theme .button-content {
        margin-top: 20px;
    }

    BODY.theme MAIN.page-main.page-main--login {
        /*height:77%;*/
        background-size: auto 45%;
    }
}

/* ---- LARGE MOBILE (480px - 639px) ---- */
@media only screen and (min-width: 480px) and (max-width: 599px) {
    /* ---- WELCOME STRUCTURE ---- */
    BODY.theme MAIN.page-main.page-main--login {
        background-size: auto 35%;
        /*height:85%;*/
    }
}

/* ---- SMALL MOBILE (0 - 479px) ---- */
@media only screen and (max-width: 479px) {
    /* ---- WELCOME STRUCTURE ---- */
    BODY.theme MAIN.page-main.page-main--login {
        /*height:100%;*/
        background-size: auto 20%;
        background-position: right -50px bottom 0;
    }
}

/* ===========================================================

    MSD HATCHPLAN LANDING SASS SASS (2019)  

=========================================================== */
/* ---- LANDING PAGE TITLE ---- */
BODY.theme .landing__title {
    font-size: 2rem;
    font-weight: 500;
    line-height: 1.2;
    margin-bottom: 24px;
    font-family: 'Invention', sans-serif;
    font-style: normal;
    color: #1b1b1b;
    text-transform: capitalize;
}

/* MAIN TILE BUTTONS */
BODY.theme .evaluation__tile .evaluation-tile__icon {
    width: 48px;
}

BODY.theme .evaluation__tile .evaluation-tile__text {
    font-size: 1.28rem;
}

/* ---- LANDING PAGE LOGO (MERCK ONLY) ---- */
BODY.theme .landing-logo__container {
    display: block;
}

/* ============================================================== MEDIA QUERIES ============================================================== */
/* ---- LARGE DESKTOP (1600px +) ---- */
/* ---- SMALL DESKTOP (1440px - 1599px) ---- */
/* ---- LAPTOP (1280px - 1439px) ---- */
/* ---- LAPTOP AND ABOVE (1280px +) ---- */
/* ---- MOBILE TO LARGE TABLET (0 - 1279px) ---- */
/* ---- LARGE TABLET (960px - 1279px) ---- */
/* ---- SMALL TABLET (640px - 959px) ---- */
/* ---- LARGE MOBILE (480px - 639px) ---- */
/* ---- SMALL MOBILE (0 - 479px) ---- */
/* ===========================================================

    $MSD HATCHPLAN PDF PAGE & DOCUMENT (2019) 

=========================================================== */
/* ======== SPECIFIC ======== */
/* ---- PDF PAGE ---- */
/* ---- PDF HEADER ---- */
/* ---- PDF HEADER LOGO ---- */
BODY.body--pdf.theme .pdf-header__logo {
    /*margin-right: 16px;*/
}

BODY.body--pdf.theme .pdf-header__logo-text {
    display: inline-block;
    font-size: 2rem;
    font-weight: 400;
    line-height: 1.1;
    margin-bottom: 0;
    font-family: 'Invention', sans-serif;
    font-style: normal;
    color: #0C2340;
    text-transform: uppercase;
    vertical-align: middle;
    letter-spacing: 0.4rem;
    -webkit-transform: scale(1, 0.85);
    /* Chrome, Safari 8+, Opera 15.0+ */
    -webkit-transform: -webkit-scale(1, 0.85);
    /* Safari 7 */
    -webkit-transform: translateZ(0);
    /* Prevent blur on IOS Retina devices */
    -moz-transform: scale(1, 0.85);
    /* Firefox */
    -ms-transform: scale(1, 0.85);
    /* IE 9 */
    -o-transform: scale(1, 0.85);
    /* Opera 10.5 - 15.0 */
    transform: scale(1, 0.85);
}

    BODY.body--pdf.theme .pdf-header__logo-text SPAN {
        color: #FBE122;
    }

BODY.body--pdf.theme .pdf-header__logo.pdf-header__logo--mapp365 {
    max-height: 80px;
}

/* ---- PDF HEADER DETAILS ---- */
BODY.body--pdf.theme .pdf-row .field LABEL {
    margin-bottom: 0;
    font-size: 16px;
    text-transform: capitalize;
    color: #010101;
}

BODY.body--pdf.theme .pdf-row .field INS {
    height: auto;
    min-height: 32px;
    font-size: 16px;
    color: #666;
}

BODY.body--pdf.theme SECTION.section--pdf H1.pdf-section__main-title {
    font-size: 1.28rem;
    font-weight: 600;
    letter-spacing: .05rem;
}

BODY.body--pdf.theme SECTION.section--pdf H2.pdf-section__title {
    font-size: 1.28rem;
    font-weight: 600;
    letter-spacing: .05rem;
}

/* ---- PDF MAIN ---- */
/* ---- PDF FOOTER ---- */
/* ---- PDF ACTION BAR ---- */
/* ======== DIAL CHARTS ======= */
/* ---- PDF HEADER DIAL CHARTS ---- */
BODY.body--pdf.theme .pdf-header__dials {
    max-width: 95%;
    margin: 20px auto;
    border: 1px solid #ccc;
    border-radius: 8px;
    display: flex;
}

    BODY.body--pdf.theme .pdf-header__dials .chart__box {
        padding: 12px 0px;
    }

    BODY.body--pdf.theme .pdf-header__dials .chart__center-text {
        font-weight: 700;
    }

/* ---- PDF MAIN DIAL CHARTS ---- */
BODY.body--pdf.theme .chart__box {
    color: #414E54;
}

BODY.body--pdf.theme .chart__center-text {
    font-weight: 600;
}

    BODY.body--pdf.theme .chart__center-text SMALL {
        color: #414E54;
    }

BODY.body--pdf.theme .chart__title {
    color: #414E54;
    font-weight: 600;
}

BODY.body--pdf.theme .pdf-row .chart__box {
    padding: 6px;
}

BODY.body--pdf.theme .pdf-row .chart__title {
    font-size: 0.9rem;
    overflow-wrap: break-word;
}

/* ======== GENERAL ======== */
/* ---- PDF BOX ---- */
BODY.body--pdf.theme .pdf-box .pdf-box__title {
    font-family: 'Invention', sans-serif;
    font-style: normal;
    color: #1b1b1b;
    text-transform: uppercase;
    font-weight: 600;
    font-size: 1.28rem;
}

BODY.body--pdf.theme .pdf-box P {
    font-size: 1.28rem;
    line-height: 1.5;
}

/* ---- PDF FIELDS ---- */
BODY.body--pdf.theme .field.field--adjacent {
    -webkit-box-flex: 0 1 25%;
    -webkit-flex: 0 1 25%;
    -moz-flex: 0 1 25%;
    -ms-flex: 0 1 25%;
    flex: 0 1 25%;
    width: 25%;
    max-width: 25%;
}

BODY.body--pdf.theme .field LABEL {
    margin-bottom: 0;
    font-size: 16px;
    font-weight: 600;
    text-transform: capitalize;
}

BODY.body--pdf.theme .field INS {
    background-color: transparent;
    height: 32px;
    padding-top: 0;
    padding-bottom: 4px;
    padding-left: 4px;
    font-family: 'Invention', sans-serif;
    font-size: 16px;
    font-weight: 300;
    color: #666;
}

/* ---- PDF ROW ---- */
/* ---- PDF ROW COLUMNS ---- */
BODY.body--pdf.theme .pdf-row__col.pdf-row__col--title H2.pdf-row__title {
    font-family: 'Invention', sans-serif;
    font-size: 1.1rem;
    text-transform: uppercase;
    letter-spacing: 0.05rem;
}
/*--------------------------- New CSS for pdf --------------------*/
.chart_container {
    display: flex;
}

.pdf-limits .chart_left {
    width: 30%;
}

.pdf-limits .catgaory-name {
    width: 40%;
}

.pdf-limits .chart-div .circular-chart {
    max-width: 100%;
}

.chart_container .chart__footer {
    position: relative;
    margin-bottom: 30px;
}

    .chart_container .chart__footer .chart__title {
        position: absolute;
        top: 25px;
        width: 100%;
        text-align: center;
    }

.pdf-heading {
    font-size: 50px;
    color: #0C2340;
    font-style: italic;
    font-weight: bold;
    margin: 20px 0px;
}

.info-container {
    padding-left: 20px;
    padding-right: 20px;
}

.author-name {
    font-size: 20px;
}

.author-other-info {
    font-size: 18px;
    color: #666;
    font-style: italic;
}

.intro-heading {
    font-size: 22px;
    font-weight: bold;
    margin: 40px 0px 30px 0px;
}

.intro-content {
    background-color: #f5f5f5;
    border-radius: 4px;
    padding: 10px 10px 5px 10px;
}

    .intro-content p {
        font-size: 16px;
        margin: 10px 0px;
        line-height: 24px;
        color: #666;
    }

.author-name-heading {
    font-size: 25px;
    text-align: center;
    margin: 50px 0px 0px 0px;
}

.author-name2 {
    width: 300px;
    height: 2px;
    margin: 0px auto 30px auto;
    border-top: 2px solid #f5f5f5;
    padding-top: 10px;
    text-align: center;
    font-size: 18px;
    color: #666;
}

.pdf-footer-bottom {
    border-top: 1px solid #f5f5f5;
    display: flex;
    align-items:flex-start;
    justify-content: space-between;
    padding: 30px 0px 0px 0px;
}

.pdf-footer-bottom .logo img {
    display: block;
}

.pdf-footer-bottom .footer-nav a {
    color: #000;
}
.pdf-footer-bottom .footnotes {
    margin-top: 30px;
    text-align: end;
}
 

.pdf-bottom-logo {
    margin: 60px auto;
    display: block;
}

.pdf-footer-bottom .content-pan {
    font-size: 16px;
    font-weight: bold;
    line-height: 24px;
}
.spinner-pdf {
    border: 4px solid #f3f3f3;
    border-top: 4px solid #2c3e50;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    animation: spin 1s linear infinite;
    margin: 0 auto 10px;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.chart-div {
    width: 16%;
}

    .chart-div .chart__column.chart__column--quinary {
        -webkit-box-flex: 0 1 100%;
        -webkit-flex: 0 1 100%;
        -moz-flex: 0 1 100%;
        -ms-flex: 0 1 100%;
        flex: 0 1 100%;
        max-width: 100%;
    }

.pdf-header__details {
    padding: 0px 15px;
}

.pdf-main {
    padding: 0px 15px;
}

p.content {
    font-size: 16px;
}
/* ---- PDF ROW TITLE ---- */
/* ============================================================== MEDIA QUERIES ============================================================== */
/* ---- LARGE TABLET (960px - 1279px) ---- */
/* ---- MOBILE TO SMALL TABLET (0 - 959px) ---- */
@media only screen and (max-width: 959px) {
    /* ---- PDF ROW ---- */
    BODY.theme .pdf-row .fields--row {
        display: -webkit-box;
        /* OLD - iOS 6-, Safari 3.1-6 */
        display: -moz-box;
        /* OLD - Firefox 19- */
        display: -ms-flexbox;
        /* OLD - TWEENER - IE 10 */
        display: -webkit-flex;
        /* RECENT - Chrome */
        display: flex;
        /* NEW - Firefox, Chrome, Opera, IE11 */
        -webkit-flex-direction: row;
        -moz-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-justify-content: flex-start;
        justify-content: flex-start;
        -webkit-align-items: flex-start;
        align-items: flex-start;
        -webkit-align-content: flex-start;
        align-content: flex-start;
    }
    /* ---- PDF FIELDS ---- */
    BODY.body--pdf.theme .field.field--adjacent {
        -webkit-box-flex: 0 1 33.33%;
        -webkit-flex: 0 1 33.33%;
        -moz-flex: 0 1 33.33%;
        -ms-flex: 0 1 33.33%;
        flex: 0 1 33.33%;
    }
}

/* ---- SMALL TABLET (640px - 959px) ---- */
/* ---- LARGE MOBILE (480px - 639px) ---- */
/* ---- SMALL MOBILE (0 - 479px) ---- */
BODY.theme {
    background-color: #FFF;
}

    /* ---- THEME SWITCHES ---- */
    BODY.theme .theme--default,
    BODY.theme .theme--msdconv {
        display: none !important;
    }

    /* ---- MAIN SIDEBAR ---- */
    BODY.theme ASIDE.page-side {
        background-color: #0e294b;
        color: #414E54;
        -webkit-box-shadow: 6px 0 6px rgba(0, 0, 0, 0.1);
        -moz-box-shadow: 6px 0 6px rgba(0, 0, 0, 0.1);
        box-shadow: 6px 0 6px rgba(0, 0, 0, 0.1);
    }

    BODY.theme .sidebar--closed ASIDE.page-side {
        left: -240px;
    }

    /* ---- ICONS ---- */
    BODY.theme .button.button--icon I.icon:before {
        color: inherit;
    }

    /* ---- BUTTONS ---- */
    BODY.theme .button {
        border-radius: 0px;
    }

    BODY.theme .buttons.buttons--companies {
        padding: 0 20px 20px;
    }

    BODY.theme .buttons.buttons--companies-filter {
        padding: 40px 0 20px;
    }

    /* ---- GRID HEADER BUTTONS ---- */
    BODY.theme .grid-header__button.button {
        border: 1px solid #dadfe1;
        color: #768A98;
        -webkit-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.1);
        -moz-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.1);
        box-shadow: 0 3px 5px rgba(0, 0, 0, 0.1);
    }

    /* ---- DOUGHNUT CHARTS ---- */
    BODY.theme .chart__header {
        min-height: 32px;
        padding: 6px 0;
    }

    BODY.theme .chart__title {
        font-size: 16px;
        color: rgba(0, 0, 0, 0.88);
        text-transform: capitalize;
        height: 36px;
        margin: 0px;
    }
.chart-title-new {
    font-size: 16px;
        color: rgba(0, 0, 0, 0.88);
        text-transform: capitalize;
        height: 36px;
        margin: 0px;
        position: absolute;
        width: 20%;
        text-align: center;
        top: 25px;
}
    BODY.theme .chart__center-text {
        color: #FFF;
    }

    BODY.theme .chart__label {
        font-size: 1.1rem;
        font-weight: 600;
        color: #768A98;
    }

/* ---- BAR/COLUMN CHART RANGE SCALE ---- */
.chart-range-scale {
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- */
    display: -ms-flexbox;
    /* OLD - TWEENER - IE 10 */
    display: -webkit-flex;
    /* RECENT - Chrome */
    display: flex;
    /* NEW - Firefox, Chrome, Opera, IE11 */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    -webkit-align-items: flex-start;
    align-items: flex-start;
    -webkit-align-content: flex-start;
    align-content: flex-start;
    width: 100%;
    height: 32px;
    margin-bottom: 48px;
}

.chart-range-scale-item {
    -webkit-box-flex: 0 1 50%;
    -webkit-flex: 0 1 50%;
    -moz-flex: 0 1 50%;
    -ms-flex: 0 1 50%;
    flex: 0 1 50%;
    padding: 4px;
    text-align: center;
    color: #FFF;
}

.chart-range-scale-item__q1 {
    margin-right: 1px;
    background-color: #6ECEB2;
}

.chart-range-scale-item__q2 {
    background-color: #FF2D55;
}

/* ---- TABS ---- */
BODY.theme .tab-panel__tab {
    -webkit-box-flex: 0 1 25%;
    -webkit-flex: 0 1 25%;
    -moz-flex: 0 1 25%;
    -ms-flex: 0 1 25%;
    flex: 0 1 25%;
    padding: 10px 24px;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    margin: 0 0 0 16px;
    text-align: center;
}

    BODY.theme .tab-panel__tab.active {
        top: 0;
        border: 1px solid #040c15;
        border-bottom: 0;
        background-color: #0C2340;
        color: #FBE122;
    }

    BODY.theme .tab-panel__tab.inactive {
        top: 0;
        padding: 8px 16px;
        border-color: #ececec;
        border-bottom: 0;
        background-color: #FFF;
        color: #414E54;
    }

        BODY.theme .tab-panel__tab.inactive:hover {
            border: 1px solid #d2d2d2;
            background-color: #e4e7f2;
        }

BODY.theme .tab-panel__body-wrap {
    padding: 32px 24px;
    border-color: #ececec;
    border-top: 0;
    background-color: #F5F6FA;
}

    BODY.theme .tab-panel__body-wrap.tab-panel__body-wrap--grid {
        border-width: 0;
    }

/* ---- TAB PANEL MODIFIERS ---- */
BODY.theme .tab-panel.tab-panel--alt-1 .tab-panel__body-wrap {
    border-radius: 6px;
    border-top-left-radius: 0;
    -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.075);
    -moz-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.075);
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.075);
}

BODY.theme .tab-panel.tab-panel--alt-1 .overlay-disable-section {
    background-color: rgba(236, 236, 236, 0.75);
}

BODY.theme .tab-panel.tab-panel--alt-1 .tab-switch__note {
    font-family: 'Invention', sans-serif;
}

/* ---- TAB PANEL CONTENT ---- */
BODY.theme .tab-panel__content .grid-panel {
    padding: 0;
    margin-top: 0;
}

/* ---- FOOTER ---- */
BODY.theme FOOTER.site-footer {
    background-color: #0C2340;
}

    BODY.theme FOOTER.site-footer:before {
        content: "";
        display: none;
        position: absolute;
        z-index: 10;
        left: 0;
        bottom: 0;
        width: 180px;
        height: 240px;
        background: url(/Assets/images/msd/sidetab-whitesp-EN.png) no-repeat 0 0;
    }

    BODY.theme FOOTER.site-footer .page-limits {
        max-width: none;
        padding-left: 160px;
        padding-right: 20px;
    }

BODY.theme IMG.footer__logo.footer__logo--msd {
    max-width: 120px;
}

BODY.theme FOOTER.site-footer .footer__side-tab-logo {
    position: absolute;
    z-index: 10;
    left: 0;
    bottom: 0;
    width: 180px;
    height: 240px;
}

/* ---- NOTIFICATION BAR ---- */
/* ---- INFO (Blue) ---- */
BODY.theme .notification-bar.notification-bar--info {
    background-color: #2B85BA;
}

/* ---- SUCCESS (Green) ---- */
BODY.theme .notification-bar.notification-bar--success {
    background-color: #3B9A49;
}

/* ---- CAUTION (Amber) ---- */
BODY.theme .notification-bar.notification-bar--caution {
    background-color: #FBE122;
    color: #1b1b1b;
}

/* ---- WARNING (Orange) ---- */
BODY.theme .notification-bar.notification-bar--warning {
    background-color: #F48E22;
}

/* ---- ERROR (Red) ---- */
BODY.theme .notification-bar.notification-bar--error {
    background-color: #EA1A3E;
}

/* ============================================================== MEDIA QUERIES ============================================================== */
/* ---- TABLET (0 - 1279px) ---- */
@media only screen and (max-width: 1279px) {
    /* ---- DOUGHNUT CHARTS ---- */
    BODY.theme .chart__title {
        font-size: 1rem;
    }
}

/* ---- TABLET, LAPTOP & DESKTOP (960px +) ---- */
@media screen and (min-width: 960px) {
    /* ---- MAIN SIDEBAR ---- */
    BODY.theme ASIDE.page-side,
    BODY.theme .sidebar--closed ASIDE.page-side {
        left: -360px;
    }
}

/* ---- HELPERS ---- */
/* ===========================================================

	$HELPERS (v2 2018)

=========================================================== */
/* -------- CLEARFIX (Clears floating child elements) -------- */
.clearfix:before, .clearfix:after {
    content: "";
    display: table;
}

.clearfix:after {
    clear: both;
}

/* -------- Legacy Clearfix -------- */
/* ===========================================================

	$ANIMATIONS (v2 2018)

=========================================================== */
/* ---- ANIMATION MIXIN ---- */
/* ---- Pulse ---- */
@-webkit-keyframes pulse {
    0% {
        -webkit-transform: scale(0, 0);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-scale(0, 0);
        /* Safari 7 */
        -webkit-transform: translateZ(0);
        /* Prevent blur on IOS Retina devices */
        -moz-transform: scale(0, 0);
        /* Firefox */
        -ms-transform: scale(0, 0);
        /* IE 9 */
        -o-transform: scale(0, 0);
        /* Opera 10.5 - 15.0 */
        transform: scale(0, 0);
        opacity: 0;
    }

    25% {
        -webkit-transform: scale(0, 0);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-scale(0, 0);
        /* Safari 7 */
        -webkit-transform: translateZ(0);
        /* Prevent blur on IOS Retina devices */
        -moz-transform: scale(0, 0);
        /* Firefox */
        -ms-transform: scale(0, 0);
        /* IE 9 */
        -o-transform: scale(0, 0);
        /* Opera 10.5 - 15.0 */
        transform: scale(0, 0);
        opacity: 0.1;
    }

    50% {
        -webkit-transform: scale(0.1, 0.1);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-scale(0.1, 0.1);
        /* Safari 7 */
        -webkit-transform: translateZ(0);
        /* Prevent blur on IOS Retina devices */
        -moz-transform: scale(0.1, 0.1);
        /* Firefox */
        -ms-transform: scale(0.1, 0.1);
        /* IE 9 */
        -o-transform: scale(0.1, 0.1);
        /* Opera 10.5 - 15.0 */
        transform: scale(0.1, 0.1);
        opacity: 0.25;
        animation-timing-function: linear;
    }

    75% {
        -webkit-transform: scale(0.6, 0.6);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-scale(0.6, 0.6);
        /* Safari 7 */
        -webkit-transform: translateZ(0);
        /* Prevent blur on IOS Retina devices */
        -moz-transform: scale(0.6, 0.6);
        /* Firefox */
        -ms-transform: scale(0.6, 0.6);
        /* IE 9 */
        -o-transform: scale(0.6, 0.6);
        /* Opera 10.5 - 15.0 */
        transform: scale(0.6, 0.6);
        opacity: 0.75;
    }

    100% {
        -webkit-transform: scale(1.4, 1.4);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-scale(1.4, 1.4);
        /* Safari 7 */
        -webkit-transform: translateZ(0);
        /* Prevent blur on IOS Retina devices */
        -moz-transform: scale(1.4, 1.4);
        /* Firefox */
        -ms-transform: scale(1.4, 1.4);
        /* IE 9 */
        -o-transform: scale(1.4, 1.4);
        /* Opera 10.5 - 15.0 */
        transform: scale(1.4, 1.4);
        opacity: 0;
    }
}

@keyframes pulse {
    0% {
        -webkit-transform: scale(0, 0);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-scale(0, 0);
        /* Safari 7 */
        -webkit-transform: translateZ(0);
        /* Prevent blur on IOS Retina devices */
        -moz-transform: scale(0, 0);
        /* Firefox */
        -ms-transform: scale(0, 0);
        /* IE 9 */
        -o-transform: scale(0, 0);
        /* Opera 10.5 - 15.0 */
        transform: scale(0, 0);
        opacity: 0;
    }

    25% {
        -webkit-transform: scale(0, 0);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-scale(0, 0);
        /* Safari 7 */
        -webkit-transform: translateZ(0);
        /* Prevent blur on IOS Retina devices */
        -moz-transform: scale(0, 0);
        /* Firefox */
        -ms-transform: scale(0, 0);
        /* IE 9 */
        -o-transform: scale(0, 0);
        /* Opera 10.5 - 15.0 */
        transform: scale(0, 0);
        opacity: 0.1;
    }

    50% {
        -webkit-transform: scale(0.1, 0.1);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-scale(0.1, 0.1);
        /* Safari 7 */
        -webkit-transform: translateZ(0);
        /* Prevent blur on IOS Retina devices */
        -moz-transform: scale(0.1, 0.1);
        /* Firefox */
        -ms-transform: scale(0.1, 0.1);
        /* IE 9 */
        -o-transform: scale(0.1, 0.1);
        /* Opera 10.5 - 15.0 */
        transform: scale(0.1, 0.1);
        opacity: 0.25;
        animation-timing-function: linear;
    }

    75% {
        -webkit-transform: scale(0.6, 0.6);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-scale(0.6, 0.6);
        /* Safari 7 */
        -webkit-transform: translateZ(0);
        /* Prevent blur on IOS Retina devices */
        -moz-transform: scale(0.6, 0.6);
        /* Firefox */
        -ms-transform: scale(0.6, 0.6);
        /* IE 9 */
        -o-transform: scale(0.6, 0.6);
        /* Opera 10.5 - 15.0 */
        transform: scale(0.6, 0.6);
        opacity: 0.75;
    }

    100% {
        -webkit-transform: scale(1.4, 1.4);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-scale(1.4, 1.4);
        /* Safari 7 */
        -webkit-transform: translateZ(0);
        /* Prevent blur on IOS Retina devices */
        -moz-transform: scale(1.4, 1.4);
        /* Firefox */
        -ms-transform: scale(1.4, 1.4);
        /* IE 9 */
        -o-transform: scale(1.4, 1.4);
        /* Opera 10.5 - 15.0 */
        transform: scale(1.4, 1.4);
        opacity: 0;
    }
}

.pulse {
    /*animation:dark-flare 2.6s ease-out; animation-iteration-count:infinite;*/
}

    .pulse:before {
        -webkit-animation: pulse 2.6s ease-out;
        -webkit-animation-iteration-count: infinite;
        /* Chrome, Safari, Opera */
        animation: pulse 2.6s ease-out;
        animation-iteration-count: infinite;
    }

.pulse--1 {
    animation-delay: 0s;
}

    .pulse--1:before {
        animation-delay: 0s;
    }

.pulse--2 {
    animation-delay: 0.4s;
}

    .pulse--2:before {
        animation-delay: 0.4s;
    }

.pulse--3 {
    animation-delay: 0.8s;
}

    .pulse--3:before {
        animation-delay: 0.8s;
    }

.pulse--4 {
    animation-delay: 1.2s;
}

    .pulse--4:before {
        animation-delay: 1.2s;
    }

.pulse--5 {
    animation-delay: 1.6s;
}

    .pulse--5:before {
        animation-delay: 1.6s;
    }

.pulse--6 {
    animation-delay: 2.0s;
}

    .pulse--6:before {
        animation-delay: 2.0s;
    }

/* ---- Bounce ---- */
@-webkit-keyframes bounce {
    0%, 20%, 50%, 80%, 100% {
        -webkit-transform: translate(0, 0);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-translate(0, 0);
        /* Safari 7 */
        -moz-transform: translate(0, 0);
        /* Firefox */
        -ms-transform: translate(0, 0);
        /* IE 9 */
        -o-transform: translate(0, 0);
        /* Opera 10.5 - 15.0 */
        transform: translate(0, 0);
    }

    40% {
        -webkit-transform: translate(0, -30px);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-translate(0, -30px);
        /* Safari 7 */
        -moz-transform: translate(0, -30px);
        /* Firefox */
        -ms-transform: translate(0, -30px);
        /* IE 9 */
        -o-transform: translate(0, -30px);
        /* Opera 10.5 - 15.0 */
        transform: translate(0, -30px);
    }

    60% {
        -webkit-transform: translate(0, -15px);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-translate(0, -15px);
        /* Safari 7 */
        -moz-transform: translate(0, -15px);
        /* Firefox */
        -ms-transform: translate(0, -15px);
        /* IE 9 */
        -o-transform: translate(0, -15px);
        /* Opera 10.5 - 15.0 */
        transform: translate(0, -15px);
    }
}

@-webkit-keyframes bounce {
    0%, 20%, 50%, 80%, 100% {
        -webkit-transform: translate(0, 0);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-translate(0, 0);
        /* Safari 7 */
        -moz-transform: translate(0, 0);
        /* Firefox */
        -ms-transform: translate(0, 0);
        /* IE 9 */
        -o-transform: translate(0, 0);
        /* Opera 10.5 - 15.0 */
        transform: translate(0, 0);
    }

    40% {
        -webkit-transform: translate(0, -30px);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-translate(0, -30px);
        /* Safari 7 */
        -moz-transform: translate(0, -30px);
        /* Firefox */
        -ms-transform: translate(0, -30px);
        /* IE 9 */
        -o-transform: translate(0, -30px);
        /* Opera 10.5 - 15.0 */
        transform: translate(0, -30px);
    }

    60% {
        -webkit-transform: translate(0, -15px);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-translate(0, -15px);
        /* Safari 7 */
        -moz-transform: translate(0, -15px);
        /* Firefox */
        -ms-transform: translate(0, -15px);
        /* IE 9 */
        -o-transform: translate(0, -15px);
        /* Opera 10.5 - 15.0 */
        transform: translate(0, -15px);
    }
}

.bounce {
    -webkit-animation: bounce 2s ease-out 0s;
    -webkit-animation-iteration-count: infinite;
    /* Chrome, Safari, Opera */
    animation: bounce 2s ease-out 0s;
    animation-iteration-count: infinite;
}

/* ---- Border Pulsate using Hatchplan Medium Yellow ---- */
@-webkit-keyframes border-pulsate {
    0% {
        border-color: rgba(251, 225, 34, 0);
    }

    25% {
        border-color: #fbe122;
    }

    50% {
        border-color: rgba(251, 225, 34, 0);
    }

    75% {
        border-color: #fbe122;
    }

    100% {
        border-color: rgba(251, 225, 34, 0);
    }
}

.border-pulsate {
    -webkit-animation: border-pulsate 1s ease-out 2s;
    -webkit-animation-iteration-count: infinite;
    /* Chrome, Safari, Opera */
    animation: border-pulsate 1s ease-out 2s;
    animation-iteration-count: infinite;
}

/* ---- Rubber Band Effect ---- */
@-webkit-keyframes rubberBand {
    from {
        -webkit-transform: scale3d(1, 1, 1);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-scale3d(1, 1, 1);
        /* Safari 7 */
        -moz-transform: scale3d(1, 1, 1);
        /* Firefox */
        -o-transform: scale3d(1, 1, 1);
        /* Opera 10.5 - 15.0 */
        transform: scale3d(1, 1, 1);
    }

    30% {
        -webkit-transform: scale3d(1.25, 0.75, 1);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-scale3d(1.25, 0.75, 1);
        /* Safari 7 */
        -moz-transform: scale3d(1.25, 0.75, 1);
        /* Firefox */
        -o-transform: scale3d(1.25, 0.75, 1);
        /* Opera 10.5 - 15.0 */
        transform: scale3d(1.25, 0.75, 1);
    }

    40% {
        -webkit-transform: scale3d(0.75, 1.25, 1);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-scale3d(0.75, 1.25, 1);
        /* Safari 7 */
        -moz-transform: scale3d(0.75, 1.25, 1);
        /* Firefox */
        -o-transform: scale3d(0.75, 1.25, 1);
        /* Opera 10.5 - 15.0 */
        transform: scale3d(0.75, 1.25, 1);
    }

    50% {
        -webkit-transform: scale3d(1.15, 0.85, 1);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-scale3d(1.15, 0.85, 1);
        /* Safari 7 */
        -moz-transform: scale3d(1.15, 0.85, 1);
        /* Firefox */
        -o-transform: scale3d(1.15, 0.85, 1);
        /* Opera 10.5 - 15.0 */
        transform: scale3d(1.15, 0.85, 1);
    }

    65% {
        -webkit-transform: scale3d(0.95, 1.05, 1);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-scale3d(0.95, 1.05, 1);
        /* Safari 7 */
        -moz-transform: scale3d(0.95, 1.05, 1);
        /* Firefox */
        -o-transform: scale3d(0.95, 1.05, 1);
        /* Opera 10.5 - 15.0 */
        transform: scale3d(0.95, 1.05, 1);
    }

    75% {
        -webkit-transform: scale3d(1.05, 0.95, 1);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-scale3d(1.05, 0.95, 1);
        /* Safari 7 */
        -moz-transform: scale3d(1.05, 0.95, 1);
        /* Firefox */
        -o-transform: scale3d(1.05, 0.95, 1);
        /* Opera 10.5 - 15.0 */
        transform: scale3d(1.05, 0.95, 1);
    }

    to {
        -webkit-transform: scale3d(1, 1, 1);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-scale3d(1, 1, 1);
        /* Safari 7 */
        -moz-transform: scale3d(1, 1, 1);
        /* Firefox */
        -o-transform: scale3d(1, 1, 1);
        /* Opera 10.5 - 15.0 */
        transform: scale3d(1, 1, 1);
    }
}

@keyframes rubberBand {
    from {
        -webkit-transform: scale3d(1, 1, 1);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-scale3d(1, 1, 1);
        /* Safari 7 */
        -moz-transform: scale3d(1, 1, 1);
        /* Firefox */
        -o-transform: scale3d(1, 1, 1);
        /* Opera 10.5 - 15.0 */
        transform: scale3d(1, 1, 1);
    }

    30% {
        -webkit-transform: scale3d(1.25, 0.75, 1);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-scale3d(1.25, 0.75, 1);
        /* Safari 7 */
        -moz-transform: scale3d(1.25, 0.75, 1);
        /* Firefox */
        -o-transform: scale3d(1.25, 0.75, 1);
        /* Opera 10.5 - 15.0 */
        transform: scale3d(1.25, 0.75, 1);
    }

    40% {
        -webkit-transform: scale3d(0.75, 1.25, 1);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-scale3d(0.75, 1.25, 1);
        /* Safari 7 */
        -moz-transform: scale3d(0.75, 1.25, 1);
        /* Firefox */
        -o-transform: scale3d(0.75, 1.25, 1);
        /* Opera 10.5 - 15.0 */
        transform: scale3d(0.75, 1.25, 1);
    }

    50% {
        -webkit-transform: scale3d(1.15, 0.85, 1);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-scale3d(1.15, 0.85, 1);
        /* Safari 7 */
        -moz-transform: scale3d(1.15, 0.85, 1);
        /* Firefox */
        -o-transform: scale3d(1.15, 0.85, 1);
        /* Opera 10.5 - 15.0 */
        transform: scale3d(1.15, 0.85, 1);
    }

    65% {
        -webkit-transform: scale3d(0.95, 1.05, 1);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-scale3d(0.95, 1.05, 1);
        /* Safari 7 */
        -moz-transform: scale3d(0.95, 1.05, 1);
        /* Firefox */
        -o-transform: scale3d(0.95, 1.05, 1);
        /* Opera 10.5 - 15.0 */
        transform: scale3d(0.95, 1.05, 1);
    }

    75% {
        -webkit-transform: scale3d(1.05, 0.95, 1);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-scale3d(1.05, 0.95, 1);
        /* Safari 7 */
        -moz-transform: scale3d(1.05, 0.95, 1);
        /* Firefox */
        -o-transform: scale3d(1.05, 0.95, 1);
        /* Opera 10.5 - 15.0 */
        transform: scale3d(1.05, 0.95, 1);
    }

    to {
        -webkit-transform: scale3d(1, 1, 1);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-scale3d(1, 1, 1);
        /* Safari 7 */
        -moz-transform: scale3d(1, 1, 1);
        /* Firefox */
        -o-transform: scale3d(1, 1, 1);
        /* Opera 10.5 - 15.0 */
        transform: scale3d(1, 1, 1);
    }
}

.rubber-band {
    -webkit-animation: rubberBand 1.05s initial 1.1s;
    -webkit-animation-iteration-count: 1;
    /* Chrome, Safari, Opera */
    animation: rubberBand 1.05s initial 1.1s;
    animation-iteration-count: 1;
    /*animation-name:rubberBand; animation-delay:1.1s; animation-duration:1.05s; animation-iteration-count:1;*/
}

/* ---- Ball Clip Rotate ---- */
@-webkit-keyframes ball-clip-rotate {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    50% {
        -webkit-transform: rotate(180deg);
        -moz-transform: rotate(180deg);
        -o-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
        transform: rotate(180deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@-moz-keyframes ball-clip-rotate {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    50% {
        -webkit-transform: rotate(180deg);
        -moz-transform: rotate(180deg);
        -o-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
        transform: rotate(180deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@-o-keyframes ball-clip-rotate {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    50% {
        -webkit-transform: rotate(180deg);
        -moz-transform: rotate(180deg);
        -o-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
        transform: rotate(180deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes ball-clip-rotate {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    50% {
        -webkit-transform: rotate(180deg);
        -moz-transform: rotate(180deg);
        -o-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
        transform: rotate(180deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

.la-ball-clip-rotate,
.la-ball-clip-rotate > DIV {
    position: relative;
    box-sizing: border-box;
}

.la-ball-clip-rotate {
    display: block;
    font-size: 0;
    color: #FFF;
}

    .la-ball-clip-rotate.la-dark {
        color: #262626;
    }

    .la-ball-clip-rotate > DIV {
        display: inline-block;
        float: none;
        background-color: currentColor;
        border: 0 solid currentColor;
    }

.la-ball-clip-rotate {
    width: 32px;
    height: 32px;
}

    .la-ball-clip-rotate > DIV {
        -webkit-animation: ball-clip-rotate 0.75s linear;
        -webkit-animation-iteration-count: infinite;
        /* Chrome, Safari, Opera */
        animation: ball-clip-rotate 0.75s linear;
        animation-iteration-count: infinite;
        width: 32px;
        height: 32px;
        background: transparent;
        border-width: 2px;
        border-bottom-color: transparent;
        border-radius: 100%;
    }

    .la-ball-clip-rotate.la-sm {
        width: 16px;
        height: 16px;
    }

        .la-ball-clip-rotate.la-sm > DIV {
            width: 16px;
            height: 16px;
            border-width: 1px;
        }

    .la-ball-clip-rotate.la-1x {
        width: 48px;
        height: 48px;
    }

        .la-ball-clip-rotate.la-1x > DIV {
            width: 48px;
            height: 48px;
            border-width: 3px;
        }

    .la-ball-clip-rotate.la-2x {
        width: 64px;
        height: 64px;
    }

        .la-ball-clip-rotate.la-2x > DIV {
            width: 64px;
            height: 64px;
            border-width: 4px;
        }

    .la-ball-clip-rotate.la-3x {
        width: 96px;
        height: 96px;
    }

        .la-ball-clip-rotate.la-3x > DIV {
            width: 96px;
            height: 96px;
            border-width: 6px;
        }

/* ---- CELL COLOUR FLASH VARIANTS (Update emphasis) ---- */
@-webkit-keyframes cell-flash-0 {
    0% {
        background-color: #6a7c85;
    }

    100% {
        background-color: #A1AEB4;
    }
}

@-moz-keyframes cell-flash-0 {
    0% {
        background-color: #6a7c85;
    }

    100% {
        background-color: #A1AEB4;
    }
}

@-o-keyframes cell-flash-0 {
    0% {
        background-color: #6a7c85;
    }

    100% {
        background-color: #A1AEB4;
    }
}

@keyframes cell-flash-0 {
    0% {
        background-color: #6a7c85;
    }

    100% {
        background-color: #A1AEB4;
    }
}

@-webkit-keyframes cell-flash-1 {
    0% {
        background-color: #15191a;
    }

    100% {
        background-color: #414E54;
    }
}

@-moz-keyframes cell-flash-1 {
    0% {
        background-color: #15191a;
    }

    100% {
        background-color: #414E54;
    }
}

@-o-keyframes cell-flash-1 {
    0% {
        background-color: #15191a;
    }

    100% {
        background-color: #414E54;
    }
}

@keyframes cell-flash-1 {
    0% {
        background-color: #15191a;
    }

    100% {
        background-color: #414E54;
    }
}

@-webkit-keyframes cell-flash-2 {
    0% {
        background-color: #a7a7a7;
    }

    100% {
        background-color: #dadada;
    }
}

@-moz-keyframes cell-flash-2 {
    0% {
        background-color: #a7a7a7;
    }

    100% {
        background-color: #dadada;
    }
}

@-o-keyframes cell-flash-2 {
    0% {
        background-color: #a7a7a7;
    }

    100% {
        background-color: #dadada;
    }
}

@keyframes cell-flash-2 {
    0% {
        background-color: #a7a7a7;
    }

    100% {
        background-color: #dadada;
    }
}

/* ---- INTRO.JS PULSE ---- */
/*
@-webkit-keyframes introjspulse {
                                    0%      {-webkit-transform: scale(0); opacity: 0.0;}
                                    25%     {-webkit-transform: scale(0); opacity: 0.1;}
                                    50%     {-webkit-transform: scale(0.1); opacity: 0.3;}
                                    75%     {-webkit-transform: scale(0.5); opacity: 0.5;}
                                    100%    {-webkit-transform: scale(1); opacity: 0.0;}
}

@-moz-keyframes introjspulse {
                                    0%      {-moz-transform: scale(0); opacity: 0.0;}
                                    25%     {-moz-transform: scale(0); opacity: 0.1;}
                                    50%     {-moz-transform: scale(0.1); opacity: 0.3;}
                                    75%     {-moz-transform: scale(0.5); opacity: 0.5;}
                                    100%    {-moz-transform: scale(1); opacity: 0.0;}
}*/
@-webkit-keyframes introjspulse {
    0% {
        -webkit-transform: scale(0, 0);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-scale(0, 0);
        /* Safari 7 */
        -webkit-transform: translateZ(0);
        /* Prevent blur on IOS Retina devices */
        -moz-transform: scale(0, 0);
        /* Firefox */
        -ms-transform: scale(0, 0);
        /* IE 9 */
        -o-transform: scale(0, 0);
        /* Opera 10.5 - 15.0 */
        transform: scale(0, 0);
        opacity: 0.0;
    }

    25% {
        -webkit-transform: scale(0, 0);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-scale(0, 0);
        /* Safari 7 */
        -webkit-transform: translateZ(0);
        /* Prevent blur on IOS Retina devices */
        -moz-transform: scale(0, 0);
        /* Firefox */
        -ms-transform: scale(0, 0);
        /* IE 9 */
        -o-transform: scale(0, 0);
        /* Opera 10.5 - 15.0 */
        transform: scale(0, 0);
        opacity: 0.1;
    }

    50% {
        -webkit-transform: scale(0.1, 0.1);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-scale(0.1, 0.1);
        /* Safari 7 */
        -webkit-transform: translateZ(0);
        /* Prevent blur on IOS Retina devices */
        -moz-transform: scale(0.1, 0.1);
        /* Firefox */
        -ms-transform: scale(0.1, 0.1);
        /* IE 9 */
        -o-transform: scale(0.1, 0.1);
        /* Opera 10.5 - 15.0 */
        transform: scale(0.1, 0.1);
        opacity: 0.3;
    }

    75% {
        -webkit-transform: scale(0.5, 0.5);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-scale(0.5, 0.5);
        /* Safari 7 */
        -webkit-transform: translateZ(0);
        /* Prevent blur on IOS Retina devices */
        -moz-transform: scale(0.5, 0.5);
        /* Firefox */
        -ms-transform: scale(0.5, 0.5);
        /* IE 9 */
        -o-transform: scale(0.5, 0.5);
        /* Opera 10.5 - 15.0 */
        transform: scale(0.5, 0.5);
        opacity: 0.5;
    }

    100% {
        -webkit-transform: scale(1, 1);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-scale(1, 1);
        /* Safari 7 */
        -webkit-transform: translateZ(0);
        /* Prevent blur on IOS Retina devices */
        -moz-transform: scale(1, 1);
        /* Firefox */
        -ms-transform: scale(1, 1);
        /* IE 9 */
        -o-transform: scale(1, 1);
        /* Opera 10.5 - 15.0 */
        transform: scale(1, 1);
        opacity: 0.0;
    }
}

@-moz-keyframes introjspulse {
    0% {
        -webkit-transform: scale(0, 0);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-scale(0, 0);
        /* Safari 7 */
        -webkit-transform: translateZ(0);
        /* Prevent blur on IOS Retina devices */
        -moz-transform: scale(0, 0);
        /* Firefox */
        -ms-transform: scale(0, 0);
        /* IE 9 */
        -o-transform: scale(0, 0);
        /* Opera 10.5 - 15.0 */
        transform: scale(0, 0);
        opacity: 0.0;
    }

    25% {
        -webkit-transform: scale(0, 0);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-scale(0, 0);
        /* Safari 7 */
        -webkit-transform: translateZ(0);
        /* Prevent blur on IOS Retina devices */
        -moz-transform: scale(0, 0);
        /* Firefox */
        -ms-transform: scale(0, 0);
        /* IE 9 */
        -o-transform: scale(0, 0);
        /* Opera 10.5 - 15.0 */
        transform: scale(0, 0);
        opacity: 0.1;
    }

    50% {
        -webkit-transform: scale(0.1, 0.1);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-scale(0.1, 0.1);
        /* Safari 7 */
        -webkit-transform: translateZ(0);
        /* Prevent blur on IOS Retina devices */
        -moz-transform: scale(0.1, 0.1);
        /* Firefox */
        -ms-transform: scale(0.1, 0.1);
        /* IE 9 */
        -o-transform: scale(0.1, 0.1);
        /* Opera 10.5 - 15.0 */
        transform: scale(0.1, 0.1);
        opacity: 0.3;
    }

    75% {
        -webkit-transform: scale(0.5, 0.5);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-scale(0.5, 0.5);
        /* Safari 7 */
        -webkit-transform: translateZ(0);
        /* Prevent blur on IOS Retina devices */
        -moz-transform: scale(0.5, 0.5);
        /* Firefox */
        -ms-transform: scale(0.5, 0.5);
        /* IE 9 */
        -o-transform: scale(0.5, 0.5);
        /* Opera 10.5 - 15.0 */
        transform: scale(0.5, 0.5);
        opacity: 0.5;
    }

    100% {
        -webkit-transform: scale(1, 1);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-scale(1, 1);
        /* Safari 7 */
        -webkit-transform: translateZ(0);
        /* Prevent blur on IOS Retina devices */
        -moz-transform: scale(1, 1);
        /* Firefox */
        -ms-transform: scale(1, 1);
        /* IE 9 */
        -o-transform: scale(1, 1);
        /* Opera 10.5 - 15.0 */
        transform: scale(1, 1);
        opacity: 0.0;
    }
}

@-o-keyframes introjspulse {
    0% {
        -webkit-transform: scale(0, 0);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-scale(0, 0);
        /* Safari 7 */
        -webkit-transform: translateZ(0);
        /* Prevent blur on IOS Retina devices */
        -moz-transform: scale(0, 0);
        /* Firefox */
        -ms-transform: scale(0, 0);
        /* IE 9 */
        -o-transform: scale(0, 0);
        /* Opera 10.5 - 15.0 */
        transform: scale(0, 0);
        opacity: 0.0;
    }

    25% {
        -webkit-transform: scale(0, 0);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-scale(0, 0);
        /* Safari 7 */
        -webkit-transform: translateZ(0);
        /* Prevent blur on IOS Retina devices */
        -moz-transform: scale(0, 0);
        /* Firefox */
        -ms-transform: scale(0, 0);
        /* IE 9 */
        -o-transform: scale(0, 0);
        /* Opera 10.5 - 15.0 */
        transform: scale(0, 0);
        opacity: 0.1;
    }

    50% {
        -webkit-transform: scale(0.1, 0.1);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-scale(0.1, 0.1);
        /* Safari 7 */
        -webkit-transform: translateZ(0);
        /* Prevent blur on IOS Retina devices */
        -moz-transform: scale(0.1, 0.1);
        /* Firefox */
        -ms-transform: scale(0.1, 0.1);
        /* IE 9 */
        -o-transform: scale(0.1, 0.1);
        /* Opera 10.5 - 15.0 */
        transform: scale(0.1, 0.1);
        opacity: 0.3;
    }

    75% {
        -webkit-transform: scale(0.5, 0.5);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-scale(0.5, 0.5);
        /* Safari 7 */
        -webkit-transform: translateZ(0);
        /* Prevent blur on IOS Retina devices */
        -moz-transform: scale(0.5, 0.5);
        /* Firefox */
        -ms-transform: scale(0.5, 0.5);
        /* IE 9 */
        -o-transform: scale(0.5, 0.5);
        /* Opera 10.5 - 15.0 */
        transform: scale(0.5, 0.5);
        opacity: 0.5;
    }

    100% {
        -webkit-transform: scale(1, 1);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-scale(1, 1);
        /* Safari 7 */
        -webkit-transform: translateZ(0);
        /* Prevent blur on IOS Retina devices */
        -moz-transform: scale(1, 1);
        /* Firefox */
        -ms-transform: scale(1, 1);
        /* IE 9 */
        -o-transform: scale(1, 1);
        /* Opera 10.5 - 15.0 */
        transform: scale(1, 1);
        opacity: 0.0;
    }
}

@keyframes introjspulse {
    0% {
        -webkit-transform: scale(0, 0);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-scale(0, 0);
        /* Safari 7 */
        -webkit-transform: translateZ(0);
        /* Prevent blur on IOS Retina devices */
        -moz-transform: scale(0, 0);
        /* Firefox */
        -ms-transform: scale(0, 0);
        /* IE 9 */
        -o-transform: scale(0, 0);
        /* Opera 10.5 - 15.0 */
        transform: scale(0, 0);
        opacity: 0.0;
    }

    25% {
        -webkit-transform: scale(0, 0);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-scale(0, 0);
        /* Safari 7 */
        -webkit-transform: translateZ(0);
        /* Prevent blur on IOS Retina devices */
        -moz-transform: scale(0, 0);
        /* Firefox */
        -ms-transform: scale(0, 0);
        /* IE 9 */
        -o-transform: scale(0, 0);
        /* Opera 10.5 - 15.0 */
        transform: scale(0, 0);
        opacity: 0.1;
    }

    50% {
        -webkit-transform: scale(0.1, 0.1);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-scale(0.1, 0.1);
        /* Safari 7 */
        -webkit-transform: translateZ(0);
        /* Prevent blur on IOS Retina devices */
        -moz-transform: scale(0.1, 0.1);
        /* Firefox */
        -ms-transform: scale(0.1, 0.1);
        /* IE 9 */
        -o-transform: scale(0.1, 0.1);
        /* Opera 10.5 - 15.0 */
        transform: scale(0.1, 0.1);
        opacity: 0.3;
    }

    75% {
        -webkit-transform: scale(0.5, 0.5);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-scale(0.5, 0.5);
        /* Safari 7 */
        -webkit-transform: translateZ(0);
        /* Prevent blur on IOS Retina devices */
        -moz-transform: scale(0.5, 0.5);
        /* Firefox */
        -ms-transform: scale(0.5, 0.5);
        /* IE 9 */
        -o-transform: scale(0.5, 0.5);
        /* Opera 10.5 - 15.0 */
        transform: scale(0.5, 0.5);
        opacity: 0.5;
    }

    100% {
        -webkit-transform: scale(1, 1);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-scale(1, 1);
        /* Safari 7 */
        -webkit-transform: translateZ(0);
        /* Prevent blur on IOS Retina devices */
        -moz-transform: scale(1, 1);
        /* Firefox */
        -ms-transform: scale(1, 1);
        /* IE 9 */
        -o-transform: scale(1, 1);
        /* Opera 10.5 - 15.0 */
        transform: scale(1, 1);
        opacity: 0.0;
    }
}

/* ---- BASE ---- */
/* ===========================================================

	$FLEXBOX GRID (v2 2018)

    NOTE: This file uses the 'Flexbox' CSS3 property heavily (https://css-tricks.com/snippets/css/a-guide-to-flexbox/). 
    Please familiarise yourself with the feature before adding traditional layout techniques such as 'float' or 'inline-block'.
    See the mixins.scss file for details on the flexbox properties   

=========================================================== */
/* ---- FLEX CONTAINERS ---- */
.flex-column-wrap {
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- */
    display: -ms-flexbox;
    /* OLD - TWEENER - IE 10 */
    display: -webkit-flex;
    /* RECENT - Chrome */
    display: flex;
    /* NEW - Firefox, Chrome, Opera, IE11 */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    -webkit-align-items: stretch;
    align-items: stretch;
    -webkit-align-content: flex-start;
    align-content: flex-start;
}

    .flex-column-wrap.flex-column-wrap--vertical {
        -webkit-flex-direction: column;
        -moz-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .flex-column-wrap.flex-column-wrap--stretch {
        -webkit-justify-content: stretch;
        justify-content: stretch;
        -webkit-align-items: stretch;
        align-items: stretch;
    }

    .flex-column-wrap.flex-column-wrap--wrap,
    .flex-column-wrap.flex-column-wrap--cascade {
        -webkit-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    .flex-column-wrap.flex-column-wrap--reverse {
        -webkit-justify-content: flex-end;
        justify-content: flex-end;
    }

    .flex-column-wrap.flex-column-wrap--justified {
        -webkit-justify-content: space-between;
        justify-content: space-between;
    }

    .flex-column-wrap.flex-column-wrap--middle {
        -webkit-align-items: center;
        align-items: center;
    }

    .flex-column-wrap.flex-column-wrap--baseline {
        -webkit-align-items: flex-end;
        align-items: flex-end;
    }

    .flex-column-wrap.flex-column-wrap--gap {
        margin-bottom: 20px;
    }

/* ---- FLEX COLUMN ----*/
.flex-column-wrap--content .flex-column {
    padding-right: 20px;
}

    .flex-column-wrap--content .flex-column:last-of-type {
        padding-right: 0;
    }

.flex-column:first-child:nth-last-child(1) {
    -webkit-box-flex: 0 1 100%;
    -webkit-flex: 0 1 100%;
    -moz-flex: 0 1 100%;
    -ms-flex: 0 1 100%;
    flex: 0 1 100%;
}

.flex-column:first-child:nth-last-child(2),
.flex-column:first-child:nth-last-child(2) ~ .flex-column {
    -webkit-box-flex: 0 1 50%;
    -webkit-flex: 0 1 50%;
    -moz-flex: 0 1 50%;
    -ms-flex: 0 1 50%;
    flex: 0 1 50%;
}

.flex-column:first-child:nth-last-child(3),
.flex-column:first-child:nth-last-child(3) ~ .flex-column {
    -webkit-box-flex: 0 1 33.33335%;
    -webkit-flex: 0 1 33.33335%;
    -moz-flex: 0 1 33.33335%;
    -ms-flex: 0 1 33.33335%;
    flex: 0 1 33.33335%;
}

.flex-column:first-child:nth-last-child(4),
.flex-column:first-child:nth-last-child(4) ~ .flex-column {
    -webkit-box-flex: 0 1 25%;
    -webkit-flex: 0 1 25%;
    -moz-flex: 0 1 25%;
    -ms-flex: 0 1 25%;
    flex: 0 1 25%;
}

.flex-column:first-child:nth-last-child(5),
.flex-column:first-child:nth-last-child(5) ~ .flex-column {
    -webkit-box-flex: 0 1 20%;
    -webkit-flex: 0 1 20%;
    -moz-flex: 0 1 20%;
    -ms-flex: 0 1 20%;
    flex: 0 1 20%;
}

.flex-column:first-child:nth-last-child(6),
.flex-column:first-child:nth-last-child(6) ~ .flex-column {
    -webkit-box-flex: 0 1 16.66665%;
    -webkit-flex: 0 1 16.66665%;
    -moz-flex: 0 1 16.66665%;
    -ms-flex: 0 1 16.66665%;
    flex: 0 1 16.66665%;
}

.flex-column:first-child:nth-last-child(7),
.flex-column:first-child:nth-last-child(7) ~ .flex-column {
    -webkit-box-flex: 0 1 14.28%;
    -webkit-flex: 0 1 14.28%;
    -moz-flex: 0 1 14.28%;
    -ms-flex: 0 1 14.28%;
    flex: 0 1 14.28%;
}

.flex-column:first-child:nth-last-child(8),
.flex-column:first-child:nth-last-child(8) ~ .flex-column {
    -webkit-box-flex: 0 1 12.5%;
    -webkit-flex: 0 1 12.5%;
    -moz-flex: 0 1 12.5%;
    -ms-flex: 0 1 12.5%;
    flex: 0 1 12.5%;
}

.flex-column:first-child:nth-last-child(9),
.flex-column:first-child:nth-last-child(9) ~ .flex-column {
    -webkit-box-flex: 0 1 11.11115%;
    -webkit-flex: 0 1 11.11115%;
    -moz-flex: 0 1 11.11115%;
    -ms-flex: 0 1 11.11115%;
    flex: 0 1 11.11115%;
}

.flex-column:first-child:nth-last-child(10),
.flex-column:first-child:nth-last-child(10) ~ .flex-column {
    -webkit-box-flex: 0 1 10%;
    -webkit-flex: 0 1 10%;
    -moz-flex: 0 1 10%;
    -ms-flex: 0 1 10%;
    flex: 0 1 10%;
}

.flex-column.flex-column--auto {
    -webkit-box-flex: 0 1 auto !important;
    -webkit-flex: 0 1 auto !important;
    -moz-flex: 0 1 auto !important;
    -ms-flex: 0 1 auto !important;
    flex: 0 1 auto !important;
    max-width: none;
}

.flex-column.flex-column--full {
    -webkit-box-flex: 0 1 100% !important;
    -webkit-flex: 0 1 100% !important;
    -moz-flex: 0 1 100% !important;
    -ms-flex: 0 1 100% !important;
    flex: 0 1 100% !important;
    max-width: none;
}

.flex-column.flex-column--primary {
    -webkit-box-flex: 0 1 75% !important;
    -webkit-flex: 0 1 75% !important;
    -moz-flex: 0 1 75% !important;
    -ms-flex: 0 1 75% !important;
    flex: 0 1 75% !important;
    max-width: 75% !important;
}

.flex-column.flex-column--secondary {
    -webkit-box-flex: 0 1 66.665% !important;
    -webkit-flex: 0 1 66.665% !important;
    -moz-flex: 0 1 66.665% !important;
    -ms-flex: 0 1 66.665% !important;
    flex: 0 1 66.665% !important;
    max-width: 66.665% !important;
}

.flex-column.flex-column--half {
    -webkit-box-flex: 0 1 50% !important;
    -webkit-flex: 0 1 50% !important;
    -moz-flex: 0 1 50% !important;
    -ms-flex: 0 1 50% !important;
    flex: 0 1 50% !important;
    max-width: 50% !important;
}

.flex-column.flex-column--tertiary {
    -webkit-box-flex: 0 1 33.335% !important;
    -webkit-flex: 0 1 33.335% !important;
    -moz-flex: 0 1 33.335% !important;
    -ms-flex: 0 1 33.335% !important;
    flex: 0 1 33.335% !important;
    max-width: 33.335% !important;
}

.flex-column.flex-column--quarternary {
    -webkit-box-flex: 0 1 25% !important;
    -webkit-flex: 0 1 25% !important;
    -moz-flex: 0 1 25% !important;
    -ms-flex: 0 1 25% !important;
    flex: 0 1 25% !important;
    max-width: 25% !important;
}

.flex-column.flex-column--senary {
    -webkit-box-flex: 0 1 16.66% !important;
    -webkit-flex: 0 1 16.66% !important;
    -moz-flex: 0 1 16.66% !important;
    -ms-flex: 0 1 16.66% !important;
    flex: 0 1 16.66% !important;
    max-width: 16.66% !important;
}

.flex-column.flex-column--duodenary {
    -webkit-box-flex: 0 1 8.33% !important;
    -webkit-flex: 0 1 8.33% !important;
    -moz-flex: 0 1 8.33% !important;
    -ms-flex: 0 1 8.33% !important;
    flex: 0 1 8.33% !important;
    max-width: 8.33% !important;
}

.flex-column.flex-column--two {
    -webkit-box-flex: 0 1 50% !important;
    -webkit-flex: 0 1 50% !important;
    -moz-flex: 0 1 50% !important;
    -ms-flex: 0 1 50% !important;
    flex: 0 1 50% !important;
    max-width: 50% !important;
}

.flex-column.flex-column--three {
    -webkit-box-flex: 0 1 33.33335% !important;
    -webkit-flex: 0 1 33.33335% !important;
    -moz-flex: 0 1 33.33335% !important;
    -ms-flex: 0 1 33.33335% !important;
    flex: 0 1 33.33335% !important;
    max-width: 33.33335% !important;
}

.flex-column.flex-column--four {
    -webkit-box-flex: 0 1 25% !important;
    -webkit-flex: 0 1 25% !important;
    -moz-flex: 0 1 25% !important;
    -ms-flex: 0 1 25% !important;
    flex: 0 1 25% !important;
    max-width: 25% !important;
}

.flex-column.flex-column--pad-right {
    padding-right: 20px;
}

/* ============================================================== MEDIA QUERIES ============================================================== */
/* ---- LAPTOP & DESKTOP (1280px +) ---- */
/* ---- MOBILE TO SMALL TABLET (0 - 959px) ---- */
@media only screen and (max-width: 959px) {
    /* ---- USER ROLES IN ADMIN ---- */
    .fieldset--panel.fieldset--user-roles .flex-column.flex-column--half:first-of-type {
        -webkit-box-flex: 0 1 40% !important;
        -webkit-flex: 0 1 40% !important;
        -moz-flex: 0 1 40% !important;
        -ms-flex: 0 1 40% !important;
        flex: 0 1 40% !important;
        max-width: 40% !important;
    }

    .fieldset--panel.fieldset--user-roles .flex-column.flex-column--half:last-of-type {
        -webkit-box-flex: 0 1 60% !important;
        -webkit-flex: 0 1 60% !important;
        -moz-flex: 0 1 60% !important;
        -ms-flex: 0 1 60% !important;
        flex: 0 1 60% !important;
        max-width: 60% !important;
    }
}

/* ---- MOBILE (0 - 599px) ---- */
@media only screen and (max-width: 599px) {
    /* ---- FLEX CONTAINERS ---- */
    .flex-column-wrap {
        -webkit-flex-direction: column;
        -moz-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .flex-column-wrap--cascade {
        -webkit-flex-wrap: nowrap;
        flex-wrap: nowrap;
    }
    /* ---- FLEX COLUMN ----*/
    .flex-column-wrap--content .flex-column {
        padding: 0 0 20px 0;
    }

    .section--bottom-cut-mobile .flex-column-wrap--content .flex-column {
        padding-bottom: 0;
    }

    .flex-column:first-child:nth-last-child(1),
    .flex-column:first-child:nth-last-child(2),
    .flex-column:first-child:nth-last-child(2) ~ .flex-column,
    .flex-column:first-child:nth-last-child(3),
    .flex-column:first-child:nth-last-child(3) ~ .flex-column,
    .flex-column:first-child:nth-last-child(4),
    .flex-column:first-child:nth-last-child(4) ~ .flex-column,
    .flex-column:first-child:nth-last-child(5),
    .flex-column:first-child:nth-last-child(5) ~ .flex-column,
    .flex-column:first-child:nth-last-child(6),
    .flex-column:first-child:nth-last-child(6) ~ .flex-column,
    .flex-column:first-child:nth-last-child(7),
    .flex-column:first-child:nth-last-child(7) ~ .flex-column,
    .flex-column:first-child:nth-last-child(8),
    .flex-column:first-child:nth-last-child(8) ~ .flex-column,
    .flex-column:first-child:nth-last-child(9),
    .flex-column:first-child:nth-last-child(9) ~ .flex-column,
    .flex-column:first-child:nth-last-child(10),
    .flex-column:first-child:nth-last-child(10) ~ .flex-column {
        -webkit-box-flex: 1 1 auto;
        -webkit-flex: 1 1 auto;
        -moz-flex: 1 1 auto;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
    }
}

/* ---- SMALL MOBILE (0 - 479px) ---- */
/* ===========================================================

	$GENERICS (v2 2018)

=========================================================== */
.clear {
    clear: both;
}

.text--left {
    text-align: left;
}

.text--right {
    text-align: right;
}

.text--center {
    text-align: center;
}

.uppercase {
    text-transform: uppercase;
}

.lowercase {
    text-transform: lowercase;
}

.margin--bottom {
    margin-bottom: 20px;
}

.margin--bottom-small {
    margin-bottom: 8px;
}

/* ---- SINGLE CHEVRON ---- */
.la-chevron:after {
    content: "\0020 \2039";
    font-size: 130%;
}

.lb-chevron:before {
    content: "\2039 \0020";
    font-size: 130%;
}

.ra-chevron:after {
    content: "\0020 \203A";
    font-size: 130%;
}

.rb-chevron:before {
    content: "\203A \0020";
    font-size: 130%;
}

/* ---- DOUBLE CHEVRON ---- */
.la-chevrons:after {
    content: "\0020 \00AB";
    font-size: 130%;
}

.lb-chevrons:before {
    content: "\00AB \0020";
    font-size: 130%;
}

.ra-chevrons:after {
    content: "\0020 \00BB";
    font-size: 130%;
}

.rb-chevrons:before {
    content: "\00BB \0020";
    font-size: 130%;
}

/* ======== MESSAGE BOXES ======== */
/* ===========================================================

	$ICONS (v2 2018)

=========================================================== */
.icon {
    background-repeat: no-repeat;
}

    .icon:hover {
        background-repeat: no-repeat;
    }

I.icon {
    display: inline-block;
}

    I.icon:before {
        width: 100%;
        height: 100%;
        line-height: 1;
        font-family: "IcoMoon Basic";
        font-weight: normal;
        color: #414E54;
    }

I.icon--12 {
    width: 12px;
    height: 12px;
}

    I.icon--12:before {
        font-size: 12px;
    }

I.icon--16 {
    width: 16px;
    height: 16px;
}

    I.icon--16:before {
        font-size: 16px;
    }

I.icon--20 {
    width: 20px;
    height: 20px;
}

    I.icon--20:before {
        font-size: 20px;
    }

I.icon--24 {
    width: 24px;
    height: 24px;
}

    I.icon--24:before {
        font-size: 24px;
    }

I.icon--32 {
    width: 32px;
    height: 32px;
}

    I.icon--32:before {
        font-size: 32px;
    }

I.icon--base:before {
    color: #414E54;
}

I.icon--bright:before {
    color: #FFF;
}

I.icon--light:before {
    color: #768A98;
}

I.icon--dark:before {
    color: #1b1b1b;
}

I.icon--primary:before {
    color: #FBE122;
}

I.icon--secondary:before {
    color: #0C2340;
}

I.icon--tertiary:before {
    color: #058C83;
}

I.icon--quarternary:before {
    color: #FF2D55;
}

I.icon--quinary:before {
    color: #F48E22;
}

I.icon--senary:before {
    color: #2B85BA;
}

I.icon--septenary:before {
    color: #C77731;
}

I.icon--octonary:before {
    color: #6ECEB2;
}

I.icon--nonary:before {
    color: #3B9A49;
}

I.icon--denary:before {
    color: #EA1A3E;
}

/* ---- ICONS BUTTONS ---- */
.button--icon .icon {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 12px;
    margin: auto;
}

.button--icon .button--no-text .icon {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    color: transparent;
}

/* ---- ICON INPUT ---- */
I.icon.icon--input {
    display: inline-block;
    position: relative;
}

    I.icon.icon--input:before {
        position: absolute;
        z-index: 100;
        top: 16px;
        bottom: 0;
        left: 12px;
        margin: auto;
    }

    I.icon.icon--input.icon--only {
        margin-right: 8px;
    }

        I.icon.icon--input.icon--only:before {
            top: 0;
            left: 0;
        }

        I.icon.icon--input.icon--only INPUT {
            position: absolute;
            z-index: 200;
        }

/* ---- ICONS WITHIN GRID BUTTONS  ---- */
.button--grid.button--icon .icon {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 8px;
    margin: auto;
}

/* ---- ICONS WITHIN ICON-ONLY BUTTONS ---- */
.button--grid.button--icon-only {
    background-repeat: no-repeat;
}

    .button--grid.button--icon-only:hover {
        background-repeat: no-repeat;
    }

.button.no-text .icon {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    color: transparent;
}

/* ---- CHEVRON ICONS ---- */
.icon.icon--chevron-right {
    position: absolute;
    z-index: 1600;
    display: block;
    top: 15px;
    right: 15px;
    height: 36px;
    width: 36px;
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -ms-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}

    .icon.icon--chevron-right::after, .icon.icon--chevron-right::before {
        /* lines of '>' icon */
        content: '';
        position: absolute;
        height: 4px;
        width: 18px;
        left: 30%;
        top: 50%;
        background-color: #F48E22;
        -webkit-backface-visibility: hidden;
        -moz-backface-visibility: hidden;
        -ms-backface-visibility: hidden;
        -o-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-transition: background-color 0.4s ease;
        -moz-transition: background-color 0.4s ease;
        -ms-transition: background-color 0.4s ease;
        -o-transition: background-color 0.4s ease;
        transition: background-color 0.4s ease;
    }

    .icon.icon--chevron-right::before {
        -webkit-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        -moz-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        -o-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        -ms-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        transform: translateX(-36%) translateY(-30%) rotate(-45deg);
    }

    .icon.icon--chevron-right::after {
        -webkit-transform: translateX(36%) translateY(-30%) rotate(45deg);
        -moz-transform: translateX(36%) translateY(-30%) rotate(45deg);
        -o-transform: translateX(36%) translateY(-30%) rotate(45deg);
        -ms-transform: translateX(36%) translateY(-30%) rotate(45deg);
        transform: translateX(36%) translateY(-30%) rotate(45deg);
    }

    .icon.icon--chevron-right:hover::after, .icon.icon--chevron-right:hover::before {
        background-color: #f6a753;
    }

.icon.icon--chevron-left {
    position: absolute;
    z-index: 1600;
    display: block;
    top: 15px;
    right: 15px;
    height: 36px;
    width: 36px;
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -ms-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
    -webkit-transform: rotate(270deg);
    -moz-transform: rotate(270deg);
    -o-transform: rotate(270deg);
    -ms-transform: rotate(270deg);
    transform: rotate(270deg);
}

    .icon.icon--chevron-left::after, .icon.icon--chevron-left::before {
        /* lines of '>' icon */
        content: '';
        position: absolute;
        height: 4px;
        width: 18px;
        left: 30%;
        top: 50%;
        background-color: #F48E22;
        -webkit-backface-visibility: hidden;
        -moz-backface-visibility: hidden;
        -ms-backface-visibility: hidden;
        -o-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-transition: background-color 0.4s ease;
        -moz-transition: background-color 0.4s ease;
        -ms-transition: background-color 0.4s ease;
        -o-transition: background-color 0.4s ease;
        transition: background-color 0.4s ease;
    }

    .icon.icon--chevron-left::before {
        -webkit-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        -moz-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        -o-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        -ms-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        transform: translateX(-36%) translateY(-30%) rotate(-45deg);
    }

    .icon.icon--chevron-left::after {
        -webkit-transform: translateX(36%) translateY(-30%) rotate(45deg);
        -moz-transform: translateX(36%) translateY(-30%) rotate(45deg);
        -o-transform: translateX(36%) translateY(-30%) rotate(45deg);
        -ms-transform: translateX(36%) translateY(-30%) rotate(45deg);
        transform: translateX(36%) translateY(-30%) rotate(45deg);
    }

    .icon.icon--chevron-left:hover::after, .icon.icon--chevron-left:hover::before {
        background-color: #f6a753;
    }

/* ---- EXPAND DOTS ICON ---- */
I.icon.icon--light.icon--expand-dots {
    position: absolute;
    z-index: 1600;
    display: block;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 4px;
    height: 4px;
    margin: auto;
    background-color: #768A98;
    border-radius: 4px;
    overflow: visible;
    white-space: nowrap;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -ms-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

    I.icon.icon--light.icon--expand-dots::after, I.icon.icon--light.icon--expand-dots::before {
        /* dots of symbol */
        content: '';
        display: inline-block;
        position: absolute;
        width: 4px;
        height: 4px;
        background-color: #768A98;
        border-radius: 4px;
        -webkit-transition: background-color 0.4s ease;
        -moz-transition: background-color 0.4s ease;
        -ms-transition: background-color 0.4s ease;
        -o-transition: background-color 0.4s ease;
        transition: background-color 0.4s ease;
    }

    I.icon.icon--light.icon--expand-dots::before {
        left: 4.8px;
        /*background-color:red;*/
    }

    I.icon.icon--light.icon--expand-dots::after {
        right: 4.8px;
        /*background-color:green;*/
    }

    I.icon.icon--light.icon--expand-dots:hover {
        background-color: #697d8c;
    }

        I.icon.icon--light.icon--expand-dots:hover::after, I.icon.icon--light.icon--expand-dots:hover::before {
            background-color: #697d8c;
        }

/* ======== SPRITE ICON FONT ======== */
.icon--home:before {
    content: "\e900";
}

.icon--home2:before {
    content: "\e901";
}

.icon--home3:before {
    content: "\e902";
}

.icon--office:before {
    content: "\e903";
}

.icon--newspaper:before {
    content: "\e904";
}

.icon--pencil:before {
    content: "\e905";
}

.icon--pencil2:before {
    content: "\e906";
}

.icon--quill:before {
    content: "\e907";
}

.icon--pen:before {
    content: "\e908";
}

.icon--blog:before {
    content: "\e909";
}

.icon--eyedropper:before {
    content: "\e90a";
}

.icon--droplet:before {
    content: "\e90b";
}

.icon--paint-format:before {
    content: "\e90c";
}

.icon--image:before {
    content: "\e90d";
}

.icon--images:before {
    content: "\e90e";
}

.icon--camera:before {
    content: "\e90f";
}

.icon--headphones:before {
    content: "\e910";
}

.icon--music:before {
    content: "\e911";
}

.icon--play:before {
    content: "\e912";
}

.icon--film:before {
    content: "\e913";
}

.icon--video-camera:before {
    content: "\e914";
}

.icon--dice:before {
    content: "\e915";
}

.icon--pacman:before {
    content: "\e916";
}

.icon--spades:before {
    content: "\e917";
}

.icon--clubs:before {
    content: "\e918";
}

.icon--diamonds:before {
    content: "\e919";
}

.icon--bullhorn:before {
    content: "\e91a";
}

.icon--connection:before {
    content: "\e91b";
}

.icon--podcast:before {
    content: "\e91c";
}

.icon--feed:before {
    content: "\e91d";
}

.icon--mic:before {
    content: "\e91e";
}

.icon--book:before {
    content: "\e91f";
}

.icon--books:before {
    content: "\e920";
}

.icon--library:before {
    content: "\e921";
}

.icon--file-text:before {
    content: "\e922";
}

.icon--profile:before {
    content: "\e923";
}

.icon--file-empty:before {
    content: "\e924";
}

.icon--files-empty:before {
    content: "\e925";
}

.icon--file-text2:before {
    content: "\e926";
}

.icon--file-picture:before {
    content: "\e927";
}

.icon--file-music:before {
    content: "\e928";
}

.icon--file-play:before {
    content: "\e929";
}

.icon--file-video:before {
    content: "\e92a";
}

.icon--file-zip:before {
    content: "\e92b";
}

.icon--copy:before {
    content: "\e92c";
}

.icon--paste:before {
    content: "\e92d";
}

.icon--stack:before {
    content: "\e92e";
}

.icon--folder:before {
    content: "\e92f";
}

.icon--folder-open:before {
    content: "\e930";
}

.icon--folder-plus:before {
    content: "\e931";
}

.icon--folder-minus:before {
    content: "\e932";
}

.icon--folder-download:before {
    content: "\e933";
}

.icon--folder-upload:before {
    content: "\e934";
}

.icon--price-tag:before {
    content: "\e935";
}

.icon--price-tags:before {
    content: "\e936";
}

.icon--barcode:before {
    content: "\e937";
}

.icon--qrcode:before {
    content: "\e938";
}

.icon--ticket:before {
    content: "\e939";
}

.icon--cart:before {
    content: "\e93a";
}

.icon--coin-dollar:before {
    content: "\e93b";
}

.icon--coin-euro:before {
    content: "\e93c";
}

.icon--coin-pound:before {
    content: "\e93d";
}

.icon--coin-yen:before {
    content: "\e93e";
}

.icon--credit-card:before {
    content: "\e93f";
}

.icon--calculator:before {
    content: "\e940";
}

.icon--lifebuoy:before {
    content: "\e941";
}

.icon--phone:before {
    content: "\e942";
}

.icon--phone-hang-up:before {
    content: "\e943";
}

.icon--address-book:before {
    content: "\e944";
}

.icon--envelop:before {
    content: "\e945";
}

.icon--pushpin:before {
    content: "\e946";
}

.icon--location:before {
    content: "\e947";
}

.icon--location2:before {
    content: "\e948";
}

.icon--compass:before {
    content: "\e949";
}

.icon--compass2:before {
    content: "\e94a";
}

.icon--map:before {
    content: "\e94b";
}

.icon--map2:before {
    content: "\e94c";
}

.icon--history:before {
    content: "\e94d";
}

.icon--clock:before {
    content: "\e94e";
}

.icon--clock2:before {
    content: "\e94f";
}

.icon--alarm:before {
    content: "\e950";
}

.icon--bell:before {
    content: "\e951";
}

.icon--stopwatch:before {
    content: "\e952";
}

.icon--calendar:before {
    content: "\e953";
}

.icon--printer:before {
    content: "\e954";
}

.icon--keyboard:before {
    content: "\e955";
}

.icon--display:before {
    content: "\e956";
}

.icon--laptop:before {
    content: "\e957";
}

.icon--mobile:before {
    content: "\e958";
}

.icon--mobile2:before {
    content: "\e959";
}

.icon--tablet:before {
    content: "\e95a";
}

.icon--tv:before {
    content: "\e95b";
}

.icon--drawer:before {
    content: "\e95c";
}

.icon--drawer2:before {
    content: "\e95d";
}

.icon--box-add:before {
    content: "\e95e";
}

.icon--box-remove:before {
    content: "\e95f";
}

.icon--download:before {
    content: "\e960";
}

.icon--upload:before {
    content: "\e961";
}

.icon--floppy-disk:before {
    content: "\e962";
}

.icon--drive:before {
    content: "\e963";
}

.icon--database:before {
    content: "\e964";
}

.icon--undo:before {
    content: "\e965";
}

.icon--redo:before {
    content: "\e966";
}

.icon--undo2:before {
    content: "\e967";
}

.icon--redo2:before {
    content: "\e968";
}

.icon--forward:before {
    content: "\e969";
}

.icon--reply:before {
    content: "\e96a";
}

.icon--bubble:before {
    content: "\e96b";
}

.icon--bubbles:before {
    content: "\e96c";
}

.icon--bubbles2:before {
    content: "\e96d";
}

.icon--bubble2:before {
    content: "\e96e";
}

.icon--bubbles3:before {
    content: "\e96f";
}

.icon--bubbles4:before {
    content: "\e970";
}

.icon--user:before {
    content: "\e971";
}

.icon--users:before {
    content: "\e972";
}

.icon--user-plus:before {
    content: "\e973";
}

.icon--user-minus:before {
    content: "\e974";
}

.icon--user-check:before {
    content: "\e975";
}

.icon--user-tie:before {
    content: "\e976";
}

.icon--quotes-left:before {
    content: "\e977";
}

.icon--quotes-right:before {
    content: "\e978";
}

.icon--hour-glass:before {
    content: "\e979";
}

.icon--spinner:before {
    content: "\e97a";
}

.icon--spinner2:before {
    content: "\e97b";
}

.icon--spinner3:before {
    content: "\e97c";
}

.icon--spinner4:before {
    content: "\e97d";
}

.icon--spinner5:before {
    content: "\e97e";
}

.icon--spinner6:before {
    content: "\e97f";
}

.icon--spinner7:before {
    content: "\e980";
}

.icon--spinner8:before {
    content: "\e981";
}

.icon--spinner9:before {
    content: "\e982";
}

.icon--spinner10:before {
    content: "\e983";
}

.icon--spinner11:before {
    content: "\e984";
}

.icon--binoculars:before {
    content: "\e985";
}

.icon--search:before {
    content: "\e986";
}

.icon--zoom-in:before {
    content: "\e987";
}

.icon--zoom-out:before {
    content: "\e988";
}

.icon--enlarge:before {
    content: "\e989";
}

.icon--shrink:before {
    content: "\e98a";
}

.icon--enlarge2:before {
    content: "\e98b";
}

.icon--shrink2:before {
    content: "\e98c";
}

.icon--key:before {
    content: "\e98d";
}

.icon--key2:before {
    content: "\e98e";
}

.icon--lock:before {
    content: "\e98f";
}

.icon--unlocked:before {
    content: "\e990";
}

.icon--wrench:before {
    content: "\e991";
}

.icon--equalizer:before {
    content: "\e992";
}

.icon--equalizer2:before {
    content: "\e993";
}

.icon--cog:before {
    content: "\e994";
}

.icon--cogs:before {
    content: "\e995";
}

.icon--hammer:before {
    content: "\e996";
}

.icon--magic-wand:before {
    content: "\e997";
}

.icon--aid-kit:before {
    content: "\e998";
}

.icon--bug:before {
    content: "\e999";
}

.icon--pie-chart:before {
    content: "\e99a";
}

.icon--stats-dots:before {
    content: "\e99b";
}

.icon--stats-bars:before {
    content: "\e99c";
}

.icon--stats-bars2:before {
    content: "\e99d";
}

.icon--trophy:before {
    content: "\e99e";
}

.icon--gift:before {
    content: "\e99f";
}

.icon--glass:before {
    content: "\e9a0";
}

.icon--glass2:before {
    content: "\e9a1";
}

.icon--mug:before {
    content: "\e9a2";
}

.icon--spoon-knife:before {
    content: "\e9a3";
}

.icon--leaf:before {
    content: "\e9a4";
}

.icon--rocket:before {
    content: "\e9a5";
}

.icon--dashboard:before,
.icon--meter:before {
    content: "\e9a6";
}

.icon--dashboard2:before,
.icon--meter2:before {
    content: "\e9a7";
}

.icon--hammer2:before {
    content: "\e9a8";
}

.icon--fire:before {
    content: "\e9a9";
}

.icon--lab:before {
    content: "\e9aa";
}

.icon--magnet:before {
    content: "\e9ab";
}

.icon--bin:before {
    content: "\e9ac";
}

.icon--bin2:before {
    content: "\e9ad";
}

.icon--briefcase:before {
    content: "\e9ae";
}

.icon--airplane:before {
    content: "\e9af";
}

.icon--truck:before {
    content: "\e9b0";
}

.icon--road:before {
    content: "\e9b1";
}

.icon--accessibility:before {
    content: "\e9b2";
}

.icon--target:before {
    content: "\e9b3";
}

.icon--shield:before {
    content: "\e9b4";
}

.icon--power:before {
    content: "\e9b5";
}

.icon--switch:before {
    content: "\e9b6";
}

.icon--power-cord:before {
    content: "\e9b7";
}

.icon--clipboard:before {
    content: "\e9b8";
}

.icon--list-numbered:before {
    content: "\e9b9";
}

.icon--list:before {
    content: "\e9ba";
}

.icon--list2:before {
    content: "\e9bb";
}

.icon--tree:before {
    content: "\e9bc";
}

.icon--menu:before {
    content: "\e9bd";
}

.icon--menu2:before {
    content: "\e9be";
}

.icon--menu3:before {
    content: "\e9bf";
}

.icon--menu4:before {
    content: "\e9c0";
}

.icon--cloud:before {
    content: "\e9c1";
}

.icon--cloud-download:before {
    content: "\e9c2";
}

.icon--cloud-upload:before {
    content: "\e9c3";
}

.icon--cloud-check:before {
    content: "\e9c4";
}

.icon--download2:before {
    content: "\e9c5";
}

.icon--upload2:before {
    content: "\e9c6";
}

.icon--download3:before {
    content: "\e9c7";
}

.icon--upload3:before {
    content: "\e9c8";
}

.icon--sphere:before {
    content: "\e9c9";
}

.icon--earth:before {
    content: "\e9ca";
}

.icon--link:before {
    content: "\e9cb";
}

.icon--flag:before {
    content: "\e9cc";
}

.icon--attachment:before {
    content: "\e9cd";
}

.icon--eye:before {
    content: "\e9ce";
}

.icon--eye-plus:before {
    content: "\e9cf";
}

.icon--eye-minus:before {
    content: "\e9d0";
}

.icon--eye-blocked:before {
    content: "\e9d1";
}

.icon--bookmark:before {
    content: "\e9d2";
}

.icon--bookmarks:before {
    content: "\e9d3";
}

.icon--sun:before {
    content: "\e9d4";
}

.icon--contrast:before {
    content: "\e9d5";
}

.icon--brightness-contrast:before {
    content: "\e9d6";
}

.icon--star-empty:before {
    content: "\e9d7";
}

.icon--star-half:before {
    content: "\e9d8";
}

.icon--star-full:before {
    content: "\e9d9";
}

.icon--heart:before {
    content: "\e9da";
}

.icon--heart-broken:before {
    content: "\e9db";
}

.icon--man:before {
    content: "\e9dc";
}

.icon--woman:before {
    content: "\e9dd";
}

.icon--man-woman:before {
    content: "\e9de";
}

.icon--happy:before {
    content: "\e9df";
}

.icon--happy2:before {
    content: "\e9e0";
}

.icon--smile:before {
    content: "\e9e1";
}

.icon--smile2:before {
    content: "\e9e2";
}

.icon--tongue:before {
    content: "\e9e3";
}

.icon--tongue2:before {
    content: "\e9e4";
}

.icon--sad:before {
    content: "\e9e5";
}

.icon--sad2:before {
    content: "\e9e6";
}

.icon--wink:before {
    content: "\e9e7";
}

.icon--wink2:before {
    content: "\e9e8";
}

.icon--grin:before {
    content: "\e9e9";
}

.icon--grin2:before {
    content: "\e9ea";
}

.icon--cool:before {
    content: "\e9eb";
}

.icon--cool2:before {
    content: "\e9ec";
}

.icon--angry:before {
    content: "\e9ed";
}

.icon--angry2:before {
    content: "\e9ee";
}

.icon--evil:before {
    content: "\e9ef";
}

.icon--evil2:before {
    content: "\e9f0";
}

.icon--shocked:before {
    content: "\e9f1";
}

.icon--shocked2:before {
    content: "\e9f2";
}

.icon--baffled:before {
    content: "\e9f3";
}

.icon--baffled2:before {
    content: "\e9f4";
}

.icon--confused:before {
    content: "\e9f5";
}

.icon--confused2:before {
    content: "\e9f6";
}

.icon--neutral:before {
    content: "\e9f7";
}

.icon--neutral2:before {
    content: "\e9f8";
}

.icon--hipster:before {
    content: "\e9f9";
}

.icon--hipster2:before {
    content: "\e9fa";
}

.icon--wondering:before {
    content: "\e9fb";
}

.icon--wondering2:before {
    content: "\e9fc";
}

.icon--sleepy:before {
    content: "\e9fd";
}

.icon--sleepy2:before {
    content: "\e9fe";
}

.icon--frustrated:before {
    content: "\e9ff";
}

.icon--frustrated2:before {
    content: "\ea00";
}

.icon--crying:before {
    content: "\ea01";
}

.icon--crying2:before {
    content: "\ea02";
}

.icon--point-up:before {
    content: "\ea03";
}

.icon--point-right:before {
    content: "\ea04";
}

.icon--point-down:before {
    content: "\ea05";
}

.icon--point-left:before {
    content: "\ea06";
}

.icon--warning:before {
    content: "\ea07";
}

.icon--notification:before {
    content: "\ea08";
}

.icon--question:before {
    content: "\ea09";
}

.icon--plus:before {
    content: "\ea0a";
}

.icon--minus:before {
    content: "\ea0b";
}

.icon--info:before {
    content: "\ea0c";
}

.icon--cancel-circle:before {
    content: "\ea0d";
}

.icon--blocked:before {
    content: "\ea0e";
}

.icon--cross:before {
    content: "\ea0f";
}

.icon--checkmark:before {
    content: "\ea10";
}

.icon--checkmark2:before {
    content: "\ea11";
}

.icon--spell-check:before {
    content: "\ea12";
}

.icon--enter:before {
    content: "\ea13";
}

.icon--exit:before {
    content: "\ea14";
}

.icon--play2:before {
    content: "\ea15";
}

.icon--pause:before {
    content: "\ea16";
}

.icon--stop:before {
    content: "\ea17";
}

.icon--previous:before {
    content: "\ea18";
}

.icon--next:before {
    content: "\ea19";
}

.icon--backward:before {
    content: "\ea1a";
}

.icon--forward2:before {
    content: "\ea1b";
}

.icon--play3:before {
    content: "\ea1c";
}

.icon--pause2:before {
    content: "\ea1d";
}

.icon--stop2:before {
    content: "\ea1e";
}

.icon--backward2:before {
    content: "\ea1f";
}

.icon--forward3:before {
    content: "\ea20";
}

.icon--first:before {
    content: "\ea21";
}

.icon--last:before {
    content: "\ea22";
}

.icon--previous2:before {
    content: "\ea23";
}

.icon--next2:before {
    content: "\ea24";
}

.icon--eject:before {
    content: "\ea25";
}

.icon--volume-high:before {
    content: "\ea26";
}

.icon--volume-medium:before {
    content: "\ea27";
}

.icon--volume-low:before {
    content: "\ea28";
}

.icon--volume-mute:before {
    content: "\ea29";
}

.icon--volume-mute2:before {
    content: "\ea2a";
}

.icon--volume-increase:before {
    content: "\ea2b";
}

.icon--volume-decrease:before {
    content: "\ea2c";
}

.icon--loop:before {
    content: "\ea2d";
}

.icon--loop2:before {
    content: "\ea2e";
}

.icon--infinite:before {
    content: "\ea2f";
}

.icon--shuffle:before {
    content: "\ea30";
}

.icon--arrow-up-left:before {
    content: "\ea31";
}

.icon--arrow-up:before {
    content: "\ea32";
}

.icon--arrow-up-right:before {
    content: "\ea33";
}

.icon--arrow-right:before {
    content: "\ea34";
}

.icon--arrow-down-right:before {
    content: "\ea35";
}

.icon--arrow-down:before {
    content: "\ea36";
}

.icon--arrow-down-left:before {
    content: "\ea37";
}

.icon--arrow-left:before {
    content: "\ea38";
}

.icon--arrow-up-left2:before {
    content: "\ea39";
}

.icon--arrow-up2:before {
    content: "\ea3a";
}

.icon--arrow-up-right2:before {
    content: "\ea3b";
}

.icon--arrow-right2:before {
    content: "\ea3c";
}

.icon--arrow-down-right2:before {
    content: "\ea3d";
}

.icon--arrow-down2:before {
    content: "\ea3e";
}

.icon--arrow-down-left2:before {
    content: "\ea3f";
}

.icon--arrow-left2:before {
    content: "\ea40";
}

.icon--circle-up:before {
    content: "\ea41";
}

.icon--circle-right:before {
    content: "\ea42";
}

.icon--circle-down:before {
    content: "\ea43";
}

.icon--circle-left:before {
    content: "\ea44";
}

.icon--tab:before {
    content: "\ea45";
}

.icon--move-up:before {
    content: "\ea46";
}

.icon--move-down:before {
    content: "\ea47";
}

.icon--sort-alpha-asc:before {
    content: "\ea48";
}

.icon--sort-alpha-desc:before {
    content: "\ea49";
}

.icon--sort-numeric-asc:before {
    content: "\ea4a";
}

.icon--sort-numberic-desc:before {
    content: "\ea4b";
}

.icon--sort-amount-asc:before {
    content: "\ea4c";
}

.icon--sort-amount-desc:before {
    content: "\ea4d";
}

.icon--command:before {
    content: "\ea4e";
}

.icon--shift:before {
    content: "\ea4f";
}

.icon--ctrl:before {
    content: "\ea50";
}

.icon--opt:before {
    content: "\ea51";
}

.icon--checkbox-checked:before {
    content: "\ea52";
}

.icon--checkbox-unchecked:before {
    content: "\ea53";
}

.icon--radio-checked:before {
    content: "\ea54";
}

.icon--radio-checked2:before {
    content: "\ea55";
}

.icon--radio-unchecked:before {
    content: "\ea56";
}

.icon--crop:before {
    content: "\ea57";
}

.icon--make-group:before {
    content: "\ea58";
}

.icon--ungroup:before {
    content: "\ea59";
}

.icon--scissors:before {
    content: "\ea5a";
}

.icon--filter:before {
    content: "\ea5b";
}

.icon--font:before {
    content: "\ea5c";
}

.icon--ligature:before {
    content: "\ea5d";
}

.icon--ligature2:before {
    content: "\ea5e";
}

.icon--text-height:before {
    content: "\ea5f";
}

.icon--text-width:before {
    content: "\ea60";
}

.icon--font-size:before {
    content: "\ea61";
}

.icon--bold:before {
    content: "\ea62";
}

.icon--underline:before {
    content: "\ea63";
}

.icon--italic:before {
    content: "\ea64";
}

.icon--strikethrough:before {
    content: "\ea65";
}

.icon--omega:before {
    content: "\ea66";
}

.icon--sigma:before {
    content: "\ea67";
}

.icon--page-break:before {
    content: "\ea68";
}

.icon--superscript:before {
    content: "\ea69";
}

.icon--subscript:before {
    content: "\ea6a";
}

.icon--superscript2:before {
    content: "\ea6b";
}

.icon--subscript2:before {
    content: "\ea6c";
}

.icon--text-color:before {
    content: "\ea6d";
}

.icon--pagebreak:before {
    content: "\ea6e";
}

.icon--clear-formatting:before {
    content: "\ea6f";
}

.icon--table:before {
    content: "\ea70";
}

.icon--table2:before {
    content: "\ea71";
}

.icon--insert-template:before {
    content: "\ea72";
}

.icon--pilcrow:before {
    content: "\ea73";
}

.icon--ltr:before {
    content: "\ea74";
}

.icon--rtl:before {
    content: "\ea75";
}

.icon--section:before {
    content: "\ea76";
}

.icon--paragraph-left:before {
    content: "\ea77";
}

.icon--paragraph-center:before {
    content: "\ea78";
}

.icon--paragraph-right:before {
    content: "\ea79";
}

.icon--paragraph-justify:before {
    content: "\ea7a";
}

.icon--indent-increase:before {
    content: "\ea7b";
}

.icon--indent-decrease:before {
    content: "\ea7c";
}

.icon--share:before {
    content: "\ea7d";
}

.icon--new-tab:before {
    content: "\ea7e";
}

.icon--embed:before {
    content: "\ea7f";
}

.icon--embed2:before {
    content: "\ea80";
}

.icon--terminal:before {
    content: "\ea81";
}

.icon--share2:before {
    content: "\ea82";
}

.icon--mail:before {
    content: "\ea83";
}

.icon--mail2:before {
    content: "\ea84";
}

.icon--mail3:before {
    content: "\ea85";
}

.icon--mail4:before {
    content: "\ea86";
}

.icon--amazon:before {
    content: "\ea87";
}

.icon--google:before {
    content: "\ea88";
}

.icon--google2:before {
    content: "\ea89";
}

.icon--google3:before {
    content: "\ea8a";
}

.icon--google-plus:before {
    content: "\ea8b";
}

.icon--google-plus2:before {
    content: "\ea8c";
}

.icon--google-plus3:before {
    content: "\ea8d";
}

.icon--hangouts:before {
    content: "\ea8e";
}

.icon--google-drive:before {
    content: "\ea8f";
}

.icon--facebook:before {
    content: "\ea90";
}

.icon--facebook2:before {
    content: "\ea91";
}

.icon--instagram:before {
    content: "\ea92";
}

.icon--whatsapp:before {
    content: "\ea93";
}

.icon--spotify:before {
    content: "\ea94";
}

.icon--telegram:before {
    content: "\ea95";
}

.icon--twitter:before {
    content: "\ea96";
}

.icon--vine:before {
    content: "\ea97";
}

.icon--vk:before {
    content: "\ea98";
}

.icon--renren:before {
    content: "\ea99";
}

.icon--sina-weibo:before {
    content: "\ea9a";
}

.icon--rss:before {
    content: "\ea9b";
}

.icon--rss2:before {
    content: "\ea9c";
}

.icon--youtube:before {
    content: "\ea9d";
}

.icon--youtube2:before {
    content: "\ea9e";
}

.icon--twitch:before {
    content: "\ea9f";
}

.icon--vimeo:before {
    content: "\eaa0";
}

.icon--vimeo2:before {
    content: "\eaa1";
}

.icon--lanyrd:before {
    content: "\eaa2";
}

.icon--flickr:before {
    content: "\eaa3";
}

.icon--flickr2:before {
    content: "\eaa4";
}

.icon--flickr3:before {
    content: "\eaa5";
}

.icon--flickr4:before {
    content: "\eaa6";
}

.icon--dribbble:before {
    content: "\eaa7";
}

.icon--behance:before {
    content: "\eaa8";
}

.icon--behance2:before {
    content: "\eaa9";
}

.icon--deviantart:before {
    content: "\eaaa";
}

.icon--500px:before {
    content: "\eaab";
}

.icon--steam:before {
    content: "\eaac";
}

.icon--steam2:before {
    content: "\eaad";
}

.icon--dropbox:before {
    content: "\eaae";
}

.icon--onedrive:before {
    content: "\eaaf";
}

.icon--github:before {
    content: "\eab0";
}

.icon--npm:before {
    content: "\eab1";
}

.icon--basecamp:before {
    content: "\eab2";
}

.icon--trello:before {
    content: "\eab3";
}

.icon--wordpress:before {
    content: "\eab4";
}

.icon--joomla:before {
    content: "\eab5";
}

.icon--ello:before {
    content: "\eab6";
}

.icon--blogger:before {
    content: "\eab7";
}

.icon--blogger2:before {
    content: "\eab8";
}

.icon--tumblr:before {
    content: "\eab9";
}

.icon--tumblr2:before {
    content: "\eaba";
}

.icon--yahoo:before {
    content: "\eabb";
}

.icon--yahoo2:before {
    content: "\eabc";
}

.icon--tux:before {
    content: "\eabd";
}

.icon--appleinc:before {
    content: "\eabe";
}

.icon--finder:before {
    content: "\eabf";
}

.icon--android:before {
    content: "\eac0";
}

.icon--windows:before {
    content: "\eac1";
}

.icon--windows8:before {
    content: "\eac2";
}

.icon--soundcloud:before {
    content: "\eac3";
}

.icon--soundcloud2:before {
    content: "\eac4";
}

.icon--skype:before {
    content: "\eac5";
}

.icon--reddit:before {
    content: "\eac6";
}

.icon--hackernews:before {
    content: "\eac7";
}

.icon--wikipedia:before {
    content: "\eac8";
}

.icon--linkedin:before {
    content: "\eac9";
}

.icon--linkedin2:before {
    content: "\eaca";
}

.icon--lastfm:before {
    content: "\eacb";
}

.icon--lastfm2:before {
    content: "\eacc";
}

.icon--delicious:before {
    content: "\eacd";
}

.icon--stumbleupon:before {
    content: "\eace";
}

.icon--stumbleupon2:before {
    content: "\eacf";
}

.icon--stackoverflow:before {
    content: "\ead0";
}

.icon--pinterest:before {
    content: "\ead1";
}

.icon--pinterest2:before {
    content: "\ead2";
}

.icon--xing:before {
    content: "\ead3";
}

.icon--xing2:before {
    content: "\ead4";
}

.icon--flattr:before {
    content: "\ead5";
}

.icon--foursquare:before {
    content: "\ead6";
}

.icon--yelp:before {
    content: "\ead7";
}

.icon--paypal:before {
    content: "\ead8";
}

.icon--chrome:before {
    content: "\ead9";
}

.icon--firefox:before {
    content: "\eada";
}

.icon--IE:before {
    content: "\eadb";
}

.icon--edge:before {
    content: "\eadc";
}

.icon--safari:before {
    content: "\eadd";
}

.icon--opera:before {
    content: "\eade";
}

.icon--file-pdf:before {
    content: "\eadf";
}

.icon--file-openoffice:before {
    content: "\eae0";
}

.icon--file-word:before {
    content: "\eae1";
}

.icon--file-excel:before {
    content: "\eae2";
}

.icon--libreoffice:before {
    content: "\eae3";
}

.icon--html-five:before {
    content: "\eae4";
}

.icon--html-five2:before {
    content: "\eae5";
}

.icon--css3:before {
    content: "\eae6";
}

.icon--git:before {
    content: "\eae7";
}

.icon--codepen:before {
    content: "\eae8";
}

.icon--svg:before {
    content: "\eae9";
}

.icon--IcoMoon:before {
    content: "\eaea";
}

.icon--uni21:before {
    content: "\21";
}

.icon--uni22:before {
    content: "\22";
}

.icon--uni23:before {
    content: "\23";
}

.icon--uni24:before {
    content: "\24";
}

.icon--uni25:before {
    content: "\25";
}

.icon--uni26:before {
    content: "\26";
}

.icon--uni27:before {
    content: "\27";
}

.icon--uni28:before {
    content: "\28";
}

.icon--uni29:before {
    content: "\29";
}

.icon--uni2A:before {
    content: "\2a";
}

.icon--uni2B:before {
    content: "\2b";
}

.icon--uni2C:before {
    content: "\2c";
}

.icon--uni2D:before {
    content: "\2d";
}

.icon--uni2E:before {
    content: "\2e";
}

.icon--uni2F:before {
    content: "\2f";
}

.icon--uni30:before {
    content: "\30";
}

.icon--uni31:before {
    content: "\31";
}

.icon--uni32:before {
    content: "\32";
}

.icon--uni33:before {
    content: "\33";
}

.icon--uni34:before {
    content: "\34";
}

.icon--uni35:before {
    content: "\35";
}

.icon--uni36:before {
    content: "\36";
}

.icon--uni37:before {
    content: "\37";
}

.icon--uni38:before {
    content: "\38";
}

.icon--uni39:before {
    content: "\39";
}

.icon--uni3A:before {
    content: "\3a";
}

.icon--uni3B:before {
    content: "\3b";
}

.icon--uni3C:before {
    content: "\3c";
}

.icon--uni3D:before {
    content: "\3d";
}

.icon--uni3E:before {
    content: "\3e";
}

.icon--uni3F:before {
    content: "\3f";
}

.icon--uni40:before {
    content: "\40";
}

.icon--uni41:before {
    content: "\41";
}

.icon--uni42:before {
    content: "\42";
}

.icon--uni43:before {
    content: "\43";
}

.icon--uni44:before {
    content: "\44";
}

.icon--uni45:before {
    content: "\45";
}

.icon--uni46:before {
    content: "\46";
}

.icon--uni47:before {
    content: "\47";
}

.icon--uni48:before {
    content: "\48";
}

.icon--uni49:before {
    content: "\49";
}

.icon--uni4A:before {
    content: "\4a";
}

.icon--uni4B:before {
    content: "\4b";
}

.icon--uni4C:before {
    content: "\4c";
}

.icon--uni4D:before {
    content: "\4d";
}

.icon--uni4E:before {
    content: "\4e";
}

.icon--uni4F:before {
    content: "\4f";
}

.icon--uni50:before {
    content: "\50";
}

.icon--uni51:before {
    content: "\51";
}

.icon--uni52:before {
    content: "\52";
}

.icon--uni53:before {
    content: "\53";
}

.icon--uni54:before {
    content: "\54";
}

.icon--uni55:before {
    content: "\55";
}

.icon--uni56:before {
    content: "\56";
}

.icon--uni57:before {
    content: "\57";
}

.icon--uni58:before {
    content: "\58";
}

.icon--uni59:before {
    content: "\59";
}

.icon--uni5A:before {
    content: "\5a";
}

.icon--uni5B:before {
    content: "\5b";
}

.icon--uni5C:before {
    content: "\5c";
}

.icon--uni5D:before {
    content: "\5d";
}

.icon--uni5E:before {
    content: "\5e";
}

.icon--uni5F:before {
    content: "\5f";
}

.icon--uni60:before {
    content: "\60";
}

.icon--uni61:before {
    content: "\61";
}

.icon--uni62:before {
    content: "\62";
}

.icon--uni63:before {
    content: "\63";
}

.icon--uni64:before {
    content: "\64";
}

.icon--uni65:before {
    content: "\65";
}

.icon--uni66:before {
    content: "\66";
}

.icon--uni67:before {
    content: "\67";
}

.icon--uni68:before {
    content: "\68";
}

.icon--uni69:before {
    content: "\69";
}

.icon--uni6A:before {
    content: "\6a";
}

.icon--uni6B:before {
    content: "\6b";
}

.icon--uni6C:before {
    content: "\6c";
}

.icon--uni6D:before {
    content: "\6d";
}

.icon--uni6E:before {
    content: "\6e";
}

.icon--uni6F:before {
    content: "\6f";
}

.icon--uni70:before {
    content: "\70";
}

.icon--uni71:before {
    content: "\71";
}

.icon--uni72:before {
    content: "\72";
}

.icon--uni73:before {
    content: "\73";
}

.icon--uni74:before {
    content: "\74";
}

.icon--uni75:before {
    content: "\75";
}

.icon--uni76:before {
    content: "\76";
}

.icon--uni77:before {
    content: "\77";
}

.icon--uni78:before {
    content: "\78";
}

.icon--uni79:before {
    content: "\79";
}

.icon--uni7A:before {
    content: "\7a";
}

.icon--uni7B:before {
    content: "\7b";
}

.icon--uni7C:before {
    content: "\7c";
}

.icon--uni7D:before {
    content: "\7d";
}

.icon--uni7E:before {
    content: "\7e";
}

.icon--uniA9:before {
    content: "\a9";
}

.message-box {
    display: block;
    position: relative;
    padding: 16px;
    padding-left: 80px;
    margin-bottom: 20px;
    border-width: 1px;
    border-style: solid;
    border-radius: 0;
    font-weight: 600;
}

    .message-box I.icon {
        display: block;
        position: absolute;
        top: 16px;
        left: 16px;
        z-index: 200;
        width: 32px;
        height: 32px;
    }

        .message-box I.icon:before {
            display: block;
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            font-size: 32px;
        }

    .message-box H1,
    .message-box H2,
    .message-box H3,
    .message-box H4,
    .message-box H5,
    .message-box H6 {
        font-family: 'Invention', sans-serif;
        font-style: normal;
        color: inherit;
        text-transform: uppercase;
    }

    .message-box P {
        margin-bottom: 4px;
        text-align: left;
        font-size: 1.1rem;
        font-weight: 600;
        color: inherit;
    }

    .field-validation-error,
    .validation-summary-errors,
    .message-box.validation P {
        font-size: 0.9rem;
    }

    /* ---- INFO (Blue) ---- */
    .message-box.info {
        border-color: #3094cf;
        background-color: #c0dff1;
        color: #0e2c3e;
    }

        .message-box.info > .icon:before {
            content: '\ea0c';
            color: #3094cf;
        }

    /* ---- SUCCESS (Green) ---- */
    .message-box.success {
        border-color: #4dbb5d;
        background-color: white;
        color: #26632f;
    }

        .message-box.success > .icon:before {
            content: '\ea10';
            color: #4dbb5d;
        }

    /* ---- CAUTION (Amber) ---- */
    .message-box.caution {
        border-color: #f59a3a;
        background-color: #fef1e4;
        color: #774006;
    }

        .message-box.caution > .icon:before {
            content: '\ea07';
            color: #f59a3a;
        }

    /* ---- WARNING & VALIDATION (Orange) ---- */
    .message-box.error,
    .message-box.warning,
    .message-box.validation {
        border-color: #eb9466;
        background-color: #fae3d6;
        color: #5f290c;
    }

        .message-box.error > .icon:before,
        .message-box.warning > .icon:before {
            content: '\ea0f';
            color: #eb9466;
        }

    .message-box.validation,
    .field-validation-error,
    .validation-summary-errors {
        display: block;
        position: relative;
        padding: 4px;
        padding-left: 48px;
    }

        .message-box.validation > .icon {
            top: 8px;
            left: 8px;
            width: 16px;
            height: 16px;
        }

            .message-box.validation > .icon:before {
                content: '\ea08';
                width: 16px;
                height: 16px;
                font-size: 20px;
                line-height: 1;
                color: #eb9466;
            }

    /* ---- CRITICAL (Red) ---- */
    .message-box.critical {
        border-color: #dd3239;
        background-color: #f6cbcc;
        color: #4f0d10;
    }

        .message-box.critical > .icon:before {
            content: '\ea08';
            color: #dd3239;
        }

/* ======== NOTIFICATION BAR ======== */
.notification-bar {
    position: fixed;
    z-index: 9000000000;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 8px 80px;
    overflow: hidden;
    font-weight: 600;
    color: #FFF;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -ms-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

    .notification-bar.notification-bar--hidden {
        z-index: -1;
        height: 0;
        padding-top: 0;
        padding-bottom: 0;
        opacity: 0;
    }

    .notification-bar.notification-bar--visible {
        z-index: 9000000000;
        height: 40px;
        padding-top: 8px;
        padding-bottom: 8px;
        opacity: 1;
    }

    .notification-bar I.icon {
        display: block;
        position: absolute;
        top: 8px;
        left: 16px;
        z-index: 200;
        width: 24px;
        height: 24px;
        color: inherit;
    }

        .notification-bar I.icon:before {
            display: block;
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            font-size: 20px;
            color: inherit;
        }

    .notification-bar P {
        margin-bottom: 0;
        text-align: left;
        font-size: 1.28rem;
        font-weight: 500;
        color: inherit;
    }

.notification-bar__close {
    position: absolute;
    z-index: 1600;
    display: inline-block;
    top: 12px;
    right: 12px;
    height: 16px;
    width: 16px;
    border-radius: 50%;
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
}

    .notification-bar__close::after, .notification-bar__close::before {
        /* lines of 'X' icon */
        content: '';
        position: absolute;
        height: 2px;
        width: 16px;
        left: 50%;
        top: 47.5%;
        background-color: #FFF;
        -webkit-backface-visibility: hidden;
        -moz-backface-visibility: hidden;
        -ms-backface-visibility: hidden;
        -o-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-transition: background-color 0.4s ease;
        -moz-transition: background-color 0.4s ease;
        -ms-transition: background-color 0.4s ease;
        -o-transition: background-color 0.4s ease;
        transition: background-color 0.4s ease;
    }

    .notification-bar__close::after {
        -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg);
        -moz-transform: translateX(-50%) translateY(-50%) rotate(45deg);
        -o-transform: translateX(-50%) translateY(-50%) rotate(45deg);
        -ms-transform: translateX(-50%) translateY(-50%) rotate(45deg);
        transform: translateX(-50%) translateY(-50%) rotate(45deg);
    }

    .notification-bar__close::before {
        -webkit-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
        -moz-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
        -o-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
        -ms-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
        transform: translateX(-50%) translateY(-50%) rotate(-45deg);
    }

    .notification-bar__close:hover::after, .notification-bar__close:hover::before {
        background-color: #e6e6e6;
    }

/* ---- INFO (Blue) ---- */
.notification-bar.notification-bar--info {
    background-color: #3094cf;
}

    .notification-bar.notification-bar--info .icon:before {
        content: '\ea0c';
    }

/* ---- SUCCESS (Green) ---- */
.notification-bar.notification-bar--success {
    background-color: #4dbb5d;
}

    .notification-bar.notification-bar--success .icon:before {
        content: '\ea10';
    }

/* ---- CAUTION (Amber) ---- */
.notification-bar.notification-bar--caution {
    background-color: #ffcc1a;
}

    .notification-bar.notification-bar--caution .icon:before {
        content: '\ea07';
    }

/* ---- WARNING (Orange) ---- */
.notification-bar.notification-bar--warning {
    background-color: #e57539;
}

    .notification-bar.notification-bar--warning .icon:before {
        content: '\ea07';
    }

/* ---- ERROR (Red) ---- */
.notification-bar.notification-bar--error {
    background-color: #dd3239;
}

    .notification-bar.notification-bar--error .icon:before {
        content: '\ea07';
    }

/*.error-border                                       {border: 1px solid #ea1a3e !important;}*/
.form-panel.form-panel--notes .notes_content_limit {
    font-family: 'Invention', sans-serif;
    margin-top: 2px;
    margin-bottom: 6px;
}

/* ======== HOVER TOOL-TIP  ======== */
.tool-tip {
    display: inline;
    position: relative;
}

    .tool-tip:before {
        -webkit-transition: position 0.4s ease;
        -moz-transition: position 0.4s ease;
        -ms-transition: position 0.4s ease;
        -o-transition: position 0.4s ease;
        transition: position 0.4s ease;
    }

    .tool-tip:hover:before {
        position: absolute;
        left: 50%;
        bottom: 24px;
        z-index: 900;
        border: solid;
        border-color: #FF2D55 transparent;
        border-width: 6px 6px 0 6px;
        content: "";
    }

    .tool-tip:hover:after {
        position: absolute;
        z-index: 900;
        left: 20%;
        bottom: 26px;
        width: auto;
        padding: 4px 16px;
        background: #FF2D55;
        border-radius: 0;
        color: #FFF;
        content: attr(title);
        font-family: 'Invention', sans-serif;
        ;
        font-size: 1.1rem;
        font-weight: 600;
        letter-spacing: 0.05rem;
        text-align: center;
        text-transform: uppercase;
    }

.tool-tip-large {
    display: inline;
    position: relative;
}

    .tool-tip-large:before {
        -webkit-transition: position 0.4s ease;
        -moz-transition: position 0.4s ease;
        -ms-transition: position 0.4s ease;
        -o-transition: position 0.4s ease;
        transition: position 0.4s ease;
    }

    .tool-tip-large:hover:before,
    .tool-tip-large.tool-tip-large--visible:before {
        position: absolute;
        z-index: 901;
        left: 50%;
        bottom: 30px;
        z-index: 900;
        border: solid;
        border-color: #FBE122 transparent;
        border-width: 6px 6px 0 6px;
        content: "";
    }

    .tool-tip-large:hover:after,
    .tool-tip-large.tool-tip-large--visible:after {
        position: absolute;
        z-index: 900;
        left: -50%;
        bottom: 36px;
        width: 320px;
        height: 100px;
        padding: 16px;
        background: #FBE122;
        border: 0 solid #0C2340;
        border-radius: 6px;
        text-align: left;
        text-transform: none;
        content: attr(data-tooltip);
        font-family: 'Invention', sans-serif;
        ;
        font-size: 1.504rem;
        font-weight: 600;
        color: #414E54;
        line-height: 1.25;
        letter-spacing: 0.025rem;
    }

/* ===========================================================

	$OVERRIDES (2019)

    NOTE: For overriding plugins such as telerik or bootstrap

=========================================================== */
/* ---- KENDO FORM ELEMENTS ---- */
/* ---- KENDO TEXTBOX ---- */
.field .k-widget.k-textbox {
    -webkit-box-flex: 1 1 auto;
    -webkit-flex: 1 1 auto;
    -moz-flex: 1 1 auto;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    padding: 0;
    border: none;
    background-color: transparent;
}

/* ---- KENDO DROPDOWN ---- */
.page-content .field .k-dropdownlist {
    -webkit-box-flex: 1 1 auto;
    -webkit-flex: 1 1 auto;
    -moz-flex: 1 1 auto;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    width: auto !important;
    height: 32px;
    padding: 0;
    margin: 0;
    border: 1px solid #949494;
    background-color: #FFF;
    font-size: 14px;
    color: rgba(0, 0, 0, 0.88);
    overflow: hidden;
    border-radius: 0px;
}

    .page-content .field .k-dropdownlist:focus {
        background-color: #e6e6e6;
    }

    .page-content .field .k-dropdownlist:disabled {
        background: #d3d7e9;
        color: #768A98;
    }

.page-content .field LABEL.label--long.label--question + .k-widget.k-dropdown {
    -webkit-box-flex: 0 1 40%;
    -webkit-flex: 0 1 40%;
    -moz-flex: 0 1 40%;
    -ms-flex: 0 1 40%;
    flex: 0 1 40%;
}

.page-content .k-dropdown-wrap {
    padding: 10px 6px;
}

    .page-content .k-dropdown-wrap.k-state-default {
        background-color: transparent;
        border: none;
    }

/* ---- KENDO DROPDOWN ---- */
.page-content .field.field--dual-input SELECT, .page-content .field.field--dual-input INPUT, .page-content .field.field--dual-input .k-widget.k-dropdown {
    -webkit-box-flex: 1 1 auto;
    -webkit-flex: 1 1 auto;
    -moz-flex: 1 1 auto;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
}

    .page-content .field.field--dual-input SELECT:last-of-type, .page-content .field.field--dual-input INPUT:last-of-type, .page-content .field.field--dual-input .k-widget.k-dropdown:last-of-type {
        -webkit-box-flex: 0 0 64px;
        -webkit-flex: 0 0 64px;
        -moz-flex: 0 0 64px;
        -ms-flex: 0 0 64px;
        flex: 0 0 64px;
    }

/* ---- KENDO FILE UPLOAD ---- */
.k-button.k-upload-button {
    background: #FBE122;
    border-color: #fbde09;
    color: #0C2340;
}

    .k-button.k-upload-button:hover {
        background: #e6cb04;
        border-color: #e6cb04;
        color: #040c15;
    }

/* ---- KENDO LOADING OVERLAY ---- */
.k-loading-mask.k-loading-mask--hidden {
    display: none;
    z-index: -1;
}

.k-loading-mask.k-loading-mask--visible {
    display: block;
    z-index: 2500;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}

/* ---- KENDO MULTISELECT ---- */
.k-widget.k-multiselect.k-multiselect-clearable {
    margin-bottom: 6px;
    font-size: 14px;
}

.k-multiselect-wrap .k-input {
    height: 39px !important;
    width: auto !important;
}

.k-multiselect-wrap .k-button {
    height: 36px;
}

.k-multiselect-wrap li.k-button {
    font-size: 14px;
}

.k-multiselect-wrap .k-clear-value::before {
    height: 0;
}

/* ---- KENDO DATEPICKER ---- */
.page-content .field .k-datepicker {
    -webkit-box-flex: 0 1 25%;
    -webkit-flex: 0 1 25%;
    -moz-flex: 0 1 25%;
    -ms-flex: 0 1 25%;
    flex: 0 1 25%;
    border-radius: 0px;
    border: 1px solid #949494;
}

    .page-content .field .k-datepicker input {
        border: 0px !important;
    }

    .page-content .field .k-datepicker .k-icon-button {
        background-color: #fff;
        border: 0px;
    }

        .page-content .field .k-datepicker .k-icon-button .k-i-calendar {
            background: url("/Assets/images/icons/calender.png") center center no-repeat;
        }

            .page-content .field .k-datepicker .k-icon-button .k-i-calendar::before {
                content: "";
            }

.page-content .field.field--adjacent .k-datepicker {
    -webkit-box-flex: 0 1 100%;
    -webkit-flex: 0 1 100%;
    -moz-flex: 0 1 100%;
    -ms-flex: 0 1 100%;
    flex: 0 1 100%;
}

/* ---- NUMERIC INPUTS ---- */
.field .k-numerictextbox.k-input {
    -webkit-box-flex: 0 1 25%;
    -webkit-flex: 0 1 25%;
    -moz-flex: 0 1 25%;
    -ms-flex: 0 1 25%;
    flex: 0 1 25%;
    border-radius: 0px;
    border: 1px solid #949494;
}

    .field .k-numerictextbox.k-input .k-input-inner {
        border: 0px !important;
    }

    .field .k-numerictextbox.k-input .k-spinner-increase, .field .k-numerictextbox.k-input .k-spinner-decrease {
        background: none !important;
        padding: 0px 7px;
        border-left: 1px solid #949494;
    }

    .field .k-numerictextbox.k-input .k-input-spinner {
        flex-flow: row;
        flex-direction: row-reverse;
    }

    .field .k-numerictextbox.k-input .k-spinner-increase .k-i-caret-alt-up {
        background: url("/Assets/images/icons/plus.png") center center no-repeat;
    }

        .field .k-numerictextbox.k-input .k-spinner-increase .k-i-caret-alt-up::before {
            content: "";
        }

    .field .k-numerictextbox.k-input .k-spinner-decrease .k-i-caret-alt-down {
        background: url("/Assets/images/icons/minus.png") center center no-repeat;
    }

        .field .k-numerictextbox.k-input .k-spinner-decrease .k-i-caret-alt-down::before {
            content: "";
        }

.k-widget.k-numerictextbox.dose-numeric-box {
    width: 28%;
}
/*--------------Time Picker ----------------*/
.field .k-timepicker {
    border-radius: 0px;
    border: 1px solid #949494;
    width: 25% !important;
}

    .field .k-timepicker .time-picker {
        border: 0px !important;
    }

    .field .k-timepicker .k-input-button {
        background: none !important;
        border: 0px;
    }
/* ---- TABSTRIP ---- */
.k-tabstrip-top.k-header > .k-tabstrip-items-wrapper {
    border-bottom-width: 0;
}

/* ---- GRID ---- */
.k-grid.k-widget.k-display-block {
    min-width: 960px;
}

.grid-wrap .k-grid-pager .k-widget.k-dropdown {
    height: 36px;
    margin-right: 4px;
}

    .grid-wrap .k-grid-pager .k-widget.k-dropdown .k-dropdown-wrap {
        padding: 4px;
    }

.grid-wrap .k-grid.k-widget .k-checkbox {
    position: static;
    opacity: 1;
    appearance: checkbox;
    -webkit-appearance: checkbox;
    pointer-events: unset;
    min-height: 16px;
}

.grid-wrap .k-pager-numbers-wrap .k-dropdown {
    width: 10rem;
    height: 36px;
    border-color: #414E54;
    border-radius: 4px;
    background-color: transparent;
    font-size: 1.28rem;
}

.grid-wrap .k-pager-numbers-wrap .k-pager-numbers {
    margin-top: 2px;
    margin-bottom: 0;
}

.grid-wrap .k-pager-sizes .k-input-inner,
.grid-wrap .k-pager-sizes .k-input-value-text {
    min-width: 24px;
}

.grid-wrap.grid-wrap--small .k-grid.k-widget.k-display-block {
    min-width: 460px;
}

.grid-wrap.grid-wrap--small .k-grid-pager .k-widget.k-dropdown {
    height: 32px;
    border-color: #ececec;
    border-radius: 4px;
}

    .grid-wrap.grid-wrap--small .k-grid-pager .k-widget.k-dropdown .k-dropdown-wrap {
        padding: 2px 0;
    }

/* ---- KENDO ACCORDION (Posting Groups) ---- */
.accordion--posting-groups .k-panelbar .k-item .k-content[id*="panelbar-"] {
    padding: 0;
}

/* ============================================================== MEDIA QUERIES ============================================================== */
/* ---- LAPTOP & BELOW (0 - 1439px) ---- */
@media only screen and (max-width: 1439px) {
    /* ---- KENDO DATEPICKER ---- */
    .field.field--adjacent .k-datepicker {
        -webkit-box-flex: 0 1 100%;
        -webkit-flex: 0 1 100%;
        -moz-flex: 0 1 100%;
        -ms-flex: 0 1 100%;
        flex: 0 1 100%;
    }

        .field.field--adjacent .k-datepicker .k-input-inner {
            width: 100% !important;
        }
}

/* ---- LARGE MOBILE & ABOVE (600px +) ---- */
/* ---- SMALL MOBILE (0 - 959px) ---- */
@media only screen and (max-width: 959px) {
    /* ---- KENDO TEXTBOX ---- */
    .field .k-widget.k-textbox {
        -webkit-box-flex: 1 1 auto;
        -webkit-flex: 1 1 auto;
        -moz-flex: 1 1 auto;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
        width: auto;
        margin-bottom: 20px;
    }
    /* ---- KENDO DROPDOWN ---- */
    .page-content .field .k-widget.k-dropdown {
        -webkit-box-flex: 1 1 auto;
        -webkit-flex: 1 1 auto;
        -moz-flex: 1 1 auto;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
    }
    /* ---- NUMERIC INPUTS ---- */
    .k-widget.k-numerictextbox.dose-numeric-box {
        width: auto;
    }
}

/* ===========================================================

	$IMAGES (v2 2018)

=========================================================== */
IMG {
    vertical-align: top;
}

/* ---- INSIDE FIGURE ---- */
FIGURE {
    position: relative;
    width: 100%;
    padding-bottom: 64px;
    margin-bottom: 64px;
}

    FIGURE IMG {
        display: block;
        width: 100%;
    }

    FIGURE FIGCAPTION {
        position: absolute;
        z-index: 300;
        top: auto;
        bottom: 0;
        left: 0;
        right: 0;
        width: 50%;
        margin: 0 auto;
        text-align: center;
    }

/* ---- CONTENT IMAGE ---- */
.content-viewport {
    width: 100%;
    height: auto;
    margin-bottom: 20px;
}

IMG.content-image {
    width: auto;
    max-width: 100%;
    height: auto;
}

/* ---- COMPONENTS ---- */
/* ===========================================================

	$BUTTONS (v2 2018)

=========================================================== */
/* ---- BUTTONS CONTAINER ---- */
.buttons {
    clear: both;
    margin-bottom: 1.9rem;
    text-align: right;
}

.buttons--left {
    text-align: left;
}

.buttons--right {
    text-align: right;
}

.buttons--centre {
    text-align: center;
}

.buttons--no-margin,
.buttons--header {
    margin: 0;
}

    .buttons--no-margin .button,
    .buttons--header .button {
        margin-bottom: 0;
    }

.buttons--mid-section {
    padding-top: 20px;
}

.buttons--bottom {
    padding-top: 20px;
    margin-bottom: 0;
}

.buttons--stacked .button {
    margin-bottom: 20px;
}

.buttons--flex {
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- */
    display: -ms-flexbox;
    /* OLD - TWEENER - IE 10 */
    display: -webkit-flex;
    /* RECENT - Chrome */
    display: flex;
    /* NEW - Firefox, Chrome, Opera, IE11 */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: no-wrap;
    flex-wrap: no-wrap;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: flex-start;
    align-items: flex-start;
    -webkit-align-content: flex-start;
    align-content: flex-start;
}

    .buttons--flex .button {
        -webkit-box-flex: 1 1 auto;
        -webkit-flex: 1 1 auto;
        -moz-flex: 1 1 auto;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
    }

        .buttons--flex .button.button--no-box,
        .buttons--flex .button.button--icon-only {
            -webkit-box-flex: 0 1 auto;
            -webkit-flex: 0 1 auto;
            -moz-flex: 0 1 auto;
            -ms-flex: 0 1 auto;
            flex: 0 1 auto;
        }

.buttons--flex-full {
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- */
    display: -ms-flexbox;
    /* OLD - TWEENER - IE 10 */
    display: -webkit-flex;
    /* RECENT - Chrome */
    display: flex;
    /* NEW - Firefox, Chrome, Opera, IE11 */
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-flex-wrap: no-wrap;
    flex-wrap: no-wrap;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    -webkit-align-items: stretch;
    align-items: stretch;
    -webkit-align-content: flex-start;
    align-content: flex-start;
}

    .buttons--flex-full .button {
        -webkit-box-flex: 1 1 auto;
        -webkit-flex: 1 1 auto;
        -moz-flex: 1 1 auto;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
        margin-bottom: 16px;
    }

        .buttons--flex-full .button:last-of-type {
            margin-bottom: 0;
        }

        .buttons--flex-full .button + .button {
            margin-left: 0;
        }

.buttons--flex-min {
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- */
    display: -ms-flexbox;
    /* OLD - TWEENER - IE 10 */
    display: -webkit-flex;
    /* RECENT - Chrome */
    display: flex;
    /* NEW - Firefox, Chrome, Opera, IE11 */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: no-wrap;
    flex-wrap: no-wrap;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    -webkit-align-items: flex-start;
    align-items: flex-start;
    -webkit-align-content: flex-start;
    align-content: flex-start;
}

    .buttons--flex-min .button {
        -webkit-box-flex: 0 1 120px;
        -webkit-flex: 0 1 120px;
        -moz-flex: 0 1 120px;
        -ms-flex: 0 1 120px;
        flex: 0 1 120px;
    }

    .buttons--flex-min FORM {
        -webkit-box-flex: 0 1 auto;
        -webkit-flex: 0 1 auto;
        -moz-flex: 0 1 auto;
        -ms-flex: 0 1 auto;
        flex: 0 1 auto;
        display: -webkit-box;
        /* OLD - iOS 6-, Safari 3.1-6 */
        display: -moz-box;
        /* OLD - Firefox 19- */
        display: -ms-flexbox;
        /* OLD - TWEENER - IE 10 */
        display: -webkit-flex;
        /* RECENT - Chrome */
        display: flex;
        /* NEW - Firefox, Chrome, Opera, IE11 */
        -webkit-flex-direction: row;
        -moz-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-justify-content: flex-start;
        justify-content: flex-start;
        -webkit-align-items: flex-start;
        align-items: flex-start;
        -webkit-align-content: flex-start;
        align-content: flex-start;
        padding: 0 16px;
    }

    .buttons--flex-min .button + .button {
        margin-left: 16px;
    }

    .buttons--flex-min .button.button--no-box,
    .buttons--flex-min .button.button--icon-only {
        -webkit-box-flex: 0 1 auto;
        -webkit-flex: 0 1 auto;
        -moz-flex: 0 1 auto;
        -ms-flex: 0 1 auto;
        flex: 0 1 auto;
    }

.buttons--flex-ends {
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- */
    display: -ms-flexbox;
    /* OLD - TWEENER - IE 10 */
    display: -webkit-flex;
    /* RECENT - Chrome */
    display: flex;
    /* NEW - Firefox, Chrome, Opera, IE11 */
    -webkit-flex-direction: row-reverse;
    -moz-flex-direction: row-reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
    -webkit-flex-wrap: no-wrap;
    flex-wrap: no-wrap;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -webkit-align-items: flex-start;
    align-items: flex-start;
    -webkit-align-content: flex-start;
    align-content: flex-start;
}

    .buttons--flex-ends .button {
        -webkit-box-flex: 0 1 auto;
        -webkit-flex: 0 1 auto;
        -moz-flex: 0 1 auto;
        -ms-flex: 0 1 auto;
        flex: 0 1 auto;
        margin-left: 16px;
    }

        .buttons--flex-ends .button + .button {
            margin-left: 0;
        }

/* ---- BUTTONS ---- */
.button {
    display: inline-flex; /* makes button a flex container */
    align-items: center; /* vertically centers content */
    justify-content: center; /* horizontally centers content */
    height: 44px;
    padding: 0 16px; /* horizontal padding only */
    border: 2px solid;
    border-radius: 0;
    font-family: 'Invention', sans-serif;
    font-size: 14px;
    font-weight: 400;
    text-transform: capitalize;
    letter-spacing: 0.05rem;
    cursor: pointer;
}


A.button {
    text-decoration: none;
}

.button + .button {
    margin-left: 16px;
}

/*.buttons.buttons--reduced > .button + .button       {margin-left:$spaceSize-common;}*/
/* Standard 'box' button */
.button--primary,
.button--secondary,
.button--tertiary,
.button--quarternary,
.button--quinary,
.button--senary {
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -ms-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

    .button--primary.disabled, .button--primary.button--disabled,
    .button--secondary.disabled,
    .button--secondary.button--disabled,
    .button--tertiary.disabled,
    .button--tertiary.button--disabled,
    .button--quarternary.disabled,
    .button--quarternary.button--disabled,
    .button--quinary.disabled,
    .button--quinary.button--disabled,
    .button--senary.disabled,
    .button--senary.button--disabled {
        background: #F5F6FA !important;
        border-color: #e4e7f2 !important;
        color: #d3d7e9 !important;
    }

        .button--primary.disabled:hover, .button--primary.button--disabled:hover,
        .button--secondary.disabled:hover,
        .button--secondary.button--disabled:hover,
        .button--tertiary.disabled:hover,
        .button--tertiary.button--disabled:hover,
        .button--quarternary.disabled:hover,
        .button--quarternary.button--disabled:hover,
        .button--quinary.disabled:hover,
        .button--quinary.button--disabled:hover,
        .button--senary.disabled:hover,
        .button--senary.button--disabled:hover {
            background: #f2f3f8 !important;
            border-color: #e1e4f0 !important;
            color: #d0d4e7 !important;
        }

.button--primary {
    background: #00857C !important;
    border-color: #00857C !important;
    color: #fff !important;
}

    .button--primary:hover {
        background: #00857C !important;
        border-color: #00857C !important;
        color: #fff !important;
    }

.button--secondary {
    background: #fff !important;
    border-color: #949494 !important;
    color: rgba(0, 0, 0, 0.88);
    !important;
}

    .button--secondary:hover {
        background: #00857C !important;
        border-color: #00857C !important;
        color: #fff !important;
    }

.button--tertiary {
    background: #FFF !important;
    border-color: #f2f2f2 !important;
    color: #768A98 !important;
}

    .button--tertiary:hover {
        background: #e6e6e6 !important;
        border-color: #e6e6e6 !important;
        color: #93a3ae !important;
    }

.button--quarternary {
    background: #00857C !important;
    border-color: #00857C !important;
    color: #FFF !important;
}

    .button--quarternary:hover {
        background: #00857C !important;
        border-color: #00857C !important;
        color: white !important;
    }

.button--quinary {
    background: transparent !important;
    border-color: #0C2340 !important;
    color: #0C2340 !important;
}

    .button--quinary:hover {
        background: rgba(0, 0, 0, 0.75) !important;
        border-color: rgba(20, 58, 107, 0.75) !important;
        color: #143a6b !important;
    }

.button--senary {
    background: transparent !important;
    border-color: #FFF !important;
    color: #FFF !important;
}

    .button--senary:hover {
        background: rgba(0, 0, 0, 0.75) !important;
        border-color: rgba(230, 230, 230, 0.75) !important;
        color: #d9d9d9 !important;
    }

/* Standard 'box' button with icon */
.button.button--icon {
    position: relative;
    padding: 14px 16px 8px 30px;
    background-repeat: no-repeat;
    display: inline-block;
}

    .button.button--icon:disabled {
        cursor: not-allowed;
    }

/* ---- GRID BUTTONS ---- */
TABLE .button,
.button.button--grid {
    height: 20px;
    padding: 2px 8px;
    font-size: 1rem;
    line-height: 1.2;
}

    /* Grid button with icon */
    TABLE .button.button--icon,
    .button.button--grid.button--icon {
        padding: 2px 16px 2px 48px;
        background-repeat: no-repeat;
    }

    /* Icon only button (& grid version) */
    .button.button--icon-only,
    .button.button--grid.button--icon-only {
        width: 24px;
        height: 24px;
        padding: 0;
        border: 0;
        margin-right: 10px;
        background-color: transparent;
        font-size: 0;
        line-height: 0;
    }

/* ---- BUTTON MODIFIERS ---- */
.button.button--no-text {
    padding: 6px 12px;
    font-size: 0;
    line-height: 0;
}

.field .button.button--no-text {
    margin-left: 8px;
}

.button.button--no-box {
    border: 0;
    background-color: transparent;
}

.button.button--flex {
    -webkit-box-flex: 1 1 auto;
    -webkit-flex: 1 1 auto;
    -moz-flex: 1 1 auto;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
}

.button.disabled {
    cursor: not-allowed;
    pointer-events: none;
}

/* ---- ACTION BUTTONS ---- */
.action-button.button {
    display: inline-block;
    position: relative;
    width: 40px;
    height: 40px;
    padding: 10px;
    vertical-align: middle;
}

    .action-button.button I.icon {
        top: 20px;
    }

.action-button-label {
    display: inline-block;
    margin-right: 8px;
    font-size: 1.504rem;
    font-weight: 500;
    color: #768A98;
    vertical-align: middle;
}

/* ---- ACTION MENU DOTS BUTTON ---- */
A.button--grid-actions {
    display: inline-block;
    position: relative;
    top: 12px;
    width: 24px;
    height: 24px;
}

.button--grid-actions .icon.icon--dots-glyph {
    position: absolute;
    z-index: 1600;
    display: block;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 5px;
    height: 5px;
    margin: auto;
    background-color: #0C2340;
    border-radius: 5px;
    overflow: visible;
    white-space: nowrap;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -ms-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

    .button--grid-actions .icon.icon--dots-glyph::after, .button--grid-actions .icon.icon--dots-glyph::before {
        /* dots of symbol */
        content: '';
        display: inline-block;
        position: absolute;
        width: 5px;
        height: 5px;
        background-color: #0C2340;
        border-radius: 5px;
        -webkit-transition: background-color 0.4s ease;
        -moz-transition: background-color 0.4s ease;
        -ms-transition: background-color 0.4s ease;
        -o-transition: background-color 0.4s ease;
        transition: background-color 0.4s ease;
    }

    .button--grid-actions .icon.icon--dots-glyph::before {
        left: 6px;
        /*background-color:red;*/
    }

    .button--grid-actions .icon.icon--dots-glyph::after {
        right: 6px;
        /*background-color:green;*/
    }

    .button--grid-actions .icon.icon--dots-glyph:hover {
        background-color: #143a6b;
    }

        .button--grid-actions .icon.icon--dots-glyph:hover::after, .button--grid-actions .icon.icon--dots-glyph:hover::before {
            background-color: #143a6b;
        }

.button--grid-actions .icon.icon--cross-glyph {
    position: absolute;
    z-index: 1600;
    display: inline-block;
    top: 0;
    right: 0;
    height: 1px;
    width: 1px;
    border-radius: 50%;
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    opacity: 0;
}

    .button--grid-actions .icon.icon--cross-glyph::after, .button--grid-actions .icon.icon--cross-glyph::before {
        /* lines of 'X' icon */
        content: '';
        position: absolute;
        height: 3px;
        width: 1px;
        left: 50%;
        top: 47.5%;
        background-color: #0C2340;
        -webkit-backface-visibility: hidden;
        -moz-backface-visibility: hidden;
        -ms-backface-visibility: hidden;
        -o-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-transition: background-color 0.4s ease;
        -moz-transition: background-color 0.4s ease;
        -ms-transition: background-color 0.4s ease;
        -o-transition: background-color 0.4s ease;
        transition: background-color 0.4s ease;
    }

    .button--grid-actions .icon.icon--cross-glyph::after {
        -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg);
        -moz-transform: translateX(-50%) translateY(-50%) rotate(45deg);
        -o-transform: translateX(-50%) translateY(-50%) rotate(45deg);
        -ms-transform: translateX(-50%) translateY(-50%) rotate(45deg);
        transform: translateX(-50%) translateY(-50%) rotate(45deg);
    }

    .button--grid-actions .icon.icon--cross-glyph::before {
        -webkit-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
        -moz-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
        -o-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
        -ms-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
        transform: translateX(-50%) translateY(-50%) rotate(-45deg);
    }

    .button--grid-actions .icon.icon--cross-glyph:hover::after, .button--grid-actions .icon.icon--cross-glyph:hover::before {
        background-color: #143a6b;
    }

.actions-menu--closed I.icon.icon--dots-glyph {
    opacity: 1 !important;
    -webkit-transition: opacity 0.4s ease-in-out;
    -moz-transition: opacity 0.4s ease-in-out;
    -ms-transition: opacity 0.4s ease-in-out;
    -o-transition: opacity 0.4s ease-in-out;
    transition: opacity 0.4s ease-in-out;
}

.actions-menu--closed I.icon.icon--cross-glyph {
    opacity: 0 !important;
}

.actions-menu--open I.icon.icon--dots-glyph {
    opacity: 0 !important;
}

.actions-menu--open I.icon.icon--cross-glyph {
    opacity: 1 !important;
    -webkit-transition: opacity 0.4s ease-in-out;
    -moz-transition: opacity 0.4s ease-in-out;
    -ms-transition: opacity 0.4s ease-in-out;
    -o-transition: opacity 0.4s ease-in-out;
    transition: opacity 0.4s ease-in-out;
}

/* ---- GRID ACTIONS MENU ---- */
.grid-actions-menu {
    /* See components/tables.scss */
}

#saveRow {
    padding-bottom: 20px;
    background: #fff;
    margin-bottom: 15px;
}

    #saveRow:has(div.navigation-buttons) {
        background: #f5f5f5;
    }
/* ============================================================== MEDIA QUERIES ============================================================== */
/* ---- TABLET, LAPTOP & DESKTOP (960px +) ---- */
@media only screen and (min-width: 960px) {
    /* ---- INLINE FIELDS ---- */
    DIV.fields--multiple > .button {
        position: absolute;
        bottom: 0;
        right: 0;
    }
    /* ---- BUTTON MODIFIERS ---- */
    .buttons--flex .button.button--flex {
        margin-bottom: 0;
    }
}

/* ---- ALL MOBILE (0 - 959px) ---- */
@media only screen and (max-width: 959px) {
    /* ---- BUTTONS ---- */
    .button {
        width: 100%;
        padding: 10px 24px;
        font-size: 1.28rem;
    }

        .button + .button {
            margin-top: 10px;
            margin-left: 0;
        }

    .button--no-text {
        margin-top: 0px !important;
    }

    .buttons--flex {
        display: -webkit-box;
        /* OLD - iOS 6-, Safari 3.1-6 */
        display: -moz-box;
        /* OLD - Firefox 19- */
        display: -ms-flexbox;
        /* OLD - TWEENER - IE 10 */
        display: -webkit-flex;
        /* RECENT - Chrome */
        display: flex;
        /* NEW - Firefox, Chrome, Opera, IE11 */
        -webkit-flex-direction: row;
        -moz-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-flex-wrap: no-wrap;
        flex-wrap: no-wrap;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-align-items: flex-start;
        align-items: flex-start;
        -webkit-align-content: flex-start;
        align-content: flex-start;
    }

        .buttons--flex .button {
            -webkit-box-flex: 1 1 auto;
            -webkit-flex: 1 1 auto;
            -moz-flex: 1 1 auto;
            -ms-flex: 1 1 auto;
            flex: 1 1 auto;
        }

            .buttons--flex .button + .button {
                margin-top: 0;
                margin-left: 10px;
            }

            .buttons--flex .button.button--no-box,
            .buttons--flex .button.button--icon-only {
                -webkit-box-flex: 0 1 auto;
                -webkit-flex: 0 1 auto;
                -moz-flex: 0 1 auto;
                -ms-flex: 0 1 auto;
                flex: 0 1 auto;
            }

    .buttons--flex-min {
        display: -webkit-box;
        /* OLD - iOS 6-, Safari 3.1-6 */
        display: -moz-box;
        /* OLD - Firefox 19- */
        display: -ms-flexbox;
        /* OLD - TWEENER - IE 10 */
        display: -webkit-flex;
        /* RECENT - Chrome */
        display: flex;
        /* NEW - Firefox, Chrome, Opera, IE11 */
        -webkit-flex-direction: column;
        -moz-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-flex-wrap: no-wrap;
        flex-wrap: no-wrap;
        -webkit-justify-content: flex-start;
        justify-content: flex-start;
        -webkit-align-items: flex-start;
        align-items: flex-start;
        -webkit-align-content: flex-start;
        align-content: flex-start;
    }

        .buttons--flex-min .button {
            -webkit-box-flex: 0 1 auto;
            -webkit-flex: 0 1 auto;
            -moz-flex: 0 1 auto;
            -ms-flex: 0 1 auto;
            flex: 0 1 auto;
            margin-left: 0;
        }

            .buttons--flex-min .button + .button {
                margin-top: 10px;
                margin-left: 0;
            }

            .buttons--flex-min .button.button--no-box,
            .buttons--flex-min .button.button--icon-only {
                -webkit-box-flex: 0 1 32px;
                -webkit-flex: 0 1 32px;
                -moz-flex: 0 1 32px;
                -ms-flex: 0 1 32px;
                flex: 0 1 32px;
            }

        .buttons--flex-min FORM {
            width: 100%;
            padding: 20px 0;
            -webkit-box-flex: 0 1 auto;
            -webkit-flex: 0 1 auto;
            -moz-flex: 0 1 auto;
            -ms-flex: 0 1 auto;
            flex: 0 1 auto;
            display: -webkit-box;
            /* OLD - iOS 6-, Safari 3.1-6 */
            display: -moz-box;
            /* OLD - Firefox 19- */
            display: -ms-flexbox;
            /* OLD - TWEENER - IE 10 */
            display: -webkit-flex;
            /* RECENT - Chrome */
            display: flex;
            /* NEW - Firefox, Chrome, Opera, IE11 */
            -webkit-flex-direction: row;
            -moz-flex-direction: row;
            -ms-flex-direction: row;
            flex-direction: row;
            -webkit-flex-wrap: nowrap;
            flex-wrap: nowrap;
            -webkit-justify-content: flex-start;
            justify-content: flex-start;
            -webkit-align-items: flex-start;
            align-items: flex-start;
            -webkit-align-content: flex-start;
            align-content: flex-start;
        }

            .buttons--flex-min FORM .button:first-of-type {
                margin-right: 20px;
            }

    .buttons--flex-ends {
        display: -webkit-box;
        /* OLD - iOS 6-, Safari 3.1-6 */
        display: -moz-box;
        /* OLD - Firefox 19- */
        display: -ms-flexbox;
        /* OLD - TWEENER - IE 10 */
        display: -webkit-flex;
        /* RECENT - Chrome */
        display: flex;
        /* NEW - Firefox, Chrome, Opera, IE11 */
        -webkit-flex-direction: column;
        -moz-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-flex-wrap: no-wrap;
        flex-wrap: no-wrap;
        -webkit-justify-content: flex-start;
        justify-content: flex-start;
        -webkit-align-items: flex-start;
        align-items: flex-start;
        -webkit-align-content: flex-start;
        align-content: flex-start;
    }

        .buttons--flex-ends .button {
            -webkit-box-flex: 0 1 auto;
            -webkit-flex: 0 1 auto;
            -moz-flex: 0 1 auto;
            -ms-flex: 0 1 auto;
            flex: 0 1 auto;
            margin-left: 0;
        }

            .buttons--flex-ends .button + .button {
                margin-top: 10px;
                margin-left: 0;
            }
}

/* ---- SMALL MOBILE (0 - 479px) ---- */
@media only screen and (max-width: 479px) {
    /* ---- BUTTONS ---- */
    .button {
        font-size: 1.2rem;
    }
    /* ---- INLINE FIELDS ---- */
    DIV.fields--multiple > .button {
        position: relative;
        width: 100%;
    }
}

/* ===========================================================

	$FORMS (v2 2018)

    IMPORTANT NOTE: This file uses the 'Flexbox' CSS3 property heavily (https://css-tricks.com/snippets/css/a-guide-to-flexbox/). 
    Please familiarise yourself with the feature before adding traditional layout techniques such as 'float' or 'inline-block'.
    See the mixins.scss file for details on the flexbox properties   

=========================================================== */
/* ======== FIELDSETS & FIELD CONTAINERS ======== */
/* ---- FIELDSET ---- */
FIELDSET {
    padding: 24px;
    margin-bottom: 48px;
    border: 1px solid #cdcdcd;
}

    FIELDSET.fieldset--small {
        padding: 12px 20px 20px;
        margin-bottom: 20px;
    }

    FIELDSET.fieldset--emphasised {
        background-color: #eaecf4;
    }

    FIELDSET.fieldset--panel {
        position: relative;
        padding: 0px;
        border-width: 0px;
        margin-bottom: 20px;
        background-color:#fff;
        overflow: hidden;
        -webkit-transition: all 0.4s ease-in-out;
        -moz-transition: all 0.4s ease-in-out;
        -ms-transition: all 0.4s ease-in-out;
        -o-transition: all 0.4s ease-in-out;
        transition: all 0.4s ease-in-out;
    }
#company-details .field {
    border: 0px;
}
#company-details .field LABEL, #locations .field LABEL {
    -webkit-box-flex: 0 1 75%;
    -webkit-flex: 0 1 75%;
    -moz-flex: 0 1 75%;
    -ms-flex: 0 1 75%;
    flex: 0 1 75%;
    font-weight: normal;
    text-transform: capitalize;
    font-size: 16px;
    padding-left: 0px;
}
#company-details .tab-panel__content {
    padding: 12px;
}
#locations .fieldset--panel {
padding: 12px;
}
        FIELDSET.fieldset--panel.fieldset--closed {
            max-height: 64px;
            padding: 0 24px;
            overflow: visible;
        }

            FIELDSET.fieldset--panel.fieldset--closed .field {
                opacity: 0;
                -webkit-transition: all 0.4s ease;
                -moz-transition: all 0.4s ease;
                -ms-transition: all 0.4s ease;
                -o-transition: all 0.4s ease;
                transition: all 0.4s ease;
            }

                FIELDSET.fieldset--panel.fieldset--closed .field.field--group-input.group-input--new-line {
                    -webkit-transition: max-height 0.4s ease, padding 0.4s ease, opacity 0.8s ease;
                    -moz-transition: max-height 0.4s ease, padding 0.4s ease, opacity 0.8s ease;
                    -ms-transition: max-height 0.4s ease, padding 0.4s ease, opacity 0.8s ease;
                    -o-transition: max-height 0.4s ease, padding 0.4s ease, opacity 0.8s ease;
                    transition: max-height 0.4s ease, padding 0.4s ease, opacity 0.8s ease;
                }

            FIELDSET.fieldset--panel.fieldset--closed .group-input__subfield {
                opacity: 0;
            }

        FIELDSET.fieldset--panel.fieldset--open {
            max-height: none;
        }

            FIELDSET.fieldset--panel.fieldset--open .field {
                opacity: 1;
                -webkit-transition: all 0.4s ease;
                -moz-transition: all 0.4s ease;
                -ms-transition: all 0.4s ease;
                -o-transition: all 0.4s ease;
                transition: all 0.4s ease;
            }

                FIELDSET.fieldset--panel.fieldset--open .field.field--group-input.group-input--new-line {
                    -webkit-transition: max-height 0.4s ease, padding 0.4s ease, opacity 0.4s ease;
                    -moz-transition: max-height 0.4s ease, padding 0.4s ease, opacity 0.4s ease;
                    -ms-transition: max-height 0.4s ease, padding 0.4s ease, opacity 0.4s ease;
                    -o-transition: max-height 0.4s ease, padding 0.4s ease, opacity 0.4s ease;
                    transition: max-height 0.4s ease, padding 0.4s ease, opacity 0.4s ease;
                }

            FIELDSET.fieldset--panel.fieldset--open .group-input__subfield {
                opacity: 1;
            }

    FIELDSET.fieldset--hidden {
        max-height: 0;
        padding: 0 24px;
        margin-bottom: 0 !important;
        opacity: 0;
    }

    FIELDSET.fieldset--panel.fieldset--open.fieldset--hidden {
        max-height: 0;
        padding: 0 24px;
        margin-bottom: 0 !important;
        opacity: 0;
    }

        FIELDSET.fieldset--panel.fieldset--open.fieldset--hidden * {
            height: 0;
            margin: 0;
            padding: 0;
        }

        FIELDSET.fieldset--panel.fieldset--open.fieldset--hidden .group-input__subfield {
            opacity: 0;
        }

    FIELDSET.fieldset--detail {
        border: 1px solid #A1AEB4;
        margin-bottom: 32px;
        background-color: #FFF;
    }

        FIELDSET.fieldset--detail LEGEND {
            margin-left: 16px;
        }

        FIELDSET.fieldset--detail .field {
            margin-bottom: 0;
        }

            FIELDSET.fieldset--detail .field:last-of-type {
                border-bottom: none;
            }

            FIELDSET.fieldset--detail .field > LABEL {
                -webkit-box-flex: 0 1 33.33%;
                -webkit-flex: 0 1 33.33%;
                -moz-flex: 0 1 33.33%;
                -ms-flex: 0 1 33.33%;
                flex: 0 1 33.33%;
                text-align: right;
                font-size: 1.1rem;
            }

            FIELDSET.fieldset--detail .field > INS {
                -webkit-box-flex: 1 1 auto;
                -webkit-flex: 1 1 auto;
                -moz-flex: 1 1 auto;
                -ms-flex: 1 1 auto;
                flex: 1 1 auto;
                text-align: left;
                font-size: 1.28rem;
            }

        FIELDSET.fieldset--detail.fieldset--detail-alt-1 .field > LABEL {
            -webkit-box-flex: 0 1 66%;
            -webkit-flex: 0 1 66%;
            -moz-flex: 0 1 66%;
            -ms-flex: 0 1 66%;
            flex: 0 1 66%;
        }

        FIELDSET.fieldset--detail.fieldset--detail-alt-1 .field > .buttons {
            -webkit-box-flex: 1 1 auto;
            -webkit-flex: 1 1 auto;
            -moz-flex: 1 1 auto;
            -ms-flex: 1 1 auto;
            flex: 1 1 auto;
            text-align: center;
            font-size: 1.28rem;
        }

LEGEND {
    padding: 8px;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.25;
    margin-bottom: 0;
    font-family: 'Invention', sans-serif;
    color: #414E54;
    text-transform: capitalize;
}

.fieldset__controls {
    position: absolute;
    top: 12px;
    right: 20px;
    text-align: right;
}

    .fieldset__controls .fieldset__button.fieldset__button--minmax .icon.icon--checkbox-unchecked {
        width: 100%;
        height: 100%;
        background: url("/Assets/images/icons/down.png") top center no-repeat;
        font-size: 0px;
    }

    .fieldset__controls .fieldset__button.fieldset__button--minmax .icon.icon--minus {
        width: 100%;
        height: 100%;
        background: url("/Assets/images/icons/up.png") top center no-repeat;
        font-size: 0px;
    }

    .fieldset__controls .fieldset__button.fieldset__button--minmax .icon:before {
        display: inline-block;
        position: relative;
        z-index: 100;
    }

.fieldset__button {
    display: inline-block;
    width: 20px;
    height: 20px;
}

/* ---- STANDARD FIELD ---- */
.field {
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- */
    display: -ms-flexbox;
    /* OLD - TWEENER - IE 10 */
    display: -webkit-flex;
    /* RECENT - Chrome */
    display: flex;
    /* NEW - Firefox, Chrome, Opera, IE11 */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    -webkit-align-items: center;
    align-items: center;
    -webkit-align-content: flex-start;
    align-content: flex-start;
    margin-bottom: 16px;
}

    .field:last-of-type {
        margin-bottom: 0;
    }

.sub-field {
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- */
    display: -ms-flexbox;
    /* OLD - TWEENER - IE 10 */
    display: -webkit-flex;
    /* RECENT - Chrome */
    display: flex;
    /* NEW - Firefox, Chrome, Opera, IE11 */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    -webkit-align-items: center;
    align-items: center;
    -webkit-align-content: flex-start;
    align-content: flex-start;
    width: 100%;
    margin-top: 16px;
    -webkit-transition: all 0.4s ease-out;
    -moz-transition: all 0.4s ease-out;
    -ms-transition: all 0.4s ease-out;
    -o-transition: all 0.4s ease-out;
    transition: all 0.4s ease-out;
}

    .sub-field.sub-field--hidden {
        max-height: 0;
        padding-top: 0;
        padding-bottom: 0;
        margin-top: 0;
        opacity: 0;
        visibility: hidden;
    }

    .sub-field.sub-field--visible {
        max-height: 100px;
        opacity: 1;
        visibility: visible;
    }

.field.field--textarea {
    -webkit-align-items: center;
    align-items: center;
}

.field.field--tall {
    -webkit-align-items: flex-start;
    align-items: flex-start;
}

.field.field--sub-input {
    display: inline-flex;
    width: 87.2%;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
}

    .field.field--sub-input LABEL.label--question {
        -webkit-box-flex: 1 1 auto;
        -webkit-flex: 1 1 auto;
        -moz-flex: 1 1 auto;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
    }

    .field.field--sub-input INPUT {
        -webkit-box-flex: 0 1 10.5%;
        -webkit-flex: 0 1 27.5%;
        -moz-flex: 0 1 27.5%;
        -ms-flex: 0 1 27.5%;
        flex: 0 1 27.5%;
    }

    .field.field--sub-input.field--minor {
        width: 12.5%;
        padding-left: 10px;
        vertical-align: top;
        padding-bottom: 28px;
    }

        .field.field--sub-input.field--minor .k-input {
            font-size: 14px;
        }

/* ---- STANDARD FIELD INPUTS ---- */
.field INPUT[type="text"],
.field INPUT[type="password"],
.field INPUT[type="email"],
.field INPUT[type="url"],
.field INPUT[type="number"],
.field INPUT[type="time"],
.field INPUT[type="date"],
.field INPUT[type="datetime"],
.field INPUT[type="datetime-local"],
.field INPUT[type="week"],
.field INPUT[type="month"],
.field INPUT[type="search"],
.field INPUT[type="tel"],
.field SELECT,
.field TEXTAREA {
    -webkit-box-flex: 0 1 66.66%;
    -webkit-flex: 0 1 66.66%;
    -moz-flex: 0 1 66.66%;
    -ms-flex: 0 1 66.66%;
    flex: 0 1 66.66%;
}

/* ---- INLINE 'ROW' FIELDS ---- */
.fields--row {
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- */
    display: -ms-flexbox;
    /* OLD - TWEENER - IE 10 */
    display: -webkit-flex;
    /* RECENT - Chrome */
    display: flex;
    /* NEW - Firefox, Chrome, Opera, IE11 */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    -webkit-align-items: flex-start;
    align-items: flex-start;
    -webkit-align-content: flex-start;
    align-content: flex-start;
    position: relative;
    margin-bottom: 16px;
}

.field.field--adjacent,
.buttons.buttons--row {
    -webkit-box-flex: 1 1 auto;
    -webkit-flex: 1 1 auto;
    -moz-flex: 1 1 auto;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    padding-right: 24px;
}

    /* Detects child element count and resizes flex-basis */
    .field.field--adjacent:first-child:nth-last-child(1),
    .buttons.buttons--row:first-child:nth-last-child(1) {
        -webkit-box-flex: 1 1 100%;
        -webkit-flex: 1 1 100%;
        -moz-flex: 1 1 100%;
        -ms-flex: 1 1 100%;
        flex: 1 1 100%;
    }

    .field.field--adjacent:first-child:nth-last-child(2),
    .field.field--adjacent:first-child:nth-last-child(2) ~ .field.field--adjacent,
    .buttons.buttons--row:first-child:nth-last-child(2),
    .buttons.buttons--row:first-child:nth-last-child(2) ~ .buttons.buttons--row {
        -webkit-box-flex: 1 1 50%;
        -webkit-flex: 1 1 50%;
        -moz-flex: 1 1 50%;
        -ms-flex: 1 1 50%;
        flex: 1 1 50%;
    }

    .field.field--adjacent:first-child:nth-last-child(3),
    .field.field--adjacent:first-child:nth-last-child(3) ~ .field.field--adjacent,
    .buttons.buttons--row:first-child:nth-last-child(3),
    .buttons.buttons--row:first-child:nth-last-child(3) ~ .buttons.buttons--row {
        -webkit-box-flex: 1 1 33.33%;
        -webkit-flex: 1 1 33.33%;
        -moz-flex: 1 1 33.33%;
        -ms-flex: 1 1 33.33%;
        flex: 1 1 33.33%;
    }

    .field.field--adjacent:first-child:nth-last-child(4),
    .field.field--adjacent:first-child:nth-last-child(4) ~ .field.field--adjacent,
    .buttons.buttons--row:first-child:nth-last-child(4),
    .buttons.buttons--row:first-child:nth-last-child(4) ~ .buttons.buttons--row {
        -webkit-box-flex: 1 1 25%;
        -webkit-flex: 1 1 25%;
        -moz-flex: 1 1 25%;
        -ms-flex: 1 1 25%;
        flex: 1 1 25%;
    }

    .field.field--adjacent:first-child:nth-last-child(5),
    .field.field--adjacent:first-child:nth-last-child(5) ~ .field.field--adjacent,
    .buttons.buttons--row:first-child:nth-last-child(5),
    .buttons.buttons--row:first-child:nth-last-child(5) ~ .buttons.buttons--row {
        -webkit-box-flex: 1 1 20%;
        -webkit-flex: 1 1 20%;
        -moz-flex: 1 1 20%;
        -ms-flex: 1 1 20%;
        flex: 1 1 20%;
    }

    /* ---- INLINE INPUT WIDTHS ---- */
    .field.field--adjacent LABEL {
        flex: none;
        display: block;
        width: auto;
        height: auto;
        padding: 4px 16px 4px 4px;
        margin-bottom: 10px;
        white-space: nowrap;
        font-family: 'Invention', sans-serif;
        font-size: 1.1rem;
        font-weight: 600;
        text-align: left;
    }

    .field.field--adjacent INPUT,
    .field.field--adjacent SELECT,
    .field.field--adjacent TEXTAREA,
    .field.field--adjacent INS {
        display: block;
        flex: none;
        width: 100%;
    }

/* ---- FIELDS & INPUTS WITHIN MENU DIALOGS ---- */
.menu-dialog .field {
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- */
    display: -ms-flexbox;
    /* OLD - TWEENER - IE 10 */
    display: -webkit-flex;
    /* RECENT - Chrome */
    display: flex;
    /* NEW - Firefox, Chrome, Opera, IE11 */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    -webkit-align-items: flex-end;
    align-items: flex-end;
    -webkit-align-content: flex-start;
    align-content: flex-start;
}

    .menu-dialog .field INPUT[type="password"],
    .menu-dialog .field INPUT[type="email"],
    .menu-dialog .field INPUT[type="url"],
    .menu-dialog .field INPUT[type="number"],
    .menu-dialog .field INPUT[type="time"],
    .menu-dialog .field INPUT[type="date"],
    .menu-dialog .field INPUT[type="datetime"],
    .menu-dialog .field INPUT[type="datetime-local"],
    .menu-dialog .field INPUT[type="week"],
    .menu-dialog .field INPUT[type="month"],
    .menu-dialog .field INPUT[type="search"],
    .menu-dialog .field INPUT[type="tel"],
    .menu-dialog .field SELECT,
    .menu-dialog .field TEXTAREA {
        -webkit-box-flex: 1 1 auto;
        -webkit-flex: 1 1 auto;
        -moz-flex: 1 1 auto;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
    }

/* ======== STANDARD FORM ELEMENTS ======== */
/* ---- LABELS ---- */
LABEL {
    height: auto;
    padding: 8px 16px;
    text-align: right;
    font-family: 'Invention', sans-serif;
    color: #FBE122;
    text-transform: initial;
}

    LABEL.label--non-field {
        padding-right: 4px;
    }

.field LABEL {
    -webkit-box-flex: 0 1 33.33%;
    -webkit-flex: 0 1 33.33%;
    -moz-flex: 0 1 33.33%;
    -ms-flex: 0 1 33.33%;
    flex: 0 1 33.33%;
}

    .field LABEL.label--full {
        -webkit-box-flex: 0 0 100%;
        -webkit-flex: 0 0 100%;
        -moz-flex: 0 0 100%;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
    }

.field--emphasised LABEL {
    font-family: 'Invention', sans-serif;
    font-size: 125%;
    font-weight: 600 !important;
    text-transform: uppercase;
}

.field--check-radio > LABEL {
    /* See RADIO & CHECKBOXES below */
}

/* ---- INSERTED TEXT (SAVED FIELD) ---- */
.field INS {
    -webkit-box-flex: 0 1 66.66%;
    -webkit-flex: 0 1 66.66%;
    -moz-flex: 0 1 66.66%;
    -ms-flex: 0 1 66.66%;
    flex: 0 1 66.66%;
    height: 40px;
    padding: 8px;
    border-radius: 0;
    background-color: #ececec;
    color: #8d8d8d;
}

/* ---- VALIDATION ---- */
.validation-summary {
    display: none;
    padding: 20px;
    margin-bottom: 20px;
    background-color: #FF2D55;
    color: #FFF;
}

    .validation-summary P {
        color: inherit;
    }

    .validation-summary.validation-summary--visible {
        display: block;
    }

H5.validation-summary__title {
    font-size: 1.6rem;
    font-weight: 600;
    line-height: 1.25;
    margin-bottom: 12px;
    font-family: 'Invention', sans-serif;
    color: #FFF;
    text-transform: unset;
}

UL.validation-summary__list {
    padding: 0 0 0 20px;
    margin: 0;
    font-size: inherit;
}

LI.validation-summary__item {
    font-size: inherit;
}

    LI.validation-summary__item A {
        color: #FFF;
        -webkit-transition: color 0.4s ease;
        -moz-transition: color 0.4s ease;
        -ms-transition: color 0.4s ease;
        -o-transition: color 0.4s ease;
        transition: color 0.4s ease;
        font-weight: 700;
    }

        LI.validation-summary__item A:hover {
            color: #e6e6e6;
        }

        LI.validation-summary__item A:active {
            color: #FFF;
        }

.validation-summary-errors {
    padding-left: 20px;
    font-size: 1.28rem;
}

    .validation-summary-errors UL {
        margin-bottom: 0;
    }

.field-validation-error INPUT, .field-validation-error SELECT, .field-validation-error TEXTAREA,
.field.field--errors INPUT,
.field.field--errors SELECT,
.field.field--errors TEXTAREA {
    border-color: #FF2D55;
}

.k-dropdown.k-dropdown--error {
    border: 2px solid #FF2D55 !important;
}

    .k-dropdown.k-dropdown--error .k-select .k-icon {
        color: #FF2D55;
    }

.k-i-loading.k-i-arrow-60-up.k-panelbar-collapse:before {
    content: "";
    background-color: unset;
}

/* Alt Method */
.field .field.field--errors {
    -webkit-box-flex: 0 1 100%;
    -webkit-flex: 0 1 100%;
    -moz-flex: 0 1 100%;
    -ms-flex: 0 1 100%;
    flex: 0 1 100%;
    padding-left: 60%;
}

    .field .field.field--errors SPAN.field-validation-error {
        padding-left: 0;
    }

        .field .field.field--errors SPAN.field-validation-error .k-icon.k-i-warning {
            display: none;
        }

        .field .field.field--errors SPAN.field-validation-error:before {
            content: "\e403";
            display: inline-block;
            width: 1em;
            height: 1em;
            margin-right: 4px;
            -moz-osx-font-smoothing: grayscale;
            -webkit-font-smoothing: antialiased;
            vertical-align: middle;
            font-size: 16px;
            font-family: WebComponentsIcons;
            font-style: normal;
            font-variant: normal;
            font-weight: 400;
            line-height: 1;
            speak: none;
            text-transform: none;
            text-decoration: none;
        }

.field .validation {
    -webkit-box-flex: 0 1 66.66%;
    -webkit-flex: 0 1 66.66%;
    -moz-flex: 0 1 66.66%;
    -ms-flex: 0 1 66.66%;
    flex: 0 1 66.66%;
    margin-top: 8px;
    margin-left: 33.33%;
}

.checkbox--no-label .field-validation-error,
.field.checkbox--no-label .validation {
    -webkit-box-flex: 0 1 100%;
    -webkit-flex: 0 1 100%;
    -moz-flex: 0 1 100%;
    -ms-flex: 0 1 100%;
    flex: 0 1 100%;
    left: 0;
    margin-left: 0;
}

.k-widget.k-numerictextbox.input-validation-error {
    border: 2px solid #FF2D55 !important;
}

/* ---- BOX BASED INPUTS ---- */
INPUT[type="text"],
INPUT[type="password"],
INPUT[type="email"],
INPUT[type="url"],
INPUT[type="number"],
INPUT[type="time"],
INPUT[type="date"],
INPUT[type="datetime"],
INPUT[type="datetime-local"],
INPUT[type="week"],
INPUT[type="month"],
INPUT[type="search"],
INPUT[type="tel"],
SELECT,
TEXTAREA {
    height: 40px;
    padding: 8px;
    margin: 0;
    border: 0 solid #cdcdcd;
    border-radius: 0;
    background-color: #FFF;
    font-size: 1.1rem;
    color: #414E54;
    line-height: 1;
    resize: none;
    -webkit-transition: border 0.4s ease, background-color 0.4s ease;
    -moz-transition: border 0.4s ease, background-color 0.4s ease;
    -ms-transition: border 0.4s ease, background-color 0.4s ease;
    -o-transition: border 0.4s ease, background-color 0.4s ease;
    transition: border 0.4s ease, background-color 0.4s ease;
}

    INPUT[type="text"].textbox--date,
    INPUT[type="password"].textbox--date,
    INPUT[type="email"].textbox--date,
    INPUT[type="url"].textbox--date,
    INPUT[type="number"].textbox--date,
    INPUT[type="time"].textbox--date,
    INPUT[type="date"].textbox--date,
    INPUT[type="datetime"].textbox--date,
    INPUT[type="datetime-local"].textbox--date,
    INPUT[type="week"].textbox--date,
    INPUT[type="month"].textbox--date,
    INPUT[type="search"].textbox--date,
    INPUT[type="tel"].textbox--date,
    SELECT.textbox--date,
    TEXTAREA.textbox--date {
        max-width: 240px;
    }

    INPUT[type="text"]:focus,
    INPUT[type="password"]:focus,
    INPUT[type="email"]:focus,
    INPUT[type="url"]:focus,
    INPUT[type="number"]:focus,
    INPUT[type="time"]:focus,
    INPUT[type="date"]:focus,
    INPUT[type="datetime"]:focus,
    INPUT[type="datetime-local"]:focus,
    INPUT[type="week"]:focus,
    INPUT[type="month"]:focus,
    INPUT[type="search"]:focus,
    INPUT[type="tel"]:focus,
    SELECT:focus,
    TEXTAREA:focus {
        border-color: #b4b4b4;
        background-color: #ececec;
    }

    INPUT[type="text"]:disabled,
    INPUT[type="password"]:disabled,
    INPUT[type="email"]:disabled,
    INPUT[type="url"]:disabled,
    INPUT[type="number"]:disabled,
    INPUT[type="time"]:disabled,
    INPUT[type="date"]:disabled,
    INPUT[type="datetime"]:disabled,
    INPUT[type="datetime-local"]:disabled,
    INPUT[type="week"]:disabled,
    INPUT[type="month"]:disabled,
    INPUT[type="search"]:disabled,
    INPUT[type="tel"]:disabled,
    SELECT:disabled,
    TEXTAREA:disabled {
        background: #b4b4b4;
    }

    INPUT[readonly="readonly"],
    SELECT[readonly="readonly"],
    TEXTAREA[readonly="readonly"] {
        background: #b4b4b4;
    }

.field--emphasised INPUT {
    font-family: 'Invention', sans-serif;
    font-weight: 600;
}

/* ---- TEXTAREA ---- */
TEXTAREA {
    line-height: 1.25;
}

    TEXTAREA.textarea--small {
        min-height: 90px;
        -webkit-transition: all 0.4s ease-in-out;
        -moz-transition: all 0.4s ease-in-out;
        -ms-transition: all 0.4s ease-in-out;
        -o-transition: all 0.4s ease-in-out;
        transition: all 0.4s ease-in-out;
    }

    TEXTAREA.textarea--medium {
        min-height: 180px;
    }

    TEXTAREA.textarea--hidden {
        max-height: 0;
        opacity: 0;
        visibility: hidden;
    }

/* ---- SELECT ---- */
.select-wrap {
    -webkit-box-flex: 0 1 66.66%;
    -webkit-flex: 0 1 66.66%;
    -moz-flex: 0 1 66.66%;
    -ms-flex: 0 1 66.66%;
    flex: 0 1 66.66%;
    height: 40px;
    position: relative;
}

SELECT {
    /*background:$white; -webkit-appearance:none; -moz-appearance:none; text-indent:1px; text-overflow:''; z-index:1;*/
}

    SELECT:hover {
        cursor: pointer;
    }

    SELECT:disabled {
        z-index: 0;
    }

.select-wrap SELECT {
    width: 100%;
    height: 100%;
}

/* ---- RADIO & CHECKBOXES  ---- */
.check-wrap {
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- */
    display: -ms-flexbox;
    /* OLD - TWEENER - IE 10 */
    display: -webkit-flex;
    /* RECENT - Chrome */
    display: flex;
    /* NEW - Firefox, Chrome, Opera, IE11 */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    -webkit-align-items: flex-start;
    align-items: flex-start;
    -webkit-align-content: flex-start;
    align-content: flex-start;
    -webkit-box-flex: 0 1 25%;
    -webkit-flex: 0 1 25%;
    -moz-flex: 0 1 25%;
    -ms-flex: 0 1 25%;
    flex: 0 1 25%;
    height: 36px;
    padding-top: 8px;
    margin-bottom: 8px;
}

    .check-wrap .obs__link-label {
        display: none;
    }

        .check-wrap .obs__link-label.obs__link-label--show {
            display: flex;
        }

        .check-wrap .obs__link-label.obs__link-label--hide {
            display: none;
        }

    .check-wrap .obs__plain-label {
        display: flex;
    }

        .check-wrap .obs__plain-label.obs__plain-label--show {
            display: flex;
        }

        .check-wrap .obs__plain-label.obs__plain-label--hide {
            display: none;
        }

    .check-wrap.check-wrap--long {
        -webkit-box-flex: 0 1 33.33%;
        -webkit-flex: 0 1 33.33%;
        -moz-flex: 0 1 33.33%;
        -ms-flex: 0 1 33.33%;
        flex: 0 1 33.33%;
    }

    .check-wrap.check-wrap--half {
        -webkit-box-flex: 0 1 50%;
        -webkit-flex: 0 1 50%;
        -moz-flex: 0 1 50%;
        -ms-flex: 0 1 50%;
        flex: 0 1 50%;
    }

    .check-wrap.check-wrap--full {
        -webkit-box-flex: 0 1 100%;
        -webkit-flex: 0 1 100%;
        -moz-flex: 0 1 100%;
        -ms-flex: 0 1 100%;
        flex: 0 1 100%;
    }

    .check-wrap LABEL {
        padding: 8px 8px 8px 14px;
    }

INPUT[type="radio"],
INPUT[type="checkbox"] {
    -webkit-box-flex: 0 1 auto;
    -webkit-flex: 0 1 auto;
    -moz-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    width: 16px;
    height: 16px;
    margin: 0;
}

    INPUT[type="radio"]:focus,
    INPUT[type="checkbox"]:focus {
        outline: 2px solid #058C83;
    }

        INPUT[type="radio"]:focus ~ LABEL,
        INPUT[type="checkbox"]:focus ~ LABEL {
            color: #058C83;
        }

    INPUT[type="radio"] + LABEL,
    INPUT[type="checkbox"] + LABEL {
        -webkit-box-flex: 0 1 auto;
        -webkit-flex: 0 1 auto;
        -moz-flex: 0 1 auto;
        -ms-flex: 0 1 auto;
        flex: 0 1 auto;
        height: 24px;
        padding: 0;
        margin: auto 16px;
        font-size: 1rem;
        color: #0C2340;
        text-transform: initial;
    }

/* ---- RADIO SWITCH BLOCKS ---- */
.radio-switch-block {
    -webkit-box-flex: 0 1 66.66%;
    -webkit-flex: 0 1 66.66%;
    -moz-flex: 0 1 66.66%;
    -ms-flex: 0 1 66.66%;
    flex: 0 1 66.66%;
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- */
    display: -ms-flexbox;
    /* OLD - TWEENER - IE 10 */
    display: -webkit-flex;
    /* RECENT - Chrome */
    display: flex;
    /* NEW - Firefox, Chrome, Opera, IE11 */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    -webkit-align-items: flex-start;
    align-items: flex-start;
    -webkit-align-content: flex-start;
    align-content: flex-start;
}

    .radio-switch-block > INPUT[type="radio"] {
        width: 0;
        opacity: 0;
        position: fixed;
    }

    .radio-switch-block > LABEL {
        -webkit-box-flex: 1 1 auto;
        -webkit-flex: 1 1 auto;
        -moz-flex: 1 1 auto;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
        padding: 12px 24px;
        margin: 0;
        border: 2px solid #b1b9d8;
        border-radius: 4px;
        background-color: #F5F6FA;
        font-family: 'Invention', sans-serif;
        font-size: 1.28rem;
        cursor: pointer;
    }

    .radio-switch-block > INPUT[type="radio"] + LABEL {
        height: auto;
        margin: 0;
        font-size: 14px;
        border-radius: 0px;
        border-right: 1px solid #949494;
        /* margin-right: 2px; */
    }

        .radio-switch-block > INPUT[type="radio"] + LABEL:last-of-type {
            margin-right: 0;
            border: none;
        }

    .radio-switch-block > INPUT[type="radio"]:checked + LABEL {
        background-color: #1af7e8;
        border-color: #058C83;
    }

    .radio-switch-block > INPUT[type="radio"]:focus + LABEL {
        border: 2px dashed #b1b9d8;
    }

.field.field--switch-block {
    -webkit-box-flex: 0 0 100%;
    -webkit-flex: 0 0 100%;
    -moz-flex: 0 0 100%;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
}

    .field.field--switch-block .radio-switch-block {
        -webkit-box-flex: 0 1 auto;
        -webkit-flex: 0 1 auto;
        -moz-flex: 0 1 auto;
        -ms-flex: 0 1 auto;
        flex: 0 1 auto;
    }

.radio-switch-block.radio-switch-block--error {
    border: 2px solid #FF2D55;
}

/* ---- GROUP INPUTS ---- */
.field.field--group-input {
    -webkit-align-items: center;
    align-items: center;
}

    .field.field--group-input > LABEL {
        break-before: always;
        page-break-before: always;
    }

    .field.field--group-input > .line-break {
        -webkit-box-flex: 0 0 100%;
        -webkit-flex: 0 0 100%;
        -moz-flex: 0 0 100%;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
    }

    .field.field--group-input.group-input--new-line {
        margin-left: 30%;
    }

.group-input {
    -webkit-box-flex: 0 1 70%;
    -webkit-flex: 0 1 70%;
    -moz-flex: 0 1 70%;
    -ms-flex: 0 1 70%;
    flex: 0 1 70%;
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- */
    display: -ms-flexbox;
    /* OLD - TWEENER - IE 10 */
    display: -webkit-flex;
    /* RECENT - Chrome */
    display: flex;
    /* NEW - Firefox, Chrome, Opera, IE11 */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    -webkit-align-items: flex-start;
    align-items: flex-start;
    -webkit-align-content: flex-start;
    align-content: flex-start;
}

.group-input__subfield {
    -webkit-box-flex: 0 1 auto;
    -webkit-flex: 0 1 auto;
    -moz-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    padding: 0 0 0 10px;
    margin-right: 16px;
    border: 1px solid #A1AEB4;
    border-radius: 6px;
    background-color: rgba(161, 174, 180, 0.25);
    -webkit-transition: opacity 0.2s ease;
    -moz-transition: opacity 0.2s ease;
    -ms-transition: opacity 0.2s ease;
    -o-transition: opacity 0.2s ease;
    transition: opacity 0.2s ease;
}

    .group-input__subfield .k-numerictextbox.k-input {
        max-width: 64px;
    }

    .group-input__subfield.group-input__subfield--0,
    .group-input__subfield.group-input__subfield--excellent {
        background-color: rgba(5, 140, 131, 0.25);
        border-color: #02423e;
    }

    .group-input__subfield.group-input__subfield--1,
    .group-input__subfield.group-input__subfield--good {
        background-color: rgba(110, 206, 178, 0.25);
        border-color: #3cb390;
    }

    .group-input__subfield.group-input__subfield--2,
    .group-input__subfield.group-input__subfield--mild,
    .group-input__subfield.group-input__subfield--fair {
        background-color: rgba(251, 225, 34, 0.25);
        border-color: #cdb504;
    }

    .group-input__subfield.group-input__subfield--3,
    .group-input__subfield.group-input__subfield--moderate,
    .group-input__subfield.group-input__subfield--poor {
        background-color: rgba(244, 142, 34, 0.25);
        border-color: #c0670a;
    }

    .group-input__subfield.group-input__subfield--4,
    .group-input__subfield.group-input__subfield--severe,
    .group-input__subfield.group-input__subfield--bad {
        background-color: rgba(255, 45, 85, 0.25);
        border-color: #e0002b;
    }

    .group-input__subfield.group-input__subfield--count,
    .group-input__subfield.group-input__subfield--neutral {
        background-color: rgba(118, 138, 152, 0.25);
        border-color: #53636e;
    }

.group-input LABEL.group-input__label {
    display: inline-block;
    height: 28px;
    padding: 6px;
    font-size: 1.1rem;
}

.group-input INPUT[type="number"].group-input__textbox {
    width: 64px;
    height: 36px !important;
    border: none !important;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    font-family: 'Invention', sans-serif;
    font-weight: 500;
}

.group-input__total {
    display: none;
    width: 64px;
    height: 40px;
    padding: 10px 6px;
    margin-left: 0;
    border: 1px solid #A1AEB4;
    border-radius: 6px;
    background-color: rgba(161, 174, 180, 0.1);
    text-align: center;
    font-size: 1.504rem;
    font-weight: 600;
}

A.group-input__show-comments {
    width: 16px;
    opacity: 0.5;
    margin: 0 !important;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -ms-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

    A.group-input__show-comments:hover {
        opacity: 1;
    }

A.group-input__hide-comments {
    display: none;
    width: 16px;
    margin: 0 !important;
    opacity: 0.5;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -ms-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

    A.group-input__hide-comments:hover {
        opacity: 1;
    }

BUTTON.group-input__remove-field {
    width: 16px;
    opacity: 0.5;
    margin: 0 !important;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -ms-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

    BUTTON.group-input__remove-field:hover {
        opacity: 1;
    }

TEXTAREA.group-input__textarea {
    -webkit-box-flex: 0 1 70%;
    -webkit-flex: 0 1 70%;
    -moz-flex: 0 1 70%;
    -ms-flex: 0 1 70%;
    flex: 0 1 70%;
    margin-top: 20px;
    margin-left: 30%;
}

/* ---- RANGE ---- */
INPUT[type="range"] {
    -webkit-box-flex: 0 1 320px;
    -webkit-flex: 0 1 320px;
    -moz-flex: 0 1 320px;
    -ms-flex: 0 1 320px;
    flex: 0 1 320px;
    height: 40px;
}

/* ---- COLOUR ---- */
INPUT[type="color"] {
    -webkit-box-flex: 0 1 auto;
    -webkit-flex: 0 1 auto;
    -moz-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    height: 40px;
    padding: 4px;
    border: 1px solid #cdcdcd;
    border-radius: 4px;
    background-color: #FFF;
    cursor: pointer;
}

/* ---- GRID INPUTS ---- */
.table-wrap INPUT[type="text"],
.table-wrap INPUT[type="password"],
.table-wrap INPUT[type="email"],
.table-wrap INPUT[type="url"],
.table-wrap INPUT[type="number"],
.table-wrap INPUT[type="time"],
.table-wrap INPUT[type="date"],
.table-wrap INPUT[type="datetime"],
.table-wrap INPUT[type="datetime-local"],
.table-wrap INPUT[type="week"],
.table-wrap INPUT[type="month"],
.table-wrap INPUT[type="search"],
.table-wrap INPUT[type="tel"],
.table-wrap SELECT,
.table-wrap TEXTAREA {
    height: 32px;
    padding: 2px 8px;
}

/* ---- FILE UPLOAD ---- */
.upload-container {
    padding: 8px;
}

.upload-container__dropzone-element {
    position: relative;
    height: 24rem;
    border: dashed;
    margin-bottom: 20px;
    background-color: #FFF;
    text-align: center;
    vertical-align: middle;
}

.upload-container__text-wrapper {
    position: absolute;
    top: 50%;
    width: 100%;
    -webkit-transform: translate(0, -50%);
    /* Chrome, Safari 8+, Opera 15.0+ */
    -webkit-transform: -webkit-translate(0, -50%);
    /* Safari 7 */
    -moz-transform: translate(0, -50%);
    /* Firefox */
    -ms-transform: translate(0, -50%);
    /* IE 9 */
    -o-transform: translate(0, -50%);
    /* Opera 10.5 - 15.0 */
    transform: translate(0, -50%);
}

.upload-container__icon {
    display: inline-block;
    position: relative;
    width: 32px;
    height: 32px;
    margin-bottom: 20px;
    background-color: #6ECEB2;
    border-radius: 20px;
}

    .upload-container__icon I.icon {
        position: absolute;
        z-index: 1600;
        display: block;
        top: 10px;
        right: 10px;
        height: 12px;
        width: 12px;
        border-radius: 50%;
        overflow: hidden;
        text-indent: 100%;
        white-space: nowrap;
    }

        .upload-container__icon I.icon::after, .upload-container__icon I.icon::before {
            /* lines of 'X' icon */
            content: '';
            position: absolute;
            height: 2px;
            width: 12px;
            left: 50%;
            top: 50%;
            background-color: #FFF;
            -webkit-backface-visibility: hidden;
            -moz-backface-visibility: hidden;
            -ms-backface-visibility: hidden;
            -o-backface-visibility: hidden;
            backface-visibility: hidden;
            -webkit-transition: all 0.4s ease;
            -moz-transition: all 0.4s ease;
            -ms-transition: all 0.4s ease;
            -o-transition: all 0.4s ease;
            transition: all 0.4s ease;
        }

        .upload-container__icon I.icon::after {
            -webkit-transform: translateX(-50%) translateY(-50%) rotate(0deg);
            -moz-transform: translateX(-50%) translateY(-50%) rotate(0deg);
            -o-transform: translateX(-50%) translateY(-50%) rotate(0deg);
            -ms-transform: translateX(-50%) translateY(-50%) rotate(0deg);
            transform: translateX(-50%) translateY(-50%) rotate(0deg);
        }

        .upload-container__icon I.icon::before {
            -webkit-transform: translateX(-50%) translateY(-50%) rotate(-90deg);
            -moz-transform: translateX(-50%) translateY(-50%) rotate(-90deg);
            -o-transform: translateX(-50%) translateY(-50%) rotate(-90deg);
            -ms-transform: translateX(-50%) translateY(-50%) rotate(-90deg);
            transform: translateX(-50%) translateY(-50%) rotate(-90deg);
        }

        .upload-container__icon I.icon:hover::after, .upload-container__icon I.icon:hover::before {
            background-color: #e6e6e6;
        }

.upload-container__drop-text {
    font-family: 'Invention', sans-serif;
    ;
    font-weight: 500;
    color: #414E54;
    line-height: 1.3;
    letter-spacing: 0.1rem;
}

    .upload-container__drop-text.drop-text--primary {
        font-size: 1.504rem;
        font-weight: 600;
        text-transform: uppercase;
    }

    .upload-container__drop-text.drop-text--secondary {
        font-size: 1.28rem;
    }

.upload-container__attachment-check {
    height: 20px;
    margin-bottom: 8px;
}

/* ---- FIELD IMAGES & MEDIA ---- */
.field.field--images {
    /*@include flexbox-justify-content(flex-end);*/
    margin-bottom: 24px;
}

    .field.field--images LABEL.label--question {
        -webkit-box-flex: 0 1 64.5%;
        -webkit-flex: 0 1 64.5%;
        -moz-flex: 0 1 64.5%;
        -ms-flex: 0 1 64.5%;
        flex: 0 1 64.5%;
    }

    .field.field--images .radio-switch-block {
        -webkit-box-flex: 0 1 33%;
        -webkit-flex: 0 1 33%;
        -moz-flex: 0 1 33%;
        -ms-flex: 0 1 33%;
        flex: 0 1 33%;
    }

    .field.field--images .field-media {
        -webkit-box-flex: 0 1 100%;
        -webkit-flex: 0 1 100%;
        -moz-flex: 0 1 100%;
        -ms-flex: 0 1 100%;
        flex: 0 1 100%;
        text-align: left;
    }

.field-media__viewport {
    display: inline-block;
    position: relative;
    width: 120px;
    height: 90px;
    border: 1px solid #ececec;
    overflow: hidden;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}

    .field-media__viewport.field-media__viewport--large {
        width: 360px;
        height: 280px;
    }

        .field-media__viewport.field-media__viewport--large:after {
            content: '\ea0f';
            position: absolute;
            z-index: 100;
            top: 12px;
            right: 12px;
            width: 16px;
            height: 16px;
            font-family: "IcoMoon Basic";
            font-size: 16px;
            color: #FFF;
        }

.field-media__image {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    /* Chrome, Safari 8+, Opera 15.0+ */
    -webkit-transform: -webkit-translate(-50%, -50%);
    /* Safari 7 */
    -moz-transform: translate(-50%, -50%);
    /* Firefox */
    -ms-transform: translate(-50%, -50%);
    /* IE 9 */
    -o-transform: translate(-50%, -50%);
    /* Opera 10.5 - 15.0 */
    transform: translate(-50%, -50%);
    width: auto;
    height: auto;
    min-width: 100.01%;
    min-height: 100.01%;
    max-width: 200%;
}

    .field-media__image:hover {
        opacity: 0.75;
        cursor: pointer;
    }

/* ============================================================== MEDIA QUERIES ============================================================== */
/* ---- LAPTOP & DESKTOP (1280px +) ---- */
@media only screen and (min-width: 1280px) {
    /* ======== FIELDSETS & FIELD CONTAINERS ======== */
    /* ---- INLINE 'ROW' FIELDS ---- */
    /*.field.field--adjacent,	
    .buttons.buttons--row					                {&:last-child{padding-right:0;}}
    .buttons.buttons--row					                {margin-top:$spaceSize-larger; text-align:left;}*/
    /* ======== STANDARD FORM ELEMENTS ======== */
    /* ---- LABELS ---- */
    /*LABEL 							                        {}
    .field--check-radio > LABEL                             {padding:$spaceSize-nano $spaceSize-small;}*/
}

/* ---- LARGE TABLET & SMALL LAPTOP (960px - 1023px) ---- */
@media only screen and (min-width: 960px) and (max-width: 1023px) {
    /* ---- LABELS ---- */
    LABEL.label--question,
    .field LABEL.label--question {
        -webkit-box-flex: 0 1 60%;
        -webkit-flex: 0 1 60%;
        -moz-flex: 0 1 60%;
        -ms-flex: 0 1 60%;
        flex: 0 1 60%;
    }

    .check-wrap LABEL {
        padding: 8px 8px 8px 1px;
    }
    /* ---- SUB FIELD ---- */
    .field.field--sub-input {
        width: 83.33%;
    }

        .field.field--sub-input .k-widget.k-dropdown {
            max-width: 120px;
            font-size: 1.1rem;
        }
    /* ---- INLINE 'ROW' FIELDS ---- */
    .fields--row {
        -webkit-flex-wrap: wrap;
        flex-wrap: wrap;
    }
    /* Detects child element count and resizes flex-basis */
    .field.field--adjacent:first-child:nth-last-child(1),
    .buttons.buttons--adjacent:first-child:nth-last-child(1) {
        -webkit-box-flex: 1 1 100%;
        -webkit-flex: 1 1 100%;
        -moz-flex: 1 1 100%;
        -ms-flex: 1 1 100%;
        flex: 1 1 100%;
    }

    .field.field--adjacent:first-child:nth-last-child(2),
    .field.field--adjacent:first-child:nth-last-child(2) ~ .field.field--adjacent,
    .buttons.buttons--row:first-child:nth-last-child(2),
    .buttons.buttons--row:first-child:nth-last-child(2) ~ .buttons.buttons--row,
    .field.field--adjacent:first-child:nth-last-child(3),
    .field.field--adjacent:first-child:nth-last-child(3) ~ .field.field--adjacent,
    .buttons.buttons--row:first-child:nth-last-child(3),
    .buttons.buttons--row:first-child:nth-last-child(3) ~ .buttons.buttons--row,
    .field.field--adjacent:first-child:nth-last-child(4),
    .field.field--adjacent:first-child:nth-last-child(4) ~ .field.field--adjacent,
    .buttons.buttons--row:first-child:nth-last-child(4),
    .buttons.buttons--row:first-child:nth-last-child(4) ~ .buttons.buttons--row,
    .field.field--adjacent:first-child:nth-last-child(5),
    .field.field--adjacent:first-child:nth-last-child(5) ~ .field.field--adjacent,
    .buttons.buttons--row:first-child:nth-last-child(5),
    .buttons.buttons--row:first-child:nth-last-child(5) ~ .buttons.buttons--row {
        -webkit-box-flex: 1 1 50%;
        -webkit-flex: 1 1 50%;
        -moz-flex: 1 1 50%;
        -ms-flex: 1 1 50%;
        flex: 1 1 50%;
    }
    /* ---- BOX BASED INPUTS (INLINE 'ROW' FIELDS ONLY) ---- */
    .field.field--adjacent INPUT[type="text"],
    .field.field--adjacent INPUT[type="password"],
    .field.field--adjacent INPUT[type="email"],
    .field.field--adjacent INPUT[type="url"],
    .field.field--adjacent INPUT[type="number"],
    .field.field--adjacent INPUT[type="time"],
    .field.field--adjacent INPUT[type="date"],
    .field.field--adjacent INPUT[type="datetime"],
    .field.field--adjacent INPUT[type="datetime-local"],
    .field.field--adjacent INPUT[type="week"],
    .field.field--adjacent INPUT[type="month"],
    .field.field--adjacent INPUT[type="search"],
    .field.field--adjacent INPUT[type="tel"],
    .field.field--adjacent SELECT,
    .field.field--adjacent TEXTAREA {
        flex: none;
        width: 100%;
    }
    /* ---- RADIO & CHECKBOXES  ---- */
    .check-wrap {
        -webkit-box-flex: 0 1 50%;
        -webkit-flex: 0 1 50%;
        -moz-flex: 0 1 50%;
        -ms-flex: 0 1 50%;
        flex: 0 1 50%;
    }

        .check-wrap.check-wrap--long {
            -webkit-box-flex: 0 1 100%;
            -webkit-flex: 0 1 100%;
            -moz-flex: 0 1 100%;
            -ms-flex: 0 1 100%;
            flex: 0 1 100%;
        }
}

/* ---- MOBILE TO PORTRAIT TABLET (0 - 1024px) ---- */
@media only screen and (max-width: 1023px) {
    /* ---- GROUP INPUTS ---- */
    .field.field--group-input.group-input--new-line {
        margin-left: 0;
    }
}

/* ---- MOBILE TO SMALL TABLET (0 - 959px) ---- */
@media only screen and (max-width: 959px) {
    /* ======== FIELDSETS & FIELD CONTAINERS ======== */
    FIELDSET.fieldset--detail .field {
        -webkit-flex-direction: row;
        -moz-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
    }

        FIELDSET.fieldset--detail .field LABEL {
            -webkit-box-flex: 0 1 50%;
            -webkit-flex: 0 1 50%;
            -moz-flex: 0 1 50%;
            -ms-flex: 0 1 50%;
            flex: 0 1 50%;
        }

        FIELDSET.fieldset--detail .field INS {
            -webkit-box-flex: 0 1 50%;
            -webkit-flex: 0 1 50%;
            -moz-flex: 0 1 50%;
            -ms-flex: 0 1 50%;
            flex: 0 1 50%;
        }
    /* ---- LABELS ---- */
    LABEL.label--question,
    .field LABEL.label--question {
        margin-bottom: 10px;
    }
    /* ---- STANDARD FIELD ---- */
    .field {
        -webkit-flex-direction: column;
        -moz-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-align-items: stretch;
        align-items: stretch;
        -webkit-flex-wrap: nowrap;
        flex-wrap: nowrap;
    }

        .field.field--check-radio {
            -webkit-flex-direction: row;
            -moz-flex-direction: row;
            -ms-flex-direction: row;
            flex-direction: row;
            -webkit-align-items: flex-start;
            align-items: flex-start;
            -webkit-flex-wrap: wrap;
            flex-wrap: wrap;
        }
    /* ---- INLINE 'ROW' FIELDS ---- */
    .fields--row {
        -webkit-flex-direction: column;
        -moz-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-align-items: stretch;
        align-items: stretch;
        -webkit-flex-wrap: nowrap;
        flex-wrap: nowrap;
        margin-bottom: 16px;
    }
    /* Detects child element count and resizes */
    .field.field--adjacent:first-child:nth-last-child(1),
    .buttons.buttons--row:first-child:nth-last-child(1),
    .field.field--adjacent:first-child:nth-last-child(2),
    .field.field--adjacent:first-child:nth-last-child(2) ~ .field.field--adjacent,
    .buttons.buttons--row:first-child:nth-last-child(2),
    .buttons.buttons--row:first-child:nth-last-child(2) ~ .buttons.buttons--row,
    .field.field--adjacent:first-child:nth-last-child(3),
    .field.field--adjacent:first-child:nth-last-child(3) ~ .field.field--adjacent,
    .buttons.buttons--row:first-child:nth-last-child(3),
    .buttons.buttons--row:first-child:nth-last-child(3) ~ .buttons.buttons--row,
    .field.field--adjacent:first-child:nth-last-child(4),
    .field.field--adjacent:first-child:nth-last-child(4) ~ .field.field--adjacent,
    .buttons.buttons--row:first-child:nth-last-child(4),
    .buttons.buttons--row:first-child:nth-last-child(4) ~ .buttons.buttons--row,
    .field.field--adjacent:first-child:nth-last-child(5),
    .field.field--adjacent:first-child:nth-last-child(5) ~ .field.field--adjacent,
    .buttons.buttons--row:first-child:nth-last-child(5),
    .buttons.buttons--row:first-child:nth-last-child(5) ~ .buttons.buttons--row {
        -webkit-box-flex: 1 1 auto;
        -webkit-flex: 1 1 auto;
        -moz-flex: 1 1 auto;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
        padding-right: 0;
    }
    /* ======== STANDARD FORM ELEMENTS ======== */
    /* ---- LABELS ---- */
    LABEL,
    .field--check-radio > LABEL {
        -webkit-box-flex: 0 0 100%;
        -webkit-flex: 0 0 100%;
        -moz-flex: 0 0 100%;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        padding: 16px 16px 0 0;
        text-align: left;
    }
    /* ---- INSERTED TEXT (SAVED FIELD) ---- */
    .field INS {
        -webkit-box-flex: 1 1 auto;
        -webkit-flex: 1 1 auto;
        -moz-flex: 1 1 auto;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
        width: 100%;
    }
    /* ---- VALIDATION MESSAGE ---- */
    .field-validation-error,
    .field .validation {
        -webkit-box-flex: 1 1 auto;
        -webkit-flex: 1 1 auto;
        -moz-flex: 1 1 auto;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
        left: 0;
        width: 100%;
        margin-left: 0;
    }
    /* ---- INPUT HEIGHTS ---- */
    .field.field--adjacent LABEL {
        height: auto;
    }
    /* ---- BOX BASED INPUTS ---- */
    INPUT[type="text"],
    INPUT[type="password"],
    INPUT[type="email"],
    INPUT[type="url"],
    INPUT[type="number"],
    INPUT[type="time"],
    INPUT[type="date"],
    INPUT[type="datetime"],
    INPUT[type="datetime-local"],
    INPUT[type="week"],
    INPUT[type="month"],
    INPUT[type="search"],
    INPUT[type="tel"],
    SELECT, .field.field--sub-input
    TEXTAREA {
        -webkit-box-flex: 1 1 auto;
        -webkit-flex: 1 1 auto;
        -moz-flex: 1 1 auto;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
        width: 100%;
    }
    /* ---- SELECT ---- */
    .select-wrap {
        -webkit-box-flex: 1 1 auto;
        -webkit-flex: 1 1 auto;
        -moz-flex: 1 1 auto;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
        width: 100%;
    }
    /* ---- RADIO & CHECKBOXES  ---- */
    .check-wrap {
        -webkit-box-flex: 0 1 33.33%;
        -webkit-flex: 0 1 33.33%;
        -moz-flex: 0 1 33.33%;
        -ms-flex: 0 1 33.33%;
        flex: 0 1 33.33%;
    }

        .check-wrap.check-wrap--long {
            -webkit-box-flex: 0 1 66.66%;
            -webkit-flex: 0 1 66.66%;
            -moz-flex: 0 1 66.66%;
            -ms-flex: 0 1 66.66%;
            flex: 0 1 66.66%;
        }

    INPUT[type="radio"] + LABEL,
    INPUT[type="checkbox"] + LABEL {
        padding: 8px 0;
    }
    /* ---- RANGE ---- */
    INPUT[type="range"] {
        -webkit-box-flex: 1 1 auto;
        -webkit-flex: 1 1 auto;
        -moz-flex: 1 1 auto;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
        width: 100%;
    }
    /* ---- SUB INPUT ---- */
    .field.field--sub-input {
        width: 50%;
    }

        .field.field--sub-input LABEL.label--question {
            -webkit-box-flex: 1 1 auto;
            -webkit-flex: 1 1 auto;
            -moz-flex: 1 1 auto;
            -ms-flex: 1 1 auto;
            flex: 1 1 auto;
        }

        .field.field--sub-input INPUT {
            -webkit-box-flex: 0 0 48px;
            -webkit-flex: 0 0 48px;
            -moz-flex: 0 0 48px;
            -ms-flex: 0 0 48px;
            flex: 0 0 48px;
        }

        .field.field--sub-input.field--minor {
            width: 40%;
            margin-top: 48px;
        }
}

/* ===========================================================

	$TABLES (v2 2018)

=========================================================== */
/* ---- WRAP ---- */
.table-wrap {
    width: 100%;
    margin-bottom: 20px;
    overflow-x: scroll;
    -webkit-overflow-scrolling: touch;
}

    .table-wrap.table-wrap--desktop-only {
        display: block;
    }

    .table-wrap.table-wrap--mobile-only {
        display: none;
    }

.tab-panel .table-wrap {
    margin-bottom: 0;
    overflow-x: auto;
    overflow: visible;
}

/* ---- FIXED TABLE ELEMENTS ---- */
.table-dock {
    width: auto;
}

    .table-dock .table-wrap--fixed.table-wrap--visible {
        width: inherit;
        max-width: 1020px;
    }

.table-wrap--fixed {
    display: none;
    position: fixed;
    top: 86px;
    z-index: 300;
    width: 100%;
    border-bottom: 1px solid #A1AEB4;
    -webkit-box-shadow: 0 4px 4px rgba(0, 0, 0, 0.12);
    -moz-box-shadow: 0 4px 4px rgba(0, 0, 0, 0.12);
    box-shadow: 0 4px 4px rgba(0, 0, 0, 0.12);
    overflow-x: auto;
}

    .table-wrap--fixed.table-wrap--visible {
        display: block;
    }

.table-wrap.table-wrap--pad {
    padding: 0 16px;
}

/* ---- TABLE ---- */
.table-wrap > TABLE {
    width: 100%;
    min-width: 960px;
    table-layout: fixed;
    border-collapse: collapse;
    border-spacing: 0;
    background-color: transparent;
    font-family: 'Invention', sans-serif;
    ;
}

    .table-wrap > TABLE.table--large {
        min-width: 1280px;
    }

.table-wrap THEAD TR {
    background-color: #0C2340;
}

.table-wrap TR:hover {
    -webkit-transition: background-color 0.4s ease;
    -moz-transition: background-color 0.4s ease;
    -ms-transition: background-color 0.4s ease;
    -o-transition: background-color 0.4s ease;
    transition: background-color 0.4s ease;
}

.table-wrap TH,
.table-wrap TD {
    padding: 10px 16px;
    border-bottom: 1px solid #ececec;
    text-align: left;
    vertical-align: top;
}

    .table-wrap TH:last-of-type,
    .table-wrap TD:last-of-type {
        text-align: right;
    }

.table-wrap TH {
    font-weight: 600;
    color: #FFF;
}

    .table-wrap TH LABEL {
        font-size: inherit;
    }

    .table-wrap TH.rotate-45 > DIV {
        position: relative;
        height: 100px;
        /*@include skew(-45deg,0);*/
    }

        .table-wrap TH.rotate-45 > DIV SPAN {
            display: inline-block;
            position: absolute;
            /*@include skew(45deg,0);*/
            -webkit-transform: rotate(300deg);
            -moz-transform: rotate(300deg);
            -o-transform: rotate(300deg);
            -ms-transform: rotate(300deg);
            transform: rotate(300deg);
            bottom: 30px;
            left: 0;
            right: 0;
            width: 85px;
            margin: 0 auto;
            text-align: left;
            white-space: nowrap;
        }

.table-wrap TBODY TH {
    color: #414E54;
}

.table-wrap TH.row-heading {
    text-align: left;
}

    .table-wrap TH.row-heading MARK {
        display: inline-block;
        width: 10px;
        height: 10px;
        border-radius: 50%;
        margin-right: 8px;
        background-color: #FFF;
        vertical-align: middle;
    }

.table-wrap TD {
    overflow: hidden;
}

    .table-wrap TD EM.em--alt {
        font-style: normal;
        color: #FBE122;
    }

.table-wrap TFOOT {
    background: transparent;
    color: #414E54;
}

/* ---- CONDENSED TABLE ---- */
.table-wrap TABLE.table--condensed THEAD TH {
    padding: 16px 8px;
    text-align: center;
    vertical-align: middle;
    overflow: hidden;
    text-overflow: ellipsis;
}

    .table-wrap TABLE.table--condensed THEAD TH:first-of-type {
        width: auto;
    }

    .table-wrap TABLE.table--condensed THEAD TH:last-of-type {
        text-align: center;
    }

.table-wrap TABLE.table--condensed TBODY TH:first-of-type {
    text-align: left;
}

.table-wrap TABLE.table--condensed TD {
    padding: 6px;
    text-align: center;
    vertical-align: middle;
    font-weight: 600;
}

    .table-wrap TABLE.table--condensed TD:first-of-type {
        width: 20%;
    }

    .table-wrap TABLE.table--condensed TD:last-of-type {
        text-align: center;
    }

/* ---- GRIDS (Enhanced tables) ---- */
.grid-wrap {
    width: 100%;
    /* margin-bottom: 20px;
  overflow-x: scroll; */
    -webkit-overflow-scrolling: touch;
}

/* ---- GRID ACTIONS MENU ---- */
.table-wrap TD.actions-menu-dock {
    text-align: right;
}

.grid-actions-menu {
    background-color: rgba(251, 225, 34, 0.1);
    overflow: hidden;
    color: #414E54;
    -webkit-transition: max-height 0.4s ease-out;
    -moz-transition: max-height 0.4s ease-out;
    -ms-transition: max-height 0.4s ease-out;
    -o-transition: max-height 0.4s ease-out;
    transition: max-height 0.4s ease-out;
}

/* ---- TABLE & GRID MODIFIERS ---- */
TD.table-cell--no-records {
    border: none;
    overflow: visible;
    white-space: nowrap;
}

    TD.table-cell--no-records SPAN.cell-message {
        display: inline-block;
        margin-left: 20px;
    }

.table-wrap COLGROUP.col--highlight,
.table-wrap TR.col--highlight {
    background-color: rgba(161, 174, 180, 0.33) !important;
}

.table-wrap.table-wrap--fixed TR.col--highlight {
    background-color: #e8ebed !important;
}

.table-wrap TR.row--neutral MARK {
    border: 1px solid #A1AEB4;
    background-color: #FFF;
}

.table-wrap TR.row--excellent {
    /*background-color:rgba($tertiaryColour,0.25); */
}

    .table-wrap TR.row--excellent.col--highlight {
        background-color: rgba(110, 206, 178, 0.33) !important;
    }

    .table-wrap TR.row--excellent TH, .table-wrap TR.row--excellent TD {
        /*color:darken($tertiaryColour, 15%);*/
    }

    .table-wrap TR.row--excellent MARK {
        background-color: #5bc8a8;
    }

.table-wrap TR.row--good {
    /*background-color:rgba($octonaryColour,0.25);*/
}

    .table-wrap TR.row--good.col--highlight {
        background-color: rgba(110, 206, 178, 0.33) !important;
    }

    .table-wrap TR.row--good TH, .table-wrap TR.row--good TD {
        /*color:darken($octonaryColour, 15%);*/
    }

    .table-wrap TR.row--good MARK {
        background-color: #5bc8a8;
    }

.table-wrap TR.row--fair {
    /*background-color:rgba($primaryColour,0.25);*/
}

    .table-wrap TR.row--fair.col--highlight {
        background-color: rgba(251, 225, 34, 0.33) !important;
    }

    .table-wrap TR.row--fair TH, .table-wrap TR.row--fair TD {
        /*color:darken($primaryColour, 15%);*/
    }

    .table-wrap TR.row--fair MARK {
        background-color: #fbde09;
    }

.table-wrap TR.row--poor {
    /*background-color:rgba($quinaryColour,0.25);*/
}

    .table-wrap TR.row--poor.col--highlight {
        background-color: rgba(244, 142, 34, 0.33) !important;
    }

    .table-wrap TR.row--poor TH, .table-wrap TR.row--poor TD {
        /*color:darken($quinaryColour, 15%);*/
    }

    .table-wrap TR.row--poor MARK {
        background-color: #f1820c;
    }

.table-wrap TR.row--bad {
    /*background-color:rgba($quarternaryColour,0.25);*/
}

    .table-wrap TR.row--bad.col--highlight {
        background-color: rgba(255, 45, 85, 0.33) !important;
    }

    .table-wrap TR.row--bad TH, .table-wrap TR.row--bad TD {
        /*color:darken($quarternaryColour, 15%);*/
    }

    .table-wrap TR.row--bad MARK {
        background-color: #ff1440;
    }

.table-wrap TR.row--critical {
    /*background-color:rgba($quarternaryColour,0.40);*/
}

    .table-wrap TR.row--critical.col--highlight {
        background-color: rgba(249, 0, 47, 0.33) !important;
    }

    .table-wrap TR.row--critical TH, .table-wrap TR.row--critical TD {
        /*color:darken($quarternaryColour, 20%);*/
    }

    .table-wrap TR.row--critical MARK {
        background-color: #c60026;
    }

/* ============================================================== MEDIA QUERIES ============================================================== */
/* ---- LARGE DESKTOP CUSTOM (1600px +) ---- */
@media only screen and (min-width: 1600px) {
    /* ---- FIXED TABLE ELEMENTS ---- */
    .table-dock .table-wrap--fixed.table-wrap--visible {
        max-width: 982px;
    }
}

/* ---- SMALL DESKTOP (1440px - 1599px) ---- */
@media only screen and (min-width: 1440px) and (max-width: 1599px) {
    /* ---- FIXED TABLE ELEMENTS ---- */
    .table-dock .table-wrap--fixed.table-wrap--visible {
        max-width: 1024px;
    }
}

/* ---- LAPTOP CUSTOM (1280px - 1439px) ---- */
@media only screen and (min-width: 1280px) and (max-width: 1439px) {
    /* ---- FIXED TABLE ELEMENTS ---- */
    .table-dock .table-wrap--fixed.table-wrap--visible {
        max-width: 900px;
    }
}

/* ---- LARGE TABLET - LAPTOP (1024px - 1279px) ---- */
@media only screen and (min-width: 1024px) and (max-width: 1279px) {
    /* ---- FIXED TABLE ELEMENTS ---- */
    .table-dock .table-wrap--fixed.table-wrap--visible {
        max-width: 67.5%;
    }
}

/* ---- CUSTOM TABLET/LAPTOP (1280px - 1290px) ---- */
@media only screen and (min-width: 1280px) and (max-width: 1290px) {
    /* ---- FIXED TABLE ELEMENTS ---- */
    .table-dock .table-wrap--fixed.table-wrap--visible {
        max-width: 890px;
    }
}

/* ---- TABLET, LAPTOP & DESKTOP (960px +) ---- */
@media only screen and (min-width: 960px) {
    /* ---- WRAP ---- */
    .table-wrap.table-wrap--desktop-only {
        display: block;
    }

    .table-wrap.table-wrap--mobile-only {
        display: none;
    }
}

/* ---- MOBILE & TABLET (0 - 1023px) ---- */
@media only screen and (max-width: 1023px) {
    /* ---- FIXED TABLE ELEMENTS ---- */
    .table-dock .table-wrap--fixed.table-wrap--visible {
        max-width: 66%;
        right: 40px;
        left: auto;
    }
}

/* ---- CUSTOM TABLET (1024px - 1120px) ---- */
@media only screen and (min-width: 1024px) and (max-width: 1120px) {
    /* ---- FIXED TABLE ELEMENTS ---- */
    .table-dock .table-wrap--fixed.table-wrap--visible {
        max-width: 67%;
    }
}

/* ---- CUSTOM TABLET (1121px - 1180px) ---- */
@media only screen and (min-width: 1121px) and (max-width: 1180px) {
    /* ---- FIXED TABLE ELEMENTS ---- */
    .table-dock .table-wrap--fixed.table-wrap--visible {
        max-width: 66.5%;
    }
}

/* ---- MOBILE & SMALL TABLET (0 - 959px) ---- */
@media only screen and (max-width: 959px) {
    /* ---- WRAP ---- */
    .table-wrap.table-wrap--desktop-only {
        display: none;
    }

    .table-wrap.table-wrap--mobile-only {
        display: block;
    }

    .table-wrap TABLE,
    .table-wrap TABLE BUTTON,
    .table-wrap TABLE INPUT,
    .table-wrap TABLE SELECT,
    .table-wrap TABLE TEXTAREA {
        font-size: 1.1rem;
        line-height: 1;
    }
    /* ---- FIXED TABLE ELEMENTS ---- */
    .table-dock .table-wrap--fixed.table-wrap--visible {
        max-width: 60.5%;
    }
}

/* ---- CUSTOM TABLET (0 - 860px) ---- */
@media only screen and (max-width: 860px) {
    /* ---- FIXED TABLE ELEMENTS ---- */
    .table-dock .table-wrap--fixed.table-wrap--visible {
        max-width: 58%;
    }
}

/* ===========================================================

	$SPRITES (v2 2018)

=========================================================== */
/* ======== FONT SPRITES ======== */
@font-face {
    font-family: 'IcoMoon Basic';
    src: url("/assets/fonts/IcoMoonSet-Basic.woff2") format("woff2"), url("/assets/fonts/IcoMoonSet-Basic.woff") format("woff"), url("/assets/fonts/IcoMoonSet-Basic.ttf") format("truetype");
    font-weight: normal;
    font-style: normal;
}

/* ===========================================================

	$ICONS (v2 2018)

=========================================================== */
.icon {
    background-repeat: no-repeat;
}

    .icon:hover {
        background-repeat: no-repeat;
    }

I.icon {
    display: inline-block;
}

    I.icon:before {
        width: 100%;
        height: 100%;
        line-height: 1;
        font-family: "IcoMoon Basic";
        font-weight: normal;
        color: #414E54;
    }

I.icon--12 {
    width: 12px;
    height: 12px;
}

    I.icon--12:before {
        font-size: 12px;
    }

I.icon--16 {
    width: 16px;
    height: 16px;
}

    I.icon--16:before {
        font-size: 16px;
    }

I.icon--20 {
    width: 20px;
    height: 20px;
}

    I.icon--20:before {
        font-size: 20px;
    }

I.icon--24 {
    width: 24px;
    height: 24px;
}

    I.icon--24:before {
        font-size: 24px;
    }

I.icon--32 {
    width: 32px;
    height: 32px;
}

    I.icon--32:before {
        font-size: 32px;
    }

I.icon--base:before {
    color: #414E54;
}

I.icon--bright:before {
    color: #FFF;
}

I.icon--light:before {
    color: #768A98;
}

I.icon--dark:before {
    color: #1b1b1b;
}

I.icon--primary:before {
    color: #FBE122;
}

I.icon--secondary:before {
    color: #0C2340;
}

I.icon--tertiary:before {
    color: #058C83;
}

I.icon--quarternary:before {
    color: #FF2D55;
}

I.icon--quinary:before {
    color: #F48E22;
}

I.icon--senary:before {
    color: #2B85BA;
}

I.icon--septenary:before {
    color: #C77731;
}

I.icon--octonary:before {
    color: #6ECEB2;
}

I.icon--nonary:before {
    color: #3B9A49;
}

I.icon--denary:before {
    color: #EA1A3E;
}

/* ---- ICONS BUTTONS ---- */
.button--icon .icon {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 12px;
    margin: auto;
}

.button--icon .button--no-text .icon {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    color: transparent;
}

/* ---- ICON INPUT ---- */
I.icon.icon--input {
    display: inline-block;
    position: relative;
}

    I.icon.icon--input:before {
        position: absolute;
        z-index: 100;
        top: 16px;
        bottom: 0;
        left: 12px;
        margin: auto;
    }

    I.icon.icon--input.icon--only {
        margin-right: 8px;
    }

        I.icon.icon--input.icon--only:before {
            top: 0;
            left: 0;
        }

        I.icon.icon--input.icon--only INPUT {
            position: absolute;
            z-index: 200;
        }

/* ---- ICONS WITHIN GRID BUTTONS  ---- */
.button--grid.button--icon .icon {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 8px;
    margin: auto;
}

/* ---- ICONS WITHIN ICON-ONLY BUTTONS ---- */
.button--grid.button--icon-only {
    background-repeat: no-repeat;
}

    .button--grid.button--icon-only:hover {
        background-repeat: no-repeat;
    }

.button.no-text .icon {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    color: transparent;
}

/* ---- CHEVRON ICONS ---- */
.icon.icon--chevron-right {
    position: absolute;
    z-index: 1600;
    display: block;
    top: 15px;
    right: 15px;
    height: 36px;
    width: 36px;
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -ms-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}

    .icon.icon--chevron-right::after, .icon.icon--chevron-right::before {
        /* lines of '>' icon */
        content: '';
        position: absolute;
        height: 4px;
        width: 18px;
        left: 30%;
        top: 50%;
        background-color: #F48E22;
        -webkit-backface-visibility: hidden;
        -moz-backface-visibility: hidden;
        -ms-backface-visibility: hidden;
        -o-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-transition: background-color 0.4s ease;
        -moz-transition: background-color 0.4s ease;
        -ms-transition: background-color 0.4s ease;
        -o-transition: background-color 0.4s ease;
        transition: background-color 0.4s ease;
    }

    .icon.icon--chevron-right::before {
        -webkit-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        -moz-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        -o-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        -ms-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        transform: translateX(-36%) translateY(-30%) rotate(-45deg);
    }

    .icon.icon--chevron-right::after {
        -webkit-transform: translateX(36%) translateY(-30%) rotate(45deg);
        -moz-transform: translateX(36%) translateY(-30%) rotate(45deg);
        -o-transform: translateX(36%) translateY(-30%) rotate(45deg);
        -ms-transform: translateX(36%) translateY(-30%) rotate(45deg);
        transform: translateX(36%) translateY(-30%) rotate(45deg);
    }

    .icon.icon--chevron-right:hover::after, .icon.icon--chevron-right:hover::before {
        background-color: #f6a753;
    }

.icon.icon--chevron-left {
    position: absolute;
    z-index: 1600;
    display: block;
    top: 15px;
    right: 15px;
    height: 36px;
    width: 36px;
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -ms-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
    -webkit-transform: rotate(270deg);
    -moz-transform: rotate(270deg);
    -o-transform: rotate(270deg);
    -ms-transform: rotate(270deg);
    transform: rotate(270deg);
}

    .icon.icon--chevron-left::after, .icon.icon--chevron-left::before {
        /* lines of '>' icon */
        content: '';
        position: absolute;
        height: 4px;
        width: 18px;
        left: 30%;
        top: 50%;
        background-color: #F48E22;
        -webkit-backface-visibility: hidden;
        -moz-backface-visibility: hidden;
        -ms-backface-visibility: hidden;
        -o-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-transition: background-color 0.4s ease;
        -moz-transition: background-color 0.4s ease;
        -ms-transition: background-color 0.4s ease;
        -o-transition: background-color 0.4s ease;
        transition: background-color 0.4s ease;
    }

    .icon.icon--chevron-left::before {
        -webkit-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        -moz-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        -o-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        -ms-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        transform: translateX(-36%) translateY(-30%) rotate(-45deg);
    }

    .icon.icon--chevron-left::after {
        -webkit-transform: translateX(36%) translateY(-30%) rotate(45deg);
        -moz-transform: translateX(36%) translateY(-30%) rotate(45deg);
        -o-transform: translateX(36%) translateY(-30%) rotate(45deg);
        -ms-transform: translateX(36%) translateY(-30%) rotate(45deg);
        transform: translateX(36%) translateY(-30%) rotate(45deg);
    }

    .icon.icon--chevron-left:hover::after, .icon.icon--chevron-left:hover::before {
        background-color: #f6a753;
    }

/* ---- EXPAND DOTS ICON ---- */
I.icon.icon--light.icon--expand-dots {
    position: absolute;
    z-index: 1600;
    display: block;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 4px;
    height: 4px;
    margin: auto;
    background-color: #768A98;
    border-radius: 4px;
    overflow: visible;
    white-space: nowrap;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -ms-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

    I.icon.icon--light.icon--expand-dots::after, I.icon.icon--light.icon--expand-dots::before {
        /* dots of symbol */
        content: '';
        display: inline-block;
        position: absolute;
        width: 4px;
        height: 4px;
        background-color: #768A98;
        border-radius: 4px;
        -webkit-transition: background-color 0.4s ease;
        -moz-transition: background-color 0.4s ease;
        -ms-transition: background-color 0.4s ease;
        -o-transition: background-color 0.4s ease;
        transition: background-color 0.4s ease;
    }

    I.icon.icon--light.icon--expand-dots::before {
        left: 4.8px;
        /*background-color:red;*/
    }

    I.icon.icon--light.icon--expand-dots::after {
        right: 4.8px;
        /*background-color:green;*/
    }

    I.icon.icon--light.icon--expand-dots:hover {
        background-color: #697d8c;
    }

        I.icon.icon--light.icon--expand-dots:hover::after, I.icon.icon--light.icon--expand-dots:hover::before {
            background-color: #697d8c;
        }

/* ======== SPRITE ICON FONT ======== */
.icon--home:before {
    content: "\e900";
}

.icon--home2:before {
    content: "\e901";
}

.icon--home3:before {
    content: "\e902";
}

.icon--office:before {
    content: "\e903";
}

.icon--newspaper:before {
    content: "\e904";
}

.icon--pencil:before {
    content: "\e905";
}

.icon--pencil2:before {
    content: "\e906";
}

.icon--quill:before {
    content: "\e907";
}

.icon--pen:before {
    content: "\e908";
}

.icon--blog:before {
    content: "\e909";
}

.icon--eyedropper:before {
    content: "\e90a";
}

.icon--droplet:before {
    content: "\e90b";
}

.icon--paint-format:before {
    content: "\e90c";
}

.icon--image:before {
    content: "\e90d";
}

.icon--images:before {
    content: "\e90e";
}

.icon--camera:before {
    content: "\e90f";
}

.icon--headphones:before {
    content: "\e910";
}

.icon--music:before {
    content: "\e911";
}

.icon--play:before {
    content: "\e912";
}

.icon--film:before {
    content: "\e913";
}

.icon--video-camera:before {
    content: "\e914";
}

.icon--dice:before {
    content: "\e915";
}

.icon--pacman:before {
    content: "\e916";
}

.icon--spades:before {
    content: "\e917";
}

.icon--clubs:before {
    content: "\e918";
}

.icon--diamonds:before {
    content: "\e919";
}

.icon--bullhorn:before {
    content: "\e91a";
}

.icon--connection:before {
    content: "\e91b";
}

.icon--podcast:before {
    content: "\e91c";
}

.icon--feed:before {
    content: "\e91d";
}

.icon--mic:before {
    content: "\e91e";
}

.icon--book:before {
    content: "\e91f";
}

.icon--books:before {
    content: "\e920";
}

.icon--library:before {
    content: "\e921";
}

.icon--file-text:before {
    content: "\e922";
}

.icon--profile:before {
    content: "\e923";
}

.icon--file-empty:before {
    content: "\e924";
}

.icon--files-empty:before {
    content: "\e925";
}

.icon--file-text2:before {
    content: "\e926";
}

.icon--file-picture:before {
    content: "\e927";
}

.icon--file-music:before {
    content: "\e928";
}

.icon--file-play:before {
    content: "\e929";
}

.icon--file-video:before {
    content: "\e92a";
}

.icon--file-zip:before {
    content: "\e92b";
}

.icon--copy:before {
    content: "\e92c";
}

.icon--paste:before {
    content: "\e92d";
}

.icon--stack:before {
    content: "\e92e";
}

.icon--folder:before {
    content: "\e92f";
}

.icon--folder-open:before {
    content: "\e930";
}

.icon--folder-plus:before {
    content: "\e931";
}

.icon--folder-minus:before {
    content: "\e932";
}

.icon--folder-download:before {
    content: "\e933";
}

.icon--folder-upload:before {
    content: "\e934";
}

.icon--price-tag:before {
    content: "\e935";
}

.icon--price-tags:before {
    content: "\e936";
}

.icon--barcode:before {
    content: "\e937";
}

.icon--qrcode:before {
    content: "\e938";
}

.icon--ticket:before {
    content: "\e939";
}

.icon--cart:before {
    content: "\e93a";
}

.icon--coin-dollar:before {
    content: "\e93b";
}

.icon--coin-euro:before {
    content: "\e93c";
}

.icon--coin-pound:before {
    content: "\e93d";
}

.icon--coin-yen:before {
    content: "\e93e";
}

.icon--credit-card:before {
    content: "\e93f";
}

.icon--calculator:before {
    content: "\e940";
}

.icon--lifebuoy:before {
    content: "\e941";
}

.icon--phone:before {
    content: "\e942";
}

.icon--phone-hang-up:before {
    content: "\e943";
}

.icon--address-book:before {
    content: "\e944";
}

.icon--envelop:before {
    content: "\e945";
}

.icon--pushpin:before {
    content: "\e946";
}

.icon--location:before {
    content: "\e947";
}

.icon--location2:before {
    content: "\e948";
}

.icon--compass:before {
    content: "\e949";
}

.icon--compass2:before {
    content: "\e94a";
}

.icon--map:before {
    content: "\e94b";
}

.icon--map2:before {
    content: "\e94c";
}

.icon--history:before {
    content: "\e94d";
}

.icon--clock:before {
    content: "\e94e";
}

.icon--clock2:before {
    content: "\e94f";
}

.icon--alarm:before {
    content: "\e950";
}

.icon--bell:before {
    content: "\e951";
}

.icon--stopwatch:before {
    content: "\e952";
}

.icon--calendar:before {
    content: "\e953";
}

.icon--printer:before {
    content: "\e954";
}

.icon--keyboard:before {
    content: "\e955";
}

.icon--display:before {
    content: "\e956";
}

.icon--laptop:before {
    content: "\e957";
}

.icon--mobile:before {
    content: "\e958";
}

.icon--mobile2:before {
    content: "\e959";
}

.icon--tablet:before {
    content: "\e95a";
}

.icon--tv:before {
    content: "\e95b";
}

.icon--drawer:before {
    content: "\e95c";
}

.icon--drawer2:before {
    content: "\e95d";
}

.icon--box-add:before {
    content: "\e95e";
}

.icon--box-remove:before {
    content: "\e95f";
}

.icon--download:before {
    content: "\e960";
}

.icon--upload:before {
    content: "\e961";
}

.icon--floppy-disk:before {
    content: "\e962";
}

.icon--drive:before {
    content: "\e963";
}

.icon--database:before {
    content: "\e964";
}

.icon--undo:before {
    content: "\e965";
}

.icon--redo:before {
    content: "\e966";
}

.icon--undo2:before {
    content: "\e967";
}

.icon--redo2:before {
    content: "\e968";
}

.icon--forward:before {
    content: "\e969";
}

.icon--reply:before {
    content: "\e96a";
}

.icon--bubble:before {
    content: "\e96b";
}

.icon--bubbles:before {
    content: "\e96c";
}

.icon--bubbles2:before {
    content: "\e96d";
}

.icon--bubble2:before {
    content: "\e96e";
}

.icon--bubbles3:before {
    content: "\e96f";
}

.icon--bubbles4:before {
    content: "\e970";
}

.icon--user:before {
    content: "\e971";
}

.icon--users:before {
    content: "\e972";
}

.icon--user-plus:before {
    content: "\e973";
}

.icon--user-minus:before {
    content: "\e974";
}

.icon--user-check:before {
    content: "\e975";
}

.icon--user-tie:before {
    content: "\e976";
}

.icon--quotes-left:before {
    content: "\e977";
}

.icon--quotes-right:before {
    content: "\e978";
}

.icon--hour-glass:before {
    content: "\e979";
}

.icon--spinner:before {
    content: "\e97a";
}

.icon--spinner2:before {
    content: "\e97b";
}

.icon--spinner3:before {
    content: "\e97c";
}

.icon--spinner4:before {
    content: "\e97d";
}

.icon--spinner5:before {
    content: "\e97e";
}

.icon--spinner6:before {
    content: "\e97f";
}

.icon--spinner7:before {
    content: "\e980";
}

.icon--spinner8:before {
    content: "\e981";
}

.icon--spinner9:before {
    content: "\e982";
}

.icon--spinner10:before {
    content: "\e983";
}

.icon--spinner11:before {
    content: "\e984";
}

.icon--binoculars:before {
    content: "\e985";
}

.icon--search:before {
    content: "\e986";
}

.icon--zoom-in:before {
    content: "\e987";
}

.icon--zoom-out:before {
    content: "\e988";
}

.icon--enlarge:before {
    content: "\e989";
}

.icon--shrink:before {
    content: "\e98a";
}

.icon--enlarge2:before {
    content: "\e98b";
}

.icon--shrink2:before {
    content: "\e98c";
}

.icon--key:before {
    content: "\e98d";
}

.icon--key2:before {
    content: "\e98e";
}

.icon--lock:before {
    content: "\e98f";
}

.icon--unlocked:before {
    content: "\e990";
}

.icon--wrench:before {
    content: "\e991";
}

.icon--equalizer:before {
    content: "\e992";
}

.icon--equalizer2:before {
    content: "\e993";
}

.icon--cog:before {
    content: "\e994";
}

.icon--cogs:before {
    content: "\e995";
}

.icon--hammer:before {
    content: "\e996";
}

.icon--magic-wand:before {
    content: "\e997";
}

.icon--aid-kit:before {
    content: "\e998";
}

.icon--bug:before {
    content: "\e999";
}

.icon--pie-chart:before {
    content: "\e99a";
}

.icon--stats-dots:before {
    content: "\e99b";
}

.icon--stats-bars:before {
    content: "\e99c";
}

.icon--stats-bars2:before {
    content: "\e99d";
}

.icon--trophy:before {
    content: "\e99e";
}

.icon--gift:before {
    content: "\e99f";
}

.icon--glass:before {
    content: "\e9a0";
}

.icon--glass2:before {
    content: "\e9a1";
}

.icon--mug:before {
    content: "\e9a2";
}

.icon--spoon-knife:before {
    content: "\e9a3";
}

.icon--leaf:before {
    content: "\e9a4";
}

.icon--rocket:before {
    content: "\e9a5";
}

.icon--dashboard:before,
.icon--meter:before {
    content: "\e9a6";
}

.icon--dashboard2:before,
.icon--meter2:before {
    content: "\e9a7";
}

.icon--hammer2:before {
    content: "\e9a8";
}

.icon--fire:before {
    content: "\e9a9";
}

.icon--lab:before {
    content: "\e9aa";
}

.icon--magnet:before {
    content: "\e9ab";
}

.icon--bin:before {
    content: "\e9ac";
}

.icon--bin2:before {
    content: "\e9ad";
}

.icon--briefcase:before {
    content: "\e9ae";
}

.icon--airplane:before {
    content: "\e9af";
}

.icon--truck:before {
    content: "\e9b0";
}

.icon--road:before {
    content: "\e9b1";
}

.icon--accessibility:before {
    content: "\e9b2";
}

.icon--target:before {
    content: "\e9b3";
}

.icon--shield:before {
    content: "\e9b4";
}

.icon--power:before {
    content: "\e9b5";
}

.icon--switch:before {
    content: "\e9b6";
}

.icon--power-cord:before {
    content: "\e9b7";
}

.icon--clipboard:before {
    content: "\e9b8";
}

.icon--list-numbered:before {
    content: "\e9b9";
}

.icon--list:before {
    content: "\e9ba";
}

.icon--list2:before {
    content: "\e9bb";
}

.icon--tree:before {
    content: "\e9bc";
}

.icon--menu:before {
    content: "\e9bd";
}

.icon--menu2:before {
    content: "\e9be";
}

.icon--menu3:before {
    content: "\e9bf";
}

.icon--menu4:before {
    content: "\e9c0";
}

.icon--cloud:before {
    content: "\e9c1";
}

.icon--cloud-download:before {
    content: "\e9c2";
}

.icon--cloud-upload:before {
    content: "\e9c3";
}

.icon--cloud-check:before {
    content: "\e9c4";
}

.icon--download2:before {
    content: "\e9c5";
}

.icon--upload2:before {
    content: "\e9c6";
}

.icon--download3:before {
    content: "\e9c7";
}

.icon--upload3:before {
    content: "\e9c8";
}

.icon--sphere:before {
    content: "\e9c9";
}

.icon--earth:before {
    content: "\e9ca";
}

.icon--link:before {
    content: "\e9cb";
}

.icon--flag:before {
    content: "\e9cc";
}

.icon--attachment:before {
    content: "\e9cd";
}

.icon--eye:before {
    content: "\e9ce";
}

.icon--eye-plus:before {
    content: "\e9cf";
}

.icon--eye-minus:before {
    content: "\e9d0";
}

.icon--eye-blocked:before {
    content: "\e9d1";
}

.icon--bookmark:before {
    content: "\e9d2";
}

.icon--bookmarks:before {
    content: "\e9d3";
}

.icon--sun:before {
    content: "\e9d4";
}

.icon--contrast:before {
    content: "\e9d5";
}

.icon--brightness-contrast:before {
    content: "\e9d6";
}

.icon--star-empty:before {
    content: "\e9d7";
}

.icon--star-half:before {
    content: "\e9d8";
}

.icon--star-full:before {
    content: "\e9d9";
}

.icon--heart:before {
    content: "\e9da";
}

.icon--heart-broken:before {
    content: "\e9db";
}

.icon--man:before {
    content: "\e9dc";
}

.icon--woman:before {
    content: "\e9dd";
}

.icon--man-woman:before {
    content: "\e9de";
}

.icon--happy:before {
    content: "\e9df";
}

.icon--happy2:before {
    content: "\e9e0";
}

.icon--smile:before {
    content: "\e9e1";
}

.icon--smile2:before {
    content: "\e9e2";
}

.icon--tongue:before {
    content: "\e9e3";
}

.icon--tongue2:before {
    content: "\e9e4";
}

.icon--sad:before {
    content: "\e9e5";
}

.icon--sad2:before {
    content: "\e9e6";
}

.icon--wink:before {
    content: "\e9e7";
}

.icon--wink2:before {
    content: "\e9e8";
}

.icon--grin:before {
    content: "\e9e9";
}

.icon--grin2:before {
    content: "\e9ea";
}

.icon--cool:before {
    content: "\e9eb";
}

.icon--cool2:before {
    content: "\e9ec";
}

.icon--angry:before {
    content: "\e9ed";
}

.icon--angry2:before {
    content: "\e9ee";
}

.icon--evil:before {
    content: "\e9ef";
}

.icon--evil2:before {
    content: "\e9f0";
}

.icon--shocked:before {
    content: "\e9f1";
}

.icon--shocked2:before {
    content: "\e9f2";
}

.icon--baffled:before {
    content: "\e9f3";
}

.icon--baffled2:before {
    content: "\e9f4";
}

.icon--confused:before {
    content: "\e9f5";
}

.icon--confused2:before {
    content: "\e9f6";
}

.icon--neutral:before {
    content: "\e9f7";
}

.icon--neutral2:before {
    content: "\e9f8";
}

.icon--hipster:before {
    content: "\e9f9";
}

.icon--hipster2:before {
    content: "\e9fa";
}

.icon--wondering:before {
    content: "\e9fb";
}

.icon--wondering2:before {
    content: "\e9fc";
}

.icon--sleepy:before {
    content: "\e9fd";
}

.icon--sleepy2:before {
    content: "\e9fe";
}

.icon--frustrated:before {
    content: "\e9ff";
}

.icon--frustrated2:before {
    content: "\ea00";
}

.icon--crying:before {
    content: "\ea01";
}

.icon--crying2:before {
    content: "\ea02";
}

.icon--point-up:before {
    content: "\ea03";
}

.icon--point-right:before {
    content: "\ea04";
}

.icon--point-down:before {
    content: "\ea05";
}

.icon--point-left:before {
    content: "\ea06";
}

.icon--warning:before {
    content: "\ea07";
}

.icon--notification:before {
    content: "\ea08";
}

.icon--question:before {
    content: "\ea09";
}

.icon--plus:before {
    content: "\ea0a";
}

.icon--minus:before {
    content: "\ea0b";
}

.icon--info:before {
    content: "\ea0c";
}

.icon--cancel-circle:before {
    content: "\ea0d";
}

.icon--blocked:before {
    content: "\ea0e";
}

.icon--cross:before {
    content: "\ea0f";
}

.icon--checkmark:before {
    content: "\ea10";
}

.icon--checkmark2:before {
    content: "\ea11";
}

.icon--spell-check:before {
    content: "\ea12";
}

.icon--enter:before {
    content: "\ea13";
}

.icon--exit:before {
    content: "\ea14";
}

.icon--play2:before {
    content: "\ea15";
}

.icon--pause:before {
    content: "\ea16";
}

.icon--stop:before {
    content: "\ea17";
}

.icon--previous:before {
    content: "\ea18";
}

.icon--next:before {
    content: "\ea19";
}

.icon--backward:before {
    content: "\ea1a";
}

.icon--forward2:before {
    content: "\ea1b";
}

.icon--play3:before {
    content: "\ea1c";
}

.icon--pause2:before {
    content: "\ea1d";
}

.icon--stop2:before {
    content: "\ea1e";
}

.icon--backward2:before {
    content: "\ea1f";
}

.icon--forward3:before {
    content: "\ea20";
}

.icon--first:before {
    content: "\ea21";
}

.icon--last:before {
    content: "\ea22";
}

.icon--previous2:before {
    content: "\ea23";
}

.icon--next2:before {
    content: "\ea24";
}

.icon--eject:before {
    content: "\ea25";
}

.icon--volume-high:before {
    content: "\ea26";
}

.icon--volume-medium:before {
    content: "\ea27";
}

.icon--volume-low:before {
    content: "\ea28";
}

.icon--volume-mute:before {
    content: "\ea29";
}

.icon--volume-mute2:before {
    content: "\ea2a";
}

.icon--volume-increase:before {
    content: "\ea2b";
}

.icon--volume-decrease:before {
    content: "\ea2c";
}

.icon--loop:before {
    content: "\ea2d";
}

.icon--loop2:before {
    content: "\ea2e";
}

.icon--infinite:before {
    content: "\ea2f";
}

.icon--shuffle:before {
    content: "\ea30";
}

.icon--arrow-up-left:before {
    content: "\ea31";
}

.icon--arrow-up:before {
    content: "\ea32";
}

.icon--arrow-up-right:before {
    content: "\ea33";
}

.icon--arrow-right:before {
    content: "\ea34";
}

.icon--arrow-down-right:before {
    content: "\ea35";
}

.icon--arrow-down:before {
    content: "\ea36";
}

.icon--arrow-down-left:before {
    content: "\ea37";
}

.icon--arrow-left:before {
    content: "\ea38";
}

.icon--arrow-up-left2:before {
    content: "\ea39";
}

.icon--arrow-up2:before {
    content: "\ea3a";
}

.icon--arrow-up-right2:before {
    content: "\ea3b";
}

.icon--arrow-right2:before {
    content: "\ea3c";
}

.icon--arrow-down-right2:before {
    content: "\ea3d";
}

.icon--arrow-down2:before {
    content: "\ea3e";
}

.icon--arrow-down-left2:before {
    content: "\ea3f";
}

.icon--arrow-left2:before {
    content: "\ea40";
}

.icon--circle-up:before {
    content: "\ea41";
}

.icon--circle-right:before {
    content: "\ea42";
}

.icon--circle-down:before {
    content: "\ea43";
}

.icon--circle-left:before {
    content: "\ea44";
}

.icon--tab:before {
    content: "\ea45";
}

.icon--move-up:before {
    content: "\ea46";
}

.icon--move-down:before {
    content: "\ea47";
}

.icon--sort-alpha-asc:before {
    content: "\ea48";
}

.icon--sort-alpha-desc:before {
    content: "\ea49";
}

.icon--sort-numeric-asc:before {
    content: "\ea4a";
}

.icon--sort-numberic-desc:before {
    content: "\ea4b";
}

.icon--sort-amount-asc:before {
    content: "\ea4c";
}

.icon--sort-amount-desc:before {
    content: "\ea4d";
}

.icon--command:before {
    content: "\ea4e";
}

.icon--shift:before {
    content: "\ea4f";
}

.icon--ctrl:before {
    content: "\ea50";
}

.icon--opt:before {
    content: "\ea51";
}

.icon--checkbox-checked:before {
    content: "\ea52";
}

.icon--checkbox-unchecked:before {
    content: "\ea53";
}

.icon--radio-checked:before {
    content: "\ea54";
}

.icon--radio-checked2:before {
    content: "\ea55";
}

.icon--radio-unchecked:before {
    content: "\ea56";
}

.icon--crop:before {
    content: "\ea57";
}

.icon--make-group:before {
    content: "\ea58";
}

.icon--ungroup:before {
    content: "\ea59";
}

.icon--scissors:before {
    content: "\ea5a";
}

.icon--filter:before {
    content: "\ea5b";
}

.icon--font:before {
    content: "\ea5c";
}

.icon--ligature:before {
    content: "\ea5d";
}

.icon--ligature2:before {
    content: "\ea5e";
}

.icon--text-height:before {
    content: "\ea5f";
}

.icon--text-width:before {
    content: "\ea60";
}

.icon--font-size:before {
    content: "\ea61";
}

.icon--bold:before {
    content: "\ea62";
}

.icon--underline:before {
    content: "\ea63";
}

.icon--italic:before {
    content: "\ea64";
}

.icon--strikethrough:before {
    content: "\ea65";
}

.icon--omega:before {
    content: "\ea66";
}

.icon--sigma:before {
    content: "\ea67";
}

.icon--page-break:before {
    content: "\ea68";
}

.icon--superscript:before {
    content: "\ea69";
}

.icon--subscript:before {
    content: "\ea6a";
}

.icon--superscript2:before {
    content: "\ea6b";
}

.icon--subscript2:before {
    content: "\ea6c";
}

.icon--text-color:before {
    content: "\ea6d";
}

.icon--pagebreak:before {
    content: "\ea6e";
}

.icon--clear-formatting:before {
    content: "\ea6f";
}

.icon--table:before {
    content: "\ea70";
}

.icon--table2:before {
    content: "\ea71";
}

.icon--insert-template:before {
    content: "\ea72";
}

.icon--pilcrow:before {
    content: "\ea73";
}

.icon--ltr:before {
    content: "\ea74";
}

.icon--rtl:before {
    content: "\ea75";
}

.icon--section:before {
    content: "\ea76";
}

.icon--paragraph-left:before {
    content: "\ea77";
}

.icon--paragraph-center:before {
    content: "\ea78";
}

.icon--paragraph-right:before {
    content: "\ea79";
}

.icon--paragraph-justify:before {
    content: "\ea7a";
}

.icon--indent-increase:before {
    content: "\ea7b";
}

.icon--indent-decrease:before {
    content: "\ea7c";
}

.icon--share:before {
    content: "\ea7d";
}

.icon--new-tab:before {
    content: "\ea7e";
}

.icon--embed:before {
    content: "\ea7f";
}

.icon--embed2:before {
    content: "\ea80";
}

.icon--terminal:before {
    content: "\ea81";
}

.icon--share2:before {
    content: "\ea82";
}

.icon--mail:before {
    content: "\ea83";
}

.icon--mail2:before {
    content: "\ea84";
}

.icon--mail3:before {
    content: "\ea85";
}

.icon--mail4:before {
    content: "\ea86";
}

.icon--amazon:before {
    content: "\ea87";
}

.icon--google:before {
    content: "\ea88";
}

.icon--google2:before {
    content: "\ea89";
}

.icon--google3:before {
    content: "\ea8a";
}

.icon--google-plus:before {
    content: "\ea8b";
}

.icon--google-plus2:before {
    content: "\ea8c";
}

.icon--google-plus3:before {
    content: "\ea8d";
}

.icon--hangouts:before {
    content: "\ea8e";
}

.icon--google-drive:before {
    content: "\ea8f";
}

.icon--facebook:before {
    content: "\ea90";
}

.icon--facebook2:before {
    content: "\ea91";
}

.icon--instagram:before {
    content: "\ea92";
}

.icon--whatsapp:before {
    content: "\ea93";
}

.icon--spotify:before {
    content: "\ea94";
}

.icon--telegram:before {
    content: "\ea95";
}

.icon--twitter:before {
    content: "\ea96";
}

.icon--vine:before {
    content: "\ea97";
}

.icon--vk:before {
    content: "\ea98";
}

.icon--renren:before {
    content: "\ea99";
}

.icon--sina-weibo:before {
    content: "\ea9a";
}

.icon--rss:before {
    content: "\ea9b";
}

.icon--rss2:before {
    content: "\ea9c";
}

.icon--youtube:before {
    content: "\ea9d";
}

.icon--youtube2:before {
    content: "\ea9e";
}

.icon--twitch:before {
    content: "\ea9f";
}

.icon--vimeo:before {
    content: "\eaa0";
}

.icon--vimeo2:before {
    content: "\eaa1";
}

.icon--lanyrd:before {
    content: "\eaa2";
}

.icon--flickr:before {
    content: "\eaa3";
}

.icon--flickr2:before {
    content: "\eaa4";
}

.icon--flickr3:before {
    content: "\eaa5";
}

.icon--flickr4:before {
    content: "\eaa6";
}

.icon--dribbble:before {
    content: "\eaa7";
}

.icon--behance:before {
    content: "\eaa8";
}

.icon--behance2:before {
    content: "\eaa9";
}

.icon--deviantart:before {
    content: "\eaaa";
}

.icon--500px:before {
    content: "\eaab";
}

.icon--steam:before {
    content: "\eaac";
}

.icon--steam2:before {
    content: "\eaad";
}

.icon--dropbox:before {
    content: "\eaae";
}

.icon--onedrive:before {
    content: "\eaaf";
}

.icon--github:before {
    content: "\eab0";
}

.icon--npm:before {
    content: "\eab1";
}

.icon--basecamp:before {
    content: "\eab2";
}

.icon--trello:before {
    content: "\eab3";
}

.icon--wordpress:before {
    content: "\eab4";
}

.icon--joomla:before {
    content: "\eab5";
}

.icon--ello:before {
    content: "\eab6";
}

.icon--blogger:before {
    content: "\eab7";
}

.icon--blogger2:before {
    content: "\eab8";
}

.icon--tumblr:before {
    content: "\eab9";
}

.icon--tumblr2:before {
    content: "\eaba";
}

.icon--yahoo:before {
    content: "\eabb";
}

.icon--yahoo2:before {
    content: "\eabc";
}

.icon--tux:before {
    content: "\eabd";
}

.icon--appleinc:before {
    content: "\eabe";
}

.icon--finder:before {
    content: "\eabf";
}

.icon--android:before {
    content: "\eac0";
}

.icon--windows:before {
    content: "\eac1";
}

.icon--windows8:before {
    content: "\eac2";
}

.icon--soundcloud:before {
    content: "\eac3";
}

.icon--soundcloud2:before {
    content: "\eac4";
}

.icon--skype:before {
    content: "\eac5";
}

.icon--reddit:before {
    content: "\eac6";
}

.icon--hackernews:before {
    content: "\eac7";
}

.icon--wikipedia:before {
    content: "\eac8";
}

.icon--linkedin:before {
    content: "\eac9";
}

.icon--linkedin2:before {
    content: "\eaca";
}

.icon--lastfm:before {
    content: "\eacb";
}

.icon--lastfm2:before {
    content: "\eacc";
}

.icon--delicious:before {
    content: "\eacd";
}

.icon--stumbleupon:before {
    content: "\eace";
}

.icon--stumbleupon2:before {
    content: "\eacf";
}

.icon--stackoverflow:before {
    content: "\ead0";
}

.icon--pinterest:before {
    content: "\ead1";
}

.icon--pinterest2:before {
    content: "\ead2";
}

.icon--xing:before {
    content: "\ead3";
}

.icon--xing2:before {
    content: "\ead4";
}

.icon--flattr:before {
    content: "\ead5";
}

.icon--foursquare:before {
    content: "\ead6";
}

.icon--yelp:before {
    content: "\ead7";
}

.icon--paypal:before {
    content: "\ead8";
}

.icon--chrome:before {
    content: "\ead9";
}

.icon--firefox:before {
    content: "\eada";
}

.icon--IE:before {
    content: "\eadb";
}

.icon--edge:before {
    content: "\eadc";
}

.icon--safari:before {
    content: "\eadd";
}

.icon--opera:before {
    content: "\eade";
}

.icon--file-pdf:before {
    content: "\eadf";
}

.icon--file-openoffice:before {
    content: "\eae0";
}

.icon--file-word:before {
    content: "\eae1";
}

.icon--file-excel:before {
    content: "\eae2";
}

.icon--libreoffice:before {
    content: "\eae3";
}

.icon--html-five:before {
    content: "\eae4";
}

.icon--html-five2:before {
    content: "\eae5";
}

.icon--css3:before {
    content: "\eae6";
}

.icon--git:before {
    content: "\eae7";
}

.icon--codepen:before {
    content: "\eae8";
}

.icon--svg:before {
    content: "\eae9";
}

.icon--IcoMoon:before {
    content: "\eaea";
}

.icon--uni21:before {
    content: "\21";
}

.icon--uni22:before {
    content: "\22";
}

.icon--uni23:before {
    content: "\23";
}

.icon--uni24:before {
    content: "\24";
}

.icon--uni25:before {
    content: "\25";
}

.icon--uni26:before {
    content: "\26";
}

.icon--uni27:before {
    content: "\27";
}

.icon--uni28:before {
    content: "\28";
}

.icon--uni29:before {
    content: "\29";
}

.icon--uni2A:before {
    content: "\2a";
}

.icon--uni2B:before {
    content: "\2b";
}

.icon--uni2C:before {
    content: "\2c";
}

.icon--uni2D:before {
    content: "\2d";
}

.icon--uni2E:before {
    content: "\2e";
}

.icon--uni2F:before {
    content: "\2f";
}

.icon--uni30:before {
    content: "\30";
}

.icon--uni31:before {
    content: "\31";
}

.icon--uni32:before {
    content: "\32";
}

.icon--uni33:before {
    content: "\33";
}

.icon--uni34:before {
    content: "\34";
}

.icon--uni35:before {
    content: "\35";
}

.icon--uni36:before {
    content: "\36";
}

.icon--uni37:before {
    content: "\37";
}

.icon--uni38:before {
    content: "\38";
}

.icon--uni39:before {
    content: "\39";
}

.icon--uni3A:before {
    content: "\3a";
}

.icon--uni3B:before {
    content: "\3b";
}

.icon--uni3C:before {
    content: "\3c";
}

.icon--uni3D:before {
    content: "\3d";
}

.icon--uni3E:before {
    content: "\3e";
}

.icon--uni3F:before {
    content: "\3f";
}

.icon--uni40:before {
    content: "\40";
}

.icon--uni41:before {
    content: "\41";
}

.icon--uni42:before {
    content: "\42";
}

.icon--uni43:before {
    content: "\43";
}

.icon--uni44:before {
    content: "\44";
}

.icon--uni45:before {
    content: "\45";
}

.icon--uni46:before {
    content: "\46";
}

.icon--uni47:before {
    content: "\47";
}

.icon--uni48:before {
    content: "\48";
}

.icon--uni49:before {
    content: "\49";
}

.icon--uni4A:before {
    content: "\4a";
}

.icon--uni4B:before {
    content: "\4b";
}

.icon--uni4C:before {
    content: "\4c";
}

.icon--uni4D:before {
    content: "\4d";
}

.icon--uni4E:before {
    content: "\4e";
}

.icon--uni4F:before {
    content: "\4f";
}

.icon--uni50:before {
    content: "\50";
}

.icon--uni51:before {
    content: "\51";
}

.icon--uni52:before {
    content: "\52";
}

.icon--uni53:before {
    content: "\53";
}

.icon--uni54:before {
    content: "\54";
}

.icon--uni55:before {
    content: "\55";
}

.icon--uni56:before {
    content: "\56";
}

.icon--uni57:before {
    content: "\57";
}

.icon--uni58:before {
    content: "\58";
}

.icon--uni59:before {
    content: "\59";
}

.icon--uni5A:before {
    content: "\5a";
}

.icon--uni5B:before {
    content: "\5b";
}

.icon--uni5C:before {
    content: "\5c";
}

.icon--uni5D:before {
    content: "\5d";
}

.icon--uni5E:before {
    content: "\5e";
}

.icon--uni5F:before {
    content: "\5f";
}

.icon--uni60:before {
    content: "\60";
}

.icon--uni61:before {
    content: "\61";
}

.icon--uni62:before {
    content: "\62";
}

.icon--uni63:before {
    content: "\63";
}

.icon--uni64:before {
    content: "\64";
}

.icon--uni65:before {
    content: "\65";
}

.icon--uni66:before {
    content: "\66";
}

.icon--uni67:before {
    content: "\67";
}

.icon--uni68:before {
    content: "\68";
}

.icon--uni69:before {
    content: "\69";
}

.icon--uni6A:before {
    content: "\6a";
}

.icon--uni6B:before {
    content: "\6b";
}

.icon--uni6C:before {
    content: "\6c";
}

.icon--uni6D:before {
    content: "\6d";
}

.icon--uni6E:before {
    content: "\6e";
}

.icon--uni6F:before {
    content: "\6f";
}

.icon--uni70:before {
    content: "\70";
}

.icon--uni71:before {
    content: "\71";
}

.icon--uni72:before {
    content: "\72";
}

.icon--uni73:before {
    content: "\73";
}

.icon--uni74:before {
    content: "\74";
}

.icon--uni75:before {
    content: "\75";
}

.icon--uni76:before {
    content: "\76";
}

.icon--uni77:before {
    content: "\77";
}

.icon--uni78:before {
    content: "\78";
}

.icon--uni79:before {
    content: "\79";
}

.icon--uni7A:before {
    content: "\7a";
}

.icon--uni7B:before {
    content: "\7b";
}

.icon--uni7C:before {
    content: "\7c";
}

.icon--uni7D:before {
    content: "\7d";
}

.icon--uni7E:before {
    content: "\7e";
}

.icon--uniA9:before {
    content: "\a9";
}

/* ===========================================================

	$LISTS (v2 2018)

=========================================================== */
/* ---- UNORDERED LIST  ---- */
MAIN UL {
    display: block;
    padding: 0 0 0 40px;
    margin: 0 0 40px;
}

    MAIN UL LI {
        display: list-item;
        padding: 0;
        margin: 0 0 4px 0;
    }

    MAIN UL > LI {
        list-style: disc;
    }

        MAIN UL > LI > UL {
            margin: 10px 0 0;
        }

            MAIN UL > LI > UL > LI {
                margin: 0 0 4px 0;
                list-style: circle;
            }

        /* -- With ordered list inside -- */
        MAIN UL > LI OL {
            margin: 10px 0 0;
        }

            MAIN UL > LI OL LI {
                margin: 0 0 4px 0;
                list-style: decimal;
            }

/* ---- ORDERED LIST  ---- */
MAIN OL {
    display: block;
    padding: 0 0 0 40px;
    margin: 0 0 40px;
}

    MAIN OL LI {
        display: list-item;
        padding: 0;
        margin: 0 0 4px 0;
    }

    MAIN OL > LI {
        list-style: decimal;
    }

        MAIN OL > LI > OL {
            margin: 10px 0 0;
        }

            MAIN OL > LI > OL > LI {
                margin: 0 0 4px 0;
                list-style: lower-roman;
            }

        /* -- With unordered list inside -- */
        MAIN OL > LI UL {
            margin: 10px 0 0;
        }

            MAIN OL > LI UL LI {
                margin: 0 0 4px 0;
                list-style: disc;
            }

/* ---- DESCRIPTION LIST ---- */
/* Initial style */
MAIN DL {
    display: block;
    margin: 0 0 20px;
}

    MAIN DL DT {
        font-weight: 700;
        margin-bottom: 8px;
    }

    MAIN DL DD {
        margin-bottom: 10px;
    }

    MAIN DL.lined-up DT {
        display: block;
        float: left;
        min-width: 100px;
        margin-right: 4px;
    }

        MAIN DL.lined-up DT:after {
            content: ' : ';
        }

    MAIN DL.lined-up DD {
        display: block;
        overflow: hidden;
    }

    MAIN DL.flex {
        display: -webkit-box;
        /* OLD - iOS 6-, Safari 3.1-6 */
        display: -moz-box;
        /* OLD - Firefox 19- */
        display: -ms-flexbox;
        /* OLD - TWEENER - IE 10 */
        display: -webkit-flex;
        /* RECENT - Chrome */
        display: flex;
        /* NEW - Firefox, Chrome, Opera, IE11 */
        -webkit-flex-direction: row;
        -moz-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-justify-content: flex-start;
        justify-content: flex-start;
        -webkit-align-items: flex-start;
        align-items: flex-start;
        -webkit-align-content: flex-start;
        align-content: flex-start;
    }

        MAIN DL.flex DT {
            -webkit-box-flex: 1 1 30%;
            -webkit-flex: 1 1 30%;
            -moz-flex: 1 1 30%;
            -ms-flex: 1 1 30%;
            flex: 1 1 30%;
            font-size: 1.28rem;
            font-weight: 400;
        }

            MAIN DL.flex DT:after {
                content: ' : ';
            }

        MAIN DL.flex DD {
            -webkit-box-flex: 1 1 70%;
            -webkit-flex: 1 1 70%;
            -moz-flex: 1 1 70%;
            -ms-flex: 1 1 70%;
            flex: 1 1 70%;
        }

/* ---- BULLET LIST ---- */
UL.bullet-list {
    padding-left: 0;
    margin-bottom: 48px;
    margin-left: 32px;
}

    UL.bullet-list > LI {
        position: relative;
        list-style: none;
        margin-left: 0;
        margin-bottom: 8px;
        font-size: 1.38rem;
        line-height: 1.9rem;
        color: #414E54;
    }

        UL.bullet-list > LI:last-of-type {
            margin-bottom: 0;
        }

        UL.bullet-list > LI:before {
            content: '\2022';
            position: absolute;
            left: -30px;
            line-height: 1.9;
            font-size: 1rem;
            color: #0C2340;
        }

    UL.bullet-list UL {
        margin-top: 10px;
        font-size: inherit;
        line-height: inherit;
    }

    UL.bullet-list > LI LI {
        position: relative;
        list-style: none;
        margin-bottom: 8px;
        font-size: inherit;
        line-height: inherit;
        color: #414E54;
    }

        UL.bullet-list > LI LI:before {
            content: '\2022';
            position: absolute;
            left: -30px;
            line-height: 1.9;
            font-size: 1rem;
            color: #FBE122;
        }

    /* ---- Bullet List Alt-Style ---- */
    UL.bullet-list.bullet-list--alt > LI:before,
    UL.bullet-list LI SPAN {
        color: #FBE122;
    }

    /* ---- Bullet List blue-title-Style ---- */
    UL.bullet-list.blue > LI {
        font-family: 'Invention', sans-serif;
        font-size: 16px;
        font-weight: 600;
        line-height: 1.9rem;
        color: #0C2340;
        text-transform: uppercase;
    }

/* ---- IMAGE LIST ---- */
UL.image-list {
    display: block;
    padding: 0;
    list-style: none;
    -webkit-column-count: 2;
    -moz-column-count: 2;
    column-count: 2;
    -webkit-column-gap: 20px;
    -moz-column-gap: 20px;
    column-gap: 20px;
}

.image-list__item {
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- */
    display: -ms-flexbox;
    /* OLD - TWEENER - IE 10 */
    display: -webkit-flex;
    /* RECENT - Chrome */
    display: flex;
    /* NEW - Firefox, Chrome, Opera, IE11 */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    -webkit-align-items: flex-start;
    align-items: flex-start;
    -webkit-align-content: flex-start;
    align-content: flex-start;
    min-height: 72px;
    padding: 16px;
}

.image-list__viewport {
    -webkit-box-flex: 0 0 72px;
    -webkit-flex: 0 0 72px;
    -moz-flex: 0 0 72px;
    -ms-flex: 0 0 72px;
    flex: 0 0 72px;
    position: relative;
    width: auto;
    height: 72px;
    border-radius: 50% 50%;
    background-color: #F5F6FA;
}

.image-list__image {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    /* Chrome, Safari 8+, Opera 15.0+ */
    -webkit-transform: -webkit-translate(-50%, -50%);
    /* Safari 7 */
    -moz-transform: translate(-50%, -50%);
    /* Firefox */
    -ms-transform: translate(-50%, -50%);
    /* IE 9 */
    -o-transform: translate(-50%, -50%);
    /* Opera 10.5 - 15.0 */
    transform: translate(-50%, -50%);
    width: auto;
    height: 48px;
    -webkit-transition: opacity 0.4s ease;
    -moz-transition: opacity 0.4s ease;
    -ms-transition: opacity 0.4s ease;
    -o-transition: opacity 0.4s ease;
    transition: opacity 0.4s ease;
}

    .image-list__image:hover {
        opacity: 0.5;
    }

.image-list__text {
    -webkit-box-flex: 1 1 auto;
    -webkit-flex: 1 1 auto;
    -moz-flex: 1 1 auto;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    padding: 16px 0 0 16px;
    overflow: hidden;
}

.image-list__link:after {
    content: "\0020 \203A";
    font-size: 130%;
}

/* ---- ICON LIST ---- */
UL.icon-list {
    display: block;
    padding: 0;
    margin: 0;
    list-style: none;
    color: #414E54;
}

.icon-list__item {
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- */
    display: -ms-flexbox;
    /* OLD - TWEENER - IE 10 */
    display: -webkit-flex;
    /* RECENT - Chrome */
    display: flex;
    /* NEW - Firefox, Chrome, Opera, IE11 */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    -webkit-align-items: flex-start;
    align-items: flex-start;
    -webkit-align-content: flex-start;
    align-content: flex-start;
    padding: 0;
    margin: 0 0 10px;
}

.icon-list__icon {
    -webkit-box-flex: 0 0 32px;
    -webkit-flex: 0 0 32px;
    -moz-flex: 0 0 32px;
    -ms-flex: 0 0 32px;
    flex: 0 0 32px;
    height: 32px;
    font-family: "IcoMoon Basic";
    color: #FBE122;
}

.icon-list__text {
    -webkit-box-flex: 0 1 auto;
    -webkit-flex: 0 1 auto;
    -moz-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    padding-left: 16px;
    overflow: hidden;
}

/* ---- SUPPORT LIST ---- */
.support {
    -webkit-box-flex: 1 0 66.66%;
    -webkit-flex: 1 0 66.66%;
    -moz-flex: 1 0 66.66%;
    -ms-flex: 1 0 66.66%;
    flex: 1 0 66.66%;
    font-size: 0.9rem;
    text-align: right;
}

.support__caption {
    display: inline-block;
    margin-right: 10px;
    font-size: inherit;
}

    .support__caption:after {
        content: ' : ';
    }

.support__list {
    display: inline-block;
    clear: both;
    padding: 0;
    margin: 0;
    font-size: inherit;
}

    .support__list LI {
        display: inline-block;
        margin-right: 10px;
        list-style: none;
        font-size: inherit;
    }

        .support__list LI:last-of-type {
            margin-right: 0;
        }

        .support__list LI.ie-colour {
            color: #3094cf;
        }

        .support__list LI.firefox-colour {
            color: #5f290c;
        }

        .support__list LI.chrome-colour {
            color: #b4b4b4;
        }

        .support__list LI.safari-colour {
            color: #02423e;
        }

        .support__list LI.opera-colour {
            color: #4f0d10;
        }

/* ============================================================== MEDIA QUERIES ============================================================== */
/* ---- ALL DESKTOP (1440px +) ---- */
@media only screen and (min-width: 1440px) {
    /* ---- Bullet List ---- */
    /*UL.bullet-list 									    {margin-bottom:$spaceSize-large; margin-left:$spaceSize-lesser;}
    UL.bullet-list > LI 				                {margin-bottom:$spaceSize-minor; font-size:$baseSize + 0.1rem;}
    UL.bullet-list > LI:before			                {left:-13px; line-height:1.6; font-size:$eta;}

    UL.bullet-list UL 					                {margin-top:$spaceSize-minor;}
    UL.bullet-list > LI LI 							    {margin-bottom:$spaceSize-lesser;}
    UL.bullet-list > LI LI:before					    {line-height:1; font-size:$eta;}*/
}

/* ---- LAPTOP & DESKTOP (1280px +) ---- */
@media only screen and (min-width: 1280px) {
    /* ---- IMAGE LIST ---- */
    /*.image-list__img                                    {max-width:180px;}*/
}

/* ---- LARGE TABLET & DESKTOP (960px +) ---- */
/* ---- MOBILE & SMALL TABLET (0 - 959px) ---- */
@media only screen and (max-width: 959px) {
    /* ---- UNORDERED LIST  ---- */
    MAIN UL,
    MAIN OL {
        padding-left: 24px;
    }
    /* ---- DESCRIPTION LIST ---- */
    MAIN DL DT,
    MAIN DL DD {
        margin-bottom: 6px;
    }

    MAIN DL.flex DT {
        -webkit-box-flex: 1 1 30%;
        -webkit-flex: 1 1 30%;
        -moz-flex: 1 1 30%;
        -ms-flex: 1 1 30%;
        flex: 1 1 30%;
        font-size: 1.28rem;
    }

    MAIN DL.flex DD {
        -webkit-box-flex: 1 1 70%;
        -webkit-flex: 1 1 70%;
        -moz-flex: 1 1 70%;
        -ms-flex: 1 1 70%;
        flex: 1 1 70%;
    }
    /* ---- BULLET LIST ---- */
    UL.bullet-list {
        margin-bottom: 24px;
    }

        UL.bullet-list LI {
            margin-bottom: 6px;
        }
    /* ---- IMAGE LIST ---- */
    UL.image-list {
        display: block;
        padding: 0;
        -webkit-column-count: 1;
        -moz-column-count: 1;
        column-count: 1;
        -webkit-column-gap: 0;
        -moz-column-gap: 0;
        column-gap: 0;
    }

    .image-list__item {
        padding: 16px 0;
    }
}

/* ---- MOBILE (0 - 479px) ---- */
/* ===========================================================

	$TABS & TABBED AREAS (2019)

    NOTE: These styles mainly control standard tabs, styling for Kendo-based
    tabs can be found in these files: 
    sass/base/overrides.scss & sass/themes/[themeName]/[themeName]-overrides.scss

=========================================================== */
/* ---- TAB PANELS ---- */
.tab-panel {
    clear: both;
    width: auto;
    margin-bottom: 20px;
}

    .tab-panel.tab-panel--no-bottom-margin,
    .nested-tab-panel.tab-panel--no-bottom-margin {
        margin-bottom: 0;
    }

.tab-panel__tab-strip {
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- */
    display: -ms-flexbox;
    /* OLD - TWEENER - IE 10 */
    display: -webkit-flex;
    /* RECENT - Chrome */
    display: flex;
    /* NEW - Firefox, Chrome, Opera, IE11 */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: stretch;
    justify-content: stretch;
    -webkit-align-items: flex-end;
    align-items: flex-end;
    -webkit-align-content: flex-start;
    align-content: flex-start;
    clear: both;
    width: auto;
}

.tab-panel__tab {
    -webkit-box-flex: 0 1 auto;
    -webkit-flex: 0 1 auto;
    -moz-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    height: auto;
    padding: 10px 24px;
    margin: 0 0 3px 3px;
    color: #414E54;
    font-family: 'Invention', sans-serif;
    font-size: 1.28rem;
    text-transform: uppercase;
    -webkit-transition: background-color 0.4s ease, color 0.4s ease;
    -moz-transition: background-color 0.4s ease, color 0.4s ease;
    -ms-transition: background-color 0.4s ease, color 0.4s ease;
    -o-transition: background-color 0.4s ease, color 0.4s ease;
    transition: background-color 0.4s ease, color 0.4s ease;
}

    .tab-panel__tab:first-of-type {
        margin-left: 0;
    }

    .tab-panel__tab.active {
        position: relative;
        top: 4px;
        border: 1px solid #d3d7e9;
        border-bottom: 0;
        background-color: #F5F6FA;
        color: #414E54;
    }

        .tab-panel__tab.active:first-of-type {
            margin-left: 0;
        }

    .tab-panel__tab.inactive {
        position: relative;
        top: 0;
        padding: 8px 16px;
        border: 1px solid #0C2340;
        border-bottom: 0;
        background-color: #0C2340;
        color: #FFF;
    }

        .tab-panel__tab.inactive:hover {
            border: 1px solid #040c15;
            background-color: #040c15;
        }

        .tab-panel__tab.inactive:first-of-type {
            margin-left: 0;
        }

/* ---- TAB PANEL BODY ---- */
.tab-panel__body-wrap {
    clear: both;
    width: auto;
    padding: 32px 24px;
    border: 1px solid #ececec;
    border-top: 0;
    background-color: #F5F6FA;
}

    .tab-panel__body-wrap.tab-panel__body-wrap--grid {
        padding: 0;
    }

.tab-panel__body {
    -webkit-transition: opacity 0.4s ease;
    -moz-transition: opacity 0.4s ease;
    -ms-transition: opacity 0.4s ease;
    -o-transition: opacity 0.4s ease;
    transition: opacity 0.4s ease;
}

    .tab-panel__body.active {
        display: block;
        opacity: 1;
    }

    .tab-panel__body.inactive {
        display: none;
        opacity: 0;
    }

/* ---- TAB PANEL HEADER ---- */
HEADER.tab-panel__header {
    position: relative;
    border-bottom: 1px solid #d9d9d9;
}

    HEADER.tab-panel__header .tab-switch-container {
        position: absolute;
        top: 20px;
        right: 20px;
        white-space: nowrap;
    }

    HEADER.tab-panel__header .header-col:nth-child(1) {
        text-align: left;
    }

    HEADER.tab-panel__header .header-col:nth-child(2) {
        text-align: left;
    }

    HEADER.tab-panel__header .header-col:nth-child(3) {
        text-align: left;
    }

H3.tab-panel__title {
    font-size: 1.504rem;
    font-weight: 700;
    line-height: 0.9;
    margin-bottom: 0;
    font-family: 'Invention', sans-serif;
    color: #1b1b1b;
    text-transform: uppercase;
}

/* ---- TAB SWITCH ---- */
.tab-switch-container {
    position: relative;
    min-height: 24px;
    padding: 0 20px;
    text-align: right;
}

    .tab-switch-container .tab-switch {
        position: absolute;
        z-index: 910;
        top: 2px;
        right: 24px;
    }

.tab-switch__note {
    display: inline-block;
    margin-right: 4px;
    vertical-align: top;
    font-size: 1.28rem;
}

/* ---- TAB PANEL CONTENT ---- */
.tab-panel__content {
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- */
    display: -ms-flexbox;
    /* OLD - TWEENER - IE 10 */
    display: -webkit-flex;
    /* RECENT - Chrome */
    display: flex;
    /* NEW - Firefox, Chrome, Opera, IE11 */
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    -webkit-align-items: stretch;
    align-items: stretch;
    -webkit-align-content: flex-start;
    align-content: flex-start;
}

    .tab-panel__content > FORM {
        -webkit-box-flex: 0 1 auto;
        -webkit-flex: 0 1 auto;
        -moz-flex: 0 1 auto;
        -ms-flex: 0 1 auto;
        flex: 0 1 auto;
        width: 100%;
        display: -webkit-box;
        /* OLD - iOS 6-, Safari 3.1-6 */
        display: -moz-box;
        /* OLD - Firefox 19- */
        display: -ms-flexbox;
        /* OLD - TWEENER - IE 10 */
        display: -webkit-flex;
        /* RECENT - Chrome */
        display: flex;
        /* NEW - Firefox, Chrome, Opera, IE11 */
        -webkit-flex-direction: column;
        -moz-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-justify-content: stretch;
        justify-content: stretch;
        -webkit-align-items: flex-start;
        align-items: flex-start;
        -webkit-align-content: flex-start;
        align-content: flex-start;
    }

/* ---- TAB PANEL MODIFIERS ---- */
.tab-panel.tab-panel--alt-0 .tab-panel__tab {
    color: #414E54;
    font-size: 1.28rem;
    text-transform: uppercase;
}

    .tab-panel.tab-panel--alt-0 .tab-panel__tab.active {
        border: none;
        background-color: #F5F6FA;
        color: #414E54;
    }

        .tab-panel.tab-panel--alt-0 .tab-panel__tab.active:first-of-type {
            margin-left: 0;
        }

    .tab-panel.tab-panel--alt-0 .tab-panel__tab.inactive {
        border: none;
        background-color: #A1AEB4;
        color: #FFF;
    }

        .tab-panel.tab-panel--alt-0 .tab-panel__tab.inactive:hover {
            border: none;
            background-color: #85969d;
        }

.tab-panel.tab-panel--alt-0 .tab-panel__body-wrap {
    padding: 0;
    border: none;
    border-top: 0;
    background-color: #F5F6FA;
}

.tab-panel.tab-panel--alt-0 HEADER.tab-panel__header {
    padding: 32px 24px 24px;
    border-bottom-color: #dadfe1;
    background: #F5F6FA;
    background: -moz-linear-gradient(top, #F5F6FA 0%, #FFF 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #F5F6FA), color-stop(100%, #FFF));
    background: -webkit-linear-gradient(top, #F5F6FA 0%, #FFF 100%);
    background: -o-linear-gradient(top, #F5F6FA 0%, #FFF 100%);
    background: -ms-linear-gradient(top, #F5F6FA 0%, #FFF 100%);
    background: linear-gradient(to bottom, #F5F6FA 0%, #FFF 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#F5F6FA, endColorstr=#FFF,GradientType=0);
}

.tab-panel.tab-panel--alt-0 .tab-panel__content {
    padding: 24px;
    padding-top: 12px;
}

    .tab-panel.tab-panel--alt-0 .tab-panel__content .flex-column-wrap--content {
        margin-bottom: 20px;
    }

    .tab-panel.tab-panel--alt-0 .tab-panel__content.tab-panel__content--no-pad {
        padding: 0;
    }

    .tab-panel.tab-panel--alt-0 .tab-panel__content.tab-panel__content--grid {
        padding-top: 0;
    }

    .tab-panel.tab-panel--alt-0 .tab-panel__content.tab-panel__content--stealth {
        padding: 20px 16px;
        background-color: #FFF;
    }

.tab-panel.tab-panel--alt-0 .tab-panel__buttons {
    padding: 0 24px 24px;
}

.tab-panel.tab-panel--alt-0 .overlay-disable-section {
    position: absolute;
    z-index: 900;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: rgba(211, 211, 211, 0.66);
}

    .tab-panel.tab-panel--alt-0 .overlay-disable-section.show {
        display: block;
    }

    .tab-panel.tab-panel--alt-0 .overlay-disable-section.hide {
        display: none;
    }

.tab-panel.tab-panel--alt-0 .questions-container {
    position: relative;
    padding-top: 20px;
}

.tab-panel.tab-panel--alt-1 .tab-panel__tab {
    color: #414E54;
    font-size: 1.28rem;
    text-transform: uppercase;
}

    .tab-panel.tab-panel--alt-1 .tab-panel__tab.active {
        border: none;
        background-color: #FFF;
        color: #414E54;
    }

        .tab-panel.tab-panel--alt-1 .tab-panel__tab.active:first-of-type {
            margin-left: 0;
        }

    .tab-panel.tab-panel--alt-1 .tab-panel__tab.inactive {
        border: none;
        background-color: #A1AEB4;
        color: #FFF;
    }

        .tab-panel.tab-panel--alt-1 .tab-panel__tab.inactive:hover {
            border: none;
            background-color: #85969d;
        }

.tab-panel.tab-panel--alt-1 .tab-panel__body-wrap {
    padding: 0;
    border: none;
    border-top: 0;
    background-color: #FFF;
}

.tab-panel.tab-panel--alt-1 HEADER.tab-panel__header {
    padding: 32px 24px 24px;
}

.tab-panel.tab-panel--alt-1 .tab-panel__content {
    padding: 0px;
}

    .tab-panel.tab-panel--alt-1 .tab-panel__content.tab-panel__content--no-pad {
        padding: 0;
    }

    .tab-panel.tab-panel--alt-1 .tab-panel__content.tab-panel__content--grid {
        padding-top: 0;
    }

.tab-panel.tab-panel--alt-1 .tab-panel__buttons {
    padding: 0 24px 24px;
}

.tab-panel.tab-panel--alt-1 .overlay-disable-section {
    position: absolute;
    z-index: 900;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: rgba(211, 211, 211, 0.66);
}

    .tab-panel.tab-panel--alt-1 .overlay-disable-section.show {
        display: block;
    }

    .tab-panel.tab-panel--alt-1 .overlay-disable-section.hide {
        display: none;
    }

.tab-panel.tab-panel--alt-1 .questions-container {
    position: relative;
    padding-top: 0px;
}

    .tab-panel.tab-panel--alt-1 .questions-container form {
        /* background: #fff; */
    }

.tab-panel.tab-panel--alt-2 .tab-panel__body {
    padding: 0;
    border: none;
    border-top: 0;
    background-color: #FFF;
}

.tab-panel.tab-panel--alt-2 HEADER.tab-panel__header {
    padding: 32px 24px 24px;
}

.tab-panel.tab-panel--alt-2 .tab-panel__content {
    padding: 24px;
    padding-top: 12px;
}

    .tab-panel.tab-panel--alt-2 .tab-panel__content.tab-panel__content--no-pad {
        padding: 0;
    }

    .tab-panel.tab-panel--alt-2 .tab-panel__content.tab-panel__content--grid {
        padding-top: 0;
    }

.tab-panel.tab-panel--alt-2 .tab-panel__buttons {
    padding: 0 24px 24px;
}

.tab-panel.tab-panel--alt-2 .tab-panel__buttons--alt {
    padding: 24px;
    background-color: #FFF;
}

.tab-panel.tab-panel--alt-2 .nested-tab-panel {
    padding: 0;
}

.tab-panel.tab-panel--alt-2 .nested-tab-panel__tab-strip {
    background-color: #0C2340;
    padding: 20px;
}

.tab-panel.tab-panel--alt-2 .nested-tab-panel__tab {
    color: #FFF;
}

    .tab-panel.tab-panel--alt-2 .nested-tab-panel__tab.nested-tab-panel__tab--active {
        color: #FBE122;
    }

        .tab-panel.tab-panel--alt-2 .nested-tab-panel__tab.nested-tab-panel__tab--active SPAN {
            border-bottom: 3px solid #FBE122;
        }

    .tab-panel.tab-panel--alt-2 .nested-tab-panel__tab.nested-tab-panel__tab--inactive {
        color: #FFF;
    }

        .tab-panel.tab-panel--alt-2 .nested-tab-panel__tab.nested-tab-panel__tab--inactive:hover {
            background-color: #040c15;
        }

/* ---- NESTED TAB PANELS ---- */
.nested-tab-panel {
    width: auto;
    padding: 32px 20px;
    margin-bottom: 20px;
}

.nested-tab-panel__tab-strip {
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- */
    display: -ms-flexbox;
    /* OLD - TWEENER - IE 10 */
    display: -webkit-flex;
    /* RECENT - Chrome */
    display: flex;
    /* NEW - Firefox, Chrome, Opera, IE11 */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: stretch;
    justify-content: stretch;
    -webkit-align-items: flex-end;
    align-items: flex-end;
    -webkit-align-content: flex-start;
    align-content: flex-start;
    width: auto;
}

.nested-tab-panel__tab {
    -webkit-box-flex: 0 1 auto;
    -webkit-flex: 0 1 auto;
    -moz-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    height: auto;
    padding: 10px 24px;
    margin: 0;
    color: #058C83;
    font-family: 'Invention', sans-serif;
    font-size: 1.1rem;
    font-weight: 500;
    text-transform: uppercase;
    -webkit-transition: background-color 0.4s ease, color 0.4s ease;
    -moz-transition: background-color 0.4s ease, color 0.4s ease;
    -ms-transition: background-color 0.4s ease, color 0.4s ease;
    -o-transition: background-color 0.4s ease, color 0.4s ease;
    transition: background-color 0.4s ease, color 0.4s ease;
}

    .nested-tab-panel__tab:first-of-type {
        margin-left: 0;
    }

    .nested-tab-panel__tab.nested-tab-panel__tab--active {
        position: relative;
        color: #414E54;
    }

        .nested-tab-panel__tab.nested-tab-panel__tab--active:first-of-type {
            margin-left: 0;
        }

        .nested-tab-panel__tab.nested-tab-panel__tab--active SPAN.nested-tab__text {
            display: inline-block;
            border-bottom: 3px solid #058C83;
        }

    .nested-tab-panel__tab.nested-tab-panel__tab--inactive {
        position: relative;
        color: #058C83;
    }

        .nested-tab-panel__tab.nested-tab-panel__tab--inactive:hover {
            background-color: #e6e6e6;
        }

        .nested-tab-panel__tab.nested-tab-panel__tab--inactive:first-of-type {
            margin-left: 0;
        }

/* ---- NESTED TAB PANEL BODY ---- */
.nested-tab-panel__body-wrap {
    width: auto;
    padding: 20px 0;
    border: 0 solid #ececec;
    background-color: #FFF;
}

.nested-tab-panel__body {
    min-height: 480px;
    -webkit-transition: opacity 0.4s ease;
    -moz-transition: opacity 0.4s ease;
    -ms-transition: opacity 0.4s ease;
    -o-transition: opacity 0.4s ease;
    transition: opacity 0.4s ease;
}

    .nested-tab-panel__body.nested-tab-panel__body--active {
        display: block;
        opacity: 1;
    }

    .nested-tab-panel__body.nested-tab-panel__body--inactive {
        display: none;
        opacity: 0;
    }

/* ============================================================== MEDIA QUERIES ============================================================== */
/* ---- LARGE TABLET, LAPTOP & DESKTOP (960px +) ---- */
@media screen and (min-width: 960px) {
    /* ---- TAB PANEL BODY ---- */
    .tab-panel__body-wrap {
        min-height: 480px;
    }
}

/* ---- SMALL MOBILE & SMALL TABLET (0 - 959px) ---- */
@media screen and (max-width: 959px) {
    /* ---- TAB PANELS ---- */
    .tab-panel__tab-strip {
        -webkit-flex-direction: column;
        -moz-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-align-items: stretch;
        align-items: stretch;
        position: relative;
        padding-left: 25px;
    }

        .tab-panel__tab-strip:before {
            content: '';
            position: absolute;
            z-index: 500;
            top: 0;
            left: 0;
            width: 20px;
            height: 100%;
            border: 1px solid #d3d7e9;
            border-bottom: none;
            background-color: #F5F6FA;
        }

    .tab-panel__tab {
        -webkit-box-flex: 1 1 auto;
        -webkit-flex: 1 1 auto;
        -moz-flex: 1 1 auto;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
        border-radius: 4px;
    }

        .tab-panel__tab.active {
            position: relative;
            z-index: 600;
            top: 0;
            left: -4px;
            width: 100%;
            border-bottom: 1px solid #d3d7e9;
            border-left: 0;
            border-top-left-radius: 0;
            border-bottom-left-radius: 0;
            margin-left: 0;
        }

        .tab-panel__tab.inactive {
            width: 96%;
        }
    /* ---- TAB PANEL HEADER ---- */
    HEADER.tab-panel__header .header-columns {
        -webkit-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    HEADER.tab-panel__header .header-col.col--tertiary {
        max-width: 33.33%;
    }

        HEADER.tab-panel__header .header-col.col--tertiary:nth-child(1) {
            -webkit-box-flex: 1 1 100%;
            -webkit-flex: 1 1 100%;
            -moz-flex: 1 1 100%;
            -ms-flex: 1 1 100%;
            flex: 1 1 100%;
            max-width: 100%;
            margin-bottom: 20px;
        }

        HEADER.tab-panel__header .header-col.col--tertiary:nth-child(2) {
            -webkit-box-flex: 1 1 66.66%;
            -webkit-flex: 1 1 66.66%;
            -moz-flex: 1 1 66.66%;
            -ms-flex: 1 1 66.66%;
            flex: 1 1 66.66%;
            max-width: 66.66%;
        }

        HEADER.tab-panel__header .header-col.col--tertiary:nth-child(3) {
            -webkit-box-flex: 1 1 33.33%;
            -webkit-flex: 1 1 33.33%;
            -moz-flex: 1 1 33.33%;
            -ms-flex: 1 1 33.33%;
            flex: 1 1 33.33%;
        }
}

/* ===========================================================

	$WIDGETS (v2 2018)

=========================================================== */
/* ======== OFF CANVAS BOX WIDGET ======== */
/* ---- VIEWPORT (Uses transform instead of positioning to speed up animation) ---- */
.off-canvas-viewport {
    position: relative;
    width: 100%;
    margin-bottom: 20px;
    overflow: visible;
    -webkit-transform: translate3d(0, 0, 0);
    /* Chrome, Safari 8+, Opera 15.0+ */
    -webkit-transform: -webkit-translate3d(0, 0, 0);
    /* Safari 7 */
    -moz-transform: translate3d(0, 0, 0);
    /* Firefox */
    -ms-transform: translate3d(0, 0, 0);
    /* IE 9 */
    -o-transform: translate3d(0, 0, 0);
    /* Opera 10.5 - 15.0 */
    transform: translate3d(0, 0, 0);
    -webkit-transition: transform 0.4s ease-in-out;
    -moz-transition: transform 0.4s ease-in-out;
    -ms-transition: transform 0.4s ease-in-out;
    -o-transition: transform 0.4s ease-in-out;
    transition: transform 0.4s ease-in-out;
}

    .off-canvas-viewport.off-canvas--open {
        -webkit-transform: translate3d(-105%, 0, 0);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-translate3d(-105%, 0, 0);
        /* Safari 7 */
        -moz-transform: translate3d(-105%, 0, 0);
        /* Firefox */
        -ms-transform: translate3d(-105%, 0, 0);
        /* IE 9 */
        -o-transform: translate3d(-105%, 0, 0);
        /* Opera 10.5 - 15.0 */
        transform: translate3d(-105%, 0, 0);
    }

/* ---- OFF CANVAS BOXES ---- */
.off-canvas-box {
    position: absolute;
    top: 0;
    right: -105%;
    z-index: 100;
    width: 100%;
    min-height: 300px;
    padding: 24px;
    padding-left: 64px;
    border: 1px solid #768A98;
    background-color: #F5F6FA;
    text-align: left;
}

    .off-canvas-box .button.hide-off-canvas {
        position: absolute;
        top: 24px;
        right: 24px;
        z-index: 500;
    }

    .off-canvas-box .off-canvas__column {
        float: left;
        width: 50%;
        padding-right: 10px;
    }

        .off-canvas-box .off-canvas__column:last-of-type {
            padding-left: 0;
        }

        .off-canvas-box .off-canvas__column IMG {
            width: 100%;
        }

/* ======== TOGGLE SWITCH ======== */
/* The switch - the box around the slider */
.toggle-switch {
    position: relative;
    display: inline-block;
    width: 32px;
    height: 17px;
}

    .toggle-switch INPUT {
        width: 0;
        height: 0;
        opacity: 0;
    }

.toggle-switch__slider {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    border-radius: 17px;
    cursor: pointer;
    background-color: #ccc;
    -webkit-transition: 0.4s;
    -moz-transition: 0.4s;
    -ms-transition: 0.4s;
    -o-transition: 0.4s;
    transition: 0.4s;
}

    .toggle-switch__slider:before {
        position: absolute;
        content: "";
        height: 13px;
        width: 13px;
        left: 2px;
        bottom: 2px;
        border-radius: 50%;
        background-color: white;
        -webkit-transition: 0.4s;
        -moz-transition: 0.4s;
        -ms-transition: 0.4s;
        -o-transition: 0.4s;
        transition: 0.4s;
    }

INPUT:checked + .toggle-switch__slider {
    background-color: #0C2340;
}

INPUT:focus + .toggle-switch__slider {
    box-shadow: 0 0 1px #0C2340;
}

INPUT:checked + .toggle-switch__slider:before {
    -webkit-transform: translate3d(13px, 0, 0);
    /* Chrome, Safari 8+, Opera 15.0+ */
    -webkit-transform: -webkit-translate3d(13px, 0, 0);
    /* Safari 7 */
    -moz-transform: translate3d(13px, 0, 0);
    /* Firefox */
    -ms-transform: translate3d(13px, 0, 0);
    /* IE 9 */
    -o-transform: translate3d(13px, 0, 0);
    /* Opera 10.5 - 15.0 */
    transform: translate3d(13px, 0, 0);
}

/* ======== SCROLL REVEAL ======== */
.reveal--primary,
.reveal--secondary,
.reveal--tertiary,
.reveal--quarternary,
.reveal--image,
.reveal--image--alpha,
.reveal--image--beta,
.reveal--image--gamma,
.reveal--image--delta,
.reveal--image--epsilon,
.reveal--image--zeta,
.reveal--video,
.reveal--video--alpha,
.reveal--video--beta,
.reveal--video--gamma,
.reveal--alpha,
.reveal--beta,
.reveal--gamma,
.reveal--delta,
.reveal--epsilon,
.reveal--zeta,
.reveal--eta,
.reveal--theta,
.reveal--iota,
.reveal--kappa,
.reveal--lambda,
.reveal--mu,
.reveal--nu,
.reveal--xi,
.reveal--omicron,
.reveal--pi,
.reveal--rho,
.reveal--sigma,
.reveal--tau,
.reveal--upsilon,
.reveal--phi,
.reveal--chi,
.reveal--psi,
.reveal--omega {
    visibility: hidden;
}

/* To stop 'pop-in' on page load before animation begins */
.flip-group {
    perspective: 800px;
    overflow: visible;
}

.reveal--flip,
.reveal--flip-alpha {
    backface-visibility: hidden;
}

.observation-popup--wrapper {
    display: flex;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 7%;
    justify-content: center;
    z-index: 100;
    visibility: visible;
    opacity: 1;
    transition: opacity 0.1s linear;
}

    .observation-popup--wrapper.hidden {
        visibility: hidden;
        opacity: 0;
        transition: visibility 0s 0.1s, opacity 0.2s linear;
    }

    .observation-popup--wrapper.bounce {
        -webkit-animation: bounce 1.5s ease-out 0s;
        -webkit-animation-iteration-count: 1;
        /* Chrome, Safari, Opera */
        animation: bounce 1.5s ease-out 0s;
        animation-iteration-count: 1;
    }

.observation-pop--chevron-wrapper {
    display: inline-block;
    visibility: visible;
}

    .observation-pop--chevron-wrapper.hidden {
        display: none;
        visibility: hidden;
    }

.observation-popup {
    width: auto;
    text-align: center;
    background-color: #FBE122;
    border-radius: 4px;
    padding: 12px 16px;
}

    .observation-popup::after {
        position: absolute;
        top: 38px;
        height: 0;
        width: 0;
        left: calc(50% - 20px);
        border: 20px solid transparent;
        border-bottom-color: #FBE122;
        content: "";
        transform: rotate(180deg);
    }

    .observation-popup.flipped::after {
        position: absolute;
        top: -38px;
        height: 0;
        width: 0;
        left: calc(50% - 20px);
        border: 20px solid transparent;
        border-bottom-color: #FBE122;
        content: "";
        transform: rotate(0deg);
    }

    .observation-popup.removed::after {
        border-bottom-color: #768A98;
    }

.observation-popup--text-wrapper {
    display: inline-block;
    font-size: 1.28rem;
    color: black;
}

I.icon.observation-popup--chevron {
    position: absolute;
    z-index: 1600;
    display: block;
    top: 15px;
    right: 15px;
    height: 16px;
    width: 16px;
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -ms-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
    display: inline-block;
    position: relative;
    top: 0;
    right: 0;
    transform: rotate(180deg);
    vertical-align: sub;
}

    I.icon.observation-popup--chevron::after, I.icon.observation-popup--chevron::before {
        /* lines of '>' icon */
        content: '';
        position: absolute;
        height: 2px;
        width: 8px;
        left: 30%;
        top: 50%;
        background-color: black;
        -webkit-backface-visibility: hidden;
        -moz-backface-visibility: hidden;
        -ms-backface-visibility: hidden;
        -o-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-transition: background-color 0.4s ease;
        -moz-transition: background-color 0.4s ease;
        -ms-transition: background-color 0.4s ease;
        -o-transition: background-color 0.4s ease;
        transition: background-color 0.4s ease;
    }

    I.icon.observation-popup--chevron::before {
        -webkit-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        -moz-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        -o-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        -ms-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        transform: translateX(-36%) translateY(-30%) rotate(-45deg);
    }

    I.icon.observation-popup--chevron::after {
        -webkit-transform: translateX(36%) translateY(-30%) rotate(45deg);
        -moz-transform: translateX(36%) translateY(-30%) rotate(45deg);
        -o-transform: translateX(36%) translateY(-30%) rotate(45deg);
        -ms-transform: translateX(36%) translateY(-30%) rotate(45deg);
        transform: translateX(36%) translateY(-30%) rotate(45deg);
    }

    I.icon.observation-popup--chevron:hover::after, I.icon.observation-popup--chevron:hover::before {
        background-color: black;
    }

    I.icon.observation-popup--chevron.rotated {
        transform: rotate(0deg);
    }

I.icon--blocked::before {
    color: white;
}

.highlighted {
    border-radius: 4px;
    border-width: 3px !important;
    border-style: solid;
    -webkit-animation: border-pulsate 2s ease-out 0s;
    -webkit-animation-iteration-count: infinite;
    /* Chrome, Safari, Opera */
    animation: border-pulsate 2s ease-out 0s;
    animation-iteration-count: infinite;
}

/* ============================================================== MEDIA QUERIES ============================================================== */
/* ---- TABLET, LAPTOP & DESKTOP (960px +) ---- */
@media only screen and (min-width: 960px) {
    /* ---- OFF CANVAS BOXES ---- */
    .off-canvas-box {
        display: none;
    }

    .show-off-canvas {
        display: none;
    }
}

/* ---- MOBILE & SMALL TABLET (0 - 959px) ---- */
@media only screen and (max-width: 959px) {
    /* ---- OFF CANVAS BOXES ---- */
    .off-canvas-box {
        display: none;
    }

        .off-canvas-box.active {
            display: block;
        }

        .off-canvas-box.inactive {
            display: none;
        }
}

/* ===========================================================

    $TILES (v2 2018)

=========================================================== */
/* ======== CONTENT TILES ======== */
/* ---- CONTENT TILE CONTAINER ---- */
.content-tiles {
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- */
    display: -ms-flexbox;
    /* OLD - TWEENER - IE 10 */
    display: -webkit-flex;
    /* RECENT - Chrome */
    display: flex;
    /* NEW - Firefox, Chrome, Opera, IE11 */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -webkit-align-items: stretch;
    align-items: stretch;
    -webkit-align-content: flex-start;
    align-content: flex-start;
    position: relative;
    clear: both;
    width: 100%;
    padding: 20px 0;
    margin-bottom: 20px;
}

/* ---- CONTENT TILE ---- */
.content-tile {
    z-index: 100;
    padding: 20px;
    margin-bottom: 20px;
    background-color: #F5F6FA;
}

    .content-tile:first-child:nth-last-child(even),
    .content-tile:first-child:nth-last-child(even) ~ .content-tile {
        -webkit-box-flex: 0 1 48.5%;
        -webkit-flex: 0 1 48.5%;
        -moz-flex: 0 1 48.5%;
        -ms-flex: 0 1 48.5%;
        flex: 0 1 48.5%;
    }

    .content-tile:first-child:nth-last-child(odd),
    .content-tile:first-child:nth-last-child(odd) ~ .content-tile {
        -webkit-box-flex: 0 1 31.75%;
        -webkit-flex: 0 1 31.75%;
        -moz-flex: 0 1 31.75%;
        -ms-flex: 0 1 31.75%;
        flex: 0 1 31.75%;
    }

/* ---- CONTENT TILE ELEMENTS ---- */
.content-tile__viewport {
    position: relative;
    clear: both;
    width: 100%;
    height: 120px;
    margin-bottom: 20px;
    text-align: center;
    overflow: hidden;
}

.content-tile__image {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    /* Chrome, Safari 8+, Opera 15.0+ */
    -webkit-transform: -webkit-translate(-50%, -50%);
    /* Safari 7 */
    -moz-transform: translate(-50%, -50%);
    /* Firefox */
    -ms-transform: translate(-50%, -50%);
    /* IE 9 */
    -o-transform: translate(-50%, -50%);
    /* Opera 10.5 - 15.0 */
    transform: translate(-50%, -50%);
    width: auto;
    height: auto;
    min-width: 100.01%;
    min-height: 100.01%;
    max-width: 200%;
    z-index: 10;
}

.content-tile__icon {
    display: block;
    width: auto;
    height: 64px;
    margin-bottom: 20px;
}

.content-tile__text {
    clear: both;
    width: 100%;
    min-height: 48px;
    text-align: left;
}

MAIN H4.content-tile__title {
    font-family: 'Invention', sans-serif;
    color: #0C2340;
    text-transform: uppercase;
}

/* ======== ICON TILES ======== */
/* ---- ICON TILE CONTAINER ---- */
.icon-tiles {
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- */
    display: -ms-flexbox;
    /* OLD - TWEENER - IE 10 */
    display: -webkit-flex;
    /* RECENT - Chrome */
    display: flex;
    /* NEW - Firefox, Chrome, Opera, IE11 */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: stretch;
    align-items: stretch;
    -webkit-align-content: flex-start;
    align-content: flex-start;
    position: relative;
    clear: both;
    width: 100%;
    padding-top: 20px;
    margin-bottom: 20px;
}

    .icon-tiles.icon-tiles--strip {
        padding: 32px 0;
        margin: 32px 0;
        background-color: #F5F6FA;
    }

        .icon-tiles.icon-tiles--strip:before, .icon-tiles.icon-tiles--strip:after {
            content: '';
            position: absolute;
            z-index: 10;
            top: 0;
            height: 100%;
            width: 300%;
            background-color: inherit;
        }

        .icon-tiles.icon-tiles--strip:before {
            left: 0;
        }

        .icon-tiles.icon-tiles--strip:after {
            right: 0;
        }

/* ---- ICON TILE ---- */
.icon-tile {
    z-index: 100;
}

    .icon-tile:first-child:nth-last-child(2),
    .icon-tile:first-child:nth-last-child(2) ~ .icon-tile {
        -webkit-box-flex: 0 1 50%;
        -webkit-flex: 0 1 50%;
        -moz-flex: 0 1 50%;
        -ms-flex: 0 1 50%;
        flex: 0 1 50%;
    }

    .icon-tile:first-child:nth-last-child(3),
    .icon-tile:first-child:nth-last-child(3) ~ .icon-tile {
        -webkit-box-flex: 0 1 33.33%;
        -webkit-flex: 0 1 33.33%;
        -moz-flex: 0 1 33.33%;
        -ms-flex: 0 1 33.33%;
        flex: 0 1 33.33%;
    }

    .icon-tile:first-child:nth-last-child(4),
    .icon-tile:first-child:nth-last-child(4) ~ .icon-tile {
        -webkit-box-flex: 0 1 25%;
        -webkit-flex: 0 1 25%;
        -moz-flex: 0 1 25%;
        -ms-flex: 0 1 25%;
        flex: 0 1 25%;
    }

    .icon-tile:first-child:nth-last-child(5),
    .icon-tile:first-child:nth-last-child(5) ~ .icon-tile {
        -webkit-box-flex: 0 1 20%;
        -webkit-flex: 0 1 20%;
        -moz-flex: 0 1 20%;
        -ms-flex: 0 1 20%;
        flex: 0 1 20%;
    }

/* ---- ICON TILE ELEMENTS ---- */
.icon-tile__viewport {
    clear: both;
    width: 100%;
    height: 90px;
    margin-bottom: 20px;
    text-align: center;
    overflow: hidden;
}

.icon-tile__image {
    display: inline-block;
    height: 90px;
}

.icon-tile__text {
    clear: both;
    width: 100%;
    min-height: 48px;
    text-align: center;
}

MAIN H4.icon-tile__title {
    font-family: 'Invention', sans-serif;
    color: #0C2340;
    text-transform: uppercase;
    text-align: inherit;
}

MAIN .icon-tiles.icon-tiles--alt H4.icon-tile__title {
    font-size: 18px;
    color: #058C83;
}

/* ============================================================== MEDIA QUERIES ============================================================== */
/* ---- LAPTOP & DESKTOP (1280px +) ---- */
/* ---- TABLET, LAPTOP & DESKTOP (960px +) ---- */
@media only screen and (min-width: 960px) {
    /* ---- ICON TILE ---- */
    .icon-tile {
        padding: 0 12px;
    }
}

/* ---- MOBILE & SMALL TABLET (0 - 959px) ---- */
@media only screen and (max-width: 959px) {
    /* ======== CONTENT TILES ======== */
    /* ---- CONTENT TILE CONTAINER ---- */
    .content-tiles {
        display: -webkit-box;
        /* OLD - iOS 6-, Safari 3.1-6 */
        display: -moz-box;
        /* OLD - Firefox 19- */
        display: -ms-flexbox;
        /* OLD - TWEENER - IE 10 */
        display: -webkit-flex;
        /* RECENT - Chrome */
        display: flex;
        /* NEW - Firefox, Chrome, Opera, IE11 */
        -webkit-flex-direction: column;
        -moz-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-justify-content: space-between;
        justify-content: space-between;
        -webkit-align-items: stretch;
        align-items: stretch;
        -webkit-align-content: flex-start;
        align-content: flex-start;
    }
    /* ---- CONTENT TILE ---- */
    .content-tile,
    .content-tile:first-child:nth-last-child(even),
    .content-tile:first-child:nth-last-child(even) ~ .content-tile,
    .content-tile:first-child:nth-last-child(odd),
    .content-tile:first-child:nth-last-child(odd) ~ .content-tile {
        -webkit-box-flex: 1 1 auto;
        -webkit-flex: 1 1 auto;
        -moz-flex: 1 1 auto;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
    }
    /* ---- CONTENT TILE ELEMENTS ---- */
    .content-tile__viewport {
        height: 100px;
    }

    .content-tile__image {
        height: 100px;
    }
    /* ======== ICON TILES ======== */
    /* ---- ICON TILE CONTAINER ---- */
    .icon-tiles {
        display: -webkit-box;
        /* OLD - iOS 6-, Safari 3.1-6 */
        display: -moz-box;
        /* OLD - Firefox 19- */
        display: -ms-flexbox;
        /* OLD - TWEENER - IE 10 */
        display: -webkit-flex;
        /* RECENT - Chrome */
        display: flex;
        /* NEW - Firefox, Chrome, Opera, IE11 */
        -webkit-flex-direction: column;
        -moz-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-justify-content: space-between;
        justify-content: space-between;
        -webkit-align-items: stretch;
        align-items: stretch;
        -webkit-align-content: flex-start;
        align-content: flex-start;
    }
    /* ---- ICON TILE ---- */
    .icon-tile {
        -webkit-box-flex: 1 1 auto;
        -webkit-flex: 1 1 auto;
        -moz-flex: 1 1 auto;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
        padding: 0 32px;
        margin-bottom: 48px;
    }

        .icon-tile:last-of-type {
            margin-bottom: 20px;
        }

        .icon-tile:first-child:nth-last-child(2),
        .icon-tile:first-child:nth-last-child(2) ~ .icon-tile,
        .icon-tile:first-child:nth-last-child(3),
        .icon-tile:first-child:nth-last-child(3) ~ .icon-tile,
        .icon-tile:first-child:nth-last-child(4),
        .icon-tile:first-child:nth-last-child(4) ~ .icon-tile,
        .icon-tile:first-child:nth-last-child(5),
        .icon-tile:first-child:nth-last-child(5) ~ .icon-tile {
            -webkit-box-flex: 1 1 auto;
            -webkit-flex: 1 1 auto;
            -moz-flex: 1 1 auto;
            -ms-flex: 1 1 auto;
            flex: 1 1 auto;
        }
    /* ---- ICON TILE ELEMENTS ---- */
    .icon-tile__viewport {
        height: 100px;
        margin-bottom: 32px;
    }

    .icon-tile__image {
        height: 100px;
    }
}

/* ---- SMALL MOBILE (0 - 479px) ---- */
/* ===========================================================

	$ACCORDION (v2 2018)

=========================================================== */
/* ---- ACCORDION STRUCTURE ---- */
.accordion {
    -webkit-box-flex: 1 1 auto;
    -webkit-flex: 1 1 auto;
    -moz-flex: 1 1 auto;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
}

    .accordion.accordion--desktop-only {
        display: block;
    }

    .accordion.accordion--mobile-only {
        display: none;
    }

UL.accordion__list {
    display: block;
    padding: 0;
    margin: 0;
}

/* ---- ACCORDION ITEM ---- */
LI.accordion__item {
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- */
    display: -ms-flexbox;
    /* OLD - TWEENER - IE 10 */
    display: -webkit-flex;
    /* RECENT - Chrome */
    display: flex;
    /* NEW - Firefox, Chrome, Opera, IE11 */
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    -webkit-align-items: stretch;
    align-items: stretch;
    -webkit-align-content: flex-start;
    align-content: flex-start;
    position: relative;
    clear: both;
    height: auto;
    margin: 0 0 2px 0;
    list-style: none;
    font-size: 1.28rem;
    line-height: 1.9rem;
}

/* ---- ACCORDION ELEMENTS ---- */
.accordion__bar-dock {
    min-height: 67px;
}

.accordion__bar {
    position: relative;
    z-index: 10;
    width: 100%;
    height: auto;
    padding: 16px;
    background-color: #F5F6FA;
    -webkit-transition: background-color 0.4s ease-out;
    -moz-transition: background-color 0.4s ease-out;
    -ms-transition: background-color 0.4s ease-out;
    -o-transition: background-color 0.4s ease-out;
    transition: background-color 0.4s ease-out;
}

    .accordion__bar:hover {
        background-color: #edeef6;
        cursor: pointer;
    }

.accordion__item--open .accordion__bar.accordion__bar--fixed {
    position: fixed;
    top: 86px;
    z-index: 300;
    width: 1060px;
    margin-left: -20px;
}

MAIN H4.accordion__item-heading {
    font-size: 1.504rem;
    font-weight: 700;
    line-height: 0.9;
    margin-bottom: 0;
    font-family: 'Invention', sans-serif;
    color: #1b1b1b;
    text-transform: capitalize;
    text-align: left;
    white-space: pre;
}

LABEL.accordion__item-label {
    display: block;
    padding: 0;
}

TIME.accordion__item-time {
    font-weight: 700;
}

INS.accordion__item-detail {
    font-weight: 700;
    white-space: pre;
}

.accordion__list--primary H4.accordion__item-heading {
    /*@include heading-font-style-semi($primaryColour, uppercase);*/
}

.accordion__item--primary H4.accordion__item-heading {
    /*@include heading-font-style-semi($primaryColour !important, initial);*/
}

.accordion__list--secondary H4.accordion__item-heading {
    /*@include heading-font-style-semi($secondaryColour, uppercase);*/
}

.accordion__item--secondary H4.accordion__item-heading {
    /*@include heading-font-style-semi($secondaryColour !important, initial);*/
}

.accordion__list--tertiary H4.accordion__item-heading {
    /*@include heading-font-style-semi($tertiaryColour, uppercase);*/
}

.accordion__item--tertiary H4.accordion__item-heading {
    /*@include heading-font-style-semi($tertiaryColour !important, initial);*/
}

.accordion__delete-button {
    position: absolute !important;
    display: inline-block;
    top: 0;
    bottom: 0;
    right: 92px;
}

    .accordion__delete-button:before {
        display: inline-block;
        font-family: "IcoMoon Basic";
        color: #1b1b1b;
    }

    .accordion__delete-button > .icon {
        width: 24px;
        height: 24px;
        border: 2px solid #0C2340;
        border-radius: 20px;
        background-color: #FFF;
        text-align: center;
    }

        .accordion__delete-button > .icon:before {
            font-size: 12px;
            line-height: 1.5;
        }

    .accordion__delete-button:disabled {
        cursor: not-allowed;
    }

LI.k-item .accordion__delete-button > .icon {
    line-height: 2;
}

BUTTON.accordion__save-button {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 58px;
    z-index: 50;
}

    BUTTON.accordion__save-button:before {
        display: inline-block;
        font-family: "IcoMoon Basic";
        color: #1b1b1b;
    }

    BUTTON.accordion__save-button > .icon {
        width: 24px;
        height: 24px;
        border: 2px solid #0C2340;
        border-radius: 20px;
        background-color: #FFF;
        opacity: 0.33;
    }

        BUTTON.accordion__save-button > .icon:before {
            font-size: 12px;
            line-height: 1.5;
        }

LI.k-item BUTTON.accordion__save-button > .icon {
    line-height: 2;
}

BUTTON.accordion__expand-button {
    position: absolute;
    top: 20px;
    right: 16px;
    /*@include plus-cross(2px, $anchorPrimaryColour, $anchorPrimaryColourHover, 24px, 24px);*/
}

    BUTTON.accordion__expand-button:before {
        display: inline-block;
        font-family: "IcoMoon Basic";
        color: #1b1b1b;
    }

    BUTTON.accordion__expand-button > .icon {
        top: 45%;
        right: 2.4rem;
    }

        BUTTON.accordion__expand-button > .icon:before {
            width: 24px;
            height: 24px;
            border-radius: 20px;
            background-color: #FFF;
            font-size: 24px;
        }

.accordion__panel {
    clear: both;
    opacity: 0;
    overflow: hidden;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}

LI.accordion__item.accordion__item--closed .accordion__panel {
    -webkit-box-flex: 0 0 0px;
    -webkit-flex: 0 0 0px;
    -moz-flex: 0 0 0px;
    -ms-flex: 0 0 0px;
    flex: 0 0 0px;
    max-height: 0;
    padding: 0;
    opacity: 0;
}

    LI.accordion__item.accordion__item--closed .accordion__panel * {
        font-size: 0 !important;
        -webkit-transition: all 0.4s ease-out 0.4s;
        -moz-transition: all 0.4s ease-out 0.4s;
        -ms-transition: all 0.4s ease-out 0.4s;
        -o-transition: all 0.4s ease-out 0.4s;
        transition: all 0.4s ease-out 0.4s;
    }

LI.accordion__item.accordion__item--closed .accordion__expand-button > .icon:before {
    content: '\ea43';
}

LI.accordion__item.accordion__item--open .accordion__panel {
    -webkit-box-flex: 1 1 auto;
    -webkit-flex: 1 1 auto;
    -moz-flex: 1 1 auto;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    padding: 32px 0 20px;
    opacity: 1;
}

    LI.accordion__item.accordion__item--open .accordion__panel.accordion__panel--pad {
        padding-left: 20px;
        padding-right: 20px;
    }

LI.accordion__item.accordion__item--open .accordion__bar {
    background-color: #FBE122;
}

    LI.accordion__item.accordion__item--open .accordion__bar:hover {
        background-color: #e6cb04;
    }

LI.accordion__item.accordion__item--open .accordion__panel *:last-child {
    /*margin-bottom:0;*/
}

LI.accordion__item.accordion__item--open .accordion__expand-button:before {
    /*@include transform(translateX(-50%) translateY(-50%) rotate(0deg));*/
}

LI.accordion__item.accordion__item--open .accordion__expand-button > .icon:before {
    content: '\ea41';
}

LI.accordion__item.accordion__item--open BUTTON.accordion__save-button > .icon {
    opacity: 1;
}

/* ---- ACCORDION ALT VERSION ---- */
.accordion--alt UL.accordion__list--primary LI.accordion__item {
    border-bottom-color: #FBE122;
}

.accordion--alt UL.accordion__list--secondary LI.accordion__item {
    border-bottom-color: #0C2340;
}

.accordion--alt UL.accordion__list--tertiary LI.accordion__item {
    border-bottom-color: #058C83;
}

.accordion--alt LI.accordion__item {
    border-bottom: 2px solid #0C2340;
    font-family: 'Invention', sans-serif;
    ;
}

    .accordion--alt LI.accordion__item.accordion__item--primary {
        border-bottom-color: #FBE122 !important;
    }

    .accordion--alt LI.accordion__item.accordion__item--secondary {
        border-bottom-color: #0C2340 !important;
    }

    .accordion--alt LI.accordion__item.accordion__item--tertiary {
        border-bottom-color: #058C83 !important;
    }

.accordion--alt .accordion__bar {
    position: static;
    background-color: transparent;
}

    .accordion--alt .accordion__bar:hover {
        background-color: transparent;
    }

LI.accordion__item.accordion__item--closed .accordion__chevron-button {
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
}

LI.accordion__item.accordion__item--open .accordion__chevron-button {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
}

MAIN .accordion.accordion--alt H4.accordion__item-heading {
    font-size: 1.28rem;
    font-family: 'Invention', sans-serif;
    ;
    text-transform: initial;
}

BUTTON.accordion__chevron-button {
    position: absolute;
    z-index: 1600;
    display: block;
    top: 15px;
    right: 15px;
    height: 24px;
    width: 24px;
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -ms-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
    top: auto !important;
    bottom: 16px !important;
}

    BUTTON.accordion__chevron-button::after, BUTTON.accordion__chevron-button::before {
        /* lines of '>' icon */
        content: '';
        position: absolute;
        height: 1px;
        width: 12px;
        left: 30%;
        top: 50%;
        background-color: #058C83;
        -webkit-backface-visibility: hidden;
        -moz-backface-visibility: hidden;
        -ms-backface-visibility: hidden;
        -o-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-transition: background-color 0.4s ease;
        -moz-transition: background-color 0.4s ease;
        -ms-transition: background-color 0.4s ease;
        -o-transition: background-color 0.4s ease;
        transition: background-color 0.4s ease;
    }

    BUTTON.accordion__chevron-button::before {
        -webkit-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        -moz-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        -o-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        -ms-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        transform: translateX(-36%) translateY(-30%) rotate(-45deg);
    }

    BUTTON.accordion__chevron-button::after {
        -webkit-transform: translateX(36%) translateY(-30%) rotate(45deg);
        -moz-transform: translateX(36%) translateY(-30%) rotate(45deg);
        -o-transform: translateX(36%) translateY(-30%) rotate(45deg);
        -ms-transform: translateX(36%) translateY(-30%) rotate(45deg);
        transform: translateX(36%) translateY(-30%) rotate(45deg);
    }

    BUTTON.accordion__chevron-button:hover::after, BUTTON.accordion__chevron-button:hover::before {
        background-color: #07bdb1;
    }

.accordion__list--primary BUTTON.accordion__chevron-button {
    position: absolute;
    z-index: 1600;
    display: block;
    top: 15px;
    right: 15px;
    height: 24px;
    width: 24px;
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -ms-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

    .accordion__list--primary BUTTON.accordion__chevron-button::after, .accordion__list--primary BUTTON.accordion__chevron-button::before {
        /* lines of '>' icon */
        content: '';
        position: absolute;
        height: 1px;
        width: 12px;
        left: 30%;
        top: 50%;
        background-color: #058C83;
        -webkit-backface-visibility: hidden;
        -moz-backface-visibility: hidden;
        -ms-backface-visibility: hidden;
        -o-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-transition: background-color 0.4s ease;
        -moz-transition: background-color 0.4s ease;
        -ms-transition: background-color 0.4s ease;
        -o-transition: background-color 0.4s ease;
        transition: background-color 0.4s ease;
    }

    .accordion__list--primary BUTTON.accordion__chevron-button::before {
        -webkit-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        -moz-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        -o-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        -ms-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        transform: translateX(-36%) translateY(-30%) rotate(-45deg);
    }

    .accordion__list--primary BUTTON.accordion__chevron-button::after {
        -webkit-transform: translateX(36%) translateY(-30%) rotate(45deg);
        -moz-transform: translateX(36%) translateY(-30%) rotate(45deg);
        -o-transform: translateX(36%) translateY(-30%) rotate(45deg);
        -ms-transform: translateX(36%) translateY(-30%) rotate(45deg);
        transform: translateX(36%) translateY(-30%) rotate(45deg);
    }

    .accordion__list--primary BUTTON.accordion__chevron-button:hover::after, .accordion__list--primary BUTTON.accordion__chevron-button:hover::before {
        background-color: #07bdb1;
    }

.accordion__item--primary BUTTON.accordion__chevron-button {
    position: absolute;
    z-index: 1600;
    display: block;
    top: 15px;
    right: 15px;
    height: 24px;
    width: 24px;
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -ms-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

    .accordion__item--primary BUTTON.accordion__chevron-button::after, .accordion__item--primary BUTTON.accordion__chevron-button::before {
        /* lines of '>' icon */
        content: '';
        position: absolute;
        height: 1px;
        width: 12px;
        left: 30%;
        top: 50%;
        background-color: #058C83;
        -webkit-backface-visibility: hidden;
        -moz-backface-visibility: hidden;
        -ms-backface-visibility: hidden;
        -o-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-transition: background-color 0.4s ease;
        -moz-transition: background-color 0.4s ease;
        -ms-transition: background-color 0.4s ease;
        -o-transition: background-color 0.4s ease;
        transition: background-color 0.4s ease;
    }

    .accordion__item--primary BUTTON.accordion__chevron-button::before {
        -webkit-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        -moz-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        -o-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        -ms-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        transform: translateX(-36%) translateY(-30%) rotate(-45deg);
    }

    .accordion__item--primary BUTTON.accordion__chevron-button::after {
        -webkit-transform: translateX(36%) translateY(-30%) rotate(45deg);
        -moz-transform: translateX(36%) translateY(-30%) rotate(45deg);
        -o-transform: translateX(36%) translateY(-30%) rotate(45deg);
        -ms-transform: translateX(36%) translateY(-30%) rotate(45deg);
        transform: translateX(36%) translateY(-30%) rotate(45deg);
    }

    .accordion__item--primary BUTTON.accordion__chevron-button:hover::after, .accordion__item--primary BUTTON.accordion__chevron-button:hover::before {
        background-color: #07bdb1;
    }

.accordion__list--secondary BUTTON.accordion__chevron-button {
    position: absolute;
    z-index: 1600;
    display: block;
    top: 15px;
    right: 15px;
    height: 24px;
    width: 24px;
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -ms-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

    .accordion__list--secondary BUTTON.accordion__chevron-button::after, .accordion__list--secondary BUTTON.accordion__chevron-button::before {
        /* lines of '>' icon */
        content: '';
        position: absolute;
        height: 1px;
        width: 12px;
        left: 30%;
        top: 50%;
        background-color: #FBE122;
        -webkit-backface-visibility: hidden;
        -moz-backface-visibility: hidden;
        -ms-backface-visibility: hidden;
        -o-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-transition: background-color 0.4s ease;
        -moz-transition: background-color 0.4s ease;
        -ms-transition: background-color 0.4s ease;
        -o-transition: background-color 0.4s ease;
        transition: background-color 0.4s ease;
    }

    .accordion__list--secondary BUTTON.accordion__chevron-button::before {
        -webkit-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        -moz-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        -o-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        -ms-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        transform: translateX(-36%) translateY(-30%) rotate(-45deg);
    }

    .accordion__list--secondary BUTTON.accordion__chevron-button::after {
        -webkit-transform: translateX(36%) translateY(-30%) rotate(45deg);
        -moz-transform: translateX(36%) translateY(-30%) rotate(45deg);
        -o-transform: translateX(36%) translateY(-30%) rotate(45deg);
        -ms-transform: translateX(36%) translateY(-30%) rotate(45deg);
        transform: translateX(36%) translateY(-30%) rotate(45deg);
    }

    .accordion__list--secondary BUTTON.accordion__chevron-button:hover::after, .accordion__list--secondary BUTTON.accordion__chevron-button:hover::before {
        background-color: #fce854;
    }

.accordion__item--secondary BUTTON.accordion__chevron-button {
    position: absolute;
    z-index: 1600;
    display: block;
    top: 15px;
    right: 15px;
    height: 24px;
    width: 24px;
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -ms-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

    .accordion__item--secondary BUTTON.accordion__chevron-button::after, .accordion__item--secondary BUTTON.accordion__chevron-button::before {
        /* lines of '>' icon */
        content: '';
        position: absolute;
        height: 1px;
        width: 12px;
        left: 30%;
        top: 50%;
        background-color: #FBE122;
        -webkit-backface-visibility: hidden;
        -moz-backface-visibility: hidden;
        -ms-backface-visibility: hidden;
        -o-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-transition: background-color 0.4s ease;
        -moz-transition: background-color 0.4s ease;
        -ms-transition: background-color 0.4s ease;
        -o-transition: background-color 0.4s ease;
        transition: background-color 0.4s ease;
    }

    .accordion__item--secondary BUTTON.accordion__chevron-button::before {
        -webkit-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        -moz-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        -o-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        -ms-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        transform: translateX(-36%) translateY(-30%) rotate(-45deg);
    }

    .accordion__item--secondary BUTTON.accordion__chevron-button::after {
        -webkit-transform: translateX(36%) translateY(-30%) rotate(45deg);
        -moz-transform: translateX(36%) translateY(-30%) rotate(45deg);
        -o-transform: translateX(36%) translateY(-30%) rotate(45deg);
        -ms-transform: translateX(36%) translateY(-30%) rotate(45deg);
        transform: translateX(36%) translateY(-30%) rotate(45deg);
    }

    .accordion__item--secondary BUTTON.accordion__chevron-button:hover::after, .accordion__item--secondary BUTTON.accordion__chevron-button:hover::before {
        background-color: #fce854;
    }

.accordion__list--tertiary BUTTON.accordion__chevron-button {
    position: absolute;
    z-index: 1600;
    display: block;
    top: 15px;
    right: 15px;
    height: 24px;
    width: 24px;
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -ms-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

    .accordion__list--tertiary BUTTON.accordion__chevron-button::after, .accordion__list--tertiary BUTTON.accordion__chevron-button::before {
        /* lines of '>' icon */
        content: '';
        position: absolute;
        height: 1px;
        width: 12px;
        left: 30%;
        top: 50%;
        background-color: #058C83;
        -webkit-backface-visibility: hidden;
        -moz-backface-visibility: hidden;
        -ms-backface-visibility: hidden;
        -o-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-transition: background-color 0.4s ease;
        -moz-transition: background-color 0.4s ease;
        -ms-transition: background-color 0.4s ease;
        -o-transition: background-color 0.4s ease;
        transition: background-color 0.4s ease;
    }

    .accordion__list--tertiary BUTTON.accordion__chevron-button::before {
        -webkit-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        -moz-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        -o-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        -ms-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        transform: translateX(-36%) translateY(-30%) rotate(-45deg);
    }

    .accordion__list--tertiary BUTTON.accordion__chevron-button::after {
        -webkit-transform: translateX(36%) translateY(-30%) rotate(45deg);
        -moz-transform: translateX(36%) translateY(-30%) rotate(45deg);
        -o-transform: translateX(36%) translateY(-30%) rotate(45deg);
        -ms-transform: translateX(36%) translateY(-30%) rotate(45deg);
        transform: translateX(36%) translateY(-30%) rotate(45deg);
    }

    .accordion__list--tertiary BUTTON.accordion__chevron-button:hover::after, .accordion__list--tertiary BUTTON.accordion__chevron-button:hover::before {
        background-color: #FF2D55;
    }

.accordion__item--tertiary BUTTON.accordion__chevron-button {
    position: absolute;
    z-index: 1600;
    display: block;
    top: 15px;
    right: 15px;
    height: 24px;
    width: 24px;
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -ms-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

    .accordion__item--tertiary BUTTON.accordion__chevron-button::after, .accordion__item--tertiary BUTTON.accordion__chevron-button::before {
        /* lines of '>' icon */
        content: '';
        position: absolute;
        height: 1px;
        width: 12px;
        left: 30%;
        top: 50%;
        background-color: #058C83;
        -webkit-backface-visibility: hidden;
        -moz-backface-visibility: hidden;
        -ms-backface-visibility: hidden;
        -o-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-transition: background-color 0.4s ease;
        -moz-transition: background-color 0.4s ease;
        -ms-transition: background-color 0.4s ease;
        -o-transition: background-color 0.4s ease;
        transition: background-color 0.4s ease;
    }

    .accordion__item--tertiary BUTTON.accordion__chevron-button::before {
        -webkit-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        -moz-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        -o-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        -ms-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        transform: translateX(-36%) translateY(-30%) rotate(-45deg);
    }

    .accordion__item--tertiary BUTTON.accordion__chevron-button::after {
        -webkit-transform: translateX(36%) translateY(-30%) rotate(45deg);
        -moz-transform: translateX(36%) translateY(-30%) rotate(45deg);
        -o-transform: translateX(36%) translateY(-30%) rotate(45deg);
        -ms-transform: translateX(36%) translateY(-30%) rotate(45deg);
        transform: translateX(36%) translateY(-30%) rotate(45deg);
    }

    .accordion__item--tertiary BUTTON.accordion__chevron-button:hover::after, .accordion__item--tertiary BUTTON.accordion__chevron-button:hover::before {
        background-color: #FF2D55;
    }

/* ======== ACCORDION CODE ======== */
.accordion.accordion--code {
    margin-top: 20px;
}

/* ---- ACCORDION ITEM ---- */
/* ---- ACCORDION ELEMENTS ---- */
.accordion--code .accordion__bar {
    padding: 16px 120px 16px 16px;
    background-color: #f9f9f9;
}

    .accordion--code .accordion__bar:hover {
        background-color: #e6e6e6;
    }

.accordion--code H4.accordion__item-heading {
    font-size: 1.28rem;
    font-weight: 600;
    line-height: 0.9;
    margin-bottom: 0;
    font-family: 'Invention', sans-serif;
    color: #FBE122;
    text-transform: uppercase;
}

.accordion--code .accordion__list--primary H4.accordion__item-heading {
    font-family: 'Invention', sans-serif;
    color: #FBE122;
    text-transform: uppercase;
}

.accordion--code .accordion__item--primary H4.accordion__item-heading {
    font-family: 'Invention', sans-serif;
    color: #FBE122 !important;
    text-transform: initial;
}

.accordion--code .accordion__list--secondary H4.accordion__item-heading {
    font-family: 'Invention', sans-serif;
    color: #0C2340;
    text-transform: uppercase;
}

.accordion--code .accordion__item--secondary H4.accordion__item-heading {
    font-family: 'Invention', sans-serif;
    color: #0C2340 !important;
    text-transform: initial;
}

.accordion--code .accordion__list--tertiary H4.accordion__item-heading {
    font-family: 'Invention', sans-serif;
    color: #058C83;
    text-transform: uppercase;
}

.accordion--code .accordion__item--tertiary H4.accordion__item-heading {
    font-family: 'Invention', sans-serif;
    color: #058C83 !important;
    text-transform: initial;
}

.accordion--code BUTTON.accordion__expand-button {
    position: absolute;
    z-index: 1600;
    display: block;
    top: 12px;
    right: 12px;
    height: 20px;
    width: 20px;
    border-radius: 50%;
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
}

    .accordion--code BUTTON.accordion__expand-button::after, .accordion--code BUTTON.accordion__expand-button::before {
        /* lines of 'X' icon */
        content: '';
        position: absolute;
        height: 2px;
        width: 20px;
        left: 50%;
        top: 50%;
        background-color: #058C83;
        -webkit-backface-visibility: hidden;
        -moz-backface-visibility: hidden;
        -ms-backface-visibility: hidden;
        -o-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-transition: all 0.4s ease;
        -moz-transition: all 0.4s ease;
        -ms-transition: all 0.4s ease;
        -o-transition: all 0.4s ease;
        transition: all 0.4s ease;
    }

    .accordion--code BUTTON.accordion__expand-button::after {
        -webkit-transform: translateX(-50%) translateY(-50%) rotate(0deg);
        -moz-transform: translateX(-50%) translateY(-50%) rotate(0deg);
        -o-transform: translateX(-50%) translateY(-50%) rotate(0deg);
        -ms-transform: translateX(-50%) translateY(-50%) rotate(0deg);
        transform: translateX(-50%) translateY(-50%) rotate(0deg);
    }

    .accordion--code BUTTON.accordion__expand-button::before {
        -webkit-transform: translateX(-50%) translateY(-50%) rotate(-90deg);
        -moz-transform: translateX(-50%) translateY(-50%) rotate(-90deg);
        -o-transform: translateX(-50%) translateY(-50%) rotate(-90deg);
        -ms-transform: translateX(-50%) translateY(-50%) rotate(-90deg);
        transform: translateX(-50%) translateY(-50%) rotate(-90deg);
    }

    .accordion--code BUTTON.accordion__expand-button:hover::after, .accordion--code BUTTON.accordion__expand-button:hover::before {
        background-color: #07bdb1;
    }

.accordion--code .accordion__panel {
    clear: both;
    background-color: #f9f9f9;
    opacity: 0;
    overflow: hidden;
    -webkit-transition: all 0.4s ease-out;
    -moz-transition: all 0.4s ease-out;
    -ms-transition: all 0.4s ease-out;
    -o-transition: all 0.4s ease-out;
    transition: all 0.4s ease-out;
}

.accordion--code LI.accordion__item.accordion__item--closed .accordion__panel {
    -webkit-box-flex: 0 0 0px;
    -webkit-flex: 0 0 0px;
    -moz-flex: 0 0 0px;
    -ms-flex: 0 0 0px;
    flex: 0 0 0px;
    max-height: 0;
    padding: 0 20px;
    opacity: 0;
}

    .accordion--code LI.accordion__item.accordion__item--closed .accordion__panel * {
        font-size: 0 !important;
        -webkit-transition: all 0.4s ease-out 0.4s;
        -moz-transition: all 0.4s ease-out 0.4s;
        -ms-transition: all 0.4s ease-out 0.4s;
        -o-transition: all 0.4s ease-out 0.4s;
        transition: all 0.4s ease-out 0.4s;
    }

.accordion--code LI.accordion__item.accordion__item--open .accordion__panel {
    -webkit-box-flex: 1 1 auto;
    -webkit-flex: 1 1 auto;
    -moz-flex: 1 1 auto;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    /*max-height:2000px;*/
    padding: 4px 20px 20px;
    opacity: 1;
}

    .accordion--code LI.accordion__item.accordion__item--open .accordion__panel *:last-child {
        margin-bottom: 0;
    }

.accordion--code LI.accordion__item.accordion__item--open .accordion__expand-button:before {
    -webkit-transform: translateX(-50%) translateY(-50%) rotate(0deg);
    -moz-transform: translateX(-50%) translateY(-50%) rotate(0deg);
    -o-transform: translateX(-50%) translateY(-50%) rotate(0deg);
    -ms-transform: translateX(-50%) translateY(-50%) rotate(0deg);
    transform: translateX(-50%) translateY(-50%) rotate(0deg);
}

/* ============================================================== MEDIA QUERIES ============================================================== */
/* ---- DESKTOP (1440px +) ---- */
@media only screen and (min-width: 1440px) {
    /* ---- ACCORDION ELEMENTS ---- */
    LABEL.accordion__item-label,
    TIME.accordion__item-time,
    INS.accordion__item-detail {
        font-size: 1.28rem;
    }
}

/* ---- LARGE TABLET & LAPTOP (960px - 1439px) ---- */
@media only screen and (min-width: 960px) and (max-width: 1439px) {
    /* ---- POSTING GROUPS ---- */
    .accordion__item--open .accordion__bar.accordion__bar--fixed {
        width: 100%;
        left: 0;
        margin-left: 0;
    }
    /* ---- ACCORDION ELEMENTS ---- */
    LABEL.accordion__item-label,
    TIME.accordion__item-time,
    INS.accordion__item-detail {
        font-size: 1.1rem;
    }
}

/* ---- MOBILE & SMALL TABLET (0 - 959px) ---- */
@media only screen and (max-width: 959px) {
    /* ---- ACCORDION STRUCTURE ---- */
    .accordion.accordion--desktop-only {
        display: none;
    }

    .accordion.accordion--mobile-only {
        display: block;
    }
    /* ---- ACCORDION ALT VERSION ---- */
    .accordion.accordion--alt LI.accordion__item.accordion__item--open .accordion__panel {
        padding: 0 20px 24px;
    }

    .accordion.accordion--alt UL.accordion__list {
        padding: 0 16px 24px;
    }
    /* ---- ACCORDION ELEMENTS ---- */
    LABEL.accordion__item-label,
    TIME.accordion__item-time,
    INS.accordion__item-detail {
        font-size: 1.1rem;
    }

    .panel-header-content > .flex-column-wrap > .flex-column:nth-child(3), .panel-header-content > .flex-column-wrap > .flex-column:nth-child(4) {
        display: none;
    }

    .panelbar-dock .panel-header-content > .flex-column-wrap > .flex-column:nth-child(3), .panelbar-dock .panel-header-content > .flex-column-wrap > .flex-column:nth-child(4) {
        display: block;
    }
}

/* ---- SMALL MOBILE (0 - 479px) ---- */
@media only screen and (max-width: 479px) {
    /* ---- ACCORDION ITEM ---- */
    LI.accordion__item {
        margin-bottom: 1px;
    }
    /* ---- ACCORDION ELEMENTS ---- */
    .accordion__bar {
        padding: 24px 80px 24px 0;
    }

        .accordion__bar:before, .accordion__bar:after {
            content: '';
            position: absolute;
            z-index: 0;
            top: 0;
            width: 100%;
            height: 100%;
            background-color: #A1AEB4;
            -webkit-transition: background-color 0.4s ease-out;
            -moz-transition: background-color 0.4s ease-out;
            -ms-transition: background-color 0.4s ease-out;
            -o-transition: background-color 0.4s ease-out;
            transition: background-color 0.4s ease-out;
        }

        .accordion__bar:before {
            left: -100%;
        }

        .accordion__bar:after {
            right: -100%;
        }

        .accordion__bar:hover:before, .accordion__bar:hover:after {
            background-color: #93a2a9;
        }

    MAIN H4.accordion__item-heading {
        font-size: 1.6rem;
        font-weight: 700;
        line-height: 0.9;
        margin-bottom: 0;
    }

    LI.accordion__item.accordion__item--closed .accordion__panel {
        padding: 0;
    }

    LI.accordion__item.accordion__item--open .accordion__panel {
        padding: 24px 0;
    }
    /* ---- ACCORDION ALT VERSION ---- */
    .accordion.accordion--alt .accordion__bar:before {
        display: none;
        left: 0;
    }

    .accordion.accordion--alt .accordion__bar:after {
        display: none;
        right: 0;
    }

    .accordion.accordion--alt .accordion__bar:hover:before, .accordion.accordion--alt .accordion__bar:hover:after {
        background-color: transparent;
    }
}

/* ===========================================================

	$CHARTS

=========================================================== */
/* ---- CHART CONTAINERS ---- */
H4.chart-group-title {
    font-size: 1.6rem;
    font-weight: 400;
    line-height: 1.1;
    margin-bottom: 0;
    font-family: 'Invention', sans-serif;
    font-style: normal;
    color: #FBE122;
    text-transform: capitalize;
    padding: 20px 20px 0;
    text-align: center;
}

.chart__group-wrap {
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- */
    display: -ms-flexbox;
    /* OLD - TWEENER - IE 10 */
    display: -webkit-flex;
    /* RECENT - Chrome */
    display: flex;
    /* NEW - Firefox, Chrome, Opera, IE11 */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: stretch;
    align-items: stretch;
    -webkit-align-content: flex-start;
    align-content: flex-start;
}

    .chart__group-wrap.chart__group-wrap--two-tone {
        position: relative;
        overflow: hidden;
    }

        .chart__group-wrap.chart__group-wrap--two-tone:before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            height: 35%;
            background-color: #0b213c;
            border-bottom: 1px solid #102f55;
            border-top-left-radius: 6px;
            border-top-right-radius: 6px;
        }

.chart__column {
    -webkit-box-flex: 0 1 auto;
    -webkit-flex: 0 1 auto;
    -moz-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    max-width: none;
}

    .chart__column.chart__column--secondary {
        -webkit-box-flex: 0 1 40%;
        -webkit-flex: 0 1 40%;
        -moz-flex: 0 1 40%;
        -ms-flex: 0 1 40%;
        flex: 0 1 40%;
        max-width: 40%;
    }

    .chart__column.chart__column--tertiary {
        -webkit-box-flex: 0 1 33%;
        -webkit-flex: 0 1 33%;
        -moz-flex: 0 1 33%;
        -ms-flex: 0 1 33%;
        flex: 0 1 33%;
        max-width: 33%;
    }

    .chart__column.chart__column--quarternary {
        -webkit-box-flex: 0 1 25%;
        -webkit-flex: 0 1 25%;
        -moz-flex: 0 1 25%;
        -ms-flex: 0 1 25%;
        flex: 0 1 25%;
        max-width: 25%;
    }

    .chart__column.chart__column--quinary {
        -webkit-box-flex: 0 1 16%;
        -webkit-flex: 0 1 16%;
        -moz-flex: 0 1 16%;
        -ms-flex: 0 1 16%;
        flex: 0 1 16%;
        max-width: 16%;
    }

.chart__block {
    margin-bottom: 48px;
}

#coccidiosisChart.chart__block {
    margin-bottom: 0;
}

/* ---- DOUGHNUT CHARTS ---- */
.chart__box {
    padding: 32px 16px 20px;
}

.chart__header {
    min-height: 32px;
    padding: 6px 0;
}

.chart__main {
    position: relative;
}

    .chart__main.chart__main--sub-top {
        padding-top: 48px;
    }

    .chart__main.chart__main--sub-bottom {
        padding-bottom: 48px;
    }

.chart__title {
    font-size: 1.28rem;
    font-weight: 400;
    line-height: 1.1;
    margin-bottom: 12px;
    font-family: 'Invention', sans-serif;
    font-style: normal;
    color: inherit;
    text-transform: uppercase;
    text-align: center;
    word-wrap: break-word;
}

.chart__wrap {
    position: relative;
    margin-bottom: 12px;
}

.chart__center-text {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    /* Chrome, Safari 8+, Opera 15.0+ */
    -webkit-transform: -webkit-translate(-50%, -50%);
    /* Safari 7 */
    -moz-transform: translate(-50%, -50%);
    /* Firefox */
    -ms-transform: translate(-50%, -50%);
    /* IE 9 */
    -o-transform: translate(-50%, -50%);
    /* Opera 10.5 - 15.0 */
    transform: translate(-50%, -50%);
    font-size: 3.90625rem;
    font-weight: 600;
    color: #0C2340;
}

    .chart__center-text SMALL {
        font-size: 1.6rem;
        color: #FFF;
    }

        .chart__center-text SMALL.extra-small {
            font-size: 1.1rem;
        }

.chart__container {
    position: relative;
    margin-bottom: 12px;
    width: 100%;
    padding: 10px;
}

.bar-container {
    background-color: #f0f0f0;
    width: 100%;
    height: 5px;
    border-radius: 5px;
    overflow: hidden;
}

.bar {
    height: 100%;
    transition: width 0.3s ease-in-out;
}

.chart__canvas {
    max-width: 100%;
    /*max-width:180px; height:140px;*/
}

.chart__label {
    display: none;
    /* Hidden for now */
    text-align: center;
    font-size: 1.28rem;
    font-weight: 600;
    color: #768A98;
}

.sub-chart__wrap {
    position: absolute;
    top: -10px;
    left: -20px;
    max-width: 72px;
    /*margin-bottom:$spaceSize-minor;*/
}

.sub-chart__center-text {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    /* Chrome, Safari 8+, Opera 15.0+ */
    -webkit-transform: -webkit-translate(-50%, -50%);
    /* Safari 7 */
    -moz-transform: translate(-50%, -50%);
    /* Firefox */
    -ms-transform: translate(-50%, -50%);
    /* IE 9 */
    -o-transform: translate(-50%, -50%);
    /* Opera 10.5 - 15.0 */
    transform: translate(-50%, -50%);
    font-size: 2rem;
    font-weight: 600;
    color: #768A98;
}

    .sub-chart__center-text SMALL {
        font-size: 1.1rem;
        color: #FFF;
    }

        .sub-chart__center-text SMALL.extra-small {
            font-size: 0.9rem;
        }

.sub-chart__container {
    position: relative;
    /*margin-bottom:$spaceSize-minor;*/
}

    .sub-chart__container:after {
        content: '';
        position: absolute;
        bottom: -2px;
        right: -10px;
        width: 32px;
        height: 8px;
        background-color: #08172b;
        -webkit-transform: rotate(-125deg);
        -moz-transform: rotate(-125deg);
        -o-transform: rotate(-125deg);
        -ms-transform: rotate(-125deg);
        transform: rotate(-125deg);
    }

.sub-chart__canvas {
    max-width: 100%;
    /*max-width:180px; height:140px;*/
}

.sub-chart__label {
    display: block;
    text-align: center;
    font-size: 0.9rem;
    font-weight: 500;
    color: #768A98;
}

/* ---- DOUGHNUT CHART LEGEND ---- */
.chart__legend {
    position: relative;
    height: 100%;
}

.chart__legend-top {
    position: relative;
    height: 35%;
    padding: 16px;
}

.chart__legend-bottom {
    position: relative;
    height: 65%;
    padding: 16px;
}

.chart__legend-label {
    display: block;
    margin-bottom: 8px;
    font-size: 1.28rem;
    font-weight: 600;
    color: #768A98;
}

    .chart__legend-label.chart__legend-label--current {
        font-size: 1.6rem;
        font-weight: 600;
    }

.chart__legend-link {
    font-size: 1.28rem;
    font-weight: 400;
    color: #FBE122;
    -webkit-transition: color 0.4s ease;
    -moz-transition: color 0.4s ease;
    -ms-transition: color 0.4s ease;
    -o-transition: color 0.4s ease;
    transition: color 0.4s ease;
}

    .chart__legend-link:hover {
        color: #fce854;
    }

    .chart__legend-link:active {
        color: #FBE122;
    }

/* ---- SVG DOUGHNUT CHART (V2) ---- */
.circular-chart {
    display: block;
    margin: 10px auto;
    max-width: 80%;
    max-height: 200px;
}

.circle-bg {
    fill: none;
    stroke: #f0f0f0;
    stroke-width: 2.8;
}

.sub-circle-bg {
    fill: none;
    stroke: rgba(0, 0, 0, 0.25);
    stroke-width: 4.2;
}

.circle {
    fill: none;
    stroke-width: 2.4;
    stroke-linecap: round;
    /* stroke: #058C83; */
    animation: progress 1s ease-out forwards;
}

.sub-circle {
    fill: none;
    stroke-width: 3.2;
    stroke-linecap: round;
    stroke: #768A98;
    animation: progress 1s ease-out forwards;
}

.circular-chart.orange .circle {
    stroke: #ff9f00;
}

.circular-chart.green .circle {
    stroke: #4CC790;
}

.circular-chart.blue .circle {
    stroke: #3c9ee5;
}

.percentage {
    fill: #666;
    font-family: 'Invention', sans-serif;
    font-size: 0.5em;
    text-anchor: middle;
}

.sub-chart__center-text {
    color: #768A98;
}

@keyframes progress {
    0% {
        stroke-dasharray: 0 100;
    }
}

/* ---- CHART BOX THEME ---- */
.chart__box.chart__box--excellent .chart__center-text,
.chart__box.chart__box--excellent .percentage {
    color: #6ECEB2;
}

.chart__box.chart__box--excellent .circle {
    /* stroke: #6ECEB2; */
}

.chart__box.chart__box--good .chart__center-text,
.chart__box.chart__box--good .percentage {
    color: #6ECEB2;
}

.chart__box.chart__box--good .circle {
    /* stroke: #007d75; */
}

.chart__box.chart__box--fair .chart__center-text,
.chart__box.chart__box--fair .percentage {
    color: #F48E22;
}

.chart__box.chart__box--fair .circle {
    /* stroke: #F48E22; */
}

.chart__box.chart__box--poor .chart__center-text,
.chart__box.chart__box--poor .percentage {
    color: #F48E22;
}

.chart__box.chart__box--poor .circle {
    stroke: #F48E22;
}

.chart__box.chart__box--bad .chart__center-text,
.chart__box.chart__box--bad .percentage {
    color: #FF2D55;
}

.chart__box.chart__box--bad .circle {
    /* stroke: #FF2D55; */
}

.chart__box.chart__box--na .chart__center-text,
.chart__box.chart__box--na .percentage,
.chart__box.chart__box--base .chart__center-text,
.chart__box.chart__box--base .percentage {
    color: #414E54;
}

.chart__box.chart__box--na .circle,
.chart__box.chart__box--base .circle {
    stroke: #414E54;
}

.chart__box.chart__box--primary .chart__center-text,
.chart__box.chart__box--primary .percentage {
    color: #FBE122;
}

.chart__box.chart__box--primary .circle {
    stroke: #FBE122;
}

.chart__box.chart__box--secondary .chart__center-text,
.chart__box.chart__box--secondary .percentage {
    color: #0C2340;
}

.chart__box.chart__box--secondary .circle {
    stroke: #0C2340;
}

.chart__box.chart__box--tertiary .chart__center-text,
.chart__box.chart__box--tertiary .percentage {
    color: #058C83;
}

.chart__box.chart__box--tertiary .circle {
    stroke: #058C83;
}

.chart__box.chart__box--quarternary .chart__center-text,
.chart__box.chart__box--quarternary .percentage {
    color: #FF2D55;
}

.chart__box.chart__box--quarternary .circle {
    stroke: #FF2D55;
}

.chart__box.chart__box--quinary .chart__center-text,
.chart__box.chart__box--quinary .percentage {
    color: #F48E22;
}

.chart__box.chart__box--quinary .circle {
    stroke: #F48E22;
}

.chart__box.chart__box--senary .chart__center-text,
.chart__box.chart__box--senary .percentage {
    color: #2B85BA;
}

.chart__box.chart__box--senary .circle {
    stroke: #2B85BA;
}

.chart__box.chart__box--septenary .chart__center-text,
.chart__box.chart__box--septenary .percentage {
    color: #C77731;
}

.chart__box.chart__box--septenary .circle {
    stroke: #C77731;
}

.chart__box.chart__box--octonary .chart__center-text,
.chart__box.chart__box--octonary .percentage {
    color: #6ECEB2;
}

.chart__box.chart__box--octonary .circle {
    stroke: #6ECEB2;
}

/* HIGH-CHARTS */
BODY.theme .highcharts-credits {
    display: none;
}

/* HIGH-CHARTS LEGEND */
.highcharts-legend {
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}

    .highcharts-legend:hover {
        opacity: 0.8;
    }

.highcharts-legend-title:after {
    content: "\e989";
    display: inline-block;
    width: 16px;
    height: 16px;
    font-family: "IcoMoon Basic";
    color: #058C83;
    -webkit-transition: color 0.4s ease;
    -moz-transition: color 0.4s ease;
    -ms-transition: color 0.4s ease;
    -o-transition: color 0.4s ease;
    transition: color 0.4s ease;
}

    .highcharts-legend-title:after:hover {
        color: #07bdb1;
    }

    .highcharts-legend-title:after:active {
        color: #058C83;
    }

/* ============================================================== MEDIA QUERIES ============================================================== */
/* ---- LARGE DESKTOP (1600px +) ---- */
/* ---- SMALL DESKTOP (1440px - 1599px) ---- */
/* ---- LAPTOP (1280px - 1439px) ---- */
/* ---- TABLET (0 - 1279px) ---- */
@media only screen and (max-width: 1279px) {
    /* ---- DOUGHNUT CHART CONTAINERS ---- */
    .chart__column {
        -webkit-box-flex: 1 1 19%;
        -webkit-flex: 1 1 19%;
        -moz-flex: 1 1 19%;
        -ms-flex: 1 1 19%;
        flex: 1 1 19%;
    }
    /* ---- DOUGHNUT CHARTS ---- */
    .chart__center-text {
        font-size: 2.5rem;
    }

        .chart__center-text SMALL {
            font-size: 1.1rem;
        }

            .chart__center-text SMALL.extra-small {
                font-size: 0.9rem;
            }

    .sub-chart__wrap {
        top: -16px;
        left: -10px;
        max-width: 64px;
    }

    .sub-chart__center-text {
        font-size: 1.504rem;
    }

        .sub-chart__center-text SMALL {
            font-size: 1rem;
        }

            .sub-chart__center-text SMALL.extra-small {
                font-size: 0.7rem;
            }

    .sub-chart__container:after {
        bottom: -6px;
        right: -5px;
        width: 28px;
        height: 8px;
        -webkit-transform: rotate(-125deg);
        -moz-transform: rotate(-125deg);
        -o-transform: rotate(-125deg);
        -ms-transform: rotate(-125deg);
        transform: rotate(-125deg);
    }
    /* ---- DOUGHNUT CHART LEGEND ---- */
    .chart__legend-top,
    .chart__legend-bottom {
        padding: 10px;
    }
    /* ---- SVG DOUGHNUT CHART (V2) ---- */
    .sub-circle-bg {
        stroke-width: 4;
    }

    .sub-circle {
        stroke-width: 3;
    }
}

/* ---- MOBILE TO SMALL TABLET (0 - 959px) ---- */
@media only screen and (max-width: 959px) {
    /* ---- DOUGHNUT CHART CONTAINERS ---- */
    .chart__group-wrap.chart__group-wrap--two-tone {
        height: 100%;
        padding-top: 24px;
    }

    .chart__column.chart__column--large-only {
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        max-width: 100% !important;
    }

    .chart__legend-top {
        display: -webkit-box;
        /* OLD - iOS 6-, Safari 3.1-6 */
        display: -moz-box;
        /* OLD - Firefox 19- */
        display: -ms-flexbox;
        /* OLD - TWEENER - IE 10 */
        display: -webkit-flex;
        /* RECENT - Chrome */
        display: flex;
        /* NEW - Firefox, Chrome, Opera, IE11 */
        -webkit-flex-direction: row;
        -moz-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-justify-content: flex-start;
        justify-content: flex-start;
        -webkit-align-items: stretch;
        align-items: stretch;
        -webkit-align-content: flex-start;
        align-content: flex-start;
        position: absolute;
        height: 40px;
        top: 0;
        left: 0;
        right: 0;
        padding: 10px;
    }

    .chart__legend-bottom {
        display: -webkit-box;
        /* OLD - iOS 6-, Safari 3.1-6 */
        display: -moz-box;
        /* OLD - Firefox 19- */
        display: -ms-flexbox;
        /* OLD - TWEENER - IE 10 */
        display: -webkit-flex;
        /* RECENT - Chrome */
        display: flex;
        /* NEW - Firefox, Chrome, Opera, IE11 */
        -webkit-flex-direction: row;
        -moz-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-align-items: stretch;
        align-items: stretch;
        -webkit-align-content: flex-start;
        align-content: flex-start;
        position: absolute;
        height: 40px;
        bottom: 0;
        left: 0;
        right: 0;
        padding: 10px;
        text-align: center;
    }
    /* ---- DOUGHNUT CHARTS ---- */
    .chart__box {
        padding: 16px;
    }

    .sub-chart__wrap {
        top: -8px;
        left: 0;
        max-width: 54px;
    }

    .chart__legend-label.chart__legend-label--current {
        -webkit-box-flex: 1 1 auto;
        -webkit-flex: 1 1 auto;
        -moz-flex: 1 1 auto;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
        font-size: 1.28rem;
    }

    .chart__legend-label.chart__legend-label--previous {
        -webkit-box-flex: 0 1 50%;
        -webkit-flex: 0 1 50%;
        -moz-flex: 0 1 50%;
        -ms-flex: 0 1 50%;
        flex: 0 1 50%;
    }

    .chart__legend-link {
        -webkit-box-flex: 0 1 50%;
        -webkit-flex: 0 1 50%;
        -moz-flex: 0 1 50%;
        -ms-flex: 0 1 50%;
        flex: 0 1 50%;
    }
}

/* ---- SMALL TABLET (600px - 959px) ---- */
@media only screen and (min-width: 600px) and (max-width: 959px) {
    /* ---- DOUGHNUT CHART CONTAINERS ---- */
    .chart__column {
        -webkit-box-flex: 0 1 33%;
        -webkit-flex: 0 1 33%;
        -moz-flex: 0 1 33%;
        -ms-flex: 0 1 33%;
        flex: 0 1 33%;
        max-width: 33%;
    }

        .chart__column.chart__column--secondary {
            -webkit-box-flex: 0 1 33%;
            -webkit-flex: 0 1 33%;
            -moz-flex: 0 1 33%;
            -ms-flex: 0 1 33%;
            flex: 0 1 33%;
            max-width: 33%;
        }

        .chart__column.chart__column--tertiary {
            -webkit-box-flex: 0 1 33%;
            -webkit-flex: 0 1 33%;
            -moz-flex: 0 1 33%;
            -ms-flex: 0 1 33%;
            flex: 0 1 33%;
            max-width: 33%;
        }

        .chart__column.chart__column--quarternary {
            -webkit-box-flex: 0 1 33%;
            -webkit-flex: 0 1 33%;
            -moz-flex: 0 1 33%;
            -ms-flex: 0 1 33%;
            flex: 0 1 33%;
            max-width: 33%;
        }

        .chart__column.chart__column--quinary {
            -webkit-box-flex: 0 1 33%;
            -webkit-flex: 0 1 33%;
            -moz-flex: 0 1 33%;
            -ms-flex: 0 1 33%;
            flex: 0 1 33%;
            max-width: 33%;
        }
}

/* ---- MOBILE (0 - 599px) ---- */
@media only screen and (max-width: 599px) {
    /* ---- DOUGHNUT CHART CONTAINERS ---- */
    .chart__group-wrap {
        display: -webkit-box;
        /* OLD - iOS 6-, Safari 3.1-6 */
        display: -moz-box;
        /* OLD - Firefox 19- */
        display: -ms-flexbox;
        /* OLD - TWEENER - IE 10 */
        display: -webkit-flex;
        /* RECENT - Chrome */
        display: flex;
        /* NEW - Firefox, Chrome, Opera, IE11 */
        -webkit-flex-direction: column;
        -moz-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-justify-content: flex-start;
        justify-content: flex-start;
        -webkit-align-items: stretch;
        align-items: stretch;
        -webkit-align-content: flex-start;
        align-content: flex-start;
    }

    .chart__column {
        -webkit-box-flex: 1 1 auto;
        -webkit-flex: 1 1 auto;
        -moz-flex: 1 1 auto;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
        max-width: 100%;
    }
    /* ---- DOUGHNUT CHARTS ---- */
    .chart__box {
        padding: 16px;
    }
}

/* ===========================================================

	$DROPDOWN MENUS (2019)
    Select boxes with a custom theme

=========================================================== */
.dropdown-menu {
    /*display: inline-block;*/
    position: relative;
    overflow: visible;
    font-size: 1.28rem;
}

.dropdown-menu__link {
    display: inline-block;
    position: relative;
    min-width: 240px;
    padding: 6px 16px;
    margin-left: 10px;
    border: 1px solid #ececec;
    border-radius: 2px;
    background-color: transparent;
    color: #FBE122;
    -webkit-transition: color 0.4s ease;
    -moz-transition: color 0.4s ease;
    -ms-transition: color 0.4s ease;
    -o-transition: color 0.4s ease;
    transition: color 0.4s ease;
    font-weight: 600;
    text-align: left;
}

    .dropdown-menu__link:hover {
        color: #fce854;
    }

    .dropdown-menu__link:active {
        color: #FBE122;
    }

    .dropdown-menu__link:after {
        content: '';
        position: absolute;
        top: 12px;
        right: 12px;
        width: 0;
        height: 0;
        border-top: 6px solid #414E54;
        border-left: 6px solid transparent;
        border-right: 6px solid transparent;
    }

.dropdown-menu__dropdown {
    position: absolute;
    z-index: 1800;
    top: 32px;
    left: 10px;
    width: 240px;
    height: auto;
    max-height: 0;
    background-color: #0C2340;
    opacity: 0;
    overflow: hidden;
    font-family: 'Invention', sans-serif;
    font-size: inherit;
    font-weight: 500;
    color: #414E54;
    -webkit-transition: max-height 0.4s ease-out, opacity 0.4s ease-in;
    -moz-transition: max-height 0.4s ease-out, opacity 0.4s ease-in;
    -ms-transition: max-height 0.4s ease-out, opacity 0.4s ease-in;
    -o-transition: max-height 0.4s ease-out, opacity 0.4s ease-in;
    transition: max-height 0.4s ease-out, opacity 0.4s ease-in;
}

.dropdown-menu:hover .dropdown-menu__dropdown {
    max-height: 640px;
    opacity: 1;
}

.dropdown-menu__option {
    display: block;
    width: 100%;
    height: auto;
    min-height: 40px;
    padding: 8px;
    text-align: left;
    font-family: 'Invention', sans-serif;
    font-size: inherit;
    font-weight: inherit;
    color: inherit;
    color: #FFF;
    -webkit-transition: color 0.4s ease;
    -moz-transition: color 0.4s ease;
    -ms-transition: color 0.4s ease;
    -o-transition: color 0.4s ease;
    transition: color 0.4s ease;
    -webkit-transition: background-color 0.4s ease;
    -moz-transition: background-color 0.4s ease;
    -ms-transition: background-color 0.4s ease;
    -o-transition: background-color 0.4s ease;
    transition: background-color 0.4s ease;
}

    .dropdown-menu__option:hover {
        color: #e6e6e6;
    }

    .dropdown-menu__option:active {
        color: #FFF;
    }

    .dropdown-menu__option:hover {
        background-color: #0C2340;
    }

/* ---- VARIATIONS ---- */
.box__header-expander .dropdown-menu__link {
    border-color: rgba(251, 225, 34, 0.2);
}

/* ============================================================== MEDIA QUERIES ============================================================== */
/* ---- TABLET, LAPTOP & DESKTOP (960px +) ---- */
/* ---- MOBILE & SMALL TABLET (0 - 959px) ---- */
/* ===========================================================

	DIALOGS & MODALS (2019)

=========================================================== */
.dialog-wrap.dialog--open:after {
    content: '';
    display: block;
    position: fixed;
    z-index: 8900;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: rgba(0, 0, 0, 0.5);
}

/* ---- MENU DIALOG BUTTONS ---- */
.dialog-wrap.dialog--open .button.dialog-button {
    position: relative;
    z-index: 9200;
}

/* ---- MENU DIALOG BOXES ---- */
.menu-dialog {
    position: absolute;
    z-index: 9000;
    padding: 20px;
    background-color: #FBE122;
    overflow: hidden;
    -webkit-box-shadow: 0 6px 8px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0 6px 8px rgba(0, 0, 0, 0.1);
    box-shadow: 0 6px 8px rgba(0, 0, 0, 0.1);
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -ms-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

.dialog-wrap.dialog--closed .menu-dialog {
    /*display:none;*/
    max-height: 0;
    padding: 0 20px;
    opacity: 0;
    visibility: hidden;
}

.dialog-wrap.dialog--open .menu-dialog {
    /*display:block;*/
    max-height: none;
    padding: 20px;
    opacity: 1;
    visibility: visible;
}

/* ---- SPECIFIC DIALOG BOXES ---- */
.menu-dialog.menu-dialog--create-evaluations {
    top: -12px;
    right: -20px;
    min-width: 714px;
}

.dialog-wrap.dialog--open .menu-dialog.menu-dialog--create-evaluations {
    padding-top: 64px;
}

/* ---- LAYOUT ---- */
/* ===========================================================

	$BODY (v2 2018)

=========================================================== */
HTML, BODY {
    height: 100%;
}

BODY {
    background-color: #FFF;
}

.page-limits {
    clear: both;
    width: 100%;
    max-width: 100%;
    padding: 0;
    margin: 0 auto;
}

/* ============================================================== MEDIA QUERIES ============================================================== */
/* ---- LARGE DESKTOP (1600px +) ---- */
/* ---- SMALL DESKTOP (1440px - 1599px) ---- */
/* ---- LAPTOP (1280px - 1439px) ---- */
/* ---- LARGE TABLET (960px - 1279px) ---- */
/* ---- SMALL TABLET (640px - 959px) ---- */
/* ---- LARGE MOBILE (480px - 639px) ---- */
/* ---- SMALL MOBILE (0 - 479px) ---- */
/* ===========================================================

	$FIXED (v2 2018)

=========================================================== */
/* ---- FIXED HEADER ---- */
.fixed-nav__dock {
    clear: both;
    height: 60px;
}

/* ============================================================== MEDIA QUERIES ============================================================== */
/* ---- LARGE DESKTOP (1600px +) ---- */
/* ---- SMALL DESKTOP (1440px - 1599px) ---- */
/* ---- LAPTOP (1280px - 1439px) ---- */
/* ---- TABLET (960px - 1279px) ---- */
/* ---- LARGE MOBILE (640px - 959px) ---- */
/* ---- MEDIUM MOBILE (480px - 639px) ---- */
/* ---- SMALL MOBILE (0 - 479px) ---- */
/* ===========================================================

	$NAV (v2 2018)

=========================================================== */
/* ---- HEADER NAVIGATION ---- */
.header-nav {
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- */
    display: -ms-flexbox;
    /* OLD - TWEENER - IE 10 */
    display: -webkit-flex;
    /* RECENT - Chrome */
    display: flex;
    /* NEW - Firefox, Chrome, Opera, IE11 */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: left;
    justify-content: left;
    -webkit-align-items: stretch;
    align-items: stretch;
    -webkit-align-content: flex-start;
    align-content: flex-start;
}

    .header-nav.header-nav--side {
        display: -webkit-box;
        /* OLD - iOS 6-, Safari 3.1-6 */
        display: -moz-box;
        /* OLD - Firefox 19- */
        display: -ms-flexbox;
        /* OLD - TWEENER - IE 10 */
        display: -webkit-flex;
        /* RECENT - Chrome */
        display: flex;
        /* NEW - Firefox, Chrome, Opera, IE11 */
        -webkit-flex-direction: column;
        -moz-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-justify-content: flex-start;
        justify-content: flex-start;
        -webkit-align-items: stretch;
        align-items: stretch;
        -webkit-align-content: flex-start;
        align-content: flex-start;
    }

    .header-nav .nav__link {
        -webkit-box-flex: 0 1 auto;
        -webkit-flex: 0 1 auto;
        -moz-flex: 0 1 auto;
        -ms-flex: 0 1 auto;
        flex: 0 1 auto;
        padding: 10px 0px;
        margin-right: 35px;
        text-align: center;
        font-family: 'Invention', sans-serif;
        color: #FFF;
        -webkit-transition: all 0.4s ease;
        -moz-transition: all 0.4s ease;
        -ms-transition: all 0.4s ease;
        -o-transition: all 0.4s ease;
        transition: all 0.4s ease;
        white-space: nowrap;
    }

        .header-nav .nav__link:hover {
            color: #fff;
            border-bottom: 2px solid #00857C;
        }

        .header-nav .nav__link.current {
            color: #fff;
            border-bottom: 2px solid #00857C;
            font-weight: 500;
        }

            .header-nav .nav__link.current:hover {
                color: #fff;
            }

    .header-nav .nav__icon {
        display: inline-block;
        margin-bottom: 6px;
        font-family: "IcoMoon Basic";
    }

    .header-nav .nav__text {
        display: block;
        font-size: 16px;
        letter-spacing: 0.25rem;
    }

    /* ---- HEADER NAVIGATION IN SIDEBAR ---- */
    .header-nav.header-nav--side .nav__link {
        padding: 10px;
        text-align: left;
    }

    .header-nav.header-nav--side .nav__icon {
        margin-right: 10px;
        vertical-align: middle;
    }

    .header-nav.header-nav--side .nav__text {
        display: inline-block;
        vertical-align: middle;
    }

/* ---- BREADCRUMB NAV ---- */
.breadcrumb-nav {
    padding: 0 0 12px;
    font-size: 1.504rem;
}

.breadcrumb-nav__link {
    color: #FFF;
    -webkit-transition: color 0.4s ease;
    -moz-transition: color 0.4s ease;
    -ms-transition: color 0.4s ease;
    -o-transition: color 0.4s ease;
    transition: color 0.4s ease;
}

    .breadcrumb-nav__link:hover {
        color: #e6e6e6;
    }

    .breadcrumb-nav__link:active {
        color: #FFF;
    }

    .breadcrumb-nav__link:after {
        content: ' / ';
    }

I.breadcrumb-nav__icon.icon {
    display: inline-block;
    margin-right: 2px;
    color: #414E54;
}

    I.breadcrumb-nav__icon.icon:before {
        color: inherit;
    }

SPAN.breadcrumb-select-wrap {
    display: inline-block;
    position: relative;
}

    SPAN.breadcrumb-select-wrap:hover:after, SPAN.breadcrumb-select-wrap:focus:after {
        color: #6ECEB2;
        -webkit-transition: all ease 0.4s;
        -moz-transition: all ease 0.4s;
        -ms-transition: all ease 0.4s;
        -o-transition: all ease 0.4s;
        transition: all ease 0.4s;
    }

    SPAN.breadcrumb-select-wrap:after {
        content: '\25BE';
        position: absolute;
        right: 0;
        top: 7px;
        z-index: 1;
        font-size: 150%;
        color: #058C83;
        pointer-events: none;
        /* - Click underlying element */
    }

        SPAN.breadcrumb-select-wrap:after:hover, SPAN.breadcrumb-select-wrap:after:focus {
            color: #6ECEB2;
        }

SELECT.breadcrumb-nav__link {
    background-color: transparent;
}

    SELECT.breadcrumb-nav__link:hover, SELECT.breadcrumb-nav__link:focus {
        border-radius: 0;
    }

/* ---- STEP NAV ---- */
.step-content__nav {
    /* See sass/sections/content.scss */
}

.step-nav__item {
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- */
    display: -ms-flexbox;
    /* OLD - TWEENER - IE 10 */
    display: -webkit-flex;
    /* RECENT - Chrome */
    display: flex;
    /* NEW - Firefox, Chrome, Opera, IE11 */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    -webkit-align-items: center;
    align-items: center;
    -webkit-align-content: flex-start;
    align-content: flex-start;
    position: relative;
    width: 100%;
    height: 60px;
    margin-bottom: 8px;
}

    .step-nav__item .step-nav__link.active {
        display: inline-block;
        position: relative;
    }

        .step-nav__item .step-nav__link.active:after {
            content: '';
            display: block;
            border-bottom: 1px solid #1b1b1b;
        }

I.step-nav__icon {
    -webkit-box-flex: 0 0 24px;
    -webkit-flex: 0 0 24px;
    -moz-flex: 0 0 24px;
    -ms-flex: 0 0 24px;
    flex: 0 0 24px;
    position: relative;
    max-height: 24px;
    border: 3px solid #414E54;
    border-radius: 50%;
    margin-top: 8px;
    margin-right: 8px;
    /*overflow:hidden;*/
}

    I.step-nav__icon:after {
        content: '';
        display: block;
        position: absolute;
        z-index: 0;
        top: 110%;
        left: 0;
        right: 0;
        margin: 0 auto;
        width: 3px;
        height: 190%;
        background-color: #1b1b1b;
    }

.step-nav__item:last-of-type I.step-nav__icon:after {
    display: none;
}

.step-nav__item--not-started I.step-nav__icon {
    border: 3px solid #FF2D55;
}

.step-nav__item--not-complete I.step-nav__icon {
    border: 3px solid #F48E22;
}

    .step-nav__item--not-complete I.step-nav__icon:before {
        content: '';
        display: block;
        position: absolute;
        margin: 0 1em 1em 0;
        width: 50%;
        height: 100%;
        background-color: #F48E22;
    }

.step-nav__item--complete I.step-nav__icon {
    border: 3px solid #6ECEB2;
    background-color: #6ECEB2;
}

    .step-nav__item--complete I.step-nav__icon:before {
        content: '';
        display: block;
        position: absolute;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-translate(-50%, -50%);
        /* Safari 7 */
        -moz-transform: translate(-50%, -50%);
        /* Firefox */
        -ms-transform: translate(-50%, -50%);
        /* IE 9 */
        -o-transform: translate(-50%, -50%);
        /* Opera 10.5 - 15.0 */
        transform: translate(-50%, -50%);
        width: 100%;
        height: 100%;
        margin: auto;
        border-radius: 50%;
        /*background-color:$tertiaryColour;*/
    }

.step-nav__item--disabled I.step-nav__icon {
    border: 3px solid rgba(65, 78, 84, 0.1);
    background-color: rgba(65, 78, 84, 0.25);
}

.step-nav__item--disabled .step-nav__link {
    color: rgba(65, 78, 84, 0.25);
}

    .step-nav__item--disabled .step-nav__link:hover {
        background-color: #e5e5e5;
        color: rgba(65, 78, 84, 0.25);
    }

.step-nav__item--locked I.step-nav__icon {
    border: 3px solid #2B85BA;
    background-color: #2B85BA;
}

    .step-nav__item--locked I.step-nav__icon:before {
        content: '\e98f';
        display: block;
        position: absolute;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-translate(-50%, -50%);
        /* Safari 7 */
        -moz-transform: translate(-50%, -50%);
        /* Firefox */
        -ms-transform: translate(-50%, -50%);
        /* IE 9 */
        -o-transform: translate(-50%, -50%);
        /* Opera 10.5 - 15.0 */
        transform: translate(-50%, -50%);
        width: 11px;
        height: 20px;
        font-family: "IcoMoon Basic";
        font-size: 17px;
        color: #FFF;
    }

.step-nav__item--errors .step-nav__icon {
    border: 3px solid #FF2D55;
    background-color: #FF2D55;
}

    .step-nav__item--errors .step-nav__icon:before {
        content: '\ea07';
        display: block;
        position: absolute;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
        /* Chrome, Safari 8+, Opera 15.0+ */
        -webkit-transform: -webkit-translate(-50%, -50%);
        /* Safari 7 */
        -moz-transform: translate(-50%, -50%);
        /* Firefox */
        -ms-transform: translate(-50%, -50%);
        /* IE 9 */
        -o-transform: translate(-50%, -50%);
        /* Opera 10.5 - 15.0 */
        transform: translate(-50%, -50%);
        width: 16px;
        height: 22px;
        font-family: "IcoMoon Basic";
        font-size: 17px;
        color: #FFF;
    }

.step-nav__item--errors .step-nav__link {
    font-weight: 700;
    color: #FF2D55;
}

.step-nav__link {
    -webkit-box-flex: 0 1 auto;
    -webkit-flex: 0 1 auto;
    -moz-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    position: relative;
    padding: 10px 16px;
    /*background-color:darken($octonaryBkgColour,2.5%);*/
    -webkit-transition: all 0.4s ease-out;
    -moz-transition: all 0.4s ease-out;
    -ms-transition: all 0.4s ease-out;
    -o-transition: all 0.4s ease-out;
    transition: all 0.4s ease-out;
    text-align: left;
    font-size: 14px;
    font-weight: 400;
    color: #414E54;
    text-transform: uppercase;
}

    .step-nav__link:hover {
        background-color: #ececec;
        color: #1b1b1b;
        cursor: pointer;
    }

.step-nav__switch {
    position: absolute;
    z-index: 10;
    top: 25%;
    right: 0;
}

/* ---- SIDEBAR NAV ---- */
.side-nav {
    position: relative;
    right: -48px;
    width: 100%;
    margin-top: 48px;
    text-align: right;
}

ASIDE .fa {
    font-size: 24px;
    margin-left: 10px;
}

.side-nav .fa {
    font-size: 24px;
    margin-left: 0px;
    margin-right: 10px;
}

.side-nav__link {
    display: block;
    position: relative;
    width: auto;
    height: auto;
    padding: 10px 0;
    overflow: visible;
    font-family: 'Invention', sans-serif;
    font-size: 1.6rem;
    font-weight: 600;
    color: #FFF;
    -webkit-transition: color 0.4s ease;
    -moz-transition: color 0.4s ease;
    -ms-transition: color 0.4s ease;
    -o-transition: color 0.4s ease;
    transition: color 0.4s ease;
}

    .side-nav__link:hover {
        color: #e6e6e6;
    }

    .side-nav__link:active {
        color: #FFF;
    }

.side-nav__icon {
    display: inline-block;
    position: relative;
    width: 28px;
    height: 24px;
    margin-right: 10px;
    overflow: visible;
}

    .side-nav__icon:before {
        position: absolute;
        top: 0;
        left: 0;
        font-family: "IcoMoon Basic";
        font-size: 24px;
        color: inherit;
        -webkit-transition: color 0.4s ease-in-out;
        -moz-transition: color 0.4s ease-in-out;
        -ms-transition: color 0.4s ease-in-out;
        -o-transition: color 0.4s ease-in-out;
        transition: color 0.4s ease-in-out;
    }

.side-nav__text {
    margin-right: 16px;
    color: inherit;
}

.side-nav__link:hover .side-nav__text {
    color: #e6e6e6;
}

.sidebar--open .side-nav__text {
    color: #FBE122;
    -webkit-transition: color 0.4s ease;
    -moz-transition: color 0.4s ease;
    -ms-transition: color 0.4s ease;
    -o-transition: color 0.4s ease;
    transition: color 0.4s ease;
}

/* ---- FOOTER NAV ---- */
.footer-nav {
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- */
    display: -ms-flexbox;
    /* OLD - TWEENER - IE 10 */
    display: -webkit-flex;
    /* RECENT - Chrome */
    display: flex;
    /* NEW - Firefox, Chrome, Opera, IE11 */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: flex-end;
    justify-content: flex-end;
    -webkit-align-items: flex-start;
    align-items: flex-start;
    -webkit-align-content: flex-start;
    align-content: flex-start;
    text-align: right;
}

.footer-nav__link {
    -webkit-box-flex: 0 1 auto;
    -webkit-flex: 0 1 auto;
    -moz-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    margin: 0 6px;
    font-family: 'Invention', sans-serif;
    font-size: 1.28rem;
    font-weight: 400;
    color: #414E54;
    -webkit-transition: color 0.4s ease;
    -moz-transition: color 0.4s ease;
    -ms-transition: color 0.4s ease;
    -o-transition: color 0.4s ease;
    transition: color 0.4s ease;
    text-decoration: underline;
}

    .footer-nav__link:hover {
        color: #07bdb1;
    }

    .footer-nav__link:active {
        color: #414E54;
    }

/* ======== UNUSED NAV TYPES ======== */
/* ---- MAIN NAVIGATION ---- */
/*.main-nav 					                        {clear:both; width:100%; height:60px; padding:0; background-color:$primaryColour; overflow:visible;}
.main-nav.fixed 			                        {position:fixed; top:0; left:0; z-index:900; @include shadow-outset(0,8px,8px,0,0,0,$opacityLow);}
.main-nav .page-limits					            {max-width:$screen-extra-large; padding:0 $spaceSize-medium;}

.main-nav .nav__list		                        {display:block; clear:both; width:100%; height:100%; margin:0 auto; font-family:$fontSetSecondary; font-size:$eta; font-weight:400; text-transform:uppercase;}
.main-nav .nav__item		                        {display:inline-block; position:relative; width:auto; height:100%; padding:0; margin:0; vertical-align:bottom; @include transition(background-color $transitionSpeed ease);}
.main-nav .nav__item:hover	                        {background-color:$secondaryColour;}
.main-nav .nav__item.mobile--only	                {display:none;}
.main-nav .nav__item.mobile--off 	                {display:inline-block;}		
.main-nav .nav__item.current	                    {background-color:darken($primaryColour, 10%);}					
.main-nav .nav__link		                        {display:block; width:100%; height:100%; padding:$spaceSize-average $spaceSize-lesser $spaceSize-small; border:0; margin:0; @include linkColour($anchorTertiaryColour, $anchorTertiaryColourHover);}*/
/* ---- DROPDOWN MENU NAV ---- */
/*.nav__item .drop-nav                                {position:absolute; z-index:500; top:60px; width:200px; height:auto; max-height:0; background-color:$secondaryColour; opacity:$opacityNone; overflow:hidden; 
                                                     font-family:inherit; font-size:inherit; font-weight:500; color:$white; @include transition-two(max-height $transitionSpeed ease-out, opacity $transitionSpeed ease-in);}
.nav__item:hover .drop-nav                          {max-height:640px; opacity:$opacityFull;}
.drop-nav .drop-nav__link                           {display:block; clear:both; width:100%; height:auto; min-height:40px; padding:$spaceSize-tiny; text-align:left; font-family:inherit; font-size:inherit; font-weight:inherit; color:inherit; 
                                                     @include linkColour($anchorTertiaryColour, $anchorTertiaryColourHover); @include transition(background-color $transitionSpeed ease);}
.drop-nav .drop-nav__link:hover                     {background-color:$secondaryColour;}*/
/* ---- MOBILE NAV ---- */
/*.mobile-nav 				                        {position:relative; z-index:750; clear:both; width:auto; padding:0; @include transition(height $transitionSpeed ease-in-out 0.1s);}
.mobile-nav.fixed 			                        {position:fixed; top:60px; left:0; width:100%;}
.mobile-nav .nav__list		                        {display:block; clear:both; width:auto; height:auto; padding:0; margin:0; background-color:$secondaryColour; font-family:$fontSetPrimary; font-size:$baseSize; text-transform:uppercase;}
.mobile-nav .nav__item		                        {display:block; clear:both; width:auto; height:40px; padding:0 $spaceSize-small 0 $spaceSize-extra; border-bottom:$borderWidth solid $secondaryColour; margin:0; background-color:$secondaryColour; @include transition(background-color $transitionSpeed ease);}
.mobile-nav .nav__item:hover                        {background-color:darken($baseColour, 10%);}						
.mobile-nav .nav__link		                        {display:block; width:100%; height:100%; padding:$spaceSize-lesser; border:0; margin:0; @include linkColour($anchorTertiaryColour, $anchorTertiaryColourHover);}*/
/* ---- SIDEBAR NAV (UNUSED ELEMENTS) ---- */
/*
.sidebar--closed .side-nav                          {max-width:24px;} 
.sidebar--open .side-nav                            {max-width:100%;}
.side-nav__link.side-nav__link--current,
.side-nav__link:hover .side-nav__icon               {color:$white; &:before{color:$white;}}
.sidebar--open .side-nav__link.side-nav__link--current .side-nav__text,
.sidebar--open .side-nav__link:hover .side-nav__text{color:$white;}
*/
/* ============================================================== MEDIA QUERIES ============================================================== */
/* ---- TABLET, LAPTOP & SMALL DESKTOP (960px - 1439px) ---- */
@media only screen and (min-width: 960px) and (max-width: 1439px) {
    /* ---- STEP CONTENT & NAV ---- */
    .step-nav__link {
        font-size: 1.2rem;
    }
}

/* ---- TABLET, LAPTOP & DESKTOP (960px +) ---- */
@media only screen and (min-width: 960px) {
    /* ---- MOBILE NAV ---- */
    .mobile-nav {
        display: none;
    }
}

/* ---- TABLET (960px - 1279px) ---- */
@media only screen and (min-width: 960px) and (max-width: 1279px) {
    /* ---- STEP CONTENT & NAV ---- */
    .step-nav__link {
        font-size: 1.28rem;
    }
}

/* ---- MOBILE & SMALL TABLET (0 - 959px) ---- */
@media only screen and (max-width: 959px) {
    /* ---- STEP CONTENT & NAV ---- */
    .step-nav__link {
        padding-left: 0;
        font-size: 1.1rem;
    }
}

/* ===========================================================

	$HEADER (v2 2018)

=========================================================== */
/* ======== SITE HEADER ======== */
.fixed-header__dock {
    min-height: 86px;
}

HEADER.site-header {
    position: relative;
    width: 100%;
    height: auto;
    min-height: 70px;
    max-height: 200px;
    padding: 16px 20px 16px 64px;
    background-color: #F5F6FA;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}

    HEADER.site-header .page-limits {
        max-width: none;
        text-align: center;
    }

    HEADER.site-header.fixed {
        min-height: 52px;
        position: fixed;
        padding: 4px 20px 4px 64px;
    }

/* ---- HEADER COLUMNS ---- */
HEADER .header-columns {
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- */
    display: -ms-flexbox;
    /* OLD - TWEENER - IE 10 */
    display: -webkit-flex;
    /* RECENT - Chrome */
    display: flex;
    /* NEW - Firefox, Chrome, Opera, IE11 */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    flex-wrap: nowrap;
}

HEADER .header-col {
    -webkit-box-flex: 1 1 auto;
    -webkit-flex: 1 1 auto;
    -moz-flex: 1 1 auto;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    position: relative;
    background-clip: padding-box;
    padding: 4px;
    /*border:1px solid teal;*/
}

    HEADER .header-col:nth-child(1) {
        text-align: left;
    }

    HEADER .header-col:nth-child(2) {
        text-align: left;
    }

    HEADER .header-col:nth-child(3) {
        padding-top: 0;
        padding-bottom: 0;
        text-align: right;
    }

    HEADER .header-col.header-col--pad {
        padding: 8px 16px !important;
    }

    HEADER .header-col.header-col--side-pad {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }

    HEADER .header-col.header-col--vert-pad {
        padding-top: 20px !important;
        padding-bottom: 20px !important;
    }

    HEADER .header-col.header-col--bottom-pad {
        padding-bottom: 20px !important;
    }

    HEADER .header-col.buttons--header {
        padding: 0 20px 0 8px;
    }

    HEADER .header-col.col--auto {
        -webkit-box-flex: 0 1 auto;
        -webkit-flex: 0 1 auto;
        -moz-flex: 0 1 auto;
        -ms-flex: 0 1 auto;
        flex: 0 1 auto;
    }

    HEADER .header-col.col--full {
        -webkit-box-flex: 0 1 100%;
        -webkit-flex: 0 1 100%;
        -moz-flex: 0 1 100%;
        -ms-flex: 0 1 100%;
        flex: 0 1 100%;
        max-width: 100%;
    }

    HEADER .header-col.col--primary {
        -webkit-box-flex: 0 1 75%;
        -webkit-flex: 0 1 75%;
        -moz-flex: 0 1 75%;
        -ms-flex: 0 1 75%;
        flex: 0 1 75%;
        max-width: 75%;
    }

    HEADER .header-col.col--secondary {
        -webkit-box-flex: 0 1 66.665%;
        -webkit-flex: 0 1 66.665%;
        -moz-flex: 0 1 66.665%;
        -ms-flex: 0 1 66.665%;
        flex: 0 1 66.665%;
        max-width: 66.665%;
    }

    HEADER .header-col.col--half {
        -webkit-box-flex: 0 1 50%;
        -webkit-flex: 0 1 50%;
        -moz-flex: 0 1 50%;
        -ms-flex: 0 1 50%;
        flex: 0 1 50%;
        max-width: 50%;
    }

    HEADER .header-col.col--tertiary {
        -webkit-box-flex: 0 1 33.335%;
        -webkit-flex: 0 1 33.335%;
        -moz-flex: 0 1 33.335%;
        -ms-flex: 0 1 33.335%;
        flex: 0 1 33.335%;
        max-width: 33.335%;
    }

    HEADER .header-col.col--quarternary {
        -webkit-box-flex: 0 1 25%;
        -webkit-flex: 0 1 25%;
        -moz-flex: 0 1 25%;
        -ms-flex: 0 1 25%;
        flex: 0 1 25%;
        max-width: 25%;
    }

    HEADER .header-col.col--senary {
        -webkit-box-flex: 0 1 16.66%;
        -webkit-flex: 0 1 16.66%;
        -moz-flex: 0 1 16.66%;
        -ms-flex: 0 1 16.66%;
        flex: 0 1 16.66%;
        max-width: 16.66%;
    }

    HEADER .header-col.col--duodenary {
        -webkit-box-flex: 0 1 8.33%;
        -webkit-flex: 0 1 8.33%;
        -moz-flex: 0 1 8.33%;
        -ms-flex: 0 1 8.33%;
        flex: 0 1 8.33%;
        max-width: 8.33%;
    }

    HEADER .header-col.header-col--icon {
        display: none;
        -webkit-box-flex: 0 1 10%;
        -webkit-flex: 0 1 10%;
        -moz-flex: 0 1 10%;
        -ms-flex: 0 1 10%;
        flex: 0 1 10%;
        max-width: 10%;
        text-align: center;
    }



    HEADER .header-col.header-col--nav {
        -webkit-box-flex: 0 1 50%;
        -webkit-flex: 0 1 50%;
        -moz-flex: 0 1 50%;
        -ms-flex: 0 1 50%;
        flex: 0 1 50%;
        max-width: 50%;
        padding: 0 4px;
    }

    HEADER .header-col.header-col--user-panel {
        -webkit-box-flex: 1 1 25%;
        -webkit-flex: 1 1 25%;
        -moz-flex: 1 1 25%;
        -ms-flex: 1 1 25%;
        flex: 1 1 25%;
        max-width: 25%;
        padding: 0 4px;
    }

    HEADER .header-col.header-col--logo-corp {
        -webkit-box-flex: 1 1 auto;
        -webkit-flex: 1 1 auto;
        -moz-flex: 1 1 auto;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
    }

HEADER.fixed .header-col.header-col--logo {
    padding-top: 16px;
}

HEADER.fixed .header-col.header-col--user-panel {
    padding-bottom: 16px;
}

/* ---- HEADER TITLE ---- */
HEADER.site-header H1,
HEADER.site-header H2,
HEADER.site-header H3,
HEADER.site-header H4,
HEADER.site-header H5,
HEADER.site-header H6 {
    font-size: 2.5rem;
    font-weight: 300;
    line-height: 1;
    margin-bottom: 0;
    font-family: 'Invention', sans-serif;
    ;
    font-style: normal;
    color: #FBE122;
    text-transform: uppercase;
    text-align: inherit;
    /* Colours set in theme typography */
}

    HEADER.site-header H1 SPAN.alt,
    HEADER.site-header H2 SPAN.alt,
    HEADER.site-header H3 SPAN.alt,
    HEADER.site-header H4 SPAN.alt,
    HEADER.site-header H5 SPAN.alt,
    HEADER.site-header H6 SPAN.alt {
        line-height: inherit;
        /* Colours set in theme area typography */
    }

HEADER.site-header .theme--msdconv {
    display: none;
}

/* ---- HEADER MENU ICON BUTTON ---- */
.header__menu-button {
    width: 24px;
    height: 24px;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    /* Chrome, Safari 8+, Opera 15.0+ */
    -webkit-transform: -webkit-translate(-50%, -50%);
    /* Safari 7 */
    -moz-transform: translate(-50%, -50%);
    /* Firefox */
    -ms-transform: translate(-50%, -50%);
    /* IE 9 */
    -o-transform: translate(-50%, -50%);
    /* Opera 10.5 - 15.0 */
    transform: translate(-50%, -50%);
}

/* ---- HEADER LOGO ---- */
IMG.header__logo {
    max-height: 50px;
}

/* ---- HEADER USER PANEL ---- */
.header-col--user-panel {
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- */
    display: -ms-flexbox;
    /* OLD - TWEENER - IE 10 */
    display: -webkit-flex;
    /* RECENT - Chrome */
    display: flex;
    /* NEW - Firefox, Chrome, Opera, IE11 */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: flex-end;
    justify-content: flex-end;
    -webkit-align-items: flex-end;
    align-items: flex-end;
    -webkit-align-content: flex-start;
    align-content: flex-start;
    width: auto;
}

.header__login-info {
    -webkit-box-flex: 0 1 120px;
    -webkit-flex: 0 1 120px;
    -moz-flex: 0 1 120px;
    -ms-flex: 0 1 120px;
    flex: 0 1 120px;
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- */
    display: -ms-flexbox;
    /* OLD - TWEENER - IE 10 */
    display: -webkit-flex;
    /* RECENT - Chrome */
    display: flex;
    /* NEW - Firefox, Chrome, Opera, IE11 */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: flex-end;
    justify-content: flex-end;
    -webkit-align-items: flex-end;
    align-items: flex-end;
    -webkit-align-content: flex-start;
    align-content: flex-start;
    font-family: 'Invention', sans-serif;
    font-size: 1.1rem;
}

.header__login-col {
    -webkit-box-flex: 0 1 auto;
    -webkit-flex: 0 1 auto;
    -moz-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    max-width: none;
    text-align: right;
}

.header__login-label {
    display: inline-block;
    margin-bottom: 4px;
    font-size: 1.28rem;
    white-space: pre;
}

.header__login-link,
.header__locale-link {
    display: inline-block;
    padding: 2px 16px;
    margin-left: 10px;
    color: #058C83;
    -webkit-transition: color 0.4s ease;
    -moz-transition: color 0.4s ease;
    -ms-transition: color 0.4s ease;
    -o-transition: color 0.4s ease;
    transition: color 0.4s ease;
    font-weight: 600;
}

    .header__login-link:hover,
    .header__locale-link:hover {
        color: #07bdb1;
    }

    .header__login-link:active,
    .header__locale-link:active {
        color: #058C83;
    }

    .header__login-link.login-link--user {
        white-space: nowrap;
    }

/* ---- HEADER USER BAR (ALTERNATIVE LAYOUT FOR MOBILE) ---- */
.header__user-bar {
    display: none;
    position: absolute;
    left: 0;
    width: 100%;
    height: 32px;
    margin-top: 12px;
    background-color: #08172b;
}

HEADER.site-header.fixed .header__user-bar {
    margin-top: 0;
}

.user-bar__item {
    -webkit-box-flex: 0 1 auto;
    -webkit-flex: 0 1 auto;
    -moz-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    padding: 6px 12px;
    font-size: 1rem;
}

    .user-bar__item .header__login-label {
        font-size: inherit;
    }

    .user-bar__item .header__login-link {
        font-size: inherit;
    }

.header__locale {
    display: flex;
    position: relative;
    overflow: visible;
    font-size: 1.28rem;
}

.header__locale-link {
    position: relative;
    min-width: 240px;
    margin-left: 10px;
    text-align: left;
}

    .header__locale-link:after {
        content: '';
        position: absolute;
        top: 12px;
        right: 12px;
        width: 0;
        height: 0;
        border-top: 6px solid #414E54;
        border-left: 6px solid transparent;
        border-right: 6px solid transparent;
    }

.header__locale-dropdown {
    position: absolute;
    z-index: 1800;
    top: 32px;
    left: 10px;
    width: 240px;
    height: auto;
    max-height: 0;
    background-color: #0C2340;
    opacity: 0;
    overflow: hidden;
    font-family: 'Invention', sans-serif;
    font-size: inherit;
    font-weight: 500;
    color: #414E54;
    -webkit-transition: max-height 0.4s ease-out, opacity 0.4s ease-in;
    -moz-transition: max-height 0.4s ease-out, opacity 0.4s ease-in;
    -ms-transition: max-height 0.4s ease-out, opacity 0.4s ease-in;
    -o-transition: max-height 0.4s ease-out, opacity 0.4s ease-in;
    transition: max-height 0.4s ease-out, opacity 0.4s ease-in;
}

.header__locale:hover .header__locale-dropdown {
    max-height: 640px;
    opacity: 1;
}

.header__locale-dropdown .locale-option {
    display: block;
    width: 100%;
    height: auto;
    min-height: 40px;
    padding: 8px;
    text-align: left;
    font-family: 'Invention', sans-serif;
    font-size: inherit;
    font-weight: inherit;
    color: inherit;
    color: #FFF;
    -webkit-transition: color 0.4s ease;
    -moz-transition: color 0.4s ease;
    -ms-transition: color 0.4s ease;
    -o-transition: color 0.4s ease;
    transition: color 0.4s ease;
    -webkit-transition: background-color 0.4s ease;
    -moz-transition: background-color 0.4s ease;
    -ms-transition: background-color 0.4s ease;
    -o-transition: background-color 0.4s ease;
    transition: background-color 0.4s ease;
}

    .header__locale-dropdown .locale-option:hover {
        color: #e6e6e6;
    }

    .header__locale-dropdown .locale-option:active {
        color: #FFF;
    }

    .header__locale-dropdown .locale-option:hover {
        background-color: #0C2340;
    }

.header__login-avatar {
    display: block;
    width: 42px;
    height: 42px;
    padding: 8px 10px;
    border-radius: 6px;
    margin-left: 12px;
    font-family: 'Invention', sans-serif;
    font-size: 1.6rem;
    font-weight: 600;
    color: #FFF;
    -webkit-transition: color 0.4s ease;
    -moz-transition: color 0.4s ease;
    -ms-transition: color 0.4s ease;
    -o-transition: color 0.4s ease;
    transition: color 0.4s ease;
    background: #F48E22;
    background: -moz-linear-gradient(top, #F48E22 0%, #FBE122 120%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #F48E22), color-stop(120%, #FBE122));
    background: -webkit-linear-gradient(top, #F48E22 0%, #FBE122 120%);
    background: -o-linear-gradient(top, #F48E22 0%, #FBE122 120%);
    background: -ms-linear-gradient(top, #F48E22 0%, #FBE122 120%);
    background: linear-gradient(to bottom, #F48E22 0%, #FBE122 120%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#F48E22, endColorstr=#FBE122,GradientType=0);
}

    .header__login-avatar:hover {
        color: #e6e6e6;
    }

    .header__login-avatar:active {
        color: #FFF;
    }

/* ======== PAGE HEADER ======== */
HEADER.page-header {
    position: relative;
    width: 100%;
    height: auto;
    max-height: 120px;
}

    HEADER.page-header .header-limits {
        max-width: 1440px;
        padding: 24px 24px 12px;
        margin: 0 auto;
        text-align: left;
        overflow: visible;
    }

.page-header H1.page-title {
    margin-bottom: 16px;
    font-family: 'Invention', sans-serif;
}

    .page-header H1.page-title SMALL {
        font-size: 80%;
    }

/* ============================================================== MEDIA QUERIES ============================================================== */
/* ---- LARGE TABLET & LAPTOP (960px - 1439px) ---- */
@media only screen and (min-width: 960px) and (max-width: 1439px) {
    /* ---- HEADER COLUMNS ---- */
    HEADER .header-col.header-col--logo {
        -webkit-box-flex: 1 1 40%;
        -webkit-flex: 1 1 40%;
        -moz-flex: 1 1 40%;
        -ms-flex: 1 1 40%;
        flex: 1 1 40%;
        max-width: 40%;
    }

    HEADER .header-col.header-col--nav {
        -webkit-box-flex: 1 1 30%;
        -webkit-flex: 1 1 30%;
        -moz-flex: 1 1 30%;
        -ms-flex: 1 1 30%;
        flex: 1 1 30%;
        max-width: 30%;
    }

    HEADER .header-col.header-col--user-panel {
        -webkit-box-flex: 1 1 30%;
        -webkit-flex: 1 1 30%;
        -moz-flex: 1 1 30%;
        -ms-flex: 1 1 30%;
        flex: 1 1 30%;
        max-width: 30%;
    }
}

/* ---- MOBILE & TABLET (0 - 1024px) ---- */
/* ---- MOBILE & SMALL TABLET (0 - 959px) ---- */
@media only screen and (max-width: 959px) {
    /* ---- HEADER COLUMNS ---- */
    HEADER .header-col.header-col--icon {
        display: flex;
    }

    HEADER .header-col.header-col--logo {
        -webkit-box-flex: 1 1 50%;
        -webkit-flex: 1 1 50%;
        -moz-flex: 1 1 50%;
        -ms-flex: 1 1 50%;
        flex: 1 1 50%;
        max-width: none;
    }

    HEADER .header-col.header-col--nav {
        display: none;
    }

    HEADER .header-col.header-col--user-panel {
        -webkit-box-flex: 0 1 45%;
        -webkit-flex: 0 1 45%;
        -moz-flex: 0 1 45%;
        -ms-flex: 0 1 45%;
        flex: 0 1 45%;
        max-width: 45%;
    }
    /* ---- HEADER TITLE ---- */
    HEADER.site-header H1 {
        font-size: 1.6rem;
    }
    /* ======== PAGE HEADER ======== */
    HEADER.page-header .page-header__button {
        max-width: 320px;
    }
}

/* ---- MOBILE (0 - 599px) ---- */
@media screen and (max-width: 599px) {
    /* ======== SITE HEADER ======== */
    HEADER.site-header {
        padding-left: 48px;
    }
    /* ---- HEADER COLUMNS ---- */
    HEADER .header-columns {
        margin-left: 0;
    }

    HEADER .header-col.header-col--logo {
        -webkit-box-flex: 1 1 auto;
        -webkit-flex: 1 1 auto;
        -moz-flex: 1 1 auto;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
    }

    HEADER .header-col.header-col--nav {
        display: none;
    }

    HEADER .header-col.header-col--user-panel {
        display: none;
    }
    /* ---- USER PANEL ---- */
    .header__login-info {
        display: none;
    }
    /* ---- USER BAR (ALTERNATIVE LAYOUT FOR MOBILE) ---- */
    .header__user-bar {
        display: -webkit-box;
        /* OLD - iOS 6-, Safari 3.1-6 */
        display: -moz-box;
        /* OLD - Firefox 19- */
        display: -ms-flexbox;
        /* OLD - TWEENER - IE 10 */
        display: -webkit-flex;
        /* RECENT - Chrome */
        display: flex;
        /* NEW - Firefox, Chrome, Opera, IE11 */
        -webkit-flex-direction: row;
        -moz-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-justify-content: space-between;
        justify-content: space-between;
        -webkit-align-items: flex-start;
        align-items: flex-start;
        -webkit-align-content: flex-start;
        align-content: flex-start;
    }
}

/* ===========================================================

	$ASIDE (v2 2018)

=========================================================== */
/* ======== MAIN SIDEBAR ======== */
ASIDE.page-side {
    position: fixed;
    z-index: 900;
    top: 0;
    bottom: 0;
    left: 0;
    width: 240px;
    height: 100%;
    padding: 140px 20px;
    margin: auto;
    box-sizing: border-box;
    font-size: 0.9rem;
    -webkit-transition: left 0.4s ease-in-out;
    -moz-transition: left 0.4s ease-in-out;
    -ms-transition: left 0.4s ease-in-out;
    -o-transition: left 0.4s ease-in-out;
    transition: left 0.4s ease-in-out;
    -webkit-box-shadow: 8px 0 8px rgba(0, 0, 0, 0.25);
    -moz-box-shadow: 8px 0 8px rgba(0, 0, 0, 0.25);
    box-shadow: 8px 0 8px rgba(0, 0, 0, 0.25);
    /* Colours set in theme */
}

    ASIDE.page-side H1,
    ASIDE.page-side H2,
    ASIDE.page-side H3,
    ASIDE.page-side H4,
    ASIDE.page-side H5,
    ASIDE.page-side H6,
    ASIDE.page-side P {
        color: inherit;
    }

    ASIDE.page-side P {
        font-size: inherit;
    }

/* ---- SIDEBAR OPEN/CLOSED STATES ---- */
.sidebar--open ASIDE.page-side {
    left: 0;
}

.sidebar--closed ASIDE.page-side {
    left: -240px;
}

/* ---- SIDEBAR BURGER MENU ICON (editable) ---- */
ASIDE.page-side .page-side__menu-button {
    position: absolute;
    z-index: 700;
    top: 16px;
    right: 16px;
}

.icon.icon--burger-glyph {
    position: absolute;
    z-index: 1600;
    display: block;
    top: 0;
    right: 0;
    width: 24px;
    height: 24px;
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -ms-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

    .icon.icon--burger-glyph::after, .icon.icon--burger-glyph::before {
        /* lines of burger symbol*/
        content: '';
        position: absolute;
        width: 120%;
        height: 3px;
        left: -5%;
        border-top: 3px solid #FFF;
        border-bottom: 3px solid #FFF;
        -webkit-backface-visibility: hidden;
        -moz-backface-visibility: hidden;
        -ms-backface-visibility: hidden;
        -o-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-transition: border-color 0.4s ease;
        -moz-transition: border-color 0.4s ease;
        -ms-transition: border-color 0.4s ease;
        -o-transition: border-color 0.4s ease;
        transition: border-color 0.4s ease;
    }

    .icon.icon--burger-glyph::before {
        top: 0;
    }

    .icon.icon--burger-glyph::after {
        top: 12px;
    }

    .icon.icon--burger-glyph:hover::after, .icon.icon--burger-glyph:hover::before {
        border-color: #FBE122;
    }

.icon.icon--cross-glyph {
    position: absolute;
    z-index: 1600;
    display: inline-block;
    top: 0;
    right: 0;
    height: 24px;
    width: 24px;
    border-radius: 50%;
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    opacity: 0;
}

    .icon.icon--cross-glyph::after, .icon.icon--cross-glyph::before {
        /* lines of 'X' icon */
        content: '';
        position: absolute;
        height: 3px;
        width: 24px;
        left: 50%;
        top: 47.5%;
        background-color: #FFF;
        -webkit-backface-visibility: hidden;
        -moz-backface-visibility: hidden;
        -ms-backface-visibility: hidden;
        -o-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-transition: background-color 0.4s ease;
        -moz-transition: background-color 0.4s ease;
        -ms-transition: background-color 0.4s ease;
        -o-transition: background-color 0.4s ease;
        transition: background-color 0.4s ease;
    }

    .icon.icon--cross-glyph::after {
        -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg);
        -moz-transform: translateX(-50%) translateY(-50%) rotate(45deg);
        -o-transform: translateX(-50%) translateY(-50%) rotate(45deg);
        -ms-transform: translateX(-50%) translateY(-50%) rotate(45deg);
        transform: translateX(-50%) translateY(-50%) rotate(45deg);
    }

    .icon.icon--cross-glyph::before {
        -webkit-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
        -moz-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
        -o-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
        -ms-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
        transform: translateX(-50%) translateY(-50%) rotate(-45deg);
    }

    .icon.icon--cross-glyph:hover::after, .icon.icon--cross-glyph:hover::before {
        background-color: #FBE122;
    }

.sidebar--closed .icon.icon--burger-glyph {
    opacity: 1 !important;
    -webkit-transition: opacity 0.4s ease-in-out 0.8s;
    -moz-transition: opacity 0.4s ease-in-out 0.8s;
    -ms-transition: opacity 0.4s ease-in-out 0.8s;
    -o-transition: opacity 0.4s ease-in-out 0.8s;
    transition: opacity 0.4s ease-in-out 0.8s;
}

.sidebar--closed .icon.icon--cross-glyph {
    opacity: 0 !important;
    left: 32px;
}

.sidebar--open .icon.icon--burger-glyph {
    opacity: 0 !important;
}

.sidebar--open .icon.icon--cross-glyph {
    opacity: 1 !important;
    -webkit-transition: opacity 0.4s ease-in-out;
    -moz-transition: opacity 0.4s ease-in-out;
    -ms-transition: opacity 0.4s ease-in-out;
    -o-transition: opacity 0.4s ease-in-out;
    transition: opacity 0.4s ease-in-out;
    top: 110px !important;
}

/* ---- SIDEBAR NAV (see layout/nav.scss) ---- */
/* ======== CONTENT SIDE BLOCKS ======== */
ASIDE.content-side {
    position: relative;
    z-index: 100;
    width: auto;
    height: auto;
    min-height: 160px;
    padding: 64px;
    border-radius: 20%/50%;
    background-color: #FFF;
}

    ASIDE.content-side:before, ASIDE.content-side:after {
        content: '';
        position: absolute;
        z-index: -100;
        top: 0;
    }

    ASIDE.content-side.content-side--left:before {
        right: 100px;
        height: 100%;
        width: 400%;
        background-color: #FFF;
    }

    ASIDE.content-side.content-side--right:after {
        left: 100px;
        height: 100%;
        width: 400%;
        background-color: #FFF;
    }

.content-side__body {
    position: absolute;
    top: 50%;
    -webkit-transform: translate(0, -50%);
    /* Chrome, Safari 8+, Opera 15.0+ */
    -webkit-transform: -webkit-translate(0, -50%);
    /* Safari 7 */
    -moz-transform: translate(0, -50%);
    /* Firefox */
    -ms-transform: translate(0, -50%);
    /* IE 9 */
    -o-transform: translate(0, -50%);
    /* Opera 10.5 - 15.0 */
    transform: translate(0, -50%);
}

MAIN ASIDE.content-side H4 {
    font-size: 2.75rem;
}

/* ============================================================== MEDIA QUERIES ============================================================== */
/* ---- TABLET, LAPTOP & DESKTOP (960px +) ---- */
@media screen and (min-width: 960px) {
    /* ---- MAIN SIDEBAR ---- */
    ASIDE.page-side {
        display: none;
    }
}

/* ---- MOBILE AND TABLET (0 - 1023px) ---- */
@media screen and (max-width: 1023px) {
    /* ---- MAIN SIDEBAR ---- */
    ASIDE.page-side,
    .sidebar--closed ASIDE.page-side {
        left: -240px;
    }
}

/* ---- MOBILE & SMALL TABLET (0 - 959px) ---- */
/* ---- SMALL MOBILE (0 - 479px) ---- */
/* ===========================================================

	$MAIN (v2 2018)

=========================================================== */
/* ---- MAIN STRUCTURE ---- */
MAIN.page-main {
    display: block;
    clear: both;
    width: 100%;
    min-height: 520px;
    padding: 0;
    margin: 0;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -ms-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

    MAIN.page-main .page-limits {
        position: relative;
    }

    MAIN.page-main.page-main--nonpublic .page-limits {
        max-width: 1280px;
    }

/* ---- CONTENT & SECTIONS ---- */
.page-content {
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- */
    display: -ms-flexbox;
    /* OLD - TWEENER - IE 10 */
    display: -webkit-flex;
    /* RECENT - Chrome */
    display: flex;
    /* NEW - Firefox, Chrome, Opera, IE11 */
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    -webkit-align-items: stretch;
    align-items: stretch;
    -webkit-align-content: flex-start;
    align-content: flex-start;
    /* padding-bottom: 20px; */
    scroll-snap-type: y mandatory;
}

    .page-content SECTION {
        -webkit-box-flex: 1 1 auto;
        -webkit-flex: 1 1 auto;
        -moz-flex: 1 1 auto;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
        -webkit-transition: all 0.4s ease-out;
        -moz-transition: all 0.4s ease-out;
        -ms-transition: all 0.4s ease-out;
        -o-transition: all 0.4s ease-out;
        transition: all 0.4s ease-out;
        overflow-y: hidden;
        scroll-snap-align: center;
    }

        .page-content SECTION:nth-child(even) {
            background-color: #FFF;
        }

        .page-content SECTION:last-of-type(last) {
            margin-bottom: 0;
        }

SECTION .section-limits {
    clear: both;
    max-width: 1440px;
    padding: 0 24px;
    margin: 0 auto;
}

/* ---- SECTION HEADERS ---- */
SECTION HEADER.section__header {
    padding: 20px 0;
}

SECTION.section--alt-1 HEADER.section__header {
    padding: 8px 0;
}

SECTION HEADER.section__header.section__header--customer {
    margin-bottom: 20px;
}

    SECTION HEADER.section__header.section__header--customer H1.section-title, SECTION HEADER.section__header.section__header--customer H2.section-title {
        margin-top: 24px;
    }

HEADER.section__header .header-col:first-of-type {
    padding-left: 4px;
}

HEADER.section__header .header-col:last-of-type {
    padding-right: 0;
}

/* ---- SECTION TITLE ---- */
H1.section-title {
    font-size: 3.125rem;
    font-weight: 400;
    line-height: 0.9;
    margin-bottom: 2.08333rem;
    font-family: 'Invention', sans-serif;
    color: #FBE122;
    text-transform: capitalize;
}

H2.section-title {
    font-size: 2rem;
    font-weight: 400;
    line-height: 0.9;
    margin-bottom: 1.33333rem;
    font-family: 'Invention', sans-serif;
    color: #FBE122;
    text-transform: capitalize;
}

H3.section-subtitle {
    font-family: 'Invention', sans-serif;
    color: #058C83;
    text-transform: uppercase;
    margin-bottom: 32px;
}

/* ---- SECTION TITLE ALT THEME 1 ---- */
SECTION.section--alt-1 H1.section-title,
SECTION.section--alt-1 H2.section-title {
    margin-bottom: 0;
}

SECTION.section--alt-1 H1 SPAN.alt,
SECTION.section--alt-1 H2 SPAN.alt,
SECTION.section--alt-1 H3 SPAN.alt,
SECTION.section--alt-1 H4 SPAN.alt,
SECTION.section--alt-1 H5 SPAN.alt,
SECTION.section--alt-1 H6 SPAN.alt {
    color: #058C83;
}

/* ---- SECTION TITLE LOGO ---- */
.section-title__viewport {
    display: inline-block;
    position: relative;
    width: 64px;
    height: 64px;
    border-radius: 6px;
    margin-right: 20px;
    overflow: hidden;
    vertical-align: middle;
}

.section-title__logo {
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    /* Chrome, Safari 8+, Opera 15.0+ */
    -webkit-transform: -webkit-translate(-50%, -50%);
    /* Safari 7 */
    -moz-transform: translate(-50%, -50%);
    /* Firefox */
    -ms-transform: translate(-50%, -50%);
    /* IE 9 */
    -o-transform: translate(-50%, -50%);
    /* Opera 10.5 - 15.0 */
    transform: translate(-50%, -50%);
    width: auto;
    height: auto;
    min-width: 100.01%;
    min-height: 100.01%;
    max-width: 200%;
    min-width: 0;
    max-width: 80%;
    min-height: 0;
}

@supports (scroll-snap-type: y mandatory) {
    /* ---- SECTION OUTLINES (Display when browser supports 'scroll-snap' CSS property) ---- */
    .page-content SECTION {
        /*border:1px dashed $grey-medium;*/
    }
}

/* ============================================================== MEDIA QUERIES ============================================================== */
/* ---- DESKTOP (1600px +) ---- */
@media only screen and (min-width: 1600px) {
    /* ---- MAIN STRUCTURE ---- */
    MAIN.page-main {
        min-height: 640px;
    }
}

/* ---- LAPTOP & DESKTOP (1280px +) ---- */
@media only screen and (min-width: 1280px) {
    /* ---- PARAGRAPH COLUMNS ---- */
    .text-columns--alpha {
        -webkit-column-count: 2;
        -moz-column-count: 2;
        column-count: 2;
        -webkit-column-gap: 48px;
        -moz-column-gap: 48px;
        column-gap: 48px;
    }

    .text-columns--beta {
        -webkit-column-count: 3;
        -moz-column-count: 3;
        column-count: 3;
        -webkit-column-gap: 48px;
        -moz-column-gap: 48px;
        column-gap: 48px;
    }

    .text-columns--gamma {
        -webkit-column-count: 4;
        -moz-column-count: 4;
        column-count: 4;
        -webkit-column-gap: 48px;
        -moz-column-gap: 48px;
        column-gap: 48px;
    }
}

/* ---- TABLET (960px - 1279px) ---- */
@media only screen and (min-width: 960px) and (max-width: 1279px) {
    /* ---- SECTIONS / CONTENT BLOCKS ---- */
    SECTION.section--content {
        max-width: none;
    }
}

/* ---- MOBILE & SMALL TABLET (0 - 959px) ---- */
@media only screen and (max-width: 959px) {
    /* ---- SECTIONS / CONTENT ---- */
    SECTION.section--content {
        max-width: none;
    }

    SECTION .section-limits {
        padding: 0 16px;
    }
    /* ---- SECTION HEADINGS ---- */
    H1.section-title {
        font-size: 3.125rem;
        font-weight: 400;
        line-height: 0.9;
        margin-bottom: 2.08333rem;
    }

    H2.section-title {
        font-size: 2.5rem;
        font-weight: 400;
        line-height: 0.9;
        margin-bottom: 1.66667rem;
    }

    H2.section-subtitle {
        font-size: 24px;
        font-weight: 400;
        line-height: 0.9;
        margin-bottom: 16px;
    }

    H3.section-subtitle {
        font-size: 24px;
        font-weight: 400;
        line-height: 0.9;
        margin-bottom: 16px;
    }
}

/* ---- SMALL MOBILE (0 - 479px) ---- */
/* ===========================================================

	$BOXES (v2 2018)

    NOTE: This file uses the 'CSS Grid' CSS3 property heavily (https://css-tricks.com/snippets/css/complete-guide-grid/). 
    Please familiarise yourself with the feature before adding traditional layout techniques such as 'float' or 'inline-block'.  

=========================================================== */
.content-boxes {
    display: grid;
    grid-gap: 16px;
    grid-template-columns: repeat(12, 1fr);
    grid-auto-flow: row;
}

.box {
    max-width: 100%;
    min-height: 120px;
    background-color: #F5F6FA;
}

    .box.box--full {
        grid-column-start: span 12;
    }

    .box.box--primary {
        grid-column-start: span 9;
    }

    .box.box--secondary {
        grid-column-start: span 8;
    }

    .box.box--half {
        grid-column-start: span 6;
    }

    .box.box--tertiary {
        grid-column-start: span 4;
    }

    .box.box--quarternary {
        grid-column-start: span 3;
    }

    .box.box--quinary {
        grid-column-start: span 2;
    }

    .box.box--senary {
        grid-column-start: span 2;
    }

    .box.box--duodenary {
        grid-column-start: span 1;
    }

/* OLD BROWSER (IE) FLEXBOX FALLBACK (Requires Modernizr) */
.no-cssgrid .content-boxes {
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- */
    display: -ms-flexbox;
    /* OLD - TWEENER - IE 10 */
    display: -webkit-flex;
    /* RECENT - Chrome */
    display: flex;
    /* NEW - Firefox, Chrome, Opera, IE11 */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    -webkit-align-items: flex-start;
    align-items: flex-start;
    -webkit-align-content: flex-start;
    align-content: flex-start;
    overflow: hidden;
    margin-left: -16px;
}

.no-cssgrid .box {
    -webkit-box-flex: 0 1 auto;
    -webkit-flex: 0 1 auto;
    -moz-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    border-left: 16px solid transparent;
    border-bottom: 16px solid transparent;
    background-clip: padding-box;
}

    .no-cssgrid .box.box--full {
        -webkit-box-flex: 0 1 100%;
        -webkit-flex: 0 1 100%;
        -moz-flex: 0 1 100%;
        -ms-flex: 0 1 100%;
        flex: 0 1 100%;
        max-width: 100%;
    }

    .no-cssgrid .box.box--primary {
        -webkit-box-flex: 0 1 75%;
        -webkit-flex: 0 1 75%;
        -moz-flex: 0 1 75%;
        -ms-flex: 0 1 75%;
        flex: 0 1 75%;
        max-width: 75%;
    }

    .no-cssgrid .box.box--secondary {
        -webkit-box-flex: 0 1 66.665%;
        -webkit-flex: 0 1 66.665%;
        -moz-flex: 0 1 66.665%;
        -ms-flex: 0 1 66.665%;
        flex: 0 1 66.665%;
        max-width: 66.665%;
    }

    .no-cssgrid .box.box--half {
        -webkit-box-flex: 0 1 50%;
        -webkit-flex: 0 1 50%;
        -moz-flex: 0 1 50%;
        -ms-flex: 0 1 50%;
        flex: 0 1 50%;
        max-width: 50%;
    }

    .no-cssgrid .box.box--tertiary {
        -webkit-box-flex: 0 1 33.335%;
        -webkit-flex: 0 1 33.335%;
        -moz-flex: 0 1 33.335%;
        -ms-flex: 0 1 33.335%;
        flex: 0 1 33.335%;
        max-width: 33.335%;
    }

    .no-cssgrid .box.box--quarternary {
        -webkit-box-flex: 0 1 25%;
        -webkit-flex: 0 1 25%;
        -moz-flex: 0 1 25%;
        -ms-flex: 0 1 25%;
        flex: 0 1 25%;
        max-width: 25%;
    }

    .no-cssgrid .box.box--quinary {
        -webkit-box-flex: 0 1 20%;
        -webkit-flex: 0 1 20%;
        -moz-flex: 0 1 20%;
        -ms-flex: 0 1 20%;
        flex: 0 1 20%;
        max-width: 20%;
    }

    .no-cssgrid .box.box--senary {
        -webkit-box-flex: 0 1 16.66%;
        -webkit-flex: 0 1 16.66%;
        -moz-flex: 0 1 16.66%;
        -ms-flex: 0 1 16.66%;
        flex: 0 1 16.66%;
        max-width: 16.66%;
    }

    .no-cssgrid .box.box--duodenary {
        -webkit-box-flex: 0 1 8.33%;
        -webkit-flex: 0 1 8.33%;
        -moz-flex: 0 1 8.33%;
        -ms-flex: 0 1 8.33%;
        flex: 0 1 8.33%;
        max-width: 8.33%;
    }

/* ---- BOX ELEMENTS ---- */
.box__header {
    min-height: 40px;
    padding: 0;
    border: 1px solid #ececec;
}

    .box__header .box__header-main {
        position: relative;
        min-height: 40px;
    }

    .box__header .header-col {
        padding: 10px 16px;
    }

    .box__header H3,
    .box__header H4,
    .box__header H5 {
        margin-bottom: 0;
        font-size: 1.6rem;
        font-weight: 700;
        color: #768A98;
        text-transform: capitalize;
    }

    .box__header A.box__header-expand-button {
        display: inline-block;
        position: relative;
        width: 24px;
        height: 24px;
    }

    .box__header .icon.icon--dots-glyph {
        position: absolute;
        z-index: 1600;
        display: block;
        left: 0;
        right: 0;
        width: 5px;
        height: 5px;
        margin: 0 auto;
        background-color: #FBE122;
        border-radius: 5px;
        overflow: visible;
        white-space: nowrap;
        -webkit-transition: all 0.4s ease;
        -moz-transition: all 0.4s ease;
        -ms-transition: all 0.4s ease;
        -o-transition: all 0.4s ease;
        transition: all 0.4s ease;
    }

        .box__header .icon.icon--dots-glyph::after, .box__header .icon.icon--dots-glyph::before {
            /* dots of symbol */
            content: '';
            display: block;
            position: absolute;
            width: 5px;
            height: 5px;
            background-color: #FBE122;
            border-radius: 5px;
            -webkit-transition: background-color 0.4s ease;
            -moz-transition: background-color 0.4s ease;
            -ms-transition: background-color 0.4s ease;
            -o-transition: background-color 0.4s ease;
            transition: background-color 0.4s ease;
        }

        .box__header .icon.icon--dots-glyph::before {
            margin-top: 8px;
            /*background-color:red;*/
        }

        .box__header .icon.icon--dots-glyph::after {
            margin-top: 16px;
            /*background-color:yellow;*/
        }

        .box__header .icon.icon--dots-glyph:hover {
            background-color: #fce854;
        }

            .box__header .icon.icon--dots-glyph:hover::after, .box__header .icon.icon--dots-glyph:hover::before {
                background-color: #fce854;
            }

    .box__header .icon.icon--cross-glyph {
        position: absolute;
        z-index: 1600;
        display: inline-block;
        top: 0;
        right: 0;
        height: 18px;
        width: 18px;
        border-radius: 50%;
        overflow: hidden;
        text-indent: 100%;
        white-space: nowrap;
        left: 6px;
        opacity: 0;
    }

        .box__header .icon.icon--cross-glyph::after, .box__header .icon.icon--cross-glyph::before {
            /* lines of 'X' icon */
            content: '';
            position: absolute;
            height: 3px;
            width: 18px;
            left: 50%;
            top: 47.5%;
            background-color: #FBE122;
            -webkit-backface-visibility: hidden;
            -moz-backface-visibility: hidden;
            -ms-backface-visibility: hidden;
            -o-backface-visibility: hidden;
            backface-visibility: hidden;
            -webkit-transition: background-color 0.4s ease;
            -moz-transition: background-color 0.4s ease;
            -ms-transition: background-color 0.4s ease;
            -o-transition: background-color 0.4s ease;
            transition: background-color 0.4s ease;
        }

        .box__header .icon.icon--cross-glyph::after {
            -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg);
            -moz-transform: translateX(-50%) translateY(-50%) rotate(45deg);
            -o-transform: translateX(-50%) translateY(-50%) rotate(45deg);
            -ms-transform: translateX(-50%) translateY(-50%) rotate(45deg);
            transform: translateX(-50%) translateY(-50%) rotate(45deg);
        }

        .box__header .icon.icon--cross-glyph::before {
            -webkit-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
            -moz-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
            -o-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
            -ms-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
            transform: translateX(-50%) translateY(-50%) rotate(-45deg);
        }

        .box__header .icon.icon--cross-glyph:hover::after, .box__header .icon.icon--cross-glyph:hover::before {
            background-color: #fce854;
        }

.box__header-expander {
    background-color: rgba(251, 225, 34, 0.1);
    overflow: hidden;
    color: #FFF;
    -webkit-transition: max-height 0.4s ease-out;
    -moz-transition: max-height 0.4s ease-out;
    -ms-transition: max-height 0.4s ease-out;
    -o-transition: max-height 0.4s ease-out;
    transition: max-height 0.4s ease-out;
}

.box__header.expander--closed .box__header-expander {
    max-height: 0;
}

.box__header.expander--open .box__header-expander {
    max-height: 120px;
    overflow: visible;
}

.box__header.expander--closed I.icon.icon--dots-glyph {
    opacity: 1 !important;
    -webkit-transition: opacity 0.4s ease-in-out;
    -moz-transition: opacity 0.4s ease-in-out;
    -ms-transition: opacity 0.4s ease-in-out;
    -o-transition: opacity 0.4s ease-in-out;
    transition: opacity 0.4s ease-in-out;
}

.box__header.expander--closed I.icon.icon--cross-glyph {
    opacity: 0 !important;
}

.box__header.expander--open I.icon.icon--dots-glyph {
    opacity: 0 !important;
}

.box__header.expander--open I.icon.icon--cross-glyph {
    opacity: 1 !important;
    -webkit-transition: opacity 0.4s ease-in-out;
    -moz-transition: opacity 0.4s ease-in-out;
    -ms-transition: opacity 0.4s ease-in-out;
    -o-transition: opacity 0.4s ease-in-out;
    transition: opacity 0.4s ease-in-out;
}

.box .box__body {
    padding: 16px;
}

    .box .box__body.box__body--no-pad {
        padding: 0;
    }

/* ---- BOXES WITHIN MENU DIALOGS ---- */
.menu-dialog .box {
    text-align: left;
}

.menu-dialog H3.box__title {
    font-size: 2rem;
    font-weight: 400;
    line-height: 1.2;
    margin-bottom: 20px;
}

/* ---- CUSTOMER/COMPANY BOXES ---- */
.content-boxes.content-boxes--customer {
    padding: 20px 0;
    overflow: visible;
}

.box.box--customer {
    /*min-height:240px;*/
}

    .box.box--customer .box__body {
        padding: 24px 20px;
    }

.box--customer__logo-column {
    -webkit-box-flex: 0 1 auto;
    -webkit-flex: 0 1 auto;
    -moz-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    margin-bottom: 10px;
}

.box--customer__viewport {
    position: relative;
    width: 80px;
    height: 80px;
    border-radius: 6px;
    margin: auto;
    overflow: hidden;
}

.box--customer__logo {
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    /* Chrome, Safari 8+, Opera 15.0+ */
    -webkit-transform: -webkit-translate(-50%, -50%);
    /* Safari 7 */
    -moz-transform: translate(-50%, -50%);
    /* Firefox */
    -ms-transform: translate(-50%, -50%);
    /* IE 9 */
    -o-transform: translate(-50%, -50%);
    /* Opera 10.5 - 15.0 */
    transform: translate(-50%, -50%);
    width: auto;
    height: auto;
    min-width: 100.01%;
    min-height: 100.01%;
    max-width: 200%;
    min-width: 0;
    max-width: 80%;
    min-height: 0;
}

.box--customer__text-column {
    -webkit-box-flex: 1 1 50%;
    -webkit-flex: 1 1 50%;
    -moz-flex: 1 1 50%;
    -ms-flex: 1 1 50%;
    flex: 1 1 50%;
    position: relative;
    padding-left: 16px;
    margin-bottom: 20px;
}

.box--customer__text {
    padding: 16px;
    text-align: center;
}

H4.box--customer__title {
    font-size: 1.6rem;
    font-weight: 400;
    line-height: 0.9;
    margin-bottom: 1.06667rem;
    font-family: 'Invention', sans-serif;
    color: #414E54;
    text-transform: none;
}

.box--customer__buttons {
    -webkit-box-flex: 0 0 100%;
    -webkit-flex: 0 0 100%;
    -moz-flex: 0 0 100%;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    margin-bottom: 0;
}

/* ---- BANNER BOXES ---- */
.box.box--banner .box__body {
    position: relative;
    min-height: 200px;
    padding: 24px;
}

.box.box--banner.box--half .box__body {
    max-width: 600px;
}

.box--banner__title {
    font-family: 'Invention', sans-serif;
    color: #414E54;
    text-transform: none;
    white-space: normal;
}

H1.box--banner__title {
    font-size: 3.90625rem;
    font-weight: 400;
    line-height: 1.3;
    margin-bottom: 0;
}

H2.box--banner__title {
    font-size: 3.6rem;
    font-weight: 400;
    line-height: 1.3;
    margin-bottom: 0;
}

H3.box--banner__title {
    font-size: 3.125rem;
    font-weight: 400;
    line-height: 1.3;
    margin-bottom: 0;
}

H4.box--banner__title {
    font-size: 2.5rem;
    font-weight: 400;
    line-height: 1.3;
    margin-bottom: 0;
}

/* ============================================================== MEDIA QUERIES ============================================================== */
/* ---- LARGE DESKTOP (1600px +) ---- */
/* ---- SMALL DESKTOP (1440px - 1599px) ---- */
/* ---- LAPTOP (1280px - 1439px) ---- */
/* ---- TABLET (0 - 1279px) ---- */
@media only screen and (max-width: 1279px) {
    /* ---- CUSTOMER/COMPANY BOXES ---- */
    .box--customer__logo-column {
        margin-bottom: 32px;
    }

    .box--customer__viewport {
        width: 64px;
        height: 64px;
    }

    .box--customer__logo {
        max-width: 90%;
    }

    .box--customer__text-column {
        padding-left: 10px;
    }

    .box--customer__text {
        padding-top: 20px;
    }

    H4.box--customer__title {
        font-size: 1.28rem;
        font-weight: 400;
        line-height: 0.9;
        margin-bottom: 0.85333rem;
    }
}

/* ---- SMALL TABLET (600px - 959px) ---- */
@media only screen and (min-width: 600px) and (max-width: 959px) {
    .box.box--full {
        grid-column-start: span 12;
    }

    .box.box--primary {
        grid-column-start: span 9;
    }

    .box.box--secondary {
        grid-column-start: span 7;
    }

    .box.box--half {
        grid-column-start: span 6;
    }

    .box.box--tertiary {
        grid-column-start: span 5;
    }

    .box.box--quarternary {
        grid-column-start: span 4;
    }

    .box.box--quinary {
        grid-column-start: span 4;
    }

    .box.box--senary {
        grid-column-start: span 4;
    }

    .box.box--duodenary {
        grid-column-start: span 4;
    }
    /* OLD BROWSER (IE) FLEXBOX FALLBACK (Requires Modernizr) */
    .no-cssgrid .box.box--full {
        -webkit-box-flex: 0 1 100%;
        -webkit-flex: 0 1 100%;
        -moz-flex: 0 1 100%;
        -ms-flex: 0 1 100%;
        flex: 0 1 100%;
        max-width: 100%;
    }

    .no-cssgrid .box.box--primary {
        -webkit-box-flex: 0 1 75%;
        -webkit-flex: 0 1 75%;
        -moz-flex: 0 1 75%;
        -ms-flex: 0 1 75%;
        flex: 0 1 75%;
        max-width: 75%;
    }

    .no-cssgrid .box.box--secondary {
        -webkit-box-flex: 0 1 50%;
        -webkit-flex: 0 1 50%;
        -moz-flex: 0 1 50%;
        -ms-flex: 0 1 50%;
        flex: 0 1 50%;
        max-width: 50%;
    }

    .no-cssgrid .box.box--half {
        -webkit-box-flex: 0 1 50%;
        -webkit-flex: 0 1 50%;
        -moz-flex: 0 1 50%;
        -ms-flex: 0 1 50%;
        flex: 0 1 50%;
        max-width: 50%;
    }

    .no-cssgrid .box.box--tertiary {
        -webkit-box-flex: 0 1 50%;
        -webkit-flex: 0 1 50%;
        -moz-flex: 0 1 50%;
        -ms-flex: 0 1 50%;
        flex: 0 1 50%;
        max-width: 50%;
    }

    .no-cssgrid .box.box--quarternary {
        -webkit-box-flex: 0 1 33.335%;
        -webkit-flex: 0 1 33.335%;
        -moz-flex: 0 1 33.335%;
        -ms-flex: 0 1 33.335%;
        flex: 0 1 33.335%;
        max-width: 33.335%;
    }

    .no-cssgrid .box.box--quinary {
        -webkit-box-flex: 0 1 33.335%;
        -webkit-flex: 0 1 33.335%;
        -moz-flex: 0 1 33.335%;
        -ms-flex: 0 1 33.335%;
        flex: 0 1 33.335%;
        max-width: 33.335%;
    }

    .no-cssgrid .box.box--senary {
        -webkit-box-flex: 0 1 33.335%;
        -webkit-flex: 0 1 33.335%;
        -moz-flex: 0 1 33.335%;
        -ms-flex: 0 1 33.335%;
        flex: 0 1 33.335%;
        max-width: 33.335%;
    }

    .no-cssgrid .box.box--duodenary {
        -webkit-box-flex: 0 1 33.335%;
        -webkit-flex: 0 1 33.335%;
        -moz-flex: 0 1 33.335%;
        -ms-flex: 0 1 33.335%;
        flex: 0 1 33.335%;
        max-width: 33.335%;
    }

    .box .box__body.box__body--no-pad {
        height: 100%;
    }
}

/* ---- MOBILE (0 - 599px) ---- */
@media only screen and (max-width: 599px) {
    .box.box--primary,
    .box.box--secondary,
    .box.box--half,
    .box.box--tertiary,
    .box.box--quarternary,
    .box.box--senary,
    .box.box--duodenary {
        grid-column-start: span 12;
    }
    /* OLD BROWSER (IE) FALLBACK (Requires Modernizr) */
    .no-cssgrid .content-boxes {
        display: -webkit-box;
        /* OLD - iOS 6-, Safari 3.1-6 */
        display: -moz-box;
        /* OLD - Firefox 19- */
        display: -ms-flexbox;
        /* OLD - TWEENER - IE 10 */
        display: -webkit-flex;
        /* RECENT - Chrome */
        display: flex;
        /* NEW - Firefox, Chrome, Opera, IE11 */
        -webkit-flex-direction: column;
        -moz-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-justify-content: flex-start;
        justify-content: flex-start;
        -webkit-align-items: stretch;
        align-items: stretch;
        -webkit-align-content: flex-start;
        align-content: flex-start;
        margin-left: 0;
    }

    .no-cssgrid .box {
        -webkit-box-flex: 1 1 auto;
        -webkit-flex: 1 1 auto;
        -moz-flex: 1 1 auto;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
        border-left: 0;
    }

        .no-cssgrid .box.box--primary,
        .no-cssgrid .box.box--secondary,
        .no-cssgrid .box.box--half,
        .no-cssgrid .box.box--tertiary,
        .no-cssgrid .box.box--quarternary,
        .no-cssgrid .box.box--senary,
        .no-cssgrid .box.box--duodenary {
            -webkit-box-flex: 1 1 auto;
            -webkit-flex: 1 1 auto;
            -moz-flex: 1 1 auto;
            -ms-flex: 1 1 auto;
            flex: 1 1 auto;
            max-width: none;
        }

    .box .box__body.box__body--no-pad {
        height: 100%;
    }
}

/* ---- SMALL MOBILE (0 - 479px) ---- */
/* ===========================================================

	$FOOTER (v2 2018)

=========================================================== */
/* ---- SITE FOOTER ---- */
FOOTER.site-footer {
    position: relative;
    clear: both;
    min-height: 132px;
    background-color: #0C2340;
    color: #FFF;
}

/* ---- PAGE FOOTER ---- */
.footer-limits {
    clear: both;
    max-width: none;
    padding: 24px;
    margin: 0 auto;
}

.footnotes-wrap {
    padding: 20px 0;
    border-top: 1px solid #0C2340;
}

/* ---- SUB FOOTER ---- */
.sub-footer .footer-limits {
    padding: 0 8px;
}

/* ---- FOOTER COLUMNS ---- */
FOOTER .flex-column.footer-col--main {
    padding: 32px 20px 20px;
    text-align: right;
}

FOOTER .flex-column.footer-col--nav {
    padding: 48px 20px 20px;
    text-align: center;
}

FOOTER .flex-column.footer-col--logo-corp {
    text-align: right;
}

/* ---- FOOTER CONTENT ---- */
.footer__content {
    margin-top: 48px;
}

    .footer__content P.footnotes {
        font-size: 1.28rem;
        font-weight: 400;
    }

/* ============================================================== MEDIA QUERIES ============================================================== */
/* ---- LARGE DESKTOP (1600px +) ---- */
/* ---- SMALL DESKTOP (1440px - 1599px) ---- */
/* ---- LAPTOP (1280px - 1439px) ---- */
/* ---- LARGE TABLET (960px - 1279px) ---- */
/* ---- MOBILE TO TABLET (0 - 959px) ---- */
@media only screen and (max-width: 959px) {
    /* ---- SITE FOOTER ---- */
    FOOTER.site-footer {
        min-height: 120px;
    }
}

/* ---- LARGE MOBILE (480px - 639px) ---- */
/* ---- SMALL MOBILE (0 - 479px) ---- */
/* ---- SPECIFIC ---- */
/* ===========================================================

    $LOGIN PAGE

=========================================================== */
BODY.body--login {
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- */
    display: -ms-flexbox;
    /* OLD - TWEENER - IE 10 */
    display: -webkit-flex;
    /* RECENT - Chrome */
    display: flex;
    /* NEW - Firefox, Chrome, Opera, IE11 */
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -webkit-align-items: stretch;
    align-items: stretch;
    -webkit-align-content: flex-start;
    align-content: flex-start;
    position: relative;
    height: auto;
}

/* ---- LOGIN PAGE PUBLIC MAIN (Default theme) ---- */
MAIN.page-main.page-main--public {
    height: 100%;
    padding: 0;
    background-color: #0C2340;
}

    MAIN.page-main.page-main--public .page-limits {
        max-width: none;
        height: 100%;
        padding: 0;
    }

.login-wrap {
    height: 100%;
}

/* ---- MAIN COLUMNS (Default theme) ---- */
.login__content-column {
    -webkit-box-flex: 1 1 30%;
    -webkit-flex: 1 1 30%;
    -moz-flex: 1 1 30%;
    -ms-flex: 1 1 30%;
    flex: 1 1 30%;
    max-width: 30%;
    padding: 20px;
}

.login__image-column {
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- */
    display: -ms-flexbox;
    /* OLD - TWEENER - IE 10 */
    display: -webkit-flex;
    /* RECENT - Chrome */
    display: flex;
    /* NEW - Firefox, Chrome, Opera, IE11 */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: flext-end;
    justify-content: flext-end;
    -webkit-align-items: stretch;
    align-items: stretch;
    -webkit-align-content: flex-start;
    align-content: flex-start;
    -webkit-box-flex: 1 1 70%;
    -webkit-flex: 1 1 70%;
    -moz-flex: 1 1 70%;
    -ms-flex: 1 1 70%;
    flex: 1 1 70%;
    position: relative;
    max-width: 70%;
    position: relative;
    height: 100%;
    margin: 0;
    overflow: hidden;
    /*background:url('/Assets/images/proagrica/sheep.jpg') center center no-repeat; background-size:cover;*/
}

.login__banner-sub-column {
    -webkit-box-flex: 1 1 77.5%;
    -webkit-flex: 1 1 77.5%;
    -moz-flex: 1 1 77.5%;
    -ms-flex: 1 1 77.5%;
    flex: 1 1 77.5%;
    max-width: 77.5%;
    position: relative;
    z-index: 10;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    opacity: 1;
    padding: 48px 0 48px 100px;
}

.login__company-logo-sub-column {
    -webkit-box-flex: 0 1 22.5%;
    -webkit-flex: 0 1 22.5%;
    -moz-flex: 0 1 22.5%;
    -ms-flex: 0 1 22.5%;
    flex: 0 1 22.5%;
    max-width: 22.5%;
    padding: 32px;
}

.login__company-viewport {
    position: relative;
    z-index: 100;
    width: 100%;
    text-align: right;
}

.login__company-logo {
    max-width: 160px;
}

.login__main-logo {
    max-width: 84%;
    margin: 32px 0 24px 20px;
}

.section--login {
    position: relative;
    min-height: 120px;
    background-color: transparent;
}

    .section--login:nth-child(2n) {
        background-color: transparent;
    }

    .section--login .section-limits {
        padding: 32px 20px;
    }

.login-content {
    text-align: left;
    padding: 32px;
}

H2.banner-title {
    color: #FFF;
    font-size: 3.90625rem;
    font-weight: 700;
    text-align: center;
}

.banner-subtitle {
    color: #FFF;
    font-size: 1.6rem;
    text-align: center;
}

.banner-box {
    margin-top: 40px;
    padding: 30px;
    /*background-color: rgba(238, 193, 48, .8);*/
    background-color: #FBE122;
}

.features-wrapper {
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- */
    display: -ms-flexbox;
    /* OLD - TWEENER - IE 10 */
    display: -webkit-flex;
    /* RECENT - Chrome */
    display: flex;
    /* NEW - Firefox, Chrome, Opera, IE11 */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    -webkit-align-items: flex-start;
    align-items: flex-start;
    -webkit-align-content: flex-start;
    align-content: flex-start;
    padding: 32px;
    background-color: #FBE122;
    color: #1b1b1b;
    font-size: 1.504rem;
    border: solid 1px #1b1b1b;
}

.features__intro {
    -webkit-box-flex: 0 0 100%;
    -webkit-flex: 0 0 100%;
    -moz-flex: 0 0 100%;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
    color: #1b1b1b;
    font-size: 1.504rem;
    text-align: center;
}

.feature {
    -webkit-box-flex: 0 1 25%;
    -webkit-flex: 0 1 25%;
    -moz-flex: 0 1 25%;
    -ms-flex: 0 1 25%;
    flex: 0 1 25%;
    max-width: 25%;
    text-align: center;
    padding: 24px;
}

.feature__image {
    margin-bottom: 20px;
}

.feature__title {
    font-family: 'Invention', sans-serif;
    font-size: 0.9rem;
    font-weight: 600;
    text-transform: uppercase;
}

.features__button {
    -webkit-box-flex: 0 0 100%;
    -webkit-flex: 0 0 100%;
    -moz-flex: 0 0 100%;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
    text-align: center;
    padding-top: 32px;
}

.primary-button-yellow {
    display: inline-block;
    padding: 20px;
    border: 1px solid #1b1b1b;
    color: #1b1b1b;
    text-transform: uppercase;
    text-decoration: none;
    font-size: 12px;
    font-weight: 700;
    font-style: normal;
    letter-spacing: 2px;
    background-color: #FBE122;
    border-radius: 0;
    line-height: 1.5;
    cursor: pointer;
}

    .primary-button-yellow:hover {
        color: #FBE122;
        background-color: #1b1b1b;
        border: 1px solid #1b1b1b;
    }

.rule-center {
    width: 100px;
    height: 2px;
    background-color: #FBE122;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 24px;
    margin-top: 24px;
}

#animated-background {
    /*position:relative; animation:bgfade 15s infinite; background-size:cover; background-position:center; background-color:none;*/
    /**** Add a background overlay ****/
    /*&:before{content: ""; position:absolute; top:0; bottom:0; left:0; right:0; background-color:$baseColourDark; opacity:0.25;}*/
}

/*@keyframes bgfade {
    0%      {background-image: url('/Assets/images/proagrica/sheep.jpg');}
    25%     {background-image: url('/Assets/images/proagrica/cows.jpg');}
    50%     {background-image: url('/Assets/images/proagrica/pigs.jpg');}
    75%     {background-image: url('/Assets/images/proagrica/chickens.jpg');}
    100%    {background-image: url('/Assets/images/proagrica/tractor.jpg');}
}*/
.login__bkg-slideshow-viewport {
    position: absolute;
    z-index: 1;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    overflow: hidden;
}

    .login__bkg-slideshow-viewport:before {
        content: "";
        position: absolute;
        z-index: 5;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        background-color: #1b1b1b;
        opacity: 0.33;
    }

.login__bkg-slideshow-image {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    /* Chrome, Safari 8+, Opera 15.0+ */
    -webkit-transform: -webkit-translate(-50%, -50%);
    /* Safari 7 */
    -moz-transform: translate(-50%, -50%);
    /* Firefox */
    -ms-transform: translate(-50%, -50%);
    /* IE 9 */
    -o-transform: translate(-50%, -50%);
    /* Opera 10.5 - 15.0 */
    transform: translate(-50%, -50%);
    width: auto;
    height: auto;
    min-width: 100.01%;
    min-height: 100.01%;
    max-width: 200%;
    max-width: 120%;
    -webkit-transition: opacity 0.8s ease-in-out;
    -moz-transition: opacity 0.8s ease-in-out;
    -ms-transition: opacity 0.8s ease-in-out;
    -o-transition: opacity 0.8s ease-in-out;
    transition: opacity 0.8s ease-in-out;
}

@keyframes bgFadeInOut {
    0% {
        opacity: 1;
    }

    17% {
        opacity: 1;
    }

    25% {
        opacity: 0;
    }

    80% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

.login__bkg-slideshow-image {
    animation-name: bgFadeInOut;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    animation-duration: 24s;
    animation-direction: alternate;
}

.login__bkg-slideshow-viewport IMG:nth-of-type(1) {
    animation-delay: 16s;
}

.login__bkg-slideshow-viewport IMG:nth-of-type(2) {
    animation-delay: 12s;
}

.login__bkg-slideshow-viewport IMG:nth-of-type(3) {
    animation-delay: 8s;
}

.login__bkg-slideshow-viewport IMG:nth-of-type(4) {
    animation-delay: 4s;
}

.login__bkg-slideshow-viewport IMG:nth-of-type(5) {
    animation-delay: 0;
}

/* ============================================================== MEDIA QUERIES ============================================================== */
/* ---- LARGE DESKTOP (1600px +) ---- */
/* ---- SMALL DESKTOP (1440px - 1599px) ---- */
/* ---- LAPTOP (1280px - 1439px) ---- */
/* ---- MOBILE TO LARGE TABLET (0 - 1279px) ---- */
@media only screen and (max-width: 1279px) {
    /* ---- MAIN COLUMNS (Default Theme) ---- */
    .login__content-column {
        -webkit-box-flex: 0 1 33.33%;
        -webkit-flex: 0 1 33.33%;
        -moz-flex: 0 1 33.33%;
        -ms-flex: 0 1 33.33%;
        flex: 0 1 33.33%;
        max-width: 33.33%;
        padding: 20px;
    }

    .login__image-column {
        -webkit-box-flex: 0 1 66.66%;
        -webkit-flex: 0 1 66.66%;
        -moz-flex: 0 1 66.66%;
        -ms-flex: 0 1 66.66%;
        flex: 0 1 66.66%;
        max-width: 66.66%;
    }

    .login__banner-sub-column {
        -webkit-box-flex: 0 1 75%;
        -webkit-flex: 0 1 75%;
        -moz-flex: 0 1 75%;
        -ms-flex: 0 1 75%;
        flex: 0 1 75%;
        max-width: 75%;
        margin: 20px auto;
        padding: 32px 0 32px 64px;
    }

    .login__company-logo-sub-column {
        -webkit-box-flex: 0 1 25%;
        -webkit-flex: 0 1 25%;
        -moz-flex: 0 1 25%;
        -ms-flex: 0 1 25%;
        flex: 0 1 25%;
        max-width: 25%;
        padding: 20px;
    }
}

/* ---- LARGE TABLET (960px - 1279px) ---- */
/* ---- SMALL TABLET (640px - 959px) ---- */
/* ---- LARGE MOBILE (480px - 639px) ---- */
/* ---- SMALL MOBILE (0 - 479px) ---- */
/* ===========================================================

    $PDF PAGE & DOCUMENT

=========================================================== */
/* ======== SPECIFIC ======== */
/* ---- PDF PAGE ---- */
BODY.body--pdf {
    background-color: #F5F6FA;
    font-family: 'Invention', sans-serif;
}

.pdf-limits {
    clear: both;
    width: 100%;
    max-width: 8.3in;
    padding: 20px;
    margin: 0 auto 100px;
    background-color: #FFF;
}

/* ---- PDF HEADER ---- */
HEADER.pdf-header {
    margin-bottom: 32px;
}

/* ---- PDF HEADER LOGO ---- */
.pdf-header__logo-wrap {
    margin-bottom: 20px;
    text-align: left;
    display: flex;
}

    .pdf-header__logo-wrap .vline {
        height: 60px;
        width: 2px;
        background-color: #f0f0f0;
        margin-top: 10px;
    }

.pdf-header__logo {
    vertical-align: middle;
}

.pdf-header__logo-text {
    display: inline-block;
    margin-bottom: 0;
    font-size: 2rem;
    text-transform: uppercase;
    vertical-align: middle;
}

/* ---- PDF HEADER DETAILS ---- */
/* ---- PDF MAIN ---- */
MAIN.pdf-main SECTION.section--pdf {
    padding-top: 48px;
    margin-bottom: 48px;
    /* ---- PDF CONTENT TITLES ---- */
}

    MAIN.pdf-main SECTION.section--pdf H1.pdf-section__main-title {
        font-size: 2rem;
        font-weight: 700;
        line-height: 1.25;
        margin-bottom: 24px;
        font-family: 'Invention', sans-serif;
        font-style: normal;
        color: #1b1b1b;
        text-transform: uppercase;
    }

    MAIN.pdf-main SECTION.section--pdf H2.pdf-section__title {
        font-size: 1.6rem;
        font-weight: 600;
        line-height: 1.25;
        margin-bottom: 20px;
        font-family: 'Invention', sans-serif;
        font-style: normal;
        color: #1b1b1b;
        text-transform: uppercase;
    }

.section--pdf P {
    font-size: 1.28rem;
    line-height: 1.5;
    word-wrap: break-word;
    white-space: pre-wrap;
}

P.pdf-intro-text {
    font-size: 1.28rem;
    font-weight: 400;
    line-height: 1.4;
}

/* ---- PDF TABLES ---- */
BODY.body--pdf .table-wrap,
BODY.body--pdf .grid-wrap {
    overflow: hidden;
}

    BODY.body--pdf .table-wrap > TABLE,
    BODY.body--pdf .grid-wrap > TABLE,
    BODY.body--pdf .grid-wrap > .k-grid > TABLE {
        min-width: 740px;
    }

/* ---- PDF FOOTER ---- */
FOOTER.pdf-footer P {
    white-space: pre-wrap;
}

FOOTER.site-footer.site-footer--pdf,
FOOTER + FOOTER.site-footer {
    margin-top: 100px;
    margin-bottom: 64px;
}

    FOOTER.site-footer.site-footer--pdf .footer__side-tab-logo,
    FOOTER + FOOTER.site-footer .footer__side-tab-logo {
        bottom: -20px !important;
        left: -20px !important;
    }

/* ---- PDF ACTION BAR ---- */
ASIDE.pdf-action-bar {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 200;
    min-height: 64px;
    padding: 20px;
    background-color: rgba(12, 35, 64, 0.95);
}

/* ======== CHARTS ======= */
/* ---- PDF TABLES ---- */
.pdf-main #vaccineDetailsLists .questions-container {
    margin-bottom: 20px;
}

.pdf-main #vaccineDetailsLists .grid-panel {
    background-color: unset;
}

.pdf-main #vaccineDetailsLists .panel__title {
    text-transform: capitalize;
    font-family: 'Invention', sans-serif;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.2;
    margin: 0px 0 10px 0;
    background-color: #f5f5f5;
    border-bottom: 0px;
    padding: 10px;
}

.pdf-main #vaccineDetailsLists table {
    border-collapse: collapse;
    table-layout: fixed;
}

    .pdf-main #vaccineDetailsLists table th {
        vertical-align: middle;
        border: none;
        text-transform: capitalize;
        font-family: 'Invention', sans-serif;
        font-size: 14px;
        font-weight: 600;
        line-height: 1.2;
        padding: 15px 5px;
    }

    .pdf-main #vaccineDetailsLists table tr {
        border-bottom: 1px solid #f0f0f0;
    }

    .pdf-main #vaccineDetailsLists table td {
        vertical-align: middle;
        height: 70px;
        padding: 4px;
        font-size: 14px;
    }

/* ---- PDF HEADER DIAL CHARTS ---- */
/* ---- PDF MAIN DIAL CHARTS ---- */
BODY.body--pdf .chart__box {
    color: #414E54;
}

BODY.body--pdf .chart__container {
    margin-bottom: 0;
}

BODY.body--pdf .chart__canvas {
    position: relative;
    top: 2px;
}

BODY.body--pdf .chart__center-text SMALL {
    color: #414E54;
}

BODY.body--pdf .chart__title {
    margin-bottom: 0;
}

BODY.body--pdf MAIN.pdf-main .chart__box {
    padding: 16px 16px 16px;
}

/* ---- PDF COLUMN CHARTS ---- */
.pdf-chart-wrap {
    background-color: #F5F6FA;
}

    .pdf-chart-wrap .chart__block {
        /*padding-left:$spaceSize-small;*/
        /*padding-right:$spaceSize-small;*/
        margin-bottom: 0;
    }

        .pdf-chart-wrap .chart__block .highcharts-container {
            overflow: visible !important;
        }

            .pdf-chart-wrap .chart__block .highcharts-container .highcharts-root {
                overflow: visible;
            }

.section--pdf .highcharts-exporting-group,
.section--pdf #updateLegend {
    display: none;
}

.chart-range-scale--pdf {
    padding-left: 42px;
    padding-right: 28px;
}

/* ---- PDF QUESTIONS ---- */
.pdf-main .no-na-questions-header {
    margin-top: 10px;
    margin-bottom: 20px;
    text-transform: capitalize;
    font-family: 'Invention', sans-serif;
    font-size: 17px;
    padding: 10px;
    background-color: #f4f4f4;
}

.pdf-main .no-na-questions-title {
    margin-bottom: 20px;
    text-transform: capitalize;
    font-family: 'Invention', sans-serif;
    font-size: 17px;
    padding: 15px 10px;
    background-color: #f4f4f4;
    font-weight: bold;
    margin-top: 20px;
}

.no-na-question-parent {
    display: block;
    border-left:2px solid #d8d8d8;
    padding:0px 0px 20px 20px;
}
.notes-content {
    border: 1px solid #d8d8d8;
    border-radius: 6px;
    padding: 10px;
    margin: 10px 0px;
}
.pdf-image-pan {
    border: 1px solid #d8d8d8;
    border-radius: 6px;
    padding: 10px;
    margin: 10px 0px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 5px;
}
.image-item-pdf {
    
}
.image-item-pdf img {
    width: 100%;
    height: 100%;
    display: block;
    border: 1px solid #f0f0f0;
}
.no-na-questions-specify-reason-parent {
    display: flex;
    margin-bottom: 20px;
    margin-left: 40px;
    margin-right: 40px;
}
.pdf-main .chart_right .chart__wrap {
    min-width: 500px;
}

.pdf-main .no-na-question {
    flex: 0.8;
    font-family: 'Invention', sans-serif;
    font-size: 16px;
    font-weight: 300;
    color: #414e54;
    letter-spacing: .05rem;
}
.pdf-notes {
    margin: 15px 0px;
    font-size: 16px;
}
.pdf-main .no-na-questions-answer {
    flex: 0.2;
    font-family: 'Invention', sans-serif;
    font-size: 16px;
    color: #414e54;
    letter-spacing: .05rem;
    overflow-wrap: break-word;
}
.pdf-main .image-gallery {
    font-size: 16px;
}
.pdf-main .no-na-questions-specify-reason-title {
    flex: 0.03;
    font-family: 'Invention', sans-serif;
    font-size: 1.28rem;
    font-weight: 600;
    color: #414e54;
    letter-spacing: .05rem;
    flex-basis: initial;
}

.pdf-main .no-na-questions-specify-reason-answer {
    flex: 0.97;
    font-family: 'Invention', sans-serif;
    font-size: 1.28rem;
    font-weight: 300;
    color: #414e54;
    letter-spacing: .05rem;
    overflow-wrap: anywhere;
}

/* ---- PDF NOTES ---- */
.pdf-row #AuditCaseNotesList {
    min-width: unset;
}

/* ---- PDF MEDIA UPLOADS ---- */
.pdf-media-upload-parent.pdf-row.pdf-row--bottom-border {
    border-bottom: none;
}

.media-upload-header {
    text-transform: uppercase;
    font-family: 'Invention', sans-serif;
    padding: 10px 16px 10px 4px;
}

.pdf-media-upload-parent .media-view {
    margin-top: 4px;
    margin-bottom: 20px;
    border-style: none;
}

.pdf-media-upload-parent #listView {
    border-style: none;
}

/* ======== GENERAL ======== */
/* ---- PDF BOX ---- */
.pdf-box {
    /* padding: 10px;
    margin-bottom: 10px;
    background-color: #F5F6FA; */
}

.pdf-box__title {
    font-size: 1.6rem;
    font-weight: 600;
    line-height: 1.25;
    margin-bottom: 10px;
    padding-bottom: 10px;
    border-bottom: 1px solid #A1AEB4;
}

/* ---- PDF FIELDS ---- */
BODY.body--pdf .fields--row {
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
}

    BODY.body--pdf .fields--row:last-of-type {
        margin-bottom: 0;
    }

BODY.body--pdf .field.field--adjacent {
    -webkit-box-flex: 0 1 33.33%;
    -webkit-flex: 0 1 33.33%;
    -moz-flex: 0 1 33.33%;
    -ms-flex: 0 1 33.33%;
    flex: 0 1 33.33%;
    max-width: 33.33%;
    margin-bottom: 10px;
}

    BODY.body--pdf .field.field--adjacent.field--long {
        -webkit-box-flex: 1 1 50%;
        -webkit-flex: 1 1 50%;
        -moz-flex: 1 1 50%;
        -ms-flex: 1 1 50%;
        flex: 1 1 50%;
        max-width: none;
    }

    BODY.body--pdf .field.field--adjacent.field--short {
        -webkit-box-flex: 0 1 25%;
        -webkit-flex: 0 1 25%;
        -moz-flex: 0 1 25%;
        -ms-flex: 0 1 25%;
        flex: 0 1 25%;
        max-width: 25%;
    }

    BODY.body--pdf .field.field--adjacent.field--end-row {
        padding-right: 0;
    }

    BODY.body--pdf .field.field--adjacent.field--last-row {
        margin-bottom: 0;
    }

/* ---- PDF ROW ---- */
.pdf-row {
    padding: 8px 0;
}

    .pdf-row.pdf-row--bottom-border {
        border-bottom: 1px solid #dadfe1;
        margin-bottom: 10px;
    }

    .pdf-row .fields--row:last-of-type {
        margin-bottom: 0;
    }

    /* ---- PDF ROW COLUMNS ---- */
    .pdf-row.pdf-row--columns {
        display: -webkit-box;
        /* OLD - iOS 6-, Safari 3.1-6 */
        display: -moz-box;
        /* OLD - Firefox 19- */
        display: -ms-flexbox;
        /* OLD - TWEENER - IE 10 */
        display: -webkit-flex;
        /* RECENT - Chrome */
        display: flex;
        /* NEW - Firefox, Chrome, Opera, IE11 */
        -webkit-flex-direction: row;
        -moz-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-justify-content: flex-start;
        justify-content: flex-start;
        -webkit-align-items: stretch;
        align-items: stretch;
        -webkit-align-content: flex-start;
        align-content: flex-start;
    }

.pdf-header__dials .pdf-row.pdf-row--columns {
    border-top: none;
}

.pdf-row__col {
    -webkit-box-flex: 1 1 auto;
    -webkit-flex: 1 1 auto;
    -moz-flex: 1 1 auto;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    /*border:1px dashed purple;*/
}

    .pdf-row__col.pdf-row__col--title {
        -webkit-box-flex: 0 1 15%;
        -webkit-flex: 0 1 15%;
        -moz-flex: 0 1 15%;
        -ms-flex: 0 1 15%;
        flex: 0 1 15%;
        max-width: 15%;
        position: relative;
    }

        .pdf-row__col.pdf-row__col--title H2.pdf-row__title {
            position: absolute;
            top: 50%;
            left: 50%;
            -webkit-transform: translate(-50%, -50%);
            /* Chrome, Safari 8+, Opera 15.0+ */
            -webkit-transform: -webkit-translate(-50%, -50%);
            /* Safari 7 */
            -moz-transform: translate(-50%, -50%);
            /* Firefox */
            -ms-transform: translate(-50%, -50%);
            /* IE 9 */
            -o-transform: translate(-50%, -50%);
            /* Opera 10.5 - 15.0 */
            transform: translate(-50%, -50%);
        }

    .pdf-row__col.pdf-row__col--total {
        -webkit-box-flex: 0 1 20%;
        -webkit-flex: 0 1 20%;
        -moz-flex: 0 1 20%;
        -ms-flex: 0 1 20%;
        flex: 0 1 20%;
        max-width: 20%;
    }

        .pdf-row__col.pdf-row__col--total .chart__center-text {
            font-size: 2.5rem;
        }

    .pdf-row__col.pdf-row__col--primary {
        -webkit-box-flex: 0 1 17.5%;
        -webkit-flex: 0 1 17.5%;
        -moz-flex: 0 1 17.5%;
        -ms-flex: 0 1 17.5%;
        flex: 0 1 17.5%;
        max-width: 17.5%;
    }

        .pdf-row__col.pdf-row__col--primary .chart__center-text {
            font-size: 2.5rem;
        }

    .pdf-row__col.pdf-row__col--secondary {
        -webkit-box-flex: 0 1 13.25%;
        -webkit-flex: 0 1 13.25%;
        -moz-flex: 0 1 13.25%;
        -ms-flex: 0 1 13.25%;
        flex: 0 1 13.25%;
        max-width: 13.25%;
    }

        .pdf-row__col.pdf-row__col--secondary .chart__center-text {
            font-size: 1.6rem;
        }

/* ---- PDF ROW TITLE ---- */
.pdf-row__title {
    font-size: 18px;
    font-weight: 600;
    line-height: 1.2;
    margin-bottom: 0;
    background-color: #E5F2F1;
    padding: 20px 10px;
    margin-top: 20px;
}

/* ---- PDF PAGE MARKERS ---- */
.page-marker {
    display: block;
    position: absolute;
    z-index: 100;
    top: 0;
    left: 0;
    right: 0;
    height: 100%;
    margin: 0 auto;
    pointer-events: none;
}

    .page-marker .page-marker__box-wrap .page-marker__box {
        border-width: 2px;
        border-style: dashed;
        margin-bottom: 2px;
    }

        .page-marker .page-marker__box-wrap .page-marker__box.box--a4 {
            width: 8.3in;
            height: 11.8in;
            border-color: teal;
        }

    .page-marker.page-marker--off {
        visibility: hidden;
    }

    .page-marker.page-marker--on {
        visibility: visible;
    }

    .page-marker.page-marker--a4 {
        width: 8.3in;
    }

/* ---- PDF MULTI COLUMN GRID ---- */
.pdf-multi-column-grid {
    padding-bottom: 20px;
    border-bottom: 1px solid #A1AEB4;
    margin-bottom: 20px;
}

HEADER.pdf-multi-column-grid__master-header {
    padding: 16px 0;
    border-top: 1px solid #A1AEB4;
    border-bottom: 1px solid #dadfe1;
}

H3.pdf-multi-column-grid__master-title {
    font-size: 1.6rem;
    font-weight: 600;
    line-height: 1.25;
    margin-bottom: 0;
    font-family: 'Invention', sans-serif;
    font-style: normal;
    color: #1b1b1b;
    text-transform: uppercase;
    text-align: center;
}

    H3.pdf-multi-column-grid__master-title SPAN {
        margin-left: 16px;
        font-size: 125%;
        font-weight: 700;
    }

.pdf-multi-column-grid__main {
    padding: 16px;
    background-color: #F5F6FA;
}

.pdf-multi-column-grid__header-row {
    column-count: 3;
    column-gap: 16px;
}

HEADER.pdf-multi-column-grid__header {
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- */
    display: -ms-flexbox;
    /* OLD - TWEENER - IE 10 */
    display: -webkit-flex;
    /* RECENT - Chrome */
    display: flex;
    /* NEW - Firefox, Chrome, Opera, IE11 */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    -webkit-align-items: stretch;
    align-items: stretch;
    -webkit-align-content: flex-start;
    align-content: flex-start;
    background-color: #FFF;
    break-inside: avoid-column;
}

    HEADER.pdf-multi-column-grid__header .pdf-header-col {
        -webkit-box-flex: 0 1 50%;
        -webkit-flex: 0 1 50%;
        -moz-flex: 0 1 50%;
        -ms-flex: 0 1 50%;
        flex: 0 1 50%;
        max-width: 50%;
        padding: 4px;
        border-bottom: 1px solid #A1AEB4;
        text-align: center;
        font-size: 0.9rem;
        font-weight: 600;
        line-height: 1.25;
        margin-bottom: 0;
        font-family: 'Invention', sans-serif;
        font-style: normal;
        color: #1b1b1b;
        text-transform: uppercase;
    }

        HEADER.pdf-multi-column-grid__header .pdf-header-col:first-of-type {
            -webkit-box-flex: 0 1 60%;
            -webkit-flex: 0 1 60%;
            -moz-flex: 0 1 60%;
            -ms-flex: 0 1 60%;
            flex: 0 1 60%;
            max-width: 60%;
        }

        HEADER.pdf-multi-column-grid__header .pdf-header-col:last-of-type {
            -webkit-box-flex: 0 1 40%;
            -webkit-flex: 0 1 40%;
            -moz-flex: 0 1 40%;
            -ms-flex: 0 1 40%;
            flex: 0 1 40%;
            max-width: 40%;
        }

.pdf-multi-column-grid__body {
    column-count: 3;
    column-gap: 16px;
}

.pdf-multi-column-grid__data-row {
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- */
    display: -ms-flexbox;
    /* OLD - TWEENER - IE 10 */
    display: -webkit-flex;
    /* RECENT - Chrome */
    display: flex;
    /* NEW - Firefox, Chrome, Opera, IE11 */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    -webkit-align-items: stretch;
    align-items: stretch;
    -webkit-align-content: flex-start;
    align-content: flex-start;
    background-color: #FFF;
    break-inside: avoid-column;
}

    .pdf-multi-column-grid__data-row .pdf-data-col {
        -webkit-box-flex: 0 1 50%;
        -webkit-flex: 0 1 50%;
        -moz-flex: 0 1 50%;
        -ms-flex: 0 1 50%;
        flex: 0 1 50%;
        max-width: 50%;
        height: 32px;
        padding: 4px;
        border-bottom: 1px solid #dadfe1;
        text-align: center;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

        .pdf-multi-column-grid__data-row .pdf-data-col:first-of-type {
            -webkit-box-flex: 0 1 60%;
            -webkit-flex: 0 1 60%;
            -moz-flex: 0 1 60%;
            -ms-flex: 0 1 60%;
            flex: 0 1 60%;
            max-width: 60%;
        }

        .pdf-multi-column-grid__data-row .pdf-data-col:last-of-type {
            -webkit-box-flex: 0 1 40%;
            -webkit-flex: 0 1 40%;
            -moz-flex: 0 1 40%;
            -ms-flex: 0 1 40%;
            flex: 0 1 40%;
            max-width: 40%;
        }

/* ---- THAI PDF FORMAT CHANGES ---- */
/* ---- TOP PRIMARY DIALS CHANGES ---- */
.pdf-limits:lang(th) .pdf-row.pdf-row--columns {
    flex-wrap: wrap;
    justify-content: unset;
    padding: 0 20px 0 20px;
}

.pdf-limits:lang(th) .pdf-row__col.pdf-row__col--total {
    -webkit-box-flex: 0 1 33.3%;
    -webkit-flex: 0 1 33.3%;
    -moz-flex: 0 1 33.3%;
    -ms-flex: 0 1 33.3%;
    flex: 0 1 33.3%;
    max-width: 33.3%;
}

.pdf-limits:lang(th) .chart__container {
    text-align: center;
}

BODY.body--pdf.theme .pdf-limits:lang(th) .pdf-row .chart__title {
    letter-spacing: unset;
    overflow-wrap: unset;
}

/* ---- SUBHEADINGS ---- */
BODY.theme .pdf-limits:lang(th) H4.panel__title {
    overflow-wrap: unset;
}

BODY.body--pdf.theme .pdf-limits:lang(th) .pdf-row__col.pdf-row__col--title H2.pdf-row__title {
    overflow-wrap: unset;
    letter-spacing: unset;
}

/* ---- LOWER DIALS ---- */
.pdf-limits:lang(th) .pdf-row__col.pdf-row__col--title {
    flex: auto;
    max-width: fit-content;
}

    .pdf-limits:lang(th) .pdf-row__col.pdf-row__col--title .pdf-row__title {
        position: relative;
    }

.pdf-limits:lang(th) .pdf-row__col.pdf-row__col--primary {
    flex: auto;
    max-width: fit-content;
}

.pdf-limits:lang(th) .pdf-row__col.pdf-row__col--secondary {
    flex: auto;
    max-width: fit-content;
    padding-bottom: 12px;
}

/* ---- NO/NA QUESTIONS AND ANSWERS ---- */
.pdf-limits:lang(th) .no-na-question {
    letter-spacing: unset;
    overflow-wrap: unset;
}

.pdf-limits:lang(th) .no-na-questions-specify-reason-title {
    letter-spacing: unset;
    overflow-wrap: unset;
}

.pdf-limits:lang(th) .no-na-questions-answer {
    letter-spacing: unset;
    overflow-wrap: unset;
}

.pdf-limits:lang(th) .no-na-questions-specify-reason-answer {
    letter-spacing: unset;
    overflow-wrap: unset;
}

/* ===========================================================

    $WELCOME PAGE - EVALUATION MANAGER (2020)

=========================================================== */
/* ---- WELCOME STRUCTURE ---- */
MAIN.page-main.page-main--public {
    height: 100%;
    padding: 0;
    background-color: #0C2340;
}

    MAIN.page-main.page-main--public .page-limits {
        max-width: none;
        height: 100%;
        padding: 0;
    }

.welcome-wrap {
    height: 100%;
}

/* ---- MAIN COLUMNS ---- */
.welcome__content-column {
    -webkit-box-flex: 0 1 33.33%;
    -webkit-flex: 0 1 33.33%;
    -moz-flex: 0 1 33.33%;
    -ms-flex: 0 1 33.33%;
    flex: 0 1 33.33%;
    max-width: 33.33%;
}

.welcome__image-column {
    -webkit-box-flex: 0 1 66.66%;
    -webkit-flex: 0 1 66.66%;
    -moz-flex: 0 1 66.66%;
    -ms-flex: 0 1 66.66%;
    flex: 0 1 66.66%;
    max-width: 66.66%;
    position: relative;
    height: 100%;
    margin: 0;
    overflow: hidden;
    /*background:url('/Assets/images/proagrica/sheep.jpg') center center no-repeat; background-size:cover;*/
}

/* ---- MAIN IMAGE ---- */
.welcome__main-image {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    /* Chrome, Safari 8+, Opera 15.0+ */
    -webkit-transform: -webkit-translate(-50%, -50%);
    /* Safari 7 */
    -moz-transform: translate(-50%, -50%);
    /* Firefox */
    -ms-transform: translate(-50%, -50%);
    /* IE 9 */
    -o-transform: translate(-50%, -50%);
    /* Opera 10.5 - 15.0 */
    transform: translate(-50%, -50%);
    width: auto;
    height: auto;
    min-width: 100.01%;
    min-height: 100.01%;
    max-width: 200%;
    max-width: 120%;
}

/* ---- WELCOME LOGO ---- */
.welcome__main-logo {
    margin: 32px 0 24px 20px;
}

/* ---- CONTENT SECTION ---- */
.section--welcome {
    position: relative;
    min-height: 120px;
    background-color: transparent;
}

    .section--welcome:nth-child(2n) {
        background-color: transparent;
    }

    .section--welcome .section-limits {
        padding: 32px 20px;
    }

/* ---- SUB IMAGE ---- */
.image-container {
    display: none;
    position: relative;
    width: 100%;
    height: auto;
}

.welcome-image {
    position: absolute;
    height: inherit;
    width: inherit;
    bottom: 0;
    padding-right: 10%;
}

/* ---- WELCOME CONTENT ---- */
.welcome-content {
    text-align: left;
    padding: 32px;
}

/* ---- WELCOME TEXT ---- */
.welcome-content__title {
    font-family: 'Invention', sans-serif;
    font-size: 3.125rem;
    font-weight: 300;
    line-height: 1.2;
    color: #FBE122;
    text-transform: none;
}

    .welcome-content__title .alt {
        text-transform: none;
    }

.welcome-content--text P {
    font-family: 'Invention', sans-serif;
    font-weight: 300;
    color: #FFF;
}

/* ---- BUTTONS ---- */
/* ---- CAPTCHA POPOUT ---- */
.body--login .grecaptcha-badge {
    position: absolute !important;
    bottom: 200px !important;
}

/* ---- CULTURE SELECTION ---- */
.welcome-content .country-culture-wrapper {
    max-width: 256px;
    height: 40px;
    font-size: 1.28rem;
}

/* ============================================================== MEDIA QUERIES ============================================================== */
/* ---- LARGE DESKTOP (1600px +) ---- */
/* ---- SMALL DESKTOP (1440px - 1599px) ---- */
/* ---- LAPTOP AND ABOVE (1280px +) ---- */
@media only screen and (min-width: 1280px) {
    /* ---- CAPTCHA POPOUT ---- */
    .body--login .grecaptcha-badge {
        bottom: 180px !important;
    }
}

/* ---- MOBILE TO LARGE TABLET (0 - 1279px) ---- */
/* ---- LARGE TABLET (960px - 1279px) ---- */
/* ---- LARGE TABLET PORTRAIT (960px - 1279px) ---- */
/* ---- SMALL TABLET LANDSCAPE (720px height) ---- */
/* ---- MOBILE - SMALL TABLET (0 - 959px) ---- */
/* ---- SMALL TABLET (640px - 959px) ---- */
/* ---- LARGE MOBILE (480px - 639px) ---- */
/* ---- SMALL MOBILE (0 - 479px) ---- */
/* ===========================================================

    $DASHBOARD PAGE

=========================================================== */
/* ---- DASHBOARD STRUCTURE ---- */
.no-eval-container {
    margin: auto;
    width: 40%;
    padding: 30px;
    background-color: #F5F6FA;
    text-align: center;
    box-shadow: 1px 2px 8px rgba(0, 0, 0, 0.2);
}

.no-eval-image {
    width: 12%;
    height: auto;
}

.no-eval-text {
    text-align: center;
    padding: 14px 0;
}

.no-eval-text-1 {
    color: #000000;
    font-size: 18px;
    font-weight: 500;
    padding-top: 6px;
    text-transform: initial;
}

.no-eval-text-2 {
    font-size: 14px;
    padding-top: 6px;
    text-transform: initial;
}

.buttons--header.hidden {
    height: 0;
    width: 0;
    margin: 0;
    visibility: hidden;
}

/* ---- FILTER INPUTS ---- */
.fields--row-dashboard {
    flex-wrap: wrap;
}

.field.field--adjacent.field-dashboard {
    -webkit-box-flex: 0 1 25%;
    -webkit-flex: 0 1 25%;
    -moz-flex: 0 1 25%;
    -ms-flex: 0 1 25%;
    flex: 0 1 25%;
    max-width: 25%;
}

    .field.field--adjacent.field-dashboard .k-widget.k-datepicker {
        -webkit-box-flex: 1 1 100%;
        -webkit-flex: 1 1 100%;
        -moz-flex: 1 1 100%;
        -ms-flex: 1 1 100%;
        flex: 1 1 100%;
    }

        .field.field--adjacent.field-dashboard .k-widget.k-datepicker .k-picker-wrap.k-state-default {
            background-color: transparent;
        }

            .field.field--adjacent.field-dashboard .k-widget.k-datepicker .k-picker-wrap.k-state-default .k-select {
                background-color: #FFF;
            }

.fields--row.fields--row-users {
    -webkit-justify-content: flex-end;
    justify-content: flex-end;
    margin-bottom: 0;
}

.field.field--adjacent.field--users {
    flex: 0 1 33.33% !important;
}

.buttons.buttons--row.buttons.buttons--users {
    flex: 0 1 auto !important;
    padding-right: 0;
}

.button.button--filter-switch {
    position: absolute;
    top: 140px;
    right: 8px;
    z-index: 1;
}

    .button.button--filter-switch:hover I.icon:before {
        color: #e6cb04;
        -webkit-transition: color 0.4s ease;
        -moz-transition: color 0.4s ease;
        -ms-transition: color 0.4s ease;
        -o-transition: color 0.4s ease;
        transition: color 0.4s ease;
    }

.buttons.buttons--row.buttons-filter-dash {
    padding-right: 0;
}

HEADER .double-button-header {
    position: absolute;
    right: 0;
    top: -65px;
}

BODY.theme HEADER.page-header .buttons--header.side-by-side-button {
    position: relative;
    display: inline-block;
}

/* ============================================================== MEDIA QUERIES ============================================================== */
/* ---- LARGE DESKTOP (1600px +) ---- */
@media only screen and (min-width: 1600px) {
    .buttons-filter-dash {
        margin-bottom: 0;
        margin-top: 32px;
    }
    /* ---- USER FILTER ---- */
    .buttons.buttons--row.buttons.buttons--users {
        margin-top: 32px;
    }
}

/* ---- SMALL DESKTOP (1440px - 1599px) ---- */
@media only screen and (min-width: 1440px) and (max-width: 1600px) {
    .buttons-filter-dash {
        margin-bottom: 0;
        margin-top: 32px;
    }
    /* ---- USER FILTER ---- */
    .buttons.buttons--row.buttons.buttons--users {
        margin-top: 32px;
    }
}

/* ---- LAPTOP (1280px - 1439px) ---- */
@media only screen and (min-width: 1280px) and (max-width: 1439px) {
    .fields--row-dashboard {
        -webkit-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    .buttons-filter-dash {
        text-align: left;
        margin-bottom: 0;
        margin-top: 32px;
    }
    /* ---- USER FILTER ---- */
    .buttons.buttons--row.buttons.buttons--users {
        margin-top: 32px;
    }
}

/* ---- MOBILE TO LARGE TABLET (0 - 1279px) ---- */
@media only screen and (max-width: 1279px) {
    .field.field--adjacent.field-dashboard {
        flex: 0 1 25%;
        max-width: 25%;
    }

    .buttons-filter-dash {
        text-align: left;
        margin-bottom: 0;
    }
}

/* ---- LARGE TABLET (960px - 1279px) ---- */
@media only screen and (min-width: 960px) and (max-width: 1279px) {
    .buttons-filter-dash {
        margin-bottom: 0;
        margin-top: 32px;
    }
    /* ---- USER FILTER ---- */
    .buttons.buttons--row.buttons.buttons--users {
        margin-top: 32px;
    }
}

/* ---- SMALL TABLET (640px - 959px) ---- */
@media only screen and (min-width: 600px) and (max-width: 959px) {
    .no-eval-container {
        width: 60%;
    }

    .field.field--adjacent.field-dashboard {
        width: 100%;
    }

    .field.field--adjacent.field-dashboard {
        padding-right: 0;
    }

    .buttons.buttons--row.buttons--stacked.buttons-filter-dash {
        padding-right: 0;
        margin-top: 10px;
        margin-bottom: 0;
    }
}

/* ---- LARGE MOBILE (480px - 639px) ---- */
@media only screen and (min-width: 480px) and (max-width: 599px) {
    .no-eval-container {
        width: 80%;
    }
}

/* ---- SMALL MOBILE (0 - 479px) ---- */
@media only screen and (max-width: 479px) {
    .no-eval-container {
        width: 90%;
    }
}

/* ===========================================================

    $CONTENT SECTIONS (v2 2018)

=========================================================== */
/* ---- CONTENT STRUCTURE ---- */
.section--content {
    position: relative;
    min-height: 120px;
    background-color: #FFF;
    overflow-x: hidden;
}

    .section--content .section-limits {
        padding: 32px 20px;
    }

    .section--content:last-of-type .section-limits {
        padding: 32px 20px 20px;
    }

    .section--content.section--reduced .section-limits {
        padding: 20px;
        background-color: #FFF;
    }

    .section--content.section--top-cut .section-limits {
        padding: 0 20px 20px;
    }

    .section--content.section--bottom-cut .section-limits {
        padding: 64px 20px 0;
    }

    /* ---- CONTENT THEME ---- */
    .section--content.content--primary {
        background-color: #FFF;
    }

    .section--content.content--secondary {
        background-color: #F5F6FA;
    }

/* ---- CONTENT PANEL ---- */
.content-panel {
    padding: 20px;
    background-color: #FFF;
}

    .content-panel.content-panel--alt-1 {
        padding: 20px 0;
        background-color: transparent;
    }

    .content-panel .content-boxes {
        margin-bottom: 20px;
    }

.content-panel__header {
    display: flex;
    justify-content: space-between;
    padding-bottom: 10px;
    border-bottom: 1px solid #ececec;
    margin-bottom: 20px;
}

.content-panel__title {
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 2.2;
    margin-bottom: 0;
    font-family: 'Invention', sans-serif;
    font-style: normal;
    color: #1b1b1b;
    text-transform: uppercase;
}

.content-panel__filter {
    font-size: 1.6rem;
    font-weight: 400;
    line-height: 1.2;
    margin-bottom: 0;
    font-family: 'Invention', sans-serif;
    font-style: normal;
    color: blue;
    text-transform: initial;
}

/* ---- FILTER PANEL ---- */
.filter_panel {
    width: 100%;
    height: auto;
    background-color: #0C2340;
    overflow: hidden;
    opacity: 1;
    max-height: 200px;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}

    .filter_panel.hide {
        opacity: 0;
        max-height: 0;
    }

.filter_panel__wrapper {
    display: flex;
    padding: 6px 16px 12px 16px;
}

.filter_panel__text {
    padding: 12px 16px 0 20px;
    font-size: 1.1rem;
    font-weight: 700;
    line-height: 1.2;
    margin-bottom: 0;
    font-family: 'Invention', sans-serif;
    font-style: normal;
    color: #FFF;
    text-transform: uppercase;
}

.kendo_filter_wrapper {
    display: flex;
    width: 90%;
}

.filter_panel__apply_button {
    display: inline-block;
    min-width: 10rem;
    padding: 4px 10px;
    margin-left: 8px;
}

.apply_button__text {
    vertical-align: text-top;
}

.filter--export-excel-icon {
    position: absolute;
    top: 0 !important;
    bottom: 0;
    left: 7px;
    margin: auto;
}

/* ---- IMFO BOX ---- */
.info-box {
    padding: 16px;
    background-color: transparent;
}

    .info-box.info-box--alt {
        background-color: #0C2340;
        color: #FFF;
    }

    .info-box.info-box--last-evaluation {
        border-right: 1px solid #ececec;
    }

    .info-box H4.info-box__heading {
        font-size: 1.6rem;
        font-weight: 600;
        line-height: 1.1;
        margin-bottom: 20px;
        font-family: 'Invention', sans-serif;
        font-style: normal;
        color: #1b1b1b;
        text-transform: capitalize;
    }

    .info-box H5.info-box__subheading {
        font-size: 1.28rem;
        font-weight: 600;
        line-height: 1.1;
        margin-bottom: 20px;
        font-family: 'Invention', sans-serif;
        font-style: normal;
        color: #0C2340;
        text-transform: capitalize;
    }

ADDRESS.info-box__address {
    padding: 8px;
    margin-bottom: 16px;
    border-radius: 4px;
    background-color: #ececec;
    color: #0C2340;
}

    ADDRESS.info-box__address SPAN {
        display: inline-block;
    }

ADDRESS SPAN.info-box__address--street {
    margin-bottom: 6px;
}

ADDRESS SPAN.info-box__address--location {
    font-weight: 600;
}

.info-box__label-list {
    margin-bottom: 16px;
}

    .info-box__label-list DD {
        font-weight: 600;
    }

/* ---- BANNER (Non-box variant) ---- */
.banner {
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- */
    display: -ms-flexbox;
    /* OLD - TWEENER - IE 10 */
    display: -webkit-flex;
    /* RECENT - Chrome */
    display: flex;
    /* NEW - Firefox, Chrome, Opera, IE11 */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    -webkit-align-items: stretch;
    align-items: stretch;
    -webkit-align-content: flex-start;
    align-content: flex-start;
    width: 100%;
    margin-bottom: 32px;
}

.banner__body {
    -webkit-box-flex: 1 1 100%;
    -webkit-flex: 1 1 100%;
    -moz-flex: 1 1 100%;
    -ms-flex: 1 1 100%;
    flex: 1 1 100%;
    position: relative;
    padding: 32px 24px;
}

.banner__title {
    font-family: 'Invention', sans-serif;
    color: #414E54;
    text-transform: none;
    white-space: normal;
}

H1.banner__title {
    font-size: 3.90625rem;
    font-weight: 400;
    line-height: 1.3;
    margin-bottom: 0;
}

H2.banner__title {
    font-size: 3.6rem;
    font-weight: 400;
    line-height: 1.3;
    margin-bottom: 0;
}

H3.banner__title {
    font-size: 3.125rem;
    font-weight: 400;
    line-height: 1.3;
    margin-bottom: 0;
}

H4.banner__title {
    font-size: 2.5rem;
    font-weight: 400;
    line-height: 1.3;
    margin-bottom: 0;
}

.banner__viewport {
    -webkit-box-flex: 0 1 25%;
    -webkit-flex: 0 1 25%;
    -moz-flex: 0 1 25%;
    -ms-flex: 0 1 25%;
    flex: 0 1 25%;
    position: relative;
    overflow: hidden;
}

.banner__image {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    /* Chrome, Safari 8+, Opera 15.0+ */
    -webkit-transform: -webkit-translate(-50%, -50%);
    /* Safari 7 */
    -moz-transform: translate(-50%, -50%);
    /* Firefox */
    -ms-transform: translate(-50%, -50%);
    /* IE 9 */
    -o-transform: translate(-50%, -50%);
    /* Opera 10.5 - 15.0 */
    transform: translate(-50%, -50%);
    width: auto;
    height: auto;
    min-width: 100.01%;
    min-height: 100.01%;
    max-width: 200%;
}

/* ---- STEP CONTENT & NAV ---- */
.step-content {
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- */
    display: -ms-flexbox;
    /* OLD - TWEENER - IE 10 */
    display: -webkit-flex;
    /* RECENT - Chrome */
    display: flex;
    /* NEW - Firefox, Chrome, Opera, IE11 */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    -webkit-align-items: stretch;
    align-items: stretch;
    -webkit-align-content: flex-start;
    align-content: flex-start;
    width: 100%;
}

.step-content__title {
    font-size: 2rem;
    font-weight: 400;
    line-height: 1.2;
    margin-bottom: 24px;
    font-family: 'Invention', sans-serif;
    font-style: normal;
    color: #414E54;
    text-transform: capitalize;
    text-align: right;
}

.step-content__side {
    /* -webkit-box-flex: 0 1 22.5%;
  -webkit-flex: 0 1 22.5%;
  -moz-flex: 0 1 22.5%;
  -ms-flex: 0 1 22.5%;
  flex: 0 1 22.5%; */
    flex-shrink: 0;
}

.step-content__details {
    padding: 16px 20px;
    margin-bottom: 20px;
}

H4.step-details__title {
    font-size: 16px;
    font-weight: normal;
    line-height: 1.2;
    margin-bottom: 10px;
    font-family: 'Invention', sans-serif;
    font-style: normal;
    color: rgba(0, 0, 0, 0.88);
}

.step-details__item {
    display: block;
    width: auto;
    margin-bottom: 6px;
    font-family: 'Invention', sans-serif;
    font-size: 1.504rem;
    color: #1b1b1b;
    word-break: break-word;
    opacity: 1;
    transition: all .35s ease-in-out,
}
.vertical-tab-wrapper.collapsed .step-details__item {
    display: none;
}
NAV.step-content__nav {
    width: 100%;
}

.step-content__body {
    -webkit-box-flex: 0 1 77.5%;
    -webkit-flex: 0 1 77.5%;
    -moz-flex: 0 1 77.5%;
    -ms-flex: 0 1 77.5%;
    flex: 0 1 77.5%;
    max-width: 77.5%;
    padding-left: 64px;
}

.slide .step-content__body {
    flex: 1 !important;
    max-width: 100% !important;
}

.step-content__buttons.buttons {
    padding: 0px;
    display: flex;
    justify-content: flex-end;
    background-color: #fff;
    padding-bottom: 15px;
}

.step-content__buttons:empty {
    display: none;
}

.notes-summary-container {
    float: right;
    position: absolute;
    right: 5em;
}

/* ---- HTML2PDF TESTING ---- */
/*.check-list-pdf                                         {display:block; width:100%; height:auto; padding:$spaceSize-small;}
.check-list-pdf__header                                 {@include flexbox-flex(0 0 100%); height:80px; margin-bottom:16px; background-color:blue;}
.check-list-pdf__test-container                         {display:block; width:100%; height:auto;}
.check-list-pdf__test-page                              {@include flexbox(row, wrap, flex-start, flex-start, flex-start); width:100%; height:8in; border:2px dashed purple; margin-bottom:16px; color:purple; page-break-inside:avoid;}
.check-list-pdf__test-page.check-list-pdf__test-page--break     {page-break-after:always;}
.check-list-pdf__test-item                              {@include flexbox-flex(0 1 49%); min-height:60px; padding:16px; border:2px dashed green; margin-bottom:16px; color:green;}
.check-list-pdf__test-item:nth-of-type(even)            {margin-left:2%;}*/
/* ============================================================== MEDIA QUERIES ============================================================== */
/* ---- LARGE DESKTOP (1600px +) ---- */
/* ---- LAPTOP & SMALL DESKTOP (1280px - 1599px) ---- */
@media only screen and (min-width: 1280px) and (max-width: 1599px) {
    /* ---- STEP CONTENT & NAV ---- */
    .step-content__body {
        padding-left: 24px;
    }
}

/* ---- LARGE TABLET (960px - 1279px) ---- */
@media only screen and (min-width: 960px) and (max-width: 1279px) {
    /* ---- STEP CONTENT & NAV ---- */
    .step-content__side {
        -webkit-box-flex: 0 1 25%;
        -webkit-flex: 0 1 25%;
        -moz-flex: 0 1 25%;
        -ms-flex: 0 1 25%;
        flex: 0 1 25%;
    }

    .step-content__body {
        -webkit-box-flex: 0 1 75%;
        -webkit-flex: 0 1 75%;
        -moz-flex: 0 1 75%;
        -ms-flex: 0 1 75%;
        flex: 0 1 75%;
        max-width: 75%;
        padding-left: 20px;
        padding-right: 20px;
    }
    .admin-right-pan {
        padding-right: 24px;
    }
}

/* ---- SMALL TABLET (600px - 959px) ---- */
@media only screen and (min-width: 600px) and (max-width: 959px) {
    /* ---- STEP CONTENT & NAV ---- */
    .step-content__side {
        -webkit-box-flex: 0 1 30%;
        -webkit-flex: 0 1 30%;
        -moz-flex: 0 1 30%;
        -ms-flex: 0 1 30%;
        flex: 0 1 30%;
    }

    .step-content__body {
        -webkit-box-flex: 0 1 70%;
        -webkit-flex: 0 1 70%;
        -moz-flex: 0 1 70%;
        -ms-flex: 0 1 70%;
        flex: 0 1 70%;
        max-width: 70%;
        padding-left: 20px;
    }
}

/* ---- MOBILE & SMALL TABLET (0 - 959px) ---- */
@media only screen and (max-width: 959px) {
    /* ---- CONTENT STRUCTURE ---- */
    .section--content .section-limits {
        padding: 48px 16px;
    }

    .section--content:first-of-type .section-limits {
        padding: 32px 20px 20px;
    }

    .section--content:last-of-type .section-limits {
        padding: 48px 20px 20px;
    }

    .section--content.section--top-cut-mobile .section-limits {
        padding-top: 0;
    }

    .section--content.section--bottom-cut-mobile .section-limits {
        padding-bottom: 0 !important;
    }
    /* ---- BANNER (Non-box variant) ---- */
    .banner {
        display: -webkit-box;
        /* OLD - iOS 6-, Safari 3.1-6 */
        display: -moz-box;
        /* OLD - Firefox 19- */
        display: -ms-flexbox;
        /* OLD - TWEENER - IE 10 */
        display: -webkit-flex;
        /* RECENT - Chrome */
        display: flex;
        /* NEW - Firefox, Chrome, Opera, IE11 */
        -webkit-flex-direction: column;
        -moz-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-justify-content: flex-start;
        justify-content: flex-start;
        -webkit-align-items: stretch;
        align-items: stretch;
        -webkit-align-content: flex-start;
        align-content: flex-start;
    }

    .banner__body {
        -webkit-box-flex: 1 1 auto;
        -webkit-flex: 1 1 auto;
        -moz-flex: 1 1 auto;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
    }

    H1.banner__title {
        font-size: 3.125rem;
        font-weight: 400;
        line-height: 1.3;
        margin-bottom: 0;
    }

    H2.banner__title {
        font-size: 2.5rem;
        font-weight: 400;
        line-height: 1.3;
        margin-bottom: 0;
    }

    H3.banner__title {
        font-size: 2rem;
        font-weight: 400;
        line-height: 1.3;
        margin-bottom: 0;
    }

    H4.banner__title {
        font-size: 1.6rem;
        font-weight: 400;
        line-height: 1.3;
        margin-bottom: 0;
    }

    .banner__viewport {
        -webkit-box-flex: 1 1 240px;
        -webkit-flex: 1 1 240px;
        -moz-flex: 1 1 240px;
        -ms-flex: 1 1 240px;
        flex: 1 1 240px;
    }
}

/* ---- SMALL MOBILE (0 - 479px) ---- */
@media only screen and (max-width: 479px) {
    .step-content {
        flex-direction: column;
    }

    .step-content__body {
        flex: 0 1 100%;
        max-width: 100%;
        padding-left: 0px;
    }

    .step-content__side {
        padding-bottom: 20px;
    }
}

/* ===========================================================

    $LANDING SECTION

=========================================================== */
/* ---- LANDING STRUCTURE ---- */
.section--landing {
    position: relative;
    min-height: 120px;
    background-color: transparent;
}

    .section--landing:nth-child(2n) {
        background-color: transparent;
    }

    .section--landing .section-limits {
        padding: 32px 20px;
    }

.landing-container {
    /*width:50%;*/
    max-width: 1280px;
}

/* ======================= UPDATED STRUCTURE =================================*/
/* ---- LANDING PAGE TITLE ---- */
.landing__title {
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 1.2;
    margin-bottom: 24px;
    font-family: 'Invention', sans-serif;
    font-style: normal;
    color: #1b1b1b;
    text-transform: capitalize;
    text-align: center;
}

/* ---- LANDING PAGE CONTENT WRAPPER ---- */
.evaluation__container {
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- */
    display: -ms-flexbox;
    /* OLD - TWEENER - IE 10 */
    display: -webkit-flex;
    /* RECENT - Chrome */
    display: flex;
    /* NEW - Firefox, Chrome, Opera, IE11 */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: flex-start;
    align-items: flex-start;
    -webkit-align-content: flex-start;
    align-content: flex-start;
}

/* ---- WRAP FOR TILE SETS ---- */
.evaluation__tile-set {
    -webkit-box-flex: 0 1 25%;
    -webkit-flex: 0 1 25%;
    -moz-flex: 0 1 25%;
    -ms-flex: 0 1 25%;
    flex: 0 1 25%;
    max-width: 25%;
    padding: 24px;
}

/* ---- MAIN TILE BUTTONS ---- */
.evaluation__tile {
    position: relative;
    width: 100%;
    height: auto;
    min-height: 140px;
    padding: 32px 0;
    text-align: center;
    /* Width for Merck should be 48px */
}

    .evaluation__tile .evaluation-tile__icon {
        display: block;
        height: auto;
        width: 80px;
        margin: 0 auto 6px;
    }

    .evaluation__tile .evaluation-tile__text {
        display: block;
        margin-right: 10px;
        font-size: 1.1rem;
        font-weight: 600;
    }

/* ---- LARGE TILE CHEVRON ---- */
.icon.evaluation-tile__chevron {
    position: absolute;
    z-index: 1600;
    display: block;
    top: 15px;
    right: 15px;
    height: 12px;
    width: 12px;
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -ms-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
    right: 4px;
    bottom: 45%;
    top: unset;
}

    .icon.evaluation-tile__chevron::after, .icon.evaluation-tile__chevron::before {
        /* lines of '>' icon */
        content: '';
        position: absolute;
        height: 2px;
        width: 6px;
        left: 30%;
        top: 50%;
        background-color: #1b1b1b;
        -webkit-backface-visibility: hidden;
        -moz-backface-visibility: hidden;
        -ms-backface-visibility: hidden;
        -o-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-transition: background-color 0.4s ease;
        -moz-transition: background-color 0.4s ease;
        -ms-transition: background-color 0.4s ease;
        -o-transition: background-color 0.4s ease;
        transition: background-color 0.4s ease;
    }

    .icon.evaluation-tile__chevron::before {
        -webkit-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        -moz-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        -o-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        -ms-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        transform: translateX(-36%) translateY(-30%) rotate(-45deg);
    }

    .icon.evaluation-tile__chevron::after {
        -webkit-transform: translateX(36%) translateY(-30%) rotate(45deg);
        -moz-transform: translateX(36%) translateY(-30%) rotate(45deg);
        -o-transform: translateX(36%) translateY(-30%) rotate(45deg);
        -ms-transform: translateX(36%) translateY(-30%) rotate(45deg);
        transform: translateX(36%) translateY(-30%) rotate(45deg);
    }

    .icon.evaluation-tile__chevron:hover::after, .icon.evaluation-tile__chevron:hover::before {
        background-color: #414E54;
    }

/* ---- NEW CASE BUTTON ---- */
.button.evaluation__button--create-new {
    position: relative;
    width: 100%;
    height: auto;
    padding: 6px 16px;
    margin-top: 10px;
    margin-left: 0;
}

    .button.evaluation__button--create-new .evaluation-button-new__text {
        margin-bottom: 0;
        font-size: 1rem;
        font-weight: 600;
        letter-spacing: 0.01rem;
    }

    .button.evaluation__button--create-new .icon.evaluation-button-new__chevron {
        position: absolute;
        z-index: 1600;
        display: block;
        top: 15px;
        right: 15px;
        height: 12px;
        width: 12px;
        overflow: hidden;
        text-indent: 100%;
        white-space: nowrap;
        -webkit-transition: all 0.4s ease;
        -moz-transition: all 0.4s ease;
        -ms-transition: all 0.4s ease;
        -o-transition: all 0.4s ease;
        transition: all 0.4s ease;
        -webkit-transform: rotate(90deg);
        -moz-transform: rotate(90deg);
        -o-transform: rotate(90deg);
        -ms-transform: rotate(90deg);
        transform: rotate(90deg);
        right: 4px;
        bottom: 8px;
        top: unset;
    }

        .button.evaluation__button--create-new .icon.evaluation-button-new__chevron::after, .button.evaluation__button--create-new .icon.evaluation-button-new__chevron::before {
            /* lines of '>' icon */
            content: '';
            position: absolute;
            height: 2px;
            width: 6px;
            left: 30%;
            top: 50%;
            background-color: #1b1b1b;
            -webkit-backface-visibility: hidden;
            -moz-backface-visibility: hidden;
            -ms-backface-visibility: hidden;
            -o-backface-visibility: hidden;
            backface-visibility: hidden;
            -webkit-transition: background-color 0.4s ease;
            -moz-transition: background-color 0.4s ease;
            -ms-transition: background-color 0.4s ease;
            -o-transition: background-color 0.4s ease;
            transition: background-color 0.4s ease;
        }

        .button.evaluation__button--create-new .icon.evaluation-button-new__chevron::before {
            -webkit-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
            -moz-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
            -o-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
            -ms-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
            transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        }

        .button.evaluation__button--create-new .icon.evaluation-button-new__chevron::after {
            -webkit-transform: translateX(36%) translateY(-30%) rotate(45deg);
            -moz-transform: translateX(36%) translateY(-30%) rotate(45deg);
            -o-transform: translateX(36%) translateY(-30%) rotate(45deg);
            -ms-transform: translateX(36%) translateY(-30%) rotate(45deg);
            transform: translateX(36%) translateY(-30%) rotate(45deg);
        }

        .button.evaluation__button--create-new .icon.evaluation-button-new__chevron:hover::after, .button.evaluation__button--create-new .icon.evaluation-button-new__chevron:hover::before {
            background-color: #414E54;
        }

/* ---- PREVIOUS EVALUATIONS ---- */
.prev-evaluations-wrap {
    max-height: 0;
    padding-top: 20px;
    padding-bottom: 20px;
    margin: 0;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -ms-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

    .prev-evaluations-wrap.prev-evaluations-wrap--visible {
        max-height: 480px;
        padding-top: 20px;
        padding-bottom: 20px;
        visibility: visible;
        opacity: 1;
    }

    .prev-evaluations-wrap.prev-evaluations-wrap--hidden {
        max-height: 0;
        padding-top: 0;
        padding-bottom: 0;
        visibility: hidden;
        opacity: 0;
    }

    .prev-evaluations-wrap .prev-evaluations__header {
        text-align: center;
        margin-bottom: 16px;
    }

        .prev-evaluations-wrap .prev-evaluations__header H5.prev-evaluations__title {
            font-size: 1.28rem;
            font-weight: 700;
            margin-bottom: 0;
        }

    .prev-evaluations-wrap .prev-evaluations__links {
        display: -webkit-box;
        /* OLD - iOS 6-, Safari 3.1-6 */
        display: -moz-box;
        /* OLD - Firefox 19- */
        display: -ms-flexbox;
        /* OLD - TWEENER - IE 10 */
        display: -webkit-flex;
        /* RECENT - Chrome */
        display: flex;
        /* NEW - Firefox, Chrome, Opera, IE11 */
        -webkit-flex-direction: column;
        -moz-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-align-items: center;
        align-items: center;
        -webkit-align-content: center;
        align-content: center;
    }

        .prev-evaluations-wrap .prev-evaluations__links .prev-evaluations__link {
            -webkit-box-flex: 1 1 32px;
            -webkit-flex: 1 1 32px;
            -moz-flex: 1 1 32px;
            -ms-flex: 1 1 32px;
            flex: 1 1 32px;
            position: relative;
            max-width: 100%;
            padding: 8px 20px 8px 32px;
            margin-bottom: 8px;
            font-size: 1rem;
            font-weight: 300;
            text-transform: unset;
        }

            .prev-evaluations-wrap .prev-evaluations__links .prev-evaluations__link IMG.prev-evaluations__icon {
                position: absolute;
                z-index: 100;
                top: 0;
                bottom: 0;
                left: 8px;
                width: 20px;
                height: 20px;
                margin: auto 0;
            }

            .prev-evaluations-wrap .prev-evaluations__links .prev-evaluations__link .prev-evaluations__link-text {
                display: inline-block;
                max-width: 100%;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: pre;
            }

            .prev-evaluations-wrap .prev-evaluations__links .prev-evaluations__link I.icon.prev-evaluations__chevron-right {
                position: absolute;
                z-index: 1600;
                display: block;
                top: 15px;
                right: 15px;
                height: 12px;
                width: 12px;
                overflow: hidden;
                text-indent: 100%;
                white-space: nowrap;
                -webkit-transition: all 0.4s ease;
                -moz-transition: all 0.4s ease;
                -ms-transition: all 0.4s ease;
                -o-transition: all 0.4s ease;
                transition: all 0.4s ease;
                -webkit-transform: rotate(90deg);
                -moz-transform: rotate(90deg);
                -o-transform: rotate(90deg);
                -ms-transform: rotate(90deg);
                transform: rotate(90deg);
                z-index: 100;
                top: 0;
                bottom: 0;
                right: 4px;
                margin: auto 0;
            }

                .prev-evaluations-wrap .prev-evaluations__links .prev-evaluations__link I.icon.prev-evaluations__chevron-right::after, .prev-evaluations-wrap .prev-evaluations__links .prev-evaluations__link I.icon.prev-evaluations__chevron-right::before {
                    /* lines of '>' icon */
                    content: '';
                    position: absolute;
                    height: 2px;
                    width: 6px;
                    left: 30%;
                    top: 50%;
                    background-color: #FFF;
                    -webkit-backface-visibility: hidden;
                    -moz-backface-visibility: hidden;
                    -ms-backface-visibility: hidden;
                    -o-backface-visibility: hidden;
                    backface-visibility: hidden;
                    -webkit-transition: background-color 0.4s ease;
                    -moz-transition: background-color 0.4s ease;
                    -ms-transition: background-color 0.4s ease;
                    -o-transition: background-color 0.4s ease;
                    transition: background-color 0.4s ease;
                }

                .prev-evaluations-wrap .prev-evaluations__links .prev-evaluations__link I.icon.prev-evaluations__chevron-right::before {
                    -webkit-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
                    -moz-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
                    -o-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
                    -ms-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
                    transform: translateX(-36%) translateY(-30%) rotate(-45deg);
                }

                .prev-evaluations-wrap .prev-evaluations__links .prev-evaluations__link I.icon.prev-evaluations__chevron-right::after {
                    -webkit-transform: translateX(36%) translateY(-30%) rotate(45deg);
                    -moz-transform: translateX(36%) translateY(-30%) rotate(45deg);
                    -o-transform: translateX(36%) translateY(-30%) rotate(45deg);
                    -ms-transform: translateX(36%) translateY(-30%) rotate(45deg);
                    transform: translateX(36%) translateY(-30%) rotate(45deg);
                }

                .prev-evaluations-wrap .prev-evaluations__links .prev-evaluations__link I.icon.prev-evaluations__chevron-right:hover::after, .prev-evaluations-wrap .prev-evaluations__links .prev-evaluations__link I.icon.prev-evaluations__chevron-right:hover::before {
                    background-color: #FFF;
                }

            .prev-evaluations-wrap .prev-evaluations__links .prev-evaluations__link + .prev-evaluations__link {
                margin-left: 0;
                margin-right: 0;
            }

/* ---- LANDING PAGE LOGO (MERCK ONLY) ---- */
.landing-logo__container {
    display: none;
    padding: 64px 20px 20px;
    text-align: center;
}

    .landing-logo__container .landing-logo__logo {
        max-height: 50px;
    }

/* =========================================================================*/
/* Header text for page */
.evaluation_header {
    text-align: center;
    margin-bottom: 32px;
    font-weight: 600;
    text-transform: initial;
    font-size: 2rem;
}

/* Wraps the entire evaluation content on the page */
.evaluation_container {
    justify-content: center;
}

.evaluation_btns {
    -webkit-box-flex: 1 1 50%;
    -webkit-flex: 1 1 50%;
    -moz-flex: 1 1 50%;
    -ms-flex: 1 1 50%;
    flex: 1 1 50%;
    max-width: 50%;
    padding: 0 48px;
}

/* Heading button for main sections */
.evaluation_btns__heading_btn {
    position: relative;
    padding: 32px 0;
    height: auto;
    width: 100%;
    font-weight: 600;
    font-size: 1.5rem;
}

/* Icon for heading button */
.heading_btn__icon {
    display: inline-block;
    vertical-align: middle;
    height: auto;
    width: 30px;
    margin-right: 2px;
}

.heading_btn__text {
    display: inline-block;
    vertical-align: middle;
    margin-right: 10px;
}

/* Chevron for heading button */
.icon.heading_btn__chevron-right {
    position: absolute;
    z-index: 1600;
    display: block;
    top: 15px;
    right: 15px;
    height: 12px;
    width: 12px;
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -ms-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
    right: 4px;
    bottom: 0;
    top: 0;
    margin: auto 0;
    z-index: 800;
}

    .icon.heading_btn__chevron-right::after, .icon.heading_btn__chevron-right::before {
        /* lines of '>' icon */
        content: '';
        position: absolute;
        height: 2px;
        width: 6px;
        left: 30%;
        top: 50%;
        background-color: #1b1b1b;
        -webkit-backface-visibility: hidden;
        -moz-backface-visibility: hidden;
        -ms-backface-visibility: hidden;
        -o-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-transition: background-color 0.4s ease;
        -moz-transition: background-color 0.4s ease;
        -ms-transition: background-color 0.4s ease;
        -o-transition: background-color 0.4s ease;
        transition: background-color 0.4s ease;
    }

    .icon.heading_btn__chevron-right::before {
        -webkit-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        -moz-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        -o-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        -ms-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        transform: translateX(-36%) translateY(-30%) rotate(-45deg);
    }

    .icon.heading_btn__chevron-right::after {
        -webkit-transform: translateX(36%) translateY(-30%) rotate(45deg);
        -moz-transform: translateX(36%) translateY(-30%) rotate(45deg);
        -o-transform: translateX(36%) translateY(-30%) rotate(45deg);
        -ms-transform: translateX(36%) translateY(-30%) rotate(45deg);
        transform: translateX(36%) translateY(-30%) rotate(45deg);
    }

    .icon.heading_btn__chevron-right:hover::after, .icon.heading_btn__chevron-right:hover::before {
        background-color: #1b1b1b;
    }

/* 'New case' button */
.evaluation_btns__new_evaluation_btns {
    margin-top: 8px;
}

.new_evaluation_btns__new_evaluation_btn {
    position: relative;
    width: 100%;
    height: auto;
    padding: 6px 16px;
    font-weight: 600;
    letter-spacing: 0.01rem;
}

.new_evaluation_btn__text {
    margin-bottom: 0;
    font-size: 1.28rem;
    font-weight: 600;
}

.icon.new_evaluation_btn__chevron-right {
    position: absolute;
    z-index: 1600;
    display: block;
    top: 15px;
    right: 15px;
    height: 12px;
    width: 12px;
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -ms-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
    right: 4px;
    bottom: 0;
    top: 0;
    margin: auto 0;
    z-index: 800;
}

    .icon.new_evaluation_btn__chevron-right::after, .icon.new_evaluation_btn__chevron-right::before {
        /* lines of '>' icon */
        content: '';
        position: absolute;
        height: 2px;
        width: 6px;
        left: 30%;
        top: 50%;
        background-color: #1b1b1b;
        -webkit-backface-visibility: hidden;
        -moz-backface-visibility: hidden;
        -ms-backface-visibility: hidden;
        -o-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-transition: background-color 0.4s ease;
        -moz-transition: background-color 0.4s ease;
        -ms-transition: background-color 0.4s ease;
        -o-transition: background-color 0.4s ease;
        transition: background-color 0.4s ease;
    }

    .icon.new_evaluation_btn__chevron-right::before {
        -webkit-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        -moz-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        -o-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        -ms-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        transform: translateX(-36%) translateY(-30%) rotate(-45deg);
    }

    .icon.new_evaluation_btn__chevron-right::after {
        -webkit-transform: translateX(36%) translateY(-30%) rotate(45deg);
        -moz-transform: translateX(36%) translateY(-30%) rotate(45deg);
        -o-transform: translateX(36%) translateY(-30%) rotate(45deg);
        -ms-transform: translateX(36%) translateY(-30%) rotate(45deg);
        transform: translateX(36%) translateY(-30%) rotate(45deg);
    }

    .icon.new_evaluation_btn__chevron-right:hover::after, .icon.new_evaluation_btn__chevron-right:hover::before {
        background-color: #1b1b1b;
    }

/* Country select chevron */
.icon.country-select__chevron-right {
    position: absolute;
    z-index: 1600;
    display: block;
    top: 15px;
    right: 15px;
    height: 12px;
    width: 12px;
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -ms-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
    height: 16px;
    right: 4px;
    bottom: 0;
    top: 0;
    margin: auto 0;
    z-index: 800;
}

    .icon.country-select__chevron-right::after, .icon.country-select__chevron-right::before {
        /* lines of '>' icon */
        content: '';
        position: absolute;
        height: 2px;
        width: 6px;
        left: 30%;
        top: 50%;
        background-color: #058C83;
        -webkit-backface-visibility: hidden;
        -moz-backface-visibility: hidden;
        -ms-backface-visibility: hidden;
        -o-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-transition: background-color 0.4s ease;
        -moz-transition: background-color 0.4s ease;
        -ms-transition: background-color 0.4s ease;
        -o-transition: background-color 0.4s ease;
        transition: background-color 0.4s ease;
    }

    .icon.country-select__chevron-right::before {
        -webkit-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        -moz-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        -o-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        -ms-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        transform: translateX(-36%) translateY(-30%) rotate(-45deg);
    }

    .icon.country-select__chevron-right::after {
        -webkit-transform: translateX(36%) translateY(-30%) rotate(45deg);
        -moz-transform: translateX(36%) translateY(-30%) rotate(45deg);
        -o-transform: translateX(36%) translateY(-30%) rotate(45deg);
        -ms-transform: translateX(36%) translateY(-30%) rotate(45deg);
        transform: translateX(36%) translateY(-30%) rotate(45deg);
    }

    .icon.country-select__chevron-right:hover::after, .icon.country-select__chevron-right:hover::before {
        background-color: #07bdb1;
    }

    .icon.country-select__chevron-right.selected {
        position: absolute;
        z-index: 1600;
        display: block;
        top: 15px;
        right: 15px;
        height: 12px;
        width: 12px;
        overflow: hidden;
        text-indent: 100%;
        white-space: nowrap;
        -webkit-transition: all 0.4s ease;
        -moz-transition: all 0.4s ease;
        -ms-transition: all 0.4s ease;
        -o-transition: all 0.4s ease;
        transition: all 0.4s ease;
        -webkit-transform: rotate(90deg);
        -moz-transform: rotate(90deg);
        -o-transform: rotate(90deg);
        -ms-transform: rotate(90deg);
        transform: rotate(90deg);
        height: 16px;
        right: 4px;
        bottom: 0;
        top: 0;
        margin: auto 0;
        z-index: 800;
    }

        .icon.country-select__chevron-right.selected::after, .icon.country-select__chevron-right.selected::before {
            /* lines of '>' icon */
            content: '';
            position: absolute;
            height: 2px;
            width: 6px;
            left: 30%;
            top: 50%;
            background-color: #FFF;
            -webkit-backface-visibility: hidden;
            -moz-backface-visibility: hidden;
            -ms-backface-visibility: hidden;
            -o-backface-visibility: hidden;
            backface-visibility: hidden;
            -webkit-transition: background-color 0.4s ease;
            -moz-transition: background-color 0.4s ease;
            -ms-transition: background-color 0.4s ease;
            -o-transition: background-color 0.4s ease;
            transition: background-color 0.4s ease;
        }

        .icon.country-select__chevron-right.selected::before {
            -webkit-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
            -moz-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
            -o-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
            -ms-transform: translateX(-36%) translateY(-30%) rotate(-45deg);
            transform: translateX(-36%) translateY(-30%) rotate(-45deg);
        }

        .icon.country-select__chevron-right.selected::after {
            -webkit-transform: translateX(36%) translateY(-30%) rotate(45deg);
            -moz-transform: translateX(36%) translateY(-30%) rotate(45deg);
            -o-transform: translateX(36%) translateY(-30%) rotate(45deg);
            -ms-transform: translateX(36%) translateY(-30%) rotate(45deg);
            transform: translateX(36%) translateY(-30%) rotate(45deg);
        }

        .icon.country-select__chevron-right.selected:hover::after, .icon.country-select__chevron-right.selected:hover::before {
            background-color: #FFF;
        }

/* Wrapper for company dropdown title and chevron*/
.company_dropdown_title_wrapper {
    display: flex;
    justify-content: center;
    position: relative;
}

    .company_dropdown_title_wrapper:hover .chevron::before,
    .company_dropdown_title_wrapper:hover .chevron::after {
        background-color: #FBE122;
    }

/* Wrapper for company selection dropdown */
.evaluation_btns__company_dropdown {
    display: inline-block;
    position: relative;
    user-select: none;
    width: 100%;
}

/* Custom selection wrapper */
.custom-select {
    position: relative;
    display: flex;
    flex-direction: column;
    border: none;
    /*margin-left: 5%;*/
}

/* Custom select trigger or 'button' to open option menu */
.custom-select__trigger {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.28rem;
    font-weight: 600;
    color: #0C2340;
    height: 48px;
    background-color: transparent;
    cursor: pointer;
    border: none;
}

/* Wrapper for the company options list */
.custom-options {
    position: absolute;
    display: block;
    top: 100%;
    left: 0;
    right: 0;
    border: 1px solid #414E54;
    background: #fff;
    transition: all 0.5s;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    z-index: 800;
    text-align: center;
}

.custom-select.open .custom-options {
    opacity: 1;
    visibility: visible;
    pointer-events: all;
}

.custom-option {
    position: relative;
    display: block;
    font-size: 1.28rem;
    font-weight: 600;
    color: #0C2340;
    line-height: 32px;
    cursor: pointer;
    transition: all 0.5s;
}

    .custom-option:hover {
        cursor: pointer;
        background-color: #b2b2b2;
    }

    .custom-option.selected {
        color: #FFF;
        background-color: #0C2340;
    }

/* Sub-nav content */
.evaluation_btns__company_dropdown .subnav {
    position: relative;
}

.subnav-content {
    display: none;
    position: absolute;
    left: 100%;
    top: -1%;
    background-color: white;
    width: 100%;
    max-height: 240px;
    z-index: 1;
    border: solid 1px;
    overflow-y: auto;
}

.subnav-content2 {
    display: none;
    position: absolute;
    left: 100%;
    top: 32%;
    background-color: white;
    width: 100%;
    z-index: 1;
    border: solid 1px;
}

.subnav-content3 {
    display: none;
    position: absolute;
    left: 100%;
    top: 66%;
    background-color: white;
    width: 100%;
    z-index: 1;
    border: solid 1px;
}

/* Sub-nav button style */
.subnav-btn {
    position: relative;
    display: block;
    font-size: 1.28rem;
    font-weight: 600;
    color: #0C2340;
    line-height: 32px;
    cursor: pointer;
    transition: all 0.5s;
}

    .subnav-btn:hover {
        cursor: pointer;
        background-color: #b2b2b2;
    }

    .subnav-btn.sub-selected {
        background-color: #0C2340;
        color: #FFF;
    }

.subnav:hover .subnav-content {
    display: block;
}

.subnav2:hover .subnav-content2 {
    display: block;
}

.subnav3:hover .subnav-content3 {
    display: block;
}

/* Chevron class for trigger or 'button' */
.chevron-wrapper {
    position: absolute;
    right: 12px;
    display: inline-block;
    padding-top: 5%;
    cursor: pointer;
    pointer-events: none;
}

.chevron {
    position: absolute;
    height: 15px;
    width: 15px;
    margin-bottom: 6px;
}

    .chevron::before, .chevron::after {
        content: "";
        position: absolute;
        bottom: 0px;
        width: 0.20rem;
        height: 45%;
        transition: all 0.5s;
    }

    .chevron::before {
        left: -1.9px;
        transform: rotate(45deg);
        background-color: #058C83;
    }

    .chevron::after {
        left: 1.9px;
        transform: rotate(-45deg);
        background-color: #058C83;
    }

.open .chevron::before {
    left: -1.9px;
    transform: rotate(-45deg);
}

.open .chevron::after {
    left: 1.9px;
    transform: rotate(45deg);
}

/* Default hiding tiles until selected 
.evaluation_tile_wrapper                                {max-height: 0; padding-top: 0; padding-bottom: 0; margin: 0; opacity: 0; visibility: hidden;}
.evaluation_tile_wrapper.visible                        {max-height: 100%; visibility: visible;}
.evaluation_tile_wrapper.hidden                         {max-height: 0; visibility: hidden;} */
/* Setting each individual tile to wrap when it reaches edge of limit 
.evaluation_btns__last_evaluations_tiles                {flex-wrap: wrap;}
.evaluation_btns__last_evaluations_header               {text-align: center;}
.last_evaluations_header__text                          {font-size: $zeta; font-weight: 700; margin-bottom: $spaceSize-mini;} */
/* Last evaluation button wrapper 
.evaluation_btns__last_evaluations_btns                 {text-align: center; padding: 2%; width: 50%;} */
/* Last evaluation button 
.last_evaluations_btns__last_evaluation_btn             {position:relative; width:100%; height:100%; font-size: $theta; font-weight: 300; text-transform: initial;}
.last_evaluation_btn__text                              {height:20px; margin-bottom:$spaceSize-tiny; color:$white; font-size:$iota; line-height:$spaceSize-lesser; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.last_evaluation_btn__icon                              {height: 30px; width: 30px;}
.icon.last_evaluation_btn__icon::before                 {color: $white;}
.last_evaluation_btn__view_text                         {margin-top: $spaceSize-tiny; margin-bottom: 0; color: $white; font-size: $eta; font-weight: 600;}
.icon.last_evaluation_btn__chevron-right                {@include chevron($spaceSize-nano, $white, $white, $spaceSize-minor); @include rotate(90); right: $spaceSize-micro; bottom: $spaceSize-micro; top: unset; z-index: 800;}*/
/* ============================================================== MEDIA QUERIES ============================================================== */
/* ---- LARGE DESKTOP (1600px +) ---- */
/* ---- SMALL DESKTOP (1440px - 1599px) ---- */
/* ---- LAPTOP (1280px - 1439px) ---- */
@media only screen and (min-width: 1280px) and (max-width: 1439px) {
    .landing-container {
        width: 100%;
    }
    /* ---- WRAP FOR TILE SETS ---- */
    .evaluation__tile-set {
        -webkit-box-flex: 0 1 33.33%;
        -webkit-flex: 0 1 33.33%;
        -moz-flex: 0 1 33.33%;
        -ms-flex: 0 1 33.33%;
        flex: 0 1 33.33%;
        max-width: 33.33%;
    }
}

/* ---- MOBILE TO LARGE TABLET (0 - 1279px) ---- */
@media only screen and (max-width: 1279px) {
    /* Custom select trigger or 'button' to open option menu */
    .custom-select__trigger {
        font-size: 1.1rem;
    }
}

/* ---- LARGE TABLET (960px - 1279px) ---- */
@media only screen and (min-width: 960px) and (max-width: 1279px) {
    .landing-container {
        width: 100%;
    }
    /* ---- WRAP FOR TILE SETS ---- */
    .evaluation__tile-set {
        -webkit-box-flex: 0 1 33.33%;
        -webkit-flex: 0 1 33.33%;
        -moz-flex: 0 1 33.33%;
        -ms-flex: 0 1 33.33%;
        flex: 0 1 33.33%;
        max-width: 33.33%;
    }
}

/* ---- SMALL TABLET (640px - 959px) ---- */
@media only screen and (min-width: 600px) and (max-width: 959px) {
    .landing-container {
        width: 85%;
    }
    /* ---- WRAP FOR TILE SETS ---- */
    .evaluation__tile-set {
        -webkit-box-flex: 0 1 50%;
        -webkit-flex: 0 1 50%;
        -moz-flex: 0 1 50%;
        -ms-flex: 0 1 50%;
        flex: 0 1 50%;
        max-width: 50%;
    }
}

/* ---- LARGE MOBILE (480px - 639px) ---- */
@media only screen and (min-width: 480px) and (max-width: 599px) {
    .landing-container {
        width: 90%;
    }
    /* ---- WRAP FOR TILE SETS ---- */
    .evaluation__tile-set {
        -webkit-box-flex: 0 1 100%;
        -webkit-flex: 0 1 100%;
        -moz-flex: 0 1 100%;
        -ms-flex: 0 1 100%;
        flex: 0 1 100%;
        max-width: 100%;
    }
}

/* ---- SMALL MOBILE (0 - 479px) ---- */
@media only screen and (max-width: 479px) {
    .landing-container {
        width: 90%;
    }
    /* ---- WRAP FOR TILE SETS ---- */
    .evaluation__tile-set {
        -webkit-box-flex: 0 1 100%;
        -webkit-flex: 0 1 100%;
        -moz-flex: 0 1 100%;
        -ms-flex: 0 1 100%;
        flex: 0 1 100%;
        max-width: 100%;
    }
}



/* -----------Additional classes ----------------*/
.nav-column {
    display: flex; /* Use Flexbox to arrange items horizontally */
    justify-content: flex-end; /* Align items to the right */
    align-items: center; /* Vertically center the items (optional) */
}

.logout {
    background: url("/Assets/images/icons/LogoutOutlined.png") right center no-repeat;
}

.contactus {
    background: url("/Assets/images/icons/CustomerServiceOutlined.png") right center no-repeat;
}

.language {
    background: url("/Assets/images/icons/GlobalOutlined.png") right center no-repeat;
}

.user {
    background: url("/Assets/images/icons/user.png") right center no-repeat;
}

.footer-pan {
    background-color: #0C2340;
}

.footer-container {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    padding: 24px;
}

.footer-left {
    width: 60%;
}

.footer-right {
    text-align: right;
    display: flex;
    align-items: center;
}

.content {
    font-size: 14px !important;
    margin-right: 10px;
}

.social-icons a {
    color: #fff;
    margin-left: 10px;
    text-decoration: none;
}

.hline {
    height: 1px;
    background-color: #6D7B8C;
    width: 100%;
    display: block;
    margin: 15px 0px;
}

.footer-left .footer-nav {
    text-align: left;
    justify-content: flex-start;
}

    .footer-left .footer-nav .footer-nav__link {
        text-decoration: none;
        color: #fff;
        transition: all .5s ease-in-out;
        font-size: 14px;
        margin: 0px 20px 0px 0px;
    }

        .footer-left .footer-nav .footer-nav__link:hover {
            text-decoration: underline;
        }

.footer-left .footnotes {
    color: #fff;
    margin-top: 15px;
    padding: 0px;
}

.stats-panel {
    display: flex;
    margin-bottom: 30px;
}

.stats-box {
    display: flex;
    flex-direction: column;
    border-right: 1px solid #dadada;
    min-width: 150px;
    text-align: right;
    padding-right: 40px;
    padding-left: 40px;
}

    .stats-box:last-child {
        border: none;
    }

.stats-title {
    font-size: 14px;
    color: rgba(0, 0, 0, 0.45);
    margin-bottom: 15px;
    text-transform: capitalize;
}

.stats-value {
    font-size: 24px;
    font-weight: 600;
    color: #333;
}

.stats-value-green {
    color: #52C41A;
}

.k-tabstrip {
    position: relative;
}

.filter-panel {
    width: auto;
    position: absolute;
    top: -3px;
    right: 0px;
}

.filter-container {
    background-color: #fff;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px;
}

.filter-label {
    font-size: 14px !important;
    color: #333 !important;
    padding: 0px !important;
}

.date-input {
    padding: 10px 14px;
    min-width: 160px;
}

.search-btn {
    background: url("/Assets/images/icons/SearchOutlined.png") center center no-repeat #00857C;
    height: 32px;
    width: 32px;
    cursor: pointer;
    border: none;
    outline: none;
}
.clear-btn {
    background: url("/Assets/images/icons/close-lightbox.png") center center no-repeat #00857C;
    height: 32px;
    width: 32px;
    cursor: pointer;
    border: none;
    outline: none;
}
.filter-container .k-input-solid {
    border-radius: 0px !important;
    width: 130px !important;
    height: 35px !important;
}

.filter-container .k-input-md .k-input-inner, .filter-container .k-picker-md .k-input-inner {
    border-radius: 0px !important;
    background-color: #fff !important;
    width: 105px !important;
    height: 33px !important;
}

    .filter-container .k-input-md .k-input-inner::placeholder, .filter-container .k-picker-md .k-input-inner::placeholder {
        color: rgba(0, 0, 0, 0.25);
    }

.filter-container .k-button-md.k-icon-button {
    background-color: #fff !important;
    border: none;
}

    .filter-container .k-button-md.k-icon-button .k-button-icon {
        opacity: .4;
    }

.k-i-sort-asc-small::before  {
background: url("/Assets/images/icons/atoz.png") center center no-repeat;
width: 13px;
height: 16px;
content: "" !important;
}
.k-i-sort-desc-small::before{
background: url("/Assets/images/icons/ztoa.png") center center no-repeat;
width: 13px;
height: 16px;
content: "" !important;
}
.filter-bar {
    display: flex;
    background: #ffffff;
    padding: 10px 15px;
    border-radius: 6px;
    width: fit-content;
    align-items: center;
}
.k-no-data, .k-nodata {
    min-height: auto !important;
}
.filter-bar .dropdown {
    display: flex;
    align-items: center;
    gap: 6px;
    cursor: pointer;
    margin-right: 10px;
    border-radius: 0px;
    min-width: 150px;
}
.filter-bar .dropdown.hatchery {
    min-width: auto;
}
    .dropdown:last-child {
        margin-right: 0px;
    }

    .dropdown .k-picker-solid {
        background-color: #fff;
        border: none;
    }

    .dropdown .k-input-value-text {
        font-size: 14px !important;
        color: #000;
        font-family: 'Invention', sans-serif;
        ;
    }

    .dropdown .k-i-caret-alt-down::before {
        content: "";
        background: url("/Assets/images/icons/DownOutlined.png") center center no-repeat;
        height: 14px;
        width: 14px;
    }

    .dropdown .breadcrumb-nav__link {
        color: #000 !important;
        font-size: 14px !important;
    }

    .dropdown SPAN.breadcrumb-select-wrap:after {
        content: "";
        background: url("/Assets/images/icons/DownOutlined.png") center center no-repeat;
        height: 14px;
        width: 14px;
        top: 9px;
        right: 3px;
    }

    .dropdown SELECT.breadcrumb-nav__link {
        padding-right: 30px !important;
    }

.user-name {
    color: rgba(0, 0, 0, 0.65);
    font-size: 14px;
    font-weight: 600;
    margin-top: 10px;
    display: block;
}

.no-match-found {
    width: 100%;
    justify-content: center;
    align-items: center;
}

    .no-match-found .title {
        color: #00857C;
        font-size: 20px;
        font-weight: bold;
        text-align: center;
        margin-top: 30px;
    }

    .no-match-found .description {
        color: rgba(0, 0, 0, 0.65);
        font-size: 16px;
        font-weight: normal;
        text-align: center;
        margin-top: 15px;
    }

    .no-match-found .image {
        width: 180px;
        height: 180px;
        background: url("/Assets/images/icons/no-data.png") center center no-repeat;
        margin: 0px auto 30px auto;
    }

/* Ensure parent flex behaves properly */
.step-content {
    display: flex;
}

/* Sidebar default width */
#leftSidebar {
    width: 254px;
    transition: width .35s ease-in-out;
    overflow: hidden;
    background: #fff;
    position: relative;
    padding: 15px;
}

    /* When collapsed */
    #leftSidebar.collapsed {
        width: 60px;
    }

    /* Make inner elements fade out instead of snapping */
    #leftSidebar .step-nav__switch,
    #leftSidebar .step-nav__link {
        opacity: 1;
        transition: opacity .2s ease-in-out;
    }

    #leftSidebar.collapsed .step-nav__switch,
    #leftSidebar.collapsed .step-nav__link {
        opacity: 0;
        pointer-events: none;
    }
/* Toggle Button */
.sidebar-toggle-btn {
    position: absolute;
    right: 15px;
    top: 27px;
    transform: translateY(-50%);
    width: 24px;
    height: 40px;
    border-radius: 0 4px 4px 0;
    border: none;
    background: #ddd;
    cursor: pointer;
    transition: left .35s ease-in-out, background .2s ease-in-out;
    font-size: 18px;
    font-weight: bold;
    line-height: 40px;
    padding: 0;
    z-index: 1;
    background: url("/Assets/images/icons/LeftOutlined.png") center center no-repeat;
}


    /* when toggled */
    .sidebar-toggle-btn.collapsed {
        right: 20px;
        background: url("/Assets/images/icons/RightOutlined.png") center center no-repeat;
    }

#createNewEvaluation {
    padding: 0px;
}

.evaluation-pan {
    margin-top: -35px;
}

#leftSidebar H4.step-details__title {
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 5px;
    opacity: 1;
    transition: all .35s ease-in-out,
}

#leftSidebar.collapsed H4.step-details__title {
    width: 60px;
    opacity: 0;
    height: 24px !important;
}

#leftSidebar.collapsed .step-details__item {
    width: 60px;
    opacity: 0;
    height: 19px !important;
}

#leftSidebar.collapsed .step-content__details {
    height: 49px;
}

#leftSidebar.collapsed .categoary-text {
    justify-content: center;
}

    #leftSidebar.collapsed .categoary-text span {
        width: 1px;
        opacity: 0;
    }

#leftSidebar .step-content__details {
    padding: 0px;
    opacity: 1;
    transition: all .35s ease-in-out,
}

.categoary-text {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 20px;
    opacity: 1;
    transition: all .35s ease-in-out,
}

a.categoary {
    height: 18px;
    width: 18px;
    display: inline-flex;
    justify-content: center;
    background: url("/Assets/images/icons/AppstoreOutlined.png") center center no-repeat;
}
/* Reset counter on whole navigation */
.step-content__nav {
    counter-reset: stepCounter;
}

/* Each step increments counter */
.step-nav {
    counter-increment: stepCounter;
    height: 32px;
    width: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #f0f0f0;
    border-radius: 50%;
    position: relative;
    flex-shrink: 0;
}

    /* Show the number */
    .step-nav::before {
        content: counter(stepCounter);
        font-size: 14px;
        font-weight: bold;
        color: #333;
        position: absolute;
    }

    .step-nav::after {
        content: "";
        position: absolute;
        height: 25px;
        width: 1px;
        background-color: #f0f0f0;
        bottom: -30px;
        left: 50%;
    }

    .step-nav:last-of-type::after {
        content: none !important;
    }

.step-content__nav .step-nav__item:last-child .step-nav::after {
    display: none !important;
}
/* Active step style */
.step-nav__item:has(.step-nav__link.active) .step-nav {
    background: #00857C;
}

    .step-nav__item:has(.step-nav__link.active) .step-nav::before {
        color: #fff;
        font-weight: bold;
    }

.step-nav__item:has(.step-nav__link.visited) .step-nav {
    background: #E6F3F2;
}

    .step-nav__item:has(.step-nav__link.visited) .step-nav::before {
        font-size: 0px;
        background: url("/Assets/images/icons/righttick.png") center center no-repeat;
        height: 20px;
        width: 20px;
    }

.step-nav__link.active {
    text-decoration: none !important;
    background: url("/Assets/images/icons/rightarrow.png") 95% center no-repeat #f5f5f5;
    border-radius: 4px;
}

#leftSidebar .step-nav__link {
    width: 185px;
    margin-left: 5px;
}

.step-nav__item .step-nav__link.active:after {
    border-bottom: 0px;
}

.new-case-header-component {
    justify-content: space-between;
    display: flex;
    margin: 20px 0px;
}

.new-case-header-component-left {
    text-align: left;
    display: flex;
    background: #ffffff;
    padding: 7px 15px;
    border-radius: 6px;
    width: fit-content;
    align-items: center;
    border-radius: 4px;
}

    .new-case-header-component-left .field {
        margin-bottom: 0px !important;
    }

        .new-case-header-component-left .field .k-dropdownlist {
            background-color: #fff;
            border: none;
            height: auto;
        }
        .new-case-header-component-left  .k-dropdownlist {
            background-color: #fff;
            border: none;
            height: auto;
            font-size: 14px;
            min-width:160px;
        }
        .new-case-header-component-left .search-btn, .new-case-header-component-left .clear-btn {
            width: 40px;
        }
        .new-case-header-component-left .field .k-i-caret-alt-down::before {
            content: "";
            background: url(/Assets/images/icons/DownOutlined.png) center center no-repeat;
            height: 14px;
            width: 14px;
        }

.new-case-header-component-right {
    text-align: right;
    display: flex;
    align-items: center;
}

.new-case-control-pan {
    text-align: left;
    display: flex;
    background: #ffffff;
    padding: 7px 15px;
    border-radius: 6px;
    width: fit-content;
    align-items: center;
    border-radius: 4px;
    position: absolute;
    top: -105px;
    left: 0px;
}

BODY.theme .tab-panel--alt-1.case-details .k-tabstrip-top > .k-content {
    overflow: visible;
}

.step-content__body:has(.case-details) .new-case-header-component {
    justify-content: end;
}

.step-content__body:has(.case-details) .new-case-header-component-left {
    display: none;
}

.new-case-control-pan .field {
    margin-bottom: 0px !important;
    padding: 0px !important;
    border: 0px !important;
}

    .new-case-control-pan .field .k-dropdownlist {
        background-color: #fff;
        border: none;
        height: auto;
        min-width: 150px
    }

    .new-case-control-pan .field .k-i-caret-alt-down::before {
        content: "";
        background: url(/Assets/images/icons/DownOutlined.png) center center no-repeat;
        height: 14px;
        width: 14px;
    }

.show-add-notes {
    width: 40px;
    height: 40px;
    background: url("/Assets/images/icons/FileTextOutlined.png") center center no-repeat #fff;
    border: 1px solid #949494;
    cursor: pointer;
}

.notes-and-images-pan {
    text-align: left;
    display: block;
    width: 100%;
    margin-top: 10px;
}

.notes-and-images {
    background: url("/Assets/images/icons/notes.png") left center no-repeat #fff;
    cursor: pointer;
    padding: 9px 0px 5px 20px;
    text-decoration: none;
    color: rgba(0, 0, 0, 0.88);
    font-size: 14px;
    font-weight: bold;
    float: right;
}

    .notes-and-images:hover {
        color: rgba(0, 0, 0, 0.88);
    }

.last-saved {
    background: #fff;
    padding: 13px 20px 7px 44px;
    background: url("/Assets/images/icons/SaveFilled.png") 20px center no-repeat #fff;
    margin-right: 15px;
    font-size: 14px;
    color: #000;
    height: 44px;
    box-sizing: border-box;
}

.case-detail-heading {
    color: #00857C;
    display: flex;
    flex-direction: column;
    font-size: 14px;
    font-weight: bold;
    display: inline-block;
}

    .case-detail-heading span {
        position: relative;
        display: inline-block;
    }

        .case-detail-heading span::after {
            content: "";
            position: absolute;
            bottom: -5px;
            left: 0;
            width: 100%;
            height: 2px;
            background-color: #00857C;
        }

.case-details .form-panel {
    background-color: #fff !important;
    padding: 0px 20px 0px 10px !important;
}

.case-details HEADER.tab-panel__header {
    padding: 32px 24px 0px !important;
    background-color: #fff;
}

.case-details #btnBack {
    display: none;
}
.case-details .tab-panel__header {
    display: none;
}
.case-details .form-panel label {
    flex: 0 1 70% !important;
    font-size: 16px !important;
    color: rgba(0, 0, 0, 0.88) !important;
    text-transform: capitalize !important;
    font-weight: normal !important;
    padding-left: 10px;
}
.case-details .form-panel .field.HBTypeDD .k-dropdownlist {
max-width: 283px;
}
.case-details .form-panel .field {
    border-bottom: 1px solid #f0f0f0;
    margin: 0px !important;
    padding: 12px 0px 8px 0px;
}

    .case-details .form-panel .field INPUT[type="text"]:disabled {
        border: none !important;
        background: none !important;
        color: rgba(0, 0, 0, 0.65) !important;
        padding: 0px !important;
        font-size: 16px !important;
    }

    .case-details .form-panel .field span.age {
        color: rgba(0, 0, 0, 0.45) !important;
        padding: 0px !important;
        font-size: 16px !important;
    }

    .case-details .form-panel .field span.status {
        font-size: 12px !important;
        background-color: #DDDCFA;
        color: #949494 !important;
        border-radius: 10px;
        padding: 2px 8px !important;
        border: 1px solid #949494;
    }

.page-content .field .k-dropdownlist .k-button-md.k-icon-button .k-button-icon {
    background: url("/Assets/images/icons/downarrow.png") center center no-repeat;
}

.page-content .field .k-dropdownlist .k-i-caret-alt-down::before {
    content: "";
}

.step-content__body .k-tabstrip-items-wrapper {
    background-color: #fff;
}

.step-content__body .k-tabstrip-items {
    flex: none;
}

.tab-panel__content .field {
    border-bottom: 1px solid #f0f0f0;
    padding: 0px 0px 20px 0px;
    position: relative;
}

.tab-panel__content div.field:first-of-type {
    padding-top: 20px;
}

.tab-panel__content:has(legend) div.field:first-of-type {
    padding-top: 0px;
}

.tab-panel__content .field .field.field--errors {
    border: 0px;
    position: absolute;
    right: 0px;
    bottom: -24px;
}

.tab-panel__content:has(.grid-panel) {
    background: #fff;
    margin-top: 0px;
    padding: 0px !important;
}

BODY.theme .tab-panel--alt-1.case-details .k-tabstrip-top > .k-content:focus {
    outline: none;
}

.k-tabstrip-content:focus, .k-tabstrip-content.k-focus, .k-tabstrip > .k-content:focus, .k-tabstrip > .k-content.k-focus {
    outline: none !important;
}

.no-data-found-pan {
    background: url("/Assets/images/icons/notfound.png") center calc(100% - 20px) no-repeat;
    min-height: 220px;
}

    .no-data-found-pan .description {
        display: block;
        text-align: center;
        font-size: 16px;
        color: rgba(0, 0, 0, 0.88);
        margin-top: 20px;
    }

    .no-data-found-pan .title {
        font-size: 20px;
        justify-content: center;
        font-weight: bold;
        color: #00857C;
        display: block;
        text-align: center;
        margin-top: 35px;
    }

.welcome-pan {
    flex-direction: column;
}

    .welcome-pan .nav-column {
        margin-top: 10px;
    }

/*-------------- Css for popup window starts here -------------*/
.k-window {
    border-radius: 2px !important;
}

.k-window-title {
    font-size: 20px !important;
    font-weight: bold;
    color: rgba(0, 0, 0, 0.88);
    font-family: 'Invention', sans-serif;
    padding: 20px 15px !important;
}

.k-window .tab-panel__content .field {
    flex: 0 1 25%;
}

.k-window .k-picker-solid {
    -webkit-box-flex: 1 1 auto;
    -webkit-flex: 1 1 auto;
    -moz-flex: 1 1 auto;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    width: auto !important;
    height: 32px;
    padding: 0;
    margin: 0;
    border: 1px solid #949494;
    background-color: #FFF;
    font-size: 14px;
    color: rgba(0, 0, 0, 0.88);
    overflow: hidden;
    border-radius: 0px;
}

    .k-window .k-picker-solid.k-hover {
        background-color: #fff !important;
    }

.k-window .field .k-dropdownlist .k-button-md.k-icon-button .k-button-icon {
    background: url(/Assets/images/icons/downarrow.png) center center no-repeat;
}

.k-window .field .k-dropdownlist .k-i-caret-alt-down::before {
    content: ""
}

.k-window .field .k-datepicker {
    -webkit-box-flex: 0 1 25%;
    -webkit-flex: 0 1 25%;
    -moz-flex: 0 1 25%;
    -ms-flex: 0 1 25%;
    flex: 0 1 25%;
    border-radius: 0px;
    border: 1px solid #949494;
}

.k-window .k-button-md.k-icon-button {
    background: none;
    border: 0px;
}

.k-window .k-i-calendar {
    background: url(/Assets/images/icons/calender.png) center center no-repeat;
}

    .k-window .k-i-calendar::before {
        content: "";
    }

.k-window .date-picker.k-input-inner {
    border: 0px !important;
}

.k-window .field.field--sub-input.field--minor .k-dropdownlist {
    flex: 0 1 100%;
}

.k-window .step-content__buttons.buttons {
    padding: 20px 0px;
}
/* ---------------- SS for Welcome page --------------*/
.welcome-left-pan {
    width: 50%;
}

/*------------------- Custom Popup Starts Here ---------------*/
.three-dots-btn {
    width: 10px;
    font-size: 0px;
    height: 16px;
    background: url("/Assets/images/icons/threedots.png") center center no-repeat;
}

.popup {
    display: none;
    position: absolute;
    background-color: #fff;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2);
    border-radius: 5px;
    padding: 5px;
    z-index: 10;
    width: 130px;
    right: 40px;
    text-align: left;
}

    .popup a {
        display: block;
        padding: 10px;
        margin: 0;
        cursor: pointer;
        text-decoration: none;
        color: #000;
    }

        .popup a:hover {
            background-color: #f0f0f0;
        }

.export-link {
    background: url("/Assets/images/icons/RightOutlined.png") 100px center no-repeat;
}

.export-popup {
    display: none; /* Initially hidden */
    background-color: #fff;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2);
    border-radius: 5px;
    padding: 5px;
    z-index: 10;
    position: absolute;
    top: 80px;
    left: -132px;
    width: 130px;
}

#exportPopup {
    top: 100px;
    left: 112px;
}

/* Overlay Style */
.overlay {
    position: fixed; /* Fixed position to cover the entire screen */
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5); /* Semi-transparent gray background */
    z-index: 999; /* Ensure it's above everything else */
    display: none; /* Hidden by default */
}

/* Custom Popup Style */
.custom-popup {
    position: fixed;
    display: none;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 720px;
    padding: 0px;
    background-color: #fff;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    z-index: 1000; /* Ensure the popup is above the overlay */
}

    .custom-popup .head {
        border-bottom: 1px solid #949494;
        padding: 15px;
        justify-content: space-between;
        display: flex;
    }

        .custom-popup .head .cancel {
            width: 16px;
            height: 16px;
            background: url("/Assets/images/icons/close.png") center center no-repeat;
            justify-items: flex-end;
        }

    .custom-popup h5 {
        color: rgba(0, 0, 0, 0.88);
        font-size: 20px;
        font-weight: bold;
        margin: 0px;
    }

    .custom-popup .body {
        padding: 15px;
    }
    .custom-popup .body p {
       font-size: 16px;
    }
        .custom-popup .body input {
            width: 100%;
            border-radius: 2px !important;
        }

        .custom-popup .body .successmsg {
            background: url("/Assets/images/icons/success.png") left center no-repeat;
            padding: 5px 5px 5px 35px;
        }

    .custom-popup .popup-footer {
        border-top: 1px solid #949494;
        padding: 15px
    }
/* Popup Content */
.popup-content {
    padding: 10px;
}

/* Footer buttons */
.popup-footer {
    margin-top: 20px;
    display: flex;
    justify-content: flex-end;
}

    .popup-footer button {
        margin-left: 10px;
    }



/*--------------------------- CSS for welcome  page -----------------*/
.welcome-page {
    display: flex;
    padding: 0px 100px;
    gap: 40px;
    font-family: 'Invention', sans-serif;
}

.welcome-content-wrapper {
    display: flex !important;
    gap: 40px;
}

.left-panel {
    width: 40%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

    .left-panel .logo-pan {
        margin-bottom: 20px;
        width: 306px;
        padding: 24px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

/* RIGHT PANEL */
.right-panel {
    width: 60%;
    padding: 20px;
    border-radius: 6px;
    border: 1px solid #173A64;
}

    .right-panel p {
        margin-bottom: 20px;
        line-height: 1.6;
        font-size: 15px;
    }

    .right-panel strong {
        color: #ffffff;
    }

    .right-panel h3 {
        margin-top: 30px;
        font-size: 18px;
        font-weight: 600;
    }

.login-label {
    font-size: 16px;
    color: #fff;
}

.welcome-heading {
    font-size: 28px;
    color: #fff;
}

    .welcome-heading span {
        font-weight: bold;
    }

.left-panel .button.button--login {
    -webkit-box-flex: 0 1 287px;
    -webkit-flex: 0 1 287px;
    -moz-flex: 0 1 287px;
    -ms-flex: 0 1 287px;
    flex: 0 1 287px;
    text-transform: inherit;
}

.status-inprogress {
    font-size: 12px !important;
    background-color: #DDDCFA;
    color: #949494 !important;
    border-radius: 10px;
    padding: 2px 8px !important;
    border: 1px solid #949494;
}

.status-completed {
    font-size: 12px !important;
    background-color: #e6f3f2;
    color: #949494 !important;
    border-radius: 10px;
    padding: 2px 8px !important;
    border: 1px solid #949494;
}

.form-control {
    width: inherit;
}

/*---------------------- CSS for popup window ------*/
.modal-content {
    border-radius: 4px !important
}

.modal-title {
    font-size: 20px;
    font-weight: bold;
}

.modal-body p {
    font-size: 16px;
}

.modal-body.confirm-msg {
    font-size: 14px;
}

.modal-body .subheading {
    padding: 15px;
    margin: 0px;
    font-size: 14px;
}

.notelabel {
    text-align: start;
}

.modal-body table td, .modal-body table th {
    font-size: 14px;
    padding: 10px 20px;
    text-align: start;
}

.modal-body table th {
    font-weight: bold;
    padding: 20px 20px;
    border-bottom: 1px solid #f0f0f0;
    border-top: 1px solid #f0f0f0;
    position: relative;
}

.modal-body table td .dropdown .btn {
    font-size: 18px;
}

.modal-body table th:not(:last-child)::after {
    content: "";
    position: absolute;
    right: 0;
    top: 25%;
    height: 50%;
    width: 1px;
    background-color: #f0f0f0;
}

#tabstrip-3 .notelabel, #tabstrip-5 .notelabel, #tabstrip-6 .notelabel, #tabstrip-7 .notelabel, #tabstrip-8 .notelabel, #tabstrip-9 .notelabel, #tabstrip-10 .notelabel {
    display: none;
}

#tabstrip-3 table td, #tabstrip-3 table th, #tabstrip-5 table td, #tabstrip-5 table th, #tabstrip-6 table td, #tabstrip-6 table th, #tabstrip-7 table td, #tabstrip-7 table th, #tabstrip-8 table td, #tabstrip-8 table th, #tabstrip-9 table td, #tabstrip-9 table th, #tabstrip-10 table td, #tabstrip-10 table th {
    font-size: 13px;
    padding: 5px 5px;
    text-align: start;
}

#tabstrip-3 table th, #tabstrip-5 table th, #tabstrip-6 table th, #tabstrip-7 table th, #tabstrip-8 table th, #tabstrip-9 table th, #tabstrip-10 table th {
    font-weight: bold;
    padding: 5px 5px;
    border-bottom: 1px solid #f0f0f0;
    border-top: 1px solid #f0f0f0;
    position: relative;
    font-size: 13px;
}

#tabstrip-3 table td .dropdown .btn, #tabstrip-5 table td .dropdown .btn, #tabstrip-6 table td .dropdown .btn, #tabstrip-7 table td .dropdown .btn, #tabstrip-8 table td .dropdown .btn, #tabstrip-9 table td .dropdown .btn, #tabstrip-10 table td .dropdown .btn {
    font-size: 18px;
}

#tabstrip-3 table th:not(:last-child)::after, #tabstrip-5 table th:not(:last-child)::after, #tabstrip-6 table th:not(:last-child)::after, #tabstrip-7 table th:not(:last-child)::after, #tabstrip-8 table th:not(:last-child)::after, #tabstrip-9 table th:not(:last-child)::after, #tabstrip-10 table th:not(:last-child)::after {
    content: "";
    position: absolute;
    right: 0;
    top: 25%;
    height: 50%;
    width: 1px;
    background-color: #f0f0f0;
}

.dropdown-item.active, .dropdown-item:active {
    background: none;
}

.accordion-item {
    border: 0px !important;
}

.accordion-header, .accordion-button {
    background: #f5f5f5 !important
}

.modal-footer {
    border-top: 1px solid #f0f0f0 !important
}

.form-check-input:checked {
    background-color: #00857c !important;
    border-color: #00857c !important;
}

.accordion-body .form-check-input {
    border-radius: 0px !important;
}

.form-check-label {
    margin-left: 20px;
    font-size: 14px !important;
}

.accordion-header {
    font-size: 18px;
    padding: 10px 0px 10px 20px;
    font-weight: bold;
    border-top: 1px solid #f0f0f0
}

    .accordion-header .form-check-label {
        font-size: 14px
    }

.accordion-body {
    padding: 0px !important
}

    .accordion-body .form-check {
        padding: 15px 43px 15px 20px;
        border-top: 1px solid #f0f0f0
    }

.accordion-button:focus,
.accordion-button:active,
.accordion-button:focus-visible {
    outline: none !important;
    box-shadow: none !important;
}

.btn.btn-primary, .btn.btn-primary:hover {
    border-radius: 0px;
    background: #00857C;
    border: 1px solid #00857C;
    font-size: 16px;
}

.btn.btn-link, .btn.btn-link:hover {
    color: #00857C;
    text-decoration: none;
    font-size: 16px;
}

.accordion-button::after {
    background: url(/Assets/images/icons/AccordinDownArrow.png) no-repeat center center !important;
    order: -1;
}

.btn-close {
    background: url(/Assets/images/icons/CloseIcon.png) no-repeat center center !important;
    opacity: 1 !important
}

    .btn-close:focus,
    .btn-close:active,
    .btn-close:focus-visible {
        outline: none !important;
        box-shadow: none !important;
    }



/* Container for images */
#imagePreview {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

/* Individual image item container */
.image-item {
    position: relative;
    width: 250px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    border-radius: 5px;
    padding: 0px;
    text-align: center;
}

    /* Image styling */
    .image-item img {
        width: 100%;
        height: auto;
        border-radius: 5px;
        object-fit: cover;
        border: 1px solid #f5f5f5;
        max-height: 100px;
    }

/* Image details (title, size, close button) */
.image-details {
    padding: 10px;
    background-color: #E6F3F2;
    display: block;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    height: 60px;
    border-radius: 0 0 5px 5px;
    text-align: left;
}

    .image-details .btn-close {
        position: absolute;
        left: calc(100% - 30px);
        bottom: 15px
    }
/* Title of the image */
.image-title {
    font-size: 12px;
    font-weight: bold;
    color: #333;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: block;
    width: calc(100% - 30px);
    overflow: hidden
}


.image-size {
    font-size: 10px;
    color: #666;
    margin-top: 5px;
    display: block;
}

.notesImages {
    border: 1px solid #949494;
    padding: 10px;
    margin-top: 10px;
    min-height: 300px;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

    .notesImages textarea.form-control {
        border: 0px;
        padding: 0px;
        resize: none;
        background: #fff;
        max-height: 120px;
    }

        .notesImages textarea.form-control:focus {
            background: #fff;
            outline: none;
            box-shadow: none;
        }

.btn-upload-image {
    border-radius: 0px !important;
    background: url(/Assets/images/icons/UploadOutlined.png) no-repeat 7px center #fff;
    padding-left: 30px !important;
    border: 1px dashed #000 !important;
    font-weight: bold !important;
    font-size: 16px;
    color: rgba(0, 0, 0, 0.88);
}
#imgUpldSection2:not(:empty)::before {
    content: " / ";
}
.btn-take-photo {
    border-radius: 0px !important;
    background: url(/Assets/images/icons/CameraOutlined.png) no-repeat 7px center #fff;
    padding-left: 30px !important;
    border: 1px dashed #000 !important;
    font-weight: bold !important;
    font-size: 16px;
    color: rgba(0, 0, 0, 0.88);
}

.text-disable {
    width: 100%;
    background: #F5F5F5;
    border: 0px;
    border-radius: 4px;
    padding: 5px;
}

.btn-outline-primary {
    border-radius: 0px !important;
    border: 1px solid #949494 !important;
    color: rgba(0, 0, 0, 0.88) !important;
    font-size: 16px;
}

    .btn-outline-primary:hover {
        background: #fff !important;
    }

.success-msg {
    background: url(/Assets/images/icons/success-msg.png) no-repeat left center;
    padding: 8px 0px 8px 40px;
    font-size: 14px;
}

#savepopup, #closepopup {
    display: none;
}

#EditVaccinatorWindow #savepopup {
    display: flex;
}

#EditVaccinatorWindow #saveRow:has(div.navigation-buttons) {
    background: none;
}

#EditVaccinatorWindow .navigation-buttons {
    display: none;
}

.categories-container:has(.overview-heading) .navigation-buttons {
    display: none !important;
}

.field.bg-white .save-new-item {
    display: none;
}

.btn-primary.no-bg {
    color: #00857C;
    background: none;
    font-size: 16px;
    border: 0px;
    padding-top: 8px;
    font-weight: bold;
}

.k-i-x::before {
    background: url(/Assets/images/icons/CloseIcon.png) no-repeat center center !important;
    opacity: 1 !important;
    content: "" !important;
    height: 16px;
    width: 16px;
}

.btn-primary.no-bg:hover, .btn-primary.no-bg:focus {
    background: none;
    border: 0px;
}

#EditVaccinatorWindow #saveRow {
    margin: 0px;
    padding: 0px;
}

#cancelButtonKendo {
    display: none;
}

#EditVaccinatorWindow #cancelButtonKendo {
    display: flex;
}

.custom-message {
    font-size: 14px;
    margin-top: 20px;
}

.navigationAction.yes-update {
    display: none;
    background: #00857C !important;
    padding-left: 10px;
}

#EditVaccinatorWindow .save-new-item {
    display: none;
}

.warning-msg {
    background: url(/Assets/images/icons/warning-msg.png) no-repeat 12px center #fffbe6;
    padding: 5px 0px 5px 40px;
    border: 1px solid #ffe58f;
    border-radius: 4px;
}

.noteslabel {
    font-size: 16px !important;
    padding: 0px;
    font-weight: bold;
}

ul.dropdown-menu li {
    list-style: none;
}

/* Lightbox Modal Styles */
.lightbox {
    display: none;
    position: fixed;
    z-index: 9999;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7);
    justify-content: center; /* Horizontally center */
    align-items: center; /* Vertically center */
    text-align: center;
    overflow: hidden;
}

/* Lightbox Container */
.lightbox-container {
    position: relative;
    width: 700px; /* Fixed width for the lightbox */
    height: auto; /* Maintain aspect ratio */
    max-width: 100%; /* Ensure it doesn't overflow on smaller screens */
    max-height: 80vh; /* Limit the height to 80% of the viewport height */
    margin: 0 auto;
    background: #fff;
    padding: 15px;
}
/* Image inside the lightbox */
.lightbox-content {
    width: 100%;
    height: auto;
    max-width: 100%;
    max-height: 80vh; /* Ensure the image doesn't exceed 80% of the viewport height */
    object-fit: contain; /* Ensure the image aspect ratio is maintained */
}


/* Close button (top-right corner) */
.lightbox-container .close {
    position: absolute;
    top: 15px;
    right: 15px;
    width: 48px;
    height: 48px;
    font-size: 36px;
    cursor: pointer;
    background: url("/Assets/images/icons/close-lightbox.png") center center no-repeat;
}

/* Style the navigation buttons (Next and Previous) */
.lightbox-container button {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    z-index: 9999; /* Ensure buttons are on top of the image */
}

.lightbox-container #prev {
    left: 7px;
    background: url("/Assets/images/icons/prev-lightbox.png") center center no-repeat;
    background-size: contain;
    width: 48px;
    height: 48px;
}

.lightbox-container #next {
    right: 7px;
    background: url("/Assets/images/icons/next-lightbox.png") center center no-repeat;
    background-size: contain;
    width: 48px;
    height: 48px;
}

/* Hover effects for the navigation buttons */
.lightbox-container button:hover {
    opacity: 0.8; /* Slight transparency when hovered */
}

/* Remove page scroll when lightbox is open */
body.no-scroll {
    overflow: hidden; /* Disable page scroll */
}


/*--------------- Css for Chart -------*/
.chart-container-main {
    width: 100%;
    display: flex;

}
.chart-container-main .chart-container {
    display: block;
}
.chart-container {
    width: 100%;
    display: flex;
    background-color: #fff;
    position: relative;
}

.score-heading {
    background-color: #e6f3f2;
    padding: 25px 15px;
    margin: 0px;
    font-size: 14px;
    color: rgba(0, 0, 0, 0.88);
    font-weight: bold;
}

.chart_left {
    width: 20%;
    display: flex;
    justify-content: center;
}

.chart_right {
    width: 70%;
    margin-top: 30px;
    padding-bottom: 50px;
    padding-left: 20px;
    position: relative;
    padding-top: 5px;
    display: block;
    align-items: center;
}


    .chart_right:has(> div:only-child) {
        display: flex;
    }

    .chart_right::before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        height: calc( 100% - 60px );
        width: 1px;
        background-color: #f0f0f0;
    }

.chart_left .chart__box {
    padding: 0px 16px 20px;
}

.chart_left .chart__column.chart__column--quinary, .chart_right .chart__column.chart__column--quinary {
    flex: 0 1 100%;
    max-width: 100%;
    width: 100%;
}

.chart_right .chart__title {
    color: #000 !important;
}

.chart_right .chart__box {
    padding: 0px !important;
}

.catgaory-name {
    width: 28%;
    font-size: 14px;
    color: rgba(0, 0, 0, 0.88);
}

.bar-pan {
    width: 35%;
    margin-left: 10px;
}

.chart_right .chart__wrap {
    display: flex;
    align-items: center;
}

.bar-persantage {
    width: 30px;
    font-size: 14px;
    color: rgba(0, 0, 0, 0.88);
    font-weight: bold;
}

.circular-chart .circle,
.circular-chart .circle-bg {
    stroke-width: 2; /* decrease for thinner ring */
}

.chart__box.chart__box--excellent .circle {
    /* stroke: #00857c; */
}

.chart__center-text {
    font-size: 24px;
    color: rgba(0, 0, 0, 0.88) !important;
    font-weight: bold;
}

.info-panel {
    background-color: #fff;
    position: relative;
}

    .info-panel .k-tabstrip-top > .k-tabstrip-items-wrapper {
        border: 0px !important;
        background-color: #e6f3f2;
        padding: 10px 0px;
        margin-top: 20px;
    }

    .info-panel .k-item.k-tabstrip-item.k-active .k-link {
        color: rgba(0, 0, 0, 0.88) !important;
    }

        .info-panel .k-item.k-tabstrip-item.k-active .k-link::after {
            height: 0px !important;
        }

    .info-panel .k-item.k-tabstrip-item.k-active {
        background-color: #e6f3f2 !important;
    }

.efficiency-accuracy-pan {
    position: absolute;
    top: -60px;
    left: calc( 20% + 0px );
    display: flex;
    font-size: 14px;
    border-left: 1px solid #f0f0f0;
    padding-top: 20px;
}

.efficiency {
    background: #f5f5f5;
    border-radius: 4px;
    padding: 10px;
    margin-right: 20px;
    margin-left: 20px;
}

.accuracy {
    background: #f5f5f5;
    border-radius: 4px;
    padding: 10px;
}



/*--------------- CSS for Ctagaory popup -----------------*/
.accordion-header span {
    font-size: 14px;
    font-weight: bold;
    color: rgba(0, 0, 0, 0.88);
    text-transform: capitalize;
}

.accordion-header .accordion-button {
    flex-direction: row-reverse;
    padding-left: 0px;
    box-shadow: none;
}

.accordion-header INPUT:checked + .toggle-switch__slider {
    background-color: #00857C;
}

.accordion-body input[type="checkbox"] {
    accent-color: #00857C;
    border-radius: 0 !important;
}

.accordion-body .form-check-label {
    text-transform: capitalize;
}
/*------------------ Case Details page --------------*/
.case-detail-header {
    background-color: #fff;
    border: none !important;
}

HEADER.tab-panel__header .header-col.col--quaternary {
    max-width: 25%;
}

.case-detail-header .span-text.status {
    font-size: 12px !important;
    background-color: #DDDCFA;
    color: #949494 !important;
    border-radius: 10px;
    padding: 4px 8px 0px 8px !important;
    border: 1px solid #949494;
    width: fit-content;
}

.case-detail-header .span-text {
    display: block;
    width: auto;
    margin-bottom: 6px;
    font-family: 'Invention', sans-serif;
    font-size: 16px;
    color: rgba(0, 0, 0, 0.65);
    word-break: break-word;
    opacity: 1;
    transition: all .35s ease-in-out,;
}

.overview-heading {
    background-color: #e6f3f2;
    padding: 25px 15px;
    margin: 0px;
    font-size: 14px;
    color: rgba(0, 0, 0, 0.88);
    font-weight: bold;
    width: 100%;
}

.intro-textarea {
    margin: 10px !important;
}

.categories-container .panel__title, #SummaryVaccinatorTabStrip-1 .panel__title {
    display: none;
}

.save-as-complete {
    height: 42px;
    background: url("/Assets/images/icons/CheckOutlined.png") 10px center no-repeat #00857C !important;
    padding-left: 30px;
}

    .save-as-complete:hover {
        background: url("/Assets/images/icons/CheckOutlined.png") 10px center no-repeat #00857C !important;
    }

.navigation-buttons {
    padding-top: 15px;
    background-color: #f5f5f5;
    text-align: end;
}
.case-details .navigation-buttons {
    background-color: #fff;
    padding-right: 20px;
}
.navigationAction {
    background: url("/Assets/images/icons/save.png") 10px center no-repeat #00857C !important;
    padding-left: 30px;
}

/*--------------------- Css for recomandation section -------*/
.recomendation-pan {
    background-color: #fff;
    padding-bottom: 60px;
}

.recomendation-subpan {
    padding: 10px;
    border: 1px solid #ccc;
    margin: 10px;
    background-color: #fff;
}

.recomendation-pan textarea {
    width: 100%;
    padding: 0px !important;
    border-radius: 0px !important;
    height: 150px !important;
    background-color: #fff !important;
    color: rgba(0, 0, 0, 0.88) !important;
}

#drop-area {
    padding-top: 10px;
    width: 100%;
    min-height: 200px;
    display: flex;
}

    #drop-area .k-upload {
        width: 100%;
        height: 30vh;
        border: 0px;
    }

    #drop-area .k-upload-dropzone {
        height: 100%;
        background-color: #fff;
    }

    #drop-area .k-upload-files {
        position: absolute;
        bottom: 0px;
        border: 0px;
    }

    #drop-area .k-upload-button-wrap {
        position: absolute;
        direction: ltr;
        bottom: -62px;
        right: -26px;
        cursor: pointer;
        font-size: 16px;
        border: 1px dashed #ccc;
        padding: 0px 10px 0px 30px;
        color: #000;
        background: url("/Assets/images/icons/PaperClipOutlined1.png") 8px center no-repeat #fff;
        margin-right: 10px;
    }

    #drop-area .k-button-text, #drop-area .k-button.k-upload-button {
        background: #fff;
        border-color: #fff;
        text-transform: none !important;
        font-size: 16px;
    }

    #drop-area .k-i-image::before {
        content: "";
        background: url("/Assets/images/icons/PaperClipOutlined2.png") center center no-repeat;
        width: 22px;
        height: 22px;
    }

    #drop-area .k-upload .k-i-x::before {
        display: none;
    }

    #drop-area .k-upload-status-total {
        display: none;
    }

    #drop-area span[aria-label="Remove"] {
        background: url("/Assets/images/icons/DeleteOutlined.png") center center no-repeat;
    }

    #drop-area .k-upload .k-upload-files .k-file {
        align-items: center;
        border: 0px;
        padding: 3px;
        background: #f5f5f5;
        margin-bottom: 3px;
        margin-left: 10px;
    }

    #drop-area .k-dropzone-hint {
        display: none;
    }

    #drop-area .k-upload .k-upload-files .k-file-name {
        font-size: 14px;
        color: #006A63;
        margin-left: 5px;
        min-width: 250px
    }
.warnining-txt {
    position: absolute;
    bottom: 0px;
    right: 0px;
    text-align: end;
    padding: 10px;
    font-size: 13px;
}
#file-list {
    margin-top: 10px;
    margin-left: 5px;
}

.file-item {
    display: flex;
    background: #f3f3f3;
    padding: 2px 2px 2px 20px;
    margin-bottom: 6px;
    background: url("/Assets/images/icons/PaperClipOutlined2.png") left center no-repeat #ebebeb;
}

    .file-item span {
        flex: 1;
        margin-left: 8px;
        font-size: 14px;
        width: fit-content;
        min-width: 240px;
        color: #006A63;
    }

    .file-item button {
        background: url("/Assets/images/icons/delete.png") center center no-repeat;
        border: none;
        cursor: pointer;
        width: 17px;
        height: 18px;
    }

.upload-footer {
    text-align: right;
    margin-top: 15px;
}

    .upload-footer #selectBtn {
        cursor: pointer;
        font-size: 16px;
        border: 1px dashed #ccc;
        padding: 5px 10px 5px 30px;
        color: #000;
        background: url("/Assets/images/icons/PaperClipOutlined1.png") 8px center no-repeat #fff;
        margin-right: 10px;
    }

body:has(.k-content.k-active > .recomendation-pan) #btnNext {
    display: none !important;
}


/*----------------------- CSS for Admin Panel Starts here---------------------*/
.page-main:has(#adminSuite) .page-header {
    display: none;
}

#adminSuite {
    padding: 0px;
}

    #adminSuite .vertical-tab-wrapper {
        width: 254px;
        flex-shrink: 0;
        background-color: #fff;
        position: relative;
        transition: width .35s ease-in-out;
    }

    #adminSuite .admin-pan {
        display: flex;
        margin: 0px;
    }

.admin-right-pan {
    max-width: 100%;
    padding-left: 24px;
    flex: 1;
}

#adminSuite .admin-pan .k-grid-header TH .k-column-title {
    white-space: normal;
    word-break: break-word;
}

#adminSuite .k-tabstrip-items-wrapper {
    width: 100%;
}

#adminSuite .vertical-tab-wrapper .k-widget .k-content {
    padding: 0px !important;
}

#adminSuite .vertical-tab-wrapper li.k-item.k-tabstrip-item {
    border: 0px !important;
}

#adminSuite .k-tabstrip-left > .k-tabstrip-items-wrapper {
    border: 0px;
}

#adminSuite .vertical-tab-wrapper.collapsed .k-tabstrip-left > .k-tabstrip-items-wrapper {
    margin-top: 59px;
}

#adminSuite .vertical-tab-wrapper .k-tabstrip-items .k-link {
    border: 0px;
    text-align: start;
}

#adminSuite .filter-bar {
    margin-top: 25px;
}

#adminSuite .step-details__title {
    font-size: 20px;
    font-weight: bold;
}

#adminSuite .vertical-tab-wrapper.collapsed {
    width: 68px;
}

    #adminSuite .vertical-tab-wrapper.collapsed .step-details__title {
        display: none;
    }

#adminSuite .vertical-tab-wrapper li.k-tabstrip-item span.k-complete {
    width: 32px;
    height: 32px;
    background: #f0f0f0;
    display: flex;
    position: relative;
    border-radius: 50%;
    margin-right: 5px;
}

#adminSuite .vertical-tab-wrapper li.k-tabstrip-item {
    margin-left: 0px;
    padding: 10px 15px 10px 15px;
}

    #adminSuite .vertical-tab-wrapper li.k-tabstrip-item span.k-link {
        display: flex;
        padding: 5px 0px 0px 5px;
        font-size: 16;
        color: rgba(0, 0, 0, 0.45);
    }

    #adminSuite .vertical-tab-wrapper li.k-tabstrip-item.k-active span.k-link {
        color: rgba(0, 0, 0, 0.88);
        font-weight: normal;
    }

#adminSuite .vertical-tab-wrapper.collapsed li.k-tabstrip-item span.k-link {
    display: none;
}

#adminSuite .vertical-tab-wrapper .k-tabstrip-item[data-category-index="0"] span.k-complete {
    background: url("/Assets/images/icons/Evaluvations.png") center center no-repeat #f0f0f0;
}

#adminSuite .vertical-tab-wrapper .k-tabstrip-item[data-category-index="1"] span.k-complete {
    background: url("/Assets/images/icons/Users.png") center center no-repeat #f0f0f0;
}

#adminSuite .vertical-tab-wrapper .k-tabstrip-item[data-category-index="2"] span.k-complete {
    background: url("/Assets/images/icons/Products.png") center center no-repeat #f0f0f0;
}

#adminSuite .vertical-tab-wrapper .k-tabstrip-item[data-category-index="3"] span.k-complete {
    background: url("/Assets/images/icons/Companies.png") center center no-repeat #f0f0f0;
}

#adminSuite .vertical-tab-wrapper .k-tabstrip-item[data-category-index="5"] span.k-complete {
    background: url("/Assets/images/icons/Globe.png") center center no-repeat #f0f0f0;
}

#adminSuite .vertical-tab-wrapper .k-tabstrip-item[data-category-index="0"].k-active span.k-complete {
    background: url("/Assets/images/icons/EvaluvationsActive.png") center center no-repeat #00857C;
}

#adminSuite .vertical-tab-wrapper .k-tabstrip-item[data-category-index="1"].k-active span.k-complete {
    background: url("/Assets/images/icons/UsersActive.png") center center no-repeat #00857C;
}

#adminSuite .vertical-tab-wrapper .k-tabstrip-item[data-category-index="2"].k-active span.k-complete {
    background: url("/Assets/images/icons/ProductsActive.png") center center no-repeat #00857C;
}

#adminSuite .vertical-tab-wrapper .k-tabstrip-item[data-category-index="3"].k-active span.k-complete {
    background: url("/Assets/images/icons/CompaniesActive.png") center center no-repeat #00857C;
}

#adminSuite .vertical-tab-wrapper .k-tabstrip-item[data-category-index="5"].k-active span.k-complete {
    background: url("/Assets/images/icons/GlobeActive.png") center center no-repeat #00857C;
}

#adminSuite .vertical-tab-wrapper li.k-item.k-tabstrip-item.k-active span.k-link {
    background: url(/Assets/images/icons/rightarrow.png) 95% center no-repeat #f5f5f5;
    border-radius: 4px;
}

#adminSuite .vertical-tab-wrapper .k-hstack {
    display: none;
}

.admin-modal-tab {
    padding-bottom: 15px;
    padding-top: 15px;
}

    .admin-modal-tab .nav-link, .admin-modal-tab .nav-item {
        border: 0px;
        list-style: none;
        color: rgba(0, 0, 0, 0.45);
        padding: 0px;
        margin: 0px 5px;
        font-size: 13px;
    }

        .admin-modal-tab .nav-link.active {
            color: #00857C;
            border-bottom: 1px solid #00857C;
            font-weight: bold;
        }

.admin-add-location {
    position: absolute !important;
    right: 10px;
    top: -55px
}
.admin-add-country {
    position: absolute !important;
    right: 10px;
    top: -63px
}
.locationList {
    overflow: visible !important;
}

.admin-header-pan {
    justify-content: space-between;
    display: flex;
}

    .admin-header-pan .new-case {
        margin-top: 22px;
    }

.admin-company-filter .fields--row-comapny {
    text-align: left;
    display: flex;
    background: #ffffff;
    padding: 7px 15px;
    width: fit-content;
    align-items: center;
    border-radius: 4px;
    top: -107px;
    left: 0px;
    position: absolute;
}

    .admin-company-filter .fields--row-comapny .field--adjacent {
        min-width: 160px;
        margin: 0px;
        padding: 0px;
    }

        .admin-company-filter .fields--row-comapny .field--adjacent .k-dropdownlist {
            border: 0px;
        }

.country .field .k-dropdownlist {
    -webkit-box-flex: 1 1 25%;
    -webkit-flex: 1 1 25%;
    -moz-flex: 1 1 25%;
    -ms-flex: 1 1 25%;
    flex: 1 1 25%;
    width: auto !important;
    height: 32px;
    padding: 0;
    margin: 0;
    border: 1px solid #949494;
    background-color: #FFF;
    font-size: 14px;
    color: rgba(0, 0, 0, 0.88);
    overflow: hidden;
    border-radius: 0px;
}

.country .field LABEL.label--question {
    text-transform: capitalize;
    font-size: 15px;
}
.admin-user-filter {
   margin-top: -120px;
    margin-bottom: 45px;
    background-color: #f5f5f5 !important;
    padding: 0px !important;
}
BODY.theme .admin-user-filter .k-dropdownlist {
    border-color: #fff !important;
    background-color: #fff !important;
    border-radius: 0px;
    width: 150px !important;
    height: 40px;
    font-size: 16px;
}

.admin-user-filter .k-dropdownlist .k-i-caret-alt-down {
background: url("/Assets/images/icons/down.png") center center no-repeat;
}

.admin-user-filter .k-dropdownlist .k-i-caret-alt-down::before {
content: "";
}
.admin-user-filter .field.field--adjacent.field--users {
    background-color: #fff;
    padding: 6px;
    border-radius: 6px;
    
    margin-right: 10px;
}
.admin-user-filter .field.field--adjacent.field--users.role {
flex:0 1 17.33% !important;
}
.admin-user-filter .field.field--adjacent.field--users.search {
    padding-right: 40px;
}
.admin-user-filter .field.field--adjacent.field--users.search .k-textbox {
  border:1px solid #fff !important;  
}
.admin-user-filter .field.field--adjacent.field--users.search .k-textbox.k-focus {
    outline: none;
    box-shadow: none;
}
.admin-user-filter .field.field--adjacent.field--users.search #txtFilterUserSearch {
    border:1px solid #fff !important;
    margin: 4px;
    outline: none;
}
.admin-user-filter .field.field--adjacent.field--users.search #txtFilterUserSearch:focus {
    background-color: #fff;
}
.admin-user-filter .fields--row.fields--row-users {
justify-content: flex-start;
}
.admin-right-pan .k-item.k-tabstrip-item {
    color: #00857C;
    text-transform: capitalize;
    font-size: 14px;
    font-weight: bold;
    background: none !important;
    border: 0px;
}
.admin-right-pan .k-tabstrip-items .k-link {
    border: 0px !important;
    text-transform: capitalize !important;
}
 .k-item.k-tabstrip-item  span {
    color:rgba(0, 0, 0, 0.45);

}
#UsersTabstrip-tab-2 {
    z-index: 99 !important;
}
.find-role-button {
    width: 19px;
    height: 19px;
    background: url("/Assets/images/icons/find.png") center center no-repeat;
    border:0px;
    margin-top:15px;
    right:40px;
    position: relative;
}
.admin_User_Container .k-grid TD {
    padding: 5px 15px;
    text-align: left !important;
}
.admin_User_Container .k-grid TD:last-child {
    text-align: center !important;
}
.admin_User_Container .k-i-sort-asc-small::before {
background: url("/Assets/images/icons/atoz.png") center center no-repeat;
width: 13px;
height: 16px;
content: "";
}
.admin_User_Container .k-i-sort-desc-small::before {
    background: url("/Assets/images/icons/ztoa.png") center center no-repeat;
width: 13px;
height: 16px;
content: "";
}
.manage-user .form-group{
    display:flex;
    align-items:center;
    padding: 10px 0px;
    border-bottom: 1px solid #f5f5f5;
}

.manage-user .form-group .control-label{
    flex:0 0 75%;
    max-width:75%;
    font-size: 14px;
}

.manage-user .form-group .form-control,
.manage-user .form-group .k-dropdownlist{
    flex:0 0 25%;
    max-width:25%;
    border: 1px solid #949494;
    background-color: #f5f5f5;
    border-radius: 0px;
    font-size: 14px;
    height: 36px;
}
.country-header {
    background-color: #E6F3F2;
    font-size: 14px;
    padding: 10px;
    position: relative;
    border-bottom: 1px solid #d8e5e4;
}
.country-header::after {
    content: "";
    position: absolute;
    right: 10px;
    font-size: 18px;
    font-weight: bold;
    background: url(/Assets/images/icons/AccordinDownArrow.png) no-repeat center center !important;
    height: 14px;
    width: 14px;
    transform: rotate(0deg);
}

.country-header.active::after {
    content: "";
    background: url(/Assets/images/icons/AccordinDownArrow.png) no-repeat center center !important;
    height: 14px;
    width: 14px;
    transform: rotate(180deg);
}
a.remove-customer-btn {
    color: #000;
    margin-left: 10px;
}
/*----------------------- CSS for Admin Panel Ends here---------------------*/
.disable-all {
    pointer-events: none !important;
}
.hline-summary {
    height: 1px;
    background-color: #f0f0f0;
    margin: 15px 0px 22px 0px;
}

h2.pdf-row__title, .chart_container, .intro-content p, .panel__title, .author-name2, .grid-panel, .author-name-heading, .pdf-bottom-logo, .intro-heading, .content, .no-na-question-parent, .no-na-question, .no-na-questions-title 
{ 
    page-break-inside: avoid; 
    break-inside: avoid;      
}
 .intro-heading-questions, .intro-heading-items {
    page-break-before: always; 
    break-before: page;        
}
.general-notes-container {
    border-left: 1px solid #f0f0f0; 
    padding-left:20px
}

.general-notes-container .k-grid {
    border-radius: 4px;
    padding: 10px;
}
.general-notes-container .k-grid td {
    border: 0px;
}
.general-notes-container .k-listview-content {
        border: 1px solid #d8d8d8;
    border-radius: 6px;
    padding: 10px;
    margin: 10px 0px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 5px;
}

.general-notes-container .media-view {
     font-size: 0px;
    margin: 0px;
}

.general-notes-container .media-view img {
        width: 100%;
    height: 100%;
    display: block;
    border: 1px solid #f0f0f0;
}
#imageSizeModal {
    z-index: 2000;
}

#imageSizeModal .modal-backdrop {
    z-index: 1999;
}

.k-list-optionlabel {
    display: none !important;
}
#txtFilterUserType-list .k-list-optionlabel {
    display: block !important;
}
.k-calendar .k-disabled {
    color: #c0c0c0 !important;  
}