/*
Title:          enr-form-v4-base.css
Description:    Firestorm v4 Enrollment pages
Copyright:      Copyright 2019 Trinity Software Incorporated
                All Rights Reserved
 
    REVISION HISTORY:
    Date        Who Version Description
    --------    --- ------- ------------------------------------------
    01/01/2019  DG  1.0     Initial
    02/11/2021  DG  1.1     Comment out the CSS controll of birthdate fields order to be programatically sorted
    04/20/2021  JR  1.2     Removed -70px top margin on birthday combos. Set field height to 45px from 40px.
    04/20/2021  DG  1.3     Added fix for fields pushed out of row by requirment notices. I set the red notice/instructions to be 100% width  so they all pushdown and reversed it with a negative top margin line 2005
    04/06/2022  AR  1.4     Added classes for new auto referrer assignment button, as provided by Dino
    04/11/2022  DG  1.5     Added classes for new auto referrer modal form for searching reps.
    04/12/2022  DG  1.6     Added margining around overlay to reveal page.
    04/13/2022  DG  1.7     New Oval Spinner positioning added

*/

@import url("https://fonts.googleapis.com/css?family=Bebas+Neue&display=swap");

#HTMLInjection_HEADER {
    text-align: center;
}

    #HTMLInjection_HEADER .enr-logo {
        max-width: 170px;
    }

    #HTMLInjection_HEADER img {
        max-width: 170px;
    }

.enr-wrapper {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

    .enr-wrapper #enr-header {
        -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1;
    }

    .enr-wrapper #enr-main {
        -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
        order: 2;
    }

    .enr-wrapper #enr-footer {
        -webkit-box-ordinal-group: 4;
        -ms-flex-order: 3;
        order: 3;
    }

#enr-header,
#enr-main,
#enr-footer {
    min-height: 100px;
    padding: 20px 15px;
    color: #444;
}

    #enr-header p,
    #enr-main p,
    #enr-footer p {
        color: #444;
    }

.intructions-text {
    font-size: 11px;
    line-height: 13px;
    color: white;
    background-color: darkred;
    padding: 4px;
    display: inline;
    float: right;
    position: relative;
    text-align: center;
    border-radius: 8px;
}

    .intructions-text .arrow-down {
        width: 0;
        height: 0;
        bottom: -8px;
        border-left: 10px solid transparent;
        border-right: 10px solid transparent;
        border-top: 10px solid darkred;
        position: absolute;
        left: 0;
        right: 0;
        margin-left: auto;
        margin-right: auto;
    }

.enr-url-creation {
    color: #ccc;
    background-color: #7e7e7e;
    margin-top: -20px;
    padding: 10px;
}

    .enr-url-creation span {
        color: white;
        font-weight: bold;
    }

/*MODAL FOR ENR FORM:*/
.modal-no-js .modal-container {
    display: block;
}

.modal-sml {
    max-width: 430px;
    width: 430px;
}

.modal-med {
    max-width: 960px;
    width: 80%;
}

.modal-lrg {
    max-width: 1440px;
}

.modal-overlay,
.msg-overlay {
    opacity: 0;
    filter: alpha(opacity=0);
    position: absolute;
    top: 0;
    left: 0;
    z-index: 900;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7) !important;
}

.enr-modal-container {
    display: none;
    position: fixed;
    z-index: 2000;
    background: #fff;
    border-bottom: 1px solid #aaa;
    border-radius: 4px;
    -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
    box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
    border: 1px solid rgba(0, 0, 0, 0.1);
    background-clip: padding-box;
}

    .enr-modal-container .alert-msg {
        position: static !important;
        bottom: 0 !important;
        width: 100%;
        left: 0;
        z-index: 999999 !important;
    }

    .enr-modal-container .main-modal-text {
        text-align: left;
    }

    .enr-modal-container h2.display {
        font-family: "Bebas Neue", sans-serif;
        font-size: 64px;
        text-align: center;
        position: relative;
        margin-bottom: 30px;
        text-transform: none;
        line-height: 55px;
        font-weight: 400;
        color: #3e3e3e;
    }

    .enr-modal-container h2.section-display {
        text-transform: normal;
        font-size: 36px;
        font-weight: 400;
        font-family: "Bebas Neue", sans-serif;
        color: #3e3e3e;
    }

    .enr-modal-container h3.section-display {
        text-transform: none;
        font-size: 26px;
        font-weight: 400;
        font-family: "Bebas Neue", sans-serif;
        color: #333;
        max-width: 80%;
    }

    .enr-modal-container header,
    .enr-modal-container .modal-header {
        padding: 1.25em 1.5em;
        border-bottom: 1px solid #fff;
        background-color: #3e3e3e;
        min-height: 65px;
    }

        .enr-modal-container header h3,
        .enr-modal-container header h4 {
            margin: 0;
            color: #444;
        }

        .enr-modal-container .modal-header h3,
        .enr-modal-container .modal-header h4 {
            margin: 0;
            color: #444;
        }

    .enr-modal-container .modal-body {
        padding: 2em 1.5em;
        text-align: left;
        position: relative;
    }

    .enr-modal-container footer,
    .enr-modal-container .modal-footer {
        padding: 1.5em;
        border-top: 1px solid #fff;
        background: #fff;
        text-align: right;
    }

    .enr-modal-container .btn {
        width: 100% !important;
        font-size: 14px;
        padding: 0.55em 1.5em;
        background-color: #fff;
        border: 1px solid #bbb;
        color: #333;
        text-decoration: none;
        display: inline;
        text-align: center;
        border-radius: 4px;
        -webkit-transition: background-color 1s ease;
        transition: background-color 1s ease;
    }

        .enr-modal-container .btn:hover {
            background-color: #fff;
            color: #333;
        }

    .enr-modal-container .shop-modal-close {
        position: absolute;
        right: 20px;
        top: 15px;
    }

    .enr-modal-container footer .shop-modal-close {
        position: static;
    }

    .enr-modal-container .shop-modal-close .svg-close-icon {
        width: 44px;
        height: 44px;
    }

    .enr-modal-container .product-modal-img img {
        display: block;
        max-width: 295px;
        width: 100%;
        margin: 0 auto;
    }

    .enr-modal-container.modal-detect {
        overflow-y: hidden;
    }

    .enr-modal-container .modal-body {
        overflow-y: auto;
        max-height: 700px;
    }

