/* Minification failed. Returning unminified contents.
(2592,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(2593,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(2594,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(2595,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(2596,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(2597,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(2598,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(2599,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(2600,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(2601,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(2602,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(2603,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(2604,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(2605,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(2606,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(2607,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(2608,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(2609,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(2610,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(2611,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
 */
/* #region Containers and Master Page controls */

.content {
    height: 150px;
    padding-top: 75px;
    text-align: center;
    background-color: #f9f9f9;
    font-size: 48px;
}

#container, #container_cs {
    background-color: White;
    margin: 0 auto;
    padding-top: 30px;
}

    #container:after {
        content: " ";
        display: block;
        clear: both;
    }

    #container_cs:after {
        content: " ";
        display: block;
        clear: both;
    }

/*Extra small, Small and Medium devices (tablets, 991.98px and below)*/
@media (max-width: 991.98px) {
    #container {
        width: 100%;
    }
}

/*Large devices (desktops, 992px and up)
    Customised from bootstraps breakpoint
*/
@media (min-width: 992px) and (max-width: 1449.98px) {
    #container {
        width: 80%;
    }
}

/*Extra large devices (large desktops, 1450px and up)
    Customised from bootstraps breakpoint
*/
@media (min-width: 1450px) {
    #container {
        width: 65%;
    }
}

/*Extra small, Small and Medium devices (tablets, 991.98px and below)*/
@media (max-width: 991.98px) {
    .container-headerFooter {
        width: 100%;
        max-width: 100%;
    }
}

/*Large devices (desktops, 992px and up)
    Customised from bootstraps breakpoint
*/
@media (min-width: 992px) and (max-width: 1449.98px) {
    .container-headerFooter {
        width: 80%;
        max-width: 80%;
    }
}

/*Extra large devices (large desktops, 1450px and up)
    Customised from bootstraps breakpoint
*/
@media (min-width: 1450px) {
    .container-headerFooter {
        width: 65%;
        max-width: 65%;
    }
}

#container_cs {
    width: 100%;
    padding-left: 15px;
    padding-right: 15px;
}

#content, #content_nosidebar, #content_cs {
    float: left;
    padding: 0 15px 50px 15px;
}

#content_nosidebar {
    width: 100%;
}

#content {
    width: 80%;
}

#content_cs {
    max-width: 100%;
}

#sidebar {
    float: left;
    width: 20%;
    padding: 10px;
    padding-left: 40px;
}

    #footer {
        clear: both;
        padding: 10px;
        font-size: 12px;
        color: #fff;
        text-align: center;
        background-color: #3C4D63;
        min-height: 200px;
    }

@media (min-width: 960px) {
    .footerContainer {
        bottom: 0;
        width: 100%;
        /* Set the fixed height of the footer here */
        margin-top: 50px;
    }
}

@media (max-width: 959px) {
    .footerContainer {
        bottom: 0;
        width: 100%;
        /* Set the fixed height of the footer here */
        margin-top: 50px;
    }
}

#offlineNav {
    background-color: #c70000;
    color: #fff;
}

    #offlineNav > p {
        text-align: center;
        width: 100%;
        font-weight: 600;
        margin-top: 5px;
        margin-bottom: 5px;
    }

/*#footer a {
    color: #fff;
}*/

.FloatContainer {
    display: block;
    padding-bottom: 10px;
}

    .FloatContainer:after {
        content: ".";
        display: block;
        height: 0;
        clear: both;
        visibility: hidden;
    }

.FloatLeft {
    width: 25%;
    float: left;
    text-align: right;
}

.FloatLeftAlignLeft {
    width: 25%;
    float: left;
}

.FloatRight {
    width: 74%;
    float: right;
    text-align: left;
}

.FloatRightFull {
    float: right;
    text-align: left;
}

.ModalDialogBackground {
    background-color: Gray;
    filter: alpha(opacity=70);
    opacity: .7;
}

.ModalDialog {
    background-color: White;
    opacity: 1;
}

.Left {
    float: left;
    margin: 0 .5em .5em 0;
}

.Right {
    float: right;
    margin: 0 0 .5em .5em;
}

.FullWidth {
    width: 100% !important;
}

.TableLayoutFixed {
    table-layout: fixed;
}


.FixDevExpressValidationControlPosition {
    /* DevExpress controls add a small bit of padding to the left of the control when you enable validation. 
        This messes up the alignment with non validated controls. Wrap the control in an empty div with this class to fix it. */
    margin-left: -3px;
}

/* #endregion */
/*#region Heading Styles */
h1, h2, h3, h4, h5, h6 {
    color: #000
}
/*#endregion */
/*#region Signpost Styles */
.signpostCard {
    background-color: #e2e2e2;
}

.signpostImg-wrapper {
    position: relative;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
    overflow: hidden;
}

.signpostImg {
    transition-duration: 1500ms;
    min-height: 250px;
    -webkit-background-size: cover;
    background-size: cover;
    background-position: 50%;
    z-index: 1;
}

.signpostHover:hover .signpostImg {
    transition-duration: 1500ms;
    -ms-transform: scale(1.25);
    -webkit-transform: scale(1.25);
    transform: scale(1.25);
}

.signpostHover:hover .signpostOverlay {
    background-color: rgba(0,0,0,.3);
    background-blend-mode: overlay;
    -webkit-transition: all .4s;
    -o-transition: all .4s;
    transition: all .4s;
    transition-duration: 1500ms;
}
/*#endregion */

/* #region Search */

.searchTextBox {
    height: 50px !important;
    color: #fff;
    background-color: #3C4D63;
    border: 0;
}

    .searchTextBox > tr > td > input {
        font-size: 20px !important; /* Dev express requires this to resize font size in TextBox due to complex structure of control */
        height: 47px !important; /* makes chrome happy with the search bar */
    }

.searchCombo {
    color: #999;
}

.SearchControlContainer {
    display: table-cell;
    vertical-align: middle;
    padding-left: 5%;
    padding-right: 5%;
    float: left;
    width: 100%;
}

@media (max-width: 1049px) {
    .SearchControlContainer {
        padding-top: 50px;
    }
}

.searchBtn {
    border: 0;
    background-color: #2D3A4A;
    color: #fff;
    font-size: 20px !important;
}

.searchBarReveal {
    background-color: #000;
    color: #fff;
    float: left;
    border: 0;
}

.SEResultItem {
}

    .SEResultItem > table {
        margin: 0 auto;
        width: 100%;
    }

.searchFooterNumbers > a {
    padding-right: 10px;
}

#searchPaginationDiv a {
    padding-left: 10px;
    padding-right: 10px;
}

