/*
    Theme Name: Destination Salem 2021
    Theme URI: https://www.sperlinginteractive.com
    Description: Theme for salem.org 2021
    Version: 1.0
    Author: Sperling Interactive
  Theme URI: https://www.sperlinginteractive.com
*/

/*------------------------------------*\


\*------------------------------------*/

/* global box-sizing */

*,
*:after,
*:before {
    box-sizing: border-box;
    text-rendering: optimizeLegibility;
}

/*
* {
    min-width: 0;
    min-height: 0;
} */

/* html element 62.5% font-size for REM use */

html {
    font-size: 62.5%;
    scroll-behavior: smooth;
}

html.search-open {
    overflow: hidden;
}

body {
    color: #333;
    font:
        400 11px/1.4 europa,
        sans-serif;
}

/* clear */

.clear:before,
.clear:after {
    content: ' ';
    display: table;
}

.clear:after {
    clear: both;
}

.clear {
    zoom: 1;
}

img {
    max-width: 100%;
    vertical-align: bottom;
    height: auto;
}

/* Lightspeed Lazy load fade in */

img[data-lazyloaded] {
    opacity: 0;
}

img.litespeed-loaded {
    -webkit-transition: opacity 0.5s linear 0.2s;
    -moz-transition: opacity 0.5s linear 0.2s;
    transition: opacity 0.5s linear 0.2s;
    opacity: 1;
}

a {
    text-decoration: none;
}

a:hover {
}

a:focus {
    outline: 0;
}

a:hover,
a:active {
    outline: 0;
}

a.button,
.wysiwyg-content a.button,
.show-map-button.button {
    background: #2a6b8a;
    color: #fff;
    text-transform: uppercase;
    display: inline-block;
    font-size: 1.8rem;
    padding: 10px 20px;
    border-radius: 30px;
    transition: background 0.3s ease-in-out;
    cursor: pointer;
}

.show-map-button.button {
    text-align: center;
}

a.button.small {
    font-size: 1.6rem;
}

a.button i {
    margin-left: 10px;
}

a.button:hover,
.wysiwyg-content a.button:hover,
.show-map-button.button:hover {
    background: #153645;
}

a.button.light {
    background: #8fa8d8;
}

a.button.light:hover {
    background: #2a6b8a;
}

a.bookmark-button {
    background: #bbcb70;
    color: #255e7a;
    height: 100%;
    font-size: 2rem;
    padding: 20px;
    display: flex;
    align-items: center;
    transition: background 0.3s ease-in-out;
    justify-content: space-between;
}

.single-listing a.bookmark-button,
.single-parking a.bookmark-button,
.single-restrooms a.bookmark-button {
    height: auto;
}

a.bookmark-button:hover {
    background: #a4b55a;
}

a.bookmark-button i {
    margin-left: 10px;
}

input:focus {
    border: 1px solid #04a4cc;
    outline: 0;
}

p,
ul,
ol {
    font-size: 1.6rem;
}

h1 {
    font-size: 5rem;
}

h2 {
    font-size: 3.6rem;
}

h3 {
    font-size: 2.8rem;
}

h4 {
    font-size: 2.4rem;
}

h5 {
    font-size: 2rem;
}

h6 {
    font-size: 1.6rem;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: league-gothic, sans-serif;
    text-transform: uppercase;
    font-weight: 400;
}

.europa,
.tribe-community-events h3,
.tribe-community-events h2 {
    font-family: europa, sans-serif;
}
.tribe-community-events .my-events-header h2.my-events {
    font-weight: 600;
}
blockquote {
    margin: 25px 0;
    padding: 25px 0 25px 5vw;
    font-style: italic;
    border-top: 1px solid;
    border-bottom: 1px solid;
    font-weight: 700;
}

.uppercase {
    text-transform: uppercase;
}

.heading-wrap {
    text-align: center;
}

.heading-wrap :first-child {
    display: inline-block;
    position: relative;
    z-index: 1;
    line-height: 1;
}

.heading-wrap :first-child:after {
    width: 100%;
    content: '';
    position: absolute;
    height: 5px;
    background: #cad7dd;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: calc(100% + 20px);
    z-index: -1;
}

.heading-wrap.white :first-child:after {
    background: rgb(255 255 255 / 20%);
}

.index-2 {
    position: relative;
    z-index: 2;
}

.bold {
    font-weight: 700;
}

.of-hidden {
    overflow: hidden;
}

.relative {
    position: relative;
}

@keyframes shake {
    10%,
    90% {
        transform: translate3d(-1px, 0, 0);
    }

    20%,
    80% {
        transform: translate3d(2px, 0, 0);
    }

    30%,
    50%,
    70% {
        transform: translate3d(-4px, 0, 0);
    }

    40%,
    60% {
        transform: translate3d(4px, 0, 0);
    }
}

.text-left {
    text-align: left;
}

.page-wrap {
    overflow-x: hidden;
}

.border-bottom-2 {
    border-bottom: 2px solid;
}

html body #pojo-a11y-toolbar {
    top: auto !important;
    bottom: 0 !important;
}

div#cookie-law-info-bar {
    z-index: 9999999999 !important;
}

/*------------------------------------*\
    STRUCTURE
\*------------------------------------*/

/* wrapper */

.wrapper {
    display: flex;
    flex-direction: column;
    margin: 0 auto;
    min-height: 100vh;
    position: relative;
    width: 100%;
    max-width: 2560px;
}

.container {
    max-width: 1280px;
    align-self: center;
    flex: 1 auto;
    margin: 0 auto;
    width: 100%;
    height: 100%;
    padding: 0 20px;
}

.container.large {
    max-width: 1740px;
}

.container.medium,
.container.blog {
    max-width: 1000px;
}

.container.small {
    max-width: 900px;
}

/* header */

body.stuck .utility-nav {
    padding: 5px;
}

.utility-nav {
    background: #2a6b8a;
    color: white;
    text-align: center;
    padding: 10px;
    transition: padding 0.3s ease-in-out;
}

.utility-nav ul li:not(:last-child) a {
    border-right: 1px solid white;
}

body.stuck .utility-nav a {
    font-size: 1.4rem;
}

.utility-nav a {
    color: white;
    display: block;
    padding: 0px 10px;
    font-size: 1.5rem;
    transition: font-size 0.3s ease-in-out;
}

.utility-nav ul {
    list-style-type: none;
    padding: 0;
    margin: 0;
}

.utility-nav ul li {
    display: inline-block;
}

.header {
    background: white;
    padding: 20px 0;
    box-shadow: 0px 3px 6px #00000029;
}

.header .columns {
    justify-content: space-between;
    /* margin-right: 120px; */
}

.sticky-header {
    transition: all 0.3s ease-in-out;
    position: relative;
}

body.stuck .notification-bar-wrap {
    display: none;
}

.notification-bar {
    background: #bbcb70;
    text-align: center;
    padding: 10px;
    font-size: 1.6rem;
    color: #255e7a;
    font-weight: 700;
}

.sticky-header {
    position: sticky;
    top: 0;
    z-index: 999;
    box-shadow: 0px 3px 6px #00000029;
}

.header-meta {
    display: flex;
    align-items: center;
    font-weight: 700;
    color: #8fa8d8;
    gap: 10px;
}
#salem-weather-widget {
    min-width: 100px;
}

.header-meta p {
    font-size: 2rem;
}

.header-meta i {
    font-size: 2rem;
    position: relative;
    top: 0;
    width: 25px;
    height: 25px;
}

.salemweather {
    display: flex;
    margin-right: 20px;
    opacity: 0;
}

.header-search {
    cursor: pointer;
}

.header-search-form-wrap {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: -1;
    background: rgb(224 224 224 / 90%);
    opacity: 0;
    visibility: visible;
    transition: all 0.3s ease-in-out;
    display: flex;
    justify-content: center;
}

.header-search-form-wrap.open {
    opacity: 1;
    visibility: visible;
    z-index: 999999;
}