#enr-header {
    background-color: #efefef;
    background-position-x: center;
    background-position-y: top;
    background-repeat: no-repeat;
}

    #enr-header .have-acct {
        font-size: 12px;
        display: block;
        margin: 0 auto;
        text-align: center;
    }

    #enr-header .enr-logo img {
        display: block;
        margin: 0 auto;
        max-width: 300px;
    }

[class*=enr-img-] {
    text-align: center;
}

    [class*=enr-img-] img {
        width: 100%;
        max-width: 600px;
        margin: 0 auto;
        margin-top: 50px;
    }

#enr-main {
    padding-left: 0;
    padding-right: 0;
}

    #enr-main input[type="button"] {
        width: auto;
    }

    #enr-main input[type="text"],
    #enr-main input[type="password"],
    #enr-main select {
        width: 100%;
        height: 45px;
        display: block;
        margin-bottom: 15px;
        border-radius: 4px;
    }

    #enr-main textarea {
        width: 100%;
        height: 100px;
        margin-bottom: 20px;
        border: 1px solid #ccd1d9;
    }

    #enr-main input {
        border: 1px solid #ccd1d9;
        padding-left: 10px;
        /*   width: auto;*/
        margin-bottom: 12px;
    }

    #enr-main .red-border {
        border: 2px solid #d92f42;
    }

    #enr-main .center-text {
        text-align: center;
    }

    #enr-main .step {
        position: relative;
        text-align: center;
        padding: 0px 10px !important;
        font-size: 33px;
        -webkit-box-flex: 1;
        -ms-flex-positive: 1;
        flex-grow: 1;
        border: 3px solid #fff;
    }

        #enr-main .step .step-wrapper {
            padding: 10px 5px 15px 5px;
            font-family: sans-serif;
        }

        #enr-main .step .step-text {
            font-size: 21px;
            line-height: 18px;
        }

    #enr-main .title-intro {
        margin-top: 50px;
    }

    #enr-main h2.display {
        font-family: "Bebas Neue", sans-serif;
        text-align: center;
        position: relative;
        margin-bottom: 30px;
        text-transform: none;
        font-size: 84px;
        line-height: 75px;
        font-weight: 400;
        color: #3e3e3e;
    }

        #enr-main h2.display::after {
            content: " ";
            display: block;
            border-bottom: 4px solid #000;
            margin-top: 15px;
        }

        #enr-main h2.display::before {
            content: " ";
            display: block;
            margin-bottom: 15px;
        }

        #enr-main h2.display .arrow-down {
            width: 0;
            height: 0;
            border-left: 15px solid transparent;
            border-right: 15px solid transparent;
            border-top: 15px solid #000;
            margin-bottom: 5px;
            position: absolute;
            bottom: -18px;
            left: 0;
            right: 0;
            margin-left: auto;
            margin-right: auto;
        }

    #enr-main .enr-form-text {
        text-align: center;
    }

    #enr-main .enr-steps {
        position: relative;
        background-color: #959595;
        color: white;
        padding: 0 !important;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        background-clip: padding-box;
    }

        #enr-main .enr-steps .enr-step-arrow-down {
            visibility: hidden;
            width: 0;
            height: 0;
            border-left: 10px solid transparent;
            border-right: 10px solid transparent;
            border-top: 10px solid #fff;
            top: 0;
            left: 0;
            right: 0;
            margin: auto;
        }

        #enr-main .enr-steps .active-step {
            background-color: #3e3e3e;
            color: white;
        }

            #enr-main .enr-steps .active-step .enr-step-arrow-down {
                visibility: visible;
            }

    #enr-main .required {
        position: relative;
        margin-right: 20px;
    }

        #enr-main .required:after {
            content: "*";
            display: block;
            font-size: 24px;
            color: #d92f42;
            position: absolute;
            right: -15px;
            top: 5px;
        }

    #enr-main .enr-divider {
        border: none;
        border-top: 1px solid #d2d2d3;
        margin: 30px auto 15px;
    }

    #enr-main .center-text {
        text-align: center;
    }

#enr-footer .meta-info {
    border-top: 1px solid #e5e5e5;
    border-bottom: 1px solid #e5e5e5;
}

    #enr-footer .meta-info a:link, #enr-footer .meta-info a:visited {
        color: #3e3e3e;
        margin: 10px;
    }

    #enr-footer .meta-info a:hover, #enr-footer .meta-info a:active {
        color: #959595;
        margin: 10px;
    }

.enr-continue-btn {
    padding: 10px;
    background-color: #3e3e3e;
    color: #fff;
    text-align: center;
    font-size: 18px;
    margin: 0 auto;
    width: 100%;
    display: block;
    text-transform: uppercase;
}

    .enr-continue-btn:hover, .enr-continue-btn:active {
        color: #fff;
        background-color: #444;
    }

#enr-main .frame.fit .column-content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    float: left;
}

.enr-main-content-side {
    -ms-flex-preferred-size: 50%;
    flex-basis: 50%;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    text-align: left;
}

.enr-main-img-side {
    -ms-flex-preferred-size: 50%;
    flex-basis: 50%;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    padding: 0 30px;
}

/*
page 2*/
.enr-find-rep-content h2 {
    margin-bottom: 0px;
}

h2.section-display {
    text-transform: none;
    font-size: 31px;
    font-weight: 400;
    font-family: inherit;
    color: #3e3e3e;
    margin: 2px 0;
    line-height: 33px;
    margin: 3px 0 !important;
}

h3.section-display {
    text-transform: none;
    font-size: 26px;
    font-weight: 400;
    font-family: inherit;
    color: #333;
    line-height: 28px;
    margin: 3px 0 !important;
    text-align: left;
}

.enr-rep-wrapper {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 200px;
}

    .enr-rep-wrapper img {
        width: 160px;
        height: auto;
        border-radius: 50%;
        -ms-flex-item-align: center;
        align-self: center;
        margin: 10px;
    }

    .enr-rep-wrapper .rep-info {
        -ms-flex-item-align: center;
        align-self: center;
        margin-left: 40px;
    }

