

/* Please see documentation at https://docs.microsoft.com/aspnet/core/client-side/bundling-and-minification
for details on configuring this project to bundle and minify static web assets. */

/*  VC - modifications
    ------------------
*/

/* color-profile
    Blue grey (menu text): #456186 rgb(69, 97, 134) (original #536de6)
    Hover: (original #475dc4)
    Light blue grey (menu background): #aab8c5 rgb(170, 184, 197)
    Pale blue grey (body backgtound): #dee2e6;

*/
:root {
    --color-bkg-lt: #b9c4cf; /*Pale blue grey (body backgtound)*/
    --color-bkg-lt-rgb: rgb(185, 196, 207);
    --color-bkg-dk: #050519; /*Pale blue grey (body backgtound)*/
    --color-bkg-dk-rgb: rgb(10,10,30);
    --color-mnu-lt-rgb: rgba(150, 184, 217, 0.95); /*Light blue (menu background) */
    --color-mnu-lt-rgb-fade: rgba(110, 134, 167, .85); /*Light blue (menu background) - fade to colour*/
    --color-mnu-dk-rgb: rgba(50, 50, 70, 0.95); /*Light blue (menu background) */
    --color-mnu-dk-rgb-fade: rgba(0, 0, 0, .7); /*Light blue (menu background) - fade to colour*/
    --color-txt-lt: rgba(0,0,32); /*Text*/
    --color-txt-head-lt: rgb(60,90,140); /*A darker steelblue*/
    --color-txt-head-dk: rgb(70,130,180); /*steelblue*/
    --color-bkg-primary: rgba(69, 97, 134, 0.2);
    /*--color-mnu-dk-rgb: rgba(0,0,20,0);*/ /*Black/blue for dark menu*/
    /*--color-card-lt-rgb: rgba(188, 222, 255, 0.95);*/ /*Light blue (card background) */
    /*--color-card-lt-rgb-fade: rgba(222, 222, 255, .85);*/ /*Light blue (card background) - fade to colour*/
    --color-card-lt-rgb: rgba(185, 196, 207, 0.90); /*Light blue (card background) */
    --color-card-lt-rgb-fade: rgba(206, 216, 227, 0.8); /*Light blue (card background) - fade to colour*/
    --color-card-dk-rgb: rgba(0, 0, 0, 0.85); /*Light blue (card background) */
    --color-card-dk-rgb-fade: rgba(0, 0, 0, .65); /*Light blue (card background) - fade to colour*/

    --ct-logo-lg-height: 70px;
    --ct-logo-sm-height: 50px;
    --ct-black: #000;
    --ct-white: #fff;
    --ct-gray: #8a969c;
    --ct-gray-dark: #343a40;
    --ct-gray-100: #f6f7fb;
    --ct-gray-200: #eef2f7;
    --ct-gray-300: #dee2e6;
    --ct-gray-400: #ced4da;
    --ct-gray-500: #a1a9b1;
    --ct-gray-600: #8a969c;
    --ct-gray-700: #6c757d;
    --ct-gray-800: #343a40;
    --ct-gray-900: #313a46;
    /*Changed*/
    --ct-primary: #456186;
    --ct-secondary: #6c757d;
    --ct-success: #10c469;
    --ct-info: #35b8e0;
    --ct-warning: #f9c851;
    --ct-danger: #ff5b5b;
    --ct-light: #eef2f7;
    --ct-dark: #313a46;
    /*Changed*/
    --ct-primary-rgb: 69, 97, 134;
    --ct-secondary-rgb: 108, 117, 125;
    --ct-success-rgb: 16, 196, 105;
    --ct-info-rgb: 53, 184, 224;
    --ct-warning-rgb: 249, 200, 81;
    --ct-danger-rgb: 255, 91, 91;
    --ct-light-rgb: 238, 242, 247;
    --ct-dark-rgb: 49, 58, 70;
    --ct-white-rgb: 255, 255, 255;
    --ct-black-rgb: 0, 0, 0;
    --ct-body-color-rgb: 108, 117, 125;
    /*Changed*/
    --ct-body-bg-rgb: var(--color-txt-lt); /*250, 251, 254;*/
    --ct-font-sans-serif: "Nunito", sans-serif;
    --ct-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    --ct-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
    --ct-body-font-family: var(--ct-font-sans-serif);
    /*Changed*/
    --ct-body-font-size: 1.0rem; /*0.9rem;*/
    --ct-body-font-weight: 400;
    --ct-body-line-height: 1.5;
    /*Changed*/
    --ct-body-color: var(--color-txt-lt);
    /*Changed*/
    --ct-body-bg: var(--color-bkg-lt);
    --ct-border-width: 1px;
    --ct-border-style: solid;
    --ct-border-color: var(--ct-gray-300);
    --ct-border-color-translucent: rgba(0, 0, 0, 0.175);
    --ct-border-radius: 0.25rem;
    --ct-border-radius-sm: 0.2rem;
    --ct-border-radius-lg: 0.3rem;
    --ct-border-radius-xl: 1rem;
    --ct-border-radius-2xl: 2rem;
    --ct-border-radius-pill: 50rem;
    --ct-link-color: steelblue;
    --ct-link-hover-color: white;
    --ct-code-color: #35b8e0;
    --ct-highlight-bg: #fcf8e3;
    /* Added*/
    --ct-card-color: var(--ct-body-color);
}

