.c-image-switcher .esri-text__title,
.c-image-switcher .esri-text__description {
  max-width: 600px; }

@media (min-width: 1096px) {
  .c-image-switcher {
    align-items: stretch;
    display: flex;
    position: relative; }
    .c-image-switcher.c-image-switcher-height-660 {
      min-height: 660px; }
    .c-image-switcher.c-image-switcher-height-900 {
      min-height: 900px; } }

.c-image-switcher-content {
  position: relative;
  transition: padding 60ms;
  flex: 0 0 50%;
  background: var(--calcite-ui-background); }

@media (min-width: 1096px) {
  .c-image-switcher .c-image-switcher-content {
    order: 2; }
  .c-image-switcher--flip .c-image-switcher-content {
    order: inherit; }
  .c-image-switcher-content {
    padding: var(--space-20);
    display: flex;
    flex-direction: column;
    justify-content: center; }
  .c-image-switcher-content-container {
    width: 100%;
    max-width: 600px;
    margin: 0 auto; }
    .c-image-switcher-content-container .esri-text__iconContainer img,
    .c-image-switcher-content-container .esri-text__iconContainer svg,
    .c-image-switcher-content-container .esri-text__iconContainer .icon-ui-svg,
    .c-image-switcher-content-container .esri-text__iconContainer .icons-ui-svg {
      inline-size: 64px;
      block-size: 64px; } }

@media (max-width: 1095px) {
  .c-image-switcher-content {
    display: flex;
    flex-direction: column;
    padding: var(--space-5); } }

.c-image-switcher-links {
  display: flex;
  flex-wrap: wrap; }

@media (min-width: 1456px) {
  .c-image-switcher-links {
    max-height: 400px;
    max-width: 600px; } }

@media (max-width: 1095px) {
  .c-image-switcher-links {
    align-items: flex-start;
    justify-content: center; } }

.c-image-switcher-link {
  color: var(--calcite-ui-text-2);
  background-color: var(--calcite-ui-foreground-1);
  text-decoration: none;
  transition: background-color 180ms, box-shadow 180ms;
  padding: var(--space-2); }
  .c-image-switcher-link svg {
    width: 48px;
    height: 48px;
    margin-inline-end: var(--space-8); }
    @media (max-width: 1095px) {
      .c-image-switcher-link svg {
        margin-inline-end: 0; } }
  .c-image-switcher-link-image {
    border-radius: 50%; }

.c-image-switcher-link:nth-child(1) {
  box-shadow: inset 1px 0 var(--calcite-ui-border-1), inset -1px 0 var(--calcite-ui-border-1), inset 0 1px var(--calcite-ui-border-1), inset 0 -1px var(--calcite-ui-border-1); }

.c-image-switcher-link:nth-child(2) {
  box-shadow: inset 1px 0 transparent, inset -1px 0 var(--calcite-ui-border-1), inset 0 1px var(--calcite-ui-border-1), inset 0 -1px var(--calcite-ui-border-1); }

.c-image-switcher-link:nth-child(3) {
  box-shadow: inset 1px 0 transparent, inset -1px 0 var(--calcite-ui-border-1), inset 0 1px var(--calcite-ui-border-1), inset 0 -1px var(--calcite-ui-border-1); }

.c-image-switcher-link:nth-child(4) {
  box-shadow: inset 1px 0 transparent, inset -1px 0 var(--calcite-ui-border-1), inset 0 1px var(--calcite-ui-border-1), inset 0 -1px var(--calcite-ui-border-1); }

.c-image-switcher-link:nth-child(5) {
  box-shadow: inset 1px 0 transparent, inset -1px 0 var(--calcite-ui-border-1), inset 0 1px var(--calcite-ui-border-1), inset 0 -1px var(--calcite-ui-border-1); }

.c-image-switcher-link:nth-child(6) {
  box-shadow: inset 1px 0 transparent, inset -1px 0 var(--calcite-ui-border-1), inset 0 1px var(--calcite-ui-border-1), inset 0 -1px var(--calcite-ui-border-1); }

