/*
 * ValueCheck Inc.
 * Styles for html elements and page layout
 * Also styles for app navigation, tabs, tables
 * Version: VC.1.0 
 */

/* Reset
  =============== */
html {
    box-sizing: border-box;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

:root {
    --accent-color: #ff4444;
    --accent-color-dark: #ff0000;
    --accent-font-color: #ffffff;
}

/* Scaffolding
  =============== */
html {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font: normal normal normal 1rem/1.5 -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, sans-serif;
    /* browser default is 16px */
    font-size: 1rem;
    line-height: 1.5;
}

button,
input,
optgroup,
select,
textarea {
    line-height: 1.5;
}

body {
    color: #404040; /* Default color text */
    background: white; /* Default page background color */
    font-size: 1rem;
}

p,
ol,
ul,
dl,
table {
    margin: 0 0 1rem 0;
}

ul li ul {
    margin-bottom: 0;
}

ol li ol {
    margin-bottom: 0;
}

h1,
h2,
h3,
h4,
h5 {
    margin: 0 0 1rem 0;
    font-weight: 600;
    font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, sans-serif;
    line-height: 1.25;
    color: #404040;
}

h1:first-child,
h2:first-child,
h1:first-of-type,
h2:first-of-type {
    margin-top: 1rem;
}

/* Typography and fonts */

html * {
    font-family: "Open Sans", sans-serif;
    font-feature-settings: "liga" 0; /*  2020-12-14  overholt   This setting is necessary for ABCPdf gecko engine to not mess up strings like "fi" because it is interpretting it to be a ligature: https://en.wikipedia.org/wiki/Typographic_ligature */
}

h1,
h2,
h3,
h4,
h5,
h6,
h3 * {
    font-family: "Raleway", sans-serif;
}

h1 {
    font-size: 1.75rem;
}

h2 {
    font-size: 1.5rem;
}

h3 {
    font-size: 1.25rem;
}

h4 {
    font-size: 1.125rem;
}

h5 {
    font-size: 1rem;
}

@media (max-width: 600px) {
    h1 {
        font-size: 1.25rem;
    }
    h2 {
        font-size: 1.125rem;
    }
    h3 {
        font-size: 1rem;
    }
    h4 {
        font-size: 1rem;
    }
    h5 {
        font-size: 1rem;
    }
}

a {
    color: #0366ee; /* Default color */
    text-decoration: none;
}
a:hover,
a:active,
a:focus {
    color: #0246a2;
    text-decoration: underline;
}

hr {
    height: 0;
    border: 0;
    border-top: 1px solid #dedede;
}

/* Containers */

.container-full {
    max-width: 100%;
    padding: 0 1rem;
}

.container,
.container-sm,
.container-md {
    max-width: 1600px;
    padding: 0 1rem;
    margin-left: auto;
    margin-right: auto;
}

.container-sm {
    max-width: 800px;
    padding: 0;
}

.container-md {
    max-width: 1200px;
}

@media (min-width: 600px) {
    .content-section {
        padding: 60px 0;
    }
}

/* Flex containers, rows and columns
================================== */

/* Flex container basic, no margins, etc. */

.flex {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
}

.flex > [class^="flex-"] {
    flex: 0 1 100%; /* unit on third item, flex-basis i.e. width, needed for IE 11 */
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: 100%;
    max-width: 100%; /* max-width needed for IE 11 */
    margin-bottom: 0;
}

.flex > .flex-1-2 {
    flex-basis: 50%;
    max-width: 50%;
}
.flex > .flex-1-4 {
    flex-basis: 25%;
    max-width: 25%;
}
.flex > .flex-3-4 {
    flex-basis: 75%;
    max-width: 75%;
}
.flex > .flex-1-3 {
    flex-basis: calc(100% / 3 * 1);
    max-width: calc(100% / 3 * 1);
}
.flex > .flex-2-3 {
    flex-basis: calc(100% / 3 * 2);
    max-width: calc(100% / 3 * 2);
}

.flex > .flex-inline {
    flex: 0 1 auto; /* width of content */
}

/* Flex container as row, margins, stacking, etc. */

.flex-row {
    /* negative margin causes issue with horiz scroll */
    /*margin-left: -1rem;
  margin-right: -1rem;*/
}

.flex-row {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

/* flex items as columns */

/* Mobile small screens first */
/* Flex items stack on small screens */
.flex-row > [class^="flex-"] {
    flex: 0 1 100%; /* unit on third item, flex-basis i.e. width, needed for IE 11 */
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: 100%;
    max-width: 100%;
    margin-bottom: 0;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}
/* nested flex-row margins */
.flex-row .flex-row > [class^="flex-"] {
    margin-bottom: 0;
}

/* Small screen breakpoint */
@media (min-width: 520px) {
    /* flex-row items have bottom margins */
    .flex-row > [class^="flex-"] {
        margin-bottom: 0.5rem;
    }
    /* nested flex-row no margins */
    .flex-row .flex-row > [class^="flex-"] {
        margin-bottom: 0 !important;
    }
    .flex-row > .flex-small {
        flex-basis: 50%;
        max-width: 50%;
    }
    .flex-row > .flex-1-2 {
        flex-basis: 50%;
        max-width: 50%;
    }
    .flex-row > .flex-qtr {
        flex-basis: 25%;
        max-width: 25%;
    }
    .flex-row > .flex-three-qtr {
        flex-basis: 75%;
        max-width: 75%;
    }
    .flex-row > .flex-1-4 {
        flex-basis: 25%;
        max-width: 25%;
    }
    .flex-row > .flex-2-4 {
        flex-basis: 50%;
        max-width: 50%;
    }
    .flex-row > .flex-3-4 {
        flex-basis: 75%;
        max-width: 75%;
    }
    .flex-row > .flex-2-5 {
        flex-basis: 40%;
        max-width: 40%;
    }
    .flex-row > .flex-3-5 {
        flex-basis: 60%;
        max-width: 60%;
    }
    .flex-row > .flex-1-3 {
        flex-basis: calc(100% / 3 * 1);
        max-width: calc(100% / 3 * 1);
    }
    .flex-row > .flex-2-3 {
        flex-basis: calc(100% / 3 * 2);
        max-width: calc(100% / 3 * 2);
    }
    .flex-row > .flex-auto {
        flex: 0 1 auto; /* width of content */
    }
}

/* Medium size screen breakpoint */
@media (min-width: 850px) {
    .flex-row > .flex-1-3-md {
        flex-basis: calc(100% / 3 * 1);
        max-width: calc(100% / 3 * 1);
    }
    .flex-row > .flex-2-3-md {
        flex-basis: calc(100% / 3 * 2);
        max-width: calc(100% / 3 * 2);
    }
}

/* Large size screen breakpoint */
@media (min-width: 1000px) {
    .flex-row > .flex-large {
        flex-basis: 50%;
        max-width: 50%;
    }
}

/* Inline elements in flex rows */
.flex-row > .flex-inline {
    flex: 0 1 auto; /* width of content */
    flex-basis: auto !important;
}

/* Flex rows with tables */
@media screen and (max-width: 520px) {
    .flex-row div:nth-child(1) table {
        margin: 0.5rem 0 0 0;
    }
    .flex-row div:nth-child(2) table {
        margin: 0 0 0.5rem 0;
    }
    .flex-row div:nth-child(2) table .brand-border-top {
        border-top: none;
    }
    /* Reverse table stripes when tables stack on small screens */
    .flex-row div:nth-child(2) table.table-striped tbody tr:nth-of-type(2n + 1) {
        background-color: #f8f8f8;
    }
    .flex-row div:nth-child(2) table.table-striped tbody tr:nth-child(2n) {
        background-color: rgba(0, 0, 0, 0.05);
    }
    /* Align table columns when tables stack */
    .flex-row div table tr td:nth-child(1) {
        width: 50%;
    }
}

/* Layout
  =============== */

/* Page content styles */

#content,
.page-content {
    max-width: 1600px;
    margin: 0 auto;
    padding: 0 0.5rem 0.5rem;
    /*min-height: calc(100vh - 12.875rem);*/ /* less height of footer and header */
    min-height: calc(100vh - 16.375rem); /* less height of footer and header */
}

article {
    max-width: 1600px;
    margin: 0 auto;
    padding: 0.5rem;
}

/* Footer styles */

footer {
    min-height: 3rem;
    background: #444444; /* Custom color */
    margin: 0 auto;
    padding: 1rem 1rem 0;
}

.footer-container {
    max-width: 1600px;
    margin: 0 auto;
}

footer p {
    font-size: 0.825rem;
    margin-bottom: 0.5rem;
    color: #eee; /* Custom color */
    font-weight: bold;
    /*text-align: center;*/
}

footer h5 {
    margin-bottom: 0.5rem;
    color: #eee; /* Custom color */
    font-size: 0.875rem;
    text-transform: uppercase;
}

footer a {
    color: #eee; /* Custom color */
}

footer a:hover,
footer a:active,
footer a:visited {
    color: #eee;
}

footer a i {
    font-size: 1.25rem;
    margin-right: 0.5rem;
}

/* Panels for content groups, sidebars */

.panel {
    background-color: #f0f3f5;
    background: radial-gradient(#fff 50%, #f0f3f5); /* Default color */
    background-clip: border-box;
    border: 1px solid rgba(0, 0, 0, 0.125);
    border-radius: 0.25rem;
    overflow: hidden;
}

.panel-head,
.panel-heading {
    padding: 0.5rem;
    min-height: 1.5rem;
}

.panel-body {
    padding: 0.5rem 1rem;
}

/* Buttons
  =============== */
.button,
a.button {
    -webkit-appearance: none;
    display: inline-block;
    border: 1px solid #0366ee; /* #0366EE Custom color */
    border-radius: 4px;
    background: 0366EE; /* #0366EE Custom color */
    color: #fff;
    font-weight: 600;
    /*font-family: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Helvetica, Arial, sans-serif;*/
    font-size: 1rem;
    text-transform: none;
    padding: 0.75rem 1.25rem;
    margin: 0 0 0.5rem 0;
    vertical-align: middle;
    text-align: center;
    cursor: pointer;
    text-decoration: none;
    line-height: 1;
}

/* Button - disabled */
.button:disabled,
button:disabled,
[type="button"]:disabled,
.button:disabled:hover,
button:disabled:hover,
[type="button"]:disabled:hover {
    border: 1px solid #777;
    background: #777; /* Default gray color */
    color: #ddd;
}

/* Button - disabled class */
.button.disabled,
button.disabled {
    border: 1px solid #777; /* Custom color dk (Same as pseudo) */
    background: #777;
    color: #ddd;
}

/* Button - hover, active, focus */
.button:hover,
a.button:hover,
button:hover,
[type="submit"]:hover,
[type="reset"]:hover,
[type="button"]:hover,
.button:active,
a.button:active,
button:active,
[type="submit"]:active,
[type="reset"]:active,
[type="button"]:active,
.button:focus,
a.button:focus,
button:focus,
[type="submit"]:focus,
[type="reset"]:focus,
[type="button"]:focus {
    border: 1px solid #0250bc; /* #0250bc Custom color */
    background: #0250bc; /* #0250bc Custom color */
    color: #ffffff;
    text-decoration: none;
}

/* Button - active class */
.button.active,
button.active {
    border: 1px solid #bbb; /* Custom color dk (Same as pseudo) */
    background: #bbb;
    color: #ffffff;
}

.button::-moz-focus-inner,
a.button::-moz-focus-inner {
    border: 0;
    padding: 0;
}

.accent-button,
a.accent-button {
    color: #ffffff;
    border: 1px solid #ccc; /* #0aa653 Custom color */
    background: #ccc;
} /* #0aa653 Custom color */

.accent-button:hover,
.accent-button:focus,
.accent-button:active,
a.accent-button:hover,
a.accent-button:focus,
a.accent-button:active {
    color: #ffffff;
    border: 1px solid #bbb; /* #088c46 Custom green */
    background: #bbb;
} /* #088c46 Custom green */

.button-outline,
a.button-outline {
    background: transparent;
    color: #ccc; /* #0366EE Custom color */
}

.button-outline:hover,
.button-outline:focus,
.button-outline:active,
a.button-outline:hover,
a.button-outline:focus,
a.button-outline:active {
    background: transparent;
    color: #bbb; /* #0250bc Custom color */
}

.accent-button-outline,
a.accent-button-outline {
    background: transparent;
    color: #ccc; /* #0aa653 Custom color */
}

.accent-button-outline:hover,
.accent-button-outline:focus,
.accent-button-outline:active,
a.accent-button-outline:hover,
a.accent-button-outline:focus,
a.accent-button-outline:active {
    background: transparent;
    color: #bbb; /* #088c46 Custom color */
}

.muted-button,
a.muted-button {
    background: transparent; /* Default color */
    border: 1px solid #cdcdcd;
    color: #4e4e4e;
}
.muted-button:hover,
.muted-button:focus,
.muted-button:active,
a.muted-button:hover,
a.muted-button:focus,
a.muted-button:active {
    color: #4e4e4e;
    border: 1px solid #818181;
    background: transparent;
}

.button-sm,
a.button-sm,
[type="button"].button-sm {
    padding: 0.5em 0.5em;
    margin: 0 0 0.25em 0;
    font-size: 0.875rem;
    white-space: nowrap;
}

@media (max-width: 600px) {
    .button-sm {
        margin: 0 0.125em;
        padding: 0.25rem;
        font-size: 0.75rem;
    }
}

/* Forms
  =============== */
input,
select,
textarea {
    font-size: 1rem;
    margin-bottom: 0.5rem;
}

/* Custom input fields */
input.input-custom,
select.input-custom,
textarea.input-custom {
    display: block;
    border: 1px solid #cdcdcd;
    border-radius: 4px;
    padding: 0.25rem;
    outline: none;
    width: 100%;
    min-height: 2.5rem; /* selects need height, defined blow */
}

.input-custom:hover {
    border: 1px solid #b4b4b4;
}

.input-custom:focus,
.input-custom:active {
    border: 1px solid #0366ee;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1), 0 0 6px #8cbcfe;
}

textarea {
    overflow: auto;
    height: auto;
}

fieldset {
    border: 1px solid #dedede;
    border-radius: 4px;
    background: radial-gradient(#fafafa 50%, #f0f3f5); /* Default color gradient */
    padding: 0.5rem;
    margin: 0 auto 1rem;
}

legend {
    padding: 0 0.5rem;
    font-weight: 600;
}

/* Custom selects */

select.input-custom {
    color: #404040;
    -webkit-appearance: none;
    -moz-appearance: none;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAKCAYAAAC5Sw6hAAAACXBIWXMAAAsSAAALEgHS3X78AAAAZklEQVQokZXO0Q2AIAxF0WviIIziJq7iKDjpM0ZFLVZKk/IB5OQOwEJjJDX/jEAC5urlnrW6cWaH9LNJEq09DsgOlCPIE/KqQjUFcqrCNRayVeGaF2Squmq+oKuqq6aCTmzqRSSxAe95WeEbZjehAAAAAElFTkSuQmCC) right center no-repeat, rgb(255, 255, 255);
    /*background: url("data:image/svg+xml;utf8, <svg xmlns='http://www.w3.org/2000/svg' viewBox='-8 -10 32 32'><polygon points='7 10 0 0 14 0 7 10' fill='%23003576'/></svg>") right center no-repeat;*/
    padding-right: 1rem;
}

select.input-custom::-ms-expand {
    display: none;
}

/* Selects with size > 1 */
/* #SelOptions select, #FieldListTable select */
select[size]:not([size="1"]) {
    -webkit-appearance: initial;
    -moz-appearance: initial;
    background: initial;
    display: initial;
}

input[type="range"] {
    /*width: 100%;*/
    border: none !important;
}

label {
    font-weight: 600;
    max-width: 100%;
    display: inline-block;
    margin: 0 0 0.5rem 0;
} /* same as input for vertical center */

.has-error,
.has-error:hover,
.has-error:focus,
.has-error:active {
    border: 1px solid #d33c40;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1), 0 0 6px #f4cecf;
}

::-webkit-input-placeholder,
::-moz-placeholder,
:-moz-placeholder,
:-ms-input-placeholder {
    color: #9a9a9a;
}

/* Custom VC form styles */

.input-custom.missingRequired,
.input-custom.missingRequired:focus,
.input-custom.missingRequired:active {
    border: 1px solid #dc3545;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1), 0 0 6px #fc8b96;
}

span.orderData {
    display: inline-block;
    margin-bottom: 0.5rem;
}

/* Custom modern browser message */

#browserMessage {
    position: absolute;
    left: 50%;
    margin-left: -30%;
    width: 60%;
}

.notice {
    background: #990820; /*#f9f0ff*/ /* Default color */
    border: 1px solid #f8d7da;
    color: #ffffff;
    font-weight: bold;
    padding: 0.5rem;
    margin-bottom: 1rem;
    border-radius: 0.25rem;
}

/* Custom order form messages */

div.message-container {
    max-width: 800px;
    margin: 0 auto;
    margin-bottom: 1rem;
    text-align: center;
    font-weight: bold;
}

div.message-container * {
    transition-property: none;
}

#orderMessage {
    width: 100%;
}

#orderMessage.redText {
    display: inline-block;
    color: #990820; /* Default color dk red */
    border-radius: 0.25rem;
    padding: 0.5rem;
    background-color: #f8d7da; /* Default color lt red */
}