html[data-bs-theme=light], [data-bs-theme=light] {
    --color-txt-head: var(--color-txt-head-lt);
}

html[data-bs-theme=dark], [data-bs-theme=dark] {
    --color-txt-head: var(--color-txt-head-dk);
    --ct-body-bg: var(--color-bkg-dk);
    --ct-body-bg-rgb: var(--color-bkg-dk-rgb);
    --ct-body-color: var(--color-mnu-lt-rgb);
    --ct-body-color-rgb: 170, 184, 197;
    --ct-input-bg-custom: var(--color-bkg-dk);
}

.link-primary {
    color: var(--ct-primary);
}

    .link-primary:hover, .link-primary:focus {
        color: steelblue;
    }

html[data-bs-theme=light] .footer {
    color: var(--color-txt-lt);
    background: linear-gradient(180deg, var(--color-mnu-lt-rgb), var(--color-mnu-lt-rgb-fade));
}


html[data-bs-theme=dark] .footer {
    background: linear-gradient(180deg, var(--color-mnu-dk-rgb), var(--color-mnu-dk-rgb-fade));
}

.footer .footer-links a {
    color: var(--ct-primary);
}

html[data-layout-mode=detached]:not([data-layout=topnav]) .wrapper .footer {
    border: 0px solid var(--color-bkg-lt);
}

.btn-primary {
    --ct-btn-bg: #456186;
    --ct-btn-border-color: #456186;
    --ct-btn-hover-bg: steelblue;
    --ct-btn-disabled-bg: #456186;
    --ct-btn-disabled-border-color: #456186;
}

html[data-menu-color=light] {
    --ct-menu-bg: linear-gradient(180deg, var(--color-mnu-lt-rgb), var(--color-mnu-lt-rgb-fade));
    --ct-menu-item-color: #456186;
    --ct-menu-item-hover-color: white;
    --ct-menu-item-active-color: white;
    --ct-help-box-bg: #456186;
    --ct-menu-condensed-link-bg: rgba(170, 184, 197);
}

html[data-bs-theme=dark] {
    --ct-menu-condensed-link-bg: linear-gradient(180deg, var(--color-mnu-dk-rgb), var(--color-mnu-dk-rgb-fade));
}

html[data-bs-theme=light] {
    --ct-menu-condensed-link-bg: linear-gradient(180deg, var(--color-mnu-lt-rgb), var(--color-mnu-lt-rgb-fade));
}

html[data-bs-theme=dark][data-menu-color=light],
html[data-bs-theme=dark][data-menu-color=dark] {
    --ct-menu-bg: linear-gradient(180deg, var(--color-mnu-dk-rgb), var(--color-mnu-dk-rgb-fade));
    --ct-topbar-bg: linear-gradient(90deg, var(--color-mnu-dk-rgb), var(--color-mnu-dk-rgb-fade));
    --ct-menu-item-color: #8391a2;
    --ct-menu-item-hover-color: #bccee4;
    --ct-menu-item-active-color: #ffffff;
    --ct-help-box-bg: rgba(255, 255, 255, 0.07);
}


html[data-topbar-color=light] {
    --ct-topbar-bg: linear-gradient(180deg, var(--color-mnu-lt-rgb), var(--color-mnu-lt-rgb-fade));
    --ct-topbar-item-color: #456186;
    --ct-topbar-item-hover-color: white;
}