/* #endregion */

/* #region Logo */
.visible-sm-logo,
.visible-lg-logo {
    display: none !important;
}

@media (max-width: 1459px) {
    .visible-sm-logo {
        display: block !important;
    }

    .visible-lg-logo {
        display: none !important;
    }
}

@media (min-width: 1460px) {
    .visible-lg-logo {
        display: block !important;
    }

    .visible-sm-logo {
        display: none !important;
    }
}

/* #endregion */

/* #region Home Page Guest Welcome Div */

#GuestWelcomeDIV > div {
    text-align: center;
}

/* #endregion */

/* #region Key Dates Calendar Control */

.CalItem {
    text-decoration: none;
    color: #3E3F3A;
    font-weight: normal !important;
}

    .CalItem:hover > div {
        background-color: #EDF0F2;
        -webkit-transition: -webkit-transform 0.35s;
        -moz-transition: transform 0.35s;
        -o-transition: transform 0.35s;
        transition: transform 0.35s;
        -moz-transform: translate(0,0);
        -ms-transform: translate(0,0);
        -o-transform: translate(0,0);
        -webkit-transform: translate(0,0);
        transform: translate(0,0);
    }

    .CalItem::after {
        content: ' ';
    }

.CalContainer {
    min-height: 85px;
    width: 100%;
    margin-bottom: 10px;
    -webkit-transition: -webkit-transform 0.35s;
    -moz-transition: transform 0.35s;
    -o-transition: transform 0.35s;
    transition: transform 0.35s;
    -moz-transform: translate(-10px,0);
    -ms-transform: translate(-10px,0);
    -o-transform: translate(-10px,0);
    -webkit-transform: translate(-10px,0);
    transform: translate(-10px,0);
    max-height: 300px;
    border-right: 2px solid #000;
    overflow: auto;
    clear: both;
}

.CalDateContainer {
    float: left;
    width: 20%;
    height: 85px;
    background-color: #000;
    color: #fff;
    font-size: 30px;
    font-weight: 300;
    display: table;
}

    .CalDateContainer > div {
        margin-left: auto;
        margin-right: auto;
        text-align: center;
        display: table-cell;
        vertical-align: middle;
    }

        .CalDateContainer > div > span {
            font-size: 15px;
        }

.CalInfoContainer {
    float: left;
    width: 80%;
    padding-left: 10px;
    overflow: auto;
    padding-right: 5px;
}

    .CalInfoContainer > p {
        margin-bottom: 0;
    }

/* #endregion */

/* #region Quotes */

.quoteDiv {
    width: 100%;
    min-height: 50px;
    background-color: #2D3A4A;
    color: #ddd;
}

    .quoteDiv p {
        text-align: center;
        font-size: 25px;
        font-weight: 300;
        margin: 0;
        padding-left: 10px;
        padding-right: 10px;
    }

    .quoteDiv > p > span {
        font-size: 20px;
    }

@media (max-width: 959px) {
    .quoteDiv p {
        font-size: 20px;
    }

    .quoteDiv > p > span {
        font-size: 15px;
    }
}

/* #endregion */

/* #region Twitter */

#TwitterContainer > ul {
    list-style-type: none;
    padding-left: 0;
}

#TwitterContainer {
    margin-bottom: 70px;
}

    #TwitterContainer > ul > li {
        width: 95%;
        margin: 0 auto;
        float: none;
        padding-bottom: 20px;
    }

        #TwitterContainer > ul > li > a {
            text-decoration: none;
        }

        #TwitterContainer > ul > li .user {
            display: none;
        }

        #TwitterContainer > ul > li .tweet {
            margin: 0;
            padding: 10px 20px;
            color: #222;
            font-size: 20px;
            margin-bottom: 20px;
        }


            #TwitterContainer > ul > li .tweet > a[data-scribe="element:hashtag"] {
                color: #2d3A4a;
            }

            #TwitterContainer > ul > li .tweet > img[aria-label^="Emoji"] {
                max-height: 14px;
            }

        #TwitterContainer > ul > li .timePosted {
            margin: 0;
            padding: 0 20px;
            font-size: 14px;
            text-align: left;
            color: #999;
            float: left;
            width: 50%;
            margin-top: 6px;
        }

            #TwitterContainer > ul > li .timePosted::before {
                font-family: 'Fontawesome';
                content: '\f017';
                padding-right: 2px;
            }

        #TwitterContainer > ul > li .interact {
            margin: 0;
            padding: 0 20px;
            font-size: 12px;
            text-align: right;
            color: #999;
            float: left;
            width: 50%;
        }

            #TwitterContainer > ul > li .interact > a {
                color: #000;
            }

                #TwitterContainer > ul > li .interact > a:hover {
                    text-decoration: none;
                    color: #2d3a4a;
                }

            #TwitterContainer > ul > li .interact .twitter_reply_icon {
                font-size: 0px;
            }



                #TwitterContainer > ul > li .interact .twitter_reply_icon:before {
                    content: '\f112';
                    font-size: 22px;
                    font-family: 'Fontawesome';
                    padding-right: 10px;
                }

            #TwitterContainer > ul > li .interact .twitter_fav_icon {
                font-size: 0px;
            }

                #TwitterContainer > ul > li .interact .twitter_fav_icon:before {
                    content: '\f005';
                    font-size: 22px;
                    font-family: 'Fontawesome';
                }

            #TwitterContainer > ul > li .interact .twitter_retweet_icon {
                font-size: 0px;
            }

                #TwitterContainer > ul > li .interact .twitter_retweet_icon:before {
                    content: '\f079';
                    font-size: 22px;
                    font-family: 'Fontawesome';
                    padding-right: 10px;
                }

/* #endregion */

/* #region jQuery Backtop Plugin*/

#backTop {
    width: 85px;
    height: 45px;
    padding: 0px;
    padding-bottom: 10px;
    border-radius: 4px;
    color: #fff;
    cursor: pointer;
    z-index: 999;
    display: none;
    box-sizing: content-box;
    -webkit-box-sizing: content-box;
    text-align: center;
}

    #backTop.red {
        background: rgba(217,97,81,0.9);
        border: 1px solid #fff;
        border-bottom: 0;
        border-bottom-left-radius: 0;
        border-bottom-right-radius: 0;
    }

/* #endregion */