#orderMessage:not(:empty):not(.redText) {
    display: inline-block;
    color: #004085; /* Default color dk blue */
    border-radius: 0.25rem;
    padding: 0.5rem;
    background-color: #cce5ff; /* Default color lt blue */
}

#orderMessage:empty {
    padding: 0 !important;
    border-radius: 0;
}

/* Custom order file upload messages */

.uploadContainer:not(:empty) {
    margin: 0 auto;
    border-radius: 0.25rem;
    background-color: #cce5ff; /* Default color lt blue */
    padding: 0.5rem;
    font-size: 0.8125rem;
    color: #004085;
}

.uploadContainer:empty {
    padding: 0 !important;
    border-radius: 0;
}

.uploadContainer .vcts-uploadFile {
    border-bottom: 1px solid #eee;
    margin-bottom: 0.25rem;
    padding: 0.25rem 0;
}

.uploadContainer .vcts-uploadFile span {
    display: inline-block;
}

.uploadContainer .vcts-uploadFile span.vcts-uploadFileDelete {
    cursor: pointer;
    margin-left: 0.25rem;
}

/* Order form system notes */

div.vc-notes {
    max-width: 1400px;
    margin: 0 auto;
    margin-bottom: 1rem;
    text-align: center;
    font-size: 0.75rem;
}

