﻿
/* This is a common file (as its included in the editor), so avoid CSS variables here or re-declare them */
:root {
    --pri: #001889;
    --pri-dark: #000F58;
    --pri-light: #D7DAEC;
    --pri-light-plus: #E9EAF3;
    --pri-off: #6B0A7A;
    --pri-off-dark: #550661;
    --pri-off-light: #E9DAEB;
    --sec: #ee0093;
    --sec-dark: #A70067;
    --sec-light: #EFDFE9;
    --sec-off: #A1057F;
    --sec-off-dark: #800365;
    --sec-off-light: #EDDCEA;
    --ter: #00cacf;
    --ter-dark: #009EA3;
    --ter-light: #DEEFEF;
    --ter-off: #006EA0;
    --ter-off-dark: #00547B;
    --ter-off-light: #DAE7ED;
    /**/
    --vibrant: #3932f1;
    /**/
    --info: #001889;
    --info-light: #D7DAEC;
    --success: #003516;
    --success-light: #d7ece1;
    --warning: #6f3600;
    --warning-light: #eddccd;
    --danger: #6f002e;
    --danger-light: #ecd7e0;
}

/* Cards Widget */

.widget_cards .cards {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    margin: 15px 0;
}

    .widget_cards .cards .card {
        flex: 1 0 21%;
        padding: 15px;
        color: #3f3f3f;
        text-align: center;
    }

        .widget_cards .cards .card .card_text {
            display: flex;
            flex-direction: column;
            align-items: center;
            height: 100%;
        }

        .widget_cards .cards .card h1,
        .widget_cards .cards .card h2,
        .widget_cards .cards .card h3,
        .widget_cards .cards .card h4 {
            color: #3f3f3f;
        }

        .widget_cards .cards .card p,
        .widget_cards .cards .card li,
        .widget_cards .cards .card span,
        .widget_cards .cards .card strong,
        .widget_cards .cards .card em {
            color: #3f3f3f !important;
        }

        .widget_cards .cards .card a:not(.btn-pri):not(.btn-primary):not(.blue-button) {
            color: var(--pri) !important;
        }

.widget_cards[data-color="offwhite"] .card {
    background: #efefef;
    color: #3f3f3f !important;
}

.widget_cards .cards .card img {
    max-width: 100%;
}

.widget_cards[data-color="warmgrey"] .card {
    background: #ededed;
    color: #3f3f3f !important;
}

.widget_cards[data-color="gradient"] .card {
    background: linear-gradient(315deg, rgba(var(--primary-rgb), 0.75), rgba(var(--secondary-rgb), 0.75));
    color: #fff;
}

.widget_cards[data-color="blue"] .card {
    background: var(--pri);
    color: #fff;
}

.widget_cards[data-color="red"] .card {
    background: var(--sec);
    color: #fff;
}

    .widget_cards[data-color="gradient"] .card h1,
    .widget_cards[data-color="blue"] .card h1,
    .widget_cards[data-color="red"] .card h1,
    .widget_cards[data-color="gradient"] .card h2,
    .widget_cards[data-color="blue"] .card h2,
    .widget_cards[data-color="red"] .card h2,
    .widget_cards[data-color="gradient"] .card h3,
    .widget_cards[data-color="blue"] .card h3,
    .widget_cards[data-color="red"] .card h3,
    .widget_cards[data-color="gradient"] .card h4,
    .widget_cards[data-color="blue"] .card h4,
    .widget_cards[data-color="red"] .card h4 {
        color: #fff;
    }

    .widget_cards[data-color="gradient"] .card p,
    .widget_cards[data-color="blue"] .card p,
    .widget_cards[data-color="red"] .card p,
    .widget_cards[data-color="gradient"] .card li,
    .widget_cards[data-color="blue"] .card li,
    .widget_cards[data-color="red"] .card li,
    .widget_cards[data-color="gradient"] .card span,
    .widget_cards[data-color="blue"] .card span,
    .widget_cards[data-color="red"] .card span,
    .widget_cards[data-color="gradient"] .card strong,
    .widget_cards[data-color="blue"] .card strong,
    .widget_cards[data-color="red"] .card strong,
    .widget_cards[data-color="gradient"] .card em,
    .widget_cards[data-color="blue"] .card em,
    .widget_cards[data-color="red"] .card em {
        color: #fff !important;
    }

        .widget_cards[data-color="gradient"] .card li::marker,
        .widget_cards[data-color="blue"] .card li::marker,
        .widget_cards[data-color="red"] .card li::marker {
            color: #fff !important;
        }

.widget_cards[data-dropshadow="true"] .card {
    box-shadow: rgba(0,0,0,0.1) 5px 5px 5px;
}

