/*** Backgrounds - light to dark - grey to color ***/

    .background-transparent,
    .bg-nrd-transparent {
        background-color: transparent;
    }

    .background-white,
    .bg-nrd-white,
    .control--radio:hover input:checked ~ .control__indicator.background-white,
    .control--radio:hover input:checked ~ .control__indicator.bg-nrd-white {
        background-color: var(--white);
    }

    .background-grey-5, .bg-nrd-grey-5,
    .background-gray-5, .bg-nrd-gray-5,
    .resource-main .background-grey-5, .resource-main .bg-nrd-grey-5,
    .resource-main .background-gray-5, .resource-main .bg-nrd-gray-5,
    .resource-main .background-grey-5-hover:hover, .resource-main .bg-nrd-grey-5-hover:hover,
    .resource-main .background-gray-5-hover:hover, .resource-main .bg-nrd-gray-5-hover:hover  {
        background-color: var(--grey-5);
    }

    .background-grey-lightest, .bg-nrd-grey-lightest, 
    .background-gray-lightest, .bg-nrd-gray-lightest, 
    div.panel-heading.background-grey-lightest, div.panel-heading.bg-nrd-grey-lightest, 
    div.panel-heading.background-gray-lightest, div.panel-heading.bg-nrd-gray-lightest,
    .resource-main .background-grey-lightest, .resource-main .bg-nrd-grey-lightest, 
    .resource-main .background-gray-lightest, .resource-main .bg-nrd-gray-lightest, 
    .resource-main .background-grey-lightest-hover:hover, .resource-main .bg-nrd-grey-lightest-hover:hover,
    .resource-main .background-gray-lightest-hover:hover, .resource-main .bg-nrd-gray-lightest-hover:hover,
    .CategoryEntry.background-grey-lightest, .CategoryEntry.bg-nrd-grey-lightest,
    .CategoryEntry.background-gray-lightest, .CategoryEntry.bg-nrd-gray-lightest {
        background-color: var(--grey-lightest);
    }

    .background-grey-10, .bg-nrd-grey-10, 
    .background-gray-10, .bg-nrd-gray-10, 
    .background-grey-10-hover:hover, .bg-nrd-grey-10-hover:hover, 
    .background-gray-10-hover:hover, .bg-nrd-gray-10-hover:hover,
    .resource-main .background-grey-10, .resource-main .bg-nrd-grey-10,  
    .resource-main .background-gray-10, .resource-main .bg-nrd-gray-10, 
    .resource-main .background-grey-10-hover:hover, .resource-main .bg-nrd-grey-10-hover:hover,
    .resource-main .background-gray-10-hover:hover, .resource-main .bg-nrd-gray-10-hover:hover {
        background-color: var(--grey-10);
    }

    .background-grey-warm-light, .bg-nrd-grey-warm-light,
    .background-gray-warm-light, .bg-nrd-gray-warm-light {
        background-color: var(--grey-warm-light);
    }

    .background-grey-lighter, .bg-nrd-grey-lighter,
    .background-gray-lighter, .bg-nrd-gray-lighter {
        background-color: var(--grey-lighter);
    }

    .background-grey-20, .bg-nrd-grey-20,
    .background-gray-20, .bg-nrd-gray-20,
    .background-grey-20-hover, .bg-nrd-grey-20-hover,
    .background-gray-20-hover, .bg-nrd-gray-20-hover,
    .control--radio:hover input ~ .control__indicator.background-grey-20-hover,
    .control--radio:hover input ~ .control__indicator.background-gray-20-hover,
    .control--radio:hover input ~ .control__indicator.bg-nrd-grey-20-hover,
    .control--radio:hover input ~ .control__indicator.bg-nrd-gray-20-hover {
        background-color: var(--grey-20);
    }

    .background-grey-light, .bg-nrd-grey-light,
    .background-gray-light, .bg-nrd-gray-light,
    .background-grey-light.form-control, .bg-nrd-grey-light.form-control,
    .background-gray-light.form-control, .bg-nrd-gray-light.form-control {
        background-color: var(--grey-light);
    }

    .background-grey-mid, .bg-nrd-grey-mid,
    .background-gray-mid, .bg-nrd-gray-mid,
    .control input:disabled ~ .control__indicator.background-grey-mid-disabled:after,
    .control input:disabled ~ .control__indicator.background-gray-mid-disabled:after {
        background-color: var(--grey-mid);
    }

    .background-grey-60, .bg-nrd-grey-60,
    .background-gray-60, .bg-nrd-gray-60 {
        background-color: var(--grey-60);
    }

    .background-grey, .bg-nrd-grey,
    .background-gray, .bg-nrd-gray {
        background-color: var(--grey);
    }

    .background-grey-warm-dark, .bg-nrd-grey-warm-dark,
    .background-gray-warm-dark, .bg-nrd-gray-warm-dark {
        background-color: var(--grey-warm-dark);
    }

    .background-base,
    .bg-nrd-base {
        background-color: var(--base);
    }

    .background-black,
    .bg-nrd-black {
        background-color: var(--black);
    }

    .background-blue-40,
    .bg-nrd-blue-40 {
        background-color: var(--blue-40);
    }

    .background-red-cool-50v,
    .bg-nrd-red-cool-50v {
        background-color: var(--red-cool-50v);
    }

    .background-red-dark,
    .bg-nrd-red-dark {
        background-color: var(--red-dark);
    }

    .background-green-cool-40v,
    .bg-nrd-green-cool-40v {
        background-color: var(--green-cool-40v);
    }

    .background-red-lightest,
    .bg-nrd-red-lightest {
        background-color: var(--red-lightest);
    }

    .background-yellow, .bg-nrd-yellow,
    .background-yellow.form-control, .bg-nrd-yellow.form-control,
    .background-yellow-hover:hover, .bg-nrd-yellow-hover:hover,
    a.background-yellow-hover:hover, a.bg-nrd-yellow-hover:hover,
    li.selected .background-yellow-selected, li.selected .bg-nrd-yellow-selected {
        background-color: var(--yellow);
    }

    .background-blue,
    .bg-nrd-blue,
    div.panel-heading.background-blue,
    .background-blue-after:after {
    /*    background-color: rgba(49,103,172,1); */
        background-color: var(--bg-blue);
    }