div.vc-notes * {
    transition-property: none;
}

div.vc-notes #orderReturn:not(:empty) {
    display: inline-block;
    text-align: left;
    color: #003576; /* Default color dk blue */
    border-radius: 0.25rem;
    padding: 0.5rem;
    background-color: #eee;
}

/* Search form system notes */

div#SearchStatus {
    margin: 0 auto;
    margin-bottom: 0.5rem;
    max-width: 1200px;
    text-align: center;
    color: #003576; /* Default color dk blue */
    border-radius: 0.25rem;
    padding: 0.5rem;
    background-color: #eee;
}

/* Order summary table */

#orderSummarySection {
    max-width: 1400px;
    margin: 0 auto;
    margin-bottom: 1rem;
}

/* Inline checkbox and radio */

.form-check {
    position: relative;
    display: block;
    padding-left: 1.125rem;
}

.form-check > input,
.form-check-sub > input {
    position: absolute;
    margin-top: 0.4125rem; /* .675rem */
    margin-left: -1.125rem;
}

/* Checkbox with radio sub-items */

.form-check-sub {
    margin-left: 2rem;
    position: relative;
    display: block;
    padding-left: 1.125rem;
}

.form-check-sub > label {
    margin-bottom: 0;
    font-weight: normal;
}

@media (max-width: 520px) {
    fieldset p {
        margin-bottom: 0.25rem;
    }
}

/* Fieldsets */

fieldset {
    max-width: 1400px;
}

.fieldset-sm {
    max-width: 800px;
}

.fieldset-group {
    /* To Do - make this a general container-group */
    border: 1px solid #dedede;
    background: radial-gradient(#fff 50%, #f0f3f5); /* Default color gradient */
    padding-top: 1rem;
    padding-bottom: 1rem;
    display: table-cell;
    width: 100%;
}

/* Form sections and groups */

.form-section {
}

.form-group.flex-row {
    margin-bottom: 0.5rem;
}

.form-heading {
}

.form-sub-heading {
    font-size: 85%;
    font-weight: normal;
    display: inline-block;
}

/* Fieldsets with flex rows and cols */

fieldset .form-group.flex-row {
    align-items: center;
}

fieldset .form-group.flex-row > .flex-small {
    padding: 0.25rem 0.5rem;
}

/* Form labels */
fieldset .form-group.flex-row .flex-1-3,
.panel .form-group.flex-row .flex-1-3 {
    text-align: left;
}

@media (min-width: 520px) {
    fieldset .form-group.flex-row .flex-1-3,
    .panel .form-group.flex-row .flex-1-3 {
        text-align: right;
    }
    fieldset .form-group.flex-row .flex-1-3 > .d-flex,
    .panel .form-group.flex-row .flex-1-3 > .d-flex {
        justify-content: flex-end;
    }
}

/* Fieldsets with nested flex-rows */

fieldset .form-group.flex-row .flex-row {
    align-items: center;
}

.align-top {
    align-items: initial !important;
}

.align-center {
    align-items: center;
}

fieldset .form-group.flex-row .flex-row > [class^="flex-"] {
    padding-left: 0;
}

fieldset .form-group.flex-row .flex-row label {
    font-weight: normal;
}

/* Fieldset text */

fieldset h3 {
    margin-bottom: 1rem;
}
fieldset h3.form-section-heading,
fieldset h4.form-group-heading {
    border-bottom: 2px solid #163d7a;
    margin: 0.5rem 0 1rem 0;
}
fieldset .form-group button,
fieldset .form-group [type="submit"],
fieldset .form-group [type="button"] {
    margin: 0 0.25rem 0.5rem 0.25rem;
}

fieldset .form-group.flex-row > [class^="flex-"] span {
    display: inline-block;
    margin-bottom: 0.5rem;
}

@media (max-width: 520px) {
    .form-group.flex-row {
        margin-bottom: 0.25rem;
    }
    fieldset .form-group.flex-row > .flex-small {
        padding: 0.125rem 0.25rem;
    }
}

/* Fieldsets with tables  */

fieldset > table,
fieldset > table table {
    margin: 0;
}

/* Styles to size form fields */

@media (min-width: 520px) {
    input.input-custom,
    select.input-custom,
    [type="*"].input-custom {
        /*max-width: 520px !important;*/
    }
    .input-custom {
        max-width: 520px !important;
    }

    .input-lg,
    .input-width-lg {
        max-width: 440px !important;
    }

    .input-md,
    .input-width-md {
        max-width: 320px !important;
    }

    .input-sm,
    .input-width-sm {
        max-width: 200px !important;
        min-width: 160px;
    }

    .input-xs,
    .input-width-xs {
        max-width: 120px !important;
        min-width: 90px;
    }
}

input.input-ht-sm {
    min-height: 2rem !important;
}

/* Tables
  =============== */

.table {
    border-collapse: collapse;
    border-spacing: 0;
    margin: 0.5rem 0 1rem;
    width: 100%;
}

.table-custom {
    border-collapse: collapse;
    border-spacing: 0;
    margin: 0.5rem 0 1rem;
    width: 100%;
}

.table-custom thead {
    line-height: 1.25;
    font-weight: bold;
}

.table-custom th,
.table-custom td {
    /*text-align: left;*/
    padding: 0.5rem;
}

.table td,
.table-custom td {
    border-top: none !important;
    border-bottom: 1px solid #dedede !important;
}

/*.table-custom thead th {
  border-bottom: 2px solid #dedede; }*/

/* Striped tables */
.table-striped tbody tr:nth-child(2n) {
    background-color: #f8f8f8;
}

.table-striped tbody tr:nth-of-type(2n + 1) {
    background-color: rgba(0, 0, 0, 0.05);
}

.table-sm,
.table-sm th,
.table-sm td {
    padding: 0.25rem;
}

/* Tables nested in flex items (i.e columns) */
.flex-small .table-custom {
    margin-top: 0;
}

/* Hover tables */
.table-hover tbody tr:hover {
    background-color: rgba(0, 0, 0, 0.075);
}

/* Images in tables */

table td img {
    display: block; /* change from inline to block */
}

/* Responsive tables - wrap table in div with overflow-x */

.table-responsive {
    display: block;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    -ms-overflow-style: -ms-autohiding-scrollbar;
}

caption {
    padding: 1rem 0;
    caption-side: bottom;
    color: #ababab;
}

/* Custom Tables - styles just for thead - Move to custom */

.table-brand thead tr th,
.table-brand thead tr td {
    background: #d7dadb;
    background: linear-gradient(to top, #d7dadb, #f0f3f4); /* #bbdbfa, #d4e7fa Custom color gradient */
    /*background: linear-gradient(to bottom, #bbdbfa, #fff 2rem);*/
    border-bottom: 4px solid #03244d;
}

.table-brand thead tr th {
    text-align: center;
}

/* DataTable override to work in */

table.dataTable.table-brand thead tr th,
table.dataTable.table-brand thead tr td {
    background: #d7dadb;
    /*background: linear-gradient(to top, #bbdbfa, #d4e7fa);*/
    background: linear-gradient(to bottom, #d7dadb, #fff 2rem); /* Custom color gradient */
    border-bottom: 4px solid #03244d;
}

table.dataTable.table-brand thead tr th,
table.dataTable.table-brand thead tr td {
    border-bottom: 2px solid #03244d;
    border-top: 2px solid #03244d; /* Custom color */
}

table.dataTable.table-brand.no-footer {
    border-bottom: 2px solid #03244d; /* Custom color */
}

table.dataTable th input,
table.dataTable td input,
table.dataTable th select,
table.dataTable td select {
    margin-bottom: 0 !important;
}

.table-brand-alt thead tr th,
.table-brand-alt thead tr td {
    background: #d7f5da;
    background: linear-gradient(to top, #d7f5da, #ebf5ec); /* Custom color gradient */
    border-bottom: 4px solid #088b45 !important;
}

table.dataTable.table-sm th,
table.dataTable.table-sm td {
    padding: 0.25rem;
}

table.dataTable.compact.table thead th,
table.dataTable.compact.table thead td {
    padding: 0.25rem;
}

table#comps.dataTable tbody tr.row:hover {
    /*background-color: #007bff;*/
    background-color: rgba(0, 123, 255, 0.75);
}

table#comps.dataTable tbody tr.row:hover > .sorting_1 {
    /*background-color: #007bff;*/
    background-color: rgba(0, 123, 255, 0.75);
}
table#comps thead {
    position: sticky;
    top: 0px;
    z-index: 12;
}

/* Media Queries for tables */
@media (max-width: 800px) {
    .table th,
    .table td,
    .table-custom th,
    .table-custom td {
        font-size: 0.875rem;
        padding: 0.25rem;
    }
    table button,
    table [type="button"],
    table [type="submit"] {
        padding: 0.5rem 0.25rem;
        white-space: nowrap;
        font-size: 0.875rem;
    }
    table .input-custom {
        min-height: 2rem;
    }
}

/* Navigation
  =============== */

/* Main page header and top-level nav */

.nav-main {
    /* Full width wrapper */
    background-color: #ffffff; /* Custom color (defined in custom.css) */
}

.nav-container {
    max-width: 1600px;
    margin: 0 auto;
    overflow: hidden; /* So div has height of floated div contents */
}

.nav-container::after {
    clear: both; /* Clears floated elements contained within */
}

.logo {
    /*RENAME .nav-main .logo */
    float: left;
    line-height: 90px; /* Match line-height here with nav line-height below */
    font-size: 0; /* Removes the space below the img */
    padding-left: 20px;
}

.logo a,
.logo a:visited {
    display: block;
    color: #ffffff;
    text-decoration: none;
}

/* Main Header - Client logo */

.logo a img {
    height: auto;
    max-height: 90px; /* Client logo dimension max */
    max-width: 320px; /* Client logo dimension max */
    vertical-align: middle;
    transition: max-width 300ms linear;
}

@media only screen and (max-width: 880px) {
    /* Account for logo and menu */
    .logo a img {
        max-width: 220px;
    }
}

/* Top-level client nav */

nav.nav-client {
    /*RENAME .nav-client */
    float: right;
    line-height: 90px; /* Match line-height here with .logo line-height above, to center items vertically */
}

nav.nav-client ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

nav.nav-client ul li {
    float: left;
    position: relative;
}

.nav-list li a {
    font-weight: bold;
    text-decoration: none;
}
nav.nav-client ul li a {
    display: block;
    padding: 0 20px;
    color: #eee;
    font-weight: bold;
    text-decoration: none;
}

nav.nav-client ul li a:hover,
nav.nav-client ul li a:visited:hover {
    background: #aaaaaa; /* Custom color */
    color: #ffffff;
}

/* Mobile navigation */

/* Container for mobile menu icon */

.nav-mobile {
    display: none;
    position: absolute;
    top: 0;
    right: 0;
    width: 80px;
}

/* Show menu for small screens */

@media only screen and (max-width: 850px) {
    /* 801px */
    .nav-mobile {
        display: block;
    }
    nav.nav-client {
        width: 100%;
    }
    nav.nav-client ul {
        display: none;
    }
    nav.nav-client ul li {
        float: none;
    }
    nav.nav-client ul li a {
        padding: 15px;
        line-height: 20px;
    }
}

@media screen and (min-width: 850px) {
    /* 801px */
    .nav-list {
        display: block !important;
    }
}

/* Mobile menu three bar icon made with span tag */

#nav-toggle {
    position: absolute;
    left: 18px;
    top: 22px;
    cursor: pointer;
    padding: 20px 35px 16px 0px;
}

