﻿
#blazor-error-ui {
    display: none !important;
}

:root {
    --rz-secondary: #54C0EB !important;
    --rz-menu-top-item-selected-color: #54C0EB !important;
    --rz-text-font-family: museo-sans, brandon-grotesque, Source Sans Pro, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol !important;
}

.main {
    background-color: #f0f0ef !important;
}

p {
    font-size: 14px;
    letter-spacing: 1px;
}

.bannerhome {
    /* min-height: 430px; */
}

.bannermain, .bannergray, .bannerred, .banneryellow, .bannergreen, .bannerlime, .bannermoave {
    /* min-height: 320px; */
}

.bannerhomepage {
    /* min-height: 282px; */
}

.bottom-logo {
    width: 100px;
    height: auto;
    position: relative;
    bottom: 0 !important;
    padding: 5px;
}

.bottom-esf {
    position: relative;
    bottom: 0 !important;
    padding: 5px;
}

.main-header h1 {
    color: #fff;
}

#locationSlider a, #locationSlider .ms-btn-container {
    width: unset !important;
}
/* ========================================================================================
   === General Responsiveness
   ======================================================================================== 
*/
@media only screen and (max-width: 600px) {
    h1 {
        font-size: 50px !important;
        line-height: 50px !important;
        margin-top: 20px !important;
        margin-bottom: 20px !important;
    }

    h2 {
        font-size: 40px !important;
        line-height: 40px !important;
        margin-top: 20px !important;
        margin-bottom: 20px !important;
    }

    .regionmap {
        height: 150px;
        width: auto;
    }

}


.prevent-select, .filterDropdown .rz-navigation-item-text {
    -webkit-user-select: none; /* Safari */
    -ms-user-select: none; /* IE 10 and IE 11 */
    user-select: none; /* Standard syntax */
}

/* ========================================================================================
   === Nav
   ======================================================================================== 
*/
header nav a.navbar-brand img {
    width: 220px;
    height: auto;
}

    .navbar-expand-lg .navbar-nav .nav-link {
        padding-right: 0.6rem;
        padding-left: 0.6rem;
    }

    header nav li {
        margin-bottom: 0px !important;
    }

    header nav a.nav-link {
        color: #f2f2f2 !important;
        font-size: 16px;
    }

        header nav a.nav-link:hover {
            color: #EF4851 !important
        }

header.bannermoave nav a.nav-link:hover, header.bannergreen nav a.nav-link:hover, header.bannerlime nav a.nav-link:hover, header.bannerred nav a.nav-link:hover {
    color: white !important;
}

    header nav .la {
        font-size: 2em;
        color: #f2f2f2;
    }

    header nav .social-nav .la:hover {
        color: #EF4851 !important
    }

    header nav .dropdown-menu .dropdown-item:hover {
        background-color: #EF4851 !important;
        color: white !important;
    }

    header nav .searchOpenDesktop:hover {
        cursor: pointer;
    }

    a, a:visited {
        color: unset;
    }

    @media only screen and (max-width: 994px) {
        header nav a.navbar-brand img {
            width: 90px;
        }

        .navbar-collapse {
            padding-top: 20px;
        }

            .navbar-collapse .social-nav {
                padding-left: 10px;
                padding-top: 15px;
            }

        .mobileSearch {
            margin-top: 20px;
            align-items: flex-end !important;
            display: flex;
            justify-content: flex-end;
            color: #f2f2f2;
        }

            .mobileSearch input, .mobileSearch input::placeholder {
                color: rgb(85, 85, 85);
            }

        header nav .dropdown-menu {
            background: none !important;
            border: none !important;
        }

            header nav .dropdown-menu .dropdown-item {
                color: #f2f2f2 !important;
            }
    }

@media only screen and (min-width: 992px) and (max-width: 1450px) {
    header nav a.navbar-brand img {
        width: 90px;
    }

    header nav a.nav-link {
        font-size: 14px;
    }

}

