.ror-map {
    --ror-map-bg: #ffffff;
    --ror-active-color: #f36f21;
    width: 100%;
    max-width: 980px;
    margin: 0 auto;
    position: relative;
    font-family: inherit;
}

.ror-map *,
.ror-map *::before,
.ror-map *::after {
    box-sizing: border-box;
}

.ror-map__stage {
    position: relative;
    overflow: visible;
    background: var(--ror-map-bg);
}

.ror-map__viewport {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.ror-map__svg-wrap {
    --ror-map-scale: 1;
    --ror-map-pan-x: 0px;
    --ror-map-pan-y: 0px;
    width: 100%;
    transform: translate3d(var(--ror-map-pan-x), var(--ror-map-pan-y), 0) scale(var(--ror-map-scale));
    transform-origin: 50% 50%;
    transition: transform .24s cubic-bezier(.22,.61,.36,1);
    will-change: transform;
    user-select: none;
}

.ror-map__viewport--pannable {
    cursor: grab;
}

.ror-map__viewport--dragging {
    cursor: grabbing;
}

.ror-map__viewport--dragging .ror-map__svg-wrap {
    transition: none;
}

.ror-illinois-svg {
    display: block;
    width: 100%;
    height: auto;
    max-height: 82vh;
    margin: 0 auto;
}


.ror-map__zoom {
    position: absolute;
    z-index: 8;
    top: 14px;
    right: 14px;
    display: flex;
    flex-direction: column;
    width: 44px;
    overflow: hidden;
    border: 1px solid rgba(17, 34, 51, .14);
    border-radius: 8px;
    background: rgba(255, 255, 255, .96);
    box-shadow: 0 4px 16px rgba(17, 34, 51, .16);
}

.ror-map__zoom-button,
.ror-map__zoom-level {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    min-width: 44px;
    height: 42px;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: #1f2933;
    font-family: inherit;
    line-height: 1;
    cursor: pointer;
}

.ror-map__zoom-button {
    font-size: 27px;
    font-weight: 500;
}

.ror-map__zoom-level {
    height: 34px;
    border-top: 1px solid rgba(17, 34, 51, .10);
    border-bottom: 1px solid rgba(17, 34, 51, .10);
    font-size: 10px;
    font-weight: 700;
}

.ror-map__zoom-button:hover:not(:disabled),
.ror-map__zoom-button:focus-visible,
.ror-map__zoom-level:hover,
.ror-map__zoom-level:focus-visible {
    background: #f4f6f8;
}

.ror-map__zoom-button:focus-visible,
.ror-map__zoom-level:focus-visible {
    position: relative;
    z-index: 1;
    outline: 2px solid #111;
    outline-offset: -3px;
}

.ror-map__zoom-button:disabled {
    color: #a9b1b8;
    cursor: default;
}

.ror-map__shape {
    cursor: pointer;
    transform-box: fill-box;
    transform-origin: center;
    transition: filter .18s ease, opacity .18s ease, transform .18s ease;
    outline: none;
}

.ror-map__shape:hover,
.ror-map__shape:focus-visible {
    filter: brightness(.88) saturate(1.08);
}

.ror-map__shape:focus-visible {
    stroke: #111 !important;
    stroke-width: 3px !important;
    stroke-linejoin: round;
}

.ror-map__shape--active {
    filter: brightness(.82) saturate(1.12) drop-shadow(0 2px 3px rgba(0,0,0,.18));
}

.ror-map__panel {
    position: absolute;
    z-index: 10;
    top: 50%;
    right: 2%;
    width: min(72%, 730px);
    max-height: 88%;
    overflow: auto;
    background: #fff;
    box-shadow: 0 18px 55px rgba(17, 34, 51, .22);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translate3d(70px, -50%, 0);
    transition: transform .42s cubic-bezier(.22,.61,.36,1), opacity .28s ease, visibility 0s linear .42s;
}

.ror-map--open .ror-map__panel {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translate3d(0, -50%, 0);
    transition-delay: 0s;
}

.ror-map__close {
    position: absolute;
    z-index: 2;
    top: 8px;
    right: 10px;
    width: 36px;
    height: 36px;
    border: 0;
    border-radius: 50%;
    background: rgba(255,255,255,.94);
    color: #222;
    font-size: 30px;
    line-height: 32px;
    cursor: pointer;
    box-shadow: 0 2px 10px rgba(0,0,0,.12);
}

.ror-map__close:hover,
.ror-map__close:focus-visible {
    background: #fff;
    outline: 2px solid #111;
    outline-offset: 2px;
}

.ror-map__heading {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    min-height: 58px;
    padding: 14px 54px 14px 18px;
    background: var(--ror-active-color);
    color: #fff;
}

.ror-map__title {
    font-size: clamp(18px, 2vw, 25px);
    line-height: 1.15;
    font-weight: 800;
}

.ror-map__divider {
    width: 1px;
    height: 23px;
    background: rgba(255,255,255,.72);
}

.ror-map__subtitle {
    font-size: clamp(14px, 1.5vw, 18px);
    line-height: 1.2;
    font-weight: 500;
}

.ror-map__panel-body {
    display: grid;
    grid-template-columns: minmax(155px, .8fr) minmax(0, 1.65fr);
    gap: 0;
    padding: 18px 20px 22px;
}

.ror-map__left,
.ror-map__right {
    min-width: 0;
    color: #333;
    font-size: 14px;
    line-height: 1.55;
}

.ror-map__left {
    padding-right: 20px;
    font-weight: 650;
    border-right: 1px solid #e2e2e2;
}

.ror-map__right {
    padding-left: 22px;
}

.ror-map__left ul,
.ror-map__right ul {
    margin: 0;
    padding-left: 1.15em;
}

.ror-map__left li + li,
.ror-map__right li + li {
    margin-top: 8px;
}

.ror-map__left p:first-child,
.ror-map__right p:first-child {
    margin-top: 0;
}

.ror-map__left p:last-child,
.ror-map__right p:last-child {
    margin-bottom: 0;
}


@media (max-width: 900px) {
    .ror-map__panel {
        right: 2%;
        width: 64%;
    }

    .ror-map__panel-body {
        grid-template-columns: minmax(135px, .75fr) minmax(0, 1.45fr);
        padding: 16px;
    }

    .ror-map__left {
        padding-right: 15px;
    }

    .ror-map__right {
        padding-left: 16px;
    }
}

@media (max-width: 700px) {
    .ror-map__zoom {
        top: 8px;
        right: 8px;
    }

    .ror-map__stage {
        min-height: 0;
    }

    .ror-illinois-svg {
        max-height: none;
    }

    .ror-map__panel {
        top: auto;
        right: 0;
        bottom: 0;
        left: 0;
        width: 100%;
        max-height: 88%;
        transform: translate3d(0, 105%, 0);
    }

    .ror-map--open .ror-map__panel {
        transform: translate3d(0, 0, 0);
    }

    .ror-map__panel-body {
        display: block;
        padding: 18px 20px 24px;
    }

    .ror-map__left {
        padding: 0 0 18px;
        border-right: 0;
        border-bottom: 1px solid #e2e2e2;
    }

    .ror-map__right {
        padding: 18px 0 0;
    }

    .ror-map__left,
    .ror-map__right {
        font-size: 15px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ror-map__shape,
    .ror-map__svg-wrap,
    .ror-map__panel {
        transition: none !important;
    }
}

/* v1.0.5 county-name tooltip */
.ror-map__county-tooltip {
    position: absolute;
    z-index: 9;
    max-width: 190px;
    padding: 6px 9px;
    border-radius: 5px;
    background: rgba(23, 31, 42, .94);
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.25;
    white-space: nowrap;
    pointer-events: none;
    box-shadow: 0 3px 10px rgba(17, 34, 51, .18);
}

.ror-map__shape--list-hover {
    filter: brightness(.78) saturate(1.15) drop-shadow(0 2px 3px rgba(0,0,0,.18));
}

/* v1.0.5 companion region-list shortcode */
.ror-map-list {
    width: 100%;
    font-family: inherit;
}

.ror-map-list *,
.ror-map-list *::before,
.ror-map-list *::after {
    box-sizing: border-box;
}

.ror-map-list__items {
    list-style: none;
    margin: 0;
    padding: 0;
}

.ror-map-list__item {
    margin: 0;
    padding: 0;
}

.ror-map-list__item + .ror-map-list__item {
    border-top: 1px solid rgba(17, 34, 51, .10);
}

.ror-map-list__button {
    --ror-list-color: #f47a2a;
    display: flex;
    align-items: stretch;
    gap: 11px;
    width: 100%;
    min-height: 48px;
    margin: 0;
    padding: 10px 8px;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
    transition: background-color .16s ease, transform .16s ease;
}

.ror-map-list__button:hover,
.ror-map-list__button:focus-visible,
.ror-map-list__button--active {
    background: rgba(17, 34, 51, .055);
}

.ror-map-list__button:focus-visible {
    outline: 2px solid #111;
    outline-offset: 2px;
}

.ror-map-list__accent {
    flex: 0 0 4px;
    width: 4px;
    border-radius: 999px;
    background: var(--ror-list-color);
}

.ror-map-list__text {
    display: flex;
    flex: 1 1 auto;
    min-width: 0;
    flex-direction: column;
    justify-content: center;
    gap: 2px;
}

.ror-map-list__title {
    font-size: 16px;
    font-weight: 750;
    line-height: 1.25;
}

.ror-map-list__subtitle {
    color: #606a73;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.3;
}

@media (max-width: 700px) {
    .ror-map__county-tooltip {
        display: none !important;
    }
}

/* v1.0.6 optional popup columns */
.ror-map__panel--single-column .ror-map__panel-body {
    display: block;
}

.ror-map__panel--single-column .ror-map__left,
.ror-map__panel--single-column .ror-map__right {
    width: 100%;
    padding: 0;
    border: 0;
}

.ror-map__panel--no-columns .ror-map__panel-body {
    display: none;
}