.enr-find-rep {
    padding: 10px;
}

.enr-birthday-fields [class*=trin-],
.enr-shipping-address-fields [class*=trin-],
.enr-billing-address-fields [class*=trin-] {
    padding: 0 !important;
    padding-right: 6px !important;
}

.enr-birthday-fields,
.enr-shipping-address-fields,
.enr-billing-address-fields {
    padding-bottom: 0 !important;
}

.enr-checkbox {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    cursor: pointer;
    position: relative;
}

    .enr-checkbox > span {
        color: #34495E;
        padding: 0.5rem 0.25rem;
    }

    .enr-checkbox > input {
        height: 25px;
        width: 25px;
        -webkit-appearance: none;
        -moz-appearance: none;
        -o-appearance: none;
        appearance: none;
        border: 1px solid #fff;
        border-radius: 4px;
        outline: none;
        -webkit-transition-duration: 0.3s;
        transition-duration: 0.3s;
        background-color: teal;
        cursor: pointer;
    }

        .enr-checkbox > input:checked {
            border: 1px solid #fff;
            background-color: teal;
        }

            .enr-checkbox > input:checked + span::before {
                content: 'YES';
                display: block;
                text-align: center;
                color: #fff;
                position: absolute;
                left: 0.7rem;
                top: 0.3rem;
            }

        .enr-checkbox > input:active {
            border: 2px solid teal;
        }

#enr-main .personal-info-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: left;
    -ms-flex-align: left;
    align-items: left;
    -webkit-box-pack: left;
    -ms-flex-pack: left;
    justify-content: left;
}

    #enr-main .personal-info-wrapper .enr-phone-fields {
        -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1;
    }

    #enr-main .personal-info-wrapper .enr-birthday-fields {
        -webkit-box-ordinal-group: 4;
        -ms-flex-order: 3;
        order: 3;
    }

    #enr-main .personal-info-wrapper .enr-billing-shipping-fields-wrapper {
        -webkit-box-ordinal-group: 6;
        -ms-flex-order: 5;
        order: 5;
    }

    #enr-main .personal-info-wrapper .enr-custom-fields {
        -webkit-box-ordinal-group: 8;
        -ms-flex-order: 7;
        order: 7;
    }

.btn-link.rep-finder-btn {
    width: 100%;
    display: block;
}

#enr-main #DistributorLocatorLink.rep-finder-btn {
    background-color: #3e3e3e;
    text-decoration: none;
    padding: 10px;
    color: #fff;
    text-align: center;
    font-size: 18px;
    margin: 0 auto;
    width: 100%;
    display: block;
}

    #enr-main #DistributorLocatorLink.rep-finder-btn:visited, #enr-main #DistributorLocatorLink.rep-finder-btn:link {
        color: #fff;
        background-color: #444;
    }

    #enr-main #DistributorLocatorLink.rep-finder-btn:hover, #enr-main #DistributorLocatorLink.rep-finder-btn:active {
        color: #fff;
        background-color: #444;
    }

.rep-question {
    margin: 0 20px;
    fill: #377e74;
    height: 100px;
    width: 100px;
}

/*-------------------------
        Inline help tip
--------------------------*/
.help-tip {
    position: absolute;
    top: 0;
    right: 8px;
    text-align: center;
    background-color: #81aabe;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    font-size: 14px;
    line-height: 22px;
    cursor: default;
}

    .help-tip a:link,
    .help-tip a:visited {
        color: #76abff;
    }

    .help-tip a:hover,
    .help-tip a:active {
        color: #fff;
    }

    .help-tip:before {
        content: '?';
        font-weight: bold;
        color: #fff;
    }

    .help-tip:hover p {
        display: block;
        -webkit-transform-origin: 100% 0%;
        transform-origin: 100% 0%;
        -webkit-animation: fadeIn 0.3s ease-in-out;
        animation: fadeIn 0.3s ease-in-out;
    }

    .help-tip p {
        display: none;
        text-align: left;
        background-color: #81aabe;
        padding: 20px;
        width: 300px;
        position: absolute;
        border-radius: 3px;
        -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2);
        box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2);
        right: -4px;
        color: #fff !important;
        font-size: 13px;
        line-height: 1.4;
    }

        .help-tip p:before {
            position: absolute;
            content: '';
            width: 0;
            height: 0;
            border: 6px solid transparent;
            border-bottom-color: #81aabe;
            right: 10px;
            top: -12px;
        }

        .help-tip p:after {
            width: 100%;
            height: 40px;
            content: '';
            position: absolute;
            top: -40px;
            left: 0;
        }