@media only screen and (min-width: 992px) and (max-width: 1250px) {

    header nav a.nav-link {
        font-size: 12px;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1150px) {

    header nav a.nav-link {
        font-size: 11px;
    }
}


    /* ========================================================================================
   === Hompage
   ======================================================================================== 
*/
    .section-inspire {
        /*min-height: 550px;*/
        background-image: url(/img/inspire.jpg) !important;
    }

    .beInspiredBtnContainer {
        display: flex;
        justify-content: center;
        width: 100%;
    }

    .container-fluid {
        max-width: 1600px !important;
    }

    .triggerjobmodal .panel {
        padding: 5px;
    }


    .sidelinkholder {
        display: flex;
        align-items: center;
        justify-content: center;
    }

/* ========================================================================================
   === Industry Sector
   ======================================================================================== 
*/
.section-related-jobs .triggerjobmodal .panel {
    border-color: white !important;
    min-height: 410px
}
/* ========================================================================================
   === Modals
   ======================================================================================== 
*/
.ResourceVideoModal iframe {
    height: 500px;
    width: 100%;
}

    .jobRoleModal .modal-dialog {
        max-width: unset !important;
    }

    .modal-dialog.job-dialog h2 {
        text-align: left !important;
    }

    .woWIframeResponsive {
        width: 100% !important;
        height: auto !important;
    }

    .modal.show:has(.woWIframeResponsive) {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

        .modal.show:has(.woWIframeResponsive) .modal-dialog {
            transform: unset !important;
        }

            .modal.show:has(.woWIframeResponsive) .modal-dialog .modal-content {
                height: 50vh !important;
            }

                .modal.show:has(.woWIframeResponsive) .modal-dialog .modal-content .iFrameContainer {
                    height: 100% !important;
                    width: 100% !important;
                    display: flex !important;
                    padding-bottom: 20px;
                }


    @media only screen and (min-width: 1024px) {
        .modal.show:has(.woWIframeResponsive) .modal-dialog {
            width: 50% !important;
            height: 50% !important;
            max-width: unset !important;
        }
    }

@media (min-width: 1100px) {
    .ResourceVideoModal .modal-dialog {
        max-width: 1000px !important;
    }
}

@media (max-width: 1400px) {
    .beInspiredSection .modal.show {
        margin-left: 0px !important;
    }
}

    /* ========================================================================================
   === Be Inspired Page
   ======================================================================================== */

    a.rz-paginator-element {
        color: var(--rz-paginator-numeric-button-color) !important;
    }

    .rz-datalist-content .modal.fade.modalcs {
        background: none !important;
        border: none !important;
    }

        .rz-datalist-content .modal.fade.modalcs .modal-dialog {
            max-width: unset !important;
        }

    @media screen and (max-width: 760px) {
        section.beInspiredSection .container-fluid {
            padding-left: 0px !important;
        }
    }


    @media screen and (max-width: 1024px) {
        .dataListContainer .rz-g {
            display: flex;
            flex-direction: column;
        }

        .dataListContainer .rz-card {
            width: 100% !important;
        }
    }




    /* ========================================================================================
   === Labour Market Information
   ======================================================================================== */
.section-resources .triggeryoutube img {
    max-width: 100% !important;
}


.ResourceSearchControls {
    display: flex;
    justify-content: space-between;
}

        .ResourceSearchControls input::placeholder {
            color: #4d4d4d;
            !important;
        }

    .resource-search li:hover {
        cursor: pointer !important;
    }


    @media only screen and (max-width: 550px) {
        section.section-resources #resourcesid, section.beInspiredSection .container-fluid {
            padding-left: 0px !important;
        }
    }

    @media only screen and (max-width: 1400px) {
        .job-dialog {
            width: 100% !important;
        }
    }


    /* ========================================================================================
   === Opportunties Page
   ======================================================================================== */

    .externalOpportunities .rz-card {
        min-height: 300px;
        margin-bottom: 30px;
    }
    /* Layout for search container */
    .search {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: flex-end;
        text-align: center;
        margin-right: 10px;
    }

    .js .search {
        position: fixed;
        /*z-index: 1000;*/
        top: 0;
        left: 0;
        width: 100%;
        height: 100vh;
        display: flex;
        align-items: center;
    }

        .js .search::before {
            content: '';
            position: absolute;
            top: 0;
            right: 0;
            width: 100%;
            height: 100%;
            background: #243E88;
        }

    .btn--search-close {
        font-size: 15px !important;
        position: absolute;
        top: 1.25em;
        right: 1.25em;
        display: none;
        background-color: transparent;
        border: 0px;
        fill: white;
    }

    .js .btn--search-close {
        display: block;
    }

    .search__form {
        margin: 5em 0;
    }

    .search__input {
        font-family: inherit;
        font-size: 7vw;
        line-height: 1;
        display: inline-block;
        box-sizing: border-box;
        width: 75%;
        padding: 0.05em 0;
        color: #fff;
        border-bottom: 5px solid;
    }

        .search__input::-webkit-input-placeholder {
            /* WebKit, Blink, Edge */
            color: #4a319e;
        }

        .search__input::-moz-placeholder {
            opacity: 1;
            /* Mozilla Firefox 19+ */
            color: #4a319e;
        }

        .search__input:-ms-input-placeholder {
            /* Internet Explorer 10-11 */
            color: #4a319e;
        }

        .search__input::-webkit-search-cancel-button,
        .search__input::-webkit-search-decoration {
            -webkit-appearance: none;
        }

        .search__input::-ms-clear {
            display: none;
        }

    .search__info {
        font-size: 90%;
        font-weight: bold;
        display: block;
        width: 75%;
        margin: 0 auto;
        padding: 0.85em 0;
        text-align: right;
        color: #fff;
        font-family: "museo-slab";
    }

    .search__related {
        display: flex;
        width: 75%;
        text-align: left;
        /*pointer-events: none;*/
    }

    .search__suggestion {
        width: 100%;
        margin-bottom: 50px;
    }

        .search__suggestion:first-child {
            padding: 0 2em 0 0;
        }

        .search__suggestion:last-child {
            padding: 0 0 0 2em;
        }

        .search__suggestion h3 {
            font-size: 1.35em;
            margin: 0;
        }

            .search__suggestion h3::before {
                content: '\21FE';
                display: inline-block;
                padding: 0 0.5em 0 0;
            }

        .search__suggestion p {
            font-size: 1.15em;
            line-height: 1.4;
            margin: 0.75em 0 0 0;
        }

@media screen and (max-width: 800px) {
    .search__related {
        display: none;
    }

}



    /************************/
    /* Transitions 			*/
    /************************/

    .js .main-wrap {
        position: relative;
        transition: transform 0.5s;
    }

    .js .main-wrap--move {
        transform: scale3d(0.7,0.7,1);
    }

        .js .main-wrap--move .btn--search {
            pointer-events: none;
            opacity: 0;
        }

    .js .search {
        pointer-events: none;
    }

    .js .search--open {
        pointer-events: auto;
    }

    .js .search::before {
        opacity: 0;
        transition: opacity 0.5s;
    }

    .js .search--open::before {
        opacity: 1;
    }

    /* Close button */
    .btn--search-close {
        opacity: 0;
        transition: opacity 0.5s;
    }

    .search--open .btn--search-close {
        opacity: 1;
    }

    /* Search form with input and description */

    .search__suggestion,
    .search__info {
        opacity: 0;
        transform: translate3d(0, 50px, 0);
        transition: opacity 0.4s, transform 0.4s;
    }

    .search--open .search__suggestion,
    .search--open .search__info {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }

        .search--open .search__suggestion:first-child {
            transition-delay: 0.15s;
        }

        .search--open .search__suggestion:nth-child(2) {
            transition-delay: 0.2s;
        }

    .js .search__input {
        transform: scale3d(0,1,1);
        transform-origin: 0% 50%;
        transition: transform 0.3s;
        font-family: "museo-slab";
        border-bottom: 5px solid #fff;
    }

    .js .search--open .search__input {
        transform: scale3d(1,1,1);
        transition-duration: 0.5s;
    }





    @media screen and (max-width: 40em) {
        .btn--search-close {
            font-size: 1.25em;
        }

        .search__suggestion {
            font-size: 80%;
            width: 100%;
        }

            .search__suggestion:nth-child(2),
            .search__suggestion:nth-child(3) {
                display: none;
            }
    }

    .main-wrap {
        position: relative;
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 100%;
        height: 100vh;
        background-color: #22295f;
        background-image: url(../img/bg.svg);
        background-repeat: no-repeat;
        background-position: 50% 10em;
        background-size: 75% auto;
    }


    /* Buttons */

    .searchopener {
        color: #cecae0;
        background-color: #7d7d7d;
    }

        .searchopener a, .searchopener .btn {
            color: #eaba82;
        }

    .btn--search {
        font-size: 1.5em;
    }

    .btn--hidden {
        pointer-events: none;
        opacity: 0;
    }


    /* Reset Search Input */

    .search__input {
        border: 0;
        background: transparent;
        border-radius: 0;
        -webkit-appearance: none;
    }

        .search__input:focus {
            outline: none;
        }

    .search__related .tag {
        color: #fff !important;
        font-family: "museo-slab" !important;
    }

    .search__related h3, .search__related h4, .search__related h5, .search__related {
        color: #fff !important;
    }

    .icon--cross {
        color: #fff;
        width: 50px;
        height: auto;
    }


    .img-jobimage {
        position: relative;
        width: 50%;
        height: auto;
        text-align: center;
        margin: auto;
        margin-top: 20px;
    }

    .rz-datalist-content .modal .img-jobimage {
        margin-top: 0px !important;
    }

    .job-dialog .modal-content {
        background-color: rgba(0,161,94,1) !important;
    }

    .job-dialog-sector .modal-content {
        background-color: #444 !important;
    }

    .job-dialog {
        color: #fff;
        width: 80%;
    }

    @media screen and (min-width: 1024px) {
        .job-dialog-sector {
            color: #fff;
            width: 80%;
        }
    }

    .job-description {
        overflow-y: scroll;
        padding-left: 20px;
        /*padding-top: 10px;*/
        margin-top: 20px;
        margin-bottom: 20px;
    }

    .job-sidebar {
        text-align: center;
        font-size: 120%;
    }

    .job-dialog h3, .job-dialog-sector h3 {
        font-family: "museo-slab";
        text-transform: capitalize;
        /*color: #00A15E;*/
        color: rgba(255,255,255,0.4) !important;
        font-size: 38px;
    }



    .job-sidebar h5 {
        font-family: "museo-slab";
        text-transform: capitalize;
        font-size: 32px;
        margin-bottom: 50px;
        margin-top: 20px;
        /*color: #00A15E;*/
        color: rgba(255,255,255,0.4) !important;
    }

    .section-green h3 {
        color: white !important;
    }

    .triggerjobmodal .mb0 {
        color: rgba(255,255,255,0.8) !important;
    }

    .section-resources h3, .section-resources p {
        color: #444;
    }

    .section-resources a {
        color: rgba(255,255,255,0.8) !important;
    }

    .section-resources {
        /*margin-top: 0px;*/
    }

        .section-resources .panel {
            margin-bottom: 20px;
        }

    .img-resource-icon {
        position: relative;
        width: 40% !important;
        height: auto;
        text-align: center;
        margin: auto;
        margin-top: 20px;
    }

    .section-related-jobs h2 {
        font-family: "museo-slab";
        font-weight: lighter;
        font-size: 60px;
        color: rgba(255,255,255,0.2);
        letter-spacing: 1px;
        text-align: center;
        text-transform: capitalize;
    }

    #lxTdnn_jobs1, #lxTdnn_employ1 {
        top: -10px;
        position: relative;
    }


    .search__input::-webkit-input-placeholder { /* Chrome/Opera/Safari */
        color: rgba(255,255,255,0.3);
        font-size: 50%;
    }

    .search__input::-moz-placeholder { /* Firefox 19+ */
        color: rgba(255,255,255,0.3);
        font-size: 50%;
    }

    .search__input:-ms-input-placeholder { /* IE 10+ */
        color: rgba(255,255,255,0.3);
        font-size: 50%;
    }

    .search__input:-moz-placeholder { /* Firefox 18- */
        color: rgba(255,255,255,0.3);
        font-size: 50%;
    }

    .btn-search-tags {
        z-index: 9999;
    }


    .btn-warning {
        border-color: #444 !important;
    }

    nav.navbar {
        background: none !important;
    }

    ul.nav-search {
        width: 140px;
        margin-top: 20px;
        margin-bottom: 20px;
        /*border-radius: 4px;*/
        border: 1px solid #ddd;
        background-color: white !important;
    }

        ul.nav-search li {
            margin: 0;
            border-top: 1px solid #ddd;
        }

            ul.nav-search li:first-child {
                border-top: none;
            }

            ul.nav-search li a {
                margin: 0;
                padding: 8px 16px;
                border-radius: 0;
            }

            ul.nav-search li.active a, ul.nav-search li.active a:hover {
                color: #fff;
                background-color: : #FBB402 !important;
                border: 1px solid #FBB402 !important;
            }

    #stickysidebar img {
        width: 80px;
        height: auto;
        margin-top: 10px;
        left: 22%;
        position: relative;
    }

    #stickysidebar {
        transition-timing-function: ease-in;
        position: fixed;
        right: -200;
        top: 40%;
        overflow: auto;
        z-index: 9;
        background-color: #FBB402 !important;
        -webkit-box-shadow: -26px 0px 25px -16px rgba(0,0,0,0.62);
        -moz-box-shadow: -26px 0px 25px -16px rgba(0,0,0,0.62);
        box-shadow: -26px 0px 25px -16px rgba(0,0,0,0.62);
    }

    /* ========================================================================================
   === /THE SEARCH
   ======================================================================================== */

    .alert p {
        font-family: "museo-slab" !important;
        font-size: 14px;
        letter-spacing: 1px;
        line-height: 26px;
    }

    #searchresultsheader {
        font-size: 42px !important;
    }

    .employerholder {
        min-height: 560px;
    }

        .employerholder .wow-tags .btn, .ms-layer .btn {
            color: #fff !important;
        }

    .msp-cn-170-7 .wow-tags .btn {
        color: #444 !important;
        border-color: #999;
    }

        .msp-cn-170-7 .wow-tags .btn:active, .msp-cn-170-7 .wow-tags .btn:focus, .msp-cn-170-7 .wow-tags .btn:hover {
            border-color: #444;
        }

    .wow-tags .btn {
        padding: 10px;
        margin-right: 10px;
        margin-bottom: 10px;
        color: #fff;
        text-align: left;
    }

    .wow-links {
        min-height: 60px;
    }

        .wow-links .btn i {
            margin-left: 0px;
        }

    #banner {
        bottom: -1;
    }

    #footer {
        top: -12;
        position: relative;
        padding-bottom: 100px;
    }

    @media (max-width:1400px) {

        .factsholder {
            position: relative;
            height: 450px !important;
            overflow: hidden;
        }

        .factsoverlay .container {
            padding-top: 30px;
        }
    }

    @media (max-width: 1200px) {


        .factsholder {
            position: relative;
            height: 450px !important;
            overflow: hidden;
        }
    }


    @media (max-width:798px) {

        .search__suggestion h3, .search__suggestion p {
            display: none;
        }

        #stickysidebar {
            display: none;
        }

        .factsholder {
            position: relative;
            height: 350px !important;
            overflow: hidden;
        }

        .factsoverlay .container {
            padding-top: 0px;
        }
    }

    @media (max-width:600px) {

        .factsholder {
            position: relative;
            height: 250px !important;
            overflow: hidden;
        }

        .factsoverlay .container {
            padding-top: 0px;
        }

            .factsoverlay .container .ito h2 {
                display: none;
            }

            .factsoverlay .container .ito h4, .factsoverlay .container .ito p {
                font-size: 75% !important;
            }
    }

    .news-header {
        color: rgba(244,191,71,0.5);
    }

    .back-to-top {
        cursor: pointer;
        position: fixed;
        bottom: 20px;
        right: 20px;
        display: none;
        background-color: rgba(77,77,77,0.8);
        color: #fff;
        border: 0px solid #fff;
        text-align: center;
    }

        .back-to-top i {
            color: #fff !important;
            margin-left: 0px !important;
        }


    /* ======================================================

   ====================================================== */


    /* CSS talk bubble */
