.content-body__decoration--0 {
  top: 10%;
}
.content-body__decoration--1 {
  top: 30%;
}
.content-body__decoration--2 {
  top: 50%;
}
.content-body__decoration--3 {
  top: 70%;
}
.content-body__decoration--4 {
  top: 90%;
}
.build {
  padding-bottom: 3rem;
  padding-top: 3rem;
}
.build .gallery {
  margin-top: 0;
}
.videos {
  margin-top: -3rem;
}
.videos__item {
  margin-bottom: 0;
  margin-bottom: 4rem;
  text-align: center;
  width: 100%;
}
.videos__item .media-button__icon {
  height: 42px;
  width: 40px;
}
.videos__item[data-controller="VideoModal"]:focus .inset-box__keyline,
.videos__item[data-controller="VideoModal"]:hover .inset-box__keyline {
  padding: 0;
}
.videos__item[data-controller="VideoModal"]:focus .media-button__inner,
.videos__item[data-controller="VideoModal"]:hover .media-button__inner {
  transform: scale(1.15);
}
.videos__item[data-controller="VideoModal"]:focus .media-button__icon,
.videos__item[data-controller="VideoModal"]:hover .media-button__icon {
  animation: media-button__icon 2s ease infinite;
}
.videos__item[data-controller="VideoModal"]:focus .videos__image img,
.videos__item[data-controller="VideoModal"]:hover .videos__image img {
  transform: translateY(1rem);
}
.videos__image,
.videos__name {
  display: block;
  margin: 0 auto;
}
.videos__image {
  margin-bottom: 1rem;
  margin-top: -4rem;
  position: relative;
}
.videos__image img {
  transition: transform 0.4s ease;
}
.videos__name {
  margin-bottom: 2rem;
}
.choice {
  margin-bottom: 50px;
  position: relative;
}
.choice .inset-box {
  margin: 0 auto;
  width: 100%;
}
.choice .inset-box:focus .inset-box__keyline,
.choice .inset-box:hover .inset-box__keyline {
  padding: 0;
}
.choice .inset-box:focus .choice__cta span::after,
.choice .inset-box:hover .choice__cta span::after {
  transform: scaleX(1);
}
.is-blue .choice,
.is-red .choice,
.is-yellow .choice {
  margin-bottom: 40px;
}
.is-blue .choice .choice__content--generic,
.is-red .choice .choice__content--generic,
.is-yellow .choice .choice__content--generic {
  display: none;
}
.is-red .choice .choice__content--red {
  display: block;
}
.is-blue .choice .choice__content--blue {
  display: block;
}
.is-yellow .choice .choice__content--yellow {
  display: block;
}
.choice__content--generic {
  display: block;
}
.choice__bg {
  background: var(--color-main);
  left: 0;
  overflow: hidden;
  position: absolute;
  top: 20px;
}
@keyframes choiceBG {
  to {
    transform: translateX(-1105px);
  }
}
.choice__bg::after {
  animation: choiceBG 20s linear infinite;
  background: url(../img/characters/choice-generic.jpg) left
    top/auto 100% repeat-x;
  content: "";
  display: block;
  height: 250px;
  width: 11050px;
}
.is-red .choice__bg::after {
  background-image: url(../img/characters/choice-red.jpg);
}
.is-yellow .choice__bg::after {
  background-image: url(../img/characters/choice-yellow.jpg);
}
.is-blue .choice__bg::after {
  background-image: url(../img/characters/choice-blue.jpg);
}
.characters {
  background: url(../img/characters/characters-background.jpg)
    center center/cover no-repeat;
  padding-bottom: 2rem;
  padding-top: 2rem;
  position: relative;
}
.char-slider {
  margin: 3rem auto 0;
  max-width: 60rem;
  width: 100%;
}
.char-slider__group-items-inner {
  display: flex;
  padding-bottom: 5px;
  padding-top: 5px;
}
.char-slider__group-item {
  flex: 0 0 auto;
  text-align: center;
}
.char-slider__position {
  font-weight: 700;
  margin-left: auto;
  padding-left: 3rem;
  white-space: nowrap;
}
.char-slider__nav {
  color: var(--color-main);
  cursor: pointer;
  display: none;
}
.char-slider__nav.disabled {
  color: #d8d8d8;
}
.char-slider__nav:focus.disabled,
.char-slider__nav:hover.disabled {
  cursor: default;
}
.char-slider__nav:focus:not(.disabled),
.char-slider__nav:hover:not(.disabled) {
  color: #000;
}
.char-slider__nav:focus:not(.disabled) .icon,
.char-slider__nav:hover:not(.disabled) .icon {
  transform: translateX(10px);
}
.char-slider__nav .icon {
  transition: transform 0.2s ease;
}
.char-slider__nav--prev .char-slider__nav-inner {
  transform: scaleX(-1);
}
.char-slider__thumbs {
  margin: 15px 0 20px;
  position: relative;
}
.char-slider__groups {
  position: relative;
}
.char-slider__group-items-outer {
  cursor: move;
  cursor: grab;
  overflow: hidden;
}
.char-slider__group-items-outer:active {
  cursor: grabbing;
}
.char-slider__group-item-inner {
  padding: 0 20px;
  white-space: pre;
}
.char-slider__group-item-inner[disabled] span::after {
  transform: scaleX(1);
}
.char-slider__small-items-outer {
  cursor: move;
  cursor: grab;
  overflow: hidden;
}
.char-slider__small-items-outer:active {
  cursor: grabbing;
}
.char-slider__small-items-inner {
  display: flex;
}
.char-slider__small-item {
  flex: 0 0 auto;
  line-height: 0;
  padding: 0 5px;
  transition: opacity 150ms;
  will-change: opacity;
}
.char-slider__small-item::after,
.char-slider__small-item::before {
  content: "";
  display: block;
  height: 4px;
  opacity: 0;
  transition: transform 0.4s ease, opacity 0.2s ease;
}
.char-slider__small-item::before {
  margin-bottom: 3px;
  transform: translateY(3px);
}
.char-slider__small-item::after {
  margin-top: 3px;
  transform: translateY(-3px);
}
.char-slider__small-item.current::after,
.char-slider__small-item.current::before {
  opacity: 1;
  transform: translateY(0);
}
.char-slider__small-item.current .char-slider__small-item-inner {
  height: 135px;
}
.char-slider__small-item:focus:not(.current) .char-slider__small-item-image,
.char-slider__small-item:hover:not(.current) .char-slider__small-item-image {
  transform: translate(-50%, -50%) scale(1.1);
}
.char-slider__small-item[data-color="sothis"]::after,
.char-slider__small-item[data-color="sothis"]::before {
  background-color: #3a1d5b;
}
.char-slider__small-item-inner[data-color="sothis"] {
  background-color: #3a1d5b;
}
.char-slider__character[data-color="sothis"] .char-slider__character-image {
  background-color: #3a1d5b;
}
.char-slider__small-item[data-color="generic"]::after,
.char-slider__small-item[data-color="generic"]::before {
  background-color: #3a1d5b;
}
.char-slider__small-item-inner[data-color="generic"] {
  background-color: #3a1d5b;
}
.char-slider__character[data-color="generic"] .char-slider__character-image {
  background-color: #3a1d5b;
}
.char-slider__small-item[data-color="red"]::after,
.char-slider__small-item[data-color="red"]::before {
  background-color: #b62638;
}
.char-slider__small-item-inner[data-color="red"] {
  background-color: #b62638;
}
.char-slider__character[data-color="red"] .char-slider__character-image {
  background-color: #b62638;
}
.char-slider__small-item[data-color="yellow"]::after,
.char-slider__small-item[data-color="yellow"]::before {
  background-color: #c8ac3d;
}
.char-slider__small-item-inner[data-color="yellow"] {
  background-color: #c8ac3d;
}
.char-slider__character[data-color="yellow"] .char-slider__character-image {
  background-color: #c8ac3d;
}
.char-slider__small-item[data-color="blue"]::after,
.char-slider__small-item[data-color="blue"]::before {
  background-color: #424d98;
}
.char-slider__small-item-inner[data-color="blue"] {
  background-color: #424d98;
}
.char-slider__character[data-color="blue"] .char-slider__character-image {
  background-color: #424d98;
}
.char-slider__small-item[data-color="church"]::after,
.char-slider__small-item[data-color="church"]::before {
  background-color: #696969;
}
.char-slider__small-item-inner[data-color="church"] {
  background-color: #696969;
}
.char-slider__character[data-color="church"] .char-slider__character-image {
  background-color: #696969;
}
.char-slider__small-item[data-color="officer"]::after,
.char-slider__small-item[data-color="officer"]::before {
  background-color: #345b42;
}
.char-slider__small-item-inner[data-color="officer"] {
  background-color: #345b42;
}
.char-slider__character[data-color="officer"] .char-slider__character-image {
  background-color: #345b42;
}
.char-slider__small-item-inner {
  height: 120px;
  overflow: hidden;
  position: relative;
}
.char-slider__small-item-inner img {
  display: block;
}
.char-slider__top {
  padding: 0 0.5rem;
  position: relative;
}
.char-slider__large-items-outer {
  overflow: hidden;
}
.char-slider__large-items-inner {
  position: relative;
}
.char-slider__large-item {
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}
.char-slider__large-item-image {
  display: block;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  width: 100%;
}
.char-slider__character {
  pointer-events: none;
}
.char-slider__character[aria-hidden="false"] {
  pointer-events: auto;
}
.char-slider__character[aria-hidden="false"]
  .char-slider__character-audios
  .button,