@-webkit-keyframes fadeIn {
    0% {
        opacity: 0;
        -webkit-transform: scale(0.6);
        transform: scale(0.6);
    }

    100% {
        opacity: 100%;
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@keyframes fadeIn {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 100%;
    }
}
/*-------------------------
start kit selection page
--------------------------*/
.enrollment-item {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    padding: 15px !important;
    background-color: white;
    min-height: 200px;
    margin-bottom: 10px;
    padding-bottom: 40px;
    border-bottom: 1px solid #666;
}

    .enrollment-item .enr-prod-info {
        padding: 8px;
    }

    .enrollment-item.active-selection {
        z-index: 600;
        border: solid 0px #666;
        background-color: #d8d8d8;
    }

        .enrollment-item.active-selection .enr-item-select-button {
            float: left;
            margin-bottom: 20px;
        }

    .enrollment-item .check-svg {
        display: none;
    }

    .enrollment-item.active-selection .check-svg {
        display: block;
        position: absolute;
        width: 1;
        width: 120px;
        top: 25%;
        fill: #1dc92a;
    }

    .enrollment-item .enr-prod-img {
        -ms-flex-item-align: start;
        align-self: start;
        -webkit-box-ordinal-group: 1;
        -ms-flex-order: 0;
        order: 0;
        max-width: 200px;
    }

    .enrollment-item .footnote {
        font-size: 12px;
        color: #ceb18f;
    }

.enr-prod-name {
    color: #000;
    font-size: 23px;
    font-weight: 300;
}

.enr-item-select-button:link,
.enr-item-select-button:visited {
    padding: 5px 10px;
    background-color: #444;
    color: #fff;
    text-decoration: none;
    font-size: 18px;
    text-transform: uppercase;
}

.enr-item-select-button:hover,
.enr-item-select-button:active {
    background-color: #989898;
    color: #f9f9f9;
}

.enr-item-select-details:link,
.enr-item-select-details:visited {
    float: right;
    color: #3e3e3e;
}

.enr-item-select-details:hover,
.enr-item-select-details:active {
    color: #959595;
    text-decoration: none;
}

.qty-field {
    width: 100%;
    max-width: 50px;
    height: 30px !important;
}

.dynamic-kit-sku {
    text-align: center;
    font-size: 12px;
    color: #666;
}

.dynamic-kit-image img {
    display: block;
    margin: 0 auto;
    width: 60%;
}

.dynamic-kit-p-image img {
    display: block;
    margin: 0 auto;
    width: 60%;
}

.dynamic-kit-section {
    border-bottom: 1px solid #ccc;
}

.dynamic-product-section {
    border-bottom: 1px solid #ccc;
}

.dynamic-kit-header {
    text-align: center;
    background-color: #f2f2f2;
    padding: 5px;
    position: relative;
}

    .dynamic-kit-header .enr-step-arrow-down {
        width: 0;
        height: 0;
        border-left: 15px solid transparent;
        border-right: 15px solid transparent;
        border-top: 15px solid #f2f2f2;
        margin-bottom: 5px;
        position: absolute;
        bottom: -18px;
        left: 0;
        right: 0;
        margin-left: auto;
        margin-right: auto;
    }

/*-------------------------
end kit selection page
--------------------------*/
.date-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
}
/* 02/11/2021  DG  1.1 REMOVED as this is now sorted programatically*/
/*.date-wrapper .enr-month {
  -webkit-box-ordinal-group: 1;
      -ms-flex-order: 0;
          order: 0;
}
.date-wrapper .enr-day {
  -webkit-box-ordinal-group: 4;
      -ms-flex-order: 3;
          order: 3;
}
.date-wrapper .enr-year {
  -webkit-box-ordinal-group: 6;
      -ms-flex-order: 5;
          order: 5;
}*/

/*START ERROR POPUP*/
.enr-popup-error,
#enr_popup_error {
    z-index: 99999;
    background-color: darkred !important;
}

    .enr-popup-error .product-modal-text *,
    #enr_popup_error .product-modal-text * {
        color: white !important;
    }

    .enr-popup-error .svg-close-icon path,
    #enr_popup_error .svg-close-icon path {
        fill: white !important;
    }

    .enr-popup-error header,
    #enr_popup_error header {
        background-color: transparent;
        border: none;
        padding: 15px !important;
    }

        .enr-popup-error header h4,
        #enr_popup_error header h4 {
            color: white !important;
            margin: 0;
        }

    .enr-popup-error .modal-body,
    #enr_popup_error .modal-body {
        padding: 5px !important;
    }

    .enr-popup-error footer,
    #enr_popup_error footer {
        background-color: transparent;
        border: none;
        padding: 15px !important;
        text-align: center;
    }

/*START INFORMATION POPUP*/
.enr-popup-info {
    z-index: 99999;
    background-color: #60931d !important;
}

    .enr-popup-info .product-modal-text * {
        color: white !important;
    }

    .enr-popup-info .svg-close-icon path {
        fill: white !important;
    }

    .enr-popup-info header {
        background-color: transparent;
        border: none;
        padding: 15px !important;
    }

        .enr-popup-info header h4 {
            color: white !important;
            margin: 0;
        }

    .enr-popup-info .modal-body {
        padding: 5px !important;
    }

    .enr-popup-info footer {
        background-color: transparent;
        border: none;
        padding: 15px !important;
        text-align: center;
    }

/*START STATUS POPUP*/
.enr-popup-status {
    z-index: 99999;
    background-color: #1b83b1 !important;
}

    .enr-popup-status .product-modal-text * {
        color: white !important;
    }

    .enr-popup-status .svg-close-icon path {
        fill: white !important;
    }

    .enr-popup-status header {
        background-color: transparent;
        border: none;
        padding: 15px !important;
    }

        .enr-popup-status header h4 {
            color: white !important;
        }

    .enr-popup-status .modal-body {
        padding: 5px !important;
    }

    .enr-popup-status footer {
        background-color: transparent;
        border: none;
        padding: 15px !important;
        text-align: center;
    }

.running-totals {
    text-align: right;
    padding: 15px;
    position: fixed;
    z-index: 999999;
    bottom: 0;
    left: 0;
    width: 100%;
    background-color: #000;
    border-top: solid 8px #3e3e3e;
}

    .running-totals .enr-autoship-total {
        color: #fff;
    }

        .running-totals .enr-autoship-total span {
            color: #fff;
            font-weight: bold;
        }

    .running-totals .enr-overall-total {
        color: #fff;
    }

        .running-totals .enr-overall-total span {
            color: #fff;
            font-weight: bold;
        }

/* special error for 3 column form elements*/
.enr-birthday-fields .intructions-text,
.enr-city-state-zip-fields .intructions-text {
    display: block;
    position: relative;
    text-align: center;
    border-radius: 8px;
}

/*NEW REP FINDER POPUP*/
#enr-popup-rep-finder .modal-body {
    padding: 5px !important;
}

#enr-popup-rep-finder header {
    background-color: #3e3e3e;
    color: white;
    border-bottom: 1px solid #666;
}

    #enr-popup-rep-finder header .section-display {
        text-align: left;
        color: white;
    }

    #enr-popup-rep-finder header path {
        fill: white;
    }

