/*
Theme Name: Show Me KC Schools Child
Template: Impreza
Version: 1.0
Author:	UpSolution
Theme URI: http://impreza.us-themes.com/
Author URI: http://us-themes.com/
*/

/*Add your own styles here:*/

/* ************************************************************************* */
/* Base/Structural Styles ************************************************** */
/* ************************************************************************* */

/* Add a bg color to the mobile header search so it doesn't mix wih the logo */
.w-search-form {
    background: #fff;
}

/* Restore the outline on elements the parent took it away from */
#page-content a:focus,
#page-content button:focus,
#page-content input[type="submit"]:focus,
#page-content .ui-slider-handle:focus,
.ui-dialog a:focus,
.ui-dialog button:focus,
.woocommerce-products-compare-compare-button.as-icon input[type="checkbox"]:focus + label > span,
.neighborhood-school-option .as-icon input[type="checkbox"]:focus + span,
.switch-field input[type="radio"]:focus + label {
    outline: 2px dashed var(--color-content-secondary) !important;
    transition: none !important;
}
/* Underline text links */
#page-content a:not(.w-btn) {
    text-decoration: underline;
}
/* Add icon after links that open in new window */
/*#page-content a[target="_blank"]::after {*/
/*   content: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAQElEQVR42qXKwQkAIAxDUUdxtO6/RBQkQZvSi8I/pL4BoGw/XPkh4XigPmsUgh0626AjRsgxHTkUThsG2T/sIlzdTsp52kSS1wAAAABJRU5ErkJggg==);*/
/*   margin: 0 3px 0 5px;*/
/*}*/
/*#page-content a.w-btn[target="_blank"]::after {*/
/*    !* Change icon to white; this may need to change depending on final colors *!*/
/*    filter: invert(1);*/
/*}*/

/* ************************************************************************* */
/* General Styles for Page Content ***************************************** */
/* ************************************************************************* */

@media not print {
    .include-for-print-only { display: none !important; }
}
@media print {
    .exclude-from-print { display: none !important; }
}

/* The page builder options don't always make every color option available in
the dropdown, so make them accessible here: */
.color-green,
.color-green > .w-iconbox-icon { color: var(--color-content-primary) !important; }
.color-coral,
.color-coral > .w-iconbox-icon { color: var(--color-content-secondary) !important; }
.color-dark-blue,
.color-dark-blue > .w-iconbox-icon { color: var(--color-alt-content-primary) !important; }
.color-light-blue,
.color-light-blue > .w-iconbox-icon { color: var(--color-alt-content-overlay) !important; }
.color-text-gray,
.color-text-gray > .w-iconbox-icon { color: var(--color-content-text) !important; }
.color-dark-gray,
.color-dark-gray > .w-iconbox-icon { color: var(--color-alt-content-border) !important; }
.color-light-gray,
.color-light-gray > .w-iconbox-icon { color: var(--color-content-border) !important; }

ul.no-indent,
ol.no-indent {
    margin-left: 1.25rem;
    padding-left: 0.25rem;
}

ul.condensed li,
ol.condensed li {
    margin-bottom: 0;
}

.d-inline { display: inline; }
.d-block { display: block; }
.d-inline-block { display: inline-block; }

/* Primarily for horizontal wrappers where rows/columns can't be used */
.w-25 { width: 25%; }
.w-50 { width: 50%; }
.w-75 { width: 75%; }
.w-100 { width: 100%; }

.mb-0 { margin-bottom: 0 !important; }
.mb-1 { margin-bottom: 0.25rem !important; }
.mb-2 { margin-bottom: 0.5rem !important; }
.mb-3 { margin-bottom: 1rem !important; }
.mb-4 { margin-bottom: 1.5rem !important; }
.mb-5 { margin-bottom: 3rem !important; }

.mt-0 { margin-top: 0 !important; }
.mt-1 { margin-top: 0.25rem !important; }
.mt-2 { margin-top: 0.5rem !important; }
.mt-3 { margin-top: 1rem !important; }
.mt-4 { margin-top: 1.5rem !important; }
.mt-5 { margin-top: 3rem !important; }

.p-0 { padding: 0 !important; }
.p-1 { padding: 0.25rem !important; }
.p-2 { padding: 0.5rem !important; }
.p-3 { padding: 1rem !important; }
.p-4 { padding: 1.5rem !important; }
.p-5 { padding: 3rem !important; }

.pb-0 { padding-bottom: 0 !important; }
.pb-1 { padding-bottom: 0.25rem !important; }
.pb-2 { padding-bottom: 0.5rem !important; }
.pb-3 { padding-bottom: 1rem !important; }
.pb-4 { padding-bottom: 1.5rem !important; }
.pb-5 { padding-bottom: 3rem !important; }

.pt-0 { padding-top: 0 !important; }
.pt-1 { padding-top: 0.25rem !important; }
.pt-2 { padding-top: 0.5rem !important; }
.pt-3 { padding-top: 1rem !important; }
.pt-4 { padding-top: 1.5rem !important; }
.pt-5 { padding-top: 3rem !important; }

.ps-0 { padding-left: 0 !important; }
.ps-1 { padding-left: 0.25rem !important; }
.ps-2 { padding-left: 0.5rem !important; }
.ps-3 { padding-left: 1rem !important; }
.ps-4 { padding-left: 1.5rem !important; }
.ps-5 { padding-left: 3rem !important; }

.pe-0 { padding-right: 0 !important; }
.pe-1 { padding-right: 0.25rem !important; }
.pe-2 { padding-right: 0.5rem !important; }
.pe-3 { padding-right: 1rem !important; }
.pe-4 { padding-right: 1.5rem !important; }
.pe-5 { padding-right: 3rem !important; }

.round-corners,
.round-corners > .vc_column-inner,
.round-corners .woocommerce-product-gallery img { border-radius: 0.25rem; }

.box-shadow { box-shadow: 0 3px 15px 0 rgba(0,0,0,0.15); }

.border-light-gray { border: 1px solid var(--color-content-border); }
.border-dark-gray { border: 1px solid var(--color-alt-content-border); }

/* Primarily for separators */
.h-3 { height: 0.5rem !important; }
.h-4 { height: 1.5rem !important; }
.h-5 { height: 3rem !important; }

/* For icon/links that aren't coming from the page builder */
.icon-link-pair {
    color: var(--color-content-link);
}