.talk-bubble {
    margin: 0px;
    display: inline-block;
    position: relative;
    /*width: 			300px;*/
    width: 100%;
    height: auto;
    background-color: #0089a6;
    color: #fff;
    font-family: "museo-slab";
    font-weight: lighter;
    margin-top: 50px;
    margin-bottom: 50px;
}

    .border {
        border: 8px solid #28347E !important;
    }

    .round {
        border-radius: 30px;
        -webkit-border-radius: 30px;
        -moz-border-radius: 30px;
    }

    /* Right triangle placed top left flush. */
    .tri-right.border.left-top:before {
        content: ' ';
        position: absolute;
        width: 0;
        height: 0;
        left: -40px;
        right: auto;
        top: -8px;
        bottom: auto;
        border: 32px solid;
        border-color: #28347E transparent transparent transparent;
    }

    .tri-right.left-top:after {
        content: ' ';
        position: absolute;
        width: 0;
        height: 0;
        left: -20px;
        right: auto;
        top: 0px;
        bottom: auto;
        border: 22px solid;
        border-color: lightyellow transparent transparent transparent;
    }

    /* Right triangle, left side slightly down */
    .tri-right.border.left-in:before {
        content: ' ';
        position: absolute;
        width: 0;
        height: 0;
        left: -40px;
        right: auto;
        top: 30px;
        bottom: auto;
        border: 20px solid;
        border-color: #666 #666 transparent transparent;
    }

    .tri-right.left-in:after {
        content: ' ';
        position: absolute;
        width: 0;
        height: 0;
        left: -20px;
        right: auto;
        top: 38px;
        bottom: auto;
        border: 12px solid;
        border-color: lightyellow lightyellow transparent transparent;
    }

    /*Right triangle, placed bottom left side slightly in*/
    .tri-right.border.btm-left:before {
        content: ' ';
        position: absolute;
        width: 0;
        height: 0;
        left: -8px;
        right: auto;
        top: auto;
        bottom: -40px;
        border: 32px solid;
        border-color: transparent transparent transparent #666;
    }

    .tri-right.btm-left:after {
        content: ' ';
        position: absolute;
        width: 0;
        height: 0;
        left: 0px;
        right: auto;
        top: auto;
        bottom: -20px;
        border: 22px solid;
        border-color: transparent transparent transparent #fff;
    }

    /*Right triangle, placed bottom left side slightly in*/
    .tri-right.border.btm-left-in:before {
        content: ' ';
        position: absolute;
        width: 0;
        height: 0;
        left: 30px;
        right: auto;
        top: auto;
        bottom: -40px;
        border: 20px solid;
        border-color: #28347E transparent transparent #28347E;
    }