/*NEW REP INFO*/
.enr-rep-wrapper {
    color: #444;
}

    .enr-rep-wrapper .rep-photo {
        text-align: center;
        -ms-flex-item-align: center;
        align-self: center;
    }

    .enr-rep-wrapper .rep-info {
        color: #444;
    }

    .enr-rep-wrapper .guest-of {
        color: #444;
        font-size: 16px;
        font-weight: normal !important;
    }

        .enr-rep-wrapper .guest-of span {
            color: #444 !important;
            font-weight: bold;
        }

    .enr-rep-wrapper #ReplicatedWorkPhone {
        color: #444;
        display: block;
    }

    .enr-rep-wrapper #ReplicatedEmail {
        color: #444;
    }

        .enr-rep-wrapper #ReplicatedEmail a {
            color: #3e3e3e;
        }

            .enr-rep-wrapper #ReplicatedEmail a:hover {
                color: #959595;
            }

    .enr-rep-wrapper #ctl00_ReplicatedURLLink {
        color: #444;
    }

        .enr-rep-wrapper #ctl00_ReplicatedURLLink a {
            color: #3e3e3e;
        }

            .enr-rep-wrapper #ctl00_ReplicatedURLLink a:hover {
                color: #959595;
            }

.guest-of span:first-child {
    font-weight: normal !important;
}

/*New Spinner/loader*/
.enr-loader,
.enr-loader:after {
    border-radius: 50%;
    width: 5em;
    height: 5em;
}

.enr-loader {
    margin: -8px auto;
    font-size: 10px;
    position: relative;
    text-indent: -9999em;
    border-top: 0.8em solid rgba(24, 145, 120, 0.2);
    border-right: 0.8em solid rgba(24, 145, 120, 0.2);
    border-bottom: 0.8em solid rgba(24, 145, 120, 0.2);
    border-left: 0.8em solid #189178;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-animation: load8 1.1s infinite linear;
    animation: load8 1.1s infinite linear;
}

@-webkit-keyframes load8 {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes load8 {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
    }
}
/*Styles for rep finder modal*/
#enr-popup-rep-finder {
    background-image: url(../../../fs-images/search-results-bg.png);
    background-position: top right;
    background-repeat: no-repeat;
}

    #enr-popup-rep-finder .DLResultsFieldData input {
        padding: 3px 10px;
        background-color: #000 !important;
    }

    #enr-popup-rep-finder .DLResultListingTable {
        background-color: #e2e2e2;
    }

    #enr-popup-rep-finder #lblDistributorLocator {
        color: white;
        text-transform: uppercase;
        font-size: 36px;
        font-weight: 400;
        text-align: left !important;
        line-height: 33px;
        margin: 3px 0 !important;
    }

    #enr-popup-rep-finder h2, #enr-popup-rep-finder h3 {
        text-align: left;
        line-height: 36px;
        margin: 3px 0 !important;
    }

    #enr-popup-rep-finder input[type="text"], #enr-popup-rep-finder input[type="password"] {
        height: 30px;
        display: block;
        margin-bottom: 5px;
        border-radius: 4px;
        background-color: transparent;
        width: 50%;
    }

    #enr-popup-rep-finder .shop-divider {
        margin-top: 20px;
        margin-bottom: 10px;
    }

.enr-modal-container {
    height: auto !important;
}

.enr-rep-search-button {
    min-width: 150px;
    max-width: 80% !important;
    height: auto;
    float: none !important;
    margin: 0 auto;
}

.enr-rep-search-results-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 230px;
}

.add-to-specials-container {
    padding: 10px 0;
}

    .add-to-specials-container label {
        display: block;
        margin-bottom: 5px;
        font-size: 16px;
        float: left;
        width: 100%;
        padding-left: 25px;
        position: relative;
        font-size: 12px;
        line-height: 16px;
    }

        .add-to-specials-container label input {
            position: absolute;
            font-size: 21px;
            left: 0;
            top: -4px;
            margin-left: 0;
        }

.enr-modal-container h2.section-subtitle {
    font-size: 18px;
    color: black;
}

.enr-info-text {
    color: cornflowerblue;
}

.enr-hilight-text {
    color: darkorange;
}

.enr-prod-desc {
    min-height: 105px;
}

.enr-EnrollmentProcessv4_Page6_aspx .enr-main-img-side {
    display: none;
}

.enr-EnrollmentProcessv4_complete_aspx .enr-main-img-side {
    display: none;
}

/*FINAL REVIEW PAGE*/
.cc-month,
.cc-year {
    padding: 0 !important;
    padding-right: 6px !important;
}