#nav-toggle span,
#nav-toggle span:before,
#nav-toggle span:after {
    cursor: pointer;
    border-radius: 1px;
    height: 5px;
    width: 35px;
    background: #eee;
    position: absolute;
    display: block;
    content: "";
    transition: all 300ms ease-in-out;
}

#nav-toggle span:before {
    top: -10px;
}

#nav-toggle span:after {
    bottom: -10px;
}

#nav-toggle.active span {
    background-color: transparent;
}

#nav-toggle.active span:before,
#nav-toggle.active span:after {
    top: 0;
}

#nav-toggle.active span:before {
    transform: rotate(45deg);
}

#nav-toggle.active span:after {
    transform: rotate(-45deg);
}

/* Product level nav */

.nav-prod {
    display: flex;
    flex-wrap: wrap;
    background: #e1e4e5; /* Default color */
    background: linear-gradient(to top, #e1e4e5, #ebeeef); /* Default color gradient */
}

.vc-info {
    text-align: center;
    font-size: 0.625rem;
    line-height: 2rem;
    margin: 0.5rem 1rem 0.5rem 0.5rem;
    color: #003576; /* Custom color */
    white-space: nowrap;
}

ul.nav-icons {
    margin: 0 auto;
    padding: 0;
    list-style-type: none;
    text-align: center;
}

ul.nav-icons li {
    display: inline-block;
    margin: 0.5rem;
}

ul.nav-icons li a {
    display: block;
    font-weight: bold;
    text-decoration: none;
    color: #003576; /* Custom color */
}

ul.nav-icons li a:hover {
    color: #004ca8; /* Custom color */
}

ul.nav-icons li a i[class^="vc-icon-"],
ul.nav-icons li a i[class*="fa-"] {
    font-size: 1.75rem;
    margin-right: 0.25rem;
}

@media (max-width: 830px) {
    .nav-prod > ul,
    .nav-prod > div {
        flex-basis: 100%;
    }
    .nav-prod > div {
        line-height: 1;
        margin: 0.125rem 0.5rem 0.25rem;
    }
}

@media (min-width: 520px) and (max-width: 800px) {
    ul.nav-icons li {
        margin: 0.5rem 0.125rem;
    }
}

@media (max-width: 520px) {
    ul.nav-icons li {
        margin: 0.5rem 0.5rem;
    }
}

/* Product nav links with svg icons - NOT USED; Using vc-icon font icons */

a[id^="nav-link"] {
    display: block;
    height: 2rem;
    line-height: 2rem;
    padding: 0;
    padding-left: 2.25rem;
    white-space: nowrap;
    width: auto;
}

#nav-link-search {
    /* need to url encode hash char in fill color in path tag for ff, change # to %23 */
    background: url("data:image/svg+xml;utf8, <svg id='Layer_1' data-name='Layer 1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><path d='M30.38,14.78,29,13.68V31H27V12.08L16,3.28,5,12.08V31H3V13.68l-1.38,1.1L.38,13.22,16,.72l15.62,12.5ZM19.82,23.07l5,5-1.41,1.41-5-5a7,7,0,1,1,1.41-1.41Zm-.6-4.18a5,5,0,1,0-5,5A5,5,0,0,0,19.22,18.89Z' fill='%23003576'/></svg>") left no-repeat;
}

#nav-link-farm {
    background: url("data:image/svg+xml;utf8, <svg id='Layer_1' data-name='Layer 1' xmlns='http://www.w3.org/2000/svg' viewBox='-4 0 32 32'><path d='M16,2A10,10,0,0,1,26,12c0,3.81-5.63,11.77-10,17C11.63,23.77,6,15.82,6,12A10,10,0,0,1,16,2m0-2A12,12,0,0,0,4,12c0,6.63,12,20,12,20S28,18.63,28,12A12,12,0,0,0,16,0Zm0,8a4,4,0,1,1-2.83,1.17A4,4,0,0,1,16,8m0-2a6,6,0,1,0,4.24,1.76A6,6,0,0,0,16,6Z' transform='translate(-4)' fill='%23003576'/></svg>") left no-repeat;
}