/* For consistent icon/text horizontal wrapper lines */
.left-icon-pair {
    --hwrapper-gap: 0.5rem !important;
}
    .left-icon .w-iconbox-icon {
        align-items: center !important;
        justify-content: center !important;
        width: 1rem !important;
        font-size: 1rem !important;
    }
    .left-icon-pair > div:last-child {
        width: calc(100% - 1.5rem);
        overflow-wrap: break-word !important;
        line-height: 1.3;
    }
    .left-icon-pair .w-post-elm-before {
        /*font-weight: 700;*/
    }

/* To use an icon/text format but have it look like a bulleted list, since
we can't use a true list with the page builder and custom fields with conditional logic */
.simulated-bullet-icon {
    display: flex;
}
    .simulated-bullet-icon .w-iconbox-icon {
        width: 0.5rem !important;
        font-size: 0.25rem !important;
        text-align: right !important;
        display: inline-block;
        margin-top: 0.75rem !important;
    }
    .simulated-bullet-icon.with-indent .w-iconbox-icon {
        width: 2.5rem !important;
    }

/* Bordered "text" icon links */
#page-content .bordered-text-icon-link {
    width: 42px;
    height: 42px;
    text-align: center;
    border: 2px solid var(--color-alt-content-border);
    border-radius: 0.25rem;
    padding: 0.25rem;
    margin-bottom: 0.25rem;
}
    #page-content .bordered-text-icon-link a {
        color: var(--color-alt-content-border);
        font-size: 1.25rem !important;
    }
        #page-content .bordered-text-icon-link a > i {
            margin-right: 0 !important;
        }

.apple-infographic {}
    .apple-infographic > .apple-infographic-value {
        width: 180px;
        height: 180px;
        margin: 0 auto;
        background-size: contain;
        background-repeat: no-repeat;
        font-size: 2.5rem;
        font-weight: 700;
        display: flex;
        justify-content: center;
        align-items: center;
        padding-top: 1.5rem;
    }
        .apple-infographic.dark-green > .apple-infographic-value {
            background-image: url("img/graph-apple-dark-green.png");
            color: #fff;
        }
        .apple-infographic.light-green > .apple-infographic-value {
            background-image: url("img/graph-apple-light-green.png");
            color: var(--color-content-text);
        }
        .apple-infographic.pink > .apple-infographic-value {
            background-image: url("img/graph-apple-pink.png");
            color: #000;
        }
        .apple-infographic.gray > .apple-infographic-value {
            background-image: url("img/graph-apple-gray.png");
            color: #444;
        }
    .apple-infographic > .apple-infographic-label {
        margin-top: 1rem;
        text-align: center;
        color: #000;
        font-weight: 600;
    }

@media screen and (max-width:1024px) {
    .apple-infographic > .apple-infographic-value {
        width: 150px;
        height: 150px;
    }
}

@media screen and (max-width:600px) {
    /* Reduce spacing between "S" row wrapped column elements */
    #page-content .reduce-gap-for-mobile > div > .vc_row,
    #page-content .reduce-gap-for-mobile {
        /*grid-gap: 1.5rem !important;*/ /* Override an inline style; make the same as the "S" section padding */
    }

    /* Bump center/right aligned items to the left for mobile */
    #page-content .align-left-for-mobile {
        justify-content: flex-start;
    }

    /* Bump width items up to 100% */
    /* .hwrapper-row can roughly simulate row/columns where very nested items are not possible */
    .hwrapper-row > .w-25,
    .hwrapper-row > .w-50,
    .hwrapper-row > .w-75 {
        margin-bottom: 1.5rem;
        width: 100%;
    }
    .hwrapper-row > *:last-child {
        margin-bottom: 0;
    }
    .w-25 { width: 100%; }
    .w-50 { width: 100%; }
    .w-75 { width: 100%; }

    .remove-padding-for-mobile {
        padding: 0 !important;
    }
}

/* ************************************************************************* */
/* Flexslider/Product Gallery - Override Theme ***************************** */
/* ************************************************************************* */

/* Hide extra space from tall slides */
#page-content .woocommerce-product-gallery,
#page-content .woocommerce-product-gallery__wrapper,
.flexslider,
.flexslider .slides {
    overflow: hidden;
}

#page-content .flexslider,
.ui-dialog.ui-widget .flexslider {
    margin-bottom: 0;
    border: 0;
    border-radius: 0;
}

    /* Remove some extra margin at the bottom of individual images */
    #page-content .woocommerce-product-gallery__image,
    #page-content .flexslider .slide,
    .ui-dialog.ui-widget .flexslider .slide {
        margin-bottom: 0 !important;
    }

        /* Images should be large enough...unless they're portrait, so stretch it a little
         for those edge cases rather than load very large images for everything */
        #page-content .woocommerce-product-gallery__image img {
            width: 100%;
        }

/* Forums say this will help with slow loading in safari */
/*#page-content .flexslider .slides > li,*/
/*.ui-dialog.ui-widget .flexslider .slides > li {*/
/*    display: none;*/
/*    -webkit-backface-visibility: hidden;*/
/*    backface-visibility: hidden;*/
/*}*/
/*#page-content .flexslider .slides > li:first-child,*/
/*.ui-dialog.ui-widget .flexslider .slides > li:first-child {*/
/*    display: block;*/
/*    -webkit-backface-visibility: visible;*/
/*    backface-visibility: visible;*/
/*}*/
/* And then I'm adding this to improve performance in safari; images will be set to display block later via js
after flexslider() runs on ajax content */
/*#page-content .school-search-results .flexslider .slides > li img {*/
/*    display: none;*/
/*}*/

/* Always show the arrows */
#page-content .flex-direction-nav a,
.ui-dialog.ui-widget .flex-direction-nav a {
    opacity: 0.8;
    background-color: #fff;
    border-radius: 50%;
    text-align: center;
    line-height: 1;
}

/* Overlay the arrows on the image rather than next to, and adjust some spacing/sizing */
#page-content .flex-prev,
.ui-dialog.ui-widget .flex-prev {
    left: 0.5rem !important;
}
    #page-content .flex-prev::before,
    .ui-dialog.ui-widget .flex-prev::before {
        margin-top: 5px;
        margin-right: 3px;
        font-size: 32px;
    }
#page-content .flex-next,
.ui-dialog.ui-widget .flex-next {
    right: 0.5rem !important;
}
    #page-content .flex-next::before,
    .ui-dialog.ui-widget .flex-next::before {
        margin-top: 5px;
        margin-left: 3px;
        font-size: 32px;
    }

.flex-control-nav {
    position: static !important;
    margin-top: 1rem;
}

/* ************************************************************************* */
/* School Profile Single Template ****************************************** */
/* ************************************************************************* */