/*** End Backgrounds ***/

/*** Text - light to dark - grey to color ***/

    .text-white, .text-white-hover:hover, a.text-white:hover, a.text-white:focus, .btn.text-white:hover, .btn.text-white:focus {
        color: #fff;
        color: var(--white);
    }

    .text-grey-lightest, a.text-grey-lightest:hover, a.text-grey-lightest:focus,
    .text-gray-lightest, a.text-gray-lightest:hover, a.text-gray-lightest:focus, 
    .btn.text-grey-lightest:hover, .btn.text-grey-lightest:focus, 
    .btn.text-gray-lightest:hover, .btn.text-gray-lightest:focus,
    .resourcePanelInformation.text-grey-lightest > div > a,
    .resourcePanelInformation.text-gray-lightest > div > a {
        color: #f1f1f1;
        color: var(--grey-lightest);
    }

    .text-grey-10, .text-grey-10-hover:hover, 
    .text-gray-10, .text-gray-10-hover:hover {
        color: #e6e6e6;
        color: var(--grey-10);
    }

    .text-grey-warm-light, a.text-grey-warm-light:hover, a.text-grey-warm-light:focus, 
    .text-gray-warm-light, a.text-gray-warm-light:hover, a.text-gray-warm-light:focus, 
    .btn.text-grey-warm-light:hover, .btn.text-grey-warm-light:focus, 
    .btn.text-gray-warm-light:hover, .btn.text-gray-warm-light:focus {
        color: #e4e2e0;
        color: var(--grey-warm-light);
    }

    .text-grey-lighter, a.text-grey-lighter:hover, a.text-grey-lighter:focus,
    .text-gray-lighter, a.text-gray-lighter:hover, a.text-gray-lighter:focus, 
    .btn.text-grey-lighter:hover, .btn.text-grey-lighter:focus, 
    .btn.text-gray-lighter:hover, .btn.text-gray-lighter:focus,
    .text-grey-lighter, .text-grey-lighter-hover:hover
    .text-gray-lighter, .text-gray-lighter-hover:hover {
        color: #d6d7d9;
        color: var(--grey-lighter);
    }

    .text-grey-light, a.text-grey-light:hover, a.text-grey-light:focus,
    .text-gray-light, a.text-gray-light:hover, a.text-gray-light:focus, 
    .btn.text-grey-light:hover, .btn.text-grey-light:focus, 
    .btn.text-gray-light:hover, .btn.text-gray-light:focus,
    .resource-main .text-grey-light, .resource-main .text-grey-light-hover:hover,
    .resource-main .text-gray-light, .resource-main .text-gray-light-hover:hover {
        color: #aeb0b5;
        color: var(--grey-light);
    }

    .text-grey-mid, .resource-main .text-grey-mid, .resource-main .text-grey-mid-hover:hover,
    .text-gray-mid, .resource-main .text-gray-mid, .resource-main .text-gray-mid-hover:hover {
        color: #757575;
        color: var(--grey-mid);
    }

    .text-grey-60, .text-grey-60-hover:hover, 
    .text-gray-60, .text-gray-60-hover:hover,
    .resource-main .text-grey-60, .resource-main .text-grey-60-hover:hover, 
    .resource-main .text-gray-60, .resource-main .text-gray-60-hover:hover {
        color: #5c5c5c;
        color: var(--grey-60);
    }

    .text-grey, a.text-grey:hover, a.text-grey:focus,
    .text-gray, a.text-gray:hover, a.text-gray:focus, 
    .btn.text-grey:hover, .btn.text-grey:focus, 
    .btn.text-gray:hover, .btn.text-gray:focus,
    .resourcePanelInformation.text-grey > div > a,
    .resourcePanelInformation.text-gray > div > a {
        color: #5b616b;
        color: var(--grey);
    }

    .text-grey-warm-dark, a.text-grey-warm-dark:hover, a.text-grey-warm-dark:focus, 
    .text-gray-warm-dark, a.text-gray-warm-dark:hover, a.text-gray-warm-dark:focus, 
    .btn.text-grey-warm-dark:hover, .btn.text-grey-warm-dark:focus, 
    .btn.text-gray-warm-dark:hover, .btn.text-gray-warm-dark:focus, 
    .panel-body a.text-grey-warm-dark, .panel-body a.text-grey-warm-dark:hover, 
    .panel-body a.text-gray-warm-dark, .panel-body a.text-gray-warm-dark:hover,
    ul li ul li a.text-grey-warm-dark,
    ul li ul li a.text-gray-warm-dark,
    .text-grey-warm-dark .form-control,
    .text-gray-warm-dark .form-control {
        color: #494440;
        color: var(--grey-warm-dark);
    }

    .text-base, .text-base.form-control {
        color: #212121;
        color: var(--base);
    }

    .text-black, .nav-tabs .nav-link.dark-hover.text-black,
    a.text-black:hover,
    a.text-black:focus,
    .btn.text-black:hover,
    .btn.text-black:focus {
        color: #000;
        color: var(--black);
    }

    .text-blue-40 {
        color: var(--blue-40);
    }
    
    .text-green-cool-40v {
        color: var(--green-cool-40v);
    }
    
    .text-red-cool-50v {
        color: var(--red-cool-50v);
    }

    .text-red-dark {
        color:#c61f25;
        color: var(--red-dark);
    }

    .text-yellow, a.text-yellow:hover, a.text-yellow:focus, a.text-yellow-hover:hover, .btn.text-yellow:hover, .btn.text-yellow:focus {
        color: #f9c642;
        color: var(--yellow);
    }

    .title-text-blue, a.text-blue:hover, a.text-blue:focus,
    .text-blue-hover:hover, a.text-blue-hover:hover,
    .panel-body a.text-blue-hover:hover,
    a.email-link.text-blue, a.email-link.text-blue:hover,
    .btn.text-blue:hover, .btn.text-blue:focus,
    a.side-number.text-blue-hover:hover,
    .faq .question.text-blue {
        color: #006ab0;
        color: var(--blue);
    }
    