.c-image-switcher-link:nth-child(7) {
  box-shadow: inset 1px 0 transparent, inset -1px 0 var(--calcite-ui-border-1), inset 0 1px var(--calcite-ui-border-1), inset 0 -1px var(--calcite-ui-border-1); }

.c-image-switcher-link:nth-child(8) {
  box-shadow: inset 1px 0 var(--calcite-ui-border-1), inset -1px 0 var(--calcite-ui-border-1), inset 0 1px transparent, inset 0 -1px var(--calcite-ui-border-1); }

@media (max-width: 420px) {
  .c-image-switcher-link:nth-child(6) {
    box-shadow: inset 1px 0 var(--calcite-ui-border-1), inset -1px 0 var(--calcite-ui-border-1), inset 0 1px transparent, inset 0 -1px var(--calcite-ui-border-1); } }

@media (max-width: 360px) {
  .c-image-switcher-link:nth-child(5) {
    box-shadow: inset 1px 0 var(--calcite-ui-border-1), inset -1px 0 var(--calcite-ui-border-1), inset 0 1px var(--calcite-ui-border-1), inset 0 -1px var(--calcite-ui-border-1); }
  html[dir="rtl"] .c-image-switcher-link:nth-last-child(1) {
    box-shadow: inset 1px 0 var(--calcite-ui-border-1), inset -1px 0 var(--calcite-ui-border-1), inset 0 1px var(--calcite-ui-border-1), inset 0 -1px var(--calcite-ui-border-1); } }

.c-image-switcher-link:hover {
  text-decoration: none; }

@media (min-width: 552px) {
  .c-image-switcher-link:nth-child(8) {
    box-shadow: inset 1px 0 transparent, inset -1px 0 var(--calcite-ui-border-1), inset 0 1px var(--calcite-ui-border-1), inset 0 -1px var(--calcite-ui-border-1); } }

