.layoutjsContainer, .layoutjs {
    --font-family-display: var(--font-display);
    --font-family-body: var(--font-body);
    --primary-color: var(--gray-800);
    --secondary-color: var(--gray-400);
    --tertiary-color: var(--gray-100);
    --tertiary-color-hover: var(--gray-200);
    --accent-color: var(--primary-color-700);
    --accent-color-secondary: var(--primary-color-600);
    --alert-color: var(--tertiary-color-900);
    --alert-color-secondary: var(--tertiary-color-300);
    --alert-color-tertiary: var(--tertiary-color-500);
    --box-shadow: var(--shadow);
    --settings-font-family-display: var(--font-family-display);
    --settings-font-family-body: var(--font-family-body);
    --settings-color: var(--primary-color);
    --settings-secondary-color: var(--secondary-color);
    --settings-accent-color: var(--accent-color);
    --settings-bg-color: var(--tertiary-color);
    --filter-font-family-display: var(--font-family-displauy);
    --filter-font-family-body: var(--font-family-body);
    --filter-color: var(--primary-color);
    --filter-bg-color: var(--primary-color);
    --filter-accent-color: var(--accent-color);
    --filter-secondary-color: var(--secondary-color);
    --filter-tertiary-color: var(--tertiary-color);
    --filter-shadow: var(--box-shadow);
    --content-font-family-display: var(--font-family-display);
    --content-font-family-body: var(--font-family-body);
    --content-primary-color: var(--primary-color);
    --content-secondary-color: var(--secondary-color);
    --content-tertiary-color: var(--tertiary-color);
    --content-tertiary-color-hover: var(--tertiary-color-hover);
    --content-accent-color: var(--accent-color);
    --content-enabled-color: var(--accent-color-secondary);
    --content-alert-color: var(--alert-color);
    --content-alert-bg-color: var(--alert-color-secondary);
    --content-alert-accent-color: var(--alert-color-tertiary);
    --datepicker-accent-primary: var(--primary-color-800);
    --datepicker-accent-secondary: var(--primary-color-900);
    --datepicker-accent-tertiary: var(--primary-color-700);
    --datepicker-text-color-primary: var(--gray-700);
    --datepicker-text-color-secondary: var(--gray-300);
    --datepicker-selected: var(--datepicker-accent-primary);
    --datepicker-in-range: var(--datepicker-accent-tertiary);
    --datepicker-selected-text: var(--datepicker-text-color-secondary);
    --datepicker-text: var(--datepicker-text-color-primary);
    --datepicker-in-range-border: var(--datepicker-accent-secondary);
    --datepicker-disabled: var(--datepicker-text-color-secondary);
    --datepicker-hovered-in-range: var(--datepicker-accent-tertiary);
    --compare-menu-cta-bg-color: var(--primary-color-100);
    --compare-menu-cta-bg-color-hover: var(--primary-color-200);
    --compare-menu-cta-text-color: var(--primary-color-700);
}

.layoutjs {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 49px;
    /* height to leave enough room for loading spinner */
}

.layoutjs .layout-container {
    width: 100%;
    flex: 1;
}

.layoutjs .layout-container .layout {
    width: 100%;
    position: relative;
}
.layoutjs a:hover {
    background-color: unset;
}

/* filters & sort */
.layoutjs .settings {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-family: var(--settings-font-family-body);
    font-size: 17px;
    font-weight: 500;
    line-height: var(--leading-none);
    padding: var(--space-4);
    padding-bottom: 17px;
    background: var(--night-blue);
    color: var(--white);
    text-transform: uppercase;
    letter-spacing: .03rem;
}

.layoutjs .settings i {
    font-size: 16px;
    margin-right: 2px;
}

.layoutjs .settings a {
    color: var(--white);
}

.layoutjs .filterPane a, .layoutjs .datepicker-cont .quicklinks button {
    color: var(--filter-color);
}

.layoutjs .rss-link a {
    color: var(--white);
}

.layoutjs .filterPane .highlight a, .layoutjs .datepicker-cont .quicklinks button.highlight, .layoutjs .filterPane .filter[data-type="checkbox"] .expander {
    color: var(--gold);
}

.layoutjs .filterPane .highlight a:hover {
    color: var(--gold)
}

.layoutjs .settings ul, .layoutjs .filterPane ul {
    list-style: none;
    margin: 0;
    line-height: inherit;
    
}

.layoutjs .filterPane ul {
    margin-bottom: 25px;
}

.layoutjs .filterPane ul:last-child {
    margin-bottom: 0;
}

.layoutjs .filterPane {
    display: none;
}

.layoutjs .filterPane.mobileFilterActive {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    z-index: 251;
    display: block;
    width: 100%;
    overflow-y: auto;
    background-color: var(--filter-tertiary-color);
    background-color: var(--night-blue);
    padding: var(--space-5);
}

.root-panel.panel-page.mobile-filter-active {
    z-index: 99999999999;
}

.layoutjs .mobileHeader {
    display: flex;
    align-items: center;
    margin-bottom: var(--space-5);
}

.layoutjs .mobileHeader .mobileTitle {
    flex: 1;
    text-align: center;
    font-family: var(--filter-font-family-body);
    font-size: var(--text-lg);
    font-weight: 700;
    line-height: var(--leading-none);
    color: var(--white);
}

.layoutjs .mobileHeader button, .layoutjs .filterPane .filter[data-type="keyword"] button {
    font-family: var(--filter-font-family-body);
    font-size: var(--text-base);
    font-weight: 400;
    line-height: var(--leading-none);
    color: var(--filter-tertiary-color);
    margin: 0;
    padding: var(--space-3) var(--space-5);
    background-color: var(--deep-blue);
    border: none;
}

