.card {
  display: flex;
  flex-direction: column;
  border: 1px solid #bababa;
  border-radius: 6px;
  background: #ffffff;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.06);
  overflow: hidden;
}
.card__body {
  padding: 24px;
  flex-grow: 1;
}
.card__image {
  width: 100%;
}
.card__header,
.card__footer,
.card__section {
  padding: 24px;
  border: solid #bababa;
}
.card__header--secondary,
.card__footer--secondary,
.card__section--secondary {
  background: #fafafa;
}
.card__header--tertiary,
.card__footer--tertiary,
.card__section--tertiary {
  background: #dadada;
}
.card__header--borderless,
.card__footer--borderless,
.card__section--borderless {
  border: none;
}
.card__header {
  border-width: 0 0 1px;
  flex-grow: 0;
}
.card__header--borderless:not(.card__header--secondary):not(.card__header--tertiary) {
  padding-bottom: 0;
}
.card__footer {
  border-width: 1px 0 0;
  justify-self: flex-end;
  flex-grow: 0;
  Padding-top:2px;
  padding-bottom:2px;
}
.card__footer--borderless:not(.card__footer--secondary):not(.card__footer--tertiary) {
  padding-top: 0;
}
.card__footer {
  border-width: 1px 0 0;
  justify-self: flex-end;
  flex-grow: 0;

}
.card__section {
  border-width: 1px 0;
  margin-top: 24px;
  margin-bottom: 24px;
}
.card__section + .card__section {
  margin-top: -24px;
  border-top-width: 0;
}
.card__section:first-child {
  margin-top: 0;
}
.card__section:last-child {
  margin-bottom: 0;
}
.card__body > .card__section {
  margin-left: -24px;
  margin-right: -24px;
}
.card__body > .card__section:first-child {
  margin-top: -24px;
}
.card__body > .card__section:last-child {
  margin-bottom: -24px;
}
.card--primary,
.card--primary .card__header,
.card--primary .card__footer,
.card--primary .card__section {
  border-color: #915EA8;
}
.card--primary a:not(.button):not(.more),
.card--primary h1,
.card--primary h2,
.card--primary h3,
.card--primary h4,
.card--primary h5,
.card--primary h6,
.card--primary .h1,
.card--primary .h2,
.card--primary .h3,
.card--primary .h4,
.card--primary .h5,
.card--primary .h6 {
  color: #915EA8;
}
.card--primary .card__header--secondary,
.card--primary .card__footer--secondary,
.card--primary .card__section--secondary {
  color: #621088;
  background: #fcfafc;
}
.card--primary .card__header--tertiary,
.card--primary .card__footer--tertiary,
.card--primary .card__section--tertiary {
  color: #621088;
  background: #e9dfed;
}
.card--accent,
.card--accent .card__header,
.card--accent .card__footer,
.card--accent .card__section {
  border-color: #64CADC;
}
.card--accent a:not(.button):not(.more),
.card--accent h1,
.card--accent h2,
.card--accent h3,
.card--accent h4,
.card--accent h5,
.card--accent h6,
.card--accent .h1,
.card--accent .h2,
.card--accent .h3,
.card--accent .h4,
.card--accent .h5,
.card--accent .h6 {
  color:#64CADC;
}
.card--accent .card__header--secondary,
.card--accent .card__footer--secondary,
.card--accent .card__section--secondary {
  color: #0a97af;
  background: #fafdfe;
}
.card--accent .card__header--tertiary,
.card--accent .card__footer--tertiary,
.card--accent .card__section--tertiary {
  color: #0a97af;
  background: #e0f4f8;
}
.card--action,
.card--action .card__header,
.card--action .card__footer,
.card--action .card__section {
  border-color: #DC7664;
}
.card--action a:not(.button):not(.more),
.card--action h1,
.card--action h2,
.card--action h3,
.card--action h4,
.card--action h5,
.card--action h6,
.card--action .h1,
.card--action .h2,
.card--action .h3,
.card--action .h4,
.card--action .h5,
.card--action .h6 {
  color: #DC7664;
}
.card--action .card__header--secondary,
.card--action .card__footer--secondary,
.card--action .card__section--secondary {
  color: #af230a;
  background: #fefbfa;
}
.card--action .card__header--tertiary,
.card--action .card__footer--tertiary,
.card--action .card__section--tertiary {
  color: #af230a;
  background: #f8e4e0;
}
.card--fill-primary .card__header,
.card--fill-primary .card__footer,
.card--fill-primary .card__section,
.card--fill-accent .card__header,
.card--fill-accent .card__footer,
.card--fill-accent .card__section,
.card--fill-action .card__header,
.card--fill-action .card__footer,
.card--fill-action .card__section,
.card--inverse .card__header,
.card--inverse .card__footer,
.card--inverse .card__section {
  border-color: #ffffff;
}
.card--fill-primary,
.card--fill-accent,
.card--fill-action,
.card--inverse {
  border: none;
  color: #ffffff;
  box-shadow: none;
}
.card--fill-primary h1,
.card--fill-primary h2,
.card--fill-primary h3,
.card--fill-primary h4,
.card--fill-primary h5,
.card--fill-primary h6,
.card--fill-primary .h1,
.card--fill-primary .h2,
.card--fill-primary .h3,
.card--fill-primary .h4,
.card--fill-primary .h5,
.card--fill-primary .h6,
.card--fill-accent h1,
.card--fill-accent h2,
.card--fill-accent h3,
.card--fill-accent h4,
.card--fill-accent h5,
.card--fill-accent h6,
.card--fill-accent .h1,
.card--fill-accent .h2,
.card--fill-accent .h3,
.card--fill-accent .h4,
.card--fill-accent .h5,
.card--fill-accent .h6,
.card--fill-action h1,
.card--fill-action h2,
.card--fill-action h3,
.card--fill-action h4,
.card--fill-action h5,
.card--fill-action h6,
.card--fill-action .h1,
.card--fill-action .h2,
.card--fill-action .h3,
.card--fill-action .h4,
.card--fill-action .h5,
.card--fill-action .h6,
.card--inverse h1,
.card--inverse h2,
.card--inverse h3,
.card--inverse h4,
.card--inverse h5,
.card--inverse h6,
.card--inverse .h1,
.card--inverse .h2,
.card--inverse .h3,
.card--inverse .h4,
.card--inverse .h5,
.card--inverse .h6 {
  color: #ffffff;
}
.card--fill-primary a:not(.button):not(.more),
.card--fill-accent a:not(.button):not(.more),
.card--fill-action a:not(.button):not(.more),
.card--inverse a:not(.button):not(.more) {
  color: #ffffff;
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 3px;
}
.card--fill-primary {
  background: #915EA8;
}
.card--fill-primary .card__header--secondary,
.card--fill-primary .card__footer--secondary,
.card--fill-primary .card__section--secondary {
  background: #811db0;
}
.card--fill-primary .card__header--tertiary,
.card--fill-primary .card__footer--tertiary,
.card--fill-primary .card__section--tertiary {
  background: #621088;
}
.card--fill-accent {
  background: #64CADC;
}
.card--fill-accent .card__header--secondary,
.card--fill-accent .card__footer--secondary,
.card--fill-accent .card__section--secondary {
  background: #12c7e7;
}
.card--fill-accent .card__header--tertiary,
.card--fill-accent .card__footer--tertiary,
.card--fill-accent .card__section--tertiary {
  background: #0a97af;
}
.card--fill-action {
  background: #DC7664;
}
.card--fill-action .card__header--secondary,
.card--fill-action .card__footer--secondary,
.card--fill-action .card__section--secondary {
  background: #e73212;
}
.card--fill-action .card__header--tertiary,
.card--fill-action .card__footer--tertiary,
.card--fill-action .card__section--tertiary {
  background: #af230a;
}
.card--inverse {
  background: #1d0707;
}
.card--inverse .card__header--secondary,
.card--inverse .card__footer--secondary,
.card--inverse .card__section--secondary {
  background: #2c1d1d;
}
.card--inverse .card__header--tertiary,
.card--inverse .card__footer--tertiary,
.card--inverse .card__section--tertiary {
  background: #403636;
}