#nav-link-orders {
    background: url("data:image/svg+xml;utf8, <svg id='Layer_1' data-name='Layer 1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><path d='M22.17,2,27,6.83V30H5V2H22.17M23,0H3V32H29V6L23,0Zm-.64,6.64L21,5.22l-6.36,6.37L11.05,8.05,9.64,9.46l4.95,4.95ZM24,18H8v2H24Zm0,6H8v2H24Z' fill='%23003576'/></svg>") left no-repeat;
}

#nav-link-profile {
    background: url("data:image/svg+xml;utf8, <svg id='Layer_1' data-name='Layer 1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><path d='M16,3a5,5,0,1,1-5,5,5,5,0,0,1,5-5m0-2a7,7,0,1,0,7,7,7,7,0,0,0-7-7Zm0,16A14,14,0,0,0,2,31H4a12,12,0,0,1,24,0h2A14,14,0,0,0,16,17Z' fill='%23003576'/></svg>") left no-repeat;
}

#nav-link-logout {
    background: url("data:image/svg+xml;utf8, <svg id='Layer_1' data-name='Layer 1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><path d='M18,32H0V0H18V9H16V2H2V30H16V23h2ZM32,16,24.17,8.22,22.76,9.64,29.12,16l-6.36,6.36,1.41,1.42ZM30,15H9v2H30Z' fill='%23003576'/></svg>") left no-repeat;
}

/* Style to change color of nav links with svg icons */
a[id^="nav-link"]:hover,
a[id^="nav-link"]:active {
    filter: brightness(2);
}

/* Shopping cart icon and badge */

a#link-cart {
    position: relative; /* to position cart-badge */
}

a#link-cart > i.cart-badge {
    position: absolute;
    line-height: 0.875rem;
    min-height: 1.125rem;
    min-width: 1.125rem;
    top: 0;
    right: 0;
    border-radius: 999px;
    background: rgba(120, 120, 120, 0.9);
    text-align: center; /* Custom color */
}

a#link-cart > i.cart-badge > span {
    color: #fff;
    font-size: 0.75rem;
    font-style: normal;
    padding: 0.125rem;
}

a#link-cart > i.fa-shopping-cart {
    margin-right: 1rem; /* to position cart-badge */
}

/* Comp filter icons */

#filter-radius {
    /* need to url encode hash char in fill color in path tag for ff, change # to %23 */
    background: url("data:image/svg+xml;utf8, <svg id='Layer_1' data-name='Layer 1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><path d='M16,5A11,11,0,1,1,5,16,11,11,0,0,1,16,5m0-2A13,13,0,1,0,29,16,13,13,0,0,0,16,3Zm0,11a2,2,0,1,1-2,2,2,2,0,0,1,2-2m0-2a4,4,0,1,0,4,4,4,4,0,0,0-4-4Zm11,3H19v2h8Z' fill='%23003576'/></svg>") left no-repeat;
}

#filter-sqft {
    background: url("data:image/svg+xml;utf8, <svg id='Layer_1' data-name='Layer 1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><path d='M27,7v4H23V7h4m2-2H21v8h8V5ZM27,21v4H23V21h4m2-2H21v8h8V19ZM9,7v4H5V7H9m2-2H3v8h8V5ZM9,21v4H5V21H9m2-2H3v8h8V19ZM21,8H11v2H21Zm0,14H11v2H21ZM8,13H6v6H8Zm18,0H24v6h2Z' fill='%23003576'/></svg>") left no-repeat;
}

#filter-date {
    background: url("data:image/svg+xml;utf8, <svg id='Layer_1' data-name='Layer 1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><path d='M26.81,7.19V26.81H5.19V7.19H26.81M29,5H3V29H29V5Zm0,7H3v2H29ZM10,2H8v8h2ZM24,2H22v8h2ZM22.36,17.14,21,15.72l-6.36,6.37-3.54-3.54L9.64,20l4.95,4.95Z' fill='%23003576'/></svg>") left no-repeat;
}

#filter-price {
    background: url("data:image/svg+xml;utf8, <svg id='Layer_1' data-name='Layer 1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><path d='M27,10V26H5V10H27m2-2H3V28H29V8Zm0-5H3V5H29ZM9,4H7V9H9ZM25,4H23V9h2ZM15.52,24.39V22.87a6.37,6.37,0,0,1-2.72-.68l.48-1.88a5.64,5.64,0,0,0,2.66.71c.91,0,1.53-.35,1.53-1s-.51-1-1.69-1.39c-1.72-.57-2.88-1.37-2.88-2.93a3,3,0,0,1,2.7-2.85V11.33h1.57v1.41a5.74,5.74,0,0,1,2.32.53L19,15.08a5.19,5.19,0,0,0-2.3-.55c-1,0-1.38.45-1.38.9s.56.86,1.92,1.38c1.91.67,2.68,1.55,2.68,3a3.06,3.06,0,0,1-2.85,3v1.63Z' fill='%23003576'/></svg>") left no-repeat;
}

/* Toggle sections and headings */

.heading-background {
    padding: 0.25rem;
    background: #e1e4e5; /* Custom color */
}

.toggle {
    float: right;
    display: inline-block;
    cursor: pointer;
}

.toggleHead {
    float: right;
    display: inline-block;
}

h2 > span.toggle,
h3 > span.toggle {
    /*font-size: 80%;
	line-height: 1.6;*/
}

.sectionHead {
    /* Toggle headings for collapsable content sections */
    cursor: pointer; /* needed for iOS */
}
.sectionHead:hover {
    box-shadow: inset 0 0 0 1.5rem rgba(0, 0, 0, 0.1);
}

/* Help links for help modals and tooltips */

.tooltip-help,
i[class^="help"] {
    cursor: pointer;
}

/* Scrolltop link at bottom of pages */

.back-to-top,
.back-to-top:focus,
.back-to-top:active,
.back-to-top:visited {
    display: none;
    padding: 0.5rem;
    border-radius: 0.25rem;
    background: rgba(0, 0, 0, 0.3);
    color: #fff !important;
    text-decoration: none !important;
    font-weight: bold;
    z-index: 99;
    position: fixed;
    right: 20px;
    bottom: 20px;
}

.back-to-top:hover {
    background: rgba(8, 139, 69, 0.9); /* Custom color */
}

/* UI Container - for active property address */

/* Property-bar styles */

.property-bar {
    display: block;
    /*overflow: hidden;*/
    margin: 0 auto;
    padding: 0.5rem 0.25rem;
    position: -webkit-sticky;
    position: sticky;
    top: 0px;
    z-index: 2000;
}

.property-bar {
    background: #e1e4e5;
    background: linear-gradient(to top, #e1e4e5, #fff 90%); /* Default color gradient */
    padding: 0.25rem 0.125rem 0;
}
.property-bar .flex-row {
    align-items: center;
    border-bottom: 1px solid #bbbdc0;
}

.property-bar .flex-row > div {
    margin-bottom: 0;
    padding: 0.5rem 0.125rem;
}

/* Property bar headings */

.property-bar h3,
.property-bar h4 {
    margin: 0;
    line-height: 1.25;
}

.property-bar h3 > span {
    font-family: "Raleway", sans-serif;
}

/* Property bar print button */

#PrintReport {
    /* display: none;  */
}

.printTitle {
    display: none;
}

/* Responsive styles for property-bar */
@media (max-width: 800px) {
    .property-bar .flex-1-2 {
        flex-basis: 50%;
    }
    .property-bar .flex-2-5 {
        flex-basis: 40%;
    }
    .property-bar .flex-3-5 {
        flex-basis: 60%;
    }

    .property-bar .flex-1-4:last-of-type {
        order: 2;
    }
    .property-bar .flex-2-4 {
        order: 3;
        flex-basis: 100%;
    }
}

@media (max-width: 600px) {
    .property-bar h3 {
        font-size: 0.825rem;
    }

    .property-bar h4 {
        font-size: 0.8125rem;
    }

    .property-bar .button-sm,
    .btn-group .btn {
        font-size: 0.6875rem;
    }

    .property-bar .filterbar-wrap {
        height: 0.6875rem;
    }

    .property-bar .nav-priority > ul > li a {
        font-size: 0.825rem;
        padding: 0.25rem 0.5rem;
    }

    .property-bar .optional {
        display: none;
    }
}

/* Nav-priority styles  */

/* Priority Nav styles */

.nav-priority {
    margin: 0 auto;
    padding: 0.5rem 0.25rem 0.25rem;
    max-width: 1200px;
}