.layoutjs .mobileHeader button.resetButton {
    background-color: var(--citrus);
}

.layoutjs .rss-link, .layoutjs .filterPane .sort, .layoutjs .filterPane .filter, .layoutjs .filterPane .quicklinks {
    margin-bottom: 31px;
}

.layoutjs .rss-link {
    text-align: right;
}

.layoutjs .filterPane .sort, .layoutjs .filterPane .filter, .layoutjs .datepicker-cont .quicklinks button, .layoutjs .filterPane .filter[data-type="checkbox"] .expander {
    font-family: var(--filter-font-family-body);
    font-size: var(--text-base);
    font-weight: 100;
    line-height: var(--leading-none);
    padding: 0;
    background-color: inherit;
    border: none;
}

.layoutjs .datepicker-cont .quicklinks button {
    font-size: 14px;
}

.layoutjs .filterPane .filter[data-type="toggle"] {
    display: none;
}

.layoutjs .filterPane .sort .settings-label, .layoutjs .filterPane .filter .filterLabel, .layoutjs .filterPane .form-label {
    display: inline-block;
    font-family: var(--font-display);
    font-size: 24px;
    font-weight: var(--font-weight-bold);
    line-height: var(--leading-none);
    color: var(--white);
    margin: 0;
    margin-bottom: var(--space-4);
    padding: 0;
    background-color: transparent;
    text-transform: uppercase;
    letter-spacing: .1rem;
}

.layoutjs .filterPane .keyword .filterLabel {
    display: none;
}

.layoutjs .filterPane .sort li {
    display: inline-block;
    margin-right: var(--space-3);
    color: var(--white);
}

.layoutjs .filterPane .filter .keyword-input {
    display: flex;
    max-width: 243px;
    position: relative;
}

.layoutjs .filterPane .filter[data-type="keyword"] input, .layoutjs .filterPane .filter[data-type="number"] input {
    flex: 1;
    font-family: var(--filter-font-family-body);
    font-size: 16px;
    font-weight: 400;
    line-height: var(--leading-none);
    color: var(--white);
    padding: 0;
    margin: 0;
    background: var(--night-blue);
    width: 100%;
    height: 30px;
    padding-left: 2px;
    padding-right: 25px;
    padding-bottom: 3px;
    border-bottom: 1px solid var(--white);
}

.layoutjs .filterPane .filter[data-type="number"] input {
    max-width: 243px;
    display: block;
}

.layoutjs .filterPane .filter[data-type="keyword"] input::placeholder, .layoutjs .filterPane .filter[data-type="number"] input::placeholder {
    font-family: var(--filter-font-family-body);
    font-size: 16px;
    font-weight: normal;
    color: var(--filter-btn-color);
}

.layoutjs .filterPane .filter[data-type="keyword"] button {
    padding: 0;
    background-color: var(--night-blue);
    color: var(--gold);
    position: absolute;
    right: 3px;
    bottom: 7px;
}

.layoutjs .filterPane .filter[data-type="toggle"] .toggle .toggle-decorator {
    position: relative;
    display: block;
    padding: 2px;
    width: 4em;
    height: calc(2em + 4px);
    border-radius: var(--rounded-full);
    background-color: var(--filter-secondary-color);
    transition: all .4s ease;
    outline: 0;
    cursor: pointer;
    user-select: none;
}

.layoutjs .filterPane .filter[data-type="toggle"] .toggle input:checked + .toggle-decorator {
    background-color: var(--filter-accent-color);
}

.layoutjs .filterPane .filter[data-type="toggle"] .toggle .toggle-decorator::after {
    content: "";
    position: relative;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50%;
    height: 100%;
    font-size: var(--text-xs);
    border-radius: 50%;
    box-shadow: var(--filter-toggle-shadow);
    background-color: var(--filter-tertiary-color);
    transition: all .2s ease;
}

.layoutjs .filterPane .filter[data-type="toggle"] .toggle .toggle-decorator.has-label::after {
    content: attr(data-label);
}

.layoutjs .filterPane .filter[data-type="toggle"] .toggle input:checked + .toggle-decorator::after {
    left: 50%;
}

.layoutjs .filterPane .filter[data-type="checkbox"] li {
    position: relative;
    display: flex;
    align-items: baseline;
    margin-left: 21px;
    margin-bottom: 15px;
    cursor: pointer;
    color: var(--white);
    font-size: 16px;
    line-height: 1.2;
}

.layoutjs .filterPane .filter[data-type="checkbox"] li.tm_default {
    display: none;
}

.layoutjs .filterPane .filter[data-type="checkbox"] .custom-checkbox {
    position: absolute;
    top: 3px;
    left: -22px;
    display: flex;
    justify-content: center;
    width: 16px;
    height: 16px;
    align-items: center;
    border: 2px solid var(--gold);
    color: var(--gold);
    border-radius: var(--rounded);
    font-size: var(
    --text-xs);
}

.layoutjs .filterPane .filter[data-type="checkbox"] .custom-checkbox ~ span {
    color: #747474;
}

.layoutjs .filterPane input[type="checkbox"] + label .custom-checkbox i {
    opacity: 0;
    font-size: var(--text-xs);
}

.layoutjs .filterPane input[type="checkbox"]:checked + label .custom-checkbox {
    background-color: var(--gold);
    color: var(--night-blue);
}