.char-slider__character[aria-hidden="false"] .char-slider__character-bannner,
.char-slider__character[aria-hidden="false"]
  .char-slider__character-description,
.char-slider__character[aria-hidden="false"] .char-slider__character-house,
.char-slider__character[aria-hidden="false"] .char-slider__character-image img,
.char-slider__character[aria-hidden="false"] .char-slider__character-name {
  opacity: 1;
  transform: translate(0, 0);
}
.char-slider__character[aria-hidden="false"] .char-slider__character-name {
  transition-delay: 0.1s;
}
.char-slider__character[aria-hidden="false"] .char-slider__character-house {
  transition-delay: 0.2s;
}
.char-slider__character[aria-hidden="false"]
  .char-slider__character-description {
  transition-delay: 0.3s;
}
.char-slider__character[aria-hidden="false"] .char-slider__character-image {
  opacity: 1;
}
.char-slider__character[aria-hidden="false"] .char-slider__character-image img {
  transition-delay: 0.1s;
}
.char-slider__character[aria-hidden="false"]
  .char-slider__character-audios
  .button:nth-child(1) {
  transition-delay: 0.1s;
}
.char-slider__character[aria-hidden="false"]
  .char-slider__character-audios
  .button:nth-child(2) {
  transition-delay: 0.2s;
}
.char-slider__character[aria-hidden="false"]
  .char-slider__character-audios
  .button:nth-child(3) {
  transition-delay: 0.3s;
}
.char-slider__character[aria-hidden="false"]
  .char-slider__character-audios
  .button:nth-child(4) {
  transition-delay: 0.4s;
}
.char-slider__character[aria-hidden="false"]
  .char-slider__character-audios
  .button:nth-child(5) {
  transition-delay: 0.5s;
}
.char-slider__character[aria-hidden="false"]
  .char-slider__character-audios
  .button:nth-child(6) {
  transition-delay: 0.6s;
}
.char-slider__character-name-group {
  align-items: center;
  display: flex;
  margin-bottom: 1rem;
}
.char-slider__character-bannner {
  margin-right: 10px;
  max-width: 50px;
  opacity: 0;
  transform: translateY(-20px);
  transition: transform 0.4s ease, opacity 0.3s ease;
}
.char-slider__character-house,
.char-slider__character-name {
  margin: 0;
  opacity: 0;
  transform: translateY(-20px);
  transition: transform 0.4s ease, opacity 0.3s ease;
}
.char-slider__character-house {
  margin-bottom: 0.2em;
}
.char-slider__character-image {
  border: solid 2px #000;
  opacity: 0;
  position: relative;
  transition: opacity 0.3s ease;
}
.char-slider__character-image::after,
.char-slider__character-image::before {
  background: url(../img/global/embellish-1.svg) center
    center/contain no-repeat;
  height: 49px;
  width: 49px;
  content: "";
  opacity: 0.9;
  position: absolute;
  top: 0;
}
.char-slider__character-image::before {
  left: 0;
}
.char-slider__character-image::after {
  right: 0;
  transform: scaleX(-1);
}
.char-slider__character-image img {
  display: block;
  margin: 0 auto;
  opacity: 0;
  position: relative;
  transform: translateX(20px);
  transition: transform 0.4s ease, opacity 0.3s ease;
}
.char-slider__character-body {
  padding: 1rem 0 0;
}
.char-slider__character-description {
  opacity: 0;
  transform: translateY(20px);
  transition: transform 0.4s ease, opacity 0.3s ease;
}
.char-slider__character-audios {
  display: flex;
  flex-wrap: wrap;
  margin-top: 1rem;
}
.char-slider__character-audios .button {
  height: 38px;
  opacity: 0;
  transform: translateY(20px);
  transition: transform 0.4s ease, opacity 0.3s ease;
}
.char-slider__character-audios .button:focus .icon,
.char-slider__character-audios .button:hover .icon {
  transform: none;
}
.build__subheader {
  margin-bottom: 1rem;
  margin-top: 2rem;
}
.recruit h4 a {
  text-decoration: underline;
}
.recruit h4 a:focus,
.recruit h4 a:hover {
  color: var(--color-main);
}
.class__title {
  margin-bottom: 1em;
  margin-top: 0.5rem;
}
.class__body {
  margin-bottom: 1rem;
}
.class__body h4 {
  margin-bottom: 0.4em;
}
.class__body p a {
  text-decoration: underline;
}
.class__body p a:focus,
.class__body p a:hover {
  color: var(--color-main);
}
.coloured-keyline .inset-box__keyline {
  color: var(--color-main);
}
.is-reduced-motion .choice__bg::after {
  animation: none;
}
@media only screen and (min-width: 40em) {
  .videos__item {
    margin-bottom: 0;
  }
  .char-slider__nav {
    display: block;
  }
  .char-slider__thumbs {
    align-items: center;
    display: flex;
    padding: 0 0.5rem;
  }
  .char-slider__groups {
    padding: 0 0.5rem;
  }
  .char-slider__small-items-outer {
    flex: 1;
  }
  .char-slider__character[data-color="sothis"] .char-slider__character-image {
    background: linear-gradient(90deg, rgba(0, 0, 0, 0) 50%, #3a1d5b 50%);
  }
  .char-slider__character[data-color="generic"] .char-slider__character-image {
    background: linear-gradient(90deg, rgba(0, 0, 0, 0) 50%, #3a1d5b 50%);
  }
  .char-slider__character[data-color="red"] .char-slider__character-image {
    background: linear-gradient(90deg, rgba(0, 0, 0, 0) 50%, #b62638 50%);
  }
  .char-slider__character[data-color="yellow"] .char-slider__character-image {
    background: linear-gradient(90deg, rgba(0, 0, 0, 0) 50%, #c8ac3d 50%);
  }
  .char-slider__character[data-color="blue"] .char-slider__character-image {
    background: linear-gradient(90deg, rgba(0, 0, 0, 0) 50%, #424d98 50%);
  }
  .char-slider__character[data-color="church"] .char-slider__character-image {
    background: linear-gradient(90deg, rgba(0, 0, 0, 0) 50%, #696969 50%);
  }
  .char-slider__character[data-color="officer"] .char-slider__character-image {
    background: linear-gradient(90deg, rgba(0, 0, 0, 0) 50%, #345b42 50%);
  }
  .char-slider__top {
    padding: 0 2rem;
  }
  .char-slider__large-items-outer {
    border: solid 2px #000;
  }
  .char-slider__character-image {
    align-items: flex-end;
    border-left: none;
    border-right: none;
    border-top: none;
    display: flex;
    flex: 1 1 60%;
    justify-content: center;
  }
  .char-slider__character-image::after,
  .char-slider__character-image::before {
    height: 68.6px;
    width: 68.6px;
  }
  .char-slider__character-image::before {
    bottom: 0;
    left: auto;
    right: 0;
    top: auto;
    transform: scale(-1);
  }
  .char-slider__character-body {
    flex: 1 1 40%;
    padding: 2rem 0 1.5rem 1.5rem;
  }
  .class__body {
    margin-bottom: 0;
  }
}
@media only screen and (min-width: 950px) {
  .char-slider__character {
    display: flex;
    flex-direction: row-reverse;
  }
  .char-slider__character-image {
    border-bottom: none;
  }
}
@media only screen and (min-width: 64em) {
  .char-slider__character-image {
    flex-basis: 50%;
    padding: 1.5rem 1.5rem 0;
  }
  .char-slider__character-image::after,
  .char-slider__character-image::before {
    height: 98px;
    width: 98px;
  }
  .char-slider__character-body {
    flex-basis: 50%;
  }
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  .choice__bg::after {
    background-image: url(../img/characters/choice-generic-2x.jpg);
  }
  .is-red .choice__bg::after {
    background-image: url(../img/characters/choice-red-2x.jpg);
  }
  .is-yellow .choice__bg::after {
    background-image: url(../img/characters/choice-yellow-2x.jpg);
  }
  .is-blue .choice__bg::after {
    background-image: url(../img/characters/choice-blue-2x.jpg);
  }
}
@media (prefers-reduced-motion: reduce) {
  .choice__bg::after {
    animation: none;
  }
}