.nav-priority > ul {
    list-style-type: none;
    margin: 0 auto;
    padding: 0;
    font-size: 0;
    text-align: center; /* Center the nav bar */
    background: #ccc; /* #0bb359 Custom color */
}
.nav-priority > ul > li {
    display: inline-block;
    position: relative; /* Needed for dropdown with position absolute */
    text-align: left; /* Left align the nav items */
}
.nav-priority > ul > li.more > a .fa {
    color: #fff;
}
.nav-priority > ul > li.hidden {
    display: none;
}
.nav-priority > ul > li > a {
    border-right: 1px dashed rgba(255, 255, 255, 0.75);
}
.nav-priority > ul > li:first-child > a {
    border-left: 1px dashed rgba(255, 255, 255, 0.75);
}
.nav-priority > ul > li a {
    font-size: 1rem;
    display: block;
    background: #ccc; /* Custom color */
    color: #fff;
    text-align: center;
    text-decoration: none;
    padding: 0.5rem;
}

/* Nested list for dropdown, hidden */
.nav-priority > ul > li a + ul {
    display: none;
    position: absolute;
    z-index: 20000; /* above the tooltips */
    top: 100%;
    right: 0;
    margin: 0;
    padding: 0 0.125rem;
    background-color: #fff;
    list-style-type: none;
}
.nav-priority > ul > li a + ul li {
    margin-top: 1px;
}
.nav-priority > ul > li a + ul li a {
    padding: 0.5rem 1rem;
    text-align: left;
    white-space: nowrap;
}
.nav-priority > ul > li a + ul li a:hover {
    background: #bbb; /* #088c46 Custom color */
}
.nav-priority > ul > li:hover > a {
    background: #bbb; /* #088c46 Custom color */
}
/* Nested list for dropdown, display on hover */
.nav-priority > ul > li:hover ul {
    /*display: block;*/ /* on click now */
}

/* Tabs, used for property content */

.tabs {
    /* container for tabs */
    margin: 0 auto;
    /*min-height: 1000px;*/
    margin-top: 0.5rem;
}

.tab-list {
    border-radius: 0.25rem;
    white-space: nowrap; /* to use, also set min-width below */
}

.tab-list a.active-tab {
    transition: box-shadow 0.15s ease-in-out;
}

.tab-list a.active-tab {
    color: #fff; /* Default color */
    /*border-bottom-color: #088b45;*/
    box-shadow: inset 0 -4px 0 rgba(0, 0, 0, 0.25);
}

.tab-content {
    padding-top: 1rem;
}

.tab-content:not(.show-tab) {
    display: none !important;
}

.show-tab {
    display: block;
    /*padding-top: 1.5rem;*/
}

h2.tabHead {
    /* Main Heading for tabs - Print Only */
    display: none;
    text-align: center;
    text-transform: uppercase;
}

h2.XtabHead:before,
h2.XtabHead:after {
    display: inline-block;
    content: "";
    border-bottom: 2px solid #404040; /* Default color */
    width: 3rem;
    margin: 0 0.5rem;
    transform: translateY(-0.5rem); /* Apx. vertical center */
}

/* Responsive styles for tabs */

@media only screen and (max-width: 850px) {
    /* 801px */
    .tab-list a {
        white-space: pre-wrap;
        white-space: -moz-pre-wrap !important;
        word-break: keep-all; /*this stops the word breaking*/
    }
}

@media (max-width: 600px) {
    .tab-list a {
        padding: 0.25rem 0.125rem;
        font-size: 0.875rem;
    }
    .tab-bkgd {
        margin: 0.25rem auto 0;
    }
}

/* Filters, used for search form input dropdowns */

.filter-bar {
    padding: 0.125rem 0.125rem 0.25rem;
    /*background: #e1e4e5;*/
    text-align: center;
    border-radius: 4px;
}
.filter-bar .button {
    margin: 0.125rem;
    cursor: pointer;
}
.filter-bar .button span {
    display: inline-block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis; /* when text is too long, if changing text */
}

.filter-bar > span {
    margin: 0.125rem;
    font-weight: 600;
    font-size: 0.875rem;
}

.filter-container {
    padding: 0;
}

.filter-content {
    padding: 0.5rem 0.5rem 1rem 0.5rem;
}

.filter-heading {
    display: block;
    overflow: hidden;
    padding: 0.25rem;
    margin-bottom: 1rem;
    font-weight: 600;
    border-bottom: 1px solid #0250bc; /* Custom color */
}

.filter-heading > span {
    display: inline-block;
    vertical-align: middle;
    line-height: 1.75rem;
}

.filter-heading > button.close-tooltip-filter {
    float: right;
}

.filter-footer {
    background: #e1e4e5; /* Default color */
    padding: 0.5rem;
    text-align: right;
}

.filter-footer button.button-sm {
    margin-bottom: 0;
}

.filter-output {
    font-size: 1.5rem;
    color: #088c46; /* Default color */
}

.filter-content .range-output {
    font-size: 1.25rem;
    color: #088c46; /* Default color */
}

.filter-content .filter-slider {
    margin: 1rem;
}

.filter-content .range-output input {
    width: 100%;
    /*border: none;*/
    font-size: 1.25rem;
    color: #088c46; /* Default color */
    margin-bottom: 0;
}

.filter-content .range-spacer {
    padding: 0 1.5rem;
}

.filter-control label {
    border-bottom: 1px solid #cccccc;
    margin: 1rem 0 0.5rem 0;
    color: #404040;
    display: flex;
    background: linear-gradient(transparent 50%, #ddd);
}

.filter-control > label:first-of-type > span:first-of-type {
}

.filter-active {
    color: #404040; /* Default color */
    text-overflow: ellipsis; /* when text is too long, if changing text */
}

.filter-dismiss:hover {
    color: #404040;
}

/* Hidden elements */

.vcts-hidden {
    display: none;
}

/* Hidden item from legacy vcstyles used by js */

.hiddenItem {
    display: none;
}

.missingRequired {
    border-color: #dc3545;
    /*box-shadow: 0 1px 3px #000000 inset, 0 0 8px #ff3333;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05) inset, 0 0 8px rgba(255, 51, 51, 0.6);*/
    border: 1px solid #dc3545;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1), 0 0 6px #fc8b96;
    /*color: #333333; */
    outline: 0 none;
}

.missingNeeded {
    border-color: #dc3545;
    /*box-shadow: 0 1px 3px #000000 inset, 0 0 8px #ff3333;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05) inset, 0 0 8px rgba(255, 51, 51, 0.6);*/
    border: 1px solid #dc3545;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1), 0 0 6px #fc8b96;
    color: #333333;
    outline: 0 none;
}

/* Misc
  =============== */

/* Custom Gradients - Move to custom */

.grad-lt-top {
    background: linear-gradient(to bottom, #cccccc, rgba(255, 255, 255, 0) 1.25rem);
}

fieldset.grad-lt-top {
    background: linear-gradient(to bottom, #cccccc, rgba(255, 255, 255, 0) 1.25rem), radial-gradient(#fafafa 50%, #f0f3f5);
    padding-top: 1.25rem;
}

.panel.grad-lt-top {
    background: linear-gradient(to bottom, #cccccc, rgba(255, 255, 255, 0) 1.25rem), radial-gradient(#fafafa 50%, #f0f3f5);
    padding-top: 1.25rem;
    border: none;
}

.grad-brand-hz {
    background: #666666;
    background: linear-gradient(to right, #666666 10%, #888888 90%);
}

.grad-brand-alt-hz {
    background: #666666;
    background: linear-gradient(to right, #666666 10%, #888888 90%);
}

.grad-brand-lt {
    background: #d7dadb;
    background: linear-gradient(to top, #d7dadb, #f0f3f4);
}

.brand-border-top {
    border-top: 6px solid #888; /* #0aa653 Custom color */
}

/* Custom Headings - with backgrounds */

h2[class*="grad-"], /* headings with grad or bkgd need padding */
h3[class*="grad-"],
h2[class*="bkgd-"],
h3[class*="bkgd-"] {
    padding: 0.25rem;
}

h2[class*="grad-"], /* headings with grad or bkgd need light text */
h2[class*="grad-"] .toggle *,
h3[class*="grad-"],
h3[class*="grad-"] .toggle *,
h2[class*="bkgd-"],
h2[class*="bkgd-"] .toggle *,
h3[class*="bkgd-"],
h3[class*="bkgd-"] .toggle * {
    color: #f2f2f2; /* Default color */
}

h2[class*="grad-"] i, /* headings with grad or bkgd with icons need margin on icons */
h3[class*="grad-"] i,
h2[class*="bkgd-"] i,
h3[class*="bkgd-"] i {
    margin-left: 0.25rem;
    margin-right: 0.25rem;
}

h2[class*="-lt"], /* headings with light grad or bkgd need dark text */
h3[class*="-lt"],
h2[class*="-alt"],
h3[class*="-alt"] {
    color: #404040; /* Default color */
}

.accent {
    color: var(--accent-color); /* Custom color */
}

/* Animation and transitions for page content and tabs */

@-webkit-keyframes fadeIn {
    /* fade in content */
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

#content > div,
#content > form,
#content iframe,
.page-content > div,
.page-content > form,
.page-content iframe,
.tab-content,
.filter-bar {
    -webkit-animation: fadeIn 1.5s;
    animation: fadeIn 1.5s;
}

#content *,
.page-content * {
    transition: font-size 0.3s ease, padding 0.6s linear, margin 0.6s linear;
}
.page-content > * {
    /*flex: 1 1 1600px;*
    /*height: 100%;*/
}
.shadow-btm {
    box-shadow: 0 4px 4px -2px rgba(0, 0, 0, 0.3);
}

/* Content Specific Styles */

/* Property Search */

#PropertySearchWrapper .flex-row .flex-1-4 .panel-body div {
    margin: 0 auto 1rem;
}

@media (max-width: 850px) {
    #PropertySearchWrapper .flex-row .flex-2-3-md {
        order: 2;
    }
    #PropertySearchWrapper .flex-row .flex-1-3-md {
        order: 1;
    }
    #PropertySearchWrapper .flex-row .flex-1-3-md .panel-head:nth-of-type(2),
    #PropertySearchWrapper .flex-row .flex-1-3-md .panel-head:nth-of-type(2) + .panel-body > p {
        display: none;
    }
    #PropertySearchWrapper .flex-row .flex-1-3-md .panel-head:nth-of-type(1) + .panel-body {
        padding-bottom: 0;
    }
}

@media (max-width: 520px) {
    #PropertySearchWrapper .flex-row .flex-3-4 {
        order: 2;
    }
    #PropertySearchWrapper .flex-row .flex-3-4 label {
        margin-bottom: 0.125rem;
    }
    #PropertySearchWrapper .flex-row .flex-3-4 select,
    #PropertySearchWrapper .flex-row .flex-3-4 input {
        margin-bottom: 0.25rem;
    }
    #PropertySearchWrapper .flex-row .flex-1-4 {
        order: 1;
    }
    #PropertySearchWrapper .flex-row .flex-1-4 .panel-head {
        display: none;
    }
    #PropertySearchWrapper .flex-row .flex-1-4 .panel-body {
        padding: 0.25rem;
        text-align: center;
    }
    #PropertySearchWrapper .flex-row .flex-1-4 .panel-body h4,
    #PropertySearchWrapper .flex-row .flex-1-4 .panel-body p {
        display: none;
    }
    #PropertySearchWrapper .flex-row .flex-1-4 .panel-body div {
        display: inline-block;
        margin: 0 0.5rem;
    }
}