/* #region Spinner */
.spinner {
    font-size: 100px;
    width: 100px;
    height: 100px;
    position: relative;
    margin: 0px auto;
    border-radius: 50%;
    border: .01em solid rgba(150,150,150,0.1);
    list-style: none;
    padding: 0;
}

    .spinner li {
        position: absolute;
        width: .2em;
        height: .2em;
        border-radius: 50%;
    }

        .spinner li:nth-child(1) {
            left: 50%;
            top: 0;
            margin: 0 0 0 -.1em;
            background: #000;
            -webkit-transform-origin: 50% 250%;
            transform-origin: 50% 250%;
            -webkit-animation: rota 1.13s linear infinite, opa 3.67s ease-in-out infinite alternate;
            animation: rota 1.13s linear infinite, opa 3.67s ease-in-out infinite alternate;
        }

        .spinner li:nth-child(2) {
            top: 50%;
            right: 0;
            margin: -.1em 0 0 0;
            background: #AAC1DB;
            -webkit-transform-origin: -150% 50%;
            transform-origin: -150% 50%;
            -webkit-animation: rota 1.86s linear infinite, opa 4.29s ease-in-out infinite alternate;
            animation: rota 1.86s linear infinite, opa 4.29s ease-in-out infinite alternate;
        }

        .spinner li:nth-child(3) {
            left: 50%;
            bottom: 0;
            margin: 0 0 0 -.1em;
            background: #A53D22;
            -webkit-transform-origin: 50% -150%;
            transform-origin: 50% -150%;
            -webkit-animation: rota 1.45s linear infinite, opa 5.12s ease-in-out infinite alternate;
            animation: rota 1.45s linear infinite, opa 5.12s ease-in-out infinite alternate;
        }

        .spinner li:nth-child(4) {
            top: 50%;
            left: 0;
            margin: -.1em 0 0 0;
            background: #AAC1DB;
            -webkit-transform-origin: 250% 50%;
            transform-origin: 250% 50%;
            -webkit-animation: rota 1.72s linear infinite, opa 5.25s ease-in-out infinite alternate;
            animation: rota 1.72s linear infinite, opa 5.25s ease-in-out infinite alternate;
        }