.header-search-form {
    width: 95%;
    max-width: 900px;
    font-size: 2.5rem;
}

div.close-search-wrap {
    display: block;
    text-align: right;
    font-weight: 700;
    font-size: 3rem;
    margin-bottom: 38px;
}

span.close-search {
    cursor: pointer;
}

.header-search-form form {
    display: flex;
}

.header-search-form form input {
    width: 100%;
    padding: 10px 65px 10px 20px;
    border: 0;
    border-radius: 30px;
}

button.search-submit {
    background: #2a6b8a;
    color: #fff;
    text-transform: uppercase;
    display: inline-block;
    font-size: 1.8rem;
    padding: 10px 20px;
    border-radius: 30px;
    transition: background 0.3s ease-in-out;
    border: 0;
    margin-left: -50px;
}

button.search-submit:hover {
    background: #153645;
}

.logo-img {
    backface-visibility: hidden;
    height: 60px;
    transition: height 0.3s ease-in-out;
}

.stuck .logo-img {
    height: 60px;
}

.nav > ul {
    list-style-type: none;
    padding: 0;
    margin: 0;
    display: flex;
    justify-content: space-between;
}

.nav a {
    color: #4d4d4d;
    font-size: 1.6rem;
    font-weight: 700;
}

/* sidebar */

/* footer */

.footer {
    background: rgb(31, 78, 101);
    background: linear-gradient(90deg, rgba(31, 78, 101, 1) 0%, rgba(129, 170, 224, 1) 100%);
    padding: 50px 0;
    font-weight: 300;
}

.footer h4 {
    font-size: 1.8rem;
}

body:not(.home) .footer {
    margin-top: 50px;
}

.footer,
.footer a {
    color: #fff;
    font-weight: 300;
}

.footer a:hover,
.footer a:hover * {
    opacity: 0.8;
    transition: none;
}

.footer-nav {
    list-style-type: none;
    padding: 0;
    margin: 0;
}

.footer-logo {
    height: 150px;
}

ul.footer-social img {
    height: 20px;
    margin-right: 10px;
}

ul.footer-social li {
    font-size: 2rem;
    margin-right: 10px;
}

.footer-logos {
    margin: 10px 0;
    padding: 20px 0;
    border-top: 1px solid;
    border-bottom: 1px solid;
}

.ctct-form-embed.form_0 .ctct-form-defaults {
    background: transparent !important;
    padding: 0 !important;
}

p.ctct-gdpr-text,
p.ctct-gdpr-text a {
    color: white !important;
}

.ctct-inline-form .g-recaptcha {
    display: none !important;
}

p.ctct-gdpr-text a {
    font-weight: 400;
    font-size: 11px;
}

label#email_address_label_0 {
    color: white;
}

img.affiliate-logo {
    /* max-height: 75px; */
    max-width: 190px;
    width: 100%;
    display: block;
    margin-bottom: 20px;
}

.pagination {
    font-size: 2.5rem;
    text-align: center;
    margin: 20px 0;
}

span.page-numbers.current {
    color: #153645;
    font-weight: 700;
}

.pagination a {
    color: #2a6b8a;
}

.embed-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px;
    height: 0;
    overflow: hidden;
    max-width: 100%;
    height: auto;
}

.embed-container iframe,
.embed-container object,
.embed-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

video {
    /* override other styles to make responsive */
    width: 100% !important;
    height: auto !important;
}

ul.inline {
    margin: 0;
    list-style-type: none;
    padding: 0;
}

ul.inline li {
    display: inline-block;
}

p#breadcrumbs,
p#breadcrumbs a {
    text-transform: uppercase;
    color: #2a6b8a;
    font-size: 1.4rem;
}

p#breadcrumbs a {
    font-weight: 700;
    color: #2a6b8a;
}

p#breadcrumbs span.breadcrumb_last {
    text-decoration: underline;
}

.bookmark-drawer {
    z-index: 999;
    display: flex;
    right: 0;
    transform: translateX(100%) translateX(-50px);
    position: fixed;
    transition: transform 0.3s ease-in-out;
    width: 100%;
    color: #255e7a;
    height: 69px;
}

.bookmark-drawer.open {
    transform: none;
    height: auto;
}

.bookmark-tab {
    background: #bbcb70;
    align-self: flex-start;
    font-size: 2.5rem;
    padding: 10px;
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: #255e7a;
    position: relative;
}

span.bookmark-count:before {
    content: attr(data-count);
    position: absolute;
    font-size: 1.5rem;
    bottom: -20px;
    left: 0;
    right: 0;
    background: #255e7a;
    height: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: white;
}

span.bookmark-count[data-count='0'] {
    display: none;
}

.bookmark-tab i.shake {
    animation: shake 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) forwards;
}

.bookmarks {
    background: #bbcb70;
    padding: 20px;
    width: calc(100% - 50px);
    max-height: calc(100vh - 250px);
    overflow-y: scroll;
}

.bookmarks::-webkit-scrollbar {
    width: 1em;
}

.bookmarks::-webkit-scrollbar-track {
    box-shadow: inset 0 0 1px #255e7a;
}

.bookmarks::-webkit-scrollbar-thumb {
    background-color: #255e7a;
    outline: 1px solid #255e7a;
}

p.bookmark-header {
    background: #255e7a;
    padding: 10px;
    margin: 0;
    color: white;
    font-weight: 700;
    text-transform: uppercase;
}

ul.bookmark-list {
    list-style-type: none;
    padding: 0 20px 0;
}

ul.bookmark-list li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid rgb(51 51 51 / 12%);
    padding: 0;
}

ul.bookmark-list a {
    color: #255e7a;
}

span.delete-bookmark {
    color: #333;
    font-weight: 700;
    font-size: 2rem;
    cursor: pointer;
    padding: 10px;
}

/*------------------------------------*\
    HOME
\*------------------------------------*/
body.home .visit-slider:not(.slick-initialized),
body.home .event-slider:not(.slick-initialized) {
    display: none;
}
.home-top {
    position: relative;
}

.scroll-indicator {
    display: block;
    width: 50px;
    height: 50px;
    background: #8fa8d8;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 25px;
    position: absolute;
    bottom: -25px;
    left: 50%;
    transform: translate(-50%);
    color: white;
    z-index: 1;
}

.scroll-indicator i {
    height: 18px;
}

#videoBG {
    z-index: -1;
    /*not work if the screen ratio is below 16/9*/
    width: 100%;
    height: auto;
    margin-bottom: -4px;
}

.home-top-content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    max-width: 90%;
    text-align: center;
    color: white;
    z-index: 1;
}

.home-top-pins {
    position: absolute;
    z-index: 99;
    right: -50%;
    width: 100%;
    top: 37%;
    transform: translate(0, -50%);
}

.home-about-salem {
    background: rgb(40, 105, 136);
    background: linear-gradient(180deg, rgba(40, 105, 136, 1) 0%, rgba(21, 54, 69, 1) 100%);
    color: white;
}

.padding-section {
    padding: 50px 0;
    position: relative;
}

.home-about-salem .path {
    position: absolute;
    top: 0;
    height: 100%;
    left: 3.5vw;
}

div.bottom-section {
    position: relative;
    overflow: hidden;
}

.home-path-wrap {
    position: relative;
    overflow: hidden;
}

#home-pin {
    position: absolute;
    z-index: 1;
    left: -150px;
}

#home-path {
    position: absolute;
    mix-blend-mode: luminosity;
    z-index: 1;
    left: -150px;
}

#home-path,
#home-pin {
    opacity: 0.3;
}

#home-path .st0 {
    fill: none;
    stroke: #707070;
    stroke-width: 2;
    stroke-dasharray: 5;
}

.st1 {
    fill: #bbcb70;
}

.st2 {
    fill: #ffffff;
}