/* Content Specific Styles */

/* News and Updates content for Property Search sidebar */

#PropertySearchWrapper .news-container {
    max-height: 50vh;
    overflow-y: auto;
}

#PropertySearchWrapper .news-item {
    border-bottom: 1px solid #dedede;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}

#PropertySearchWrapper .news-item h4,
#PropertySearchWrapper .news-item p,
#PropertySearchWrapper .news-item ul {
    margin-bottom: 0.5rem;
}

#PropertySearchWrapper .news-item-content ul {
    columns: 320px 2;
}

#PropertySearchWrapper .news-item-content {
    font-size: 0.875rem;
    text-align: left;
}

#PropertySearchWrapper .news-item-details {
    margin: 0;
}

#PropertySearchWrapper .news-item h4 > i.fas {
    color: #33cc33;
}

/* Property Characteristics content */

#tab-chars #propMap iframe {
    display: block;
    margin: 0 auto;
    text-align: center;
    width: 100%; /* adjusted in print style sheet */
    height: 480px;
}

/* School content */

.schoolContent {
    border: 1px solid #e1e4e5;
    padding: 0.5rem 0.75rem;
    margin-bottom: 1rem;
    -moz-box-shadow: inset 0 0 0.75rem #d4e7fa;
    -webkit-box-shadow: inset 0 0 0.75rem #d4e7fa;
    box-shadow: inset 0 0 0.75rem #d4e7fa;
}

h4.schoolHeader,
h3.schoolHeader {
    margin-bottom: 0;
    background: #bbdbfa;
    background: linear-gradient(to top, #bbdbfa, #d4e7fa); /* Custom color gradient */
    padding: 0.25rem;
    border-bottom: 4px solid #003576;
    color: #404040;
}

.schoolContent > table thead tr td {
    border-bottom: 2px solid #003576; /* Custom color */
}

.schoolContent .flex-row .table {
    margin: 0.25rem 0;
}

.schoolContent .flex-row > [class^="flex-"] {
    margin-bottom: 0.5rem;
}

/* Demographic content */

div.demoContent table.table-brand thead tr th,
div.demoContent table.table-brand tbody tr td {
    text-align: center;
}

/* Recent searches content table */

#recentSearches.dataTable thead th,
table.dataTable thead td {
    /*border-bottom: 1px solid #111;*/
    border-bottom: 2px solid #003576; /* Custom color */
}
#recentSearches.dataTable.no-footer {
    /*border-bottom: 1px solid #111;*/
    border-bottom: 2px solid #003576; /* Custom color */
}

/* Shopping cart content */

#cart.container-iframe {
    -webkit-overflow-scrolling: touch !important; /* iOS scrolling issue */
    overflow: auto !important;
}

#cart.container-iframe > iframe {
    width: auto !important;
    min-width: 800px;
    display: block;
}

/* Order form content */

#orderForm h3 {
    margin-bottom: 0.25rem;
}

.message-order-done {
    text-align: center;
    font-weight: bold;
}

.message-order-done > span {
    display: inline-block;
    margin: 1rem 2rem;
    white-space: nowrap;
}

/* Comps content */

.vc-minimum.fa-long-arrow-alt-down {
    color: red; /* Default color */
    margin-right: 0.25rem;
}

.vc-maximum.fa-long-arrow-alt-up {
    color: green; /* Default color */
    margin-right: 0.25rem;
}

/* Comps hover (BS override) */

.wrapper #comps .bg-primary:not(:first-child) {
    background-color: rgba(0, 0, 0, 0.2) !important;
}
.wrapper #comps .bg-primary:first-child {
    background-color: #f0f0f0 !important;
}

.btn-primary:focus,
.btn-primary:active {
    box-shadow: unset !important;
}
.btn:focus,
.btn:active {
    box-shadow: unset !important;
}

.btn {
    font-weight: 600;
}

/* Comps selected content table */

table#compSummary thead tr th {
    padding: 0.25rem;
    line-height: 2rem;
}

table#compSummary thead tr th img {
    display: inline-block;
    max-height: 32px;
    width: auto;
    margin: 0 0.5rem;
}

table#compSummary tbody tr td:nth-child(1) {
    /*background-color: #e1effa;*/
    background: linear-gradient(to right, #bbdbfa, #d4e7fa); /* Custom color gradient */
    border-right: 1px solid #003576;
    border-bottom: 1px solid rgba(255, 255, 255, 0.5) !important;
}

table#compSummary tbody tr:nth-child(1) td:nth-child(n + 2) {
    font-family: "Raleway", sans-serif;
    font-weight: 600;
    font-size: 1rem;
    line-height: 1.25;
    background: linear-gradient(to top, #e1f5e7, #f0faf3); /* Default color gradient */
}

/* File type content and icons */

.fa-file-pdf {
    color: #bf1d22;
}

/* View Orders content */

table#displayOrders thead tr th {
    text-align: left;
}

/* Text based on screen size */

@media screen and (max-width: 520px) {
    .screen-lg {
        display: none;
    }
}

/* Helpers
  =============== */
.clearfix::before,
.clearfix::after {
    content: " ";
    display: block;
}

.clearfix:after {
    clear: both;
}

.text-left {
    text-align: left;
}

.text-right,
.right {
    text-align: right;
}

.text-center,
.center {
    text-align: center;
}

.block {
    display: block;
}

.inline-block {
    display: inline-block;
}

.inline {
    display: inline;
}

.vertical-center {
    display: flex;
    align-items: center;
    justify-content: center;
}

.center-items {
    justify-content: center;
}

.responsive-image {
    max-width: 100%;
    height: auto;
}

.show {
    display: block !important;
}

.hide {
    display: none !important;
}

.invisible {
    visibility: hidden;
}

.float-left {
    float: left;
}

.float-right {
    float: right;
}

.padding {
    padding: 0.5rem;
}

.padding-sm {
    padding: 0.25rem;
}

.no-padding {
    padding: 0;
}

.no-padding-top {
    padding-top: 0;
}