/* These headings may need to be adjusted later, but I'm going to try to match
what's already set up for now */
.single-product #page-content h2 {
    font-size: 1.1rem;
    font-weight: 600;
    padding-top: 0
}
.single-product #page-content h3,
.single-product #page-content h4 {
    font-size: 1rem;
    font-weight: 600;
    padding-top: 0
}
.single-product #page-content strong {
    font-weight: 600;
}
.single-product #page-content hr {
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
}

/*.school-profile-sidebar .w-post-elm-before {
    font-weight: 400 !important;
}*/

.single-product .left-icon-pair > div:last-child {
    padding-top: 4px; /* Adjustment for line height */
}

.school-profile-about-block {
    display: inline-block;
    width: calc(60% - 3rem);
    margin-right: 3rem;
    vertical-align: top;
}
.school-profile-bullet-points-block {
    display: inline-block;
    width: 39%;
    vertical-align: top;
}
    /*.school-profile-bullet-points-block .w-post-elm-before {
        font-weight: 400 !important;
    }*/

/* Fix to add similar spacing on elements wrapped in conditional block, which
adds an extra div tag for optional additional classes */
.school-profile-sidebar.w-vwrapper > div > *:not(:last-child) {
    margin-bottom: var(--vwrapper-gap,0.7rem);
}

/* Show tab content at page load so the charts will animate for a print; we'll hide them
again with javascript immediately */
body.single-product #page-content .w-tabs-section,
body.single-product #page-content .w-tabs-section-content {
    display: block;
}

/* Color, width, etc. adjustments for tabs section to override theme/page builder;
the tabs container is set to be full width to get the tabs to have a separate
white bg all the way across, so we need to manually apply a similar
width-restriction wrapper: */
.school-profile-tabs-row {
    background-color: var(--color-alt-content-overlay); /* Blue bg */
}
    .school-profile-tabs .w-tabs-list {
        background-color: var(--color-content-bg); /* White bg */
        padding: 1rem 3vmax; /* Match tab sections below tabs */
    }
        .school-profile-tabs .w-tabs-list-h {
            max-width: 1140px; /* Match tab sections below tabs */
            margin: 0 auto; /* Match tab sections below tabs */
        }
            #page-content .school-profile-tabs .w-tabs-item,
            #page-content .school-profile-tabs .w-tabs-item:focus,
            #page-content .school-profile-tabs .w-tabs-section-header,
            #page-content .school-profile-tabs .w-tabs-section-header:focus {
                color: var(--color-alt-content-primary);
                opacity: 1;
            }
            #page-content .school-profile-tabs .w-tabs-section-header,
            #page-content .school-profile-tabs .w-tabs-section-header:focus {
                background-color: var(--color-content-bg);
            }
            #page-content .school-profile-tabs .w-tabs-item.active,
            #page-content .school-profile-tabs .w-tabs-section.active .w-tabs-section-header {
                color: var(--color-alt-content-primary);
                background-color: var(--color-alt-content-overlay);
                box-shadow: none;
            }
    #page-content .school-profile-tabs .w-tabs-section-content {
        /*padding: 5vh 3vmax; what page builder generates */
        padding: 1rem 3vmax;
    }
        /* Fix gap alignment issue between 1/3+2/3 and 1/3+1/3+1/3 */
        /*.school-profile-tabs .g-cols.cols_1-2 {
            grid-template-columns: calc((100% - 2rem) / 3) calc(((100% - 2rem) / 3 * 2) + 1rem);
        }
        .school-profile-tabs .g-cols.cols_2-1 {
            grid-template-columns: calc(((100% - 2rem) / 3 * 2) + 1rem) calc((100% - 2rem) / 3);
        }*/

/* Reverse the order of feeder schools for mobile so it doesn't appear as a stray heading:
(can't use page builder for this since it's 3 columns) */
@media only screen and (max-width:600px) {
    #page-content .school-profile-feeder-schools-row > .wpb_column:nth-child(2) {
        order: 1;
    }
    #page-content .school-profile-feeder-schools-row > .wpb_column:nth-child(3) {
        order: 2;
    }
    #page-content .school-profile-feeder-schools-row > .wpb_column:nth-child(1) {
        order: 3;
    }
}

/* Charts */

/* Default chart height */
.chart-wrapper {
    height: 300px; }

/* chart background color */
.chartjs-render-monitor {
    background: #fff; }

.demographics-chart {
    padding: 1rem;
    /*background-color: #fff;*/
    /*border-bottom: 2px dotted #e8e8e8;*/ }

/* Some formatting help for parent perspective */
.school-profile-parent-perspective .alignleft {
    margin-right: 1.5rem;
    margin-top: 0.5rem;
}
.school-profile-parent-perspective .alignright {
    margin-left: 1.5rem;
    margin-top: 0.5rem;
}

@media screen and (max-width:768px) {
    #page-content .school-profile-tabs .w-tabs-section-content {
        padding-top: 0;
    }
}

@media screen and (max-width:600px) {
    .school-profile-about-block,
    .school-profile-bullet-points-block {
        display: block;
        width: 100%;
        margin-right: 0;
    }
    .school-profile-about-block {
        margin-bottom: 1rem;
    }

    /* Some formatting help for parent perspective */
    .school-profile-parent-perspective .alignleft,
    .school-profile-parent-perspective .alignright {
        margin-left: 0;
        margin-right: 0;
        margin-top: 0;
        float: none;
    }
}