a.about-salem-link {
    color: white;
    font-weight: 700;
    display: inline-block;
    border-bottom: 2px solid white;
    font-size: 1.8rem;
}

ul.visit-slider-nav {
    flex-wrap: wrap;
    color: #a3a3a3;
    list-style-type: none;
    padding: 0;
    margin: 0;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

ul.visit-slider-nav li {
    width: 100%;
    text-align: center;
    border-bottom: 2px solid;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-bottom: 2px;
    font-size: 1.6rem;
    width: calc(50% - 10px);
    margin: 5px;
}

ul.visit-slider-nav li svg {
    width: 25px;
    margin-right: 5px;
    fill: #a3a3a3;
}

ul.visit-slider-nav li.active svg {
    fill: #2a6b8a;
}

ul.visit-slider-nav li.active {
    color: #2a6b8a;
}

.visit-slider .slick-arrow,
.event-slider .slick-arrow,
.notable-local-gallery .slick-arrow,
.single-listing-gallery .slick-arrow,
.nearby-slider .slick-arrow {
    background: #8fa8d8;
    height: 60px;
    width: 60px;
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 3rem;
    line-height: 0;
    position: absolute;
    top: 50%;
    z-index: 2;
    transform: translate(0, -50%);
    cursor: pointer;
}

.nearby-slider .slick-track {
    padding: 20px 0;
}

.visit-slider .slick-arrow.prev,
.notable-local-gallery .slick-arrow.prev,
.single-listing-gallery .slick-arrow.prev,
.nearby-slider .slick-arrow.prev {
    padding-right: 3px;
    left: 5px;
}

.visit-slider .slick-arrow.next,
.notable-local-gallery .slick-arrow.next,
.single-listing-gallery .slick-arrow.next,
.nearby-slider .slick-arrow.next {
    padding-left: 3px;
    right: 5px;
}

.visit-slider-card {
    position: relative;
}

.visit-slider-card:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
}

.visit-slider-card p {
    color: #fff;
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translate(-50%);
    width: 90%;
    font-size: 2rem;
    font-weight: 700;
    z-index: 1;
    margin: 0;
}

.home .visit-slider-card:after {
    display: none;
}

.home .visit-slider-card p {
    color: #000;
    position: relative;
    bottom: auto;
    left: auto;
    transform: none;
    width: 100%;
    font-size: 2rem;
    font-weight: 700;
    z-index: 1;
    margin: 10px 0 20px 0;
    text-align: center;
    padding: 0 20px;
}

.home-events {
    background: #e8e8e8;
}

.event-slider .slick-list {
    padding: 0 20% 0 0 !important;
}

.event-card {
    padding: 10px;
    margin: 0 10px;
    background-color: rgb(0 0 0/60%);
    background-blend-mode: multiply;
    color: #fff;
    display: flex !important;
    flex-direction: column;
    justify-content: flex-end;
    background-size: cover;
    background-position: center;
    aspect-ratio: 1;
}

.event-card-title {
    font-weight: 700;
    text-transform: uppercase;
}

.event-card-date {
    font-weight: 700;
    font-size: 1.5rem;
}

p.event-slider-excerpt {
    display: none;
}

.event-slider .slick-arrow.prev {
    padding-right: 3px;
    left: 0%;
}

.event-slider .slick-arrow.next {
    padding-left: 3px;
    right: 5%;
}

.event-slider .slick-arrow.slick-disabled {
    opacity: 0;
}

.event-slider-progress {
    display: block;
    width: 100%;
    height: 3px;
    border-radius: 10px;
    overflow: hidden;
    background-color: #f5f5f5;
    background-image: linear-gradient(to right, #2a6b8a, #2a6b8a);
    background-repeat: no-repeat;
    background-size: 0 100%;
    transition: background-size 0.4s ease-in-out;
    max-width: 1400px;
    margin: 20px auto;
}

.home-page-callouts {
    margin-top: 100px;
}

.home-callout-card {
    padding: 50px;
    background-size: cover;
    background-position: top center;
    position: relative;
    color: #fff;
    height: 100%;
}
.home-callout-card a.button {
    margin-top: auto;
}
.home-callout-card * {
    position: relative;
    z-index: 1;
}

h3.home-callout-card-title {
    font-size: 3rem;
    font-family: europa, sans-serif;
    text-transform: none;
}

.home-callout-card-content {
    font-weight: 300;
}

.home-callout-card-content a {
    font-size: 1.8rem;
    font-weight: 700;
    color: white;
    text-transform: uppercase;
}

.home-callout-card:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.6);
    transition: background 0.3s ease-in-out;
}
.home-callout-card:hover:after {
    background: #8fa8d8;
}
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}

.sbi_photo_wrap {
    border: 1px solid #e8e8e8;
}

/*------------------------------------*\
    ABOUT SALEM
\*------------------------------------*/

.heading-wrap > :first-child {
    position: relative;
    word-break: break-word;
}

.i-pin:before {
    content: '';
    position: absolute;
    left: calc(100% + 20px);
    top: 46%;
    height: 100px;
    transform: translate(0, calc(-50% - 30px));
    width: 866px;
    display: block;
    background-image: url(img/about-salem-pin.svg);
    background-size: contain;
    background-repeat: no-repeat;
}

.i-pin.history:before {
    background-image: url(img/history-pin.svg);
    transform: translate(0, calc(-50% - 18px));
}

.i-pin.notable-locals:before {
    background-image: url(/wp-content/themes/destination-salem-2021/img/notable-locals-pin.svg);
    left: auto;
    right: calc(100% + 20px);
    width: 485px;
    transform: translate(0, calc(-50% - 19px));
}

.i-pin.calendar:before {
    background-image: url(/wp-content/themes/destination-salem-2021/img/calendar-pin.svg);
    height: 149px;
    top: 6%;
}

.sub-page-block {
    padding: 10px;
    display: flex;
    align-items: center;
    min-height: 100px;
    height: 100%;
    color: white;
    font-weight: 700;
    background-position: center;
    background-size: cover;
}

.sub-page-block h2 {
    font-size: 1.5rem;
    font-weight: 700;
}

.sub-page-block i {
    margin-left: 10px;
    margin-top: 3px;
}

.overlay {
    position: relative;
}

.overlay:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.6);
}

.overlay * {
    z-index: 1;
}

/*------------------------------------*\
   HISTORY
\*------------------------------------*/

.history-pin {
    position: absolute;
    right: -59px;
    top: 0vw;
    height: 10vw;
    z-index: 1;
    max-height: 200px;
}