@-webkit-keyframes rota {
    from {
    }

    to {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes rota {
    from {
    }

    to {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@-webkit-keyframes opa {
    0% {
    }

    12.0% {
        opacity: 0.80;
    }

    19.5% {
        opacity: 0.88;
    }

    37.2% {
        opacity: 0.64;
    }

    40.5% {
        opacity: 0.52;
    }

    52.7% {
        opacity: 0.69;
    }

    60.2% {
        opacity: 0.60;
    }

    66.6% {
        opacity: 0.52;
    }

    70.0% {
        opacity: 0.63;
    }

    79.9% {
        opacity: 0.60;
    }

    84.2% {
        opacity: 0.75;
    }

    91.0% {
        opacity: 0.87;
    }
}

@keyframes opa {
    0% {
    }

    12.0% {
        opacity: 0.80;
    }

    19.5% {
        opacity: 0.88;
    }

    37.2% {
        opacity: 0.64;
    }

    40.5% {
        opacity: 0.52;
    }

    52.7% {
        opacity: 0.69;
    }

    60.2% {
        opacity: 0.60;
    }

    66.6% {
        opacity: 0.52;
    }

    70.0% {
        opacity: 0.63;
    }

    79.9% {
        opacity: 0.60;
    }

    84.2% {
        opacity: 0.75;
    }

    91.0% {
        opacity: 0.87;
    }
}

/* #endregion */

/* #region Test Site Overlay */

.overlay {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 9999;
    pointer-events: none;
    transform: rotate(30deg)
}

.overlayText {
    font-size: 350px;
    text-align: center;
    color: darkred;
    opacity: 0.2;
    margin-top: 220px;
}

/* #endregion */

/* #region iOS Install Prompt */

/**
 * PWA Install Prompt 1.0.2
 * Prompt users to add your PWA to their home screen, since Apple won’t.
 * https://github.com/JacobDB/pwa-install-prompt/
 *
 * Copyright 2018 Jacob Bearce
 *
 * Released under the MIT License
 *
 * Released on: November 6, 2018
 */

.pwa-install-prompt__container {
    align-items: center;
    box-sizing: border-box;
    display: flex;
    height: 100%;
    justify-content: center;
    left: -999em;
    padding: 30px;
    position: fixed;
    top: -999em;
    transition: left 0s 0.15s, top 0s 0.15s, visibility 0s 0.15s;
    visibility: hidden;
    width: 100%;
    z-index: 100000;
}

    .pwa-install-prompt__container.is-active {
        left: 0;
        top: 0;
        transition: none;
        visibility: visible;
    }

.pwa-install-prompt__overlay {
    background: rgba(0,0,0,0.5);
    border: 0;
    height: 100%;
    left: 0;
    opacity: 0;
    position: absolute;
    text-indent: -999em;
    top: 0;
    transition: opacity 0.15s;
    width: 100%;
    z-index: 0;
}

.pwa-install-prompt__container.is-active .pwa-install-prompt__overlay {
    opacity: 1;
}

.pwa-install-prompt {
    background: #FFF;
    border-radius: 2px;
    box-shadow: 0px 4px 8px rgba(0,0,0,0.125);
    box-sizing: border-box;
    color: #424242;
    font-family: sans-serif;
    max-width: 320px;
    opacity: 0;
    position: relative;
    text-align: center;
    transform: translateY(25%);
    transition: opacity 0.15s, transform 0.15s ease-in-out;
    z-index: 1;
}

.pwa-install-prompt__container.is-active .pwa-install-prompt {
    opacity: 1;
    transform: translateY(0%);
}

.pwa-install-prompt::before {
    background: url("data:image/svg+xml,%3Csvg viewBox='0 0 128 128' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23FFFFFF' d='M64.197,50.47C79.696,34.95 95.259,19.502 110.597,3.824C114.411,0.182 114.565,1.022 117.707,1.24C124.299,2.167 127.723,10.687 123.435,16.078C108.453,32.47 92.997,48.399 77.387,64.174C92.571,80.01 107.685,95.917 123.024,111.595C129.195,118.349 120.432,132.527 111.035,124.716C94.992,109.403 79.408,93.611 63.979,77.65C48.485,93.169 32.917,108.618 17.584,124.296C10.837,130.734 -2.411,121.031 4.747,112.042C19.728,95.65 35.179,79.716 50.795,63.945C35.605,48.11 20.491,32.198 5.157,16.525C0.085,10.976 2.912,0.586 12.267,1.24C14.069,1.491 15.723,2.227 17.141,3.404C33.184,18.717 48.768,34.509 64.197,50.47Z' /%3E%3C/svg%3E%0A") center center no-repeat;
    border: 0;
    bottom: 100%;
    content: "";
    display: block;
    height: 16px;
    margin: 0 0 16px;
    pointer-events: none;
    position: absolute;
    right: 0;
    width: 16px;
}

.pwa-install-prompt__icon__container {
    background: url("data:image/svg+xml,%3Csvg viewBox='0 0 70 70' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23F0F0F0' d='M65,17C65,10.377 59.623,5 53,5L17,5C10.377,5 5,10.377 5,17L5,53C5,59.623 10.377,65 17,65L53,65C59.623,65 65,59.623 65,53L65,17Z' /%3E%3C/svg%3E%0A") center center / 70px 70px repeat-x;
    margin: 40px 0 0;
}

.pwa-install-prompt__icon {
    border-radius: 12px;
    display: block;
    margin: 0 auto;
    width: 60px;
}

.pwa-install-prompt__content {
    padding: 10px 35px;
}

.pwa-install-prompt__title {
    font-size: 24px;
    margin: 0 0 20px;
}

.pwa-install-prompt__text {
    font-size: 16px;
    line-height: 20px;
    margin: 0 0 46px;
}

.pwa-install-prompt__guide {
    align-items: center;
    display: flex;
    font-size: 12px;
    justify-content: center;
    margin: 0;
}

.pwa-install-prompt__guide__icon {
    margin: 0 2px 6px;
    width: 20px;
}

/* #endregion */

/* Bootstrap GridView Column */

.TextWrap {
    word-wrap: break-word !important;
    white-space: normal !important;
}

/* endregion */

footer a {
        color: rgba(232, 228, 228, 0.6);
        font-weight: normal !important;
    }

        footer a:hover {
            color: #fff;
        }

.footer-bottom {
    padding: 20px 10px 20px 10px;
    color: #fff;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.footer-top {
    padding: 30px 15px 40px 15px;
}

.heading-title {
    font-size: 0.8125rem;
    padding: 0 0 30px 0;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 5px;
    margin: 0;
}

.heading-title-second {
    font-size: 30px;
    padding: 0 0 0 0;
    font-weight: 800;
    letter-spacing: 1px;
}

.footer-middle {
    padding-top: 2em;
    padding: 0 10px 30px 10px;
}

.footerNavLinks {
    flex: 50%;
    max-width: 50%;
}

.mainfooterButton {
    font-size: 13px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 1px;
    fill: #000000;
    color: #000000;
    background-color: #fff;
    border-radius: 0px 0px 0px 0px;
    padding: 15px 35px 15px 35px;
    float: right;
    display: block;
    width: 100%;
}

.footerCopyrightText {
    font-size: 11px;
    font-weight: 300;
    line-height: 1.5em;
    text-align: center;
}

    .footerCopyrightText br {
        display: none;
    }

.linkListHeading {
    font-size: 18px;
    font-weight: 900;
    padding: 0;
    margin: 0;
    line-height: 1;
    margin-bottom: 20px;
}

.pageLinks {
    font-size: 1rem;
    font-weight: 300;
    list-style-type: none;
    padding-left: 0px;
}

.navLinks {
    padding-bottom: 6px;
}

.arrow-list-icon {
    padding-right: 4px;
    list-style-type: none;
    color: rgba(232, 228, 228, 0.6);
}

.footer-custom-icon {
    margin-top: -8px;
    list-style-type: none;
}

.social-icons li {
    display: block;
    float: left;
}

.social-icon {
    color: #fff;
    margin: 1rem;
}

.social-icons ul {
    float: right;
    width: 100%;
}

.ecpr-social-footer-icon {
    color: #ffffff;
    width: 50px;
}

.buttonDisplay {
    margin-top: 0px;
}

/*Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) and (max-width: 991.98px) {
    .footer-top {
        padding: 50px 20px 50px 20px;
    }

    .footer-middle {
        padding: 25px 25px 15px 25px;
    }

    .footer-bottom {
        padding: 25px 20px 25px 20px;
    }

    .footerNavLinks {
        flex: 25%;
        max-width: 100%;
    }

    .footerCopyrightText {
        text-align: left;
    }

        .footerCopyrightText br {
            display: none;
        }

    .titleDisplay {
        flex: 0 0 50%;
        max-width: 50%;
    }

    .social-icons-display ul {
        float: right;
        width: 130%;
    }

    .heading-title-second {
        font-size: 30px;
    }

    .mainfooterButton {
        position: absolute;
        right: 0;
        bottom: 0;
    }

    .buttonDisplay {
        margin-left: 50px;
    }
}

/*Large devices (desktops, 992px and up)*/
@media (min-width: 992px) {
    .footer-top {
        padding: 50px 0px 50px 0px;
    }

    .footer-middle {
        padding: 25px 0px 70px 0px;
    }

    .footer-bottom {
        padding: 2em;
    }

    .footerCopyrightText {
        text-align: left;
    }

        .footerCopyrightText br {
            display: block;
        }

    .heading-title-second {
        padding: 0px;
        font-size: 2.5rem;
    }

    .mainfooterButton {
        width: auto;
    }

    .footerNavLinks {
        flex: 25%;
        max-width: 100%;
    }

    .social-icons-display {
        max-width: 100%;
    }

        .social-icons-display ul {
            float: right;
        }

    .buttonDisplay {
        margin-top: 30px;
    }
}
/* #region Shared Header Styles*/

.megamenu {
    position: static;
}

.megamenu .dropdown-menu {
    background: none;
    border: none;
    width: 100%;
}

.megamenu-link {
    color: #000 !important;
}

.header-social-icons {
    position: absolute;
    right: 17.5%;
    padding-right: 7px;
}

.header-social-icons ul {
    margin-top: -4px;
}

.header-social-icons a:hover {
    color: transparent;
}

.header-social-icons li {
    list-style-type: none;
    display: inline-block;
}

.fa-stack.medium {
    font-size: 1.3em;
}

.icon-color {
    color: #000;
    fill: #000;
}

.square-social-icon {
    opacity: 0;
    background: linear-gradient(to bottom, black 50%, transparent 50%);
    background-size: 100% 200%;
    background-position: 0 100%;
    transition: background-position 0.4s ease-in-out; /** I've changed the time for demo purposes **/
}

.ecpr-social-icons:hover > .square-social-icon {
    color: transparent;
    opacity: 1;
    background-position: 0 0;
}

.ecpr-social-icons:hover > .icon-color {
    color: #fff;
    fill: #fff;
    transition: 0.5s;
}

.ecpr-social-icons:hover picture > .custom-icon-black {
    animation-name: fade;
    animation-timing-function: ease-in-out;
    animation-duration: 0.4s;
    animation-fill-mode: forwards;
}

@keyframes fade {
    0% {
        opacity: 1;
    }

    25% {
        opacity: 1;
    }

    75% {
        opacity: 0;
    }

    100% {
        opacity: 0;
    }
}

.custom-icons {
    width: 45%;
    position: absolute;
    top: 20%;
    left: 26.5%;
}

/* #endregion*/

/* #region Desktop Header Styles*/

.dropdown-menu-content {
    background-color: #ffffff;
    float: right;
    width: 100%;
    padding: 32px;
}

.dropdown-menu-content h2 {
    font-size: 14px;
    font-weight: 900;
    margin-bottom: 20px;
}

.dropdown-menu-content p {
    font-size: 13px;
}

.dropdown-container {
    width: 874px;
}

.dropdown-menu hr {
    width: 100%;
}

.dropdown-menu li {
    list-style-type: none;
}

.desktop-nav-link:hover {
    color: #a9a9a9 !important;
    background: none !important;
    cursor: pointer;
}

#desktop-header {
    background-color: #e2e2e2;
}

#desktop-header-logo {
    height: 148px;
}

.desktop-megamenu-link {
    display: block;
    font-size: 13px;
}

@media (max-width: 991.98px) {
    .header-social-icons {
        display: none;
    }
}

/* Hide social media icons on screens below full hd.
    1800px used as this allows for non maximised screens and scroll bars.
    Using default bootstrap break points or anything much smaller than 
    1800 leads to weird display issues.
*/
/*@media (max-width: 1230px) {
    .header-social-icons {
        display: none;
    }
}*/

@media (min-width: 992px) and (max-width: 1449.98px) {
    .header-social-icons {
        right: 10%;
    }
}

/* #endregion*/

/* #region Mobile Header Styles*/

/* Lowers the font size for the mobile nav-links only.
The default size looks too big in relation to the rest of the mobile menu
but much smaller and it starts to feel to small to be finger/thumb friendly
*/
#MobileMenu .nav-link {
    font-size: 0.9rem;
}

#mobile-header-logo {
    height: 100%;
    width: 100%;
    margin: 0;
}