.layoutjs .filterPane input[type="checkbox"]:checked + label .custom-checkbox i {
    opacity: 1;
}
.layoutjs .filterPane input[type="checkbox"]:checked + label .custom-checkbox :is(i.fa, i.fas) {
    font-weight: 900;
}

.layoutjs .filterPane .filter[data-type="checkbox"] .expander {
    cursor: pointer;
    color: var(--white);
    text-transform: uppercase;
    font-weight:  bold;
    letter-spacing: 0.05rem;
}

.layoutjs .filterPane .filter[data-type="checkbox"] .expander i {
    color: var(--gold);
    margin-left: 3px;
}

.layoutjs .datepicker-cont {
    max-width: 300px;
}

.layoutjs .filterPane:not(.mobileFilterActive) .datepicker-cont > div:last-child {
	transform: translateX(0px);
}

.layoutjs .datepicker-cont .quicklinks {
    display: flex;
    justify-content: space-between;
}

.layoutjs .datepicker-cont .quicklinks button {
    margin: 0;
    color: var(--white);
}

/* Datepicker */
.layoutjs .datepicker-cont .datepicker-trigger {
    background-color: var(--deep-blue);
    color: var(--white);
    margin-bottom: var(--space-4);
    padding: var(--space-3) var(--space-5);
    text-align: center;
}

.layoutjs .datepicker-cont .datepicker-trigger > span {
    font-family: var(--filter-font-family-body);
    font-size: var(--text-base);
    font-weight: 400;
    line-height: var(--leading-none);
}

.layoutjs .asd__change-month-button > button > svg {
	fill: var(--gold);
}

.layoutjs .asd__wrapper {
    max-width: 300px;
}

.layoutjs .asd__day-title {
	color: var(--white);
}

.layoutjs .asd__wrapper .asd__inner-wrapper {
    margin-left: -300px !important;
}

.layoutjs .asd__days-legend {
    max-width: 300px;
}

.layoutjs .asd__day--enabled {
    border: none;
}

.layoutjs .asd__month:not(.hidden) .asd__day--enabled {
    border: 1px solid var(--color-primary);
}

.layoutjs .asd__month {
    max-width: 300px;
}

.layoutjs .asd__month-name {
    font-family: var(--filter-font-family-body);
    font-size: var(--text-lg);
    font-weight: 700;
    line-height: var(--leading-none);
    color: var(--white);
}

.layoutjs .asd__day-title {
    font-family: var(--filter-font-family-body);
    font-size: var(--text-sm);
    font-weight: 400;
    line-height: var(--leading-normal);
}

.layoutjs .asd__day-button {
    font-family: var(--filter-font-family-body);
    font-size: var(--text-sm);
    font-weight: 400;
    line-height: var(--leading-normal);
    color:  var(--white);
}

.layoutjs .asd__wrapper button {
	background-color: var(--night-blue);
}

.layoutjs .asd__day--today button {
    color: gold;
}

.layoutjs .asd__selected-date-one button.asd__day-button,
.layoutjs .asd__selected-date-two button.asd__day-button {
    color: rgb(225,231,234);
    background-color: rgb(44,97,129);
}

.layoutjs .asd__day--in-range button.asd__day-button, .asd__day--selected button.asd__day-button {
	color: var(--night-blue);
}

.layoutjs .asd__day--in-range button.asd__day-button, .asd__day--selected button.asd__day-button {
	background-color: var(--white);
}

.layoutjs .yelp-snippet {
    margin-bottom: 9px;
    }

.layoutjs .yelp-snippet .yelp-top {
    display: flex;
    align-items: center;

}

.layoutjs .yelp-snippet .yelp-rating {
    width: 100px;
    height: auto;
    margin-right: 10px;
}

.layoutjs .yelp-snippet .yelp-logo {
    width: 60px;
}

/* map */
.layoutjs .layout-container .content-map-wrapper {
    position: relative;
    display: flex;
}

.layoutjs .layout-container .content-map-wrapper .mobile-arrows {
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 5px;
    pointer-events: none;
    height: 100%;
    width: 100%;
}

@media (min-width: 641px) {
    .layoutjs .layout-container .content-map-wrapper .mobile-arrows {
        display: none;
    }
}

.layoutjs .layout-container .content-map-wrapper .mobile-arrows svg:first-of-type {
    transform: rotate(180deg);
    opacity: 0.5;
}

.layoutjs.scrolled .layout-container .content-map-wrapper .mobile-arrows svg:first-of-type {
    opacity: 1;
}

.layoutjs .layout-container .map {
    width: 100%;
}

.layoutjs .layout-container .map .gMapHolder {
    height: auto;
    min-height: 500px;
}

.layoutjs .layout-container.map-open .layout {
    flex: 3;
}

.layoutjs .layout-container.map-open .map {
    position: sticky;
    /* Avoid any ancestor element with overflow property except "overflow: visible" */
    flex: 2;
    top: 0;
    height: 100vh;
}

.layoutjs .layout-container .map .panSearch {
    position: absolute;
    top: var(--space-24);
    padding: var(--space-4);
    border-radius: var(--rounded-full);
    box-shadow: var(--shadow);
    z-index: 9;
    font-family: var(--filter-font-family-body);
    font-size: var(--text-base);
    font-weight: 400;
    line-height: var(--leading-none);
    color: var(--content-tertiary-color);
    margin: 0;
    background-color: var(--content-accent-color);
    border: none;
    left: 50%;
    transform: translateX(-50%);
}

/* listing items */
.layoutjs .content .fa-spinner {
    position: absolute;
    top: 50px;
    /* match bottom margin of .layout container to leave room */
    left: calc(50% - 30px);
}