.history-nav {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    padding: 20px;
    position: relative;
    margin-bottom: 20px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.history-nav p {
    font-size: 3rem;
}

.timeline {
    display: none;
}

.timeline.mobile-history {
    display: block;
}

/*------------------------------------*\
    NOTABLE LOCALS
\*------------------------------------*/

.notable-locals-pin {
    position: absolute;
    left: -187px;
    top: -2vw;
    height: 10vw;
    z-index: 1;
    max-height: 200px;
    transform: scaleX(-1);
}

.blue-band-box {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    background: #e0e8eb;
    padding: 30px;
}

.blue-band-box-title {
    font-size: 3rem;
    font-weight: 700;
    text-transform: uppercase;
    color: #2a6b8a;
    margin: 0;
}

.blue-band-box a {
    color: #415680;
    text-decoration: underline;
    font-weight: 700;
    font-size: 1.8rem;
}

.notable-local-bio {
    padding: 30px;
    background: rgb(42, 107, 138);
    background: linear-gradient(162deg, rgba(42, 107, 138, 1) 0%, rgba(21, 54, 69, 1) 100%);
    color: white;
    height: 100%;
}

.single-notable-local-photo {
    background-size: cover;
    background-position: center;
}

.notable-local-bio-name {
    font-weight: 700;
    text-transform: uppercase;
    font-size: 3rem;
}

.years-alive,
.fun-fact {
    font-weight: 700;
    text-transform: uppercase;
    font-size: 2rem;
}

h2.bio-title {
    font-size: 3rem;
    font-family: europa, sans-serif;
    font-weight: 700;
}

.bio-box-header :first-child,
.bio-box-header :last-child {
    margin-top: 0;
}

.bio-box-header :not(:last-child) {
    margin-bottom: 0;
    margin-top: 0;
}

.single-notable-local-photo {
    min-height: 500px;
}

.notable-local-gallery .slick-arrow {
    background-color: #bbcb70;
}

.notable-local-gallery .slick-slide {
    padding: 10px;
}

.lt-blue-gradient-wrap {
    background: rgb(224, 232, 235);
    background: linear-gradient(8deg, rgba(224, 232, 235, 1) 0%, rgba(255, 255, 255, 1) 100%);
    position: relative;
    padding-bottom: 50px;
}

/*------------------------------------*\
    FAQ
\*------------------------------------*/

.single-faq .question h2 {
    font-size: 2rem;
    font-weight: 700;
    color: #2a6b8a;
    font-family: europa, sans-serif;
    text-transform: none;
}

.single-faq .question:after {
    content: '\f078';
    position: absolute;
    font-family: 'Font Awesome 5 Pro';
    font-weight: 500;
    font-size: 2.5rem;
    right: 0;
    background: #8fa8d8;
    border-radius: 50%;
    height: 40px;
    width: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-top: 3px;
    color: white;
    transition: transform 0.3s ease-in-out;
    top: 0;
}

.single-faq .question.open:after {
    transform: rotate(180deg);
}

.single-faq .answer {
    display: none;
}

.single-faq .answer :first-child {
    margin-top: 0;
}

.single-faq .answer :last-child {
    margin-bottom: 0;
}

.single-faq {
    max-width: 600px;
}

.single-faq .question {
    position: relative;
    padding-right: 45px;
    cursor: pointer;
}

/*------------------------------------*\
    EVENTS
\*------------------------------------*/

.events-pin {
    position: absolute;
    right: -26px;
    top: 0vw;
    height: 12vw;
    z-index: 1;
    max-height: 232px;
}

.calendar-pin {
    position: absolute;
    right: -177px;
    top: -4vw;
    height: 12vw;
    z-index: 1;
    max-height: 225px;
}

.sub-nav-bar {
    background: rgb(42, 107, 138);
    background: linear-gradient(109deg, rgba(42, 107, 138, 1) 0%, rgba(21, 54, 69, 1) 100%);
    padding: 50px 20px;
    display: none;
}

.sub-nav-bar-items {
    display: flex;
    align-items: center;
    justify-content: space-around;
    font-size: 1.6rem;
}

.sub-nav-bar-items h2 {
    font-size: 1.6rem;
    font-family: europa, sans;
    font-weight: 400;
    padding: 5px;
}

.sub-nav-bar-items a {
    color: white;
    text-transform: uppercase;
}

.sub-nav-bar-items a.active,
.sub-nav-bar-items a:hover {
    text-decoration: underline;
}

.event-band-image {
    background-size: cover;
    background-position: center;
    min-height: 300px;
}

.event-info-bar {
    background: linear-gradient(244deg, rgba(42, 107, 138, 1) 0%, rgba(21, 54, 69, 1) 100%);
    color: white;
    text-align: center;
    padding: 20px;
}

.event-info-bar p {
    margin: 0;
}

.event-info-header {
    font-size: 2.5rem;
}

div#tribe-events-gmap-0,
div#tribe-events-gmap-1 {
    height: 100% !important;
}

.event-about {
    background: #e0e8eb;
    padding: 20px;
}

.event-about h2 {
    font-family: europa, sans-serif;
    color: #296787;
}

.event-is-recurring {
    font-size: 1.4rem;
}

.event-is-recurring a {
    color: white;
    text-decoration: underline;
}

.event-info-bar a {
    color: white;
    font-weight: 600;
    text-decoration: underline;
}

/*------------------------------------*\
    TRIBE EVENTS OVERRIDES
\*------------------------------------*/
body.tribe_community_edit .addtoany_share_save_container.addtoany_content.addtoany_content_bottom {
    display: none;
}
.tribe-common * {
    font-family: inherit !important;
}

.tribe-common--breakpoint-medium.tribe-common .tribe-common-l-container {
    padding-left: 0;
    padding-right: 0;
    padding-top: 0;
    max-width: 100%;
}

.tribe-common .tribe-common-h8 {
    font-weight: 700;
}

main#tribe-events-pg-template {
    padding: 0;
    max-width: 100%;
}

/*------------------------------------*\
    BLOG
\*------------------------------------*/

.blog-card-wrap:hover .blog-card,
.tribe-common .blog-card-wrap:hover .tribe-events-calendar-list__event-datetime,
.tribe-common .blog-card-wrap:hover a,
.tribe-common .blog-card-wrap:hover a:active,
.tribe-common .blog-card-wrap:hover a:focus,
.tribe-common .blog-card-wrap:hover a:hover,
.tribe-common .blog-card-wrap:hover a:visited {
    color: #333;
}

.blog-card-wrap:hover .blog-card:after {
    content: '';
    right: calc(100% - 15px);
}

.blog-card-wrap,
.tribe-common .blog-card-wrap {
    margin-bottom: 20px;
}

.blog-card,
.tribe-common .blog-card {
    height: 100%;
    background: rgb(42, 107, 138);
    background: linear-gradient(101deg, rgba(42, 107, 138, 1) 0%, rgba(21, 54, 69, 1) 100%);
    background: #e0e8eb;
    padding: 30px;
    color: white;
    position: relative;
    transition: color 0.3s ease-in-out;
}

.blog-card:after {
    content: '';
    background: rgb(42, 107, 138);
    background: linear-gradient(101deg, rgba(42, 107, 138, 1) 0%, rgba(21, 54, 69, 1) 100%);
    top: 0;
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    transition: right 0.3s ease-in-out;
}

.blog-card * {
    position: relative;
    z-index: 1;
}

.blog-card-title {
    font-size: 3rem;
    font-weight: 700;
    text-transform: uppercase;
    margin: 0;
    font-family: europa, sans-serif;
}

.blog-card-image {
    background-size: cover;
    background-position: center;
    min-height: 300px;
}

.tribe-common .blog-card .tribe-events-calendar-list__event-datetime {
    color: #fff;
    z-index: 1;
    position: relative;
    font-size: 1.8rem;
    margin-bottom: 20px;
    transition: color 0.3s ease-in-out;
    display: block;
}

.tribe-common .blog-card-wrap a,
.tribe-common .blog-card-wrap a:active,
.tribe-common .blog-card-wrap a:focus,
.tribe-common .blog-card-wrap a:hover,
.tribe-common .blog-card-wrap a:visited {
    color: white;
    transition: all 0.3s ease-in-out;
}

.tribe-common .blog-card-wrap .tribe-common-c-svgicon--recurring path {
    stroke: white;
    fill: white;
    transition: all 0.3s ease-in-out;
}

.tribe-common .blog-card-wrap:hover .tribe-common-c-svgicon--recurring path {
    fill: #333;
    stroke: #333;
}

div#event_tribe_virtual,
.tribe-section.tribe-section-taxonomy.tribe-section-taxonomy--post_tag,
div#event_tribe_event_status,
div#event_tribe_organizer,
.tribe-section.tribe-section-cost {
    display: none;
}
/*------------------------------------*\
    SINGLE POST
\*------------------------------------*/

.single-post-date {
    font-weight: 700;
    text-align: center;
    font-size: 2rem;
    text-transform: uppercase;
}

.blog-content h2 {
    font-size: 3.5rem;
    margin: 1rem 0;
}

.blog-content h3 {
    font-size: 2.8rem;
    margin: 1rem 0;
}

.blog-content h4 {
    font-size: 2.4rem;
    margin: 1rem 0;
}

.blog-content h5 {
    font-size: 2rem;
    margin: 1rem 0;
}