@media print {
    body.single-product {
        /* Try to get background colors etc to print, though it's no guarantee vs browser settings */
        -webkit-print-color-adjust: exact !important;
        color-adjust: exact !important;
        print-color-adjust: exact !important;
    }
    body.single-product div {
        position: relative !important; /* This prevents line separators from appearing in odd places */
        /*display: block; /* Apparently not being block really messes up lines and causes them to get broken in half? */
    }
    body.single-product p,
    body.single-product ul,
    body.single-product .type_text {
        line-height: 1.3;
    }
    body.single-product h2,
    body.single-product h3,
    body.single-product .w-tabs-section-header {
        page-break-after: avoid;
        break-after: avoid;
    }

    #page-content .school-profile-title-row {
        border-bottom: 1px solid black;
    }
        #page-content .school-profile-title-row > .l-section-h {
            padding: 0 !important;
        }
            #page-content .school-profile-title-row .vc_col-sm-9 {
                width: 100%;
            }
    #page-content .school-profile-details-row {
    }
        #page-content .school-profile-details-row > .l-section-h {
            padding: 0 !important;
        }
            #page-content .school-profile-details-row > .l-section-h > .g-cols {
                display: flex !important;
                width: 100%;
                flex-wrap: wrap;
            }
                #page-content .school-profile-details-row > .l-section-h > .g-cols > .wpb_column:first-child {
                    flex-basis: 100%;
                    max-width: 100%;
                    width: 100%;
                    order: 2 !important;
                }
                #page-content .school-profile-details-row > .l-section-h > .g-cols > .wpb_column:last-child {
                    flex-basis: 100%;
                    max-width: 100%;
                    width: 100%;
                    order: 1 !important;
                    margin-bottom: 0;
                }
                    #page-content .school-profile-sidebar-column {
                        border-bottom: 1px solid black;
                        padding-bottom: 1.5rem;
                        margin-bottom: 0;
                    }
                        #page-content .school-profile-sidebar-column > .vc_column-inner {
                            padding-right: 0;
                            margin-right: 0;
                            display: block;
                        }
                        #page-content .school-profile-sidebar-column > .vc_column-inner > .wpb_wrapper {
                            display: flex !important;
                            width: 100%;
                            flex-wrap: nowrap;
                            position: static;
                            top: 0;
                        }
                            #page-content .school-profile-details-row .school_logo {
                                display: none;
                            }
                            #page-content .school-profile-sidebar-column .post_image,
                            #page-content .school-profile-sidebar-column .school_logo {
                                display: block;
                                flex-basis: 200px;
                                max-width: 200px;
                                width: 200px;
                                padding-left: 1.5rem;
                            }
                            #page-content .school-profile-sidebar-column .school_logo:empty {
                                display: none;
                            }
                            #page-content .school-profile-sidebar-column .school-profile-sidebar {
                                border: 0 !important;
                                padding: 0 !important;
                                flex-grow: 1;
                            }
        #page-content .school-profile-details-row .mt-5 {
            margin-top: 1.5rem !important;
        }
        #page-content .school-profile-details-row .w-separator.with_line,
        #page-content .school-profile-details-row .w-separator {
            height: 2px !important;
            position: static;
            margin-top: 1.5rem !important;
            margin-bottom: 1.5rem !important;
            border-top: 1px solid black;
        }
        #page-content .school-profile-details-row .w-separator * {
            display: none;
        }
        #page-content .school-profile-sidebar .w-separator {
            display: none;
        }
        .school-profile-about-block,
        .school-profile-bullet-points-block {
            display: block;
            width: 100%;
            margin-right: 0;
        }
        .school-profile-about-block {
            margin-bottom: 1rem;
        }
    #page-content .school-profile-tabs-row {
        margin-top: 1.5rem !important;
    }
        #page-content .school-profile-tabs .w-tabs-section-header {
            max-width: 1140px;
            margin-left: auto;
            margin-right: auto;
        }
            #page-content .school-profile-tabs .w-tabs-section-title {
                font-size: 1.75rem;
                font-weight: 600;
                margin-top: 1.5rem;
            }
        #page-content .school-profile-tabs .w-tabs-section-content {
            padding: 0;
        }
            #page-content .school-profile-tabs .apple-infographic {
                border: 1px solid black;
                padding: 1rem;
                display: block;
                page-break-inside: avoid;
                break-inside: avoid;
            }
                #page-content .school-profile-tabs .apple-infographic-value,
                #page-content .school-profile-tabs .apple-infographic-label {
                    width: auto;
                    height: auto;
                    padding: 0;
                    display: block;
                    text-align: center;
                }
                #page-content .school-profile-tabs .apple-infographic-label:first-child,
                #page-content .school-profile-tabs .apple-infographic-value:empty + .apple-infographic-label {
                    margin-top: 0;
                }
                .school-profile-tabs .graph_img {
                    width: 100%;
                }
                .school-profile-tabs hr {
                    display: none;
                }
                .school-profile-tabs .w-tabs-section-content-h > .g-cols > .wpb_column,
                .school-profile-tabs .w-tabs-section-content-h > .g-cols > .wpb_column > .vc_column-inner {
                    display: block;
                    width: 100%;
                }
}

/* ************************************************************************* */
/* School Search *********************************************************** */
/* ************************************************************************* */

body.post-type-archive-product #page-content {
    background-color: var(--color-content-bg-alt);
}