.review-form-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
}

    .review-form-wrapper .review-fields-a .selected-items-box .selected-items-label {
        font-weight: bold;
    }

    .review-form-wrapper .review-fields-a .payment-method-box .payment-card-dates .frame,
    .review-form-wrapper .review-fields-a .payment-method-box .payment-card-dates .trin-2 {
        padding: 0 !important;
    }

    .review-form-wrapper .review-fields-a .ssn-box {
        background-color: #0da5c5;
        color: #fff;
    }

        .review-form-wrapper .review-fields-a .ssn-box .section-display {
            color: white;
        }

    .review-form-wrapper .review-fields-b .codes-box .special-code,
    .review-form-wrapper .review-fields-b .codes-box .pin-number,
    .review-form-wrapper .review-fields-b .codes-box .apply-code {
        padding: 0 !important;
        padding-right: 6px !important;
    }

        .review-form-wrapper .review-fields-b .codes-box .apply-code input {
            line-height: 18px;
            font-size: 16px;
        }

    .review-form-wrapper .review-fields-b .codes-box #coupon_code_status .status-info-text,
    .review-form-wrapper .review-fields-b .codes-box #gift_cert_code_status .status-info-text {
        color: darkgoldenrod;
        font-weight: bold;
    }

    .review-form-wrapper .review-fields-b .totals-box {
        padding: 15px;
    }

        .review-form-wrapper .review-fields-b .totals-box .section-display {
            padding: 15px;
            background-color: #444;
            color: white;
            font-size: 45px;
            text-align: center;
            width: 100%;
        }

    .review-form-wrapper .review-fields-b .agree-box {
        background-color: #d4810e;
    }

        .review-form-wrapper .review-fields-b .agree-box label {
            font-weight: bold;
        }

        .review-form-wrapper .review-fields-b .agree-box .section-display {
            color: white;
        }

        .review-form-wrapper .review-fields-b .agree-box a:link {
            color: white;
        }

        .review-form-wrapper .review-fields-b .agree-box a:visited {
            color: white;
        }

        .review-form-wrapper .review-fields-b .agree-box a:hover {
            color: #444;
        }

        .review-form-wrapper .review-fields-b .agree-box a:active {
            color: white;
        }

    .review-form-wrapper .review-box {
        padding: 15px;
        margin-bottom: 15px;
        background-color: #fff;
        color: #464646;
        -webkit-transition: -webkit-box-shadow .25s;
        transition: -webkit-box-shadow .25s;
        transition: box-shadow .25s;
        transition: box-shadow .25s, -webkit-box-shadow .25s;
        border-radius: 2px;
        -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1), 0 3px 6px rgba(0, 0, 0, 0.1) !important;
        box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1), 0 3px 6px rgba(0, 0, 0, 0.1) !important;
    }

    .review-form-wrapper .checkbox-container {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

.selected-items-box .enrollment-item {
    padding: 0 !important;
    border-bottom: 1px solid #ccc;
    min-height: 80px !important;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
}

.selected-items-box .enr-prod-img {
    width: 80px;
    height: 80px;
}

.selected-items-box .enr-prod-info p {
    font-size: 16px;
}

.selected-items-box .enr-prod-name {
    font-weight: bold;
    margin-bottom: 8px;
}

.selected-items-box .enr-prod-desc {
    font-size: 12px !important;
    line-height: 13px;
    min-height: auto;
}

.selected-items-box .enr-item-select-details {
    float: right;
}

.selected-items-box .selected-items-header {
    background-color: #cfcfcf;
    padding: 6px;
}

.selected-items-box .selected-items-interval-header {
    background-color: #e2e2e2;
    padding: 6px;
}

    .selected-items-box .selected-items-interval-header .selected-items-label.selected-items-label {
        font-weight: normal;
    }

.totals-box {
    margin-bottom: 30px;
}

    .totals-box .rev-divTable {
        display: table;
        width: 100%;
    }

    .totals-box .rev-divTableRow {
        display: table-row;
    }

    .totals-box .rev-divTableHeading {
        background-color: #EEE;
        display: table-header-group;
    }

    .totals-box .rev-divTableCell, .totals-box .rev-divTableHead {
        border-bottom: 1px solid #999999;
        display: table-cell;
        padding: 6px 10px;
    }

    .totals-box .rev-divTableHeading {
        background-color: #EEE;
        display: table-header-group;
        font-weight: bold;
    }

    .totals-box .rev-divTableFoot {
        background-color: #EEE;
        display: table-footer-group;
        font-weight: bold;
    }

    .totals-box .rev-divTableBody {
        display: table-row-group;
    }

    .totals-box .rev-divTableCell.align-right {
        text-align: right;
    }

    .totals-box .rev-divTableCell.double-line {
        font-weight: bold;
        border-top: double black 8px;
        padding: 1em;
        margin: 1em;
    }

/* enrollment complete page*/
/* END enrollment complete page*/
/*CSS FOR VB SCRIPT INITIATED ERROR BOX*/
#ErrorBoxTitleContainer {
    color: white;
    padding-left: 15px;
    font-size: 16px;
    margin: 0;
}

#enr_popup_error header .shop-modal-close {
    position: absolute;
    right: 10px;
    top: 10px;
}

#enr_popup_error header .svg-close-icon path {
    fill: white !important;
}

#enr_popup_error p {
    color: white;
}

#enr_popup_error .product-modal-text,
#enr_popup_error .section-display {
    color: white;
}

#enr_popup_error {
    border: 60px solid rgba(0, 0, 0, 0.3);
    display: block;
    position: fixed;
    top: 100px;
    left: 50%;
    z-index: 2000;
    background: #fff;
    border-bottom: 1px solid #aaa;
    border-radius: 4px;
    -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
    box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
    border: 1px solid rgba(0, 0, 0, 0.1);
    background-clip: padding-box;
    max-width: 960px !important;
    height: auto;
    width: 100%;
    max-width: 800px !important;
    margin-top: -50px;
    /* Negative half of height. */
    margin-left: -400px;
    /* Negative half of width. */
}

    #enr_popup_error .svg-close-icon {
        width: 34px;
        height: 34px;
        float: right;
    }

    #enr_popup_error .btn-small.shop-modal-close {
        background-color: white;
        padding: 5px 20px;
        color: #444 !important;
        border-radius: 4px;
    }

    #enr_popup_error .product-modal-text {
        padding: 30px !important;
    }

    #enr_popup_error header {
        border-bottom: 1px solid rgba(255, 255, 255, 0.34);
        height: 50px;
    }

@media (max-width: 80em) {
    #enr_popup_error {
        display: block;
        position: fixed;
        top: 100px;
        left: 0;
        z-index: 2000;
        max-width: 900px !important;
        height: auto;
        width: 100%;
        max-width: 1400px !important;
        margin-top: -50px;
        /* Negative half of height. */
        margin-left: 0;
        /* Negative half of width. */
    }
}
/* MEDIA QUERIES*/
@media (max-width: 480px) {
    .enr-modal-container {
        width: 98% !important;
    }

        .enr-modal-container a.btn {
            display: block;
        }
}

@media (max-width: 50em) {
    .enr-main-img-side {
        display: none !important;
    }

    .enr-rep-wrapper {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        padding-bottom: 30px;
        height: auto;
    }
}
/*mobile for review page:*/
@media (max-width: 800px) {
    .review-form-wrapper {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .trin-2.review-fields-a,
    .trin-2.review-fields-b {
        width: 100% !important;
    }
}
/*END mobile for review page:*/
@media only screen and (min-width: 481px) and (max-width: 991px) {
    .enrollment-item .enr-prod-img {
        max-width: 180px;
        margin: 0 auto;
    }

    .enrollment-item {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }

        .enrollment-item.active-selection .check-svg {
            top: 0;
        }
}

@media (max-width: 800px) {
    .enr-modal-container .product-modal-img,
    .enr-modal-container .product-modal-text {
        width: 100% !important;
    }
}

.enr-EnrollmentProcessv4_Page5_aspx .enr-item-select-details {
    float: left !important;
    margin-left: 20px;
}

.enr-modal-container header h3.section-display {
    color: white;
}

.enr-modal-container header .svg-close-icon path {
    fill: white !important;
}

#enr_popup_error {
    background-clip: padding-box;
}