.blog-content h6 {
    font-size: 1.8rem;
    margin: 1rem 0;
}

.blog-content p {
    margin: 1rem 0;
}

.blog-content {
    margin-bottom: 50px !important;
}

.blog-content a,
div.comments a {
    color: #415680;
    text-decoration: underline;
    font-weight: 700;
    font-size: 1.8rem;
}

section.blog-comments {
    background: linear-gradient(99deg, rgba(42, 107, 138, 1) 0%, rgba(21, 54, 69, 1) 100%);
    color: white;
    padding: 50px 0;
}

.comment-form-cookies-consent {
    display: none;
}

.blog-comments a {
    color: white;
}

.blog-comments input#submit,
#commentform input#submit {
    background: #bbcb70;
    border: 0;
    color: white;
    display: inline-block;
    padding: 10px;
}

form#commentform label {
    display: block;
}

form#commentform label {
    text-transform: uppercase;
}

form#commentform input[type='text'],
form#commentform input[type='email'],
form#commentform input[type='url'],
form#commentform textarea {
    padding: 10px;
    width: 100%;
}

h3#reply-title {
    font-size: 3rem;
    margin: 0;
}

div.comments {
    background: #dce4e8;
    padding: 20px 0;
}

div.comments h2 {
    margin: 0;
    font-size: 3rem;
}

div.comments cite.fn {
    font-weight: 700;
    font-style: normal;
}

div.comment-body {
    margin: 20px 0;
    background: white;
    padding: 20px;
}

div.comments ul {
    list-style-type: none;
    border-left: 1px solid;
    padding-left: 10px;
}

.comment-meta.commentmetadata {
    font-style: italic;
}

h3#reply-title small {
    display: block;
    font-family: europa, sans-serif;
    font-size: 1.8rem;
}

.blog-sidebar {
    border-top: 1px solid;
    padding-top: 30px;
}

.blog-sidebar h2 {
    font-size: 2.2rem;
}

.blog-sidebar p {
    font-size: 1.4rem;
}

.related-blog-2023 {
    border-bottom: 1px solid #dcdcdc;
}

.blog-sidebar-guide {
    width: 125px;
    margin: 10px auto;
}

.blog-sidebar-box {
    background: #eee;
    padding: 20px;
    text-align: center;
}

.blog-sidebar-box :first-child {
    margin-top: 0;
}

.blog-sidebar-box :last-child {
    margin-bottom: 0;
}

/*------------------------------------*\
    LISTINGS
\*------------------------------------*/

.listing-card {
    text-align: center;
    border: 1px solid #dbdbdb;
    padding: 30px;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.listing-card :first-child {
    margin-top: 0;
}

.listing-card :last-child {
    margin-bottom: 0;
}

a.button.listing-card-button {
    margin-top: 20px;
    bottom: 0;
    position: relative;
}

.listing-card-image {
    position: relative;
}

.listing-card-image img {
    display: block;
    margin: 0 auto;
}

.listing-card .listing-card-title {
    font-weight: 700;
    font-size: 2rem;
    font-family: europa, sans-serif;
    text-transform: none;
}

p.listing-card-address {
    font-weight: 700;
}

.listing-card p {
    font-size: 1.5rem;
}

p.public-guidelines-apply {
    text-align: right;
    width: 100%;
}

.about-listing {
    background: #e0e8eb;
    padding: 30px;
    height: 100%;
}

.listing-meta-wrap {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.listing-meta {
    height: 100%;
    background: linear-gradient(180deg, rgba(42, 107, 138, 1) 0%, rgba(21, 54, 69, 1) 100%);
    color: white;
    padding: 30px;
}

.listing-meta a {
    color: white;
}

.listing-meta h2,
.about-listing h2 {
    font-family: europa, sans-serif;
    margin-top: 0;
    font-weight: 700;
}

.about-listing h2 {
    color: #296785;
}

.about-listing-wrap {
    display: flex;
    flex-direction: column;
    /* height: 100%; */
}

.single-listing-gallery .slick-slide {
    height: 600px;
    transition:
        width 0.3s ease-in-out,
        background-color 0.3s ease-in-out;
    position: relative;
    background-size: cover;
    background-position: center;
    background-color: transparent;
}

.single-listing-gallery .slick-slide:not(.slick-current) {
    background-color: rgba(0, 0, 0, 0.5);
    background-blend-mode: multiply;
}

ul.single-listing-social {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    align-items: center;
}

ul.single-listing-social li {
    font-size: 2rem;
    margin-right: 10px;
}

ul.single-listing-social li.tripadvisor a {
    line-height: 1;
    display: inline-block;
}

p.meta-dropdown-title {
    border-bottom: 1px solid;
    display: inline-block;
    cursor: pointer;
    margin-bottom: 0;
    font-weight: 700;
}

p.meta-dropdown-title i {
    transition: transform 0.3s ease-in-out;
    transform: rotate(0deg);
}

p.meta-dropdown-title.open i {
    transform: rotate(180deg);
}

.meta-dropdown {
    display: none;
    font-weight: 300;
    padding-left: 10px;
}

.meta-dropdown ul {
    list-style: none;
    padding: 0;
}

.meta-dropdown ul.public-health-list {
    list-style-type: disc;
    padding-left: 10px;
}

.meta-dropdown li {
    margin: 10px 0;
}

.meta-dropdown li span {
    font-weight: 400;
    text-decoration: underline;
}

.single-listing .acf-map,
.single-parking .acf-map,
.single-restrooms .acf-map {
    display: none;
}
p.restroom-status {
    text-transform: uppercase;
    font-weight: 600;
    color: #268909;
}

p.restroom-status.closed {
    color: #eb1209;
}
/*------------------------------------*\
    SEARCH
\*------------------------------------*/

body.search h2.search-result a {
    color: #2a6b8a;
    padding: 10px;
}

body.search h2.search-result {
    font-family: europa, sans-serif;
    text-transform: none;
    font-size: 2rem;
}

h2.search-result:nth-of-type(odd) a {
    background: #efefef;
    display: block;
}

form.inline-search-form {
    display: flex;
    font-size: 1.6rem;
}

form.inline-search-form input.search-input {
    width: 100%;
    padding: 10px 65px 10px 20px;
    border: 0;
    border-radius: 30px;
    border: 1px solid #cacaca;
}

/*------------------------------------*\
    TEMPLATE: LIST OF LISTS
\*------------------------------------*/

.list-of-lists-title {
    text-transform: none;
}

.list-of-lists-title span {
    display: block;
    font-weight: 700;
    text-transform: uppercase;
}

/*------------------------------------*\
    WEEKEND AT A GLANCE
\*------------------------------------*/

.weekend-day-button {
    background: #2a6b8a;
    color: white;
    display: block;
    padding: 10px 20px;
    font-size: 3rem;
    cursor: pointer;
    text-align: center;
    transition: background 0.3s ease-in-out;
}

.weekend-day-button.active,
.weekend-day-button.active:hover {
    background: #153645;
}

.weekend-day-button:hover {
    background: #20566f;
}

body.weekend-at-a-glance .tribe-events .tribe-events-c-events-bar__views {
    display: none;
}
.tribe-common.tribe-events.tribe-events-view.tribe-events-view--list,
.tribe-common.tribe-events.tribe-events-view.tribe-events-view--day {
    max-width: 1150px;
}
.tribe-common .tribe-common-c-btn,
.tribe-common a.tribe-common-c-btn {
    background-color: #2a6b8a !important;
}

.tribe-common .tribe-common-c-btn:focus,
.tribe-common .tribe-common-c-btn:hover,
.tribe-common a.tribe-common-c-btn:focus,
.tribe-common a.tribe-common-c-btn:hover {
    background-color: rgba(42, 107, 138, 0.8) !important;
}

.tribe-common .tribe-common-c-svgicon,
.tribe-events .tribe-events-c-search__input-control--keyword-focus .tribe-events-c-search__input ~ .tribe-events-c-search__input-control-icon-svg path,
.tribe-events .tribe-events-c-search__input-control--keyword .tribe-events-c-search__input:focus ~ .tribe-events-c-search__input-control-icon-svg path,
.tribe-events .tribe-events-c-search__input-control--location-focus .tribe-events-c-search__input ~ .tribe-events-c-search__input-control-icon-svg path,
.tribe-events .tribe-events-c-search__input-control--location .tribe-events-c-search__input:focus ~ .tribe-events-c-search__input-control-icon-svg path {
    color: #20566f;
}

.weekend-view .tribe-common--breakpoint-medium.tribe-events .tribe-events-l-container {
    padding-top: 20px;
}

body.weekend-at-a-glance nav.tribe-events-calendar-day-nav.tribe-events-c-nav {
    display: none;
}

/*------------------------------------*\
    BASIC PAGE
\*------------------------------------*/

.wysiwyg-content {
    font-size: 1.8rem;
}

.wysiwyg-content h2,
.wysiwyg-content h3,
.wysiwyg-content h4,
.wysiwyg-content h5,
.wysiwyg-content h6,
h2.group-category-title {
    font-family: europa, sans-serif;
    text-transform: none;
    margin-bottom: 0;
    color: #2a6b8a;
}

.wysiwyg-content h2 a,
.wysiwyg-content h3 a,
.wysiwyg-content h4 a,
.wysiwyg-content h5 a,
.wysiwyg-content h6 a {
    font-size: inherit;
}

.wysiwyg-content h2 + p,
.wysiwyg-content h3 + p,
.wysiwyg-content h4 + p,
.wysiwyg-content h5 + p,
.wysiwyg-content h6 + p {
    margin-top: 0;
}

.wysiwyg-content a {
    color: #415680;
    font-weight: 700;
    font-size: 1.8rem;
}

/*------------------------------------*\
    MURAL SECTION
\*------------------------------------*/
.mural-section {
    position: relative;
    z-index: 1;
    padding-bottom: 100px;
}

/*------------------------------------*\
    FREE GUIDE
\*------------------------------------*/

.free-guide-form-wrap {
    background: #e0e8eb;
}

/* div#frm_checkbox_39-0 {
    background: #2a6b8a;
    padding: 10px;
} */

div#frm_field_39_container,
div#frm_field_107_container {
    background: #2a6b8a;
    padding: 10px;
}

div#frm_field_39_container label,
div#frm_field_107_container label {
    color: white;
}