.layoutjs .no-results {
    margin-top: var(--space-20);
    text-align: center;
}

.layoutjs .content {
    padding: 28px 0;
    padding-bottom: 0;
    z-index: 1;
}

.layoutjs .content.convention-content {
    padding: 0;
}

.layoutjs .content .item {
    /* position: relative;
    display: grid;
    align-items: stretch;
    flex-wrap: wrap;
    grid-template-columns: 41% 1fr;
    column-gap: 12px;
    row-gap: 17px;
    margin-bottom: var(--space-5);
    box-shadow: 0px 2px 16px 0px rgba(35, 31, 32, 0.15);
    padding: 18px 15px 16px;
    background-color: var(--white); */
    position: relative;
    display: flex;
    align-items: stretch;
    flex-wrap: wrap;
    margin-bottom: var(--space-5);
    box-shadow: var(--shadow), var(--shadow-lg);
}

@media (max-width: 641px) {
    .layoutjs .content {
        display: flex;
        overflow-x: scroll;
        scroll-snap-type: x mandatory;
        padding-bottom: 25px;
    }

    .layoutjs .content .item {
        flex: 1 0 calc(100% - 60px);
        scroll-snap-align: start;
        scroll-margin: 30px;
        margin: 0 30px;
        max-width: 385px;
    }
}

.layoutjs .content .headers, .layoutjs .content .item.convention-item {
    position: relative;
    display: flex;
    align-items: stretch;
    flex-wrap: wrap;
    margin: 0 auto;
    max-width: var(--width-base);
    font-size: var(--text-base);
    box-shadow: none;
}

.layoutjs .content .item.convention-item:nth-child(even) .info {
    background-color: var(--content-bg-color);
}

.layoutjs .content .headers {
    display: none;
    padding: var(--space-5);
    font-weight: 700;
}

.layoutjs .content .item:last-of-type {margin-bottom: 0;}

.layoutjs .content .item .image {
    position: relative;
    flex: 1 1 150px;
}

.layoutjs .content .item .top-item {
    position: relative;
}

.layoutjs .content .item .top-info {
    margin-bottom: 12px;
}

@media(min-width: 40em) {
    .layoutjs .content .item {
        position: relative;
        display: grid;
        align-items: stretch;
        flex-wrap: wrap;
        grid-template-columns: 41% 1fr;
        column-gap: 12px;
        row-gap: 17px;
        margin-bottom: var(--space-5);
        box-shadow: 0px 2px 16px 0px rgba(35, 31, 32, 0.15);
        padding: 18px 15px 16px;
        background-color: var(--white);
    }

    .layoutjs .content .item .top-item {
        gap: 10px;
        align-items: start;
        width: 100%;
        grid-row: 1 / span 2;
    }

    .layoutjs .content .item .info {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        flex: 1;
        background-color: var(--white);
        grid-column: 1 / span 2;
    }

    .layoutjs .content .item h4 {
        padding: 0px;
    }
}

@media(min-width: 64em) {
    .layoutjs .content.list .item .top-info {
        margin-bottom: 0;
    }
}

.layoutjs .content .item .image a {
    position: relative;
    display: block;
    padding: 0 0;
}

.layoutjs .content .item .image .thumb {
    width: 100%;
    object-fit: cover;
}

.layoutjs .content .item .image .mini-date-container {
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background-color: var(--night-blue);
    color: var(--content-tertiary-color);
    padding: var(--space-1) var(--space-4);
    pointer-events: none;
    display: none;
}

.layoutjs .content .item .image .mini-date-container .month {
    font-family: var(--filter-font-family-body);
    font-size: var(--text-base);
    font-weight: 700;
    line-height: var(--leading-none);
    text-transform: uppercase;
}

.layoutjs .content .item .image .mini-date-container .day {
    font-family: var(--filter-font-family-body);
    font-size: var(--text-3xl);
    font-weight: 700;
    line-height: var(--leading-none);
}

.layoutjs .content .item .image .featured {
    position: absolute;
    bottom: 0;
    left: 0;
    display: flex;
    align-items: center;
    font-family: var(--font-display);
    font-size: 10px;
    font-weight: var(--font-weight-bold);
    line-height: var(--leading-none);
    letter-spacing: 2px;
    text-transform: uppercase;
    background: #f4af5e;
    color: #2b2b2b;
    padding: 6px 13px;
}

.layoutjs .content .item .tripbuilder {
    position: absolute;
    top: 0;
    right: 0;
    display: none;
    align-items: center;
    justify-content: center;
    height: 40px;
    width: 40px;
}

.layoutjs .content .item .tripbuilder a {
    font-size: var(--text-2xl);
    position: relative;
    font-family: 'Font Awesome 5 Free';
    text-decoration: none;
}

@media (hover: hover) {
    .layoutjs .content .item .tripbuilder a:hover {
        text-decoration: none;
        /*reboot.css override*/
    }
}

.layoutjs .content .item .tripbuilder .addTrip:before {
    content: "\f004";
    font-weight: 900;
    color: rgba(0, 0, 0, 0.5);
}

.layoutjs .content .item .tripbuilder .addTrip:after {
    content: "\f004";
    font-weight: 400;
    color: var(--content-tertiary-color);
    position: absolute;
    right: 0;
}

.layoutjs .content .item .tripbuilder .removeTrip:before {
    content: "\f004";
    font-weight: 900;
    color: var(--alert-color-tertiary);
}

.layoutjs .content .item .info {
    display: flex;
    flex: 1 1 100%;
    flex-direction: column;
    justify-content: space-between;
    flex: 1;
    padding: var(--space-5);
}