@media (min-width: 1096px) {
  .c-image-switcher-link {
    width: 100%;
    padding: var(--space-3) var(--space-3) var(--space-3) var(--space-6);
    display: flex;
    align-items: center;
    min-height: 80px; }
  .c-image-switcher-links--2 .c-image-switcher-link:nth-child(1),
  .c-image-switcher-links--2 .c-image-switcher-link:nth-child(2),
  .c-image-switcher-links--2 .c-image-switcher-link:nth-child(3),
  .c-image-switcher-links--2 .c-image-switcher-link:nth-child(4),
  .c-image-switcher-links--2 .c-image-switcher-link:nth-child(5),
  .c-image-switcher-links--2 .c-image-switcher-link:nth-child(6),
  .c-image-switcher-links--2 .c-image-switcher-link:nth-child(7),
  .c-image-switcher-links--2 .c-image-switcher-link:nth-child(8),
  .c-image-switcher-links--3 .c-image-switcher-link:nth-child(1),
  .c-image-switcher-links--3 .c-image-switcher-link:nth-child(2),
  .c-image-switcher-links--3 .c-image-switcher-link:nth-child(3),
  .c-image-switcher-links--3 .c-image-switcher-link:nth-child(4),
  .c-image-switcher-links--3 .c-image-switcher-link:nth-child(5),
  .c-image-switcher-links--3 .c-image-switcher-link:nth-child(6),
  .c-image-switcher-links--3 .c-image-switcher-link:nth-child(7),
  .c-image-switcher-links--3 .c-image-switcher-link:nth-child(8),
  .c-image-switcher-links--4 .c-image-switcher-link:nth-child(1),
  .c-image-switcher-links--4 .c-image-switcher-link:nth-child(2),
  .c-image-switcher-links--4 .c-image-switcher-link:nth-child(3),
  .c-image-switcher-links--4 .c-image-switcher-link:nth-child(4),
  .c-image-switcher-links--4 .c-image-switcher-link:nth-child(5),
  .c-image-switcher-links--4 .c-image-switcher-link:nth-child(6),
  .c-image-switcher-links--4 .c-image-switcher-link:nth-child(7),
  .c-image-switcher-links--4 .c-image-switcher-link:nth-child(8),
  .c-image-switcher-links--5 .c-image-switcher-link:nth-child(1),
  .c-image-switcher-links--5 .c-image-switcher-link:nth-child(2),
  .c-image-switcher-links--5 .c-image-switcher-link:nth-child(3),
  .c-image-switcher-links--5 .c-image-switcher-link:nth-child(4),
  .c-image-switcher-links--5 .c-image-switcher-link:nth-child(5),
  .c-image-switcher-links--5 .c-image-switcher-link:nth-child(6),
  .c-image-switcher-links--5 .c-image-switcher-link:nth-child(7),
  .c-image-switcher-links--5 .c-image-switcher-link:nth-child(8),
  .c-image-switcher-links--6 .c-image-switcher-link:nth-child(1),
  .c-image-switcher-links--6 .c-image-switcher-link:nth-child(2),
  .c-image-switcher-links--6 .c-image-switcher-link:nth-child(3),
  .c-image-switcher-links--6 .c-image-switcher-link:nth-child(4),
  .c-image-switcher-links--6 .c-image-switcher-link:nth-child(5),
  .c-image-switcher-links--6 .c-image-switcher-link:nth-child(6),
  .c-image-switcher-links--6 .c-image-switcher-link:nth-child(7),
  .c-image-switcher-links--6 .c-image-switcher-link:nth-child(8),
  .c-image-switcher-links--7 .c-image-switcher-link:nth-child(1),
  .c-image-switcher-links--7 .c-image-switcher-link:nth-child(2),
  .c-image-switcher-links--7 .c-image-switcher-link:nth-child(3),
  .c-image-switcher-links--7 .c-image-switcher-link:nth-child(4),
  .c-image-switcher-links--7 .c-image-switcher-link:nth-child(5),
  .c-image-switcher-links--7 .c-image-switcher-link:nth-child(6),
  .c-image-switcher-links--7 .c-image-switcher-link:nth-child(7),
  .c-image-switcher-links--7 .c-image-switcher-link:nth-child(8),
  .c-image-switcher-links--8 .c-image-switcher-link:nth-child(1),
  .c-image-switcher-links--8 .c-image-switcher-link:nth-child(2),
  .c-image-switcher-links--8 .c-image-switcher-link:nth-child(3),
  .c-image-switcher-links--8 .c-image-switcher-link:nth-child(4),
  .c-image-switcher-links--8 .c-image-switcher-link:nth-child(5),
  .c-image-switcher-links--8 .c-image-switcher-link:nth-child(6),
  .c-image-switcher-links--8 .c-image-switcher-link:nth-child(7),
  .c-image-switcher-links--8 .c-image-switcher-link:nth-child(8) {
    box-shadow: inset 1px 0 var(--calcite-ui-border-1), inset -1px 0 var(--calcite-ui-border-1), inset 0 1px var(--calcite-ui-border-1), inset 0 -1px transparent; }
  .c-image-switcher-links--2 .c-image-switcher-link:nth-last-child(1),
  .c-image-switcher-links--3 .c-image-switcher-link:nth-last-child(1),
  .c-image-switcher-links--4 .c-image-switcher-link:nth-last-child(1),
  .c-image-switcher-links--5 .c-image-switcher-link:nth-last-child(1),
  .c-image-switcher-links--6 .c-image-switcher-link:nth-last-child(1),
  .c-image-switcher-links--7 .c-image-switcher-link:nth-last-child(1),
  .c-image-switcher-links--8 .c-image-switcher-link:nth-last-child(1) {
    box-shadow: inset 1px 0 var(--calcite-ui-border-1), inset -1px 0 var(--calcite-ui-border-1), inset 0 1px var(--calcite-ui-border-1), inset 0 -1px var(--calcite-ui-border-1); } }