div#frm_field_39_container .sml-font,
div#frm_field_107_container .sml-font {
    font-size: 1.4rem;
    font-style: italic;
}
div#frm_field_107_container label {
    font-weight: bold;
}

div#frm_field_107_container span {
    font-weight: 300;
    display: block;
    padding-left: 25px;
}
/*------------------------------------*\
    BUSINESS INDEX
\*------------------------------------*/

body.business-index h2 {
    border-bottom: 2px solid;
}

/*------------------------------------*\
    MARIJUANA GUIDELINES
\*------------------------------------*/

.mj-top-content > :first-child {
    margin-top: 0;
}

/*------------------------------------*\
    PARKING
\*------------------------------------*/

.listing-card.parking-lot.active {
    background: #2a6b8a36;
}

/* .listing-card.parking-lot.active * {
    color: white !important;
} */

/*------------------------------------*\
    RESIDENTS PAGE
\*------------------------------------*/

.residents-form {
    background: #e0e8eb;
    padding: 10px 20px;
}

.resident-box {
    height: 100%;
    background-size: cover;
    background-position: center;
    min-height: 300px;
    padding: 10px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    position: relative;
}

.resident {
    justify-self: flex-end;
}

.resident-quote {
    position: absolute;
    top: 0;
    width: 100%;
}

.flip-card {
    background-color: transparent;
    width: 100%;
    height: 100%;
    perspective: 1000px;
    min-height: 300px;
    /* Remove this if you don't want the 3D effect */
}

/* This container is needed to position the front and back side */

.flip-card-inner {
    position: relative;
    width: 100%;
    height: 100%;
    transition: transform 0.8s;
    transform-style: preserve-3d;
}

/* Do an horizontal flip when you move the mouse over the flip box container */

.flip-card:hover .flip-card-inner {
    transform: rotateY(180deg);
}

/* Position the front and back side */

.flip-card-front,
.flip-card-back {
    position: absolute;
    width: 100%;
    height: 100%;
    -webkit-backface-visibility: hidden;
    /* Safari */
    backface-visibility: hidden;
}

/* Style the front side (fallback if image is missing) */

.flip-card-front {
    color: white;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    background-size: cover;
    background-position: center;
}

.resident-info {
    background: #2a6b8a;
    padding: 5px 15px;
    display: inline-block;
    align-self: flex-start;
}

.resident-neighborhood {
    font-size: 1.4rem;
    font-weight: 300;
}

/* Style the back side */

.flip-card-back {
    background: #2a6b8a;
    color: white;
    transform: rotateY(180deg);
    padding: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.flip-card-back p {
    font-size: 2rem;
    font-weight: 700;
}

/*------------------------------------*\
    PODCAST PAGE
\*------------------------------------*/

.podcast-row {
    padding: 30px;
}

.podcast-row:nth-of-type(odd) {
    background: rgb(42 107 138 / 10%);
}

/*------------------------------------*\
    STUDENT & GROUP TOURS
\*------------------------------------*/

h2.group-category-title {
    border-bottom: 2px solid;
    margin-bottom: 20px;
}

/*------------------------------------*\
    MAP OF SALEM
\*------------------------------------*/
.page-id-56325 .acf-map {
    max-height: 600px;
    min-height: 600px;
}

.page-id-56325 .acf-map p {
    font-size: 1.5rem;
}

/*------------------------------------*\
    ACF GOOGLE MAP
\*------------------------------------*/

.acf-map {
    width: 100%;
    height: 100%;
    min-height: 400px;
    max-height: 400px;
    border: #ccc solid 1px;
    margin: 20px 0 0;
}

/* Fixes potential theme css conflict. */

.acf-map img {
    max-width: inherit !important;
}

.spec-div-for-venue .tribe-events-meta-group-details,
.spec-div-for-venue .tribe-events-single-section:before,
.spec-div-for-venue .tribe-events-meta-group-gmap {
    display: none !important;
}

.spec-div-for-venue .tribe-events-single-section-title {
    color: white;
    font-size: 2rem;
}

.spec-div-for-venue .tribe-venue a,
.spec-div-for-venue .tribe-venue dd,
.spec-div-for-venue .tribe-venue address,
.spec-div-for-venue dl,
.spec-div-for-venue .tribe-events-event-meta a {
    color: white !important;
}

.spec-div-for-venue .tribe-events-event-meta a:hover {
    color: white !important;
}

abbr[title] {
    border-bottom: 0px;
}

.spec-div-for-venue .tribe-events-meta-group-venue {
    padding-top: 5px;
}

.spec-podcast-class video,
.podcast-box video {
    width: 100% !important;
}

.single-post .single-post-date a {
    display: inline-block;
    position: relative;
}

.single-post .single-post-date a:before {
    content: '';
    display: block;
    width: 100%;
    height: 4px;
    position: absolute;
    left: 0px;
    bottom: 1px;
    background-color: #2a6b8a;
    transition: 0.3s ease;
}

.single-post .single-post-date a:hover:before {
    bottom: -5px;
}

.discover-your-perfect-salem-trip h2 {
    margin-bottom: 25px;
}

.discover-your-perfect-salem-trip .frm_submit {
    text-align: center;
}

.discover-your-perfect-salem-trip .vertical_radio {
    margin-top: 50px;
}

.discover-your-perfect-salem-trip .frm_primary_label {
    margin-bottom: 25px !important;
}

.discover-your-perfect-salem-trip .frm_forms {
    max-width: 805px !important;
    margin: 0px auto;
}

.quiz-result {
    list-style: none;
    padding: 0px;
    justify-content: center;
    /* max-width: 805px; */
    margin: 60px auto 0px auto;
}

.quiz-result img {
    display: block;
    max-width: 300px;
    margin: 0px auto;
}
.quiz-result.multiple-results {
    justify-content: space-around;
}
.quiz-result .outcome-title {
    background-color: #2a6b8a;
    color: white;
    padding: 5px 15px;
    display: block;
    margin: 0px auto 15px auto;
    max-width: 200px;
    text-align: center;
}

.quiz-result p {
    text-align: center;
}

.quiz-result li br {
    display: none;
}

.quiz-results-section .button-box {
    text-align: center;
}

.quiz-results-section .button-box a.button,
.quiz-results-section button.button {
    width: auto;
    font-family: 'europa', sans-serif;
    font-size: 18px;
    height: auto;
    line-height: normal;
    text-align: center;
    background: #bbcb70;
    border-width: 0px;
    border-color: transparent;
    border-style: solid;
    color: #ffffff;

    font-weight: normal;
    border-radius: 0px;
    text-shadow: none;
    padding: 10px 20px;
    box-sizing: border-box;
    box-shadow: 0 1px 1px #eeeeee;
    margin: 10px;
    margin-left: 0;
    margin-right: 0;
    vertical-align: middle;
    text-transform: none;
}

.quiz-results-section .button-box a.button:hover,
.quiz-results-section button.button:hover {
    background: #a4b55a;
    border-color: #cccccc;
    color: #ffffff;
}

.quiz-results-section p a {
    color: #4891c1;
    transition: 0.3s ease;
}
.quiz-results-section p a:hover {
    color: #415680;
}
.quiz-results-section p em {
    font-size: 10px;
}

#all-results-accordion {
    margin-top: 30px;
    padding: 20px;
    border: 1px solid #ddd;
    background-color: #f9f9f9;
    border-radius: 8px;
}