.layoutjs .content .item .tripadvisor-row {
    margin-bottom: var(--space-2);
}

.layoutjs .content .item .tripadvisor-snippet .reviews-rating-line {
    display: flex;
    align-items: center;
    gap: var(--space-1);
}

.layoutjs .content .item .tripadvisor-snippet .reviews-rating-line-text a {
    text-decoration: underline;
}

.layoutjs .content .item .tripadvisor-snippet img {
    margin-left: -7px;
    max-width: none;
}

.layoutjs .content .item.convention-item .info {
    display: grid;
    gap: var(--space-5);
}

.layoutjs .content.list .item .info {
    flex: 1 1 100%;
}

.layoutjs .content .item h4, .layoutjs .content .item h4 a {
    font-family: var(--font-body);
    font-size: 17px;
    font-weight: 700;
    line-height: 1.25;
    color: #333;
    -webkit-hyphens: auto;
    word-break: break-word;
    hyphens: auto;
    margin-top: -2px;
    margin-bottom: 3px;
}

.layoutjs .content .item h4 {
    font-size: 17px;
    padding-left: var(--space-5);
    padding-top: var(--space-5);
}

.layoutjs .content .item .region {
    font-size: 17px;
    color: #383838;
    font-style: italic;
    line-height: 1.2;
}

.layoutjs .content .item .bottom-actions .actionButton.ticketmaster,
.layoutjs .content .item .bottom-actions .actions .actionButton.website {
    color: var(--citrus);
    border: 1px solid var(--citrus);
    text-transform: uppercase;
    padding: 6px 21px;
    width: fit-content;
    font-size: 17px;
    letter-spacing: .1rem;
    font-weight: bold;
    margin-bottom: 20px;
    font-family: var(--font-display);
    display: inline-block;
}

.layoutjs .content .item h4 a span {
    font-family: var(--content-font-family-body);
    font-weight: 700;
    color: var(--content-primary-color);
}

@media (hover : hover ) {
    .layoutjs .content .item h4:hover, .layoutjs .content .item h4 a:hover {
        text-decoration: none;
        /*reboot.css override*/
    }
}

.layoutjs .content .item.convention-item h4 {
    font-family: var(--content-font-family-body);
    font-size: var(--text-lg);
    font-weight: 700;
    line-height: var(--leading-normal);
    color: var(--content-primary-color);
    margin-bottom: 0;
}

.layoutjs .content .item.convention-item .info .host {
    font-family: var(--content-font-family-body);
    font-size: var(--text-base);
    font-weight: 700;
    line-height: var(--leading-normal);
    color: var(--content-accent-color);
    margin-bottom: var(--space-2);
}

.layoutjs .content .item.convention-item .info h6 {
    display: block;
    font-family: var(--content-font-family-body);
    font-size: var(--text-base);
    font-weight: 700;
    line-height: var(--leading-normal);
    color: var(--content-primary-color);
}

.layoutjs .content .item .info-list {
	display: grid;
    font-family: var(--content-font-family-body);
    font-size: 17px;
    font-weight: 400;
    line-height: var(--leading-snug);
    list-style: none;
    margin: 0;
    color: var(--content-primary-color);
}

.layoutjs .content .item .info-list > li {
    display: flex;
    align-items: baseline;
    line-height: var(--leading-tight);
}


@media (max-width: 640px) {
    .layoutjs .content [data-type="listings"].item .info-list > .locations {
        display: none;
    }
    .layoutjs .content [data-type="events"].item .info-list > .recurrence .event-recurrence {
        display: none;
    }
}


.layoutjs .content .item .info-list .recurrence i {
    transform: translateX(-2px);
}

.layoutjs .content .item .info-list > li.locations div {
    display: flex;
    flex-direction: column;
}
.layoutjs .content .item .info-list > li.locations div span {
    line-height: 1.5
}

.layoutjs .content .item .info-list > li + li {
    margin-top: var(--space-2);
}

.layoutjs .content .item .info-list > li > i {
    color: #e45b59;
    min-width: 18px;
    width: 18px;
}

.layoutjs .content .item .contact-wrapper {
	grid-column: 2;
}

.layoutjs .content .item .primary-contact {
	display: grid;
	text-align: left;
}

@media (max-width: 64em) {
  .layoutjs .content.list .item .primary-contact {
	  text-align: unset;
  }
}

.layoutjs .content .item .info-list > li.distance {
    padding-left: var(--space-6);
}

.layoutjs .content .item.convention-item .attendance {
    display: flex;
    justify-content: space-between;
}

.layoutjs .content .item.convention-item .attendance span {
    margin-left: auto;
}

.layoutjs .content .item .info-list.meetingfacility-list {
    max-width: 320px;
    margin-top: 14px;
    margin-bottom: 5px;
}

.layoutjs .content .item .info-list.meetingfacility-list li {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--space-5);
    padding-left: var(--space-6);
    color: var(--content-primary-color);
}

.layoutjs .content .item .info-list.meetingfacility-list li:first-child {
    display: block;
    padding-left: 0;
    color: inherit;
}

.layoutjs .content .item .info-list.meetingfacility-list li:first-child i {
    margin-right: 6px;
}
@media (min-width: 64em) {
    .layoutjs .content .item .info-list.meetingfacility-list li:first-child i {
    margin-right: 10px;
}
}

.layoutjs .content .item .info-list.meetingfacility-list li span {
    font-weight: 700;
}

.layoutjs .content .item .bottom-actions {
    display: flex;
    flex-direction: column;
    gap: 17px var(--space-5);
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: baseline;
    width: 100%;
}