.card-grid {
  display: grid;
  grid-template-columns: Repeat(auto-fit, minmax(288px, 1fr));
  gap: 48px;
}
.card-grid:not(:last-child) {
  margin-bottom: 48px;
}
.card-grid--compact {
  gap: 24px;
}
.more {
  display: inline-block;
  font-weight: 300;
}
.more .fa-arrow-right {
  margin-left: 0.3em;
  transition: transform 0.15s ease-out;
}
.more:hover .fa-arrow-right,
.more:focus .fa-arrow-right {
  transform: translateX(0.2em);
  color:#27418C;
}
a {
  text-decoration: none;
  color: #27418C;
}
a:hover,
a:focus {
  color: #27418C;
  text-decoration:underline;
}
a,
button {
  transition: color 0.15s ease-out, background-color 0.15s ease-out, border 0.15s ease-out, box-shadow 0.15s ease-out, opacity 0.15s ease-out;
}
.more {
  display: inline-block;
  margin-bottom: 25px;
  font-family: Oswald, sans-serif;
  color: #F2522E;
  font-size: 18px;
  float: right;
  margin-top: 20px;
  padding-right: 30px;
  min-height: 25px;
  background: url(/images/default-source/page-layout-images/icon-more.png) right no-repeat;
}

.more.button-is-left {
float: left;  
}