.widget_cards[data-borders="true"] .card {
    border-radius: 15px;
}

.widget_cards[data-amount="two"] .card.two,
.widget_cards[data-amount="three"] .card.two,
.widget_cards[data-amount="four"] .card.two {
    display: block !important;
}

.widget_cards[data-amount="three"] .card.three,
.widget_cards[data-amount="four"] .card.three {
    display: block !important;
}

.widget_cards[data-amount="four"] .card.four {
    display: block !important;
}

.widget_cards[data-color="gradient"] .card a, .widget_cards[data-color="pink"] .card a {
    color: var(--tertiary-active) !important;
}

.widget_cards .cards .card a.btn-pri,
.widget_cards .cards .card a.btn-primary,
.widget_cards .cards .card a.blue-button {
    display: inline-block;
    margin-top: auto;
    padding: 10px 22px;
    background: var(--pri);
    color: #fff !important;
    font-weight: 700;
    line-height: 1.2;
    text-align: center;
    text-decoration: none;
}

    .widget_cards .cards .card a.btn-pri:hover,
    .widget_cards .cards .card a.btn-primary:hover,
    .widget_cards .cards .card a.blue-button:hover {
        background: var(--pri-dark);
        color: #fff !important;
        text-decoration: none;
    }

.widget_cards[data-color="blue"] .card a:not(.btn-pri):not(.btn-primary):not(.blue-button), .widget_cards[data-color="red"] .card a:not(.btn-pri):not(.btn-primary):not(.blue-button) {
    color: #fff !important;
}
/*-----------------------------------------------------------------------------------------------*/
/* Text Block Widget */
.widget_text_block .widget_text_block_container {
    display: flex;
    margin: 15px 0;
    overflow: hidden;
}

.widget_text_block[data-style="left"] .widget_text_block_container {
    flex-direction: row;
}

.widget_text_block[data-style="right"] .widget_text_block_container {
    flex-direction: row-reverse;
}

.widget_text_block .widget_text_block_container .text_block_text,
.widget_text_block .widget_text_block_container .text_block_image {
    position: relative;
    flex: 1;
}

.widget_text_block .widget_text_block_container {
    background: #f4eef0;
    color: #3f3f3f;
}

    .widget_text_block .widget_text_block_container .text_block_text > div {
        min-height: 300px;
        height: 100%;
        padding: 30px;
    }

.widget_text_block[data-color="blue"] .widget_text_block_container {
    background: var(--pri);
    color: #fff;
}

.widget_text_block[data-color="red"] .widget_text_block_container {
    background: var(--sec);
    color: #fff;
}

.widget_text_block[data-color="white"] .widget_text_block_container {
    background: #fff;
}


.widget_text_block[data-color="blue"] .widget_text_block_container .text_block_text h1,
.widget_text_block[data-color="red"] .widget_text_block_container .text_block_text h1,
.widget_text_block[data-color="blue"] .widget_text_block_container .text_block_text h2,
.widget_text_block[data-color="red"] .widget_text_block_container .text_block_text h2,
.widget_text_block[data-color="blue"] .widget_text_block_container .text_block_text h3,
.widget_text_block[data-color="red"] .widget_text_block_container .text_block_text h3,
.widget_text_block[data-color="blue"] .widget_text_block_container .text_block_text h4,
.widget_text_block[data-color="red"] .widget_text_block_container .text_block_text h4 {
    color: #fff;
}

.widget_text_block .widget_text_block_container .text_block_text .btn-default {
    font-weight: 700;
    color: var(--pri);
}

.widget_text_block .widget_text_block_container .text_block_text .btn-primary {
    font-weight: 700;
}

.widget_text_block .widget_text_block_container .text_block_image {
    background-color: #f5f5f5;
    min-height: 300px;
    margin: 30px 0;
}

    .widget_text_block .widget_text_block_container .text_block_image img {
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        width: 100% !important;
        height: 100% !important;
        object-fit: cover;
    }

.widget_text_block[data-color="grey"] {
    position: relative;
}

    .widget_text_block[data-color="grey"]::before {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        left: 50%;
        width: 99vw;
        transform: translateX(-50%);
        background: #ededed;
        z-index: -1;
    }

.widget_text_block[data-color="white"] {
    position: relative;
}

    .widget_text_block[data-color="white"]::before {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        left: 50%;
        width: 99vw;
        transform: translateX(-50%);
        background: #fff;
        z-index: -1;
    }

.widget_text_block[data-color="blue"] {
    position: relative;
}

    .widget_text_block[data-color="blue"]::before {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        left: 50%;
        width: 99vw;
        transform: translateX(-50%);
        background: var(--pri);
        z-index: -1;
    }

    .widget_text_block[data-color="blue"] .text_block_text ul li::before {
        background: var(--sec) !important;
    }