.school-search-results{
    position: relative;
    min-height: 250px;
}

    .school-search-meta {
        display: flex;
        flex-wrap: wrap;
        margin-bottom: 0.5rem;
    }
        .school-search-meta-left {
            flex-basis: 50%;
            margin-bottom: 1rem;
        }
        .school-search-meta-right {
            flex-basis: 50%;
            text-align: right;
            margin-bottom: 1rem;
            font-weight: 600;
        }
            .view-mode-wrapper > span {
                display: inline-block;
                margin-left: 0.5rem;
            }
                .school-search-results-count,
                .school-total {
                    font-weight: 700;
                }
            .school-search-meta .active {
                display: none;
            }

    .school-search-results #no_result {
        margin-top: 3rem;
        margin-bottom: 3rem;
        text-align: center;
    }

    .school-search-results #filter-loading {
        position: absolute;
        top: 0;
        bottom: 0;
        /*left: 1rem;
        right: 1rem;*/ /* To cover up the box shadow underneath */
        left: -1rem;
        right: -1rem;
        background-repeat: no-repeat;
        background-position: center 100px;
        background-color: #fff; /*var(--color-content-bg-alt);*/
        z-index: 9998;
    }

    .school-search-results #googlemap {
        height: 800px;
        width: 100%;
        /*opacity: 0;*/
        display: none;
    }
    .school-search-results #legend-wrapper {
        display: none;
    }
    .school-search-results #legend {
        display: flex;
        flex-wrap: wrap;
        width: 100%;
        margin-top: 1rem;
        justify-content: space-between;
    }
        .school-search-results #legend > div {
            width: calc((100% / 3) - 0.333rem);
            margin-bottom: 0.5rem;
            background-color: #e8e8e8;
            padding: 6px;
            display: flex;
            align-items: center;
            line-height: 1;
        }
            .school-search-results #legend div .legend_box {
                height: 12px;
                width: 12px;
                margin-right: 6px;
                padding: 0;
            }

    .school-grid-item {
        border-radius: 0.25rem;
        background-color: #fff;
        margin-bottom: 1rem;
        box-shadow: 0 3px 15px 0 rgba(0,0,0,0.15);
        overflow: hidden;
        padding-left: 0;
        padding-right: 0;
    }
        .school-grid-item-column-1 {
            position: relative;
            flex-direction: initial;
            overflow: hidden;
        }
            .school-grid-item-column-1 .vc_column-inner {
                padding-right: 0 !important;
            }
            /* The following will stretch the slideshow to the height of the container: */
            .school-grid-item-column-1 .vc_column-inner,
            .school-grid-item-column-1 .wpb_text_column,
            .school-grid-item-column-1 .wpb_wrapper {
                display: flex;
                flex: 1;
            }
            .school-grid-item-column-1 .flexslider,
            .school-grid-item-column-1 .flexslider .slides,
            .school-grid-item-column-1 .flexslider .slides li,
            .school-grid-item-column-1 .single-image {
                margin-left: 0;
                height: 100%;
                width: 100%;
                background-size: cover;
                background-position: center center;
            }
                .school-grid-item-column-1 .flexslider .slides li a,
                .school-grid-item-column-1 .single-image a {
                    display: block;
                    height: 100%;
                }
                .school-grid-item-column-1 .flexslider .slides li img,
                .school-grid-item-column-1 .single-image img {
                    display: none; /* The image will be shown for mobile */
                }
                .school-grid-item-column-1 .flexslider .slides img,
                .school-grid-item-column-1 .single-image img {
                    /*display: block;
                    max-width: none;
                    height: 100%;
                    width: 100%;
                    object-fit: cover;
                    object-position: center center;*/
                }

            .school-grid-item-compare-button {
                position: absolute;
                top: 0.25rem;
                right: 0.25rem;
            }
        .school-grid-item-column-2 {
            border-right: 1px solid var(--color-content-border);
            overflow-wrap: break-word !important;
        }
            .school-grid-item-column-2 .vc_column-inner {
                /*padding: 1rem !important; Megan has overridden this so throw it out */
            }
            .school-grid-item-column-2 h2 {
                font-size: 1.5rem;
                font-weight: 600;
            }
            .school-grid-item-column-2 .simulated-bullet-icon .w-iconbox-icon {
                margin-top: 0.45rem !important; /* Font size is smaller here */
            }
        .school-grid-item-column-3 {

        }
            .school-grid-item-column-3 > .vc_column-inner {
                display: flex;
                flex-direction: column;
                flex: 1;
                padding: 1rem 2.5rem 1rem 1rem !important;
            }
                .school-grid-item-column-3 > .vc_column-inner > .wpb_wrapper {
                    display: flex;
                    flex-direction: column;
                    flex: 1;
                }
                    .school-grid-item-column-3 .w-btn-wrapper {
                        margin: 0 !important;
                        width: 100%;
                        flex: 1;
                        display: flex;
                        align-items: flex-end;
                    }
                        #page-content .school-grid-item-profile-button {
                            padding-left: 1rem;
                            padding-right: 1rem;
                            width: 100%;
                        }

#filter {}
    .school-search-top-filters{
        border: 2px solid var(--color-content-border);
        background-color: #fff;
        border-radius: 2rem;
        display: flex;
        flex-wrap: nowrap;
        align-items: center;
        align-content: center;
        overflow: hidden;
        padding: 0.5rem;
    }
        .school-search-top-filters .top-filter-address {
            /*flex-basis: 64%;*/
            flex: 1;
            padding-left: 10px;
            padding-right: 10px;
            border-right: 1px solid var(--color-content-border);
            position: relative;
        }
        .home .school-search-top-filters .top-filter-address {
            /*flex-basis: 55%;*/
        }
            .school-search-top-filters .top-filter-address i {
                position: absolute;
                left: 20px;
                top: calc(50% - 11px);
                font-size: 22px;
            }
        .school-search-top-filters .top-filter-distance,
        .school-search-top-filters .top-filter-grade-levels,
        .school-search-top-filters .top-filter-ages {
            /*max-width: calc(36% - 55px);
            flex-basis: calc(36% - 55px);*/
            padding-left: 10px;
            padding-right: 10px;
            border-right: 1px solid var(--color-content-border);
        }
            .school-search-top-filters .top-filter-distance {
                max-width: 200px;
                flex-basis: 200px;
            }
            .school-search-top-filters .top-filter-grade-levels {
                max-width: 170px;
                flex-basis: 170px;
            }
            .school-search-top-filters .top-filter-ages {
                max-width: 150px;
                flex-basis: 150px;
            }
        .school-search-top-filters .top-filter-submit {
            padding-left: 10px;
            flex-basis: 55px;
        }
            .school-search-top-filters input[type="text"],
            .school-search-top-filters select {
                background-color: #fff;
                border: 0 !important;
                box-shadow: none;
            }
            /*.school-search-top-filters input[type="text"]:focus,
            .school-search-top-filters select:focus {
                outline: 2px dashed var(--color-content-secondary) !important;
            }*/
            .school-search-top-filters #input_gmap_search {
               padding-left: 35px;
            }
            .school-search-top-filters .top-submit {
                width: 45px;
                height: 45px;
                padding: 0 !important;
                border-radius: 50%;
            }
    .school-search-left-filters{}
        .school-search-left-filters .grade-level {
            margin-bottom: 1.5rem;
        }
            .school-search-left-filters .grade-level .switch-field {
                margin-bottom: 0;
                justify-content: flex-start;
                width: 100%;
                overflow: visible;
            }
                .school-search-left-filters .grade-level .switch-field label {
                    flex: 1;
                    border: 0;
                    background-color: #fff;
                    font-size: 16px;
                    color: var(--color-content-text);
                }
                .school-search-left-filters .grade-level .switch-field input:checked + label {
                    background-color: var(--color-content-primary);
                    color: #fff;
                }
                .school-search-left-filters .grade-level .switch-field label:first-of-type {
                    border-radius: 3em 0 0 3em;
                }
                .school-search-left-filters .grade-level .switch-field label:last-of-type {
                    border-radius: 0 3em 3em 0;
                }
        #filter_by {
            margin-bottom: 1rem;
        }
            #filter_by > span {
                display: inline-block;
                background-color: var(--color-alt-content-bg-alt);
                padding: 7px 9px 7px 8px;
                border-radius: 1rem;
                margin-bottom: 0.5rem;
                margin-right: 0.25rem;
                line-height: 1.3;
            }
                #filter_by a {
                    display: inline-block;
                    position: relative;
                    top: 1px;
                    margin-right: 0;
                }
        #content-trigger {
            font-size: 16px;
            font-weight: 700;
            margin: 0;
            padding-top: 0;
        }
            #content-trigger .change-trigger-copy::before {
                content: 'Filters';
            }
        #content-trigger.accordion-header { /* This is really mobile, but js makes it an accordion for mobile */
            display: block;
            margin: 0;
            padding: 1em 1.5rem 1em 0.75rem;
            background-color: var(--color-content-primary);
            color: #fff;
            border-radius: 0.25rem;
        }
            #content-trigger.accordion-header .change-trigger-copy::before {
                content: 'Select Advanced Filters';
            }
        #filter-content {}
            #filter-content > div > div {
                margin-top: 0.75rem;
                border-top: 1px solid var(--color-content-border);
                padding: 0.75rem 0 0;
            }
            #filter-content > div > div .accordion-content {
                display: none;
            }
                #page-content #filter-content .accordion-header,
                #page-content #content-trigger {
                    display: flex;
                    align-items: center;
                    text-decoration: none;
                }
                    #page-content #filter-content .accordion-header span,
                    #page-content #content-trigger span{
                        flex: 1;
                    }
                    #content-trigger i { display: none; }
                    /*#filter-content .accordion-header i,
                    #content-trigger i { float: right; }*/
                    #filter-content .accordion-header .fa-minus { display: none; }
                    #filter-content .accordion-header .fa-plus { display: inline-block; }
                    #filter-content .accordion-header.active .fa-minus { display: inline-block; }
                    #filter-content .accordion-header.active .fa-plus { display: none; }
                #filter-content .accordion-content {
                    padding-top: 0.5rem;
                }
        #name_search {
            background-color: #fff;
            border: 1px solid var(--color-content-border);
        }