/*** End Text ***/

/*** Border Top - light to dark ***/

    .border-top-color-grey-10,
    .border-top-color-gray-10 {
        border-top-color: #e6e6e6;
        border-top-color: var(--grey-10);
    }

    .border-top-color-grey-warm-dark,
    .border-top-color-gray-warm-dark {
        border-top-color: #494440;
        border-top-color: var(--grey-warm-dark);
    }

/*** End Border Top ***/

/*** Border - light to dark - grey to color ***/

    .border-color-grey-lightest, .border-color-gray-lightest {
        border-color: #f1f1f1;
        border-color: var(--grey-lightest);
    }

    .border-color-grey-10, .resource-main .border-color-grey-10, .resource-main .border-color-grey-10:hover,
    .border-color-gray-10, .resource-main .border-color-gray-10, .resource-main .border-color-gray-10:hover {
        border-color: #e6e6e6;
        border-color: var(--grey-10);
    }

    .border-color-grey-lighter, .border-bottom-color-grey-lighter,
    .border-color-gray-lighter, .border-bottom-color-gray-lighter {
        border-color: #d6d7d9;
        border-color: var(--grey-lighter);
    }

    .border-color-grey-20,
    .border-color-gray-20 {
        border-color: #c9c9c9;
        border-color: var(--grey-20);
    }

    .border-color-grey-light,
    .border-color-gray-light {
        border-color: #aeb0b5;
        border-color: var(--grey-light);
    }

    .border-color-grey-30,
    .border-color-gray-30 {
        border-color: #adadad;
        border-color: var(--grey-30);
    }

    .border-color-grey-mid, .border-color-gray-mid {
        border-color: #757575;
        border-color: var(--grey-mid);
    }

    .border-color-yellow {
        border-color: #f9c642;
        border-color: var(--yellow);
    }

    .border-color-blue, .border-color-blue-after:after {
        border-color: #006ab0;
        border-color: var(--blue);
    }

/*** End Border ***/

/*** Border Bottom ***/

    .border-bottom-color-blue.panel-default.clicked {
        border-bottom-color: #006ab0;
        border-bottom-color: var(--blue);
    }

/*** End Border Bottom ***/

/*** Button coloring ***/

    [class*="btn-nrd"] {
        color: var(--grey-warm-dark);
    }

    .btn-nrd-grey-lighter,
    .btn-nrd-gray-lighter {
        background-color: var(--grey-lighter);
    }

    .btn-nrd-yellow {
        background-color: var(--yellow);
    }