#MobileMenu li {
    list-style-type: none;
}

/* #endregion*/
/*#region More News Items */

/*Styles for news item images with links*/
.newsTextStyle {
    color: #fff;
    text-decoration: none;
    display: block;
    font-size: 20px;
    text-align: center;
    padding: 5px 5px;
    margin: 0;
    font-weight: 300;
    background-color: rgba(0, 0, 0, .5);
    width: 100%;
}

.newsImgContainer {
    display: table;
    overflow: hidden;
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
    transition: 1s;
    position: relative;
}

    .newsImgContainer:hover {
        background-color: #313030;
        text-decoration: none;
        -webkit-filter: none !important;
        filter: grayscale(0) !important;
    }

.news-card-img-overlay {
    -webkit-transition: opacity 0.55s ease-in-out, -webkit-transform 0.35s;
    transition: opacity 0.55s ease-in-out, transform 0.35s;
}

    .news-card-img-overlay:hover {
        -webkit-transform: translate3d(0,-100px,0);
        transform: translate3d(0,-100px,0);
    }
/*#endregion */
/* Code specific to the Discover page */

/* #region Discover Page */
.discoverProfilePictureContainer {
    Height: 100px;
    Width: 100px;
    margin-top: -50px;
    text-align: center;
}

    .discoverProfilePictureContainer img {
        height: 100%;
        display: block;
        margin-left: auto;
        border: 5px solid white;
        border-radius: 50%;
    }

.discoverProfileCard {
    transition: 0.2s;
}

.discoverProfileCard:hover {
    cursor: pointer;
    opacity: 0.6;
}

.discoverProfileCard button {
    width: 100%;
    padding: 15px 0 10px 0 !important;
}

#BackToDiscover {
    transition: 0.2s;
}

#BackToDiscover:hover {
    cursor: pointer;
    color: #000 !important;
    background-color: #fff;
}

.discoverProfileBanner {
    width: 100%;
    height: 125px;
}

.discoverProfileCard p {
    text-align: center;
    font-family: "Muli","Segoe UI",Helvetica,"Droid Sans",Tahoma,Geneva,sans-serif;
    color: #707070;
}

.discoverName {
    font-weight: 900;
}

.discoverTextNoWrap {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

    .discoverTextNoWrap:after {
        content: "";
        display: inline-block;
        width: 0px;
    }

#CardView_DXSE_I {
    padding: .5rem 1rem;
    font-size: .9375rem;
    font-weight: 400;
    line-height: 1.5;
}

/*#endregion */

/* #region profilePage*/

.detailsPartialBackButton {
    font-size: 20px;
    z-index: 10;
    background-color: black;
    border: 1px solid grey;
    border-radius: revert;
}

.divFlexContainer {
    display: flex;
    justify-content: flex-end;
}

/*#endregion*/

.squareBulletPoints {
    list-style-type: square;
}

.tickBulletPoints {
    list-style-type: '\2713';
}

.ecpr-blockquote {
    border-left: 5px solid #000;
    padding-left: 10px;
    font-style: italic;
}

.external-link::after {
    content: "\f35d";
    font-family: "Font Awesome 6 Sharp";
    font-weight: 900;
    margin-left: 0.3em;
    font-style: normal;
    display: inline-block;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
}

/*#region Ecpr Content boxes*/
.ecprContentBox {
    position: relative;
    padding: 1.25rem 1.5rem;
    margin-bottom: 1rem;
}

.ecprContentBox p:last-child {
    margin-bottom: 0;
}

.ecprContentBox-primary {
    color: #000;
    background-color: #e2e2e2;
    border-color: #ccc;
}

.ecprContentBox-info {
    color: #0c5460;
    background-color: #d1ecf1;
    border-color: #bee5eb;
}

.ecprContentBox-success {
    color: #155724;
    background-color: #d4edda;
    border-color: #c3e6cb;
}

.ecprContentBox-warning {
    color: #856404;
    background-color: #fff3cd;
    border-color: #ffeeba;
}

.ecprContentBox-danger {
    color: #721c24;
    background-color: #f8d7da;
    border-color: #f5c6cb;
}
/*#endregion*/

/* Diagonal ribbon for cards and banner images */

.diagonal-ribbon {
    position: absolute;
    top: 18px;
    padding: 5px 20px;
    width: 150px;
    z-index: 100;
    font-size: 12px;
    transform: rotate(45deg);
    box-shadow: 0 2px 5px rgba(0,0,0,0.2);
}

.diagonal-ribbon-card {
    right: -45px;
}

.diagonal-ribbon-banner {
    right: -28px;
}

/*#endregion*/