#specials_1,
#specials_2 {
    margin: 20px 0;
}

#AutoshipSelectionsContainer h3.section-display:after {
    content: ' ';
    display: block;
    border: 1px solid #cacaca;
    margin-bottom: 10px;
    margin-top: 2px;
}

#AutoshipSelectionsContainer h3.section-display {
    padding-top: 40px;
}

#errCVV2 .intructions-text {
    float: left;
}

span#errCVV2.intructions-text {
    float: left;
    position: absolute;
}

.enr-final .rev-divTableRow {
    border-bottom: 1px solid #ccc !important;
    margin-bottom: 10px !important;
}

.enr-sku-price {
    text-transform: uppercase;
    font-size: 26px;
    font-weight: 400;
    font-family: "Bebas Neue", sans-serif;
    color: #07a5c5;
}

.enr-prod-qty {
    font-size: 16px;
    font-weight: 400;
    color: #07a5c5;
    margin-top: 15px;
}

/*DG FEB 6*/
@media only screen and (max-width: 3280px) {
    .enr-modal-container .modal-body {
        overflow-y: visible;
        max-height: none;
    }

    .enr-modal-container.modal-detect {
        overflow-y: auto;
    }

        .enr-modal-container.modal-detect.modal-med footer {
            padding-bottom: 800px;
        }

        .enr-modal-container.modal-detect.modal-med {
            top: 0 !important;
        }

    .enr-item-select-button {
        display: block;
        margin-top: 20px;
        margin-bottom: 20px;
    }
}

.enr-modal-container.modal-detect.modal-med {
    top: 0 !important;
}

/*REP FINDER FIXES*/
.enr-rep-wrapper .guest-of span {
    display: block;
}

.enr-rep-wrapper #ctl00_ReplicatedURLLink {
    word-break: break-all;
    font-size: 12px;
}

.enr-find-rep-content h2 {
    text-align: center;
}

@media only screen and (max-width: 770px) {
    .enrollment-item,
    .selected-items-box .enrollment-item,
    .codes-box .date-wrapper {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }

        .codes-box .date-wrapper .trin-3,
        .codes-box .date-wrapper .trin-33,
        .codes-box .date-wrapper .trin-66 {
            width: 100%;
        }

        .enrollment-item .enr-prod-img {
            margin: 0 auto;
        }

    .dynamic-product-section .trin-33 img {
        max-width: 50%;
    }

    .dynamic-product-section .trin-66 {
        font-size: 12px;
        line-height: 18px !important;
    }
}
/*Fixes FEB10*/
.enr-item-select-button {
    text-align: center;
}

@media only screen and (max-width: 970px) {
    .enr-rep-wrapper .rep-info {
        margin-left: 0px;
    }

    .enr-billing-shipping-fields-wrapper .trin-3 {
        width: 100% !important;
    }
}
/*Dynamic product selection popup*/
@media only screen and (max-width: 770px) {
    .enrollment-item.active-selection .enr-item-select-button {
        float: none;
    }

    .dynamic-product-section .trin-33,
    .dynamic-product-section .trin-66,
    .trin-33.dynamic-kit-p-image {
        width: 100%;
    }

        .trin-33.dynamic-kit-p-image .enr-prod-img {
            width: 50%;
        }
}

@media only screen and (max-width: 970px) {
    .review-form-wrapper {
        padding: 0 !important;
    }

    .review-fields-a,
    .review-fields-b {
        padding: 0 !important;
    }

    #HTMLInjection_HEADER img[alt*=logo] {
        max-width: 200px !important;
    }

    #LegalLinksContainer a {
        display: block;
    }
}
/*
Details pop up scroll bar
*/
#MoreInfoContainer .modal-body {
    padding-bottom: 200px;
}

/*april 2021 line up product sections width of flex children and min-width prod photos*/
.enrollment-item .enr-prod-img {
    width: 100% !important;
    height: auto !important;
    min-width: 200px !important;
}

.enrollment-item .enr-prod-info {
    flex-grow: 1 !important;
}

.selected-items-box .enrollment-item .enr-prod-img {
    width: 80px !important;
    height: 80px !important;
    min-width: 80px !important;
}

.enrollment-item.active-selection .enr-item-select-button {
    width: 100% !important;
}

/* 4/16/2021 JTR Control Images in Telerik drop downs */
.rddlItemImg {
    height: 42px !important;
    width: 64px !important;
}

/*04/20/2021  DG  1.3 fix notices wrapping and pushing some fields down*/
.intructions-text {
    width: 100%;
    margin-top: -23px;
}

#enr-main #lnkAutoAssignReferrer.rep-finder-btn {
    background-color: #444;
    color: #fff;
    margin-top: 20px;
    font-size: 18px;
}

    #enr-main #lnkAutoAssignReferrer.rep-finder-btn:visited,
    #enr-main #lnkAutoAssignReferrer.rep-finder-btn:link {
        color: #fff;
        background-color: #444;
    }

    #enr-main #lnkAutoAssignReferrer.rep-finder-btn:hover,
    #enr-main #lnkAutoAssignReferrer.rep-finder-btn:active {
        color: #fff;
        background-color: #444;
    }

/*    04/11/2022  DG  1.5     Added classes for new auto referrer modal form for searching reps.*/