.layoutjs .content .item.dtn .bottom-actions {
    gap: 21px var(--space-5)
}

.layoutjs .content .item .bottom-actions .qv-btn, .layoutjs .content .item .bottom-actions .actions .actionButton {
    font-family: var(--content-font-family-body);
    font-size: 17px;
    line-height: var(--leading-none);
    color: #333;
    padding: 0;
    margin: 0;
    background: transparent;
    white-space: nowrap;
    display: inline-block;
}
.layoutjs .content .item .bottom-actions .qv-btn {
    letter-spacing: .02em;
    order: 1;
}

.layoutjs .content .item .bottom-actions .actions .actionButton:not(.website) {
    display: none;
}

@media (hover: hover) {
    .layoutjs .content .item .bottom-actions a.actionButton:hover {
        text-decoration: none;
        /*reboot.css override*/
    }
}

.layoutjs .content .item .bottom-actions .qv-btn i {
    margin-right: 6px;
    width: 18px;
    font-size: 16px;
}

.layoutjs .content .item .actions .actionButton i {
    margin-left: var(--space-1);
}

/* pager */
.layoutjs .pager {
    display: flex;
    justify-content: flex-end;
    position: relative;
}

.layoutjs .pager:after {
    content: '';
    height: 70px;
    position: absolute;
    right:0;
    bottom: 0;
    width: calc(50% + 115px);
    background-color: #f1f1f1;
}
.layoutjs .pager ul {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 15px;
    list-style: none;
    margin: 0;
    width: 100%;
    height: 70px;
    z-index: 1
}

.layoutjs .pager li {
    font-family: var(--font-display);
    font-size: 21px;
    font-weight: bold;
    line-height: var(--leading-none);
    color: #747474;
    margin: 0px 6px;
    text-transform: uppercase;
}

.layoutjs .pager a {
    cursor: pointer;
    font-size: var(--text-2xl);
}

.layoutjs .pager li a {
    color: var(--content-secondary-color);
}

.layoutjs .pager li a img {
    width: 18px;
    transform: translateY(0px);
}
.layoutjs .pager li:not(.highlight) a img {
    opacity: .5;
}
.layoutjs .pager li a.prv img {
    transform: rotateY(180deg) translateY(0px);
}

.layoutjs .pager li.highlight a {
    color: var(--content-accent-color);
}


/* Two-Stage Filter Styles */
.layoutjs [data-type="twostage"] .stage-one {
    display: flex;
    justify-content: space-between;
    margin: 0;
    margin-bottom: var(--space-1);
    padding: var(--space-2);
    width: 100%;
    text-align: left;
    color: var(--white);
    background: transparent;
}

.layoutjs [data-type="twostage"] .stage-one[disabled] {
    pointer-events: none;
    cursor: default;
    opacity: 0.7;
}

.layoutjs [data-type="twostage"] .stage-one.locked {
    pointer-events: none;
}

.layoutjs [data-type="twostage"] .stage-one i {
    margin-left: var(--space-3);
}

.layoutjs [data-type="twostage"] .stage-one + .filter {
    padding-left: 6px;
}

/* Click To Compare Styles */
.layoutjs .compare {
    position: relative;
}
@media (min-width: 64em) {
    .layoutjs .compare {
        color: var(--gray);
    }
}

.layoutjs .compare .compare-toggle {
    position: relative;
    margin: 0;
    padding: 0;
    width: 32px;
    height: 32px;
    font-size: var(--text-xl);

    border-radius: var(--rounded-lg);
    background-color: transparent;
    cursor: pointer;
}

@media (min-width: 64em) {
    .layoutjs .compare .compare-toggle {
          color: var(--night-blue);
    }
}

.layoutjs .compare .compare-toggle.badged::after {
    content: attr(data-count);
    position: absolute;
    z-index: 1;
    top: 0;
    right: 0;
    padding: 1px var(--space-1) 3px;
    font-size: var(--text-sm);
    line-height:  1;
    font-weight: 600;
    color: var(--white);
    border-radius: var(--rounded-md);
    background-color: var(--citrus);
    transform: translateX(25%);
}

.layoutjs .compare .compare-toggle[disabled] {
    color: var(--content-color);
    pointer-events: none;
}
@media (min-width: 64em) {
    .layoutjs .compare .compare-toggle:hover, .layoutjs .compare .compare-toggle:focus {
        background-color: var(--content-primary);
        color: var(--night-blue);
    }
}