/* Customize neighborhood schools button by visually hiding checkbox and using label
before and after pseudo-elements to style new "checkbox" */
/* Try to match other icons from page builder */
.neighborhood-school-option {
    display: flex;
    /*align-items: center;
    align-content: center;*/
}
.neighborhood-school-option .neighborhood-school-option-text {
    line-height: 1.3;
    flex: 1;
    padding-left: 0.5rem;
}
.neighborhood-school-option .as-icon {
    position: relative;
    margin: 0;
    width: 24px;
    height: 24px;
}
    /* Visually hide checkbox */
    .neighborhood-school-option .as-icon input[type="checkbox"] {
        position: absolute;
        z-index: 100;
        width: 24px;
        height: 24px;
        top: 0;
        left: 0;
        margin: 0;
        opacity: 0;
    }
    /* Make icon wrapper the bordered container */
    .neighborhood-school-option .as-icon input[type="checkbox"] + .the-icon {
        position: absolute;
        z-index: 99;
        width: 24px;
        height: 24px;
        top: 0;
        left: 0;
        content: "";
        border: 1px solid var(--color-content-border);
        border-radius: 50%;
        display: flex;
        justify-content: center;
        align-items: center;
        background-color: #fff;
    }
        .neighborhood-school-option .as-icon input[type="checkbox"]:checked + .the-icon {
            background-color: var(--color-content-primary) !important;
            color: #fff !important;
        }
        /* Position the icon inside */
        .neighborhood-school-option .as-icon input[type="checkbox"] + .the-icon > span {
            display: inline-block;
            font-size: 0.75rem !important;
            line-height: 0 !important;
        }
        /* Conditionally show one or the other icon depending on if the checkbox is checked */
        .neighborhood-school-option .as-icon input[type="checkbox"] + .the-icon > span.neighborhood-school-icon-solid,
        .neighborhood-school-option .as-icon input[type="checkbox"]:checked + .the-icon > span.neighborhood-school-icon-outline {
            display: none;
        }
        .neighborhood-school-option .as-icon input[type="checkbox"]:checked + .the-icon > span.neighborhood-school-icon-solid,
        .neighborhood-school-option .as-icon input[type="checkbox"] + .the-icon > span.neighborhood-school-icon-outline {
            display: inline-block;
        }

@media screen and (max-width:1024px) {
    /* Stack the columns early, whole page template */
    #filter > .wpb_row > div > .g-cols > .wpb_column {
        /*grid-template-columns: 100%;*/
        width: 100%;
        margin-bottom: 0;
    }
    #filter > .wpb_row.reduce-gap-for-mobile > div > .g-cols > .wpb_column {
        /*grid-gap: 1.5rem !important;*/
        margin-bottom: 1.5rem !important;
    }
    #filter > .wpb_row.reduce-gap-for-mobile > div > .g-cols > .wpb_column:last-of-type {
        margin-bottom: 0 !important;
    }
    /*#page-content .school-grid-item .vc_row {
        grid-gap: 0 !important;
    }*/
}

@media screen and (max-width:768px) {
    .school-search-meta-left,
    .school-search-meta-right {
        flex-basis: 100%;
        text-align: left;
    }
    .view-mode-wrapper > span {
        display: block;
        margin-left: 0;
    }

    .school-search-results #legend > div {
        width: calc((100% / 2) - 0.333rem);
    }

    /* Stack the columns early, results */
    #page-content .school-grid-item .g-cols .wpb_column {
        /*grid-template-columns: 100%;*/
        width: 100%;
        margin-bottom: 0;
    }
    .school-grid-item-column-1 .vc_column-inner {
        padding-left: 1.5rem !important;
        padding-right: 1.5rem !important;
    }
    #page-content .school-grid-item-column-2 .vc_column-inner,
    #page-content .school-grid-item-column-3 .vc_column-inner { /* Override Megan's !important to prevent content going to the edge */
        padding: 1rem 2.5rem !important;
    }

    .school-grid-item-compare-button {
        right: 1.75rem;
    }

    /* Limit flexslider height when stacked */
    .school-grid-item-column-1 .flexslider,
    .school-grid-item-column-1 .flexslider .slides,
    .school-grid-item-column-1 .flexslider .slides li,
    .school-grid-item-column-1 .single-image {
        /*max-height: 300px;*/
        height: auto;
        background-image: none !important;
    }
    .school-grid-item-column-1 .flexslider .slides li img,
    .school-grid-item-column-1 .single-image img {
        height: auto;
        display: block;
        width: 100%;
    }
    .school-grid-item-column-1 .flexslider .slides li a,
    .school-grid-item-column-1 .single-image a {
        height: auto;
    }

    .school-grid-item-column-2 {
        border-right: 0;
        border-bottom: 1px solid var(--color-content-border);
        /*padding-top: 0.5rem;*/
    }

    .school-search-top-filters {
        border-radius: 0.5rem;
        flex-wrap: wrap;
    }
    .school-search-top-filters .top-filter-address,
    .home .school-search-top-filters .top-filter-address,
    .school-search-top-filters .top-filter-distance,
    .home .school-search-top-filters .top-filter-distance,
    .school-search-top-filters .top-filter-grade-levels,
    .school-search-top-filters .top-filter-ages,
    .school-search-top-filters .top-filter-submit {
        max-width: 100%;
        flex-basis: 100%;
        border-right: 0;
        padding-left: 0;
        padding-right: 0;
        margin-bottom: 0.5rem;
        border-bottom: 1px solid var(--color-content-border);
    }
    .school-search-top-filters .top-filter-submit {
        margin-bottom: 0;
    }
        .school-search-top-filters .top-filter-address i {
            left: 10px;
        }
        .school-search-top-filters #input_gmap_search {
            padding-left: 35px;
        }
        .school-search-top-filters .top-submit {
            width: 100%;
            border-radius: 0.25rem;
        }
}