@media (min-width: 1456px) {
  .c-image-switcher-link {
    width: 50%; }
  .c-image-switcher-links--2 .c-image-switcher-link,
  .c-image-switcher-links--3 .c-image-switcher-link,
  .c-image-switcher-links--4 .c-image-switcher-link {
    width: 100%; }
  .c-image-switcher-links--5 .c-image-switcher-link:nth-child(even),
  .c-image-switcher-links--6 .c-image-switcher-link:nth-child(even),
  .c-image-switcher-links--7 .c-image-switcher-link:nth-child(even),
  .c-image-switcher-links--8 .c-image-switcher-link:nth-child(even) {
    box-shadow: inset 0 0 var(--calcite-ui-border-1), inset -1px 0 var(--calcite-ui-border-1), inset 0 1px var(--calcite-ui-border-1), inset 0 -1px transparent; }
    html[dir="rtl"] .c-image-switcher-links--5 .c-image-switcher-link:nth-child(even), html[dir="rtl"]
    .c-image-switcher-links--6 .c-image-switcher-link:nth-child(even), html[dir="rtl"]
    .c-image-switcher-links--7 .c-image-switcher-link:nth-child(even), html[dir="rtl"]
    .c-image-switcher-links--8 .c-image-switcher-link:nth-child(even) {
      box-shadow: inset 1px 0 var(--calcite-ui-border-1), inset -1px 0 transparent, inset 0 1px var(--calcite-ui-border-1), inset 0 -1px transparent; }
  html[dir="rtl"] .c-image-switcher-links--7 .c-image-switcher-link:nth-last-child(2), html[dir="rtl"]
  .c-image-switcher-links--5 .c-image-switcher-link:nth-last-child(2) {
    box-shadow: inset 1px 0 var(--calcite-ui-border-1), inset -1px 0 transparent, inset 0 1px var(--calcite-ui-border-1), inset 1px -1px var(--calcite-ui-border-1); }
  .c-image-switcher-links--6 .c-image-switcher-link:nth-last-child(1),
  .c-image-switcher-links--8 .c-image-switcher-link:nth-last-child(1) {
    box-shadow: inset 0px 0 var(--calcite-ui-border-1), inset -1px 0 var(--calcite-ui-border-1), inset 0 1px var(--calcite-ui-border-1), inset 0 -1px var(--calcite-ui-border-1); }
    html[dir="rtl"] .c-image-switcher-links--6 .c-image-switcher-link:nth-last-child(1), html[dir="rtl"]
    .c-image-switcher-links--8 .c-image-switcher-link:nth-last-child(1) {
      box-shadow: inset 1px 0 var(--calcite-ui-border-1), inset -1px 0 transparent, inset 0 1px var(--calcite-ui-border-1), inset 0 -1px var(--calcite-ui-border-1); }
  .c-image-switcher-links--6 .c-image-switcher-link:nth-last-child(2),
  .c-image-switcher-links--8 .c-image-switcher-link:nth-last-child(2) {
    box-shadow: inset 1px 0 var(--calcite-ui-border-1), inset -1px 0 var(--calcite-ui-border-1), inset 0 1px var(--calcite-ui-border-1), inset 0 -1px var(--calcite-ui-border-1); }
    html[dir="rtl"] .c-image-switcher-links--6 .c-image-switcher-link:nth-last-child(2), html[dir="rtl"]
    .c-image-switcher-links--8 .c-image-switcher-link:nth-last-child(2) {
      box-shadow: inset 1px 0 var(--calcite-ui-border-1), inset -1px 0 var(--calcite-ui-border-1), inset 0 1px var(--calcite-ui-border-1), inset 0 -1px var(--calcite-ui-border-1); }
  .c-image-switcher-links--5 .c-image-switcher-link:nth-last-child(2),
  .c-image-switcher-links--7 .c-image-switcher-link:nth-last-child(2) {
    box-shadow: inset 0 0 var(--calcite-ui-border-1), inset -1px 0 var(--calcite-ui-border-1), inset 0 1px var(--calcite-ui-border-1), inset 0 -1px var(--calcite-ui-border-1); } }

.c-image-switcher-links .c-image-switcher-link:hover, .c-image-switcher-links .c-image-switcher-link:focus {
  color: var(--calcite-ui-text-1);
  outline: none;
  z-index: 1; }

.c-image-switcher-links .c-image-switcher-link svg,
.c-image-switcher-links .c-image-switcher-link .icon-ui-svg--base,
.c-image-switcher-links .c-image-switcher-link .icons-ui-svg--base {
  fill: var(--esri-ui-opacity97); }