.tri-right.btm-left-in:after {
    content: ' ';
    position: absolute;
    width: 0;
    height: 0;
    left: 38px;
    right: auto;
    top: auto;
    bottom: -20px;
    border: 12px solid;
    border-color: #0089a6 transparent transparent #0089a6;
}

    /*Right triangle, placed bottom right side slightly in*/
    .tri-right.border.btm-right-in:before {
        content: ' ';
        position: absolute;
        width: 0;
        height: 0;
        left: auto;
        right: 30px;
        bottom: -40px;
        border: 20px solid;
        border-color: #28347E #28347E transparent transparent;
    }

    .tri-right.btm-right-in:after {
        content: ' ';
        position: absolute;
        width: 0;
        height: 0;
        left: auto;
        right: 38px;
        bottom: -20px;
        border: 12px solid;
        border-color: #208aae #208aae transparent transparent;
    }


    /* talk bubble contents */
    .talktext {
        padding: 1em;
        text-align: left;
        line-height: 1.5em;
        font-size: 19px;
        letter-spacing: 1px;
    }

        .talktext h4 {
            color: #fff;
            /*color:#28347E;*/
            margin-top: 0px;
        }

        .talktext .badge {
            margin-top: 10px;
            background-color: #28347E;
            color: #54C0EB;
        }

        .talktext .fa {
            color: rgba(255,255,255,0.2);
            margin-right: 10px;
        }

        .talktext img {
            width: 80px;
            height: auto;
            float: left;
            padding-right: 15px;
            padding-bottom: 5px;
        }

        .talktext p {
            /* remove webkit p margins */
            -webkit-margin-before: 0em;
            -webkit-margin-after: 0em;
        }


    .img-wrap-casestudy {
        height: 200px;
        width: 200px;
        border-radius: 50%;
        overflow: hidden;
        background: rgba(0,0,0,0.5);
        text-align: center;
        position: relative;
        margin: auto;
        margin-top: 20px;
    }

        .img-wrap-casestudy img {
            position: absolute;
            width: auto;
            min-width: 230px;
            min-height: auto;
            height: 230px;
            top: -20;
            left: -10;
        }

    .img-wrap-casestudybg {
        height: 250px;
        width: 250px;
        border-radius: 50%;
        overflow: hidden;
        background: rgba(0,0,0,0.5);
        text-align: center;
        position: relative;
        margin: auto;
        margin-top: 20px;
    }

        .img-wrap-casestudybg img {
            position: absolute;
            width: auto;
            min-width: 300px;
            min-height: auto;
            height: 300px;
            top: -20;
            left: 0;
        }

    @media screen and (max-width: 700px) {

        .beInspiredSection .img-wrap-casestudybg {
            height: 150px !important;
            width: 150px !important;
        }

            .beInspiredSection .img-wrap-casestudybg img {
                min-width: 150px !important;
                height: 150px !important;
            }
    }

    .section-cstudies h2 {
        text-align: right;
        color: #fff;
    }

        .section-cstudies h2 span {
            font-weight: bold;
            color: #fff;
            margin-right: 100px;
        }

    .section-cstudies .h3top {
        text-align: center !important;
        color: rgba(255,255,255,0.5) !important;
    }

        .section-cstudies .h3top span {
            font-weight: bold;
            color: #fff;
        }

    .section-cstudies h4 {
        text-align: center;
        color: #fff;
    }

    .section-cstudies .job-description {
        letter-spacing: 0.5px;
        font-size: 16px;
        line-height: 20px;
    }

    .section-cstudies .OWSPage {
        color: #fff !important;
        font-size: 12px;
    }

    .section-cstudies .col-md-4 {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .section-cstudies section[class^=col-] {
        padding-left: 0px !important;
        padding-right: 0px !important;
    }

    @media (min-width: 992px) {
        .section-cstudies section[class^=col-] {
            padding-left: 0px !important;
            padding-right: 0px !important;
        }
    }

    @media (max-width: 1400px) {
        .img-wrap-casestudybg {
            height: 250px !important;
            width: 250px !important;
        }

        .cs-image1, .cs-image2, .cs-image3, .cs-image4 {
            opacity: 0 !important;
        }
    }

    @media (max-width: 1200px) {

        .nav > li > a {
            position: relative;
            display: block;
            padding: 5px 5px !important;
        }
    }

    @media (max-width: 992px) {
        .section-cstudies section[class^=col-] {
            padding-left: 0px !important;
            padding-right: 0px !important;
        }

        .ms-btn-container .btn {
            width: 100% !important;
        }

        .thesearchdialog h2 {
            text-align: left;
            color: #fff;
            font-size: 30px;
        }

        .img-wrap-casestudybg {
            height: 300px !important;
            width: 300px !important;
        }
    }

    .cs-text1, .cs-text2, .cs-text3, .cs-text4 {
        /*margin-top: 20px !important;*/
        margin-top: 30px !important;
        z-index: 5;
        /*display: none;*/
        /*text-shadow: 0 0 6px black;*/
    }

    .cs-image1, .cs-image2, .cs-image3, .cs-image4 {
        opacity: 0.5;
        width: 277px !important;
        height: 277px !important;
        overflow: auto !important;
        /*z-index: 999;*/
    }

    .thesearchdialog {
        z-index: 10000 !important;
    }


        .thesearchdialog h2, .thesearchdialog h3, .thesearchdialog h4 {
            color: #fff !important;
        }

        .thesearchdialog h2 {
            text-align: right;
            color: #fff;
        }

            .thesearchdialog h2 span {
                font-weight: bold;
                color: #fff;
                margin-right: 100px;
            }

        .thesearchdialog .h3top {
            text-align: center !important;
            color: rgba(255,255,255,0.5) !important;
        }

            .thesearchdialog .h3top span {
                font-weight: bold;
                color: #fff;
            }

    .modalcs h2 {
        text-align: right;
        color: #fff;
    }

        .modalcs h2 span {
            font-weight: bold;
            color: #fff;
            margin-right: 100px;
        }

    .modalcs .h3top {
        text-align: center !important;
        color: rgba(255,255,255,0.3) !important;
    }

        .modalcs .h3top span {
            font-weight: bold;
            color: #fff;
        }

    .modalcs h4 {
        color: #fff;
    }

    .bannerred li.active a {
        background: 0 0;
        /*color: #208AAE !important;*/
        color: #aaa !important;
    }

    .modal-employers .modal-content {
        background-color: #444 !important;
    }


    .modal-employers > .modal-content > .modal-body > img {
        width: auto;
        height: 200px;
        /*margin-bottom: 10px;*/
        float: left;
        margin-right: 20px;
        padding-bottom: 20px;
    }


    .ms-staff-carousel.ms-round .ms-nav-prev {
        background-color: transparent;
        box-shadow: none;
        left: -400px !important;
    }

    .ms-staff-carousel.ms-round .ms-nav-next {
        background-color: transparent;
        box-shadow: none;
        right: -400px !important;
    }

    #dnn_ctr508_HtmlModule_lblContent p {
        font-size: 14px;
        letter-spacing: 1px;
        line-height: 20px;
    }


    .section-darkgrey {
        margin-top: 50px;
        background-color: #dddddd;
    }

