/* global button */
button.button,
a.button,
.dynamics-form form button.lp-form-button,
input[type="submit"] {
    font-family: 'Brown', sans-serif;
    font-size: 1rem;
    font-weight: 800;
    text-transform: uppercase;
    border-width: 0.125rem;
    border-style: solid;
    border-radius: var(--standard-border-radius);
    text-decoration: none;
    display: inline-block;
    margin-left: 1rem;
    transition: ease all 0.2s;
    cursor: pointer;
}
button.button:first-of-type,
a.button:first-of-type,
.dynamics-form form button.lp-form-button,
input[type="submit"] {
    margin-left: 0;
}
button.button,
a.button:hover,
a.button:active {
    text-decoration: underline;
}
a.button.small-button {
    font-size: 0.938rem;
    padding: 0.75rem 1.625rem;
}

.dynamics-form form button.lp-form-button {
    height: unset;
    width: unset;
}

.nwInsertAgentContentHere input[type="submit"] {
    height: unset;
}




    /* shared styles between various buttons */
button.primary-button,
a.primary-button,
a.secondary-button,
a.tertiary-button,
.dynamics-form form button.lp-form-button,
input[type="submit"] {
    padding: 0.938rem 2.188rem;
}

button.primary-button,
a.primary-button,
a.secondary-button,
a.tertiary-button,
a.ghost-button,
.dynamics-form form button.lp-form-button,
input[type="submit"] {
    line-height: 1rem;
    margin-bottom: 1.375rem;
}
button.primary-button.disabled,
a.primary-button.disabled,
a.primary-button.disabled:hover,
a.secondary-button.disabled,
a.secondary-button.disabled:hover {
    background-color: var(--grey-disabled-primary);
    color: var(--grey-disabled-secondary);
    border-color: var(--grey-disabled-primary);
}

a.ghost-button.disabled,
a.ghost-button.disabled:hover,
a.text-button.disabled,
a.text-button.disabled:hover {
    color: var(--grey-disabled-primary);
    background-color: var(--white);
}

a.button.ghost-button,
a.button.ghost-button:hover,
a.button.ghost-button:active {
    text-decoration: underline !important;
}

a.button.ghost-button,
a.button.text-button {
    text-transform: none;
}


/* primary button */
button.primary-button,
a.primary-button {
    background-color: var(--secondary-yellow);
    color: var(--grey-darkest);
    border-color: var(--secondary-yellow);
    opacity: 0.999999;
}
button.primary-button:hover,
button.primary-button:active,
a.primary-button:hover,
a.primary-button:active {
    /*background-color: var(--white);*/
    scale: 1.04;
}


/* secondary button */
a.secondary-button,
.dynamics-form form button.lp-form-button,
input[type="submit"] {
    background-color: var(--primary-blue);
    color: var(--white);
    border-color: var(--primary-blue);
    opacity: 0.999999;
}
a.secondary-button:hover,
a.secondary-button:active {
    background-color: var(--white);
    color: var(--primary-blue);
    scale: 1.04;
}

.dynamics-form form button.lp-form-button:hover,
input[type="submit"]:hover {
    background-color: transparent;
    color: var(--primary-blue);
}


/* tertiary button */
a.tertiary-button {
    background-color: transparent;
    color: black;
    /*border-color: black;*/
    border-color: #bfbfbf;
    opacity: 0.999999;
}
a.tertiary-button:hover,
a.tertiary-button:active {
    /*background-color: black;*/
    background-color: #bfbfbf;
    color: var(--white);
    scale: 1.04;
}
a.tertiary-button.disabled,
a.tertiary-button.disabled:hover {
    background-color: transparent;
    color: var(--grey-disabled-secondary);
    border-color: var(--grey-disabled-secondary);
}


/* white button */
a.button.btn-white {
    color: white;
    border-color: white;
    background-color: transparent;
}
a.button.btn-white:hover {
    background-color: white;
    color: var(--grey-darkest);
}

/* ghost button */
a.ghost-button {
    color: var(--primary-blue);
    background-color: var(--white);
    border-color: var(--white);

    padding: 0.625rem 0.938rem;
}
a.ghost-button:hover {
    border-color: var(--grey-lightest);
    background-color: var(--grey-lightest);
}
a.ghost-button:active {
    border-color: var(--primary-blue);
    background-color: var(--white);
}
a.ghost-button.disabled,
a.ghost-button.disabled:hover {
    border-color: var(--white);
}


/* text button */
a.text-button {
    color: var(--primary-blue);
    background-color: transparent;
    border: none;
}
a.text-button:hover,
a.text-button:active {
    color: var(--primary-red);
    background-color: transparent;
}

a.button.text-button,
a.button.text-button:hover,
a.button.text-button:active {
    border-bottom-width: 0.125rem;
    border-bottom-style: solid;
    border-radius: 0;
}
a.button.text-button {
    border-bottom-color: var(--primary-blue);
}
a.button.text-button:hover,
a.button.text-button:active {
    border-bottom-color: var(--primary-red);
}
a.text-button.disabled,
a.text-button.disabled:hover {
    border-bottom-color: var(--grey-disabled-primary);
}

div.banner-cta-buttons a.button.secondary-button {
    border-color: var(--white) !important;
    background-color: var(--white) !important;
    color: var(--grey-darkest) !important;
}
div.banner-cta-buttons a.button.secondary-button:hover,
div.banner-cta-buttons a.button.secondary-button:active {
    border-color: var(--white) !important;
    background-color: transparent !important;
    color: var(--white) !important;
}

div.banner-cta-buttons a.button.tertiary-button,
a.button.transparent-button {
    color: var(--white) !important;
    border-color: var(--white) !important;
    background-color: transparent !important;
}
div.banner-cta-buttons a.button.tertiary-button:hover,
div.banner-cta-buttons a.button.tertiary-button:active,
a.button.transparent-button:hover,
a.button.transparent-button:active {
    color: var(--grey-darkest) !important;
    border-color: var(--white) !important;
    background-color: var(--white) !important;
}

div.banner-cta-buttons a.button.text-button {
    color: var(--white) !important;
    border-bottom-color: var(--white) !important;;
}
div.banner-cta-buttons a.button.text-button:hover,
div.banner-cta-buttons a.button.text-button:active {
    color: var(--primary-red) !important;
    border-bottom-color: var(--primary-red) !important;
}

button.button.small-arrow,
a.button.small-arrow {
    font-size: 20px;
    font-family: "Brown", sans-serif;
    position: relative;
    line-height: 24px;
    font-weight: 500;
    color: #397CCF;
    border: none;
    padding: 0;
    margin-bottom: 15px;
    text-transform: none;
    background: transparent;
    text-decoration: none !important;
}
button.button.small-arrow::after,
a.button.small-arrow::after {
    content: '';
    top: 50%;
    transform: translateY(-50%);
    position: absolute;
    right: -16px;
    width: 8px;
    height: 13px;
    background-image: url('../image/small-aroow.svg');
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}

button.small-white-button-link,
a.small-white-button-link {
    padding: 10px 20px;
    line-height: 1;
    font-size: 16px;
    display: block;
    border: 1px solid #d8d8d8;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
    max-width: 100%;
    white-space: normal;
    margin-bottom: 5px;
    border-radius: 6px;
    font-weight: 500;
    background-color: white;
    color: var(--black);
}
div.content-area a:not(.button).small-white-button-link {
    text-decoration: none !important;
}
@media(max-width: 575.98px) {
    button.small-white-button-link,
    a.small-white-button-link {
        padding: 9px 14px;
        line-height: 1;
        font-size: 15px;
    }
}