.all-results li {
    border: 1px solid #ddd;
    padding: 10px;
    border-radius: 5px;
    margin-bottom: 10px;
    background-color: white;
}

#all-results-accordion li {
    background: none;
    border: none;
}

.accordion-button-wrap {
    justify-content: center;
    display: flex;
}

.accordion-button-wrap button {
    margin: 0px 10px !important;
}

.pie-chart-wrap canvas {
    width: 100% !important;
    height: auto !important;
}

#pie-chart-container {
    max-width: 800px;
    margin: 0px auto;
}

.pie-chart-labels ul {
    list-style-type: none;
    padding: 0;
}
.pie-chart-labels {
    display: flex;
    align-items: center;
    justify-content: center;
}
.pie-chart-labels li {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
}

.pie-chart-labels .label-color {
    width: 20px;
    height: 20px;
    margin-right: 10px;
    border-radius: 50%;
}

.discover-your-perfect-salem-trip .frm_forms label {
    padding: 0px 6px !important;
}

/* POP UP ON CLICK ON SECOND PAGE */

.ms-popup {
    position: fixed;
    inset: 0;
    display: none;
    z-index: 9999;
}

.ms-popup.is-open {
    display: block;
}

.ms-popup__overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.55);
}

.ms-popup__dialog {
    position: relative;
    max-width: 347px;
    margin: 25vh auto;
    background: #fff;
    padding: 2rem;
    border-radius: 8px;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.25);
    z-index: 1;
}

.ms-popup__close {
    position: absolute;
    top: 0.75rem;
    right: 0.75rem;
    border: none;
    background: transparent;
    font-size: 1.5rem;
    line-height: 1;
    cursor: pointer;
}

.ms-popup__title {
    margin-top: 0;
}

.ms-popup .heading-wrap {
    line-height: 1.5;
}

.ms-popup__content p {
    text-align: center;
}

.ms-popup input[type='email'] {
    border: 1px solid #cad7dd !important;
    padding: 11px 15px !important;
}

.ms-popup #frm_field_99_container {
    margin: 0px;
}

.ms-popup .home-top-pins {
    width: 75%;
    position: relative;
    margin-left: auto;
    display: block;
    margin-bottom: -40px;
    margin-top: 35px;
    left: 30px;
}

.ms-popup__dialog {
    overflow: hidden;
}

.ms-popup h2 {
    font-size: 4.5rem !important;
}

.ms-popup fieldset {
    padding-bottom: 0px !important;
}

.ms-popup #frm_field_100_container {
    margin-bottom: 0px !important;
}

/* POP UP ON CLICK ON SECOND PAGE END */

/* .podcast-box { position: relative; padding-bottom: 56.25%; height: 0; }
.podcast-box img { position: absolute; display: block; top: 0; left: 0; width: 100%; height: 100%; z-index: 20; cursor: pointer; }
.podcast-box:after { content: ""; position: absolute; display: block; 
    background: url(play-button.png) no-repeat 0 0; 
    top: 45%; left: 45%; width: 46px; height: 36px; z-index: 30; cursor: pointer; } 
.podcast-box iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.podcast-box.player img { display: none; }
.podcast-box.player:after { display: none; } */

/*------------------------------------*\
    RESPONSIVE
\*------------------------------------*/

@media only screen and (max-width: 900px) {
    .resident-cards .is-6-tablet {
        width: 100%;
    }
}

@media only screen and (min-width: 320px) {
}

@media only screen and (min-width: 480px) {
    ul.footer-social img {
        height: 40px;
    }
}

@media only screen and (min-width: 783px) {
}

@media only screen and (min-width: 769px) {
    p,
    ul,
    ol {
        font-size: 1.8rem;
    }

    .home-top-content h1 {
        font-size: 6vw;
    }

    .home-top-content p {
        font-size: 2vw;
    }

    .home-top-pins {
        right: 0;
        width: 37.333%;
    }

    .footer-logos {
        margin: 0;
        padding: 0;
        border-top: none;
        border-bottom: none;
    }

    .scroll-indicator {
        width: 100px;
        height: 100px;
        font-size: 50px;
        bottom: -50px;
    }

    .scroll-indicator i {
        height: 36px;
    }

    .heading-wrap h1,
    .heading-wrap h2 {
        font-size: 8rem;
    }

    .single-post .heading-wrap h1 {
        font-size: 6rem;
    }

    .padding-section {
        padding: 100px 0;
    }

    a.about-salem-link {
        font-size: 3rem;
    }

    .home-callout-card {
        padding: 5vw;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
    }

    .sub-page-block,
    .sub-page-block h2 {
        font-size: 3rem;
    }

    .row-reverse {
        flex-direction: row-reverse;
    }

    .history-nav {
        cursor: pointer;
        min-height: 400px;
        margin-bottom: 0;
    }

    .history-nav:hover:after {
        background-color: rgb(0 0 0 / 40%);
    }

    .history-nav.overlay.active:after {
        background-color: rgb(65 86 128 / 40%);
    }

    .history-nav.active:before {
        content: '';
        position: absolute;
        bottom: -29px;
        font-size: 4rem;
        z-index: 2;
        width: 0;
        height: 0;
        border-left: 50px solid transparent;
        border-right: 50px solid transparent;
        border-top: 50px solid #8fa8d8;
    }

    .timeline.active {
        display: block;
    }

    .timeline.mobile-history {
        display: none;
    }

    p.bookmark-header {
        text-align: center;
    }

    div.comments ul {
        padding-left: 40px;
    }

    .event-about {
        padding: 50px;
    }

    .listing-card {
        padding: 30px;
    }

    .about-listing {
        padding: 50px;
    }

    /*
    .nearby-slider.slick-initialized .slick-track {
        display: flex;
    }

    .nearby-slider.slick-initialized .slick-track .slick-slide {
        display: flex;
        height: auto;
        align-items: center;
        justify-content: center;
        flex-direction: column
    } */
    .i-pin:before {
        left: calc(100% + 50px);
        height: 200px;
        transform: translate(0, calc(-50% - 50px));
    }

    .i-pin.history:before {
        transform: translate(0, calc(-50% - 30px));
    }

    .i-pin.notable-locals:before {
        transform: translate(0, calc(-50% - 19px));
        width: 866px;
        right: calc(100% + 50px);
    }

    .i-pin.calendar:before {
        height: 240px;
        transform: translate(0, calc(-50% - 75px));
        top: 46%;
    }

    .alternating-columns:nth-of-type(odd) .columns {
        flex-direction: row-reverse;
    }

    .alternating-columns {
        margin: 50px 0;
    }

    .header-search-form-wrap {
        align-items: center;
    }

    .heading-wrap :first-child:after {
        height: 25px;
    }

    .sub-page-block {
        padding: 50px;
    }

    ul.visit-slider-nav {
        flex-wrap: nowrap;
    }

    ul.visit-slider-nav li {
        width: 100%;
        margin: 0;
    }

    .event-card {
        padding: 40px;
    }

    p.event-slider-excerpt {
        display: block;
    }

    .listing-meta:not(.restroom) {
        width: 400px;
    }

    .sub-page-block {
        justify-content: center;
    }

    .residents-form {
        max-width: 350px;
    }

    .blog-sidebar {
        width: 250px;
        margin-left: 30px;
        border-top: none;
        padding-top: 0;
    }
}