.section-grey {
    /*background-color: #bbbbbb;*/
    background-color: #98989c;
}

.section-grey h2 {
    color: white !important;
}

    .section-lightgrey {
        background-color: #888888;
    }

    .section-darkgrey h4 {
        font-size: 60px;
        color: #bbbbbb;
        margin-bottom: 50px;
    }

    .section-grey h4 {
        font-size: 60px;
        color: rgba(255,255,255,0.2);
        margin-bottom: 50px;
    }

    .section-lightgrey h4 {
        font-size: 60px;
        color: rgba(255,255,255,0.2);
        margin-bottom: 50px;
    }

    .section-red .btn-info {
        background-color: rgba(255,255,255,0.4) !important;
    }

    #lxP514 > div {
        background: #EF4851 !important;
        color: #fff;
    }


    .jobrolessliderholder {
        width: 100%;
        overflow-x: scroll;
    }

    .jobrolesslider {
        white-space: nowrap;
    }



    .jobroleholder {
        display: inline-block;
        color: white;
        text-align: center;
        padding: 14px;
        height: 130px;
        width: 150px;
        margin-bottom: 20px;
        margin-right: 20px;
        text-decoration: none;
        position: relative;
    }

        .jobroleholder img {
            position: absolute;
            margin: auto;
            left: 0;
            right: 0;
            top: 0;
            width: 80px;
            height: auto;
        }

        .jobroleholder span {
            left: 0;
            right: 0;
            bottom: 0;
            color: #fff;
            position: absolute;
            margin: auto;
            white-space: normal !important;
        }

    .jobtxth {
        width: 100px;
        overflow-wrap: break-word;
    }

    .btn-beinspired {
        text-align: center !important;
        color: #fff !important;
        font-size: 16px !important;
        /*width: 100% !important;*/
    }

    .modal-footer .wow-tags {
        text-align: left !important;
    }

        .modal-footer .wow-tags a:nth-of-type(1) {
            /*margin-top: 10px !important;
            margin-left: 5px !important;*/
        }

    .section-inspire .btn-info {
        color: #00A15E !important;
        border: 1px solid #00A15E !important;
        ;
    }


    .tooltip {
        position: absolute;
        z-index: 1070;
        display: block;
        font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
        font-size: 12px;
        font-style: normal;
        font-weight: normal;
        line-height: 1.42857143;
        text-align: left;
        text-align: start;
        text-decoration: none;
        text-shadow: none;
        text-transform: none;
        letter-spacing: normal;
        word-break: normal;
        word-spacing: normal;
        word-wrap: normal;
        white-space: normal;
        filter: alpha(opacity=0);
        opacity: 0;
        line-break: auto;
    }

        .tooltip.in {
            filter: alpha(opacity=90);
            opacity: .9;
        }

        .tooltip.top {
            padding: 5px 0;
            margin-top: -3px;
        }

        .tooltip.right {
            padding: 0 5px;
            margin-left: 3px;
        }

        .tooltip.bottom {
            padding: 5px 0;
            margin-top: 3px;
        }

        .tooltip.left {
            padding: 0 5px;
            margin-left: -3px;
        }

    .tooltip-inner {
        max-width: 200px;
        padding: 3px 8px;
        color: #fff;
        text-align: center;
        background-color: #000;
        border-radius: 4px;
    }

    .tooltip-arrow {
        position: absolute;
        width: 0;
        height: 0;
        border-color: transparent;
        border-style: solid;
    }

    .tooltip.top .tooltip-arrow {
        bottom: 0;
        left: 50%;
        margin-left: -5px;
        border-width: 5px 5px 0;
        border-top-color: #000;
    }

    .tooltip.top-left .tooltip-arrow {
        right: 5px;
        bottom: 0;
        margin-bottom: -5px;
        border-width: 5px 5px 0;
        border-top-color: #000;
    }

    .tooltip.top-right .tooltip-arrow {
        bottom: 0;
        left: 5px;
        margin-bottom: -5px;
        border-width: 5px 5px 0;
        border-top-color: #000;
    }

    .tooltip.right .tooltip-arrow {
        top: 50%;
        left: 0;
        margin-top: -5px;
        border-width: 5px 5px 5px 0;
        border-right-color: #000;
    }

    .tooltip.left .tooltip-arrow {
        top: 50%;
        right: 0;
        margin-top: -5px;
        border-width: 5px 0 5px 5px;
        border-left-color: #000;
    }

    .tooltip.bottom .tooltip-arrow {
        top: 0;
        left: 50%;
        margin-left: -5px;
        border-width: 0 5px 5px;
        border-bottom-color: #000;
    }

    .tooltip.bottom-left .tooltip-arrow {
        top: 0;
        right: 5px;
        margin-top: -5px;
        border-width: 0 5px 5px;
        border-bottom-color: #000;
    }

    .tooltip.bottom-right .tooltip-arrow {
        top: 0;
        left: 5px;
        margin-top: -5px;
        border-width: 0 5px 5px;
        border-bottom-color: #000;
    }


    .popupOnHover {
        cursor: pointer;
    }


    .empexternalurl {
        float: right;
        margin-right: 20px;
        color: #fff !important;
    }

    .jumpmenu {
        font-family: brandon-grotesque, sans-serif;
        font-style: normal;
        font-weight: 900;
        text-transform: uppercase;
        color: #f2f2f2;
    }

    a.twitter-timeline {
        /* Buttonish */
        display: inline-block;
        padding: 6px 12px 6px 30px;
        margin: 10px 0;
        border: #ccc solid 1px;
        border-radius: 3px;
        background: #f8f8f8 url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNy4xLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgNzIgNzIiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDcyIDcyIiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxyZWN0IHg9IjAiIGZpbGw9Im5vbmUiIHdpZHRoPSI3MiIgaGVpZ2h0PSI3MiIvPg0KPHBhdGggZmlsbD0iIzU1YWNlZSIgZD0iTTY4LjgxMiwxNS4xNDFjLTIuMzQ4LDEuMDM5LTQuODY5LDEuNzQzLTcuNTE5LDIuMDZjMi43MDMtMS42Miw0Ljc3OC00LjE4Nyw1Ljc1Ni03LjI0NGMtMi41MjksMS41LTUuMzMsMi41OTItOC4zMTMsMy4xNzYNCglDNTYuMzQ5LDEwLjU5MSw1Mi45NDgsOSw0OS4xODIsOWMtNy4yMjksMC0xMy4wOTIsNS44NjEtMTMuMDkyLDEzLjA5M2MwLDEuMDI2LDAuMTE4LDIuMDIxLDAuMzM4LDIuOTgxDQoJYy0xMC44ODUtMC41NDgtMjAuNTI4LTUuNzU3LTI2Ljk4Ny0xMy42NzljLTEuMTI2LDEuOTM2LTEuNzcxLDQuMTg0LTEuNzcxLDYuNTgxYzAsNC41NDIsMi4zMTIsOC41NTEsNS44MjQsMTAuODk4DQoJYy0yLjE0Ni0wLjA2OS00LjE2NS0wLjY1Ny01LjkzLTEuNjM4Yy0wLjAwMiwwLjA1NS0wLjAwMiwwLjExLTAuMDAyLDAuMTYyYzAsNi4zNDUsNC41MTMsMTEuNjM4LDEwLjUwNCwxMi44NA0KCWMtMS4xMDEsMC4yOTgtMi4yNTYsMC40NTctMy40NDksMC40NTdjLTAuODQ2LDAtMS42NjctMC4wNzgtMi40NjUtMC4yMzFjMS42NjcsNS4yLDYuNDk5LDguOTg2LDEyLjIzLDkuMDkNCgljLTQuNDgyLDMuNTEyLTEwLjEyOSw1LjYwNi0xNi4yNiw1LjYwNmMtMS4wNTUsMC0yLjA5Ni0wLjA2MS0zLjEyMi0wLjE4NGM1Ljc5NCwzLjcxNywxMi42NzYsNS44ODIsMjAuMDY3LDUuODgyDQoJYzI0LjA4MywwLDM3LjI1MS0xOS45NDksMzcuMjUxLTM3LjI0OWMwLTAuNTY2LTAuMDE0LTEuMTM0LTAuMDM5LTEuNjk0QzY0LjgzOCwyMC4wNjgsNjcuMDU4LDE3Ljc2NSw2OC44MTIsMTUuMTQxeiIvPg0KPC9zdmc+DQo=") 8px 8px no-repeat;
        background-size: 1em 1em;
        /* Text */
        font: normal 12px/18px Helvetica, Arial, sans-serif;
        color: #333;
        white-space: nowrap;
    }

        a.twitter-timeline:hover,
        a.twitter-timeline:focus {
            background-color: #dedede;
        }

        /* Color Highlight for keyboard navigation */

        a.twitter-timeline:focus {
            outline: none;
            border-color: #0089cb;
        }

    #empModal {
        margin-top: 10px;
        margin-bottom: 40px;
        color: #fff;
        text-align: center;
    }

    #employerJumpMenu {
        font-family: "museo-slab" !important;
        font-weight: 300 !important;
        font-size: 14px !important;
    }

    .modal-employers {
        z-index: 99999 !important;
    }

        .modal-employers.modal-dialog {
            color: #fff;
            min-width: 80%;
        }

        .modal-employers .modal-title {
            color: #fff;
        }

        .modal-employers .modal-body {
            color: #fff;
        }

        .modal-employers .close {
            color: #fff;
        }

    .emp-btn {
        color: #fff !important;
    }

    .stickyemployer {
        position: fixed;
        top: 240px;
        right: 0px;
        margin: 0;
        padding: 10px;
        /*padding:5px 3px;*/
        z-index: 2;
        /*background: rgba(215, 87, 30, 0.8);    */
        background: #e63e32;
        color: #fff;
        font-size: 14px;
        font-family: "brandon-grotesque";
        text-transform: uppercase;
        display: none !important;
    }

        .stickyemployer:visited {
            color: #Fff;
        }

        .stickyemployer:hover {
            color: #FCBA78;
        }

    /* new colour schemes */
    /* GREY THEME */
    .colour-dark-grey-bg {
        background-color: #8C8E91 !important;
    }

    .colour-medium-grey-bg {
        background-color: #D5C9CA !important;
    }

    .colour-light-grey-bg {
        background-color: #EBECEA !important;
    }

    .colour-dark-grey {
        color: #8C8E91 !important;
    }

    .colour-medium-grey {
        color: #D5C9CA !important;
    }

    .colour-light-grey {
        color: #EBECEA !important;
    }
    /* BLUE THEME */
    .colour-dark-blue-bg {
        background-color: #161F5D !important;
    }

    .colour-medium-blue-bg {
        background-color: #243E88 !important;
    }

    .colour-light-blue-bg {
        background-color: #85A0C5 !important;
    }

    .colour-dark-blue {
        color: #161F5D !important;
    }

    .colour-medium-blue {
        color: #243E88 !important;
    }

    .colour-light-blue {
        color: #85A0C5 !important;
    }
    /* RED THEME */
    .colour-dark-red-bg {
        background-color: #792151 !important;
    }

    .colour-medium-red-bg {
        background-color: #CE515A !important;
    }

    .colour-light-red-bg {
        background-color: #DB868C !important;
    }

    .colour-dark-red {
        color: #792151 !important;
    }

    .colour-medium-red {
        color: #CE515A !important;
    }

    .colour-light-red {
        color: #DB868C !important;
    }
    /* GREEN THEME */
    .colour-dark-green-bg {
        background-color: #0B615E !important;
    }

    .colour-medium-green-bg {
        background-color: #00AC8B !important;
    }

    .colour-light-green-bg {
        background-color: #9BD090 !important;
    }

    .colour-dark-green {
        color: #0B615E !important;
    }

    .colour-medium-green {
        color: #00AC8B !important;
    }

    .colour-light-green {
        color: #9BD090 !important;
    }
    /* TURQUOISE THEME */
    .colour-dark-turquoise-bg {
        background-color: #0C5E72 !important;
    }

    .colour-medium-turquoise-bg {
        background-color: #008FA7 !important;
    }

    .colour-light-turquoise-bg {
        background-color: #3DC0B8 !important;
    }

    .colour-dark-turquoise {
        color: #0C5E72 !important;
    }

    .colour-medium-turquoise {
        color: #008FA7 !important;
    }

    .colour-light-turquoise {
        color: #3DC0B8 !important;
    }

    /* ORANGE THEME */
    .colour-dark-orange-bg {
        background-color: #D7571E !important;
    }

    .colour-medium-orange-bg {
        background-color: #F58049 !important;
    }

    .colour-light-orange-bg {
        background-color: #FCBA78 !important;
    }

    .colour-dark-orange {
        color: #D7571E !important;
    }

    .colour-medium-orange {
        color: #F58049 !important;
    }

    .colour-light-orange {
        color: #FCBA78 !important;
    }
    /* MUSTARD THEME */
    .colour-dark-mustard-bg {
        background-color: #DEA33B !important;
    }

    .colour-medium-mustard-bg {
        background-color: #F2D14B !important;
    }

    .colour-light-mustard-bg {
        background-color: #F5E193 !important;
    }

    .colour-dark-mustard {
        color: #DEA33B !important;
    }

    .colour-medium-mustard {
        color: #F2D14B !important;
    }

    .colour-light-mustard {
        color: #F5E193 !important;
    }

    .jumpmenu {
        margin-top: 50px;
    }

    .embed-responsive.embed-responsive-16by9 {
        height: 100% !important;
    }

    .embed-responsive {
        position: relative;
        display: block;
        height: 0;
        padding: 0;
        overflow: hidden;
    }

        .embed-responsive .embed-responsive-item, .embed-responsive iframe, .embed-responsive embed, .embed-responsive object {
            position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            width: 100%;
            height: 100%;
            border: 0;
        }


    /*
.slidemenu ul.navbar-nav li:nth-of-type(8) { 
    transition: 0.5s;
    background: linear-gradient(145deg, #45AC35, #28347F, #E63625, #F9B329);
    background-size: 800% 800%;
    -webkit-animation: background 26s ease infinite;
    animation: background 26s ease infinite;
}
*/