@media screen and (max-width:768px) {
    #content-trigger.accordion-header .fa-minus { display: inline-block; }
    #content-trigger.accordion-header .fa-plus { display: none; }
    #content-trigger.accordion-header.active .fa-minus { display: none; }
    #content-trigger.accordion-header.active .fa-plus { display: inline-block; }
}

@media screen and (max-width:600px) {
    .school-search-results #legend > div {
        width: 100%;
    }
}

/* ************************************************************************* */
/* Woocommerce Products Compare ******************************************** */
/* ************************************************************************* */

/* Customize compare button by visually hiding checkbox and using label
before and after pseudo-elements to style new "checkbox" */
/* Try to match other icons from page builder */
.woocommerce-products-compare-compare-button.as-icon {
    position: relative;
    margin: 0 0 0.25rem;
    width: 42px;
    height: 42px;
}
    /* Visually hide checkbox */
    .woocommerce-products-compare-compare-button.as-icon input[type="checkbox"] {
        position: absolute;
        z-index: 100;
        width: 42px;
        height: 42px;
        top: 0;
        left: 0;
        margin: 0;
        opacity: 0;
    }
    /* Make label the bordered container */
    .woocommerce-products-compare-compare-button.as-icon input[type="checkbox"] + label {
        position: absolute;
        z-index: 99;
        width: 42px;
        height: 42px;
        top: 0;
        left: 0;
        content: "";
        border: 2px solid var(--color-alt-content-border);
        border-radius: 0.25rem;
        display: flex;
        justify-content: center;
        align-items: center;
        background-color: #fff;
    }
    /* Position the icon inside */
    .woocommerce-products-compare-compare-button.as-icon input[type="checkbox"] + label > span {
        display: inline-block;
        color: var(--color-alt-content-border);
        font-size: 1.25rem !important;
        line-height: 0 !important;
    }
    /* Conditionally show one or the other icon depending on if the checkbox is checked */
    .woocommerce-products-compare-compare-button.as-icon input[type="checkbox"] + label > span.compare-icon-solid,
    .woocommerce-products-compare-compare-button.as-icon input[type="checkbox"]:checked + label > span.compare-icon-outline {
        display: none;
    }
    .woocommerce-products-compare-compare-button.as-icon input[type="checkbox"] + label > span.compare-icon-outline,
    .woocommerce-products-compare-compare-button.as-icon input[type="checkbox"]:checked + label > span.compare-icon-solid {
        display: inline-block;
    }

/* Comparison page */
.smkcs-woocommerce-products-compare{
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
}
    .smkcs-woocommerce-products-compare .compare-favorites-intro-copy {
        text-align: center;
    }
    .smkcs-woocommerce-products-compare .wrap-compare-selectors {
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }
        .smkcs-woocommerce-products-compare .wrap-compare-selectors .woocommerce-products-compare-compare-button {
            margin: 0;
        }
    .woocommerce-products-compare-content {
        margin-top: 1.5rem;
        text-align: center;
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }
        .woocommerce-products-compare-content table tr th,
        .woocommerce-products-compare-content table tr td {
            background-color: #fff;
            border-left-style: solid;
            line-height: 1.3;
            text-align: left;
            word-break: break-word;
        }
        .woocommerce-products-compare-content table tbody tr:hover th,
        .woocommerce-products-compare-content table tbody tr:hover td {
            background-color: var(--color-alt-content-overlay) !important;
        }
            .woocommerce-products-compare-content td ul,
            .woocommerce-products-compare-content td ol {
                /* No-indent */
                margin-left: 1.25rem;
                padding-left: 0.25rem;
            }
        .woocommerce-products-compare-content .compare-photo {
            vertical-align: middle;
            height: 250px;
            overflow: hidden;
        }
            .woocommerce-products-compare-content .compare-photo img {
                display: block;
                margin: 0 auto;
                text-align: center;
                object-fit: cover;
                width: 100%;
                height: 100%;
            }

@media screen and (max-width:1024px) {
    .compare-schools-table-wrapper {
        overflow-x: auto;
    }
    .woocommerce-products-compare-content table tbody tr th,
    .woocommerce-products-compare-content table tbody tr td {
        min-width: 200px;
    }
    .woocommerce-products-compare-content table tbody tr th {
        min-width: 0;
    }
}

@media print {
    .woocommerce-products-compare-content table tbody tr th {
        min-width: 0;
    }
}

/* ************************************************************************* */
/* Guided Quiz ************************************************************* */
/* ************************************************************************* */
#guided-quiz-form .location-search {
    background-color: var(--color-content-bg-alt);
    /*border: 2px solid var(--color-content-border);*/
    border-radius: 0.25rem;
    padding: 1rem;
}
#guided-quiz-form .select2 {
    /*max-width: 300px !important;*/
}
#guided-quiz-form .location-search > label {
    font-weight: 600;
    line-height: 1.3;
}
#guided-quiz-form input[type="text"],
#guided-quiz-form .select2-selection {
    width: 100%;
    background-color: #fff;
}