@media (min-width: 1096px) {
  .c-image-switcher-links .c-image-switcher-link:hover, .c-image-switcher-links .c-image-switcher-link:focus {
    box-shadow: inset 3px 0 var(--calcite-ui-brand), inset -1px 0 var(--calcite-ui-brand), inset 0 1px var(--calcite-ui-brand), inset 0 -1px var(--calcite-ui-brand); } }

@media (max-width: 1095px) {
  .c-image-switcher-links .c-image-switcher-link:hover, .c-image-switcher-links .c-image-switcher-link:focus {
    box-shadow: 0 0 0 0.5px var(--calcite-ui-brand), inset 0 0 0 0.5px var(--calcite-ui-brand), inset 0 3px 0 0 var(--calcite-ui-brand); } }

.c-image-switcher-link-image,
.c-image-switcher-link-title {
  display: inline-block;
  vertical-align: middle;
  object-fit: cover; }

@media (min-width: 1096px) {
  .c-image-switcher-link-image {
    margin-inline-end: var(--space-5);
    width: 60px;
    height: 60px;
    flex: 0 0 60px; } }

@media (max-width: 1095px) {
  .c-image-switcher-link-image {
    width: 48px;
    height: 48px; } }

@media (min-width: 1096px) {
  .c-image-switcher-link-title {
    flex: 1;
    word-break: normal; } }

@media (max-width: 1095px) {
  .c-image-switcher-link-title {
    display: none; } }

@media (min-width: 1096px) {
  .c-image-switcher-images {
    flex: 0 0 50%;
    position: relative; } }

@media (max-width: 1095px) {
  .c-image-switcher-images {
    width: 100%;
    position: relative;
    height: 75vh; } }

.c-image-switcher-image {
  align-items: flex-end;
  display: flex;
  justify-content: center;
  transition: all, .3s; }

@media (min-width: 1096px) {
  .c-image-switcher-image {
    top: 0;
    bottom: 0;
    left: 0;
    position: absolute;
    width: 100%; } }

.c-image-switcher-image[aria-hidden="true"] {
  visibility: hidden;
  opacity: 0.0;
  transition: opacity linear 0s;
  display: none; }

.c-image-switcher-image-image {
  object-fit: cover;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  position: absolute;
  width: 100%;
  height: 100%; }

.c-image-switcher-image-content {
  color: var(--calcite-ui-text-inverse);
  background-color: var(--esri-ui-opacity97-inverse);
  position: relative; }
  .c-image-switcher-image-content .c-image-switcher-image-title {
    color: var(--calcite-ui-text-1); }
  .c-image-switcher-image-content .c-image-switcher-image-bodycopy {
    color: var(--calcite-ui-text-2); }

@media (min-width: 1096px) {
  .c-image-switcher-image-content {
    margin: var(--space-4) var(--space-4) var(--space-24);
    max-width: 82%;
    padding: var(--space-8); } }

@media (max-width: 1095px) {
  .c-image-switcher-image-content {
    margin: var(--space-10);
    padding: var(--space-8);
    overflow: auto; } }

@media (min-width: 736px) {
  .c-image-switcher-image-title {
    font-size: 24px;
    line-height: 30px;
    font-weight: 300; } }

@media (max-width: 735px) {
  .c-image-switcher-image-title {
    font-size: 16px;
    line-height: 20px;
    font-weight: 300; } }

.c-image-switcher-image-bodycopy {
  transition: font-size 60ms, line-height 60ms; }
  .c-image-switcher-image-bodycopy a {
    color: var(--calcite-ui-brand);
    text-decoration: none; }
    .c-image-switcher-image-bodycopy a.btn-animated-border-bottom-blue:hover, .c-image-switcher-image-bodycopy a.btn-animated-border-bottom-blue:focus {
      color: var(--calcite-ui-brand); }
    .c-image-switcher-image-bodycopy a.btn-animated-border-bottom-blue::after {
      border-bottom: 1px solid var(--calcite-ui-brand); }

@media (min-width: 736px) {
  .c-image-switcher-image-bodycopy {
    font-size: 16px;
    line-height: 25px; } }

@media (max-width: 735px) {
  .c-image-switcher-image-bodycopy {
    font-size: 15px;
    line-height: 20px; } }

.c-image-switcher-image-bodycopy :last-child {
  margin-bottom: 0; }