.no-padding-bottom {
    padding-bottom: 0;
}

.padding-top {
    padding-top: 1rem;
}

.padding-bottom {
    padding-bottom: 1rem;
}

.padding-lt {
    padding-left: 0.25rem;
}

.padding-rt {
    padding-right: 0.25rem;
}

.no-margin {
    margin: 0;
}

.no-margin-top {
    margin-top: 0;
}

.no-margin-bottom {
    margin-bottom: 0;
}

.margin-top {
    margin-top: 1rem;
}

.margin-top-sm {
    margin-top: 0.5rem;
}

.margin-bottom {
    margin-bottom: 1rem;
}

.margin-rt {
    margin-right: 1rem;
}

.margin-lt {
    margin-left: 1rem;
}

.margin-lt-lg {
    margin-left: 2rem;
}

.active {
    font-weight: 600;
}

.show {
    display: block;
}

.text-white {
    color: #fff;
}

.text-sm {
    font-size: 0.825rem;
}

@media (max-width: 600px) {
    .margin-rt {
        margin-right: 0.5rem; /* Heading before Comps toggle button */
    }
}

/* End of CSS */

/* Legacy Greenscreen Stuff
  =============== */

/* Legacy styles from vcstyles - to be moved */

.formLabel {
    font-weight: bold;
}

.bold {
    font-weight: bold;
}

.redText {
    color: #990820; /* Default color */
}

.rsHeadLabel {
    font-weight: bold;
}

.rsHeadData {
    white-space: nowrap;
}

.rsLabel {
    font-weight: bold;
}

.piLabel {
    font-weight: bold;
}

.invoiceLabel {
    font-weight: bold;
}

input[readonly="readonly"],
input[readonly],
textarea[readonly="readonly"],
textarea[readonly],
textarea[disabled="disabled"],
textarea[disabled],
input[disabled="disabled"],
input[disabled],
select[disabled="disabled"],
select[disabled] {
    /*border-style: none;*/
    border: 1px solid rgba(255, 255, 255, 0); /*#cdcdcd*/
    background-color: transparent;
    /*background-color: rgba(205,205,205,.2);*/
    color: #000;
    resize: none; /* for textarea */
}

input[readonly]:active,
input[readonly]:focus,
input[readonly]:hover,
input[disabled]:active,
input[disabled]:focus,
input[disabled]:hover {
    /*border: none;*/
    border: 1px solid rgba(255, 255, 255, 0);
    box-shadow: none;
}

textarea[readonly]:active,
textarea[readonly]:focus,
textarea[readonly]:hover,
textarea[disabled]:active,
textarea[disabled]:focus,
textarea[disabled]:hover {
    /*border: none;*/
    border: 1px solid rgba(255, 255, 255, 0);
    box-shadow: none;
}

select[disabled="disabled"],
select[disabled] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: none;
    opacity: 1;
}

select[disabled]:active,
select[disabled]:focus,
select[disabled]:hover {
    /*border: none;*/
    border: 1px solid rgba(255, 255, 255, 0);
    box-shadow: none;
}

/* End legacy styles from vcstyles */

/* Legacy styles for Farm Package */

.hostFrame {
    /*width:800px;*/
    width: 100%;
    height: 2000px;
    border: 0;
    padding: 0;
    margin: 0;
    overflow: hidden;
    overflow-x: hidden;
    /*overflow-y: hidden;*/
    overflow-y: scroll;
}

div.contentWrapper {
    width: 100% !important;
}

/* End legacy styles for Farm Package */

/* End Legacy Greenscreen Stuff */

/* New brand classes */

.fieldset-brand {
    /* Move to custom */
    padding-top: 1.25rem;
    background: radial-gradient(rgba(255, 255, 255, 0) 50%, #f2f4f5);
}

/* BOOTSTRAP MULTISELECT */

.multiselect-container > li > a > label {
    padding-left: 4px !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    background: none;
    border-bottom: none;
}
.multiselect-container > li:not(.multiselect-group) {
    margin-left: 10px;
}

.multiselect-container.dropdown-menu {
    padding: 0.5rem !important; /* add padding overall */
    min-width: 75%;
}

.multiselect-container > li.multiselect-group label {
    padding-left: 4px !important; /* Align group headings left */
    margin-bottom: 0.25rem !important;
}

.multiselect-container > li {
    line-height: 1.15 !important; /* line-height */
    font-size: 0.875rem !important; /* font-size */
}

.multiselect-container > li > a {
    color: #444444 !important;
    display: inline-block;
}

.multiselect-container > li > a > label {
    margin-bottom: 0.25rem !important;
}

.multiselect-container > li > a > label > input[type="checkbox"] {
    margin-bottom: 0 !important;
    margin-right: 4px;
}

/* noUiSlider */

.noUi-connect {
    background: #0bb359 !important;
}

/* Plupload File Uploader */

#uploadFilesDialog .plupload_header {
    background: #003576;
}

#uploadFilesDialog .plupload_header_text {
    margin-top: 8px;
}

#uploadFilesDialog .plupload_header_content {
    background: url(../images/icon-document.png) no-repeat 8px 6px;
    background-size: 44px;
}

/* Comps Items */

#compMap {
    height: 100%;
}
#SingleMatch {
    /*display:flex;*/
}
#SingleMatch > * {
    /*flex:1;*/
}

#comps_wrapper table#comps thead th {
    font-size: 0.875rem;
}

/* background: url("data:image/svg+xml;utf8, <svg id='Layer_1' data-name='Layer 1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><path d='M30.38,14.78,29,13.68V31H27V12.08L16,3.28,5,12.08V31H3V13.68l-1.38,1.1L.38,13.22,16,.72l15.62,12.5ZM19.82,23.07l5,5-1.41,1.41-5-5a7,7,0,1,1,1.41-1.41Zm-.6-4.18a5,5,0,1,0-5,5A5,5,0,0,0,19.22,18.89Z' fill='%23003576'/></svg>") left no-repeat; */

.multiselect-container > .primary {
    background: url("data:image/svg+xml;utf8, <svg id='Layer_1' data-name='Layer 1' xmlns='http://www.w3.org/2000/svg' viewBox='-24 -2 128 80'><defs><style>.cls-1{fill:none;}</style></defs><title>Untitled-9</title><path d='M92.06,8l23.55,13.6H98.89l-6.87-4-6.91,4H68.39ZM68.5,24.69l0,8.34h17c2.7-2.72,5.7-5.58,8.88-8.34Zm38.6,10.64,0,12.31H91.86A106.52,106.52,0,0,0,83,56h32.39l.12-27C112.81,31,110,33.12,107.1,35.33ZM77.55,47a20.12,20.12,0,0,0,3.09-10.89H68.72A43.8,43.8,0,0,1,68.66,56h8.79c7.22-8.06,26-22.37,38.15-31.31H99.06A200.28,200.28,0,0,0,77.55,47Z' transform='translate(-32 -8)' fill='%23ff333a'/></svg>") left no-repeat;
}
.multiselect-container > .primary input {
    margin-right: 24px !important;
}

/***    Classes used for functional reasons,groupings,bindings ***/

.vcts-site-custom {
}
.vcts-adHocVar {
}

.display-none {
    display: none;
}
.align-left {
    text-align: left;
}

/* whole lotta hacks for displaying multiselect dropdowns */
.multiselect-container {
    position: relative;
}
div:has(> div.multiselect-container.dropdown-menu) {
    display: block !important;
}
div.multiselect-container.dropdown-menu {
    display: block !important;
    padding: 0 !important;
    margin-top: 10px !important;
    border-radius: 0 !important;
}
div.multiselect-container.dropdown-menu > button {
    background: linear-gradient(transparent 0%, #ccc) !important;
    border-color: #555 !important;
}
div.multiselect-container.dropdown-menu > button > .form-check > .form-check-label {
    margin: 0 !important;
    border: none !important;
    background: none !important;
    font-size: 14px !important;
    line-height: 28px !important;
}
/*
#filterSubName > form > span > div > button {
    width: 384px !important;
}
*/

/* i.info-circle {
    position: relative;
    top: 2px;
    height: 1.5rem;
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    display: inline-block;
    margin: 0;
    background-color: var(--bs-warning); /* var(--accent-background-color) * /
    opacity: 1 !important;
}
i.info-circle::before {
    content: "i";
    position: absolute;
    left: 8.5px;
    bottom: 4.5px;
    line-height: 100%;
    color: #000; /* var(--accent-font-color); * /
    font-size: 1rem;
    font-weight: bold;
    font-family: Georgia, "Times New Roman", Times, serif;
    font-style: italic;
} */

/* class="fas fa-info-circle accent tooltip box-shadow" */