/* ************************************************************************* */
/* School "Virtual Tours" Online Gallery *********************************** */
/* ************************************************************************* */
.tour-list {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.5rem;
    list-style-type: none;
    margin: 0;
    padding: 0;
}
    .tour-list li {
        position: relative;
        margin: 0;
        padding: 0;
    }
        .tour-list a {
            border-radius: 0.25rem;
            overflow: hidden;
            display: block;
            width: 100%;
            height: 100%;
            transition:
                transform 0.2s linear,
                box-shadow 0.2s linear
            ;
        }
        .tour-list a:hover,
        .tour-list a:focus {
            /*transform: scale(1.025);
            -webkit-backface-visibility: hidden;
            backface-visibility: hidden;*/
            transform: translateY(-0.25rem);
            transition:
                transform 0.2s linear,
                box-shadow 0.2s linear
            ;
            box-shadow: 0 3px 15px 0 rgba(0,0,0,0.15);
        }
        .tour-list a:hover img,
        .tour-list a:focus img {
            /*transform: scale(1.025);
            -webkit-backface-visibility: hidden;
            backface-visibility: hidden;*/
        }
        .tour-list img {
            display: block;
            width: 100%;
            height: 100%;
            object-fit: cover;
        }
        .tour-list .tour-school-title {
            position: absolute;
            bottom: 0.5rem;
            left: 0.5rem;
            right: 0.5rem;
            background: rgba(255,255,255,0.85);
            line-height: 1.3;
            padding: 0.5rem 0.5rem 0.33rem;
            border: 2px solid #fff;
            font-weight: 600;
            text-align: center;
        }

.ui-widget-overlay {
    background: #333;
    opacity: 0.5;
}
.ui-dialog.ui-widget {
    width: calc(100% - 1rem) !important;
    max-width: 768px !important;
    border: 0;
    border-radius: 0.25rem;
    padding: 1rem;
    z-index: 9999;
}
    .ui-dialog.ui-widget .ui-dialog-titlebar {
        background: transparent;
        border: 0;
        font-weight: 600 !important;
        font-family: var(--font-body) !important;
        font-size: 16px !important;
        padding: 0;
        line-height: 1.3;
        display: flex;
        align-content: flex-start;
        align-items: flex-start;
    }
        .ui-dialog.ui-widget .ui-dialog-titlebar > span {
            float: none;
            margin: 0;
            white-space: normal;
            flex: 1;
            padding-right: 1rem;
        }
        .ui-dialog.ui-widget .ui-dialog-titlebar > button {
            position: relative;
            width: 20px;
            margin: 0;
            top: 0;
            right: 0;
        }
            .ui-dialog.ui-widget .ui-dialog-titlebar > button:active,
            .ui-dialog.ui-widget .ui-dialog-titlebar > button:hover,
            .ui-dialog.ui-widget .ui-dialog-titlebar > button:focus {
                background-color: var(--color-content-bg-alt);
            }
    .ui-dialog.ui-widget .tour-gallery-dialog {
        padding: 0;
    }
        .ui-dialog.ui-widget .tour-gallery-dialog .flexslider {
            margin: 1rem 0 0.75rem;
            border: 0;
        }
            .ui-dialog.ui-widget .tour-gallery-dialog .flexslider img {
                border-radius: 0.25rem;
            }
            .ui-dialog.ui-widget .tour-gallery-dialog figcaption {
                padding-top: 0.5rem;
            }
        .ui-dialog.ui-widget .tour-gallery-dialog .tour-dialog-footer {
            text-align: right;
        }

@media screen and (max-width:1024px) {
    .tour-list {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media screen and (max-width:768px) {
    .tour-list {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media screen and (max-width:480px) {
    .tour-list {
        grid-template-columns: repeat(1, 1fr);
    }
}

/* ************************************************************************* */
/* SelectWoo(2) ************************************************************ */
/* ************************************************************************* */

/* Make select 2 responsive */
.select2 {
    width: 100% !important;
    max-width: 100% !important;
}

/* Hide search for distance dropdown; selectwoo doesn't allow us to do this through the normal param */
/* Note: multiselects should keep this visible so the placeholder shows when empty */
/* The search input for standard selects is under a container that's a direct child of body;
the search input for multiselects is within #page-content, so that helps narrow it down.
 */
/*.select2-search input[aria-activedescendant^="select2-select_distance"]{*/
body > .select2-container .select2-search__field {
    display: none !important;
}

/* Make sure multiselect search input is always 100% width, so it will show placeholder. Something in the
code sometimes sets it to 0px */
.select2-selection--multiple li.select2-search input {
    width: 100% !important;
}

/* Hide search/extra space UNLESS we don't have any selections, then show the placeholder */
.select2-selection--multiple li.select2-selection__choice + li.select2-search input {
    display: none !important;
}

/* Remove extra space at top of multiselect selections */
.select2-selection--multiple .select2-selection__choice:first-child {
    margin-top: 0;
}

.select2-dropdown {
    background: #000;
    color: #fff;
    border-radius: 0.5rem;
    overflow: hidden;
    top: 5px;
    cursor: pointer;
    z-index: 9999;
}

/* ************************************************************************* */
/* jQuery Autocomplete ***************************************************** */
/* ************************************************************************* */
.ui-autocomplete {
    background: #000;
    color: #fff;
    border-radius: 0.5rem;
    overflow: hidden;
    border: 0;
}

.ui-autocomplete,
.ui-autocomplete .ui-menu-item {
    z-index: 99999;
    padding: 0 !important;
}

.ui-autocomplete .ui-menu-item,
.ui-autocomplete .ui-menu-item > .ui-menu-item-wrapper,
.ui-autocomplete .ui-menu-item > .ui-menu-item-wrapper.ui-state-hover,
.ui-autocomplete .ui-menu-item > .ui-menu-item-wrapper.ui-state-active,
.ui-autocomplete .ui-menu-item > .ui-menu-item-wrapper.ui-state-focus {
    font-weight: 400 !important;
    font-family: var(--font-body) !important;
    font-size: 16px !important;
    /*color: var(--color-content-text) !important;*/
    color: #fff !important;
    list-style-image: none !important;
    width: 100% !important;
    line-height: 1.3 !important;
    border: 0 !important;
    margin: 0 !important;
}

.ui-autocomplete .ui-menu-item > .ui-menu-item-wrapper {
    padding: 0.5rem !important;
}

.ui-autocomplete .ui-menu-item > .ui-menu-item-wrapper.ui-state-hover,
.ui-autocomplete .ui-menu-item > .ui-menu-item-wrapper.ui-state-active,
.ui-autocomplete .ui-menu-item > .ui-menu-item-wrapper.ui-state-focus {
    background: var(--color-content-primary) !important;
    color: #fff !important;
    margin: 0 !important;
}

/* ************************************************************************* */
/* Tooltips **************************************************************** */
/* ************************************************************************* */
.tooltip-icon {
    color: var(--color-alt-content-border) !important;
}

.ui-tooltip,
.ui-tooltip > div {
    /*background: var(--color-alt-content-border) !important;*/
    background: #000;
    color: #fff;
    opacity: 1;
    font-weight: 400 !important;
    border: 0 !important;
    box-shadow: none !important;
    font-size: 16px !important;
    padding: 0.25rem !important;
    font-family: var(--font-body) !important;
}
