/**
 * Shortcode Block Style
 *
 * @package WordPress
 * @since BCCG 1.0
 * 
*/
.nf {
    font-family: var(--wp--preset--font-family--work-sans);
    width: 100%;
}

.nf .nf-form-content {
    padding: 0;
}

.nf .nf-form-fields-required {
    display: none;
}

.nf .nf-form-content textarea.ninja-forms-field {
    height: 6.94rem;
}

.nf #ninja_forms_required_items,
.nf .nf-field-container {
    margin-bottom: var(--wp--preset--spacing--20);
}

.nf .nf-form-content .listselect-wrap .nf-field-element div,
.nf-form-content .nf .ninja-forms-field {
    font-family: var(--wp--preset--font-family--work-sans);
    font-size: 17px;
}

.nf .nf-form-content .list-select-wrap .nf-field-element>div,
.nf .nf-form-content input:not([type=button]):not([type=submit]),
.nf .nf-form-content textarea {
    border: 0;
    border-bottom: 1px solid rgba(255, 255, 255, .3);
    color: var(--wp--preset--color--gray-contrast-1);
    background-color: transparent;
    font-family: var(--wp--preset--font-family--work-sans);
}

.nf .nf-form-content .list-select-wrap .nf-field-element>div:focus,
.nf .nf-form-content input:not([type=button]):not([type=submit]):focus,
.nf .nf-form-content textarea:focus {
    background-color: white;
    color: var(--wp--preset--color--base-one);
}

.nf .nf-form-content .list-select-wrap .nf-field-element>div::placeholder,
.nf .nf-form-content input:not([type=button])::placeholder,
.nf .nf-form-content textarea::placeholder {
    color: white;
    font-style: italic;
}

.nf .nf-error .nf-error-msg,
.nf .nf-error-msg,
.nf .ninja-forms-req-symbol {
    font-size: var(--wp--preset--font-size--x-small);
}

.nf .nf-form-content button,
.nf .nf-form-content input[type=button],
.nf .nf-form-content input[type=submit] {
    border: 1px;
    border-style: solid;
    cursor: pointer;
    font-weight: 600;
    font-family: var(--wp--preset--font-family--work-sans);
    letter-spacing: 2px;
    text-transform: uppercase;
    padding: 15px 25px;
}

.nf.v1 .nf-form-content button,
.nf.v1 .nf-form-content input[type=button],
.nf.v1 .nf-form-content input[type=submit] {
    background-color: var(--wp--preset--color--white);
    border-color: var(--wp--preset--color--white);
    color: var(--wp--preset--color--base-one);
    font-size: var(--wp--preset--font-size--semi-small);
}

.nf.v1 .nf-form-content button,
.nf.v1 .nf-form-content input[type=button]:hover,
.nf.v1 .nf-form-content input[type=submit]:hover {
    background-color: var(--wp--preset--color--secondary);
    border-color: var(--wp--preset--color--secondary);
    color: white;
}

.nf.subscribe .nf-form-content button,
.nf.subscribe .nf-form-content input[type=button],
.nf.subscribe .nf-form-content input[type=submit] {
    background-color: transparent;
    border-color: white;
    color: white;
    font-size: var(--wp--preset--font-size--x-small);
}

.nf.subscribe .nf-form-content button,
.nf.subscribe .nf-form-content input[type=button]:hover,
.nf.subscribe .nf-form-content input[type=submit]:hover {
    background-color: white;
    color: var(--wp--preset--color--base-one);
}

.nf .nf-form-content .listselect-wrap .nf-field-element div,
.nf .nf-form-content input.ninja-forms-field,
.nf .nf-form-content select.ninja-forms-field:not([multiple]) {
    height: 53px;
    line-height: 1;
}

.nf.quote .nf-form-content .list-select-wrap .nf-field-element>div,
.nf.quote .nf-form-content input:not([type=button]):not([type=submit]),
.nf.quote .nf-form-content textarea {
    background-color: var(--wp--preset--color--white);
}

.nf.quote .nf-field-container.optional .nf-field-label::after {
    content: "(optional)";
    display: inline-block;
    position: relative;
    font-size: .833rem;
    font-style: italic;
}

.nf.quote .nf-field-label>label,
.nf.quote .nf-field-label>span {
    color: var(--wp--preset--color--base-one);
    font-size: .833rem;
}

.nf.quote .ninja-forms-req-symbol {
    color: var(--wp--preset--color--secondary)
}

.nf.quote .submit-container {
    text-align: center;
}

.nf.quote .nf-form-content button,
.nf.quote .nf-form-content input[type=button],
.nf.quote .nf-form-content input[type=submit] {
    background-color: var(--wp--preset--color--secondary);
    border-color: var(--wp--preset--color--secondary);
}

.nf.quote .nf-form-content button:hover,
.nf.quote .nf-form-content input[type=button]:hover,
.nf.quote .nf-form-content input[type=submit]:hover {
    background-color: var(--wp--preset--color--darker-secondary);
    border-color: var(--wp--preset--color--darker-secondary);
    color: var(--wp--preset--color--white)
}

.nf.quote .nf-error-msg {
    text-align: center;
}

.nf.quote .nf-error .nf-error-msg {
    text-align: left;
}