/* Mostly used on the devexpress save button*/
.saveButton-float-right {
    float: right;
}

/*#region Ecpr MyProfile Sidebar*/
.container-fluid {
    padding-left: 3px;
}

/*#container, #container_cs {
    padding: 0;
}*/

#sidebarCollapse {
    display: none;
}

.navbar-default {
    border: none;
}

.activeLink {
    color: #000;
    background-color: #fff
}

.linkPointer {
    cursor: pointer;
}

a, a:hover, a:focus {
    /*color: inherit;*/
    text-decoration: none;
    transition: all 0.3s;
}

.line {
    width: 100%;
    height: 1px;
    border-bottom: 1px dashed #ddd;
    margin: 40px 0;
}

.wrapper {
    display: flex;
    align-items: stretch;
}

#sidebar {
    min-width: 148px;
    max-width: 148px;
    background: #000;
    color: #fff;
    transition: all 0.3s;
    padding: 0;
    text-align: center;
}

    #sidebar ul li a {
        padding: 20px 10px;
        text-align: center;
    }

        #sidebar ul li a i {
            margin-right: 0;
            display: block;
            font-size: 1.8rem;
            margin-bottom: 5px;
        }

    #sidebar ul ul a {
        padding: 10px !important;
    }

    #sidebar.active ul li a {
        padding: 20px 10px;
        text-align: center;
        font-size: 0.85rem;
    }

        #sidebar.active ul li a i {
            margin-right: 0;
            display: block;
            font-size: 1.8em;
            margin-bottom: 5px;
        }

    #sidebar.active ul ul a {
        padding: 10px !important;
    }

    #sidebar.active a[aria-expanded="false"]::before, #sidebar.active a[aria-expanded="true"]::before {
        top: auto;
        bottom: 5px;
        right: 50%;
        -webkit-transform: translateX(50%);
        -ms-transform: translateX(50%);
        transform: translateX(50%);
    }

    #sidebar ul li a {
        padding-top: 20px;
        padding-bottom: 5px;
        display: block;
    }

        #sidebar ul li a:hover {
            color: #000;
            background: #fff;
        }

    #sidebar ul li.dropdown > a[aria-expanded="true"] {
        color: #fff;
        background: #000;
    }

.myProfileDropdown {
    position: relative;
}

    .myProfileDropdown .myProfileSubmenu {
        position: absolute;
        left: 100%;
        top: 0;
        display: none;
    }

    .myProfileDropdown a[aria-expanded="true"] + .myProfileSubmenu {
        display: block;
        color: #fff;
        background: #000;
    }

a[data-toggle="collapse"] {
    position: relative;
}

.card-accordion > .show {
    cursor: default;
}

/* Specific styles for institution toggle link */
.institution-toggle[aria-expanded="false"]::before,
.institution-toggle[aria-expanded="true"]::before {
    content: '﹀';
    font-family: 'fontawesome';
    content: '\f078';
    display: block;
    position: absolute;
    right: 20px;
    font-size: 0.6em;
}

.institution-toggle[aria-expanded="true"]::before {
    content: '︿';
    content: '\f077';
}


#institutionSubmenu li a:hover {
    color: #e2e2e2 !important;
}

/*#endregion*/

/* ---------------------------------------------------
        CONTENT STYLE
    ----------------------------------------------------- */
#MyProfileContent {
    padding: 5px 15px 50px 2px;
    min-height: 100vh;
    transition: all 0.3s;
    width: 100%;
}

/*#region Ecpr Sidebar Media Queries*/
@media (max-width: 1023px) {
    .saveButton-float-right {
        float: none;
    }

    #sidebarCollapse {
        display: block;
    }

    #sidebar {
        text-align: center;
    }

    a[aria-expanded="false"]::before, a[aria-expanded="true"]::before {
        top: auto;
        bottom: 5px;
        right: 50%;
        -webkit-transform: translateX(50%);
        -ms-transform: translateX(50%);
        transform: translateX(50%);
    }

    #sidebar.active {
        margin-left: -15px !important;
    }

    #sidebar ul li a {
        padding: 20px 10px;
    }

        #sidebar ul li a span {
            font-size: 0.85em;
        }

        #sidebar ul li a i {
            margin-right: 0;
            display: block;
        }

    #sidebar ul ul a {
        padding: 10px !important;
    }

    #sidebar ul li a i {
        font-size: 1.3em;
    }

    #sidebar {
        margin-left: 0;
    }

    #sidebarCollapse span {
        display: none;
    }
}

@media (max-width: 320px) {
    .saveButton-float-right {
        float: none;
    }

    #sidebar {
        min-width: 107px;
        max-width: 107px;
        text-align: center;
        margin-left: -125px !important;
    }
}

@media (min-width:321px) and (max-width: 375px) {
    #sidebar {
        min-width: 125px;
        max-width: 135px;
        margin-left: -140px !important;
    }
}

@media (min-width:376px) and (max-width: 425px) {
    #sidebar {
        min-width: 142px;
        max-width: 142px;
        margin-left: -160px !important;
    }

        #sidebar.active ul li a {
            font-size: inherit;
        }
}

@media (min-width:426px) and (max-width: 768px) {
    #sidebar {
        min-width: 150px;
        max-width: 150px;
        margin-left: -165px !important;
    }

        #sidebar.active ul li a {
            font-size: inherit;
        }
}

#Institution_DropdownEdit_DDD_DDDC{
    padding: 0.5rem;
}

#InstitutionHistory_DropdownEdit_DDD_DDDC {
    padding: 0.5rem;
}

/*#endregion*/
/*#region Ecpr Image Upload Control*/
.dropZoneExternal > div,
.dropZoneExternal > img {
    position: absolute;
}

.dropZoneExternal {
    position: relative;
    border: 1px dashed #000 !important;
    cursor: pointer;
}

.dropZoneExternal,
.dragZoneText {
    width: 290px;
    height: 290px;
}
/*Image upload control*/
.dropZoneExternalBanner > div,
.dropZoneExternalBanner > img {
    position: absolute;
}

.dropZoneExternalBanner {
    position: relative;
    border: 1px dashed #000 !important;
    cursor: pointer;
}

.dropZoneExternalBanner,
.dragZoneTextBanner {
    width: 100%;
    height: 290px;
    min-width: 270px;
}

#dragZone {
    width: 100%;
    display: table;
}

#uploadedImage {
    width: 100%;
}

.dropZoneText {
    width: 300px;
    height: 150px;
    color: #fff;
    background-color: #888;
}

#dropZone {
    top: 0;
    padding: 100px 25px;
}

.uploadControlDropZone {
    display: none;
}

