:root {
  --visage-secondary-tile-font-size: var(--visage-text-size-5);
  --visage-secondary-tile-line-height: var(--visage-text-size-5-line-height);
  --visage-secondary-tile-name-font-size: var(--visage-text-size-5);
  --visage-secondary-tile-name-line-height: var(--visage-text-size-5-line-height)
}
@media only screen and (max-width: 1023px) {
  :root {
    --visage-secondary-tile-font-size: var(--visage-text-size-6);
    --visage-secondary-tile-line-height: var(--visage-text-size-6-line-height);
    --visage-secondary-tile-name-font-size: var(--visage-text-size-6);
    --visage-secondary-tile-name-line-height: var(--visage-text-size-6-line-height)
  }
}
.secondary-tile {
  display: block;
  padding-bottom: 12px;
  margin-bottom: 64px;
  font-size: var(--visage-secondary-tile-font-size);
  line-height: var(--visage-secondary-tile-line-height);
  color: var(--visage-secondary-tile-font-color, inherit);
  text-align: var(--visage-secondary-tile-text-align, center);
  background: var(--visage-color-background);
  border-width: var(--visage-secondary-tile-border-width, 0);
  border-style: solid;
  border-color: var(--visage-secondary-tile-border-color, var(--visage-color-border));
  border-radius: var(--visage-secondary-tile-border-radius, 0)
}
@media only screen and (max-width: 767px) {
  .secondary-tile {
    margin-bottom: 40px
  }
}
.secondary-tile.secondary-tile-shadow-hover:hover {
  box-shadow: var(--visage-depth-2-box-shadow)
}
a.secondary-tile {
  height: calc(100% - 64px);
  text-decoration: none
}
@media only screen and (max-width: 767px) {
  a.secondary-tile {
    height: calc(100% - 40px)
  }
}
.secondary-tile-image {
  line-height: 0;
  width: 100%;
  max-width: 100%;
  height: auto;
  margin: 0 auto;
  box-shadow: var(--visage-secondary-tile-image-box-shadow, none)
}
.secondary-tile-image img,
.secondary-tile-image picture {
  display: block;
  overflow: hidden
}
.secondary-tile-contents {
  padding: var(--visage-secondary-tile-contents-padding, 18px 12px 4px 12px)
}
.secondary-tile-badges,
.secondary-tile-description,
.secondary-tile-name,
.secondary-tile-price {
  margin-top: 0;
  margin-bottom: 4px
}
.secondary-tile-badges:last-child,
.secondary-tile-description:last-child,
.secondary-tile-name:last-child,
.secondary-tile-price:last-child {
  margin-bottom: 0
}
.secondary-tile-name {
  font-size: var(--visage-secondary-tile-name-font-size);
  line-height: var(--visage-secondary-tile-name-line-height);
  font-weight: var(--visage-secondary-tile-name-font-weight, bold);
  color: var(--visage-secondary-tile-name-font-color, inherit)
}
@keyframes ctaLink {
  0% {
    width: 0%
  }
  100% {
    width: 100%
  }
}
.secondary-tile-name.secondary-tile-name-cta {
  position: relative;
  display: inline-block
}
.secondary-tile-name.secondary-tile-name-cta::after {
  content: " ";
  position: absolute;
  bottom: 0;
  display: block;
  width: 100%;
  height: 2px;
  background-color: currentColor
}
.secondary-tile:hover .secondary-tile-name-cta:after,
a:hover .secondary-tile .secondary-tile-name-cta:after {
  animation-name: ctaLink;
  animation-duration: .25s;
  animation-timing-function: linear
}
.secondary-tile.secondary-tile-horizontal {
  display: flex;
  flex-direction: row;
  text-align: left;
  background: none
}
.secondary-tile.secondary-tile-horizontal .secondary-tile-image {
  margin: 0;
  flex-basis: 115px;
  min-width: 115px
}
.secondary-tile.secondary-tile-horizontal .secondary-tile-image img {
  width: 100%;
  max-width: 100%;
  height: auto
}
@media only screen and (max-width: 767px) {
  .secondary-tile.secondary-tile-horizontal .secondary-tile-image {
    flex-basis: 76px;
    min-width: 76px
  }
}
.secondary-tile.secondary-tile-horizontal .secondary-tile-contents {
  display: flex;
  flex-direction: column;
  flex: 9999;
  justify-content: flex-start;
  margin-left: 16px;
  padding: 0
}
.secondary-tile.secondary-tile-horizontal .secondary-tile-name {
  font-weight: bold
}
.secondary-tile.secondary-tile-horizontal .secondary-tile-name:only-child {
  display: flex;
  align-items: center;
  height: 100%
}
.secondary-tile.secondary-tile-horizontal .secondary-tile-name-with-price {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  width: 100%;
  margin-bottom: 4px
}
.secondary-tile.secondary-tile-horizontal .secondary-tile-name-with-price .secondary-tile-name {
  display: flex;
  flex-direction: column;
  margin-bottom: 0
}
.secondary-tile.secondary-tile-horizontal .secondary-tile-name-with-price .secondary-tile-price {
  margin-left: 8px;
  font-weight: inherit
}
.secondary-tile.secondary-tile-horizontal .secondary-tile-image {
  align-self: flex-start
}
.secondary-tile.secondary-tile-horizontal .secondary-tile-labeled-input {
  display: flex;
  align-items: center;
  width: 100%;
  margin-top: 12px
}
.secondary-tile.secondary-tile-horizontal .secondary-tile-labeled-input-label {
  padding-right: 4px;
  flex-basis: 20%
}
.secondary-tile-radio {
  position: absolute!important;
  -webkit-clip-path: inset(0 0 0 0);
  clip-path: inset(0 0 0 0);
  height: 1px!important;
  width: 1px!important;
  padding: 0!important;
  border: 0!important;
  opacity: 0.01!important;
  overflow: hidden!important
}
.secondary-tile-label {
  padding: 16px;
  margin-bottom: 16px;
  border: 1px solid var(--visage-color-border);
  cursor: pointer
}
.secondary-tile-label .secondary-tile-price {
  color: var(--visage-color-discount)
}
.secondary-tile-label .secondary-tile-price-included {
  color: inherit
}
.secondary-tile-label.secondary-tile-horizontal {
  background: #fff
}
.secondary-tile-label:not(.secondary-tile-horizontal) {
  display: flex;
  flex-direction: column;
  height: calc(100% - 64px);
  margin-bottom: 64px
}
@media only screen and (max-width: 767px) {
  .secondary-tile-label:not(.secondary-tile-horizontal) {
    height: calc(100% - 40px);
    margin-bottom: 40px
  }
}
.secondary-tile-radio:checked + .secondary-tile-label {
  border-color: var(--visage-color-selected)
}