html[data-bs-theme=dark][data-topbar-color=light],
html[data-bs-theme=dark][data-topbar-color=dark] {
    --ct-topbar-bg: linear-gradient(180deg, var(--color-mnu-dk-rgb), var(--color-mnu-dk-rgb-fade));
    --ct-topbar-item-color: #8391a2;
    --ct-topbar-item-hover-color: #bccee4;
    --ct-topbar-search-bg: #464f5b;
    --ct-topbar-user-bg: #3c4655;
    --ct-topbar-user-border: #414d5d;
}

h5, .h5, h3, .h3, h1, .h1 {
    color: var(--color-txt-head);
}

.card-body {
    font-weight: 400;
}

a {
    font-weight: 800;
}

h1, page-title {
    margin: 30px 0 10px 0;
    padding: 0;
    font-weight: 500;
}

h2 {
    margin: 20px 0 10px 0;
    padding: 0;
    font-weight: 500;
}

h3 {
    margin: 20px 0 10px 0;
    padding: 0;
    font-weight: 600;
}

h5 {
    margin: 20px 0 10px 0;
    padding: 0;
    font-weight: 400;
}

.badge-outline-primary {
    --ct-badge-color: var(--ct-primary);
    border: 1px solid var(--ct-primary);
    background-color: transparent;
}

    .badge-outline-primary[href] {
        color: var(--ct-primary);
        background-color: var(--color-bkg-primary);
    }

        .badge-outline-primary[href]:hover, .badge-outline-primary[href]:focus {
            color: --ct-primary;
            background-color: var(--color-bkg-primary);
        }

.blue-bullet {
    list-style-image: url(../images/bullet-light-blue.gif);
}

.darkblue-bullet {
    list-style-image: url(../images/bullet-dark-blue.gif);
}

.card {
    border-radius: 10px;
}

html[data-bs-theme=light]
.card {
    --ct-box-shadow: 5px 5px 10px rgba(0,0,20,.2), 1px 1px 4px rgba(0,0,20,.5);
}

html[data-bs-theme=dark]
.card {
    /*--ct-box-shadow: 5px 5px 10px rgba(185, 196, 207,.2), 0px 0px 4px rgba(185, 196, 207,.5);*/
}

html[data-bs-theme=light]
.card-opaque {
    background: linear-gradient(180deg, var(--color-card-lt-rgb), var(--color-card-lt-rgb-fade));
}

html[data-bs-theme=dark]
.card-opaque {
    background: linear-gradient(180deg, var(--color-card-dk-rgb), var(--color-card-dk-rgb-fade));
}

.card-title {
}

.card-img {
    border: none;
    max-height: 100px;
    width: auto;
    background: none;
    background-repeat: no-repeat; /* Do not repeat the image */
    opacity: 1;
}

.card-img-sm {
    border: none;
    max-height: 50px;
    width: auto;
    background: none;
    background-repeat: no-repeat; /* Do not repeat the image */
    opacity: 1;
}

.card-img-lg {
    border: none;
    max-height: 250px;
    width: auto;
    background: none;
    background-repeat: no-repeat; /* Do not repeat the image */
}

html[data-bs-theme=light]
.card-click:hover {
    box-shadow: 10px 10px 20px rgba(0,0,20,.3), 3px 3px 12px rgba(0,0,20,.5);
}

html[data-bs-theme=dark]
.card-click:hover {
    box-shadow: 10px 10px 20px rgba(185, 196, 207,.3), 3px 3px 12px rgba(185, 196, 207,.5);
}

.product-img {
    max-height: 300px;
    max-width: auto;
    vertical-align: top;
    background-position: center; /* Center the image */
    background-repeat: no-repeat; /* Do not repeat the image */
    background-size: auto; /* Resize the background image to cover the entire container */
    opacity: 1;
}

.icon-img {
    max-height: 30px;
    max-width: auto;
    vertical-align: middle;
    background-position: center; /* Center the image */
    background-repeat: no-repeat; /* Do not repeat the image */
    background-size: contain; /* Resize the background image to cover the entire container */
    opacity: 1;
}

/* Used for images of the apps that grow significantly on hover over*/
.product-img:hover {
    transform: scale(2);
    transform-origin: left;     
    box-shadow: 0 10px 20px rgba(37,33,82,.12), 0 4px 8px rgba(37,33,82,.06);
}