.dropZoneText,
.dragZoneText {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    font-size: 20pt;
}

.dragZoneText {
    color: #808080;
}

.dxucInlineDropZoneSys span {
    color: #fff !important;
    font-size: 10pt;
    font-weight: normal !important;
}

.validationMessage {
    padding: 0 20px;
    text-align: center;
}

.uploadContainer {
    width: 100%;
    min-width: 286px;
    max-width: 350px;
    margin-top: 10px;
}

.uploadContainerBanner {
    width: 100%;
    min-width: 286px;
    margin-top: 10px;
}

/*Changes color of the Upload Image control button*/
.dxucBrowseButton_ECPRDefault, .dxucBrowseButton_ECPRDefault a {
    color: #fff !important;
    background-color: #000 !important;
}

/*Small devices (landscape phones, less than 768px)
            Style for the banner to appear thinner on mobile devices
        */
@media (max-width: 767.98px) {
    .dropZoneExternal, .dragZoneText {
        width: 260px;
        height: 260px;
    }
}

/*#endregion*/

/*Bit of a hacky fix to stop profile image and banner
        overlapping on awkward screen sizes*/
@media (min-width:1200px) and (max-width: 1700px) {
    .manualColumnOffset {
        margin-left: 8.33333%;
        flex: 0 0 58.33333%;
        max-width: 58.33333%;
    }
}

/*Change style of Copy profile link font awsome icon*/
.copyLinkFAIcon {
    font-size: 1.8rem;
    margin-top: 40px;
    text-decoration: none !important;
}

/*Used on virtual platform to show different backgroudns for different devices*/

.objectFitContain {
    -webkit-object-fit: contain;
    object-fit: contain;
}

/*used to make interstitial display nicer */

@media only screen and (min-width: 572px) and (max-width: 1199px) {
    .modal-dialog {
        max-width: 85%;
    }
}

div[id^='AcademicProgramme_'] .dx-toolbar .dx-texteditor {
    width: 100% !important;
}

div[id^='AcademicProgramme_'] .dx-toolbar .dx-toolbar-after {
    padding-left: 0;
    width: 100% !important;
}

div[id^='AcademicProgramme_'] .dx-datagrid-search-panel {
    margin-left: 0;
}

div[id^='AcademicProgramme_'] .dx-datagrid-header-panel {
    padding: 0;
}

/* Shop styles */

.ShopCardBackgroundImage_Wrapper {
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
    overflow: hidden;
    position: absolute;
}

.ShopProductCardBackgroundImage_Wrapper {
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
    overflow: hidden;
    /*position: absolute;*/
}

.ShopCardTitle {
    min-height: 200px;
    text-align: center;
    position: relative;
    z-index: 1;
    overflow: hidden;
    align-content: center;
    letter-spacing: .5px;
    /*text-shadow: 2px 2px #000;*/
}

.ShopCardTitleSize {
    font-size: 1.4rem;
}

.signpostShopProductCard {
    background-color: #e2e2e2;
}

.signpostShopProductImg-wrapper {
    position: relative;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
    overflow: hidden;
}

.signpostShopProductImg {
    transition-duration: 1500ms;
    min-height: 250px;
    -webkit-background-size: contain;
    background-size: contain;
    background-position: 50%;
    background-repeat: no-repeat;
    z-index: 1;
}

.signpostShopProductHover:hover .signpostShopProductImg {
    transition-duration: 1500ms;
    -ms-transform: scale(1.25);
    -webkit-transform: scale(1.25);
    transform: scale(1.25);
}

.signpostShopProductHover:hover .signpostShopProductOverlay {
    background-color: rgba(0,0,0,.3);
    background-blend-mode: overlay;
    -webkit-transition: all .4s;
    -o-transition: all .4s;
    transition: all .4s;
    transition-duration: 1500ms;
}

.shopHomeButton {
    background-color: #000;
    color: #fff !important;
    -webkit-box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16), 0 2px 10px 0 rgba(0,0,0,0.12);
    box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16), 0 2px 10px 0 rgba(0,0,0,0.12);
}

    .shopHomeButton:hover {
        background-color: #e2e2e2;
        color: #000 !important;
    }

@media only screen and (max-width: 1729px) and (min-width: 992px) {
    .ShopCardTitleSize {
        font-size: 1.5rem;
    }
}

@media only screen and (max-width: 399px) {
    .ShopCardTitleSize {
        font-size: 1.3rem;
    }
}

@media only screen and (min-width: 992px) {
    .shopProductDivHeight {
        height: 140px;
    }

    .shopProductTitle {
        font-size: 2rem !important;
    }

    .shopProductDetailsImage {
        width: 100%;
    }
}

@media only screen and (min-width: 640px) and (max-width: 991px) {
    .shopProductDivHeight {
        height: 130px;
    }

    .shopProductTitle {
        font-size: 1.5rem !important;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .shopProductDetailsImage {
        width: 100%;
    }
}

@media only screen and (min-width: 641px) and (max-width: 767px) {
    .shopProductDetailsImage {
        width: 50%;
    }
}

@media only screen and (min-width: 451px) and (max-width: 640px) {
    .shopProductDivHeight {
        height: 200px;
    }

    .shopProductTitle {
        font-size: 2rem !important;
    }

    .shopProductDetailsImage {
        width: 60%;
    }
}

@media only screen and (min-width: 250px) and (max-width: 450px) {
    .shopProductTitle {
        font-size: 1.5rem !important;
    }
}

input[type="radio"], input[type="checkbox"] {
    accent-color: #000;
}

/*#region Search Results*/
.gs-title,
.gs-snippet {
    font-family: 'Muli', 'sans-serif' !important;
}

#___gcse_0 {
    align-self: center !important;
}

div.gsc-input-box {
    width: 200px !important;
}

form.gsc-search-box {
    margin-bottom: 0 !important;
}

table.gsc-search-box {
    margin-bottom: 0 !important;
}

button.gsc-search-button {
    height: 52px !important;
    margin-top: 0 !important;
    border-radius: 0 !important;
}

button:focus {
    border-color: #000 !important;
    outline: none !important;
    box-shadow: none !important;
}

.gs-title {
    font-size: 1.5rem !important;
}

.gsc-adBlock {
    display: none !important;
}

.gs-title b {
    font-size: inherit !important;
    color: #000 !important;
}

.gsc-webResult .gsc-result {
    padding-bottom: 20px !important;
    border-bottom: 1px solid #e6e6e6 !important;
}

.gsc-cursor-page {
    margin-right: 22px !important;
    font-weight: bold !important;
}