.layoutjs .compare .compare-click-outside {
    position: fixed;
    z-index: 10;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.layoutjs .click-to-compare-menu {
    position: absolute;
    z-index: 10;
    top: calc(100% + var(--space-5));
    right: 0;
    margin-bottom: var(--space-8);
    padding-top: var(--space-4);
    width: var(--width-fullscreen);
    max-width: 288px;
    border-radius: var(--rounded-md);
    box-shadow: var(--shadow-md), var(--shadow-2xl);
    background-color: var(--content-tertiary-color);
    overflow: hidden;
}

.layoutjs .click-to-compare-menu > * {
    display: block;
    margin: 0;
    padding: 0 var(--space-6);
}

.layoutjs .click-to-compare-menu .compare-title {
    margin-bottom: var(--space-3);
    font-size: var(--text-lg);
    font-weight: 600;
    line-height: 1.1;
    line-height: var(--leading-normal);
    text-align: left;
}

.layoutjs .click-to-compare-menu .compare-actions {
    display: flex;
    justify-content: flex-end;
    padding: var(--space-3);
    background-color: var(--content-tertiary-color);
}

.layoutjs .click-to-compare-menu .compare-clear {
    margin: 0;
    margin-right: var(--space-6);
    padding: 0;
    background: transparent;
    color: var(--content-tertiary-color);
    transition: none;
}

.layoutjs .click-to-compare-menu .compare-link {
    padding: var(--space-1) var(--space-4);
    line-height: var(--leading-normal);
    color: var(--citrus);
    letter-spacing: .1em;
    font-family: var(--font-display);
    font-weight:  bold;
    border:  1px solid var(--citrus);
}

.layoutjs .click-to-compare-menu .compare-chits {
    margin-bottom: var(--space-3);
    padding: 0 var(--space-3);
}

.layoutjs .click-to-compare-menu .compare-chit {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    margin: 0;
    margin-bottom: var(--space-2);
    padding: var(--space-2) var(--space-3);
    width: 100%;
    font-size: var(--text-sm);
    text-align: left;
    color: var(--content-primary-color);
    border-radius: var(--rounded-md);
    border: none;
    background-color: transparent;
}

.layoutjs .click-to-compare-menu .compare-chit:hover {
    background-color: var(--content-tertiary-color-hover);
}

.layoutjs .click-to-compare-menu .compare-chit .fa {
    display: block;
    margin-left: var(--space-6);
    color: var(--night-blue);
}

.layoutjs .click-to-compare {
    display: flex;
    align-items: baseline;
    margin: 0;
    padding: 0;
    text-align: left;
    color: inherit;
    font-weight: bold;
    text-transform: capitalize;
    background-color: transparent;
}

.layoutjs .click-to-compare .fas {
    margin-right: var(--space-1);
    color: #e45b59;
    width: 18px;
}

.layoutjs .click-to-compare.compare-remove .fas {
    color: var(--night-blue);
}

.layoutjs .download {
    display: flex;
    align-items: baseline;
    margin: 0;
    margin-left: auto;
    font-size: var(--text-base);
    padding: var(--space-1) var(--space-4);
    color: var(--content-tertiary-color);
    border-radius: var(--rounded-full);
    background-color: var(--content-accent-color);
}

.layoutjs .download i {
    width: 18px;
}

.layoutjs .download .text {
    display: none;
    flex: 1;
}

@media (min-width: 375px) {
    .layoutjs .content .item .image {
        flex: 0 1 150px;
    }
}

@media (min-width: 40em) {
	.layoutjs .click-to-compare-menu {
		max-width: 420px;
	}

	.layoutjs .pager:after {
	    display: none;
	}

	.layoutjs .pager ul {
		padding: 32px 0;
		width:  292px;
		justify-content: center;
		align-items: center;
		background-color: #f1f1f1;
		z-index: -1;
	}
}

@media (min-width: 64em) {
    .layoutjs .download i {
        margin-right: var(--space-1);
    }

    .layoutjs .download .text {
        display: inline-block;
        white-space: nowrap;
    }


	.layoutjs .settings .highlight a {
		color: #333;
	}


	.layoutjs .layout-container {
		width: 100%;
		flex: 1;
	}
	
	/* filters & sort */
	.layoutjs .filterPane {
		position: sticky;
		display: block;
		top: 0;
		width: 307px;
		min-width: 307px;
		padding: 30px 50px;
		max-height: 100vh;
		overflow: auto;
		background-color: var(--night-blue);
	}

	.contentRender_name_plugins_events_layout_list .layoutjs .filterPane {
	    padding: 30px 32px;
	}
	
	.layoutjs .filterPane .btn-bg button {
		display: flex;
		align-items: center;
		font-family: var(--filter-font-family-body);
		font-size: 17px;
		font-weight: bold;
		line-height: var(--leading-none);
		margin: 0;
		background-color: var(--night-blue);
		color: var(--white);
		border: none;
		padding: 0;
		text-transform: uppercase;
		letter-spacing: .15rem;
	}
	
	.layoutjs .filterPane .btn-bg button i {
		font-size: var(--text-sm);
		color: var(--gold);
		margin-right: 5px;
	}
	
	.layoutjs .asd__wrapper {
		max-width: 243px;
	}
	
	.layoutjs .asd__wrapper .asd__inner-wrapper {
		margin-left: -243px !important;
	}
	
	.layoutjs .asd__days-legend {
		max-width: 243px;
	}
	
	.layoutjs .asd__month {
		max-width: 243px;
	}
	
	.layoutjs .settings {
		justify-content: flex-start;
		background: var(--white);
		border-top: 1px solid #f1f3f4;
		border-bottom: 1px solid #f1f3f4;
		padding: 13px 4.9%;
	}
	
	.layoutjs .settings > div {
		position: relative;
		display: flex;
		flex-wrap: wrap;
		text-align: center;
		padding: 0 var(--space-5);
	}
	
	.layoutjs .settings > div.view {
		margin-right: 23px;
	}
	.layoutjs .settings > div.sort {
		margin-right: 5px;
	}
	
	.layoutjs .settings .sort ul li:first-of-type {
		margin-right: 30px;
	}

	.layoutjs .settings > div:last-of-type {
		border-right: none;
	}

	.layoutjs .settings .settings-label, .layoutjs .settings ul li, .layoutjs .settings .map-btn span {
		font-family: var(--content-font-family-body);
		font-size: var(--text-base);
		font-weight: 700;
		line-height: var(--leading-none);
		margin-right: 18px;
	}

	.layoutjs .settings .map-btn span {
		margin-right: 0;
	}

	.layoutjs .settings .settings-label {
		margin-right: var(--space-5);
		display: none;
	}

	.layoutjs .settings ul {
		display: flex;
		align-items: center;
	}

	.layoutjs .settings ul li a, .layoutjs .settings .map-btn span {
		--color: #747474;
		color: var(--color);
		cursor: pointer;
		white-space: nowrap;
		font-size: 18px;
	}
	.layoutjs .settings ul li:not(.highlight) a {
		font-weight: normal;
	}
	.layoutjs .settings .map-btn span {
		color: #333;
	}
	.layoutjs .settings .map-btn span i {
		color: #747474;
		font-size: 17px;
	}
	.layoutjs .settings ul li a:hover, .layoutjs .settings .map-btn span i:hover {
		color: var(--color);
	}

	.layoutjs .settings ul li.highlight a:hover {
		color: #333;
	}
	
	.layoutjs .settings ul li:last-child {
		margin-right: 0;
	}

	.layoutjs .layout-container .map .gMapHolder {
		height: 100vh;
	}

	.layoutjs .content .headers {
		position: sticky;
		z-index: 1;
		top: 0;
		display: grid;
		gap: var(--space-5);
		grid-template-columns: 4fr 3fr 3fr 2fr;
		background-color: var(--content-tertiary-color);
	}

	.layoutjs .content .item.convention-item .info {
		grid-template-columns: 4fr 3fr 3fr 2fr;
	}

	.layoutjs .content .item.convention-item .info h6 {
		display: none;
	}

	.layoutjs .pager:after {
	    display: none;
	}

	.layoutjs .pager ul {
		padding: 32px 0;
		width:  432px;
		height: 166px;
		justify-content: center;
		align-items: flex-end;
		background-color: #f1f1f1;
		z-index: 0;
	}
	.layoutjs .pager ul li {
		height: 20px;
		display: flex;
		align-items: center;
		font-size: 23px;
		margin: 0px 7px;
	}
	.layoutjs .pager li a img {
		width: 22px;
	}

}

@media screen and (min-width: 64em) {
    .layoutjs .content {
        margin: 53px 0;
        padding: 0;
        position: relative;
        margin-bottom: -79px;
    }

    .layoutjs .content .item .bottom-actions > * {
        display:  inline-block;
     }

     .layoutjs .content .item .bottom-actions .click-to-compare {
        flex-grow: 0;
    }

    .layoutjs .content.grid {
        padding: 0;
        display: flex;
        flex-flow: wrap row;
        justify-content: space-between;
    }

    .layoutjs .content .item .image .featured {
        font-size: 15px;
        padding: 9px 20px;
    }

    .layoutjs .content.grid .item {
        flex: 0 0 30%;
        display: flex;
        flex-direction: column;
        flex-wrap: nowrap;
        padding: 0
    }

    .layoutjs .content .item .bottom-actions {
		place-items: flex-end;
    }
    .layoutjs .content.grid .item .top-item {
        grid-template-columns: 1fr;
        gap: 18px;
        margin-bottom: 15px;
    }

    .layoutjs .content.grid .item .info {
        padding: 0 15px 0 20px;
    }
    .layoutjs .content.list .item {
        flex-wrap: nowrap;
        grid-template-rows: min-content 1fr;
        grid-template-columns: 20% 1fr;
        row-gap: 8px;
    }
    .layoutjs .content.list .item .info {
        grid-column: 2;
    }
    .layoutjs .content.list .item .info .bottom-actions {
        margin-bottom:  0;
		place-items: flex-end;
    }

    .layoutjs .content .item h4, .layoutjs .content .item h4 a {
        font-size: 18px;
        line-height: 1.3;
    }

    .layoutjs .content .item .region {
        font-size: 18px;
        line-height: 1.4;
    }

    .layoutjs .content.grid .item .title-region-section {
        padding: 0 20px;
        margin-bottom: var(--space-1);
    }
    
    .layoutjs .content.grid .item .image, .layoutjs .content.grid .item .image img {
        width: 100%;
    }
    .layoutjs .content .item .bottom-actions {
        margin-bottom: 14px;
        display:  flex;
        flex-wrap: nowrap;
    }

    .layoutjs .content.grid .item .bottom-actions {
        margin-bottom: 25px;
        gap: 0;
    }

    .layoutjs .content .item.dtn .bottom-actions {
        margin-bottom: 23px;
    }

    .layoutjs .content .item .bottom-actions .actionButton.ticketmaster,
    .layoutjs .content .item .bottom-actions .actions .actionButton.website {
        padding: 6px 8px;
        margin-bottom: 0;
    }

    .layoutjs .content .item .bottom-actions .actionButton.ticketmaster:before,
    .layoutjs .content .item .bottom-actions .actions .actionButton.website:before {
        content: '+';
        margin-right: 2px;
    }

    .layoutjs .content .item .bottom-actions .qv-btn {
        padding: 8px 0;
        text-align: right;
        order: 1;
    }

    .layoutjs .content .item .info-list > li > i {
        font-size: 20px;
        margin-right: 3px;
    }

    .layoutjs .content.grid .item .info-list > li > i.fa-map-marker-alt {
        transform: translateY(2px);
    }

    .layoutjs .content .item .bottom-actions .qv-btn i {
        font-size: 15px;
    }
    @supports (display: grid) {
        .layoutjs .content.grid {
            display: grid;
            grid-gap: 19px;
            grid-template-columns: repeat(auto-fill, minmax(330px, 1fr));
            margin-left: 36px;
            margin-right: 35px;
        }

        .layoutjs .content.grid .item {
            margin-bottom: 0;
            row-gap: 7px;
        }
    }
}