.widget_text_block[data-color="red"] {
    position: relative;
}

    .widget_text_block[data-color="red"]::before {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        left: 50%;
        width: 99vw;
        transform: translateX(-50%);
        background: var(--sec);
        z-index: -1;
    }



.widget_text_block p,
.widget_text_block li {
    font-size: 0.9rem;
}

.widget_text_block h3 {
    background-color: var(--sec);
    padding: 10px;
    color: white;
    font-size: 20px;
}
/*-----------------------------------------------------------------------------------------------*/
/* Expandable Widget */
.expandable,
.editable_expandable {
    overflow: hidden;
}

    .expandable .expandable_heading .expandable_title,
    .editable_expandable .expandable_heading .expandable_title {
    }

        .expandable .expandable_heading,
        .expandable .expandable_heading .expandable_title,
        .expandable .expandable_heading .expandable_title a,
        .editable_expandable .expandable_heading,
        .editable_expandable .expandable_heading .expandable_title,
        .editable_expandable .expandable_heading .expandable_title a {
            font-weight: 400;
            text-align: left;
            font-size: 1rem;
            line-height: 1.2em;
            background: var(--pri) !important;
            color: #fff !important;
        }

            .expandable .expandable_heading .expandable_title a,
            .editable_expandable .expandable_heading .expandable_title a {
                text-decoration: none;
                display: block;
            }


            .expandable .expandable_heading .expandable_title span,
            .editable_expandable .expandable_heading .expandable_title span {
                max-width: 80%;
                display: inline-block;
            }

            .expandable .expandable_heading h4,
            .editable_expandable .expandable_heading h4 {
                margin: 0px;
            }

    .editable_expandable .expandable_title {
        text-align: left;
    }

    .expandable .expandable_body,
    .editable_expandable .expandable_body {
        background: var(--pri-light);
        padding: 15px;
    }

        .editable_expandable .expandable_body > :first-child {
            margin-top: 0px;
        }

    .editable_expandable .expandable_title a:not(.collapsed) {
        color: #fff !important;
    }

.expandable_heading .expandable_title .glyphicon {
    float: right;
    transition: transform 0.5s;
    transform: rotate(180deg);
}

    .expandable_heading .expandable_title .glyphicon::before {
        content: "\f282";
        display: inline-block;
        font-family: bootstrap-icons !important;
        font-style: normal;
        font-weight: 400 !important;
        font-variant: normal;
        text-transform: none;
        line-height: 1;
        vertical-align: -.125em;
        -webkit-font-smoothing: antialiased;
    }

.expandable_heading .expandable_title .collapsed .glyphicon {
    transform: rotate(0deg);
}
/*-----------------------------------------------------------------------------------------------*/
/* Nav Columns Widget */

.widget-navcolumns .widget-navcolumns-container {
    display: flex;
    gap: 30px;
    margin: 15px 0;
}

.widget-navcolumns .widget-navcolumns-col {
    position: relative;
    cursor: pointer;
    flex: 1;
}

    .widget-navcolumns .widget-navcolumns-col .widget-navcolumns-image {
        position: relative;
        background-color: var(--background-color);
        min-height: 250px;
    }

        .widget-navcolumns .widget-navcolumns-col .widget-navcolumns-image img {
            position: absolute;
            top: 0;
            left: 0;
            width: 100% !important;
            height: 100% !important;
            object-fit: cover;
        }

    .widget-navcolumns .widget-navcolumns-col .widget-navcolumns-title {
        position: absolute;
        bottom: 20px;
        place-self: center;
        padding: 10px 15px;
        background: white;
        color: var(--primary);
        min-height: 1.2em;
        font-size: 1.1rem;
        line-height: 1.2em;
        text-align: center;
        transition: background .3s linear;
    }

.widget-navcolumns-title h2, .widget-navcolumns-title p, .widget-navcolumns-title a {
    font-weight: bold !important;
}


.widget-navcolumns .widget-navcolumns-col:hover .widget-navcolumns-title,
.widget-navcolumns .widget-navcolumns-col .widget-navcolumns-title:focus-within {
    background: var(--secondary);
}

.widget-navcolumns .widget-navcolumns-col .widget-navcolumns-title h1,
.widget-navcolumns .widget-navcolumns-col .widget-navcolumns-title h2,
.widget-navcolumns .widget-navcolumns-col .widget-navcolumns-title h3,
.widget-navcolumns .widget-navcolumns-col .widget-navcolumns-title h4 {
    font-size: inherit;
    line-height: inherit;
    color: inherit;
    margin: 0;
}

.widget-navcolumns .widget-navcolumns-col .widget-navcolumns-title a {
    text-decoration: none;
    color: inherit;
}