@media only screen and (min-width: 900px) {
    .event-slider {
        max-width: 90%;
        margin-left: auto;
    }
}

@media only screen and (min-width: 1000px) {
    .sub-nav-bar {
        display: block;
    }

    #home-path,
    #home-pin {
        opacity: 1;
    }
}

@media only screen and (min-width: 1024px) {
    .bookmark-drawer {
        max-width: 50%;
    }

    ul.visit-slider-nav li {
        font-size: 1.8rem;
    }
}

@media only screen and (min-width: 1286px) {
    .header .columns {
        justify-content: none;
        margin-right: initial;
    }

    .header-meta i {
        font-size: 2.5rem;
    }

    .header-meta p {
        font-size: 3rem;
        margin: 0 10px 0 0;
    }

    .salemweather p {
        margin: 0 5px;
    }

    .footer-offset {
        margin-left: 5%;
    }
}

@media only screen and (min-width: 1400px) {
    .container.medium {
        max-width: 1560px;
    }
}

@media only screen and (min-width: 1450px) {
    .logo-img {
        height: 100px;
    }

    nav.nav {
        margin: 0 5%;
    }
}

@media only screen and (min-width: 1740px) {
    .visit-slider .slick-arrow.prev,
    .nearby-slider .slick-arrow.prev {
        left: -30px;
    }

    .visit-slider .slick-arrow.next,
    .nearby-slider .slick-arrow.next {
        right: -30px;
    }
}

/*------------------------------------*\
    RESPONSIVE VIDEO BACKGROUND FOR HOMEPAGE
\*------------------------------------*/

@media (min-aspect-ratio: 16/9) {
    #videoBG {
        width: 100%;
        height: auto;
    }
}

/* @media (max-aspect-ratio: 16/9) {
    #videoBG {
        width: auto;
        height: 100%;
    }
} */

@media (max-width: 767px) {
    #videoBG {
        display: none;
    }

    .home-top {
        background-image: var(--background);
        background-size: cover;
        height: 600px;
    }

    .accordion-button-wrap {
        flex-wrap: wrap;
    }
    .quiz-result img {
        max-width: 100%;
    }
    .home .visit-slider {
        margin-left: -20px;
        margin-right: -20px;
    }
    .home .visit-slider .slick-arrow {
        height: 40px;
        width: 40px;
        top: 66%;
        font-size: 2.4rem;
        transform: none;
    }
}

/*------------------------------------*\
    MISC
\*------------------------------------*/

::selection {
    background: #04a4cc;
    color: #fff;
    text-shadow: none;
}

::-webkit-selection {
    background: #04a4cc;
    color: #fff;
    text-shadow: none;
}

::-moz-selection {
    background: #04a4cc;
    color: #fff;
    text-shadow: none;
}

/*------------------------------------*\
    WORDPRESS CORE
\*------------------------------------*/

.alignnone {
    margin: 5px 20px 20px 0;
}

.aligncenter,
div.aligncenter {
    display: block;
    margin: 5px auto 5px auto;
}

.alignright {
    float: right;
    margin: 5px 0 20px 20px;
}

.alignleft {
    float: left;
    margin: 5px 20px 20px 0;
}

a img.alignright {
    float: right;
    margin: 5px 0 20px 20px;
}

a img.alignnone {
    margin: 5px 20px 20px 0;
}

a img.alignleft {
    float: left;
    margin: 5px 20px 20px 0;
}

a img.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.wp-caption {
    background: #fff;
    border: 1px solid #f0f0f0;
    max-width: 96%;
    padding: 5px 3px 10px;
    text-align: center;
}

.wp-caption.alignnone {
    margin: 5px 20px 20px 0;
}

.wp-caption.alignleft {
    margin: 5px 20px 20px 0;
}

.wp-caption.alignright {
    margin: 5px 0 20px 20px;
}

.wp-caption img {
    border: 0 none;
    height: auto;
    margin: 0;
    max-width: 98.5%;
    padding: 0;
    width: auto;
}

.wp-caption .wp-caption-text,
.gallery-caption {
    font-size: 14px;
    line-height: 1.5;
    margin: 0;
    padding: 5px;
}

.bypostauthor {
}

/*------------------------------------*\
    PRINT
\*------------------------------------*/

@media print {
    * {
        background: transparent !important;
        box-shadow: none !important;
        color: #000 !important;
        text-shadow: none !important;
    }

    a,
    a:visited {
        text-decoration: underline;
    }

    a[href]:after {
        content: ' (' attr(href) ')';
    }

    abbr[title]:after {
        content: ' (' attr(title) ')';
    }

    .ir a:after,
    a[href^='javascript:']:after,
    a[href^='#']:after {
        content: '';
    }

    pre,
    blockquote {
        page-break-inside: avoid;
    }

    thead {
        display: table-header-group;
    }

    tr,
    img {
        page-break-inside: avoid;
    }

    img {
        max-width: 100% !important;
    }

    @page {
        margin: 0.5cm;
    }

    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }

    .nav,
    .sidebar,
    .home-slider,
    #respond {
        display: none;
    }

    @page {
        margin: 2cm;
    }
}

.swt-extra-columns__heading {
    text-align: center;
    margin-bottom: 40px !important;
}

.swt-extra-columns__card {
    text-align: center;
    padding: 0 30px;
}

.swt-extra-columns__card-title {
    font-size: 24px;
    margin-bottom: 20px !important;
}

.swt-extra-columns__card-link {
    display: inline-block;
    padding: 10px 20px;
    font-size: 14px !important;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    cursor: pointer;
    user-select: none;
    background-color: #fff; /* Background color */
    border: 1px solid transparent;
    border-radius: 4px;
    text-decoration: none;
}

.swt-extra-columns__card-link:hover,
.swt-extra-columns__card-link:focus {
    color: #fff;
    background-color: #2a6b8a;
    border-color: #2a6b8a;
    text-decoration: none;
}

.swt-extra-columns__cta-container {
    text-align: center;
}

.swt-extra-columns__cta-container a {
    display: inline-block;
    padding: 10px 30px;
    font-size: 22px !important;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    cursor: pointer;
    user-select: none;
    background-color: #2a6b8a; /* Background color */
    border: 1px solid transparent;
    border-radius: 4px;
    text-decoration: none;
    color: #fff !important;
}

.swt-extra-columns__cta-container a:hover,
.swt-extra-columns__cta-container a:focus {
    color: #2a6b8a !important;
    background-color: #fff;
    border-color: #2a6b8a;
    text-decoration: none;
}