.gsc-cursor-current-page {
    font-weight: normal !important;
}

div.gs-visibleUrl-breadcrumb {
    font-size: 1rem !important;
}

div.gs-bidi-start-align {
    font-size: 1rem !important;
}

div.gcsc-find-more-on-google {
    display: none !important;
}

.gs-promotion a.gs-title {
    color: #000 !important;
}

.gs-promotion .gs-visibleUrl {
    color: #000 !important;
}
/*#endregion*/

/*#region Groups*/
#GroupContent {
    padding: 5px 15px 50px 2px;
    min-height: 100vh;
    transition: all 0.3s;
    width: 100%
}

.ecprGroupSquaresWhite {
    background-image: url(/images/ecprgroupsquareswhite.svg);
    height: 125px;
    margin-bottom: -35px;
    align-self: normal;
}

.h1Group {
    font-size: 1.5rem;
}

.groupSocialIcon:hover {
    color: #e2e2e2;
}

@media (min-width:370px) and (max-width: 1160px) {
    .h1Group {
        font-size: 2rem;
    }
}

@media (min-width:1161px) and (max-width: 1644px) {
    .h1Group {
        font-size: 2.5rem;
    }
}

@media (min-width: 1645px) {
    .h1Group {
        font-size: 3rem;
    }
}

/*#endregion*/

/*#region Institution*/
#InstitutionContent {
    padding: 5px 15px 50px 2px;
    min-height: 100vh;
    transition: all 0.3s;
    width: 100%
}

.h1Institution {
    font-size: 1.5rem;
}

.institutionSocialIcon:hover {
    color: #e2e2e2;
}

@media (min-width:370px) and (max-width: 1160px) {
    .h1Institution {
        font-size: 2rem;
    }
}

@media (min-width:1161px) and (max-width: 1644px) {
    .h1Institution {
        font-size: 2.5rem;
    }
}

@media (min-width: 1645px) {
    .h1Institution {
        font-size: 3rem;
    }
}

/*#endregion*/

/*#region Event devExpress card view*/

/*Tweak the fixed height to make the content fit better on various screen sizes*/
.dxcvBreakpointsCard_ECPRDefault, .cardContentContainer {
    height: 100% !important;
}

.dxbplc {
    vertical-align: top;
}

.dxcvBreakpointsCard_ECPRDefault {
    padding: 0;
}

#EventsCardView_DXMainTable {
    background: rgba(255, 255, 255, 0);
    border: 0;
}

#EventsCardView_HeaderPanel {
    border: 0;
}

.EventsCardBackgroundImage_Wrapper {
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
    overflow: hidden;
    position: absolute;
}

.EventsCardTitle {
    min-height: 200px;
    text-align: center;
    position: relative;
    z-index: 1;
    overflow: hidden;
    align-content: center;
    letter-spacing: .5px;
    background-color: rgba(0,0,0,.3);
    /*text-shadow: 2px 2px #000;*/
}

.EventsCardTitleSize {
    font-size: 1.2rem;
}

@media only screen and (max-width: 1399px) and (min-width: 768px) {
    .EventsCardTitleSize {
        font-size: 1.1rem;
    }
}

@media only screen and (max-width: 1571px) and (min-width: 1200px) {
    .EventsCardTitleSize {
        font-size: 1rem;
    }
}

@media only screen and (max-width: 1700px) and (min-width: 1572px) {
    .EventsCardTitleSize {
        font-size: 1.1rem;
    }
}

@media only screen and (max-width: 399px) {
    .EventsCardTitleSize {
        font-size: 1.25rem;
    }
}

@media only screen and (min-width: 768px) {
    .EventsDivHeight {
        height: 64px;
    }
}
/*#endregion*/

/*#region GridView*/
.scrollable-grid {
    overflow-x: auto;
    width: 100%;
}
/*#endregion*/

/*#region FAQControl*/
.ecpr-popover-content {
    display: none;
    position: fixed;
    max-width: 250px;
    padding: 10px;
    background: #f9f9f9;
    border: 1px solid #ccc;
    border-radius: 5px;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    box-sizing: border-box;
    overflow: auto;
    max-height: 90vh;
    width: 90vw;
}

@media (min-width: 1024px) {
    .ecpr-popover-content {
        max-width: 300px;
    }
}

/*#endregion*/

/*#region Image Caption*/
.caption-image-container {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.image-caption {
    position: absolute;
    bottom: 10px;
    left: 10px;
    background-color: rgba(0, 0, 0, 0.7);
    color: white;
    padding: 4px;
}
/*#endregion*/

/*#region Image Testimonials*/
.testimonial-container {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.testimonial-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.3);
    color: white;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.testimonial-content {
    max-width: 575px;
}

.testimonial-heading {
    font-size: 2.5rem;
}

.testimonial-body-text {
    font-size: 1.4rem;
}


/* Media query for mobile devices */
@media (max-width: 450px) {
    .testimonial-heading {
        font-size: 1.8rem;
    }

    .testimonial-body-text {
        font-size: 1rem;
    }
}
/*#endregion*/

/* Cookie consent variables */
#cc-main {
    --cc-primary-color: #000;
    --cc-secondary-color: #707070;
    --cc-font-family: Muli;
    --cc-btn-primary-bg: #000000;
    --cc-btn-primary-border-color: #000000;
    --cc-btn-primary-hover-bg: #fff;
    --cc-btn-primary-hover-color: #000;
    --cc-btn-primary-hover-border-color: #000;
    --cc-btn-secondary-bg: #e2e2e2;
    --cc-btn-secondary-color: #000;
    --cc-btn-secondary-hover-bg: #fff;
    --cc-btn-seondary-hover-border-color: #707070;
    --cc-toggle-on-bg: var(--cc-btn-primary-bg);
    --cc-toggle-off-bg: var(--cc-secondary-color);
    --cc-btn-border-radius: 0px;
    --cc-cookie-category-block-bg: #e2e2e2;
    --cc-cookie-category-block-hover-bg: #e2e2e2;
    --cc-cookie-category-block-hover-border: #e2e2e2;
    --cc-cookie-category-expanded-block-hover-bg: #e2e2e2;
    --cc-footer-color: #000;
}
/* endregion */

/* Devexpress combo box fit width */

.combo-fit-width {
    width: 100% !important;
}

/* endregion */

/* #region Accessibility */
.unstyled-button {
    background: none !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
    font: inherit !important;
    color: inherit !important;
    text-align: left !important;
    width: 100% !important;
    cursor: pointer !important;
}

    .unstyled-button:focus-visible {
        outline: 2px solid #000 !important;
        border-radius: 4px !important;
    }
/* endregion */