#finder-overlay {
    color: white;
    position: fixed;
    display: none;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 2;
    cursor: pointer;
    overflow: auto;
    padding: 40px;
}

    #finder-overlay #closeme {
        position: absolute;
        z-index: 99999;
        color: white;
        font-size: 120px;
        top: 50px;
        right: 30px;
        cursor: pointer;
    }
    /* Works on Firefox */

    #finder-overlay * {
        scrollbar-width: thin;
        scrollbar-color: #444 #ccc;
    }
        /* Works on Chrome, Edge, and Safari */

        #finder-overlay *::-webkit-scrollbar {
            width: 8px;
        }

        #finder-overlay *::-webkit-scrollbar-track {
            background: #444;
        }

        #finder-overlay *::-webkit-scrollbar-thumb {
            background-color: #ccc;
            border-radius: 20px;
            border: 2px solid #444;
        }

    #finder-overlay .form-width {
        width: 100%;
        max-width: 1100px;
        -ms-flex-item-align: center;
        -ms-grid-row-align: center;
        align-self: center;
        padding: 20px;
        height: auto;
        -ms-flex-negative: 2;
        flex-shrink: 2;
    }

    #finder-overlay .rep-search-results {
        background-color: black;
    }

    #finder-overlay .rep-field {
        height: 55px;
        width: 100%;
        background-color: transparent;
        padding-top: 20px;
        z-index: 88888
    }

    #finder-overlay .field-wrapper {
        background-color: rgba(0, 0, 0, 0.7);
        margin-bottom: 15px;
        position: relative
    }

        #finder-overlay .field-wrapper .rep-field {
            font-size: 15px;
            color: #2f9fff;
            padding-left: 20px;
            -webkit-box-sizing: border-box;
            box-sizing: border-box;
            border: none;
            height: 55px;
        }

        #finder-overlay .field-wrapper label {
            position: absolute;
            top: 0;
            left: 0;
            z-index: 99999;
            font-size: 15px;
            padding: 5px 10px 0;
        }

        #finder-overlay .field-wrapper textarea:focus,
        #finder-overlay .field-wrapper input:focus {
            outline: none;
        }

        #finder-overlay .field-wrapper input:-internal-autofill-selected {
            background-color: transparent;
        }

    #finder-overlay .search-form-1 {
        -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1;
    }

    #finder-overlay .search-form-2 {
        -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
        order: 2;
    }

    #finder-overlay .search-form-3 {
        -webkit-box-ordinal-group: 4;
        -ms-flex-order: 3;
        order: 3;
    }

    #finder-overlay .search-form-4 {
        -webkit-box-ordinal-group: 5;
        -ms-flex-order: 4;
        order: 4;
    }

    #finder-overlay .search-form-5 {
        -webkit-box-ordinal-group: 6;
        -ms-flex-order: 5;
        order: 5;
    }

    #finder-overlay .lu-listing {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        padding: 3px 0;
        background-color: #212121;
        cursor: pointer;
        margin-bottom: 10px;
    }

        #finder-overlay .lu-listing div {
            cursor: pointer;
        }

        #finder-overlay .lu-listing img {
            max-width: 60px;
            margin-left: 20px;
            margin-right: 20px;
            border-radius: 50%;
            -webkit-transform: scale(1);
            -ms-transform: scale(1);
            transform: scale(1);
            -webkit-transition: all .2s ease-in-out;
            -o-transition: all .2s ease-in-out;
            transition: all .2s ease-in-out;
            position: relative;
            z-index: 1;
        }

    #finder-overlay .lu-list.results-active {
        display: block !important;
    }

    #finder-overlay .details-0 {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
    }

    #finder-overlay .details-1,
    #finder-overlay .details-2 {
        padding: 4px;
    }

    #finder-overlay .select-me {
        margin-left: auto;
    }

        #finder-overlay .select-me a:link,
        #finder-overlay .select-me a:visited {
            text-decoration: none;
            width: auto;
            padding: 20px;
            background-color: #2f9fff;
            color: white;
            -webkit-transition: background-color 0.5s ease;
            -o-transition: background-color 0.5s ease;
            transition: background-color 0.5s ease;
        }

        #finder-overlay .select-me a:hover,
        #finder-overlay .select-me a:active {
            background-color: #5dabed;
            color: white;
        }

    #finder-overlay .result-name {
        font-size: 18px;
    }

    #finder-overlay .result-email,
    #finder-overlay .result-email a {
        color: #2f9fff;
    }

    #finder-overlay .locator-title {
        padding-right: 100px;
        margin-top: 40px;
    }

    #finder-overlay .submit-search {
        width: auto;
        padding: 5px 20px;
        border-radius: 3px;
        background-color: #2f9fff;
        color: white;
        border: none;
        -webkit-transition: background-color 0.5s ease;
        -o-transition: background-color 0.5s ease;
        transition: background-color 0.5s ease;
        margin-left: 10px;
    }

        #finder-overlay .submit-search:hover {
            background-color: #5dabed;
        }

    #finder-overlay .search-error {
        color: #b35c5c;
        font-style: italic;
        font-size: 14px;
        margin-bottom: 30px
    }

@media only screen and (max-width: 44em) {
    #finder-overlay {
        padding: 12px !important;
    }

        #finder-overlay .lu-listing {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -ms-flex-direction: column;
            flex-direction: column;
            -webkit-box-pack: start;
            -ms-flex-pack: start;
            justify-content: flex-start;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center;
            margin-bottom: 10px;
        }

        #finder-overlay .select-me a:link {
            width: 100%;
            max-width: 100px;
            padding: 5px !important;
            text-align: center !important;
            margin: 0 auto;
            display: block;
            margin-bottom: 10px
        }

        #finder-overlay .select-me {
            margin-left: initial;
            width: 100%;
        }

        #finder-overlay .details-0 {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            justify-content: center;
            width: 100%;
        }
}

.rep-search-wrap {
    width: 100%;
    display: none;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    position: relative;
    background-color: #232526;
    background: #232526;
    /* fallback for old browsers */
    /* Chrome 10-25, Safari 5.1-6 */
    background: -webkit-gradient(linear, left top, right top, from(#232526), to(#2f2f2f));
    background: -o-linear-gradient(left, #232526, #2f2f2f);
    background: linear-gradient(to right, #232526, #2f2f2f);
    border-radius: 40px;
}

/*    04/13/2022  DG  1.7     New Oval Spinner container/positioning and color*/

#down {
    padding: 10px 0;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
}

    #down svg#locator-search-spinner {
        align-self: center;
        margin-left: 10px;
        width: 28px;
        margin-bottom: 12px;
        stroke: #fff;
        visibility: hidden;
    }

    #down input {
        align-self: center
    }
